:root{color-scheme:light;--bg:#f2f4f8;--surface:#fff;--surface-2:#fff;--ink:#14213d;--muted:#535e74;--line:#c2cbd9;--accent:#2347d6;--font:system-ui,-apple-system,'Segoe UI',sans-serif;--mono:ui-monospace,Consolas,monospace}
:root[data-theme="dark"]{color-scheme:dark;--bg:#0f1420;--surface:#171e2e;--surface-2:#1d2538;--ink:#e7ecf5;--muted:#b5bfd4;--line:#505b73;--accent:#9ab9ff}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.65 var(--font)}button,select,input{font:inherit}button,select{min-height:44px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:9px;padding:9px 13px}button{cursor:pointer}button:disabled{cursor:default;color:var(--muted)}button:hover:enabled{border-color:var(--accent)}:focus-visible{outline:3px solid var(--accent);outline-offset:3px}[hidden]{display:none!important}
.app-header{max-width:1180px;margin:auto;display:flex;align-items:center;gap:14px;padding:20px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}.app-header h1{margin:0 auto 0 0;font-size:1.75rem;line-height:1.3}.app-header h1 span{background:#ffe45c;color:#14213d;padding:0 4px}.app-header label{font-size:.78rem;display:flex;align-items:center;gap:8px}.demo-badge{font-size:.75rem;color:var(--muted)}#menu{display:none}.app-layout{display:grid;grid-template-columns:208px minmax(0,1fr);gap:30px;max-width:1180px;margin:20px auto}nav{align-self:start;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}nav button{width:100%;border:0;text-align:left;display:block;margin:3px 0}nav button[aria-current="page"]{background:var(--ink);color:var(--surface)}nav p{font-size:.75rem;color:var(--muted);padding:8px}nav hr{border:0;border-top:1px solid var(--line)}main{min-width:0;padding:0 20px}.demo-note{padding:12px 16px;background:var(--surface);border:1px solid var(--line);border-radius:12px;font-size:.78rem}.demo-note p{margin:5px 0;color:var(--muted)}summary{min-height:44px;cursor:pointer;align-content:center}details label{display:flex;align-items:center;gap:8px;min-height:44px}details input{width:20px;height:20px}.breadcrumb,#notice{color:var(--muted);font-size:.75rem}.vl,.vm{padding:0!important;max-width:none!important}.btn{font:inherit}.btn.pri{background:var(--ink);color:var(--surface)}footer{max-width:1180px;margin:30px auto;padding:18px 0;border-top:1px solid var(--line);font-size:.75rem;color:var(--muted)}
@media(max-width:1230px){.app-header,.app-layout,footer{margin-left:20px;margin-right:20px}}
@media(max-width:1023px){#menu{display:block}.app-layout{display:block}nav{display:none;margin-bottom:18px}body.menu-open nav{display:block}main{padding:0}.app-header{gap:10px}}
@media(max-width:640px){.app-header,.app-layout,footer{margin-left:14px;margin-right:14px}.app-header h1{font-size:1.4rem}.app-header label{margin-left:auto}.demo-badge{font-size:.68rem}.app-header{padding:16px 0}.demo-note{padding:10px 12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}