:root{--bg:#0b0a10;--ink:#f6efe6;--dim:#c3b8ad;--mute:#8b8079;--pink:#ff5a8a;--pink2:#ff8db0;--teal:#4fe0d0;--paper:#fbf4e8;--paperink:#2a211b;--line:rgba(255,255,255,.12)}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:400 16px/1.55 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
em{font-family:'DM Serif Display',serif;font-style:italic;font-weight:400;color:var(--pink2)}
.wrap{max-width:1180px;margin:0 auto;padding:0 26px;position:relative}

/* hero */
.hero{position:relative;min-height:100vh;display:flex;flex-direction:column;overflow:hidden}
#bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity 1s}
.shade{position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 45%,rgba(11,10,16,.35),rgba(11,10,16,.85) 75%),linear-gradient(180deg,rgba(11,10,16,.55),rgba(11,10,16,.1) 30%,rgba(11,10,16,.2) 60%,var(--bg))}
.hero>*:not(video):not(.shade){position:relative;z-index:2}
header .wrap{display:flex;align-items:center;gap:14px;height:72px}
.brand{display:flex;align-items:center;gap:10px;font:800 22px Inter;letter-spacing:-.02em}
.tag-pink{background:var(--pink);color:#fff;font:700 14px Inter;border-radius:6px;padding:3px 7px;transform:rotate(-4deg);box-shadow:0 6px 18px -6px var(--pink)}
.sp{flex:1}
.clock{font:600 13px 'JetBrains Mono';color:var(--dim)}
.xl{font-size:18px;color:var(--dim)}.xl:hover{color:#fff}
.ca{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:rgba(11,10,16,.55);backdrop-filter:blur(8px);border-radius:10px;padding:7px 10px;font:600 12px 'JetBrains Mono';color:var(--dim)}
.ca code{color:var(--ink);max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ca b{color:var(--pink2)}
.center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding-top:30px}
.eyebrow{font:600 12px 'JetBrains Mono';letter-spacing:.14em;text-transform:uppercase;color:var(--dim);background:rgba(11,10,16,.5);border:1px solid var(--line);border-radius:999px;padding:6px 12px;backdrop-filter:blur(6px)}
.hero h1{font:400 clamp(30px,4vw,52px)/1.1 'DM Serif Display';margin:18px 0 4px;text-shadow:0 4px 30px rgba(0,0,0,.7)}
.count{font:800 clamp(64px,12vw,168px)/1 'JetBrains Mono';letter-spacing:-.04em;text-shadow:0 0 50px rgba(255,90,138,.35),0 6px 30px rgba(0,0,0,.8);font-variant-numeric:tabular-nums}
.hero.worried .count{color:#ffd27a}.hero.danger .count{color:var(--pink);animation:pulse 1s infinite}.hero.evicted .count{color:var(--pink)}
.hero.comfy .count,.hero.ok .count{color:#fff}
@keyframes pulse{50%{opacity:.6}}
.meter{width:min(640px,92%);margin-top:20px}
.bar{height:10px;border-radius:6px;background:rgba(255,255,255,.12);overflow:hidden;backdrop-filter:blur(4px)}
.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--teal),#9ef2c9);transition:width 1s}
.hero.worried .bar i{background:linear-gradient(90deg,#ffb84d,#ffd27a)}.hero.danger .bar i,.hero.evicted .bar i{background:linear-gradient(90deg,#ff3d6e,var(--pink2))}
.mrow{display:flex;justify-content:space-between;font:600 12px 'JetBrains Mono';color:var(--dim);margin-top:8px}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:26px;width:min(820px,100%)}
.facts div{background:rgba(11,10,16,.55);border:1px solid var(--line);border-radius:14px;padding:12px 14px;backdrop-filter:blur(8px);text-align:left}
.facts span{display:block;font:600 10px 'JetBrains Mono';letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.facts b{font:700 18px 'JetBrains Mono'}
.latest{padding-bottom:40px;margin-top:28px;display:flex;justify-content:center}
.note{display:grid;grid-template-columns:150px 1fr;gap:16px;align-items:center;max-width:720px;background:var(--paper);color:var(--paperink);border-radius:14px;padding:12px;box-shadow:0 30px 60px -20px rgba(0,0,0,.8);transform:rotate(-.6deg)}
.note img{width:150px;height:96px;object-fit:cover;border-radius:8px}
.note p{font:500 15px/1.45 Inter}
.note small{display:block;font:700 11px 'JetBrains Mono';color:#9a7f6b;margin-bottom:4px;text-transform:uppercase;letter-spacing:.06em}

/* sections */
section:not(.hero){padding:80px 0}
.tag{display:inline-block;font:700 11px 'JetBrains Mono';letter-spacing:.12em;text-transform:uppercase;color:var(--pink2);border:1px solid rgba(255,90,138,.4);background:rgba(255,90,138,.08);padding:5px 10px;border-radius:999px}
.sh{margin-bottom:28px}
.sh h2{font:400 clamp(38px,5vw,64px)/1.05 'DM Serif Display';margin-top:12px}
.sh p{color:var(--dim);margin-top:8px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.steps div{border:1px solid var(--line);border-radius:16px;padding:22px;background:rgba(255,255,255,.03)}
.steps b{font:800 13px 'JetBrains Mono';color:var(--pink2)}
.steps h4{font:400 26px 'DM Serif Display';margin:8px 0}
.steps p{color:var(--dim);font-size:15px}
.fine{margin-top:20px;color:var(--mute);font-size:13px;max-width:760px}
.feed{columns:3 320px;column-gap:16px}
.post{break-inside:avoid;margin-bottom:16px;background:var(--paper);color:var(--paperink);border-radius:14px;overflow:hidden;box-shadow:0 20px 40px -24px rgba(0,0,0,.9)}
.post img{width:100%;display:block;aspect-ratio:16/9;object-fit:cover}
.post .b{padding:14px 16px 16px}
.post .m{display:flex;justify-content:space-between;align-items:center;font:700 11px 'JetBrains Mono';color:#9a7f6b;text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.post p{font:500 15px/1.5 Inter}
.chip{border-radius:999px;padding:2px 8px;font:800 10px 'JetBrains Mono'}
.chip.comfy,.chip.ok,.chip.waiting{background:#d9f5ee;color:#126b5c}.chip.worried{background:#ffefcc;color:#8a5a00}.chip.danger,.chip.evicted{background:#ffd6e2;color:#a3123f}.chip.paid{background:#dff7d9;color:#1f7a19}
.empty{color:var(--mute);padding:30px;text-align:center}
footer{border-top:1px solid var(--line);padding:26px 0;font:500 12px Inter;color:var(--mute)}
footer .wrap{display:flex;justify-content:space-between;gap:16px}
@media(max-width:820px){.facts{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:1fr}.note{grid-template-columns:1fr}.note img{width:100%;height:auto}.clock{display:none}.ca code{max-width:120px}footer .wrap{flex-direction:column}}
