:root { --ink:#0b1b12; --muted:#5a6b62; --line:#d5e2da; --surface:#f2faf5; --paper:#fff; --accent:#22c55e; --accent-hover:#16a34a; --accent-ink:#052e16; --danger:#dc2626; --focus:rgba(34,197,94,.35); font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif; color:var(--ink); background:var(--surface); }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; min-height:100vh; background:var(--surface); }
button,input,textarea { font:inherit; }
button { cursor:pointer; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.login-shell { min-height:100vh; display:grid; grid-template-columns:minmax(0,1.2fr) minmax(22rem,.8fr); }
.login-brand { position:relative; isolation:isolate; overflow:hidden; padding:clamp(2rem,6vw,6rem); display:flex; flex-direction:column; justify-content:space-between; background:var(--ink); color:#fff; }
.brand-lockup { display:flex; align-items:center; gap:.8rem; width:max-content; }
.brand-lockup img { width:2.5rem; height:2.75rem; object-fit:contain; }
.brand-lockup strong { font-size:1.05rem; font-weight:700; letter-spacing:-.01em; }
.brand-wordmark { display:inline-flex; align-items:center; gap:.45rem; white-space:nowrap; }
.brand-dot { width:.375rem; height:.375rem; flex:none; border-radius:50%; background:var(--accent); }
.brand-descriptor { font-weight:500; }
.brand-statement { margin:auto 0 1.5rem; }
.brand-kicker { margin:0 0 1.25rem; color:#4ade80; font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.login-brand h1 { position:relative; z-index:1; max-width:13ch; margin:0; font-size:clamp(2.8rem,5.6vw,5.8rem); font-weight:700; line-height:1.04; letter-spacing:-.055em; }
.brand-capability { position:relative; z-index:1; max-width:36rem; margin:0; color:#a8b8ae; font-size:.92rem; line-height:1.7; }
.brand-watermark { position:absolute; z-index:-1; right:-13%; bottom:-27%; width:min(52vw,46rem); opacity:.08; transform:rotate(-7deg); pointer-events:none; user-select:none; }
.login-panel { padding:clamp(2rem,7vw,6rem); display:flex; flex-direction:column; justify-content:center; background:var(--paper); border-left:1px solid rgba(255,255,255,.08); }
.login-panel h2 { margin:.55rem 0 .5rem; font-size:clamp(1.8rem,2.8vw,2.4rem); line-height:1.2; letter-spacing:-.035em; }
.eyebrow { margin:0; color:var(--accent-hover); font-size:.72rem; font-weight:700; letter-spacing:.16em; }
.muted { color:var(--muted); }
#login-form { display:grid; gap:.65rem; margin-top:2.5rem; }
#login-form label { margin-top:.55rem; font-size:.82rem; font-weight:700; }
input,textarea { width:100%; border:1px solid var(--line); border-radius:.75rem; background:#fff; color:var(--ink); outline:none; transition:border-color .2s ease,box-shadow .2s ease; }
input { padding:.82rem .9rem; }
textarea { padding:.9rem 1rem; resize:none; line-height:1.5; }
input:focus,textarea:focus { border-color:var(--accent); box-shadow:0 0 0 3px var(--focus); }
button:focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
.primary,.send { border:1px solid transparent; border-radius:999px; background:var(--accent); color:var(--accent-ink); font-weight:700; transition:background .2s ease,transform .15s ease,box-shadow .2s ease; }
.primary { margin-top:1rem; padding:.9rem 1.2rem; box-shadow:0 8px 24px rgba(34,197,94,.24); }
.primary:hover { background:var(--accent-hover); color:#fff; transform:translateY(-1px); }
.primary:active { transform:scale(.98); }
.login-panel footer { margin-top:4rem; display:flex; flex-direction:column; gap:.12rem; color:#8a9a90; font-size:.64rem; letter-spacing:.015em; }
.login-panel footer small { font-size:.62rem; color:#a1ada6; }
.form-error { color:var(--danger); font-size:.84rem; }
.secondary { padding:.9rem 1.2rem; border:1px solid var(--line); border-radius:999px; background:var(--paper); color:var(--ink); font-weight:700; }
.secondary:hover { border-color:var(--accent-hover); }
.app-shell { min-height:100vh; display:grid; grid-template-columns:18rem minmax(0,1fr); }
.sidebar { height:100vh; padding:1.25rem; display:flex; flex-direction:column; background:var(--ink); color:#fff; }
.sidebar header { display:flex; align-items:baseline; gap:.7rem; padding:.35rem .35rem 1.5rem; }
.sidebar header span { color:#9faa9f; }
.new-session { padding:.78rem; border:1px solid #435048; border-radius:.4rem; background:transparent; color:#fff; text-align:left; }
#session-list { display:flex; flex-direction:column; gap:.3rem; margin-top:1rem; overflow:auto; }
.session-item { padding:.75rem; display:flex; flex-direction:column; gap:.25rem; border:0; border-radius:.35rem; background:transparent; color:#e8eee9; text-align:left; }
.session-item small { color:#8e9a92; }
.session-item:hover,.session-item.is-active { background:#2b3730; }
.empty { padding:1rem .5rem; color:#8e9a92; font-size:.84rem; line-height:1.5; }
.sidebar-footer { margin-top:auto; padding:.8rem .35rem 0; display:flex; align-items:center; gap:.5rem; color:#9faa9f; font-size:.75rem; }
.sidebar-footer button { margin-left:auto; border:0; background:none; color:#cbd3cd; }
.status-dot { width:.5rem; height:.5rem; border-radius:50%; background:var(--accent); }
.workspace { height:100vh; min-width:0; display:grid; grid-template-rows:auto minmax(0,1fr) auto; background:var(--paper); }
.workspace-header { padding:1.25rem 2rem; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); }
.workspace-header h1 { margin:.25rem 0 0; font-size:1.25rem; }
.provider-access { margin:.5rem 0 0; }
.provider-access-title { margin:0; color:var(--ink); font-size:.85rem; font-weight:700; }
.provider-access-detail { margin:.15rem 0 0; color:var(--muted); font-size:.78rem; }
.account-menu { position:relative; }
.account-menu summary { min-width:8rem; padding:.62rem .85rem; border:1px solid var(--line); border-radius:.45rem; color:var(--ink); font-weight:700; list-style:none; cursor:pointer; }
.account-menu summary::-webkit-details-marker { display:none; }
.account-menu summary::after { content:"v"; float:right; color:var(--muted); }
.account-menu[open] summary { border-color:var(--accent); box-shadow:0 0 0 3px var(--focus); }
.account-menu-panel { position:absolute; z-index:4; right:0; top:calc(100% + .45rem); min-width:13rem; padding:.45rem; display:grid; gap:.25rem; border:1px solid var(--line); border-radius:.45rem; background:var(--paper); box-shadow:0 12px 30px rgba(22,33,29,.14); }
.account-menu-panel p { margin:.25rem .45rem .4rem; color:var(--muted); font-size:.78rem; }
.account-menu-panel button { width:100%; padding:.62rem .7rem; border:0; border-radius:.35rem; background:transparent; color:var(--ink); text-align:left; }
.account-menu-panel button:hover { background:var(--surface); }
.account-menu-panel button:disabled { opacity:.58; cursor:wait; }
.runtime-state { color:var(--muted); font-size:.78rem; }
.conversation { padding:2rem max(1.5rem,calc((100% - 52rem)/2)); overflow:auto; }
.conversation-empty { height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; color:var(--muted); text-align:center; }
.conversation-empty p { margin:0 0 .4rem; color:var(--ink); font-family:Georgia,"Songti SC",serif; font-size:1.8rem; }
.message { max-width:44rem; margin:0 0 1.5rem; }
.message-user { margin-left:auto; }
.message-label { margin-bottom:.35rem; color:var(--muted); font-size:.68rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.message-body { padding:1rem 1.1rem; border:1px solid var(--line); border-radius:.55rem; line-height:1.65; background:#fff; }
.message-user .message-body { background:#eef2ed; border-color:#eef2ed; }
.message-system { max-width:34rem; opacity:.72; }
.message-system .message-body { padding:.55rem .75rem; font-size:.8rem; background:var(--surface); }
.composer { margin:0 auto; width:min(52rem,calc(100% - 3rem)); padding:1rem 0 1.5rem; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.65rem; background:#fff; }
.send { min-width:5rem; padding:0 1rem; }
.send:disabled { opacity:.55; cursor:wait; }
.toast { position:fixed; right:1rem; bottom:1rem; max-width:24rem; padding:.85rem 1rem; border:1px solid #e4b4b4; border-radius:.45rem; background:#fff2f2; color:var(--danger); box-shadow:0 8px 28px rgba(22,33,29,.12); }
@media (max-width:760px) { .login-shell { grid-template-columns:1fr; } .login-brand { min-height:38vh; padding:1.5rem; } .brand-lockup img { width:2rem; height:2.2rem; } .brand-statement { margin:3.5rem 0 1.25rem; } .brand-kicker { margin-bottom:.75rem; } .login-brand h1 { font-size:clamp(2.35rem,12vw,3.2rem); } .brand-capability { font-size:.78rem; } .brand-watermark { right:-18%; bottom:-45%; width:80vw; } .login-panel { min-height:62vh; padding:2rem 1.5rem; } .login-panel footer { margin-top:2.5rem; } .app-shell { grid-template-columns:1fr; } .sidebar { height:auto; max-height:15rem; } .sidebar header,.sidebar-footer { display:none; } #session-list { flex-direction:row; } .session-item { min-width:10rem; } .workspace { height:calc(100vh - 15rem); } .workspace-header { padding:1rem; } .runtime-state { display:none; } .conversation { padding:1rem; } .composer { width:calc(100% - 2rem); } }

@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; animation-iteration-count:1!important; } }