.testPreviewBadge {
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 4000;
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 26px;
  padding: 0 11px;
  color: #b9b7b1;
  background: rgba(15, 16, 19, .88);
  border: 1px solid rgba(224, 180, 88, .2);
  border-radius: 999px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .28);
  backdrop-filter: blur(16px);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
  pointer-events: none;
}

.testPreviewBadge::before {
  content: '';
  width: 5px;
  height: 5px;
  background: #e0b458;
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(224, 180, 88, .55);
}

.testPreviewBadge span { color: #696b70; }

.recentProjectActions button {
  min-width: 32px;
  min-height: 32px;
}

/* -------------------------------------------------------------------------
   Test polish layer

   This deliberately refines the existing product language instead of
   replacing it. Layout, data, and workflows remain owned by the live app.
   ------------------------------------------------------------------------- */

:root {
  --text: #f0eee9;
  --dim: #aeb3bd;
  --line: #303640;
  --line-soft: rgba(255, 255, 255, .075);
  --line-strong: rgba(255, 255, 255, .145);
  --surface-0: #101217;
  --surface-1: #181b21;
  --surface-2: #20242c;
  --surface-3: #292e38;
  --header-dock-bg: rgba(7, 9, 12, .52);
  --card-shadow: 0 1px 0 rgba(255, 255, 255, .025), 0 8px 26px rgba(0, 0, 0, .08);
  --float-shadow: 0 16px 42px rgba(0, 0, 0, .24);
  --workspace-toolbelt-font-size: 11px;
  --workspace-control-font-size: 13.5px;
}

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

#sidebar {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .012), transparent 36%),
    var(--panel);
  box-shadow: 14px 0 44px rgba(0, 0, 0, .09);
}

#sidebar header#brand {
  background:
    radial-gradient(circle at 72% 0, rgba(224, 180, 88, .055), transparent 42%),
    var(--header-bg);
}

#workspaceDock {
  gap: 3px;
  padding: 4px;
  border-color: rgba(255, 255, 255, .08);
  box-shadow: inset 0 1px rgba(255, 255, 255, .025);
}

#workspaceDock #toolsBtn,
#workspaceDock #brandHome,
#workspaceDock #writerBtn {
  height: 31px;
  padding-inline: 12px;
  transition: color .16s var(--ease), background-color .16s var(--ease),
    border-color .16s var(--ease), box-shadow .16s var(--ease);
}

body.writer-mode #workspaceDock #writerBtn,
body.production-mode #workspaceDock #toolsBtn,
body:not(.splash-home):not(.writer-mode):not(.production-mode) #workspaceDock #brandHome,
body.table-read-empty #workspaceDock #brandHome {
  color: var(--text);
  background: rgba(255, 255, 255, .075);
  border-color: rgba(255, 255, 255, .13);
  box-shadow: inset 0 1px rgba(255, 255, 255, .045);
}

.reader-paper.writer-mode #workspaceDock #writerBtn,
.reader-paper.production-mode #workspaceDock #toolsBtn,
.reader-paper:not(.splash-home):not(.writer-mode):not(.production-mode) #workspaceDock #brandHome,
.reader-paper.table-read-empty #workspaceDock #brandHome {
  background: rgba(24, 28, 34, .065);
  border-color: rgba(24, 28, 34, .14);
  box-shadow: inset 0 1px rgba(255, 255, 255, .54);
}

#workspaceDock #toolsBtn:focus-visible,
#workspaceDock #brandHome:focus-visible,
#workspaceDock #writerBtn:focus-visible {
  outline: none;
  border-color: rgba(224, 180, 88, .58);
  box-shadow: inset 0 1px rgba(255, 255, 255, .045), 0 0 0 1px rgba(224, 180, 88, .1);
}

.projectEllipsisGlyph circle {
  fill: currentColor;
  stroke: none;
}

button,
input,
select,
textarea,
summary,
[role="button"],
[role="tab"] {
  transition: color .16s var(--ease), background-color .16s var(--ease),
    border-color .16s var(--ease), box-shadow .18s var(--ease),
    transform .18s var(--ease-spring), opacity .16s var(--ease);
}

button:hover { filter: none; }

/* A single, visible collaboration action in every active workspace. */
.projectShareButton {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  width: 100%;
  min-height: 46px;
  margin-top: 10px;
  padding: 6px 9px;
  border: 1px solid color-mix(in srgb, var(--accent2) 26%, var(--line-soft));
  border-radius: 11px;
  background: color-mix(in srgb, var(--accent2) 7%, var(--surface-1));
  color: var(--text);
  text-align: left;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025);
}

body:not(.script-loaded) .projectShareButton { display: none; }

.projectShareButton > svg {
  display: block;
  width: 30px;
  height: 30px;
  padding: 7px;
  overflow: visible;
  border-radius: 9px;
  background: color-mix(in srgb, var(--accent2) 13%, var(--surface-2));
  fill: none;
  stroke: var(--accent2);
  stroke-width: 1.45;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.projectShareButton > span,
.projectShareButton b,
.projectShareButton small { display: block; min-width: 0; }
.projectShareButton b { font-size: 11px; line-height: 1.15; }
.projectShareButton small {
  margin-top: 3px;
  color: var(--dim);
  font-size: 9px;
  font-weight: 550;
  line-height: 1.1;
}
.projectShareButton > i {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 7px;
  color: var(--accent2);
  font-size: 15px;
  font-style: normal;
  font-weight: 600;
}
.projectShareButton:hover {
  border-color: color-mix(in srgb, var(--accent2) 48%, var(--line));
  background: color-mix(in srgb, var(--accent2) 11%, var(--surface-1));
  box-shadow: 0 8px 22px rgba(0, 0, 0, .14), inset 0 1px rgba(255, 255, 255, .035);
  transform: translateY(-1px);
}
.projectShareButton:hover > i { transform: translateX(2px); }

.workspacePrivacyFooter .homeDrawerPrivacy {
  color: color-mix(in srgb, var(--dim) 76%, transparent);
  font-size: 9px;
}
.workspacePrivacyFooter .homeDrawerPrivacy.save-ok { color: color-mix(in srgb, var(--dim) 65%, transparent); }

/* Sidebar language is readable without becoming visually loud. */
.writerDetails summary { font-size: 11.5px; letter-spacing: .95px; }
.workspaceSceneNavItem b { font-size: 11px; }
.workspaceSceneNavItem small { font-size: 9.5px; }
.productionSideIntro p,
.productionSideEmpty { font-size: 10.5px; line-height: 1.48; }
.productionSideCardHead small,
.productionSideDisclosure > summary em { font-size: 9px; }
.productionInlineCommentMain b { font-size: 10.5px; }
.productionInlineCommentMain small { font-size: 9.25px; }

.projectNextStep {
  border-color: color-mix(in srgb, var(--accent2) 22%, var(--line-soft));
  background:
    linear-gradient(125deg, color-mix(in srgb, var(--accent2) 8%, var(--surface-1)), var(--surface-1));
}
.projectNextStepCopy b { font-size: 11px; }
.projectNextStepCopy small { font-size: 9px; }
.projectNextStep button { font-size: 9.5px; }

/* Main canvases gain depth while keeping the original content hierarchy. */
body:not(.reader-paper) #main,
body.production-mode #insWrap {
  background:
    radial-gradient(circle at 84% -10%, rgba(127, 180, 162, .045), transparent 32%),
    radial-gradient(circle at 18% 108%, rgba(224, 180, 88, .035), transparent 36%),
    var(--surface-0);
}

body.production-mode #insights {
  animation: polishCanvasIn .32s var(--ease-spring) both;
}

.insTabs,
.productionSceneCard,
.dayOverviewCard,
.callSection,
.writerToolbar,
#writerPaper {
  box-shadow: var(--card-shadow);
}

.insTabs button.active {
  border-color: color-mix(in srgb, var(--accent) 34%, var(--line));
  background: color-mix(in srgb, var(--accent) 13%, var(--surface-2));
  box-shadow: inset 0 1px rgba(255, 255, 255, .045), 0 5px 16px rgba(0, 0, 0, .09);
}

/* Shot List: scene identity is primary; shooting order is quiet and useful. */
.orderTools {
  padding: 14px 15px;
  border-color: var(--line-soft);
  background:
    linear-gradient(100deg, color-mix(in srgb, var(--accent) 6%, var(--surface-1)), var(--surface-1) 38%);
}
.orderToolsCopy b { font-size: 14.5px; }
.orderToolsCopy > span { color: color-mix(in srgb, var(--dim) 92%, var(--text)); font-size: 12px; }

.productionSceneCard {
  border-color: var(--line-soft);
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--surface-2) 90%, var(--accent2) 2%), var(--surface-1));
  transition: border-color .18s var(--ease), box-shadow .2s var(--ease),
    transform .2s var(--ease-spring), background-color .18s var(--ease);
}
.productionSceneCard:hover {
  border-color: color-mix(in srgb, var(--accent2) 24%, var(--line-strong));
  box-shadow: 0 14px 34px rgba(0, 0, 0, .17), inset 0 1px rgba(255, 255, 255, .025);
}
.productionSceneCard[open] {
  border-color: color-mix(in srgb, var(--accent) 32%, var(--line));
  box-shadow: 0 16px 38px rgba(0, 0, 0, .18), 0 0 0 1px rgba(224, 180, 88, .025);
}
.productionSceneHead { padding-block: 13px; }
.dragHandle {
  border-color: var(--line-soft);
  background: color-mix(in srgb, var(--surface-0) 72%, var(--surface-1));
}
.dragHandle:hover {
  border-color: color-mix(in srgb, var(--accent2) 42%, var(--line));
  background: color-mix(in srgb, var(--accent2) 8%, var(--surface-1));
  color: var(--accent2);
  transform: translateY(-1px);
}
.orderBadge {
  display: grid;
  min-width: 32px;
  height: 34px;
  padding: 3px 7px 4px;
  align-content: center;
  gap: 1px;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  background: var(--surface-0);
  color: var(--text);
  font-size: 12px;
  font-weight: 780;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.orderBadge::before {
  content: 'Order';
  color: var(--dim);
  font-size: 6.5px;
  font-weight: 800;
  letter-spacing: .45px;
  line-height: 1;
  text-transform: uppercase;
}
.sceneTag {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--line));
  background: color-mix(in srgb, var(--accent) 10%, var(--surface-1));
  color: var(--accent);
}
.sceneCardTitle { font-size: 15.5px; font-weight: 750; letter-spacing: -.12px; }
.sceneCardCast { color: color-mix(in srgb, var(--dim) 94%, var(--text)); font-size: 12px; }
.sceneCardSummaryCounts { margin-top: 6px; }
.sceneCardSummaryCounts i { padding: 3px 7px; font-size: 9px; }
.sceneCardActions button {
  border-color: var(--line-soft);
  background: color-mix(in srgb, var(--surface-0) 72%, var(--surface-1));
}
.sceneCardActions button:hover {
  border-color: color-mix(in srgb, var(--accent) 28%, var(--line));
  background: color-mix(in srgb, var(--accent) 7%, var(--surface-1));
  transform: translateY(-1px);
}
.sceneBlockBody { background: color-mix(in srgb, var(--surface-0) 94%, var(--surface-1)); }

/* Forms feel intentional and aligned across Writer, Schedule, and Call Sheets. */
:where(input, select, textarea):not([type="range"]):not([type="checkbox"]):not([type="radio"]) {
  border-color: var(--line-soft);
}
:where(input, select, textarea):not([type="range"]):not([type="checkbox"]):not([type="radio"]):hover {
  border-color: var(--line-strong);
}
:where(input, select, textarea):not([type="range"]):not([type="checkbox"]):not([type="radio"]):focus {
  border-color: color-mix(in srgb, var(--accent) 54%, var(--line));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 10%, transparent);
  outline: 0;
}

.callSection > summary:hover,
.writerDetails summary:hover {
  border-color: var(--line-strong);
  background: color-mix(in srgb, var(--surface-2) 78%, var(--accent) 2%);
}

@keyframes polishCanvasIn {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

/* -------------------------------------------------------------------------
   Active project home

   Home is a command center only when a project is loaded. Every number and
   action below comes from the screenplay, review, shot, schedule, directory,
   or call-sheet state already owned by the app.
   ------------------------------------------------------------------------- */

body.project-home-mode #voiceQualityBanner,
body.project-home-mode #readerBar { display: none !important; }
body.splash-home #controls,
body.splash-home #mobileDrawer { display: none !important; }
body.project-home-mode #homeNextStep { display: none; }
body.project-home-mode #main { overflow: hidden; }

#projectHome {
  width: 100%;
  height: 100dvh;
  overflow: auto;
  overscroll-behavior: contain;
  background:
    radial-gradient(circle at 78% -10%, rgba(127, 180, 162, .075), transparent 34%),
    radial-gradient(circle at 8% 112%, rgba(224, 180, 88, .055), transparent 34%),
    var(--surface-0);
}

.projectHomeShell {
  position: relative;
  z-index: 1;
  width: min(1480px, 100%);
  min-height: 100%;
  margin: 0 auto;
  padding: clamp(30px, 4vw, 58px) clamp(28px, 4.2vw, 68px) 72px;
  box-sizing: border-box;
}

.projectHomeHero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 34px;
  margin-bottom: 26px;
}
.projectHomeIdentity > span,
.projectPanel header > div > span,
.projectWorkflowTitle > span,
.projectAttention > div > span {
  display: block;
  color: var(--accent2);
  font-size: 10px;
  font-weight: 820;
  letter-spacing: 1.45px;
  text-transform: uppercase;
}
.projectHomeIdentity h1 {
  max-width: 820px;
  margin: 7px 0 8px;
  overflow: hidden;
  color: #f5f3ee;
  font-size: clamp(34px, 4vw, 56px);
  font-weight: 720;
  letter-spacing: -2.35px;
  line-height: .98;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.projectHomeIdentity p { color: var(--dim); font-size: 13px; font-weight: 570; }
.projectHomeHeroActions { display: flex; align-items: stretch; gap: 9px; flex: none; }
.projectHomeCommentsButton,
.projectHomeContinue {
  min-height: 54px;
  border: 1px solid var(--line-strong);
  border-radius: 13px;
  background: rgba(255, 255, 255, .025);
  color: var(--text);
}
.projectHomeCommentsButton {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 16px;
  font-size: 11px;
  font-weight: 720;
}
.projectHomeCommentsButton b,
.projectPanel header > button b {
  display: inline-grid;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  place-items: center;
  border-radius: 99px;
  background: color-mix(in srgb, var(--accent) 16%, var(--surface-3));
  color: var(--accent);
  font-size: 9px;
}
.projectHomeContinue {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 25px;
  min-width: 228px;
  padding: 8px 10px 8px 15px;
  align-content: center;
  text-align: left;
  border-color: color-mix(in srgb, var(--accent) 42%, var(--line));
  background: linear-gradient(130deg, rgba(224, 180, 88, .14), rgba(224, 180, 88, .06));
}
.projectHomeContinue > span { font-size: 12px; font-weight: 780; }
.projectHomeContinue small { margin-top: 3px; color: var(--dim); font-size: 9.5px; }
.projectHomeContinue i {
  grid-column: 2;
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  color: var(--accent);
  font-size: 17px;
  font-style: normal;
}
.projectHomeCommentsButton:hover,
.projectHomeContinue:hover {
  border-color: color-mix(in srgb, var(--accent) 46%, var(--line));
  background-color: rgba(255, 255, 255, .045);
  transform: translateY(-1px);
}
.projectHomeContinue:hover i { transform: translateX(2px); }

.projectAttention {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  min-height: 78px;
  margin-bottom: 13px;
  padding: 13px 15px;
  align-items: center;
  gap: 13px;
  border: 1px solid color-mix(in srgb, var(--success) 26%, var(--line-soft));
  border-radius: 15px;
  background: color-mix(in srgb, var(--success) 5%, var(--surface-1));
}
.projectAttention.needsAttention {
  border-color: color-mix(in srgb, var(--accent) 31%, var(--line-soft));
  background: linear-gradient(120deg, rgba(224, 180, 88, .08), rgba(255, 255, 255, .018));
}
.projectAttentionMark {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border-radius: 12px;
  background: color-mix(in srgb, var(--success) 12%, var(--surface-2));
  color: var(--success);
  font-size: 17px;
  font-weight: 850;
}
.needsAttention .projectAttentionMark {
  background: color-mix(in srgb, var(--accent) 13%, var(--surface-2));
  color: var(--accent);
}
.projectAttention > div > b { display: block; margin-top: 3px; font-size: 13px; line-height: 1.2; }
.projectAttention p { margin-top: 4px; color: var(--dim); font-size: 10.5px; line-height: 1.4; }
.projectAttention > button,
.projectPanel header > button,
.projectPanelEmpty button {
  min-height: 32px;
  padding: 0 11px;
  border: 1px solid var(--line-strong);
  border-radius: 9px;
  background: rgba(255, 255, 255, .025);
  color: var(--text);
  font-size: 9.5px;
  font-weight: 720;
}
.projectAttention > button i { margin-left: 5px; color: var(--accent); font-style: normal; }
.projectAttention > button:hover,
.projectPanel header > button:hover,
.projectPanelEmpty button:hover {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--line));
  background: color-mix(in srgb, var(--accent) 7%, var(--surface-2));
}

.projectWorkflow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 11px;
  margin-bottom: 13px;
}
.projectWorkflowCard {
  position: relative;
  display: grid;
  min-height: 218px;
  padding: 20px;
  overflow: hidden;
  align-content: space-between;
  border: 1px solid var(--line-soft);
  border-radius: 17px;
  background:
    linear-gradient(150deg, rgba(255, 255, 255, .038), transparent 45%),
    var(--surface-1);
  color: var(--text);
  text-align: left;
  box-shadow: var(--card-shadow);
}
.projectWorkflowCard::after {
  content: '';
  position: absolute;
  right: -45px;
  bottom: -58px;
  width: 145px;
  height: 145px;
  border: 1px solid rgba(255, 255, 255, .04);
  border-radius: 50%;
  box-shadow: 0 0 0 28px rgba(255, 255, 255, .012);
}
.projectWorkflowCard.writer { --workflow-accent: var(--accent); }
.projectWorkflowCard.read { --workflow-accent: #9e91d7; }
.projectWorkflowCard.production { --workflow-accent: var(--accent2); }
.projectWorkflowCard:hover {
  border-color: color-mix(in srgb, var(--workflow-accent) 40%, var(--line));
  box-shadow: 0 19px 42px rgba(0, 0, 0, .2), inset 0 1px rgba(255, 255, 255, .035);
  transform: translateY(-3px);
}
.projectWorkflowStep {
  position: absolute;
  top: 18px;
  right: 18px;
  color: color-mix(in srgb, var(--workflow-accent) 62%, var(--dim));
  font-size: 9px;
  font-weight: 850;
  letter-spacing: 1px;
}
.projectWorkflowTitle h2 { margin: 5px 0 7px; font-size: 23px; letter-spacing: -.5px; }
.projectWorkflowTitle p { max-width: 290px; color: var(--dim); font-size: 11px; line-height: 1.5; }
.projectWorkflowFacts { display: flex; flex-wrap: wrap; gap: 6px; margin: 20px 0 15px; }
.projectWorkflowFacts span {
  padding: 5px 7px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: rgba(255, 255, 255, .02);
  color: var(--dim);
  font-size: 9px;
}
.projectWorkflowFacts b { color: var(--text); font-size: 10px; }
.projectWorkflowCard > i {
  position: relative;
  z-index: 1;
  color: var(--workflow-accent);
  font-size: 10px;
  font-style: normal;
  font-weight: 750;
}

.projectBoard {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(390px, .82fr);
  gap: 13px;
  align-items: start;
}
.projectBoardSide { display: grid; gap: 13px; }
.projectPanel {
  overflow: hidden;
  border: 1px solid var(--line-soft);
  border-radius: 17px;
  background: var(--surface-1);
  box-shadow: var(--card-shadow);
}
.projectPanel > header {
  display: flex;
  min-height: 65px;
  padding: 13px 15px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--line-soft);
}
.projectPanel header h2 { margin-top: 3px; font-size: 14px; letter-spacing: -.1px; }
.projectPanel header > button { display: flex; align-items: center; gap: 6px; }
.projectProgressStrip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-bottom: 1px solid var(--line-soft);
}
.projectProgressStrip span {
  display: grid;
  min-height: 76px;
  padding: 13px 15px;
  align-content: center;
  border-right: 1px solid var(--line-soft);
}
.projectProgressStrip span:last-child { border-right: 0; }
.projectProgressStrip b { font-size: 18px; font-variant-numeric: tabular-nums; }
.projectProgressStrip small { margin-top: 4px; color: var(--dim); font-size: 9px; }
.projectCheckList { display: grid; }
.projectCheckRow {
  display: grid;
  grid-template-columns: 94px minmax(0, 1fr) 18px;
  min-height: 69px;
  padding: 11px 14px;
  align-items: center;
  gap: 11px;
  border: 0;
  border-bottom: 1px solid var(--line-soft);
  border-radius: 0;
  background: transparent;
  color: var(--text);
  text-align: left;
}
.projectCheckRow:last-child { border-bottom: 0; }
.projectCheckRow:hover { background: rgba(255, 255, 255, .025); }
.projectCheckCategory {
  width: fit-content;
  padding: 4px 6px;
  border-radius: 7px;
  background: color-mix(in srgb, var(--accent) 10%, var(--surface-2));
  color: var(--accent);
  font-size: 8px;
  font-weight: 780;
  text-transform: uppercase;
}
.projectCheckRow b { display: block; overflow: hidden; font-size: 11px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.projectCheckRow small { display: block; margin-top: 4px; overflow: hidden; color: var(--dim); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.projectCheckRow > i,
.projectShootDay > i { color: var(--dim); font-size: 18px; font-style: normal; text-align: right; }
.projectCheckRow:hover > i,
.projectShootDay:hover > i { color: var(--accent); transform: translateX(2px); }

.projectPanelClear {
  display: flex;
  min-height: 92px;
  padding: 19px;
  align-items: center;
  gap: 12px;
}
.projectPanelClear.compact { min-height: 68px; padding: 14px 15px; }
.projectPanelClear > span {
  display: grid;
  width: 34px;
  height: 34px;
  flex: none;
  place-items: center;
  border-radius: 11px;
  background: color-mix(in srgb, var(--success) 12%, var(--surface-2));
  color: var(--success);
  font-weight: 850;
}
.projectPanelClear b { display: block; font-size: 11px; }
.projectPanelClear p,
.projectPanelEmpty p { margin-top: 4px; color: var(--dim); font-size: 9.5px; line-height: 1.45; }
.projectPanelEmpty { padding: 17px; }
.projectPanelEmpty b { font-size: 11px; }
.projectPanelEmpty button { margin-top: 11px; }

.projectShootDays { display: grid; }
.projectShootDay {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto 14px;
  min-height: 60px;
  padding: 9px 13px;
  align-items: center;
  gap: 10px;
  border: 0;
  border-bottom: 1px solid var(--line-soft);
  border-radius: 0;
  background: transparent;
  color: var(--text);
  text-align: left;
}
.projectShootDay:last-child { border-bottom: 0; }
.projectShootDay:hover { background: rgba(255, 255, 255, .025); }
.projectShootDayNumber {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: var(--surface-2);
  color: var(--accent);
  font-size: 11px;
  font-weight: 820;
}
.projectShootDayCopy b { display: block; font-size: 10.5px; }
.projectShootDayCopy small { display: block; margin-top: 4px; color: var(--dim); font-size: 8.75px; }
.projectShootDayState {
  padding: 4px 6px;
  border-radius: 7px;
  background: color-mix(in srgb, var(--danger) 9%, var(--surface-2));
  color: #d99a94;
  font-size: 7.5px;
  font-weight: 780;
  text-transform: uppercase;
}
.projectShootDayState.review { background: rgba(224, 180, 88, .1); color: var(--accent); }
.projectShootDayState.ready { background: rgba(127, 180, 162, .11); color: var(--success); }

.projectDirectoryFacts { display: grid; grid-template-columns: repeat(3, 1fr); }
.projectDirectoryFacts span {
  min-height: 68px;
  padding: 12px 13px;
  border-right: 1px solid var(--line-soft);
}
.projectDirectoryFacts span:last-child { border-right: 0; }
.projectDirectoryFacts b { display: block; font-size: 15px; }
.projectDirectoryFacts small { display: block; margin-top: 4px; color: var(--dim); font-size: 8.5px; line-height: 1.25; }
.projectDirectoryPanel > p { margin: 0; padding: 12px 14px; border-top: 1px solid var(--line-soft); color: var(--dim); font-size: 9.5px; line-height: 1.5; }

.projectCommentList { display: grid; }
.projectCommentRow {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  min-height: 59px;
  padding: 9px 13px;
  align-items: center;
  gap: 9px;
  border: 0;
  border-bottom: 1px solid var(--line-soft);
  border-radius: 0;
  background: transparent;
  color: var(--text);
  text-align: left;
}
.projectCommentRow:last-child { border-bottom: 0; }
.projectCommentRow:hover { background: rgba(255, 255, 255, .025); }
.projectCommentAvatar {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 10px;
  background: color-mix(in srgb, var(--accent2) 13%, var(--surface-2));
  color: var(--accent2);
  font-size: 10px;
  font-weight: 830;
}
.projectCommentRow span:nth-child(2) { min-width: 0; }
.projectCommentRow b { display: block; overflow: hidden; font-size: 10px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.projectCommentRow small { display: block; margin-top: 4px; overflow: hidden; color: var(--dim); font-size: 8.5px; text-overflow: ellipsis; white-space: nowrap; }
.projectCommentRow > i { color: var(--dim); font-size: 7.5px; font-style: normal; font-weight: 770; text-transform: uppercase; }
.projectCommentRow > i.high,
.projectCommentRow > i.urgent { color: #d99a94; }

/* Visual references live directly on shots; Contact Sheet is a view of those
   same records, not a second disconnected workflow. */
.orderToolsActions { display: flex; align-items: center; gap: 7px; }
.contactSheetButton { display: inline-flex; align-items: center; gap: 7px; }
.contactSheetButton span {
  display: inline-grid;
  min-width: 26px;
  height: 19px;
  padding: 0 5px;
  place-items: center;
  border-radius: 7px;
  background: rgba(127, 180, 162, .11);
  color: var(--accent2);
  font-size: 8px;
}
.shotPrimary {
  grid-template-columns: 36px 58px 106px minmax(120px, 1fr) minmax(120px, .8fr) auto;
}
.shotDragHandle {
  display: grid;
  width: 34px;
  height: 38px;
  padding: 4px 3px;
  place-items: center;
  align-content: center;
  gap: 3px;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  background: var(--surface-0);
  color: var(--dim);
  cursor: grab;
}
.shotDragHandle > span {
  width: 13px;
  height: 6px;
  background: radial-gradient(circle, currentColor 1.25px, transparent 1.5px) 0 0 / 6px 6px;
  opacity: .72;
}
.shotDragHandle > b { color: var(--text); font-size: 11px; font-weight: 780; line-height: 1; }
.shotDragHandle:hover,
.shotDragHandle:focus-visible {
  border-color: color-mix(in srgb, var(--accent2) 46%, var(--line));
  background: color-mix(in srgb, var(--accent2) 8%, var(--surface-1));
  color: var(--accent2);
}
.shotDragHandle:active { cursor: grabbing; }
.shotList.isDragging .shotRow:not(.dragging) { transition: transform .18s var(--ease), border-color .18s var(--ease); }
.shotRow.dropBefore { box-shadow: 0 -3px 0 var(--accent2); }
.shotRow.dropAfter { box-shadow: 0 3px 0 var(--accent2); }
.shotReference {
  position: relative;
  width: 58px;
  height: 39px;
}
.shotReference label,
.shotReference label > span {
  display: block;
  width: 100%;
  height: 100%;
}
.shotReference label > span {
  display: grid;
  overflow: hidden;
  place-items: center;
  border: 1px dashed var(--line-strong);
  border-radius: 8px;
  background: var(--surface-0);
  color: var(--dim);
  cursor: pointer;
}
.shotReference label:hover > span { border-color: var(--accent2); color: var(--accent2); }
.shotReference img { display: block; width: 100%; height: 100%; object-fit: cover; }
.shotReference i { margin-bottom: -5px; font-size: 14px; font-style: normal; line-height: 1; }
.shotReference small { font-size: 6.5px; font-weight: 760; letter-spacing: .2px; text-transform: uppercase; }
.shotReference.hasReference label > span { border-style: solid; border-color: var(--line-strong); }
.shotReference > button {
  position: absolute;
  top: -5px;
  right: -5px;
  display: grid;
  width: 17px;
  height: 17px;
  padding: 0;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: var(--surface-3);
  color: var(--text);
  font-size: 10px;
  line-height: 1;
  box-shadow: 0 3px 9px rgba(0, 0, 0, .3);
}
.shotReference > button:hover { border-color: var(--danger); color: #d99a94; }
.shotTechnical { margin-left: 82px; }

.contactSheetDialog { width: min(1180px, calc(100vw - 36px)); }
.contactSheetBody { max-height: min(72vh, 790px); }
.contactSheetSummary {
  display: grid;
  grid-template-columns: 108px 108px minmax(0, 1fr);
  margin-bottom: 13px;
  border: 1px solid var(--line-soft);
  border-radius: 13px;
  background: var(--surface-1);
}
.contactSheetSummary > div { min-height: 67px; padding: 12px 14px; border-right: 1px solid var(--line-soft); }
.contactSheetSummary b { display: block; font-size: 17px; }
.contactSheetSummary span { display: block; margin-top: 3px; color: var(--dim); font-size: 8.5px; }
.contactSheetSummary p { align-self: center; padding: 13px 15px; color: var(--dim); font-size: 10px; line-height: 1.5; }
.contactSheetGrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.contactSheetCard {
  overflow: hidden;
  border: 1px solid var(--line-soft);
  border-radius: 13px;
  background: var(--surface-1);
}
.contactSheetImage {
  display: grid;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  place-items: center;
  align-content: center;
  gap: 4px;
  border-bottom: 1px solid var(--line-soft);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .025) 25%, transparent 25%) 0 0 / 18px 18px,
    linear-gradient(315deg, rgba(255, 255, 255, .018) 25%, transparent 25%) 0 0 / 18px 18px,
    var(--surface-0);
  color: var(--dim);
}
.contactSheetImage img { display: block; width: 100%; height: 100%; object-fit: cover; }
.contactSheetImage > span { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid var(--line-strong); border-radius: 10px; font-size: 11px; }
.contactSheetImage > small { font-size: 8px; }
.contactSheetCopy { min-height: 104px; padding: 11px 12px 13px; }
.contactSheetCopy > span { display: block; overflow: hidden; color: var(--accent2); font-size: 7.5px; font-weight: 780; letter-spacing: .55px; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.contactSheetCopy > b { display: block; margin-top: 5px; overflow: hidden; font-size: 10.5px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.contactSheetCopy > p { display: -webkit-box; margin-top: 5px; overflow: hidden; color: var(--dim); font-size: 9px; line-height: 1.42; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.contactSheetCopy > small { display: block; margin-top: 7px; overflow: hidden; color: color-mix(in srgb, var(--dim) 74%, transparent); font-size: 7.5px; text-overflow: ellipsis; white-space: nowrap; }
.contactSheetEmpty { grid-column: 1 / -1; display: grid; min-height: 280px; place-items: center; align-content: center; gap: 7px; border: 1px dashed var(--line-strong); border-radius: 15px; color: var(--dim); text-align: center; }
.contactSheetEmpty > span { font-size: 28px; }
.contactSheetEmpty b { color: var(--text); font-size: 12px; }
.contactSheetEmpty p { max-width: 340px; font-size: 10px; line-height: 1.5; }

@media (max-width: 700px) {
  .testPreviewBadge { right: 8px; bottom: 8px; font-size: 8px; }
  .projectShareButton { min-height: 50px; }
  .orderToolsCopy > span { font-size: 11px; }
  .sceneCardTitle { font-size: 14px; }
  .orderBadge { min-width: 34px; height: 36px; }
  .projectHomeShell { padding: 26px 16px 56px; }
  .projectHomeHero { align-items: stretch; flex-direction: column; gap: 18px; }
  .projectHomeIdentity h1 { font-size: 34px; }
  .projectHomeHeroActions { display: grid; grid-template-columns: 1fr 1.5fr; }
  .projectHomeContinue { min-width: 0; }
  .projectAttention { grid-template-columns: 36px minmax(0, 1fr); }
  .projectAttention > button { grid-column: 1 / -1; }
  .projectWorkflow,
  .projectBoard { grid-template-columns: 1fr; }
  .projectWorkflowCard { min-height: 195px; }
  .projectBoard { display: grid; }
  .projectCheckRow { grid-template-columns: 80px minmax(0, 1fr) 14px; }
  .projectDirectoryFacts { grid-template-columns: 1fr; }
  .projectDirectoryFacts span { min-height: 54px; border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .projectDirectoryFacts span:last-child { border-bottom: 0; }
  .orderTools { align-items: stretch; flex-direction: column; gap: 10px; }
  .orderToolsActions { display: grid; grid-template-columns: 1fr 1fr; }
  .shotPrimary { grid-template-columns: 38px 58px minmax(0, 1fr) auto; }
  .shotPrimary > select { grid-column: 3; }
  .shotPrimary > input[data-shot-field="subject"],
  .shotPrimary > input[data-shot-field="note"] { grid-column: 1 / -1; }
  .shotPrimary > .shotBtns { grid-column: 4; grid-row: 1; }
  .shotTechnical { margin-left: 0; }
  .contactSheetGrid { grid-template-columns: 1fr; }
  .contactSheetSummary { grid-template-columns: 1fr 1fr; }
  .contactSheetSummary p { grid-column: 1 / -1; border-top: 1px solid var(--line-soft); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}

/* -------------------------------------------------------------------------
   Productivity and legibility pass

   The product previously used 8–10px labels in high-frequency production
   workflows. This establishes a readable floor without turning metadata into
   a competing headline, and keeps the project state quiet unless it needs
   attention.
   ------------------------------------------------------------------------- */

body { font-size: 14px; }

.workspaceLabel,
.productionNavLabel { font-size: 12px; }
#workspaceDock #toolsBtn,
#workspaceDock #brandHome,
#workspaceDock #writerBtn { min-height: 38px; }

.projectShareButton { min-height: 52px; padding: 7px 10px; }
.projectShareButton b { font-size: 12.5px; }
.projectShareButton small { font-size: 10.5px; line-height: 1.2; }
.workspacePrivacyFooter .homeDrawerPrivacy { font-size: 10.5px; }
.workspacePrivacyFooter .homeDrawerPrivacy.save-ok { display: none; }

.writerDetails summary { font-size: 12.5px; }
.workspaceSceneNavItem b { font-size: 12px; }
.workspaceSceneNavItem small { font-size: 10.5px; }
.projectNextStepCopy b { font-size: 12.5px; }
.projectNextStepCopy small { font-size: 10.5px; line-height: 1.4; }
.projectNextStep button { font-size: 11px; }

.productionSideIntro p,
.productionSideEmpty { font-size: 12px; line-height: 1.5; }
.productionSideCardHead small,
.productionSideDisclosure > summary em { font-size: 10.5px; }
.productionInlineCommentMain b { font-size: 12px; line-height: 1.4; }
.productionInlineCommentMain small { font-size: 10.5px; line-height: 1.35; }
.productionInlineCommentActions button,
.productionAddComment { min-height: 34px; font-size: 10.5px; }

.orderTools { min-height: 70px; padding: 15px 17px; }
.orderToolsCopy b { font-size: 16px; }
.orderToolsCopy > span { font-size: 13px; line-height: 1.4; }
.insUtilityButton { min-height: 42px; font-size: 12px; }
.contactSheetButton span { font-size: 9.5px; }

.orderBadge { min-width: 38px; height: 42px; font-size: 13px; }
.orderBadge::before { font-size: 7.5px; }
.sceneTag,
.sceneMetaChip,
.ie { min-height: 22px; font-size: 11.5px; }
.sceneCardTitle { font-size: 17px; }
.sceneCardCast { font-size: 13px; line-height: 1.35; }
.sceneCardSummaryCounts i { padding: 4px 8px; font-size: 10.5px; }
.sceneCardActions button { min-width: 40px; min-height: 40px; }

.sceneFacts,
.sceneNotes p { font-size: 12px; line-height: 1.5; }
.sceneFacts b,
.sceneNotes > b { font-size: 11px; }
.sceneNotes p > span { font-size: 10px; }
.intentField { min-height: 42px; font-size: 12.5px; }
.sceneRequirements header b,
.shotHead > b { font-size: 13px; }
.sceneRequirements header span { font-size: 11px; line-height: 1.4; }
.sceneRequirements header em { font-size: 10.5px; }
.requirementRow input,
.requirementRow select,
.requirementAdd input,
.requirementAdd select { min-height: 40px; font-size: 12px; }
.requirementAdd button,
.shotHeadBtns button { min-height: 40px; font-size: 11.5px; }

.shotRow.rich { padding: 10px; }
.shotPrimary { gap: 8px; }
.shotPrimary input,
.shotPrimary select { min-height: 40px; font-size: 12px; }
.shotBtns button { min-width: 38px; min-height: 40px; font-size: 13px; }
.shotTechnical summary { min-height: 38px; font-size: 11.5px; }
.shotTechnical label { font-size: 11px; }
.shotTechnical input { font-size: 12px; }

.projectHomeIdentity > span,
.projectPanel header > div > span,
.projectWorkflowTitle > span,
.projectAttention > div > span { font-size: 10.5px; }
.projectHomeIdentity p { font-size: 14px; }
.projectHomeCommentsButton,
.projectHomeContinue { min-height: 58px; }
.projectHomeCommentsButton b,
.projectHomeContinue > span { font-size: 13px; }
.projectHomeContinue small { font-size: 10.5px; }
.projectAttention b { font-size: 13px; }
.projectAttention p { font-size: 11.5px; }
.projectAttention > button,
.projectPanel header > button,
.projectPanelEmpty button { min-height: 38px; font-size: 11px; }
.projectWorkflowTitle p { font-size: 12.5px; line-height: 1.55; }
.projectWorkflowFacts span { font-size: 10.5px; }
.projectWorkflowFacts b { font-size: 11.5px; }
.projectWorkflowCard > i { font-size: 11.5px; }
.projectCheckRow b { font-size: 12.5px; }
.projectCheckRow small { font-size: 10.5px; }
.projectCheckCategory { font-size: 9px; }
.projectProgressStrip small { font-size: 10px; }
.projectShootDayCopy b { font-size: 12px; }
.projectShootDayCopy small { font-size: 10px; }
.projectShootDayState { font-size: 8.5px; }
.projectDirectoryFacts small,
.projectDirectoryPanel > p { font-size: 10.5px; }
.projectCommentRow b { font-size: 12px; }
.projectCommentRow small { font-size: 10px; }
.projectCommentRow > i { font-size: 9px; }

.writerFormatRail button { min-width: 60px; font-size: 10px; }
.writerFormatRail button svg { width: 24px; height: 22px; }
.writerViewControls button { font-size: 9.5px; }

.note-row p,
.noteItemCopy b { font-size: 12px; line-height: 1.45; }
.voice-row strong,
.castName { font-size: 12px; }
.voice-row span,
.castMeta { font-size: 10.5px; }
.option-row { font-size: 12px; }
.appUtilityAbout { min-height: 34px; padding-inline: 12px; font-size: 11px; }

.contactSheetSummary span { font-size: 10px; }
.contactSheetSummary p { font-size: 12px; }
.contactSheetCopy > span { font-size: 9px; }
.contactSheetCopy > b { font-size: 12px; }
.contactSheetCopy > p { font-size: 10.5px; }
.contactSheetCopy > small { font-size: 9.5px; }

body.splash-home #voiceQualityBanner,
body.writer-mode #voiceQualityBanner,
body.production-mode #voiceQualityBanner,
body.project-home-mode #voiceQualityBanner { display: none !important; }

@media screen and (max-width: 1100px),
       screen and (hover: none) and (pointer: coarse) {
  #desktopOnlyGate { display: none !important; }
  body.project-home-mode #sidebar {
    height: var(--mobile-header-h);
    background: transparent;
    box-shadow: none;
  }
  html:has(body.project-home-mode),
  body.project-home-mode { height: auto; min-height: 100%; overflow: auto; }
  body.project-home-mode #main {
    position: relative;
    z-index: 0;
    height: auto;
    min-height: calc(100dvh - 102px);
    overflow: visible;
  }
  body.project-home-mode #projectHome {
    position: relative;
    z-index: 2;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto;
    min-height: calc(100dvh - 102px);
    overflow: visible;
  }
  body.project-home-mode #projectHomeContent,
  body.project-home-mode .projectHomeShell {
    position: relative;
    z-index: 3;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: translateZ(0);
    backface-visibility: visible;
  }
}

@media (max-width: 700px) {
  .testPreviewBadge { display: none; }
  body.production-mode .orderTools { display: grid; grid-template-columns: minmax(0, 1fr); }
  body.production-mode .orderToolsCopy { min-width: 0; width: 100%; }
  body.production-mode .orderToolsActions { width: 100%; }
  .projectHomeIdentity h1 { font-size: 36px; }
  .projectWorkflowTitle p { font-size: 13px; }
  .projectCheckRow { min-height: 76px; }
  .productionSceneHead { padding-block: 15px; }
  .sceneCardTitle { font-size: 16px; }
  .sceneCardCast { font-size: 12px; }
  .shotPrimary { gap: 9px; }
  .shotPrimary input,
  .shotPrimary select { min-height: 44px; font-size: 13px; }
  .shotDragHandle { width: 38px; height: 44px; }
  .shotBtns button { min-width: 42px; min-height: 44px; }
}

@media (max-width: 420px) {
  #productionMobileTabs button { gap: 0; padding-inline: 2px; font-size: 9.25px; }
  #productionMobileTabs button svg { display: none; }
}

@media print {
  .testPreviewBadge,
  .projectShareButton { display: none !important; }
  #printArea .printContactSheet { color: #111; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
  #printArea .printContactSheet > header { margin-bottom: 10px; padding-bottom: 8px; border-bottom: 2px solid #111; }
  #printArea .printContactSheet > header > span { font-size: 7px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; }
  #printArea .printContactSheet > header h1 { margin: 2px 0 3px; font-size: 20px; }
  #printArea .printContactSheet > header p { margin: 0; color: #555; font-size: 8px; }
  #printArea .printContactGrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
  #printArea .printContactCard { overflow: hidden; break-inside: avoid; page-break-inside: avoid; border: 1px solid #bbb; border-radius: 5px; }
  #printArea .printContactImage { display: grid; aspect-ratio: 16 / 9; overflow: hidden; place-items: center; align-content: center; gap: 3px; background: #f0f0f0; color: #777; }
  #printArea .printContactImage img { display: block; width: 100%; height: 100%; object-fit: cover; }
  #printArea .printContactImage > span { font-size: 13px; font-weight: 700; }
  #printArea .printContactImage > small { font-size: 6px; }
  #printArea .printContactCopy { min-height: 57px; padding: 6px; }
  #printArea .printContactCopy > span { display: block; color: #555; font-size: 5.8px; font-weight: 800; text-transform: uppercase; }
  #printArea .printContactCopy > b { display: block; margin-top: 3px; font-size: 7.5px; line-height: 1.2; }
  #printArea .printContactCopy > p { margin: 3px 0 0; font-size: 6.7px; line-height: 1.25; }
  #printArea .printContactCopy > small { display: block; margin-top: 4px; color: #666; font-size: 5.8px; }
}

/* -------------------------------------------------------------------------
   Operational workflow layer — one calm place for the work that matters.
   ------------------------------------------------------------------------- */

#productionDrawer .productionSideTabs {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.brandHomeCue {
  display: none;
}

.projectShareButton.hasUnpublishedChanges {
  border-color: color-mix(in srgb, var(--accent) 48%, var(--line));
  background: color-mix(in srgb, var(--accent) 10%, var(--surface-1));
}
.projectShareButton.hasUnpublishedChanges > svg { stroke: var(--accent); }
.projectShareButton.hasUnpublishedChanges::after {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 10%, transparent);
}
.projectShareButton.hasUnpublishedChanges > i { display: none; }
.projectShareButton.hasShareConflict {
  border-color: rgba(225, 112, 112, .5);
  background: rgba(225, 112, 112, .08);
}

#shareDialog.hasSharedLink .shareSettings,
#shareDialog.hasSharedLink .shareCreateRow { display: none; }
#shareDialog.hasSharedLink .sharePrivacyHero { margin-bottom: 14px; }
.shareSyncStatus {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  margin: 13px 0;
  padding: 13px 14px;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: var(--surface-1);
}
.shareSyncDot {
  width: 8px;
  height: 8px;
  margin-top: 4px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--success) 11%, transparent);
}
.shareSyncStatus.dirty .shareSyncDot { background: var(--accent); box-shadow: 0 0 0 4px rgba(224,180,88,.11); }
.shareSyncStatus.conflict .shareSyncDot { background: #e17070; box-shadow: 0 0 0 4px rgba(225,112,112,.12); }
.shareSyncStatus b { display: block; font-size: 12px; }
.shareSyncStatus small { display: block; margin-top: 4px; color: var(--dim); font-size: 10px; line-height: 1.45; }
.shareActivity {
  margin-top: 15px;
  padding-top: 14px;
  border-top: 1px solid var(--line-soft);
}
.shareActivity > span {
  display: block;
  margin-bottom: 7px;
  color: var(--dim);
  font-size: 8px;
  font-weight: 820;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.shareActivity p { display: flex; justify-content: space-between; gap: 14px; margin: 0; padding: 8px 0; border-top: 1px solid rgba(255,255,255,.045); }
.shareActivity b { font-size: 10.5px; }
.shareActivity small { color: var(--dim); font-size: 9px; text-align: right; }

/* Today — optimized for the AD/UPM glance, then for action. */
.todayEmpty {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  max-width: 760px;
  min-height: 210px;
  margin: 60px auto;
  padding: 28px;
  border: 1px solid var(--line-soft);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(127,180,162,.08), var(--surface-1));
}
.todayEmpty > span { display: grid; width: 58px; height: 58px; place-items: center; border-radius: 17px; background: rgba(127,180,162,.12); color: var(--accent2); font-size: 28px; }
.todayEmpty b { font-size: 18px; }
.todayEmpty p { max-width: 590px; margin: 7px 0 15px; color: var(--dim); font-size: 12px; line-height: 1.55; }
.todayEmpty button,
.todayCommandBar button,
.todayHeader select {
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface-2);
  color: var(--text);
  font-size: 10.5px;
  font-weight: 760;
}
.todayEmpty button { padding: 0 14px; border-color: rgba(127,180,162,.32); color: var(--accent2); }
.todayHeader { display: flex; justify-content: space-between; gap: 24px; align-items: end; margin: 3px 0 15px; }
.todayHeader > div > span { color: var(--accent2); font-size: 9px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.todayHeader h2 { margin: 4px 0 3px; font-size: clamp(24px, 3vw, 36px); letter-spacing: -.035em; line-height: 1; }
.todayHeader p { margin: 0; color: var(--dim); font-size: 11px; }
.todayHeader label { display: grid; gap: 5px; min-width: 170px; color: var(--dim); font-size: 8px; font-weight: 820; letter-spacing: .08em; text-transform: uppercase; }
.todayHeader select { width: 100%; padding: 0 10px; text-transform: none; }
.todayStatusGrid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  overflow: hidden;
  margin-bottom: 10px;
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  background: var(--surface-1);
}
.todayStatusGrid > span { min-width: 0; min-height: 72px; padding: 14px; border-left: 1px solid var(--line-soft); }
.todayStatusGrid > span:first-child { border-left: 0; }
.todayStatusGrid small { display: block; margin-bottom: 7px; color: var(--dim); font-size: 8px; font-weight: 780; letter-spacing: .075em; text-transform: uppercase; }
.todayStatusGrid b { display: block; overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.todayCommandBar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  margin-bottom: 14px;
  padding: 9px;
  border: 1px solid var(--line-soft);
  border-radius: 13px;
  background: var(--surface-1);
}
.todayCommandBar > span { display: grid; min-height: 40px; align-content: center; padding: 0 10px; border-left: 3px solid var(--success); }
.todayCommandBar > span.attention { border-left-color: var(--accent); }
.todayCommandBar b { font-size: 11.5px; }
.todayCommandBar small { margin-top: 3px; color: var(--dim); font-size: 9px; }
.todayCommandBar button { padding: 0 13px; }
.todayCommandBar button:first-of-type { border-color: rgba(224,180,88,.32); background: rgba(224,180,88,.1); color: var(--accent); }
.todaySection { overflow: hidden; margin: 10px 0; border: 1px solid var(--line-soft); border-radius: 15px; background: var(--surface-1); box-shadow: var(--card-shadow); }
.todaySection > header { display: flex; min-height: 48px; align-items: center; justify-content: space-between; padding: 0 15px; border-bottom: 1px solid var(--line-soft); }
.todaySection > header > span { font-size: 12px; font-weight: 790; }
.todaySection > header > b { color: var(--dim); font-size: 9px; font-weight: 760; }
.todayTimeline { padding: 5px; }
.todayScene,
.todayBlockers button {
  display: grid;
  width: 100%;
  min-height: 58px;
  border: 0;
  border-top: 1px solid rgba(255,255,255,.04);
  background: transparent;
  color: var(--text);
  text-align: left;
}
.todayScene:first-child,
.todayBlockers button:first-child { border-top: 0; }
.todayScene { grid-template-columns: 78px minmax(0, 1fr) 22px; gap: 10px; align-items: center; padding: 8px 10px; }
.todayScene:hover,
.todayBlockers button:hover { background: rgba(255,255,255,.03); }
.todayScene > span:first-child { color: var(--accent); font-size: 10px; font-weight: 820; font-variant-numeric: tabular-nums; }
.todayScene b,
.todayBlockers b { display: block; font-size: 11px; }
.todayScene small,
.todayBlockers small { display: block; margin-top: 4px; color: var(--dim); font-size: 9px; line-height: 1.35; }
.todayScene i,
.todayBlockers i { color: var(--dim); font-size: 18px; font-style: normal; text-align: center; }
.todayBlockers > div { padding: 5px; }
.todayBlockers button { grid-template-columns: 30px minmax(0, 1fr) 22px; gap: 9px; align-items: center; padding: 8px 10px; }
.todayBlockers button > span:first-child { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 8px; background: rgba(224,180,88,.1); color: var(--accent); font-size: 11px; font-weight: 900; }
.todaySplit { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: 10px; }
.todayLocationGrid,
.todayContactGrid { display: grid; gap: 7px; padding: 9px; }
.todayLocation { min-height: 112px; padding: 12px; border: 1px solid var(--line-soft); border-radius: 11px; background: var(--surface-0); }
.todayLocation > span,
.todayContact > span { display: block; color: var(--accent2); font-size: 8px; font-weight: 820; letter-spacing: .07em; text-transform: uppercase; }
.todayLocation > b { display: block; margin-top: 5px; font-size: 12px; }
.todayLocation p { margin: 5px 0 3px; font-size: 10px; }
.todayLocation small { color: var(--dim); font-size: 9px; line-height: 1.35; }
.todayLocation div { display: flex; gap: 6px; margin-top: 9px; }
.todayLocation a,
.todayContact a,
.directoryQuickActions a { color: var(--accent2); font-size: 9px; font-weight: 780; text-decoration: none; }
.todayContactGrid { grid-template-columns: 1fr 1fr; }
.todayContact { position: relative; min-height: 72px; padding: 11px; border: 1px solid var(--line-soft); border-radius: 10px; background: var(--surface-0); }
.todayContact > b { display: block; margin-top: 5px; font-size: 10.5px; }
.todayContact > small { display: block; margin-top: 3px; overflow: hidden; color: var(--dim); font-size: 8.5px; text-overflow: ellipsis; white-space: nowrap; }
.todayContact > a { position: absolute; right: 10px; bottom: 10px; }
.todayNoData { padding: 22px; color: var(--dim); font-size: 10px; text-align: center; }

/* Shot list — numbers identify shots; scene and subject stay visually primary. */
.shotWorkspaceToolbar {
  position: sticky;
  z-index: 8;
  top: 0;
  display: grid;
  grid-template-columns: minmax(230px, 1fr) 150px auto auto auto;
  gap: 7px;
  align-items: center;
  margin: -6px 0 10px;
  padding: 8px;
  border: 1px solid var(--line-soft);
  border-radius: 13px;
  background: color-mix(in srgb, var(--surface-0) 92%, transparent);
  box-shadow: 0 12px 30px rgba(0,0,0,.16);
  backdrop-filter: blur(18px);
}
.shotSearch { position: relative; display: block; }
.shotSearch > span { position: absolute; top: 50%; left: 12px; color: var(--dim); font-size: 16px; transform: translateY(-50%); pointer-events: none; }
.shotSearch input,
.shotStatusFilter select,
.shotWorkspaceToolbar button {
  width: 100%;
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface-1);
  color: var(--text);
  font-size: 10px;
}
.shotSearch input { padding: 0 11px 0 34px; }
.shotStatusFilter { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 7px; align-items: center; }
.shotStatusFilter > span { color: var(--dim); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.shotStatusFilter select { padding: 0 9px; }
.shotDensity { display: grid; grid-template-columns: 1fr 1fr; padding: 2px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-1); }
.shotDensity button { min-width: 72px; min-height: 30px; border: 0; background: transparent; color: var(--dim); }
.shotDensity button.active { background: var(--surface-3); color: var(--text); box-shadow: inset 0 1px rgba(255,255,255,.04); }
.shotCollapseAll { padding: 0 11px; font-weight: 760; white-space: nowrap; }
.shotFilterCount { color: var(--dim); font-size: 9px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.productionSceneCard[hidden] { display: none; }
.productionSceneCard.sceneBlocked { border-color: rgba(224,180,88,.25); }
.productionSceneCard.sceneBlocked .sceneStatusButton { border-color: rgba(224,180,88,.42); background: rgba(224,180,88,.09); color: var(--accent); }
body.production-mode #iBody[data-shot-density="compact"] .productionSceneHead { padding-block: 9px; }
body.production-mode #iBody[data-shot-density="compact"] .sceneCardSummaryCounts { margin-top: 4px; }
body.production-mode #iBody[data-shot-density="compact"] .sceneCardCast { margin-top: 2px; }
@media (min-width: 901px) and (pointer: fine) {
  .productionSceneCard:not(:hover):not(:focus-within) .orderBtns,
  .shotRow:not(:hover):not(:focus-within) .shotBtns { opacity: .18; }
}

/* Call-sheet distribution — draft, issue, distribute, acknowledge. */
.callDistribution {
  overflow: hidden;
  margin: 0 0 13px;
  border: 1px solid color-mix(in srgb, var(--accent2) 20%, var(--line-soft));
  border-radius: 15px;
  background: linear-gradient(145deg, rgba(127,180,162,.055), var(--surface-1) 46%);
  box-shadow: var(--card-shadow);
}
.callDistribution > header { display: flex; justify-content: space-between; gap: 16px; align-items: start; padding: 15px 16px 13px; border-bottom: 1px solid var(--line-soft); }
.callDistribution > header span:first-child { display: block; margin-bottom: 5px; color: var(--accent2); font-size: 8px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.callDistribution h3 { margin: 0; font-size: 15px; }
.callDistribution header p { margin: 5px 0 0; color: var(--dim); font-size: 9px; }
.callVersionBadge { flex: none; padding: 7px 9px; border: 1px solid; border-radius: 999px; font-size: 8px; font-weight: 850; letter-spacing: .06em; }
.callVersionBadge.draft { border-color: var(--line); color: var(--dim); }
.callVersionBadge.current { border-color: rgba(127,180,162,.36); background: rgba(127,180,162,.09); color: var(--accent2); }
.callVersionBadge.outdated { border-color: rgba(224,180,88,.38); background: rgba(224,180,88,.08); color: var(--accent); }
.distributionActions { display: flex; flex-wrap: wrap; gap: 7px; padding: 10px 12px 0; }
.distributionActions button,
.distributionComposer button,
.distributionRecipient button {
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface-2);
  color: var(--text);
  font-size: 9.5px;
  font-weight: 760;
}
.distributionActions button.primary { border-color: rgba(127,180,162,.34); background: rgba(127,180,162,.1); color: var(--accent2); }
.distributionComposer { display: grid; grid-template-columns: 1fr .75fr 1fr auto; gap: 6px; padding: 10px 12px; }
.distributionComposer input { min-width: 0; min-height: 36px; padding: 0 9px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-0); color: var(--text); font-size: 10px; }
.distributionList { display: grid; gap: 5px; padding: 0 12px 12px; }
.distributionRecipient { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto 34px; gap: 9px; align-items: center; min-height: 49px; padding: 6px 7px; border: 1px solid var(--line-soft); border-radius: 10px; background: rgba(0,0,0,.09); }
.distributionAvatar { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 9px; background: rgba(127,180,162,.1); color: var(--accent2); font-size: 10px; font-weight: 850; }
.distributionRecipient b { display: block; font-size: 10.5px; }
.distributionRecipient small { display: block; margin-top: 3px; color: var(--dim); font-size: 8.5px; }
.distributionRecipient button { min-height: 31px; padding: 0 9px; }
.distributionRecipient button.sent { border-color: rgba(224,180,88,.3); color: var(--accent); }
.distributionRecipient button.acknowledged { border-color: rgba(127,180,162,.32); color: var(--accent2); }
.distributionRecipient button:last-child { padding: 0; color: var(--dim); font-size: 15px; }
.distributionEmpty { margin: 0; padding: 14px; border: 1px dashed var(--line); border-radius: 10px; color: var(--dim); font-size: 9.5px; text-align: center; }
.distributionHistory { margin: 0 12px 12px; border-top: 1px solid var(--line-soft); }
.distributionHistory summary { padding: 10px 1px; color: var(--dim); font-size: 9px; font-weight: 760; cursor: pointer; }
.distributionHistory p { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding: 8px 1px; border-top: 1px solid rgba(255,255,255,.045); font-size: 9px; }
.distributionHistory span { color: var(--dim); }

.directoryQuickActions { display: flex; min-height: 20px; gap: 9px; align-items: end; padding-top: 7px; }

/* Tracker import/export is intentionally local and preview-first. */
.productionTrackerDialog { width: min(760px, 100%); }
.trackerHero { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 13px; align-items: center; padding: 14px; border: 1px solid rgba(127,180,162,.2); border-radius: 13px; background: rgba(127,180,162,.065); }
.trackerHero > span { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 12px; background: rgba(127,180,162,.12); color: var(--accent2); font-size: 20px; }
.trackerHero b { font-size: 12.5px; }
.trackerHero p { margin: 5px 0 0; color: var(--dim); font-size: 10px; line-height: 1.5; }
.trackerDrop { display: grid; min-height: 94px; margin: 13px 0; place-items: center; align-content: center; gap: 5px; border: 1px dashed color-mix(in srgb, var(--accent2) 42%, var(--line)); border-radius: 13px; background: var(--surface-1); cursor: pointer; }
.trackerDrop:hover { border-color: var(--accent2); background: color-mix(in srgb, var(--accent2) 5%, var(--surface-1)); }
.trackerDrop span { font-size: 11px; font-weight: 800; }
.trackerDrop small { color: var(--dim); font-size: 9px; }
.trackerSummary { min-height: 76px; padding: 13px; border: 1px solid var(--line-soft); border-radius: 12px; background: var(--surface-0); }
.trackerSummary > p { margin: 0; color: var(--dim); font-size: 10px; line-height: 1.5; }
.trackerSummary > p.error { color: #e58e8e; }
.trackerSummary > p.success { margin-top: 10px; color: var(--accent2); }
.trackerSummary header span { display: block; overflow: hidden; color: var(--dim); font-size: 8.5px; text-overflow: ellipsis; white-space: nowrap; }
.trackerSummary header b { display: block; margin-top: 4px; font-size: 11.5px; }
.trackerSummary > div { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); overflow: hidden; margin-top: 11px; border: 1px solid var(--line-soft); border-radius: 10px; }
.trackerSummary > div > span { min-height: 54px; padding: 9px; border-left: 1px solid var(--line-soft); text-align: center; }
.trackerSummary > div > span:first-child { border-left: 0; }
.trackerSummary > div b { display: block; color: var(--accent2); font-size: 15px; }
.trackerSummary > div small { display: block; margin-top: 3px; color: var(--dim); font-size: 7.5px; text-transform: uppercase; }
.trackerActions { display: flex; justify-content: flex-end; gap: 7px; margin-top: 12px; }
.trackerActions button { min-height: 39px; padding: 0 13px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); color: var(--text); font-size: 10px; font-weight: 780; }
.trackerActions button.primary { border-color: transparent; background: var(--accent-fill); color: var(--accent-on); }
.trackerActions button:disabled { opacity: .42; cursor: not-allowed; }

@media (max-width: 1050px) {
  .shotWorkspaceToolbar { grid-template-columns: minmax(220px, 1fr) 145px auto; }
  .shotCollapseAll, .shotFilterCount { display: none; }
  .todayStatusGrid { grid-template-columns: repeat(3, 1fr); }
  .todayStatusGrid > span:nth-child(4) { border-left: 0; border-top: 1px solid var(--line-soft); }
  .todayStatusGrid > span:nth-child(5) { border-top: 1px solid var(--line-soft); }
}

@media (max-width: 700px) {
  body.production-mode #productionMobileTabs { grid-template-columns: repeat(4, minmax(0, 1fr)); height: 54px; padding-inline: 7px; }
  #productionMobileTabs button { min-height: 42px; padding-inline: 4px; font-size: 9.5px; }
  #productionMobileTabs button svg { width: 14px; height: 14px; }
  .brandHomeCue { display: none; }
  .shareActivity p { display: grid; gap: 3px; }
  .shareActivity small { text-align: left; }
  .todayEmpty { grid-template-columns: 42px minmax(0,1fr); min-height: 180px; margin: 24px auto; padding: 18px; }
  .todayEmpty > span { width: 42px; height: 42px; border-radius: 12px; font-size: 20px; }
  .todayHeader { display: grid; gap: 14px; align-items: stretch; }
  .todayHeader label { min-width: 0; }
  .todayStatusGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .todayStatusGrid > span { min-height: 64px; padding: 12px; border-top: 1px solid var(--line-soft); }
  .todayStatusGrid > span:nth-child(odd) { border-left: 0; }
  .todayStatusGrid > span:nth-child(-n+2) { border-top: 0; }
  .todayCommandBar { grid-template-columns: 1fr 1fr; }
  .todayCommandBar > span { grid-column: 1 / -1; }
  .todayCommandBar button { min-width: 0; padding-inline: 7px; }
  .todayScene { grid-template-columns: 64px minmax(0, 1fr) 16px; padding-inline: 7px; }
  .todaySplit { grid-template-columns: 1fr; }
  .todayContactGrid { grid-template-columns: 1fr 1fr; }
  .shotWorkspaceToolbar { position: static; grid-template-columns: 1fr auto; gap: 6px; margin-top: 0; }
  .shotSearch { grid-column: 1 / -1; }
  .shotStatusFilter { grid-template-columns: 1fr; gap: 3px; }
  .shotStatusFilter > span { display: none; }
  .shotDensity button { min-width: 58px; }
  .callDistribution > header { align-items: start; }
  .callDistribution h3 { font-size: 13px; }
  .distributionActions { display: grid; grid-template-columns: 1fr 1fr; }
  .distributionActions button:last-child { grid-column: 1 / -1; }
  .distributionComposer { grid-template-columns: 1fr 1fr; }
  .distributionComposer input:first-child { grid-column: 1 / -1; }
  .distributionRecipient { grid-template-columns: 30px minmax(0,1fr) auto 32px; }
  .distributionRecipient small { white-space: normal; }
  .trackerSummary > div { grid-template-columns: repeat(2, 1fr); }
  .trackerSummary > div > span { border-top: 1px solid var(--line-soft); }
  .trackerSummary > div > span:nth-child(odd) { border-left: 0; }
  .trackerSummary > div > span:nth-child(-n+2) { border-top: 0; }
  .trackerActions { display: grid; grid-template-columns: 1fr; }
}

@media print {
  .shotWorkspaceToolbar,
  .callDistribution,
  .todayCommandBar { display: none !important; }
}
