html { -webkit-text-size-adjust: 100%; }
button, input, select, textarea { touch-action: manipulation; }
button:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid #edb822; outline-offset: 2px; }
#gameScreen, .gameShell { height: 100dvh; min-height: 0; overflow: hidden; }
.gameShell { grid-template-rows: auto minmax(0, 1fr) auto; }
.gameViewport { position: relative; min-width: 0; min-height: 0; overflow: hidden; }
.gameArea { height: 100%; width: 100%; padding: 0; overflow: auto; overscroll-behavior: contain; touch-action: none; -webkit-overflow-scrolling: touch; }
.marketStage { position: relative; }
.marketStage > .market { position: absolute; left: 0; top: 0; transform-origin: top left; }
#cancelPlacementButton { position: absolute; right: 12px; bottom: 12px; z-index: 30; min-height: 44px; font-size: 14px; padding: 0 14px; }
.landscapeRequired { display: none; position: fixed; inset: 0; z-index: 20000; background: #0878ce; color: white; align-items: center; justify-content: center; text-align: center; padding: 24px; }
.landscapeRequired strong { display: block; font-size: 24px; margin: 20px 0 10px; }
.landscapeRequired p { font-size: 16px; }
.rotateDevice { width: 90px; height: 50px; border: 5px solid white; border-radius: 8px; margin: auto; position: relative; }
.rotateDevice::after { content: ""; position: absolute; width: 5px; height: 12px; background: #ffd54a; right: 3px; top: 14px; border-radius: 2px; }
@media (orientation: portrait) {
    #gameScreen .landscapeRequired { display: flex; }
    #gameScreen .gameShell { visibility: hidden; }
}
.is-editing .shelf, .is-editing .checkout, .is-editing .decoration { touch-action: none; user-select: none; -webkit-user-select: none; }
.is-dragging { z-index: 60 !important; filter: drop-shadow(0 6px 6px #0758b855); }
.market.is-saving-layout .shelf, .market.is-saving-layout .checkout, .market.is-saving-layout .decoration { pointer-events: none; }
.is-editing .shelfRotateButton, .is-editing .furnitureDisposeButton { min-width: var(--world-control-size, 44px); min-height: var(--world-control-size, 44px); }
.is-editing .shelf .furnitureDisposeButton { left: 4px; right: auto; top: 4px; }
.selectedFurnitureTools { position: absolute; bottom: 12px; right: 12px; z-index: 31; display: flex; gap: 6px; padding: 4px; border: 1px solid #92bfd5; border-radius: 8px; background: white; }
.selectedFurnitureTools button { width: 44px; height: 44px; border: 0; border-radius: 4px; font-size: 24px; background: #e4f3fc; color: #0758b8; }
#selectedFurnitureDispose { background: #fff0ee; color: #b02727; }
.connectionStatus { position: fixed; left: 50%; top: max(6px, env(safe-area-inset-top)); transform: translateX(-50%); z-index: 14000; max-width: calc(100% - 16px); background: #983323; color: white; border-radius: 6px; padding: 9px 12px; font-size: 13px; box-shadow: 0 3px 10px #0003; }
.connectionStatus button { border: 1px solid white; background: transparent; color: white; padding: 5px 9px; margin-left: 8px; min-height: 36px; border-radius: 4px; }
.connectionIndicator { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #62de89; flex-shrink: 0; }
.connectionIndicator.is-offline { background: #ff7971; }
[hidden] { display: none !important; }
#installAppButton { min-width: 44px; }
@media (max-width: 1199px) {
    .is-editing .shelfRotateButton, .is-editing .furnitureDisposeButton { display: none !important; }
    .topHud { grid-template-columns: minmax(0, 1fr) auto; padding: 8px 12px; gap: 8px; }
    .hudStats { grid-column: 1 / -1; order: 3; display: grid; grid-template-columns: 1.1fr .8fr 1.4fr 1.3fr .9fr; gap: 6px; }
    .hudPill, .customersPanel, .xpPanel, .gameClockPanel { min-width: 0; width: auto; min-height: 46px; padding: 6px 8px; font-size: 13px; border-radius: 8px; }
    .hudIcon { width: 24px; height: 24px; font-size: 15px; }
    .hudPill { gap: 4px; }
    .brandIcon { width: 38px; height: 38px; border-radius: 8px; font-size: 24px; }
    .brandText strong { font-size: 18px; }
    .brandText span { font-size: 10px; }
    .iconButton, .logout { height: 44px; min-width: 44px; border-radius: 8px; }
    .bottomMenu { display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 6px; min-height: 76px; padding: 7px 8px max(7px, env(safe-area-inset-bottom)); }
    .navButton { flex: 1 0 92px; min-width: 92px; min-height: 58px; padding: 6px; border-radius: 8px; font-size: 12px; }
    .navButton .navIcon { width: 26px; height: 26px; font-size: 18px; border-radius: 7px; }
    .tasksBadge { top: 2px; right: 5px; }
}
@media (max-width: 940px) {
    .wholesaleRow { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 10px !important; }
    .wholesaleRow > div:first-child { grid-column: 1 / -1; }
    .wholesaleRow > div:nth-child(2) { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
    .wholesaleRow > div:nth-child(2) > br { display: none; }
    .wholesaleRow > select { grid-column: 1 / -1; width: 100%; }
    .wholesaleRow > input { width: 100% !important; min-width: 0; }
    .wholesaleRow > button { min-height: 44px; }
    .wholesaleRow > div { min-width: 0; overflow-wrap: anywhere; }
    .inventoryRow { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
    .deliveryRow { grid-template-columns: minmax(0, 1fr) auto !important; }
    .deliveryRow > span:last-child { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
    .topHud { padding: max(6px, env(safe-area-inset-top)) 8px 6px; gap: 6px; }
    .brandText strong { font-size: 15px; }
    .brandText span { display: none; }
    .brandBadge { gap: 6px; }
    .hudActions { gap: 5px; }
    .logout { font-size: 12px; padding: 0 8px; }
    .hudStats { grid-template-columns: 1.3fr .9fr 1.2fr; gap: 5px; }
    .xpPanel { grid-column: 1 / 3; grid-row: 2; min-height: 37px; }
    .gameClockPanel { grid-column: 3; grid-row: 1 / 3; padding: 5px; justify-content: center; }
    .clockTopline { flex-wrap: wrap; gap: 3px; }
    .clockTopline > span:first-child { display: flex; align-items: center; gap: 2px; }
    .clockMeta { flex-direction: column; gap: 2px; font-size: 10px; }
    .customersPanel { display: none; }
    .hudPill { min-height: 40px; font-size: 12px; }
    .hudPill .hudIcon { width: 20px; height: 20px; font-size: 13px; }
    .xpTop { font-size: 11px; }
    .xpTrack { height: 8px; }
    .navButton { flex-basis: 84px; min-width: 84px; font-size: 11px; }
    .splashPanel, .loginBox { width: min(440px, 100%); padding: 20px; }
    .splashTitle { font-size: 32px; }
    #splashScreen, #loginScreen { padding: 16px; min-height: 100dvh; }
    input, select, textarea { font-size: 16px !important; }
    #shelfModal > div, #furnitureModal > div, #employeesModal > div, #dailyStatsModal > div, #tasksModal > section, #adminModal > section { width: calc(100vw - 16px) !important; max-width: 100%; max-height: calc(100dvh - 24px) !important; padding: 12px !important; overflow: auto !important; border-radius: 8px !important; }
    .mobilePanel { max-width: calc(100vw - 16px) !important; width: calc(100vw - 16px) !important; max-height: calc(100dvh - 24px) !important; overflow: auto !important; padding: 12px !important; border-radius: 8px !important; }
    .mobilePanel h2, .tasksHeader h2 { font-size: 20px; }
    .mobilePanel button, .gamePopupButton, .tasksCloseButton { min-height: 44px; }
    .mobilePanelGrid { grid-template-columns: minmax(0, 1fr) !important; }
    #productList, #inventoryList { min-width: 0; overflow-x: hidden; }
    .mobilePanelHeader { flex-wrap: wrap; gap: 8px; }
    .tasksTabs { display: flex; overflow-x: auto; padding: 8px 0; }
    .tasksTab { flex: 0 0 auto; min-height: 44px; font-size: 12px; padding: 5px 9px; }
    .tasksHeader { padding: 10px; gap: 8px; }
    .tasksHeader p { display: none; }
    .tasksBody { padding: 8px 0; max-height: none; }
    .taskCard { grid-template-columns: 44px minmax(0, 1fr); }
    .taskClaimButton { grid-column: 1 / -1; }
    .gamePopup { width: calc(100vw - 20px); max-height: calc(100dvh - 24px); overflow: auto; }
    .gamePopupTitle { font-size: 20px; }
    .adminForm { grid-template-columns: minmax(0, 1fr); }
    .adminTabs { flex-wrap: nowrap; overflow-x: auto; }
    .adminTabs button { white-space: nowrap; }
}
@media (orientation: landscape) and (max-height: 550px) {
    .topHud { grid-template-columns: auto minmax(0, 1fr) auto; padding: 5px 8px; }
    .brandText, .brandIcon, .customersPanel, .xpPanel { display: none; }
    .brandBadge { display: none; }
    .hudStats { grid-column: 1 / 3; grid-row: 1; order: 0; grid-template-columns: 1fr .8fr 1.2fr; }
    .gameClockPanel { grid-column: auto; grid-row: auto; flex-direction: row; align-items: center; gap: 6px; }
    .clockMeta, #gameClockDay { display: none; }
    .hudActions { grid-column: 3; }
    .bottomMenu { min-height: 58px; padding: 4px 6px max(4px, env(safe-area-inset-bottom)); }
    .navButton { min-height: 44px; flex-direction: row; gap: 4px; flex-basis: 100px; }
    .viewportControls { bottom: 8px; right: 8px; }
}
@media (prefers-reduced-motion: reduce) { .splashProgressFill, .xpFill { transition: none; } }
@media (min-width: 1200px) { .selectedFurnitureTools { display: none; } }
