/* Cyber Security OS · original design system · MIT License */
:root{color-scheme:dark;--bg:#080d17;--panel:#0b1524;--panel2:#101c2c;--line:#20384c;--line2:#29485b;--txt:#edf4ff;--muted:#8ea4ba;--subtle:#687f93;--green:#95f57b;--cyan:#29dddc;--pink:#eb467e;--yellow:#e9c76a;--r:13px;--shadow:0 12px 40px #0005;--mono:ui-monospace,"SFMono-Regular",Consolas,"Liberation Mono",monospace;--display:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--txt);font:14px/1.55 var(--display);min-width:320px;overflow-x:hidden}button,input{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}::selection{background:#a64b91;color:white}.sr-only{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip-link{position:fixed;z-index:999;left:12px;top:-100px;background:var(--green);color:#04130e;padding:10px 18px;border-radius:8px}.skip-link:focus{top:10px}.ambient-grid{pointer-events:none;position:fixed;inset:0;z-index:-3;opacity:.42;background-image:linear-gradient(#1a31402b 1px,transparent 1px),linear-gradient(90deg,#1a31402b 1px,transparent 1px);background-size:37px 37px;mask-image:linear-gradient(90deg,black,transparent 80%)}.ambient-glow{pointer-events:none;position:fixed;inset:0;z-index:-2;background:radial-gradient(ellipse at 75% 10%,#5930632e,transparent 43%),radial-gradient(ellipse at 10% 80%,#057a7840,transparent 40%)}
.app-shell{max-width:1680px;margin:auto;min-height:100vh}.topbar{height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 29px;background:#09101df2;border-bottom:1px solid #28435a;position:sticky;top:0;z-index:70;backdrop-filter:blur(18px)}.topbar:after{content:"";height:2px;position:absolute;bottom:-1px;left:0;right:0;background:linear-gradient(90deg,var(--pink),var(--cyan) 45%,transparent 90%);opacity:.75}.top-brand,.top-meta{display:flex;align-items:center;gap:19px}.brand{font:900 19px/1 var(--mono);letter-spacing:-.9px;display:flex;gap:10px;align-items:center;white-space:nowrap}.brand img{filter:drop-shadow(0 0 10px #e6417f77)}.brand-pink{color:var(--pink)}.brand-green{color:var(--green)}.top-meta{font:11px/1 var(--mono);color:#98abc1;gap:16px}.top-meta>span:not(:last-child){border-right:1px solid #254152;padding-right:16px}.meta-icon{color:var(--cyan)}.header-github{display:grid;place-items:center;width:27px;height:27px;border:1px solid #35536c;border-radius:6px;color:var(--cyan);font-size:19px}.status-dot,.connection-pill{display:flex;gap:7px;align-items:center;color:var(--green);font:700 10px var(--mono)}.status-dot{border:1px solid #295747;background:#0f2522;border-radius:5px;padding:5px 9px}.status-dot span,.pulse-dot{height:7px;width:7px;background:var(--green);border-radius:50%;display:inline-block;box-shadow:0 0 9px #95f57b;flex-shrink:0}.pulse-dot{animation:blink 2.8s ease-in-out infinite}.icon-button{background:none;border:0;color:var(--txt);font-size:22px}.menu-trigger{display:none}
.workspace{display:grid;grid-template-columns:258px minmax(0,1fr);min-height:calc(100vh - 68px)}.sidebar{background:linear-gradient(180deg,#0c1625ef,#08121eef);border-right:1px solid #254157;padding:22px 14px 100px;display:flex;flex-direction:column;gap:17px;position:sticky;top:68px;align-self:start;height:calc(100vh - 68px);overflow-y:auto;scrollbar-width:thin}.sidebar-section-label,.section-kicker{font:700 10px/1.5 var(--mono);color:var(--cyan);letter-spacing:1.6px}.sidebar-section-label{padding:5px 12px;color:#6c849a}.side-nav{display:flex;flex-direction:column;gap:4px}.nav-link{display:flex;align-items:center;gap:11px;color:#c5d5e5;font:600 12px var(--mono);padding:11px 12px;border-radius:8px;border:1px solid transparent;transition:background .2s,border-color .2s}.nav-link:hover{background:#183344;border-color:#204458}.nav-link.is-active{color:var(--green);background:linear-gradient(90deg,#12372c,#0b2230);border-color:#368c64;box-shadow:inset 3px 0 var(--green),0 0 16px #249e7525}.nav-glyph{font-size:18px;min-width:22px;text-align:center;color:var(--cyan)}.nav-link.is-active .nav-glyph{color:var(--green)}.nav-key{margin-left:auto;color:#526e81;font-size:10px}.sidebar-rule{height:1px;background:#243c50;margin:2px 7px}.operator{display:flex;align-items:center;gap:10px;padding:0 7px}.operator-avatar{width:63px;height:63px;border:1px solid #37999a;border-radius:7px;object-fit:cover}.operator strong{display:block;letter-spacing:1.3px;font:700 15px var(--mono)}.operator-role{display:block;color:#a9c4d7;font:10px var(--mono);margin-top:3px}.operator-online{display:block;font:9px var(--mono);color:var(--green);margin-top:7px}.operator-online .pulse-dot{width:5px;height:5px}.skill-list{padding:2px 12px;display:grid;gap:16px}.skill-list>div{display:flex;flex-direction:column;gap:7px;font:700 10px var(--mono);letter-spacing:.5px;color:#aec1ce}.skill-chips{display:flex;gap:4px}
.skill-chips i{display:block;height:7px;flex:1;background:currentColor;box-shadow:none;opacity:0.15;border-radius:1px;color:#93f57a}
.skill-chips.cyan i{color:var(--cyan)}
.skill-chips.pink i{color:var(--pink)}
.skill-chips[data-target="7"] i:nth-child(1),.skill-chips[data-target="6"] i:nth-child(1){animation:segmentLight 0.4s ease-out 0s forwards}
.skill-chips[data-target="7"] i:nth-child(2),.skill-chips[data-target="6"] i:nth-child(2){animation:segmentLight 0.4s ease-out 1s forwards}
.skill-chips[data-target="7"] i:nth-child(3),.skill-chips[data-target="6"] i:nth-child(3){animation:segmentLight 0.4s ease-out 2s forwards}
.skill-chips[data-target="7"] i:nth-child(4),.skill-chips[data-target="6"] i:nth-child(4){animation:segmentLight 0.4s ease-out 3s forwards}
.skill-chips[data-target="7"] i:nth-child(5),.skill-chips[data-target="6"] i:nth-child(5){animation:segmentLight 0.4s ease-out 4s forwards}
.skill-chips[data-target="7"] i:nth-child(6),.skill-chips[data-target="6"] i:nth-child(6){animation:segmentLight 0.4s ease-out 5s forwards}
.skill-chips[data-target="7"] i:nth-child(7){animation:segmentLight 0.4s ease-out 6s forwards}
/* Full eight-stage CYBERSECURITY indicator; existing 6/7-stage bars unchanged. */
.skill-chips[data-target="8"] i:nth-child(1){animation:segmentLight 0.4s ease-out 0s forwards}
.skill-chips[data-target="8"] i:nth-child(2){animation:segmentLight 0.4s ease-out 1s forwards}
.skill-chips[data-target="8"] i:nth-child(3){animation:segmentLight 0.4s ease-out 2s forwards}
.skill-chips[data-target="8"] i:nth-child(4){animation:segmentLight 0.4s ease-out 3s forwards}
.skill-chips[data-target="8"] i:nth-child(5){animation:segmentLight 0.4s ease-out 4s forwards}
.skill-chips[data-target="8"] i:nth-child(6){animation:segmentLight 0.4s ease-out 5s forwards}
.skill-chips[data-target="8"] i:nth-child(7){animation:segmentLight 0.4s ease-out 6s forwards}
.skill-chips[data-target="8"] i:nth-child(8){animation:segmentLight 0.4s ease-out 7s forwards}
@keyframes segmentLight{from{opacity:0.15;box-shadow:none}to{opacity:0.95;box-shadow:0 0 9px currentColor}}
.skill-note{font-size:10px;color:#6f8698;margin:0 10px}.sidebar-footer{margin-top:auto;display:flex;flex-direction:column;gap:11px;font:10px var(--mono);color:#819aaf;padding:13px 9px}.tiny-square{display:inline-block;background:var(--green);width:7px;height:7px;box-shadow:0 0 7px #95f57b;vertical-align:middle}.switch-mode{border:1px solid #355167;color:#d8e8f4;background:#132536;padding:11px 9px;font:700 10px var(--mono);text-align:left;display:flex;gap:9px;justify-content:space-between;align-items:center;border-radius:7px}.switch-key{color:var(--cyan);font-size:15px}.switch-mode:hover{border-color:var(--cyan)}
.main{padding:23px 24px 125px;min-width:0;max-width:1400px;width:100%;margin:auto}.panel{background:linear-gradient(160deg,#0f1a2bf5,#0b1725ef);border:1px solid #2b4b61;border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}.hero{min-height:346px;position:relative;border-color:#386d79;background:linear-gradient(110deg,#071322,#0e1832 63%,#21132e);isolation:isolate}.hero-art{position:absolute;inset:0;z-index:-1;overflow:hidden;background:radial-gradient(ellipse at 71% 57%,#c1277f32,transparent 36%),linear-gradient(180deg,transparent 30%,#080d17ac 100%)}.hero-art:before{content:"";position:absolute;right:0;top:0;width:70%;height:100%;background:repeating-linear-gradient(0deg,transparent 0 5px,#120d2f88 6px 7px);opacity:.36}/* Continuous local-clock trajectory. Idle movement keeps the arcade sky visibly alive. */
.sun{position:absolute;width:310px;height:310px;border-radius:50%;right:var(--sun-right,18%);top:var(--sun-top,27px);background:var(--sun-bg,linear-gradient(180deg,#f94a9f,#a52b8d 52%,#411f79 92%));box-shadow:var(--sun-glow,0 0 80px #c2218d66);opacity:var(--sun-opacity,1);mask-image:repeating-linear-gradient(180deg,black 0 16px,transparent 16px 19px);transition:top 2.5s cubic-bezier(.2,.8,.2,1),right 2.5s cubic-bezier(.2,.8,.2,1),box-shadow 2s ease,opacity 1.6s ease;animation:cyberSolarHover 9s ease-in-out infinite alternate;will-change:transform}
.moon{position:absolute;width:192px;height:192px;right:var(--moon-right,20%);top:var(--moon-top,35px);overflow:visible;opacity:var(--moon-opacity,0);filter:drop-shadow(0 0 19px #59effc91);transition:top 2.5s cubic-bezier(.2,.8,.2,1),right 2.5s cubic-bezier(.2,.8,.2,1),opacity 1.6s ease;animation:cyberMoonHover 11s ease-in-out infinite alternate;pointer-events:none;will-change:transform}
.hero-art[data-celestial="moon"] .sun{opacity:0}
.hero-art[data-celestial="sun"] .moon{opacity:0}
@keyframes cyberSolarHover{from{transform:translate3d(0,3px,0) scale(.985)}to{transform:translate3d(0,-8px,0) scale(1.025)}}
@keyframes cyberMoonHover{from{transform:translate3d(0,5px,0) rotate(-5deg)}to{transform:translate3d(0,-7px,0) rotate(4deg)}}.skyline{position:absolute;bottom:0;right:0;width:68%;height:50%;background:linear-gradient(180deg,transparent 12%,#071021 13%);clip-path:polygon(0 72%,5% 72%,5% 54%,8% 54%,8% 65%,14% 65%,14% 37%,18% 37%,18% 48%,24% 48%,24% 70%,30% 70%,30% 28%,34% 28%,34% 60%,39% 60%,39% 43%,44% 43%,44% 57%,48% 57%,48% 22%,53% 22%,53% 54%,58% 54%,58% 35%,63% 35%,63% 59%,68% 59%,68% 16%,74% 16%,74% 40%,80% 40%,80% 68%,85% 68%,85% 30%,89% 30%,89% 48%,93% 48%,93% 24%,97% 24%,97% 65%,100% 65%,100% 100%,0 100%)}.skyline-front{width:64%;height:49%;background:#070f1d;opacity:.95;transform:translateY(35px) scaleX(1.04);filter:drop-shadow(0 0 10px #b92c9d)}.skyline-back{background:#28153d;opacity:.7;transform:translateY(-23px) scaleX(1.13)}.hero-scan{position:absolute;inset:0;background:repeating-linear-gradient(0deg,#0000 0 3px,#0005 4px 5px);opacity:.24;pointer-events:none}.hero-content{position:relative;padding:37px 42px;max-width:760px}.eyebrow{font:700 10px var(--mono);color:#9bc2c8;letter-spacing:1px}.eyebrow .tiny-square{margin-right:8px}.hero h1{margin:19px 0 15px;font:950 clamp(40px,4.8vw,72px)/.99 var(--display);letter-spacing:-3.1px;text-shadow:0 2px 16px #000}.dot{color:var(--pink)}.hero h1 .dot{font-size:.55em}.type-caret{font:700 .73em var(--mono);color:var(--green);animation:blink 1s steps(1) infinite}.hero-subtitle{font:500 13px/1.8 var(--mono);color:#d1e3f3;margin:0}.hero-subtitle span{color:var(--cyan);margin:0 5px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}.primary-button,.secondary-button,.outline-button{display:inline-flex;align-items:center;justify-content:center;gap:12px;border-radius:6px;padding:12px 17px;font:800 11px/1.5 var(--mono);letter-spacing:.4px;transition:transform .18s,border-color .18s,background .18s;white-space:nowrap}.primary-button{border:1px solid #9cf59c;color:#06140e;background:var(--green);box-shadow:0 0 23px #8bf3774d}.primary-button:hover,.secondary-button:hover,.outline-button:hover{transform:translateY(-2px)}.secondary-button{border:1px solid #477080;background:#0b1d2caa;color:#d7f4fa}.secondary-button:hover{border-color:var(--cyan);background:#153146}.hero-corner{position:absolute;right:20px;top:18px;font:9px/1.6 var(--mono);text-align:right;letter-spacing:1px;color:#98afc5}.hero-corner span{color:var(--pink)}
.overview-heading{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:29px 0 13px}.minor-label{font:10px var(--mono);color:#708ca2}.dashboard-grid{display:grid;grid-template-columns:1.6fr .85fr 1fr;gap:12px;align-items:stretch}.panel-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #294458;min-height:46px;padding:0 14px;background:#10213780;gap:10px}.panel-head h2{margin:0;font:800 12px var(--mono);letter-spacing:.45px;white-space:nowrap}.panel-icon{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:5px;background:#1a403a;color:var(--green);margin-right:7px;font:800 15px var(--mono)}.panel-icon.cyan{background:#153b46;color:var(--cyan)}.panel-icon.pink{background:#43203a;color:var(--pink)}.panel-controls{display:flex;gap:6px}.panel-controls b{display:block;width:8px;height:8px;border:1px solid #708c9e;border-radius:2px}.panel-controls b:last-child{background:#80556c}.tiny-badge{border:1px solid #2c6d62;border-radius:4px;color:var(--green);font:800 9px/1.3 var(--mono);padding:4px 6px;white-space:nowrap}.tiny-badge.amber{color:#d7bd70;border-color:#6c5836}.terminal-panel{display:flex;flex-direction:column;min-height:288px}.terminal-output{padding:18px 19px 5px;flex:1;max-height:250px;min-height:170px;overflow-y:auto;scrollbar-color:#427360 #0d1d27;scrollbar-width:thin;font:12px/1.75 var(--mono);overflow-wrap:anywhere}.terminal-entry{color:#cfe2e8}.prompt-color{color:var(--green)}.terminal-result{white-space:pre-wrap;color:#b2c8d1;padding-bottom:9px}.terminal-note{color:#648d92;font-size:11px}.terminal-note strong{color:var(--green)}.terminal-input-row{display:flex;gap:7px;align-items:center;padding:9px 14px 14px;font:12px var(--mono)}.terminal-input-row label{color:var(--green);white-space:nowrap}.terminal-input-row input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:white;font:12px var(--mono);caret-color:var(--green)}.terminal-input-row input:focus-visible{outline:0}.terminal-input-row input::placeholder{color:#4e7774}.terminal-input-row button{color:var(--green);border:1px solid #295845;background:#11251f;border-radius:4px;height:27px;width:27px}
.radar-panel{display:flex;flex-direction:column}.radar-space{display:grid;place-items:center;flex:1;min-height:184px;padding:7px;position:relative}.radar-circle{position:relative;border:1px solid #22af9c;border-radius:50%;width:180px;max-width:92%;aspect-ratio:1;background:radial-gradient(circle,#0d7c6033 1px,transparent 2px),repeating-radial-gradient(circle,transparent 0 24px,#2cae9a73 25px 26px),#08232499;box-shadow:0 0 24px #0fc6b329;overflow:hidden}.radar-sweep{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,transparent 0deg,#66fbb900 220deg,#66fbb922 270deg,#5fffc2bb 358deg,#ffffff 360deg,transparent 360deg);animation:spin 6s linear infinite;pointer-events:none;z-index:2}.radar-ring{position:absolute;border-radius:50%;border:1px solid #2aab9b66;inset:25%;pointer-events:none}.ring-two{inset:37%}.radar-axis{position:absolute;background:#27aa9a7d;pointer-events:none}.radar-axis.horizontal{height:1px;width:100%;top:50%}.radar-axis.vertical{height:100%;width:1px;left:50%}.radar-axis-label{position:absolute;font:700 7px var(--mono);color:#47998e;letter-spacing:0.5px;pointer-events:none}.axis-top{top:4px;left:50%;transform:translateX(-50%)}.axis-right{right:4px;top:50%;transform:translateY(-50%)}.radar-blips-container{position:absolute;inset:0;z-index:3}.cve-blip{position:absolute;width:9px;height:9px;border-radius:50%;transform:translate(-50%,-50%);cursor:pointer;border:1px solid #000c;animation:radarSweepEcho 6s linear infinite;transition:transform 0.15s ease,box-shadow 0.15s ease}.cve-blip:hover,.cve-blip:focus-visible{transform:translate(-50%,-50%) scale(1.8)!important;z-index:10;box-shadow:0 0 0 3px #fff,0 0 20px #fff!important;animation:none!important}.cve-blip[data-status="created"]{background:var(--green);--echo-color:var(--green)}.cve-blip[data-status="updated"]{background:var(--pink);--echo-color:var(--pink)}.cve-blip[data-kev="true"]{background:#ff2b40;--echo-color:#ff2b40}@keyframes radarSweepEcho{0%{opacity:0.3;transform:translate(-50%,-50%) scale(0.9);box-shadow:0 0 4px var(--echo-color)}2%{opacity:1;transform:translate(-50%,-50%) scale(1.6);box-shadow:0 0 0 4px var(--echo-color),0 0 18px var(--echo-color)}8%{opacity:0.9;transform:translate(-50%,-50%) scale(1.2);box-shadow:0 0 10px var(--echo-color)}25%{opacity:0.5;transform:translate(-50%,-50%) scale(1.0);box-shadow:0 0 5px var(--echo-color)}100%{opacity:0.3;transform:translate(-50%,-50%) scale(0.9);box-shadow:0 0 3px var(--echo-color)}}.radar-tooltip{position:absolute;z-index:90;background:#06121fe6;border:1px solid var(--cyan);border-radius:5px;padding:4px 8px;font:700 9px var(--mono);color:#dcf4ff;pointer-events:none;box-shadow:0 4px 15px #000c;white-space:nowrap;backdrop-filter:blur(8px)}.radar-core{position:absolute;left:calc(50% - 3px);top:calc(50% - 3px);width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 15px var(--green);z-index:4;pointer-events:none}.radar-foot{padding:0 13px 10px;display:flex;justify-content:space-between;gap:8px;align-items:center;font:9px var(--mono);color:#7ba39f}.radar-foot .pulse-dot{height:5px;width:5px}.inline-button{background:none;color:var(--cyan);border:0;padding:4px 0;font:800 10px var(--mono);white-space:nowrap}.inline-button:hover{text-decoration:underline}
.connection-panel{display:flex;flex-direction:column}.connection-list{display:grid;gap:0;padding:8px 14px 0;margin:0}.connection-list>div{display:flex;justify-content:space-between;align-items:baseline;gap:10px;border-bottom:1px solid #1e3749;padding:10px 0}.connection-list dt{font:700 10px var(--mono);color:#8caabe}.connection-list dd{margin:0;text-align:right;font:600 11px var(--mono);color:#e4f4f9;overflow-wrap:anywhere}.micro-copy{font-size:10px;line-height:1.5;margin:13px 14px 11px;color:#7991a5}.outline-button{border:1px solid #479780;color:var(--green);background:#112c2a;box-shadow:inset 0 0 10px #3ca78314}.full-width{margin:0 14px 14px;width:calc(100% - 28px)}.connection-message{padding:0 14px 10px;color:var(--cyan);font:10px var(--mono)}.connection-message:empty{display:none}
.projects-section{margin-top:46px}.section-title-row{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:20px}.section-title-row h2,.about-section h2{font-size:clamp(24px,2.6vw,36px);line-height:1.15;letter-spacing:-1.2px;margin:6px 0 5px;font-weight:850}.section-title-row p,.about-section p{font-size:13px;color:#98aec2;margin:0}.accent-point{color:var(--pink)}.text-link{font:800 10px var(--mono);color:var(--cyan);white-space:nowrap}.text-link:hover{text-decoration:underline}.project-summary{display:flex;gap:0;align-items:center;padding:14px 20px;flex-wrap:wrap;border-color:#274b52}.metric{display:flex;align-items:center;gap:11px;padding:4px 30px 4px 0;margin-right:28px;border-right:1px solid #29445b}.metric-icon{font:800 27px var(--mono);color:var(--green)}.metric strong{display:block;font:800 22px/1.3 var(--mono)}.metric small{display:block;font:700 9px var(--mono);color:#819bb0;letter-spacing:.6px}.data-status{font:10px var(--mono);margin-left:auto;color:#71909f}.project-controls{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:20px 0 15px}.filter-chips{display:flex;flex-wrap:wrap;gap:7px}.filter-chip{background:#111e2c;border:1px solid #29485b;border-radius:5px;padding:8px 10px;color:#acc0d1;font:700 10px var(--mono)}.filter-chip:hover,.filter-chip.active{background:#123b35;border-color:#57a884;color:var(--green)}.project-search{display:flex;align-items:center;border:1px solid #29485b;background:#101c2c;border-radius:6px;color:var(--cyan);padding:5px 11px;min-width:210px;gap:8px}.project-search input{background:transparent;color:white;border:0;outline:0;font-size:12px;width:100%;min-width:70px}.project-search input:focus-visible{outline:0}.project-search input::placeholder{color:#677f91}.projects-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.project-card{padding:19px;display:flex;flex-direction:column;gap:12px;min-height:225px;position:relative;border:1px solid #2c4d62;border-radius:11px;background:linear-gradient(145deg,#111e31,#0d1829);transition:border-color .2s,transform .2s,box-shadow .2s}.project-card:hover{border-color:#31b6b1;transform:translateY(-3px);box-shadow:0 15px 35px #0007}.project-card a:focus-visible{border-radius:5px}.project-card:before{content:"";position:absolute;top:0;left:18px;right:18px;height:2px;background:linear-gradient(90deg,transparent,var(--pink),transparent);opacity:.7}.project-card[data-kind="security"]:before{background:linear-gradient(90deg,transparent,var(--green),transparent)}.project-card[data-kind="ai"]:before{background:linear-gradient(90deg,transparent,var(--cyan),transparent)}.project-top{display:flex;align-items:start;justify-content:space-between;gap:10px}.project-symbol{display:grid;place-items:center;border:1px solid #2d6b74;background:#16353e;color:var(--cyan);border-radius:7px;width:43px;height:43px;font:800 20px var(--mono)}.project-badge{color:#718fa2;font:700 9px var(--mono);letter-spacing:.5px}.project-name{font:800 15px/1.35 var(--mono);margin:0;overflow-wrap:anywhere}.project-name a:hover{color:var(--green)}.project-description{color:#9bb0c3;font-size:12px;margin:0;line-height:1.6;flex:1}.project-tags{display:flex;flex-wrap:wrap;gap:5px}.project-tags span{font:700 9px var(--mono);border:1px solid #2c5460;color:#8fbdc8;border-radius:12px;padding:3px 7px}.project-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #20384c;padding-top:10px;font:10px var(--mono);color:#8da6ba}.project-bottom a{color:var(--green);font-weight:700}.empty-projects{padding:35px;color:var(--muted);border:1px dashed #2c4d62;border-radius:9px;grid-column:1/-1}.view-more{text-align:center;margin:19px 0 0}.view-more button{min-width:245px}
.contributions-section{margin-top:46px}.contributions-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-top:18px}.contribution-card{padding:18px;display:flex;flex-direction:column;gap:12px;position:relative;border:1px solid #2b5066;border-radius:11px;background:linear-gradient(145deg,#0d1a2c,#0a1523);transition:border-color .2s,transform .2s,box-shadow .2s}.contribution-card:hover{border-color:#38b8b0;transform:translateY(-2px);box-shadow:0 12px 30px #0006}.contribution-card:before{content:"";position:absolute;top:0;left:18px;right:18px;height:2px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);opacity:.7}.contribution-header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.contribution-title{font:800 14px/1.3 var(--mono);margin:0;overflow-wrap:anywhere}.contribution-title a:hover{color:var(--cyan)}.contribution-stats{display:flex;gap:10px;margin-top:6px}.contribution-pill{font:700 10px var(--mono);background:#122938;border:1px solid #28556b;border-radius:4px;padding:3px 7px;color:#cde0ee}.contribution-pill.commits{background:#15342c;border-color:#33775f;color:var(--green)}.contribution-actions{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #1c3547;padding-top:10px;margin-top:auto}.pr-modal-list{display:grid;gap:8px;max-height:400px;overflow-y:auto;padding-right:4px}.pr-modal-item{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:8px 10px;background:#0d1c2b;border:1px solid #244154;border-radius:6px;font:11px var(--mono)}.pr-modal-item a{color:#9ad7f5}.pr-modal-item a:hover{color:var(--green)}
.hf-section{margin-top:46px}.hf-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-top:18px}.hf-card{padding:18px;display:flex;flex-direction:column;gap:12px;position:relative;border:1px solid #3c4927;border-radius:11px;background:linear-gradient(145deg,#131a19,#0c1314);transition:border-color .2s,transform .2s,box-shadow .2s}.hf-card:hover{border-color:var(--yellow);transform:translateY(-2px);box-shadow:0 12px 30px #0007}.hf-card:before{content:"";position:absolute;top:0;left:18px;right:18px;height:2px;background:linear-gradient(90deg,transparent,var(--yellow),transparent);opacity:.7}.hf-header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.hf-symbol{font:800 24px var(--mono);color:var(--yellow);width:38px;height:38px;display:grid;place-items:center;background:#262312;border:1px solid #6b5c27;border-radius:7px}.hf-title{font:800 14px/1.35 var(--mono);margin:0;overflow-wrap:anywhere}.hf-title a:hover{color:var(--yellow)}.hf-badge{color:var(--yellow);border:1px solid #574b21;background:#242010;border-radius:4px;padding:3px 7px;font:700 9px var(--mono);letter-spacing:0.5px;white-space:nowrap}.hf-description{font-size:12px;color:#9cb0be;margin:0;line-height:1.6;flex:1}.hf-tags{display:flex;flex-wrap:wrap;gap:5px}.hf-tags span{font:700 9px var(--mono);border:1px solid #3d4a3c;color:#c8dfba;border-radius:12px;padding:3px 7px}.hf-actions{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #20352b;padding-top:10px;margin-top:auto}.hf-actions a{font:800 10px var(--mono);color:var(--yellow)}.hf-actions a:hover{text-decoration:underline}
.lower-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:13px;margin-top:38px}.intel-panel,.skills-panel{display:flex;flex-direction:column;min-height:390px}.panel-description{font-size:12px;color:#97afc1;margin:13px 15px}.article-feed{padding:0 14px;display:grid;gap:7px;flex:1}.article-item{display:flex;align-items:start;gap:12px;padding:12px;border:1px solid #254052;background:#0b1a29;border-radius:7px}.article-item:hover{border-color:#4b8b9b}.article-alert{color:var(--pink);font:800 20px var(--mono)}.article-item-main{min-width:0;flex:1}.article-item strong{font-size:12px;line-height:1.45;display:block}.article-item strong a:hover{color:var(--cyan)}.article-item small{font:10px var(--mono);color:#849db0;display:block;margin-top:5px}.loading-copy{font:11px var(--mono);color:#7c9aa9}.panel-foot{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;gap:12px;border-top:1px solid #284458;margin-top:13px}.kev-feed{border-top:1px solid #284458;padding:15px;max-height:300px;overflow-y:auto}.kev-feed[hidden]{display:none}.kev-feed h3{margin:0 0 10px;font:700 11px var(--mono);color:var(--green)}.kev-item{padding:9px 0;border-bottom:1px solid #24384a}.kev-item a{font:700 11px var(--mono);color:var(--cyan)}.kev-item p{margin:3px 0;color:#9cabb9;font-size:11px}.lab-blueprints-grid{padding:0 15px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;flex:1}
.blueprint-card{display:flex;flex-direction:column;padding:14px 15px;background:#102335;border:1px solid #294c5b;border-radius:8px;color:var(--txt);text-decoration:none;transition:border-color .2s,background .2s,transform .15s}
.blueprint-card:hover{border-color:var(--cyan);background:#132d42;transform:translateY(-2px)}
.blueprint-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.blueprint-kicker{font:700 9px/1.3 var(--mono);letter-spacing:1px}
.blueprint-arrow{color:var(--cyan);font-size:13px;transition:transform .2s}
.blueprint-card:hover .blueprint-arrow{transform:translate(2px,-2px);color:var(--green)}
.blueprint-title{font:800 13px/1.3 var(--mono);color:#fff;margin-bottom:6px}
.blueprint-summary{font-size:11px;line-height:1.45;color:#9bb2c5;margin:0 0 10px;flex:1}
.blueprint-tags{display:flex;gap:5px;flex-wrap:wrap}
.blueprint-tags span{font:700 9px var(--mono);padding:2px 7px;background:#091624;border:1px solid #23455a;border-radius:4px;color:#85a8c2}
.lab-foot-actions{padding:14px 15px;display:flex;gap:10px;border-top:1px solid #1c3649;margin-top:12px;flex-wrap:wrap}
.lab-action-btn,.lab-action-link{display:inline-flex;align-items:center;gap:7px;font:700 11px var(--mono);padding:8px 13px;border-radius:6px;transition:all .2s;text-decoration:none}
.lab-action-btn{background:#12372c;border:1px solid #2d6b53;color:var(--green);cursor:pointer}
.lab-action-btn:hover{background:#184a3b;border-color:var(--green)}
.lab-action-link{background:#102235;border:1px solid #274b62;color:var(--cyan)}
.lab-action-link:hover{background:#16324e;border-color:var(--cyan)}
.action-icon{font-size:13px}
.cyan-text{color:var(--cyan)!important}.pink-text{color:var(--pink)!important}.green-text{color:var(--green)!important}.yellow-text{color:var(--yellow)!important}
.about-section{margin-top:37px;display:grid;grid-template-columns:1fr auto;gap:26px;align-items:center;padding:29px 34px}.about-section p{max-width:800px;line-height:1.8;margin-top:11px}.about-links{display:flex;gap:9px;margin-top:21px;flex-wrap:wrap}.about-links .secondary-button{font-size:10px}.about-ascii{color:var(--green);font:12px/1.5 var(--mono);background:#0c2723;border:1px solid #2f6453;border-radius:10px;padding:0 18px;box-shadow:0 0 40px #244d3a27}.site-footer{color:#7d94a6;display:flex;justify-content:space-between;gap:15px;align-items:center;font:9px var(--mono);flex-wrap:wrap;margin-top:32px}.site-footer>div{display:flex;gap:13px}.site-footer a:hover{color:var(--green)}.footer-button{border:0;background:none;color:var(--cyan);padding:0;font:9px var(--mono)}
.dock{position:fixed;z-index:50;left:calc(50% + 126px);bottom:13px;transform:translateX(-50%);display:flex;align-items:stretch;gap:4px;padding:8px 12px;border:1px solid #497488;background:#0b182bf2;box-shadow:0 5px 45px #000a,0 0 25px #1cc9c327;border-radius:13px;backdrop-filter:blur(20px)}.dock a,.dock button{background:transparent;border:1px solid transparent;color:#abc5d3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;width:65px;height:53px;border-radius:8px}.dock a:hover,.dock button:hover,.dock a:focus-visible,.dock button:focus-visible{border-color:#355d68;background:#183442;color:white}.dock a span,.dock button span{font:800 24px/1.2 var(--mono)}.dock img.dock-arcade-icon{width:22px;height:22px;margin:2px 0 1px;filter:drop-shadow(0 0 6px var(--pink))}.dock small{font:10px var(--mono)}
.cyber-dialog,.palette-dialog{border:1px solid #448d8c;color:var(--txt);background:#0d1929;border-radius:12px;box-shadow:0 25px 80px #000b,0 0 35px #166f6766;max-width:min(600px,calc(100vw - 28px));width:580px;max-height:85vh;padding:0;overflow:auto}.cyber-dialog::backdrop,.palette-dialog::backdrop{background:#040911d9;backdrop-filter:blur(4px)}.dialog-head{display:flex;justify-content:space-between;align-items:start;padding:20px 22px 15px;border-bottom:1px solid #2d4a5d}.dialog-head h2{font:850 20px var(--mono);letter-spacing:-.7px;margin:4px 0}.dialog-close{background:transparent;border:1px solid #31546a;color:#cadfea;padding:5px 9px;border-radius:5px;font:700 13px var(--mono)}.dialog-body{padding:19px 23px 24px;color:#b9cad8}.dialog-body p{margin:7px 0 15px}.dialog-body h3{color:var(--green);font:800 13px var(--mono);margin:18px 0 9px}.dialog-body pre{white-space:pre-wrap;background:#081421;border:1px solid #294b5a;border-radius:7px;color:var(--green);font:12px/1.7 var(--mono);padding:15px}.dialog-body a{color:var(--cyan);text-decoration:underline}.dialog-body .muted{color:#7e9bad}.dialog-body .quiz-progress{font:700 10px var(--mono);color:var(--cyan);letter-spacing:1px}.quiz-answer{display:block;width:100%;background:#10283a;border:1px solid #315767;color:#d6eaf6;padding:12px;text-align:left;border-radius:7px;margin-top:9px}.quiz-answer:hover{border-color:var(--green)}.quiz-feedback{padding:12px;background:#173831;border:1px solid #3a8061;border-radius:7px;color:#acf2b9;margin:12px 0}.dialog-body .next-quiz{background:var(--green);color:#071e15;border:0;border-radius:6px;padding:11px 14px;font:800 12px var(--mono)}
.palette-dialog{max-width:580px;min-height:220px;overflow:hidden}.palette-header{display:flex;align-items:center;gap:13px;padding:13px 15px;border-bottom:1px solid #315168}.palette-header>span{font-size:25px;color:var(--cyan)}.palette-header input{width:100%;min-width:0;background:none;border:0;outline:0;color:white;font-size:14px}.palette-header input:focus-visible{outline:0}.palette-header input::placeholder{color:#8199aa}.palette-options{padding:8px;max-height:380px;overflow:auto}.palette-option{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;color:#d2e4ed;background:transparent;border:1px solid transparent;text-align:left;padding:10px 13px;border-radius:7px;font:12px var(--mono)}.palette-option:hover,.palette-option.selected{background:#183838;border-color:#387c73}.palette-option small{color:#7899a9}.palette-foot{border-top:1px solid #28465a;padding:10px 14px;font:9px var(--mono);color:#809aae}
body[data-mode="professional"] .ambient-grid,body[data-mode="professional"] .sun,body[data-mode="professional"] .moon,body[data-mode="professional"] .skyline,body[data-mode="professional"] .hero-scan,body[data-mode="professional"] .hero-corner,body[data-mode="professional"] .type-caret{display:none}body[data-mode="professional"] .hero{background:linear-gradient(110deg,#0d2531,#102439)}body[data-mode="professional"] .hero h1{letter-spacing:-2px}body[data-mode="professional"] .pulse-dot{animation:none}body[data-mode="professional"] .radar-sweep{animation:none;opacity:.3}
body.reduce-motion *,body.reduce-motion *::before,body.reduce-motion *::after{animation:none!important;scroll-behavior:auto!important;transition:none!important}body.reduce-motion{scroll-behavior:auto}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}
@media(max-width:1340px){.dashboard-grid{grid-template-columns:1.3fr 1fr}.connection-panel{grid-column:1/-1}.connection-list{grid-template-columns:1fr 1fr;column-gap:24px}.connection-panel .full-width{max-width:300px}.projects-grid,.contributions-grid,.hf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.project-summary .metric{padding-right:14px;margin-right:14px}}
@media(max-width:980px){.workspace{grid-template-columns:1fr}.menu-trigger{display:inline-grid}.sidebar{position:fixed;top:68px;bottom:0;left:0;width:270px;height:auto;z-index:60;transform:translateX(-105%);transition:transform .2s;box-shadow:10px 0 55px #0008}.sidebar.open{transform:translateX(0)}.main{padding:20px 20px 112px}.dock{left:50%}.top-meta .hide-small{display:none}.brand{font-size:17px}.lower-grid{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.topbar{padding:0 12px;height:60px}.top-brand{gap:9px}.top-meta{gap:6px}.top-meta .connection-pill{display:none}.brand{font-size:13px;letter-spacing:-.6px;gap:5px}.brand img{width:24px;height:24px}.status-dot{font-size:8px;padding:4px 6px}.top-meta time{font-size:9px}.top-meta .header-github{display:none}.sidebar{top:60px}.main{padding:15px 12px 104px}.hero{min-height:305px}.hero-content{padding:28px 24px}.hero h1{font-size:clamp(36px,8.4vw,58px);letter-spacing:-2px}.hero-subtitle{font-size:11px}.hero-corner{display:none}.sun{width:240px;height:240px;right:calc(var(--sun-right, 18%) - 20%);top:var(--sun-top, 40px);opacity:.65}.skyline{width:92%}.dashboard-grid{grid-template-columns:1fr}.connection-panel{grid-column:auto}.connection-list{grid-template-columns:1fr}.radar-space{min-height:212px}.overview-heading .minor-label{display:none}.section-title-row{align-items:start;flex-direction:column}.project-summary{padding:10px 15px}.metric{width:calc(50% - 14px);margin:0!important;padding:9px!important;border:0!important}.data-status{width:100%;margin:8px 0 0}.project-controls{align-items:stretch;flex-direction:column}.project-search{width:100%}.projects-grid,.contributions-grid,.hf-grid,.lower-grid,.lab-blueprints-grid{grid-template-columns:1fr}.about-section{grid-template-columns:1fr;padding:23px}.about-ascii{display:none}.site-footer{justify-content:center;text-align:center}.dock{bottom:5px;width:calc(100vw - 18px);justify-content:space-around;padding:6px 5px}.dock a,.dock button{width:calc(100% / 7);height:51px}.dock a span,.dock button span{font-size:20px}.dock small{font-size:8px}.cyber-dialog{max-height:88vh}}
@media(max-width:420px){.brand{font-size:12px}.status-dot{display:none}.hero h1{font-size:38px}.primary-button,.secondary-button{font-size:10px;padding:11px}.hero-actions{gap:8px}.terminal-input-row label{font-size:10px}.terminal-output{font-size:11px}.filter-chip{padding:7px;font-size:9px}.panel-head h2{font-size:11px}}
/* Respect OS accessibility settings by default; an explicit footer opt-in can restore motion. */
@media(prefers-reduced-motion:reduce){body:not(.motion-enabled) *,body:not(.motion-enabled) *::before,body:not(.motion-enabled) *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}


.radar-modal-hud{display:flex;flex-direction:column;gap:12px;margin-bottom:14px}
.radar-axis-note{font:600 11px var(--mono);color:#8ca5ba;margin:0;letter-spacing:0.3px}
.radar-legend-bar{display:flex;gap:8px;flex-wrap:wrap}
.radar-legend-pill{display:inline-flex;align-items:center;gap:6px;font:700 9px/1 var(--mono);padding:5px 9px;border-radius:4px;border:1px solid #234358;background:#0d1d2c;color:#c0d5e5}
.radar-legend-pill.new{border-color:#2a634e;background:#0a211b;color:var(--green)}
.radar-legend-pill.updated{border-color:#632a4e;background:#240e1d;color:var(--pink)}
.radar-legend-pill.kev{border-color:#7a1a2b;background:#290a12;color:#ff5e79}

.radar-cve-list{display:grid;gap:8px;max-height:420px;overflow-y:auto;padding-right:4px}
.radar-cve-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 12px;background:#0d1c2b;border:1px solid #244154;border-radius:6px;font:11px var(--mono);transition:border-color .2s,background .2s}
.radar-cve-item:hover{border-color:var(--cyan);background:#10263a}
.radar-cve-main{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
.cve-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.cve-dot.new{background:var(--green);box-shadow:0 0 8px var(--green)}
.cve-dot.updated{background:var(--pink);box-shadow:0 0 8px var(--pink)}
.cve-dot.kev{background:#ff3355;box-shadow:0 0 10px #ff3355;animation:blink 1.8s infinite}
.radar-cve-info{display:flex;flex-direction:column;gap:2px;min-width:0}
.radar-cve-info a{color:#fff;font-weight:700;text-decoration:none;white-space:nowrap}
.radar-cve-info a:hover{color:var(--cyan);text-decoration:underline}
.radar-cve-meta{color:#8aa4b8;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.radar-cve-side{display:flex;align-items:center;gap:8px;flex-shrink:0}
.cve-metrics{font:700 10px var(--mono);padding:3px 7px;background:#091421;border:1px solid #23455b;border-radius:4px;color:#a3c5dd}
.cve-tag{font:800 9px var(--mono);padding:3px 6px;border-radius:4px;letter-spacing:0.5px}
.cve-tag.new{background:#11382b;color:var(--green);border:1px solid #2c7255}
.cve-tag.updated{background:#38152e;color:var(--pink);border:1px solid #75295c}
.cve-tag.kev{background:#3d0d18;color:#ff5e79;border:1px solid #851c31}


/* Radar sweep is independent of the pointer; selecting a dot never pauses the beam. */
.cve-blip:hover,.cve-blip:focus-visible{transform:translate(-50%,-50%) scale(2.2)!important;z-index:25;box-shadow:0 0 0 3px #fff,0 0 25px var(--cyan),0 0 35px #fff!important;animation:none!important}

/* Mobile artwork proportions remain unchanged; the moon follows the same crop language. */
@media(max-width:720px){.moon{width:148px;height:148px;right:calc(var(--moon-right,20%) - 13%);filter:drop-shadow(0 0 12px #59effc88)}}
/* Desktop compositor hint: keep the original rotating gradient on a separate layer.
   The mobile .radar-sweep and all CVE echo keyframes remain unchanged. */
@media(hover:hover) and (pointer:fine){
  .radar-sweep{transform-origin:50% 50%;will-change:transform;backface-visibility:hidden}
}
.radar-motion-enable{border:1px solid #2c766d;border-radius:4px;background:#0b2929;color:var(--green);font:700 9px var(--mono);padding:6px 8px;white-space:nowrap}
.radar-motion-enable:hover,.radar-motion-enable:focus-visible{border-color:var(--green)}
.radar-motion-enable[hidden]{display:none!important}
.radar-foot:has(.radar-motion-enable:not([hidden])){flex-wrap:wrap}

/* Arcade nightscape / v1
   Lightweight composited opacity/transform effects. The skyline silhouette,
   original radar colors and mobile dimensions remain unchanged. */
.hero-art{
  background:
    radial-gradient(ellipse 45% 90% at 80% 43%,#ac2c7952,transparent 76%),
    radial-gradient(ellipse 64% 80% at 52% 110%,#141c4b82,transparent 70%),
    linear-gradient(116deg,#061423 0%,#111b38 60%,#241329 100%);
}
.night-atmosphere{
  position:absolute;inset:-4%;pointer-events:none;opacity:0;
  background:
    radial-gradient(ellipse 42% 65% at 74% 47%,#2c57905e,transparent 80%),
    radial-gradient(ellipse 42% 35% at 86% 100%,#74306e42,transparent 90%),
    radial-gradient(ellipse 55% 70% at 54% 108%,#1a4f6b38,transparent 85%),
    linear-gradient(120deg,#051126e8 0%,#111532b8 64%,#080f25bb 100%);
  transition:opacity 2.8s ease;
}
.hero-art[data-celestial="moon"] .night-atmosphere{opacity:1}
.night-stars{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity 2.4s ease}
.hero-art[data-celestial="moon"] .night-stars{opacity:1}
.night-star{
  position:absolute;left:var(--star-x);top:var(--star-y);width:var(--star-size,2px);height:var(--star-size,2px);
  border-radius:1px;background:var(--star-color,#d4f3ff);
  box-shadow:0 0 5px #b0eaff88,0 0 12px #50b7ff3c;opacity:.4;
  transform:translate3d(0,0,0) scale(.8);
  animation:nightStarTwinkle var(--star-duration,4.5s) ease-in-out var(--star-delay,-1s) infinite alternate;
  animation-play-state:paused;
}
.hero-art[data-celestial="moon"] .night-star{animation-play-state:running}
.night-star[data-glint="true"]::before,
.night-star[data-glint="true"]::after{
  content:"";position:absolute;background:#caf8ff91;pointer-events:none;
}
.night-star[data-glint="true"]::before{left:50%;top:-4px;width:1px;height:10px;transform:translateX(-50%)}
.night-star[data-glint="true"]::after{top:50%;left:-4px;width:10px;height:1px;transform:translateY(-50%)}
@keyframes nightStarTwinkle{
  0%{opacity:.12;transform:scale(.65)}
  35%{opacity:.46;transform:scale(.86)}
  70%{opacity:1;transform:scale(1.1)}
  100%{opacity:.22;transform:scale(.76)}
}

/* Preserve main's original skyline polygons and layout. Only in night mode,
   blend the LEFT edge of both existing silhouette layers into the navy sky,
   including their apartment-window children, so no hard vertical cutoff. */
.hero-art[data-celestial="moon"] > .skyline{
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#0005 6%,#000c 13%,#000 22%);
  mask-image:linear-gradient(to right,transparent 0%,#0005 6%,#000c 13%,#000 22%);
}
/* Night residential interiors attach to the original main-branch skyline
   nodes. No new facade, transform, background, clip-path, width or height.
   The original stepped polygon is thus mechanically identical day and night. */
.hero-art > .skyline .apt-window{
  position:absolute;display:block;visibility:hidden;
  width:clamp(2px,.24vw,3.8px);
  height:clamp(3px,.36vw,5.5px);
  border-radius:0;opacity:0;
  background:var(--dark-window,#35475d);
  pointer-events:none;
  transition:opacity 1.8s ease,background-color 1.3s ease,box-shadow 1.3s ease;
}
/* Window details are only painted at night; daytime uses the original
   unadorned building polygons from main, even if Reduce Motion is active. */
.hero-art[data-celestial="moon"] > .skyline .apt-window{
  visibility:visible;opacity:.77;
}
.hero-art[data-celestial="moon"] > .skyline .apt-window.is-lit{
  background:var(--lamp-color,#f1d19a);
  opacity:.91;
  box-shadow:0 0 2px var(--lamp-color,#f1d19a);
}
.hero-art[data-celestial="moon"] > .skyline .apt-window.is-lit.lights-off{
  background:#394a60;opacity:.70;box-shadow:none;
}
.hero-art > .skyline .apt-window[data-border-hidden="true"]{
  display:none!important;
}
.hero-art > .skyline-back .apt-window{
  width:clamp(1.5px,.18vw,3px);height:clamp(2.5px,.27vw,4px);
}
.hero-art[data-celestial="moon"] > .skyline-back .apt-window{
  opacity:.44;
}
.hero-art[data-celestial="moon"] > .skyline-back .apt-window.is-lit{
  opacity:.62;box-shadow:0 0 1px var(--lamp-color,#f1d19a);
}
.hero-art > .skyline .apt-roof-edge,
.hero-art > .skyline .apt-roof-unit,
.hero-art > .skyline .apt-roof-antenna,
.hero-art > .skyline .apt-roof-tank,
.hero-art > .skyline .apt-balcony{
  position:absolute;display:block;visibility:hidden;
  pointer-events:none;box-sizing:border-box;
}
.hero-art[data-celestial="moon"] > .skyline .apt-roof-edge,
.hero-art[data-celestial="moon"] > .skyline .apt-roof-unit,
.hero-art[data-celestial="moon"] > .skyline .apt-roof-antenna,
.hero-art[data-celestial="moon"] > .skyline .apt-roof-tank,
.hero-art[data-celestial="moon"] > .skyline .apt-balcony{
  visibility:visible;
}
.hero-art > .skyline .apt-roof-edge{height:1px;background:#718399;opacity:.43}
.hero-art > .skyline .apt-roof-unit{
  width:8px;height:5px;background:#17283c;
  border:1px solid #64758e;box-shadow:inset 0 1px #34485e;
}
.hero-art > .skyline .apt-roof-antenna{
  width:1px;height:7px;background:#68859e;opacity:.85;
  box-shadow:-3px 3px 0 -0.3px #7792a8,3px 3px 0 -0.3px #7792a8;
}
.hero-art > .skyline .apt-roof-tank{
  width:7px;height:5px;border:1px solid #6a7b96;
  background:#17273a;box-shadow:0 2px 0 #263c53;
}
.hero-art > .skyline .apt-balcony{
  width:12px;height:5px;border:1px solid #7590a2;
  border-top-width:2px;background:#0c1b2b7d;opacity:.76;
}
body[data-mode="professional"] .night-stars,
body[data-mode="professional"] .night-atmosphere,
body[data-mode="professional"] .day-clouds,
body[data-mode="professional"] .sky-traffic{display:none}
body.reduce-motion .hero-art > .skyline .apt-window{transition:none!important}

/* Two translucent silhouettes traverse only the daytime layer. Atmospheric
   gradients and low opacity preserve text legibility and the original art. */
.day-clouds{
  position:absolute;inset:0;opacity:1;
  pointer-events:none;
  transition:opacity 2.6s ease;
}
.hero-art[data-celestial="moon"] .day-clouds{opacity:0}
.day-cloud{
  position:absolute;display:block;width:154px;height:31px;
  opacity:.10;
  filter:blur(2px);
  background:
    radial-gradient(ellipse 26px 12px at 22% 76%,#b3cee8 98%,transparent 100%),
    radial-gradient(ellipse 42px 16px at 44% 57%,#c7d5f6 98%,transparent 100%),
    radial-gradient(ellipse 34px 14px at 72% 75%,#a1cbe9 98%,transparent 100%);
  animation:dayCloudTravel var(--cloud-duration,135s) ease-in-out
            var(--cloud-delay,-25s) infinite alternate;
  animation-play-state:running;
  will-change:transform;
}
.cloud-near{
  top:17%;left:52%;
  --cloud-duration:128s;--cloud-delay:-43s;
}
.cloud-far{
  top:39%;left:80%;
  width:114px;height:25px;opacity:.07;
  --cloud-duration:174s;--cloud-delay:-88s;
  transform:scale(.85);
}
@keyframes dayCloudTravel{
  from{transform:translate3d(-28px,0,0) scale(.94)}
  to{transform:translate3d(42px,-5px,0) scale(1.04)}
}
.hero-art[data-celestial="moon"] .day-cloud{animation-play-state:paused}

/* The craft uses its own non-interactive overlay ABOVE hero text. The rest
   of the artwork keeps its original z-index and day/night appearance. */
.hero-flight-overlay{
  position:absolute;inset:0;z-index:2;
  overflow:hidden;pointer-events:none;
}
/* A single tiny SVG vehicle crosses the sky occasionally. Its WAAPI path is
   started on demand, rather than forcing a perpetual CSS animation. */
.sky-traffic{
  position:absolute;left:0;top:var(--flight-top,23%);
  /* Above the sun (and its mask/glow), below the real hero text overlay. */
  z-index:4;
  width:48px;height:22px;opacity:0;pointer-events:none;
  transform:translate3d(-70px,0,0);
  will-change:transform,opacity;
}
.sky-traffic[data-vehicle="plane"]{width:82px;height:35px}
.sky-traffic svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 0 2px #a6edff6e)}
.sky-traffic .sky-plane{display:none}
.sky-traffic[data-vehicle="plane"] .sky-drone{display:none}
.sky-traffic[data-vehicle="plane"] .sky-plane{display:block}
.sky-traffic[data-direction="reverse"] svg{transform:scaleX(-1)}
/* The traffic overlay is a sibling of the sky, so night still force-hides it. */
/* Manual terminal deployment is visible at night without changing the sky. */
.hero-art[data-celestial="moon"] + .hero-flight-overlay .sky-traffic:not([data-manual-deploy="true"]){opacity:0!important}
@media(max-width:720px){
  .sky-traffic{width:35px;height:17px}
  .sky-traffic[data-vehicle="plane"]{width:63px;height:27px}
  .day-cloud{opacity:.07}
}
/* User's explicit Reduce Motion setting also turns off incidental city
   activity. The windows remain visible but stop changing. */
/* Reduced motion keeps dark and illuminated windows fixed; no city timers. */
body.reduce-motion .day-cloud{animation:none!important}
body.reduce-motion .sky-traffic{opacity:0!important}

/* Radar: retain the original six-second echo, and add a brief expanding ring
   precisely when the rotating sweep reaches a plotted CVE. */
.cve-blip::after{
  content:"";position:absolute;inset:-4px;border-radius:50%;
  border:1px solid var(--echo-color,#95f57b);pointer-events:none;
  opacity:0;transform:scale(.7);
  animation:radarHitRing 6s linear var(--radar-flare-delay,0s) infinite;
}
@keyframes radarHitRing{
  0%,.8%{opacity:0;transform:scale(.7)}
  2%{opacity:.88;transform:scale(1.55)}
  7%{opacity:.31;transform:scale(2.15)}
  13%,100%{opacity:0;transform:scale(2.8)}
}
.cve-blip:hover::after,.cve-blip:focus-visible::after{animation:none;opacity:0}