/* Lemonade Empire: responsive.css */

@media(min-width:1600px){.site-shell{max-width:1040px}.game-stage{height:545px}.lemon-zone{margin-top:10px}}

@media(max-width:780px){.site-shell{padding:0 18px}.site-header{height:80px}.balance{padding:15px;gap:10px}.balance strong{font-size:23px}.hud-icon{width:34px;height:34px;border-radius:10px}.eyebrow{font-size:9px;letter-spacing:1px}.income strong{font-size:20px}.game-stage{height:505px}.stand-badge{top:135px;left:12px;font-size:9px;max-width:125px}.production{grid-template-columns:1fr 1fr;gap:12px 25px;padding:16px}.production-heading{grid-column:1/-1}.production-heading small{display:none}.game-dock{gap:8px;grid-template-columns:1fr 1fr 1fr}.dock-button{padding:14px 10px;gap:8px}.dock-button strong{font-size:12px}.dock-button small,.dock-arrow{display:none}.how-to-play{gap:25px;grid-template-columns:1fr 1.2fr}.stage-heading h1{font-size:36px}}

@media(max-width:520px){.site-shell{padding:0 12px}.site-header{height:72px;gap:8px}.brand{font-size:20px;gap:7px}.brand img{width:33px;height:33px}.brand-empire{font-size:8px;letter-spacing:4px}.site-header nav{gap:12px}.nav-link{font-size:11px}.nav-link.is-active{display:none}.icon-button{width:36px;height:36px}.balance-bar{grid-template-columns:1fr 1fr;margin:3px 0 12px;border-radius:12px}.balance{padding:12px 10px;gap:8px}.balance strong{font-size:22px}.balance .eyebrow{font-size:8px}.balance .hud-icon{width:28px;height:32px;background:transparent}.balance svg{width:22px}.income{grid-column:1/-1;padding:7px 13px;justify-content:center;border-top:1px solid var(--line)}.balance.income{border-left:0}.income .hud-icon{display:none}.income>div{display:flex;align-items:center;gap:10px}.income strong{font-size:13px;letter-spacing:0}.game-stage{height:464px;border-radius:15px;background-size:auto 100%;background-position:center}.stage-heading{padding-top:20px}.stage-heading h1{font-size:29px;margin-top:6px;letter-spacing:-1px}.stage-heading .eyebrow{font-size:8px;letter-spacing:1.4px}.stage-heading p{font-size:11px;margin:5px 0}.stand-badge{position:relative;top:auto;left:auto;max-width:90%;width:fit-content;margin:10px auto 0;font-size:9px;padding:3px 9px}.lemon-zone{height:212px;width:230px;margin:0 auto}.lemon-img{height:213px;width:213px}.lemon-hint{font-size:10px;bottom:0;padding:4px 12px}.click-yield{font-size:10px;margin-top:5px}.click-yield strong{font-size:13px}.stage-sale{bottom:16px;width:calc(100% - 24px)}.sell-button{padding:11px 10px;gap:7px;font-size:12px;min-height:49px}.sell-button svg{display:none}.sell-button #sellAllEarnings{font-size:11px}.price-note{font-size:9px}.active-boosts{font-size:9px;min-height:34px}.production{padding:13px 12px;gap:10px 18px}.production-heading strong{font-size:12px}.production-heading svg{width:23px;height:23px}.production-label{font-size:10px;padding-right:44px}.production-label span{font-size:8px}.stat-icon-btn{font-size:9px}.stat-value{font-size:16px;padding-right:44px}.game-dock{gap:6px;margin-top:12px}.dock-button{flex-direction:column;text-align:center;gap:7px;padding:12px 4px}.dock-button svg{width:23px;height:23px}.dock-button strong{font-size:11px}.ticker{gap:8px;height:44px}.ticker-label{font-size:8px;letter-spacing:.5px}#activityTicker{font-size:9px}.how-to-play{padding:32px 4px 24px;grid-template-columns:1fr;gap:12px}.how-to-play h2{font-size:29px}.guide-grid{gap:20px}.site-footer{gap:13px;flex-wrap:wrap;font-size:10px}.site-footer>span{width:100%}.overlay{padding:10px;align-items:flex-end}.overlay-card{width:100%;max-height:calc(100dvh - 20px);border-radius:18px 18px 10px 10px}.overlay-head{padding:20px 15px 15px}.overlay-head h2{font-size:27px}.overlay-body{padding:15px}.overlay-foot{padding:12px 15px}.upgrade{padding:12px;gap:8px 10px;grid-template-columns:36px minmax(0,1fr)}.upgrade-icon{width:36px;height:36px}.upgrade-title-compact{font-size:12px}.upgrade-description,.upgrade-details{grid-column:1/-1}.upgrade-actions{grid-column:1/-1}.upgrade-cost-compact{font-size:16px}.boost{padding:12px}.stats-grid{gap:7px}.statrow{padding:10px}.statrow-value{font-size:15px}}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.lemon-button:active .lemon-img{rotate:none;scale:1}}

@media(max-width:520px){.game-stage{height:auto;min-height:464px;padding-bottom:16px}.stage-sale{position:relative;left:auto;bottom:auto;transform:none;margin:13px auto 0}.icon-button{min-width:44px;min-height:44px}}

@media (max-width: 520px) {

    .stage-tool-dock {
        right: 7px;
        padding: 6px;
        gap: 6px;

        border-radius: 13px;
    }

    .stage-tool-button {
        width: 43px;
        height: 43px;

        border-radius: 10px;
    }

    .stage-tool-button svg {
        width: 21px;
        height: 21px;
    }

    
    .stage-tooltip {
        display: none;
    }

    #shopPanel,
    #boostPanel,
    #statsOverlay {
        padding: 0;
    }

    #shopPanel .overlay-card,
    #boostPanel .overlay-card,
    #statsOverlay .overlay-card {
        width: 100%;
        max-height: calc(100dvh - 12px);

        border-radius: 20px 20px 0 0;
    }
}

@media (prefers-reduced-motion: reduce) {

    #shopPanel.is-open .overlay-card,
    #boostPanel.is-open .overlay-card,
    #statsOverlay.is-open .overlay-card,
    #shopPanel.is-closing .overlay-card,
    #boostPanel.is-closing .overlay-card,
    #statsOverlay.is-closing .overlay-card,
    #shopPanel.is-open .overlay-backdrop,
    #boostPanel.is-open .overlay-backdrop,
    #statsOverlay.is-open .overlay-backdrop,
    #shopPanel.is-closing .overlay-backdrop,
    #boostPanel.is-closing .overlay-backdrop,
    #statsOverlay.is-closing .overlay-backdrop {
        animation: none !important;
    }
}

@media(max-width:520px){.stage-sale{width:calc(100% - 20px)}.sale-action-row{grid-template-columns:58px minmax(0,1fr) 58px;gap:6px}.sale-side-button{min-height:49px;font-size:8px}.sell-qty-menu{max-width:calc(100vw - 28px);gap:3px}.sell-qty-button{min-width:42px;padding:6px}.sale-unlock-list{grid-template-columns:1fr}#prestigePanel{padding:0}#prestigePanel .overlay-card{width:100%;max-height:calc(100dvh - 12px)}}

@media (max-width: 780px) {
    .balance-bar { top: 5px; }
}

@media (max-width: 520px) {
    .balance-bar { top: 3px; }
    .balance-subline { font-size: 8px; }
#storagePanel { padding: 0; }
    #storagePanel .overlay-card {
        width: 100%;
        height: min(620px, calc(100dvh - 12px));
        max-height: calc(100dvh - 12px);
        border-radius: 20px 20px 0 0;
    }
    .storage-summary-grid { grid-template-columns: 1fr 1fr; }
    .storage-upgrade-card { align-items: stretch; flex-direction: column; }
    .storage-upgrade-button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    #storagePanel.is-open .overlay-card,
    #storagePanel.is-closing .overlay-card,
    #storagePanel.is-open .overlay-backdrop,
    #storagePanel.is-closing .overlay-backdrop {
        animation: none !important;
    }
}

html.reduce-motion #storagePanel.is-open .overlay-card,
html.reduce-motion #storagePanel.is-closing .overlay-card,
html.reduce-motion #storagePanel.is-open .overlay-backdrop,
html.reduce-motion #storagePanel.is-closing .overlay-backdrop {
    animation: none !important;
}

@media (max-width: 760px) {

    .site-header {
        align-items: flex-start;
    }

    .header-right {
        width: 100%;
        align-items: stretch;
    }

    .header-community-stats {
        justify-content: center;
        padding: 2px 0 0;
        font-size: 9px;
    }

}


@media (max-width: 760px) {
    .power-up-inventory {
        grid-template-columns: minmax(0, 1fr) auto;
        margin-top: -7px;
    }
    .power-up-inventory-items {
        overflow-x: auto;
        grid-template-columns: repeat(8, 43px);
        justify-content: start;
        scrollbar-width: thin;
    }
    .power-up-inventory-item {
        min-height: 40px;
    }
    .power-up-inventory-tooltip {
        display: none;
    }
    .power-up-earn-link {
        min-width: 52px;
        padding: 6px 9px;
        text-align: center;
    }
    .power-up-earn-link > span:last-child {
        display: none;
    }
}

@media (max-width: 520px) {
    .power-up-inventory {
        gap: 6px;
        margin-bottom: 11px;
    }
    .power-up-inventory-items {
        padding: 5px;
        gap: 5px;
    }
    .power-up-earn-link {
        min-width: 46px;
    }
}

/* Combined sticky balance + power-up HUD */
@media (max-width: 900px) {
    .persistent-hud .balance-bar {
        grid-template-columns: 1fr 1fr;
    }

    .persistent-hud .balance:nth-child(3),
    .persistent-hud .balance:nth-child(4) {
        border-top: 1px solid var(--line);
    }

    .persistent-hud .golden-lemons {
        border-left: 0;
    }

    .persistent-hud .income {
        grid-column: auto;
    }
}

@media (max-width: 760px) {
    .persistent-hud {
        top: 4px;
    }

    .site-header nav {
        gap: 10px;
    }

    .nav-link {
        font-size: 10px;
    }
}

@media (max-width: 520px) {
    .persistent-hud .balance-bar {
        margin-top: 3px;
    }

    .persistent-hud .balance {
        padding: 9px 8px;
    }

    .persistent-hud .balance strong {
        font-size: 18px;
    }

    .persistent-hud .balance .hud-icon {
        width: 26px;
        height: 28px;
    }

    .persistent-hud .income {
        padding: 9px 8px;
        justify-content: flex-start;
        border-left: 1px solid var(--line);
    }

    .persistent-hud .income .hud-icon {
        display: grid;
    }

    .persistent-hud .income > div {
        display: block;
    }

    .site-footer-nav {
        flex-basis: 100%;
        justify-content: flex-start;
        gap: 2px 14px;
    }
}


/* Empire progress bar */
@media (max-width: 780px) {
    .prestige-progress {
        grid-template-columns: minmax(130px, .8fr) minmax(190px, 1.6fr) 15px;
        gap: 10px;
        padding: 8px 10px 8px 12px;
    }

    .prestige-progress-status {
        font-size: 11px;
    }
}

@media (max-width: 520px) {
    .prestige-progress {
        grid-template-columns: minmax(0, 1fr) 14px;
        gap: 8px;
        min-height: 45px;
        margin-top: -10px;
        padding: 8px 10px 9px 11px;
    }

    .prestige-progress-copy {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }

    .prestige-progress-copy .eyebrow {
        flex: 0 0 auto;
        font-size: 7px;
        letter-spacing: .8px;
    }

    .prestige-progress-status {
        margin: 0;
        font-size: 9px;
        text-align: right;
    }

    .prestige-progress-track-wrap {
        grid-column: 1 / 2;
    }

    .prestige-progress-chevron {
        grid-column: 2;
        grid-row: 1 / span 2;
        align-self: center;
        font-size: 20px;
    }

    .prestige-progress-numbers {
        font-size: 7px;
    }

    .prestige-progress-numbers strong {
        font-size: 7px;
    }
}


@media (max-width: 680px) {
    .prestige-summary-card {
        grid-template-columns: 1fr 1fr;
    }

    .prestige-award-summary {
        grid-column: 1 / -1;
    }

    .prestige-columns,
    .prestige-bonus-card {
        grid-template-columns: 1fr;
    }

    .prestige-action-card,
    .prestige-confirm {
        align-items: stretch;
        flex-direction: column;
    }

    .prestige-confirm-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .prestige-button,
    .secondary-button {
        width: 100%;
    }
}

@media (max-width: 430px) {
    .prestige-summary-card {
        grid-template-columns: 1fr;
    }

    .prestige-award-summary {
        grid-column: auto;
    }

    .prestige-meter-labels {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .prestige-bonus-stats {
        grid-template-columns: 1fr;
    }

    .prestige-bonus-stats > div + div {
        border-top: 1px solid #ddd5b4;
        border-left: 0;
    }
}
