:root{--primary: #6c63ff;--primary-hover: #5a52e0;--danger: #e74c3c;--success: #2ecc71;--radius: 8px}:root,[data-theme=light]{--bg: #f5f5fa;--surface: #ffffff;--border: #d8d8e4;--text: #1a1a2e;--text-muted: #6b6b80}[data-theme=dark]{--bg: #0f0f1a;--surface: #1a1a2e;--border: #2a2a40;--text: #e0e0e0;--text-muted: #8888aa}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #0f0f1a;--surface: #1a1a2e;--border: #2a2a40;--text: #e0e0e0;--text-muted: #8888aa}}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}.layout{min-height:100vh;display:flex;flex-direction:column}.offline-banner{background:#ff9800;color:#000;text-align:center;padding:.25rem;font-size:.85rem;font-weight:600}.header{--header-pad-y: 1rem;--topbar-h: 65px;min-height:var(--topbar-h);display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:var(--header-pad-y) 2rem;background:var(--topbar-color, var(--bg));border-bottom:1px solid var(--border)}.header .logo{display:inline-flex;align-items:center;font-size:.9rem;color:var(--text-muted);text-decoration:none}.topbar-logo-frame{position:relative;display:inline-flex;align-items:center;justify-content:center;height:var(--topbar-h);max-width:100%;margin:calc(-1 * var(--header-pad-y)) 0}.topbar-logo-clip{display:flex;align-items:center;justify-content:center;overflow:hidden;height:100%;max-width:100%}.topbar-logo{max-height:100%;max-width:100%;width:auto;height:auto;display:block}.topbar-badge{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:.15rem .4rem;margin-left:.4rem;border-radius:4px;background:color-mix(in srgb,var(--primary) 15%,transparent);color:var(--primary);white-space:nowrap}.topbar-badge--overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;margin-left:0;background:#0009;color:#fff}@media(max-width:768px){.header{padding:.75rem 1rem;gap:.75rem;--header-pad-y: .75rem;--topbar-h: 57px}}@media(max-width:480px){.header{padding:.5rem .75rem;gap:.5rem;--header-pad-y: .5rem;--topbar-h: 43px}.header .logo{font-size:.85rem}}.main{flex:1;padding:2rem;max-width:700px;margin:0 auto;width:100%}a{color:var(--primary)}a:hover{color:var(--primary-hover)}input,button{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:.5rem .75rem;font-size:.95rem}input:focus{outline:none;border-color:var(--primary)}button,.button{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border:none;border-radius:var(--radius);font-size:.9rem;cursor:pointer;text-decoration:none;background:var(--primary);color:#fff;transition:background .15s}button:hover,.button:hover{background:var(--primary-hover)}.btn-danger{background:var(--danger)}.btn-danger:hover{background:#c0392b}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem}.markdown-body{line-height:1.7}.markdown-body h1,.markdown-body h2,.markdown-body h3{margin:1rem 0 .5rem}.markdown-body ul,.markdown-body ol{margin-left:1.5rem}.markdown-body pre,.markdown-body code{background:var(--bg);padding:.2rem .4rem;border-radius:4px;font-size:.9em}.markdown-body pre{padding:.75rem;overflow-x:auto}@media(max-width:768px){.main{padding:1rem}}dialog.confirm-dialog{max-width:480px;width:calc(100% - 2rem);margin:auto;padding:0;border:1px solid var(--border, #dee2e6);border-radius:8px;background:var(--bg, #fff);color:var(--text, inherit);box-shadow:0 4px 24px #0000002e}dialog.confirm-dialog::backdrop{background:#0006}.cd-body{padding:1.25rem 1.5rem 1rem}.cd-title{margin:0 0 .5rem;font-size:1rem;font-weight:600}.cd-message{margin:0;font-size:.9rem;color:var(--text-muted, #6c757d);line-height:1.5}.cd-actions{display:flex;justify-content:flex-end;gap:.5rem;padding:.75rem 1.5rem 1.25rem;border-top:1px solid var(--border, #dee2e6)}.cd-btn{min-width:72px}@media(max-width:640px){dialog.confirm-dialog{position:fixed;inset:auto 0 0;max-width:100%;width:100%;margin:0;border-radius:12px 12px 0 0;border-bottom:0}.cd-actions{padding-bottom:calc(1.25rem + env(safe-area-inset-bottom,0px));flex-direction:column-reverse}.cd-btn{width:100%;padding:.65rem;font-size:.95rem;text-align:center}}
