:root { color-scheme:light dark; --bg:#f7f9fa; --surface:#fff; --ink:#142b31; --muted:#526970; --line:#cbd8dc; --accent:#086a5b; --soft:#e5f3ee; }
@media(prefers-color-scheme:dark) { :root { --bg:#0e171c; --surface:#15232a; --ink:#e7f1f4; --muted:#a4bac3; --line:#354a53; --accent:#6edcba; --soft:#163f35; } }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.55 system-ui,sans-serif; }
a { color:var(--accent); text-underline-offset:3px; }
header,footer { display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; padding:20px max(24px,calc((100vw - 1280px)/2)); border-bottom:1px solid var(--line); }
header nav,footer { display:flex; gap:24px; }
.brand { color:var(--ink); font-size:21px; font-weight:750; text-decoration:none; }
main { max-width:1328px; margin:auto; padding:24px; }
section { margin-bottom:42px; scroll-margin-top:20px; }
h1 { font-size:clamp(26px,4vw,36px); letter-spacing:-.025em; line-height:1.15; margin:8px 0 14px; }
h2 { font-size:24px; line-height:1.3; margin:8px 0 16px; }
h3 { font-size:17px; margin:0 0 10px; }
p { margin:8px 0 14px; }
.eyebrow { color:var(--accent); font-weight:700; letter-spacing:.08em; font-size:12px; }
.workspace-builder { border:1px solid var(--line); background:var(--surface); padding:24px; border-radius:12px; }
.workspace-controls,.filters { display:flex; flex-wrap:wrap; align-items:end; gap:12px; }
label { display:flex; flex-direction:column; gap:6px; font-size:14px; font-weight:600; }
.filters label:first-child { flex:1; min-width:200px; }
input,select,button { font:inherit; color:inherit; background:var(--surface); border:1px solid var(--line); border-radius:6px; padding:10px 12px; min-height:44px; }
button { cursor:pointer; font-size:14px; font-weight:600; }
button:hover { border-color:var(--accent); }
#saveWorkspace { color:var(--surface); background:var(--accent); border-color:var(--accent); }
input[type=checkbox] { width:20px; height:20px; min-height:0; accent-color:var(--accent); cursor:pointer; }
button:disabled,input:disabled { cursor:default; opacity:.6; }
:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.note { color:var(--muted); font-size:14px; margin-top:14px; }
.workspace-tools { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.tool-link { padding:8px 12px; border:1px solid var(--line); border-radius:6px; text-decoration:none; font-size:14px; }
span.tool-link { color:var(--muted); }
.catalog-heading { display:flex; justify-content:space-between; flex-wrap:wrap; align-items:center; gap:16px; }
.table-scroll { overflow:auto; margin-top:18px; border:1px solid var(--line); border-radius:8px; }
table { width:100%; border-collapse:collapse; text-align:left; background:var(--surface); }
th { font-size:14px; background:var(--soft); padding:12px; white-space:nowrap; }
td { padding:16px 12px; vertical-align:top; border-top:1px solid var(--line); min-width:120px; }
td:nth-child(2) { min-width:260px; max-width:480px; }
td p { color:var(--muted); font-size:14px; margin:6px 0; }
.badge { display:inline-block; font-size:14px; border:1px solid var(--line); border-radius:4px; padding:2px 8px; white-space:nowrap; }
.badge.pro { color:var(--accent); border-color:var(--accent); }
.access-options { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; }
.access-options article { border-top:2px solid var(--line); padding:16px 0; }
.access-options p { font-size:14px; color:var(--muted); }
footer { border-top:1px solid var(--line); border-bottom:0; justify-content:flex-start; font-size:14px; }
.skip-link { position:absolute; left:20px; top:-100px; background:var(--surface); padding:12px; z-index:5; }
.skip-link:focus { top:12px; }
@media(max-width:600px) { main { padding:16px; } .workspace-builder { padding:16px; } .workspace-controls label { width:100%; } header { padding:16px; } header nav { gap:16px; font-size:14px; } }