:root{--paper:#030719;--ink:#ecf1ff;--muted:#9aa8c9;--green:#36deed;--line:#243052;--pink:#ee57eb;--gold:#ffd56c}html{scroll-behavior:smooth;scroll-padding-top:26px}body{background:radial-gradient(ellipse at 85% 0,#13214180,transparent 37%),#030719;color:var(--ink);font-family:Inter,Segoe UI,system-ui,sans-serif}main{max-width:1440px;padding:27px 42px}header{align-items:center;gap:24px;padding-bottom:20px}.brand{display:flex;gap:11px;align-items:center;font-size:17px;letter-spacing:.13em}.brand em{font-style:normal;color:var(--green);border:1px solid #44deed80;padding:5px 10px;box-shadow:0 0 20px #36deed20}.brand small{display:block;font-size:8px;letter-spacing:.24em;color:var(--muted)}nav{display:flex;gap:24px;font-size:12px}nav a{color:#bfcae1;text-decoration:none}nav a:hover{color:var(--green)}.tag{color:var(--green);font-size:10px;white-space:nowrap}.tag:before{content:'●';margin-right:8px;text-shadow:0 0 10px var(--green)}.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:15px;min-height:410px;align-items:center;padding:30px 0 25px}.eyebrow{font-size:10px;letter-spacing:.2em;color:var(--green);font-weight:650}h1{font-family:Segoe UI,system-ui,sans-serif;font-weight:650;font-size:clamp(38px,4.9vw,67px);letter-spacing:-.045em;line-height:1.06;margin:20px 0}h1 span{color:var(--green);text-shadow:0 0 36px #36deed38}.intro{font-size:14px;max-width:510px;line-height:1.8;color:#a5b4d4}.hero-image{margin:0;position:relative}.hero-image img{width:100%;display:block;max-height:350px;object-fit:contain;mix-blend-mode:screen}.hero-image figcaption{font-size:9px;color:#7f91b6;text-align:center}.hero-links{display:flex;gap:13px;margin-top:25px;align-items:center}.primary,.secondary{padding:11px 18px;border-radius:5px;text-decoration:none;font-size:12px;font-weight:650}.primary{background:#31dbea;color:#04101d;box-shadow:0 0 22px #2ee4ec15}.secondary{border:1px solid #374160;color:#b2c2de}.section-heading{display:flex;justify-content:space-between;align-items:end;border-top:1px solid var(--line);padding-top:26px;margin-top:26px;gap:25px}.section-heading h2{font-size:25px;font-weight:550;letter-spacing:-.025em;margin:7px 0}.section-heading p{font-size:12px;color:var(--muted);margin:0;max-width:490px}.section-number{font:10px monospace;letter-spacing:.16em;color:var(--green)}.layout{margin-top:23px;grid-template-columns:275px 1fr;gap:20px}aside{background:linear-gradient(130deg,#10172e,#090e22);border-color:#283556;border-radius:10px;padding:23px}legend,label{font-size:12px;color:#d8e4fc}fieldset{margin-bottom:24px}.seg button{color:#8e9fbd;background:#080e23;border-color:#2b3757;border-radius:5px;font-size:11px;padding:9px 5px}.seg button:hover{background:#152842;color:white}button[aria-pressed=true]{background:#102c43;color:var(--green);border-color:#36deed;box-shadow:inset 0 0 16px #36deed12}input[type=range]{accent-color:var(--green);height:5px;cursor:pointer}.readout{font:22px ui-monospace,Consolas,monospace;color:#e9f5ff;letter-spacing:-.05em;margin:10px 0 17px}.hint{font-size:11px;line-height:1.7;color:#7f90b2}.stage{background:radial-gradient(ellipse at 50% 60%,#101b3f60,transparent 70%),#060b20;border-color:#344266;box-shadow:0 0 35px #01040f;border-radius:10px}.stagebar{background:#10172b;border-color:#243354;padding:14px 20px;gap:12px;font-size:11px;color:#c5d5ef}.stagebar span:before{content:'●';color:var(--green);margin-right:10px}.stagebar button{border-color:#394763;color:#adbfd9;border-radius:5px;font-size:10px;padding:7px 10px}canvas{height:405px}.legend{color:#9babcb;font-size:10px;padding:0 22px 19px;gap:17px}.dot{background:#36deed;box-shadow:0 0 8px #36deed70}.hole{background:transparent;border-color:#ee57eb;box-shadow:0 0 7px #ee57eb55}.atom{background:#4e6796;box-shadow:none}.metrics{background:#0c1229;border:1px solid #243052;border-radius:8px;padding:18px 20px;margin-top:14px}.metric strong{font:22px ui-monospace,Consolas,monospace;margin-top:7px}.metric:nth-child(1) strong{color:var(--green)}.metric:nth-child(2) strong{color:var(--pink)}.metric:nth-child(3) strong{color:var(--gold)}.metric small{font-size:10px;color:#8fa0c0}.lesson{border-color:var(--gold);padding-left:14px;margin-top:19px}.lesson h2{font-size:13px;color:#e7ecf7}.lesson p{font-size:12px;color:#92a4c6;line-height:1.8}#reset{background:transparent;border-color:#30405c;color:#a4b6d2;font-size:11px}.atlas{margin-top:55px}.gallery-tools{display:flex;gap:8px;margin:22px 0;flex-wrap:wrap}.gallery-tools button{font-size:11px;background:#0c1229;border-color:#2b3757;color:#9aaccb}.gallery-tools button[aria-pressed=true]{color:var(--green);border-color:var(--green)}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:19px}.art-card{display:block;text-align:left;background:transparent;border:0;padding:0;overflow:hidden;color:#dce7fa;border-radius:6px}.art-card img{width:100%;aspect-ratio:16/9;object-fit:contain;background:#030718;border:1px solid #273152;border-radius:7px;display:block;transition:transform .25s,border-color .25s}.art-card:hover{background:transparent}.art-card:hover img{transform:translateY(-3px);border-color:#36deed80}.art-card .cap{display:flex;gap:10px;padding:12px 0}.art-card .cap b{font-size:12px;font-weight:500}.art-card .cap span{color:#667ca2;font:10px monospace;padding-top:2px}.atlas-note{font-size:10px;color:#7486a8;line-height:1.8}.library{margin-top:55px}.chapter{background:#080f24;border:1px solid #253254;border-radius:8px;margin:12px 0;padding:0}.chapter summary{padding:19px 22px;color:#cedcf1;font-size:13px;list-style-position:inside}.chapter summary:hover{color:var(--green)}.chapter[open] summary{border-bottom:1px solid #253254;color:var(--green)}.chapter-body{padding:10px 25px 20px;max-width:980px}.chapter-body p{font-size:13px;line-height:1.85;color:#a6b6d0}.chapter-body h3{font-size:16px;color:#dce8fb;margin-top:25px}.chapter-body .formula{font:13px/1.8 ui-monospace,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--gold);background:#111a30;padding:13px}.table-wrap{overflow-x:auto;margin:15px 0}table{border-collapse:collapse;font-size:11px;min-width:600px;width:100%;color:#a8b9d7}td,th{border:1px solid #2a3753;padding:9px 12px;text-align:left}th{background:#131e35;color:#d8e7fa}.library-links{font-size:12px;color:var(--muted);margin:20px 0}a{color:#48dce7}.appstrip{border-color:#263454;margin-top:40px;padding:23px 0}.appstrip strong{font-size:14px}.appstrip small{color:#8196b8;font-size:11px}#install-app{background:#112c42;color:var(--green);border-color:#37deec;font-size:12px}dialog{color:#d5e3f8;background:#0a1027;border-color:#37517b}dialog p{color:#9fb2d3}dialog button{background:#172c43;color:#5bdeeb;border-color:#3d5c7d}dialog::backdrop{background:#010411db;backdrop-filter:blur(6px)}#art-dialog{max-width:1120px;width:95vw;padding:20px}#art-dialog img{max-width:100%;max-height:76vh;display:block;margin:16px auto;object-fit:contain}#art-dialog .dialog-header{display:flex;justify-content:space-between;align-items:center;gap:20px}#art-dialog h2{margin:0;font-size:16px}#art-desc{font-size:12px}.method{font-size:12px;color:#97aaca}footer{border-top:1px solid #263454;padding-top:22px;display:flex;justify-content:space-between;gap:20px;font-size:10px;color:#7185a9}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #ffdc7e;outline-offset:5px}
@media(max-width:1000px){main{padding:24px}nav{gap:14px}.tag{display:none}.hero{min-height:340px}.hero-image img{max-height:280px}.layout{grid-template-columns:245px 1fr}.readout{font-size:20px}.gallery{grid-template-columns:repeat(2,1fr)}}@media(max-width:820px){.layout{grid-template-columns:1fr}aside{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}fieldset{margin-bottom:0}.readout{display:block}.control{margin:0}#reset{align-self:end;margin-top:0!important}canvas{height:390px}.metrics{padding:17px 14px}.metric strong{font-size:19px}.hero{grid-template-columns:1fr 1fr;gap:0}h1{font-size:43px}.intro{font-size:12px}.hero-image img{min-height:220px;object-fit:contain}}@media(max-width:560px){main{padding:18px}.brand{font-size:14px}nav{gap:11px;font-size:10px}.hero{grid-template-columns:1fr;padding-top:28px;position:relative}.hero-image{grid-row:2;margin-top:12px}.hero-image img{max-height:245px;min-height:0}.hero-image figcaption{font-size:8px}.hero h1{font-size:46px;max-width:390px}.intro{font-size:13px;max-width:420px}.hero-links{margin-top:20px}.section-heading{display:block;padding-top:22px}.section-heading h2{font-size:23px}.section-heading p{font-size:11px}.gallery{gap:13px}.art-card .cap{gap:6px;padding-top:9px}.art-card .cap b{font-size:10px}.art-card .cap span{font-size:8px}aside{padding:18px;gap:18px}.readout{font-size:18px}legend,label{font-size:10px}.seg{gap:4px}.seg button{font-size:9px}.hint{font-size:10px}.stagebar{padding:12px;font-size:9px}.stagebar button{font-size:9px;padding:6px}.legend{font-size:9px;padding-left:14px;gap:11px}.metric strong{font-size:15px}.metric small{font-size:9px}.chapter summary{font-size:12px;padding:16px}.chapter-body{padding:8px 17px 15px}.chapter-body p{font-size:12px}footer{display:block}footer span{display:block;margin-bottom:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.art-card img{transition:none}}
fieldset{min-width:0}.metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.metric strong,.readout{overflow-wrap:anywhere}.stagebar span{min-width:0}.art-card{min-width:0}input[type=range]{min-width:0}img{max-width:100%}@media(max-width:560px){header{flex-wrap:wrap;gap:15px}nav{justify-content:space-between;width:100%;gap:15px;font-size:11px}nav a{white-space:nowrap}.brand small{font-size:7px}.metric strong{font-size:12px}.metrics{gap:8px}.readout{font-size:16px}.stagebar span{max-width:65%}.hero-links{align-items:stretch}.primary,.secondary{padding:11px 13px;font-size:11px}}

/* The chip emerges from the page instead of sitting inside an image panel. */
.hero{grid-template-columns:1.02fr 1fr;gap:12px;overflow:hidden}
.hero-image{height:370px;isolation:isolate;overflow:hidden;align-self:center;margin:0 -18px 0 0;mask-image:linear-gradient(to right,transparent 0%,#000 19%,#000 93%,transparent 100%);-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 19%,#000 93%,transparent 100%)}
.hero-image:before{content:'';position:absolute;inset:12% 0 0 20%;z-index:-1;background:radial-gradient(ellipse,#14638735,transparent 65%);filter:blur(20px)}
.hero-image img{position:absolute;right:-8%;top:50%;width:135%;max-width:none;max-height:none;height:auto;transform:translateY(-50%);object-fit:contain;mix-blend-mode:screen;mask-image:radial-gradient(ellipse 55% 58% at 68% 53%,#000 40%,#000 58%,transparent 94%);-webkit-mask-image:radial-gradient(ellipse 55% 58% at 68% 53%,#000 40%,#000 58%,transparent 94%)}
@media(max-width:820px){.hero-image{height:310px}.hero-image img{min-height:0}}
@media(max-width:560px){.hero{grid-template-columns:1fr;overflow:visible}.hero-image{height:255px;width:calc(100% + 20px);margin:5px -10px 0}.hero-image img{width:120%;right:-1%;max-height:none}.hero-image{mask-image:linear-gradient(to right,transparent,#000 14%,#000 90%,transparent);-webkit-mask-image:linear-gradient(to right,transparent,#000 14%,#000 90%,transparent)}}

.hero-image img{right:0}#effects{background:#0d1830;border-color:#30486a;color:#8ad8ec;font-size:11px}#effects[aria-pressed=true]{border-color:#36deed77}
.hero-image{mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 76%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 76%,transparent 100%)}