/* Five modes and rankings on home; each mode owns its setup and upgrades. */
.quack-ui #welcome{inset:90px 32px 24px;margin:0 auto;width:calc(100% - 64px);max-width:1540px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,360px);grid-template-areas:'controls board';grid-template-rows:minmax(0,1fr);gap:28px;align-items:start}
.quack-ui #welcome .setup-panel{align-self:start;max-height:100%;min-height:0;padding:28px;overflow:auto}
.quack-ui #welcome .lobby-greeting{margin-bottom:24px}
.quack-ui #welcome #preview-label{display:none}
.quack-ui #welcome .leaderboard-panel{height:min(820px,calc(100dvh - 114px));max-height:100%;min-width:0;min-height:0;overflow:auto;padding:24px;background:var(--ui-paper)}
.quack-ui #welcome .board-title>div{min-width:0}
.quack-ui #welcome .board-title h2{font-size:24px;line-height:1.25;overflow-wrap:anywhere}
.quack-ui #welcome .board-title .section-icon{width:32px;height:32px}
.quack-ui #welcome .leaderboard-panel>:not(.leaderboard-list){flex-shrink:0}
.quack-ui #welcome .community-stats{gap:10px;margin:20px 0 16px;padding:0;border:0}
.quack-ui #welcome .community-stats>div{padding:14px 12px;border:1px solid var(--ui-edge);border-radius:12px;background:var(--ui-soft)}
.quack-ui #welcome .community-stats strong{font-size:27px;line-height:1.2}
.quack-ui #welcome .community-stats span{font-size:12px}
.quack-ui #welcome .your-rank{font-size:14px;margin:14px 0;background:var(--ui-soft)}
.quack-ui #welcome .leaderboard-list{flex:1 1 auto;min-height:100px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--ui-edge) transparent;padding-right:4px}
.quack-ui #welcome .leader-row{grid-template-columns:32px minmax(0,1fr) auto;min-height:54px;gap:10px;padding:10px 8px}
.quack-ui #welcome .leader-name{white-space:normal;line-height:1.35;overflow-wrap:anywhere}
.quack-ui #welcome .leader-score{font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap}
.quack-ui #welcome .rank-number{width:30px;height:30px}
.quack-ui #welcome .leader-row.mine{background:#ffe681;color:#123f36}
.quack-ui #welcome .leader-row.mine :is(.leader-name,.leader-score){color:#123f36}
.quack-ui .home-modes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px}
.quack-ui .home-mode{position:relative;grid-column:span 2;display:flex;flex-direction:column;justify-content:center;align-items:center;aspect-ratio:1;width:100%;min-width:0;min-height:0;gap:18px;padding:24px 18px;border:2px solid var(--ui-edge);border-radius:22px;background:var(--ui-soft);color:var(--ui-ink);text-align:center;text-decoration:none;box-shadow:0 5px 0 #123f3620}
.quack-ui .home-mode:nth-child(4){grid-column:2/span 2}
.quack-ui .home-mode:nth-child(5){grid-column:4/span 2}
.quack-ui .home-mode:nth-child(2){background:#e1efdb}
.quack-ui .home-mode:nth-child(3){background:#f9e6cc}
.quack-ui .home-mode:nth-child(4){background:#d9f0f0}
.quack-ui .home-mode:nth-child(5){background:#e0e9f8}
.quack-ui .home-mode>img{width:clamp(60px,6vw,96px);height:clamp(60px,6vw,96px);object-fit:contain;flex-shrink:0}
.quack-ui .home-mode>span{flex:0 1 auto;min-width:0;width:100%}
.quack-ui .home-mode strong{display:block;font:700 22px/1.25 Quack,Arial,sans-serif;overflow-wrap:anywhere}
.quack-ui .home-mode small{display:block;font:15px/1.4 Arial,sans-serif;max-width:22ch;margin:8px auto 0;overflow-wrap:anywhere}
.quack-ui .home-mode>b{display:none}
.quack-ui .home-mode-classic{background:#ffe681;border-color:#b38a16;color:#123f36}
.quack-ui .home-mode:hover{box-shadow:0 0 0 3px var(--ui-green),0 6px 0 #123f3620}
.quack-ui .player-options{margin-top:18px}
.quack-ui .player-options>summary{font-size:14px;min-height:44px;padding:10px 14px}
.quack-ui .player-options .lobby-footer{padding:0 14px 12px;margin-top:0}
.quack-ui .mode-dialog{width:min(510px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;padding:24px;border:2px solid var(--ui-ink);border-radius:20px;background:var(--ui-paper);color:var(--ui-ink);box-shadow:0 18px 55px #092f3466}
.quack-ui .mode-dialog::backdrop{background:#103e367a;backdrop-filter:blur(5px)}
.quack-ui .mode-dialog-toolbar{display:flex;justify-content:flex-start;margin-bottom:18px}
.quack-ui .mode-dialog .homestead-info{margin:14px 0 0}
.quack-ui .quick-start{border:1px solid var(--ui-edge);border-radius:18px;padding:20px;background:var(--ui-soft)}
.quack-ui .quick-mode-heading{display:flex;gap:14px;align-items:center}
.quack-ui .quick-mode-heading>img{width:58px;height:58px;object-fit:contain;flex-shrink:0}
.quack-ui .quick-mode-heading>div{min-width:0}
.quack-ui .quick-mode-heading h1{font-size:28px;line-height:1.25;margin:6px 0 0;overflow-wrap:anywhere;transform:none;text-shadow:none;-webkit-text-stroke:0;letter-spacing:0}
.quack-ui #quick-mode-copy{font:16px/1.5 Arial,sans-serif;margin:16px 0 20px}
.quack-ui .quick-start .play-button{width:100%;min-width:0;min-height:60px;padding:16px;font-size:17px;gap:10px}
.quack-ui .quick-selection{font:14px/1.4 Arial,sans-serif;text-align:center;margin:15px 0 0;overflow-wrap:anywhere}
.quack-ui .lobby-fold{border:1px solid var(--ui-edge);border-radius:13px;margin-top:12px;background:var(--ui-paper)}
.quack-ui .lobby-fold>summary{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:15px;min-height:52px;cursor:pointer;list-style:none;font-size:16px}
.quack-ui .lobby-fold>summary::-webkit-details-marker{display:none}
.quack-ui .lobby-fold>summary>span{font:14px Arial,sans-serif;display:flex;gap:10px;align-items:center}
.quack-ui .lobby-fold>summary>span::after{content:'+';font-size:20px}
.quack-ui .lobby-fold[open]>summary>span::after{content:'−'}
.quack-ui .fold-content{padding:5px 14px 14px}
.quack-ui .fold-content .choice-field:last-child{margin-bottom:0}
.quack-ui .lobby-footer{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;align-items:center}
.quack-ui .lobby-footer .account-link{margin:0;padding:10px 0;background:none;border:0;font-size:14px;text-align:left}
.quack-ui .lobby-footer .gift-menu-notice{margin:0;width:100%;padding:10px;font-size:14px;line-height:1.4}
.quack-ui #welcome .fair-play-note{margin-top:8px;text-align:left}
.quack-ui #welcome .lobby-controls{justify-content:flex-start;gap:10px}
.quack-ui .upgrades-dialog{width:min(640px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;padding:24px;border:2px solid var(--ui-ink);border-radius:20px;background:var(--ui-paper);color:var(--ui-ink);box-shadow:0 18px 55px #092f3466}
.quack-ui .upgrades-dialog::backdrop{background:#103e367a;backdrop-filter:blur(5px)}
.quack-ui .upgrades-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.quack-ui .upgrades-heading h2{font-size:26px;line-height:1.2;margin:7px 0 0}
.quack-ui .upgrades-heading button{flex-shrink:0;min-width:44px}
.quack-ui #upgrade-timing{font:16px/1.5 Arial,sans-serif;margin:18px 0}
.quack-ui .upgrade-wallet{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;font-size:16px}
.quack-ui .upgrade-wallet strong{display:flex;align-items:center;gap:5px}
.quack-ui .upgrades-dialog .upgrade-card>p{font-size:14px}
.quack-ui .upgrades-dialog .upgrade-level{font-size:14px}
.quack-ui .upgrades-dialog .upgrade-dots{flex-wrap:wrap}
.quack-ui .upgrades-dialog .upgrade-dots i{flex:1 0 12%}
.quack-ui .upgrades-dialog .shop-note{font-size:14px;line-height:1.5}
.quack-ui #upgrade-status{font:16px/1.5 Arial,sans-serif}
.quack-ui #upgrade-status:empty{display:none}
.quack-ui #upgrades-done{width:100%;min-width:0;font-size:16px;padding:14px}
.quack-ui #pause-upgrades,.quack-ui #results-upgrades{display:block;width:100%;margin-top:12px}
html[data-ui-theme=night] .quack-ui .quick-start{background:var(--ui-soft)}
html[data-ui-theme=night] .quack-ui .lobby-footer .account-link{background:none}
html[data-ui-theme=night] .quack-ui .home-mode{color:var(--ui-ink);background:var(--ui-soft);border-color:var(--ui-edge)}
html[data-ui-theme=night] .quack-ui .home-mode-classic{color:#123f36;background:#ffe681;border-color:#b38a16}
@media(max-width:1360px){
 .quack-ui #welcome{inset:90px 20px 24px;width:calc(100% - 40px);grid-template-columns:minmax(0,1fr) minmax(0,300px);gap:20px}
 .quack-ui #welcome .setup-panel{padding:20px}
 .quack-ui #welcome .leaderboard-panel{padding:18px}
 .quack-ui .home-modes{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
 .quack-ui .home-mode:nth-child(4){grid-column:auto/span 2}
 .quack-ui .home-mode:nth-child(5){grid-column:2/span 2}
 .quack-ui .home-mode{padding:16px;gap:12px}
 .quack-ui .home-mode strong{font-size:20px}
 .quack-ui .home-mode>img{width:64px;height:64px}
}
@media(min-width:701px) and (max-width:950px){
 .quack-ui #welcome{grid-template-columns:minmax(0,1fr) minmax(0,280px);gap:16px}
 .quack-ui #welcome .setup-panel{padding:16px}
 .quack-ui .home-mode{padding:12px;gap:10px}
 .quack-ui .home-mode strong{font-size:17px}
 .quack-ui .home-mode small{display:none}
 .quack-ui .home-mode>img{width:44px;height:44px}
}
@media(max-width:700px){
 .quack-ui #welcome{inset:76px 12px 0;width:calc(100% - 24px);display:block;overflow:auto;padding-bottom:24px;pointer-events:auto}
 .quack-ui #welcome .setup-panel{max-height:none;padding:18px 16px}
 .quack-ui #welcome .leaderboard-panel{height:auto;max-height:none;margin-top:16px;overflow:visible}
 .quack-ui #welcome .leaderboard-list{flex:none;max-height:380px;min-height:100px}
 .quack-ui #welcome .lobby-greeting{margin-bottom:16px}
 .quack-ui .home-modes{gap:12px}
 .quack-ui .home-mode{min-height:0;padding:14px 10px;gap:12px;border-radius:16px}
 .quack-ui .home-mode strong{font-size:17px}
 .quack-ui .home-mode small{display:none}
 .quack-ui .home-mode>img{width:52px;height:52px}
 .quack-ui .mode-dialog{padding:18px}
 .quack-ui .quick-start{padding:16px}
 .quack-ui .quick-mode-heading{gap:10px}
 .quack-ui .quick-mode-heading>img{width:46px;height:46px}
 .quack-ui .quick-mode-heading h1{font-size:24px}
 .quack-ui .quick-start .play-button{font-size:16px}
 .quack-ui .upgrades-dialog{padding:18px}
 .quack-ui .upgrades-dialog .upgrade-grid{grid-template-columns:1fr}
 .quack-ui .upgrades-dialog .upgrade-card{display:grid;grid-template-columns:64px minmax(0,1fr);gap:8px 14px;padding:14px}
 .quack-ui .upgrades-dialog .upgrade-card>strong{grid-row:1/5;font-size:14px;justify-content:center}
 .quack-ui .upgrades-dialog .upgrade-card>p{margin:0}
 .quack-ui .upgrades-dialog .upgrade-level{text-align:left}
 .quack-ui .upgrades-dialog .upgrade-card button{width:100%}
 .quack-ui .upgrades-dialog .upgrade-dots i{flex:1 1 0}
}
@media(max-width:380px){
 .quack-ui .home-mode{padding:10px 8px;gap:8px}
 .quack-ui .home-mode strong{font-size:15px}
 .quack-ui .home-mode>img{width:40px;height:40px}
}