:root{--bg: #0f1020;--bg-soft: #1a1b32;--card: #21223e;--ink: #f5f5fa;--ink-dim: #a9abc8;--accent: #ffd33d;--accent-ink: #5a4a00;--up: #38c172;--down: #ef5b6b;--line: #33345a;--radius: 18px;--shadow: 0 18px 50px rgba(0, 0, 0, .45)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:radial-gradient(1200px 800px at 50% -10%,#23244a,var(--bg));color:var(--ink);min-height:100vh}.app{max-width:640px;margin:0 auto;padding:2.5rem 1.25rem 3rem;display:flex;flex-direction:column;min-height:100vh}.header{text-align:center;margin-bottom:1.5rem}.header__title{font-size:2.6rem;margin:0;letter-spacing:-.02em}.header__dot{color:var(--accent)}.header__tagline{color:var(--ink-dim);margin:.35rem 0 1.1rem}.tabs{display:inline-flex;gap:.25rem;background:var(--bg-soft);padding:.25rem;border-radius:999px;border:1px solid var(--line)}.tab{border:0;background:transparent;color:var(--ink-dim);padding:.45rem 1.1rem;border-radius:999px;cursor:pointer;font-size:.95rem;font-weight:600}.tab--active{background:var(--accent);color:var(--accent-ink)}.main{flex:1;display:flex;flex-direction:column;justify-content:center}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:2rem 1.75rem 1.5rem;text-align:center}.card__setup{font-size:1.4rem;line-height:1.4;margin:0 0 .75rem;font-weight:600}.card__punchline{font-size:1.25rem;line-height:1.45;margin:0 0 1rem;color:var(--accent)}.card__source{font-size:.78rem;color:var(--ink-dim);font-style:italic;margin:0 0 1.25rem}.card__actions{display:flex;justify-content:center;gap:.6rem;flex-wrap:wrap}.btn{border:1px solid var(--line);background:var(--bg-soft);color:var(--ink);border-radius:12px;padding:.6rem 1rem;font-size:1rem;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:.45rem;transition:transform .06s ease,background .15s ease,border-color .15s ease}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn__count{font-variant-numeric:tabular-nums;min-width:1.25ch}.btn--up:hover:not(:disabled){border-color:var(--up)}.btn--down:hover:not(:disabled){border-color:var(--down)}.btn--new{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.card__meta{margin:1.1rem 0 0;color:var(--ink-dim);font-size:.9rem}.toplist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.6rem}.toplist__item{display:flex;gap:.85rem;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:.9rem 1rem}.toplist__rank{font-weight:800;color:var(--accent);min-width:2.4ch;font-variant-numeric:tabular-nums}.toplist__body{text-align:left}.toplist__setup{margin:0;font-weight:600}.toplist__punchline{margin:.2rem 0 0;color:var(--accent)}.toplist__stats{margin:.45rem 0 0;font-size:.82rem;color:var(--ink-dim)}.status{text-align:center;color:var(--ink-dim)}.status--error{color:var(--down)}.footer{margin-top:2rem;border-top:1px solid var(--line);padding-top:1.25rem;text-align:center}.footer__links{display:flex;gap:1.25rem;justify-content:center}.footer__link{background:none;border:0;color:var(--ink-dim);cursor:pointer;font-size:.9rem;text-decoration:underline;text-underline-offset:3px}.footer__link:hover{color:var(--ink)}.footer__panel{text-align:left;background:var(--bg-soft);border:1px solid var(--line);border-radius:12px;padding:1rem 1.1rem;margin:1rem auto 0;max-width:520px}.footer__panel h2{margin:0 0 .5rem;font-size:1.05rem}.footer__panel p{margin:0;color:var(--ink-dim);font-size:.9rem;line-height:1.55}.footer__copy{margin:1.25rem 0 0;color:var(--ink-dim);font-size:.78rem}.subscribe{text-align:left}.subscribe__label{display:block;font-weight:600;margin-bottom:.5rem}.subscribe__row{display:flex;gap:.5rem}.subscribe__input{flex:1;padding:.6rem .8rem;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font-size:.95rem}.btn--subscribe{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.subscribe__msg{margin:.6rem 0 0;font-size:.85rem;color:var(--up)}.subscribe__msg--err{color:var(--down)}.btn--share{background:var(--bg-soft);color:var(--ink);border-color:var(--line)}.btn--share:hover:not(:disabled){border-color:var(--accent)}.card__share-msg{margin:.9rem 0 0;font-size:.85rem;color:var(--up)}