:root,[data-theme=dark]{--bg:#1a1b1e;--fg:#fff;--code-bg:color-mix(in srgb, var(--fg) 16%, transparent)}[data-theme=light]{--bg:#f4f4f6;--fg:#1a1b1e;--code-bg:color-mix(in srgb, var(--fg) 9%, transparent)}:root{--nav-height:56px;--accent:#f87171;--info:#60a5fa;--success:#4ade80;--font-mono:"Fira Code", "Courier New", monospace;--border-faint:color-mix(in srgb, var(--fg) 8%, transparent);--border:color-mix(in srgb, var(--fg) 15%, transparent);--border-strong:color-mix(in srgb, var(--fg) 25%, transparent);--border-emphasis:color-mix(in srgb, var(--fg) 40%, transparent);--surface-faint:color-mix(in srgb, var(--fg) 4%, transparent);--surface:color-mix(in srgb, var(--fg) 10%, transparent);--accent-surface:color-mix(in srgb, var(--accent) 6%, transparent);--info-surface:color-mix(in srgb, var(--info) 6%, transparent);--success-surface:color-mix(in srgb, var(--success) 6%, transparent);--overlay-bg:color-mix(in srgb, var(--bg) 55%, transparent);--opacity-faint:.35;--opacity-dim:.4;--opacity-subtle:.5;--opacity-muted:.6;--opacity-secondary:.7;--opacity-strong:.8;--transition-fast:.15s ease-in-out;--transition:.2s ease-in-out;--fs-xs:.75rem;--fs-code:.8rem;--fs-sm:.875rem;--fs-base:1rem;--fs-lg:1.1rem;--fs-xl:1.5rem;--fs-2xl:2.25rem;--fw-light:300;--fw-medium:500;--fw-semibold:600;--fw-bold:700;--br-sm:3px;--br:4px;--br-md:6px;--br-lg:8px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}:focus-visible{outline:1px solid var(--fg);box-shadow:none;border-radius:var(--br-sm);opacity:1}code{background:var(--code-bg);border-radius:var(--br-sm);padding:.15em .4em;font-family:monospace;font-size:.875em}html{scrollbar-width:thin;scrollbar-color:var(--border) transparent}html::-webkit-scrollbar{width:8px}html::-webkit-scrollbar-track{background:0 0}html::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--br-sm)}html::-webkit-scrollbar-thumb:hover{background:var(--border-strong)}body{background:var(--bg);color:var(--fg);min-height:100vh;transition:background var(--transition), color var(--transition);font-family:Plus Jakarta Sans,system-ui,sans-serif}main{flex-direction:column;max-width:860px;min-height:100vh;margin:0 auto;padding:4rem 3rem;display:flex}@media (width<=768px){main{padding:2.5rem 1.5rem}}.btn-primary{background:var(--fg);color:var(--bg);border-radius:var(--br);font-size:var(--fs-sm);font-weight:var(--fw-semibold);cursor:pointer;transition:opacity var(--transition-fast);border:none;padding:.5rem 1.5rem;display:inline-block}.btn-primary:hover{opacity:.85}.btn-ghost{color:inherit;cursor:pointer;opacity:var(--opacity-faint);transition:opacity var(--transition-fast);background:0 0;border:none;padding:0}.btn-ghost:hover{opacity:var(--opacity-secondary)}.btn-outline{border:1px solid var(--border-strong);color:var(--fg);border-radius:var(--br);font-size:var(--fs-sm);font-weight:var(--fw-medium);cursor:pointer;opacity:var(--opacity-muted);transition:opacity var(--transition-fast);background:0 0;padding:.45rem 1.25rem;text-decoration:none;display:inline-block}.btn-outline:hover:not(:disabled){opacity:1}.btn-outline:disabled{opacity:.25;cursor:default}.btn-icon{color:inherit;cursor:pointer;opacity:var(--opacity-faint);transition:opacity var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;padding:0;line-height:1;display:flex}.btn-icon:hover{opacity:1}.input{background:var(--surface-faint);border:1px solid var(--border);border-radius:var(--br);width:100%;color:var(--fg);font-size:var(--fs-sm);transition:border-color var(--transition-fast);padding:.5rem .75rem;font-family:inherit}.input:focus{border-color:var(--border-emphasis);outline:none}.input::placeholder{opacity:var(--opacity-subtle)}.eyebrow{font-size:var(--fs-xs);font-weight:var(--fw-semibold);letter-spacing:.08em;text-transform:uppercase;opacity:var(--opacity-faint);margin-bottom:.75rem;display:block}.code-block{font-family:var(--font-mono);font-size:var(--fs-code);background:var(--surface-faint);border:1px solid var(--border-faint);border-radius:var(--br-md);white-space:pre;padding:1rem 1.25rem;line-height:1.6;overflow-x:auto}.user-menu{position:relative}.user-menu-trigger{font-size:var(--fs-sm);font-weight:var(--fw-medium);opacity:var(--opacity-secondary);align-items:center;gap:.5rem;display:flex}.user-menu-trigger:hover{opacity:1}.user-menu-chevron{transition:transform var(--transition-fast);font-size:.65em}.user-menu-chevron.open{transform:rotate(180deg)}.user-menu-dropdown{top:var(--nav-height);height:var(--nav-height);background:var(--bg);border-left:1px solid var(--border-faint);border-bottom:1px solid var(--border-faint);border-radius:0 0 0 var(--br-md);z-index:100;align-items:center;padding:0 1.25rem;display:flex;position:fixed;right:0}.user-menu-signout{font-size:var(--fs-sm);align-items:center;gap:.5rem;display:flex}.shell{flex-direction:column;height:100dvh;display:flex}.shell-logo{line-height:1}.shell-header{height:var(--nav-height);border-bottom:1px solid var(--border-faint);flex-shrink:0;justify-content:space-between;align-items:center;padding:0 1.25rem;display:flex}.shell-content{flex:1;padding:1.5rem 1.25rem;overflow-y:auto}.shell-nav-item{font-size:var(--fs-xs);font-weight:var(--fw-medium);color:inherit;opacity:var(--opacity-dim);transition:opacity var(--transition-fast);flex-direction:column;justify-content:center;align-items:center;gap:.3rem;text-decoration:none;display:flex}.shell-nav-item.active{opacity:1}.shell-nav-item:hover:not(.active){opacity:var(--opacity-subtle)}.shell-sidebar{display:none}.shell-bottom-nav{height:var(--nav-height);border-top:1px solid var(--border-faint);flex-shrink:0;display:flex}.shell-bottom-nav .shell-nav-item{flex:1}@media (width>=768px){.shell{grid-template-columns:56px 1fr;grid-template-rows:var(--nav-height) 1fr;grid-template-areas:"header header""sidebar content";display:grid}.shell-header{grid-area:header}.shell-sidebar{grid-area:sidebar}.shell-content{grid-area:content}.shell-bottom-nav{display:none}.shell-sidebar{border-right:1px solid var(--border-faint);flex-direction:column;align-items:center;gap:.5rem;padding:.75rem 0;display:flex}.shell-sidebar .shell-nav-item{border-radius:var(--br-md);width:40px;height:40px}.shell-sidebar .shell-nav-item span{display:none}.shell-content{padding:2rem 2.5rem}}
