/* LOCK IN — the app (lockin/scene.js). One look: dark glass, cyan HUD lines, gold for coins, one condensed game font. */
body.li-full .app{grid-template-columns:1fr}
body.li-full .rail,body.li-full .top{display:none}
#panel-lockin{position:relative}
.lia-host{position:absolute;inset:0}
.lia{--hud:#7fe0ff;--hudl:rgba(127,224,255,.55);--gold:#f2c35b;--glass:rgba(12,14,20,.58);--glass2:rgba(18,22,30,.78);--txt:#f0f0ff;
  position:absolute;inset:0;overflow:hidden;background:#0b0a0d;color:var(--txt);
  font-family:"Barlow Condensed",Bahnschrift,"Segoe UI",sans-serif;letter-spacing:.03em;user-select:none}
.lia canvas{position:absolute;display:block}
.lia-shade{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,8,12,.72) 0,rgba(8,8,12,0) 16%,rgba(8,8,12,0) 66%,rgba(8,8,12,.78) 100%),
             radial-gradient(ellipse at 50% 45%,rgba(0,0,0,0) 55%,rgba(0,0,0,.45) 100%)}
.lia [hidden]{display:none!important}
.lia svg{width:1em;height:1em;display:block;flex:none}

/* top bar */
.lia-top{position:absolute;left:0;right:0;top:0;display:flex;align-items:center;gap:14px;padding:16px 22px}
.lia-brand{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:700;letter-spacing:.22em;margin-right:auto}
.lia-brand b{color:var(--gold);font-weight:700;margin-left:.28em}
.lia-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;font-size:18px;color:#1a1306;
  background:linear-gradient(160deg,#ffd77a,#c98e22);box-shadow:0 0 18px rgba(242,195,91,.45)}
.lia-chips{display:flex;gap:8px}
.lia-chip{display:flex;align-items:center;gap:8px;height:40px;padding:0 14px;border-radius:12px;background:var(--glass);
  border:1px solid rgba(255,255,255,.09);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:15px}
.lia-chip span{font-size:11px;letter-spacing:.16em;color:rgba(240,240,255,.6)}
.lia-chip b{font-size:19px;font-weight:700}
.lia-chip .lia-coin{font-size:20px}
.lia-coins b{color:var(--gold)}
.lia-steel .lia-ic{color:#c9d3e0;font-size:16px}
.lia-pips,.lia-dots{display:flex;gap:3px;font-style:normal}
.lia-pips em{width:8px;height:16px;border-radius:2px;background:rgba(255,255,255,.14)}
.lia-pips em.on{background:linear-gradient(180deg,#ffe08a,#d39a2a);box-shadow:0 0 8px rgba(242,195,91,.6)}
.lia-dots em{width:10px;height:10px;border-radius:50%;border:1.5px solid rgba(255,255,255,.35)}
.lia-dots em.asked{border-color:var(--hud);box-shadow:0 0 8px var(--hudl)}
.lia-dots em.on{background:#34d39a;border-color:#34d39a;box-shadow:0 0 8px rgba(52,211,154,.7)}
.lia-iconbtn{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;border:1px solid rgba(255,255,255,.1);
  background:var(--glass);color:var(--txt);font-size:18px;cursor:pointer;backdrop-filter:blur(10px);transition:background .15s,border-color .15s}
.lia-iconbtn:hover{background:var(--glass2);border-color:var(--hudl)}

/* the climb overlay */
.lia-climb{position:absolute;inset:0;pointer-events:none}
.lia-hello{position:absolute;left:26px;top:84px;pointer-events:none;text-shadow:0 2px 16px rgba(0,0,0,.6)}
.lia-step{font-size:15px;letter-spacing:.3em;color:rgba(255,236,200,.8)}
.lia-step b{display:block;font-size:76px;line-height:.95;letter-spacing:.02em;color:#fff6e2;font-weight:700}
.lia-step i{font-style:normal;font-size:14px;color:var(--gold);letter-spacing:.12em}
.lia-carry{margin-top:6px;font-size:14px;color:rgba(255,236,210,.75);letter-spacing:.06em}
.lia-sat{position:absolute;left:26px;top:232px;max-width:360px;pointer-events:auto}
.lia-sat .li-today{display:block!important;margin:0!important;background:var(--glass)!important;border:1px solid rgba(255,255,255,.09)!important;
  border-left:3px solid var(--gold)!important;border-radius:12px!important;padding:12px 14px!important;backdrop-filter:blur(10px);
  font-family:"Segoe UI",sans-serif;letter-spacing:0}
.lia-sat .muted{margin:0!important;color:rgba(240,240,255,.62)!important;font-family:"Segoe UI",sans-serif;letter-spacing:0;font-size:13px;max-width:300px;text-shadow:0 1px 8px rgba(0,0,0,.8)}
.lia-bottom{position:absolute;left:22px;right:22px;bottom:22px;display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:16px;pointer-events:none}
.lia-bottom>*{pointer-events:auto}
.lia-chainbtn{justify-self:start}.lia-mebtn{justify-self:end}
.lia-pill{display:inline-flex;align-items:center;gap:9px;height:46px;padding:0 18px;border-radius:14px;background:var(--glass);
  border:1px solid var(--hudl);color:#dff7ff;font:inherit;font-size:15px;letter-spacing:.08em;cursor:pointer;backdrop-filter:blur(10px);
  box-shadow:0 0 22px rgba(80,200,255,.14);transition:background .15s,box-shadow .15s}
.lia-pill:hover{background:var(--glass2);box-shadow:0 0 26px rgba(80,200,255,.3)}
.lia-pill svg{font-size:18px}
.lia-mebtn{border-color:rgba(255,215,150,.45);color:#ffe9c7;box-shadow:none}
.lia-main{display:flex;flex-direction:column;align-items:center;gap:8px}
.lia-go{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:300px;height:76px;padding:0 34px;border:0;border-radius:20px;cursor:pointer;
  font:inherit;color:#1a1204;background:linear-gradient(180deg,#ffe08a 0%,#f2b53c 55%,#d4921f 100%);
  box-shadow:0 10px 34px rgba(242,181,60,.42),inset 0 1px 0 rgba(255,255,255,.65),inset 0 -3px 0 rgba(120,70,0,.35);transition:transform .12s,box-shadow .2s}
.lia-go span{font-size:28px;font-weight:700;letter-spacing:.18em}
.lia-go small{font-size:12px;letter-spacing:.1em;opacity:.7;margin-top:2px}
.lia-go:hover{transform:translateY(-2px);box-shadow:0 14px 40px rgba(242,181,60,.55),inset 0 1px 0 rgba(255,255,255,.65),inset 0 -3px 0 rgba(120,70,0,.35)}
.lia-go:active{transform:translateY(1px)}
.lia-go[disabled]{opacity:.7;cursor:default}
.lia-go.is-done{cursor:default;color:#d9fff0;background:rgba(14,40,32,.72);border:1px solid rgba(52,211,154,.6);box-shadow:0 0 30px rgba(52,211,154,.25);backdrop-filter:blur(10px)}
.lia-status{font-size:13px;letter-spacing:.08em;color:rgba(240,240,255,.75);text-shadow:0 1px 8px rgba(0,0,0,.8)}

/* close-up HUD (his picture 3) */
.lia-close{position:absolute;inset:0;pointer-events:none}
.lia-close button{pointer-events:auto}
.lis-back{position:absolute;left:22px;bottom:22px}
.lis-integrity{position:absolute;left:22%;right:22%;top:82px;display:flex;align-items:center;gap:1.1em;padding:.75em 1.6em;
  border:1.5px solid var(--hudl);background:rgba(8,20,30,.5);clip-path:polygon(2.5% 0,97.5% 0,100% 50%,97.5% 100%,2.5% 100%,0 50%);
  box-shadow:inset 0 0 22px rgba(80,200,255,.25);color:#bdf2ff;font-size:clamp(14px,1.5vw,24px)}
.lis-integrity span{text-shadow:0 0 10px rgba(110,220,255,.8);letter-spacing:.14em}
.lis-bar{flex:1;height:.85em;border:1px solid var(--hudl);background:rgba(0,0,0,.35)}
.lis-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#b48a2c,#f4d27a);box-shadow:0 0 12px rgba(244,210,122,.6);transition:width .6s}
.lis-integrity em{font-style:normal;color:#f4d27a;white-space:nowrap}
.lis-stress{position:absolute;right:5%;top:170px;text-align:center;color:#f0f0ff;font-size:clamp(11px,1.1vw,16px);letter-spacing:.12em;text-shadow:0 1px 8px rgba(0,0,0,.8)}
.lis-stress svg{width:clamp(80px,7vw,120px);height:auto;margin:0 auto 4px}
.lis-stress b{display:block;font-size:1.25em}.lis-stress b.bad{color:#ff5a4e}.lis-stress b.ok{color:#f6b93b}.lis-stress b.good{color:#34d39a}
.lis-callout{position:absolute;transform:translate(-10%,-100%);pointer-events:auto;padding-bottom:26px;color:#bdf2ff;text-shadow:0 0 10px rgba(80,200,255,.7);max-width:340px}
.lis-callout::after{content:"";position:absolute;left:10%;bottom:0;width:1.5px;height:26px;background:var(--hud);box-shadow:0 0 8px var(--hud)}
.lis-callout.lis-left{transform:translate(-90%,-100%);text-align:right}.lis-callout.lis-left::after{left:auto;right:10%}
.lis-calltext b{display:block;font-size:clamp(18px,2vw,32px);line-height:1.05;letter-spacing:.06em}
.lis-calltext span{display:block;font-size:13px;color:#e6f8ff;opacity:.85;margin-top:.4em;letter-spacing:.04em}
.lis-calltext .lis-sat{color:var(--gold)}
.lis-strengthen{display:inline-flex;align-items:center;gap:6px;margin-top:10px;background:rgba(10,30,40,.75);border:1px solid #5fd4ff;color:#e6fbff;
  font:inherit;font-size:14px;letter-spacing:.06em;padding:8px 14px;border-radius:9px;cursor:pointer;box-shadow:0 0 16px rgba(80,200,255,.45)}
.lis-strengthen svg{font-size:16px}
.lis-strengthen small{opacity:.7;font-size:11px}
.lis-strengthen[disabled]{opacity:.6;cursor:default;box-shadow:none}
.lis-quest{position:absolute;right:26px;bottom:26px;text-align:right;color:#bdf2ff;text-shadow:0 0 10px rgba(80,200,255,.6);font-size:clamp(13px,1.4vw,22px);letter-spacing:.1em}
.lis-quest b{display:block;font-weight:600}

/* settings drawer */
.lia-drawer{position:absolute;top:0;right:0;bottom:0;width:min(440px,92vw);background:rgba(12,14,20,.92);border-left:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(16px);transform:translateX(102%);transition:transform .26s ease;display:flex;flex-direction:column;z-index:5}
.lia-drawer.on{transform:none}
.lia-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid rgba(255,255,255,.07);font-size:18px;letter-spacing:.14em}
.lia-drawer-body{overflow-y:auto;padding:6px 20px 24px;font-family:"Segoe UI",sans-serif;letter-spacing:0}
.lia-drawer-body h3{margin:20px 0 8px;font:600 13px "Barlow Condensed",Bahnschrift,"Segoe UI",sans-serif;letter-spacing:.18em;color:var(--hud);text-transform:uppercase}
.lia-drawer-body h3 span{color:rgba(240,240,255,.5)}
.lia-drawer .li-knob{flex-direction:column;align-items:flex-start;gap:7px;border-color:rgba(255,255,255,.07)}
.lia-drawer .li-knob>span{min-width:0;color:rgba(240,240,255,.7)}
.lia-drawer .chip.on{background:var(--hud);border-color:var(--hud);color:#04161e}
.lia-drawer .li-link{border-color:rgba(255,255,255,.12)}

.lia-fade{position:absolute;inset:0;background:#000;opacity:0;pointer-events:none;transition:opacity .18s}
.lia-fade.on{opacity:.85}
.lia-toast{position:absolute;left:50%;top:84px;transform:translate(-50%,-10px);padding:11px 20px;border-radius:12px;background:rgba(10,16,22,.85);
  border:1px solid var(--hudl);color:#e6fbff;font-size:15px;letter-spacing:.05em;opacity:0;transition:.25s;pointer-events:none;box-shadow:0 0 24px rgba(80,200,255,.25);z-index:6}
.lia-toast.on{opacity:1;transform:translate(-50%,0)}
.lia.is-close .lia-shade{background:radial-gradient(ellipse at 50% 50%,rgba(0,0,0,0) 50%,rgba(0,0,0,.55) 100%)}
@media (max-width:900px){
  .lia-chip span{display:none}.lia-brand{font-size:17px}.lia-step b{font-size:52px}
  .lia-bottom{grid-template-columns:1fr 1fr;grid-template-areas:"main main" "chain me"}
  .lia-main{grid-area:main}.lia-chainbtn{grid-area:chain}.lia-mebtn{grid-area:me}
  .lia-go{min-width:240px;height:64px}.lia-sat{display:none}
  .lis-integrity{left:4%;right:4%}
}

/* "Act out this pose" (lockin/pose.js) */
.lip{position:absolute;inset:0;z-index:8;display:grid;grid-template-columns:1fr 380px;background:rgba(6,7,10,.94);backdrop-filter:blur(8px)}
.lip-cam{position:relative;overflow:hidden;background:#000;margin:22px 0 22px 22px;border-radius:18px;border:1px solid var(--hudl);box-shadow:0 0 40px rgba(80,200,255,.15)}
.lip-cam video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}
.lip-ghost{position:absolute;left:50%;bottom:4%;height:88%;transform:translateX(-50%);opacity:.42;pointer-events:none;
  filter:invert(1) sepia(1) saturate(4) hue-rotate(160deg) drop-shadow(0 0 10px rgba(127,224,255,.9))}
.lip-count{position:absolute;inset:0;display:grid;place-items:center;font-size:min(34vh,260px);font-weight:700;color:#fff;
  text-shadow:0 0 40px rgba(127,224,255,.8),0 6px 30px rgba(0,0,0,.8)}
.lip-count.hot{color:var(--gold);text-shadow:0 0 50px rgba(242,195,91,.9),0 6px 30px rgba(0,0,0,.8)}
.lip-flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;transition:opacity .35s}
.lip-flash.on{opacity:.9;transition:none}
.lip-side{display:flex;flex-direction:column;gap:14px;padding:40px 28px}
.lip-kicker{font-size:12px;letter-spacing:.3em;color:var(--hud)}
.lip h2{margin:0;font-size:38px;line-height:1.05;letter-spacing:.04em;font-weight:700}
.lip p{margin:0;font-family:"Segoe UI",sans-serif;letter-spacing:0;font-size:15px;line-height:1.5;color:rgba(240,240,255,.78)}
.lip-example{height:220px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(180deg,#f6c770,#c97a2c);overflow:hidden}
.lip-example img{height:190px;width:auto;filter:drop-shadow(0 0 1px rgba(0,0,0,.6))}
.lip .lia-go{min-width:0;width:100%}
.lip-msg{min-height:20px;font-family:"Segoe UI",sans-serif;letter-spacing:0;font-size:14px;color:rgba(240,240,255,.8)}
.lip-msg.bad{color:#ff8a7e}
.lip-skip{margin-top:auto;background:none;border:0;color:rgba(240,240,255,.5);font:inherit;font-size:13px;letter-spacing:.1em;cursor:pointer}
.lip-skip:hover{color:var(--txt)}
.lip.is-review{display:block;background:none;backdrop-filter:none;pointer-events:none}
.lip-review{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:auto;
  padding:18px 22px;border-radius:20px;background:var(--glass2);border:1px solid var(--hudl);backdrop-filter:blur(12px)}
.lip-btns{display:flex;gap:12px;align-items:center}
.lip-btns .lia-go{min-width:220px;height:64px}
.lip-btns .lia-pill{height:64px}
.lip-say{font-size:13px;letter-spacing:.06em;color:rgba(240,240,255,.7)}
.lip-say b{color:var(--gold)}
.lip.is-review ~ .lia-bottom,.lia:has(.lip.is-review) .lia-bottom{visibility:hidden}
