:root{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
  --bg:#f5f7f6;--panel:#fff;--panel-2:#eef3f1;--text:#16302c;--muted:#61746f;
  --line:#d6dfdc;--accent:#116e5a;--accent-2:#0e5c4c;--danger:#ad3842;
  --shadow:0 12px 32px rgba(19,49,43,.07)
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0c1715;--panel:#132420;--panel-2:#1a302a;--text:#e6f1ed;--muted:#9db2ab;
  --line:#2b453d;--accent:#7bd5b7;--accent-2:#97e6cc;--danger:#ff9aa2;
  --shadow:none
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text)}
body{min-height:100dvh}
button,input,select,textarea{font:inherit;color:inherit}
button,select,input,textarea{border:1px solid var(--line);background:var(--panel);border-radius:11px;padding:10px 12px}
button{cursor:pointer}
button:hover{border-color:var(--accent)}
button:disabled{opacity:.5;cursor:not-allowed}
button.primary{background:var(--accent);color:var(--bg);border-color:var(--accent);font-weight:800}
button.primary:hover{background:var(--accent-2)}
button.wide{width:100%}
:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 45%,transparent);outline-offset:2px}
h1,h2,p{margin-top:0}
h1{font-size:21px;letter-spacing:-.5px;margin-bottom:6px}
h2{font-size:26px;letter-spacing:-.8px;margin-bottom:0}
.eyebrow{font-size:10px;font-weight:850;letter-spacing:1.8px;color:var(--muted)}
.muted{font-size:12px;color:var(--muted);line-height:1.55}
.app-shell{max-width:1500px;margin:auto;display:grid;grid-template-columns:270px minmax(0,1fr);min-height:100dvh}
.sidebar{border-right:1px solid var(--line);padding:24px 18px;display:flex;flex-direction:column;gap:18px}
.sidebar summary,.settings summary{cursor:pointer;font-size:13px;font-weight:750}
.history{display:flex;flex-direction:column;gap:6px;margin-top:10px;max-height:46vh;overflow:auto}
.history button{text-align:left;font-size:12px;overflow-wrap:anywhere}
.history button[aria-current="true"]{background:var(--panel-2);border-color:var(--accent)}
.sidebar-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.sidebar-actions button{font-size:12px}
.privacy-card{margin-top:auto;background:var(--panel-2);border:1px solid var(--line);border-radius:14px;padding:14px;display:grid;gap:6px}
.privacy-card strong{font-size:13px}.privacy-card span{font-size:11px;color:var(--muted);line-height:1.55}
.main{min-width:0;display:flex;flex-direction:column}
.topbar{padding:24px 30px 18px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px)}
.title-row,.toolbar,.capabilities,.composer-row,.send-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.title-row{justify-content:space-between}
.toolbar{margin-top:18px}
.toolbar label{display:grid;gap:6px;font-size:12px}
.badge{border:1px solid var(--line);background:var(--panel);border-radius:999px;padding:7px 11px;font-size:11px;font-weight:700}
.capabilities{margin-top:14px;gap:14px;color:var(--muted);font-size:12px}
.capabilities b{color:var(--text);font-variant-numeric:tabular-nums}
.status{margin-top:13px;font-size:13px;white-space:pre-wrap;line-height:1.5}
progress{width:100%;height:5px;margin-top:8px;accent-color:var(--accent)}
.settings{padding:14px 30px;border-bottom:1px solid var(--line)}
.setting-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:14px}
.setting-grid label{display:grid;gap:6px;font-size:12px}
.setting-grid input,.setting-grid select{width:100%;min-width:0}
.info-block{margin-top:14px;white-space:pre-wrap}
.note{margin-top:10px;padding:11px 13px;border-radius:11px;background:var(--panel-2);font-size:12px;line-height:1.6}
.chat{flex:1;padding:24px 30px;display:flex;flex-direction:column;gap:16px}
.welcome{max-width:670px;margin:55px auto;text-align:center}
.welcome h3{font-size:30px;letter-spacing:-1px;margin:6px 0 10px}
.message{max-width:min(92%,900px);border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:15px 18px;line-height:1.72;white-space:pre-wrap;overflow-wrap:anywhere;box-shadow:var(--shadow)}
.message.user{align-self:flex-end;background:var(--panel-2)}
.message.assistant{align-self:flex-start}
.message img{display:block;max-width:100%;max-height:320px;border-radius:10px;margin-bottom:10px}
.message small{display:block;margin-top:8px;color:var(--muted)}
.composer{position:sticky;bottom:0;padding:14px 30px max(14px,env(safe-area-inset-bottom));border-top:1px solid var(--line);background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(15px)}
.composer textarea{width:100%;min-height:84px;max-height:260px;resize:vertical;margin:10px 0}
.composer-row{justify-content:space-between}
.quick-actions,.attachments{display:flex;flex-wrap:wrap;gap:7px}
.quick-actions button{font-size:12px;padding:7px 10px}
.attachments span{font-size:12px;background:var(--panel-2);border:1px solid var(--line);border-radius:9px;padding:7px 9px}
.attachments button{border:0;background:transparent;padding:0 0 0 7px}
.dragging{outline:4px dashed var(--accent);outline-offset:-7px}
.error{color:var(--danger)}
[hidden]{display:none!important}

@media(max-width:800px){
  html,body{overscroll-behavior-y:none}
  .app-shell{display:block;min-height:100dvh;max-width:none}

  .sidebar{
    position:sticky;top:0;z-index:50;
    display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center;
    gap:8px;padding:8px 10px;border-right:0;border-bottom:1px solid var(--line);
    background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(16px)
  }
  .sidebar>div:first-child{min-width:0}
  .sidebar>div:first-child .eyebrow,.sidebar>div:first-child p{display:none}
  .sidebar h1{font-size:16px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #newChat{width:44px;height:44px;padding:0;font-size:0;justify-self:end}
  #newChat::after{content:"＋";font-size:24px;line-height:1}
  .sidebar details{grid-column:1/-1}
  .sidebar details summary{padding:7px 2px}
  .history{max-height:28vh;margin-top:7px}
  .sidebar-actions{display:none;grid-column:1/-1;grid-template-columns:repeat(4,1fr);gap:6px}
  .sidebar details[open]~.sidebar-actions{display:grid}
  .sidebar-actions button{padding:8px 5px;font-size:11px}
  .sidebar .privacy-card{display:none}

  .main{min-height:calc(100dvh - 61px)}
  .topbar{padding:10px 12px 8px}
  .title-row .eyebrow{display:none}
  .title-row h2{font-size:18px;letter-spacing:-.4px}
  .badge{max-width:48vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:5px 8px;font-size:10px}

  .toolbar{margin-top:10px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
  .toolbar label{gap:4px;font-size:10px;min-width:0}
  .toolbar select{width:100%;min-width:0;padding:9px 8px;font-size:13px}
  #loadModel,#unloadModel{min-height:40px;padding:8px 10px;font-size:13px}
  #install{grid-column:1/-1}

  .capabilities{margin-top:8px;display:flex;flex-wrap:nowrap;overflow-x:auto;gap:12px;padding-bottom:2px;white-space:nowrap;scrollbar-width:none}
  .capabilities::-webkit-scrollbar{display:none}
  .capabilities span{flex:0 0 auto;font-size:10px}
  .status{margin-top:7px;font-size:11px;line-height:1.4;max-height:3em;overflow:auto}
  progress{height:4px;margin-top:5px}

  .settings{padding:9px 12px}
  .settings summary{font-size:12px}
  .setting-grid{grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
  .setting-grid label{font-size:10px;gap:4px}
  .setting-grid input,.setting-grid select{padding:9px 8px;font-size:13px}
  .info-block{margin-top:10px}
  .note{font-size:11px;padding:9px 10px}

  .chat{padding:12px 10px;gap:10px}
  .welcome{margin:18px 4px}
  .welcome h3{font-size:22px}
  .message{padding:12px 14px;border-radius:14px;font-size:15px;line-height:1.65;box-shadow:none}
  .message.user{max-width:92%;align-self:flex-end}
  .message.assistant{max-width:100%;align-self:stretch}

  .composer{
    z-index:60;padding:8px 10px max(8px,env(safe-area-inset-bottom));
    box-shadow:0 -8px 24px color-mix(in srgb,var(--text) 8%,transparent)
  }
  .quick-actions{flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding-bottom:2px}
  .quick-actions::-webkit-scrollbar{display:none}
  .quick-actions button{flex:0 0 auto;white-space:nowrap;padding:8px 12px;border-radius:999px;scroll-snap-align:start}
  .attachments{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .attachments::-webkit-scrollbar{display:none}
  .attachments span{flex:0 0 auto}
  .composer textarea{min-height:52px;height:52px;max-height:152px;resize:none;margin:8px 0;padding:12px 14px;border-radius:16px;font-size:16px;line-height:1.45}
  .composer-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
  .composer-row>div:first-child{min-width:0;display:flex;align-items:center}
  .file-types{display:none}
  #attach{height:44px;padding:0 14px;white-space:nowrap}
  .send-row{gap:6px;flex-wrap:nowrap}
  #send{min-width:78px;height:44px;padding:0 18px;border-radius:14px;font-size:16px}
  #stop{height:44px;padding:0 12px;white-space:nowrap}
}

@media(max-width:420px){
  .toolbar{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
  .setting-grid{grid-template-columns:1fr 1fr}
  .message{font-size:14.5px}
}