/* Kaalgarh — readable monsoon UI. Natural document flow, including short landscape. */
#game-shell{min-width:0;color:#dce7ed;font-family:Inter,system-ui,sans-serif}
#game-shell .game-bar{height:calc(48px + env(safe-area-inset-top,0px));padding-top:env(safe-area-inset-top,0px)}
#game-shell button:focus-visible,#game-shell a:focus-visible,#game-shell input:focus-visible{outline:3px solid #f6d587;outline-offset:3px}
#game-shell .screen{padding:18px max(16px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));align-items:flex-start;overflow:auto;overscroll-behavior:contain;background:rgba(5,13,22,.85);backdrop-filter:blur(5px)}
#game-shell .screen .panel{position:relative;inset:auto;flex-shrink:0;margin:auto;max-height:none;overflow:visible;border:1px solid #47505a;border-radius:14px;background:linear-gradient(145deg,#172633,#0b151f);color:#dfebf2;box-shadow:0 20px 60px #0006;text-align:left;padding:clamp(18px,3vw,32px);width:min(620px,100%)}
#game-shell .screen .panel::before,#game-shell .screen .panel::after{display:none}
#game-shell .screen .panel h1{position:static;inset:auto;max-width:none;margin:0;background:none;color:#f3dfaf;font:800 clamp(2.1rem,6vw,4.1rem)/.98 Georgia,serif;letter-spacing:.02em;text-shadow:none;overflow-wrap:anywhere}
#game-shell .screen .panel h1 span{display:block;font:600 .3em/1.8 system-ui,sans-serif;letter-spacing:.25em;color:#a4c4d6;margin-top:8px}
#game-shell .screen .panel h2{color:#f3dfaf;font-size:1.55rem;line-height:1.15}
#game-shell .screen .eyebrow{position:static;margin:0 0 12px;padding:0;background:none;color:#d4b77c;font:700 .64rem/1.5 system-ui,sans-serif;letter-spacing:.12em}
#game-shell .screen .subtitle{position:static;inset:auto;display:block;margin:16px 0 0;padding:0;border:0;width:auto;max-width:52ch;background:none;color:#b8cbd8;font:400 .9rem/1.6 system-ui,sans-serif}
#game-shell .screen .stat-strip{position:static;inset:auto;width:auto;margin:18px 0 0;display:flex;justify-content:flex-start;flex-wrap:wrap;gap:7px}
#game-shell .screen .stat-strip span{min-width:0;overflow-wrap:anywhere;border:1px solid #3a4b56;border-radius:8px;padding:8px 10px;background:#111e27;color:#bcd0dc;font:.73rem/1.4 system-ui,sans-serif}
#game-shell .screen .stat-strip b{color:#f3dfaf}
#game-shell .screen .menu-actions{position:static;inset:auto;display:grid;grid-template-columns:1fr;width:auto;gap:9px;margin:22px 0 0}
#game-shell .screen .menu-actions button{border:1px solid #51616c;border-radius:9px;background:#223541;color:#dfebf2;box-shadow:none;min-width:0;min-height:46px;padding:11px 14px;font:600 .85rem/1.3 system-ui,sans-serif;letter-spacing:.01em;text-align:center;text-transform:none}
#game-shell .screen .menu-actions button.primary{background:linear-gradient(120deg,#e4c58d,#bd965b);color:#182128;border-color:#e4c58d;min-height:52px;grid-column:1/-1;font-size:.94rem}
#game-shell .screen .menu-actions button:hover{filter:brightness(1.12);transform:none}
#game-shell .screen .menu-actions.compact{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}
#screen-menu::before,#screen-menu::after{display:none}
#game-shell #screen-menu{background:linear-gradient(100deg,rgba(6,14,24,.92),rgba(6,14,24,.50));justify-content:flex-start;align-items:center}
#game-shell #screen-menu .panel{width:min(920px,100%);display:grid;grid-template-columns:minmax(0,1.45fr) minmax(205px,1fr);grid-template-areas:'eyebrow eyebrow' 'title actions' 'description actions' 'stats stats';gap:0 28px}
#screen-menu .eyebrow{grid-area:eyebrow}
#screen-menu h1{grid-area:title}
#screen-menu .subtitle{grid-area:description}
#screen-menu .stat-strip{grid-area:stats}
#game-shell #screen-menu .menu-actions{grid-area:actions;margin:0;align-self:center}
#game-shell .how-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
#game-shell .how-grid div{background:#142531;border:1px solid #3a4b56;color:#c4d7e4;border-radius:9px;min-width:0}
#game-shell .how-grid b{color:#f3dfaf}
#game-shell .setting-row{background:#13232e;border:1px solid #344a5a;gap:12px;flex-wrap:wrap}
#game-shell .setting-row span{color:#d0dfe8;line-height:1.4}
#game-shell .seg{flex-wrap:wrap}
#game-shell .seg button{min-height:40px;background:#203441;color:#d0dfe8;border-color:#455967}
#game-shell .seg button.active{background:#435962;color:#ffedbd;border-color:#cfb779}
#game-shell input[type=range]{min-width:110px;max-width:100%;accent-color:#e1bd7b}
#game-shell .muted,#game-shell .completion-note{color:#b3c6d2}
#game-shell #game-wrap .rain-grain{display:none}
#game-shell #game-wrap .vignette{box-shadow:inset 0 0 70px rgba(0,0,0,.13)}
#game-shell #game-wrap.nn-storm-surge::after{opacity:.25;animation:none;filter:none}
#game-shell .screen:not(.screen-active){display:none}
#game-shell .hidden{display:none!important}
/* The HUD uses actual grid rows: long objectives never overlap the storm card. */
#game-shell #hud{display:grid;grid-template-columns:52px minmax(0,1fr) 52px;grid-template-rows:auto auto 1fr auto auto;align-items:start;gap:6px;padding:10px max(10px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));pointer-events:none}
#game-shell .objective-card{position:static;inset:auto;transform:none!important;grid-column:2;grid-row:1;justify-self:center;width:min(520px,100%);min-width:0;max-width:100%;padding:7px 10px;border-radius:8px;background:rgba(5,15,24,.64);border:1px solid #9aa98d44;box-shadow:none;text-align:left;backdrop-filter:none}
#game-shell .objective{position:static;transform:none;white-space:normal;color:#f6e8c7;font:600 .78rem/1.4 system-ui,sans-serif}
#game-shell .objective-kicker{font:.52rem/1.4 system-ui,sans-serif;letter-spacing:.12em;color:#bacbd5}
#game-shell .objective-sub{font:.67rem/1.4 system-ui,sans-serif;color:#bdd2df}
#game-shell .chapter-progress{justify-content:flex-start;margin-top:5px}
#game-shell .seal-counter{position:static;inset:auto;grid-column:1;grid-row:1;padding:9px 5px;justify-content:center;background:#081722bb;font-size:.68rem}
#game-shell .pause-btn{position:static;inset:auto;grid-column:3;grid-row:1;width:44px;height:44px;justify-self:end}
#game-shell .storm-card{position:static;inset:auto;grid-column:2;grid-row:2;justify-self:end;min-width:0;width:min(210px,100%);padding:6px 9px;background:#081722b3;backdrop-filter:none}
#game-shell .storm-hint{color:#b4c9d6;font-size:.57rem;line-height:1.4}
#game-shell .water-danger{position:static;inset:auto;grid-column:1;grid-row:2;gap:5px}
#game-shell .wd-label{text-align:center;font-size:.6rem;line-height:1.4;color:#ffc09b}
#game-shell .wd-bar{height:48px}
#game-shell .prompt{position:static;inset:auto;transform:none;grid-column:1/-1;grid-row:4;justify-self:center;max-width:100%;padding:8px 12px;border:1px solid #ceae7388;border-radius:8px;background:#0b1c28dd;white-space:normal;text-align:center;color:#f6dfae;font:.78rem/1.4 system-ui,sans-serif}
#game-shell .controls-hint{position:static;inset:auto;transform:none;grid-column:1/-1;grid-row:5;justify-self:center;white-space:normal;text-align:center;font:.65rem/1.5 system-ui,sans-serif;color:#d2e1ea;margin-bottom:8px}
#game-shell .stamina{bottom:max(8px,env(safe-area-inset-bottom));width:94px}
#game-shell .mobile-ctrls .mc-joystick{bottom:max(24px,env(safe-area-inset-bottom));left:max(18px,env(safe-area-inset-left));width:98px;height:98px;border:1px solid #acc4d08c;background:#10263180}
#game-shell .mobile-ctrls .mc-joystick i{background:#d9bd8270;border:1px solid #f3e3b899}
#game-shell .mobile-ctrls .mc-btns{bottom:max(20px,env(safe-area-inset-bottom));right:max(14px,env(safe-area-inset-right));display:grid;grid-template-columns:repeat(2,52px);gap:8px}
#game-shell .mc-btn{min-width:52px;min-height:52px;width:52px;height:52px;border:1px solid #abc6d080;border-radius:14px;background:#0b2334bd;color:#e7f0f4;font:700 .58rem/1 system-ui,sans-serif;touch-action:none}
#game-shell #mc-int.ready{background:#d6b87e;color:#142a34;border-color:#f6dca5;box-shadow:0 0 18px #e4c18045}
#game-shell .mc-pause{top:10px;right:max(10px,env(safe-area-inset-right));width:44px;height:44px}
#game-shell.touch-device .pause-btn{visibility:hidden;display:block}
#game-shell.touch-device .prompt{margin-bottom:138px;max-width:min(420px,95%)}
#game-shell.touch-device .controls-hint{display:none}
#game-shell .orientation-note{display:none}
#game-shell .toast{max-width:calc(100% - 32px);white-space:normal;text-align:center;bottom:145px}
#game-shell .achievement-toast{max-width:calc(100% - 32px);top:110px}
@media(max-width:640px){
  #game-shell #screen-menu .panel{grid-template-columns:minmax(0,1fr);grid-template-areas:'eyebrow' 'title' 'description' 'actions' 'stats';gap:0}
  #game-shell #screen-menu .menu-actions{margin-top:20px;grid-template-columns:repeat(2,minmax(0,1fr))}
  #game-shell #screen-menu .menu-actions button.primary{grid-column:1/-1}
  #game-shell .objective-kicker{display:none}
  #game-shell .objective{font-size:.69rem}
  #game-shell #hud{grid-template-columns:42px minmax(0,1fr) 44px;gap:5px}
  #game-shell .storm-head b{font-size:.55rem}
  #game-shell .screen .panel{padding:18px}
  #game-shell .game-bar-title{font-size:.66rem}
}
@media(max-width:360px){#game-shell .how-grid{grid-template-columns:1fr}#game-shell .screen .menu-actions.compact{grid-template-columns:1fr}}
@media(max-height:500px) and (orientation:landscape){
  #game-shell .screen{padding:12px}
  #game-shell #screen-menu .panel{grid-template-columns:minmax(0,1.3fr) minmax(190px,1fr);grid-template-areas:'eyebrow actions' 'title actions' 'description actions' 'stats stats';gap:0 22px}
  #game-shell .screen .panel h1{font-size:2.1rem}
  #game-shell .screen .subtitle{font-size:.74rem;margin-top:10px}
  #game-shell #screen-menu .menu-actions{margin:0;grid-template-columns:1fr}
  #game-shell .screen .menu-actions button{min-height:46px!important}
  #game-shell .screen .stat-strip{margin-top:12px}
  #game-shell .objective-sub{display:none!important}
  #game-shell .mobile-ctrls .mc-joystick{width:86px;height:86px;bottom:14px}
  #game-shell .mobile-ctrls .mc-btns{bottom:12px;grid-template-columns:repeat(4,48px);gap:6px}
  #game-shell .mc-btn{min-width:48px;min-height:48px;width:48px;height:48px}
  #game-shell.touch-device .prompt{margin-bottom:60px;max-width:55%}
  #game-shell .storm-hint{display:none}
}
@media(prefers-reduced-motion:reduce){#game-shell *,#game-shell *::after,#game-shell *::before{animation:none!important;transition:none!important}}
