/* Application shell and document workspace; app.css holds shared form/table primitives. */
:root { --bg:#f6f7f9; --text:#202635; --muted:#7a8190; --line:#e7e9ef; --line-strong:#d8dce5; --accent:#5364db; --accent-hover:#4353c3; --accent-soft:#eef0ff; --radius:12px; font-size:14px; }
body { -webkit-font-smoothing:antialiased; }
h1 { font-size:27px; letter-spacing:-.8px; font-weight:650; }
h2 { font-size:16px; }
svg { flex-shrink:0; }
button, a, input, select, textarea { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid #a3adfa; outline-offset:3px; }
.skip-link { position:fixed; left:260px; top:-60px; z-index:20; padding:12px; background:white; }.skip-link:focus { top:8px; }
.sidebar { width:236px; position:fixed; inset:0 auto 0 0; display:flex; flex-direction:column; padding:28px 18px 18px; background:#fff; border-right:1px solid var(--line); z-index:10; }
.brand { display:flex; align-items:center; gap:10px; color:var(--text); font-size:23px; letter-spacing:-.8px; padding:0 8px; }
.brand-mark { display:flex; align-items:center; justify-content:center; width:38px; height:42px; background:var(--accent); border-radius:10px; color:white; }
.brand-light { font-weight:400; }.brand small { display:block; font-size:10px; letter-spacing:.15px; color:var(--muted); font-weight:400; margin-top:1px; }
.create-button { margin:34px 0 25px; min-height:42px; box-shadow:0 4px 10px #5364db17; }
.nav { display:flex; flex-direction:column; gap:5px; flex:1; flex-wrap:nowrap; }
.nav-label { font-size:9px; font-weight:650; letter-spacing:1.3px; color:#9ba0ad; margin:12px 12px 6px; }.nav-label:not(:first-child) { margin-top:32px; }
.nav a { display:flex; align-items:center; gap:12px; color:#727a8b; padding:12px; border-radius:8px; font-size:13px; }
.nav a:hover { color:var(--accent); background:#f7f8fd; }.nav a.active { color:var(--accent); background:var(--accent-soft); font-weight:600; }
.sidebar-bottom { display:flex; gap:9px; align-items:center; padding:18px 2px 0; border-top:1px solid var(--line); }.sidebar-bottom form { margin:0; }
.avatar { display:grid; place-items:center; width:32px; height:32px; flex-shrink:0; background:#f0eaf9; color:#8463a5; border-radius:50%; font-weight:600; }
.profile { min-width:0; flex:1; }.profile a { display:block; color:var(--text); font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.profile span { color:var(--muted); font-size:10px; }
.workspace-header { margin-left:236px; height:73px; border-bottom:1px solid var(--line); background:#ffffffb8; display:flex; justify-content:space-between; align-items:center; padding:0 34px; font-size:12px; gap:16px; }
.breadcrumb-slash { color:#c7cbd4; margin:0 12px; }.workspace-badge { display:flex; align-items:center; gap:7px; color:var(--muted); font-size:11px; }.workspace-badge span { width:6px; height:6px; background:#68ac94; border-radius:50%; }
.workspace .page, .workspace .page.wide { max-width:none; margin-left:236px; padding:34px 34px 60px; }
.head-row { margin-bottom:26px; align-items:center; }.page-description { margin:7px 0 0; color:var(--muted); font-size:13px; line-height:1.65; }.eyebrow { color:var(--accent); font-size:10px; font-weight:600; letter-spacing:1.6px; margin-bottom:8px; }
.btn { min-height:38px; border-radius:7px; padding:9px 15px; font-size:12px; gap:7px; }.btn.primary { font-weight:500; }.card { box-shadow:0 2px 5px #20263502; }.card.narrow { margin-top:12px; }.count { display:inline-block; background:#edeff4; border-radius:6px; padding:2px 7px; font-size:12px; vertical-align:middle; letter-spacing:0; }
input, select, textarea { padding:10px 11px; border-radius:7px; font-size:12px; min-height:38px; }input[type=checkbox] { min-height:0; }label { font-size:12px; gap:7px; }
.table-wrap { border-radius:10px; }table.grid th { background:#fafbfc; font-size:10px; font-weight:500; padding:13px 16px; }table.grid td { padding:17px 16px; font-size:12px; vertical-align:middle; }table.grid td a { color:var(--text); font-weight:500; }table.grid td a:hover { color:var(--accent); }table.grid td .small { margin-top:4px; font-size:10px; }table.grid tbody tr:hover td { background:#f9faff; }.tag { font-size:10px; padding:4px 8px; background:#ebf6ef; color:#428262; font-weight:500; }.tag-red { background:var(--bad-soft); color:var(--bad); }.tag-neutral { background:#f0f1f6; color:var(--muted); }
.filters { padding:16px; background:white; border:1px solid var(--line); border-radius:10px; margin-bottom:18px; gap:10px; }.filters input[name=q] { max-width:none; }.filter-search { display:flex; align-items:center; gap:9px; flex:1; color:#969dad; }.filter-search input { width:100%; }.filters select { min-width:160px; }
.summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:0 0 30px; }.summary-card { padding:20px; border:1px solid var(--line); border-radius:11px; background:white; }.summary-top { display:flex; justify-content:space-between; color:var(--muted); font-size:11px; }.summary-top svg { color:#9ca4c7; }.summary-card b { display:block; font-size:28px; line-height:1.2; margin:14px 0 6px; font-weight:600; letter-spacing:-1px; }.summary-card small { font-size:10px; color:#999fae; }
.section-heading { display:flex; align-items:center; justify-content:space-between; margin:0 0 14px; }.section-heading h2 { margin:0; }.section-heading span { color:var(--muted); font-size:11px; }
.empty-state { padding:48px 24px; border-style:solid; }.empty-state svg { color:#8d98d8; margin-bottom:10px; }.empty-state h2 { margin:0 0 8px; color:var(--text); }.empty-state p { max-width:390px; margin:0 auto 18px; font-size:12px; line-height:1.7; }
.builder-layout { display:grid; grid-template-columns:285px minmax(0,1fr); gap:24px; align-items:start; }.builder-settings { padding:0; overflow:hidden; }.panel-heading { padding:20px 22px; border-bottom:1px solid var(--line); display:flex; gap:9px; align-items:center; font-weight:600; font-size:13px; }.panel-heading svg { color:var(--accent); }.builder-form { padding:22px; gap:20px; }.field-heading { display:flex; align-items:center; gap:7px; margin:0 0 12px; font-size:12px; font-weight:600; }.step-number { display:grid; place-items:center; width:21px; height:21px; border-radius:50%; background:var(--accent-soft); color:var(--accent); font-size:10px; }.builder-form select { width:100%; }.date-fields { display:grid; grid-template-columns:1fr 1fr; gap:9px; }.date-fields input { width:100%; padding:9px 6px; font-size:11px; }.period-presets { display:flex; gap:6px; margin-top:10px; }.period-presets button { font-size:10px; border:1px solid var(--line); border-radius:5px; background:white; color:var(--muted); padding:5px 7px; cursor:pointer; }.period-presets button:hover { color:var(--accent); border-color:var(--accent); }.builder-help { border-top:1px solid var(--line); margin:0 22px; padding:17px 0; font-size:11px; color:var(--muted); line-height:1.7; }
.document-stage { min-width:0; background:#eceef3; border:1px solid #dfe3eb; border-radius:12px; overflow:hidden; }.stage-toolbar { min-height:56px; background:#fff; padding:14px 20px; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); font-size:12px; gap:10px; }.stage-toolbar strong { font-weight:500; }.stage-toolbar .tag { font-size:9px; }.stage-body { padding:24px; min-height:465px; }.stage-body .doc-preview { border:0; border-radius:0; box-shadow:0 3px 16px #252d4510; height:540px; display:block; }.stage-empty { min-height:390px; background:white; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:32px; box-shadow:0 3px 16px #252d4508; }.stage-empty svg { color:#a8b0d3; margin-bottom:20px; }.stage-empty h2 { margin:0 0 10px; font-size:17px; }.stage-empty p { max-width:310px; font-size:12px; line-height:1.75; color:var(--muted); margin:0; }.stage-footer { padding:15px 20px; font-size:11px; color:var(--muted); display:flex; align-items:center; justify-content:space-between; gap:12px; background:#f8f9fb; border-top:1px solid var(--line); }.preview-bar { background:white; padding:18px 20px; margin:18px 0 0; border:1px solid var(--line); border-radius:10px; }.preview-bar .muted { font-size:11px; }.document-workflow { display:flex; gap:25px; list-style:none; padding:0; margin:0 0 28px; color:var(--muted); font-size:11px; }.document-workflow li { display:flex; align-items:center; gap:8px; }.document-workflow .on { color:var(--accent); }.document-workflow .on .step-number { background:var(--accent); color:white; }
.upload-zone { border:1px dashed #bbc3e7; border-radius:10px; padding:27px 20px; background:#f9faff; text-align:center; align-items:center; }.upload-zone input { max-width:100%; border:0; background:transparent; }.upload-zone svg { color:var(--accent); }.upload-zone span { font-weight:400; font-size:11px; color:var(--muted); }
.auth-page { background:radial-gradient(ellipse at top,#e9ecff,transparent 65%),#f7f8fb; }.card.login { padding:34px; max-width:410px; border-radius:16px; box-shadow:0 12px 50px #3439670a; }.card.login h1 { margin-top:16px; }.login-page { padding:24px; }.mobile-menu { display:none; }
@media (min-width:1700px) { .workspace .page { max-width:1600px; }.builder-layout { grid-template-columns:310px minmax(0,1fr); } }
@media (max-width:1200px) { .sidebar { width:210px; }.workspace-header,.workspace .page,.workspace .page.wide { margin-left:210px; }.workspace .page,.workspace .page.wide { padding:26px 22px; }.workspace-header { padding:0 22px; }.builder-layout { grid-template-columns:260px minmax(0,1fr); gap:18px; }.stage-body { padding:16px; }.summary-grid { gap:10px; }.summary-card { padding:16px; }.split { grid-template-columns:minmax(0,1fr); } }
@media (max-width:1000px) { .builder-layout { grid-template-columns:1fr; }.builder-form { display:grid; grid-template-columns:1fr 1fr; align-items:end; }.builder-help { display:none; }.stage-body { min-height:360px; }.summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.document-workflow { flex-wrap:wrap; gap:14px; } }
@media (max-width:700px) { .sidebar { visibility:hidden; transform:translateX(-100%); transition:transform .2s; box-shadow:8px 0 28px #27344b18; width:236px; top:62px; }.menu-open .sidebar { visibility:visible; transform:translateX(0); }.workspace-header,.workspace .page,.workspace .page.wide { margin-left:0; }.workspace-header { padding:0 16px; height:62px; justify-content:flex-start; font-size:10px; }.workspace-badge { display:none; }.mobile-menu { display:flex; border:0; padding:5px; min-height:32px; }.workspace .page,.workspace .page.wide { padding:24px 16px 40px; }h1 { font-size:24px; }.head-row { gap:14px; }.builder-form { grid-template-columns:1fr; }.summary-card b { font-size:25px; }.filters > * { width:100%; }.filters input[name=q] { min-width:0; }.filters select { flex:1; min-width:0; }.date-fields input { font-size:12px; }.stage-body { padding:12px; }.stage-toolbar,.stage-footer { padding:14px; }.stage-footer { flex-wrap:wrap; }.preview-bar { align-items:stretch; }.preview-bar form,.preview-bar button { width:100%; }.breadcrumb-slash { margin:0 8px; }.card { padding:20px; }.builder-settings { padding:0; }.skip-link { left:16px; }.steps { flex-wrap:wrap; }.props { grid-template-columns:1fr; }.props dd { margin-bottom:10px; }.map-grid { gap:15px; } }
@media (prefers-reduced-motion:reduce) { * { transition:none!important; scroll-behavior:auto!important; } }

.client-select-label { margin-top:10px; }
.stage-empty .btn { margin-top:20px; }
#preview-stale { margin-top:5px; color:var(--bad); }
.generation-layout { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr); gap:22px; align-items:start; }
.market-pairs { display:grid; grid-template-columns:1fr; gap:8px; }
.market-option { display:flex; flex-direction:row; align-items:center; gap:10px; border:1px solid var(--line); border-radius:8px; padding:12px; cursor:pointer; }
.market-option:has(input:checked) { background:var(--accent-soft); border-color:#c8cff9; }
.market-option small { display:block; color:var(--muted); font-weight:400; font-size:10px; margin-top:4px; }
.market-option input { flex-shrink:0; }.market-price { margin-left:auto; font-size:11px; font-variant-numeric:tabular-nums; }
@media(max-width:1100px) { .generation-layout { grid-template-columns:1fr; } }

/* Compact navigation and account block. */
.sidebar { overflow-y:auto; }
.sidebar .nav { flex:1 0 auto; }
.sidebar-bottom { display:grid; grid-template-columns:32px minmax(0,1fr); gap:8px 10px; margin-top:24px; flex-shrink:0; }
.sidebar-bottom .profile a { white-space:normal; overflow-wrap:anywhere; font-size:12px; line-height:1.4; }
.sidebar-bottom form { grid-column:2; }
.sidebar-bottom button { padding:0; font-size:12px; }
@media(max-width:700px) { .workspace > .mobile-menu { margin:12px 16px 0; } }
.employee-list { display:grid; gap:12px; }
.employee-card { padding:0; margin:0; }
.employee-card > summary { display:flex; align-items:center; gap:14px; padding:20px; cursor:pointer; list-style:none; }
.employee-card > summary::-webkit-details-marker { display:none; }
.employee-identity { flex:1; min-width:0; overflow-wrap:anywhere; }
.employee-identity strong,.employee-identity small { display:block; }
.employee-identity small { color:var(--muted); margin-top:4px; }
.employee-status { font-size:11px; padding:4px 8px; border-radius:6px; background:#eaf6ee; color:#32704b; white-space:nowrap; }
.employee-status.off { background:#f0f1f4; color:var(--muted); }
.employee-edit-label { color:var(--accent); font-size:12px; }
.employee-card[open] > summary { border-bottom:1px solid var(--line); }
.employee-edit { padding:20px; display:grid; gap:24px; }
.employee-fields { display:grid; grid-template-columns:2fr 1fr 1fr; gap:16px; }
.employee-password { border-top:1px solid var(--line); padding-top:18px; }
.employee-password summary { cursor:pointer; color:var(--accent); }
.employee-password form { margin-top:16px; max-width:400px; }
.employee-create { margin-bottom:24px; }
.employee-create > summary { cursor:pointer; color:var(--accent); font-weight:600; }
.employee-create form { margin-top:20px; }
@media(max-width:1000px) { .employee-fields { grid-template-columns:1fr; } .employee-card > summary { flex-wrap:wrap; } .employee-edit-label { display:none; } }

.sidebar > .nav { margin-top:28px; }

.sidebar-bottom{grid-template-columns:32px minmax(0,1fr) 32px}.sidebar-bottom form{grid-column:3;grid-row:1}.sidebar-bottom .logout-icon{display:grid;place-items:center;width:32px;height:36px;padding:0;border:0;border-radius:7px;background:transparent;color:var(--muted);cursor:pointer}.sidebar-bottom .logout-icon:hover{background:#efefff;color:#535dde}.sidebar-bottom .logout-icon:focus-visible{outline:2px solid #535dde;outline-offset:2px}
