/* Native game panels, clear interaction feedback and a phone layout that fits. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.app{max-width:100%;padding-top:max(8px,env(safe-area-inset-top));padding-bottom:max(8px,env(safe-area-inset-bottom))}
.screen{background:#202c40}.console{border-color:#607888;box-shadow:0 5px #101c30;padding:6px}
.location{max-width:85%;padding:1.5% 2.5%;border-left-width:6px;box-shadow:2px 3px #20384880}
.scene-tip{max-width:92%;font-size:clamp(14px,2.6cqw,24px);line-height:1.1}
.dialogue{min-height:28%;padding:2% 3%;font-size:clamp(16px,3.33cqw,30px);line-height:1.15;border-width:3px;outline-offset:-6px;max-height:48%}
.dialogue .speaker{display:block;font-size:clamp(14px,2.3cqw,20px);margin-bottom:3px}
.dialogue .advance,.battle-advance{display:block;text-align:right;font-size:clamp(12px,2cqw,18px);color:#587080;margin-top:4px}
.dialogue .advance{animation:advance-cursor 1s steps(1,end) infinite}
@keyframes advance-cursor{0%,70%{opacity:1}71%,100%{opacity:.55}}
.battle-panel{font-size:clamp(16px,3.33cqw,28px);min-width:42%;max-width:48%;border-width:2px;padding:1% 2%;border-radius:0;box-shadow:2px 3px #48706080}
.battle-panel.enemy{top:4%;left:3%}.battle-panel.ally{bottom:30%;right:3%}.bp-title{gap:5px}.bp-title>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.bp-title small,.health,.hp-value{font-size:clamp(12px,2.25cqw,20px)}
.health>span{max-width:38%;overflow:hidden}.caught-mark{display:block;position:absolute;right:4px;bottom:-15px;color:#486878;font-size:12px;line-height:1}.xp i{transition:width .5s linear}
.battle-controls button{min-height:36px;font-size:clamp(16px,3.33cqw,28px);line-height:1.1;padding:4px 6px}
.battle-message{font-size:clamp(16px,3.33cqw,28px)!important;padding-top:4px!important}
.move-controls{gap:3px 8px}.move-controls button{border-left:4px solid var(--move-type,#7890a0);background:#e8edf0;padding:3px 6px}
.move-controls button small{float:none;display:block;font-size:clamp(12px,2.1cqw,18px);line-height:1.05;white-space:normal;color:#526878}
.move-controls .move-match{font-size:clamp(12px,1.9cqw,16px);color:#476854}
.move-controls #moves-back{grid-column:1/-1;border:0;background:transparent;min-height:22px;font-size:14px;padding:0 4px}
.dialogue:has(.move-controls){max-height:48%;padding:1.5% 2.5%}.screen:has(.move-controls) .battle-panel.ally{bottom:48%}
.overlay .presentation-options{margin-top:12px;padding-top:12px;border-top:2px solid #90a8b8}
.pc-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.pc-toolbar span{text-align:center;line-height:1}.pc-toolbar small{display:block;color:#587088;margin-top:4px}.pc-toolbar button{min-width:40px;text-align:center}
.pc-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;padding:8px;background:#80a890;border:3px solid #486878;box-shadow:inset 0 0 0 2px #b0d0b0}
.pc-grid button,.pc-empty{height:48px;min-height:48px;background:#b8d0b0;border:1px solid #88a890;position:relative;padding:1px;box-shadow:none;text-align:center}.pc-grid button img{width:32px;height:32px;max-width:none;object-fit:contain;margin:auto;image-rendering:pixelated}.pc-grid small{position:absolute;right:3px;bottom:0;line-height:1;font-size:12px;color:#384858;background:#d8e8c0}
.pc-empty{background:#a8c0a8;box-shadow:inset 1px 1px #98b498}.pc-party{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.pc-party button{display:flex;align-items:center;gap:6px;padding:4px;font-size:16px}.pc-party img{width:32px;height:32px;object-fit:contain;flex:0 0 auto}.pc-party button>span{min-width:0;overflow-wrap:anywhere}.pc-party small{font-size:12px}.pc-hint{font-size:14px!important;margin-top:0}.pc-preview{display:flex;align-items:center;gap:20px;padding:10px;background:#d8e8d0;border:2px solid #88a890}.pc-preview>img{width:128px;height:128px;object-fit:contain;flex:0 0 auto}
.screen[data-effects=false] .advance,.screen[data-effects=false] #press-start span,.screen[data-effects=false] .startup-mark{animation:none}.screen[data-effects=false] .xp i{transition:none}
.area-map-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:20px;align-items:start}
.area-map-sheet{padding:8px;background:#c8d8c0;border:3px solid #486878}.area-map-sheet canvas{width:100%;height:auto;max-height:60cqw;object-fit:contain;image-rendering:pixelated}
.map-legend{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:14px;line-height:1.1;margin-top:8px}.map-legend span{display:flex;align-items:center;gap:5px}.map-legend i{width:9px;height:9px;border:1px solid #384858;display:inline-block}
.map-you{background:#e84838}.map-door{background:#f8f0c0}.map-heal{background:#e86868}.map-person{background:#e8b850}
.area-map-notes h3{margin-top:0}.area-map-notes p{font-size:18px;line-height:1.15;margin-bottom:12px}.area-buttons{display:grid;gap:4px}.area-buttons button{font-size:18px;min-height:34px}.area-buttons button[aria-pressed=true]{background:#c0d8b8;border-color:#507058}.area-map-notes .wide-button{margin-top:8px}
.journey-strip{display:flex;gap:8px;margin:12px 0 0;max-width:100%;width:100%}.journey-strip button{font-size:16px;background:#20364c;color:#e0e8e8;border-color:#526c80;box-shadow:none;min-height:38px}
.journey-strip #journal-button{flex:1;display:flex;align-items:center;gap:10px;min-width:0}.journey-strip #journal-button>span:first-child{color:#d8c080;flex-shrink:0}.journey-strip #objective{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80ch}
.touch-controls[data-enabled=true]{display:grid;grid-template-columns:minmax(138px,1fr) 44px 58px;grid-template-rows:66px 66px auto;gap:6px 10px!important;padding:10px 4px 4px}
.touch-controls .dpad{grid-column:1;grid-row:1/3;grid-template-rows:44px 44px 44px;justify-self:start}
.touch-controls .dpad [data-hold=up]{grid-row:1}.touch-controls .dpad [data-hold=down]{grid-row:3}.touch-controls .dpad [data-hold=left],.touch-controls .dpad [data-hold=right]{grid-row:2}
.dpad:after{content:'';grid-column:2;grid-row:2;background:#385068;box-shadow:inset 0 0 0 2px #203448}.touch-controls .dpad button{background:#d0d8e0;border-color:#7890a8;box-shadow:inset 0 -3px #90a0b8}
.touch-controls #run-button{grid-column:2;grid-row:1;align-self:end;margin-bottom:4px}.touch-controls #back-button{grid-column:2;grid-row:2;align-self:start;margin-top:4px}.touch-controls #interact-button{grid-column:3;grid-row:1/3;align-self:center;width:58px;height:58px;background:#a8d8c8}
.touch-controls .touch-help{grid-column:1/-1;grid-row:3;font-size:14px;margin-top:4px}.touch-controls button:active{filter:brightness(.85);box-shadow:inset 0 2px #304858}
.console:fullscreen .screen{width:var(--screen-width);max-width:98vw}.console:fullscreen .touch-controls{max-width:600px}
@media(max-width:780px){.area-map-layout{gap:10px;grid-template-columns:1fr 1fr}.area-map-sheet{padding:4px}.area-map-notes p,.area-buttons button{font-size:14px}.area-buttons button{padding:3px 5px;min-height:28px}.area-map-notes h3{font-size:16px}.map-legend{font-size:12px;gap:4px 6px}.map-legend i{width:7px;height:7px}.journey-strip{margin-top:10px}.journey-strip button{font-size:14px;padding:4px 8px}.console-foot{gap:8px}.console-foot #touch-toggle{font-size:14px;min-height:36px}.console-foot #menu-button{min-height:36px}.overlay .menu-grid button{min-height:40px}.battle-controls button{min-height:28px}.move-controls button{font-size:14px;min-height:34px}.move-controls .move-match{display:none}.dialogue:has(.move-controls){max-height:48%}.screen:has(.move-controls) .battle-panel.ally{bottom:48%}.dialogue .speaker{font-size:12px}.dialogue .battle-advance{font-size:12px}}
.console.is-landscape{display:grid;grid-template-columns:138px auto 70px;align-items:center;gap:8px;padding:4px;width:max-content;max-width:100%;height:auto}
.console.is-landscape .screen{grid-column:2;grid-row:1;width:var(--screen-width)}
.console.is-landscape .console-foot{display:none}.console.is-landscape .touch-controls[data-enabled=true]{display:contents}
.console.is-landscape .touch-controls .dpad{grid-column:1;grid-row:1;align-self:center;justify-self:center}
.console.is-landscape .touch-controls #run-button{grid-column:1;grid-row:1;align-self:end;justify-self:center;margin-bottom:4px}
.console.is-landscape .touch-controls #interact-button{grid-column:3;grid-row:1;align-self:center;justify-self:center;transform:translateY(-32px)}
.console.is-landscape .touch-controls #back-button{grid-column:3;grid-row:1;align-self:center;justify-self:center;transform:translateY(36px);width:48px;text-align:center}
.console.is-landscape .touch-help{display:none}.app:has(.is-landscape){padding:2px 4px}.app:has(.is-landscape) .masthead{height:26px;margin:0 0 3px}.app:has(.is-landscape) .masthead button{font-size:14px;min-height:24px}.app:has(.is-landscape) footer,.app:has(.is-landscape) .journey-strip{display:none}
.console.is-landscape:fullscreen{width:100vw;height:100vh;justify-content:center}
@media(max-width:780px){.pc-toolbar{font-size:16px;margin-bottom:6px}.pc-toolbar small{font-size:12px}.pc-grid{padding:4px;gap:3px}.pc-party{grid-template-columns:1fr 1fr}.pc-party button{font-size:14px}.pc-preview{gap:12px}.pc-preview>img{width:64px;height:64px}.pc-preview p{font-size:16px}.overlay[data-kind=menu] .pause-list button{min-height:28px}}
@media(prefers-reduced-motion:reduce){.dialogue .advance{animation:none}.xp i{transition:none}}

/* Move reading keeps choices inspectable on touch screens without spending a turn. */
.move-reading-list{display:grid;gap:12px}.move-card{background:#e8efd8;border:2px solid #88a898;padding:10px 12px;box-shadow:inset 0 0 0 2px #f8f8e0}.move-heading{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.move-heading strong{font-size:22px}.move-card>small{display:block;font-size:16px;line-height:1.3;color:#486070;margin-top:5px}.move-card .move-description,.move-list .move-description{display:block;font-size:18px;line-height:1.25;margin:7px 0 10px;color:#304858}.new-move{background:#d0e8c0;border-color:#507858;margin-bottom:12px}.move-list>div{padding:10px 0}.move-card button{min-height:40px}.move-controls #move-info,.move-controls #moves-back{grid-column:auto;font-size:clamp(12px,2.1cqw,18px);min-height:26px;border:1px solid #90a8b8;background:#d0e0d8;padding:2px 4px}.screen[data-scene=evolution] .dialogue{min-height:34%;max-height:46%}#evolution-next{display:block;margin-left:auto;min-height:26px;padding:2px 6px;font-size:clamp(12px,2.3cqw,20px);border:0;background:transparent}.move-reading-list .type{font-size:14px}
@media(max-width:780px){.move-card{padding:8px}.move-heading strong{font-size:18px}.move-card>small{font-size:14px}.move-card .move-description,.move-list .move-description{font-size:16px}.move-card button{font-size:16px}}

@container (max-width:350px){.pc-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@container (max-width:280px){.pc-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.party-card{flex-wrap:wrap}.starter-grid,.dex-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

.learnable-move .learned-level{display:block;margin:0 0 8px;font:600 14px/1.4 system-ui,sans-serif;color:#486070}.learnable-move-actions{display:flex;justify-content:flex-end;margin-top:10px}.learnable-moves .move-card{min-width:0}.learnable-moves .move-description{overflow-wrap:anywhere}