:root{--ink:#06070d;--night:#0c0f1f;--deep:#121733;--ember:#ff5a1f;--sun:#ffb547;--sea:#22d3c5;--sand:#f5efe6;--mist:#9aa3c7;--a:var(--ember);color-scheme:dark}
*{box-sizing:border-box}
html{background:var(--ink);color:var(--sand);font-family:'Bricolage Grotesque',ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased;scroll-behavior:smooth}
body{margin:0;min-height:100vh;background:radial-gradient(60rem 40rem at 50% -10%,rgba(47,85,255,.14),transparent 70%),radial-gradient(40rem 30rem at -10% 110%,rgba(255,90,31,.10),transparent 70%),var(--ink);padding-bottom:6rem;line-height:1.6}
img{max-width:100%;height:auto}
a{color:inherit}
::selection{background:var(--ember);color:var(--ink)}
:focus-visible{outline:2px solid var(--sun);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-999px;top:0;background:var(--sand);color:var(--ink);padding:.6rem 1rem;z-index:100}
.skip:focus{left:1rem;top:1rem}
.wrap{max-width:72rem;margin:0 auto;padding:0 1.25rem}
.top{position:sticky;top:0;z-index:50;padding:.75rem 1rem}
.bar{max-width:72rem;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.5rem .6rem .5rem 1.1rem;border-radius:999px;background:rgba(12,15,31,.7);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.brand img{display:block;height:2rem;width:auto}
.links{display:flex;gap:.25rem;list-style:none;margin:0;padding:0}
.links a{display:block;padding:.5rem .9rem;border-radius:999px;text-decoration:none;font-size:.9rem;color:rgba(245,239,230,.72);transition:color .2s}
.links a:hover,.links a[aria-current]{color:var(--sand)}
.links a[aria-current]{background:rgba(245,239,230,.1)}
.pill{background:var(--ember);color:var(--ink);font-weight:700;font-size:.85rem;padding:.55rem 1rem;border-radius:999px;text-decoration:none;white-space:nowrap}
@media(max-width:560px){.links li:not(:nth-child(2)){display:none}.pill{display:none}}
.kicker,.tag,.meta{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase}
.kicker{color:var(--ember);margin:0 0 1rem}
.tag{display:inline-block;color:var(--ink);background:var(--a);padding:.3rem .7rem;border-radius:999px;font-weight:600;letter-spacing:.1em;margin:0}
.meta{color:var(--mist);letter-spacing:.06em;text-transform:none;font-size:.8rem;margin:0}
h1,h2,h3{font-weight:700;letter-spacing:-.025em;line-height:1.08;margin:0}
em{font-family:'Instrument Serif',ui-serif,Georgia,serif;font-style:italic;font-weight:400}
.hero-list{padding-top:clamp(3rem,9vw,7rem);padding-bottom:clamp(2rem,5vw,4rem)}
.hero-list h1{font-size:clamp(2.4rem,7vw,5.2rem);max-width:16ch}
.lead{font-size:clamp(1.05rem,2.2vw,1.3rem);color:rgba(245,239,230,.72);max-width:44rem;margin:1.2rem 0 0}
.grid{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,21rem),1fr))}
.card{position:relative;border-radius:1.5rem;overflow:hidden;background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.1);transition:transform .3s,border-color .3s}
.card::before{content:'';position:absolute;inset:0 0 auto 0;height:5px;background:var(--a)}
.card::after{content:'';position:absolute;width:16rem;height:16rem;right:-6rem;top:-6rem;border-radius:50%;background:var(--a);opacity:.14;filter:blur(50px);pointer-events:none;transition:opacity .3s}
.card:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.28)}
.card:hover::after{opacity:.3}
.card-a{display:flex;flex-direction:column;gap:1rem;height:100%;padding:1.7rem 1.5rem 1.5rem;text-decoration:none;position:relative;z-index:1}
.card h2{font-size:1.45rem;line-height:1.15}
.card p{margin:0;color:rgba(245,239,230,.66);font-size:.97rem;flex:1}
.card .tag{align-self:flex-start}
.post-head{padding-top:clamp(2rem,6vw,4.5rem);padding-bottom:2rem;max-width:56rem}
.post-head h1{font-size:clamp(2rem,5.4vw,3.8rem);margin:1.1rem 0 0}
.post-head .meta{margin-top:1.4rem}
.crumbs{font-size:.85rem;color:var(--mist);margin-bottom:1.6rem}
.crumbs a{text-decoration:none}.crumbs a:hover{color:var(--sand)}
.crumbs span{opacity:.4;margin:0 .35rem}
.post-body{max-width:56rem}
.toc{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);border-radius:1.2rem;padding:1.2rem 1.4rem;margin:0 0 2.2rem}
.toc b{font-family:'JetBrains Mono',monospace;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--a)}
.toc ol{margin:.7rem 0 0;padding-left:1.2rem;display:grid;gap:.35rem;color:rgba(245,239,230,.78)}
.toc a{text-decoration:none}.toc a:hover{text-decoration:underline}
.prose{font-size:1.1rem;color:rgba(245,239,230,.86)}
.prose p{margin:0 0 1.2rem}
.prose h2{font-size:clamp(1.55rem,3.4vw,2.1rem);margin:2.8rem 0 1rem;scroll-margin-top:5.5rem}
.prose h2::before{content:'';display:block;width:2.4rem;height:4px;border-radius:4px;background:var(--a);margin-bottom:.9rem}
.prose h3{font-size:1.3rem;margin:1.9rem 0 .6rem;color:var(--sand)}
.prose ul,.prose ol{margin:0 0 1.4rem;padding-left:1.3rem;display:grid;gap:.55rem}
.prose li::marker{color:var(--a)}
.prose a{color:var(--sun);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.prose a:hover{color:var(--sand)}
.prose strong{color:var(--sand);font-weight:700}
.cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.2rem;margin:3rem 0 0;padding:1.6rem;border-radius:1.5rem;background:linear-gradient(120deg,rgba(255,90,31,.2),rgba(47,85,255,.18));border:1px solid rgba(255,255,255,.14)}
.cta div{display:grid;gap:.25rem}.cta b{font-size:1.2rem}.cta span{color:rgba(245,239,230,.7);font-size:.95rem}
.btn{display:inline-block;background:var(--sand);color:var(--ink);font-weight:700;padding:.85rem 1.5rem;border-radius:999px;text-decoration:none;transition:transform .2s}
.btn:hover{transform:scale(1.04)}
.btn.ghost{background:transparent;color:var(--sand);border:1px solid rgba(255,255,255,.3);margin-left:.4rem}
.more{padding-top:4rem}.more h2{font-size:1.6rem;margin-bottom:1.3rem}
.foot{margin-top:5rem;border-top:1px solid rgba(255,255,255,.1);padding-top:3rem;color:rgba(245,239,230,.6);font-size:.92rem}
.foot-in{display:grid;gap:2rem;grid-template-columns:1.3fr 1fr 1.3fr}
@media(max-width:760px){.foot-in{grid-template-columns:1fr}}
.foot-in img{height:2.2rem;width:auto}.foot-in p{margin:.8rem 0 0}
.foot nav{display:grid;gap:.4rem;align-content:start}.foot a{text-decoration:none}.foot a:hover{color:var(--sand);text-decoration:underline}
.copy{text-align:center;margin:2.5rem 0 0;padding-bottom:1.5rem;font-size:.8rem;opacity:.7}
.live{position:fixed;left:50%;bottom:max(1rem,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:60;display:flex;align-items:center;gap:.9rem;padding:.55rem 1.2rem .55rem .55rem;border-radius:999px;background:rgba(12,15,31,.82);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 12px 40px rgba(0,0,0,.5);max-width:calc(100vw - 1.5rem)}
.live button{width:2.9rem;height:2.9rem;border-radius:50%;border:0;background:var(--ember);cursor:pointer;display:grid;place-items:center;flex:none}
.live .ic{width:0;height:0;border-style:solid;border-width:.5rem 0 .5rem .85rem;border-color:transparent transparent transparent var(--ink);margin-left:.2rem}
.is-playing .live .ic{width:.85rem;height:.9rem;border:0;margin:0;background:linear-gradient(90deg,var(--ink) 0 36%,transparent 36% 64%,var(--ink) 64%)}
.live-t{display:grid;line-height:1.2;min-width:0}.live-t b{font-size:.92rem}.live-t span{font-size:.75rem;color:var(--mist);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.eq{display:flex;align-items:flex-end;gap:2px;height:1.1rem}.eq i{width:3px;height:30%;background:var(--ember);border-radius:2px}
.is-playing .eq i{animation:eq .9s ease-in-out infinite}.eq i:nth-child(2){animation-delay:.2s}.eq i:nth-child(3){animation-delay:.4s}.eq i:nth-child(4){animation-delay:.1s}
@keyframes eq{0%,100%{height:25%}50%{height:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card,.btn{transition:none}.is-playing .eq i{animation:none;height:70%}}