:root{color-scheme:dark;--paper:#090a0b;--ink:#f6f6f4;--muted:#a4a6ad;--line:#303237;--field:#111216;font-family:Arial,Helvetica,sans-serif;font-size:16px;background:var(--paper);color:var(--ink)}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}button,input{border-radius:0}button:focus-visible,input:focus-visible{outline:2px solid var(--ink);outline-offset:5px}button{touch-action:manipulation}[hidden]{display:none!important}
.page{width:min(100%,1600px);min-height:100svh;margin:0 auto;padding:32px 48px 25px;display:flex;flex-direction:column}
.masthead,footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;color:var(--muted);font:400 .75rem/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.13em}
.entry-number{display:flex;align-items:center;gap:14px}.entry-number>span{width:24px;height:1px;background:var(--muted)}
main{flex:1;width:100%;padding:60px 0 66px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}
.identity{width:100%}.emblem{width:clamp(150px,20vh,208px);aspect-ratio:1;margin:0 auto 28px}.emblem svg{display:block;width:100%;height:100%;overflow:visible;color:var(--ink)!important}
.wordmark{margin:0 auto;width:clamp(170px,26vw,224px);font-size:1rem}.wordmark img{display:block;width:100%;height:auto}
.strapline{font-size:clamp(1.125rem,2.3vw,1.6rem);font-weight:400;line-height:1.45;letter-spacing:-.025em;margin:28px 0 0}
.puzzle,.reveal{width:min(100%,450px);margin-top:43px;border-top:1px solid var(--line);padding-top:25px}
.message-trigger{display:block;width:100%;border:0;background:transparent;color:var(--ink);padding:9px 0}
.cipher{display:flex;justify-content:center;flex-wrap:wrap;column-gap:.7em;font:400 1.0625rem/1.9 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.12em}
.message-action{display:block;margin-top:16px;font:400 .75rem/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.message-trigger:hover .message-action{color:var(--ink)}
.decoder{text-align:left;margin-top:25px}.key{text-align:center;font-size:.875rem;line-height:1.6;color:var(--muted);margin:0 0 24px}
label{display:block;font-size:.875rem;line-height:1.5;color:var(--muted);margin-bottom:9px}.answer-row{display:flex;gap:9px}
input{min-width:0;width:100%;background:var(--field);border:1px solid #484b53;color:var(--ink);padding:12px;font-size:1rem;line-height:1.5}
.enter{border:1px solid var(--ink);color:var(--paper);background:var(--ink);padding:10px 23px;font-size:.875rem;min-height:49px}.enter:hover{background:#dcdedc}
.answer-status{min-height:1.5em;margin:10px 0 0;font-size:.875rem;line-height:1.5}.hint-button,.reset{display:block;min-height:44px;padding:9px 0;border:0;background:transparent;color:var(--muted);font-size:.875rem;line-height:1.5;text-decoration:underline;text-underline-offset:5px}.hint-button:hover,.reset:hover{color:var(--ink)}.hint-button:disabled{cursor:default;text-decoration:none}
.hints{color:var(--muted);font-size:.875rem;line-height:1.65;padding-left:21px;margin:0}.hints li{padding:5px 0}
.reveal-code{font:400 .75rem/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.14em;color:var(--muted);margin:2px 0 20px}
.reveal h2{font-size:clamp(1.4rem,3vw,1.75rem);font-weight:400;line-height:1.35;letter-spacing:-.02em;margin:0 0 19px}.reveal h2:focus{outline:none}.welcome{font-size:1rem;line-height:1.7;color:var(--muted);margin:0}.reset{margin:23px auto 0}
footer{border-top:1px solid var(--line);padding-top:20px;font-size:.75rem}.footer-status{letter-spacing:.09em}
.arc{transition:transform 1s cubic-bezier(.2,.7,.2,1);transform-box:view-box;transform-origin:center}.sigil{transition:opacity 1s ease}
.is-solved .arc-ne{transform:translate(18px,-18px)}.is-solved .arc-se{transform:translate(18px,18px)}.is-solved .arc-sw{transform:translate(-18px,18px)}.is-solved .arc-nw{transform:translate(-18px,-18px)}.is-solved .sigil{opacity:.78}
.reveal:not([hidden]){animation:reveal .75s ease both}@keyframes reveal{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.noscript{font-size:.875rem;line-height:1.6;color:var(--muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:600px){.page{padding:25px 24px 21px}main{padding:48px 0 48px}.emblem{width:154px;margin-bottom:25px}.wordmark{width:184px}.strapline{margin-top:25px}.puzzle,.reveal{margin-top:34px}.cipher{font-size:1rem;letter-spacing:.08em}footer{justify-content:center;text-align:center;row-gap:9px}footer>span:first-child{width:100%}.enter{padding:10px 17px}}
@media(max-width:360px){.page{padding-left:20px;padding-right:20px}.masthead{font-size:.6875rem}.strapline{font-size:1.0625rem}.cipher{font-size:.9375rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Signal, assembly and discovery */
#signal-field,.signal-shade{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}.signal-shade{background:radial-gradient(ellipse at 50% 44%,transparent 10%,#090a0b66 65%,#090a0bdd 100%)}.page{position:relative;z-index:1}
.emblem{display:block;position:relative;padding:0;border:0;background:none;color:var(--ink);margin-bottom:38px;transform:perspective(700px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .35s ease,filter .8s ease}.emblem:hover,.is-focused .emblem{filter:drop-shadow(0 0 16px #ffffff35)}
.footer-controls{display:flex;align-items:center;gap:24px}#motion-toggle{border:0;background:none;color:var(--muted);font:inherit;letter-spacing:inherit;padding:8px 0;min-height:40px}#motion-toggle:hover{color:var(--ink)}#motion-toggle:disabled{cursor:default}
.motion-enabled .masthead{animation:arrive 1s .1s both}.motion-enabled .emblem svg{animation:assemble 1.7s cubic-bezier(.2,.7,.2,1) both}.motion-enabled .arc{stroke-dasharray:295;animation:trace 1.5s cubic-bezier(.2,.7,.2,1) both}.motion-enabled .arc-se{animation-delay:.13s}.motion-enabled .arc-sw{animation-delay:.26s}.motion-enabled .arc-nw{animation-delay:.39s}.motion-enabled .sigil{transform-origin:center;animation:core 1.3s .3s both}.motion-enabled .wordmark{animation:wordmark-in 1.2s .5s both}.motion-enabled .strapline{animation:arrive 1.2s .8s both}.motion-enabled .puzzle{animation:arrive 1.2s 1s both}.motion-enabled footer{animation:arrive 1.2s 1.2s both}
.is-focused .arc-ne{transform:translate(10px,-10px)}.is-focused .arc-se{transform:translate(10px,10px)}.is-focused .arc-sw{transform:translate(-10px,10px)}.is-focused .arc-nw{transform:translate(-10px,-10px)}
.is-unlocking .arc-ne,.is-solved .arc-ne{transform:translate(48px,-48px)}.is-unlocking .arc-se,.is-solved .arc-se{transform:translate(48px,48px)}.is-unlocking .arc-sw,.is-solved .arc-sw{transform:translate(-48px,48px)}.is-unlocking .arc-nw,.is-solved .arc-nw{transform:translate(-48px,-48px)}.is-unlocking .emblem,.is-solved .emblem{filter:drop-shadow(0 0 25px #ffffff55)}
.answer-row.is-wrong{animation:shake .32s ease}.reveal:not([hidden]){animation:reveal .9s ease both}.motion-off *{animation:none!important;transition:none!important}.motion-off .emblem{transform:none}
@keyframes arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes assemble{from{opacity:0;transform:rotate(-42deg) scale(.8)}to{opacity:1;transform:rotate(0) scale(1)}}@keyframes trace{from{stroke-dashoffset:295}to{stroke-dashoffset:0}}@keyframes core{from{opacity:0;transform:scale(.75)}to{opacity:1;transform:scale(1)}}@keyframes wordmark-in{from{opacity:0;clip-path:inset(0 50%)}to{opacity:1;clip-path:inset(0)}}@keyframes shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}

/* A quiet input; a deliberate unlock. */
.decoder{margin-top:28px}.key{font-size:.9375rem;margin-bottom:26px;line-height:1.6}
#cipher-form label{font:400 .75rem/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.12em;text-transform:uppercase;color:#b9bbc2;margin-bottom:12px}
.answer-row{position:relative;gap:0;align-items:center;padding:5px 6px 5px 16px;background:linear-gradient(120deg,#ffffff08,#ffffff02);border:1px solid #ffffff24;border-radius:8px;transition:border-color .3s,box-shadow .3s,background .3s}
.answer-row:focus-within{border-color:#ffffff77;box-shadow:0 0 0 3px #ffffff05,0 8px 40px #00000022;background:linear-gradient(120deg,#ffffff0c,#ffffff03)}
#answer{background:transparent;border:0;padding:13px 12px 13px 0;font-size:1rem;line-height:1.5;letter-spacing:.005em;outline:none;box-shadow:none}#answer::placeholder{color:#83868e;font-size:.9375rem;letter-spacing:0}#answer:focus-visible{outline:none}
.enter{display:flex;align-items:center;justify-content:center;gap:10px;flex-shrink:0;min-height:44px;border:0;border-radius:5px;padding:12px 14px;background:#ffffff0b;color:var(--ink);font-size:.8125rem;letter-spacing:.035em;transition:background .25s,box-shadow .25s}.enter:hover{background:#ffffff1c;box-shadow:inset 0 0 0 1px #ffffff16}.enter svg{flex-shrink:0;opacity:.7}.enter:disabled{cursor:default;opacity:.45}.answer-status{margin-top:12px}.hint-button{font-size:.8125rem;text-decoration:none;color:#a4a6ad}.hint-button:hover{text-decoration:underline}.hints{font-size:.875rem}
.motion-enabled.is-unlocking .emblem{transform:none;transition:transform .4s;filter:drop-shadow(0 0 34px #ffffff66)}
.motion-enabled.is-unlocking .emblem svg{animation:unlock-turn 2.8s cubic-bezier(.65,0,.25,1) both}
.motion-enabled.is-unlocking .arc{animation:unlock-ring 2.8s ease both;stroke-dashoffset:0;transform:translate(0,0)}
.motion-enabled.is-unlocking .arc-ne{--open-x:64px;--open-y:-64px}.motion-enabled.is-unlocking .arc-se{--open-x:64px;--open-y:64px}.motion-enabled.is-unlocking .arc-sw{--open-x:-64px;--open-y:64px}.motion-enabled.is-unlocking .arc-nw{--open-x:-64px;--open-y:-64px}
.motion-enabled.is-unlocking .sigil{animation:unlock-core 2.8s ease both}.motion-enabled.is-unlocking .puzzle{animation:decipher-out 2.8s ease both}.is-unlocking .decoder{opacity:.35;transition:opacity .5s;pointer-events:none}.is-unlocking .cipher{color:#fff;text-shadow:0 0 20px #ffffff55}
.is-solved .emblem svg{animation:none;transform:rotate(90deg)}.is-solved .arc{animation:none;stroke-dashoffset:0}.is-solved .sigil{animation:none;opacity:1}.is-solved .emblem{filter:drop-shadow(0 0 20px #ffffff33)}
.motion-enabled .reveal:not([hidden]){animation:reveal-surface 1.2s ease both}.motion-enabled .reveal:not([hidden]) .reveal-code{animation:reveal-line 1.1s .15s both}.motion-enabled .reveal:not([hidden]) h2{animation:reveal-line 1.3s .35s both}.motion-enabled .reveal:not([hidden]) .welcome{animation:reveal-line 1.3s .6s both}.motion-enabled .reveal:not([hidden]) .reset{animation:arrive 1s .9s both}
@keyframes unlock-turn{0%{transform:rotate(0) scale(1)}35%{transform:rotate(-12deg) scale(.88)}62%{transform:rotate(90deg) scale(1.08)}100%{transform:rotate(90deg) scale(1)}}
@keyframes unlock-ring{0%,28%{transform:translate(0,0);opacity:1}42%{transform:translate(calc(var(--open-x)*-.1),calc(var(--open-y)*-.1));opacity:.6}70%{transform:translate(var(--open-x),var(--open-y));opacity:1}100%{transform:translate(calc(var(--open-x)*.75),calc(var(--open-y)*.75));opacity:1}}
@keyframes unlock-core{0%{transform:scale(1);opacity:1}35%{transform:scale(.8);opacity:.4}58%{transform:scale(1.05);opacity:1}100%{transform:scale(1);opacity:1}}
@keyframes decipher-out{0%,68%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(14px)}}
@keyframes reveal-surface{from{border-color:transparent;opacity:0}to{border-color:var(--line);opacity:1}}
@keyframes reveal-line{from{opacity:0;transform:translateY(12px);filter:blur(5px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
@media(max-width:380px){.answer-row{padding-left:12px}.enter{padding:12px 10px;gap:7px}.enter svg{width:15px}#answer::placeholder{font-size:.8125rem}}
