:root{--primary:#2563eb;--primary-dark:#1d4ed8;--primary-soft:#eff6ff;--ink:#0f172a;--slate:#475569;--slate-light:#94a3b8;--border:#e2e8f0;--bg:#f8fafc;--success:#10b981;--success-soft:#ecfdf5;--success-ink:#047857;--danger:#ef4444;--danger-soft:#fef2f2;--danger-ink:#b91c1c;--surface:#fff;--page-bg:#fff;--notation-bg:#f1f5f9}:root[data-theme=dark]{--primary:#3b82f6;--primary-dark:#60a5fa;--primary-soft:#1e3a5f;--ink:#e2e8f0;--slate:#94a3b8;--slate-light:#64748b;--border:#334155;--bg:#0f172a;--success-soft:#064e3b;--success-ink:#6ee7b7;--danger-soft:#7f1d1d;--danger-ink:#fca5a5;--surface:#1e293b;--page-bg:#0f172a}:root{--w-form:560px;--w-read:760px;--w-data:860px;--w-page:1200px;--stave-max:620px}@media (min-width:1440px){:root{--w-form:640px;--w-read:980px;--w-data:1100px;--w-page:1440px;--stave-max:780px}}@media (min-width:1920px){:root{--w-form:680px;--w-read:1120px;--w-data:1280px;--w-page:1680px;--stave-max:900px}}@media (min-width:2200px){:root{--w-form:720px;--w-read:1440px;--w-data:1640px;--w-page:2000px;--stave-max:1180px}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,Noto Sans SC,-apple-system,PingFang SC,sans-serif;color:var(--ink);background:var(--page-bg);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}.btn{display:inline-flex;align-items:center;justify-content:center;border:none;cursor:pointer;font-family:inherit;font-weight:600;font-size:14px;min-height:40px;padding:0 20px;border-radius:8px;transition:.15s;white-space:nowrap}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark)}.btn-primary:disabled{background:var(--slate-light);cursor:not-allowed}.btn-outline{background:var(--surface);color:var(--ink);border:1px solid var(--border)}.btn-outline:hover{border-color:var(--slate-light)}.btn-lg{height:46px;padding:0 26px;font-size:15px}.nav{position:-webkit-sticky;position:sticky;top:0;min-height:64px;z-index:10;background:var(--surface);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);justify-content:space-between;gap:24px;padding:0 clamp(16px,3vw,48px)}.logo,.nav{display:flex;align-items:center}.logo{font-weight:800;font-size:20px;letter-spacing:-.3px;gap:8px;white-space:nowrap;flex-shrink:0}.logo i{width:28px;height:28px;background:var(--primary);border-radius:7px;color:#fff;font-style:normal;display:flex;align-items:center;justify-content:center;font-size:15px}.nav-links{display:flex;gap:clamp(14px,2vw,32px);font-size:14px;font-weight:500;color:var(--slate)}.nav-links a{white-space:nowrap}.nav-links a:hover,.navOn{color:var(--primary)}.navOn{font-weight:600}.navRight{display:flex;align-items:center;gap:14px}.navAccount{font-size:14px;font-weight:500;color:var(--slate)}.navAccount:hover{color:var(--primary)}.themeToggle{width:34px;height:34px;border-radius:8px;border:1px solid var(--border);background:var(--surface);cursor:pointer;font-size:15px;line-height:1;display:inline-flex;align-items:center;justify-content:center;transition:.15s}.themeToggle:hover{border-color:var(--primary)}.chip{font-size:11px;font-weight:600;padding:3px 10px;border-radius:999px;display:inline-block}.chip-blue{background:var(--primary-soft);color:var(--primary)}.chip-green{background:var(--success-soft);color:var(--success)}.card{border:1px solid var(--border);border-radius:12px;background:var(--surface)}.tabbar{display:none}@media (max-width:860px){.nav-links,.navChip{display:none}.tabbar{display:flex;position:fixed;inset:auto 0 0 0;z-index:20;background:var(--surface);border-top:1px solid var(--border);padding-bottom:env(safe-area-inset-bottom)}.tabbar a{flex:1 1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:52px;font-size:11px;font-weight:500;color:var(--slate)}.tabbar a span{font-size:17px;line-height:1}.tabOn{color:var(--primary);font-weight:700}body{padding-bottom:calc(56px + env(safe-area-inset-bottom))}}@media (max-height:480px) and (orientation:landscape){.nav{min-height:46px}.tabbar a{min-height:42px;font-size:10px}body{padding-bottom:calc(46px + env(safe-area-inset-bottom))}}@media print{.tabbar{display:none!important}body{padding-bottom:0!important}.nav{display:none!important}}