/* Homepage composition from images/new/basic-page/reference/basic-page-flat.png.
   The supplied raster is 1920px; controls retain their design scale.
   Keep the game fragments and their live event handlers intact. */
/* Scale the complete menu together, including its report expansion and join. */
#s .game-wrapper.ui-flat-v2 { --home-menu-scale: .84; }
#s .game-wrapper.ui-flat-v2 .pane.left,
#s .game-wrapper.ui-flat-v2 .pane.right {
    transform: scale(var(--home-menu-scale));
    transform-origin: left bottom;
}
#s .game-wrapper.ui-flat-v2 .pane.right { left: calc(271.274px * var(--home-menu-scale)); }
#s .game-wrapper.ui-flat-v2 .pane.right .pane-node.report.pane-expandable {
    flex: 0 0 67.9px;
    width: 67.9px;
}
/* Expand in the flex row so the following menu items move to the right. */
#s .game-wrapper.ui-flat-v2 .pane.right .pane-node.report.pane-expandable:hover,
#s .game-wrapper.ui-flat-v2 .pane.right .pane-node.report.pane-expandable:focus-within,
#s .game-wrapper.ui-flat-v2 .pane.right .pane-node.report.pane-expandable.pane-node-highlight {
    flex: 0 0 297.5px;
    width: 297.5px;
}
#s .game-wrapper.ui-flat-v2 .pane.right .pane-node.report .pane-subnode-wrapper {
    left: 55px;
    bottom: 0;
    height: 55.3px;
    padding-bottom: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
#s .game-wrapper.ui-flat-v2 .pane.right .pane-node.report:hover .pane-subnode-wrapper,
#s .game-wrapper.ui-flat-v2 .pane.right .pane-node.report:focus-within .pane-subnode-wrapper,
#s .game-wrapper.ui-flat-v2 .pane.right .pane-node.report.pane-node-highlight .pane-subnode-wrapper {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
#s .game-wrapper.ui-flat-v2 .pane.top {
    top: 24px; right: 0; width: 587px; height: 182px;
    transform: scale(.75); transform-origin: right top;
}
#s .game-wrapper.ui-flat-v2 .pane.top .flat-season {
    left: 58px; top: 0; min-width: 52px; padding: 9px 12px;
    font-size: 14px; border-radius: 9px;
}
#s .game-wrapper.ui-flat-v2 .pane.top .flat-season-mascot {
    left: 12px; top: 34px; width: 40px; height: 42px;
}
#s .game-wrapper.ui-flat-v2 .pane.top .flat-hotel-card {
    left: 0; top: 64px; width: 137px; height: 118px;
}
#s .game-wrapper.ui-flat-v2 .pane.top .flat-hotel-card::before { inset: 38px 0 0; }
#s .game-wrapper.ui-flat-v2 .pane.top .flat-hotel-logo-frame {
    left: 10px; top: 0; width: 116px; height: 76px; padding: 3px 8px 7px;
}
#s .game-wrapper.ui-flat-v2 .pane.top .flat-hotel-card>strong {
    left: 0; top: 81px; width: 130px; padding: 0 8px; font-size: 14px; line-height: 24px;
}
#s .game-wrapper.ui-flat-v2 .pane.top .flat-ranking {
    left: 0; bottom: -32px; width: 180px; height: 32px; padding: 6px 10px;
    background: #50b5cb; font-size: 11px; visibility: hidden;
}
#s .game-wrapper.ui-flat-v2 .pane.top .flat-hotel-card:hover .flat-ranking,
#s .game-wrapper.ui-flat-v2 .pane.top .flat-hotel-card:focus-within .flat-ranking { visibility: visible; }
#s .game-wrapper.ui-flat-v2 .pane.top .flat-status-board {
    left: 127px; top: 86px; width: 390px; height: 96px;
    padding: 7px 14px; clip-path: none; background: #00577b;
}
#s .game-wrapper.ui-flat-v2 .pane.top .flat-finance-row { height: 28px; }
#s .game-wrapper.ui-flat-v2 .pane.top .flat-finance-stat { padding-left: 23px; }
#s .game-wrapper.ui-flat-v2 .pane.top .flat-finance-stat .flat-stat-icon { width: 19px; height: 19px; }
#s .game-wrapper.ui-flat-v2 .pane.top .flat-finance-stat b { font-size: 12px; padding: 2px 4px; }
#s .game-wrapper.ui-flat-v2 .pane.top .flat-hotel-metrics { height: 27px; gap: 12px; }
#s .game-wrapper.ui-flat-v2 .pane.top .flat-hotel-metrics>span { gap: 6px; }
#s .game-wrapper.ui-flat-v2 .pane.top .flat-metric-icon { flex-basis: 20px; width: 20px; height: 20px; }
#s .game-wrapper.ui-flat-v2 .pane.top .flat-demand-meter { height: 17px; }
#s .game-wrapper.ui-flat-v2 .pane.top .flat-hotel-metrics b { font-size: 12px; }
#s .game-wrapper.ui-flat-v2 .pane.top .flat-round-actions {
    left: 517px; top: 54px; width: 70px; height: 128px;
    clip-path: polygon(0 9%,50% 0,100% 9%,100% 100%,0 100%);
}
#s .game-wrapper.ui-flat-v2 .pane.top .flat-round-actions>span { padding-top: 17px; font-size: 12px; }
#s .game-wrapper.ui-flat-v2 .pane.top .flat-round-actions .flat-advance-next {
    top: 56px; border-width: 23px; border-left-width: 31px;
}
#s .game-wrapper.ui-flat-v2 .pane.navigation { right: 16px; bottom: 10px; transform: scale(.75); }
#s .game-wrapper.ui-flat-v2 .pane.left .pane-node:focus-visible,
#s .game-wrapper.ui-flat-v2 .pane.right .pane-node:focus-visible,
#s .game-wrapper.ui-flat-v2 .pane.right .pane-subnode:focus-visible { outline: 2px solid white; outline-offset: 2px; }
@media (max-width: 1000px) {
    #s .game-wrapper.ui-flat-v2 { --home-menu-scale: .72; }
    #s .game-wrapper.ui-flat-v2 .pane.top { top: 16px; transform: scale(.7); }
    #s .game-wrapper.ui-flat-v2 .pane.navigation { transform: scale(.7); }
}
@media (max-width: 700px) {
    #s .game-wrapper.ui-flat-v2 { --home-menu-scale: .6; }
    #s .game-wrapper.ui-flat-v2 .pane.top { top: 12px; transform: scale(.68); }
    #s .game-wrapper.ui-flat-v2 .pane.navigation { bottom: 76px; right: 10px; transform: scale(.65); }
}
@media (max-width: 420px) {
    #s .game-wrapper.ui-flat-v2 { --home-menu-scale: .48; }
    #s .game-wrapper.ui-flat-v2 .pane.top { transform: scale(.54); }
}

/* Game only: override the legacy body centering at 1440px / 900px.
   Login and administration pages retain their existing layout. */
html:has(#s .game-wrapper.ui-flat-v2) body {
    margin: 0; width: 100%; height: 100%; overflow: hidden;
}
#s:has(> .game-wrapper.ui-flat-v2) {
    width: 100%; height: 100vh; min-height: 0;
}
#s > .game-wrapper.ui-flat-v2 {
    width: 100%; height: 100vh; min-height: 100vh !important;
    margin: 0; background-size: cover;
}
