:root{
  --bg:#f6f4f1; --surface:#ffffff; --surface-2:#faf8f6; --line:#ebe6e0; --line-2:#ddd6ce;
  --ink:#1d1a17; --ink-2:#5f5851; --ink-3:#9a928a;
  --accent:#f14635; --accent-ink:#ffffff; --accent-soft:#fde9e6; --accent-2:#d93a2a;
  --ok:#1f9d61; --ok-soft:#e3f5ec; --warn:#c77a00; --warn-soft:#fff3dc; --info:#2f6fde; --info-soft:#e8f0fd;
  --radius:18px; --radius-s:12px; --shadow:0 1px 2px rgba(40,30,20,.05),0 8px 24px rgba(40,30,20,.06);
  --font:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.45}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
input,textarea{font:inherit;color:inherit}
a{color:var(--accent)}
.brand{display:flex;align-items:center;gap:8px;font-weight:800;letter-spacing:-.02em;font-size:19px}
.brand .mark{width:28px;height:28px;border-radius:9px;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:15px;font-weight:800}
.brand small{font-weight:600;color:var(--ink-3);font-size:12px;letter-spacing:0;margin-left:2px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 18px;border-radius:14px;font-weight:700;font-size:15px;transition:transform .08s,background .15s,opacity .15s;white-space:nowrap}
.btn:active{transform:scale(.98)}
.btn-primary{background:var(--accent);color:var(--accent-ink)}
.btn-primary:hover{background:var(--accent-2)}
.btn-ghost{background:var(--surface);border:1px solid var(--line-2)}
.btn-ghost:hover{background:var(--surface-2)}
.btn-soft{background:var(--accent-soft);color:var(--accent-2)}
.btn[disabled]{opacity:.45;pointer-events:none}
.btn-s{height:36px;padding:0 12px;border-radius:11px;font-size:13.5px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;font-size:12px;font-weight:700;background:var(--surface-2);color:var(--ink-2);border:1px solid var(--line)}
.chip.ok{background:var(--ok-soft);color:var(--ok);border-color:transparent}
.chip.warn{background:var(--warn-soft);color:var(--warn);border-color:transparent}
.chip.info{background:var(--info-soft);color:var(--info);border-color:transparent}
.chip.acc{background:var(--accent-soft);color:var(--accent-2);border-color:transparent}
.muted{color:var(--ink-2)} .faint{color:var(--ink-3)}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:12px 16px;border-radius:14px;font-weight:600;font-size:14px;opacity:0;transition:.25s;z-index:100;max-width:calc(100% - 32px);text-align:center;pointer-events:none}
.toast.show{opacity:1;transform:translate(-50%,0)}
.spin{width:18px;height:18px;border-radius:50%;border:2.5px solid currentColor;border-right-color:transparent;animation:sp .7s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
