:root{--bg:#0f1410;--bg-elev:#1a221c;--panel:#222c24;--border:#2e3b32;--text:#e8efe9;--muted:#8fa396;--accent:#f5c518;--accent-ink:#1a1500;--danger:#e85d4c;--ok:#3ecf8e;--font:"DM Sans", system-ui, sans-serif;--mono:"IBM Plex Mono", ui-monospace, monospace}*{box-sizing:border-box}html,body,#root{min-height:100%}body{font-family:var(--font);background:radial-gradient(ellipse 80% 50% at 10% -10%, #2a3d28 0%, transparent 55%), radial-gradient(ellipse 60% 40% at 100% 0%, #3d3520 0%, transparent 50%), var(--bg);color:var(--text);margin:0}a{color:var(--accent)}button,input,textarea{font:inherit}.app-shell{max-width:1100px;margin:0 auto;padding:1.25rem 1rem 3rem}.topbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;display:flex}.brand-block{align-items:center;gap:.55rem;display:inline-flex}.brand-logo-link{color:var(--text);letter-spacing:-.02em;align-items:center;gap:.45rem;font-size:1.15rem;font-weight:700;text-decoration:none;display:inline-flex}.brand-logo-link:hover .brand-name{color:var(--accent)}.brand-logo{object-fit:cover;width:36px;height:36px;box-shadow:0 0 0 1px color-mix(in srgb, var(--border) 80%, transparent);border-radius:9px;display:block}.brand-name{color:var(--text)}.brand-product{color:var(--accent);letter-spacing:-.02em;font-size:1.05rem;font-weight:700;text-decoration:none}.brand-product:hover{color:var(--text)}.nav{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.nav a{color:var(--muted);font-size:.95rem;text-decoration:none}.nav a.active,.nav a:hover,.nav a.nav-ext:hover{color:var(--text)}.nav a.nav-ext{color:var(--accent)}.auth-brand{margin-bottom:1rem}.auth-backlink{margin-top:1.25rem;margin-bottom:0}.card{background:color-mix(in srgb, var(--panel) 92%, transparent);border:1px solid var(--border);border-radius:12px;padding:1.25rem}.grid-2{gap:1rem;display:grid}@media (width>=900px){.grid-2{grid-template-columns:1.2fr .8fr}}h1{letter-spacing:-.03em;margin:0 0 .35rem;font-size:1.6rem}h2{margin:0 0 .75rem;font-size:1.05rem}.muted{color:var(--muted);font-size:.95rem}.quota{background:var(--bg-elev);border:1px solid var(--border);border-radius:999px;align-items:center;gap:.4rem;padding:.25rem .75rem;font-size:.85rem;display:inline-flex}.btn{appearance:none;cursor:pointer;background:var(--accent);color:var(--accent-ink);border:none;border-radius:8px;padding:.65rem 1rem;font-weight:600}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-ghost{color:var(--text);border:1px solid var(--border);background:0 0}.btn-danger{color:var(--danger);border:1px solid color-mix(in srgb, var(--danger) 40%, var(--border));background:0 0}.field{flex-direction:column;gap:.35rem;margin-bottom:.85rem;display:flex}.field label{color:var(--muted);font-size:.85rem}.field input,.field textarea{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:.65rem .75rem}.mono{font-family:var(--mono);font-size:.85rem}.chat-log{flex-direction:column;gap:.65rem;max-height:420px;margin-bottom:.75rem;padding-right:.25rem;display:flex;overflow:auto}.bubble{white-space:pre-wrap;border-radius:10px;max-width:95%;padding:.65rem .8rem;line-height:1.45}.bubble.user{background:#314536;align-self:flex-end}.bubble.assistant{background:var(--bg-elev);border:1px solid var(--border);align-self:flex-start}.chat-row{gap:.5rem;display:flex}.chat-row textarea{resize:vertical;flex:1;min-height:48px}.table{border-collapse:collapse;width:100%;font-size:.9rem}.table th,.table td{text-align:left;border-bottom:1px solid var(--border);padding:.55rem .35rem}.table th{color:var(--muted);font-weight:500}.live-status{letter-spacing:-.02em;margin:.25rem 0 .75rem;font-size:1.4rem;font-weight:700}.err{color:var(--danger);font-size:.9rem}.ok{color:var(--ok)}.stack{flex-direction:column;gap:1rem;display:flex}.auth-wrap{max-width:420px;margin:4rem auto}.explain-grid{gap:.85rem;display:grid}@media (width>=800px){.explain-grid{grid-template-columns:1fr 1fr}}.explain-card{flex-direction:column;gap:.5rem;margin:0;display:flex}.explain-card img{border:1px solid var(--border);background:#1a221c;border-radius:10px;width:100%;height:auto}.explain-card figcaption{color:var(--muted);font-size:.85rem}
