:root{--bg:#0b0b0b;--fg:#eaeaea;--muted:#b7b7b7;--accent:#E91E63;--surface:#101010;--border:#2b2b2b}
*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Helvetica Neue',Arial,'Noto Sans','Liberation Sans',sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.08;background:repeating-linear-gradient(180deg,#fff 0,#fff 1px,transparent 1px,transparent 3px);mix-blend-mode:overlay}
.badge{position:fixed;top:calc(env(safe-area-inset-top) + .75rem);left:calc(env(safe-area-inset-left) + .75rem);padding:.28rem .48rem;font-size:.72rem;letter-spacing:.06em;border-radius:.4rem;color:var(--fg);background:linear-gradient(180deg,#111,#0a0a0a);border:1px solid var(--border);box-shadow:0 0 0 1px #000 inset;z-index:50}
.hero{min-height:100svh;display:grid;place-content:center;gap:1rem;text-align:center;padding:clamp(16px,4vw,32px)}
.label{font-weight:900;line-height:1.05;margin:0 auto;text-wrap:balance;font-size:clamp(36px,9vw,120px);max-width:12ch;opacity:1;transition:opacity .35s ease}
.label.is-fading-out{opacity:0}@media (prefers-reduced-motion:reduce){.label{transition:none}}
.label::after{content:"";display:block;height:3px;margin-top:.5rem;background:linear-gradient(90deg,var(--accent),transparent 60%);animation:swipe 1.8s ease-out 1}
@keyframes swipe{from{inline-size:20%;opacity:.6}to{inline-size:100%;opacity:1}}
.sub{margin:0 auto;color:var(--muted);font-size:clamp(14px,2.6vw,18px)}
.toolbar{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom) + 1rem);transform:translateX(-50%);display:flex;gap:.5rem;background:rgba(16,16,16,.9);backdrop-filter:saturate(120%) blur(6px);border:1px solid var(--border);border-radius:.8rem;padding:.4rem;box-shadow:0 12px 40px rgba(0,0,0,.45);z-index:20}
.btn{appearance:none;cursor:pointer;border-radius:.6rem;padding:.65rem .9rem;font-weight:600;background:#141414;color:var(--fg);border:1px solid var(--border);transition:transform .08s ease,background .2s ease,border-color .2s ease}
.btn:hover{background:#161616;border-color:#3a3a3a}.btn:active{transform:scale(.98)}.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.btn-outline{background:transparent}
.share-wrap{position:relative}.menu{position:absolute;bottom:calc(100% + .5rem);left:0;display:flex;flex-direction:column;gap:.35rem;padding:.5rem;background:var(--surface);border:1px solid var(--border);border-radius:.6rem;box-shadow:0 12px 40px rgba(0,0,0,.45);z-index:30}.menu[hidden]{display:none}
.menu button{background:transparent;border:1px solid var(--border);color:var(--fg);padding:.55rem .7rem;border-radius:.5rem;text-align:left;font-weight:600}.menu button:hover{background:#161616}
.modal[hidden]{display:none}.modal{position:fixed;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.55);z-index:40}.modal-card{width:min(760px,92vw);background:#101010;border:1px solid var(--border);border-radius:.9rem;padding:1.1rem;box-shadow:0 12px 40px rgba(0,0,0,.45)}.modal-card h2{margin:.1rem 0 .25rem 0}
.muted{color:var(--muted);margin:.25rem 0 .75rem 0}.input{width:100%;padding:.8rem 1rem;border-radius:.6rem;background:#0f0f0f;color:var(--fg);border:1px solid var(--border)}
.modal-actions{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-end;margin-top:.8rem}
.toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom) + 4.25rem);transform:translateX(-50%);background:#111;color:var(--fg);border:1px solid var(--border);border-radius:.6rem;padding:.5rem .7rem;box-shadow:0 12px 40px rgba(0,0,0,.45);opacity:0;pointer-events:none;transition:opacity .25s ease}.toast.is-show{opacity:1}
footer{position:fixed;right:calc(env(safe-area-inset-right) + .75rem);bottom:calc(env(safe-area-inset-bottom) + .75rem);color:var(--muted);font-size:.8rem}