/* One native menu surface on every device. CRT texture never receives input. */
:root{--crt-ink:#101110;--crt-paper:#e8e8d9;--crt-muted:#a6aa98;--crt-line:#626657}
#machine{color:var(--crt-paper)}
#machine #intro,#machine #dialog{display:flex;position:absolute;inset:0;z-index:20;background:rgba(8,10,8,.94);overflow:auto;overscroll-behavior:contain;touch-action:pan-y;pointer-events:auto;padding:20px max(12px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));scrollbar-color:#7a806c #101110;scrollbar-width:thin}
#machine #intro .intro-card,#machine #dialog .dialog-card{display:flex;flex-direction:column;position:relative;flex:none;gap:0;width:min(100%,620px);min-width:0;max-width:620px;min-height:0;max-height:none;overflow:visible;margin:auto;padding:28px clamp(18px,4vw,32px);border:1px solid var(--crt-line);border-radius:12px;background:var(--crt-ink);box-shadow:inset 0 0 38px #0008,0 0 0 5px #080a08,0 0 0 6px #30342a,0 0 28px #e8e8d90b}
#machine #intro .intro-card>*:not(button),#machine #dialog .dialog-card>*{position:static!important;width:auto!important;height:auto!important;overflow:visible!important;clip-path:none!important;white-space:normal!important}
#machine #intro .intro-card::before{display:none}
#machine #intro h1,#machine #dialog-title{font:400 clamp(22px,5vw,30px)/1.4 ColdBootPixel,monospace!important;letter-spacing:0;margin:18px 0;color:var(--crt-paper);overflow-wrap:anywhere}
#machine #dialog-tag,#machine #intro .eyebrow{font:11px/1.7 ColdBootPixel,monospace;letter-spacing:.06em;color:var(--crt-muted);overflow-wrap:anywhere;margin:0}
#machine #dialog-content,#machine #dialog-content p,#machine #intro p{font:14px/1.7 ColdBootPixel,monospace;color:#c7cbba;overflow-wrap:anywhere}
#machine #dialog-content p{margin:0 0 18px}
#machine #dialog-content .post{border-color:#4a5041}
#machine #dialog-content .post b{font:12px/1.5 ColdBootPixel,monospace;color:var(--crt-muted)}
#machine #dialog-content .stats{gap:20px}
#machine #dialog-buttons{display:grid;grid-template-columns:1fr;gap:12px;margin:14px 0 0}
#machine #intro #start,#machine #dialog-buttons button{display:block;position:static!important;left:auto!important;top:auto!important;width:100%!important;height:auto!important;min-width:0;min-height:56px;margin:0;padding:14px 18px;border:1px solid #8a907b;border-radius:2px;background:#191d16!important;color:var(--crt-paper)!important;box-shadow:inset 0 0 12px #e8e8d908;outline-offset:-4px;pointer-events:auto;font:14px/1.5 ColdBootPixel,monospace;letter-spacing:0;white-space:normal;overflow-wrap:anywhere;text-align:left;touch-action:manipulation}
#machine #intro #start{margin:18px 0 24px;text-align:center}
#machine #intro #start,#machine #dialog-buttons button:first-child{background:var(--crt-paper)!important;color:var(--crt-ink)!important;border-color:var(--crt-paper)}
#machine #dialog-buttons button:focus-visible,#machine #intro #start:focus-visible{outline:2px solid currentColor}
#machine #dialog-buttons button:active{box-shadow:inset 0 0 0 2px currentColor}
#machine #dialog-buttons button:hover{border-color:var(--crt-paper)}
#machine #intro .ascii-title,#machine #dialog .ascii-title{display:block;white-space:pre!important;font:700 clamp(4px,1.05vw,8px)/1.1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:0;color:var(--crt-paper);margin:0 0 24px}
#machine #dialog .ascii-title:empty,#machine #dialog .ascii-title[hidden]{display:none!important}
#machine #intro .keys{font-size:11px;line-height:1.8;color:var(--crt-muted)}
/* Header and tabs occupy their own rows; only the body scrolls. This avoids
   hard-coded sticky offsets and the global game header styles. */
#machine #field-terminal{width:min(900px,calc(100% - 28px));height:min(820px,calc(100dvh - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:0;overflow:hidden;border:1px solid var(--crt-line);border-radius:12px;background:var(--crt-ink);color:var(--crt-paper);box-shadow:inset 0 0 35px #0008,0 0 0 5px #080a08,0 0 0 6px #30342a;touch-action:pan-y;font:14px/1.6 ColdBootPixel,monospace}
#machine #field-terminal[open]{display:flex;flex-direction:column}
#machine #field-terminal:not([open]){display:none}
#machine #field-terminal::backdrop{background:rgba(4,6,4,.9)}
#machine #field-terminal .field-head{position:static;display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none;width:100%;height:auto;min-height:64px;padding:8px 14px;border-bottom:1px solid var(--crt-line);background:#171b14}
#machine #field-title{font:12px/1.5 ColdBootPixel,monospace;letter-spacing:.04em;min-width:0}
#machine #field-close{flex:none;width:48px;height:48px;min-height:48px;padding:0;border:1px solid #626657;color:var(--crt-paper);font:26px/1 monospace;background:#101110}
#machine #field-tabs{position:static;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));flex:none;gap:0;margin:0;padding:0;width:100%;height:auto;border-bottom:1px solid var(--crt-line);background:#101110}
#machine #field-tabs button{min-width:0;min-height:52px;padding:10px 4px;font:13px/1.4 ColdBootPixel,monospace;letter-spacing:0;border:0;border-bottom:2px solid transparent;background:#101110;color:var(--crt-muted);overflow-wrap:anywhere}
#machine #field-tabs button[aria-pressed=true]{color:var(--crt-paper);border-bottom-color:var(--crt-paper);background:#22281d}
#machine #field-scroll{display:block;flex:1;min-height:0;width:100%;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;scrollbar-color:#7a806c #101110;scrollbar-width:thin;padding:20px;scroll-padding:18px}
#machine #field-terminal #field-body{font-family:ColdBootPixel,monospace}
#machine #field-terminal #field-body button{font-family:ColdBootPixel,monospace;min-height:48px}
#machine #field-terminal #field-body .item-slot{min-height:48px;background:linear-gradient(135deg,#22291d,#0c100b);border-color:#69715a}
#machine #field-terminal #field-body .rpg-label{font-family:ColdBootPixel,monospace;color:var(--crt-muted)}
#machine #field-terminal .bag-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
#machine #field-terminal .gear-slot{width:58px;height:58px}
#machine #field-terminal .paper-grid{grid-template-columns:58px minmax(0,1fr) 58px}
#machine #field-terminal .item-details{scroll-margin:16px;border-color:#4a5041;background:#11160e}
#machine #field-terminal .rpg-use{min-height:48px;white-space:normal}
#machine #field-terminal .postcard-chapter-head{display:grid;height:auto;min-height:0;padding:16px 0 0;margin:0 0 20px;background:none;border:0;border-top:3px double #69715a;gap:8px 16px}
#machine #field-terminal .postcard-chapter-head h2{font-size:24px;line-height:1.35}
#machine #field-result{flex:none;margin:0;padding:10px 18px;border-top:1px solid #4a5041;background:#191e15;font:12px/1.5 ColdBootPixel,monospace}
#machine #field-result:empty{display:none}
#machine #field-save{display:block;flex:none;margin:0;padding:10px 18px;background:#101110;font:10px/1.5 ColdBootPixel,monospace;color:var(--crt-muted)}
/* Static phosphor mask + edge falloff. No flicker, moving noise or hit targets. */
#machine[data-tube=tube][data-surface=intro]::after,#machine[data-tube=tube][data-surface=dialog]::after,#machine[data-tube=tube] #field-terminal[open]::after{content:'';position:fixed;inset:0;z-index:40;pointer-events:none;user-select:none;border-radius:inherit;background:repeating-linear-gradient(0deg,#0002 0px,#0002 1px,transparent 1px,transparent 3px),radial-gradient(ellipse at 50% 45%,transparent 45%,#0005 100%);opacity:.65}
#machine[data-tube=tube] #intro,#machine[data-tube=tube] #dialog,#machine[data-tube=tube] #field-terminal{text-shadow:0 0 5px #e8e8d933,1px 0 #d5bb901a,-1px 0 #9cc3b51a}
#machine[data-tube=clean] #intro,#machine[data-tube=clean] #dialog,#machine[data-tube=clean] #field-terminal{text-shadow:none}
@media(pointer:coarse){
 #machine #intro,#machine #dialog{padding-top:max(20px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom))}
 #machine #intro .keys{display:none}
 #machine #field-terminal{width:calc(100% - 20px);height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 24px);max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 24px)}
}
@media(max-width:600px){
 #machine #field-scroll{padding:14px}
 #machine #field-terminal .rpg-layout{grid-template-columns:1fr;gap:18px}
 #machine #field-terminal .rpg-stats{border-left:0;border-top:1px solid #4a5041;padding:16px 0 0}
 #machine #field-tabs button{font-size:11px}
 #machine #intro .ascii-title,#machine #dialog .ascii-title{font-size:4.5px}
}
@media(max-width:350px){#machine #intro .ascii-title,#machine #dialog .ascii-title{font-size:3.6px}#machine #field-terminal .paper-grid{grid-template-columns:48px minmax(0,1fr) 48px;gap:6px}#machine #field-terminal .gear-slot{width:48px;height:48px}#machine #field-terminal .paper-figure small{white-space:normal;text-align:center}}
@media(max-height:500px){#machine #intro,#machine #dialog{padding-block:12px}#machine #intro .intro-card,#machine #dialog .dialog-card{padding:20px}#machine #intro .ascii-title,#machine #dialog .ascii-title{font-size:4.5px;margin-bottom:14px}#machine #field-terminal .field-head{min-height:56px;padding-block:4px}#machine #field-tabs button{min-height:48px}#machine #field-save{padding-block:6px}}
@media(min-width:701px) and (pointer:fine){#machine>header{height:auto;min-height:64px;flex-wrap:wrap;gap:12px;padding-block:10px}#machine>header nav{max-width:100%;flex-wrap:wrap;gap:6px}#machine>header nav button{padding:8px 6px}}
@media(min-width:701px) and (max-width:1100px){#machine>header .chapter{display:none}}
/* Menus are now part of the game signal, not a second sheet of glass. Native
   elements keep their layout, scrolling, semantics and input after capture. */
#machine #intro,#machine #dialog{background:rgba(0,0,0,.30)}
#machine #intro .intro-card,#machine #dialog .dialog-card{border:0;border-radius:0;box-shadow:none;background:rgba(16,16,16,.68);padding:24px clamp(18px,4vw,30px)}
#machine #dialog .dialog-card{width:min(100%,560px)}
#machine #dialog #dialog-ascii{display:none!important}
#machine #intro h1,#machine #dialog-title{font-size:22px!important;margin:14px 0 20px}
#machine #dialog-buttons{gap:8px;margin-top:14px}
#machine #dialog-buttons button,#machine #dialog-buttons button:first-child{min-height:56px;background:rgba(16,16,16,.72)!important;border:0;border-bottom:1px solid #626657;color:#e8e8e0!important;padding:14px 16px;font-size:13px;box-shadow:none;border-radius:0}
#machine #dialog-buttons button:focus,#machine #dialog-buttons button:hover{background:rgba(232,232,224,.1)!important;border-bottom-color:#e8e8e0}
#machine #field-terminal{position:fixed;left:calc(var(--signal-left,0px) + var(--signal-width,100vw)/2);top:calc(var(--signal-top,0px) + 12px);bottom:auto;transform:translateX(-50%);width:min(900px,calc(var(--signal-width,100vw) - 24px));height:min(800px,calc(var(--signal-height,100dvh) - 24px));max-height:calc(var(--signal-height,100dvh) - 24px);margin:0;border-radius:0;border:1px solid #626657;box-shadow:none;background:rgba(16,16,16,.9)}
#machine #field-terminal .field-head,#machine #field-tabs,#machine #field-save{background:rgba(16,16,16,.85)}
#machine .signal-ui{opacity:0!important}
#machine #field-terminal.signal-ui::backdrop{background:transparent}
#machine:has(.signal-ui)::after,#machine #field-terminal.signal-ui::after{display:none!important}
@media(max-height:500px){#machine #intro .intro-card,#machine #dialog .dialog-card{margin:0 auto;padding:18px}#machine #dialog-title{margin-block:8px 14px}}
#machine #intro #start{background:rgba(16,16,16,.72)!important;color:#e8e8e0!important;border:0;border-bottom:1px solid #a6aa98;box-shadow:none}
#machine #field-terminal{top:calc(var(--signal-top,0px) + max(12px,env(safe-area-inset-top,0px)));height:min(800px,calc(var(--signal-height,100dvh) - max(12px,env(safe-area-inset-top,0px)) - max(12px,env(safe-area-inset-bottom,0px))));max-height:calc(var(--signal-height,100dvh) - max(12px,env(safe-area-inset-top,0px)) - max(12px,env(safe-area-inset-bottom,0px)));width:min(900px,calc(var(--signal-width,100vw) - max(12px,env(safe-area-inset-left,0px)) - max(12px,env(safe-area-inset-right,0px))))}

/* Desktop text keeps display resolution; quiet optics retain the same glass. */
@media(pointer:fine){
 #machine #intro .intro-card{max-width:660px;width:min(100%,660px)}
 #machine #dialog .dialog-card{width:min(100%,640px)}
 #machine #dialog-content,#machine #dialog-content p,#machine #intro p{font-size:16px;line-height:1.75;color:#e8e8e0}
 #machine #intro h1,#machine #dialog-title{font-size:24px!important}
 #machine #dialog-tag,#machine #intro .eyebrow{font-size:12px;color:#bfc3b3}
 #machine #intro .keys{font-size:13px;line-height:1.8;color:#c7cbba}
 #machine #intro .small{font-size:12px;color:#bfc3b3}
 #machine #intro #loading-status,#machine #intro #boot-progress{font-size:14px}
 #machine #dialog-buttons button,#machine #intro #start{font-size:15px}
 #machine #intro .intro-card,#machine #dialog .dialog-card{background:rgba(16,16,16,.90)}
 #machine #intro,#machine #dialog{background:rgba(0,0,0,.40)}
 #machine #field-body .item-details p,#machine #field-body .rpg-passive,#machine #field-body article p{font-size:14px;color:#c7cbba}
 #machine #field-save{font-size:12px}
}

/* Service schematics share readable native menu geometry. */
#machine #dialog-content .circuit-meter{padding:14px 16px;border-left:2px solid #a6aa98;background:rgba(16,16,16,.9);color:#e8e8e0;line-height:1.9}
#machine #dialog-content .circuit-feedback{padding:12px 0;border-top:1px solid #626657;color:#e8e8e0}