/* 透空、细线和暖色导航承接轨道放映室；手机只保留一个主滚动区。 */
html[data-presentation="mobile"] body{margin:0;overflow:hidden;background:#080e17;color:#e0e7eb;font:16px/1.8 "Microsoft YaHei","PingFang SC",sans-serif}
html[data-presentation="mobile"] .preview-stage{display:none}
#mobile-shell{position:fixed;inset:0;isolation:isolate;display:flex;flex-direction:column;height:100dvh;padding:env(safe-area-inset-top) 20px env(safe-area-inset-bottom);box-sizing:border-box;background:radial-gradient(ellipse at 65% 30%,#17233777,transparent 65%)}
#mobile-shell *{box-sizing:border-box}#mobile-shell [hidden]{display:none}#mobile-shell button,#mobile-shell a{font:inherit;color:inherit;min-height:48px;touch-action:manipulation}#mobile-shell button{border:0;cursor:pointer}#mobile-shell a{color:#e4c78f;text-underline-offset:5px}#mobile-shell button:focus-visible,#mobile-shell a:focus-visible,#mobile-shell input:focus-visible{outline:2px solid #edce94;outline-offset:3px}#mobile-shell button:active{transform:translateY(1px);background:#e4c78f16}
.mobile-sky{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}.mobile-sky>svg{width:100%;height:100%}.mobile-top{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:32px 48px;align-content:center;gap:2px 10px;min-height:92px;border-bottom:1px solid #7e929d44;flex:none}.mobile-top strong{grid-column:1;grid-row:1;font-size:16px;font-weight:500;letter-spacing:2px}.mobile-top>a{grid-column:2;grid-row:1;font-size:13px;align-content:center;text-decoration:none}
.mobile-launcher{overflow-y:auto;overscroll-behavior:contain;min-height:0;flex:1;padding:28px 0}.mobile-intro{padding:8px 8px 30px}.mobile-orbit{display:block;color:#d8bd82}.mobile-orbit svg{display:block;width:46px;height:46px}.mobile-intro p{color:#afbdca;font-size:13px;letter-spacing:2px;margin:20px 0 12px}.mobile-intro h1{font-size:29px;line-height:1.5;letter-spacing:2px;font-weight:500;margin:0}.mobile-launcher nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.mobile-launcher nav button{display:flex;align-items:center;gap:14px;padding:18px 14px;text-align:left;background:#10202b5c;border:1px solid #8399a533;border-radius:4px;font-size:15px}.mobile-launcher nav button>svg{width:28px;height:28px;flex:none;color:#bed1dc}.mobile-launcher nav button>span{min-width:0;flex:1;color:#e0e7eb}.mobile-note{font-size:13px;line-height:1.8;color:#aebfcd;margin:28px 8px 12px}
.mobile-panel{display:flex;flex-direction:column;min-height:0;flex:1}.mobile-panel-top{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #7e929d33;flex:none;min-height:64px}.mobile-panel-top button{padding:0 8px;background:transparent;color:#e4c78f;font-size:14px}.mobile-panel-top span{font-size:13px;color:#b7c8d4}.mobile-panel .window-content{position:static;overflow-y:auto;overscroll-behavior:contain;min-height:0;flex:1;padding:24px 4px 40px;scrollbar-gutter:stable;background:transparent;outline:none}
.mobile-panel .app-intro{margin-bottom:22px}.mobile-panel h1,.mobile-panel h3{font-size:25px;line-height:1.5;font-weight:500;overflow-wrap:anywhere}.mobile-panel .desktop-work-grid{display:grid;grid-template-columns:1fr;gap:24px}.mobile-panel .desktop-work-card{padding:0;text-align:left;background:transparent;border:0;border-bottom:1px solid #8399a544;border-radius:0;overflow:hidden}.mobile-panel .desktop-work-card img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block}.mobile-panel .work-card-label{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:13px 0 16px}.mobile-panel .work-card-label strong{font-size:18px;font-weight:500}.mobile-panel .work-card-label small{font-size:12px;color:#b8c7d1}.mobile-panel .detail-back{background:transparent;padding:0;color:#e4c78f;font-size:14px;margin-bottom:14px}.mobile-panel .desktop-work-detail>img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}.mobile-panel .detail-caption{display:block}.mobile-panel .detail-caption h3{margin:22px 0 6px}.mobile-panel .detail-caption span{font-size:13px;color:#afbdca}.mobile-panel .detail-description{font-size:16px;line-height:1.9;color:#c1cdd5;overflow-wrap:anywhere}.mobile-panel .work-demo{font-size:12px;letter-spacing:0}.mobile-panel .media-controls{gap:12px;flex-wrap:wrap}.mobile-panel .media-controls button{padding:0 14px;background:#18303b;border:1px solid #8fa5af66;border-radius:3px;font-size:14px}.mobile-panel .media-controls label{min-width:140px}.mobile-panel .work-permalink{font-size:14px}.mobile-panel .app-action{padding:0 16px;background:#18303b;border:1px solid #8fa5af66;border-radius:3px;margin-top:16px}
@media(min-width:650px){#mobile-shell{padding-left:max(24px,calc((100vw - 720px)/2));padding-right:max(24px,calc((100vw - 720px)/2))}.mobile-intro{padding:16px 0 28px}.mobile-launcher nav{grid-template-columns:repeat(3,minmax(0,1fr))}.mobile-panel .desktop-work-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mobile-panel .work-player video{max-height:55dvh}.mobile-intro h1 br{display:none}}
@media(prefers-reduced-motion:no-preference){.mobile-launcher{animation:settings-arrive 220ms ease-out}.mobile-launcher nav button{transition:border-color 140ms ease,background 140ms ease}}

#mobile-shell{--preview-scale:1}
.mobile-tools{grid-column:1/-1;grid-row:2;display:flex;align-items:center;justify-content:space-between;gap:8px;flex:none;width:100%}.mobile-tools button{display:flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;padding:0 3px;background:transparent;font-size:12px;white-space:nowrap}.mobile-tools #mobile-pet{gap:4px}.mobile-tools .mascot-art{display:block;width:24px;height:28px;object-fit:contain}.mobile-pet-name{font-size:12px}
.mobile-settings{position:fixed;inset:0;z-index:100;width:auto;height:100dvh;max-height:none;padding:20px 24px 32px;border:0;border-radius:0;background:#1c2b35;overflow-y:auto;overscroll-behavior:contain;box-shadow:none}
.mobile-settings .settings-title-row{position:sticky;top:-20px;z-index:2;min-height:68px;padding:8px 0;background:#1c2b35;border-bottom:1px solid #7e929d44}
.mobile-settings .settings-title-row h2{font-size:20px}.mobile-settings .settings-close{width:48px;height:48px}
.mobile-settings .preference-option{min-height:48px}.mobile-settings .option-title{font-size:16px}.mobile-settings .option-description,.mobile-settings .settings-help,.mobile-settings .preference-status,.mobile-settings .motion-preference-status,.mobile-settings .motion-reduced-note{font-size:14px;line-height:1.8}
.mobile-settings .motion-range{height:48px}.mobile-settings .motion-range-label,.mobile-settings legend,.mobile-settings .motion-reset-row{font-size:14px}.mobile-settings .motion-reset-row{gap:12px;flex-wrap:wrap}
#mobile-shell .pet-notice{position:fixed;right:16px;bottom:18px;left:16px;max-width:none;font-size:14px;pointer-events:none}
