
/* Editorial index: a dark frame, oversized type and continuous square covers. */
body:not(.home-view) #commercial{padding:26px 0 42px;margin:0 3.5%}
.portfolio-shell{display:grid;grid-template-columns:50px minmax(0,1fr);background:#111312;color:#e2e5df;border:1px solid #292e2a}
.portfolio-rail{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:22px 0;border-right:1px solid #50564d;font:10px/1.4 'Courier New',monospace;letter-spacing:.14em;writing-mode:vertical-rl}
.portfolio-rail span:first-child{font-family:Arial,sans-serif;font-weight:700;letter-spacing:.05em}
.portfolio-main{min-width:0;padding:0 22px}
.portfolio-index{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-bottom:1px solid #50564d;font:11px/1.4 'Courier New',monospace;letter-spacing:.1em}.portfolio-indicator{font-size:20px}
.portfolio-masthead{display:flex;align-items:end;justify-content:space-between;gap:20px;padding:28px 0 24px}
.portfolio-masthead h2{margin:0;font-weight:500;min-width:0}
.portfolio-cn{display:block;font-family:'Microsoft YaHei',sans-serif;font-size:17px;font-weight:500;letter-spacing:.32em;margin-bottom:13px}
.portfolio-display{display:block;font-family:'Arial Black',Arial,Helvetica,sans-serif;font-size:clamp(54px,9.5vw,150px);font-weight:900;line-height:.82;letter-spacing:-.075em;text-transform:uppercase;transform:scaleX(1.02);transform-origin:left center}
.portfolio-signature{display:flex;align-items:center;gap:12px;padding-bottom:3px;font:10px/1.4 'Courier New',monospace;letter-spacing:.08em}.portfolio-signature svg{width:48px;height:48px}
.portfolio-register{display:flex;justify-content:space-between;gap:15px;padding:12px 0;border-top:1px solid #50564d;font:10px/1.5 'Courier New',monospace;letter-spacing:.12em}
#commercial .commission-grid{padding:0;background:repeating-linear-gradient(0deg,transparent 0 31px,#ffffff04 31px 32px),#191c19}
#commercial .commission-card{background:#111312}
#commercial .commission-title{font-family:Bahnschrift,'Courier New','Microsoft YaHei',sans-serif;font-size:clamp(12px,1.05vw,16px);padding:16px;letter-spacing:.16em}
#commercial .commission-year{font-family:Bahnschrift,'Courier New','Microsoft YaHei',sans-serif;font-size:clamp(12px,1.05vw,16px);top:16px;left:16px;letter-spacing:.16em}
.portfolio-end{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid #50564d;padding:14px 0;font:10px/1.5 'Courier New',monospace;letter-spacing:.12em;color:#9da598}
@media(max-width:900px){.portfolio-shell{grid-template-columns:32px minmax(0,1fr)}.portfolio-main{padding:0 14px}.portfolio-signature{display:none}.portfolio-display{font-size:10vw}.portfolio-rail{font-size:9px}.portfolio-cn{font-size:15px}}
@media(max-width:600px){body:not(.home-view) #commercial{margin:0 3%;padding-top:14px}.portfolio-shell{grid-template-columns:23px minmax(0,1fr)}.portfolio-main{padding:0 8px}.portfolio-index{font-size:9px;padding:12px 0}.portfolio-index>span:nth-child(2){display:none}.portfolio-masthead{padding:24px 0 20px}.portfolio-cn{font-size:14px;letter-spacing:.2em;margin-bottom:12px}.portfolio-display{font-size:10.5vw}.portfolio-register{font-size:8px;letter-spacing:.03em}.portfolio-rail{font-size:8px;letter-spacing:.06em;padding:15px 0}.portfolio-end{font-size:8px;letter-spacing:.04em}.portfolio-end>span:nth-child(2){display:none}#commercial .commission-title{font-size:12px;padding:7px;letter-spacing:.1em}#commercial .commission-year{font-size:12px;top:7px;left:7px;letter-spacing:.1em}}
/* Divide the page itself on the shared neutral surface. */
body:not(.home-view) #commercial{margin:0;padding:0;min-height:calc(100svh - 160px)}
.portfolio-shell{border:0;border-top:1px solid var(--line);background:transparent;color:var(--ink);min-height:inherit;grid-template-columns:6% minmax(0,1fr)}
.portfolio-rail{border-color:var(--line);padding:24px 0}
.portfolio-main{padding:0;display:flex;flex-direction:column}
.portfolio-index,.portfolio-masthead,.portfolio-register,.portfolio-end{padding-left:24px;padding-right:24px;border-color:var(--line)}
.portfolio-index{padding-top:18px;padding-bottom:18px}
.portfolio-masthead{padding-top:30px;padding-bottom:28px}
#commercial .commission-grid{background:transparent;border-top:1px solid var(--line);flex:1;align-content:start}
.portfolio-end{color:var(--muted);margin-top:0}
@media(max-width:900px){.portfolio-shell{grid-template-columns:32px minmax(0,1fr)}.portfolio-main{padding:0}}
@media(max-width:600px){body:not(.home-view) #commercial{margin:0;padding:0}.portfolio-shell{grid-template-columns:23px minmax(0,1fr)}.portfolio-index,.portfolio-masthead,.portfolio-register,.portfolio-end{padding-left:12px;padding-right:12px}.portfolio-masthead{padding-top:24px;padding-bottom:24px}}
.portfolio-display{transform:none;position:relative;left:-.055em}.portfolio-cn{margin-left:0}.portfolio-signature{gap:0}
@font-face{font-family:Panchang;src:url("assets/fonts/panchang-bold.otf") format("opentype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Xingmou;src:url("assets/fonts/ximenghei.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}.portfolio-display{font-family:Panchang,sans-serif;font-weight:700;font-size:clamp(40px,7.2vw,112px);letter-spacing:-.045em;left:0}.portfolio-cn{font-family:Xingmou,sans-serif;font-weight:400;font-size:24px;letter-spacing:.18em}@media(max-width:900px){.portfolio-display{font-size:7.5vw}}@media(max-width:600px){.portfolio-display{font-size:7.2vw}.portfolio-cn{font-size:20px}}

.video-loading{min-height:240px;height:min(55vh,560px);display:flex;align-items:center;justify-content:center;gap:16px;background:#191c1b;color:#dfe1da;font:12px monospace;letter-spacing:.12em}.video-loading button{padding:10px 16px;background:transparent;border:1px solid currentColor;color:inherit;cursor:pointer}
