/* Keep each editor region within the viewport, with its own scroll boundary. */
html{height:100%;overflow:hidden}
body{height:100vh;height:100dvh;overflow:hidden}
body[data-device="supported"]{display:grid;grid-template-rows:auto minmax(0,1fr)}
body:not([data-device="supported"])>.app-header,
body:not([data-device="supported"])>.workspace{display:none}
.device-gate{height:100%;display:grid;place-items:center;padding:28px;overflow:auto;text-align:center}
.device-gate>div{max-width:440px;padding:32px;background:white;border:1px solid var(--line);border-radius:12px}
.device-gate .brand-mark{margin:0 auto 24px}
.device-gate h1{font-size:27px;line-height:1.2}
.device-gate p{color:var(--muted);line-height:1.6;margin-bottom:0}
body[data-device="supported"]>.device-gate{display:none}
.app-header{min-width:0;min-height:80px;padding:14px 24px}
.workspace{width:100%;height:100%;min-height:0;margin:0 auto;display:grid;grid-template-columns:260px minmax(0,1fr) 230px;grid-template-rows:minmax(0,1fr);gap:16px;padding:16px;align-items:stretch}
.workspace>.panel{min-width:0;min-height:0;max-height:100%;position:static;overscroll-behavior:contain}
.control-panel,.inspector{overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable;touch-action:pan-y}
.preview-panel{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(80px,1fr) auto auto;overflow:hidden;padding:14px 16px;max-width:none}
.canvas-toolbar{grid-row:1}
.view-notice{grid-row:2}
#stage-frame{grid-row:3;height:100%;min-height:0;display:grid;place-items:center}
#stage{max-width:100%;max-height:100%;aspect-ratio:768/830}
.canvas-footer{grid-row:4;padding:10px 0}
.placement-note{grid-row:5}
.inspector .layer-list{display:flex;flex-direction:column}
.modal,.country-results{overscroll-behavior:contain}
@media(max-width:1160px){
  .app-header{flex-wrap:wrap;gap:10px;padding:12px 18px}
  .header-actions{margin-left:auto}
  .workspace{grid-template-columns:220px minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(160px,.45fr);gap:12px;padding:12px}
  .control-panel{grid-column:1;grid-row:1 / 3;padding:16px}
  .preview-panel{grid-column:2;grid-row:1;padding:12px}
  .inspector{grid-column:2;grid-row:2;padding:16px}
  .inspector .layer-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .placement-note{display:none}
}
@media(max-width:730px){
  /* Laptop windows and iPad split view remain supported; phones are gated before boot. */
  body[data-device="supported"]{overflow-x:auto}
  .app-header,.workspace{min-width:700px}
  .app-header{display:flex}
  .header-actions{display:flex;margin-top:0}
  .workspace{display:grid}
  .preview-panel,.control-panel,.inspector{order:initial;width:auto}
}
