:root{color:#111827;background:#f8fafc;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-height:100vh;margin:0;overflow-x:hidden}button{font:inherit}.app{--accent:#3563ff;--surface:#f7f9ff;--ink:#111827;--font:Inter, ui-sans-serif, system-ui;min-height:100vh;color:var(--ink);background:radial-gradient(circle at 20% 10%, color-mix(in srgb, var(--accent), transparent 82%), transparent 34rem), linear-gradient(135deg, var(--surface), #fff 62%);font-family:var(--font);grid-template-rows:1fr auto;grid-template-columns:minmax(240px,330px) 1fr;gap:clamp(1rem,3vw,3rem);padding:clamp(1rem,3vw,3rem);transition:background 1.6s,color 1.6s,grid-template-columns 1.6s,filter .6s;display:grid}.brandPanel,.hero,.district,footer{border:1px solid color-mix(in srgb, var(--ink), transparent 88%);background:color-mix(in srgb, white, var(--surface) 32%);transition:transform 1.6s,border-radius 1.6s,background 1.6s,box-shadow 1.6s;box-shadow:0 24px 80px #0f172a14}.brandPanel{border-radius:28px;flex-direction:column;grid-row:1/span 2;gap:1.4rem;min-height:calc(100vh - 6rem);padding:1.25rem;display:flex}.logo{letter-spacing:-.035em;font-size:clamp(1.35rem,2vw,2.2rem);font-weight:900;line-height:.9}.byline{color:color-mix(in srgb, var(--ink), transparent 42%);font-size:.9rem}nav{flex-direction:column;gap:.55rem;margin-top:1rem;display:flex}nav span{background:color-mix(in srgb, var(--accent), transparent 91%);border-radius:999px;padding:.7rem .8rem}.meter{gap:.7rem;margin-top:auto;display:grid}.meterTop{justify-content:space-between;align-items:center;display:flex}.bar{background:color-mix(in srgb, var(--ink), transparent 90%);border-radius:99px;height:9px;overflow:hidden}.bar i{background:var(--accent);border-radius:inherit;height:100%;transition:width 1.2s;display:block}.meter small{color:color-mix(in srgb, var(--ink), transparent 45%);line-height:1.45}.hero{cursor:pointer;border-radius:36px;flex-direction:column;justify-content:center;min-height:56vh;padding:clamp(2rem,6vw,6rem);display:flex}.kicker{text-transform:uppercase;letter-spacing:.14em;color:var(--accent);font-size:.75rem;font-weight:800}h1{letter-spacing:-.018em;text-rendering:optimizelegibility;font-feature-settings:"kern" 1;max-width:12ch;margin:.35rem 0 1rem;font-size:clamp(4.4rem,11vw,11rem);line-height:.94}.subhead{max-width:58ch;color:color-mix(in srgb, var(--ink), transparent 28%);font-size:clamp(1.05rem,1.8vw,1.45rem);line-height:1.55}button{background:var(--ink);color:#fff;border:0;border-radius:999px;align-self:flex-start;margin-top:1.2rem;padding:.9rem 1.15rem}.utterance{max-width:40rem;color:color-mix(in srgb, var(--ink), transparent 45%);margin-top:2rem;font-size:.95rem;font-style:italic}.districts{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;display:grid}.district{border-radius:24px;min-height:13rem;padding:1.25rem}.district small{color:var(--accent);text-transform:uppercase;letter-spacing:.12em;font-size:.68rem;font-weight:900}.district h3{letter-spacing:-.025em;margin:1rem 0 .8rem;font-size:1.35rem;line-height:1.05}.district p{color:color-mix(in srgb, var(--ink), transparent 34%);line-height:1.45}.district em{color:color-mix(in srgb, var(--ink), transparent 48%);margin-top:1rem;font-size:.82rem;display:block}.infiltrated{border-style:dashed;transform:translateY(-4px)rotate(-.3deg)}.absorbed{opacity:.72;filter:saturate(.65)}footer{color:color-mix(in srgb, var(--ink), transparent 38%);border-radius:22px;grid-column:2;justify-content:space-between;gap:1rem;padding:1rem 1.2rem;display:flex}.ruptere,.rupture{animation:.75s steps(2,end) rupture}@keyframes rupture{0%{filter:none;transform:translate(0)}28%{filter:contrast(1.8);transform:translate(12px,-8px)rotate(.4deg)}42%{transform:translate(-10px,6px)rotate(-.4deg)}to{filter:none;transform:translate(0)}}.app.leftNav{grid-template-columns:minmax(280px,380px) 1fr}.app.leftNav .brandPanel{border-radius:0 36px 36px 0;transform:translate(-1rem)}.app.leftNav .hero{box-shadow:0 40px 120px #8b5cf62e}.app.playroom{grid-template-columns:1fr}.app.playroom .brandPanel{flex-flow:wrap;grid-row:auto;align-items:center;min-height:auto;transform:rotate(-.4deg)}.app.playroom nav{flex-flow:wrap;margin-top:0}.app.playroom .districts{grid-template-columns:repeat(2,minmax(0,1fr))}.app.playroom footer{grid-column:1}.app.playroom h1{letter-spacing:-.005em;transform:rotate(-.4deg)}.app.rhythm{grid-template-columns:1fr}.app.rhythm .brandPanel{order:2;grid-row:auto;min-height:auto}.app.rhythm nav{flex-flow:wrap}.app.rhythm footer{grid-column:1}.app.rhythm .districts{grid-template-columns:1.2fr .8fr 1.2fr}.app.rhythm .district:nth-child(2n){transform:translateY(1.4rem)}.app.monastic{grid-template-columns:minmax(180px,260px) minmax(0,1fr)}.app.monastic .hero{min-height:70vh;box-shadow:none;border-radius:0}.app.monastic nav span{background:0 0;padding-left:0}.app.monastic .districts{grid-template-columns:1fr}.app.dashboard .hero{min-height:40vh}.app.dashboard .districts{grid-template-columns:repeat(4,minmax(0,1fr))}.app.dashboard .district{border-radius:12px;min-height:10rem}.app.forms{background:repeating-linear-gradient(0deg, var(--surface), var(--surface) 24px, color-mix(in srgb, var(--ink), transparent 96%) 25px)}.app.forms *{border-radius:2px!important}.app.forms nav span{border:1px solid color-mix(in srgb, var(--ink), transparent 76%)}@media (width<=900px){.app,.app.monastic,.app.leftNav{grid-template-columns:1fr;padding:1rem}.brandPanel{grid-row:auto;min-height:auto}footer{flex-direction:column;grid-column:1}.districts,.app.dashboard .districts,.app.rhythm .districts,.app.playroom .districts{grid-template-columns:1fr}h1{font-size:clamp(3.4rem,18vw,7rem)}}.actionRow{flex-wrap:wrap;align-items:center;gap:.8rem;margin-top:1.4rem;display:flex}.actionButton{transition:transform .26s,box-shadow .26s,opacity .26s,letter-spacing .26s;position:relative}.actionButton:hover{transform:translateY(-2px)}.actionButton.refuse:hover{cursor:not-allowed;transform:translateY(-2px)rotate(-.35deg)}.actionButton.sabotage:hover{transform:translate(4px,-3px)rotate(1.5deg)}.actionButton.delay:hover{letter-spacing:.01em}.actionButton.deflect:hover{opacity:.78}.navPill{text-align:left;width:100%;color:var(--ink);background:color-mix(in srgb, var(--accent), transparent 91%);cursor:pointer;border:1px solid #0000;margin:0;transition:transform .22s,background .22s,border-color .22s}.navPill:hover{background:color-mix(in srgb, var(--accent), transparent 84%);border-color:color-mix(in srgb, var(--accent), transparent 64%);transform:translate(4px)}.app.playroom .navPill,.app.rhythm .navPill{width:auto}.district{cursor:pointer;outline:none;position:relative}.district:hover,.district:focus-visible,.district.awake{border-color:color-mix(in srgb, var(--accent), transparent 55%);transform:translateY(-6px)rotate(-.15deg);box-shadow:0 28px 90px #0f172a1f}.district.awake:after{content:"awake";letter-spacing:.14em;text-transform:uppercase;color:var(--accent);opacity:.76;font-size:.68rem;position:absolute;bottom:1rem;right:1rem}.floatingComment{z-index:30;border:1px solid color-mix(in srgb, var(--ink), transparent 84%);background:color-mix(in srgb, white, var(--surface) 20%);max-width:300px;color:var(--ink);pointer-events:none;border-radius:18px;padding:.9rem 1rem;font-size:.9rem;line-height:1.35;animation:4.2s forwards commentArrive;position:fixed;box-shadow:0 18px 60px #0f172a2e}.floatingComment:before{content:"";background:inherit;border-left:inherit;border-bottom:inherit;width:12px;height:12px;position:absolute;top:28px;left:-7px;transform:rotate(45deg)}@keyframes commentArrive{0%{opacity:0;transform:translate(-8px,6px)scale(.98)}10%,82%{opacity:1;transform:translate(0)scale(1)}to{opacity:0;transform:translate(4px,-8px)scale(.98)}}.mutationReceipt{border-left:3px solid var(--accent);max-width:42rem;color:color-mix(in srgb, var(--ink), transparent 34%);background:color-mix(in srgb, var(--accent), transparent 94%);border-radius:12px;margin-top:1rem;padding:.8rem 1rem;font-size:.92rem}.app.mutated.rebrand .logo{text-underline-offset:.12em;text-decoration:underline;text-decoration-thickness:.12em}.app.mutated.absorb .district:not(.awake){opacity:.58;transform:scale(.985)}.app.mutated.tilt .hero{transform:rotate(-.55deg)translate(.4rem)}.app.mutated.sanitize .district p,.app.mutated.sanitize .subhead{filter:blur(.6px)}.app.mutated.decorrupt .brandPanel{transform:translate(.35rem,-.15rem)rotate(.25deg)}.app.mutated.child .district:nth-child(3n){border-radius:42px 18px 34px 12px}.app.mutated.corporation .actionButton:first-child{box-shadow:0 18px 45px color-mix(in srgb, var(--accent), transparent 70%)}.app.mutated.musician footer{letter-spacing:.04em}.app.mutated.bureaucrat .navPill{border-color:color-mix(in srgb, var(--ink), transparent 72%)}@media (width<=900px){.floatingComment{max-width:none;bottom:1rem;right:1rem;top:auto!important;left:1rem!important}.floatingComment:before{display:none}}.navPill.selected{border-color:color-mix(in srgb, var(--accent), transparent 42%);background:color-mix(in srgb, var(--accent), transparent 84%);transform:translate(4px)}.navCommentCard{border:1px solid color-mix(in srgb, var(--accent), transparent 62%);background:color-mix(in srgb, white, var(--surface) 22%);border-radius:18px;margin:-.15rem 0 .4rem 1.6rem;padding:.95rem 1rem;font-size:.9rem;line-height:1.35;animation:.28s both anchoredCommentIn;position:relative;box-shadow:0 18px 48px #0f172a1f}.navCommentCard:before{content:"";border-top:2px dashed color-mix(in srgb, var(--accent), transparent 45%);width:1.25rem;position:absolute;top:1.35rem;left:-1.25rem}.navCommentCard:after{content:"";background:var(--accent);width:.42rem;height:.42rem;box-shadow:0 0 0 5px color-mix(in srgb, var(--accent), transparent 82%);border-radius:999px;position:absolute;top:1.13rem;left:-1.55rem}.navCommentTitle{color:var(--accent);margin-bottom:.45rem;font-weight:850}.navCommentCard p{color:color-mix(in srgb, var(--ink), transparent 18%);margin:0;font-style:italic}.navCommentCard small{color:color-mix(in srgb, var(--ink), transparent 44%);margin-top:.7rem;font-weight:700;display:block}@keyframes anchoredCommentIn{0%{opacity:0;transform:translate(-8px)scale(.985)}to{opacity:1;transform:translate(0)scale(1)}}.app.playroom .navCommentCard,.app.rhythm .navCommentCard{width:min(320px,100%);margin-left:.6rem}