:root{--nav:#10283a;--nav2:#0b1f2d;--blue:#0d78ee;--bg:#f4f7fb;--card:#fff;--text:#172431;--muted:#6d7988;--line:#e3eaf1;--green:#25ae73;--amber:#f4a51c;--red:#eb4d55;--purple:#7d59d7}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Tahoma,Arial,sans-serif}a{text-decoration:none;color:inherit}.app{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:100vh;direction:ltr}.sidebar{background:linear-gradient(180deg,var(--nav),var(--nav2));color:white;padding:14px 10px;position:fixed;left:0;top:0;bottom:0;width:220px;direction:rtl;z-index:15}.brand{text-align:center;padding:12px 8px 18px;border-bottom:1px solid #ffffff12;margin-bottom:9px;font-size:32px}.brand b{display:block;font-size:16px;margin-top:4px}.brand small{display:block;font-size:8px;letter-spacing:1px;color:#d9b766}.sidebar nav{display:grid;gap:5px}.sidebar nav a{border-radius:9px;color:#e5edf4;padding:11px 12px;font-size:13px}.sidebar nav a:hover,.sidebar nav a.active{background:var(--blue);color:white}.sidebar-user{position:absolute;bottom:16px;right:13px;left:13px;border-top:1px solid #ffffff14;padding-top:12px;display:flex;align-items:center;gap:9px;font-size:12px}.sidebar-user small{display:block;color:#b7c5d0;font-size:10px}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#dbe8f3;color:#173247;font-weight:800}.main{margin-left:220px;width:calc(100% - 220px);direction:rtl;min-width:0}.topbar{height:58px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 16px;direction:ltr;position:sticky;top:0;z-index:10}.search input{width:min(420px,42vw);padding:10px 14px;border:1px solid var(--line);border-radius:10px;background:#f6f8fb;direction:rtl}.top-actions{display:flex;align-items:center;gap:12px;font-size:12px}.badge{font-size:9px;background:var(--red);color:#fff;border-radius:12px;padding:2px 6px}.linkbtn{border:0;background:none;color:#52606e;cursor:pointer}.content{padding:12px}.flash{margin:10px 12px 0;padding:10px 14px;border-radius:9px}.flash.success{background:#e7f8ef;color:#167b4c}.flash.error{background:#fdebed;color:#ae2732}.hero{background:linear-gradient(115deg,#0d2d45,#153f5d);color:white;border-radius:11px;padding:18px 24px;display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}.hero h1{margin:0 0 5px;font-size:26px}.hero p{margin:0;color:#d8e3eb;font-size:12px}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:9px;direction:ltr}.dashboard-main,.dashboard-rail{direction:rtl;min-width:0}.grid{display:grid;gap:9px}.grid.kpis{grid-template-columns:repeat(5,1fr);margin-bottom:9px}.card,.panel{background:white;border:1px solid var(--line);border-radius:11px;padding:12px;box-shadow:0 2px 8px #0d25340a}.kpi{display:flex;gap:9px;align-items:center}.kpi strong{font-size:25px;line-height:1}.kpi small{font-size:11px;color:var(--muted)}.kpi.green strong{color:var(--green)}.kpi.amber strong{color:var(--amber)}.kpi.red strong{color:var(--red)}.section-grid{display:grid;grid-template-columns:1.25fr .85fr;gap:9px;margin-top:9px}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}.section-title h2{font-size:13px;margin:0}.btn{background:var(--blue);color:#fff;border:none;border-radius:8px;padding:9px 12px;cursor:pointer;display:inline-block;font-size:11px}.btn.secondary{background:#eef3f8;color:#24313d}.btn.danger{background:#e4414c}.btn.sm{padding:6px 9px;font-size:10px}.quick{display:grid;gap:6px}.quick a{border:1px solid var(--line);background:#f9fbfd;border-radius:8px;padding:9px 10px;font-size:11px}.dashboard-rail .panel{margin-bottom:9px}.mini-list{display:grid;gap:9px;font-size:10px}.mini-item{display:flex;gap:8px;align-items:flex-start;line-height:1.5}.mini-icon{width:31px;height:31px;border-radius:9px;display:grid;place-items:center;background:#edf4fb;flex:0 0 auto}.meter{height:7px;border-radius:20px;background:#e9eef3;overflow:hidden}.meter span{display:block;width:24%;height:100%;background:var(--blue)}table{width:100%;border-collapse:collapse;font-size:11px}th,td{padding:9px 8px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}th{background:#f8fafc;color:#596878}.table-scroll{overflow:auto;border:1px solid var(--line);border-radius:8px}.status{padding:4px 7px;border-radius:6px;font-size:10px;background:#e7f2ff;color:#0874df;display:inline-flex}.status.completed{background:#e4f8ec;color:#168d56}.status.overdue,.status.rejected{background:#ffe6e8;color:#c8323b}.status.in_progress,.status.assigned{background:#fff1d8;color:#a96800}.status.waiting_approval{background:#eee8ff;color:#6945bd}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.field label{display:block;color:var(--muted);font-size:10px;margin-bottom:4px}.field input,.field select,.field textarea{width:100%;padding:9px;border:1px solid var(--line);border-radius:8px;background:white}.field textarea{min-height:90px;resize:vertical}.full{grid-column:1/-1}.actions{display:flex;gap:7px;flex-wrap:wrap}.auth-page{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#0d2232,#173f5a)}.auth-card{width:min(430px,92vw);background:#fff;border-radius:16px;padding:28px;box-shadow:0 18px 50px rgba(0,0,0,.25);text-align:center}.auth-card form{text-align:right}.auth-card .field{margin:12px 0}.qr{width:210px}.muted{color:var(--muted)}.pill{display:inline-block;padding:4px 8px;border-radius:12px;background:#eef3f8;font-size:11px}.code{font-family:monospace;font-size:12px}.hash{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:monospace}@media(max-width:1100px){.dashboard-grid{grid-template-columns:1fr}.dashboard-rail{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.grid.kpis{grid-template-columns:repeat(3,1fr)}}@media(max-width:780px){.app{display:block}.sidebar{position:relative;width:100%;height:auto}.sidebar nav{grid-template-columns:repeat(2,1fr)}.sidebar-user{position:static;margin-top:10px}.main{margin-left:0;width:100%}.grid.kpis,.section-grid,.form-grid,.dashboard-rail{grid-template-columns:1fr}.search input{width:45vw}.hero h1{font-size:20px}}

/* ===== CDMS additions — same tokens & identity as preview.html ===== */
/* Layout fix: the sidebar is position:fixed (out of the grid), so .main landed in the 220px column.
   Use a plain block layout; .main already reserves the sidebar width with margin-left. */
.app{display:block}.main{min-height:100vh}
.brand .mark{font-size:34px;color:#d4a152;line-height:1}
.sidebar{overflow-y:auto;display:flex;flex-direction:column}.sidebar nav{flex:1 0 auto;align-content:start}.sidebar nav a{display:block;padding:9px 12px}.sidebar .sidebar-user{position:sticky;bottom:0;left:auto;right:auto;margin:10px -10px -14px;padding:12px 13px 14px;background:var(--nav2);color:#fff}.nav-group{font-size:9px;letter-spacing:1px;color:#8ea3b4;padding:8px 12px 2px}
.top-actions a{color:#24313d}.top-actions .who{display:flex;align-items:center;gap:7px}.top-actions .avatar{width:28px;height:28px;font-size:10px}
.kicon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#edf5ff;font-size:20px;flex:0 0 auto}
.two{display:grid;grid-template-columns:1.35fr .9fr;gap:9px;margin-bottom:9px}.tables{display:grid;grid-template-columns:1.05fr .95fr;gap:9px;margin-bottom:9px}.bottom{display:grid;grid-template-columns:.9fr 1.4fr;gap:9px;margin-bottom:9px}
.chart{height:200px;border-left:1px solid var(--line);border-bottom:1px solid var(--line);position:relative;margin:6px 8px 26px}.chart svg{width:100%;height:100%}.months{position:absolute;left:0;right:0;bottom:-22px;display:flex;justify-content:space-between;font-size:9px;color:var(--muted);direction:ltr}
.chart-legend{display:flex;gap:12px;font-size:10px;color:var(--muted);flex-wrap:wrap}
.donutRow{display:flex;gap:16px;align-items:center;direction:ltr}.donut{width:150px;height:150px;border-radius:50%;position:relative;flex:0 0 auto;background:#e9eef3}.donut-hole{position:absolute;inset:31px;background:white;border-radius:50%;display:grid;place-items:center;text-align:center;font-weight:800;font-size:15px;line-height:1.3}.donut-hole small{display:block;font-weight:400;font-size:10px;color:var(--muted)}
.legend{direction:rtl;font-size:11px;line-height:2}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-left:5px}
.activity{display:grid;gap:9px}.activityItem{display:flex;gap:8px;font-size:10px;line-height:1.5}.acticon{width:31px;height:31px;border-radius:9px;display:grid;place-items:center;background:#edf4fb;flex:0 0 auto}
.pageHead{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:10px;flex-wrap:wrap}.pageHead h1,.pageHead h2{margin:0;font-size:22px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.grid3 h3{margin:0 0 6px;font-size:15px}.grid3 p{margin:4px 0;font-size:11px;color:var(--muted)}
.notice{padding:10px;background:#eef6ff;border-radius:8px;font-size:11px;margin-bottom:10px}.notice.warn{background:#fff6e5;color:#8a5a00}.notice.danger{background:#fdebed;color:#ae2732}
.toolbar{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:9px;align-items:center}.toolbar .btn.secondary.active,.tab.active{background:var(--blue);color:#fff}
.tab{border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 11px;font-size:11px;color:#24313d}.tab .count{background:#eef3f8;color:#24313d;border-radius:10px;padding:1px 6px;margin-right:4px;font-size:9px}.tab.active .count{background:#ffffff33;color:#fff}
.filters{display:flex;gap:7px;flex-wrap:wrap;align-items:center}.filters input,.filters select{padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:11px}.filters input[type=search],.filters input[name=q]{min-width:240px}
.status.new{background:#e7f2ff;color:#0874df}.status.waiting_info{background:#fff1d8;color:#a96800}.status.cancelled,.status.archived,.status.inactive,.status.disabled,.status.expired{background:#eef1f4;color:#5b6773}
.status.active,.status.accepted,.status.approved,.status.final,.status.signed,.status.success{background:#e4f8ec;color:#168d56}.status.pending,.status.draft,.status.review{background:#fff1d8;color:#a96800}.status.locked,.status.failed{background:#ffe6e8;color:#c8323b}
.status.blue{background:#e7f2ff;color:#0874df}.status.green{background:#e4f8ec;color:#168d56}.status.orange{background:#fff1d8;color:#a96800}.status.red{background:#ffe6e8;color:#c8323b}.status.purple{background:#eee8ff;color:#6945bd}.status.grey{background:#eef1f4;color:#5b6773}
.prio-urgent{color:var(--red);font-weight:700}.prio-high{color:#a96800;font-weight:700}
.timeline{list-style:none;margin:0;padding:0 14px 0 0;border-right:2px solid var(--line)}.timeline li{position:relative;padding:0 12px 12px 0;font-size:11px;line-height:1.6}.timeline li:before{content:'';position:absolute;right:-20px;top:4px;width:10px;height:10px;border-radius:50%;background:var(--blue);border:2px solid #fff;box-shadow:0 0 0 1px var(--line)}
.timeline li.internal:before{background:var(--purple)}.timeline li.completed:before,.timeline li.approved:before{background:var(--green)}.timeline li.rejected:before,.timeline li.cancelled:before{background:var(--red)}.timeline b{font-size:12px}.timeline small{color:var(--muted)}
.tree,.tree ul{list-style:none;margin:0;padding:0}.tree ul{margin-right:18px;border-right:1px dashed #cfdae5;padding-right:12px}.tree li{padding:5px 0}.tree .node{display:inline-flex;align-items:center;gap:8px;background:#f9fbfd;border:1px solid var(--line);border-radius:9px;padding:6px 10px;font-size:11px}.tree .node small{color:var(--muted);display:block}
.comment{border:1px solid var(--line);border-radius:9px;padding:9px 11px;margin-bottom:8px;font-size:12px;background:#fbfcfe}.comment.internal{background:#f6f2ff;border-color:#e3d9fb}.comment .meta{font-size:10px;color:var(--muted);margin-bottom:4px}
.kv{display:grid;grid-template-columns:130px 1fr;gap:6px 10px;font-size:11px}.kv dt{color:var(--muted)}.kv dd{margin:0}
.tags span{display:inline-block;background:#eef3f8;border-radius:10px;padding:2px 8px;font-size:10px;margin:0 0 3px 3px}
details.edit>summary{cursor:pointer;color:var(--blue);font-size:11px;list-style:none;margin-top:6px}details.edit[open]{margin-top:6px}
.perm-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:4px 16px;font-size:11px}.perm-grid label{display:flex;gap:6px;align-items:center;padding:4px 0}.perm-grid input{width:auto}
.check{display:flex;gap:8px;align-items:center;font-size:11px}.check input{width:auto}
.empty{color:var(--muted);font-size:11px;padding:14px;text-align:center}
.link{color:var(--blue);font-size:10px}.muted small,.small{font-size:10px}
.search-group h2{font-size:13px;margin:0 0 8px}
@media(max-width:1100px){.two,.tables,.bottom{grid-template-columns:1fr}.grid3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:780px){.grid3,.perm-grid,.kv{grid-template-columns:1fr}.filters input[name=q]{min-width:0;width:100%}}
/* Grid children must be allowed to shrink so wide tables scroll inside .table-scroll instead of widening the page */
.two>*,.tables>*,.bottom>*,.section-grid>*,.grid3>*,.form-grid>*,.dashboard-grid>*,.grid>*{min-width:0}
.panel,.card{min-width:0}.table-scroll{max-width:100%}
@media(max-width:780px){.topbar{height:auto;min-height:58px;gap:8px;padding:8px 12px;flex-wrap:wrap}.search{flex:1 1 100%;order:2}.search input{width:100%}.top-actions .who span:last-child{display:none}.hero{flex-direction:column;align-items:flex-start;gap:8px}.pageHead h1{font-size:18px}.donutRow{flex-direction:column}}
/* Heading scale aligned with preview.html (page titles 22px, card titles 13px) */
.content h1{font-size:22px;margin:0 0 4px}.panel>h2,.card>h2,.panel h2,.card h2{font-size:13px;margin:0 0 9px}.section-title p.muted{margin:2px 0 0;font-size:11px}
.hero h1{font-size:26px}