/* KUCOO / CRT console. Scoped to the 3D prototype; touch-v2 stays unchanged. */
#screen-anchor#screen-anchor{--bg:#25272a;--ink:#d9dad7;--muted:#858987;--accent:#dce1e1;--line:#ffffff26;background:var(--bg)}
#screen-anchor#screen-anchor .screen{border:0;border-radius:0;background:#25272a;color:var(--ink);text-shadow:0 0 9px #e9f2ff12}
#screen-anchor#screen-anchor .screen::before{content:"";position:absolute;inset:0;z-index:12;pointer-events:none;border-radius:22px;background:radial-gradient(ellipse at center,transparent 48%,#10111466 82%,#101114dd 100%);box-shadow:inset 0 0 20px 9px #111216aa,inset 0 0 95px #11121666}
#screen-anchor#screen-anchor .screen::after{content:"";position:absolute;inset:0;z-index:13;pointer-events:none;border-radius:0;background:repeating-linear-gradient(0deg,#0003 0px,#0003 1px,transparent 1px,transparent 3px),repeating-linear-gradient(90deg,#ff000006 0 1px,#00ff0004 1px 2px,#0000ff07 2px 3px);box-shadow:none;opacity:.7}
#screen-anchor#screen-anchor .topbar{height:94px;padding:0 4.3%;display:flex;align-items:center;gap:25px;background:transparent;border:0;position:relative;z-index:2}
#screen-anchor#screen-anchor .brand{font-family:Arial,sans-serif;font-size:36px;font-weight:900;font-style:italic;letter-spacing:-2.5px;color:#dcdfdf;text-shadow:0 0 15px #d8eaff33;gap:5px}
#screen-anchor#screen-anchor .brand-star{display:inline;font:11px Arial;letter-spacing:0;align-self:flex-start;margin-top:4px}
#screen-anchor#screen-anchor .navigation{margin-left:auto;display:flex;flex-direction:row;align-items:center;gap:30px;padding:0;background:none;border:0}
#screen-anchor#screen-anchor .navigation a{min-height:44px;display:flex;flex-direction:row;padding:8px 0;border:0;border-radius:0;font-size:17px;font-weight:400;color:#969b99;background:transparent;box-shadow:none;position:relative}
#screen-anchor#screen-anchor .navigation a[aria-current=page]{color:#f0f1ec;background:none;box-shadow:none}
#screen-anchor#screen-anchor .navigation a[aria-current=page]::after{content:"";position:absolute;left:0;right:0;bottom:3px;height:1px;background:#d9dfdb;box-shadow:0 0 5px #fff6}
#screen-anchor#screen-anchor .navigation a:hover{color:#e3e0d8}
#screen-anchor#screen-anchor .status{border-left:1px solid #ffffff26;padding-left:23px;font:10px var(--mono);color:#a6aaa8;gap:10px}
#screen-anchor#screen-anchor .status i,.companion-signal i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#3396ff;box-shadow:0 0 6px #369dff,0 0 17px #1682ff,0 0 29px #1682ff77;flex-shrink:0}
#screen-anchor#screen-anchor .console-layout{height:calc(100% - 94px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:6%;padding:22px 4.3% 35px;scrollbar-width:thin;scrollbar-color:#444b4e transparent}
#screen-anchor#screen-anchor .companion{grid-column:1;grid-row:1;min-width:0;position:relative;display:flex;flex-direction:column;border-top:1px solid var(--line)}
.companion-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 0;font:9px var(--mono);letter-spacing:1px;color:#737b7b}
.companion-signal{display:flex;align-items:center;gap:9px;font-size:8px;letter-spacing:.6px;color:#a1b5c5}
.companion-stage{position:relative;flex:1;min-height:260px}
.companion-halo{position:absolute;inset:5%;background:radial-gradient(ellipse at 50% 60%,#91a4b010,transparent 65%)}
#screen-anchor#screen-anchor .companion .ip-figure{left:50%;top:49%;transform:translate(-50%,-50%) scale(1.55);opacity:1;filter:drop-shadow(0 28px 14px #000c)}
#screen-anchor#screen-anchor .companion .ip-head{background:linear-gradient(145deg,#b7bdbe,#626a6d 66%,#42494d);border:1px solid #cbd7df38;box-shadow:inset 2px 3px 5px #eaf7ff25}
#screen-anchor#screen-anchor .companion .ip-body{background:linear-gradient(130deg,#adb4b5,#656d70 62%,#40484b);box-shadow:inset 2px 2px 4px #fff2}
#screen-anchor#screen-anchor .companion .ip-leg{background:linear-gradient(110deg,#8f999b,#4e575c)}
#screen-anchor#screen-anchor .companion .ip-face{background:#151d24;box-shadow:inset 0 2px 5px #0008}
#screen-anchor#screen-anchor .companion .ip-face::before,#screen-anchor#screen-anchor .companion .ip-face::after{background:#a9cced;box-shadow:0 0 7px #5aafffa0}
.companion-cross{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);font:20px var(--mono);color:#586064}
.companion-foot{display:flex;justify-content:space-between;gap:20px;padding-top:20px;border-top:1px solid var(--line);line-height:1.7;color:#afb6b5;font-size:17px}
.companion-foot>span:last-child{font:9px/1.9 var(--mono);text-align:right;color:#6c7679;align-self:end}
#screen-anchor#screen-anchor #main{grid-column:2;grid-row:1;height:100%;min-height:0;min-width:0;display:block;padding:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#444b4e transparent;outline:none}
#screen-anchor#screen-anchor .home-layout{display:block;margin:0}
#screen-anchor#screen-anchor .home-left{display:block}
#screen-anchor#screen-anchor .eyebrow{margin:0 0 13px;font:9px var(--mono);letter-spacing:1.5px;color:#828a8b}
#screen-anchor#screen-anchor h1{font-size:clamp(30px,3vw,49px);font-weight:400;letter-spacing:-1.5px;line-height:1.18;margin:0 0 15px}
#screen-anchor#screen-anchor h1 em{color:#e4e7e2;font-style:normal}
#screen-anchor#screen-anchor .identity{font-size:12px;line-height:1.8;max-width:100%;color:#999f9e;margin:0 0 11px}
#screen-anchor#screen-anchor .identity-meta{font:9px var(--mono);color:#777e7e;margin:0 0 24px;gap:15px}
#screen-anchor#screen-anchor .section-label{border-top:1px solid #ffffff40;padding-top:15px;margin-bottom:13px;font:9px var(--mono);color:#a2a8a7;letter-spacing:1px}
#screen-anchor#screen-anchor .skills{display:flex;flex-direction:column;gap:0;max-height:none;margin:0;border-top:1px solid var(--line)}
#screen-anchor#screen-anchor .skill{display:grid;grid-template-columns:36px 1fr 20px;align-items:center;gap:15px;position:relative;min-height:54px;padding:10px 12px 10px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none;color:#b1b7b5;transition:background .18s,color .18s,padding .18s;text-align:left}
#screen-anchor#screen-anchor .skill-top{display:flex;margin:0;gap:0}
#screen-anchor#screen-anchor .skill-top svg{width:25px;height:25px}
#screen-anchor#screen-anchor .skill-top small{display:none}
#screen-anchor#screen-anchor .skill strong{font-size:16px;font-weight:400;letter-spacing:.5px}
#screen-anchor#screen-anchor .skill .selected-mark{position:static;opacity:1;color:#555f63;font:10px var(--mono)}
#screen-anchor#screen-anchor .skill:hover{background:#ffffff09;padding-left:12px;color:#e3e0d8}
#screen-anchor#screen-anchor .skill[aria-pressed=true]{background:#d7dedb;color:#101416;padding-left:12px;box-shadow:0 0 18px #d8e7ff16}
#screen-anchor#screen-anchor .skill[aria-pressed=true] .selected-mark{color:#151a1e}
#screen-anchor#screen-anchor .skill-note{padding:12px 0 0;border:0;background:none;font:8px var(--mono);color:#646e72;letter-spacing:1px;min-height:0}
#screen-anchor#screen-anchor .print-dock{margin:22px 0 0;padding:0;display:flex;flex-direction:column;align-items:stretch;gap:12px;border:0;background:none;box-shadow:none;border-radius:0}
#screen-anchor#screen-anchor .print-choice{gap:10px;color:#8f999c;min-height:25px}
#screen-anchor#screen-anchor .print-choice>svg{width:21px;height:21px}
#screen-anchor#screen-anchor .print-choice strong{font-size:11px;font-weight:400}
#screen-anchor#screen-anchor .print-choice small{font-size:8px;color:#737e82;margin-top:3px}
#screen-anchor#screen-anchor .print-choice.ready{color:#d1e2eb}
#screen-anchor#screen-anchor .start{min-height:47px;display:flex;justify-content:space-between;align-items:center;border:1px solid #d4dad8;border-radius:0;background:#d7dddb;color:#171b1d;font-size:14px;padding:10px 18px;box-shadow:0 0 24px #d5e8ff22}
#screen-anchor#screen-anchor .start:disabled{background:#373d3e;color:#828c8e;border-color:#485052;box-shadow:none;opacity:1}
#screen-anchor#screen-anchor .info-page{max-width:none;border-top:1px solid var(--line);padding-top:20px}
#screen-anchor#screen-anchor .info-grid{grid-template-columns:1fr;gap:20px}
#screen-anchor#screen-anchor .resume-heading{display:block}
#screen-anchor#screen-anchor .contact-row a{font-size:clamp(15px,1.7vw,24px)}
#screen-anchor#screen-anchor :is(button,a):focus-visible{outline:2px solid #58a6ed;outline-offset:4px}
#cursor-trail{position:absolute;inset:0;z-index:10;pointer-events:none;mix-blend-mode:difference;overflow:hidden}
.cursor-stamp{position:absolute;left:0;top:0;width:112px;height:112px;border-radius:5px;background:#fff;pointer-events:none;will-change:opacity,transform}
@media(min-width:1400px) and (min-height:850px){
 #screen-anchor#screen-anchor .topbar{height:112px}
 #screen-anchor#screen-anchor .console-layout{height:calc(100% - 112px);padding-top:28px;padding-bottom:45px}
 #screen-anchor#screen-anchor .skill{min-height:64px}
 #screen-anchor#screen-anchor .print-dock{margin-top:30px}
 #screen-anchor#screen-anchor .companion .ip-figure{transform:translate(-50%,-50%) scale(1.85)}
}
@media(max-width:759px){
 #screen-anchor#screen-anchor .topbar{height:76px;padding:0 23px;gap:13px}
 #screen-anchor#screen-anchor .brand{font-size:25px;letter-spacing:-1.8px}
 #screen-anchor#screen-anchor .navigation{gap:17px}
 #screen-anchor#screen-anchor .navigation a{font-size:12px;padding:8px 0;min-height:40px}
 #screen-anchor#screen-anchor .status{display:none}
 #screen-anchor#screen-anchor .console-layout{height:calc(100% - 76px);display:flex;flex-direction:column;gap:27px;padding:5px 23px 30px;overflow:auto}
 #screen-anchor#screen-anchor .companion{min-height:240px;flex-shrink:0}
 .companion-caption{padding:12px 0;font-size:8px}.companion-signal{font-size:7px}
 .companion-stage{min-height:160px}
 #screen-anchor#screen-anchor .companion .ip-figure{left:50%;top:50%;transform:translate(-50%,-50%) scale(.69)}
 .companion-cross{left:88%;bottom:55px}.companion-foot{font-size:12px;padding-top:12px}.companion-foot>span:last-child{font-size:8px}
 #screen-anchor#screen-anchor #main{height:auto;overflow:visible;flex-shrink:0;padding:0}
 #screen-anchor#screen-anchor h1{font-size:32px}
 #screen-anchor#screen-anchor .identity{font-size:11px}
 #screen-anchor#screen-anchor .skill strong{font-size:15px}
 #screen-anchor#screen-anchor .skill{min-height:56px}
 #screen-anchor#screen-anchor .screen::before{box-shadow:inset 0 0 12px 5px #000b,inset 0 0 50px #0005;background:radial-gradient(ellipse at center,transparent 60%,#0008 100%)}
}
:root[data-motion="reduced"]{#cursor-trail{display:none}}


/* Continuous phosphor sweep: low contrast, no full-screen flashing. */
#screen-anchor#screen-anchor .screen::after{background:linear-gradient(180deg,transparent 0%,#dde0d507 45%,#dde0d516 50%,transparent 56%),repeating-linear-gradient(0deg,#12141740 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,#d5777706 0 1px,#80a08004 1px 2px,#8c9ccc07 2px 3px);background-size:100% 220%,100% 3px,3px 100%;animation:crt-sweep 7s linear infinite;opacity:.65}
@keyframes crt-sweep{from{background-position:0 140%,0 0,0 0}to{background-position:0 -100%,0 3px,0 0}}
/* A viewport HUD stays with the camera, rather than disappearing with the physical screen. */
.print-loading{position:fixed;left:50%;bottom:142px;transform:translateX(-50%);z-index:7;display:grid;grid-template-columns:24px auto;align-items:center;gap:8px 13px;padding:15px 22px;border:1px solid #ffffff35;border-radius:10px;background:#000b;backdrop-filter:blur(12px);color:#fff;pointer-events:none;opacity:1;transition:opacity .65s ease,translate .65s ease;text-shadow:0 0 8px #ffffff44}
.print-loading[hidden]{display:none}.print-loading.is-complete{opacity:0;translate:0 8px}
.print-loading strong{font:12px var(--mono);letter-spacing:3px}.print-loading small{grid-column:2;font-size:10px;color:#fff;letter-spacing:1px}
.loading-orbit{grid-row:1/3;width:23px;height:23px;border:1px solid #ffffff40;border-top:2px solid #73bdff;border-radius:50%;animation:loading-spin .85s linear infinite;box-shadow:0 0 16px #339dff44}
.loading-track{grid-column:1/3;width:100%;height:2px;margin-top:5px;background:#ffffff2e;overflow:hidden}.loading-track i{display:block;height:100%;background:#fff;transform:scaleX(var(--print-progress,0));transform-origin:left;box-shadow:0 0 8px #6bbaff}
@keyframes loading-spin{to{transform:rotate(360deg)}}
#impact-fx{position:fixed;inset:0;z-index:18;pointer-events:none;overflow:hidden;background:#bbc0bd0c}
#impact-fx[hidden]{display:none}#impact-fx svg{width:100%;height:100%;position:absolute;inset:0;filter:drop-shadow(2px 1px 0 #191d25b0)}
#impact-fx .fracture{fill:none;stroke:#dddcd3;stroke-width:1.25;vector-effect:non-scaling-stroke;opacity:.8}#impact-fx .fracture-fine{stroke-width:.65;opacity:.5}
#impact-fx .glitch-bands{position:absolute;inset:0;opacity:0;background:linear-gradient(180deg,transparent 17%,#73a4b72a 17% 21%,transparent 21% 44%,#bb798b22 44% 48%,transparent 48% 73%,#b0bcb526 73% 77%,transparent 77%),repeating-linear-gradient(0deg,#a6adb31a 0 2px,#22272b18 2px 5px)}
#impact-fx.hit{animation:impact-fade 1.65s linear both}#impact-fx.hit svg{animation:glass-hit .24s ease-out both}#impact-fx.hit .glitch-bands{animation:signal-break .65s .12s steps(1,end) both}
body.signal-damaged #screen-anchor .screen{animation:screen-displace .7s steps(1,end) both}
@keyframes glass-hit{from{transform:scale(1.025);opacity:.2}to{transform:scale(1);opacity:1}}
@keyframes signal-break{0%{opacity:.6;transform:translateX(-12px)}35%{opacity:.42;transform:translateX(15px) skewX(-1deg)}70%{opacity:.18;transform:translateX(-4px)}100%{opacity:0;transform:none}}
@keyframes screen-displace{0%{transform:translateX(-7px);filter:sepia(.12)}40%{transform:translateX(6px);filter:sepia(.08)}75%,100%{transform:none;filter:none}}
@keyframes impact-fade{0%,45%{opacity:1}100%{opacity:0}}
:root[data-motion="reduced"]{#screen-anchor#screen-anchor .screen::after,.loading-orbit,.loading-track i{animation:none}#impact-fx{display:none}body.signal-damaged #screen-anchor .screen{animation:none}}

#screen-anchor#screen-anchor .boot{background:#25272a;color:#d9dad7}

/* Latest direction: true black / white phosphor, with blue as the only light accent. */
#screen-anchor#screen-anchor{--bg:#000;--ink:#fff;--muted:#fff;--accent:#fff;background:#000}
#screen-anchor#screen-anchor .screen,#screen-anchor#screen-anchor .boot{background:#000;color:#fff;text-shadow:0 0 5px #ffffff45,0 0 13px #bddbff20}
#screen-anchor#screen-anchor :is(.brand,.navigation a,.status,.eyebrow,h1 em,.identity,.identity-meta,.section-label,.skill,.skill-note,.print-choice,.print-choice small,.print-choice.ready,.companion-caption,.companion-signal,.companion-foot,.companion-foot>span:last-child,.companion-cross){color:#fff}
#screen-anchor#screen-anchor .brand{text-shadow:0 0 5px #ffffff66,0 0 18px #cde7ff44}
#screen-anchor#screen-anchor .skill[aria-pressed=true],#screen-anchor#screen-anchor .start:not(:disabled){background:#fff;color:#000;text-shadow:none;border-color:#fff}
#screen-anchor#screen-anchor .skill[aria-pressed=true] .selected-mark{color:#000}
#screen-anchor#screen-anchor .status i,#screen-anchor#screen-anchor .companion-signal i{background:#7bc9ff;box-shadow:0 0 4px 2px #83cfff,0 0 12px 4px #339cff,0 0 30px 9px #167fff99,0 0 65px 17px #167fff38}
#screen-anchor#screen-anchor .screen::before{background:radial-gradient(ellipse at center,transparent 48%,#0006 82%,#000e 100%);box-shadow:inset 0 0 20px 9px #000a,inset 0 0 95px #0006}
@media(max-width:759px){.print-loading{bottom:150px;max-width:calc(100vw - 32px);width:max-content}}

#screen-anchor#screen-anchor .device{max-width:none;background:#000}
#screen-anchor#screen-anchor .skill[aria-pressed=true] :is(strong,svg,.skill-top,.selected-mark){color:#000;text-shadow:none}

/* Cursor stamps sit above the phosphor overlay: no scanlines inside the inversion blocks. */
#screen-anchor#screen-anchor #cursor-trail{z-index:14}
#screen-anchor#screen-anchor .cursor-stamp{border-radius:5px;background:#fff;box-shadow:none;mix-blend-mode:difference}
/* Stronger phosphor scanlines on the true-black CRT. */
#screen-anchor#screen-anchor .screen::after{background:linear-gradient(180deg,transparent 0%,#ffffff0a 46%,#ffffff20 50%,transparent 55%),repeating-linear-gradient(0deg,#ffffff15 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,#2c74ff08 0 1px,#ffffff05 1px 2px,#2c74ff08 2px 3px);background-size:100% 220%,100% 3px,3px 100%;opacity:.92;animation:crt-sweep 5.8s linear infinite}
#impact-fx svg{display:none}
/* Remove the phosphor under each live stamp, not just above it: inversion stays clean. */
#screen-anchor#screen-anchor .screen::after{mask-image:var(--crt-mask,none);mask-size:100% 100%;mask-repeat:no-repeat}
#screen-anchor#screen-anchor .cursor-stamp{mix-blend-mode:normal;background:#fff;background-image:none}
#impact-fx.hit{animation:impact-fade .6s linear both}
#impact-fx.hit .glitch-bands{animation:signal-break .5s steps(1,end) both}
#screen-anchor#screen-anchor .screen::after{mask-mode:luminance}
/* Selection and print form a single visual interaction, with no helper copy. */
#screen-anchor#screen-anchor .dock-object{display:grid;place-items:center;width:26px;height:26px;flex:0 0 auto}
#screen-anchor#screen-anchor .dock-object svg{width:24px;height:24px}
#screen-anchor#screen-anchor .start{gap:12px;position:relative;isolation:isolate;overflow:hidden;transition:background .25s,box-shadow .25s,border-color .25s}
#screen-anchor#screen-anchor .start-label{flex:1;text-align:left}
#screen-anchor#screen-anchor .start-object{width:25px;height:25px;display:grid;place-items:center}
#screen-anchor#screen-anchor .start-object svg{width:23px;height:23px}
#screen-anchor#screen-anchor .start:not(:disabled){border-color:#8cd5ff;box-shadow:0 0 20px #57b5ff40}
#screen-anchor#screen-anchor .start.is-charging .start-object{opacity:.15}
#screen-anchor#screen-anchor .start:not(:disabled)::after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,#5fbcff55 50%,transparent 70%);transform:translateX(-110%);animation:print-ready-sweep 3.8s ease-in-out .5s infinite;z-index:-1;pointer-events:none}
#screen-anchor#screen-anchor .skill[aria-pressed=true]{box-shadow:inset 3px 0 #67bfff,0 0 20px #50acff22}
#screen-anchor#screen-anchor .skill[aria-pressed=true] .selected-mark{font-size:0}
#screen-anchor#screen-anchor .skill[aria-pressed=true] .selected-mark::after{content:'✓';font-size:15px}
#screen-anchor#screen-anchor .start:not(:disabled):hover{background:#bce6ff;box-shadow:0 0 28px #57b5ff66}
#screen-anchor#screen-anchor .start:not(:disabled):active{transform:scale(.985)}
.selection-flight{position:fixed;z-index:100;display:grid;place-items:center;color:#9cdcff;filter:drop-shadow(0 0 9px #37a7ff);pointer-events:none}
.selection-flight svg{width:100%;height:100%}
@keyframes print-ready-sweep{0%,45%{transform:translateX(-110%)}80%,100%{transform:translateX(110%)}}
:root[data-motion="reduced"]{#screen-anchor#screen-anchor .start:not(:disabled)::after{animation:none;display:none}.selection-flight{display:none}}
