/* Readable navigation and quieter landing pages. */
.header-inner{height:96px;min-height:96px;flex-wrap:nowrap;gap:24px}
.main-nav{gap:30px}
.main-nav a{font-size:17px;font-weight:500;line-height:1.4;color:#c5b5d3;padding-block:10px}
.main-nav .nav-cta{padding:10px 16px}
.language-control select{font-size:14px;padding:9px 10px}
.language-control span{font-size:11px}
.home-page .hero{min-height:580px;padding-block:80px;gap:65px}
.home-page .hero h1{font-size:clamp(40px,4.2vw,64px);letter-spacing:-2px;line-height:1.13}
.home-page .hero-copy p{max-width:540px;font-size:18px;line-height:1.8}
.home-page .hero-actions{margin-top:36px}
.home-page .hero-art{max-width:430px;width:100%;justify-self:center}
.home-page .synth-sun{animation:none;opacity:.23;mask-image:none;top:16%;width:68%;left:16%}
.home-page .wire-cube{animation:none;transform:rotateX(-20deg) rotateY(35deg) rotateZ(-10deg)}
.home-page .face{background-image:none;box-shadow:0 0 10px #66edff22,inset 0 0 8px #66edff0a}
.home-page .status-dot{animation:none;box-shadow:none}
.home-page .hero .eyebrow{font-size:12px;line-height:1.8}
.home-page .work-section{padding-block:70px 100px}
.home-page .section-heading{margin-bottom:32px}
.home-page .card:after{display:none}
.home-page .card{background:#140e21;box-shadow:none}
.home-page .card:hover{box-shadow:none;transform:translateY(-3px)}
.home-page .card .tag-wrap,.home-page .image-index,.home-page .card-date{display:none}
.home-page .card p{font-size:15px;line-height:1.7;margin-bottom:0;min-height:0}
.home-page .card-meta{padding:26px}
.home-page .about-section{padding-block:95px;gap:70px}
.home-page .about-copy{max-width:560px}
.home-page .about-copy p{font-size:17px;line-height:1.85}
.home-page .text-link,.home-page .button{font-size:15px}
.skills-page .skills-intro{max-width:800px;margin-bottom:70px}
.skills-page .skills-intro h1{font-size:clamp(38px,4.6vw,62px);letter-spacing:-2px;line-height:1.15}
.skills-page .skills-intro p{font-size:18px;line-height:1.8;max-width:680px}
.skills-page .skill-group{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:80px;padding-block:45px}
.skills-page .skill-group .eyebrow{display:none}
.skills-page .skill-group h2{font-size:28px;margin-top:0}
.skills-page .skill-group p{max-width:360px;font-size:16px;line-height:1.8}
.skills-page .skills-items{grid-template-columns:1fr;gap:8px}
.skills-page .skills-items li{padding:4px 0;border:0;font-size:16px;line-height:1.65}
.skills-page .skills-items li:before{display:none}
.skills-page .language-items{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 24px}
.skill-details{margin-top:20px;color:#c5b5d3}
.skill-details summary{cursor:pointer;font-size:15px;color:var(--cyan);padding-block:8px;width:fit-content}
.skill-details summary:focus-visible{outline:2px solid var(--cyan);outline-offset:5px}
.skill-details[open] .skills-items{margin-top:14px;padding-left:18px;border-left:1px solid var(--line)}
.skills-page .skills-work{padding:36px 0;border:0;border-top:1px solid var(--line);background:none;margin-top:30px}
.skills-page .skills-work .eyebrow{display:none}
.skills-page .skills-work h2{font-size:30px}
.skills-page .skills-work p,.skills-page .text-link{font-size:16px}
@media(max-width:1100px){.header-inner{gap:18px}.main-nav{gap:22px}.home-page .hero{gap:30px}.skills-page .skill-group{gap:45px}}
@media(max-width:900px){.header-inner{height:auto;min-height:80px;padding-block:12px;gap:14px}.nav-toggle{display:block;border:1px solid #61335f;background:transparent;padding:10px 14px;font-size:15px}.main-nav{display:none;position:absolute;left:0;right:0;top:100%;padding:24px;background:#110b1d;border-bottom:1px solid #61335f;gap:16px 30px}.main-nav.is-open{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.main-nav a{font-size:18px;min-height:44px}.main-nav .nav-cta{padding:10px 0;border:0}.language-control span{display:none}.language-control{margin-left:0}.home-page .hero{padding-block:60px}.skills-page .skill-group{gap:30px}}
@media(max-width:720px){.header-inner{gap:10px}.nav-toggle{padding:9px 12px;font-size:14px}.language-control select{font-size:13px;padding:8px}.home-page .hero{min-height:0;grid-template-columns:1fr;padding-block:55px 45px;gap:30px}.home-page .hero-art{max-width:240px;margin:10px auto 0}.home-page .wire-cube{width:190px;height:190px;scale:.72}.home-page .hero-copy p{font-size:17px}.home-page .hero .eyebrow{font-size:10px;line-height:1.8}.home-page .hero-actions{gap:25px}.home-page .work-section{padding-block:35px 65px}.home-page .about-section{padding-block:60px;gap:25px}.home-page .about-section h2{font-size:36px}.home-page .card-meta{padding:24px}.skills-page .skills-intro{margin-bottom:45px}.skills-page .skills-intro p{font-size:17px}.skills-page .skill-group{grid-template-columns:1fr;gap:16px;padding-block:32px}.skills-page .skill-group p{margin-bottom:0}.skills-page .skill-group h2{font-size:25px}.skills-page .skills-items li{font-size:16px}.skills-page .language-items{grid-template-columns:repeat(3,minmax(0,1fr))}.skills-page .skills-work{gap:20px}}
@media(max-width:360px){.brand{font-size:16px}.brand-mark{display:none}.header-inner{gap:8px}.language-control select{padding:7px}.nav-toggle{padding:9px}}

/* Cool neutrals carry the content; cyan signals links and violet marks actions. */
:root{--bg:#0e1420;--surface:#171f2e;--text:#f3f5fa;--muted:#c4ccda;--line:#46536b;--accent:#c0b0f5;--pink:#c0b0f5;--cyan:#8ddff0;--violet:#c0b0f5}
body{background:var(--bg);color:var(--text);font-family:var(--font-ui);font-size:16px}
p{color:var(--muted);font-size:16px;line-height:1.8}
h1,h2,h3,h4{color:var(--text);font-family:var(--font-ui);text-shadow:none}
.hero h1{color:var(--text);text-shadow:none}
.outline-text,.hero .outline-text{color:var(--cyan);-webkit-text-stroke:0;text-shadow:none;animation:none}
.eyebrow,.card-category,.section-note,.card-date,.back-link,.footer-inner,.gallery-caption{color:#bbc6d8;font-size:12px}
.site-header{background:#0e1420f5;border-color:var(--line);box-shadow:none}
.brand-mark{border-color:var(--cyan);box-shadow:none}.brand em{color:var(--violet)}
.main-nav a{color:var(--muted)}
.main-nav a:hover,.main-nav a[aria-current]{color:var(--cyan);text-shadow:none}
.main-nav a[aria-current]:after{box-shadow:none}
.main-nav .nav-cta{color:var(--text);border-color:var(--line);box-shadow:none}
.main-nav .nav-cta:hover{border-color:var(--cyan);box-shadow:none}
@media(max-width:900px){.main-nav,.main-nav.is-open{background:var(--surface);border-color:var(--line)}}
.nav-toggle{color:var(--text);background:var(--surface);border-color:var(--line)}
.language-control{color:var(--muted)}
.language-control select{background:var(--surface);color:var(--text);border-color:var(--line)}
.primary{background:var(--violet);color:#141a29;box-shadow:none}
.primary:before{display:none}
.primary:hover{background:#d0c4fa;box-shadow:none}
.text-link,.back-link{color:var(--cyan);border-color:#65838e;font-size:15px}
.text-link:hover{text-shadow:none;color:#b4effa}
.punctuation{color:var(--violet);text-shadow:none}
.hero-art{background:none}.hero-art:before,.hero-art:after{display:none}
.home-page .synth-sun{background:linear-gradient(145deg,#89cada,#8076b1);opacity:.16}
.home-page .face{border-color:#8ddff0;background-color:#1c283522;box-shadow:none}
.home-page .back,.home-page .right,.home-page .top{border-color:#c0b0f5;box-shadow:none}
.home-page .card,.card,.gallery-button,.exploration-card,.circuit-card,.capability-card{background:var(--surface);border-color:var(--line);box-shadow:none}
.card:after{display:none}
.card:hover,.exploration-card:hover,.capability-card:hover{border-color:#8998b3;box-shadow:none}
.card p,.archive-info p,.capability-card p,.exploration-card p,.skills-work p{color:var(--muted);font-size:15px}
.card h3,.card h3 a{color:var(--text)}
.tag,.skill-list span{background:#202b3e;color:#dbe2ee;border-color:#53617b;font-size:12px}
.about-copy p:first-child{color:var(--muted)}.about-copy strong{color:var(--text)}
.filter{color:var(--muted);border-color:var(--line);font-size:14px}.filter span{color:var(--muted);font-size:12px}
.filter.active,.filter:hover{background:var(--cyan);color:#141a29;border-color:var(--cyan);box-shadow:none}
.filter.active span,.filter:hover span{color:#141a29}
.entry-status,.video-notice{color:var(--muted)}
.technical-notes p{color:var(--muted);font-size:16px}
.equation-panel,.build-note,.skills-work{background:var(--surface);border-color:var(--line)}
.equation-panel h3,.shading-section h2,.shading-section h3{color:var(--text)}
.equation{background:#111a2b;border-color:var(--cyan);color:var(--cyan)}
.equation-panel p,.formula-definitions dd,.shading-section p{color:var(--muted)}
.equation-panel pre{background:#101827;color:#e1e7f1;border-color:var(--line)}
.formula-definitions dt{color:var(--text)}
.shading-nav a{font-size:14px;color:var(--cyan)}
.gallery-caption,.gallery-caption span{color:var(--muted)}
.image-index,.image-arrow{background:#152032;color:var(--text);border-color:#77879f}
.image-arrow{color:var(--cyan)}
.footer-inner a{color:var(--muted);font-size:12px}
.footer-inner a:hover{color:var(--cyan)}
.motion-toggle{color:var(--muted);background:var(--surface);border-color:var(--line);font-size:12px}
.renderer-demo{--demo-muted:#c4ccda;--demo-line:#70819a}
.renderer-demo button{color:var(--text);border-color:#70819a;background:#172132;font-size:13px}
.renderer-demo button:hover{color:var(--cyan);border-color:var(--cyan)}
.renderer-demo .primary{background:var(--cyan);color:#101927;border-color:var(--cyan)}
.renderer-demo .primary:hover{background:#b4effa;color:#101927}
.renderer-demo select,.renderer-demo input[type=number]{color:var(--text);background:#172132;border-color:#70819a;font-size:13px}
.renderer-demo .range-control label{color:var(--muted);font-size:12px}
.renderer-demo :is(.lighting-tools,.raster-tools,.camera-readout,.raster-explanation){color:var(--muted);font-size:13px}
.camera-equations label{color:var(--muted);font-size:14px}
.camera-equations math-field{background:#111a2b;color:var(--text);border-color:#70819a}
.camera-equations math-field::part(virtual-keyboard-toggle),.camera-equations math-field::part(menu-toggle){color:var(--muted)}
.skills-page .skill-details summary{color:var(--cyan)}
.skills-page .skills-work{background:none}
@media(max-width:720px){.home-page .hero h1{font-size:clamp(40px,9vw,56px)}.home-page .hero .eyebrow{font-size:11px}.hero h1{text-shadow:none}.card p{font-size:15px}}

.entry-clips{margin:40px 0}.entry-clip{margin:0;min-width:0}.entry-clip video{display:block;width:100%;aspect-ratio:16/9;background:#080b12}.entry-clip figcaption{padding:12px 0;color:var(--muted)}

/* Title artwork stays on entry cards; gameplay appears on hover or keyboard focus. */
.image-wrap.title-cover{background:#080d16}
.card .title-cover>.card-image{object-fit:contain;padding:24px;filter:none;transform:none}
.cover-previews{position:absolute;inset:0;opacity:0;transition:opacity .25s;pointer-events:none;background:#080d16}
.cover-preview{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;opacity:0}
.title-cover:focus-visible .cover-previews{opacity:1}
.title-cover:focus-visible .cover-preview{animation:cover-preview-cycle 6s linear infinite;animation-delay:var(--preview-delay)}
@media(hover:hover){.title-cover:hover .cover-previews{opacity:1}.title-cover:hover .cover-preview{animation:cover-preview-cycle 6s linear infinite;animation-delay:var(--preview-delay)}}
@keyframes cover-preview-cycle{0%,30%,100%{opacity:1}33.333%,97%{opacity:0}}
.effects-paused .cover-preview{animation:none!important}.effects-paused .cover-preview:first-child{opacity:1}
@media(prefers-reduced-motion:reduce){.cover-previews{transition:none}.title-cover .cover-preview{animation:none!important}.cover-preview:first-child{opacity:1}}
