/* Generated scene + transparent plant sprites; all controls remain semantic HTML. */
.pg { --pg-ink:#12324b; --pg-teal:#006b77; --pg-line:#cbdde3; color:#203443; }
.pg [hidden] { display:none!important; }
.pg-sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip-path:inset(50%)!important; white-space:nowrap!important; border:0!important; }
.pg button { font:inherit; cursor:pointer; border:1px solid var(--pg-line); border-radius:8px; color:var(--pg-ink); background:#fff; padding:10px 15px; min-height:44px; touch-action:manipulation; }
.pg button:disabled { cursor:default; color:#5b6c75; background:#edf2f3; }
.pg button:not(:disabled):hover { border-color:var(--pg-teal); }
.pg button:focus-visible { outline:3px solid #007d89; outline-offset:3px; }
.pg h3 { color:var(--pg-ink); font-size:18px; margin:0 0 8px; line-height:1.4; }
.pg-collection { display:flex; justify-content:space-between; gap:8px 16px; flex-wrap:wrap; align-items:center; margin-bottom:10px; }
.pg-collection p { margin:0; }
#collection-progress { font-size:12px; color:#4d6470; }
.pg-picker { display:flex; gap:7px; margin-bottom:0; }
.pg-picker button { width:53px; padding:8px 3px; font-size:14px; line-height:1.4; }
.pg-picker button[aria-pressed=true] { background:var(--pg-teal); color:#fff; border-color:var(--pg-teal); }
.pg-garden { border:1px solid #d9d9c9; border-radius:14px; overflow:hidden; background:#faf5eb; }
.pg-intro { padding:16px 24px; display:flex; gap:16px; align-items:center; justify-content:space-between; background:#fffdf7; }
.pg-intro h2 { margin:0; font-size:23px; }
.pg-intro .game-eyebrow { font-size:10px; margin:0 0 4px; }
.pg-counter { flex-shrink:0; font-size:14px; color:var(--pg-teal); font-weight:bold; }
.pg-workspace { position:relative; }
.pg-scene { position:relative; isolation:isolate; background:#e5d2ab; }
.pg-backdrop { position:absolute; z-index:-1; inset:0; width:100%; height:100%; object-fit:cover; object-position:center bottom; }
.pg-scene-label { position:absolute; top:16px; left:22px; padding:4px 11px; border-radius:20px; color:#314d3b; background:#fff9eae8; font-size:12px; }
.pg-scene-label>span:first-child { color:#835600; }
.pg-slots { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; padding:40px 32px 36px; align-items:stretch; }
.pg .pg-slot { min-width:0; padding:0; background:transparent; border:0; border-radius:12px; display:flex; flex-direction:column; align-items:center; text-align:center; position:relative; }
.pg-slot-visual { flex-shrink:0; display:block; width:100%; aspect-ratio:1; position:relative; }
.pg-slot-visual img { display:block; width:115%; max-width:none; height:115%; position:absolute; left:-7.5%; bottom:-4%; object-fit:contain; pointer-events:none; }
.pg-pot-label { flex:1; display:block; z-index:1; width:92%; padding:9px 12px; background:#fffaedf5; border:2px solid #fff9e6; border-radius:10px; box-shadow:0 3px 8px #48371e24; min-height:86px; }
.pg-slot strong { display:block; font-size:13px; line-height:1.4; margin-bottom:5px; }
.pg-facts { display:flex; flex-wrap:wrap; justify-content:center; gap:4px 7px; font-size:12px; line-height:1.45; color:#365661; }
.pg-facts>span { display:inline-block; }
.pg-facts>span+span::before { content:'· '; color:#517e70; }
.pg-slot-plant { display:block; font-size:11px; font-weight:bold; color:var(--pg-teal); margin-top:5px; }
.pg-slot.is-filled .pg-pot-label { background:#f2faeefa; border-color:#b3cbb0; }
.pg-slot:hover .pg-pot-label,.pg-slot:focus-visible .pg-pot-label { border-color:#007d89; }
.pg-slot:hover img,.pg-slot:focus-visible img { filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 4px #008a8d); }
.pg-tray { position:relative; z-index:2; width:calc(100% - 80px); margin:-16px auto 0; padding:18px 22px 14px; background:#fffaf0f5; border:2px solid #fff; border-radius:17px; box-shadow:0 5px 16px #79603b25; text-align:center; }
.pg-tray h3 { font-size:22px; margin:0; }
.pg-help { color:#4d6470; font-size:12px; line-height:1.5; margin:3px 0 10px; }
#plant-tray { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.pg .pg-plant { display:flex; flex-direction:column; align-items:center; justify-content:flex-start; text-align:center; min-width:0; width:100%; padding:7px 12px 10px; background:transparent; border:2px solid transparent; border-radius:13px; }
.pg-plant-art { display:block; width:190px; max-width:100%; height:106px; overflow:hidden; }
.pg-plant img { display:block; width:190px; height:190px; object-fit:contain; pointer-events:none; }
.pg-plant strong { display:block; font-size:18px; margin:2px 0 4px; }
.pg-plant-state { display:block; color:var(--pg-teal); font-size:11px; font-weight:bold; margin-top:6px; }
.pg .pg-plant[aria-pressed=true] { border-color:#00868b; background:#e8f4ed; box-shadow:0 0 0 1px #00868b; }
.pg .pg-plant.is-planted:not([aria-pressed=true]) img { opacity:.65; }
.pg-status { margin:18px 26px 0; padding:10px 14px; background:#fffdf8; border-left:3px solid var(--pg-teal); font-size:13px; min-height:44px; line-height:1.6; }
.pg-status[data-kind=retry] { background:#fff2db; border-left-color:#98651c; }
.pg-controls { padding:14px 26px 20px; display:flex; flex-wrap:wrap; gap:8px; }
.pg-controls button { font-size:13px; }
.pg .pg-primary { background:var(--pg-teal); color:#fff; border-color:var(--pg-teal); flex-shrink:0; }
#why-toggle { margin-left:auto; }
.pg-why { margin:0 26px 20px; border-top:1px solid #d6d7c7; padding-top:18px; font-size:14px; }
.pg-why p { max-width:75ch; margin:8px 0; }
.pg-common { font-size:12px; color:#52655b; }
.pg-result { display:flex; align-items:center; gap:25px; justify-content:space-between; background:#eaf4e9; border-top:1px solid #cadbc6; padding:25px 26px; }
.pg-result p { margin:0 0 12px; }
.pg-result h3 { font-size:22px; }
.pg-result a { font-size:14px; }
.pg .game-storage { margin-top:16px; }
.yenra-games:has(.pg) .game-header { padding:20px 0; }
.yenra-games:has(.pg) h1 { margin:12px 0 8px; }
.yenra-games:has(.pg) .game-header>p { font-size:14px; }
@media(prefers-reduced-motion:no-preference) {
 .pg-slot.is-filled img { animation:pg-grow .25s ease-out; }
 .pg-plant { transition:background-color .15s,border-color .15s; }
 @keyframes pg-grow { from { transform:translateY(7px) scale(.96); opacity:.7; } to { transform:none; opacity:1; } }
}
@media(max-width:760px) {
 .pg-slots { padding:48px 14px 32px; gap:6px; }
 .pg-pot-label { width:100%; padding:8px 5px; min-height:104px; }
 .pg-slot strong { font-size:12px; }
 .pg-facts { font-size:11px; gap:4px; }
 .pg-tray { width:calc(100% - 32px); padding:14px 10px 10px; }
 .pg-tray h3 { font-size:19px; }
 #plant-tray { gap:5px; }
 .pg .pg-plant { padding:5px 5px 8px; }
 .pg-plant-art { width:120px; height:67px; }
 .pg-plant img { width:120px; height:120px; }
 .pg-plant strong { font-size:16px; }
 .pg-facts>span+span::before { content:''; }
}
@media(max-width:480px) {
 .pg-intro { padding:14px; gap:10px; }
 .pg-intro h2 { font-size:18px; }
 .pg-intro .game-eyebrow { font-size:9px; letter-spacing:.6px; }
 .pg-counter { font-size:11px; }
 .pg-collection { gap:8px; }
 #collection-progress { font-size:11px; }
 .pg-plant-art { width:100%; height:auto; aspect-ratio:25/14; }
 .pg-plant img { width:100%; height:auto; aspect-ratio:1; }
 .pg-picker { gap:6px; }
 .pg-picker button { width:44px; font-size:12px; }
 .pg-backdrop { height:calc(100% - 100px); }
 .pg-scene-label { top:10px; left:12px; font-size:10px; }
 .pg-slots { padding:65px 8px 28px; gap:5px; }
 .pg-slot-visual { width:130%; aspect-ratio:1; }
 .pg-slot-visual img { width:100%; height:100%; left:0; bottom:0; }
 .pg-pot-label { padding:7px 4px; min-height:108px; }
 .pg-slot strong { font-size:11px; }
 .pg-slot-plant { font-size:10px; }
 .pg-tray { width:calc(100% - 16px); padding:13px 5px 8px; }
 .pg-tray h3 { font-size:17px; }
 .pg-help { font-size:11px; margin:5px 8px 8px; }
 .pg .pg-plant { padding:4px 3px 7px; }
 .pg-plant strong { font-size:14px; }
 .pg-facts { font-size:11px; }
 .pg-status { margin:15px 14px 0; font-size:12px; }
 .pg-controls { padding:12px 14px 16px; gap:7px; }
 .pg-controls button { padding:9px 10px; font-size:12px; }
 #why-toggle { margin-left:0; }
 .pg-why { margin:0 14px 18px; }
 .pg-result { display:block; padding:20px 16px; }
 .pg-result button { margin-top:14px; }
}
@media(forced-colors:active) {
 .pg .pg-slot,.pg .pg-plant { border:1px solid ButtonText; }
 .pg .pg-plant[aria-pressed=true] { outline:3px solid Highlight; }
}