:root{
  --bg:#0e0e12; --card:#17171d; --line:#2a2a33; --text:#f3f3f5; --muted:#9a9aa6;
  --red:#ff4438; --red2:#e22f24; --accent:#ffcf4d;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;}
body{background:var(--bg);color:var(--text);min-height:100vh;
  font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Pretendard","Noto Sans KR",Roboto,sans-serif;
  padding:env(safe-area-inset-top) 0 calc(28px + env(safe-area-inset-bottom));line-height:1.5;}
.wrap{width:100%;max-width:600px;margin:0 auto;padding:18px 18px 0;}
a{color:inherit;}
.brand{display:inline-block;font-weight:900;font-size:20px;letter-spacing:-.5px;text-decoration:none;margin-bottom:8px;}
.brand span{color:var(--red);}
footer{margin-top:34px;color:var(--muted);font-size:12px;text-align:center;}
footer .pb{color:#c9c9d2;}

/* index */
.hero{margin:26px 0 22px;}
.hero h1{font-size:clamp(30px,8vw,44px);font-weight:900;letter-spacing:-1px;margin:0 0 10px;}
.hero .sub{color:var(--muted);font-size:16px;margin:0;}
.urlform{display:flex;gap:9px;flex-wrap:wrap;}
.urlform input{flex:1;min-width:200px;background:#0b0b0f;border:2px solid var(--line);color:var(--text);
  border-radius:12px;padding:14px 15px;font-size:16px;outline:none;}
.urlform input:focus{border-color:var(--red);}
.urlform button{border:none;border-radius:12px;padding:14px 20px;font-size:16px;font-weight:800;cursor:pointer;
  color:#fff;background:var(--red);}
.urlform button:active{background:var(--red2);} .urlform button:disabled{opacity:.6;}
.hint{color:var(--muted);font-size:13px;min-height:18px;margin:10px 2px 0;}
.examples{display:grid;grid-template-columns:1fr;gap:10px;margin-top:22px;}
.ex{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:13px 15px;}
.ex-cat{font-size:12px;color:var(--muted);margin-bottom:3px;}
.ex-v{font-size:16px;font-weight:700;}

/* result */
.result{margin-top:18px;}
.r-head{color:var(--muted);font-size:14px;margin-bottom:8px;}
.verdict{font-size:clamp(26px,7vw,40px);font-weight:900;letter-spacing:-1px;line-height:1.25;margin:0 0 14px;}
.domchip{display:inline-flex;gap:6px;align-items:baseline;background:var(--card);border:1px solid var(--line);
  border-radius:999px;padding:6px 13px;font-size:13px;color:var(--muted);}
.domchip b{color:var(--text);} .pathx{color:#6f6f7a;margin-left:4px;}
.vlong{font-size:16px;color:#d6d6dd;margin:16px 0 6px;}
.alts{font-size:12.5px;color:var(--muted);margin:10px 0 0;}
.alts span{display:inline-block;margin:3px 6px 0 0;padding:2px 8px;border:1px solid var(--line);border-radius:999px;}

.vote{margin:22px 0;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;}
.vote-q{font-size:16px;font-weight:800;margin-bottom:12px;}
.vote-btns{display:grid;grid-template-columns:1fr 1fr;gap:9px;}
.vbtn{border:2px solid var(--line);background:#0b0b0f;color:var(--text);border-radius:11px;padding:13px 10px;
  font-size:14px;font-weight:700;cursor:pointer;text-align:center;}
.vbtn:active{border-color:var(--red);}
.vote-results{display:flex;flex-direction:column;gap:9px;}
.bar{position:relative;background:#0b0b0f;border:1px solid var(--line);border-radius:10px;overflow:hidden;height:42px;}
.bar .fill{position:absolute;left:0;top:0;bottom:0;background:rgba(255,68,56,.28);transition:width .5s;}
.bar.win .fill{background:rgba(255,68,56,.5);}
.bar .lab{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 13px;font-size:14px;font-weight:700;}
.bar .pct{color:var(--accent);}

.cta{display:flex;gap:10px;margin:18px 0 6px;flex-wrap:wrap;}
.go{flex:1;min-width:150px;text-align:center;text-decoration:none;background:#23232b;border:2px solid var(--line);
  color:var(--text);border-radius:13px;padding:14px;font-size:16px;font-weight:800;transition:.15s;}
.go.big{flex:2;background:var(--red);border-color:var(--red);color:#fff;transform:scale(1.02);}
.share{border:2px solid var(--line);background:#0b0b0f;color:var(--text);border-radius:13px;padding:14px 18px;
  font-size:15px;font-weight:700;cursor:pointer;}

.receipt{margin-top:22px;background:#0b0b0f;border:1px dashed var(--line);border-radius:14px;padding:15px;}
.rtitle{font-size:14px;font-weight:800;margin-bottom:9px;}
.receipt ul{margin:0;padding-left:18px;color:#cfcfd6;font-size:13.5px;}
.receipt li{margin:3px 0;}
.rstats{margin-top:10px;color:var(--muted);font-size:12px;font-family:ui-monospace,Menlo,monospace;}
.pbline{margin-top:10px;color:var(--red);font-size:13px;font-weight:700;}

@media(min-width:560px){ .examples{grid-template-columns:1fr 1fr 1fr;} }

.hint.loading{color:var(--red);font-weight:700;animation:wbpulse 1.3s ease-in-out infinite;}
@keyframes wbpulse{0%,100%{opacity:.55;}50%{opacity:1;}}