:root{
  color-scheme:dark;
  --page-bg:#09090b;
  --input-bg:#0c0c0e;
  --panel-bg:#111113;
  --control-bg:#18181b;
  --control-hover:#27272a;
  --text-primary:#fafafa;
  --text-secondary:#e4e4e7;
  --text-muted:#a1a1aa;
  --text-faint:#a1a1aa;
  --surface-soft:rgba(255,255,255,.04);
  --surface-hover:rgba(255,255,255,.07);
  --line-soft:rgba(255,255,255,.08);
  --line:rgba(255,255,255,.15);
  --line-focus:rgba(255,255,255,.3);
  --header-bg:rgba(9,9,11,.9);
  --dots:rgba(255,255,255,.05);
  --accent:#22c55e;
  --focus:#4ade80;
  --success-text:#86efac;
  --danger:#ef4444;
  --danger-text:#fca5a5;
}
:root[data-theme=light]{
  color-scheme:light;
  --page-bg:#f5f6f8;
  --input-bg:#fff;
  --panel-bg:#fff;
  --control-bg:#f0f1f3;
  --control-hover:#e4e6e9;
  --text-primary:#18181b;
  --text-secondary:#303038;
  --text-muted:#52525b;
  --text-faint:#62626c;
  --surface-soft:rgba(0,0,0,.025);
  --surface-hover:rgba(0,0,0,.05);
  --line-soft:rgba(0,0,0,.1);
  --line:rgba(0,0,0,.16);
  --line-focus:rgba(0,0,0,.4);
  --header-bg:rgba(245,246,248,.94);
  --dots:rgba(0,0,0,.06);
  --accent:#15803d;
  --focus:#15803d;
  --success-text:#166534;
  --danger:#b91c1c;
  --danger-text:#b91c1c;
}
.theme-picker{height:34px;width:90px;flex-shrink:0;padding:0 6px;border:1px solid var(--line);border-radius:6px;background:var(--control-bg);color:var(--text-primary);font:12px Inter,system-ui,sans-serif;cursor:pointer}
.theme-picker:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.button:hover{color:var(--text-primary)}
.button{font:600 12px Inter,system-ui,sans-serif}
.h-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.gi-btn.open,.lb-x,.lb-x:hover{color:#fafafa}
header>.logo{flex-shrink:0}
body:has(.upload-card){grid-template-columns:minmax(0,1fr)}
main,header{min-width:0}
@media(max-width:620px){
  header{gap:10px;flex-wrap:wrap;height:auto;min-height:56px;padding-top:10px;padding-bottom:10px}
  header>.header-right{min-width:0;flex-wrap:wrap;justify-content:flex-end;flex:1}
  #auth-bar{flex-wrap:wrap;justify-content:flex-end;min-width:0}
  #auth-bar .user-pill{display:none}
  body:has(.upload-card){grid-template-rows:auto 1fr}
  .panel-head{flex-wrap:wrap}
  .gal-toolbar{flex-wrap:wrap}
  .gal-search{flex:1 1 100%;min-width:0}
  .gal-filter{flex:1;min-width:0}
}
