/* Kemper & Co. v6 — The Cabin: cinematic rooms, HUD, Cabin OS apps. */
:root{--glass:rgba(18,20,23,.62);--glass-b:rgba(255,226,190,.2);--copper:#e69558;--gold:#f2c98f;--ink:#f3eade;--muted:#b4aca2;--serif:Georgia,'Times New Roman',serif;--nav-h:calc(70px + env(safe-area-inset-bottom));--r:16px}
body[data-text=s]{font-size:14px}body[data-text=l]{font-size:17px}
/* ── full-bleed cabin shell ── */
body[data-view=cabin]{padding-bottom:0;overflow:hidden;background:#07090c}
body[data-view=cabin] .topbar{display:none}
body[data-view=cabin] .app-shell{max-width:none;box-shadow:none;background:#07090c}
body[data-view=cabin] main{padding:0;max-width:none}
body[data-view=cabin] .app-nav{width:100%;border-radius:0;border-left:0;border-right:0;background:linear-gradient(180deg,#14171af2,#0b0d0ffc);padding-top:8px;padding-bottom:calc(8px + env(safe-area-inset-bottom))}
.app-nav{grid-template-columns:repeat(5,1fr)!important}
.cabin-view{position:fixed;inset:0 0 var(--nav-h) 0;background:#07090c;overflow:hidden;z-index:1;color:var(--ink)}
.cabin-stage{position:absolute;inset:0}
/* ── stage ── */
.cs-stage{position:absolute;inset:0;overflow:hidden;touch-action:none;cursor:grab;outline:none;background:#06080b;user-select:none;-webkit-user-select:none}
.cs-stage.dragging{cursor:grabbing}
.cs-stage:focus-visible{box-shadow:inset 0 0 0 3px #e69558}
.cs-world{position:absolute;left:0;top:0;will-change:transform;backface-visibility:hidden}
.cs-bg{width:100%;height:100%;display:block;pointer-events:none;-webkit-user-drag:none;transition:filter 1s}
.cs-fx,.cs-sprites{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none}
.cs-hotspots{position:absolute;inset:0}
.cs-vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 46%,transparent 52%,rgba(2,3,8,.62) 100%)}
.cs-grain{position:absolute;inset:-60px;pointer-events:none;background-image:var(--grain);opacity:.55;mix-blend-mode:overlay;animation:grain .7s steps(5) infinite}
body.no-grain .cs-grain,body.calm .cs-grain{display:none}
.cs-dim{position:absolute;inset:0;background:#03040b;opacity:0;pointer-events:none}
.cs-flash{position:absolute;inset:0;background:#d6e4ff;opacity:0;mix-blend-mode:screen;pointer-events:none}
.cs-tint{position:absolute;inset:0;pointer-events:none;transition:background 1.2s;mix-blend-mode:multiply}
.cs-tint[data-weather=rain]{background:rgba(120,150,210,.2)}
.cs-tint[data-weather=storm]{background:rgba(60,80,150,.38)}
.cs-stage.shake{animation:shk .45s}
@keyframes shk{20%{translate:-4px 2px}40%{translate:5px -3px}60%{translate:-3px 3px}80%{translate:2px -1px}}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-30px,18px)}40%{transform:translate(22px,-26px)}60%{transform:translate(-14px,-30px)}80%{transform:translate(28px,22px)}100%{transform:translate(0,0)}}
/* ── hotspots ── */
.hotspot{position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;padding:0;background:none;border:0;color:#fff;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent}
.hotspot .dot{position:absolute;inset:5px;border-radius:50%;display:grid;place-items:center;font-size:15px;line-height:1;background:radial-gradient(circle at 35% 30%,rgba(255,236,205,.28),rgba(14,16,20,.62));border:1px solid rgba(255,214,160,.65);box-shadow:0 4px 18px rgba(0,0,0,.5),0 0 18px rgba(255,170,90,.35);backdrop-filter:blur(6px);transition:transform .25s cubic-bezier(.3,1.6,.5,1),box-shadow .25s}
.hotspot .ring{position:absolute;inset:3px;border-radius:50%;border:2px solid rgba(255,196,128,.75);animation:ping 2.6s ease-out infinite;pointer-events:none}
.hotspot .r2{animation-delay:1.3s}
@keyframes ping{0%{transform:scale(.7);opacity:.9}100%{transform:scale(1.9);opacity:0}}
.hotspot:hover .dot,.hotspot:focus-visible .dot{transform:scale(1.18);box-shadow:0 4px 22px rgba(0,0,0,.6),0 0 30px rgba(255,170,90,.8)}
.hotspot:focus-visible{outline:none}.hotspot:focus-visible .dot{border-color:#fff}
.hotspot.pop .dot{animation:pop .5s cubic-bezier(.3,1.6,.5,1)}
@keyframes pop{0%{transform:scale(.7)}60%{transform:scale(1.35)}100%{transform:scale(1)}}
.hotspot .tag{position:absolute;left:calc(100% - 2px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;white-space:nowrap;padding:5px 11px 5px 10px;border-radius:10px;background:var(--glass);border:1px solid var(--glass-b);backdrop-filter:blur(10px);pointer-events:none;opacity:.94;transition:opacity .2s,transform .2s;box-shadow:0 6px 20px rgba(0,0,0,.4)}
.hotspot .tag b{font:600 11.5px/1.2 ui-sans-serif,system-ui,sans-serif;letter-spacing:.2px;color:#fff3e2}
.hotspot .tag small{font:11px/1.25 ui-sans-serif,system-ui;color:var(--gold);max-height:0;overflow:hidden;opacity:0;transition:max-height .25s,opacity .25s,margin .25s}
.hotspot:hover .tag small,.hotspot:focus-visible .tag small{max-height:22px;opacity:1;margin-top:2px}
.hotspot.tag-left .tag{left:auto;right:calc(100% - 2px);align-items:flex-end;text-align:right}
.hints-off .hotspot .ring,.hints-off .hotspot .tag{display:none}
.hints-off .hotspot .dot{opacity:.25;transform:scale(.7)}
.hints-off .hotspot:hover .dot,.hints-off .hotspot:focus-visible .dot{opacity:1;transform:scale(1.1)}
.hints-off .hotspot:hover .tag,.hints-off .hotspot:focus-visible .tag{display:flex}
@media (pointer:coarse){.hotspot .tag small{display:none}}
/* ── HUD ── */
.cabin-hud{position:absolute;left:0;right:0;z-index:6;pointer-events:none}
.cabin-hud>*{pointer-events:auto}
.cabin-hud.top{top:0;padding:calc(12px + env(safe-area-inset-top)) 14px 46px;display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px 12px;background:linear-gradient(rgba(4,6,9,.78),rgba(4,6,9,0))}
.room-title{flex:1;min-width:0;pointer-events:none;text-shadow:0 2px 18px #000}
.room-title .eyebrow{font-size:9px;letter-spacing:2.4px;color:#f2c79b}
.room-title h1{font:600 clamp(22px,3.6vw,38px)/1.05 var(--serif);margin:3px 0 2px;letter-spacing:-.5px;color:#fff4e5}
.room-title p{margin:0;font-size:12px;color:#e4d4c1;opacity:.9}
.hud-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;min-width:40px;padding:0 11px;border-radius:13px;color:#f6e3c8;background:var(--glass);border:1px solid var(--glass-b);backdrop-filter:blur(12px);cursor:pointer;transition:background .2s,transform .15s,border-color .2s}
.hud-btn:hover{background:rgba(48,40,32,.78);border-color:rgba(255,226,190,.45)}.hud-btn:active{transform:scale(.94)}
.hud-btn svg{width:20px;height:20px;flex:none}
.hud-btn.wide span{font-size:12px;font-weight:600;letter-spacing:.3px}
.hud-cluster{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;max-width:48%}
.hud-btn[aria-pressed=true]{color:var(--copper)}
.cabin-hud.bottom{bottom:0;padding:26px 0 8px;background:linear-gradient(rgba(4,6,9,0),rgba(4,6,9,.78) 65%)}
.room-chips{order:5;flex:1 0 100%;display:flex;gap:7px;overflow-x:auto;padding:2px 0 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.room-chips::-webkit-scrollbar{display:none}
.room-chips a{flex:none;padding:7px 14px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.3px;color:#d9c9b4;background:var(--glass);border:1px solid var(--glass-b);backdrop-filter:blur(10px);transition:all .2s}
.room-chips a.on{color:#1e140c;background:linear-gradient(135deg,#f2c98f,#e69558);border-color:transparent}
.room-chips a:not(.on):hover{color:#fff;border-color:rgba(255,226,190,.5)}
.cabin-dock{display:flex;gap:12px;align-items:flex-end;overflow-x:auto;padding:4px 14px 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.cabin-dock::-webkit-scrollbar{display:none}
.dock-label{flex:none;align-self:center;font:9px/1.3 ui-sans-serif,system-ui;letter-spacing:2px;text-transform:uppercase;color:var(--gold);writing-mode:vertical-rl;transform:rotate(180deg);opacity:.85}
.dock-app{flex:none;display:flex;flex-direction:column;align-items:center;gap:4px;width:60px;background:none;border:0;color:#e9dccb;cursor:pointer;padding:0}
.dock-app i{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;font-style:normal;font-size:22px;background:linear-gradient(145deg,color-mix(in srgb,var(--c) 92%,#fff 8%),color-mix(in srgb,var(--c) 70%,#000));border:1px solid rgba(255,255,255,.22);box-shadow:0 8px 18px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.3);transition:transform .22s cubic-bezier(.3,1.6,.5,1)}
.dock-app:hover i,.dock-app:focus-visible i{transform:translateY(-5px) scale(1.08)}
.dock-app:active i{transform:scale(.92)}
.dock-app span{font-size:9.5px;line-height:1.15;text-align:center;max-width:60px;text-shadow:0 1px 6px #000}
/* intro title */
.intro-card{position:absolute;inset:0;z-index:7;display:grid;place-content:center;text-align:center;pointer-events:none;opacity:0;background:radial-gradient(ellipse at center,rgba(2,3,6,.55),transparent 70%)}
.intro-card.go{animation:introcard 3.4s ease both}
.intro-card .eyebrow{font-size:10px;letter-spacing:5px;color:#f2c79b}
.intro-card h2{font:500 clamp(34px,7vw,74px)/1.05 var(--serif);letter-spacing:2px;margin:12px 0 8px;color:#fff3df;text-shadow:0 4px 40px #000}
.intro-card p{margin:0;font-style:italic;color:#e8d6bf}
@keyframes introcard{0%{opacity:0;transform:scale(1.06);filter:blur(8px)}22%{opacity:1;transform:none;filter:none}72%{opacity:1}100%{opacity:0;transform:scale(.98)}}
/* ── app sheet ── */
.app-sheet{position:absolute;inset:0;z-index:20;display:flex;align-items:flex-end;justify-content:center;background:rgba(3,4,8,.55);backdrop-filter:blur(10px);opacity:0;transition:opacity .25s}
.app-sheet.open{opacity:1}
.sheet-card{width:min(1040px,100%);height:min(97%,940px);display:flex;flex-direction:column;background:linear-gradient(#181b1d,#101214);border:1px solid rgba(255,255,255,.12);border-bottom:0;border-radius:24px 24px 0 0;box-shadow:0 -20px 80px rgba(0,0,0,.6);transform:translateY(40px);transition:transform .35s cubic-bezier(.2,.9,.25,1);overflow:hidden}
.app-sheet.open .sheet-card{transform:none}
.sheet-card>header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px 10px 20px;border-bottom:1px solid rgba(255,255,255,.08);flex:none}
.sheet-card>header b{font:600 17px var(--serif);letter-spacing:.3px;color:#fff1de}
.sheet-body{flex:1;overflow:auto;padding:18px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.app-sheet.full .sheet-body{padding:0}
@media (min-width:900px){.app-sheet{align-items:center}.sheet-card{border-radius:24px;border-bottom:1px solid rgba(255,255,255,.12);height:min(95%,920px)}}
/* ── floor plan ── */
.plan-overlay{position:absolute;inset:0;z-index:25;display:grid;place-items:center;overflow:auto;background:rgba(3,4,8,.78);backdrop-filter:blur(14px);opacity:0;transition:opacity .25s;padding:16px}
.plan-overlay.open{opacity:1}
.plan-card{position:relative;width:min(760px,100%);margin:auto;padding:20px 16px 18px;text-align:center}
.plan-card h2{font:500 clamp(26px,5vw,40px) var(--serif);margin:4px 0 14px;color:#fff1de}
.plan-x{position:absolute;right:4px;top:4px}
.plan-house{position:relative;display:grid;gap:8px;padding-top:0}
.plan-roof{width:100%;height:78px;overflow:visible}
.plan-roof .smoke circle{fill:#fff;opacity:0;animation:smoke 4s ease-out infinite}
.plan-roof .smoke circle:nth-child(2){animation-delay:1.3s}.plan-roof .smoke circle:nth-child(3){animation-delay:2.6s}
@keyframes smoke{0%{opacity:.5;transform:translateY(8px) scale(.5)}100%{opacity:0;transform:translateY(-30px) scale(1.8)}}
.floor{display:grid;gap:8px;grid-template-columns:repeat(3,1fr);position:relative;padding-top:20px}
.floor.out{grid-template-columns:1fr}
.floor>b{position:absolute;top:0;left:2px;font:9px ui-sans-serif,system-ui;letter-spacing:2.2px;text-transform:uppercase;color:var(--gold)}
.plan-room{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:118px;padding:10px 12px;text-align:left;border-radius:14px;overflow:hidden;background:linear-gradient(transparent 20%,rgba(4,5,8,.88)),var(--img) center/cover;border:1px solid rgba(255,226,190,.22);color:#fff;transition:transform .25s,border-color .25s,box-shadow .25s}
.plan-room:hover{transform:translateY(-3px) scale(1.015);border-color:#f2c98f;box-shadow:0 14px 34px rgba(0,0,0,.5),0 0 30px rgba(230,149,88,.3)}
.plan-room.here{border-color:#e69558}
.plan-room .pr-name{font:600 15px var(--serif)}
.plan-room small{font-size:10.5px;color:#d8c8b3;line-height:1.3;margin-top:2px}
.plan-room em{position:absolute;top:8px;left:10px;font:600 9px ui-sans-serif,system-ui;letter-spacing:1.4px;text-transform:uppercase;color:#1e140c;background:#f2c98f;padding:3px 8px;border-radius:99px}
.plan-room .win{position:absolute;top:10px;right:10px;width:9px;height:9px;border-radius:50%;background:#ffd48a;box-shadow:0 0 12px 3px #ffb55e;animation:winkle 3s ease-in-out infinite}
@keyframes winkle{50%{opacity:.55}}
.plan-tip{font-size:11px;color:var(--muted);margin:14px 0 0}
@media (max-width:560px){.cabin-hud.top .hud-btn.wide{margin-right:auto}.hud-cluster{max-width:none;flex-wrap:nowrap;gap:6px}.hud-cluster .hud-btn{height:38px;min-width:38px;padding:0 8px}.room-title{order:4;flex:1 0 100%}.room-title .eyebrow{display:none}.room-title h1{font-size:26px}.cabin-hud.top{padding-bottom:36px}.floor,.floor.up{grid-template-columns:repeat(3,1fr)}.plan-room{min-height:84px;padding:8px}.plan-room small{display:none}.plan-room .pr-name{font-size:13px}.dock-app span{display:none}.dock-app{width:50px}.cabin-hud.bottom{padding-top:18px}.floor{grid-template-columns:1fr 1fr}.floor.up{grid-template-columns:1fr 1fr}.plan-room{min-height:96px}.hud-btn.wide span{display:none}.hud-btn.wide{padding:0}.room-title p{display:none}.hud-cluster{max-width:40%}.dock-label{display:none}}
/* ── sprites ── */
.spr{position:absolute;transform-origin:50% 100%}
.chimes{transform-origin:50% 0}.chimes.swing{animation:swing 2.2s ease-out}
.chimes .pipe{transform-origin:50% 0;transform-box:fill-box}
.chimes.swing .p0{animation:swing 2.2s .02s ease-out}.chimes.swing .p1{animation:swing 2.4s .1s ease-out reverse}.chimes.swing .p2{animation:swing 2.1s .05s ease-out}.chimes.swing .p3{animation:swing 2.5s .14s ease-out reverse}.chimes.swing .p4{animation:swing 2.3s .08s ease-out}
@keyframes swing{0%{transform:rotate(0)}12%{transform:rotate(9deg)}28%{transform:rotate(-7deg)}46%{transform:rotate(5deg)}64%{transform:rotate(-3deg)}82%{transform:rotate(1.5deg)}100%{transform:rotate(0)}}
.rocker .rock-body{transform-origin:50% 94%;transform-box:view-box}
.rocker.rocking .rock-body{animation:rock 3.2s ease-in-out}
@keyframes rock{0%{transform:rotate(0)}15%{transform:rotate(6deg)}35%{transform:rotate(-5deg)}55%{transform:rotate(3.5deg)}75%{transform:rotate(-2deg)}100%{transform:rotate(0)}}
.rocker svg,.chimes svg{width:100%;height:auto;display:block;overflow:visible;filter:drop-shadow(0 8px 10px rgba(0,0,0,.45))}
.balls i{position:absolute;left:var(--x);top:var(--y);width:12%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 34% 28%,#fffc,transparent 34%),var(--c);box-shadow:0 2px 4px #000a}
.balls.scatter i{animation:scatter 2.6s cubic-bezier(.15,.8,.25,1)}
@keyframes scatter{0%{transform:translate(0,0)}30%{transform:translate(calc(var(--dx)*2.2),calc(var(--dy)*1.3))}100%{transform:translate(0,0)}}
.corkboard{background:radial-gradient(circle at 20% 30%,#c79763 0 6%,transparent 7%),radial-gradient(circle at 75% 65%,#a97c4c 0 5%,transparent 6%),#b88a5a;border:5px solid #5b3a1e;border-radius:4px;box-shadow:0 8px 16px #000a;transform:rotate(-3deg);display:grid;place-items:center;font:700 clamp(8px,1.1vw,15px)/1.1 var(--serif);text-align:center;color:#3b2412;letter-spacing:1.5px}
.corkboard i{position:absolute;width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f66,#a11)}
.corkboard svg{position:absolute;inset:0;width:100%;height:100%}
.plaque{background:linear-gradient(#6b4524,#3d2512);border:2px solid #b78b4c;border-radius:6px;padding:6px 8px;text-align:center;box-shadow:0 6px 14px #000a;color:#f5d9a4;font-family:var(--serif);transform:rotate(1.5deg)}
.plaque b{display:block;font-size:clamp(8px,1.05vw,14px);letter-spacing:2px}.plaque small{font-size:clamp(6px,.8vw,10px);opacity:.8}
.neon::after{content:'';position:absolute;inset:-30%;background:radial-gradient(ellipse,rgba(255,138,61,.55),transparent 65%);opacity:0;mix-blend-mode:screen}
.neon.zap::after{animation:neonzap 1.4s steps(1) both}
@keyframes neonzap{0%{opacity:0}8%{opacity:1}14%{opacity:.1}22%{opacity:1}30%{opacity:0}42%{opacity:.8}50%{opacity:.2}60%{opacity:1}100%{opacity:0}}
/* ── shared app atoms ── */
.seg{display:inline-flex;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:3px;gap:2px;flex-wrap:wrap}
.seg button{background:none;color:#cdbfae;border-radius:9px;padding:7px 12px;font-size:12.5px;font-weight:600;text-transform:capitalize}
.seg button.on{background:linear-gradient(135deg,#f2c98f,#e69558);color:#1e140c}
.ghost{background:rgba(255,255,255,.07);color:#f1e2cc;border:1px solid rgba(255,255,255,.14);border-radius:11px;padding:9px 14px}
.mini{font-size:12px;color:var(--muted)}.center{text-align:center}
.sheet-body label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--muted)}
.sheet-body input,.sheet-body select,.sheet-body textarea,.opts input[type=text]{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);color:#f3eade;border-radius:10px;padding:9px 11px;font-size:14px;width:100%}
.sheet-body input[type=range]{padding:0;accent-color:#e69558}
.sheet-body input[type=checkbox]{width:auto}
.sheet-body button:not(.dock-app):not(.hud-btn):not(.seg button){font-family:inherit}
.sheet-body .primary{background:linear-gradient(135deg,#f2c98f,#e69558);color:#1e140c;border-radius:11px;padding:11px 18px;font-weight:700;border:0;display:inline-block}
.sheet-body button:not(.primary):not(.rec-btn):not(.pk):not(.quote-card):not(.sleeve):not(.back-btn){background:rgba(255,255,255,.08);color:#f1e2cc;border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:8px 13px;font-size:13px}
.sheet-body button:disabled{opacity:.4}
.sheet-body .studio-loading{padding:40px;text-align:center;color:var(--muted)}
.sheet-body .panel{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:16px;color:#f3eade;padding:20px;margin:16px}
.sheet-body .panel h2,.sheet-body h2{font:500 28px var(--serif);color:#fff1de;margin:6px 0}
.sheet-body h3{font:600 17px var(--serif);color:#f6e3c8;margin:18px 0 8px}
.sheet-body .eyebrow{font-size:10px;letter-spacing:2.2px;color:#f2c79b;text-transform:uppercase;font-weight:650}
.sheet-body p{color:#d6cabb}
.sheet-body .personal-note{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:12px 14px;margin:10px 0}
.sheet-body .personal-note p{margin:4px 0 0}
.sheet-body .field-specimens{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0}.sheet-body .field-specimens span{background:rgba(255,255,255,.06);border-radius:12px;padding:8px 12px;display:flex;gap:8px;align-items:center}
.sheet-body .subtle,.sheet-body .save-note{font-size:11.5px;color:var(--muted)}
/* ── piano ── */
.piano-app{padding:16px;display:flex;flex-direction:column;gap:12px;min-height:100%;background:radial-gradient(ellipse at 50% 0,#2a2118,#101214 70%)}
.piano-top{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.sustain{flex-direction:row!important;align-items:center;gap:6px!important}
.piano-hint{margin:0;color:var(--gold)!important;font-size:13px}
.piano-lid{margin-top:auto;padding:14px 12px 18px;border-radius:16px;background:linear-gradient(#3b2415,#1e120a);box-shadow:0 20px 40px #000a,inset 0 2px 0 #fff2}
.piano-keys{position:relative;display:flex;height:min(46vh,300px);gap:2px;touch-action:none}
.pk{position:relative;border:0;cursor:pointer;touch-action:none;transition:transform .08s,filter .15s}
.pk.white{flex:1;background:linear-gradient(#fbf5e8,#e4d9c0 90%,#cfc2a3);border-radius:0 0 9px 9px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:10px;color:#6a5a45;box-shadow:inset 0 -6px 0 #b9ab8a}
.pk.white span{font:600 12px ui-sans-serif,system-ui}.pk.white kbd{font:10px ui-monospace,monospace;opacity:.5;margin-top:2px}
.pk.black{position:absolute;top:0;width:4.8%;height:62%;background:linear-gradient(#2d2a29,#0a0908);border-radius:0 0 7px 7px;z-index:2;box-shadow:0 6px 8px #0008,inset 0 -6px 0 #000}
.pk.down.white{transform:translateY(3px);filter:brightness(.9);background:linear-gradient(#f3d8a8,#e8c07a)}.pk.down.black{transform:translateY(2px);background:linear-gradient(#5a4a30,#1a1208)}
.pk.next{box-shadow:0 0 0 3px #e69558,0 0 28px 6px rgba(230,149,88,.8),inset 0 -6px 0 #b9ab8a;animation:nextpulse 1s ease-in-out infinite}
.pk.next.black{background:linear-gradient(#c97d3d,#7a4310)}
@keyframes nextpulse{50%{filter:brightness(1.18)}}
.pk-ripple{position:absolute;left:50%;bottom:30px;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:radial-gradient(#ffd48a,transparent 70%);animation:pkr .7s ease-out forwards;pointer-events:none}
@keyframes pkr{to{transform:translateY(-160px) scale(5);opacity:0}}
.piano-prog{height:4px;background:rgba(255,255,255,.1);border-radius:3px;overflow:hidden}.piano-prog i{display:block;height:100%;width:0;background:#e69558;transition:width .3s}
/* ── stargazer ── */
.stars-app{padding:14px;display:flex;flex-direction:column;gap:12px;min-height:100%;background:linear-gradient(#070918,#12132b)}
.star-tabs{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.star-tabs button.on{background:#e69558!important;color:#1e140c!important}.star-tabs .wish{margin-left:auto;font-size:12px;color:var(--gold)}
.star-sky{position:relative;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.14);box-shadow:0 20px 50px #0008}
.star-sky canvas{display:block;width:100%;touch-action:manipulation;cursor:crosshair}
.star-caption{position:absolute;left:12px;right:12px;bottom:12px;padding:14px 16px;border-radius:14px;background:rgba(8,10,24,.82);border:1px solid rgba(160,200,255,.35);backdrop-filter:blur(8px);opacity:0;transform:translateY(12px);transition:all .5s;pointer-events:none}
.star-caption.show{opacity:1;transform:none}.star-caption b{display:block;font:600 18px var(--serif);color:#cfe3ff;margin-bottom:4px}.star-caption span{font-size:13px;color:#d8e3f5;line-height:1.5}
.star-note{font-size:12px;color:var(--muted);margin:0}
/* ── bullseye ── */
.darts-app{padding:14px;display:flex;flex-direction:column;align-items:center;gap:10px;min-height:100%;background:radial-gradient(ellipse at 50% 30%,#2a1c12,#0d0907)}
.darts-bar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:center}.darts-bar #stat{font-size:13px;color:#e9dccb}.darts-bar #stat b{color:#9c8f80;font-weight:600}.darts-bar #stat b.on{color:#ffd37a}
.darts-app canvas{border-radius:18px;border:1px solid rgba(255,255,255,.12);touch-action:none;cursor:crosshair;box-shadow:0 20px 50px #000a}
.darts-help{margin:0;min-height:40px;text-align:center;color:#ffd9a0!important;font-size:14px}
/* ── cheer beat ── */
.cheer-app{min-height:100%;padding:14px;background:radial-gradient(ellipse at 50% 0,#2d1740,#0e1020 70%)}
.cheer-menu{text-align:center;padding:30px 10px}.cheer-menu h2{font-size:42px!important}
.cheer-levels{display:grid;gap:10px;max-width:420px;margin:20px auto 0}.cheer-levels button{display:flex!important;flex-direction:column;align-items:center;padding:16px!important;font-size:18px!important;border-radius:16px!important;background:linear-gradient(135deg,rgba(232,82,122,.2),rgba(88,166,255,.2))!important}.cheer-levels small{font-size:12px;color:#d6cabb}
.cheer-stage{position:relative;max-width:520px;margin:0 auto;border-radius:20px;overflow:hidden;border:1px solid rgba(255,255,255,.15)}
.cheer-stage canvas{display:block;width:100%;touch-action:none}
.cheer-hud{position:absolute;top:10px;left:14px;right:14px;display:flex;align-items:baseline;gap:12px;pointer-events:none}.cheer-hud b{font:700 28px ui-sans-serif,system-ui;color:#fff}.cheer-hud span{color:#ffd37a;font-weight:700;font-size:14px}.cheer-hud em{margin-left:auto;font:700 38px ui-sans-serif,system-ui;font-style:normal;color:rgba(255,255,255,.85)}
.cheer-hud em.pulse{animation:cnt .4s ease-out}@keyframes cnt{0%{transform:scale(1.5);opacity:.4}100%{transform:none;opacity:1}}
.cheer-pads{position:absolute;left:0;right:0;bottom:0;height:86px;display:grid;grid-template-columns:repeat(4,1fr)}
.cheer-pads button{background:linear-gradient(transparent,color-mix(in srgb,var(--c) 38%,transparent))!important;border:0!important;border-top:3px solid var(--c)!important;border-radius:0!important;color:#fff;display:grid;place-items:end center;padding-bottom:8px!important;touch-action:none}
.cheer-pads button.hit{background:linear-gradient(transparent,var(--c))!important}.cheer-pads kbd{font:11px ui-monospace,monospace;opacity:.6}
.cheer-results{position:absolute;inset:0;display:grid;place-content:center;gap:6px;text-align:center;background:rgba(10,10,24,.9);backdrop-filter:blur(8px);padding:20px}.cheer-results h3{font:600 30px var(--serif);margin:0;color:#fff}.res-stars{font-size:38px;color:#ffd37a;letter-spacing:4px}
/* ── terrarium ── */
.terra-app{min-height:100%;padding:14px;background:radial-gradient(ellipse at 50% 0,#1a2d2a,#0e1415 70%)}
.terra-app canvas{display:block;margin:0 auto;border-radius:18px;border:6px solid #2c3b38;box-shadow:0 20px 50px #000a,inset 0 0 40px #0008}
.terra-hud{max-width:900px;margin:14px auto 0;display:grid;gap:12px}
.meters{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.meters label{font-size:11px}.meters i{display:block;height:8px;border-radius:5px;background:rgba(255,255,255,.1);overflow:hidden}.meters b{display:block;height:100%;background:linear-gradient(90deg,#5aa14a,#a7d66b);transition:width .4s}.meters b.low{background:linear-gradient(90deg,#c0392b,#e69558)}
.terra-actions{display:flex;gap:8px;flex-wrap:wrap}.terra-actions button{flex:1;min-width:110px}
.terra-hud .fact{margin:0;font-size:13px;color:#cfe0c8;min-height:40px}.terra-hud small{color:var(--muted);font-size:11px}.rename{max-width:220px}
/* ── chords ── */
.chords-app{padding:16px;min-height:100%;background:radial-gradient(ellipse at 50% 0,#2b2016,#101214 70%)}
.chord-grid{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.chord-grid button{width:54px;height:46px;font:700 17px var(--serif)!important}.chord-grid button.on{background:linear-gradient(135deg,#f2c98f,#e69558)!important;color:#1e140c!important}
.chord-stage{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:20px;align-items:center;margin-top:18px}
.chord-svg{width:100%;max-width:300px;margin:auto;display:block;background:linear-gradient(#3a2415,#241408);border-radius:16px;padding:6px;border:1px solid rgba(255,255,255,.12)}
.chord-svg .cn{font:700 22px var(--serif);fill:#ffe9c8}.chord-svg .mx{font:700 15px ui-sans-serif;fill:#e8d5b0}
.chord-svg .str.vib{animation:vib .09s linear 6}@keyframes vib{50%{transform:translateX(1.5px)}}
.chord-side{display:grid;gap:12px}.strum{font-size:18px!important;padding:16px!important}kbd{font:11px ui-monospace,monospace;opacity:.7;margin-left:6px}
.fb{margin:0;min-height:44px;font-size:14px;color:#d6cabb}.fb.good{color:#9be28c;font-weight:700}
@media (max-width:640px){.chord-stage{grid-template-columns:1fr}}
/* ── loft ── */
.loft-app{padding:18px;min-height:100%;background:radial-gradient(ellipse at 50% 0,#2a1a14,#101214 70%)}
.loft-head h2{font-size:34px!important}.loft-controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:16px 0}.loft-controls .chk{flex-direction:row;align-items:center;gap:8px}
.rec-deck{background:#0b0c0e;border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:14px}
#wave{width:100%;height:90px;display:block;background:repeating-linear-gradient(90deg,#14171a 0 3px,#0e1012 3px 6px);border-radius:10px}
.rec-row{display:flex;align-items:center;gap:14px;margin-top:12px}.rec-row b{font:700 22px ui-monospace,monospace;color:#fff}.rec-row span{font-size:12px;color:var(--muted)}
.rec-btn{width:58px;height:58px;border-radius:50%;background:#1b1d20!important;border:3px solid #f3eade!important;display:grid;place-items:center;padding:0!important;flex:none}
.rec-btn i{display:block;width:26px;height:26px;border-radius:50%;background:#e23b3b;transition:all .2s}.rec-btn.on i{border-radius:6px;width:20px;height:20px;animation:recp 1s infinite}
@keyframes recp{50%{box-shadow:0 0 0 8px rgba(226,59,59,.25)}}
.take-list{display:grid;gap:10px}.take{display:grid;grid-template-columns:1fr;gap:8px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:12px}.take small{display:block;color:var(--muted);font-size:11.5px}.take audio{width:100%;height:38px}.take.pending{border-color:#e69558}
@media (min-width:640px){.take:not(.pending){grid-template-columns:1fr minmax(180px,320px) auto auto;align-items:center}}
/* ── record bin ── */
.records-app{padding:18px 18px 28px;min-height:100%;background:radial-gradient(ellipse at 50% 0,#33231a,#101214 72%);overflow:hidden}
.rec-wall h2{font-size:34px!important}.rec-wall p{max-width:560px}
.crate{position:relative;height:min(52vw,330px);min-height:250px;margin:20px auto 0;perspective:1100px;transform-style:preserve-3d}
.crate:after{content:'';position:absolute;left:5%;right:5%;bottom:-8px;height:34px;background:linear-gradient(#6a4526,#2c1a0d);border-radius:6px 6px 10px 10px;box-shadow:0 18px 30px #000a;z-index:20;pointer-events:none}
.sleeve{--s:min(44vw,280px);position:absolute;left:50%;top:0;width:var(--s);height:var(--s);margin-left:calc(var(--s)/-2);transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.9,.25,1),opacity .4s;transform:translateX(calc(var(--o)*46%)) translateZ(calc(var(--o) * var(--o) * -60px)) rotateY(calc(var(--o)*-34deg));cursor:pointer;padding:0!important;background:none!important;border:0!important}
.sleeve.front{transform:translateZ(60px)}.sleeve.front.flip{transform:translateZ(60px) rotateY(180deg)}
.sleeve .face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:6px;overflow:hidden;box-shadow:0 14px 34px #000a}
.front-face{background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 55%,#000))}
.sl-art{position:absolute;inset:10%;display:flex;flex-direction:column;justify-content:flex-end;border:2px solid rgba(255,255,255,.35);padding:12px;text-align:left}.sl-art span{font:700 clamp(16px,3.4vw,24px)/1.1 var(--serif);color:#fff6e6;text-shadow:0 2px 10px #0006}.sl-art small{margin-top:6px;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:#ffe6c0}
.sl-disc{position:absolute;right:-30%;top:12%;width:90%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#c33 0 14%,#111 15% 100%);z-index:-1;opacity:.0}
.back-face{transform:rotateY(180deg);background:linear-gradient(#efe3cc,#d8c8a8);color:#2e2216;padding:16px;display:flex;flex-direction:column;gap:6px;overflow:auto}.back-face b{font:700 19px var(--serif)}.back-face em{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:#7a5b32;font-style:normal}.back-face p{margin:6px 0;font-size:13.5px;line-height:1.5;color:#3e3020!important}.back-face small{color:#7a6a52;margin-top:auto}.back-face .del{align-self:flex-start;background:#0001!important;color:#6a2a22!important;border:1px solid #6a2a2244!important;font-size:11px!important;padding:4px 9px!important}
.crate-nav{display:flex;align-items:center;justify-content:center;gap:18px;margin:28px 0 8px;color:var(--muted);font-size:13px}.crate-nav button{width:44px;height:44px;border-radius:50%!important}
.turntable{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;margin-top:12px;padding:18px;border-radius:18px;background:linear-gradient(#2a1c12,#1a110a);border:1px solid rgba(255,255,255,.1)}
.deck{position:relative;width:170px;height:170px;background:#120d09;border-radius:12px;box-shadow:inset 0 0 0 2px #3b2a1c}
.platter{position:absolute;inset:12px;border-radius:50%;background:#050505}.vinyl{position:absolute;inset:0;border-radius:50%;background:repeating-radial-gradient(circle,#0a0a0a 0 2px,#161616 3px 4px),conic-gradient(from 20deg,transparent,rgba(255,255,255,.14),transparent 25%,transparent 50%,rgba(255,255,255,.14),transparent 75%);display:grid;place-items:center}.vinyl i{width:34%;aspect-ratio:1;border-radius:50%;box-shadow:0 0 0 3px #0003}
.platter.spin .vinyl{animation:spin 1.8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.arm{position:absolute;right:12px;top:10px;width:5px;height:96px;background:linear-gradient(#e8d5b0,#a89472);border-radius:3px;transform-origin:50% 6px;transform:rotate(-24deg);transition:transform .8s cubic-bezier(.3,1.3,.5,1);box-shadow:2px 3px 6px #0008}.arm.down{transform:rotate(-2deg)}
.np h3{font:600 22px var(--serif);margin:4px 0 2px!important}.np p{margin:0 0 12px}.np-btns{display:flex;gap:8px;flex-wrap:wrap}.np-btns a.primary{padding:11px 18px;border-radius:11px;font-weight:700;text-decoration:none}
.embed{grid-column:1/-1;width:100%;border:0;border-radius:12px;background:#000}
.add-rec{margin-top:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:12px 14px}.add-rec summary{cursor:pointer;font-weight:700;color:var(--gold)}.add-rec form{display:grid;gap:10px;margin-top:12px}
@media (max-width:560px){.cabin-hud.top .hud-btn.wide{margin-right:auto}.hud-cluster{max-width:none;flex-wrap:nowrap;gap:6px}.hud-cluster .hud-btn{height:38px;min-width:38px;padding:0 8px}.room-title{order:4;flex:1 0 100%}.room-title .eyebrow{display:none}.room-title h1{font-size:26px}.cabin-hud.top{padding-bottom:36px}.floor,.floor.up{grid-template-columns:repeat(3,1fr)}.plan-room{min-height:84px;padding:8px}.plan-room small{display:none}.plan-room .pr-name{font-size:13px}.dock-app span{display:none}.dock-app{width:50px}.cabin-hud.bottom{padding-top:18px}.turntable{grid-template-columns:1fr;justify-items:center;text-align:center}.np-btns{justify-content:center}}
/* ── proverbs ── */
.proverbs-app{padding:18px 18px 40px;min-height:100%;background:radial-gradient(ellipse at 50% 0,#2e2314,#101214 70%)}
.pv-head h2{font-size:36px!important}.pv-head p{max-width:600px}.pv-head .seg{margin-top:8px}
.quote-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-top:20px}
.quote-card{text-align:left;display:flex;flex-direction:column;gap:8px;padding:18px!important;border-radius:16px!important;background:linear-gradient(160deg,#3a2c1c,#1d150d)!important;border:1px solid rgba(242,201,143,.28)!important;min-height:170px;transition:transform .25s,border-color .25s,box-shadow .25s}
.quote-card:hover{transform:translateY(-4px) rotate(-.4deg);border-color:#f2c98f!important;box-shadow:0 14px 30px #0008}
.quote-card q{font:italic 500 17px/1.35 var(--serif);color:#fff1da;quotes:'“' '”'}.quote-card span{margin-top:auto;font-weight:700;font-size:12.5px;color:#f2c98f}.quote-card small{font-size:11px;color:#a89a86}
.quote-open{max-width:720px;margin:12px auto 0}.back-btn{background:none!important;border:0!important;padding:4px 0!important;color:var(--gold)!important}
.quote-open blockquote{font:italic 500 clamp(24px,4.4vw,36px)/1.25 var(--serif);color:#fff1da;margin:18px 0 12px;padding-left:16px;border-left:3px solid #e69558}
.quote-open .by{color:#d6cabb;margin:0 0 8px}.quote-open .by small{color:#a89a86}
.src-badge{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;padding:4px 10px;border-radius:99px}.src-badge.ok{background:rgba(120,200,130,.16);color:#a4e0aa}.src-badge.warn{background:rgba(240,190,90,.16);color:#f0cc7c}
.ctx{font-size:15.5px;line-height:1.7;color:#e1d6c6!important}
.ask{margin:18px 0;padding:16px 18px;border-radius:14px;background:rgba(230,149,88,.1);border:1px solid rgba(230,149,88,.35)}.ask p{font:italic 18px/1.4 var(--serif);margin:6px 0 0;color:#ffe2bd!important}
.reflect{display:grid;gap:10px;padding:16px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}.reflect .rec-row{margin:0}.reflect canvas{flex:1;min-width:0;height:56px;background:#0b0c0e;border-radius:8px}
.listen-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-top:12px}
.listen-card{display:grid;gap:8px;padding:14px;border-radius:14px;background:linear-gradient(160deg,#2d3a3a,#182020);border:1px solid rgba(255,255,255,.12)}.listen-card.text{background:linear-gradient(160deg,#3a3224,#1e1a12)}.listen-card q{font:italic 14px/1.35 var(--serif);color:#ffe9cc}.listen-card audio{width:100%;height:36px}.listen-card .row{display:flex;justify-content:space-between;align-items:center}
/* ── options ── */
.opts{display:grid;gap:14px;color:#f3eade}.opts h2{font:500 30px var(--serif);margin:0}.opts h3{font:600 13px ui-sans-serif,system-ui;letter-spacing:1.8px;text-transform:uppercase;color:var(--gold);margin:0 0 8px}
.opts section{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:14px 16px}
.opt-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:9px 0;flex-wrap:wrap}.opt-row+.opt-row{border-top:1px solid rgba(255,255,255,.07)}.opt-row label{display:flex;flex-direction:column;font-size:14px}.opt-row label small{font-size:11.5px;color:var(--muted)}.opt-row input[type=range]{width:min(220px,100%);accent-color:#e69558}
.opts .seg button{color:#cdbfae;background:none;border:0;padding:7px 11px;font-size:12px}.opts .seg button.on{background:linear-gradient(135deg,#f2c98f,#e69558);color:#1e140c}
.opt-note{font-size:11.5px;color:var(--muted);margin:2px 0 4px}
.switch{appearance:none;width:46px;height:28px;border-radius:99px;background:#3a3a3a;position:relative;cursor:pointer;transition:background .2s;flex:none}.switch:after{content:'';position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform .2s}.switch:checked{background:#e69558}.switch:checked:after{transform:translateX(18px)}
#info:has(.opts){max-width:min(580px,94vw);width:min(580px,94vw);padding:22px;max-height:90vh}#info:has(.opts) .close{z-index:2}.opts .seg{max-width:100%}
/* ── table themes ── */
body[data-card=midnight] .card-back{background:repeating-linear-gradient(45deg,#1d2447 0 3px,#2a3366 4px 6px)!important;border-color:#9aa6e8!important}
body[data-card=rose] .card-back{background:repeating-linear-gradient(45deg,#6b2f45 0 3px,#8a3f5a 4px 6px)!important;border-color:#e6b3c4!important}
body[data-felt=burgundy] .table-felt{background:radial-gradient(ellipse at center,#7a4045,#381c21)!important}
body[data-felt=slate] .table-felt{background:radial-gradient(ellipse at center,#4d5c6c,#222b35)!important}
.playing-card{transition:transform .22s cubic-bezier(.3,1.4,.5,1),box-shadow .22s}
.playing-card:not(:disabled):hover{transform:translateY(-6px) rotate(-1deg);box-shadow:0 14px 24px #0008}
.table-game{animation:tg-in .6s cubic-bezier(.2,.9,.3,1) both}
.table-game:nth-child(2){animation-delay:.05s}.table-game:nth-child(3){animation-delay:.1s}.table-game:nth-child(4){animation-delay:.15s}.table-game:nth-child(5){animation-delay:.2s}.table-game:nth-child(6){animation-delay:.25s}.table-game:nth-child(7){animation-delay:.3s}.table-game:nth-child(8){animation-delay:.35s}
@keyframes tg-in{from{opacity:0;translate:0 24px}}
.confetti{position:fixed;inset:0;pointer-events:none;z-index:60;overflow:hidden}.confetti i{position:absolute;top:-12px;width:9px;height:14px;border-radius:2px;animation:cf var(--d) cubic-bezier(.2,.6,.3,1) forwards}
@keyframes cf{to{transform:translate(var(--x),105vh) rotate(var(--r));opacity:.9}}
/* ── draft features finally styled: Wildwater, Scene Stealer, Paperback ── */
.dream-stage{position:relative;min-height:100%;isolation:isolate;overflow:hidden;color:#f3eade;display:flex;flex-direction:column;padding:16px}
.dream-landscape{position:absolute;inset:0;z-index:-3;background-size:cover;background-position:var(--focus,50%) 50%;transition:background-position 1.2s ease;animation:slowpan 50s ease-in-out infinite alternate}
@keyframes slowpan{from{transform:scale(1.04) translateX(-1.5%)}to{transform:scale(1.12) translateX(1.5%)}}
.dream-mist{position:absolute;inset:0;z-index:-2;background:linear-gradient(rgba(4,7,13,.15),rgba(4,7,13,.2) 35%,rgba(4,7,13,.88))}
.dream-stage.weather-rain .dream-landscape{filter:saturate(.8) brightness(.8)}.dream-stage.weather-night .dream-landscape{filter:brightness(.55) saturate(1.1) hue-rotate(10deg)}
.dream-sparks{position:absolute;inset:0;z-index:-1;pointer-events:none}.dream-sparks i{position:absolute;left:calc(var(--i)*6%);bottom:-10px;width:3px;height:3px;border-radius:50%;background:#ffe08a;box-shadow:0 0 8px 2px #ffc85a;animation:rise calc(7s + var(--i)*.6s) linear calc(var(--i)*-.9s) infinite}
@keyframes rise{to{transform:translate(calc((var(--i) - 8)*4px),-70vh);opacity:0}}
.dream-heading{text-shadow:0 2px 18px #000}.dream-heading a{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#f2c79b}.dream-heading h1{font:500 clamp(34px,7vw,60px)/1.05 var(--serif);margin:6px 0;color:#fff3df}.dream-heading p{margin:0;color:#e8d6bf}
.weather-switch{display:flex;gap:6px;margin:10px 0}.weather-switch button{background:rgba(18,20,23,.6)!important;border:1px solid rgba(255,226,190,.25)!important;color:#f1e2cc;border-radius:99px!important;text-transform:capitalize;padding:6px 14px!important;font-size:12px!important}.weather-switch button[aria-pressed=true]{background:#e69558!important;color:#1e140c!important}
.lake-map{position:absolute;inset:0;pointer-events:none;z-index:0}
.lake-pin{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:3px;background:none!important;border:0!important;color:#ffe9b8;font-size:18px;padding:0!important}.lake-pin span{font-size:10.5px;background:rgba(18,20,23,.7);padding:3px 8px;border-radius:8px;white-space:nowrap;border:1px solid rgba(255,226,190,.25)}.lake-pin.selected{color:#fff;text-shadow:0 0 14px #ffb55e}.lake-pin:before{content:'';position:absolute;top:-6px;width:30px;height:30px;border-radius:50%;border:2px solid rgba(255,200,130,.6);animation:ping 2.6s infinite}
.expedition-panel,.story-page{margin-top:auto;position:relative;background:rgba(10,12,15,.78);border:1px solid rgba(255,226,190,.2);border-radius:20px;padding:18px;backdrop-filter:blur(14px);box-shadow:0 20px 50px #0008}
.expedition-panel h2{font-size:26px!important;margin:4px 0!important}
.activity-tabs{display:flex;gap:6px;overflow-x:auto;margin:10px 0;scrollbar-width:none}.activity-tabs button{flex:none;border-radius:99px!important}.activity-tabs button[aria-pressed=true]{background:#e69558!important;color:#1e140c!important;border-color:transparent!important}
.camp-builds{display:flex;gap:6px;flex-wrap:wrap}.camp-builds span,.discovery-stats span{background:rgba(255,255,255,.08);padding:5px 10px;border-radius:99px;font-size:12px}.discovery-stats{display:flex;gap:6px;flex-wrap:wrap}
.resource-bar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-weight:600}
.blueprint-grid,.wildlife-view{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin:10px 0}.blueprint,.wildlife-card,.outside-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:12px;text-align:left;display:flex;flex-direction:column;gap:6px;color:#f3eade}.blueprint h3,.outside-card h3{margin:0!important;font-size:15px!important}.blueprint p{font-size:12px;margin:0}
.build-sketch{height:54px;border-radius:10px;background:linear-gradient(#314a35,#1b2b1f);display:grid;place-items:center;font-size:28px;color:#e8c98c}
.creature-art{font-size:32px;text-align:center}.wildlife-card small{font-size:12px;color:#d6cabb}.wildlife-card em{font-size:11px;color:var(--gold);font-style:normal}
#animal-detail{margin-top:8px;color:#ffe2bd;font-style:italic}
.cast-meter{position:relative;height:22px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden;margin:12px 0}.catch-zone{position:absolute;left:30%;width:40%;top:0;bottom:0;background:linear-gradient(90deg,transparent,rgba(242,201,143,.65),transparent)}#cast-marker{position:absolute;top:0;bottom:0;width:6px;background:#fff;box-shadow:0 0 10px #fff;left:0}
.expedition-tip{color:#ffe2bd!important}.save-note{display:block;margin-top:10px;font-size:11px;color:#a89a86}
.story-page{max-width:640px;margin:auto auto 0}.story-page h2{font:500 26px var(--serif)!important;margin:6px 0!important}.story-prose{font:17px/1.7 var(--serif);color:#f1e5d3!important}
.story-choices{display:grid;gap:8px;margin:14px 0}.story-choices button{text-align:left;padding:12px 14px!important;border-radius:12px!important;font-size:14.5px!important}.story-choices button:hover:not(:disabled){border-color:#e69558!important;background:rgba(230,149,88,.16)!important}
.story-controls{display:flex;gap:8px;flex-wrap:wrap}.story-page details{margin:6px 0;font-size:13px;color:#d6cabb}
.scene-studio{padding:16px}.scene-studio .pagehead h1{font:500 32px var(--serif);margin:4px 0;color:#fff1de}.scene-studio .pagehead p{margin:0}
.director-tools{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin:12px 0}.director-tools label{flex:1;min-width:180px}
.film-stage{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background-size:cover;background-position:center;border:1px solid rgba(255,255,255,.15);box-shadow:0 20px 50px #000a;touch-action:none}
.film-stage:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse,transparent 55%,rgba(0,0,0,.5));pointer-events:none}
.film-actor{position:absolute;width:13%;transform:translate(-50%,-92%);background:none!important;border:0!important;padding:0!important;cursor:grab;z-index:2;touch-action:none;filter:drop-shadow(0 8px 8px #0008)}.film-actor span{position:absolute;left:50%;bottom:-18px;transform:translateX(-50%);font-size:10px;background:rgba(0,0,0,.6);color:#fff;padding:1px 7px;border-radius:99px}
.film-caption{position:absolute;left:5%;right:5%;bottom:5%;text-align:center;font:600 clamp(13px,2.4vw,20px)/1.3 var(--serif);color:#fff;text-shadow:0 2px 10px #000,0 0 3px #000;z-index:3}.film-counter{position:absolute;top:10px;left:12px;font-size:10px;letter-spacing:2px;color:#fff;background:rgba(0,0,0,.5);padding:3px 8px;border-radius:99px;z-index:3}
.film-timeline{display:flex;gap:8px;overflow-x:auto;margin:12px 0;padding-bottom:4px}.film-timeline button{flex:none;width:110px;padding:0!important;overflow:hidden;border-radius:10px!important;position:relative}.film-timeline img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}.film-timeline span{position:absolute;left:0;right:0;bottom:0;font-size:10px;background:rgba(0,0,0,.65);padding:2px}.film-timeline button[aria-pressed=true]{outline:2px solid #e69558}.film-timeline #add-shot{width:90px;padding:8px!important}
.scene-edit{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));align-items:end}.cast-edit{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;grid-column:1/-1}.cast-edit fieldset{border:1px solid rgba(255,255,255,.12);border-radius:12px;display:grid;gap:8px;padding:10px}.cast-edit legend{font-size:11px;color:var(--gold)}
/* reduced motion */
body.calm .hotspot .ring,body.calm .dream-sparks,body.calm .dream-landscape{animation:none!important}
@media (prefers-reduced-motion:reduce){.hotspot .ring{animation:none}.intro-card.go{animation:none;opacity:0}}