/* Shared compact UI hierarchy. Loaded after each app's existing theme/layout.
   Document, screenplay, proposal-paper and lighting-canvas sizing stays local. */
:root {
  --ui-body: 15px;
  --ui-control: 14px;
  --ui-meta: 12px;
  --ui-success: #087451;
  --ui-warning: #885000;
  --ui-danger: #b42332;
  --ui-info: #245bb2;
  --ui-button: color-mix(in srgb, var(--accent) 65%, #000);
  --ui-muted-surface: #f0f2f6;
}
html[data-theme="dark"], html:has(body.client-app) {
  --ui-success: #6ee7b7;
  --ui-warning: #fcd477;
  --ui-danger: #fda4af;
  --ui-info: #a9c9ff;
  --ui-muted-surface: #242a3a;
}
body.ops-app, body.client-app { font-size: var(--ui-body); line-height: 1.45; }
body.client-app { --text2: #b0b6ce; --text3: #b0b6ce; }
.btn, .btn-ghost, .btn-sm, .btn-add-client, .chip-btn, .sidebar-search input,
.field input, .field select, .field textarea, .tool-toolbar input, .tool-toolbar select,
.pp-table input, .pp-table select { font-size: var(--ui-control); }
.btn, .btn-ghost, .btn-sm { border-radius: 7px; font-weight: 600; }
.btn-primary, .btn-add-client { background: var(--ui-button); color: #fff; box-shadow: none; }
.btn-primary:not(:disabled):hover, .btn-add-client:hover { filter: brightness(.92); }
.btn-secondary, .btn-ghost { background: var(--bg2); border: 1px solid var(--border); color: var(--text); }
.btn-secondary:hover, .btn-ghost:hover { background: var(--bg3); }
.field label { font-size: var(--ui-meta); text-transform: none; letter-spacing: 0; color: var(--text); }
.field-hint, .dash-hint, .cd-empty, .pp-empty, .portal-empty,
.client-industry, .card-industry, .card-video-count, .card-note, .card-date,
.planif-label, .column-count, .planif-badge, .client-status-badge,
.inv-sub, .repo-sub, .hf-sub, .hw-row-meta, .save-state,
.vb-sub, .vb-next, .pc-hint, .ph-sub, .portal-security-note { font-size: var(--ui-meta); }
.dash-card > h4, .portal-section-title, .home-section-title { letter-spacing: .02em; }
.client-name, .column-title, .repo-name, .inv-name, .ctab { font-size: var(--ui-control); }
.card-title { font-size: var(--ui-body); font-weight: 700; line-height: 1.35; }
.card-project-primary { font-size:15px; font-weight:750; }
.card-client-link { padding:0; border:0; background:transparent; color:var(--text2); font-size:12px; cursor:pointer; text-align:left; }
.card-client-link:hover,.card-client-link:focus-visible { color:var(--accent); text-decoration:underline; }
.card-project-title { color: var(--text); font-size: var(--ui-body); font-weight: 650; margin: 5px 0 3px; overflow-wrap: anywhere; }
.card-industry { overflow-wrap: anywhere; }
.card { box-shadow: none; border: 1px solid var(--border); border-left-width: 3px; }
.card:hover { transform: none; box-shadow: 0 2px 8px rgba(0,0,0,.08); }
.card-header > div:last-child { min-width: 0; }
.card-menu { opacity: 1; color: var(--text2); }
.card-footer { flex-wrap: wrap; gap: 6px; }
.card-note { flex: 1 1 80px; max-width: none; }
.card-action { font-size: var(--ui-meta); line-height: 1.35; padding: 6px 8px; }
.card-tag, .pill, .pc-action-tag, .pc-delivered, .pc-new-tag { font-size: var(--ui-meta); }
.status-banner { font-size: var(--ui-control); font-weight: 600; }
.status-banner.green, .scripts-badge, .pc-delivered { color: var(--ui-success); }
.status-banner.blue { color: var(--ui-info); }
.status-banner.amber, .inv-chip.busy, .validation-row .validation-status.pending { color: var(--ui-warning); }
.pill.ok, .inv-chip.free, .validation-row .validation-status.validated,
.card-action.checked-script, .card-action.checked-rendu { color: var(--ui-success); }
.inv-chip.conflict, .validation-row .validation-status.rejected { color: var(--ui-danger); }
.card-action.unchecked { color: var(--text); border-color: var(--border); background: var(--bg3); }
.card-date.late, .card-date.today, .sr-when.overdue { color: var(--ui-danger); font-weight: 650; }
.card-date.soon, .sr-when.soon, .card-shooting-info { color: var(--ui-warning); }
.review-status { display: inline-flex; align-items: center; gap: 5px; padding: 3px 7px; border-radius: 5px; background: var(--ui-muted-surface); font-size: var(--ui-meta); font-weight: 600; }
.review-status.pending, .review-status.rejected { color: var(--ui-warning); }
.review-status.validated { color: var(--ui-success); }
.review-status.preparing { color: var(--text2); }
.proj-card h3 { font-size: 15px; line-height: 1.4; overflow-wrap: anywhere; }
.step-label { font-size: var(--ui-meta); line-height: 1.35; }
.proj-card-click { text-align: left; }
.validate-box .vb-title { font-size: 14px; }
.validate-box button, .validate-box textarea { font-size: var(--ui-control) !important; line-height: 1.4 !important; }
.validate-box button { min-height: 30px; height: auto !important; }
.validate-box textarea { min-height: 84px !important; }
.validate-box .vb-sub { line-height: 1.5; }
.validate-box { box-shadow: none; }
.validate-box.disabled { opacity: 1; }
.pp-table { font-size: var(--ui-control); }
.pp-table th { font-size: var(--ui-meta); text-transform: none; letter-spacing: 0; }
.se-name { color: var(--text) !important; font-size: var(--ui-control); }
.stage-edit-row input { font-size: var(--ui-control); }
.stage-date-hint { margin: 0 0 10px; font-size: var(--ui-meta); color: var(--text2); }
.stage-edit-row:has(input[aria-invalid="true"]) { outline: 1px solid var(--ui-danger); border-radius: 5px; }
.bfc-label { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.bfc-tag { padding: 2px 7px; border: 1px solid var(--border); border-radius: 5px; font-size: var(--ui-meta); color: var(--text); }
.bfc-clear { white-space: nowrap; }
.search-result-heading { padding: 8px 10px 4px; font-size: var(--ui-meta); color: var(--text2); }
.project-search-result { display: flex; gap: 8px; align-items: center; width: 100%; border: 0; border-radius: 6px; background: transparent; color: var(--text); text-align: left; padding: 7px 10px; cursor: pointer; }
.project-search-result:hover, .project-search-result:focus-visible { background: var(--bg3); }
.project-search-result span { min-width: 0; }
.project-search-result strong, .project-search-result small { display: block; overflow-wrap: anywhere; }
.project-search-result strong { font-size: var(--ui-control); }
.project-search-result small { color: var(--text2); font-size: var(--ui-meta); }
@media (max-width: 480px) {
  .field input, .field select, .field textarea { font-size: 16px; }
  .card-title, .card-project-title { font-size: 14px; }
  .board-filter-chip { align-items: flex-start; flex-wrap: wrap; }
}
/* Remaining UX improvements: compact sections, actionable project rows, touch. */
.card-section-nav { display:flex; align-items:center; gap:10px; padding:10px 16px; border-bottom:1px solid var(--border); background:var(--bg2); }
.card-section-nav{display:block}.card-workspace-switch{display:flex;gap:8px;margin-bottom:8px}.card-workspace-switch button{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border:1px solid var(--border);border-radius:7px;background:var(--bg);color:var(--text);font-weight:700;cursor:pointer}.card-workspace-switch button.active{background:var(--accent);border-color:var(--accent);color:#fff}.card-section-pills{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}.card-section-button{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;border:1px solid var(--border);border-radius:6px;background:transparent;color:var(--text2);padding:6px 8px;font-size:12px;cursor:pointer}.card-section-button.active{background:var(--bg3);color:var(--text);border-color:var(--accent)}
.card-section-nav label { font-size:12px; color:var(--text2); }
.card-section-nav select { flex:1; min-width:0; max-width:340px; background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:6px; padding:7px; font-size:13px; }
#cardTabs { display:none; }
#cardModal .modal-header, #projModal .modal-header { position:sticky; top:0; z-index:4; background:var(--bg2); }
.portal-view-nav { display:flex; gap:8px; margin:16px 0; }
.portal-project-row { display:flex; width:100%; align-items:center; justify-content:space-between; gap:14px; padding:12px 14px; margin:7px 0; text-align:left; color:var(--text); background:var(--bg2); border:1px solid var(--border); border-radius:8px; cursor:pointer; }
.portal-project-row>span:first-child { flex:1; min-width:0; }
.portal-project-row strong,.portal-project-row small { display:block; overflow-wrap:anywhere; }
.portal-project-row strong { font-size:14px; }
.portal-project-row small { margin-top:4px; color:var(--text2); font-size:12px; }
.portal-project-row>span:last-child { font-size:12px; }
.portal-project-row:hover { border-color:var(--accent); }
.delivery-project { margin:12px 0; padding:14px; background:var(--bg2); border:1px solid var(--border); border-radius:8px; }
.delivery-project h3 { margin:0 0 10px; font-size:14px; }
.delivery-project .btn { margin:3px; }
#deliverySearch { display:block; width:100%; padding:9px; background:var(--bg2); border:1px solid var(--border); color:var(--text); border-radius:6px; }
.portal-proposal-ready { padding:12px 16px; margin:12px 0; }
.portal-proposal-ready h2 { font-size:15px; margin:0 0 6px; }
.portal-proposal-ready p { font-size:13px; margin:0 0 8px; }
.commercial-progress { font-size:13px; padding:10px 14px; background:var(--bg3); color:var(--text); border:1px solid var(--border); border-radius:6px; margin:10px 0; }
.proposal-secondary-tools { position:relative; font-size:13px; }
.proposal-secondary-tools summary { padding:8px; cursor:pointer; }
.proposal-secondary-tools[open]>div { position:absolute; right:0; top:100%; z-index:40; display:grid; min-width:200px; padding:8px; background:var(--bg2); border:1px solid var(--border); box-shadow:0 5px 20px #0003; }
#clientOptionalDetails { margin:12px 0; }
#clientOptionalDetails summary { font-size:13px; cursor:pointer; margin-bottom:10px; }
button:focus-visible, a:focus-visible, select:focus-visible, summary:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
@media (pointer:coarse), (max-width:700px) {
  .btn,.btn-ghost,.cd-mini,.pp-del,.pp-vis,.card-menu,.validate-box button,.card-section-nav select { min-height:44px; min-width:44px; }
  .validate-box button { min-height:44px !important; }
  .portal-project-row { flex-wrap:wrap; }
  .portal-project-row>span:first-child { flex-basis:100%; }
  .card-section-nav { flex-wrap:wrap; }
  .card-section-nav select { max-width:none; }
  .proposal-editor-actions { flex-wrap:wrap; }
}
#cardModal .card-head { position:sticky; top:0; z-index:5; background:var(--bg2); }
#cardModal .card-head h2 { min-width:0; overflow-wrap:anywhere; }
#cardModal .card-head>.btn { margin-left:auto; }
#cardModal .card-head h2 { white-space:normal; text-overflow:clip; line-height:1.35; }
@media(max-width:700px){#cardModal .card-head h2 { font-size:14px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }}
.script-reader-review { display:flex; gap:8px; align-items:center; flex-wrap:wrap; padding:10px 16px; border-bottom:1px solid var(--border); background:var(--bg2); }
.script-reader-review:empty { display:none; }
.script-reader-review>span { flex:1 1 250px; font-size:12px; color:var(--text2); }
@media(max-width:700px){.script-reader-review>.btn { flex:1 1 140px; }.script-reader-review>span { flex-basis:100%; }}
/* Named documents stay compact but are visible while writing. The paper layer
   makes page boundaries legible without splitting Quill's continuous Delta. */
.sv-documents { display:flex; gap:5px; min-width:0; overflow:auto; padding:4px 0; }
.sv-document,.sv-document-add { white-space:nowrap; border:1px solid var(--border); border-radius:6px; padding:5px 8px; background:var(--bg2); color:var(--text); cursor:pointer; font-size:12px; }
.sv-document.active { color:#fff; background:var(--accent); border-color:var(--accent); }
.sv-document-actions { display:flex; gap:3px; }
.sv-document-actions button { border:0; border-radius:5px; color:var(--text2); background:transparent; cursor:pointer; padding:4px; }
.sv-document-actions button:disabled { opacity:.35; cursor:default; }
.range-picker-trigger { text-align:left; min-height:36px; padding:7px 9px; border:1px solid var(--border); border-radius:6px; background:var(--bg); color:var(--text); cursor:pointer; }
.range-picker-popover { position:fixed; z-index:500; inset:50% auto auto 50%; transform:translate(-50%,-50%); width:min(720px,calc(100vw - 24px)); padding:14px; border:1px solid var(--border); border-radius:10px; background:var(--bg2); box-shadow:0 18px 55px #0008; }
.range-picker-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }.range-picker-head button{width:32px;height:32px;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--text);font-size:22px;cursor:pointer;}.range-picker-head strong{font-size:13px;}
.range-picker-months { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }.range-picker-months h4{text-align:center;text-transform:capitalize;font-size:13px;margin:0 0 8px}.range-picker-days{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.range-picker-days b{font-size:10px;text-align:center;color:var(--text2);padding:3px}.range-picker-days button{min-height:32px;border:0;border-radius:5px;background:transparent;color:var(--text);cursor:pointer}.range-picker-days button:hover,.range-picker-days button.inside{background:color-mix(in srgb,var(--accent) 18%,transparent)}.range-picker-days button.selected{background:var(--accent);color:#fff;font-weight:700}.range-picker-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:7px;margin-top:14px}
@media(max-width:620px){.range-picker-months{grid-template-columns:1fr}.range-picker-months section+section{display:none}.range-picker-actions .btn{flex:1 1 130px;}}
.script-pages { position:relative; width:210mm; min-height:297mm; background:#fff; }
.script-pages .ql-editor { position:relative; min-height:297mm; background:transparent; }
#scriptPageMarkers { position:absolute; inset:0; pointer-events:none; z-index:3; }
.script-view .script-pages { position:relative; }
.script-view:not(.hidden){animation:none!important}
.script-page-counter{align-self:center;color:var(--text2);font-size:12px;padding:0 8px;white-space:nowrap}
.script-view .script-paged-surface{min-height:297mm;flex-shrink:0;background:none;box-shadow:none;position:relative;}
.script-view .script-paginated.ql-editor{box-sizing:content-box!important;width:178mm!important;height:auto!important;min-height:0!important;max-height:none!important;padding:0!important;margin:18mm 16mm!important;columns:auto!important;overflow:visible!important;}
.script-paginated [data-page-block],.script-paginated [data-page-start]{break-before:auto;}
.script-paginated [data-page-start]{display:block;}
.script-paginated p{orphans:2;widows:2;}
.script-page-numbers{position:absolute;inset:0;pointer-events:none;color:#687080;font-size:11px;}
.script-sheet{position:absolute;left:0;width:210mm;background:#fff;box-shadow:0 2px 10px #0002;border:1px solid #dce0e8;box-sizing:border-box;}
.script-sheet>span{position:absolute;bottom:6mm;left:0;width:100%;text-align:center;}
.script-paged-surface .script-manual-break{width:auto;right:auto;white-space:nowrap;}
.script-view .script-editor-wrap{display:block!important;overflow:auto!important;}
.script-view .script-paged-surface{margin-inline:auto;}
.script-paged-surface .ql-container{display:flow-root;background:transparent!important;box-shadow:none!important;border-radius:0!important}
.script-page-navigation{position:sticky;left:0;top:0;z-index:5;display:flex;gap:6px;flex-wrap:wrap;min-height:34px;width:max-content;max-width:100%;margin:0 auto 16px;padding:6px;background:var(--bg2);border:1px solid var(--border);border-radius:10px;}
.script-page-navigation[hidden]{display:none}
.script-page-navigation button{white-space:nowrap;flex:0 0 auto;font-size:11px;padding:6px 8px}
.mobile-script-close,.mobile-script-panel{display:none}
body:has(.script-view:not(.hidden)) #mobileTabs{display:none!important}

#portalScriptPageBreaks { position:absolute; inset:0; pointer-events:none; z-index:3; }
.portal-manual-break { position:absolute; left:0; right:0; border-top:2px dashed #6d57c8; color:#5740aa; font-size:11px; text-align:right; padding-right:8px; }
.portal-admin-action-banner { position:sticky; top:0; z-index:30; padding:9px 14px; color:#2e145f; background:#f3e8ff; border-bottom:1px solid #c4b5fd; font-weight:700; font-size:12px; text-align:center; }
.preview-admin-note { padding:9px 14px; color:#2e145f; background:#f3e8ff; border-bottom:1px solid #c4b5fd; font-weight:700; font-size:12px; text-align:center; }
.review-timeline { display:grid; gap:9px; }
.review-timeline-event { display:grid; grid-template-columns:26px minmax(0,1fr); gap:8px; padding:8px 0; border-bottom:1px solid var(--border); }
.review-timeline-event:last-child { border-bottom:0; }.review-timeline-event strong,.review-timeline-event small { display:block; }.review-timeline-event small { color:var(--text2); font-size:11px; margin-top:2px; }.review-timeline-event p { margin:3px 0 0; font-size:12px; white-space:pre-wrap; }.review-timeline-icon { color:var(--accent); padding-top:2px; }
.deliv-history-filter{display:flex;justify-content:flex-end;margin:8px 0}.deliv-history-filter label{display:flex;align-items:center;gap:6px;color:var(--text2);font-size:12px}.deliv-history-filter select{min-height:30px;padding:3px 7px;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--text)}
.script-manual-break { position:absolute; left:0; right:0; border-top:2px dashed #6d57c8; color:#5740aa; font-size:11px; pointer-events:auto; display:flex; align-items:center; justify-content:flex-end; gap:5px; }
.script-manual-break span { background:#eeeafe; padding:1px 5px; }
.script-manual-break button { border:0; border-radius:50%; cursor:pointer; color:#5740aa; background:#eeeafe; width:18px; height:18px; }
@media(max-width:700px){.sv-documents{order:3; flex-basis:100%;}.script-pages{width:100%;}.sv-document,.sv-document-add{min-height:36px;}}
.project-planning-timeline{padding:10px 0 16px}.planning-timeline-head{display:flex;justify-content:space-between;gap:12px;align-items:baseline;font-size:12px;margin-bottom:8px}.planning-timeline-head span{color:var(--text2)}.planning-timeline-track{height:92px;position:relative;border:1px solid var(--border);border-radius:8px;background:repeating-linear-gradient(90deg,var(--bg3) 0 1px,transparent 1px 12.5%);overflow:hidden}.project-stage-band{position:absolute;top:24px;height:42px;min-width:46px;border:0;border-radius:6px;padding:4px 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:grab;font-size:12px;font-weight:650}.project-stage-band:active{cursor:grabbing}
.project-stage-handle { position:absolute; inset:0 0 0 auto; width:22px; border-right:3px solid color-mix(in srgb,#fff 70%,transparent); opacity:.8; cursor:ew-resize; }
.project-stage-band { touch-action:pan-y; padding-right:25px; }
.project-stage-band:focus-visible { outline:3px solid var(--text); outline-offset:-3px; }
.project-stage-caption{position:absolute;left:8px;font-size:11px;color:var(--text);pointer-events:none;}
.delivery-review-states{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0}
.delivery-review-states>div{padding:10px;border:1px solid var(--border);border-radius:8px}
.delivery-review-states small,.delivery-review-states strong{display:block;font-size:12px;overflow-wrap:anywhere}
.delivery-review-states small{color:var(--text2);margin:4px 0}
@media(max-width:760px){.delivery-review-states{grid-template-columns:1fr}}
.project-stage-band{height:36px}
.planning-timeline-axis { display:flex; justify-content:space-between; gap:12px; font-size:12px; color:var(--text2); padding:4px 0; }
@media(max-width:640px){.planning-timeline-head{display:block}.planning-timeline-head span{display:block;margin-top:6px}}
.project-continuity{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:0 0 12px;color:var(--text2);font-size:12px}.project-continuity .btn-link{font-size:12px}
.client-info-summary{display:grid;gap:14px;padding:4px 0}.client-info-primary{display:flex;align-items:center;gap:10px}.client-info-primary strong,.client-info-primary small{display:block}.client-info-primary small{color:var(--text2);font-size:12px;margin-top:2px}.client-info-dot{width:12px;height:12px;border-radius:50%;flex:0 0 auto}.client-info-summary dl{display:grid;gap:9px;margin:0}.client-info-summary dl div{display:grid;gap:2px}.client-info-summary dt{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text2)}.client-info-summary dd{margin:0;font-size:13px}.client-info-contacts h3{display:flex;align-items:center;gap:6px;margin:0 0 7px;font-size:13px}.client-info-contacts ul{display:grid;gap:7px;margin:0;padding:0;list-style:none}.client-info-contacts li{display:grid;gap:2px;padding:8px 9px;border:1px solid var(--border);border-radius:7px;font-size:12px}.client-info-contacts li span,.client-info-contacts li a{color:var(--text2)}

/* Contact coordinates: a quiet copy action beside the value, also focusable. */
.client-contact-values{display:flex;flex-wrap:wrap;align-items:center;gap:2px 12px;font-size:12px;color:var(--text2)}
.client-contact-value{display:inline-flex;align-items:center;gap:3px;max-width:100%;vertical-align:middle;min-width:0}
.client-contact-text{min-width:0;overflow-wrap:anywhere}
.contact-copy{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:28px;height:28px;padding:5px;border:0;border-radius:6px;background:transparent;color:var(--text2);opacity:.35;cursor:pointer;transition:opacity 150ms ease,background-color 150ms ease,color 150ms ease}
.contact-copy .ic-sm{width:14px;height:14px}
.client-contact-value:hover>.contact-copy,.contact-copy:focus-visible{opacity:1;color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
.contact-copy:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media(pointer:coarse){.contact-copy{width:44px;height:44px;opacity:.65}}
@media(prefers-reduced-motion:reduce){.contact-copy{transition:none}}