:root{--page:#f3f4f6;--surface:#fff;--ink:#262e42;--ink-2:#5b6577;--muted:#9aa0ab;--hairline:#dfe1e6;--border:#262e421f;--accent:#4a6fa5;--brand:#eeb63f}*{box-sizing:border-box}body{background:var(--page);color:var(--ink);margin:0;font:15px/1.6 Poppins,system-ui,-apple-system,Segoe UI,sans-serif}a{color:var(--accent)}.masthead{text-align:center;max-width:880px;margin:0 auto;padding:3.2rem 2.1rem 1.2rem}.logo{border-radius:16px;width:72px;height:72px;display:inline-block}.masthead h1{letter-spacing:-.02em;color:#cc6137;margin:.8rem 0 .2rem;font-size:2.4rem;font-weight:800}.masthead h1 .dot{color:#333}.masthead h1 .io{color:#eeb63f}.tagline{color:var(--ink-2);margin:0;font-size:1.05rem;font-weight:700}.intro{max-width:560px;color:var(--ink-2);margin:.9rem auto 0}.whoami{max-width:560px;color:var(--ink-2);margin:1.1rem auto 0;font-size:.98rem}.whoami strong{color:var(--ink);font-weight:700}@media (width<=460px){.whoami .sep{height:0;display:block;overflow:hidden}}.work{width:100%;max-width:1160px;margin:0 auto 2.2rem;padding:0 2.1rem}.work h2{color:var(--ink);margin:0 0 .55rem;font-size:1.05rem;font-weight:700}.work p{color:var(--ink-2);margin:0 0 .7rem}.gate{background:var(--surface);border:1px solid var(--border);border-radius:12px;margin:1rem 0 1.2rem;padding:1rem 1.1rem}.gate svg{width:100%;height:auto;display:block}.gate .box rect{fill:var(--page);stroke:var(--border);stroke-width:1px}.gate .box text{text-anchor:middle;fill:var(--ink);font-size:13px;font-weight:600}.gate .arrow{stroke:var(--muted);stroke-width:1.5px;fill:none;marker-end:url(#ah)}.gate .loop{stroke:var(--muted);stroke-width:1.5px;stroke-dasharray:4 3;fill:none;marker-end:url(#ah)}.gate .looplabel{font-size:10.5px}.gate .looplabel .mark{fill:var(--brand)}.gate .looplabel .gated{fill:var(--ink);letter-spacing:.04em;text-anchor:middle;font-weight:700}.gate .looplabel .rest.end{text-anchor:end}.gate .looplabel .rest{fill:var(--muted);text-anchor:start;stroke:var(--surface);stroke-width:4px;paint-order:stroke fill}@media (width<=720px){.gate{overflow-x:auto}.gate svg{width:680px}}.cards{grid-template-columns:repeat(12,1fr);gap:1rem;max-width:1160px;margin:1.6rem auto 2rem;padding:0 2.1rem;display:grid}.card{grid-column:span 4}.card:nth-child(-n+4){grid-column:span 3}@media (width<=1100px){.cards{grid-template-columns:repeat(2,1fr)}.card,.card:nth-child(-n+4){grid-column:auto}}@media (width<=660px){.cards{grid-template-columns:1fr}}.card{background:var(--surface);border:1px solid var(--border);color:var(--ink);border-radius:12px;flex-direction:column;padding:1.1rem 1.2rem 1rem;text-decoration:none;transition:border-color .15s,transform .15s;display:flex}.card:hover{border-color:var(--brand);transform:translateY(-2px)}.card .domain{letter-spacing:.01em;color:var(--ink);background:var(--brand);font-variant-numeric:tabular-nums;border-radius:7px;align-self:flex-start;padding:.22rem .65rem;font-size:.82rem;font-weight:700;display:inline-block}.card h2{letter-spacing:-.01em;margin:.45rem 0 .15rem;font-size:1.25rem;font-weight:800}.card .tag{color:var(--muted);font-size:.8rem}.card p{color:var(--ink-2);flex:1;margin:.6rem 0 .8rem}.card .go{color:var(--ink);font-size:.85rem;font-weight:800}.card:hover .go{color:var(--brand)}.card--seasonal{--ecto:#6ef3b5;--ecto-2:#9b7cf0;color:#e8ecf6;background:linear-gradient(165deg, #1a2137, #0f1424) padding-box, linear-gradient(115deg, var(--ecto), var(--ecto-2), var(--ecto), var(--ecto-2)) border-box;background-position:0 0,0 0;background-size:auto,300% 100%;border:2px solid #0000;animation:14s linear infinite ectoplasm;position:relative;overflow:hidden}@keyframes ectoplasm{to{background-position:0 0,300% 0}}.card--seasonal:hover{border-color:#0000;box-shadow:0 0 22px #6ef3b547}.card--seasonal .domain{color:#0d1322;background:var(--ecto)}.card--seasonal h2{color:#f2f5fb;text-shadow:0 0 14px #6ef3b573}.card--seasonal .tag{color:var(--ecto)}.card--seasonal p{color:#b9c2d6}.card--seasonal .go{color:var(--ecto)}.card--seasonal:hover .go{color:#fff}.spook{width:58px;height:58px;fill:var(--ecto);opacity:.17;pointer-events:none;animation:6s ease-in-out infinite drift;position:absolute;top:.75rem;right:.85rem}.spook .eye{fill:#0d1322}@keyframes drift{50%{transform:translateY(-7px)rotate(-4deg)}}.card--seasonal:hover .spook{opacity:.3}@media (prefers-reduced-motion:reduce){.card--seasonal,.spook{animation:none}}footer{border-top:1px solid var(--hairline);background:var(--surface);text-align:center;color:var(--muted);padding:1rem 2.1rem 1.4rem;font-size:.85rem}html{height:100%}body{flex-direction:column;min-height:100vh;display:flex}body>footer{margin-top:auto}.colophon{opacity:.85;margin-top:.35rem;font-size:.78rem}
