*{box-sizing:border-box}body{margin:0;background:#0b1425;color:#e9f4ff;font-family:system-ui,Segoe UI,sans-serif}.shell{max-width:1250px;margin:auto;padding:22px}header{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px}small{color:#79d4f8;letter-spacing:2px;font-weight:800}h1{font-size:clamp(22px,3vw,34px);margin:5px 0;color:#fff}h1 span{color:#67c8f4}.tag{border:1px solid #416b90;border-radius:8px;padding:12px;color:#9edcff;font-size:12px;font-weight:800}.hud{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}.hud>div{background:#182940;border:1px solid #2b4c69;border-radius:7px;padding:11px 15px;font-size:12px;flex:1;white-space:nowrap}.hud strong{color:#fff}.layout{display:grid;grid-template-columns:minmax(0,800px) minmax(240px,1fr);gap:16px}.game-frame{position:relative;align-self:start;background:#091423;border:4px solid #40698a;box-shadow:0 10px 35px #0006}canvas{display:block;width:100%;height:auto;image-rendering:pixelated}.toolbar{display:flex;flex-wrap:wrap;justify-content:space-around;gap:8px;background:#12253d;color:#a8d5ed;font-size:11px;font-weight:800;padding:12px}.dialog{position:absolute;bottom:52px;left:5%;right:5%;background:#0b1425f5;border:3px solid #8ad8f3;padding:14px 18px;box-shadow:0 6px 0 #0008}.hidden{display:none}.speaker{font-weight:900;color:#ffe27c;letter-spacing:1px}.dialog p{font-size:14px;line-height:1.5;margin:8px 0}.dialogHint{text-align:right;font-size:10px;color:#98b8c8}aside{background:#15253c;border:1px solid #31516e;border-radius:8px;padding:20px}h2{font-size:16px;color:#a5e3ff;margin:0 0 10px}.muted{color:#99b0c6;font-size:13px}.quest{padding:12px;background:#20344d;border-left:3px solid #ffc857;margin:8px 0;font-size:13px}.quest.done{border-color:#69dc9a;color:#a8efc4}.progress{height:9px;border-radius:10px;background:#081727;margin-top:16px;overflow:hidden}.progress div{height:100%;width:0;background:#67dc98;transition:width .2s}hr{border:0;border-top:1px solid #34506a;margin:20px 0}aside p{font-size:13px;line-height:1.6}button{background:#f8c64f;border:0;border-radius:5px;padding:12px 18px;font-weight:900;cursor:pointer;width:100%;margin-top:12px}footer{color:#7992a7;text-align:center;font-size:12px;margin-top:18px}@media(max-width:900px){.layout{grid-template-columns:1fr}.shell{padding:10px}.tag{display:none}}

/* Phase 2 story UI */
.scene{position:absolute;inset:0;background:rgba(5,10,24,.86);z-index:5;display:flex;align-items:center;justify-content:center;padding:24px}.scene.hidden{display:none}.scene-panel{max-width:590px;width:100%;background:linear-gradient(145deg,#223955,#101d34);border:4px solid #f6c85d;box-shadow:0 10px 0 #060c17;padding:26px;text-align:center}.scene-kicker{color:#f5d07a;font-weight:900;letter-spacing:3px;font-size:12px}.scene h2{font-size:clamp(21px,3vw,30px);color:white;margin:14px 0}.scene p{font-size:16px;line-height:1.7;color:#d7eaff;white-space:pre-line}.scene button{max-width:220px}.story-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.story-actions button{font-size:11px;padding:10px 6px;margin-top:8px}.story-actions button:first-child{grid-column:span 2}.quest.locked{opacity:.65}.dialog{z-index:3}#notice{margin-top:8px;min-height:20px}.toolbar{line-height:1.5}

/* Phase 3 storm operations */
.flood-panel{margin:16px 0;padding:15px;background:#0e2940;border:2px solid #4b98b9;border-radius:8px}.flood-panel.hidden{display:none}.storm-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}.storm-stats>div{background:#193b56;padding:10px;border-radius:6px;font-size:12px}.storm-stats strong{display:block;font-size:20px;color:#8fe0ff;margin-top:3px}.storm-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.storm-actions button{margin-top:0;font-size:11px;padding:10px 5px}.storm-actions button:last-child{grid-column:span 2;background:#89c5f5}.storm-actions button:disabled{opacity:.4;cursor:not-allowed}#stormRestart{background:#f19a69}#stormRestart.hidden{display:none}

/* Phase 4 */
#rescuePanel .storm-actions button:last-child{grid-column:span 2;background:#8fe0ac}#rescuePanel .storm-actions button:disabled{opacity:.45}#rescueTip{line-height:1.5}

#investigationPanel .quest{margin:7px 0}#investigationPanel h3{margin:16px 0 7px;font-size:15px}#investigationPanel button:disabled{opacity:.45;cursor:not-allowed}

/* Phase 6 final results */
#finalPanel .report-card{margin:14px 0;background:#152f47;border:1px solid #5789a6;padding:14px;border-radius:8px}#finalPanel h3{margin:0 0 9px;color:#ffe29a}#finalPanel .storm-actions button:last-child{grid-column:auto;background:#a7e6c1}#finalPanel .storm-actions button{min-height:42px}#finalBreakdown{white-space:pre-line}button:focus-visible{outline:3px solid #fff;outline-offset:3px}


/* Phase 6 fullscreen map + in-game menu (Hostinger /public compatible) */
html,body{min-height:100%;}body{overflow-x:hidden}.shell{max-width:none;width:100%;padding:12px 18px 8px}header{margin-bottom:10px}h1{font-size:clamp(19px,2.2vw,29px)}.header-actions{display:flex;align-items:center;gap:12px}.header-actions .tag{white-space:nowrap}.menu-trigger{width:auto;margin:0;padding:12px 24px;background:#f8c64f;color:#101b2b;border:2px solid #fff2a6;box-shadow:0 3px 0 #805e15}.hud{margin-bottom:10px}.layout{display:block;position:relative}.game-frame{width:100%;max-width:none;margin:0 auto;overflow:hidden}.game-frame canvas{width:100%;height:calc(100vh - 225px);min-height:440px;object-fit:fill;image-rendering:pixelated}.toolbar{min-height:36px;padding:9px}.menu-backdrop{position:fixed;inset:0;background:#030915bd;z-index:50}.menu-backdrop.hidden{display:none}.game-menu{position:fixed;top:0;right:0;bottom:0;width:min(420px,100vw);z-index:51;background:#15253c;border:2px solid #507da1;border-radius:0;box-shadow:-15px 0 40px #0009;overflow-y:auto;padding:20px;transform:translateX(105%);visibility:hidden;pointer-events:none;transition:transform .2s ease,visibility .2s}.game-menu.menu-open{transform:translateX(0);visibility:visible;pointer-events:auto}.menu-top{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #40617d;margin-bottom:18px;padding-bottom:10px}.menu-top h2{margin:4px 0}.menu-close{width:auto;margin:0;padding:10px 12px;background:#e98a7b;color:#132136;white-space:nowrap}.game-menu .flood-panel{margin:14px 0}.game-menu .storm-actions{grid-template-columns:1fr 1fr}.game-menu .storm-actions button{min-width:0}footer{margin-top:7px}@media(max-width:700px){.shell{padding:8px}.header-actions .tag{display:none}header{gap:8px}h1{font-size:17px}.menu-trigger{padding:10px 13px}.hud>div{flex:1 1 42%;font-size:10px;padding:8px}.game-frame canvas{height:calc(100dvh - 235px);min-height:310px}.toolbar{font-size:9px}.game-menu{padding:14px}}

/* TRUE FULL-VIEWPORT PATCH: overrides earlier layout rules */
html,body{width:100%;height:100%;margin:0;overflow:hidden!important}
body{position:relative}
.shell{position:fixed!important;inset:0!important;display:block!important;width:100vw!important;height:100dvh!important;max-width:none!important;margin:0!important;padding:0!important;overflow:hidden!important}
.layout{position:absolute!important;inset:0!important;display:block!important;width:100%!important;height:100%!important;margin:0!important;padding:0!important}
.game-frame{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;margin:0!important;border:0!important;box-shadow:none!important;overflow:hidden!important;background:#397b54!important}
.game-frame canvas{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;max-height:none!important;display:block!important;object-fit:fill!important;image-rendering:pixelated}
.shell>header{position:fixed!important;top:12px;left:14px;right:14px;z-index:20;display:flex;align-items:flex-start;justify-content:space-between;pointer-events:none;margin:0!important}
.shell>header>div{pointer-events:none}.shell>header .header-actions{pointer-events:auto}.shell>header small{font-size:10px;text-shadow:0 2px 4px #000}.shell>header h1{font-size:clamp(16px,2vw,26px);margin:3px 0;color:white;text-shadow:0 3px 5px #000,0 0 9px #000}.shell>header .tag{display:none!important}
.menu-trigger{pointer-events:auto!important;position:relative;z-index:22;padding:12px 20px!important}
.hud{position:fixed!important;left:14px;right:14px;top:76px;z-index:18;display:flex!important;gap:7px!important;pointer-events:none;margin:0!important}.hud>div{flex:0 1 auto!important;background:#0b192bdb!important;border:1px solid #69a5c3!important;padding:7px 10px!important;font-size:11px!important;backdrop-filter:blur(5px)}
.toolbar{position:fixed!important;left:50%;bottom:10px;transform:translateX(-50%);z-index:15;width:max-content;max-width:calc(100vw - 24px);border:1px solid #6c98ae;border-radius:7px;background:#0b192be8!important;padding:8px 16px!important;gap:16px!important;pointer-events:none}
.shell>footer{display:none!important}
.game-menu{position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:auto!important;width:min(420px,100vw)!important;height:100dvh!important;max-height:none!important;z-index:101!important;overflow-y:auto!important}
.menu-backdrop{position:fixed!important;inset:0!important;z-index:100!important}.menu-backdrop.hidden{display:none!important}
.game-menu:not(.menu-open){visibility:hidden!important;pointer-events:none!important;transform:translateX(105%)!important}
.dialog{bottom:62px;max-width:900px;margin:0 auto}.scene{z-index:30}
@media(max-width:700px){.shell>header{top:7px;left:8px;right:8px}.shell>header h1{font-size:15px;max-width:235px}.shell>header small{font-size:8px}.menu-trigger{padding:9px 12px!important;font-size:12px}.hud{top:68px;left:8px;right:8px;flex-wrap:wrap}.hud>div{font-size:9px!important;padding:5px 7px!important}.toolbar{bottom:5px;font-size:8px!important;gap:7px!important;padding:6px!important;width:calc(100vw - 16px);justify-content:space-around}.dialog{bottom:45px}}

/* HUD READABILITY PATCH: clear separation from the pixel scene */
main.shell>header{
  top:16px!important;left:18px!important;right:18px!important;
  align-items:flex-start!important;
}
main.shell>header>div:first-child{
  background:rgba(7,17,32,.96)!important;
  border:2px solid #83d9f7!important;
  border-radius:12px!important;
  box-shadow:0 6px 0 rgba(0,0,0,.35),0 10px 25px rgba(0,0,0,.65)!important;
  padding:12px 18px!important;
  max-width:min(570px,calc(100vw - 180px))!important;
}
main.shell>header small{color:#a9eaff!important;font-size:11px!important;letter-spacing:1.5px!important;display:block!important}
main.shell>header h1{font-size:clamp(17px,2vw,26px)!important;line-height:1.25!important;margin:5px 0 0!important;text-shadow:none!important}
main.shell>.hud{
  top:122px!important;left:18px!important;right:auto!important;
  max-width:calc(100vw - 36px)!important;
  display:flex!important;flex-wrap:wrap!important;gap:8px!important;
}
main.shell>.hud>div{
  flex:0 0 auto!important;background:rgba(8,21,38,.97)!important;
  border:2px solid #76b9dc!important;border-radius:8px!important;
  padding:10px 13px!important;font-size:12px!important;
  box-shadow:0 4px 0 rgba(0,0,0,.35),0 6px 16px rgba(0,0,0,.5)!important;
  color:#e6f6ff!important;backdrop-filter:none!important;
}
main.shell>.hud strong{color:#fff!important;font-size:12px!important;text-shadow:none!important}
main.shell .menu-trigger{border:2px solid #fff0a2!important;box-shadow:0 5px 0 #6e4d11,0 8px 20px #0009!important}
main.shell .toolbar{background:rgba(7,18,33,.96)!important;border:2px solid #80c9eb!important;box-shadow:0 5px 16px #0009!important}
@media(max-width:700px){
  main.shell>header{top:8px!important;left:8px!important;right:8px!important}
  main.shell>header>div:first-child{padding:9px 10px!important;max-width:calc(100vw - 115px)!important;border-radius:8px!important}
  main.shell>header h1{font-size:14px!important}
  main.shell>header small{font-size:8px!important;letter-spacing:.6px!important}
  main.shell>.hud{top:96px!important;left:8px!important;right:8px!important;gap:5px!important}
  main.shell>.hud>div{font-size:10px!important;padding:7px 8px!important;border-width:1px!important}
  main.shell>.hud strong{font-size:10px!important}
  main.shell .menu-trigger{padding:10px 12px!important}
}

/* Bottom-left title and status HUD: October 30 layout update */
main.shell>header{top:auto!important;bottom:102px!important;left:18px!important;right:18px!important;align-items:flex-end!important;z-index:20!important}
main.shell>header>div:first-child{max-width:min(480px,calc(100vw - 36px))!important;padding:9px 13px!important}
main.shell>header h1{font-size:clamp(16px,1.65vw,23px)!important}
main.shell>header small{font-size:9px!important}
main.shell>.hud{top:auto!important;bottom:49px!important;left:18px!important;right:auto!important;width:auto!important;max-width:min(520px,calc(100vw - 36px))!important;gap:6px!important;z-index:20!important}
main.shell>.hud>div{padding:7px 9px!important;font-size:10px!important;border-width:1px!important}
main.shell>.hud strong{font-size:10px!important}
/* Keep the menu button at the upper right even though the header is at bottom */
main.shell .header-actions{position:fixed!important;top:12px!important;right:18px!important;z-index:24!important}
@media(max-width:700px){
 main.shell>header{top:auto!important;bottom:126px!important;left:8px!important;right:8px!important}
 main.shell>header>div:first-child{max-width:calc(100vw - 16px)!important;padding:7px 9px!important}
 main.shell>header h1{font-size:14px!important}
 main.shell>.hud{top:auto!important;bottom:48px!important;left:8px!important;right:8px!important;max-width:calc(100vw - 16px)!important;gap:4px!important}
 main.shell>.hud>div{padding:5px 6px!important;font-size:9px!important}
 main.shell>.hud strong{font-size:9px!important}
 main.shell .header-actions{top:8px!important;right:8px!important}
}

/* CINEMATIC DIALOGUE: stays legible over the fullscreen map. */
#dialog.cinematic-dialog{position:fixed!important;left:clamp(12px,20vw,340px)!important;right:clamp(12px,7vw,110px)!important;bottom:clamp(110px,12vh,150px)!important;top:auto!important;max-width:none!important;margin:0!important;min-height:220px;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(195px,32%);gap:0;background:linear-gradient(120deg,rgba(8,20,39,.98),rgba(11,30,53,.98))!important;border:2px solid #69d6ff!important;border-radius:10px!important;box-shadow:0 14px 0 #04101a99,0 22px 45px #000b!important;padding:0!important;z-index:55!important;overflow:visible!important}
#dialog.cinematic-dialog.hidden{display:none!important}
.cinematic-dialog .portrait-wrap{position:absolute;left:clamp(-270px,-17vw,-130px);bottom:-2px;width:clamp(145px,18vw,280px);height:clamp(190px,28vw,340px);pointer-events:none;overflow:hidden;filter:drop-shadow(0 5px 6px #000a)}
.cinematic-dialog .portrait-wrap img{width:100%;height:100%;object-fit:cover;object-position:center top;border-radius:12px 12px 0 0;mask-image:linear-gradient(to bottom,#000 75%,transparent 100%)}
.cinematic-dialog .conversation-content{padding:20px 24px;min-width:0;display:flex;flex-direction:column}
.cinematic-dialog .conversation-top{display:flex;align-items:center;gap:10px;justify-content:space-between;border-bottom:1px solid #3d5a78;padding-bottom:10px}
.cinematic-dialog .speaker{display:inline-block;color:#fff;background:#174875;padding:7px 12px;border:1px solid #54bde8;border-radius:4px;font-size:14px;letter-spacing:1px}
.cinematic-dialog .conversation-chapter{color:#79c3e4;font-size:10px;font-weight:800;letter-spacing:1px}
.cinematic-dialog #dialogText{font-size:clamp(14px,1.15vw,18px);line-height:1.65;margin:15px 0;color:#f2f7ff;flex:1}
.cinematic-dialog .dialogHint{font-size:10px;text-align:left;color:#a1bcd0}
.cinematic-dialog .dialog-choices{border-left:1px solid #35526d;padding:14px;display:flex;flex-direction:column;justify-content:center;gap:8px}
.cinematic-dialog .dialog-choices button{width:100%;margin:0;padding:12px 11px;min-height:42px;text-align:left;color:#eaf5ff;background:#112a45;border:1px solid #345b7a;border-radius:5px;font-weight:700;font-size:12px;display:flex;justify-content:space-between;gap:10px;align-items:center}
.cinematic-dialog .dialog-choices button:hover,.cinematic-dialog .dialog-choices button:focus-visible{outline:2px solid #f9c34e;background:#244568}
.cinematic-dialog .dialog-choices button span{color:#f9c34e}
@media(max-width:850px){#dialog.cinematic-dialog{left:10px!important;right:10px!important;bottom:90px!important;grid-template-columns:1fr;min-height:190px}.cinematic-dialog .portrait-wrap{display:none}.cinematic-dialog .conversation-content{padding:12px}.cinematic-dialog .dialog-choices{border-left:0;border-top:1px solid #35526d;padding:8px;flex-direction:row;flex-wrap:wrap}.cinematic-dialog .dialog-choices button{flex:1;min-width:130px;font-size:10px;padding:8px}.cinematic-dialog .conversation-chapter{display:none}}
@media(max-height:620px){#dialog.cinematic-dialog{bottom:65px!important;min-height:155px}.cinematic-dialog .conversation-content{padding:10px 15px}.cinematic-dialog #dialogText{margin:8px 0}}

/* UNIQUE PIXEL CUTOUT PORTRAITS - transparent image, no square scene backdrop */
.cinematic-dialog .portrait-wrap{overflow:visible!important;filter:drop-shadow(3px 5px 0 #04101d) drop-shadow(-2px -2px 0 #e3f2ff)!important}
.cinematic-dialog .portrait-wrap img{object-fit:contain!important;object-position:center bottom!important;image-rendering:pixelated!important;border-radius:0!important;mask-image:none!important;-webkit-mask-image:none!important;background:transparent!important}

/* Mobile controls and small-screen presentation */
.bayog-mobile-controls{display:none}
@media (pointer:coarse), (max-width:700px){
 html,body{max-width:100%;overflow-x:hidden}
 body{overscroll-behavior-y:contain}
 .bayog-mobile-controls{position:fixed;display:flex;align-items:flex-end;justify-content:space-between;left:0;right:0;bottom:0;padding:10px max(12px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));pointer-events:none;z-index:105;box-sizing:border-box}
 .bayog-dpad{display:grid;grid-template-columns:repeat(3,54px);grid-template-rows:repeat(2,54px);gap:4px;pointer-events:auto}
 .bayog-touch,.bayog-mobile-actions button{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;border:2px solid #8ce6ff;background:#102b45e8;color:#fff;border-radius:12px;font-size:22px;font-weight:900;box-shadow:0 4px 0 #071421;min-width:48px;min-height:48px}
 .bayog-touch:active,.bayog-touch.pressed,.bayog-mobile-actions button:active{background:#26749b;transform:translateY(2px)}
 .bayog-up{grid-column:2;grid-row:1}.bayog-left{grid-column:1;grid-row:2}.bayog-down{grid-column:2;grid-row:2}.bayog-right{grid-column:3;grid-row:2}
 .bayog-mobile-actions{display:flex;flex-direction:column;gap:10px;pointer-events:auto;align-items:flex-end}
 .bayog-mobile-actions button{min-width:96px;padding:12px 10px;font-size:19px}
 .bayog-mobile-actions button span{font-size:11px;vertical-align:middle}
 .bayog-mobile-actions #bayogTouchInteract{background:#a36b1b;color:#fff5d4;border-color:#ffd274}
 #bayogStartMenu:not([hidden])~.bayog-mobile-controls{visibility:hidden}
 .bayog-start-content{width:min(94vw,440px)!important;max-height:94dvh;overflow-y:auto;box-sizing:border-box;padding:20px 14px!important}
 .bayog-start-content h1{font-size:clamp(36px,11vw,64px)!important}
 .bayog-start-content h2{font-size:clamp(14px,4vw,24px)!important}
 #dialog.cinematic-dialog{bottom:calc(132px + env(safe-area-inset-bottom))!important;max-height:42dvh;min-height:0!important;overflow-y:auto!important;grid-template-columns:1fr!important}
 .cinematic-dialog .conversation-content{padding:9px 12px!important}
 .cinematic-dialog #dialogText{font-size:13px!important;line-height:1.4!important;margin:8px 0!important}
 .cinematic-dialog .dialog-choices{gap:4px!important;padding:5px!important}
 .cinematic-dialog .dialog-choices button{min-width:90px!important;min-height:36px!important}
 #scene{max-height:78dvh;overflow-y:auto}
 #game{touch-action:none}
}
@media (pointer:coarse) and (orientation:landscape) and (max-height:500px){
 .bayog-dpad{grid-template-columns:repeat(3,43px);grid-template-rows:repeat(2,43px);gap:3px}
 .bayog-mobile-controls{padding-bottom:6px}
 .bayog-mobile-actions button{min-height:42px;padding:6px 8px}
 #dialog.cinematic-dialog{bottom:85px!important;max-height:48dvh}
}

/* MOBILE HUD AND TOUCH LAYOUT FIX: controls no longer cover HUD. */
@media (pointer:coarse), (max-width:700px){
  body{margin:0!important;overflow:hidden!important}
  main.shell{height:100dvh!important;min-height:0!important;padding:0!important;overflow:hidden!important}
  main.shell .toolbar{display:none!important}
  main.shell .header-actions{display:none!important} /* mobile already has a MENU button */
  main.shell>header{position:fixed!important;top:8px!important;bottom:auto!important;left:10px!important;right:auto!important;width:auto!important;max-width:calc(100vw - 150px)!important;z-index:23!important;pointer-events:none!important}
  main.shell>header>div:first-child{max-width:100%!important;padding:6px 9px!important;box-shadow:0 3px 0 #03101e!important}
  main.shell>header small{font-size:8px!important;line-height:1.1!important}
  main.shell>header h1{font-size:clamp(12px,2.2vw,17px)!important;line-height:1.15!important;margin:2px 0!important}
  main.shell>.hud{position:fixed!important;top:77px!important;bottom:auto!important;left:10px!important;right:auto!important;max-width:calc(100vw - 20px)!important;width:auto!important;gap:4px!important;z-index:22!important;pointer-events:none!important}
  main.shell>.hud>div{font-size:9px!important;padding:4px 6px!important;line-height:1.1!important;box-shadow:none!important;border-width:1px!important}
  main.shell>.hud strong{font-size:9px!important}
  .bayog-mobile-controls{position:fixed!important;left:0!important;right:0!important;top:auto!important;bottom:0!important;align-items:flex-end!important;padding:0 max(10px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))!important;z-index:90!important}
  .bayog-dpad{grid-template-columns:repeat(3,clamp(42px,8vh,54px))!important;grid-template-rows:repeat(2,clamp(42px,8vh,54px))!important;gap:4px!important}
  .bayog-touch{min-height:0!important;min-width:0!important;font-size:19px!important}
  .bayog-mobile-actions{gap:8px!important}
  .bayog-mobile-actions button{min-width:94px!important;min-height:43px!important;padding:8px 10px!important;font-size:17px!important}
  #bayogStartMenu:not([hidden])~.bayog-mobile-controls{display:none!important}
  body.menu-visible .bayog-mobile-controls{display:none!important}
  body:has(#bayogVideoCutscene:not(.hidden)) .bayog-mobile-controls{display:none!important}
  #dialog.cinematic-dialog{z-index:95!important}
  #scene{z-index:95!important}
}
@media (pointer:coarse) and (orientation:landscape), (max-width:950px) and (max-height:550px){
  main.shell>header{top:6px!important;left:8px!important;max-width:calc(100vw - 150px)!important}
  main.shell>header>div:first-child{padding:5px 8px!important}
  main.shell>header h1{font-size:clamp(12px,1.6vw,16px)!important}
  main.shell>.hud{top:66px!important;left:8px!important;max-width:calc(100vw - 145px)!important}
  main.shell>.hud>div{font-size:8px!important;padding:4px 6px!important}
  main.shell>.hud strong{font-size:8px!important}
  .bayog-dpad{grid-template-columns:repeat(3,clamp(40px,10vh,54px))!important;grid-template-rows:repeat(2,clamp(40px,10vh,54px))!important;gap:3px!important}
  .bayog-mobile-controls{padding-bottom:max(8px,env(safe-area-inset-bottom))!important}
  .bayog-mobile-actions button{min-height:40px!important;padding:6px 10px!important}
  #dialog.cinematic-dialog{bottom:10px!important;left:clamp(135px,22vw,200px)!important;right:clamp(115px,18vw,165px)!important;max-height:75dvh!important;overflow-y:auto!important}
  #scene{max-height:90dvh!important}
}
@media (pointer:coarse) and (orientation:portrait){
  main.shell>header{max-width:calc(100vw - 20px)!important}
  main.shell>.hud{top:83px!important;max-width:calc(100vw - 20px)!important}
  #dialog.cinematic-dialog{bottom:125px!important;left:8px!important;right:8px!important;max-height:45dvh!important}
}