@import url("base.css");

:root { --cyan:#79f6ed; --violet:#aa83ff; --ink:#050710; }
body { background:#02030a; font-family:Arial,Helvetica,sans-serif; }
.entry-screen { min-height:100vh; position:relative; overflow:hidden; padding:1.5rem clamp(1.25rem,4vw,4rem); background:radial-gradient(circle at 50% 48%,#1c2743 0,#0b1021 33%,#03050d 72%); color:#e9f3f5; }
.entry-noise { position:absolute; inset:0; opacity:.15; pointer-events:none; background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px); background-size:4px 4px,32px 32px; }
.entry-brand { position:relative; z-index:1; display:flex; align-items:center; gap:1rem; color:#9ca9b5; font-size:.62rem; font-weight:700; letter-spacing:.16em; }.entry-mark { color:var(--cyan); font-size:1rem; font-weight:900; letter-spacing:-.08em; }.status-dot { margin-left:auto; color:#8ef2bc; }.status-dot::before { content:""; display:inline-block; width:.42rem; height:.42rem; margin-right:.42rem; border-radius:50%; background:#8ef2bc; box-shadow:0 0 12px #8ef2bc; }
.pc-chamber { position:relative; z-index:1; max-width:1180px; min-height:calc(100vh - 4.5rem); margin:auto; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr); align-items:center; gap:clamp(2rem,7vw,8rem); }.chamber-label { position:absolute; top:8%; left:0; color:#728197; font:700 .56rem/1 monospace; letter-spacing:.18em; }
.motherboard { position:relative; width:min(100%,680px); aspect-ratio:1.15; overflow:hidden; border:1px solid rgba(142,245,238,.32); border-radius:2rem; background:linear-gradient(130deg,#131d37,#080d1d 65%,#16223d); box-shadow:inset 0 0 100px #000,0 28px 80px rgba(0,0,0,.48); }.motherboard::before { content:""; position:absolute; inset:7%; border:1px solid rgba(121,246,237,.18); background:repeating-linear-gradient(90deg,transparent 0 8%,rgba(121,246,237,.035) 8.2% 8.5%); }.motherboard::after { content:""; position:absolute; inset:0; background:radial-gradient(circle at 50% 55%,transparent 0 20%,rgba(0,0,0,.4) 74%); pointer-events:none; }
.trace { position:absolute; height:2px; background:linear-gradient(90deg,transparent,var(--cyan),transparent); box-shadow:0 0 8px var(--cyan); opacity:.6; transform-origin:left; }.trace-a{width:56%;top:42%;left:1%;transform:rotate(19deg)}.trace-b{width:42%;top:70%;left:42%;transform:rotate(-45deg)}.trace-c{width:48%;top:23%;left:38%;transform:rotate(25deg)}.trace-d{width:48%;top:78%;left:4%;transform:rotate(-14deg)}
.ram,.gpu,.storage,.io-chip { position:absolute; z-index:1; border:1px solid rgba(121,246,237,.38); background:linear-gradient(135deg,#1b2a45,#090d19); box-shadow:inset 0 0 20px rgba(121,246,237,.12),0 0 18px rgba(0,0,0,.4); color:#a9bbc7; font:700 clamp(.42rem,1vw,.63rem)/1.2 monospace; letter-spacing:.08em; }.ram { width:10%; height:57%; top:14%; padding:.6rem .25rem; writing-mode:vertical-rl; }.ram-one{left:11%}.ram-two{left:23%}.gpu{width:48%;height:17%;left:7%;bottom:10%;padding:1rem}.gpu b{color:var(--cyan);display:block}.gpu span{font-size:.5rem}.gpu i{position:absolute;right:7%;top:30%;width:16%;aspect-ratio:1;border:1px solid #6681a0;border-radius:50%;box-shadow:inset 0 0 9px var(--violet)}.gpu i:nth-last-child(2){right:28%}.gpu i:nth-last-child(3){right:49%}.storage{right:8%;bottom:13%;width:22%;height:20%;padding:1rem}.storage b{display:block;margin-top:.6rem;color:#d7b8ff;font-size:.55rem}.io-chip{right:12%;top:17%;width:13%;aspect-ratio:1;display:grid;place-items:center;text-align:center;color:#8ef2bc}
.ld-processor { position:absolute; z-index:3; left:47%; top:46%; width:27%; aspect-ratio:1; padding:0; cursor:pointer; border:7px solid #c1d1d5; outline:2px solid rgba(121,246,237,.7); outline-offset:7px; background:linear-gradient(145deg,#d7e2e3,#596978); color:#0a1721; box-shadow:0 0 0 15px #18283a,0 0 30px 8px rgba(121,246,237,.35); transition:transform .25s ease,box-shadow .25s ease; }.ld-processor:hover,.ld-processor:focus-visible { transform:scale(1.08); box-shadow:0 0 0 15px #263b52,0 0 55px 14px var(--cyan); }.processor-core { display:grid;place-items:center;height:64%;font-size:clamp(1.4rem,4vw,3.5rem);font-weight:900;letter-spacing:-.1em;color:#0b1822;text-shadow:0 1px #fff; }.processor-detail { display:block;border-top:1px solid #53616a;padding-top:.45rem;font:700 clamp(.34rem,.7vw,.52rem)/1.1 monospace;letter-spacing:.1em; }
.board-note { position:absolute; z-index:2; color:#71869a; font:700 .52rem monospace; letter-spacing:.15em; }.board-note-one{left:38%;top:27%}.board-note-two{right:8%;top:49%}.entry-copy h1{margin:.35rem 0 1.4rem;font-size:clamp(3.6rem,8vw,7rem);line-height:.8;letter-spacing:-.1em;text-transform:uppercase}.entry-copy h1 em{color:var(--cyan);font-style:normal}.entry-copy>p:not(.eyebrow){max-width:23rem;color:#92a2b3;line-height:1.6}.entry-cue{display:block;margin-top:2.2rem;color:#dcecf0;font:700 .65rem monospace;letter-spacing:.12em}.entry-cue b{color:var(--cyan);font-size:1.2rem}
.auth-panel { width:min(30rem,calc(100% - 2rem)); border:1px solid var(--cyan); padding:0; background:#07101b; color:#eaf8f8; box-shadow:0 0 0 100vmax rgba(0,0,0,.6),0 0 70px rgba(121,246,237,.25); }.auth-panel::backdrop{background:rgba(0,0,0,.5)}.auth-panel form{position:relative;padding:2.5rem}.auth-panel h2{margin:.4rem 0 1rem;font-size:2.2rem;letter-spacing:-.06em}.auth-copy,.auth-status{color:#8fa6ad;font-size:.8rem;line-height:1.5}.auth-panel label{display:block;margin:1.7rem 0 .5rem;color:var(--cyan);font:700 .62rem monospace;letter-spacing:.12em;text-transform:uppercase}.auth-panel input{width:100%;padding:.85rem;border:1px solid #49707a;background:#02070c;color:#fff;outline:0}.authenticate{width:100%;margin-top:1rem;padding:.9rem;border:1px solid var(--cyan);background:var(--cyan);color:#07131b;cursor:pointer;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.authenticate span{float:right}.close-auth{position:absolute;right:.7rem;top:.45rem;border:0;background:transparent;color:#b6d1d5;font-size:1.7rem;cursor:pointer}.auth-status{min-height:1.5em;margin:1rem 0 0}.auth-status.error{color:#ff9c9c}.auth-status.success{color:#8ef2bc}
.boot-screen{position:fixed;inset:0;z-index:20;display:none;place-content:center;text-align:center;gap:1rem;background:#040b12;color:var(--cyan);font:700 .68rem monospace;letter-spacing:.18em}.boot-screen.active{display:grid;animation:boot .9s ease both}.boot-screen b{color:#e5fcff}.boot-screen i{width:min(18rem,70vw);height:2px;background:linear-gradient(90deg,var(--cyan) 0 0) left/0% 100% no-repeat,#20303e;animation:load .8s .1s ease forwards}
main{background:radial-gradient(circle at 100% 0,#111e31 0,transparent 28%),#05070d}main[hidden]{display:none}.system-bar{display:flex;gap:1rem;align-items:center;margin-bottom:2rem;color:#6f8b99;font:700 .58rem monospace;letter-spacing:.13em}.system-bar span:first-child{color:var(--cyan);font-size:.75rem}.return-to-core{margin-left:auto;border:1px solid #3a5868;background:transparent;color:#b5d9df;padding:.35rem .6rem;cursor:pointer;font:inherit}.identity img{filter:drop-shadow(0 0 7px rgba(121,246,237,.5)) brightness(0) invert(1)}.email-link,.date-calendar,.weather-widget{background:rgba(8,14,23,.82);border-color:#263d4d}.news-feed{border-color:#263d4d}.headline-sheet{box-shadow:0 1.4rem 3.5rem rgba(0,0,0,.48)}
@keyframes load{to{background-size:100% 100%}}@keyframes boot{0%{opacity:0}30%{opacity:1}100%{opacity:1}}@media(max-width:760px){.pc-chamber{grid-template-columns:1fr;padding:4rem 0 2rem;gap:2rem}.motherboard{order:2}.entry-copy{order:1}.chamber-label{top:2rem}.entry-copy h1{font-size:clamp(3.5rem,17vw,5rem)}.entry-brand{font-size:.48rem}.status-dot{display:none}.ram{height:49%}.gpu{padding:.55rem}.storage{padding:.5rem}.auth-panel form{padding:2rem}}

/* The supplied workstation artwork is the primary visual. The button aligns to its L.D. processor. */
.pc-reference { position:relative; width:min(100%, 820px); margin:0; line-height:0; filter:drop-shadow(0 28px 38px rgba(0,0,0,.55)); }
.pc-reference img { display:block; width:100%; height:auto; border:1px solid rgba(127,231,255,.32); border-radius:1.1rem; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); }
.pc-reference .ld-processor { left:34.8%; top:24.2%; width:12.5%; border:2px solid transparent; outline:1px solid transparent; outline-offset:8px; background:rgba(121,246,237,0); color:transparent; box-shadow:none; }
.pc-reference .ld-processor:hover, .pc-reference .ld-processor:focus-visible { border-color:rgba(150,251,244,.72); outline-color:rgba(150,251,244,.6); background:rgba(121,246,237,.12); box-shadow:0 0 28px 8px rgba(121,246,237,.55), inset 0 0 18px rgba(121,246,237,.32); }
.pc-reference .processor-core, .pc-reference .processor-detail { opacity:0; }.pc-reference .ld-processor:hover .processor-core, .pc-reference .ld-processor:focus-visible .processor-core { opacity:1; color:#eaffff; font-size:clamp(.9rem,2vw,1.55rem); text-shadow:0 0 10px #0c1820; }.pc-reference .ld-processor:hover .processor-detail, .pc-reference .ld-processor:focus-visible .processor-detail { opacity:1; color:#eaffff; }
@media(max-width:760px){.pc-reference{order:2}.pc-reference .ld-processor{outline-offset:4px}.pc-reference img{border-radius:.7rem}}

/* Splash view: display only the supplied image, edge to edge. */
.entry-screen { min-height:100vh; height:100vh; display:grid; place-items:center; padding:0; background:#000; overflow:hidden; }
.pc-reference { width:max(100vw, 177.872vh); max-width:none; margin:0; flex:none; }
.pc-reference img { width:100%; border:0; border-radius:0; box-shadow:none; }
@media(max-width:760px){.pc-reference{order:initial}.pc-reference img{border-radius:0}}
