:root{
  --bg:#0b0f17;
  --fg:#e9eef7;
  --muted:#98a3b3;
  --card:#121a2a;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,"Noto Sans KR",sans-serif}
.screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.card{width:min(420px, 92vw);background:var(--card);padding:20px;border-radius:18px}
.btn{display:block;text-align:center;background:#2b68ff;color:#fff;padding:12px 14px;border-radius:14px;text-decoration:none;border:0;width:100%;font-size:16px}
.grid{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
.chip{background:#1a2438;color:#cbd5e1;border:1px solid #2a3857;padding:10px 12px;border-radius:999px}
.chip.on{border-color:#2b68ff;color:#fff}
.center{display:flex;align-items:center;justify-content:center;width:100%}

.circle{
  width:240px;height:240px;border-radius:999px;border:0;cursor:pointer;
  background:
    radial-gradient(circle at center, #0b0f17 55%, transparent 56%),
    conic-gradient(#2b68ff var(--deg, 0deg), #1a2438 0);
  position:relative;
  box-shadow: 0 0 0 var(--pulse, 0px) rgba(43,104,255,0.15);
}
.label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;text-align:center;padding:0 22px}
.sub{position:absolute;left:18px;right:18px;bottom:26px;text-align:center;color:var(--muted);font-size:13px}