/* Build 004: screen instrumentation and the 1702's lower fascia. */
.crt-phosphor{padding:4.5% 6% 6%;display:flex;flex-direction:column;gap:10px}.screen-topline{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-shrink:0;min-height:27px;color:var(--phosphor)}#screen-clock{font:clamp(8px,.8vw,11px)/1.35 var(--mono);letter-spacing:.3px;white-space:nowrap}#screen-clock span{display:block}.screen-logo{display:block;width:36%;max-width:145px;height:auto;opacity:.9}.monitor .terminal{min-height:0;flex:1}.monitor .terminal-bar{display:block;text-align:center;position:relative;margin-bottom:12px;padding:2px 0 8px;border-bottom:1px dashed #d8aa4b}.monitor .terminal-bar h2{font-size:1em;letter-spacing:1.3px;text-align:center}.monitor .skip{position:absolute;right:0;top:-33px;font-size:8px;background:#100d07;z-index:1;transform:translateY(-100%)}
/* Animated copy stays in normal flow; its accessible counterpart remains available. */
.monitor .terminal.typing .announcement{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);visibility:visible}.monitor .terminal.typing #typed-announcement{position:static;left:auto;right:auto;top:auto}.monitor .announcement h3,.monitor #typed-announcement h3{font-size:1.05em;margin-bottom:10px}.monitor .announcement p,.monitor #typed-announcement p{margin-bottom:10px}.screen-build{color:var(--phosphor);opacity:.75;font:clamp(7px,.7vw,9px)/1.2 var(--mono);text-align:right;margin-top:auto;padding-top:3px;flex-shrink:0}.monitor .cursor{margin-top:2px}
.monitor-upper{bottom:21%}.monitor-controls{top:80.5%;height:8.5%;left:3%;right:3%;gap:4%;padding:0 1%;border-top:1px solid #e7d5b7;border-bottom:2px solid #76614b;background:linear-gradient(180deg,#c0ab8e,#b49c7f);box-shadow:0 2px 2px #65513d55}.badge-well{margin-left:30%;width:43%;height:96%;display:flex;align-items:stretch;position:relative;background:#100d07;border:1px solid #79654e;box-shadow:none}.badge-well:before{content:none;display:none}.badge-well .commodore-badge{margin:0;width:83%;height:100%;padding:2px 5px;border:0;border-right:1px solid #88735d;font-size:clamp(7px,.9vw,12px);background:none;gap:3px}.commodore-symbol{font-size:1.4em}.rainbow-mark{margin-left:auto;width:28px;height:90%;background:linear-gradient(#bf3e28 0 14%,#252019 14% 17%,#dc7021 17% 31%,#252019 31% 34%,#d7b431 34% 48%,#252019 48% 51%,#4e8749 51% 65%,#252019 65% 68%,#368990 68% 82%,#252019 82% 85%,#4b5592 85%)}.power-section{display:flex;flex:1;min-width:19px;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:#100d07}.power-section small{font:5px Arial,sans-serif;color:#c0ae83;letter-spacing:.2px}.monitor .power-indicator{display:block;width:12px;height:5px;min-height:5px;border-radius:0;background:#72e632;border:1px solid #619035;box-shadow:0 0 5px 1px #75e833,inset 0 0 2px #d9ff9a;flex-shrink:0}.monitor[data-power=off] .power-indicator{background:#23301a;border-color:#25301d;box-shadow:inset 0 1px 1px #10140c}.monitor-model{padding:3px 5px;border:1px solid #96826b;border-top-color:#a48d73;box-shadow:inset 0 1px #e1cbb1,0 1px 1px #72604d;font:clamp(5px,.6vw,8px)/1.35 Arial,sans-serif;background:linear-gradient(#c3af94,#d1bfa4);color:#392f25;margin-left:auto;align-self:center}.monitor-model strong{font-size:1.05em;letter-spacing:.4px}.power-switch-well{height:100%;min-width:29px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.power-switch-well>small{font:5px Arial,sans-serif;color:#43372a;letter-spacing:.6px}.monitor .monitor-power{width:27px;min-width:27px;height:23px;border-radius:0;border:2px solid #4f4236;background:linear-gradient(#c8b599 0%,#b6a084 65%,#9a846b 66%);box-shadow:inset 0 2px #d6c4a6,0 1px 2px #4b3c2b;transform:perspective(100px) rotateX(-5deg)}.monitor[data-power=off] .monitor-power{background:linear-gradient(#9d8b74,#bfaa8d);box-shadow:inset 0 -2px #d6c4a6,0 -1px 2px #4b3c2b;transform:perspective(100px) rotateX(5deg)}.monitor-base{top:90%;height:8.5%;left:3%;right:3%;gap:0;background:linear-gradient(#bba487,#b29a7d);border-top:2px solid #725d46;border-bottom:1px solid #7b654d;box-shadow:inset 0 1px #d8c0a0}.control-flap{position:relative;width:81%;border:1px solid #80694f;border-radius:0 0 4px 4px;background:linear-gradient(#c0aa8b,#b59c7f);box-shadow:inset 0 1px #ddc7a7,1px 0 #6d5841}.flap-notch{position:absolute;right:9%;top:0;width:9px;height:2px;background:#79634c;border-radius:0 0 2px 2px}.av-sockets{padding-top:5px;gap:15px;align-items:flex-start}.av-sockets i{width:15px;height:15px;border:1px solid #372b1d;background:radial-gradient(circle,#19140f 0 25%,#79613c 27% 47%,#15110e 49% 65%,#bfaf8c 70%);box-shadow:0 0 0 2px #b4a17d}.av-sockets i:first-child{background:radial-gradient(circle,#211807 0 25%,#c7a632 27% 47%,#201908 49% 65%,#d5b42f 70%);box-shadow:0 0 0 2px #c3a12d}.av-sockets small{font-size:6px;bottom:1px;color:#54422f}
@media(min-width:761px) and (max-height:850px){.crt-phosphor{gap:7px;padding-top:4%}.screen-topline{min-height:23px}.monitor .terminal-bar{margin-bottom:8px;padding-bottom:6px}.monitor .announcement h3,.monitor #typed-announcement h3{margin-bottom:7px}.monitor .announcement p,.monitor #typed-announcement p{margin-bottom:7px}.monitor .terminal{font-size:11px}}
@media(min-width:761px) and (max-height:680px){.crt-phosphor{gap:5px;padding:3.5% 5% 4%}.screen-topline{min-height:20px}#screen-clock{font-size:8px}.screen-logo{max-width:105px}.monitor .terminal{font-size:10px;line-height:1.35}.monitor .terminal-bar{padding-bottom:5px;margin-bottom:6px}.monitor .announcement h3,.monitor #typed-announcement h3{font-size:11px;margin-bottom:6px}.monitor .announcement p,.monitor #typed-announcement p{margin-bottom:6px}.screen-build{font-size:7px}.badge-well{margin-left:25%;width:43%}}
@media(max-width:1000px) and (min-width:761px){.badge-well{margin-left:19%;width:46%}.badge-well .commodore-badge{font-size:7px}.monitor-model{font-size:5px}.rainbow-mark{width:20px}.power-section{min-width:16px}}
@media(max-width:760px){.crt-phosphor{gap:6px;padding:4% 5% 5%}.screen-topline{min-height:21px}#screen-clock{font-size:clamp(7px,1.9vw,10px)}.screen-logo{width:34%}.monitor .terminal{font-size:clamp(9px,2.5vw,13px);line-height:1.4}.monitor .terminal-bar{margin-bottom:7px;padding-bottom:5px}.monitor .terminal-bar h2{font-size:1em;letter-spacing:.8px}.monitor .announcement h3,.monitor #typed-announcement h3{font-size:1.03em;margin-bottom:7px}.monitor .announcement p,.monitor #typed-announcement p{margin-bottom:6px}.screen-build{font-size:clamp(6px,1.6vw,8px)}.badge-well{margin-left:21%;width:43%}.badge-well .commodore-badge{font-size:7px;padding:1px 3px;gap:2px}.rainbow-mark{width:19px;min-height:8px}.power-section{min-width:15px;gap:2px}.power-section small{font-size:4px}.monitor .power-indicator{width:9px;height:4px;min-height:4px}.monitor-model{font-size:4px;padding:2px}.power-switch-well{min-width:22px}.monitor .monitor-power{width:22px;min-width:22px;height:18px}.power-switch-well>small{font-size:4px}.av-sockets{gap:10px;padding-top:4px}.av-sockets i{width:11px;height:11px}.av-sockets small{font-size:4px}}

.monitor .skip{position:static;transform:none;margin:4px auto 0;display:block;width:max-content;max-width:100%}
