:root {
  color-scheme: light;
  --ink:#171a18; --muted:#68716b; --line:#dde2de; --paper:#f6f7f4; --card:#fff;
  --lime:#d8ff3e; --forest:#173c2d; --red:#b44034; --amber:#b46b14;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing:border-box }
body { margin:0; color:var(--ink); background:var(--paper); min-height:100vh }
button,input,select,textarea { font:inherit }
button { cursor:pointer }
.topbar { height:68px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 26px; background:var(--forest); color:white; position:sticky; top:0; z-index:5 }
.brand { display:block; font-size:12px; letter-spacing:.15em; font-weight:800; color:var(--lime) }
.subtitle { font-size:17px; font-weight:650 }
.identity { display:flex; align-items:center; gap:14px; font-size:13px }
.layout { min-height:calc(100vh - 68px); display:grid; grid-template-columns:minmax(390px,460px) minmax(0,1fr) }
.sidebar { border-right:1px solid var(--line); background:#eef1ec; height:calc(100vh - 68px); overflow:hidden; position:sticky; top:68px; display:flex; flex-direction:column; min-width:0 }
.sidebar-head { flex:0 0 auto; padding:20px 18px 14px; border-bottom:1px solid var(--line); background:#eef1ec; box-shadow:0 5px 12px rgba(14,31,20,.035); z-index:1 }
.search span,.field > span { display:block; color:var(--muted); font-size:12px; font-weight:700; margin-bottom:7px }
input,select,textarea { width:100%; border:1px solid #cbd2cc; border-radius:10px; padding:11px 12px; background:white; color:var(--ink); outline:none }
input:focus,select:focus,textarea:focus { border-color:#537764; box-shadow:0 0 0 3px #dceadf }
select[multiple] { min-height:180px; padding:6px }
select[multiple] option { padding:6px 8px; border-radius:5px }
#catalog-status { margin:10px 1px 0 }
#datasets { display:flex; flex:1 1 auto; min-height:0; flex-direction:column; gap:4px; margin:0; padding:10px; overflow-y:auto; overflow-x:hidden; scrollbar-gutter:stable }
.dataset-button { display:block; width:100%; min-width:0; text-align:left; border:1px solid transparent; border-radius:10px; padding:10px 12px; background:transparent; color:var(--ink); line-height:1.25 }
.dataset-button:hover { background:rgba(255,255,255,.72); border-color:#d7ddd8 }
.dataset-button.active { background:white; border-color:#a9bbae; box-shadow:inset 3px 0 0 #3e7358,0 1px 2px rgba(0,0,0,.04) }
.dataset-button strong { display:block; width:100%; white-space:normal; overflow-wrap:anywhere; font-size:14px; line-height:1.32 }
.dataset-button small { display:block; width:100%; color:var(--muted); margin-top:4px; font-size:11px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.catalog-empty { color:var(--muted); font-size:13px; line-height:1.45; padding:22px 12px; text-align:center }
.main { padding:34px; min-width:0 }
.empty { max-width:660px; margin:14vh auto; text-align:center }
.eyebrow { color:#4d6c5a; text-transform:uppercase; letter-spacing:.1em; font-size:12px; font-weight:800 }
h1 { font-size:34px; line-height:1.08; margin:10px 0 }
h2 { font-size:21px; margin:0 }
p { line-height:1.55 }
.muted { color:var(--muted); font-size:13px; margin-top:12px }
.page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:24px }
.page-head p { margin:7px 0 0; color:var(--muted) }
.actions { display:flex; gap:9px; flex-wrap:wrap }
button,.button { border:0; border-radius:9px; padding:10px 14px; background:#e2e6e2; color:var(--ink); font-weight:700; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; gap:6px }
button.primary,.button.primary { background:var(--lime); color:#152315 }
button.dark { background:var(--forest); color:white }
button.ghost { color:white; border:1px solid rgba(255,255,255,.28); background:transparent; padding:7px 11px }
button:disabled { opacity:.45; cursor:not-allowed }
.workspace-grid { display:grid; grid-template-columns:minmax(440px,520px) minmax(0,1fr); gap:22px; align-items:start }
.right-stack { display:grid; gap:22px; min-width:0 }
.card { border:1px solid var(--line); border-radius:15px; background:var(--card); padding:20px; box-shadow:0 2px 10px rgba(14,31,20,.035) }
.card-head { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:17px }
.tabs { display:flex; gap:4px; background:#edf0ec; padding:4px; border-radius:10px; margin-bottom:17px }
.tab { flex:1; padding:8px 6px; font-size:13px; background:transparent }
.tab.active { background:white; box-shadow:0 1px 3px rgba(0,0,0,.08) }
.field { display:block; margin:13px 0 }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:10px }
.check { display:flex; gap:9px; align-items:flex-start; font-size:13px; color:var(--muted); margin:14px 0 }
.check input { width:auto; margin-top:2px }
.hint { border-radius:10px; background:#f2f5ee; padding:11px 12px; font-size:13px; line-height:1.45; color:#4e5c53; margin:12px 0 }
.hint.warning { background:#fff7e8; color:#73531c }
.filter { display:grid; grid-template-columns:1.25fr 1fr 1.15fr auto; gap:7px; margin:8px 0 }
.filter button { padding:8px 11px }
.filter-head { display:grid; grid-template-columns:1.25fr 1fr 1.15fr 38px; gap:7px; margin:13px 0 -2px; padding:0 2px; color:var(--muted); font-size:10px; font-weight:800; letter-spacing:.04em; text-transform:uppercase }
.filter-logic { max-width:320px }
.remove-filter { color:#7a3d37; background:#f4e9e7 }
.compact-row { grid-template-columns:minmax(180px,260px) }
.inline-muted { margin:0; white-space:nowrap }
.columns-hint { color:var(--muted); font-size:13px; line-height:1.45; margin:-6px 0 14px }
.columns-toolbar { display:grid; grid-template-columns:minmax(150px,1fr) auto auto; gap:7px; margin-bottom:10px }
.columns-toolbar input { min-width:0 }
.columns-toolbar button { padding-inline:12px }
.columns-list { display:flex; flex-direction:column; gap:5px; max-height:360px; overflow:auto; padding-right:4px; scrollbar-gutter:stable }
.column-item { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:10px; align-items:center; padding:9px 10px; border:1px solid #e5e9e5; border-radius:10px; background:#fafbf9; cursor:pointer }
.column-item:hover { border-color:#bbc9bf; background:#f6f9f5 }
.column-item input { width:auto; margin:0 }
.column-copy { min-width:0 }
.column-copy strong { display:block; font-size:13px; line-height:1.3; overflow-wrap:anywhere }
.column-copy small { display:block; margin-top:3px; color:var(--muted); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.column-type { color:#45604f; background:#eaf1eb; border-radius:999px; padding:4px 7px; font-size:10px; font-weight:750; white-space:nowrap }
.columns-loading,.columns-empty { display:flex; min-height:150px; flex-direction:column; align-items:center; justify-content:center; gap:7px; padding:24px; border:1px dashed #cfd7d1; border-radius:11px; color:var(--muted); text-align:center; font-size:13px; line-height:1.45 }
.columns-empty strong { color:var(--ink) }
.columns-empty.compact { min-height:90px }
textarea { min-height:150px; resize:vertical; font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:13px }
.table-wrap { overflow:auto }
table { width:100%; border-collapse:collapse; font-size:13px }
th { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.05em; text-align:left; padding:0 9px 10px }
td { border-top:1px solid var(--line); padding:12px 9px; vertical-align:middle }
.status { display:inline-flex; border-radius:999px; padding:5px 8px; font-size:11px; font-weight:800 }
.status.ready { color:#1d653c; background:#dff3e5 }
.status.failed,.status.expired { color:var(--red); background:#f7e4e1 }
.status.queued,.status.running { color:var(--amber); background:#fff0d8 }
.empty-row { text-align:center; color:var(--muted); padding:35px }
.cost { color:#304e3d; font-weight:700 }
.hidden { display:none !important }
#toast { position:fixed; right:22px; bottom:22px; max-width:410px; border-radius:11px; padding:12px 15px; background:#17261e; color:white; opacity:0; transform:translateY(10px); pointer-events:none; transition:.2s; z-index:20 }
#toast.show { opacity:1; transform:none }
#toast.error { background:#7f2f28 }
.auth-shell { display:grid; place-items:center; min-height:100vh; background:var(--forest); padding:24px }
.auth-card { width:min(520px,100%); border-radius:20px; background:white; padding:38px }
.auth-card h1 { margin-top:18px }
@media (max-width:1250px) { .workspace-grid{grid-template-columns:1fr}.columns-list{max-height:430px} }
@media (max-width:1100px) { .layout{grid-template-columns:minmax(320px,38vw) minmax(0,1fr)}.main{padding:24px} }
@media (max-width:700px) { .layout{display:block}.sidebar{position:relative;top:0;height:auto;max-height:44vh;border-right:0;border-bottom:1px solid var(--line)}.sidebar-head{padding:16px}.main{padding:20px}.topbar{padding:0 16px}.subtitle{display:none}.page-head{display:block}.actions{margin-top:14px}.filter{grid-template-columns:1fr}.filter-head{display:none}.field-row{grid-template-columns:1fr}.columns-toolbar{grid-template-columns:1fr 1fr}.columns-toolbar input{grid-column:1/-1}.column-type{display:none} }