@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Inter:wght@400;500;600;700;800&display=swap');
:root{--bg:#0b0b0d;--panel:#121216;--panel2:#17171c;--line:#29292f;--text:#f4f3ef;--muted:#929298;--accent:#d5ff3f;--bad:#ff5f6d;--good:#74e8a4;--max:1180px}*{box-sizing:border-box}html{background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif}body{margin:0;min-height:100vh;background:radial-gradient(800px 500px at 80% 0%,rgba(213,255,63,.08),transparent 60%),var(--bg)}a{color:inherit;text-decoration:none}.shell{width:min(var(--max),calc(100% - 40px));margin-inline:auto}.noise{position:fixed;inset:0;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}.nav{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-weight:800;letter-spacing:-.04em;font-size:20px;display:flex;align-items:center}.brand span:not(.brand-dot){color:var(--accent)}.brand-dot{width:9px;height:9px;border-radius:50%;background:var(--accent);margin-right:9px;box-shadow:0 0 24px rgba(213,255,63,.5)}.admin-link,.nav-actions a{font:500 12px DM Mono,monospace;text-transform:uppercase;color:var(--muted);letter-spacing:.08em}.nav-actions{display:flex;gap:20px}.hero{padding:92px 0 72px;border-bottom:1px solid var(--line)}.eyebrow,.kicker{font:500 11px DM Mono,monospace;letter-spacing:.14em;color:var(--accent)}.hero h1{font-size:clamp(54px,8vw,105px);line-height:.88;letter-spacing:-.075em;margin:24px 0 30px;max-width:950px}.hero h1 em{font-style:normal;color:var(--accent)}.hero>p{font-size:17px;line-height:1.65;color:#b6b6bb;max-width:620px}.hero-meta{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}.hero-meta span{border:1px solid var(--line);padding:9px 12px;font:12px DM Mono,monospace;color:var(--muted)}.hero-meta b{color:var(--text)}.leaderboard-wrap{padding:72px 0}.section-head,.admin-title,.panel-title{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:26px}.section-head h2,.join-card h2,.rules-card h2,.admin-title h1,.panel-title h2{margin:8px 0 0;font-size:34px;letter-spacing:-.045em}.updated{font:11px DM Mono,monospace;color:var(--muted)}.leaderboard{border-top:1px solid var(--line)}.row{display:grid;grid-template-columns:72px 2.1fr .8fr 1fr 1fr 1fr .65fr;align-items:center;gap:16px;min-height:82px;border-bottom:1px solid var(--line);padding:0 14px}.row-head{min-height:42px;font:10px DM Mono,monospace;color:#717178;text-transform:uppercase;letter-spacing:.08em}.leader-row{transition:.2s ease}.leader-row:hover{background:var(--panel2);transform:translateX(3px)}.rank{font:700 22px DM Mono,monospace}.rank-1 .rank{color:var(--accent)}.creator{display:flex;align-items:center;gap:12px}.creator b{font-size:15px}.creator small{display:block;color:var(--muted);font:10px DM Mono,monospace;margin-top:4px}.avatar{width:40px;height:40px;display:grid;place-items:center;background:var(--accent);color:#0b0b0d;font-weight:800}.row>span:not(.rank):not(.creator){font:12px DM Mono,monospace;color:#9999a0}.row>span b{color:var(--text);font-size:13px}.score b{color:var(--accent)!important;font-size:17px!important}.empty-card{display:flex;align-items:center;gap:24px;padding:35px;background:var(--panel);border:1px solid var(--line)}.empty-rank{font:700 46px DM Mono;color:var(--accent)}.empty-card h3{margin:0 0 7px}.empty-card p{margin:0;color:var(--muted)}.split-section{display:grid;grid-template-columns:1.15fr .85fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:72px}.join-card,.rules-card{background:var(--panel);padding:54px}.join-card>p{color:var(--muted);line-height:1.6;max-width:560px}.submit-form{margin-top:30px}.submit-form label,.stack-form label{display:block;color:var(--muted);font:11px DM Mono,monospace;margin-bottom:8px}.input-row{display:flex;border:1px solid #3a3a42;background:#0e0e11}.input-row span{display:grid;place-items:center;width:46px;color:var(--muted)}input{font:13px DM Mono,monospace;background:#0e0e11;border:1px solid var(--line);color:var(--text);outline:none;padding:13px 14px;min-width:0}.input-row input{flex:1;border:0;padding-inline:0}.input-row button,button{border:0;background:var(--accent);color:#0a0a0c;font-weight:800;padding:13px 20px;cursor:pointer}.pending-note{font:10px DM Mono;color:var(--muted);margin-top:14px}.rules-card ol{list-style:none;padding:0;margin:26px 0 0}.rules-card li{display:flex;gap:20px;padding:20px 0;border-top:1px solid var(--line)}.rules-card li>span{font:500 11px DM Mono;color:var(--accent)}.rules-card b{font-size:14px}.rules-card p{margin:5px 0 0;color:var(--muted);font-size:13px;line-height:1.5}.footer{border-top:1px solid var(--line);padding:28px 0 38px;display:flex;justify-content:space-between;gap:20px;color:#66666d;font:10px DM Mono,monospace}.alert{padding:12px 14px;margin:16px 0;font:11px DM Mono,monospace;border:1px solid}.alert.ok{color:var(--good);border-color:rgba(116,232,164,.35);background:rgba(116,232,164,.06)}.alert.bad{color:#ff8b94;border-color:rgba(255,95,109,.35);background:rgba(255,95,109,.06)}
/* Admin */.admin-body{background:var(--bg)}.login-card{width:min(440px,calc(100% - 32px));margin:10vh auto;padding:36px;background:var(--panel);border:1px solid var(--line)}.login-card h1{margin:40px 0 8px;letter-spacing:-.04em}.login-card p,.login-card small{color:var(--muted);line-height:1.5}.stack-form{display:grid;gap:16px;margin:26px 0}.stack-form input{display:block;width:100%;margin-top:8px}.admin-main{padding:55px 0 90px}.admin-title{margin-bottom:28px}.admin-title h1{font-size:42px}.button-secondary{background:transparent!important;border:1px solid #414148!important;color:var(--text)!important}.danger{background:var(--bad)!important;color:white!important}.admin-panel{border:1px solid var(--line);background:var(--panel);padding:28px;margin-top:24px}.panel-title{align-items:center}.panel-title h2{font-size:24px}.panel-title p{color:var(--muted);font-size:13px;margin:6px 0 0}.count-pill{font:12px DM Mono;background:#202026;border:1px solid var(--line);padding:7px 10px}.submission-item{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:18px 0;border-top:1px solid var(--line)}.submission-item small,.clipper-admin-head small{display:block;color:var(--muted);font:10px DM Mono;margin-top:6px}.submission-item small a{color:var(--accent)}.submission-actions{display:flex;gap:8px;align-items:center}.submission-actions form{display:flex;gap:7px}.submission-actions input{padding:10px}.admin-empty{border-top:1px solid var(--line);padding:24px 0;color:var(--muted);font:12px DM Mono}.clipper-admin-list{display:grid;gap:12px}.clipper-admin-card{background:#0f0f12;border:1px solid var(--line);padding:20px}.clipper-admin-head{display:flex;justify-content:space-between;gap:18px;align-items:center}.eligible{color:var(--good)}.ineligible{color:#ffbd6a}.status-line{display:flex;gap:15px;flex-wrap:wrap;margin-top:14px;color:#67676f;font:10px DM Mono}.error-text{color:#ff8b94}.remove-form{margin-top:12px}.text-danger{background:none!important;padding:0!important;color:#ff737f!important;font:10px DM Mono}.admin-title form{margin:0}
@media(max-width:850px){.hero{padding-top:65px}.row-head{display:none}.row.leader-row{grid-template-columns:50px 1fr 1fr;min-height:auto;padding:18px 8px;row-gap:14px}.row.leader-row .creator{grid-column:2/4}.row.leader-row>span:not(.rank):not(.creator){padding-left:0}.row.leader-row>span:not(.rank):not(.creator)::before{content:attr(data-label);display:block;text-transform:uppercase;font-size:8px;color:#666;margin-bottom:4px}.split-section{grid-template-columns:1fr}.join-card,.rules-card{padding:34px}.submission-item{align-items:flex-start;flex-direction:column}.submission-actions{width:100%;flex-wrap:wrap}.section-head{align-items:flex-start;flex-direction:column}.footer{flex-direction:column}}@media(max-width:520px){.shell{width:min(100% - 24px,var(--max))}.nav{height:66px}.hero h1{font-size:50px}.hero-meta{gap:7px}.leaderboard-wrap{padding:50px 0}.row.leader-row{grid-template-columns:42px 1fr 1fr}.join-card,.rules-card,.admin-panel{padding:22px}.input-row{flex-wrap:wrap}.input-row button{width:100%}.clipper-admin-head{align-items:flex-start;flex-direction:column}.admin-title{align-items:flex-start;flex-direction:column}.submission-actions form{width:100%}.submission-actions form input{flex:1}}
.auto-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:18px}.auto-stats-grid span{display:block;border:1px solid var(--line);padding:12px;background:#0c0c0f}.auto-stats-grid small{display:block;color:var(--muted);font:10px DM Mono,monospace;margin-bottom:7px}.auto-stats-grid b{font:600 13px DM Mono,monospace}@media(max-width:850px){.auto-stats-grid{grid-template-columns:1fr 1fr}}@media(max-width:520px){.auto-stats-grid{grid-template-columns:1fr}}

/* Readability refresh — same layout, softer contrast and clearer hierarchy */
:root{
  --bg:#101311;
  --panel:#171b18;
  --panel2:#1c211e;
  --line:#303832;
  --text:#f5f7f3;
  --muted:#aeb6b0;
  --accent:#c8f36b;
  --bad:#ff7b86;
  --good:#87e7ab;
}
html{font-size:16px}
body{
  background:
    radial-gradient(900px 520px at 82% -8%,rgba(200,243,107,.07),transparent 62%),
    var(--bg);
  line-height:1.5;
}
.noise{opacity:.012}
.shell{width:min(var(--max),calc(100% - 48px))}
.nav{height:76px}
.brand{font-size:19px;letter-spacing:-.025em}
.admin-link,.nav-actions a{font-size:12px;color:#c0c7c2;letter-spacing:.06em}

.hero{padding:74px 0 62px}
.eyebrow,.kicker{font-size:11px;letter-spacing:.11em}
.hero h1{
  font-size:clamp(48px,7vw,88px);
  line-height:.98;
  letter-spacing:-.055em;
  margin:20px 0 26px;
  max-width:900px;
}
.hero>p{font-size:18px;line-height:1.7;color:#c6ccc7;max-width:680px}
.hero-meta{gap:10px;margin-top:30px}
.hero-meta span{
  border-color:#39413b;
  background:rgba(255,255,255,.018);
  padding:10px 13px;
  color:#b8c0ba;
  border-radius:8px;
}

.leaderboard-wrap{padding:60px 0}
.section-head,.admin-title,.panel-title{margin-bottom:22px}
.section-head h2,.join-card h2,.rules-card h2,.admin-title h1,.panel-title h2{letter-spacing:-.03em}
.section-head h2{font-size:32px}
.updated{font-size:11px;color:#a6aea8}
.leaderboard{
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  background:var(--panel);
}
.row{
  grid-template-columns:72px 2.1fr .8fr 1fr 1fr 1fr .65fr;
  min-height:86px;
  border-bottom:1px solid #2a312c;
  padding:0 18px;
}
.row:last-child{border-bottom:0}
.row-head{
  min-height:46px;
  background:#131714;
  color:#929b94;
  font-size:10px;
}
.leader-row{background:rgba(255,255,255,.008)}
.leader-row:nth-child(odd){background:rgba(255,255,255,.018)}
.leader-row:hover{background:#202620;transform:none}
.rank{font-size:20px}
.creator b{font-size:16px;font-weight:700}
.creator small{font-size:11px;color:#9fa7a1;margin-top:3px}
.avatar{width:42px;height:42px;border-radius:10px;box-shadow:none}
.row>span:not(.rank):not(.creator){font-size:12px;color:#adb5af}
.row>span b{font-size:14px;font-weight:600}
.score b{font-size:18px!important}

.empty-card{
  border-radius:14px;
  background:var(--panel);
  border-color:var(--line);
  padding:38px;
}
.empty-card p{color:#b5bdb7;line-height:1.65}

.split-section{
  gap:18px;
  background:transparent;
  border:0;
  margin-bottom:72px;
}
.join-card,.rules-card{
  border:1px solid var(--line);
  border-radius:14px;
  padding:46px;
  background:var(--panel);
}
.join-card>p{color:#b8c0ba;font-size:15px;line-height:1.7}
.submit-form label,.stack-form label{font-size:11px;color:#b3bbb5}
.input-row{border-color:#3a433c;background:#101411;border-radius:10px;overflow:hidden}
.input-row span{color:#aab2ac}
input{
  background:#101411;
  border-color:#39413b;
  color:var(--text);
  padding:14px 15px;
  border-radius:9px;
}
.input-row input{border-radius:0}
.input-row button,button{
  padding:14px 21px;
  border-radius:8px;
  transition:filter .15s ease,transform .15s ease;
}
.input-row button{border-radius:0}
button:hover{filter:brightness(1.04)}
button:active{transform:translateY(1px)}
.pending-note{font-size:11px;color:#a3aba5}
.rules-card li{padding:22px 0;border-color:#2d342f}
.rules-card li>span{font-size:12px}
.rules-card b{font-size:15px}
.rules-card p{font-size:14px;line-height:1.6;color:#b4bcb6}
.footer{color:#838c85;font-size:10px;line-height:1.6}

.alert{font-size:12px;line-height:1.55;border-radius:9px;padding:13px 15px}

/* Admin readability */
.login-card,.admin-panel,.clipper-admin-card{border-radius:14px}
.login-card{background:var(--panel);padding:38px}
.login-card p,.login-card small{color:#b5bdb7}
.admin-main{padding-top:48px}
.admin-title h1{font-size:38px}
.admin-panel{padding:30px}
.panel-title h2{font-size:24px}
.panel-title p{color:#b4bcb6;line-height:1.55}
.count-pill{background:#202620;border-color:#384039;border-radius:999px;color:#c4cbc6}
.submission-item{border-color:#2d342f;padding:20px 0}
.submission-item small,.clipper-admin-head small{font-size:11px;color:#aab2ac;line-height:1.55}
.clipper-admin-card{background:#131714;padding:22px;border-color:#303832}
.status-line{color:#98a099;font-size:11px;line-height:1.55}
.auto-stats-grid{gap:12px}
.auto-stats-grid span{background:#121613;border-color:#303832;border-radius:10px;padding:14px}
.auto-stats-grid small{font-size:11px;color:#9fa7a1}
.auto-stats-grid b{font-size:14px}
.button-secondary{border-color:#465048!important;background:#171c18!important}

@media(max-width:850px){
  .shell{width:min(var(--max),calc(100% - 30px))}
  .hero{padding:58px 0 50px}
  .hero h1{font-size:clamp(44px,11vw,68px)}
  .row.leader-row{padding:20px 14px;row-gap:16px}
  .row.leader-row>span:not(.rank):not(.creator)::before{font-size:9px;color:#8f9891;margin-bottom:5px}
  .join-card,.rules-card{padding:34px}
}
@media(max-width:520px){
  .shell{width:min(100% - 22px,var(--max))}
  .nav{height:64px}
  .hero{padding-top:46px}
  .hero h1{font-size:44px;line-height:1.02;letter-spacing:-.045em}
  .hero>p{font-size:16px}
  .hero-meta span{font-size:11px;padding:9px 10px}
  .leaderboard-wrap{padding:44px 0}
  .leaderboard{border-radius:12px}
  .join-card,.rules-card,.admin-panel{padding:22px;border-radius:12px}
  .empty-card{padding:26px;border-radius:12px}
}