:root { --bg:#ffffff; --card:#111827; --text:#e5e7eb; --muted:#ffffff; --accent:#22c55e; --danger:#ef4444; }
* { box-sizing: border-box; }
body { margin:0; font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", sans-serif;
       background: radial-gradient(1200px 800px at 50% -200px, #ffffff, var(--bg));
       color: var(--text); display:grid; place-items:center; min-height:100svh; }
.wrap { width:min(720px, 92vw); }
.card { background: linear-gradient(180deg, #1d220b 0%, var(--card) 100%); border:1px solid #1f2937; border-radius:18px; padding:22px; box-shadow: 0 10px 30px rgba(0,0,0,.35); }
h1 { margin:0 0 6px; font-weight:700; letter-spacing:.3px; }
.muted { color: var(--muted); font-size:.95rem; }
.grid { display:grid; gap:12px; }
.time { font-variant-numeric: tabular-nums; font-size: clamp(42px, 10vw, 88px); line-height:1; text-align:center; margin:18px 0 8px; }
.sub { text-align:center; color:var(--muted); margin-bottom:14px; }
.row { display:flex; gap:10px; flex-wrap: wrap; }
input[type="number"] { width:7rem; padding:.6rem .7rem; border-radius:12px; border:1px solid #334155; background:#0b1222; color:var(--text); }
label { display:flex; align-items:center; gap:.5rem; color:var(--muted); font-size:.95rem; }
.btn { cursor:pointer; border:1px solid #334155; background:#0b1222; color:var(--text); padding:.7rem 1rem; border-radius:12px; font-weight:600; transition:.15s transform ease, .15s background ease; }
.btn:hover { transform: translateY(-1px); background:#0e1529; }
.btn.primary { border-color:#14532d; background:#052e16; }
.btn.primary:hover { background:#064e1a; }
.btn.danger { border-color:#7f1d1d; background:#3f0a0a; }
.chips { display:flex; gap:8px; flex-wrap: wrap; }
.chip { padding:.45rem .7rem; border:1px solid #334155; border-radius:999px; cursor:pointer; user-select:none; background:#0b1222; }
.chip:hover { background:#0e1529; }
.kbd { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; background:#0b1222; border:1px solid #334155; padding:.1rem .35rem; border-radius:6px; color:#cbd5e1; }
.footer { display:flex; justify-content:space-between; align-items:center; margin-top:8px; color:var(--muted); font-size:.9rem; }
.grow { flex:1; }
.hidden { display:none !important; }