/* OMNX Social · PNG presentation contract · 2026-10-05.
 * Content primitives retained for the server-rendered bindings. Current layout
 * and tokens are defined below; mockup-v11.css is historical and is not loaded. */
*{box-sizing:border-box}
.page-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:21px}
.page-head h1{font-size:28px;line-height:1.12;margin:0 0 7px;letter-spacing:-.02em}
.page-head p{margin:0;color:var(--muted);font-size:13px}
.head-actions{display:flex;gap:9px}
.btn{border:0;border-radius:10px;height:38px;padding:0 15px;display:inline-flex;align-items:center;gap:8px;font-weight:750;font-size:14px;cursor:default}
.btn.primary{background:var(--primary);color:#fff;box-shadow:0 7px 14px rgba(108,92,231,.18)}
.btn.light{background:#fff;border:1px solid var(--line);color:#30394c}
.btn.danger{background:#fff0f3;color:#be3852;border:1px solid #ffd4dd}
.btn.success{background:var(--green);color:#fff}
.btn.small{height:30px;padding:0 10px;font-size:13px;border-radius:8px}
.grid{display:grid;gap:16px}
.kpis{grid-template-columns:repeat(5,1fr);margin-bottom:17px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:15px;padding:15px 16px;box-shadow:0 5px 16px rgba(35,43,68,.04)}
.kpi-top{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:14px}
.kpi-icon{width:31px;height:31px;border-radius:9px;display:grid;place-items:center;background:#f1efff;color:#6554df;font-weight:900}
.kpi-value{font-size:27px;font-weight:850;margin:8px 0 2px}
.kpi-foot{font-size:13px;color:var(--muted)}
.up{color:var(--green);font-weight:800}
.down{color:var(--red);font-weight:800}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:0 5px 18px rgba(35,43,68,.04)}
.panel-head{min-height:55px;padding:14px 17px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
.panel-title{font-size:14px;font-weight:800}
.panel-sub{font-size:13px;color:var(--muted);margin-top:3px}
.panel-body{padding:16px 17px}
.badge{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;font-size:12px;font-weight:800;white-space:nowrap}
.badge.gray{background:#f0f2f7;color:#687084}
.badge.purple{background:#f0edff;color:#6251d7}
.badge.green{background:#e9f8f1;color:#0e8a59}
.badge.amber{background:#fff5df;color:#b77700}
.badge.red{background:#ffedf1;color:#c43d58}
.badge.blue{background:#edf4ff;color:#2e69cf}
.badge.cyan{background:#e9f8fb;color:#16768d}
.dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.table{width:100%;border-collapse:collapse}
.table th{text-align:left;color:#7b8497;font-size:12px;text-transform:uppercase;letter-spacing:.06em;font-weight:800;padding:10px 10px;border-bottom:1px solid var(--line)}
.table td{padding:10px 10px;border-bottom:1px solid #edf0f5;font-size:14px;vertical-align:middle}
.table tr:last-child td{border-bottom:0}
.table strong{font-size:14px}
.muted{color:var(--muted)}
.small{font-size:13px}
.tiny{font-size:12px}
.client-cell{display:flex;align-items:center;gap:10px}
.avatar{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;font-weight:850;font-size:14px;background:linear-gradient(135deg,#f1ecff,#e6f0ff);color:#5d4ed0;border:1px solid #e2defb}
.avatar.orange{background:#fff0e6;color:#bd6a23}
.avatar.green{background:#e9f8f1;color:#13845a}
.avatar.pink{background:#fff0f4;color:#c04465}
.avatar.blue{background:#eaf3ff;color:#356fc7}
.progress{height:6px;background:#edf0f5;border-radius:99px;overflow:hidden}
.progress>span{display:block;height:100%;background:linear-gradient(90deg,#6c5ce7,#8d7cf4);border-radius:99px}
.split-70{grid-template-columns:minmax(0,1.75fr) minmax(360px,.75fr)}
.split-60{grid-template-columns:minmax(0,1.35fr) minmax(420px,.85fr)}
.split-50{grid-template-columns:1fr 1fr}
.section-title{font-size:14px;text-transform:uppercase;letter-spacing:.07em;color:#7a8498;font-weight:850;margin:0 0 10px}
.attention{padding:12px 12px;border:1px solid var(--line);border-radius:12px;display:flex;gap:10px;align-items:flex-start;margin-bottom:9px;background:#fff}
.attention:last-child{margin-bottom:0}
.att-dot{width:10px;height:10px;border-radius:50%;margin-top:3px;background:var(--amber)}
.attention.red .att-dot{background:var(--red)}
.attention.green .att-dot{background:var(--green)}
.att-title{font-size:14px;font-weight:800}
.att-text{font-size:12px;color:var(--muted);margin-top:3px;line-height:1.35}
.client-group{border:1px solid var(--line);border-radius:14px;background:#fff;margin-bottom:12px;overflow:hidden}
.client-group:last-child{margin-bottom:0}
.client-group-head{display:flex;justify-content:space-between;align-items:center;padding:13px 14px;background:#fbfbfd;border-bottom:1px solid var(--line)}
.client-group-title{display:flex;align-items:center;gap:10px}
.client-meta strong{font-size:14px}
.client-meta div{font-size:12px;color:var(--muted);margin-top:2px}
.group-stats{display:flex;align-items:center;gap:12px}
.group-progress{width:110px}
.script-row{display:grid;grid-template-columns:26px minmax(0,1fr) 90px 126px 90px 54px;gap:10px;align-items:center;padding:10px 14px;border-bottom:1px solid #eef0f4}
.script-row:last-child{border-bottom:0}
.script-title{font-size:14px;font-weight:750}
.script-sub{font-size:12px;color:var(--muted);margin-top:3px}
.check{width:18px;height:18px;border:1px solid #cfd5e2;border-radius:5px}
.detail-card{background:#fff;border:1px solid var(--line);border-radius:15px;height:100%;overflow:hidden}
.detail-head{padding:16px 18px;border-bottom:1px solid var(--line)}
.detail-head h3{font-size:16px;margin:7px 0 4px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);padding:0 14px}
.tab{padding:11px 10px 9px;font-size:13px;color:#7c8494;border-bottom:2px solid transparent;font-weight:700}
.tab.active{color:#5e4ed5;border-bottom-color:#6c5ce7}
.reader{padding:15px 18px;font-size:14px;line-height:1.52;color:#333b4d}
.reader h4{font-size:14px;margin:13px 0 5px;color:#1b2336}
.reader p{margin:5px 0}
.reader ol{padding-left:18px;margin:5px 0}
.feedback-box{margin:0 18px 14px;border:1px solid var(--line);background:#fafbfe;border-radius:10px;padding:11px;color:#949bad;font-size:13px;min-height:54px}
.detail-actions{border-top:1px solid var(--line);padding:13px 18px;display:flex;justify-content:space-between;gap:10px;background:#fff}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field label{font-size:12px;color:#727c91;font-weight:800;display:block;margin-bottom:5px}
.input{height:38px;border:1px solid #dfe3ec;border-radius:9px;background:#fff;padding:0 11px;display:flex;align-items:center;font-size:13px;color:#30394c}
.input.area{height:70px;align-items:flex-start;padding-top:10px;line-height:1.35}
.tag{display:inline-flex;padding:5px 8px;background:#f1f3f7;border-radius:8px;margin:2px;font-size:12px;color:#5f687b}
.upload-zone{height:106px;border:1px dashed #c7cddd;border-radius:12px;background:#fbfcfe;display:grid;place-items:center;text-align:center;color:#758096;font-size:13px}
.metric-row{display:flex;align-items:center;gap:9px}
.bar-track{height:7px;background:#edf0f5;border-radius:99px;overflow:hidden;flex:1}
.bar-fill{height:100%;border-radius:99px;background:#6c5ce7}
.spark{height:48px;display:flex;align-items:flex-end;gap:5px}
.spark span{width:8px;background:#8b7cf6;border-radius:4px 4px 2px 2px}
.health-grid{grid-template-columns:repeat(3,1fr)}
.health-card{padding:16px;border-radius:14px;border:1px solid var(--line);background:#fff}
.health-num{font-size:24px;font-weight:850}
.health-label{font-size:13px;color:var(--muted);margin-top:3px}
.callout{padding:12px 14px;border-radius:12px;border:1px solid #ded9ff;background:#f7f5ff;color:#4e43a8;font-size:13px;line-height:1.4}
.callout.warn{border-color:#f7ddb1;background:#fff9eb;color:#94620b}
.callout.red{border-color:#ffd2db;background:#fff3f5;color:#a7334a}
.timeline{position:relative;padding-left:20px}
.timeline:before{content:"";position:absolute;left:5px;top:8px;bottom:8px;width:2px;background:#e5e8ef}
.time-item{position:relative;padding:0 0 13px 10px}
.time-item:before{content:"";position:absolute;left:-20px;top:3px;width:10px;height:10px;border-radius:50%;background:#7a68ef;border:3px solid #f0edff}
.time-title{font-size:13px;font-weight:800}
.time-meta{font-size:12px;color:var(--muted);margin-top:3px}
.chat-wrap{display:grid;grid-template-columns:310px 1fr;height:870px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff}
.chat-side{border-right:1px solid var(--line);padding:16px;background:#fbfcfe}
.chat-main{display:flex;flex-direction:column}
.chat-head{height:67px;border-bottom:1px solid var(--line);padding:13px 18px;display:flex;justify-content:space-between;align-items:center}
.messages{flex:1;padding:20px 23px;background:linear-gradient(#fff,#fbfbfd)}
.msg{max-width:66%;margin-bottom:14px;padding:12px 14px;border-radius:13px;font-size:14px;line-height:1.45;background:#f1f3f8;color:#30394c}
.msg.user{margin-left:auto;background:#6c5ce7;color:#fff;border-bottom-right-radius:4px}
.attach-card{margin-top:8px;background:#fff;border:1px solid #e2e5ec;padding:9px;border-radius:9px;color:#4b5569}
.chat-input{height:82px;border-top:1px solid var(--line);padding:13px 18px;display:flex;align-items:center;gap:10px}
.compose{flex:1;height:48px;border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;padding:0 13px;color:#8a93a4;font-size:13px}
.kanban{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}
.kcol{background:#f2f4f8;border:1px solid var(--line);border-radius:14px;padding:12px;min-height:790px}
.kcol-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.kcol-title{font-size:14px;font-weight:850}
.count{font-size:12px;padding:4px 7px;border-radius:99px;background:#fff;border:1px solid var(--line);color:#667085}
.kcard{background:#fff;border:1px solid #e1e5ed;border-radius:12px;padding:12px;margin-bottom:10px;box-shadow:0 4px 10px rgba(37,45,70,.04)}
.kcard h4{font-size:14px;margin:0 0 5px}
.kcard p{font-size:12px;line-height:1.35;color:var(--muted);margin:0 0 9px}
.kmeta{display:flex;justify-content:space-between;align-items:center}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:#0f172a;color:#dbe3f4;border-radius:13px;padding:14px;font-size:12px;line-height:1.55}
.tech-grid{grid-template-columns:repeat(3,1fr)}
.tech-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px}
.tech-card h3{font-size:14px;margin:0 0 5px}
.tech-card p{font-size:12px;color:var(--muted);line-height:1.4;margin:0 0 11px}
.kv{display:flex;justify-content:space-between;font-size:12px;padding:7px 0;border-bottom:1px solid #eef0f4}
.kv:last-child{border-bottom:0}
.diagram{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:12px}
.node{padding:9px 11px;background:#fff;border:1px solid var(--line);border-radius:10px;font-size:12px;font-weight:750}
.arrow{color:#9ca5b6;font-weight:900}
.chart{height:190px;border-left:1px solid #dfe3ec;border-bottom:1px solid #dfe3ec;display:flex;align-items:flex-end;gap:12px;padding:0 12px 0 10px;position:relative}
.chart:before,.chart:after{content:"";position:absolute;left:0;right:0;height:1px;background:#eef0f4}
.chart:before{top:33%}
.chart:after{top:66%}
.bar{flex:1;background:linear-gradient(180deg,#8b7cf6,#6c5ce7);border-radius:7px 7px 0 0;min-width:16px}
.line-chart{height:190px;position:relative;border-left:1px solid #dfe3ec;border-bottom:1px solid #dfe3ec;overflow:hidden}
.line-chart svg{width:100%;height:100%}
.donut{width:126px;height:126px;border-radius:50%;background:conic-gradient(#6c5ce7 0 46%,#377dff 46% 71%,#16a46c 71% 89%,#e8ebf2 89% 100%);position:relative}
.donut:after{content:"";position:absolute;inset:24px;background:#fff;border-radius:50%}
.legend{display:grid;gap:8px}
.legend-row{display:flex;align-items:center;justify-content:space-between;font-size:13px}
.legend-left{display:flex;align-items:center;gap:8px}
.legend-swatch{width:9px;height:9px;border-radius:3px;background:#6c5ce7}
.legend-swatch.blue{background:#377dff}
.legend-swatch.green{background:#16a46c}
.legend-swatch.gray{background:#dfe3ec}
.source{display:flex;gap:8px;align-items:center;padding:8px 10px;border-radius:10px;background:#f7f8fb;font-size:12px}
.source-icon{width:24px;height:24px;border-radius:8px;background:#eeebff;color:#6251d7;display:grid;place-items:center;font-weight:850}
.switch{width:34px;height:19px;border-radius:99px;background:#6c5ce7;padding:3px}
.switch:after{content:"";display:block;width:13px;height:13px;border-radius:50%;background:#fff;margin-left:15px}
.switch.off{background:#cfd4df}
.switch.off:after{margin-left:0}
.tabs-top{display:flex;gap:8px;margin-bottom:14px}
.seg{padding:9px 11px;border-radius:10px;background:#fff;border:1px solid var(--line);font-size:13px;color:#687084;font-weight:750}
.seg.active{background:#161f34;color:#fff;border-color:#161f34}
.alert-strip{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-radius:12px;background:#fff8e7;border:1px solid #f6dda6;color:#8a5c00;font-size:13px;margin-bottom:14px}
.empty{display:grid;place-items:center;min-height:260px;text-align:center;color:var(--muted)}


/* WeasyPrint/browser parity: keep management tables inside their panels. */
.table{table-layout:fixed;max-width:100%}
.table td,.table th{overflow-wrap:anywhere}
.table .btn{max-width:100%;padding-left:7px;padding-right:7px;white-space:nowrap}

.detail-actions .btn{flex:1;justify-content:center;padding-left:7px;padding-right:7px;font-size:12px}


/* Shared tokens sampled from the supplied screens. Inter is approximated by
   the installed system sans: no font CDN, tracking or network dependency. */
:root {
  --bg:#f5f7fc; --surface:#fff; --surface2:#f8f9fd; --line:#e9ecf6;
  --text:#17133f; --muted:#646b8b; --primary:#6332ff; --primary2:#875aff;
  --primary-dark:#4c21d1; --nav:#fff; --nav2:#f6f3ff;
  --blue:#126cf3; --green:#098958; --amber:#ab610b; --red:#cc3153; --cyan:#137e95;
  --shadow:0 3px 16px rgba(42,31,86,.035); --radius:10px; --small:8px;
  --sidebar-width:236px; --topbar-height:72px;
}
html { background:var(--bg); scrollbar-gutter:stable; }
html,body { margin:0; min-width:0; width:100%; color:var(--text); font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:14px; line-height:1.5; }
body { background:var(--bg); }
button,input,select,textarea { font:inherit; }
a { color:var(--primary-dark); text-underline-offset:3px; }
button,a,input,select,textarea,summary { -webkit-tap-highlight-color:transparent; }
[hidden] { display:none!important; }
.app { width:100%; height:auto; min-height:100vh; min-height:100dvh; margin:0; display:flex; overflow:visible; background:var(--bg); }
.sidebar { display:flex; flex-direction:column; width:var(--sidebar-width); flex:0 0 var(--sidebar-width); position:sticky; top:0; align-self:flex-start; height:100vh; height:100dvh; background:#fff; color:var(--text); border-right:1px solid var(--line); padding:24px 16px 18px; overflow-y:auto; }
.brand { display:flex; align-items:center; padding:6px 10px 24px; margin:0; gap:0; text-decoration:none; }
.brand-logo { display:block; width:100%; max-width:192px; height:auto; object-fit:contain; }
.nav-label { color:#858ba4; font-size:11px; letter-spacing:.08em; margin:4px 12px 12px; }
.nav { display:flex; flex-direction:column; gap:5px; }
.nav-item { display:flex; align-items:center; text-decoration:none; min-height:46px; padding:11px 12px; border-radius:8px; font-weight:500; font-size:14px; color:#616586; gap:12px; line-height:1.4; }
.nav-item:hover { color:var(--primary); background:#f8f6ff; }
.nav-item.active { color:var(--primary); background:#f0ebff; box-shadow:none; font-weight:600; }
.nav-icon,.nav-item.active .nav-icon { display:grid; place-items:center; background:transparent; color:inherit; width:22px; height:22px; flex:0 0 22px; border-radius:0; }
.nav-icon svg { width:22px; height:22px; }
.side-spacer { min-height:32px; flex:1; }
.brand-message { position:relative; overflow:hidden; padding:24px 20px 46px; margin:10px 4px 20px; border-radius:10px; background:linear-gradient(135deg,#f9f8ff,#eee9ff); }
.brand-message strong { position:relative; display:block; max-width:155px; font-size:18px; line-height:1.25; letter-spacing:-.5px; z-index:1; }
.brand-message span { display:block; width:36px; height:3px; background:var(--primary); margin-top:14px; }
.brand-message:after { content:""; width:126px; height:110px; position:absolute; background:linear-gradient(135deg,#dacfff,#9577ff); right:-52px; bottom:-58px; transform:rotate(-40deg); border-radius:28px; opacity:.55; }
.side-info { border-top:1px solid var(--line); padding:16px 10px 0; }
.role-dot { width:7px; height:7px; border-radius:50%; background:var(--primary); }
.role-pill { display:inline-flex; align-items:center; gap:7px; padding:6px 8px; color:var(--muted); background:#f5f3ff; border-radius:6px; font-size:11px; }
.user-name { font-weight:700; font-size:13px; margin-top:12px; }
.user-mail { color:var(--muted); font-size:11px; overflow-wrap:anywhere; }
.side-info form[action="/logout"] button { border:1px solid var(--line); background:#fff; color:var(--muted); min-height:40px; border-radius:8px; font-size:12px; }
.side-info form[action="/logout"] button:hover { background:#f5f2ff; color:var(--primary); }
.side-info form[action="/logout"] button::before { background:#f5f2ff; color:var(--primary); }
.workspace { flex:1; min-width:0; display:flex; flex-direction:column; }
.topbar { display:flex; align-items:center; justify-content:space-between; height:var(--topbar-height); flex:0 0 var(--topbar-height); padding:0 28px; background:rgba(255,255,255,.97); border-bottom:1px solid var(--line); gap:20px; box-shadow:0 2px 6px rgba(44,35,94,.025); }
.top-context { min-width:0; }
.crumb { font-size:12px; color:var(--muted); margin:0; }
.top-title { font-size:14px; font-weight:600; margin:2px 0 0; overflow-wrap:anywhere; }
.top-actions { display:flex; align-items:center; gap:24px; flex:none; }
.workspace-home { display:flex; gap:9px; align-items:center; padding:8px 12px; border:1px solid var(--line); border-radius:8px; color:#444368; text-decoration:none; font-size:13px; }
.workspace-home svg { width:18px; height:18px; }
.top-identity { display:flex; align-items:center; gap:10px; }
.top-identity strong,.top-identity small { display:block; }
.top-identity strong { font-size:13px; max-width:200px; overflow-wrap:anywhere; }
.top-identity small { font-size:11px; color:var(--muted); }
.mini-avatar { display:grid; place-items:center; font-weight:800; width:36px; height:36px; border-radius:50%; background:#f0eaff; color:#5327c8; font-size:12px; flex:none; }
.content,.app[data-ui-runtime] .content,.content:has(> .client-workspace),.content:has(> .instant-surface) { flex:1; min-height:0; min-width:0; padding:26px 28px 40px; overflow:visible; scrollbar-gutter:auto; }
.page-head { margin-bottom:22px; gap:20px; align-items:flex-start; }
.page-head h1,.client-head h1,.instant-head h1 { font-size:30px; line-height:1.2; letter-spacing:-1px; margin:0 0 5px; font-weight:750; color:var(--text); overflow-wrap:anywhere; }
.page-head p,.client-head p,.instant-head p { font-size:14px; line-height:1.5; color:var(--muted); margin:0; max-width:85ch; }
.head-actions,.client-actions,.instant-actions { flex-wrap:wrap; gap:8px; }
.btn { height:auto; min-height:40px; max-width:100%; border-radius:7px; padding:9px 14px; font-size:13px; font-weight:600; line-height:1.4; cursor:pointer; white-space:normal; text-align:center; text-decoration:none; justify-content:center; }
.btn.primary { background:linear-gradient(110deg,#6836ff,#6025f7); box-shadow:none; }
.btn.primary:hover { background:var(--primary-dark); }
.btn.light { background:#fff; border:1px solid var(--line); color:#49466f; }
.btn.light:hover { background:#f5f2ff; border-color:#dbd0ff; }
.btn.success { background:#e7f8ef; border:1px solid #c9eedb; color:#087749; box-shadow:none; }
.btn.danger { background:#fff2f5; color:#b82646; border:1px solid #f8d4de; }
.btn:disabled,.btn[aria-disabled="true"] { opacity:.58; cursor:not-allowed; }
.btn.small,.btn.tiny,.table .btn { min-height:34px; height:auto; font-size:12px; padding:7px 10px; white-space:normal; border-radius:6px; }
.grid { gap:16px; }
.kpis { grid-template-columns:repeat(auto-fit,minmax(164px,1fr)); margin-bottom:18px; }
.kpi { border-radius:9px; padding:16px; box-shadow:none; min-width:0; }
.kpi-top { font-size:13px; color:#49476c; gap:8px; flex-direction:row-reverse; justify-content:flex-end; }
.kpi-icon { width:36px; height:36px; flex:0 0 36px; background:#f0ebff; color:var(--primary); border-radius:9px; }
.kpi-icon svg { width:22px; height:22px; }
.kpi:nth-child(2) .kpi-icon { color:var(--blue); background:#eaf3ff; }
.kpi:nth-child(3) .kpi-icon { color:var(--red); background:#fff0f3; }
.kpi:nth-child(4) .kpi-icon { color:var(--green); background:#eafaf2; }
.kpi-value { font-size:30px; line-height:1.15; font-weight:750; margin:12px 0 4px; letter-spacing:-.8px; overflow-wrap:anywhere; }
.kpi-foot { font-size:12px; color:var(--muted); }
.panel,.detail-card,.client-group,.tech-card,.health-card,.client-card,.instant-panel,.manager-person-head { border:1px solid var(--line); border-radius:10px; background:#fff; box-shadow:var(--shadow); min-width:0; }
.panel-head { padding:15px 18px; min-height:60px; gap:14px; flex-wrap:wrap; border-bottom-color:var(--line); }
.panel-title,.panel-head h2 { font-size:16px; font-weight:650; margin:0; }
.panel-sub,.panel-head p { font-size:12px; margin:3px 0 0; line-height:1.5; }
.panel-body { padding:18px; min-width:0; }
.panel-body p,.panel-body li { line-height:1.6; }
.panel-body h2,.client-card h2,.instant-panel h2 { font-size:17px; line-height:1.4; }
.panel-body h3,.tech-card h3 { font-size:15px; }
.table { width:100%; table-layout:fixed; border-collapse:collapse; }
.table th { font-size:11px; font-weight:500; color:var(--muted); text-transform:none; letter-spacing:0; background:#fafbff; padding:11px 12px; }
.table td { font-size:13px; padding:13px 12px; line-height:1.5; }
.table strong { font-size:13px; font-weight:600; }
.table td small { font-size:12px; }
.table tbody tr:hover { background:#fcfbff; }
.table :is(td,th) { overflow-wrap:anywhere; }
.badge { font-size:11px; font-weight:500; border-radius:6px; padding:4px 7px; white-space:normal; }
.badge.gray { color:#636a84; background:#f1f3fa; }
.badge.purple { color:#6030dc; background:#f1ecff; }
.badge.green { color:#08784c; background:#e7f8f0; }
.badge.amber { color:#975600; background:#fff5e7; }
.badge.red { color:#bc2448; background:#ffedf2; }
.badge.blue { color:#1d60c2; background:#edf4ff; }
.dot { width:6px; height:6px; flex:0 0 6px; }
.avatar { border-radius:50%; width:38px; height:38px; flex:0 0 38px; font-size:13px; }
.split-70 { grid-template-columns:minmax(0,1.8fr) minmax(280px,.85fr); }
.split-60 { grid-template-columns:minmax(0,1.45fr) minmax(300px,1fr); }
.split-50,.two-col { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.tech-grid { grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
.tech-card { padding:18px; }
.tech-card p { font-size:13px; }
.tabs-top,.service-tabs,.workspace-tabs,.tabs { display:flex; gap:4px; flex-wrap:wrap; border-bottom:1px solid var(--line); padding:0; margin:0 0 18px; background:transparent; }
.seg,.tab,.service-tabs .btn,.workspace-tabs a { display:inline-flex; align-items:center; min-height:42px; padding:10px 14px; background:transparent; border:0; border-bottom:2px solid transparent; border-radius:0; color:var(--muted); font-size:13px; font-weight:500; text-decoration:none; }
.seg.active,.tab.active,.service-tabs .btn[aria-current="page"],.workspace-tabs a[aria-current="page"] { background:#faf8ff; color:var(--primary); border-color:var(--primary); box-shadow:none; }
.seg:hover,.service-tabs .btn:hover,.workspace-tabs a:hover { background:#f3efff; color:var(--primary); }
.field label,.client-form label,.instant-form label { font-size:13px; color:#464268; font-weight:600; }
.input,.compose,textarea.feedback-box,.login-form input { display:block; width:100%; max-width:100%; height:auto; min-height:42px; padding:10px 12px; font-size:14px; line-height:1.5; color:var(--text); border:1px solid #dde1ee; border-radius:7px; background:#fff; }
textarea.input,.input.area,textarea.compose { min-height:96px; resize:vertical; }
select.input { padding-right:28px; }
.input[type="file"] { overflow:hidden; }
.input[type="checkbox"],.input[type="radio"] { width:auto; min-height:0; }
input[type="checkbox"],input[type="radio"] { accent-color:var(--primary); }
.form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.callout,.alert-strip,.flash,.client-note,.instant-note { font-size:13px; padding:14px 16px; border-radius:8px; line-height:1.6; overflow-wrap:anywhere; }
.callout { background:#f3efff; color:#51418e; border-color:#e3daff; }
.callout.warn { color:#84550b; background:#fff8eb; }
.callout.red,.flash.error { color:#a52949; background:#fff1f5; border:1px solid #f5d2dd; }
.tag { font-size:12px; border-radius:6px; color:#5d5886; background:#f3f0ff; }
.small,.tiny { font-size:12px; }
.kv,.time-title,.script-title,.att-title { font-size:13px; }
.kv { gap:14px; flex-wrap:wrap; }
.kv strong { overflow-wrap:anywhere; }
.section-title { font-size:12px; letter-spacing:.04em; }
.att-text,.time-meta,.script-sub,.client-meta div,.kcard p { font-size:12px; line-height:1.5; }
.reader { font-size:14px; line-height:1.75; padding:18px; overflow-wrap:anywhere; }
.reader h4 { font-size:14px; margin:18px 0 8px; }
.detail-card { height:auto; align-self:start; }
.detail-head { padding:18px; }
.detail-head h3 { font-size:18px; line-height:1.4; }
.detail-actions { display:flex; flex-wrap:wrap; padding:16px 18px; gap:10px; }
.detail-actions .btn { min-height:42px; font-size:13px; flex:1 1 130px; }
.feedback-box { display:block; width:calc(100% - 36px); min-height:96px; margin:0 18px 18px; padding:12px; color:var(--text); font-size:14px; }
.client-group { overflow:hidden; }
.client-group-head { padding:15px; background:#fbfaff; gap:12px; flex-wrap:wrap; }
.client-meta strong { font-size:14px; }
.script-row { grid-template-columns:minmax(0,1fr) 90px 110px 90px; padding:13px 15px; gap:10px; }
.script-row .check { display:none; }
.script-row>.tiny { display:none; }
.script-row:hover { background:#f9f7ff; }
.group-stats { flex-wrap:wrap; gap:8px; }
.kanban { grid-template-columns:repeat(4,minmax(0,1fr)); align-items:start; }
.kcol { min-height:260px; border-radius:9px; background:linear-gradient(#f6f2ff,#fcfbff); padding:12px; }
.kcol:nth-child(2) { background:linear-gradient(#ecf5ff,#fcfdff); }
.kcol:nth-child(3) { background:linear-gradient(#fff4ef,#fffdfc); }
.kcol:nth-child(4) { background:linear-gradient(#eaf9f1,#fcfffd); }
.kcard { padding:13px; border-radius:8px; box-shadow:none; }
.kcard h4,.kcol-title { font-size:13px; line-height:1.4; }
.chat-wrap { grid-template-columns:minmax(220px,280px) minmax(0,1fr); height:auto; min-height:600px; border-radius:10px; }
.chat-side { padding:18px; background:#fcfbff; min-width:0; }
.chat-main { min-width:0; }
.chat-head { height:auto; min-height:64px; padding:15px 18px; gap:10px; flex-wrap:wrap; }
.messages { min-height:380px; padding:20px; overflow-wrap:anywhere; }
.msg { font-size:14px; max-width:85%; background:#f5f3fa; }
.msg.user { background:var(--primary); }
.messages>[data-plain-message] { white-space:pre-wrap; }
.msg>.script-reader { margin:0; max-width:none; font-size:inherit; line-height:1.6; }
.msg>.script-reader>:last-child { margin-bottom:0; }
.msg>.script-reader :is(ul,ol) { margin:8px 0 14px; padding-left:22px; }
.msg>.script-reader :is(h3,h4,h5,h6) { margin:18px 0 10px; font-size:16px; }
.chat-input { height:auto; min-height:84px; padding:16px; flex-wrap:wrap; }
.chat-input .compose { min-width:120px; min-height:60px; }
.chat-input form { min-width:0; max-width:100%; }
.code { font-size:12px; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; background:#242044; }
.health-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.health-label,.health-count,.health-inline { font-size:12px; }
.chart { height:220px; }
.chart .bar { min-width:0; }
.legend-row,.source,.node { font-size:13px; }
.client-workspace,.service-workspace,.instant-surface,.dev-surface { width:100%; max-width:none; margin:0; font-size:14px; line-height:1.6; }
.client-head,.instant-head { gap:20px; margin-bottom:22px; }
.client-columns { grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr); gap:18px; }
.service-workspace .client-columns { grid-template-columns:repeat(2,minmax(0,1fr)); }
.client-card,.instant-panel { padding:22px; box-shadow:none; }
.client-form { gap:16px; }
.client-help,.instant-help { font-size:12px; line-height:1.6; color:var(--muted); }
.client-file { border:1px solid var(--line); border-radius:8px; padding:16px; background:#fcfbff; }
.client-file+.client-file { margin-top:12px; }
.client-file-title { gap:12px; flex-wrap:wrap; }
.service-workspace .client-card { margin-bottom:18px; }
.service-facts { gap:12px 18px; }
.service-facts dd { font-size:14px; }
.service-tabs .btn { flex:none; padding:12px 18px; }
.service-kpis { grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); }
.service-workspace .service-kpi { padding:18px; }
.service-row { padding:16px 0; }
.service-row:hover { background:#fdfbff; }
.service-workspace pre,.client-text { font-size:13px; line-height:1.7; }
.client-card details,.service-workspace details { border-top:1px solid var(--line); }
.client-card details:first-child { border-top:0; }
summary { color:#4e437f; cursor:pointer; padding:12px 0; }
summary:hover { color:var(--primary); }
.instant-grid { gap:18px; grid-template-columns:minmax(0,1.7fr) minmax(280px,1fr); }
.instant-guide { display:block; }
.instant-output { max-width:80ch; font-size:15px; line-height:1.9; }
.dev-surface .table th { font-size:11px; }
.dev-surface .table td { font-size:12px; }
.dev-surface :is(input,select,textarea) { font-size:13px; min-width:0; }
.dev-surface .dev-form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.dev-surface .btn { font-size:12px; min-height:38px; }
.client-profile-head,.manager-person-head { gap:18px; flex-wrap:wrap; }
.health-inline,.attention-reasons { flex-wrap:wrap; }
.report-insights { grid-template-columns:repeat(2,minmax(0,1fr)); }
.runtime-form,.attention-resolve { min-width:0; }
.runtime-form { grid-template-columns:minmax(100px,1fr) minmax(100px,1fr); }
.runtime-form :is(input,select),.attention-resolve input { font-size:13px; }
.scheduler-grid,.allocation-grid,.contacts-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.top-gap { margin-top:20px; }
/* Brand directory derives the card/list composition from PNG 02. */
.brand-directory { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; }
.brand-card { background:#fff; border:1px solid var(--line); border-radius:9px; padding:18px; display:flex; flex-direction:column; gap:16px; min-width:0; }
.brand-card:hover { border-color:#c6b6ff; box-shadow:0 3px 14px rgba(99,50,255,.06); }
.brand-card-heading { display:flex; align-items:flex-start; gap:12px; }
.brand-card-heading>div { min-width:0; }
.brand-card h2 { font-size:16px; margin:0; line-height:1.4; overflow-wrap:anywhere; }
.brand-card p { margin:4px 0 0; font-size:12px; color:var(--muted); }
.brand-card-facts { display:grid; gap:8px; margin:0; font-size:13px; }
.brand-card-facts>div { display:flex; justify-content:space-between; gap:12px; }
.brand-card-facts dt { color:var(--muted); }
.brand-card-facts dd { margin:0; text-align:right; }
.brand-card .btn { margin-top:auto; align-self:flex-start; }
.directory-toolbar { display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.directory-toolbar label { font-size:13px; color:var(--muted); }
.directory-toolbar .input { max-width:360px; }
.directory-result { font-size:12px; color:var(--muted); }
/* Login and all error variants derive from the same white/lavender surfaces. */
body.login-body { padding:40px 24px; background:radial-gradient(ellipse at 10% 90%,#e8e0ff,transparent 45%),#f7f8fd; }
.public-message { width:min(100%,580px); margin:8vh auto; padding:32px; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); }
.public-message .brand { max-width:230px; margin:0 auto; }
.public-message .empty-state { padding:24px 0 8px; }
.control-note { flex-direction:column; align-items:flex-start; gap:2px; }
.control-note small { display:block; font-size:11px; color:var(--muted); font-weight:400; }
.scope-note { margin:0 0 16px; font-size:13px; color:var(--muted); }
.login-wrap { border-radius:16px; max-width:1040px; grid-template-columns:1.12fr 1fr; }
.login-hero { background:linear-gradient(140deg,#fcfbff,#eee8ff); color:var(--text); padding:48px; position:relative; }
.login-hero .brand { padding:0; margin-bottom:46px; max-width:220px; }
.login-hero .brand-logo { max-width:220px; }
.login-hero .eyebrow { color:var(--primary); font-size:10px; letter-spacing:.14em; }
.login-hero h1 { font-size:38px; line-height:1.15; letter-spacing:-1.3px; }
.login-hero > p:not(.eyebrow) { display:block; font-size:14px; color:var(--muted); line-height:1.7; }
.security-note { background:rgba(255,255,255,.65); border-color:#ddd3f6; }
.security-note span { color:var(--muted); }
.login-card { padding:48px 40px; }
.login-card h2 { font-size:28px; }
.login-form .btn { min-height:46px; }
.empty-state { box-shadow:none; border-radius:12px; }
.support-surface { max-width:820px; }
/* Mobile drawer uses the existing keyboard/focus/inert implementation. */
.mobile-only,.mobile-backdrop { display:none; }
@media(min-width:1600px) { .content { padding-left:32px; padding-right:32px; } }
@media(max-width:1200px) {
 :root { --sidebar-width:210px; }
 .sidebar { padding-left:12px; padding-right:12px; }
 .nav-item { font-size:13px; gap:9px; }
 .topbar { padding:0 22px; }
 .content,.content:has(> .client-workspace),.content:has(> .instant-surface) { padding:24px 22px 32px; }
 .split-60,.split-70,.client-columns,.instant-grid,.service-workspace .client-columns { grid-template-columns:minmax(0,1fr); }
 .kpis { grid-template-columns:repeat(auto-fit,minmax(145px,1fr)); }
 .kanban { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .top-actions { gap:16px; }
 .top-identity strong { max-width:150px; }
 .workspace-home span { display:none; }
 .brand-message { padding:20px 14px 36px; }
 .brand-message strong { font-size:17px; }
}
@media(max-width:900px) {
 .page-head,.client-head,.instant-head { flex-direction:column; align-items:stretch; gap:14px; }
 .head-actions { justify-content:flex-start; }
 .split-50,.two-col,.health-grid,.scheduler-grid,.allocation-grid,.contacts-grid,.report-insights { grid-template-columns:minmax(0,1fr); }
 .chat-wrap { grid-template-columns:minmax(180px,220px) minmax(0,1fr); }
 .script-row { grid-template-columns:minmax(0,1fr) 80px; }
 .script-row>.badge { justify-self:start; }
 .script-row>.badge:nth-of-type(2) { grid-column:1; }
 .login-wrap { max-width:620px; grid-template-columns:1fr; }
 .login-hero { padding:32px; }
 .login-hero .brand { margin-bottom:24px; }
 .login-hero h1 { font-size:30px; }
 .login-card { padding:32px; }
 .form-grid { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:767px) {
 :root { --topbar-height:64px; }
 .sidebar { position:fixed; z-index:110; left:0; top:0; width:min(300px,88vw); height:100dvh; transform:translateX(-100%); padding:20px 16px; box-shadow:8px 0 40px rgba(24,13,65,.14); visibility:hidden; }
 .sidebar[data-drawer-open] { transform:translateX(0); visibility:visible; }
 .sidebar .nav-item { font-size:14px; }
 .sidebar .brand { padding-right:30px; }
 .sidebar .brand-logo { max-width:190px; }
 .brand-message { display:none; }
 .workspace { width:100%; }
 .topbar { padding:0 16px; gap:12px; }
 .top-context { flex:1; }
 .top-title { font-size:13px; }
 .crumb { font-size:10px; }
 .top-actions { gap:0; }
 .top-identity>div:last-child,.workspace-home { display:none; }
 .mini-avatar { width:32px; height:32px; font-size:11px; }
 .content,.app[data-ui-runtime] .content,.content:has(> .client-workspace),.content:has(> .instant-surface) { padding:22px 16px 104px; overflow:visible; }
 .page-head h1,.client-head h1,.instant-head h1 { font-size:27px; }
 .page-head p,.client-head p,.instant-head p { font-size:13px; }
 .kpis { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
 .kpi { padding:14px; }
 .kpi-top { font-size:12px; gap:6px; }
 .kpi-icon { width:28px; height:28px; flex-basis:28px; }
 .kpi-icon svg { width:18px; height:18px; }
 .kpi-value { font-size:27px; }
 .kpi-foot { font-size:11px; }
 .panel-head,.panel-body,.detail-head,.reader { padding:16px; }
 .panel-head { align-items:flex-start; }
 .client-card,.instant-panel { padding:18px; }
 .brand-directory { grid-template-columns:minmax(0,1fr); }
 .client-columns,.service-workspace .client-columns,.instant-grid,.dev-surface .dev-form-grid,.tech-grid { grid-template-columns:minmax(0,1fr); }
 .service-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; }
 .service-tabs .btn { padding:10px 4px; font-size:12px; min-width:0; }
 .input,.compose,.login-form input,.instant-form .input { font-size:16px; }
 .client-actions>.btn,.instant-actions>.btn { flex:1 1 130px; }
 .chat-wrap { grid-template-columns:minmax(0,1fr); min-height:0; }
 .chat-side { border-right:0; border-bottom:1px solid var(--line); }
 .app[data-mobile-enhanced] .chat-side { display:none; }
 .app[data-mobile-enhanced] .chat-side[data-context-open] { display:block; }
 .messages { min-height:300px; padding:16px; }
 .msg { max-width:94%; }
 .chat-input { padding:12px; }
 .chat-input .compose { flex-basis:100%; }
 .kanban { grid-template-columns:minmax(0,1fr); }
 .kcol { min-height:100px; }
 .health-grid { grid-template-columns:minmax(0,1fr); }
 .detail-card { margin-top:4px; }
 .detail-actions { flex-direction:column; }
 .detail-actions .btn { flex:auto; width:100%; }
 .tabs-top .seg { font-size:12px; padding:9px 10px; }
 .script-row { grid-template-columns:minmax(0,1fr) auto; }
 .group-progress { width:90px; }
 .form-grid,.service-facts { grid-template-columns:minmax(0,1fr); }
 .runtime-form { grid-template-columns:minmax(0,1fr); }
 .mobile-only { display:flex; }
 .mobile-menu-button,.mobile-close { align-items:center; justify-content:center; width:40px; height:40px; padding:10px; border:1px solid var(--line); border-radius:7px; background:#fff; color:var(--primary); cursor:pointer; }
 .mobile-menu-button { flex:none; }
 .mobile-close { position:absolute; top:18px; right:14px; }
 .mobile-menu-button svg,.mobile-close svg { width:20px; height:20px; }
 .mobile-backdrop:not([hidden]) { display:block; position:fixed; inset:0; z-index:100; border:0; background:rgba(27,19,55,.35); }
 .mobile-drawer-active { overflow:hidden; }
 .mobile-bottom { position:fixed; left:0; right:0; bottom:0; z-index:90; padding:8px 10px max(8px,env(safe-area-inset-bottom)); min-height:70px; background:#fff; border-top:1px solid var(--line); align-items:stretch; justify-content:space-around; gap:4px; }
 .mobile-bottom a,.mobile-bottom button { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; color:var(--muted); font-size:11px; background:transparent; border:0; border-radius:7px; padding:5px 3px; text-decoration:none; cursor:pointer; }
 .mobile-bottom svg { width:21px; height:21px; }
 .mobile-bottom [aria-current="page"] { background:#f0ebff; color:var(--primary); }
 .mobile-context-toggle { min-height:42px; padding:10px 14px; align-items:center; justify-content:space-between; background:#f2edff; color:#5724c6; border:1px solid #dfd4ff; border-radius:8px; font-size:13px; cursor:pointer; }
 .mobile-logout { margin-top:18px; }
 .mobile-logout .btn { width:100%; }
 /* Cards preserve table headers as per-cell labels; no column is discarded. */
 .table.mobile-cards,.table.mobile-cards tbody { display:block; width:100%; }
 .table.mobile-cards thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
 .table.mobile-cards tbody tr { display:block; border-bottom:1px solid var(--line); padding:12px 0; }
 .table.mobile-cards td { display:grid; grid-template-columns:minmax(0,.48fr) minmax(0,1fr); align-items:start; gap:4px 16px; padding:8px 0; border:0; font-size:13px; text-align:right; }
 .table.mobile-cards td:before { content:attr(data-label); text-align:left; color:var(--muted); grid-column:1; grid-row:1; font-size:12px; }
 .table.mobile-cards td>* { grid-column:2; max-width:100%; min-width:0; }
 .table.mobile-cards td[data-label=""] { grid-template-columns:minmax(0,1fr); }
 .table.mobile-cards td[data-label=""]:before { display:none; }
 .table.mobile-cards td[data-label=""]>* { grid-column:1; }
 .table.mobile-cards td:has(> .client-cell) { text-align:left; }
 .table.mobile-cards .client-cell { align-items:flex-start; }
 .table.mobile-cards td[colspan] { display:block; text-align:left; }
 .table.mobile-cards td[colspan]:before { display:none; }
 .directory-toolbar { align-items:stretch; flex-direction:column; gap:6px; }
 .directory-toolbar .input { max-width:none; }
 body.login-body { padding:18px 12px; }
 .login-wrap { border-radius:12px; }
 .login-hero { padding:28px 24px; }
 .login-hero h1 { font-size:28px; }
 .login-card { padding:28px 24px; }
 .security-note { padding:14px; margin-top:20px; }
 .empty-state { padding:30px 18px; }
}
@media(max-width:359px) {
 .content,.app[data-ui-runtime] .content,.content:has(> .client-workspace),.content:has(> .instant-surface) { padding-left:12px; padding-right:12px; }
 .kpis { grid-template-columns:minmax(0,1fr); }
 .page-head h1,.client-head h1,.instant-head h1 { font-size:25px; }
 .service-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .mobile-bottom { padding-left:4px; padding-right:4px; }
 .mobile-bottom span { font-size:10px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }
@media print { .sidebar,.topbar,.mobile-bottom,.mobile-only { display:none!important; } .content { padding:0; } .app { display:block; } .panel,.client-card { break-inside:avoid; } }
.table { table-layout:auto; }
.table th:first-child { min-width:140px; }
.table-scroll { max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; }
.table-scroll .table { min-width:540px; }
@media(max-width:767px) { .table-scroll .table.mobile-cards { min-width:0; } .table.mobile-cards th:first-child { min-width:0; } }
.control-note { display:inline-flex; align-items:center; min-height:32px; padding:4px 8px; font-size:12px; color:var(--muted); line-height:1.5; border-radius:6px; background:#f8f7fc; }
/* Production cards open the exact client/content through the Admin read model. */
a.production-card{display:block;color:inherit;text-decoration:none;transition:border-color .15s,background-color .15s}
a.production-card:hover{border-color:var(--purple,#6c45ff);background:#faf8ff}
a.production-card:focus-visible{outline:3px solid var(--purple,#6c45ff);outline-offset:3px}
.production-filters{display:flex;align-items:end;gap:14px;flex-wrap:wrap;margin:18px 0 24px}
.production-filters label{display:grid;gap:7px;min-width:180px;flex:1;color:var(--muted,#676d8c)}
.production-filters .input{width:100%}
@media(max-width:600px){.production-filters label{min-width:100%;}.production-filters .btn{flex:1;}}
.brandbook-field{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6}
.kpi-link{display:block;color:inherit;text-decoration:none}
.kpi-link:hover{border-color:var(--purple,#6c45ff)}
.kpi-link:focus-visible{outline:3px solid var(--purple,#6c45ff);outline-offset:3px}

/* Editorial reading: authored structure, one clear reading column. */
.review-workspace { display:grid; grid-template-columns:minmax(0,1fr) minmax(230px,280px); gap:22px; align-items:start; }
.review-main,.review-sidebar { min-width:0; }
.script-document h2 { font-size:22px; line-height:1.35; letter-spacing:-.025em; }
.script-document>p { color:var(--muted); font-size:13px; line-height:1.5; }
.script-reader { max-width:72ch; margin:26px 0 8px; color:var(--text); font-size:16px; line-height:1.72; overflow-wrap:anywhere; }
.script-reader :is(p,li) { font-size:inherit; line-height:inherit; }
.script-reader>p { margin:0 0 18px; }
.script-reader :is(h3,h4,h5,h6) { color:var(--text); font-weight:650; letter-spacing:-.02em; }
.script-reader h3 { font-size:20px; line-height:1.35; margin:32px 0 14px; }
.script-reader h4 { font-size:18px; line-height:1.4; margin:26px 0 12px; }
.script-reader :is(h5,h6) { font-size:16px; line-height:1.45; margin:22px 0 10px; }
.script-reader>:first-child { margin-top:0; }
.script-reader strong { font-weight:650; }
.script-reader blockquote { margin:16px 0 24px; padding:16px 20px; border:0; border-radius:8px; background:oklch(.976 .008 290); color:var(--text); }
.script-reader blockquote p { margin:0; font-size:17px; line-height:1.7; }
.script-reader .script-direction { margin:18px 0 12px; color:var(--muted); font-size:13px; line-height:1.65; }
.script-reader :is(ul,ol) { padding-left:24px; margin:14px 0 24px; }
.script-reader li { margin:6px 0; padding-left:3px; }
.script-reader hr { border:0; border-top:1px solid var(--line); margin:28px 0; }
.script-reader .script-facts { display:grid; gap:9px; margin:0 0 28px; padding:16px 0; border-block:1px solid var(--line); font-size:13px; line-height:1.6; }
.script-facts div { display:grid; grid-template-columns:minmax(100px,145px) minmax(0,1fr); gap:14px; }
.script-facts dt { font-weight:600; color:var(--text); }
.script-facts dd { margin:0; color:var(--muted); }
.script-reference { color:var(--muted); font-size:.9em; }
.script-reader code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.86em; background:oklch(.967 .006 290); padding:2px 5px; border-radius:4px; }
.script-reader pre.script-code { max-height:none; overflow:auto; padding:16px; border-radius:8px; white-space:pre-wrap; background:oklch(.967 .006 290); font-size:13px; }
.script-code code { padding:0; background:none; }
.script-table { max-width:100%; overflow:auto; margin:18px 0 26px; }
.script-table table { width:100%; border-collapse:collapse; font-size:14px; line-height:1.6; }
.script-table :is(th,td) { padding:11px 14px; border:1px solid var(--line); text-align:left; vertical-align:top; min-width:110px; }
.script-table th { background:oklch(.976 .008 290); font-weight:600; }
@media(max-width:1100px) { .review-workspace { grid-template-columns:minmax(0,1fr); } .review-sidebar { order:2; } }
@media(max-width:767px) { .script-reader { font-size:15px; line-height:1.7; margin-top:22px; } .script-reader h3 { font-size:19px; } .script-reader blockquote { padding:14px 16px; } .script-reader blockquote p { font-size:16px; } .script-document h2 { font-size:19px; } .script-facts div { grid-template-columns:minmax(0,1fr); gap:2px; } }
/* Workspace forms keep compact text; the document uses its own reading scale. */
.service-workspace .script-reader :is(p,li) { font-size:inherit; line-height:inherit; }
.service-workspace .script-reader .script-direction { font-size:13px; line-height:1.65; }
.service-workspace .script-reader blockquote p { font-size:17px; line-height:1.7; }
.script-reader li :is(ul,ol) { margin:8px 0 12px; }
@media(max-width:767px) { .service-workspace .script-reader blockquote p { font-size:16px; } }
.review-sidebar .service-row { display:block; padding:16px 0; }
.review-sidebar .service-row strong { display:block; font-size:14px; line-height:1.5; }
.review-sidebar .service-row p { margin:6px 0 0; font-size:12px; }
.review-sidebar .service-row>.badge { display:inline-flex; margin-top:9px; }

.avatar > .client-avatar-image { width:100%; height:100%; object-fit:cover; border-radius:inherit; display:block; }
.zernio-workspace { min-width:0; max-width:100%; }
.zernio-workspace :is(p,li,summary,h3,output) { overflow-wrap:anywhere; }
.zernio-workspace :is(form,input,select,output) { max-width:100%; min-width:0; }