:root{--ink: #0a0a0b;--line: #26262a;--fog: #8a8a90;--paper: #ececea;--amber: #ffb000;--pad: clamp(20px, 4vw, 48px);--mono: "IBM Plex Mono", ui-monospace, monospace}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}body{background:var(--ink);color:var(--paper);font-family:Archivo,system-ui,sans-serif;overflow:hidden;cursor:crosshair}#root{display:flex;flex-direction:column}.ribbon-bg{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;opacity:0;animation:appear 2s ease-out .4s forwards}.frame,.crosshair{z-index:1}.corner{position:fixed;width:22px;height:22px;border:0 solid var(--fog);opacity:0;animation:appear .6s ease-out .2s forwards}.corner-tl{top:var(--pad);left:var(--pad);border-top-width:1px;border-left-width:1px}.corner-tr{top:var(--pad);right:var(--pad);border-top-width:1px;border-right-width:1px}.corner-bl{bottom:var(--pad);left:var(--pad);border-bottom-width:1px;border-left-width:1px}.corner-br{bottom:var(--pad);right:var(--pad);border-bottom-width:1px;border-right-width:1px}.ruler{position:fixed;left:50%;transform:translate(-50%);width:min(38vw,420px);height:6px;background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 14px);opacity:0;animation:appear .8s ease-out .5s forwards}.ruler-top{top:var(--pad)}.ruler-bottom{bottom:var(--pad)}.crosshair{pointer-events:none}.crosshair-x,.crosshair-y{position:fixed;background:var(--line);opacity:0;transition:opacity .5s ease}.crosshair-x{left:0;width:100vw;height:1px;top:-10px}.crosshair-y{top:0;height:100vh;width:1px;left:-10px}body.tracking .crosshair-x,body.tracking .crosshair-y{opacity:.5}.top,.bottom{position:fixed;left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;align-items:baseline;z-index:2}.top{top:var(--pad);align-items:flex-start}.bottom{bottom:var(--pad);align-items:flex-end}.brand{display:flex;flex-direction:column;gap:14px}.brand-name{font-variation-settings:"wdth" 125;font-weight:700;font-size:clamp(56px,10.5vw,170px);line-height:.8;letter-spacing:.01em;margin-left:-.05em;color:var(--paper);opacity:0;animation:appear 1.2s ease-out .9s forwards}.contact{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--fog);text-decoration:none;line-height:1;padding:0 2px 6px;border-bottom:1px solid transparent;transition:color .25s ease,border-color .25s ease;opacity:0;animation:appear .9s ease-out 1.1s forwards}.contact:hover{color:var(--paper);border-color:var(--paper)}.contact:focus-visible{outline:1px solid var(--amber);outline-offset:4px}.status,.copyright{font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--fog);opacity:0;animation:appear .9s ease-out 1.3s forwards}.led{display:inline-block;width:6px;height:6px;margin-right:9px;border-radius:50%;background:var(--amber);box-shadow:0 0 8px #ffb000b3;animation:blink 2.6s ease-in-out infinite;vertical-align:1px}.stage{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(22px,4vh,38px);text-align:center;padding:0 var(--pad);pointer-events:none}.mark{width:42px;height:auto;filter:invert(1);opacity:0;transform:scale(.92);animation:mark-in 1.1s cubic-bezier(.2,.7,.2,1) .35s forwards}@keyframes appear{to{opacity:1}}@keyframes mark-in{to{opacity:1;transform:scale(1)}}@keyframes blink{0%,to{opacity:1}50%{opacity:.25}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-delay:0s!important;animation-iteration-count:1!important}.crosshair{display:none}.ribbon-bg,.mark,.corner,.ruler,.brand-name,.contact,.status,.copyright{opacity:1;transform:none}}@media(max-width:560px){.bottom{flex-direction:column;gap:16px;align-items:flex-start}}