/* Shared, compact progression controls match the existing turquoise garden UI. */
.graphics-label{display:block;font-weight:700;margin:18px 0 8px}
#graphics-setting{display:block;width:100%;min-height:48px;border:1px solid #6ca8a7;border-radius:12px;padding:8px 12px;background:#f0fffa;color:#184b56;font:16px Tahoma,sans-serif}
#graphics-status{font:14px/1.7 Tahoma,sans-serif;min-height:24px;margin:8px 0 16px}
#restart-guide{min-height:44px;padding:8px 16px;border:1px solid #6ca8a7;border-radius:12px;background:#e0f4e7;color:#184b56;font:14px Tahoma,sans-serif}
.progress-balances{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0 8px}
.progress-balances>div{display:flex;flex-direction:column;gap:9px;align-items:center;padding:16px 8px;border-radius:16px;background:#f2fff4b3;border:1px solid #6ca8a780;min-width:0}
.progress-balances small{font:14px/1.5 Tahoma,sans-serif;text-align:center}.progress-balances strong{font:700 25px/1.2 Tahoma,sans-serif;direction:ltr;max-width:100%;overflow-wrap:anywhere;color:#175862}.progress-balances>div:first-child{background:#175862;color:#ecfff1}.progress-balances>div:first-child strong{color:#ecfff1}
.progress-explainer{font:14px/1.7 Tahoma,sans-serif;color:#38676b}.goal-reward .milestone-art{width:64px;height:70px;object-fit:contain;display:block;margin:auto}.goal-reward>span{font:14px/1.6 Tahoma,sans-serif}.goal-reward small{display:block;font:14px/1.6 Tahoma,sans-serif}.goal-reward button{min-height:44px}.goal-card{min-width:0}.goal-card>div{min-width:0}.goal-card h3{line-height:1.6}.goal-card progress{max-width:100%}
.garden-guide{max-height:calc(100dvh - 220px);overflow:auto}.garden-guide .guide-skip{width:44px;height:44px;top:2px;left:2px}.garden-guide small{display:block;padding-left:32px;font-size:12px;line-height:1.7}.garden-guide .guide-action{min-height:44px;font:14px/1.6 Tahoma,sans-serif}.garden-guide p{font:14px/1.65 Tahoma,sans-serif}
body[data-graphics-level=battery] :is(.garden-ambient,.living-surface,.scene-particles,.light-particle,.reward-number){display:none!important}
body[data-graphics-level=battery] :is(.living-crystal,.living-windows,.living-water,.dhikr-orb,.contact-shadow){animation:none!important}
body[data-graphics-level=battery] :is(dialog::backdrop,.scene-vignette){backdrop-filter:none}
@media(max-width:700px),(max-width:1400px) and (any-pointer:coarse){
 .progress-balances{gap:6px}.progress-balances>div{padding:12px 5px}.progress-balances strong{font-size:20px}.progress-balances small{font-size:14px}
 #goals-dialog .goal-card{display:grid;grid-template-columns:minmax(0,1fr) 104px;gap:10px;padding:12px}.goal-card h3{font-size:16px}.goal-card p{font:14px/1.65 Tahoma,sans-serif}.goal-card .goal-reward{min-width:0;width:auto}.goal-reward strong{font-size:14px}
 .garden-guide{width:min(300px,calc(var(--screen-w) - 100px));max-height:calc(var(--screen-h) - 280px);padding:12px 14px}.garden-guide strong{font:700 16px/1.5 Tahoma,sans-serif}.garden-guide progress{margin:6px 0}
 .detail-stages figure{padding:8px 3px}.collection-page{min-width:0}.collection-reward{flex-wrap:wrap}
 .toolbar{max-height:calc(var(--screen-h) - var(--hud-bottom) - var(--dock-height) - 72px);overflow-y:auto;overscroll-behavior:contain}
}
@media(max-height:650px) and (orientation:landscape) and (max-width:1400px){
 .garden-guide{top:calc(var(--hud-bottom,54px) + 48px);left:calc(var(--ui-left,10px) + 54px);transform:none;width:270px;max-height:calc(var(--screen-h,100dvh) - 190px);padding:8px 12px}.garden-guide small{font-size:12px}.garden-guide p{margin:5px 0}.garden-guide .guide-action{width:100%}
 #settings-dialog{max-width:620px}.collection-pages{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-dialog .islands-list{grid-template-columns:repeat(2,minmax(0,1fr))}
 .camera-controls{top:calc(var(--hud-bottom,54px) + 140px)}
}
@media(max-width:380px){#goals-dialog .goal-card{grid-template-columns:minmax(0,1fr) 90px}.progress-balances strong{font-size:18px}}
#settings-dialog>.primary{display:block;width:100%;min-height:44px;margin-top:8px}
body[data-graphics-level=battery] :is(.world-item.floating>img,.collect-bubble){animation:none!important}
.feature-dialog .dialog-close,.garden-detail-dialog .detail-close,#settings-dialog .dialog-close{display:grid;place-items:center;width:44px!important;height:44px!important;min-width:44px;min-height:44px;left:12px;top:12px;padding:8px!important;z-index:3}
.feature-dialog .dialog-close img,#settings-dialog .dialog-close img{width:28px!important;height:28px!important;object-fit:contain}

/* Completed decorative sprites are optional in Battery; construction remains active. */
body[data-graphics-level=battery] :is(.swaying,.flower-sway,.water-sparkle):not(.constructing)>img,
body[data-graphics-level=battery] .crystal-sparkle::before,
body[data-graphics-level=battery] .island-art::after{animation:none!important}
body[data-graphics-level=battery] .garden-motes{display:none!important}


#river-selection{position:absolute;inset:0;width:7400px;height:2400px;overflow:visible;pointer-events:none;z-index:5}
#river-selection polygon{fill:#7ffff522;stroke:#a7fff5;stroke-width:1.4;stroke-linejoin:round}
body.photo-mode #river-selection{display:none}

.toolbar{max-height:var(--tools-max-height,calc(100dvh - 300px));overflow-y:auto;overscroll-behavior:contain}.toolbar .tool:not(#open-shop){flex-shrink:0}
@media(max-width:700px),(max-width:1400px) and (any-pointer:coarse){.camera-controls{top:var(--camera-tools-top,calc(var(--hud-bottom) + 206px))}.toolbar{max-height:var(--tools-max-height,calc(var(--screen-h) - var(--hud-bottom) - var(--dock-height) - 108px))}}

/* Short landscape viewports need one complete row of tools, not clipped rows. */
@media(max-width:1400px) and (max-height:350px) and (orientation:landscape){
 .toolbar{display:flex;flex-direction:row;flex-wrap:nowrap;width:max-content;max-width:min(560px,calc(var(--screen-w,100vw) - var(--safe-left,0px) - var(--safe-right,0px) - 80px));max-height:none;height:80px;overflow-x:auto;overflow-y:hidden;justify-content:flex-start;align-items:center;gap:8px;padding:8px;scroll-padding:8px}
 .toolbar .tool:not(#open-shop){flex:0 0 58px;width:58px;height:60px}
 .mobile-tools-collapsed .toolbar{width:0;height:0;padding:0;border:0;overflow:visible}
}
