:root{--parchment: #f3ead8;--parchment-dim: rgba(243, 234, 216, .72);--lichen: #c9d29a;--glass: rgba(16, 20, 17, .38);--glass-edge: rgba(243, 234, 216, .16);--serif: "Fraunces", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;--mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace}html,body{margin:0;height:100%;overflow:hidden;background:#161b17;font-family:var(--serif);color:var(--parchment);-webkit-font-smoothing:antialiased}canvas{display:block}#intro{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;background:radial-gradient(ellipse 60% 46% at 50% 48%,rgba(8,12,9,.5),rgba(8,12,9,.12) 70%,transparent);transition:opacity 2.2s ease}#intro.hidden{opacity:0}.plate{display:flex;flex-direction:column;align-items:center;padding:0 16px;text-align:center;text-shadow:0 1px 18px rgba(0,0,0,.45)}.plate>*{margin:0;animation:rise 1.6s cubic-bezier(.2,.7,.2,1) both}.plate>:nth-child(2){animation-delay:.12s}.plate>:nth-child(3){animation-delay:.22s}.plate>:nth-child(4){animation-delay:.4s}.plate>:nth-child(5){animation-delay:.55s}@keyframes rise{0%{opacity:0;transform:translateY(10px);filter:blur(4px)}}.overline,.coords,#status,.enter{font-family:var(--mono);font-size:.72rem;font-weight:400;letter-spacing:.28em;text-transform:uppercase;color:var(--parchment-dim)}.overline span,.coords span{margin:0 .5em;color:var(--lichen)}.fir{width:120px;height:24px;margin:.9rem 0 .2rem;overflow:visible}.fir path:first-child{fill:none;stroke:var(--parchment-dim);stroke-width:.75}.fir path:last-child{fill:var(--lichen)}#intro h1{font-size:clamp(3.2rem,11vw,8rem);font-weight:330;font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1;line-height:.95;letter-spacing:.02em}.tagline{margin-top:.5rem!important;font-size:clamp(1.05rem,2.4vw,1.35rem);font-style:italic;font-weight:300;font-variation-settings:"opsz" 24,"SOFT" 100;color:var(--parchment)}.coords{margin-top:1.2rem!important;font-size:.66rem}#status{min-height:1.4em;margin-top:1.6rem!important}#status:empty{display:none}.enter{display:none;margin-top:1.8rem!important;padding-bottom:.35em;border-bottom:1px solid rgba(201,210,154,.5);color:var(--parchment)}#intro.ready .enter{display:block;animation:rise 1.2s ease both,breathe 3.2s ease-in-out 1.2s infinite}@keyframes breathe{50%{opacity:.45}}.keys{position:absolute;bottom:max(22px,env(safe-area-inset-bottom));left:50%;display:flex;flex-wrap:wrap;justify-content:center;gap:.5em 1.5em;width:max-content;max-width:calc(100vw - 32px);box-sizing:border-box;margin:0;padding:.7em 1.5em;list-style:none;font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:lowercase;color:var(--parchment-dim);background:var(--glass);border:1px solid var(--glass-edge);border-radius:999px;backdrop-filter:blur(12px) saturate(1.3);-webkit-backdrop-filter:blur(12px) saturate(1.3);transform:translate(-50%);opacity:0;transition:opacity 1.2s ease .6s}#intro.ready .keys{opacity:1}.keys li{display:flex;align-items:center;gap:.3em;white-space:nowrap}kbd{display:inline-flex;align-items:center;justify-content:center;min-width:1.9em;height:1.9em;padding:0 .45em;box-sizing:border-box;font-family:var(--mono);font-size:.92em;font-weight:500;letter-spacing:0;text-transform:none;color:var(--parchment);background:#f3ead814;border:1px solid rgba(243,234,216,.26);border-radius:5px;box-shadow:inset 0 -1.5px #00000059}.keys li kbd+kbd{margin-left:-.1em}.keys li kbd:not(:first-child):not(kbd+kbd){margin-left:.6em}#stats{position:fixed;top:12px;left:12px;padding:6px 10px;font:11px/1.5 var(--mono);letter-spacing:.04em;color:var(--parchment-dim);background:var(--glass);border:1px solid var(--glass-edge);border-radius:8px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);white-space:pre;font-variant-numeric:tabular-nums;pointer-events:none;z-index:10}#stats.slow{color:#e8a87c}#credit{position:fixed;top:max(14px,env(safe-area-inset-top));right:16px;margin:0;font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;color:var(--parchment-dim);text-shadow:0 1px 10px rgba(0,0,0,.5);z-index:10;animation:rise 1.6s cubic-bezier(.2,.7,.2,1) .7s both}#credit a{color:var(--parchment);text-decoration:none;border-bottom:1px solid rgba(201,210,154,.5);transition:color .2s ease,border-color .2s ease}#credit a:hover,#credit a:focus-visible{color:var(--lichen);border-color:var(--lichen);outline:none}body.no-ui #intro,body.no-ui #credit,body.no-ui #stats{display:none}@media (max-width: 600px){.keys{border-radius:18px;gap:.5em 1em;padding:.7em 1em}.overline,.coords{letter-spacing:.18em}}@media (prefers-reduced-motion: reduce){.plate>*,#intro.ready .enter,#credit{animation:none}}
