/* Cabin 2: app-style chrome, game tags instead of orbs, steady warm light. Loaded after cabin.css. */
:root{--cream:#f7ecd5;--cream2:#ecdcb8;--wood:#3a281a;--wood2:#5a3d27;--terra:#d9704a;--moss:#5c8a5a;--ink2:#3a281a;--clay-shadow:0 3px 0 #bfa575,0 10px 18px rgba(40,22,8,.32)}
html,body{overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
input,textarea,[contenteditable]{-webkit-user-select:text;user-select:text}
body[data-view=cabin] .topbar{display:none}
body[data-view=cabin] main{padding:0}
/* a steady scene: nothing dims, tints, flashes or vignettes */
.cs-dim,.cs-tint,.cs-flash,.cs-vignette,.cs-grain{display:none!important}
.cs-bg{filter:brightness(1.2) saturate(1.1) contrast(1.02)}
/* tags */
.hotspot{width:auto;height:auto;margin:0;transform:translate(-50%,-50%);z-index:3}
.hotspot .pill{display:flex;align-items:center;gap:8px;padding:5px 14px 5px 5px;border-radius:999px;background:linear-gradient(#fff6e0,#f0dfbb);box-shadow:var(--clay-shadow);color:var(--ink2);white-space:nowrap;transition:transform .15s,box-shadow .15s;animation:tagFloat 5s ease-in-out infinite}
.hotspot:nth-child(2n) .pill{animation-delay:-1.6s}.hotspot:nth-child(3n) .pill{animation-delay:-3.1s}
.hotspot .pill i{font-style:normal;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;font-size:19px;background:radial-gradient(circle at 35% 30%,#ffb08a,var(--terra));box-shadow:inset 0 -3px 0 rgba(120,40,10,.3)}
.hotspot .pt{display:flex;flex-direction:column;text-align:left}
.hotspot .pt b{font:700 13px/1.15 system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--ink2)}
.hotspot .pt small{font:500 10.5px/1.2 system-ui,sans-serif;color:#7a5a3a}
.hotspot:hover .pill,.hotspot:focus-visible .pill{transform:translateY(-3px) scale(1.05);box-shadow:0 5px 0 #bfa575,0 16px 24px rgba(40,22,8,.4)}
.hotspot:active .pill{transform:translateY(1px) scale(.97);box-shadow:0 1px 0 #bfa575}
.hotspot:focus-visible{outline:none}.hotspot:focus-visible .pill{outline:3px solid #fff}
.hotspot.pop .pill{animation:none}
@keyframes tagFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.hints-off .hotspot .pill{opacity:1;transform:none}
@media (max-width:560px){.hotspot .pt small{display:none}.hotspot .pill{padding:4px 11px 4px 4px;gap:6px}.hotspot .pill i{width:30px;height:30px;font-size:16px}.hotspot .pt b{font-size:12px}}
/* HUD: slim bar */
.cabin-hud.top{padding:calc(10px + env(safe-area-inset-top)) 12px 28px;flex-wrap:nowrap;align-items:center;background:linear-gradient(rgba(30,18,8,.55),rgba(30,18,8,0));gap:10px}
.room-title{flex:1;text-align:center;text-shadow:0 2px 10px rgba(0,0,0,.7)}
.room-title h1{font:700 clamp(17px,2.6vw,24px)/1.1 system-ui,-apple-system,sans-serif;margin:0;color:#fff7e6;letter-spacing:.2px}
.hud-btn{background:linear-gradient(#fff6e0,#f0dfbb);color:var(--ink2);border:0;border-radius:14px;box-shadow:0 3px 0 #bfa575,0 8px 14px rgba(40,22,8,.3);height:40px}
.hud-btn:hover{background:linear-gradient(#fffaf0,#f5e6c8)}.hud-btn:active{transform:translateY(2px);box-shadow:0 1px 0 #bfa575}
.hud-btn.wide span{font:700 12.5px system-ui,sans-serif;letter-spacing:.2px}
.hud-cluster{display:flex;gap:8px}
.cabin-hud.bottom{background:none;padding:0 0 6px;pointer-events:none}
.cabin-dock{pointer-events:auto;margin:0 auto;width:fit-content;max-width:calc(100% - 16px);padding:8px 12px;gap:10px;border-radius:24px;background:rgba(58,40,26,.82);backdrop-filter:blur(14px);box-shadow:0 10px 30px rgba(20,10,4,.5),inset 0 1px 0 rgba(255,235,200,.18);align-items:flex-start}
.dock-app{width:62px;color:#f7ecd5}
.dock-app i{width:48px;height:48px;border-radius:15px;box-shadow:inset 0 -4px 0 rgba(0,0,0,.22),0 4px 8px rgba(0,0,0,.35)}
.dock-app span{font-size:9.5px;font-weight:600;text-shadow:none;color:#f1e3c6}
/* app sheet = a native-feeling screen */
.app-sheet{background:rgba(30,18,8,.5);backdrop-filter:blur(8px);align-items:stretch}
.sheet-card{background:var(--cream);border:0;border-radius:0;height:100%;width:100%;max-width:none;color:var(--ink2);box-shadow:none}
.sheet-card>header{background:linear-gradient(#5a3d27,#3a281a);border:0;padding:calc(8px + env(safe-area-inset-top)) 10px 8px;display:grid;grid-template-columns:96px 1fr 96px;align-items:center}
.sheet-card>header b{text-align:center;font:700 16px system-ui,-apple-system,sans-serif;color:#f7ecd5;letter-spacing:.2px}
.sheet-back{justify-self:start}
.sheet-body{padding:0;background:#241a12;color:#f3eade}
.sheet-body:has(.gc,.sq,.pm){background:var(--cream);color:var(--ink2)}
.sheet-body .studio-loading{color:#7a5a3a}
@media (min-width:900px){.app-sheet{align-items:center;padding:20px}.sheet-card{width:min(1100px,100%);height:min(94%,900px);border-radius:26px;overflow:hidden;box-shadow:0 30px 80px rgba(20,10,4,.6)}.sheet-card>header{border-radius:0}}
/* floor plan */
.plan-overlay{background:rgba(30,18,8,.7)}
.plan-card{background:var(--cream)!important;color:var(--ink2)}
.plan-card h2{color:var(--ink2)!important}
.plan-roof,.plan-tip{display:none!important}
.plan-x{position:absolute;top:12px;left:12px}
.plan-room.here{outline:3px solid var(--terra)}
/* sprites in the rooms */
.spr.guitar svg{width:100%;height:auto;filter:drop-shadow(0 6px 8px rgba(0,0,0,.45))}
.spr.moments{pointer-events:none}.spr.moments svg{position:absolute;inset:0;width:100%;height:60%;filter:drop-shadow(0 2px 2px rgba(0,0,0,.4))}
.spr.moments .mm{position:relative;display:flex;justify-content:space-around;padding-top:6%}
.spr.moments .mp{display:block;width:15%;padding:2.4% 2.4% 6.5%;background:#fffaf0;box-shadow:0 4px 8px rgba(0,0,0,.45);transform:rotate(var(--r));margin-top:calc(var(--r) * -2)}
.spr.moments .mp b{display:block;aspect-ratio:1;background:#c9b88e;overflow:hidden}.spr.moments .mp img{width:100%;height:100%;object-fit:cover}
/* bottom tab bar */
.app-nav{background:linear-gradient(#5a3d27,#3a281a);border:0;border-radius:0;padding:8px 8px calc(8px + env(safe-area-inset-bottom));width:100%;max-width:none;box-shadow:0 -6px 20px rgba(20,10,4,.35)}
.app-nav a{color:#d9c3a0;font:600 10.5px system-ui,sans-serif;border:0!important;gap:3px}
.app-nav a[aria-current]{color:#ffd9a0}.app-nav a[aria-current]:after{bottom:-5px;background:#ffb070;height:3px;width:28px}
body[data-view]:not([data-view=cabin]) .topbar{height:calc(54px + env(safe-area-inset-top));padding:calc(8px + env(safe-area-inset-top)) 14px 6px;background:linear-gradient(#5a3d27,#3a281a);position:sticky;top:0}
@media (min-width:700px){.app-nav{max-width:560px;left:50%;border-radius:22px 22px 0 0}}