:root { --ink:#122334; --cream:#e8e0c4; --gold:#d4a846; --red:#b8463f; --blue:#234d70; }
* { box-sizing:border-box; }
body { margin:0; overflow:hidden; background:#0d1821; color:var(--cream); font-family:Arial, Helvetica, sans-serif; }
button { font:inherit; cursor:pointer; }
#game { height:100vh; min-height:580px; display:grid; grid-template-rows:66px 1fr 42px; background:#0b151e; }
.topbar, .statusbar { display:flex; align-items:center; justify-content:space-between; padding:0 22px; background:#102433; border-color:#577184; border-style:solid; position:relative; z-index:5; }
.topbar { border-width:0 0 1px; }.statusbar { border-width:1px 0 0; font:12px monospace; color:#bcc9bf; }
.company-logo { width:300px; font-family:Impact, Arial Black, sans-serif; line-height:1; letter-spacing:1px; }.logo-name { color:#2e70d6; font-size:29px; white-space:nowrap; }.logo-name b { display:inline-block; width:13px; height:35px; vertical-align:-6px; margin-right:5px; background:linear-gradient(#f2f1e8 0 42%,transparent 42% 57%,#f2f1e8 57%); }.logo-subtitle { width:166px; margin:4px 0 0 auto; padding:3px 9px 2px; background:#f2f1e8; color:#2e70d6; font-size:15px; text-align:center; letter-spacing:.6px; }
.brand { font-weight:bold; letter-spacing:2px; color:#ebead9; }.brand span { color:#1b3851; background:#e4dfc2; padding:4px 6px; margin-right:7px; }.brand i { color:#d1aa51; font-weight:normal; font-size:11px; letter-spacing:0; }.room-label { font:700 15px monospace; color:#aabcbf; letter-spacing:1.4px; }.help-button, #returnRoom { color:var(--cream); border:1px solid #627f8c; background:#19394d; padding:5px 10px; }.help-button { border-radius:50%; width:27px; height:27px; padding:0; font-weight:bold; }
.scene-viewport { position:relative; overflow:hidden; background:#122438; touch-action:none; }.scene-stage { position:absolute; width:1800px; height:820px; left:0; top:50%; transform:translate3d(0,-50%,0); transform-origin:left center; transition:transform .45s cubic-bezier(.2,.7,.2,1); }.room-art { display:block; height:100%; width:100%; image-rendering:pixelated; }.legacy-art { display:none; }.static-scene { position:absolute; inset:0; }.hotspot { position:absolute; z-index:2; border:0; background:transparent; padding:0; opacity:1; transition:background .16s, box-shadow .16s; }.hotspot:hover, .hotspot:focus-visible { background:rgba(237,195,72,.12); box-shadow:inset 0 0 0 3px #f1c854, 0 0 16px rgba(244,201,77,.7); outline:none; }.tv { left:13%; top:208px; width:13%; height:238px; }.board { left:67.5%; top:30px; width:23%; height:305px; }.folder { left:56.8%; top:400px; width:8.7%; height:67px; }.computer { left:44%; top:254px; width:10%; height:196px; }.phone { left:66.2%; top:367px; width:8.1%; height:90px; }.drawer { left:5%; top:492px; width:8%; height:170px; }
.nav-controls { position:absolute; bottom:18px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:10px; padding:7px; background:rgba(11,23,32,.78); border:1px solid #647a80; font:10px monospace; letter-spacing:1px; white-space:nowrap; }.nav-controls button { width:33px; height:26px; background:#21465e; border:1px solid #78909a; color:#fff; }.nav-controls button:hover { background:#d4a846; color:#182b35; }
.overlay { position:fixed; inset:0; z-index:20; display:grid; place-items:center; padding:20px; background:rgba(4,12,18,.8); backdrop-filter:blur(4px); transition:opacity .3s, visibility .3s; }.overlay.hidden { opacity:0; visibility:hidden; pointer-events:none; }.intro-card { width:min(500px,100%); text-align:center; background:linear-gradient(135deg,#173d59,#102938); border:1px solid #8aa5a4; box-shadow:12px 12px 0 rgba(0,0,0,.35); padding:34px; }.intro-logo { width:320px; margin:0 auto 15px; text-align:left; }.intro-logo .logo-name { font-size:31px; }.intro-logo .logo-subtitle { width:175px; font-size:16px; }.eyebrow { font:10px monospace; color:#d5ab51; letter-spacing:2px; margin:18px 0 7px; }.intro-card h1 { font:42px Impact, Arial Black, sans-serif; letter-spacing:2px; line-height:.92; margin:0; color:#f2ecd0; }.intro-card p:not(.eyebrow) { font:15px Georgia, serif; line-height:1.45; }.intro-card .instruction { color:#b9cbd0; font:12px monospace; }.intro-card button { margin-top:12px; border:0; padding:12px 18px; background:#d0a747; color:#12283a; font-weight:bold; letter-spacing:1px; }.intro-card button:hover { background:#f2d06d; }
.modal { width:min(770px,94vw); max-height:min(650px,88vh); overflow:auto; position:relative; background:#e5dec3; color:#202721; border:7px solid #193c52; box-shadow:15px 16px 0 rgba(0,0,0,.45); padding:28px 32px; }.modal.dos { background:#071712; color:#85eea4; border-color:#779b75; font-family:monospace; }.close { position:absolute; top:10px; right:12px; border:0; background:transparent; color:inherit; font:bold 24px Arial; }.document-kicker { color:#a03a36; font:11px monospace; letter-spacing:2px; }.modal h2 { margin:8px 30px 20px 0; font:28px Georgia,serif; color:#1e4763; }.modal p, .modal li { line-height:1.5; }.modal hr { border:0; border-top:1px solid #948b72; margin:19px 0; }.signature { text-align:right; font-family:cursive; font-size:19px; }.choice-list { display:grid; gap:8px; }.choice-list button { text-align:left; padding:10px; border:1px solid #44705b; color:#9df6af; background:#0b291e; }.choice-list button:hover, .choice-list button.active { color:#0b291e; background:#8ce29b; }.message { margin-top:16px; border-top:1px dashed #5a9c69; padding-top:14px; white-space:pre-line; }.team-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }.stat { background:#d3cba9; border-left:4px solid #1d5878; padding:12px; }.stat b { display:block; font:23px monospace; color:#1d3e52; }.vhs-screen { min-height:200px; background:#091518; color:#d6f0d9; padding:25px; font:18px monospace; position:relative; overflow:hidden; }.vhs-screen::after { content:""; position:absolute; inset:0; opacity:.18; pointer-events:none; background:repeating-linear-gradient(0deg,transparent 0 3px,#a4ddc0 4px 5px); animation:noise .18s steps(2) infinite; }.vhs-line { color:#ecc44c; margin-bottom:18px; }.vhs-video { position:relative; z-index:1; display:block; width:100%; max-height:310px; background:#000; }.tape-picker { display:flex; gap:8px; flex-wrap:wrap; margin:15px 0; }.tape-picker button { padding:9px; color:#eee3bd; background:#294f67; border:1px solid #84a6ae; }.tape-picker button:hover { background:#a64239; }@keyframes noise { from { transform:translateY(-3px); } to { transform:translateY(3px); } }
.driver-drawer { left:5%; top:195px; width:8%; height:177px; }.driver-file { width:min(1080px,95vw); max-height:90vh; padding:25px; background:#303d4b; color:#e6e7d8; border-color:#d8d7c8; box-shadow:12px 12px 0 #101820; }.driver-file h2 { color:#f0e8c7; margin:4px 0 0; }.file-header { display:flex; justify-content:space-between; align-items:flex-end; border-bottom:3px solid #8ba0ae; padding:0 36px 13px 0; }.file-header > span { color:#a4bfcc; font:11px monospace; }.driver-tabs { display:flex; gap:7px; margin:14px 0; }.driver-tabs button { border:2px solid #7992a0; background:#1d2a35; color:#dce9e7; padding:8px 13px; font:bold 12px monospace; }.driver-tabs button:hover, .driver-tabs button.active { background:#39738a; border-color:#e6ca6e; color:#fff6cd; }.driver-sheet { display:grid; grid-template-columns:200px 1fr; min-height:318px; background:#17242d; border:4px solid #708897; box-shadow:inset 0 0 0 4px #233844; }.driver-identity { padding:18px; text-align:center; background:linear-gradient(135deg,#263e4c,#1a2a34); border-right:3px solid #5c7481; }.pixel-portrait { width:108px; height:108px; margin:0 auto 10px; position:relative; overflow:hidden; background:linear-gradient(145deg,#0c1920 0 35%,#276385 35% 52%,#10232d 52%); border:5px solid #101920; box-shadow:inset 0 0 0 4px #5c7881; image-rendering:pixelated; }.pixel-portrait::before { content:""; position:absolute; left:37px; top:22px; width:34px; height:48px; background:#bc815b; box-shadow:0 -12px 0 5px #17498a, -13px 42px 0 8px #1d5d98, 13px 42px 0 8px #1d5d98; }.pixel-portrait::after { content:""; position:absolute; left:43px; top:43px; width:20px; height:5px; background:#243131; box-shadow:0 11px 0 -1px #6b332d; }.pixel-portrait.max::before { background:#d19a74; box-shadow:0 -12px 0 5px #172f58, -13px 42px 0 8px #234f7b, 13px 42px 0 8px #234f7b; }.pixel-portrait.margarida::before { background:#be805f; box-shadow:0 -14px 0 5px #264875, -16px 42px 0 8px #265c91, 16px 42px 0 8px #265c91; }.driver-flag { display:inline-block; min-width:30px; padding:3px 5px; background:#e5dbb5; color:#172934; font:bold 11px monospace; }.driver-identity h3 { margin:9px 0 4px; color:#fff0c1; font:22px Impact,Arial Black,sans-serif; letter-spacing:.5px; }.driver-identity p { margin:0; color:#a8c7cb; font:10px monospace; }.driver-identity strong { display:block; color:#e2b84d; letter-spacing:2px; margin-top:13px; }.driver-bio { display:grid; gap:4px; margin-top:13px; color:#c4d6d1; font:11px monospace; }.driver-data { padding:18px 21px; }.driver-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }.driver-stats div { min-height:72px; padding:8px; background:#34505a; border-bottom:4px solid #54b18c; box-shadow:inset 7px 0 #245b51; }.driver-stats div:nth-child(3n+2) { border-color:#d0b245; box-shadow:inset 7px 0 #776b35; }.driver-stats div:nth-child(3n) { border-color:#cf7544; box-shadow:inset 7px 0 #754737; }.driver-stats span { display:block; color:#ccd8d2; font:11px monospace; }.driver-stats b { display:block; margin-top:2px; color:#fff6da; font:32px Impact,Arial Black,sans-serif; }.driver-data h4 { color:#b8cbd2; font:12px monospace; letter-spacing:1px; margin:19px 0 8px; }.driver-detail-grid,.driver-tables { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-top:15px; }.driver-detail-grid section,.driver-tables section,.driver-contract { background:#203440; border:1px solid #526c78; padding:10px; }.driver-detail-grid h4,.driver-tables h4,.driver-contract h4 { margin:0 0 7px; }.driver-detail-grid b { display:block; color:#f0e4bc; font:14px monospace; }.driver-detail-grid span { display:block; margin-top:5px; color:#9dbdc1; font:10px monospace; }.driver-detail-grid strong { display:block; color:#e2b84d; margin-top:8px; letter-spacing:1px; }.driver-detail-grid section:nth-child(2) b,.driver-detail-grid section:nth-child(3) b { color:#5ce398; font:31px Impact,Arial Black,sans-serif; }.driver-contract { margin-top:15px; }.driver-contract dl { display:grid; grid-template-columns:1fr 1fr; gap:4px 18px; margin:0; font:11px monospace; }.driver-contract dt { color:#a9bec1; }.driver-contract dd { margin:0; color:#ffe1a0; text-align:right; }.driver-tables { grid-template-columns:1.1fr .9fr; }.driver-tables table { width:100%; border-collapse:collapse; font:10px monospace; }.driver-tables th { color:#a6c4c9; font-weight:normal; text-align:left; }.driver-tables td { border-top:1px solid #405761; color:#e2e5d6; padding:4px 2px; }.driver-tables td:not(:first-child),.driver-tables th:not(:first-child) { text-align:center; }.driver-tables p { color:#efd986; font:11px monospace; margin:0 0 7px; }.driver-traits { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }.driver-traits span { padding:7px; background:#164b48; border-bottom:3px solid #28a88d; color:#d9f0df; font:11px monospace; text-align:center; }
@media (max-width:650px) { #game { min-height:500px; }.room-label { display:none; }.topbar,.statusbar { padding:0 10px; }.company-logo { width:230px; }.logo-name { font-size:22px; }.logo-name b { width:10px; height:27px; vertical-align:-5px; }.logo-subtitle { width:132px; font-size:12px; }.intro-logo { width:min(320px,100%); }.modal { padding:24px 20px; }.team-grid,.driver-stats,.driver-traits { grid-template-columns:1fr; }.driver-sheet { grid-template-columns:1fr; }.driver-identity { border-right:0; border-bottom:3px solid #5c7481; }.scene-stage { transform-origin:left center; }.nav-controls { bottom:8px; } }
.intro-card .ken-entry { display:block; width:100%; margin-top:9px; background:#285d54; color:#eef1d7; }
.ken-hotspot { display:none; }.ken-room > .hotspot:not(.ken-hotspot) { display:none; }.ken-room .ken-hotspot { display:block; }
.ken-monitor { left:47%; top:280px; width:14%; height:150px; }.ken-file-one,.ken-file-two,.ken-file-three,.ken-file-four,.ken-file-five { left:24%; width:10%; height:64px; }.ken-file-one { top:183px; }.ken-file-two { top:256px; }.ken-file-three { top:332px; }.ken-file-four { top:410px; }.ken-file-five { top:492px; }.ken-bench { left:0; top:380px; width:22%; height:300px; }
.workbench { padding:12px; }.workshop-tabs { display:flex; flex-wrap:wrap; gap:6px; border-bottom:2px solid #355e75; padding-bottom:10px; }.workshop-tabs button { border:1px solid #668da0; background:#e6e1ca; color:#173449; padding:7px 9px; font:bold 11px monospace; }.workshop-tabs button.active { background:#d4a33c; }.part-pane { padding:18px 8px; }.part-pane blockquote { margin:0 0 18px; padding:12px 16px; background:#1e5360; color:#fff5cb; font:italic 19px Georgia,serif; border-left:6px solid #d6a941; }.part-pane blockquote small { display:block; margin-top:9px; font:10px monospace; color:#c4e0cd; }.part-stats { display:flex; gap:10px; flex-wrap:wrap; }.part-stats span { padding:9px; background:#e8e3cf; border:1px solid #78919a; font:11px monospace; }.part-stats b { display:block; color:#9d311f; margin-top:4px; }
.component-list { display:grid; gap:7px; margin-top:16px; }.component-list button { text-align:left; border:1px solid #668da0; background:#1d3d4a; color:#f0e5bc; padding:9px; font:11px monospace; }.component-file { width:min(950px,95vw); height:min(92vh,1050px); max-height:92vh; overflow:hidden; padding:18px; background:#e8dfc5; color:#20211e; }.component-reader { height:100%; display:flex; flex-direction:column; align-items:center; }.component-reader h2 { align-self:stretch; margin:4px 30px 10px 0; }.component-reader img { min-height:0; max-width:100%; max-height:calc(100% - 155px); object-fit:contain; box-shadow:4px 5px 0 rgba(39,30,18,.3); }.component-reader p { width:min(760px,100%); margin:8px 0; color:#493b1f; font:italic 14px Georgia,serif; }.component-reader small { display:block; margin-top:3px; font:10px monospace; }.component-reader > button:last-child { align-self:flex-start; border:1px solid #6c7557; background:#d4c36d; color:#282616; padding:7px 10px; font:11px monospace; }
.email-body { min-height:220px; white-space:pre-wrap; overflow-wrap:anywhere; font:inherit; line-height:1.55; color:inherit; }.email-actions { display:flex; justify-content:space-between; gap:10px; margin-top:20px; }.email-actions button { border:1px solid currentColor; background:transparent; color:inherit; padding:8px; font:inherit; }
.password-note { width:280px; min-height:220px; padding:42px 28px 25px; background:#f2d55b; color:#3a3218; box-shadow:12px 13px 0 rgba(0,0,0,.3); transform:rotate(-2deg); font-family:"Comic Sans MS",cursive; }.password-note p { margin:0; font-size:19px; font-weight:bold; }.password-note strong { display:block; margin:12px 0 24px; font:28px "Comic Sans MS",cursive; }.password-note small { display:block; border-top:1px solid rgba(58,50,24,.35); padding-top:12px; font-size:13px; }
.el-linhaca-file { width:min(850px,94vw); max-height:90vh; overflow:hidden; padding:18px; background:linear-gradient(135deg,#50301d,#24150e); border-color:#a17643; }.open-drawer { position:relative; min-height:calc(90vh - 50px); padding:24px; text-align:center; background:repeating-linear-gradient(0deg,rgba(95,54,30,.22) 0 4px,rgba(37,19,11,.12) 5px 10px),#704125; box-shadow:inset 0 0 0 15px #2c170e,inset 0 0 0 19px #a36a3e; }.drawer-label { margin:0 auto 12px; color:#e7cf9b; font:bold 11px monospace; letter-spacing:2px; }.open-drawer a { display:inline-block; max-height:calc(90vh - 125px); color:#f2d476; font:bold 11px monospace; letter-spacing:1px; text-decoration:none; }.open-drawer a:hover { color:#fff3bd; }.open-drawer img { display:block; max-width:min(100%,560px); max-height:calc(90vh - 160px); margin:0 auto 9px; object-fit:contain; box-shadow:8px 10px 0 rgba(0,0,0,.42); transform:rotate(1deg); }
.hotspot { display:none; }.vector-hotmap { position:absolute; inset:0; z-index:3; width:1800px; height:820px; }.vector-hotmap polygon { fill:transparent; stroke:transparent; stroke-width:3; vector-effect:non-scaling-stroke; cursor:pointer; }.vector-hotmap polygon:hover,.vector-hotmap polygon:focus { fill:rgba(237,195,72,.12); stroke:#f1c854; filter:drop-shadow(0 0 5px rgba(244,201,77,.8)); outline:none; }.ken-hotmap { display:none; }.ken-room .office-hotmap { display:none; }.ken-room .ken-hotmap { display:block; }
.scene-stage .hotspot { display:none !important; }
.vector-hotmap { pointer-events:auto; }.vector-hotmap polygon { fill:rgba(0,0,0,.001); pointer-events:fill; }
.complaint-file { width:min(1500px,98vw); max-height:96vh; overflow:hidden; padding:18px; background:#e8dfc5; color:#20211e; }.complaint-inbox { min-height:300px; }.complaint-reader img { display:block; width:min(100%,1180px); max-height:76vh; margin:0 auto; object-fit:contain; box-shadow:4px 5px 0 rgba(39,30,18,.3); }
.complaint-file:has(.prototype-reader) { height:96vh; }.prototype-reader { height:100%; display:flex; flex-direction:column; min-height:0; }.prototype-reader h2 { margin:4px 30px 10px 0; }.prototype-reader img { flex:1; min-height:0; width:100%; max-width:none; max-height:none; object-fit:contain; }
.empty-folder { padding:22px; border:1px dashed #6a926c; color:#b6deb5; font:15px monospace; }
@media (max-width:650px) {
  body { overflow:hidden; }
  #game { height:100dvh; min-height:0; grid-template-rows:58px 1fr 52px; }
  .topbar,.statusbar { padding:0 9px; }
  .company-logo { width:185px; }.logo-name { font-size:18px; }.logo-name b { width:8px; height:21px; vertical-align:-3px; margin-right:3px; }.logo-subtitle { width:108px; margin-top:2px; padding:2px 5px; font-size:9px; }
  .help-button { width:32px; height:32px; font-size:16px; }
  .statusbar { gap:8px; font-size:10px; }.statusbar span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.statusbar button { flex:0 0 auto; min-height:34px; padding:7px 9px; font-size:10px; }
  .scene-viewport { touch-action:none; }
  .nav-controls { bottom:12px; gap:7px; padding:8px; font-size:9px; }.nav-controls button { width:48px; height:40px; font-size:18px; }
  .vector-hotmap polygon { stroke-width:5; }.vector-hotmap polygon:focus { fill:rgba(237,195,72,.2); }
  .modal { width:calc(100vw - 18px); max-height:calc(100dvh - 74px); padding:20px 16px; border-width:4px; }.modal h2 { font-size:23px; }
  .complaint-file,.component-file { width:calc(100vw - 18px); height:calc(100dvh - 74px); max-height:calc(100dvh - 74px); padding:10px; }.complaint-file:has(.prototype-reader) { height:calc(100dvh - 74px); }
  .complaint-reader img { width:100%; max-height:calc(100dvh - 180px); }.prototype-reader img { max-height:none; }
  .component-file { height:calc(100dvh - 74px); }.component-reader img { max-height:calc(100% - 135px); }
  .email-actions { gap:6px; }.email-actions button { min-height:42px; font-size:10px; }
  .workshop-tabs { gap:4px; }.workshop-tabs button { padding:8px 7px; font-size:9px; }.part-pane { padding:12px 2px; }.part-pane blockquote { font-size:16px; }
  .open-drawer { min-height:calc(100dvh - 110px); padding:16px; }.open-drawer img { max-height:calc(100dvh - 175px); }
  .kpi-grid article { grid-template-columns:76px 1fr 38px; }.kpi-grid article b { font-size:23px; }.kpi-grid article strong { font-size:20px; }
}

@media (hover:none) and (pointer:coarse) {
  .vector-hotmap polygon { stroke:rgba(241,200,84,.38); stroke-width:2; }
}
.wiretap { background:#061914; color:#e8f1dd; font-family:monospace; }.wiretap-header { position:sticky; top:0; z-index:6; display:flex; justify-content:space-between; gap:14px; align-items:end; margin:0 -2px 12px; padding:8px 0 12px; border-bottom:2px solid #355a56; background:#061914; }.wiretap h2 { margin:7px 0 0; color:#123f5a; }.wiretap-header .document-kicker { color:#e17f67; }.wiretap-back { display:none; flex:0 0 auto; padding:8px 10px; border:1px solid #78a6a4; color:#eff4d9; background:#173b3b; font:bold 11px monospace; cursor:pointer; }.wiretap-header.is-reading .wiretap-back { display:block; }.wiretap-back:hover,.wiretap-back:focus-visible { color:#10252c; background:#c0dfd0; }.wiretap-sort { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0 0 12px; color:#93b9a3; font:10px monospace; }.wiretap-sort button { border:1px solid #4f7d78; background:#123633; color:#dbe9cf; padding:6px 8px; font:10px monospace; }.wiretap-sort button.active,.wiretap-sort button:hover { background:#b9d9c7; color:#102a2f; }.wiretap-list { display:grid; gap:7px; }.wiretap-list button { display:grid; gap:4px; text-align:left; border:1px solid #315f62; background:#d1ebd2; color:#152f35; padding:11px; font:bold 13px monospace; }.wiretap-list button small { color:#163d70; font:10px monospace; }.wiretap-list button.active,.wiretap-list button:hover { background:#a8d9c1; color:#112a31; }.wiretap-list button.active small,.wiretap-list button:hover small { color:#102d5a; }.wiretap-pane { min-height:180px; margin-top:16px; padding:16px; border:1px solid #729090; color:#19353a; background:#e7efd8; }.wiretap-reader { position:relative; color:#19343a; line-height:1.5; }.wiretap-reader p { margin:11px 0; }.wiretap-reader b { color:#7c302b; }.wiretap-meta { color:#173d70; font-size:10px; font-weight:bold; }.wiretap-stamp { float:right; border:3px solid #a94038; color:#a94038; padding:4px; font:bold 16px monospace; transform:rotate(-7deg); }.wiretap-reader footer { margin-top:18px; border-top:1px dashed #547475; padding-top:9px; color:#234d58; font-style:italic; }
.wiretap-reader b i { display:inline-block; margin-left:5px; font-style:normal; line-height:0; vertical-align:-2px; }.wiretap-reader b i img { width:20px; height:13px; border:1px solid #d4d3bd; box-shadow:0 0 0 1px #1c3026; object-fit:cover; }.lore-flag { margin:0 2px 0 3px; vertical-align:-2px; filter:drop-shadow(0 0 1px rgba(17,39,43,.55)); }.vhs-thumbnail { position:relative; z-index:1; display:block; width:100%; padding:0; border:1px solid #84a6ae; background:#000; }.vhs-thumbnail:hover,.vhs-thumbnail:focus-visible { border-color:#ecc44c; }.vhs-image { display:block; width:100%; max-height:310px; object-fit:contain; }.vhs-caption { position:relative; z-index:1; margin:12px 0 0; font-size:13px; line-height:1.4; }

/* Registros narrativos: Markdown convertido para leitura no fichário e nas escutas. */
.wiretap-tabs { display:flex; gap:6px; margin:0 0 12px; border-bottom:1px solid #355a56; padding-bottom:8px; }
.wiretap-tabs button { border:1px solid #4f7d78; background:#123633; color:#dbe9cf; padding:7px 10px; font:700 10px monospace; letter-spacing:.04em; }
.wiretap-tabs button span { color:#93b9a3; }
.wiretap-tabs button.active,.wiretap-tabs button:hover,.wiretap-tabs button:focus-visible { background:#b9d9c7; color:#102a2f; }
.wiretap-tabs button.active span,.wiretap-tabs button:hover span,.wiretap-tabs button:focus-visible span { color:#163d70; }
.wiretap-sticky { position:sticky; top:0; z-index:8; margin:0 -2px 12px; padding:8px 2px 10px; border-bottom:2px solid #355a56; background:#061914; }
.wiretap-sticky .wiretap-header { position:static; margin:0 0 10px; padding:0; border:0; }
.wiretap-sticky .wiretap-tabs { margin:0 0 8px; }
.wiretap-sticky .wiretap-sort { margin:0; }
.wiretap-entry { border:1px solid #315f62; background:#d1ebd2; }
.wiretap-entry + .wiretap-entry { margin-top:7px; }
.wiretap-list .wiretap-entry > button { width:100%; border:0; }
.wiretap-entry.active { background:#a8d9c1; box-shadow:0 0 0 2px #78a6a4; }
.wiretap-inline-reader { border-top:2px solid #315f62; padding:16px; background:#e7efd8; scroll-margin-top:152px; }
.wiretap-inline-reader .wiretap-reader h2 { color:#102f49; }
.wiretap-empty { margin:0; padding:14px; border:1px dashed #729090; color:#dbe9cf; }
.vhs-archive { background:#101d20; color:#e8e2c7; font-family:monospace; }
.vhs-archive h2 { margin:7px 0 2px; color:#f0d36a; font:700 28px Georgia, serif; }
.vhs-intro { margin:0 0 16px; color:#9eb9ad; font-size:12px; }
.vhs-sort { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0 0 12px; color:#9eb9ad; font:10px monospace; }
.vhs-sort button { border:1px solid #4e6e70; background:#20393b; color:#e8e2c7; padding:6px 8px; font:10px monospace; }
.vhs-sort button.active,.vhs-sort button:hover,.vhs-sort button:focus-visible { background:#f1e2a2; color:#1e3033; }
.vhs-layout { display:grid; grid-template-columns:minmax(200px, .82fr) minmax(0, 1.7fr); gap:14px; align-items:start; }
.vhs-catalog { display:grid; gap:6px; max-height:470px; overflow:auto; padding-right:4px; }
.vhs-catalog button { display:grid; gap:3px; text-align:left; border:1px solid #4e6e70; background:#d8d4b8; color:#1e3033; padding:9px; font:11px monospace; }
.vhs-catalog button span { color:#7a3e31; font-size:9px; }
.vhs-catalog button b { line-height:1.25; }
.vhs-catalog button small { color:#315a62; font-size:9px; }
.vhs-catalog button:hover,.vhs-catalog button:focus-visible,.vhs-catalog button.active { border-color:#f0d36a; background:#f1e2a2; box-shadow:inset 4px 0 #a94038; }
.vhs-screen { min-height:310px; box-sizing:border-box; border:8px solid #273d3e; background:#071010; color:#d7eed4; padding:14px; box-shadow:inset 0 0 0 2px #050707; }
.vhs-line { margin:-2px 0 15px; color:#f0d36a; font:10px monospace; letter-spacing:.06em; }
.vhs-idle { display:grid; place-content:center; text-align:center; color:#a8bbaa; }
.vhs-playback h3 { margin:0 0 15px; color:#f4e4a0; font:700 21px Georgia, serif; }
.vhs-transcript { color:#d7eed4; }
.vhs-transcript p { margin:0 0 12px; }
.vhs-filmstrip { margin:0 0 14px; border:1px solid #6f8175; background:#050707; padding:5px; }
.vhs-filmstrip img { display:block; width:100%; max-height:170px; object-fit:cover; }
.vhs-filmstrip figcaption { margin-top:5px; color:#a8bbaa; font:9px monospace; letter-spacing:.05em; }
.vhs-playback .vhs-image,.vhs-playback .vhs-video { display:block; width:100%; max-height:330px; object-fit:contain; background:#000; }
.vhs-playback .vhs-caption { color:#a8bbaa; font-size:12px; line-height:1.45; }
@media (max-width:640px) { .vhs-layout { grid-template-columns:1fr; } .vhs-catalog { max-height:230px; } }
.lore-markdown { font:15px/1.6 ui-monospace, SFMono-Regular, Consolas, monospace; }
.flagra-drawer { background:#efe7c6; color:#1c2d30; }.flagra-drawer h2 { color:#8a332b; font:700 28px Georgia,serif; }.flagra-list { display:grid; gap:8px; max-height:510px; overflow:auto; }.flagra-list a { display:flex; gap:10px; align-items:center; border:1px solid #896c52; padding:8px; color:#1c2d30; text-decoration:none; background:#fff8dc; }.flagra-list a:hover { background:#f3d56e; }.flagra-list img { width:54px; height:54px; object-fit:cover; }.flagra-list span { display:grid; gap:4px; font:bold 12px/1.25 monospace; }.flagra-list small { color:#8a332b; font-size:9px; }
.flagra-cover button:not(.close) { display:grid; gap:12px; width:100%; border:0; padding:0; background:transparent; color:#1c2d30; text-align:left; cursor:pointer; }.flagra-cover button:not(.close) img { width:100%; max-height:330px; object-fit:contain; }.flagra-cover button:not(.close) span { font:700 17px Georgia,serif; color:#8a332b; text-align:center; }.flagra-cover button:not(.close) small,.flagra-cover button:not(.close) b { display:block; margin-top:7px; font:10px monospace; color:#30505a; }.flagra-subtitle { margin-top:-9px; color:#30505a; font:italic 15px Georgia,serif; }.flagra-back { margin:0 0 12px; border:1px solid #896c52; background:#fff8dc; color:#1c2d30; padding:7px 9px; font:10px monospace; }
.open-drawer.flagra-cover { min-height:540px; background:linear-gradient(135deg,#d9d0ae,#f4edd2 48%,#c7bb95); border:10px solid #8a6b49; box-shadow:inset 0 0 0 2px #f7f1d9; }.flagra-cover .drawer-label { color:#633825; text-align:center; letter-spacing:.14em; }.flagra-cover button:not(.close) { display:flex; align-items:center; justify-content:center; min-height:470px; padding:18px; }.flagra-cover button:not(.close) img { width:min(78%,430px); max-height:420px; object-fit:contain; filter:drop-shadow(15px 14px 0 rgba(74,44,29,.25)) drop-shadow(0 3px 4px rgba(0,0,0,.3)); transition:transform .18s ease,filter .18s ease; }.flagra-cover button:not(.close):hover img,.flagra-cover button:not(.close):focus-visible img { transform:rotate(-1deg) translateY(-4px); filter:drop-shadow(18px 18px 0 rgba(74,44,29,.28)) drop-shadow(0 5px 5px rgba(0,0,0,.35)); }
.lore-markdown p { margin:12px 0; }
.lore-markdown h3 { margin:18px 0 10px; color:#7c302b; font:700 17px Georgia, serif; }
.lore-markdown strong { color:#7c302b; }
.lore-markdown em { color:#31505b; }
.lore-markdown blockquote { margin:14px 0; padding:10px 14px; border-left:4px solid #6c9290; background:rgba(182,211,194,.34); color:#294b4e; font:italic 16px/1.55 Georgia, serif; }
.lore-markdown ul { margin:12px 0; padding-left:22px; }
.lore-markdown ol { margin:12px 0; padding-left:26px; }
.lore-markdown hr { margin:20px 0; border:0; border-top:1px dashed #8b9c8b; }
.lore-markdown li { margin:5px 0; }
.lore-markdown code { padding:1px 4px; border:1px solid #8ca4a0; background:#d8e5d6; color:#412e24; font:12px ui-monospace, SFMono-Regular, Consolas, monospace; }
.dos .lore-markdown { margin:16px 0; color:#24221d; }
.dos .lore-markdown h3,.dos .lore-markdown strong { color:#6c2e22; }
.dos .lore-markdown em { color:#3f503b; }
.dos .lore-markdown blockquote { border-left-color:#94713a; background:rgba(225,209,154,.32); color:#3f3321; }

/* Galeria da parede esquerda: a coleção particular do DON. */
.painting-file { width:min(1180px,96vw); max-height:94vh; overflow:auto; padding:18px; background:linear-gradient(135deg,#342016,#19100c); color:#f2dfab; border-color:#b07e3a; }
.painting-gallery { text-align:center; }.painting-gallery .document-kicker { color:#e8bd63; }.painting-gallery h2 { margin:8px 44px 15px; color:#fff0bf; font:700 clamp(22px,3vw,34px) Georgia,serif; }.painting-frame { width:fit-content; max-width:100%; margin:0 auto; padding:12px; background:linear-gradient(135deg,#c69a4a,#4b2b13 42%,#e0bd68 70%,#613a1b); box-shadow:0 9px 22px rgba(0,0,0,.58), inset 0 0 0 3px #21130b; }.painting-frame img { display:block; width:auto; max-width:100%; max-height:calc(94vh - 215px); object-fit:contain; background:#111; }.painting-frame figcaption { max-width:850px; margin:10px auto 0; color:#fff0c4; font:italic 14px Georgia,serif; }.painting-actions { display:flex; justify-content:center; align-items:center; gap:12px; flex-wrap:wrap; margin-top:16px; color:#d9b776; font:10px monospace; }.painting-actions button { border:1px solid #d9b776; background:#382016; color:#fff0c4; padding:8px 11px; font:bold 11px monospace; }.painting-actions button:hover,.painting-actions button:focus-visible { background:#e4bc68; color:#28150b; }

/* Correspondência interna: terminal DOS verde */
.dos .lore-markdown.email-body,
.dos .lore-markdown.email-body * {
  font-family: var(--pixel-font), "Courier New", monospace;
  color: #79f6a0;
}
.dos .lore-markdown.email-body h1,
.dos .lore-markdown.email-body h2,
.dos .lore-markdown.email-body h3,
.dos .lore-markdown.email-body strong { color: #b7ffd0; }
.dos .lore-markdown.email-body p,
.dos .lore-markdown.email-body li { line-height: 1.65; }

/* Inbox ampliada, com cabeçalhos legíveis antes da abertura. */
.modal:has(.email-inbox) { width: min(96vw, 980px); max-width: 980px; }
.email-list { display: grid; gap: 10px; max-height: 60vh; overflow: auto; }
.choice-list .email-preview { display: grid; gap: 7px; text-align: left; padding: 15px 17px; }
.email-preview b { color: #b7ffd0; font-family: var(--pixel-font), "Courier New", monospace; }
.email-preview small { color: #79f6a0; font-family: var(--pixel-font), "Courier New", monospace; }
@media (max-width: 640px) {
  .modal:has(.email-inbox) { width: calc(100vw - 16px); max-width: none; }
  .email-list { max-height: 53vh; }
  .choice-list .email-preview { padding: 13px 12px; }
  .email-preview small { line-height: 1.55; }
}
.email-row{display:flex;gap:8px;align-items:stretch}.email-row .email-preview{flex:1}.email-attachment{min-width:50px;color:#b7ffd0}@media(max-width:640px){.email-row{gap:5px}.email-attachment{min-width:42px}.email-attachments{display:grid;gap:7px}}

.email-attachment-reader { min-height: 360px; }
.email-attachment-reader .email-actions { align-items: center; }
.email-attachment-reader .email-actions span { color: #7dff9c; font: 11px monospace; padding: 8px; }

.pilot-profile-link { appearance: none; display: inline; padding: 0; border: 0; border-bottom: 1px dashed currentColor; background: transparent; color: inherit; font: inherit; font-weight: inherit; cursor: pointer; }
.pilot-profile-link:hover, .pilot-profile-link:focus-visible { color: #c88f35; outline: none; }

/* Anexos de e-mail: prévia enquadrada e ampliação sob demanda. */
.email-attachment-reader { min-height: 360px; }
.email-attachment-reader .email-actions { align-items: center; }
.email-attachment-reader .email-actions span { color: #7dff9c; font: 11px monospace; padding: 8px; }
.email-image-preview { display: grid; gap: 9px; width: 100%; max-height: 440px; padding: 0; overflow: hidden; border: 1px solid #5eae78; background: #02100b; color: #9dffb9; cursor: zoom-in; }
.email-image-preview img { display: block; width: 100%; min-height: 0; max-height: 398px; object-fit: contain; background: #010604; }
.email-image-preview span { padding: 0 10px 10px; font: 10px var(--pixel-font), monospace; letter-spacing: 1px; }
.email-image-preview:hover, .email-image-preview:focus-visible { border-color: #c6ffd4; box-shadow: 0 0 0 2px #2a7650; outline: none; }
.attachment-zoom { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; padding: 28px; background: rgba(0, 8, 5, .94); cursor: zoom-out; }
.attachment-zoom img { display: block; width: auto; max-width: 100%; height: auto; max-height: calc(100dvh - 56px); object-fit: contain; cursor: default; box-shadow: 0 12px 38px rgba(0,0,0,.72); }
.attachment-zoom-close { position: fixed; top: 14px; right: 18px; border: 0; background: transparent; color: #b7ffd0; font: 36px Arial, sans-serif; cursor: pointer; }
.attachment-zoom p { position: fixed; bottom: 8px; left: 50%; transform: translateX(-50%); color: #9dffb9; font: 10px var(--pixel-font), monospace; letter-spacing: 1px; white-space: nowrap; }
@media (max-width: 640px) { .email-image-preview { max-height: calc(100dvh - 250px); } .email-image-preview img { max-height: calc(100dvh - 300px); } .attachment-zoom { padding: 12px; } .attachment-zoom img { max-height: calc(100dvh - 24px); } .attachment-zoom p { display:none; } }
.vhs-still { display:block; width:100%; padding:0; border:0; background:#000; cursor:zoom-in; }
.vhs-still:hover,.vhs-still:focus-visible { outline:2px solid #f0d36a; outline-offset:2px; }
.vhs-still img { display:block; width:100%; max-height:170px; object-fit:cover; }


/* Porta de entrada: LandingPage e FrontPage. */
.entry-overlay { z-index: 60; padding: 0; overflow: hidden; background: #02070c; backdrop-filter: none; }
.entry-screen { position: absolute; inset: 0; display: grid; place-items: center; overflow: hidden; }
.entry-screen[hidden] { display: none; }
.entry-screen > img { width: 100%; height: 100%; object-fit: cover; }
.entry-hit { position: absolute; border: 0; color: transparent; background: transparent; cursor: pointer; }
.entry-hit:focus-visible { outline: 3px solid #f6d46a; outline-offset: 6px; }
.entry-enter { left: 40%; top: 21%; width: 21%; height: 18%; border-radius: 10px; }
.entry-enter:hover { background: radial-gradient(ellipse, rgba(255,214,91,.2), transparent 68%); box-shadow: 0 0 32px rgba(248,197,67,.32); }
.front-screen { background: #02070c; }
.front-scene { position: relative; width: min(100vw, calc(100dvh * 1.776)); aspect-ratio: 1672 / 941; }
.front-scene > img { display: block; width: 100%; height: 100%; object-fit: contain; }
.front-actions { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(3, 1fr); }
.front-actions button { border: 0; background: transparent; color: transparent; cursor: pointer; }
.front-actions button:hover { background: linear-gradient(180deg, transparent 64%, rgba(241,199,79,.12)); box-shadow: inset 0 -4px #e4b743; }
.front-actions button:focus-visible { outline: 3px solid #f6d46a; outline-offset: -8px; }
.construction-notice { position: absolute; z-index: 2; left: 50%; bottom: 11%; width: min(540px, 82%); margin: 0; transform: translateX(-50%); border: 2px solid #e3bd51; background: rgba(8,18,25,.92); color: #f2dda0; padding: 11px 14px; text-align: center; font: bold clamp(10px, 1.1vw, 14px) monospace; letter-spacing: .07em; box-shadow: 5px 5px 0 rgba(0,0,0,.4); }
@media (max-width: 650px) {
  .landing-screen > img { object-position: 49% center; }
  .entry-enter { left: 31%; top: 22%; width: 39%; height: 13%; }
  .front-scene { width: 100vw; }
  .front-actions button:hover { box-shadow: none; }
  .construction-notice { bottom: 16%; width: 88%; font-size: 9px; }
}