/* Native Emerald framing, distinct menu screens, adaptive to the existing controller. */
.game-screen{container-type:size}
#placeholderScreen{--menu-dark:#386078;--menu-mid:#6898a8;--menu-light:#d8e8e8;--menu-paper:#f8f8e8;color:#304850;padding:0;background:#385868}
#placeholderScreen[data-menu-tone="journal"]{--menu-dark:#486c58;--menu-mid:#88a878;--menu-light:#e0e8c8}
#placeholderScreen[data-menu-tone="options"]{--menu-dark:#485870;--menu-mid:#7890a0;--menu-light:#d8e0e8}
#placeholderScreen[data-menu-tone="bag"]{--menu-dark:#587060;--menu-mid:#98b088;--menu-light:#e0e8c8}
#placeholderScreen:not(.dex-mode) .placeholder-window{position:relative;display:flex;flex-direction:column;width:100%;height:100%;max-height:100%;padding:0;overflow:hidden;border:0;box-shadow:none;background:var(--menu-light);text-align:left}
#placeholderScreen:not(.dex-mode) .window-title{position:relative;flex:none;min-height:47px;margin:0;padding:11px 90px 8px 14px;background:var(--menu-dark);border-bottom:3px solid #a8c8c0;color:#fff;font-size:18px;line-height:1.35;font-weight:normal;text-shadow:1px 2px #283848}
#placeholderScreen:not(.dex-mode) .placeholder-symbol{display:block;flex:none;order:0;margin:0;padding:4px 14px;background:var(--menu-mid);color:#f8f8e8;font:10px/1.4 monospace;letter-spacing:1.4px;border-bottom:2px solid #ffffff60}
.menu-back{position:absolute;right:7px;top:1px;z-index:4;min-height:44px;min-width:76px;background:none;border:0;color:#fff;font-size:14px;padding:4px 7px}
.menu-back[hidden]{display:none}
.menu-back:active{background:#ffffff20}
#placeholderScreen:not(.dex-mode) .menu-content{flex:1;min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;padding:10px;font-size:15px;line-height:1.55;scrollbar-width:thin;scrollbar-color:var(--menu-mid) transparent;background:repeating-linear-gradient(0deg,transparent 0 3px,#ffffff18 3px 4px)}
#placeholderScreen:not(.dex-mode) .window-help{flex:none;order:5;margin:0;min-height:30px;padding:6px 10px;border-top:3px solid var(--menu-mid);color:#384850;background:#f8f8e8;font-size:12px;line-height:1.4;text-align:center}
.menu-notes{padding:10px 12px;background:var(--menu-paper);border:2px solid #98b0a0;box-shadow:inset 0 0 0 2px #fff;margin-bottom:10px;overflow-wrap:anywhere}
.menu-notes:empty{display:none}
.menu-notes p{margin:0 0 8px}.menu-notes p:last-child{margin-bottom:0}
.view-document .menu-notes p{padding:7px 0;border-bottom:1px solid #c8d0b8}
.menu-actions{border:8px solid transparent;border-image:url('./assets/ui-emerald/window.png?h=8d3b044fac') 8 stretch;background:#f8f8f8;padding:2px;min-width:0}
#placeholderScreen .menu-actions .party-choice,#placeholderScreen .bag-row{position:relative;margin:0;min-height:48px;padding:10px 30px 10px 22px;border:0;border-radius:0;border-bottom:1px solid #d8e0d8;background:transparent;color:#384850;font-size:15px;box-shadow:none}
#placeholderScreen .menu-actions .party-choice:last-child{border-bottom:0}
#placeholderScreen .menu-actions .party-choice.is-selected,#placeholderScreen .bag-row.is-selected{background:#e0e8c8;color:#203840;box-shadow:none}
#placeholderScreen .menu-actions .party-choice.is-selected::before,#placeholderScreen .bag-row.is-selected::before{content:'';position:absolute;left:6px;top:19px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid #384850}
#placeholderScreen .menu-actions .party-choice:has(.party-icon){padding-right:60px;min-height:60px}
.menu-actions .party-icon{width:48px;height:48px;top:5px;right:5px}
#placeholderScreen .menu-actions .party-choice:focus-visible,#placeholderScreen .bag-row:focus-visible{outline:3px solid #bd7038;outline-offset:-3px}
#placeholderScreen .party-hp{appearance:none;height:8px;border:2px solid #486068;border-radius:6px;overflow:hidden;background:#304850;accent-color:#40b888}
#placeholderScreen progress::-webkit-progress-bar{background:#304850}
#placeholderScreen .party-hp::-webkit-progress-value{background:linear-gradient(#a0e0a0 0 45%,#40b888 45%)}
#placeholderScreen .party-hp::-moz-progress-bar{background:#40b888}
#placeholderScreen [data-health="mid"] .party-hp::-webkit-progress-value{background:#e8c850}
#placeholderScreen [data-health="low"] .party-hp::-webkit-progress-value{background:#e87058}
#placeholderScreen [data-health="mid"] .party-hp::-moz-progress-bar{background:#e8c850}
#placeholderScreen [data-health="low"] .party-hp::-moz-progress-bar{background:#e87058}
.mon-status{font-size:11px;color:#fff;background:#a85858;padding:1px 5px;line-height:1.4;border:1px solid #f8f8e8;white-space:nowrap}
/* Party: single-battle arrangement from src/data/party_menu.h. */
#placeholderScreen[data-menu-view="party"]{--menu-dark:#386078;--menu-mid:#70a0b0;--menu-light:#80b0b0}
#placeholderScreen .view-party{display:flex;flex-direction:column;padding:10px 8px;gap:10px;background:repeating-linear-gradient(0deg,#78a8a8 0 4px,#80b0b0 4px 8px)}
.party-roster{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.25fr);grid-template-rows:repeat(5,minmax(49px,1fr));gap:6px;flex:1;min-height:285px}
#placeholderScreen .party-slot,.party-v64-empty{position:relative;grid-column:2;display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;align-content:center;gap:0 3px;margin:0;min-height:49px;padding:3px 6px 3px 3px;background:#e0f0e8;border:2px solid #386078;outline:2px solid #b8d8d0;outline-offset:-4px;border-radius:10px 5px 10px 5px;color:#284858;box-shadow:0 2px #386078;font-size:13px;line-height:1.25}
#placeholderScreen .party-slot.is-selected{border-color:#e88840;background:#fff8d8;outline-color:#f0c870;box-shadow:0 2px #986038}
#placeholderScreen .party-slot:first-child,.party-v64-empty:first-child{grid-column:1;grid-row:1/6;align-self:start;margin-top:25px;min-height:190px;display:flex;flex-direction:column;justify-content:center;padding:10px 6px;gap:7px;text-align:center}
.party-slot:first-child .roster-art{width:80px;height:80px}
.roster-art{width:44px;height:44px;object-fit:contain;image-rendering:pixelated;grid-row:1/3}
.roster-identity{min-width:0;display:flex;flex-direction:column;gap:2px}.roster-identity strong{font-weight:normal;font-size:14px;overflow-wrap:anywhere}.roster-identity small{font-size:11px;color:#506878}
.roster-health{width:100%;min-width:0;display:grid;grid-template-columns:16px minmax(0,1fr);gap:1px 3px;align-items:center}.roster-hp-label{font:700 9px/1 monospace;color:#b87830}
#placeholderScreen .roster-health .party-hp{width:100%;margin:0;height:7px}.roster-hp-value{grid-column:2;text-align:right;font:11px/1.3 monospace}
.party-slot:first-child .roster-identity strong{font-size:16px}.party-slot:first-child .roster-hp-value{font-size:13px}
.party-slot .mon-status{position:absolute;top:3px;left:3px}.party-slot[data-health="fainted"]{filter:saturate(.4)}
.party-v64-empty{display:flex;justify-content:center;gap:8px;color:#c8e0d8;background:#609098;border-color:#507888;outline-color:#78a8a8;box-shadow:none;border-style:dashed;font-size:17px}.party-v64-empty small{font-size:11px}
.party-instruction{background:#f8f8f0;border:8px solid transparent;border-image:url('./assets/ui-emerald/window.png?h=8d3b044fac') 8 stretch;font-size:13px;padding:3px 5px;color:#384850;flex:none}.party-instruction p{margin:0}
/* Summary: portrait stays beside the selected data page. */
#placeholderScreen[data-menu-view="summary"]{--menu-dark:#5068a0;--menu-mid:#8898c0;--menu-light:#d0e0d0}
#placeholderScreen .view-summary{display:flex;flex-direction:column;padding:0;overflow:hidden;background:#c0d8c0}
#placeholderScreen .summary-tabs{position:static;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));flex:none;padding:4px 6px 0;gap:3px;background:#8898c0}
#placeholderScreen .summary-tabs .party-choice{min-height:44px;padding:7px 2px;margin:0;border:2px solid #506888;border-bottom:0;border-radius:7px 7px 0 0;background:#b8c8d8;color:#384858;font-size:14px;box-shadow:none}
#placeholderScreen .summary-tabs .party-choice.is-selected{background:#f8f8e8;border-color:#f8f8e8;box-shadow:inset 0 4px #e8a858}
.summary-body{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr);gap:8px;padding:9px;overflow:auto;min-height:0;flex:1}
.summary-portrait{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:10px 5px;align-self:start;background:repeating-linear-gradient(0deg,#e0e8c8 0 3px,#d8e0c0 3px 4px);border:2px solid #809878;box-shadow:inset 0 0 0 2px #f8f8e8;border-radius:8px}
.summary-number{font:12px monospace;align-self:flex-start;color:#587058;padding-left:4px}.summary-art{width:100%;max-width:144px;aspect-ratio:1;object-fit:contain;image-rendering:pixelated}.summary-name{font-size:16px;font-weight:normal;text-align:center}.summary-level{font-size:13px}.summary-portrait .dex-type{font-size:11px;min-width:35px;padding:1px 4px}
.summary-detail{background:#f8f8e8;border:2px solid #90a898;border-radius:7px;padding:8px;min-width:0;align-self:start;font-size:13px}.summary-fact{display:flex;justify-content:space-between;gap:8px;align-items:center;min-height:31px;border-bottom:1px solid #d8e0c8}.summary-fact strong{font-weight:normal;color:#284858;text-align:right;font-variant-numeric:tabular-nums}.summary-fact>span{color:#607068;flex:none}.summary-memo{font-size:12px;line-height:1.65;margin:10px 0;overflow-wrap:anywhere}.exp-meter{width:100%;height:7px;appearance:none;margin-top:8px;accent-color:#6098d8}.exp-meter::-webkit-progress-value{background:#6098d8}.exp-meter::-moz-progress-bar{background:#6098d8}
.summary-move{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:4px;padding:8px 0;border-bottom:1px solid #c8d0b8;min-height:67px}.summary-move:last-child{border-bottom:0}.summary-move .dex-type{min-width:34px;font-size:10px;padding:2px}.summary-move strong{font-size:13px;font-weight:normal}.move-pp{text-align:right;grid-column:1/-1;font-size:12px}.move-spec{grid-column:1/-1;font-size:10px;color:#586858}.empty-move{grid-column:1/-1;text-align:center;color:#889080}
#placeholderScreen .view-member{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.2fr);gap:8px;align-content:start}.view-member .summary-portrait{grid-column:1;grid-row:1/3}.view-member .menu-notes{grid-column:2;margin-bottom:0;font-size:13px;padding:7px}.view-member .menu-actions{grid-column:2}.view-member .party-choice{font-size:13px!important}
/* Bag's original separate pocket, inventory and description windows. */
#placeholderScreen .view-bag{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);grid-template-rows:minmax(140px,1fr) auto;gap:8px;padding:10px;background:repeating-linear-gradient(90deg,#c8d8a8 0 4px,#d0e0b0 4px 8px)}
.bag-pocket{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;min-width:0;border:2px solid #90a878;background:#d8e8b8;border-radius:10px 10px 4px 4px;box-shadow:inset 0 0 0 2px #f0f0c8;padding:8px}.bag-pocket-title{font-size:15px;font-weight:normal;background:#608078;color:#fff;border:2px solid #486858;align-self:stretch;text-align:center;margin:0;padding:6px 1px}.bag-art{width:128px;max-width:100%;aspect-ratio:1;image-rendering:pixelated;object-fit:contain}.bag-indicators{display:flex;gap:6px}.bag-indicators span{display:block;width:16px;height:8px;border:2px solid #587060;background:#a8b888}.bag-indicators .active{background:#f8d880}
.bag-inventory{min-width:0;background:#f8f8e8;border:2px solid #88a088;align-self:stretch;overflow:auto;padding:4px}.bag-list-heading{color:#607060;font-size:12px;text-align:center;border-bottom:2px solid #b8c8a0;padding:6px}.bag-description{grid-column:1/-1;border:8px solid transparent;border-image:url('./assets/ui-emerald/window.png?h=8d3b044fac') 8 stretch;background:#f8f8f8;padding:5px;font-size:14px;min-height:75px;line-height:1.6}
#placeholderScreen .bag-row{font-size:14px;padding-right:6px}
.bag-empty{padding:12px 6px;font-size:13px;color:#708068}
/* Options, notebooks and service counters retain one consistent reading order. */
#placeholderScreen[data-menu-tone="options"] .menu-actions{background:#e8f0f0}
#placeholderScreen .option-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.option-value{color:#a85838;font-weight:normal;white-space:nowrap}.option-label{min-width:0}
.view-choices:has(>.world-atlas){display:grid;grid-template-columns:minmax(0,1fr);align-content:start}.view-choices>.world-atlas{border:6px solid #88a888;max-width:360px;margin:0 auto 8px;border-radius:3px}
#placeholderScreen[data-menu-tone="journal"] .menu-notes{background:repeating-linear-gradient(0deg,#f8f4d8 0 26px,#e4e4c8 26px 27px);border-left:5px solid #b89060}
#placeholderScreen[data-menu-tone="storage"] .menu-actions{background:repeating-linear-gradient(0deg,#e0e8f0 0 40px,#d0e0e8 40px 42px)}
.sprite-actions .party-choice{background:#f8f8e8!important}.sprite-actions .party-choice.is-selected{background:#e0e8c8!important}
.storage-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:8px;background:repeating-linear-gradient(0deg,#b0c8d8 0 39px,#a8c0d0 39px 40px)!important}
#placeholderScreen .storage-grid .party-choice:has(.party-icon){display:flex;flex-direction:column-reverse;align-items:center;justify-content:center;gap:4px;padding:6px;min-height:102px;text-align:center;border:2px solid #7898b0;border-radius:7px;font-size:13px}
#placeholderScreen .storage-grid .party-icon{position:static;width:56px;height:56px}.storage-grid .storage-nav{grid-column:1/-1}.storage-grid .party-choice.is-selected{outline:2px solid #d08048;outline-offset:-2px}
#placeholderScreen.starter-mode .placeholder-copy{display:flex;flex-direction:column;gap:8px}.starter-mode .menu-notes{margin:0;font-size:13px}.starter-mode .menu-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
#placeholderScreen.starter-mode .menu-actions .party-choice{display:flex;flex-direction:column-reverse;align-items:center;justify-content:center;padding:6px;gap:4px;text-align:center;min-height:106px;font-size:13px;border:2px solid #90a898;border-radius:6px}.starter-mode .menu-actions .party-icon{position:static;width:64px;height:64px}
/* START stays over the world. The list can scroll independently of its caption. */
#startMenu{display:grid;grid-template-columns:minmax(0,1fr) minmax(162px,.9fr);grid-template-rows:minmax(0,1fr) auto;gap:8px;padding:8px;align-items:start;justify-items:stretch;background:#18383030}
#startMenu.is-hidden{display:none}
#startMenu .start-menu-window{grid-column:2;grid-row:1;max-width:none;width:100%;max-height:100%;padding:1px;border:8px solid transparent;border-image:url('./assets/ui-emerald/window.png?h=8d3b044fac') 8 stretch;box-shadow:2px 3px #18383060;background:#f8f8f8;overflow:auto;scrollbar-width:thin}
#startMenu .menu-item{min-height:44px;padding:9px 4px 9px 23px;font-size:15px;line-height:1.4;font-weight:normal;color:#384850}
#startMenu .menu-item.is-selected{background:#e8eed8}
#startMenu .menu-item.is-selected::before{content:'';left:7px;top:16px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid #384850}
.start-info{grid-column:1/-1;grid-row:2;background:#f8f8f8;border:8px solid transparent;border-image:url('./assets/ui-emerald/window.png?h=8d3b044fac') 8 stretch;padding:5px 8px;min-width:0;color:#384850;font-size:12px;line-height:1.5}.start-location{float:right;font-size:11px;color:#708078;max-width:50%;text-align:right}.start-heading{font-size:15px;font-weight:normal}.start-info p{margin:4px 0}.start-counts{display:flex;flex-wrap:wrap;gap:4px 14px;padding-top:4px;border-top:1px solid #d0d8d0;font-size:11px;color:#587068}
/* Integrate the existing full-featured Pokédex with Emerald's green casing. */
#placeholderScreen.dex-mode{--menu-dark:#385858;padding:0;background:#587878}
.dex-mode .menu-back{display:none}.dex-mode .placeholder-window{border:0;width:100%;height:100%;max-height:100%;padding:0;background:#d8e8d0}
.dex-mode .dex-header{background:#587878;border-color:#385858;color:#fff}.dex-mode .dex-tools{background:#a8c8b0;border-bottom:3px solid #688878}.dex-mode .dex-body{background:#d8e8d0}.dex-mode .dex-list{background:#d0e0c8}.dex-mode .dex-row{background:#edf0d8;color:#384850;border-color:#c0c8b0}.dex-mode .dex-number{color:#788070}.dex-mode .dex-row.selected{background:#f0c880;color:#384850;box-shadow:inset 4px 0 #c07048}.dex-mode .dex-preview{background:repeating-linear-gradient(0deg,#e8f0d8 0 3px,#e0e8d0 3px 4px)}.dex-mode .dex-footer{background:#587878;border-color:#385858;color:#fff}.dex-mode .dex-content{background:#f8f8e8}.dex-mode .dex-tabs{background:#a8c8b0}.dex-mode .dex-pagination{color:#384850}
/* Small game viewports use scrolling instead of tiny hit targets or clipped rows. */
@container (max-height:420px){
 #placeholderScreen:not(.dex-mode) .window-title{min-height:44px;font-size:16px;padding-top:10px;padding-bottom:7px}
 #placeholderScreen:not(.dex-mode) .placeholder-symbol{padding:2px 12px;font-size:9px}
 #placeholderScreen:not(.dex-mode) .window-help{padding:4px 8px;min-height:25px;font-size:11px}
 #placeholderScreen .view-party{gap:6px;padding:6px}.party-roster{flex:none;min-height:265px;gap:4px}
 .summary-body{padding:6px;gap:6px}.summary-art{max-width:96px}.summary-portrait{gap:4px;padding:5px}.summary-detail{padding:5px}
 #placeholderScreen .view-bag{grid-template-rows:minmax(144px,1fr) auto;padding:6px;gap:6px}.bag-art{width:96px}.bag-pocket{gap:4px;padding:4px}.bag-description{min-height:60px;padding:2px;font-size:13px}
 #startMenu{grid-template-columns:minmax(0,1fr) minmax(170px,1fr);grid-template-rows:minmax(0,1fr);padding:6px}
 .start-info{grid-column:1;grid-row:1;align-self:end}.start-location{float:none;display:block;max-width:none;text-align:left;margin-bottom:6px}.start-counts{display:grid;gap:3px}
}
@container (min-width:520px) and (max-height:420px){
 #placeholderScreen .view-party{position:relative;display:block;overflow:auto;padding:6px}
 .party-roster{height:100%;min-height:261px;gap:4px;grid-template-rows:repeat(5,minmax(49px,1fr))}
 #placeholderScreen .party-slot:first-child{margin-top:8px;min-height:168px;gap:3px;padding:5px}
 .party-slot:first-child .roster-art{width:64px;height:64px}
 .party-instruction{position:absolute;left:6px;bottom:8px;width:calc(34.78% - 9px);font-size:11px;padding:2px;line-height:1.4}
}
@container (min-width:520px){
 #placeholderScreen .view-choices{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-content:start;gap:10px}.view-choices .menu-notes{align-self:start;margin:0}.view-choices .menu-actions{align-self:start}.view-choices .menu-actions:first-child,.view-choices .menu-notes:empty+.menu-actions{grid-column:1/-1}
 .view-choices:has(>.world-atlas){grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.view-choices>.world-atlas{grid-column:1;grid-row:1/3}.view-choices:has(>.world-atlas)>.menu-notes,.view-choices:has(>.world-atlas)>.menu-actions{grid-column:2}
 .party-roster{grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr)}.party-slot:not(:first-child){grid-template-columns:48px minmax(0,1fr) minmax(80px,.9fr)!important}.party-slot:not(:first-child) .roster-health{grid-column:3}.party-slot:not(:first-child) .roster-art{grid-row:1}.party-slot:not(:first-child) .roster-identity strong{font-size:16px}
 .summary-body{grid-template-columns:minmax(140px,.7fr) minmax(0,1.6fr)}.summary-detail{font-size:15px}.summary-move{grid-template-columns:44px minmax(0,1fr) auto;min-height:58px}.move-pp{grid-column:3}.move-spec{grid-column:2/4}
}
@media(prefers-reduced-motion:reduce){#placeholderScreen *,#startMenu *{scroll-behavior:auto}}

/* V64 hotfix: narrow party rows must contain both identity and the HP fraction.
   A 49px track could be shorter than the two intrinsic content rows on iOS. */
@container (max-width:519px){
 #placeholderScreen .party-roster{grid-template-rows:repeat(5,minmax(min-content,1fr));min-height:344px;flex-shrink:0}
 #placeholderScreen .party-slot:not(:first-child){min-height:64px;grid-template-rows:minmax(22px,auto) minmax(24px,auto);padding:5px 7px 7px 4px}
 #placeholderScreen .party-v64-empty{min-height:64px}
 .party-slot:not(:first-child) .roster-identity{flex-direction:row;align-items:center;justify-content:space-between;gap:4px;flex-wrap:wrap}
 .party-slot:not(:first-child) .roster-identity small{white-space:nowrap}
 .party-slot:not(:first-child) .roster-health{grid-column:2;grid-row:2;align-self:center}
 .party-slot:not(:first-child) .roster-hp-value{line-height:1.3;padding-bottom:2px}
}