
:root{--paper:#f7f3eb;--ink:#292820;--muted:#68665d;--line:#d4cec1;--accent:#9e3729;color:var(--ink);background:var(--paper);font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:6px}a:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:6px}.skip{position:absolute;top:-80px;left:20px;background:var(--paper);padding:14px;z-index:5}.skip:focus{top:8px}.masthead{max-width:1320px;margin:auto;padding:25px 48px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line)}.brand{display:block;flex-shrink:0}.logo{position:relative;display:block;width:112px;aspect-ratio:310/104;}.logo img{display:block;width:100%;height:auto;max-width:100%;position:static}nav{display:flex;align-items:center;gap:32px;font-size:13px}nav a{text-decoration:none;padding-block:12px}nav a:hover{text-decoration:underline}.hero{text-align:center;padding:70px 24px 0;overflow:hidden}.eyebrow{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 26px}.hero h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(48px,7.4vw,104px);font-weight:400;line-height:1.04;letter-spacing:-.055em;margin:0 auto 26px;max-width:1100px}.hero h1 em{font-weight:400;color:var(--accent)}.intro{max-width:490px;margin:0 auto;color:var(--muted);font-size:16px;line-height:1.7}.hero-actions{display:flex;justify-content:center;align-items:center;gap:26px;flex-wrap:wrap;margin:28px 0 18px}.enter{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:46px;padding:12px 22px;border-radius:999px;background:var(--ink);color:var(--paper);font-size:13px;text-decoration:none}.enter:hover{background:var(--accent)}.quiet{font-size:13px;min-height:44px;display:inline-flex;align-items:center}.orb{margin:26px auto 0;width:clamp(240px,29vw,370px)}.orb img{clip-path:circle(45.9% at 50% 50%);display:block;width:100%;height:auto;mix-blend-mode:multiply}.orb figcaption{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:12px}.story{max-width:1120px;margin:66px auto 0;padding:0 40px}.chapter{border-top:1px solid var(--line);padding:42px 0 56px}.chapter-heading{display:flex;align-items:center;gap:18px;margin-bottom:24px}.number{font:12px Georgia,serif;color:var(--accent)}.chapter-heading p{margin:0;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}h2{font:400 clamp(32px,4.3vw,56px)/1.12 Georgia,serif;letter-spacing:-.035em;max-width:770px;margin:0 0 22px}.body-copy{max-width:580px;font-size:16px;color:var(--muted);line-height:1.8;margin:0}.relation{margin:36px 0 8px;display:flex;align-items:center;gap:clamp(20px,5vw,70px);flex-wrap:wrap}.identity{display:flex;flex-direction:column;gap:14px}.identity b{font:400 clamp(34px,5vw,60px) Georgia,serif}.identity small{font-size:12px;color:var(--muted)}.flow{color:var(--accent);font-size:36px}.closing{text-align:center;padding:60px 24px 70px;border-top:1px solid var(--line)}.closing h2{margin:0 auto 26px}.closing p{color:var(--muted);font-size:14px;margin:0 0 24px}footer{max-width:1320px;border-top:1px solid var(--line);margin:auto;padding:24px 48px 32px;display:flex;gap:20px;justify-content:space-between;align-items:center;font-size:11px;color:var(--muted);line-height:1.6}footer p{margin:0}footer a{white-space:nowrap}@media(max-width:600px){.masthead{padding:18px 20px;gap:16px}nav{gap:20px}nav a:first-child{display:none}.logo{width:94px}.hero{padding-top:48px}.hero h1{font-size:clamp(42px,10vw,60px)}.eyebrow{font-size:10px;margin-bottom:22px}.intro{font-size:15px;max-width:340px}.orb{margin-top:18px;width:260px}.story{margin-top:46px;padding:0 24px}.chapter{padding:32px 0 40px}.body-copy{font-size:15px}.closing{padding:42px 24px}footer{padding:24px;align-items:flex-start;flex-direction:column}.hero-actions{gap:16px}.relation{gap:28px}}@media(forced-colors:active){.logo{display:none}.brand::after{content:'KEP';font-weight:bold}.enter{border:1px solid ButtonText}}

/* Static feathering; only the image transform animates. */
.hero{position:relative;isolation:isolate;min-height:640px;padding:100px 24px 130px;display:flex;flex-direction:column;justify-content:center}
.hero>:not(.orb-atmosphere){position:relative;z-index:1}
.orb-atmosphere{position:absolute;z-index:0;pointer-events:none;width:clamp(580px,78vw,1000px);aspect-ratio:1;left:50%;top:52%;transform:translate(-50%,-50%);opacity:.13;mix-blend-mode:multiply;mask-image:radial-gradient(circle,#000 15%,#0009 34%,transparent 67%)}
.orb-atmosphere img{display:block;width:100%;height:auto;animation:orb-current 48s linear infinite;animation-play-state:paused}
.hero.motion-running .orb-atmosphere img{animation-play-state:running}
@keyframes orb-current{0%{transform:translate(-1%,1%) rotate(-12deg) scale(1)}50%{transform:translate(1%,-1%) rotate(168deg) scale(1.04)}100%{transform:translate(-1%,1%) rotate(348deg) scale(1)}}
.hero>.motion-control{position:absolute;right:32px;bottom:18px;min-height:44px;padding:10px 12px;background:transparent;border:0;font:11px Arial,sans-serif;color:var(--muted);cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.motion-control:hover{color:var(--ink)}.motion-control:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.motion-control[hidden]{display:none}
.story{margin-top:0}
@media(max-width:600px){.hero{min-height:560px;padding:76px 24px 100px}.orb-atmosphere{width:660px;opacity:.11}.hero>.motion-control{right:12px;bottom:12px}}
@media(prefers-reduced-motion:reduce){.orb-atmosphere img{animation:none}.hero>.motion-control{display:none}}
@media(forced-colors:active){.orb-atmosphere,.hero>.motion-control{display:none}}

.paper-link{margin:24px 0 0}

.lab-attribution{display:flex;flex-direction:column;gap:10px;align-items:flex-start}.lab-attribution>span{font:11px/1.5 Arial,sans-serif;color:inherit}.lab-logo{display:block;position:relative;width:190px;max-width:100%;aspect-ratio:470/110;}.lab-logo img{display:block;width:100%;height:auto;max-width:100%;position:static}.lab-attribution-light .lab-logo{}@media(forced-colors:active){.lab-logo img{display:none}.lab-logo{width:auto;aspect-ratio:470/110}.lab-logo::after{content:"CyberAlchemy Lab"}}
