@charset "UTF-8";
:root{color-scheme:dark;--bg:#151616;--text:#eeece5;--muted:#94958f;--line:#ffffff1b;font-family:Inter,"Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--text);font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0}body.modal-open{overflow:hidden}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button{border:0}button:focus-visible,a:focus-visible{outline:2px solid #e7dbc0;outline-offset:6px}::selection{background:#e7dbc0;color:#151616}.header,main{width:min(1320px,88%);margin:auto}.header{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.signature{font-size:17px;letter-spacing:3px;display:flex;align-items:center;gap:23px}.signature>span{font-size:12px;color:var(--muted);letter-spacing:1px;border-left:1px solid #ffffff30;padding-left:23px}.header nav{display:flex;align-items:center;gap:35px;font-size:14px}.header nav button{background:none;padding:10px 0}.header nav span{margin-left:12px;font-size:12px;color:#a4a69e}.intro{display:flex;align-items:flex-end;justify-content:space-between;padding:51px 0 39px}.eyebrow{font-size:12px;letter-spacing:2px;color:#94958f}.intro h1{font-family:"Songti SC","Noto Serif CJK SC","SimSun",serif;font-size:clamp(64px,7.1vw,110px);letter-spacing:.055em;font-weight:400;line-height:1.15;margin:18px 0 19px}.title-stop{font-family:Georgia,serif;letter-spacing:0;color:#aaa58e}.intro p{font-size:16px;line-height:1.9;color:#aaa9a2;margin:0;letter-spacing:1px}.mobile-break{display:none}.intro-index{display:flex;flex-direction:column;align-items:flex-end;gap:20px;padding-bottom:4px}.index-label{color:var(--muted);font-size:12px;letter-spacing:1px}.index-number{display:flex;gap:14px;align-items:baseline}.index-number b{font-family:Georgia,serif;font-size:46px;font-weight:400;line-height:1}.index-number i{font-style:normal;font-size:12px;color:#90928b}.collection-line{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:22px 0;color:#858780;font-size:12px;letter-spacing:1.8px}.collection-line span:last-child{letter-spacing:1px}.works-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px}.work{min-width:0;--accent:#d0c5aa}.stage{width:100%;height:570px;position:relative;display:flex;align-items:center;justify-content:center;border-radius:6px;isolation:isolate;background:#202222;border:1px solid #ffffff06;overflow:hidden;cursor:pointer;padding:30px 22px;perspective:1300px}.stage:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 55%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 65%);opacity:.6;transition:opacity .4s}.stage:hover:before{opacity:1}.stage-number{position:absolute;left:20px;top:17px;font:12px Georgia,serif;color:#9d9e977f;letter-spacing:1px}.phone{position:relative;width:228px;max-width:100%;aspect-ratio:440/956;padding:6px;border-radius:35px;background:linear-gradient(140deg,#676b6a,#181b1b 25%,#555959 55%,#131717);box-shadow:0 0 0 1px #85898660,0 22px 28px -7px #0009,0 45px 60px -20px #0008;transform:translateY(0) rotateY(-4deg) rotateZ(-2deg);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s}.work:nth-child(2) .phone{transform:translateY(0) rotateY(0) rotateZ(0)}.work:nth-child(3) .phone{transform:translateY(0) rotateY(4deg) rotateZ(2deg)}.stage:hover .phone,.stage:focus-visible .phone{transform:translateY(-9px) rotateY(0) rotateZ(0);box-shadow:0 0 0 1px #85898660,0 28px 30px -7px #0009,0 50px 60px -20px #0008}.screen{position:relative;height:100%;width:100%;border-radius:29px;overflow:hidden;background:#080e11;border:2px solid #030605}.screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}.island{position:absolute;left:50%;top:8px;transform:translateX(-50%);height:13px;width:52px;background:#060807;border-radius:15px;box-shadow:inset 0 0 0 1px #ffffff0b;z-index:1}.island:after{content:'';position:absolute;right:7px;top:4px;width:5px;height:5px;background:#182523;border-radius:50%}.phone:after{content:'';position:absolute;left:36%;right:36%;bottom:12px;height:3px;background:#f5f1eab3;border-radius:10px}.phone:before{content:'';position:absolute;right:-2px;top:24%;height:38px;width:2px;background:#6e726e;border-radius:2px}.play-label{position:absolute;bottom:15px;left:50%;transform:translate(-50%,6px);display:flex;align-items:center;gap:9px;white-space:nowrap;padding:8px 14px;border-radius:30px;background:#171919d9;backdrop-filter:blur(10px);border:1px solid #ffffff2b;color:#eeece5;font-size:12px;opacity:0;transition:opacity .2s,transform .3s}.stage:hover .play-label,.stage:focus-visible .play-label{opacity:1;transform:translate(-50%,0)}.work-caption{padding:23px 0 20px;display:flex;align-items:center;justify-content:space-between;gap:15px}.work-caption h2{font-size:22px;letter-spacing:1px;font-weight:450;margin:0 0 9px}.work-caption p{font-size:13px;color:#8f938a;margin:0}.open-work{background:none;border:1px solid #ffffff26;border-radius:50%;height:38px;width:38px;font-size:20px;transition:background .2s,color .2s}.open-work:hover{background:#e4dfd1;color:#171818}footer{display:flex;align-items:center;justify-content:space-between;margin:40px 0 0;padding:28px 0 34px;border-top:1px solid var(--line);gap:20px;color:#8d9188;font-size:12px}footer>div{display:flex;align-items:center;gap:20px}.footer-mark{font-family:serif;font-size:19px;color:#a5a79b}footer a{font-size:12px}.skip{position:fixed;top:-100px;left:20px;z-index:30;background:#eee;color:#111;padding:15px}.skip:focus{top:10px}.viewer{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:0;background:#111313f7;color:var(--text);border:0;overflow:auto}.viewer::backdrop,.contact-dialog::backdrop{background:#000c;backdrop-filter:blur(14px)}.viewer-layout{min-height:100%;padding:40px 8%;display:flex;align-items:center;justify-content:center;gap:100px}.viewer-info{max-width:320px;min-width:230px}.viewer-info h2{font-family:"SimSun",serif;font-size:42px;font-weight:400;letter-spacing:2px;margin:24px 0}.viewer-info p{font-size:16px;line-height:1.8;color:#a1a69d}.viewer-label{display:block;font-size:12px;color:#939a8f;margin-top:35px}.viewer-info a{display:flex;justify-content:space-between;padding:18px 0;font-size:14px;border-bottom:1px solid var(--line);gap:35px}.close-viewer{padding:16px 0;display:flex;justify-content:space-between;width:100%;font-size:14px;background:none}.close-viewer span{font-size:22px;line-height:18px}.keyboard-hint{display:block;font-size:12px;color:#939a8f;margin-top:15px}.demo-phone{flex-shrink:0;width:min(400px,calc((100dvh - 80px)*440/956));aspect-ratio:440/956;padding:7px;background:#242827;border-radius:34px;box-shadow:0 0 0 1px #6d736a,0 20px 60px #0009;overflow:hidden}.demo-phone iframe{display:block;width:100%;height:100%;border:0;border-radius:28px;background:#06181d}.contact-dialog{width:min(440px,90vw);padding:40px;background:#202322;color:var(--text);border:1px solid #ffffff20;border-radius:12px}.contact-close{position:absolute;right:18px;top:14px;font-size:26px;background:none;color:#aaa}.contact-dialog h2{font-size:25px;font-weight:450;margin:26px 0 10px}.contact-dialog>p{font-size:16px;color:#a2a69a;line-height:1.8}.wechat{display:flex;align-items:center;gap:18px;border-top:1px solid var(--line);padding-top:22px;margin-top:28px}.wechat>span{font-size:14px;color:#969e8d}.wechat strong{font-size:22px;font-weight:400}.wechat button{margin-left:auto;padding:8px 13px;background:#dedccf;color:#222;border-radius:5px;font-size:14px}#copy-status{min-height:25px;margin-bottom:0}.collection{animation:appear .7s ease-out both}@keyframes appear{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(min-width:1550px){.stage{height:620px}.phone{width:250px}.intro{padding-top:60px}}@media(max-width:1100px){.header,main{width:90%}.works-grid{gap:18px}.stage{height:500px;padding:26px 18px}.phone{width:200px;border-radius:30px}.screen{border-radius:24px}.viewer-layout{gap:50px}.work-caption h2{font-size:20px}}@media(max-width:800px){.header{height:82px}.signature>span{display:none}.intro{padding-top:40px}.intro h1{font-size:76px}.works-grid{gap:12px}.stage{height:auto;padding:26px 14px;aspect-ratio:1/2.35}.phone{width:100%;padding:4px;border-radius:25px}.screen{border-radius:20px;border-width:1px}.island{width:40px;height:10px;top:6px}.island:after{width:4px;height:4px;top:3px}.phone:after{bottom:9px;height:2px}.stage-number{display:none}.work-caption h2{font-size:18px;letter-spacing:0}.work-caption p{font-size:12px}.open-work{width:28px;height:28px;font-size:16px;flex-shrink:0}.work-caption{gap:6px}.viewer-layout{gap:30px;padding:30px}.viewer-info{min-width:200px}.viewer-info h2{font-size:32px}.demo-phone{width:min(360px,calc((100dvh - 70px)*440/956))}}@media(max-width:600px){.header,main{width:88%}.header nav{gap:23px}.header nav span{margin-left:6px}.signature{font-size:14px;letter-spacing:2px}.intro{padding:40px 0 29px;align-items:flex-end}.intro .eyebrow{font-size:12px;letter-spacing:1px}.intro h1{font-size:68px;margin:17px 0 16px}.intro p{font-size:14px;line-height:1.9;letter-spacing:.3px}.mobile-break{display:block}.index-label{display:none}.index-number{gap:7px;flex-direction:column;align-items:center}.index-number b{font-size:32px}.index-number i{font-size:12px}.collection-line{font-size:12px;letter-spacing:.5px;padding:20px 0}.works-grid{grid-template-columns:1fr;gap:26px}.stage{height:600px;aspect-ratio:auto;padding:35px}.phone{width:235px;max-width:100%;padding:6px;border-radius:35px}.screen{border-radius:29px;border-width:2px}.island{width:52px;height:13px;top:8px}.island:after{width:5px;height:5px;top:4px}.phone:after{bottom:12px;height:3px}.stage-number{display:block}.work-caption{padding:21px 0 4px}.work-caption h2{font-size:24px;letter-spacing:1px}.work-caption p{font-size:13px}.open-work{width:38px;height:38px;font-size:21px}.play-label{opacity:1;transform:translate(-50%,0);bottom:16px;font-size:12px}.viewer-layout{padding:20px 15px;min-height:100dvh;flex-direction:column;justify-content:flex-start;gap:20px}.viewer-info{display:grid;grid-template-columns:1fr auto;align-items:center;max-width:none;width:100%;min-width:0;gap:10px;padding:0 5px}.viewer-info>.eyebrow,.viewer-info>p,.viewer-label,.keyboard-hint{display:none}.viewer-info h2{font:22px "Microsoft YaHei",sans-serif;letter-spacing:0;margin:0}.close-viewer{grid-column:2;grid-row:1;gap:14px;font-size:14px;width:auto;padding:5px 0}.viewer-info a{grid-column:1/-1;grid-row:2;font-size:12px;padding:4px 0 10px;justify-content:flex-start;gap:15px;color:#aab1a2}.demo-phone{width:min(390px,calc((100dvh - 115px)*440/956));max-width:100%;padding:5px;border-radius:30px}.demo-phone iframe{border-radius:25px}footer{flex-wrap:wrap;padding-top:24px;margin-top:35px;row-gap:22px}footer>div{width:100%;gap:14px}footer a{margin-left:auto}.contact-dialog{padding:33px 25px}}@media(max-width:380px){.stage{height:540px;padding:30px}.phone{width:210px}.intro h1{font-size:60px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.phone,.work:nth-child(2) .phone,.work:nth-child(3) .phone,.stage:hover .phone{transform:none}}

/* Four-work collection: desktop row, tablet pairs, mobile stack. */
.works-grid{grid-template-columns:repeat(4,minmax(0,1fr))}@media(max-width:900px){.works-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.works-grid{grid-template-columns:1fr}}
/* Landscape website entries retain their own viewport proportions. */
.work-desktop{grid-column:span 2}.work-desktop .stage{height:auto;aspect-ratio:1.5;padding:30px 24px}.browser-preview{display:block;width:100%;aspect-ratio:1.5;background:#e9e9ec;border-radius:10px;overflow:hidden;box-shadow:0 18px 40px #0007;transition:transform .35s ease}.stage:hover .browser-preview{transform:translateY(-5px)}.browser-screen{height:100%;position:relative;padding-top:26px;overflow:hidden}.browser-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}.browser-toolbar{position:absolute;inset:0 0 auto;height:26px;background:#e3e3e6;color:#696971;font-size:10px;display:grid;place-items:center}.browser-toolbar:before{content:'● ● ●';position:absolute;left:10px;color:#9999a1;font-size:9px;letter-spacing:1px}.viewer.is-desktop .viewer-layout{padding:25px 4%;gap:20px;flex-direction:column;justify-content:flex-start}.viewer.is-desktop .viewer-info{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:28px;max-width:none;min-width:0;width:100%}.viewer.is-desktop .viewer-info>.eyebrow,.viewer.is-desktop .viewer-info>p,.viewer.is-desktop .viewer-label,.viewer.is-desktop .keyboard-hint{display:none}.viewer.is-desktop .viewer-info h2{margin:0;font:28px 'Microsoft YaHei',sans-serif;letter-spacing:0}.viewer.is-desktop .viewer-info a{padding:10px 0}.viewer.is-desktop .close-viewer{width:auto;gap:18px}.viewer.is-desktop .demo-phone{width:100%;height:calc(100dvh - 120px);aspect-ratio:auto;padding:5px;border-radius:13px}.viewer.is-desktop .demo-phone iframe{border-radius:8px}@media(max-width:600px){.work-desktop{grid-column:auto}.work-desktop .stage{aspect-ratio:1.3;padding:24px 14px}.browser-toolbar{font-size:9px}.viewer.is-desktop .viewer-info{grid-template-columns:1fr auto;gap:10px}.viewer.is-desktop .viewer-info h2{font-size:22px}.viewer.is-desktop .viewer-info a{grid-column:1/-1;grid-row:2}.viewer.is-desktop .close-viewer{grid-column:2;grid-row:1}.viewer.is-desktop .viewer-layout{padding:20px 15px}.viewer.is-desktop .demo-phone{height:calc(100dvh - 150px)}}
.work-desktop .stage-number{display:none}
/* Chinese typography: system CJK fallbacks, readable labels and natural wrapping. */
:root{--font-ui:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei UI","Microsoft YaHei","Noto Sans CJK SC","Noto Sans SC",sans-serif;--font-display:"Songti SC","Noto Serif CJK SC","Source Han Serif SC","SimSun",serif;--muted:#a5a79f;font-family:var(--font-ui);font-size:16px;line-height:1.6}
html{line-break:strict;word-break:normal;overflow-wrap:break-word}
button,input,textarea{font-family:var(--font-ui)}
.signature>span{font-size:13px;letter-spacing:.02em}.header nav{font-size:15px}.header nav a,.header nav button{min-height:44px;display:inline-flex;align-items:center}
.intro h1{font-family:var(--font-display);letter-spacing:.035em}.intro p{letter-spacing:.02em;line-height:1.9;color:#b9bbb2}.index-label{font-size:13px;letter-spacing:.02em}.index-number i{font-size:13px;color:var(--muted)}
.collection-line{color:var(--muted);letter-spacing:0;gap:16px;align-items:center}.collection-line span:last-child{letter-spacing:.02em}.collection-heading{display:flex;gap:12px;align-items:baseline;margin:0;font-size:14px;font-weight:500;letter-spacing:.04em}.collection-heading small{font-size:10px;letter-spacing:.12em;color:var(--muted);font-weight:400}
.work-caption{align-items:flex-start}.work-caption>div{min-width:0}.work-caption h2{font-family:var(--font-ui);font-size:22px;line-height:1.5;font-weight:500;letter-spacing:.01em;margin-bottom:6px;text-wrap:pretty}.work-caption p{font-size:14px;line-height:1.75;letter-spacing:.01em;color:var(--muted)}.open-work{flex-shrink:0;min-width:44px;min-height:44px}.play-label{font-size:13px}.browser-toolbar{font-family:var(--font-ui)}
footer{color:var(--muted);font-size:13px;line-height:1.8}.footer-mark{font-family:var(--font-display)}footer a{font-size:13px}
.viewer-info h2{font-family:var(--font-ui);font-size:36px;font-weight:500;line-height:1.45;letter-spacing:.02em;text-wrap:pretty}.viewer-info p{line-height:1.9;color:#b9bdb3;letter-spacing:.01em}.viewer-label,.keyboard-hint{font-size:13px;color:var(--muted)}.viewer-info a,.close-viewer{font-size:15px;min-height:44px}.viewer.is-desktop .viewer-info h2{font-family:var(--font-ui);line-height:1.45;font-weight:500}.contact-dialog h2{line-height:1.5;font-weight:500}.contact-dialog>p{line-height:1.85}.wechat{flex-wrap:wrap}.wechat strong{overflow-wrap:anywhere}
@media(max-width:800px){.work-caption h2{font-size:21px}.viewer-info h2{font-size:30px}}
@media(max-width:600px){.intro p{font-size:15px;letter-spacing:0}.intro h1{font-size:clamp(48px,15vw,68px)}.intro-copy{min-width:0}.intro-index{flex-shrink:0;margin-left:10px}.collection-heading small{display:none}.collection-line span:last-child{font-size:12px}.work-caption h2{font-size:23px;letter-spacing:0}.work-caption p{font-size:14px}.viewer-info h2,.viewer.is-desktop .viewer-info h2{font-family:var(--font-ui);font-size:20px;line-height:1.5;font-weight:500;overflow-wrap:anywhere}.viewer-info a{font-size:13px}.viewer-info,.viewer.is-desktop .viewer-info{grid-template-columns:minmax(0,1fr) auto}.close-viewer{white-space:nowrap}.viewer.is-desktop .close-viewer{gap:10px}.contact-dialog{padding:32px 22px}}
/* Unified sans-serif typography across the portfolio and its dialogs. */
:root{--font-ui:"PingFang SC","Microsoft YaHei UI","Microsoft YaHei","Noto Sans CJK SC","Noto Sans SC","Heiti SC",SimHei,Arial,sans-serif;--font-display:var(--font-ui)}
body,body *{font-family:var(--font-ui)}
.signature,.eyebrow,.intro h1,.title-stop,.index-number b,.stage-number,.footer-mark,.viewer-info h2,.viewer.is-desktop .viewer-info h2,.contact-dialog h2{font-family:var(--font-ui)}
/* Self-hosted Iconly Outline assets; color follows the surrounding control. */
.ui-icon{display:inline-block;width:20px;height:20px;flex:0 0 20px;background:currentColor;mask:var(--icon) center/contain no-repeat;-webkit-mask:var(--icon) center/contain no-repeat;vertical-align:middle}
.icon-arrow,.icon-up{--icon:url('/media/assets/icons/arrow-up-right.svg')}.icon-close{--icon:url('/media/assets/icons/close.svg')}.icon-copy{--icon:url('/media/assets/icons/copy.svg')}.icon-up{transform:rotate(-45deg)}
.open-work,.contact-close{display:inline-flex;align-items:center;justify-content:center}.contact-close{width:40px;height:40px}.header nav .ui-icon{color:inherit;margin-left:8px}.close-viewer .ui-icon{font-size:inherit;line-height:1}.wechat button{display:inline-flex;align-items:center;gap:6px}.wechat{gap:12px}footer a{display:inline-flex;align-items:center;gap:6px}.play-label .ui-icon{width:16px;height:16px;flex-basis:16px}
/* beUI Pro-inspired shared selection surface and rolling Iconly arrows. */
.collection-tools{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 0 28px}.work-filters{position:relative;display:flex;align-items:center;gap:4px;padding:5px;background:#1d201f;border:1px solid #ffffff0b;border-radius:15px;isolation:isolate}.work-filters button{position:relative;background:none;padding:10px 16px;border-radius:10px;font-size:14px;white-space:nowrap;min-height:44px;color:#a5a79f;transition:color .2s}.work-filters button[aria-pressed=true]{color:#f4f1e9}.work-filters button span{font-size:11px;margin-left:8px;opacity:.65;font-variant-numeric:tabular-nums}.filter-highlight{position:absolute;top:5px;bottom:5px;left:0;border-radius:10px;background:#353a36;box-shadow:inset 0 1px 0 #ffffff10,0 2px 6px #0002;z-index:-1;transition:transform .35s cubic-bezier(.16,1,.3,1),width .35s cubic-bezier(.16,1,.3,1)}#filter-status{color:var(--muted);font-size:12px;white-space:nowrap}.work[hidden]{display:none}.rolling-window{display:block;width:20px;height:20px;overflow:hidden}.rolling-track{display:flex;width:40px;height:20px;transform:translateX(-20px);transition:transform .3s cubic-bezier(.16,1,.3,1)}.open-work:hover .rolling-track,.open-work:focus-visible .rolling-track{transform:translateX(0)}.stage{border-radius:18px;transition:border-color .3s,background .3s}.stage:hover,.stage:focus-visible{border-color:color-mix(in srgb,var(--accent) 30%,transparent);background:#252827}.work-caption{padding-inline:3px}.open-work:active{transform:scale(.94)}
@media(max-width:800px){.collection-tools{align-items:flex-start;flex-direction:column;gap:12px}.work-filters{max-width:100%;overflow-x:auto}.work-filters button{padding:10px 12px;font-size:13px}#filter-status{align-self:flex-end}}
@media(max-width:400px){.work-filters{gap:0;padding:4px;width:100%}.work-filters button{padding:9px 8px;font-size:12px;flex:1}.work-filters button span{margin-left:4px;font-size:10px}.filter-highlight{top:4px;bottom:4px}}
@media(prefers-reduced-motion:reduce){.rolling-track{transform:none}.rolling-track .ui-icon+ .ui-icon{display:none}}

/* Registration link occupies a quiet, dedicated footer row. */
footer{flex-wrap:wrap}footer .icp-record{flex-basis:100%;justify-content:center;margin:0;padding-top:4px;font-size:12px;color:var(--muted)}footer .icp-record:hover{text-decoration:underline;text-underline-offset:4px}
/* Touch targets and full-width mobile artwork previews. */
.work-title-button{display:block;text-align:left;padding:0;background:none;font:inherit;letter-spacing:inherit;line-height:inherit;min-height:44px;width:100%}
button,a{touch-action:manipulation}.ui-icon,.rolling-window,.stage>span{pointer-events:none}
@media(any-pointer:coarse){.stage:hover .phone,.stage:focus-visible .phone,.work:nth-child(2) .phone,.work:nth-child(3) .phone,.phone{transform:none}.stage:hover .browser-preview{transform:none}.stage:active{background:#303530}.play-label{opacity:1;transform:translate(-50%,0)}.rolling-track{transform:none}.open-work:hover .rolling-track{transform:none}}
@media(max-width:600px){
 .header nav{gap:12px}.header nav a,.header nav button{min-width:48px;min-height:48px;padding:8px 4px}
 .open-work{min-width:48px;min-height:48px;width:48px;height:48px}.work-caption{align-items:center;gap:12px}.work-title-button{padding:6px 0;min-height:48px}.work-caption h2{margin-bottom:0}
 .work-filters{width:100%}.work-filters button{min-height:48px}.contact-close{width:48px;height:48px}.wechat button{min-height:48px;padding:10px 14px}footer a{min-height:44px}
 .viewer-layout,.viewer.is-desktop .viewer-layout{padding:0 10px max(16px,env(safe-area-inset-bottom));gap:12px;justify-content:flex-start}
 .viewer-info,.viewer.is-desktop .viewer-info{position:sticky;top:0;z-index:5;background:#111313;padding:max(10px,env(safe-area-inset-top)) 6px 8px;gap:4px 12px;border-bottom:1px solid var(--line)}
 .close-viewer,.viewer.is-desktop .close-viewer{min-height:48px;padding:10px 12px;border-radius:10px;background:transparent;gap:8px}.viewer-info a,.viewer.is-desktop .viewer-info a{min-height:44px;padding:10px 4px;margin:0;border:0}
 .demo-phone{width:100%;max-width:440px;aspect-ratio:440/956;padding:0;border-radius:18px;box-shadow:none}.demo-phone iframe{border-radius:18px}
 .viewer.is-desktop .demo-phone{width:100%;height:max(500px,calc(100dvh - 145px));padding:0}
}