/* Portrait gameplay; compact HUD overlays stay within the square battlefield. */
.app{min-height:100dvh;display:block;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
.workspace{width:100%;max-width:480px;margin:0 auto;padding:0}
.battle-panel{--board-size:320px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"header" "board" "loadout" "controls" "messages";width:100%;border:1px solid #3b4238;background:#151e19;min-width:0}
.tactical-panel{display:contents}
.viewport{grid-area:board;width:var(--board-size);height:var(--board-size);min-height:0;max-height:none;aspect-ratio:1;position:relative;overflow:hidden;justify-self:center;background:#10191a}
.viewport:after{display:none}
#battle{width:100%;height:100%;display:block;touch-action:none}
.battle-header{grid-area:header;height:44px;padding:0 8px;display:flex;align-items:center;gap:8px;background:#1c271e;border-bottom:1px solid #384036}
.battle-header strong{font-size:11px;font-weight:500;flex:1;min-width:0}
.turn-indicator{font:10px var(--mono);display:flex;align-items:center;gap:5px;white-space:nowrap;color:#b2bd9f}
.turn-indicator b{margin:0;font:11px var(--mono)}
.map-button{height:44px;min-width:44px;width:44px;padding:0;border:1px solid #455147;background:#1d2a21;color:#bfcdad;font:21px var(--mono)}
.vitals-bar{grid-area:vitals;min-height:44px;display:flex;align-items:center;padding-left:8px;gap:8px;border-bottom:1px solid #384036;background:#17211b}
.mobile-health{position:static;display:block;width:auto;min-width:85px;flex:1;font-size:10px;padding:0;background:none;color:#b8c8a6}
.mobile-health b{float:right;font:10px var(--mono)}.mobile-health>div{height:3px;background:#384333;margin-top:4px}.mobile-health i{height:100%;display:block;background:#becb96}
#level{font:9px var(--mono);color:#a5b997}
.map-tools{position:static;display:flex;gap:0;margin-left:auto}
.loadout-bar{grid-area:loadout;min-height:44px;height:auto;display:flex;align-items:stretch;gap:0;padding:0 0 0 8px;background:#19251c;border-bottom:1px solid #384334}
.loadout-bar>div{display:flex;justify-content:center;flex-direction:column;gap:3px;flex:1;min-width:0;padding-right:4px}
#quick-weapon{font:10px var(--mono);color:#dcc396}#status-effects{font-size:9px;line-height:1.4;color:#b8cda6}
.loadout-bar button{min-width:44px;min-height:44px;height:auto;padding:0 7px;border:1px solid #45583b;background:#263622;color:#c1d0b2;font-size:11px;white-space:nowrap}
.control-deck{grid-area:controls;display:flex;align-items:center;gap:8px;padding:6px;position:static}
.direction-pad{display:grid;grid-template-columns:44px 44px 44px;grid-template-rows:44px 44px 44px;gap:2px;flex:none}
.direction-pad button{border:1px solid #526143;background:#293725;color:#c4d5b3;font:25px var(--mono);padding:0}
.direction-pad .north{grid-area:1/2}.direction-pad .west{grid-area:2/1}.direction-pad .east{grid-area:2/3}.direction-pad .south{grid-area:3/2}
.direction-pad .wait{grid-area:2/2;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:20px;color:#edca92;background:#41412b;border-color:#aa915a}
.direction-pad .wait small{font:9px 'Noto Sans TC',sans-serif}
.action-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;flex:1;max-width:none}
.action-buttons .action{min-width:0;min-height:66px;height:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:1px solid #526143;background:#273420;color:#c4d1b3;padding:3px}
.action-buttons .action.primary{background:#dc935d;border-color:#f4b17b;color:#20281c}
.action-icon{font:23px/1 var(--mono);margin:0}.action strong{font-size:10px;font-weight:500;white-space:normal;text-align:center}.action b{font:10px var(--mono);margin:0}
.action.aiming{border-color:#f5be76!important;background:#826037!important;color:#ffe2af!important}
#field-messages{grid-area:messages;min-height:28px;display:flex;flex-direction:column;align-items:stretch;background:#121c17}
.battle-notice{position:static;transform:none;max-width:none;min-width:0;min-height:28px;height:auto;padding:5px 8px;border:0;background:none;color:#c5cbaa;font-size:10px;text-align:left;opacity:1;transition:none;white-space:normal;line-height:1.6;pointer-events:none}
.battle-notice:not(.show){color:#8e9c80}
#overview{width:100%;height:auto;aspect-ratio:1;image-rendering:pixelated;touch-action:auto}
.intro-rules{display:grid;grid-template-columns:1fr 1fr;gap:10px;border-block:1px solid #435337;padding-block:14px;color:#d6b382;font-size:11px}
@media(min-width:750px){.battle-header strong{font-size:13px}.action strong{font-size:12px}.action-buttons .action{min-height:66px}}
@media(max-width:365px){.control-deck{gap:4px;padding:4px}.action strong{font-size:9px}.loadout-bar button{padding:0 5px;font-size:10px}#quick-weapon{font-size:9px}#status-effects{font-size:8px}}
/* 3.1.1: fixed controls and message row; compact corner HUD is intentional. */
body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
input,textarea{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
.battle-panel,.battle-panel button{touch-action:manipulation}
#field-messages{height:28px;min-height:28px;max-height:28px;overflow:hidden}
.battle-notice{height:28px;min-height:28px;max-height:28px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.loadout-bar{height:44px;min-height:44px;max-height:44px;overflow:hidden}
#status-effects{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vitals-bar{position:absolute;inset:6px;display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:0;padding:0;border:0;background:none;pointer-events:none}
.mobile-health{position:static;flex:none;width:108px;min-width:0;padding:5px;background:#142019aa;font-size:9px}
#level{position:static;background:#142019aa;padding:3px 5px}
/* 3.43: armor plates sit under health; the level tag stacks below instead of a fixed offset. */
.mobile-health .plates{margin-top:4px}.mobile-health span.plates{display:inline-block}.mobile-health i#mobile-plates-bar{background:#93bfd1}
/* 3.43: at half health or less the battlefield edges pulse red; update() deepens it as health falls. */
.low-health{--danger:0;position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .4s;will-change:opacity;box-shadow:inset 0 0 calc(var(--board-size,320px)*(.07 + .3*var(--danger))) calc(var(--board-size,320px)*(.012 + .12*var(--danger))) rgba(214,36,30,var(--edge,.45))}
.low-health.on{opacity:1;animation:low-health-pulse var(--pulse,1.6s) ease-in-out infinite}
@keyframes low-health-pulse{0%,100%{opacity:.45}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.low-health.on{animation:none;opacity:.8}}
.map-tools{position:absolute;bottom:0;right:0;gap:2px;pointer-events:auto}
.map-tools .map-button{width:32px;min-width:32px;height:32px;background:#17251bbb;font-size:18px}

#orientation-guard{position:fixed;inset:0;margin:0;width:100vw;max-width:none;height:100dvh;max-height:none;border:0;padding:24px;background:#10191a;text-align:center}
#orientation-guard[open]{display:grid;place-items:center}#orientation-guard::backdrop{background:#10191a}#orientation-guard span{display:block;font:52px var(--mono);color:var(--orange);margin-bottom:12px}

/* Target-linked hologram: out of document flow and completely touch-through. */
.target-card{position:absolute;left:0;top:0;z-index:2;width:104px;display:flex;flex-direction:column;gap:0;padding:4px 2px;border:1px solid #89d8cb88;border-left:2px solid #97eee0;background:linear-gradient(120deg,#102729da,#112026b8);box-shadow:none;pointer-events:none;user-select:none;color:#c8eee3;font:10px/1.15 var(--mono);text-shadow:0 1px 2px #071515;overflow-wrap:anywhere}
.target-card strong{font:600 11px/1.15 'Noto Sans TC',sans-serif;letter-spacing:0;color:#c7fff0}.target-card>b{font-weight:500;color:#ecd18f}.target-state{font-size:9px;color:#efb18d}.target-state:empty{display:none}.target-card.out-of-range{border-color:#c1946d99}.target-card.out-of-range>b{color:#efab88}
.target-link{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:visible}.target-link path{fill:none;stroke:#a5ebda99;stroke-width:1;stroke-dasharray:3 3;vector-effect:non-scaling-stroke}.vitals-bar{z-index:3}
.action-buttons .action[data-action="skill"]:disabled{opacity:.38;cursor:default}
.target-card.compact{padding:3px 1px;gap:0;font-size:9px;line-height:1.1}.target-card.compact strong{font-size:10px}.target-card.compact .target-state{font-size:8px}

.loadout-bar [data-action="toggleTargeting"]{min-width:52px;padding:0 5px}
.loadout-bar [data-action="toggleTargeting"][aria-pressed="true"]{border-color:#96cbb7;color:#d0eee1}
.loadout-bar .enemy-alert{animation:target-alert 1s ease-in-out infinite}
@keyframes target-alert{0%,100%{background:#293323;color:#c4d1b3}50%{background:#b46935;color:#fff0cf;border-color:#ffcb80}}
@media(prefers-reduced-motion:reduce){.loadout-bar .enemy-alert{animation:none;background:#87532b;color:#fff0cf;border-color:#ffcb80}}

.pack-ammo{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;margin:8px 0}.pack-ammo span{display:flex;flex-direction:column;align-items:center;gap:1px;padding:5px 2px;background:#25342b linear-gradient(var(--tint-bg),var(--tint-bg));border-top:2px solid var(--tint);font-size:9px;color:#c8d6bf;text-align:center}.pack-ammo i{font-style:normal;white-space:nowrap}.pack-ammo small{font-size:9px;color:#9fae95}.pack-ammo b{font:12px var(--mono);color:var(--tint)}

.weapon-comparison{width:100%;border-collapse:collapse;font-size:12px;margin:12px 0}.weapon-comparison th,.weapon-comparison td{padding:6px 3px;text-align:left;border-bottom:1px solid #91ab8133}.weapon-comparison thead{color:#9dcdb8}.weapon-comparison tbody th{font-weight:400}.ground-loot small{display:block}.pack-weapon h3,.ground-loot strong{overflow-wrap:anywhere}

.carry-upgrade button{min-height:44px}.carry-upgrade small{order:2}

#target-distance{white-space:pre-line}

.target-traits,.target-order{font-size:9px;color:#b9d9d0}.target-traits:empty,.target-order:empty{display:none}.target-order{color:#e7b781}

.inventory-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:12px 0}.inventory-tabs button{min-width:0;min-height:44px;padding:7px 2px;font-size:13px;background:#202e28;color:#b9cbbd;border:1px solid #6b87704d}.inventory-tabs [aria-selected="true"]{background:#3d5845;color:#edecd6;border-color:#a4be8c}.inventory-tabs button:focus-visible{outline:2px solid #e8ce98;outline-offset:2px}
.prepared-entry{margin:8px 0;padding:10px 12px;border:1px solid #91ab8133;background:#202e28}.prepared-entry.equipped{border-color:#a4be8c}.prepared-entry h3{margin:0;font-size:16px;display:flex;align-items:baseline;gap:8px}.prepared-entry h3 b{margin-left:auto;font:12px var(--mono);color:#e8ce98}.prepared-entry p{font-size:13px}.prepared-entry span{color:#e8ce98}.prepared-entry button{min-height:44px}.pack-empty{padding:20px 0}.action-buttons .action strong{overflow-wrap:anywhere}

.character-choices{border:0;padding:0;margin:14px 0;display:grid;gap:10px}.character-choices legend{font-size:12px;color:#adc6b0}.character-choice{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid #738d7066;background:#23312a;cursor:pointer;min-height:44px}.character-choice:has(input:checked){border-color:#c7d894;background:#354d39}.character-choice input{margin-top:4px;accent-color:#bdce8b;min-width:18px;height:18px}.character-choice span{min-width:0;display:grid;gap:7px}.character-choice strong{font-size:17px}.character-choice small{font-size:12px;line-height:1.5;color:#c6d2c3}.character-choice:focus-within{outline:2px solid #e8ce98;outline-offset:2px}
.operator-portrait{position:relative;display:inline-block!important;flex:0 0 64px;width:64px;height:64px;border:1px solid #90ada766;background:#101c27;overflow:visible;vertical-align:middle}
.operator-portrait img{display:block;width:100%;height:100%;image-rendering:pixelated;object-fit:cover}
.operator-identity{display:flex!important;align-items:center;gap:12px!important;margin:10px 0;min-width:0}
.operator-identity>p,.operator-identity>div{min-width:0}.operator-identity p,.operator-identity h2{margin:0}
.character-choice .character-copy{flex:1}.character-choice .operator-identity{margin:0}.character-choice .operator-identity strong{overflow-wrap:anywhere}
.result-identity .operator-portrait{width:128px;height:128px;flex-basis:128px}
.is-kia img{filter:saturate(.25) brightness(.7)}
.kia-stamp{position:absolute;left:0;right:0;top:44%;text-align:center;transform:rotate(-12deg);border:3px double #ff8175;color:#ff9c8e;background:#461b22b8;font:900 20px/1.15 monospace;letter-spacing:3px;text-shadow:1px 1px #4a1118;pointer-events:none}
.result-identity .kia-stamp{font-size:32px;border-width:5px}

/* Replace the existing heading in place: no extra battlefield row. */
#sector-title{flex:1;min-width:0;min-height:44px;padding:0;text-align:left;font:500 11px var(--mono);color:#c6ddc7;background:none;border:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mission-choices .character-choice strong{font-size:14px}
.mission-choices .character-choice span{gap:3px}

.boundary-opacity{display:grid;grid-template-columns:1fr auto;gap:8px;color:#c6d2c3;font-size:12px}.boundary-opacity input{grid-column:1 / -1;width:100%;min-height:44px;margin:0;accent-color:#c6d2c3;touch-action:pan-y}.boundary-opacity input:focus-visible{outline:2px solid #e8ce98;outline-offset:2px}

/* 標題畫面：暗底、置中標誌與終端機風選單。純呈現，按鈕仍走既有 data-modal 入口。 */
#modal.title{max-width:none;width:100%;height:100dvh;max-height:100dvh;margin:0;border:0;padding:0;background:#0d1211;box-shadow:none;overflow:hidden}
#modal.title::backdrop{background:#0d1211}
#modal.title #modal-content{height:100%}
.title-screen{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:24px 20px calc(24px + env(safe-area-inset-bottom));box-sizing:border-box}
.title-mark{color:var(--orange);width:min(38vw,150px);margin-bottom:18px;filter:drop-shadow(0 0 22px #ee945c33)}
.title-mark svg{display:block;width:100%;height:auto}
.title-word{font:600 clamp(26px,8.5vw,40px)/1 var(--display);letter-spacing:.22em;text-indent:.22em;color:var(--text);margin:0 0 4px;text-align:center}
.title-menu{width:100%;max-width:340px;margin-top:34px;border-top:1px solid #2a332c}
.title-entry{display:grid;grid-template-columns:18px auto 1fr;align-items:baseline;gap:10px;width:100%;padding:15px 6px;background:none;border:0;border-bottom:1px solid #2a332c;color:var(--text);text-align:left;cursor:pointer;font-family:var(--mono)}
.title-caret{color:var(--orange);opacity:.35;font-size:13px;line-height:1}
.title-label{font-size:15px;letter-spacing:.16em}
.title-note{font-size:10px;color:var(--muted);letter-spacing:.04em;justify-self:end;text-align:right;white-space:nowrap}
.title-entry:hover:not(:disabled),.title-entry:focus-visible{background:#141a17;outline:0}
.title-entry:hover:not(:disabled) .title-caret,.title-entry:focus-visible .title-caret{opacity:1}
.title-entry:hover:not(:disabled) .title-label,.title-entry:focus-visible .title-label{color:var(--orange)}
.title-entry:disabled{cursor:default;color:#59635a}
.title-entry:disabled .title-caret{opacity:.12}
.title-entry:disabled .title-note{color:#4a534b}
@media (max-height:600px){.title-mark{width:min(26vw,104px);margin-bottom:12px}.title-menu{margin-top:20px}.title-entry{padding:12px 6px}}
.settings-section{margin-top:22px}

/* 永久升級：每項一張方形卡片。解鎖類目前是靜態展示，尚未接真實 gating。 */
.upgrade-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px;margin:10px 0 4px}
.upgrade-card{display:flex;flex-direction:column;gap:4px;min-height:118px;padding:9px 8px;border:1px solid var(--line);background:#141a18}
.upgrade-card h3{margin:0;font:600 12px/1.25 var(--display);letter-spacing:.04em;overflow-wrap:anywhere}
.upgrade-card p{margin:0;font-size:10px;color:var(--muted);line-height:1.4;overflow-wrap:anywhere}
.upgrade-tier{font:10px var(--mono);color:var(--orange);letter-spacing:.1em}
.upgrade-card button{margin-top:auto;min-height:36px;padding:6px 3px;font-size:10px;background:var(--orange);color:#1a241b;border:0;cursor:pointer}
.upgrade-card button:disabled{background:#26302b;color:#6f7a71;cursor:default}
.upgrade-card.unlocked{border-color:#2a332c;background:#111614}
.upgrade-card.unlocked .upgrade-tier{color:#6f7a71}
.upgrade-section{border-top:1px solid var(--line);margin-top:14px}
.upgrade-section summary{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 2px;cursor:pointer;list-style:none;min-height:44px;box-sizing:border-box}
.upgrade-section summary::-webkit-details-marker{display:none}
.upgrade-section summary::after{content:'+';font:13px var(--mono);color:var(--orange);line-height:1}
.upgrade-section[open] summary::after{content:'−'}
.upgrade-section summary .eyebrow{margin:0}
.upgrade-section summary small{margin-left:auto;margin-right:10px;font:10px var(--mono);color:var(--muted)}
.upgrade-section summary:hover .eyebrow,.upgrade-section summary:focus-visible .eyebrow{color:var(--text)}
.upgrade-section .upgrade-grid{margin-top:0;margin-bottom:12px}
/* 對話框較窄，部署選單改成兩行：標籤在上、註記在下。 */
.deploy-menu{max-width:none;margin-top:6px}
.deploy-menu .title-entry{grid-template-columns:18px 1fr;row-gap:2px;padding:13px 4px}
.deploy-menu .title-label{white-space:nowrap}
.deploy-menu .title-note{grid-column:2;justify-self:start;text-align:left}
/* 部署選單：終端機清單。單選仍是原生 radio，詳細資料另用 details 折疊。 */
.deploy-warning{border-left:2px solid var(--orange);padding:8px 10px;background:#1d1a15;font:11px/1.6 var(--mono);color:#e8c79c}
.term-list{border:0;padding:0;margin:14px 0 4px;display:block}
.term-list legend{font:10px var(--mono);color:var(--orange);letter-spacing:.2em;padding:0}
.term-row{border-top:1px solid #2a332c;padding:2px 0 10px}
.term-row:last-of-type{border-bottom:1px solid #2a332c}
.term-pick{display:grid;grid-template-columns:14px 26px 1fr;align-items:center;gap:8px;padding:10px 2px;min-height:44px;cursor:pointer}
.term-pick input{position:absolute;opacity:0;width:1px;height:1px}
.term-caret{font:13px var(--mono);color:var(--orange);opacity:.28;line-height:1}
.term-pick input:checked~.term-caret{opacity:1}
.term-face{display:block;width:26px;line-height:0}
.term-face .operator-portrait{flex:0 0 26px;width:26px;height:26px}
.term-face:empty{display:none}
.term-body{display:flex;align-items:baseline;gap:8px;min-width:0}
.term-caret+.term-body{grid-column:2/-1}
.term-name{font:600 15px var(--display);letter-spacing:.06em;color:var(--text);white-space:nowrap}
.term-pick input:checked~.term-body .term-name{color:var(--orange)}
.term-meta{font:9px var(--mono);color:var(--muted);letter-spacing:.06em;margin-left:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.term-pick:has(input:checked){background:#161d19}
.term-pick:focus-within{outline:1px solid var(--orange);outline-offset:-1px}
.term-note{margin:0 0 0 22px;font:10px/1.6 var(--mono);color:var(--muted)}
.term-detail{margin:6px 0 0 22px}
.term-detail summary{display:flex;align-items:center;gap:6px;list-style:none;cursor:pointer;font:10px var(--mono);color:var(--muted);letter-spacing:.1em;padding:6px 0;min-height:32px}
.term-detail summary::-webkit-details-marker{display:none}
.term-detail summary::before{content:'+';color:var(--orange);font:11px var(--mono)}
.term-detail[open] summary::before{content:'−'}
.term-detail summary:hover,.term-detail summary:focus-visible{color:var(--text);outline:0}
.term-detail-body{display:grid;gap:5px;padding:2px 0 6px;border-left:1px solid #2a332c;padding-left:9px}
.term-detail-body small{font:10px/1.6 var(--mono);color:#b7c2b6}
.term-detail-body b{color:var(--text)}
/* 3.48.2 行動員清單多一欄職業圖像；塗裝選擇在清單下方，大圖預覽目前選的職業。 */
.operator-list .term-pick{grid-template-columns:14px 26px 32px 1fr}
.term-sprite{display:block;width:32px;height:32px;line-height:0}
.term-sprite canvas,.color-preview{width:32px;height:32px;image-rendering:pixelated}
.color-row{display:flex;align-items:center;gap:12px;margin-top:8px}
.color-preview{flex:0 0 64px;width:64px;height:64px;background:#131816;border:1px solid var(--line)}
.color-swatches{flex:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px}
.color-swatch{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:48px;cursor:pointer}
.color-swatch input{position:absolute;opacity:0;width:1px;height:1px}
.color-swatch span{width:22px;height:22px;border-radius:50%;background:var(--swatch);border:2px solid #0d110f;box-shadow:0 0 0 1px var(--line)}
.color-swatch span.swatch-none{background:linear-gradient(135deg,#a3a8a2 0 48%,#4d534d 52% 100%)}
.color-swatch small{font:9px var(--mono);color:var(--muted);white-space:nowrap}
.color-swatch input:checked+span{box-shadow:0 0 0 2px var(--orange)}
.color-swatch input:checked~small{color:var(--orange)}
.color-swatch:focus-within span{outline:1px solid var(--orange);outline-offset:3px}
.color-note{margin:8px 0 0;font:10px/1.6 var(--mono);color:var(--muted)}
/* 任務清單只列標題；說明集中在清單下方。所有說明疊在同一格，高度取最長的一段，切換任務時下方不會跳動。 */
.mission-list .term-row{padding-bottom:2px}
.mission-brief{display:grid;margin:12px 0 0;padding:8px 0 8px 11px;border-left:1px solid #2a332c}
.mission-brief>p{grid-area:1/1;margin:0;font:11px/1.6 var(--mono);color:#b7c2b6;visibility:hidden}
.mission-brief>p.active{visibility:visible}
.seed-advanced{margin:12px 0 0}
.seed-advanced .seed-field{padding:2px 0 4px}
/* 開機遮罩：模組載入完成、主選單開好之前不顯示戰鬥介面。底色與主選單相同，銜接無跳動。 */
.boot-screen{display:none}
body.booting{background:#0d1211}
body.booting .app,body.booting .app *{visibility:hidden!important}
body.booting .boot-screen{display:flex;position:fixed;inset:0;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;box-sizing:border-box;background:#0d1211;z-index:1}
.boot-line{font:11px var(--mono);letter-spacing:.3em;color:var(--muted)}
.boot-slow{max-width:260px;text-align:center;font:11px/1.6 var(--mono);color:var(--muted);opacity:0;animation:boot-reveal 0s 12s forwards}
@keyframes boot-reveal{to{opacity:1}}
/* 3.44: the message bar opens the combat log; its button counts the extra lines of the last action. */
#field-messages{position:relative;cursor:pointer}
#field-messages .battle-notice{padding-right:56px}
.battle-notice.danger.show{color:#f0a48f}
.log-button{position:absolute;top:0;right:0;height:28px;min-width:48px;padding:0 8px;border:0;border-left:1px solid #2b3a2f;background:#16221b;color:#9fb48f;font:11px var(--mono);cursor:pointer}
.log-button.more{color:#f0c27a}
.combat-log{list-style:none;margin:8px 0 12px;padding:0;max-height:56vh;overflow:auto;font-size:11px;line-height:1.55}
.combat-log li{display:grid;grid-template-columns:32px 1fr;gap:6px;padding:3px 0;color:#c7d1b8}
.combat-log li.new-turn{border-top:1px solid #34423a;margin-top:3px;padding-top:6px}
.combat-log li b{font:10px/1.8 var(--mono);color:#8fa382;font-weight:400}
.combat-log li.danger span{color:#f0a48f}
/* 3.44: saving failed; stays until a save succeeds. */
.save-warning{height:28px;padding:0 8px;border:1px solid #c7654f;background:#3a1d17;color:#ffb39f;font:11px var(--mono);white-space:nowrap;cursor:pointer}
.title-warning{margin:14px 0 0;font:11px/1.6 var(--mono);color:#ffb39f}
.orientation-note{margin:18px 0 6px;font-size:11px;color:var(--muted)}
#orientation-guard .modal-button{display:block;width:auto;min-height:44px;margin:0 auto;padding:0 16px}

/* Run build summaries live inside the scrolling modal, never in the battle HUD. */
.run-perks{margin:10px 0;padding:8px 0;border-block:1px solid #46523e;min-width:0}
.run-perks h3{margin:0 0 5px;font-size:12px;line-height:1.3}
.run-perks ul{display:flex;flex-wrap:wrap;gap:5px 12px;list-style:none;margin:0;padding:0}
.run-perks li{display:flex;align-items:center;flex-wrap:wrap;gap:4px;font-size:11px;line-height:1.4;max-width:100%}
.perk-pips{display:inline-block;letter-spacing:1px;font-size:11px;line-height:1.4;overflow-wrap:anywhere}
dialog .perk .perk-pips{color:#bdc8ad;margin-left:5px}
dialog .perk .perk-next{color:var(--orange);font-weight:900}
.pet-feeding{margin:12px 0;padding:10px 12px;border:1px solid #9dcc8255;background:#1d2b24}.pet-feeding h3{margin:0 0 4px;font-size:16px}.pet-status{margin:2px 0;font-size:13px;color:#c8d6bf}.pet-gate{margin:8px 0;font-size:13px;color:#e8ce98}.pet-fuel{height:6px;margin:4px 0 6px;background:#2c3a33}.pet-fuel i{display:block;height:100%;background:#9dcc82}
.pet-lines{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin:8px 0}.pet-lines div{display:flex;flex-direction:column;gap:2px;padding:6px 8px;background:#25342b;border-top:2px solid var(--tint)}.pet-lines strong{display:flex;justify-content:space-between;font-size:13px;color:var(--tint)}.pet-lines b{font:12px var(--mono);color:#e8ce98}.pet-lines small{font-size:11px;color:#9fae95;overflow-wrap:anywhere}
.pet-feed-group{margin:10px 0 3px;font-size:12px;color:#9fae95}.pet-feed{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:4px}.pet-feed button,.pet-output-kinds button{min-height:44px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;padding:6px 8px;text-align:left;background:#25342b;border:1px solid #91ab8155;color:#dfe8d6;font:inherit}.pet-feed button:disabled{opacity:.5}.pet-feed small{font-size:11px;color:#9fae95;overflow-wrap:anywhere}
.pet-output-kinds{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:6px 0}.pet-output-kinds button{align-items:center}.pet-output-kinds button[aria-pressed="true"]{border-color:#b8c694;color:#b8c694}
.pet-nodes{display:flex;align-items:center;gap:4px;margin:2px 0;line-height:1}.pet-nodes i{font-style:normal;font-size:12px;color:#56655b}.pet-nodes i.major{font-size:15px}.pet-nodes i.on{color:var(--tint)}.pet-lines strong b{font:12px var(--mono)}
.pet-abilities{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0}.pet-abilities span{padding:3px 7px;font-size:11px;color:#c8d6bf;background:#25342b;border-left:2px solid #9dcc82}
.learning-list .pack-actions{display:flex;gap:6px;margin-top:6px}.learning-list .pack-actions button{flex:1;min-height:44px;background:#25342b;border:1px solid #91ab8155;color:#dfe8d6;font:inherit}.learning-list .pack-actions button:disabled{opacity:.5}.learning-list .prepared-entry span{display:block;margin:4px 0;font-size:12px}