:root{
  --fg:#eef1f6; --dim:rgba(238,241,246,.56); --faint:rgba(238,241,246,.18);
  --gold:#f2d39b; --gold-dim:rgba(242,211,155,.4); --cyan:#9fd6ff;
  --glass:rgba(10,14,22,.55); --line:rgba(238,241,246,.14);
  --serif:"Songti SC","Noto Serif SC","Source Han Serif SC",STSong,serif;
  --sans:-apple-system,"PingFang SC","Helvetica Neue","Microsoft YaHei",sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --safe-b:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%;background:#000;color:var(--fg);font-family:var(--sans);overflow:hidden;overscroll-behavior:none}
body{touch-action:none;user-select:none;-webkit-user-select:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
#gl{position:fixed;inset:0;width:100%;height:100%;display:block;cursor:grab}
#gl.drag{cursor:grabbing}
#gl.hover{cursor:pointer}
#xfade{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;opacity:0;transform-origin:50% 50%;will-change:transform,opacity}

/* 叠加层 */
#fade,#flash{position:fixed;inset:0;pointer-events:none;opacity:0}
#fade{background:#000;transition:opacity 1.2s ease}
#flash{background:radial-gradient(circle at 50% 50%,#fff 0,#fff6e0 30%,#ffd9a0 60%,rgba(255,200,140,0) 100%);mix-blend-mode:screen}
#grain{position:fixed;inset:-50%;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-4%)}60%{transform:translate(-4%,-1%)}80%{transform:translate(3%,3%)}}

/* 进入页 */
#gate{position:fixed;inset:0;display:grid;place-items:center;background:#000;z-index:50;transition:opacity 1s}
#gate.out{opacity:0;pointer-events:none}
.gate-inner{text-align:center;display:flex;flex-direction:column;align-items:center;gap:28px}
.gate-dot{width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 12px 3px #fff,0 0 40px 10px rgba(255,220,170,.5);animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{50%{transform:scale(1.6);opacity:.6}}
.gate-title{font-family:var(--serif);font-size:44px;letter-spacing:.5em;padding-left:.5em;font-weight:400}
.gate-title span{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.6em;color:var(--dim);margin-top:12px}
.gate-btn{border:1px solid var(--faint);padding:12px 34px;letter-spacing:.3em;font-size:13px;border-radius:40px;transition:.4s}
.gate-btn:hover{border-color:var(--gold);color:var(--gold);box-shadow:0 0 30px rgba(242,211,155,.2)}
.gate-load{width:180px;height:1px;background:var(--faint);margin-top:-6px;overflow:hidden}
.gate-load i{display:block;height:100%;width:0;background:var(--gold);transition:width .3s}
.gate-pct{font-family:var(--mono);font-size:10px;letter-spacing:.3em;color:var(--dim);margin-top:-18px}
#hires{color:var(--gold);opacity:0;transition:opacity .6s}
#hires.on{opacity:.7}
.gate-hint{font-size:11px;color:var(--dim);letter-spacing:.2em}
.gate-lang{display:flex;gap:12px;align-items:center;font-size:12px;color:var(--dim)}
.gate-lang i{width:1px;height:10px;background:var(--faint)}
.gate-lang button.on{color:var(--fg)}

/* 开场 */
#intro-cap{position:fixed;left:0;right:0;bottom:15vh;text-align:center;pointer-events:none;z-index:20;opacity:0;transition:opacity .8s;padding:0 16px}
#intro-cap.on{opacity:1}
.ic-main{font-family:var(--serif);font-size:clamp(20px,2.8vw,30px);letter-spacing:.18em;min-height:1.4em;text-shadow:0 0 20px rgba(0,0,0,.8)}
.ic-main span{display:inline-block;white-space:pre;will-change:transform,opacity,filter}
.ic-via{margin-top:12px;font-size:13px;letter-spacing:.6em;color:var(--dim);opacity:0;transform:translateY(6px);transition:opacity .9s,transform .9s,letter-spacing 1.2s;text-shadow:0 0 12px #000}
.ic-via.on{opacity:1;transform:none;letter-spacing:.3em}
.ic-meta{margin-top:16px;font-family:var(--mono);font-size:11px;letter-spacing:.25em;color:var(--gold);opacity:0;transition:opacity .8s;font-variant-numeric:tabular-nums;text-shadow:0 0 10px #000}
.ic-meta.on{opacity:.9}
#title-card{position:fixed;left:0;right:0;top:30vh;text-align:center;z-index:20;opacity:0;pointer-events:none;transition:opacity 1.6s}
#title-card.on{opacity:1;pointer-events:auto}
#title-card h1{font-family:var(--serif);font-weight:400;font-size:clamp(48px,9vw,96px);letter-spacing:.4em;padding-left:.4em;
  text-shadow:0 0 40px rgba(255,230,190,.35)}
.tc-en{font-family:var(--mono);font-size:12px;letter-spacing:.8em;padding-left:.8em;color:var(--gold);margin-top:6px}
#title-card p{margin-top:26px;font-family:var(--serif);font-size:15px;letter-spacing:.3em;color:var(--dim)}
.tc-btns{margin-top:44px;display:flex;gap:14px;justify-content:center}
.pill{display:inline-block;border:1px solid var(--faint);padding:11px 26px;border-radius:40px;font-size:13px;letter-spacing:.2em;transition:.3s;text-decoration:none;color:var(--fg);background:rgba(0,0,0,.25);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.pill:hover{border-color:var(--gold);color:var(--gold)}
.pill.solid{background:var(--gold);color:#0b0b0b;border-color:var(--gold)}
.pill.solid:hover{background:#fff;color:#000;border-color:#fff}
#skip{position:fixed;right:24px;bottom:calc(24px + var(--safe-b));z-index:30;font-size:12px;letter-spacing:.3em;color:var(--dim);border:1px solid var(--faint);padding:7px 16px;border-radius:30px;display:none}
#skip.on{display:block}

/* HUD */
#hud{position:fixed;inset:0;pointer-events:none;z-index:10;opacity:0;transition:opacity 1.2s}
#hud.on{opacity:1}
#hud button,#hud nav{pointer-events:auto}
.corner{position:absolute;width:22px;height:22px;border-color:var(--faint);border-style:solid;border-width:0}
.corner.tl{left:16px;top:16px;border-left-width:1px;border-top-width:1px}
.corner.tr{right:16px;top:16px;border-right-width:1px;border-top-width:1px}
.corner.bl{left:16px;bottom:16px;border-left-width:1px;border-bottom-width:1px}
.corner.br{right:16px;bottom:16px;border-right-width:1px;border-bottom-width:1px}
#brand{position:absolute;left:34px;top:30px;display:flex;align-items:baseline;gap:10px}
#brand b{font-family:var(--serif);font-weight:400;font-size:18px;letter-spacing:.3em}
#brand span{font-family:var(--mono);font-size:9px;letter-spacing:.4em;color:var(--dim)}
#readout{position:absolute;left:34px;top:64px;font-family:var(--mono);font-size:10px;letter-spacing:.15em;color:var(--dim);line-height:1.9}
#lv-name{color:var(--gold);font-size:11px;letter-spacing:.3em}
#topright{position:absolute;right:30px;top:26px;display:flex;gap:6px}
.ico{width:34px;height:34px;border-radius:50%;border:1px solid var(--faint);font-family:var(--mono);font-size:10px;display:grid;place-items:center;background:rgba(0,0,0,.3)}
.ico svg{width:16px;height:16px;fill:none;stroke:var(--fg);stroke-width:1.5}
.ico svg path:first-child{fill:var(--fg);stroke:none}
#btn-sound.off .w{opacity:0}

/* 尺度阶梯 */
#ladder{position:absolute;right:28px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:2px;align-items:flex-end}
#ladder::before{content:"";position:absolute;right:4px;top:12px;bottom:12px;width:1px;background:var(--line)}
#ladder button{display:flex;align-items:center;gap:12px;padding:7px 0;font-size:11px;letter-spacing:.15em;color:var(--dim);transition:.3s;position:relative}
#ladder button i{width:9px;height:9px;border-radius:50%;border:1px solid var(--faint);background:#000;transition:.3s}
#ladder button small{font-family:var(--mono);font-size:9px;opacity:.6;letter-spacing:.05em}
#ladder button:hover{color:var(--fg)}
#ladder button.on{color:var(--gold)}
#ladder button.on i{background:var(--gold);border-color:var(--gold);box-shadow:0 0 12px var(--gold)}
#lv-chip{display:none}

/* 继续缩放提示 */
#zoomhint{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:10px;opacity:0;transition:opacity .3s}
#zoomhint.on{opacity:1}
.zh-ring svg{width:54px;height:54px;transform:rotate(-90deg)}
.zh-ring circle{fill:none;stroke:var(--faint);stroke-width:1.5}
#zh-prog{stroke:var(--gold);stroke-dasharray:106.8;stroke-dashoffset:106.8}
#zoomhint span{font-size:11px;letter-spacing:.25em;color:var(--gold);text-shadow:0 0 10px #000}

/* 工具栏 */
#toolbar{position:absolute;left:50%;bottom:calc(26px + var(--safe-b));transform:translateX(-50%);display:flex;gap:4px;padding:5px;border:1px solid var(--line);border-radius:40px;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
#toolbar button{display:flex;align-items:center;gap:7px;padding:8px 14px;border-radius:30px;font-size:12px;letter-spacing:.1em;color:var(--dim);transition:.25s;white-space:nowrap}
#toolbar button svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.5}
#toolbar button[data-act=tour] svg{fill:currentColor;stroke:none}
#toolbar button:hover{color:var(--fg);background:rgba(255,255,255,.06)}
#toolbar button.on{color:#0b0b0b;background:var(--gold)}
#toolbar .sky-only{display:none}
#hud.lv-sky #toolbar .sky-only{display:flex}

/* 时间栏 */
#timebar{position:absolute;left:50%;bottom:calc(84px + var(--safe-b));transform:translate(-50%,10px);display:flex;align-items:center;gap:16px;padding:8px 10px 8px 18px;border:1px solid var(--line);border-radius:40px;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);opacity:0;pointer-events:none;transition:.35s}
#timebar.on{opacity:1;transform:translate(-50%,0)}
#timebar.on *{pointer-events:auto}
.tb-date{font-family:var(--mono);font-size:12px;letter-spacing:.08em;min-width:150px}
.tb-ctrl{display:flex;gap:2px}
.tb-ctrl button{padding:6px 10px;border-radius:20px;font-size:11px;color:var(--dim)}
.tb-ctrl button:hover{color:var(--fg);background:rgba(255,255,255,.06)}
.tb-rate{font-family:var(--mono);font-size:10px;color:var(--gold);min-width:70px;text-align:right;padding-right:8px}

/* 字幕 */
#subtitle{position:absolute;left:50%;bottom:calc(140px + var(--safe-b));transform:translateX(-50%);width:min(760px,88vw);text-align:center;font-family:var(--serif);font-size:clamp(15px,1.7vw,19px);line-height:1.8;letter-spacing:.06em;text-shadow:0 0 14px #000,0 0 4px #000;opacity:0;transition:opacity .6s}
#subtitle.on{opacity:1}
#tour-stop{position:absolute;right:28px;bottom:calc(30px + var(--safe-b));font-size:11px;letter-spacing:.2em;padding:7px 14px;border:1px solid var(--faint);border-radius:30px;color:var(--dim);display:none}
#hud.touring #tour-stop{display:block}
#hud.touring #toolbar{opacity:0;pointer-events:none}

/* 标签 */
#labels{position:fixed;inset:0;pointer-events:none;z-index:5;overflow:hidden}
.lb{position:absolute;left:0;top:0;opacity:0;white-space:nowrap;font-size:11px;letter-spacing:.12em;color:var(--dim);transition:opacity .4s;will-change:transform;pointer-events:auto;cursor:pointer;padding:4px 6px}
.lb:hover{color:var(--fg)}
.lb.star{font-size:10px;color:rgba(255,255,255,.62)}
.lb.con{font-family:var(--serif);font-size:12px;letter-spacing:.3em;color:rgba(160,200,255,.6)}
.lb.cn{font-family:var(--serif);font-size:13px;letter-spacing:.3em;color:rgba(242,211,155,.75)}
.lb.obj{font-size:11px;color:var(--fg);padding-left:16px}
.lb.obj::before{content:"";position:absolute;left:0;top:50%;width:10px;height:1px;background:var(--gold-dim)}
.lb.big{font-family:var(--serif);font-size:14px;letter-spacing:.3em;color:var(--fg)}
.lb.here{color:var(--gold);font-size:11px;letter-spacing:.2em}
.lb.dim{opacity:.0!important;pointer-events:none}

/* 信息卡 */
#card{position:fixed;right:84px;top:50%;width:340px;max-height:78vh;overflow:auto;transform:translate(30px,-50%);opacity:0;pointer-events:none;z-index:15;
  padding:26px 26px 22px;border:1px solid var(--line);border-radius:4px;background:linear-gradient(180deg,rgba(14,18,28,.78),rgba(6,8,14,.82));backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transition:.45s cubic-bezier(.2,.8,.2,1);scrollbar-width:none}
#card::-webkit-scrollbar{display:none}
#card.on{opacity:1;transform:translate(0,-50%);pointer-events:auto}
#card::before{content:"";position:absolute;left:0;top:0;width:40px;height:1px;background:var(--gold)}
.card-x{position:absolute;right:12px;top:10px;font-size:22px;color:var(--dim);width:32px;height:32px}
.card-tag{font-family:var(--mono);font-size:10px;letter-spacing:.35em;color:var(--gold)}
.card-title{font-family:var(--serif);font-weight:400;font-size:30px;letter-spacing:.12em;margin-top:12px;min-height:1.3em}
.card-sub{font-family:var(--mono);font-size:11px;color:var(--dim);letter-spacing:.1em;margin-top:4px}
.card-stats{display:grid;grid-template-columns:1fr 1fr;gap:14px 12px;margin:22px 0 18px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.card-stats:empty{display:none}
.card-stats div{font-size:10px;color:var(--dim);letter-spacing:.12em}
.card-stats b{display:block;font-family:var(--mono);font-weight:400;font-size:15px;color:var(--fg);margin-top:4px;letter-spacing:.02em}
.card-body{font-size:13.5px;line-height:1.95;color:rgba(238,241,246,.82);letter-spacing:.04em}
.card-body p+p{margin-top:10px}
.card-body .story{font-family:var(--serif);color:var(--gold);opacity:.9;margin-top:14px;padding-left:12px;border-left:1px solid var(--gold-dim)}
.card-acts{display:flex;gap:8px;margin-top:18px;flex-wrap:wrap}
.card-acts .pill{padding:8px 16px;font-size:12px}

/* 弹窗 */
#modal{position:fixed;inset:0;z-index:40;display:grid;place-items:center;background:rgba(0,0,0,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:.35s}
#modal.on{opacity:1;pointer-events:auto}
.m-box{position:relative;width:min(400px,92vw);padding:30px;border:1px solid var(--line);border-radius:4px;background:rgba(10,13,20,.92)}
.m-box h2{font-family:var(--serif);font-weight:400;font-size:24px;letter-spacing:.1em;margin:12px 0 22px}
.m-box label{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);font-size:13px;color:var(--dim)}
.m-box input,.m-box select{background:transparent;border:0;color:var(--fg);font:14px var(--mono);text-align:right;outline:none;color-scheme:dark;min-width:0;flex:1}
.m-box select option{background:#111}
.m-box .pill{margin-top:24px;width:100%;text-align:center}
#bd-poster{display:none;text-align:center}
#bd-poster img{width:100%;border-radius:2px;display:block;user-select:auto;-webkit-user-select:auto;-webkit-touch-callout:default}
.bd-tip{font-size:11px;color:var(--dim);margin-top:12px;letter-spacing:.15em}
#modal.poster #bd-form{display:none}
#modal.poster #bd-poster{display:block}

body.embed #hud,body.embed #card,body.embed #labels,body.embed #flare,body.embed #grain{display:none}

/* 镜头光晕 */
#flare{position:fixed;inset:0;pointer-events:none;z-index:4;overflow:hidden}
#flare i{position:absolute;left:0;top:0;border-radius:50%;mix-blend-mode:screen;opacity:0;will-change:transform,opacity}
#flare i.streak{border-radius:50%;height:3px!important}

/* 天象菜单 */
#events{position:absolute;left:50%;bottom:calc(84px + var(--safe-b));transform:translate(-50%,10px);display:flex;gap:4px;padding:5px;border:1px solid var(--line);border-radius:30px;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);opacity:0;pointer-events:none;transition:.3s}
#events.on{opacity:1;transform:translate(-50%,0)}
#hud #events.on button{pointer-events:auto}
#events button{padding:7px 16px;border-radius:20px;font-size:12px;letter-spacing:.15em;color:var(--dim)}
#events button:hover{color:var(--fg);background:rgba(255,255,255,.06)}
#events button.on{background:var(--gold);color:#0b0b0b}

/* 搜索 */
#search{position:fixed;left:50%;top:calc(70px + env(safe-area-inset-top,0px));transform:translate(-50%,-8px);width:min(460px,calc(100vw - 32px));z-index:35;opacity:0;pointer-events:none;transition:.25s}
#search.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.se-box{display:flex;align-items:center;border:1px solid var(--line);border-radius:12px;background:rgba(8,10,16,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
#se-input{flex:1;min-width:0;background:none;border:0;outline:none;color:var(--fg);font:15px var(--sans);padding:13px 16px;letter-spacing:.04em;user-select:text;-webkit-user-select:text}
#se-input::placeholder{color:var(--dim);font-size:13px}
.se-x{width:40px;height:40px;font-size:20px;color:var(--dim)}
#se-list{margin-top:6px;border-radius:12px;overflow:hidden;background:rgba(8,10,16,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
#se-list:empty{display:none}
#se-list button{display:flex;width:100%;justify-content:space-between;align-items:baseline;gap:12px;padding:11px 16px;text-align:left;border-bottom:1px solid var(--line);font-size:14px}
#se-list button:last-child{border-bottom:0}
#se-list button small{font-size:11px;color:var(--dim);letter-spacing:.1em;white-space:nowrap}
#se-list button.sel,#se-list button:hover{background:rgba(242,211,155,.1)}
#se-list .none{padding:12px 16px;font-size:13px;color:var(--dim)}

/* 碰撞模拟 */
#sim-bar{position:absolute;left:50%;top:calc(24px + env(safe-area-inset-top,0px));transform:translate(-50%,-10px);width:min(420px,70vw);padding:12px 16px;border:1px solid var(--line);border-radius:10px;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);opacity:0;pointer-events:none;transition:.35s}
#sim-bar.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
#hud #sim-bar button{pointer-events:auto}
.sim-head{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;letter-spacing:.15em;color:var(--dim)}
.sim-head b{font-family:var(--mono);font-weight:400;font-size:15px;color:var(--gold);letter-spacing:.04em}
.sim-track{height:2px;background:var(--faint);margin:10px 0;border-radius:2px;overflow:hidden}
.sim-track i{display:block;height:100%;width:0;background:var(--gold)}
.sim-btns{display:flex;gap:8px;justify-content:flex-end}
.sim-btns button{font-size:11px;letter-spacing:.15em;padding:5px 12px;border:1px solid var(--faint);border-radius:20px;color:var(--fg)}
#hud.simming #toolbar,#hud.simming #ladder,#hud.simming #lv-chip{opacity:0;pointer-events:none}

/* 作品介绍 */
#about{position:fixed;inset:0;z-index:45;display:grid;place-items:center;background:rgba(0,0,0,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:.35s;padding:16px}
#about.on{opacity:1;pointer-events:auto}
.ab-box{position:relative;width:min(720px,100%);max-height:86vh;overflow:auto;padding:34px 36px;border:1px solid var(--line);border-radius:4px;background:rgba(8,10,16,.94);scrollbar-width:none;user-select:text;-webkit-user-select:text}
.ab-box::-webkit-scrollbar{display:none}
.ab-box h2{font-family:var(--serif);font-weight:400;font-size:34px;letter-spacing:.15em;margin:14px 0 10px}
.ab-box h2 span{font-family:var(--mono);font-size:12px;letter-spacing:.4em;color:var(--gold);margin-left:10px}
.ab-lead{font-size:14px;line-height:2;color:rgba(238,241,246,.82)}
.ab-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px 24px;margin:26px 0;padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ab-grid div{font-size:12.5px;line-height:1.8;color:rgba(238,241,246,.72)}
.ab-grid b{display:block;font-weight:400;font-size:11px;letter-spacing:.25em;color:var(--gold);margin-bottom:6px}
.ab-box h3{font-weight:400;font-size:11px;letter-spacing:.3em;color:var(--dim);margin-bottom:10px}
.ab-src{list-style:none;font-size:12px;line-height:1.9;color:rgba(238,241,246,.6)}
.ab-src a{color:var(--cyan);text-decoration:none}
.ab-author{margin-top:22px;font-family:var(--mono);font-size:11px;letter-spacing:.15em;color:var(--dim)}
.ab-author:empty{display:none}

/* 手机 */
@media (max-width:760px){
  .corner{display:none}
  #brand{left:18px;top:calc(14px + env(safe-area-inset-top,0px))}
  #brand span{display:none}
  #readout{left:18px;top:calc(44px + env(safe-area-inset-top,0px));font-size:9px}
  #topright{right:14px;top:calc(10px + env(safe-area-inset-top,0px))}
  #topright .ico{width:30px;height:30px}
  #events{left:10px;right:10px;transform:translateY(10px);justify-content:space-around;bottom:calc(86px + var(--safe-b))}
  #events.on{transform:none}
  #sim-bar{top:calc(52px + env(safe-area-inset-top,0px));width:calc(100vw - 28px)}
  .ab-box{padding:26px 20px}
  #ladder{display:none;position:fixed;right:14px;top:calc(56px + env(safe-area-inset-top,0px));transform:none;padding:10px 14px;border:1px solid var(--line);border-radius:6px;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
  #ladder.open{display:flex}
  #ladder::before{display:none}
  #lv-chip{display:block;position:absolute;right:158px;top:calc(13px + env(safe-area-inset-top,0px));font-size:11px;letter-spacing:.15em;padding:7px 12px;border:1px solid var(--faint);border-radius:30px;color:var(--gold);background:rgba(0,0,0,.3)}
  #toolbar{left:10px;right:10px;transform:none;justify-content:space-between;border-radius:18px;padding:4px}
  #toolbar button{flex-direction:column;gap:4px;padding:8px 2px;font-size:10px;flex:1;letter-spacing:0}
  #toolbar button svg{width:18px;height:18px}
  #timebar{left:10px;right:10px;transform:translateY(10px);bottom:calc(86px + var(--safe-b));gap:8px;padding:6px 6px 6px 14px}
  #timebar.on{transform:none}
  .tb-date{min-width:0;font-size:11px;flex:1}
  .tb-rate{display:none}
  #subtitle{bottom:calc(150px + var(--safe-b));font-size:15px}
  #card{left:0;right:0;top:auto;bottom:0;width:auto;max-height:58vh;transform:translateY(40px);border-radius:16px 16px 0 0;padding:22px 20px calc(20px + var(--safe-b));border-bottom:0}
  #card.on{transform:none}
  #card::before{left:50%;margin-left:-18px;top:8px;width:36px;height:3px;border-radius:3px;background:var(--faint)}
  .card-title{font-size:24px}
  #tour-stop{right:14px;bottom:calc(20px + var(--safe-b))}
  #title-card{top:26vh}
  .tc-btns{flex-direction:column;align-items:center}
  .tc-btns .pill{width:200px}
  .lb.con{font-size:10px}
}