:root {
    color-scheme: dark;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: #121416;
    color: #f4f1e8;
}
* { box-sizing: border-box; }
body {
    min-height: 100vh;
    margin: 0;
    background: radial-gradient(circle at top left, rgba(202, 128, 43, 0.18), transparent 38rem), #121416;
}
.screen-width-warning { display: none; }
.site-nav { display: flex; align-items: center; justify-content: space-between; min-height: 4.25rem; border-bottom: 1px solid #2d3134; padding: 0 2rem; background: rgba(18, 20, 22, 0.9); backdrop-filter: blur(1rem); }
.site-identity { display: flex; align-items: baseline; gap: 0.8rem; min-width: 0; }
.site-nav .brand { color: #f4f1e8; font-family: Georgia, "Times New Roman", serif; font-size: 1.2rem; text-decoration: none; }
.site-nav .production-context { overflow: hidden; color: #8f9698; font-size: 0.78rem; font-weight: 650; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.site-nav .production-context:hover { color: #e6a65d; }
.site-nav nav { display: flex; align-items: center; gap: 1.25rem; }
.site-nav nav a { text-decoration: none; }
.site-nav .nav-action { border: 1px solid #4a4f52; border-radius: 0.45rem; padding: 0.5rem 0.7rem; }
.account-menu { display: flex; align-items: center; gap: 0.9rem; min-height: 2.25rem; border-left: 1px solid #34383b; padding-left: 1.25rem; }
.user-chip { display: flex; align-items: center; gap: 0.55rem; min-width: 0; line-height: 1; }
.user-chip strong { max-width: 12rem; overflow: hidden; color: #f4f1e8; font-size: 0.82rem; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.user-chip small { display: inline-block; border-radius: 99px; padding: 0.25rem 0.45rem; background: #292d2f; color: #aeb4b6; font-size: 0.68rem; font-weight: 700; line-height: 1; letter-spacing: 0.03em; }
.logout-form { margin: 0; }
.logout-form button { border: 1px solid #3b4043; border-radius: 0.45rem; padding: 0.45rem 0.65rem; background: transparent; color: #e6a65d; font: inherit; font-size: 0.78rem; cursor: pointer; }
.logout-form button:hover { border-color: #596064; color: #ffc47f; }
.logout-form button:focus-visible { outline: 2px solid rgba(219, 152, 77, 0.35); outline-offset: 2px; }
.shell { display: grid; min-height: calc(100vh - 4.25rem); place-items: center; padding: 2rem; }
.card {
    width: min(46rem, 100%);
    padding: clamp(2rem, 6vw, 4rem);
    border: 1px solid #34383b;
    border-radius: 1.25rem;
    background: rgba(30, 33, 35, 0.92);
    box-shadow: 0 2rem 6rem rgba(0, 0, 0, 0.35);
}
.card-wide { width: min(56rem, 100%); }
.auth-shell { min-height: 100vh; }
.auth-card { width: min(28rem, 100%); border: 1px solid #34383b; border-radius: 1.25rem; padding: 2.5rem; background: rgba(30, 33, 35, 0.96); box-shadow: 0 2rem 6rem rgba(0, 0, 0, 0.42); }
.auth-card h1 { font-size: clamp(2.5rem, 8vw, 4.25rem); }
.auth-mark { display: grid; width: 3rem; height: 3rem; margin-bottom: 2rem; place-items: center; border-radius: 0.7rem; background: #c9802b; color: #171819; font-family: Georgia, "Times New Roman", serif; font-weight: 800; }
.auth-intro { margin: 0.8rem 0 2rem; color: #aeb4b6; }
.auth-actions { justify-content: stretch; }
.auth-actions button { width: 100%; }
.eyebrow { margin: 0 0 0.75rem; color: #db984d; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
h1 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.5rem, 8vw, 5rem); font-weight: 500; letter-spacing: -0.04em; }
.lead { max-width: 35rem; margin: 1.25rem 0 2.5rem; color: #b9bdbe; font-size: 1.1rem; line-height: 1.65; }
.status-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: 1rem; margin: 0; }
.status-grid div { padding: 1rem; border: 1px solid #363a3d; border-radius: 0.75rem; background: #181b1d; }
dt { color: #8f9698; font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; }
dd { margin: 0.45rem 0 0; font-weight: 650; }
a { color: #e6a65d; }
.button { display: inline-block; padding: 0.75rem 1rem; border-radius: 0.5rem; background: #c9802b; color: #161718; font-weight: 700; text-decoration: none; }
.home-status { margin-top: 2rem; }
.hero-actions { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.form-stack { display: grid; gap: 1.5rem; }
.field { display: grid; gap: 0.5rem; }
.field label { font-weight: 700; }
.field label span, .field small { color: #8f9698; font-size: 0.82rem; font-weight: 400; }
.field input, .field textarea, .field select {
    width: 100%;
    border: 1px solid #454b4f;
    border-radius: 0.55rem;
    padding: 0.85rem 0.95rem;
    background: #141719;
    color: #f4f1e8;
    font: inherit;
}
.field input:focus, .field textarea:focus, .field select:focus {
    border-color: #db984d;
    outline: 3px solid rgba(219, 152, 77, 0.18);
}
.field-error { margin: 0; color: #ff9f91; font-size: 0.88rem; }
.alert { margin-bottom: 1.5rem; border: 1px solid #82483f; border-radius: 0.55rem; padding: 0.9rem; background: #39231f; color: #ffd1ca; }
.form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 1rem; padding-top: 0.5rem; }
.form-actions button {
    border: 0;
    border-radius: 0.55rem;
    padding: 0.8rem 1.15rem;
    background: #c9802b;
    color: #161718;
    font: inherit;
    font-weight: 750;
    cursor: pointer;
}
.form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.admin-form-card { width: min(48rem, 100%); }
.workspace-picker { display: grid; gap: 0.7rem; margin: 0; border: 1px solid #454b4f; border-radius: 0.75rem; padding: 1rem; }
.workspace-picker legend { padding: 0 0.4rem; font-weight: 750; }
.workspace-picker > p { margin: 0 0 0.35rem; color: #8f9698; font-size: 0.85rem; }
.workspace-picker label { display: flex; align-items: center; gap: 0.55rem; border-radius: 0.4rem; padding: 0.55rem; background: #171a1c; cursor: pointer; }
.workspace-picker input { width: 1rem; height: 1rem; accent-color: #c9802b; }
.user-table-wrap { overflow-x: auto; }
.user-table { width: 100%; border-collapse: collapse; }
.user-table th, .user-table td { border-bottom: 1px solid #34383b; padding: 0.9rem 0.7rem; text-align: left; white-space: nowrap; }
.user-table th { color: #8f9698; font-size: 0.72rem; letter-spacing: 0.07em; text-transform: uppercase; }
.user-table td:first-child { display: grid; gap: 0.2rem; min-width: 13rem; }
.user-table td:first-child span { color: #8f9698; font-size: 0.8rem; }
.role-badge { display: inline-block; border-radius: 99px; padding: 0.3rem 0.55rem; background: #292d2f; font-size: 0.75rem; font-weight: 750; }
.role-admin { background: rgba(219, 152, 77, 0.16); color: #e6a65d; }
.role-user { background: rgba(89, 153, 213, 0.16); color: #8ec5f5; }
.role-reader { color: #bdc3c5; }
.secondary-button { border: 1px solid #596064; border-radius: 0.55rem; padding: 0.72rem 0.95rem; color: #e5e8e9; font-weight: 700; text-decoration: none; }
.secondary-button:hover { border-color: #db984d; color: #fff; }
.secondary-button:focus-visible { outline: 3px solid rgba(219, 152, 77, 0.25); outline-offset: 2px; }
.next-step { display: grid; gap: 0.35rem; margin: 2rem 0; border-left: 3px solid #c9802b; padding-left: 1rem; color: #b9bdbe; }
.next-step strong { color: #f4f1e8; }
.upload-field { display: grid; gap: 0.65rem; border: 1px dashed #535a5e; border-radius: 0.8rem; padding: 1.5rem; background: #171a1c; }
.upload-field label { font-weight: 750; }
.upload-field input { color: #b9bdbe; }
.upload-field small { color: #8f9698; }
.import-notes { color: #b9bdbe; }
.import-notes strong { color: #f4f1e8; }
.import-notes ul { margin-bottom: 0; padding-left: 1.25rem; line-height: 1.7; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-top: 3rem; border-top: 1px solid #34383b; padding-top: 2rem; }
.section-heading-top { align-items: center; margin: 0 0 2rem; border: 0; padding: 0; }
.section-heading-top h1 { font-size: clamp(2.25rem, 6vw, 4rem); }
.section-heading h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: 1.8rem; font-weight: 500; }
.empty-state { margin-top: 1.25rem; border: 1px dashed #454b4f; border-radius: 0.75rem; padding: 1.25rem; color: #9ea4a6; }
.version-list { display: grid; gap: 0.75rem; margin-top: 1.25rem; }
.version-row { display: grid; grid-template-columns: 2fr 1fr auto auto; align-items: center; gap: 1rem; border: 1px solid #363a3d; border-radius: 0.7rem; padding: 1rem; background: #181b1d; }
.version-row div { display: grid; gap: 0.2rem; }
.version-row span { color: #92999b; font-size: 0.85rem; }
.older-versions { margin-top: 0.15rem; }
.older-versions summary { width: fit-content; border-radius: 0.45rem; padding: 0.55rem 0.7rem; color: #e6a65d; font-weight: 700; cursor: pointer; }
.older-versions summary:hover { background: rgba(219, 152, 77, 0.1); }
.older-versions .version-list { margin-top: 0.75rem; }
.older-versions .when-open { display: none; }
.older-versions[open] .when-closed { display: none; }
.older-versions[open] .when-open { display: inline; }
.status-pill { border-radius: 99px; padding: 0.35rem 0.65rem; background: rgba(219, 152, 77, 0.15); color: #e6a65d !important; text-transform: capitalize; }
.version-open { font-weight: 700; text-decoration: none; }
.back-link { margin: 2rem 0 0; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.change-summary { margin: 0 0 2rem; }
.review-form { margin-top: 2rem; }
.change-section { display: grid; gap: 0.75rem; border-top: 1px solid #34383b; padding-top: 1.5rem; }
.change-section > p { margin: -0.25rem 0 0.5rem; color: #9ea4a6; line-height: 1.5; }
.change-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.change-heading h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: 1.55rem; font-weight: 500; }
.change-heading > span { min-width: 2rem; border-radius: 99px; padding: 0.25rem 0.55rem; background: #292d2f; color: #c6cbcc; text-align: center; }
.resolution-block { display: grid; gap: 1rem; min-width: 0; margin: 0.5rem 0 1rem; border: 1px solid #454b4f; border-radius: 0.8rem; padding: 1.15rem; background: #15181a; }
.resolution-block legend { padding: 0 0.45rem; color: #e8ac69; font-weight: 750; }
.scene-context { display: grid; gap: 0.75rem; border: 1px solid #3c4f5d; border-radius: 0.65rem; padding: 1rem; background: #192128; }
.scene-context-heading { display: grid; gap: 0.3rem; }
.context-label { color: #7db4dc; font-size: 0.7rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.scene-facts { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.scene-facts > span { border-radius: 99px; padding: 0.25rem 0.5rem; background: rgba(255, 255, 255, 0.06); color: #aeb6b9; font-size: 0.73rem; }
.scene-context blockquote { margin: 0; border-left: 2px solid #506b7e; padding-left: 0.75rem; color: #ccd2d4; font-size: 0.88rem; font-style: italic; line-height: 1.5; }
.scene-neighbors { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; }
.scene-neighbors > span { display: grid; gap: 0.15rem; min-width: 0; color: #aeb6b9; font-size: 0.75rem; }
.scene-neighbors small { color: #6f7c82; font-size: 0.65rem; font-weight: 750; letter-spacing: 0.06em; text-transform: uppercase; }
.decision-options { display: grid; gap: 0.6rem; }
.decision-prompt { margin: 0.15rem 0 0; color: #f4f1e8; font-weight: 750; }
.decision-card { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 0.75rem; border: 1px solid #3d4346; border-radius: 0.65rem; padding: 0.85rem; background: #1b1e20; cursor: pointer; }
.decision-card:hover { border-color: #687075; }
.decision-card:has(input:checked) { border-color: #db984d; outline: 2px solid rgba(219, 152, 77, 0.16); background: #252018; }
.decision-card input { margin-top: 0.25rem; accent-color: #d9913f; }
.decision-card > span { display: grid; gap: 0.35rem; }
.decision-card > span > small { color: #949b9d; line-height: 1.45; }
.decision-new { padding-block: 1rem; }
.candidate-content b { font-size: 0.86rem; }
.candidate-title { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.candidate-title em { color: #76c391; font-size: 0.7rem; font-style: normal; font-weight: 750; }
.candidate-excerpt { color: #bfc5c7; font-size: 0.8rem; font-style: italic; line-height: 1.4; }
.candidate-neighbors { color: #777f82; font-size: 0.7rem; }
.change-row { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 0.85rem; border: 1px solid #34393c; border-radius: 0.6rem; padding: 0.85rem; background: #181b1d; }
.change-row > div { display: grid; gap: 0.25rem; }
.change-row small { color: #8f9698; }
.change-kind { border-radius: 99px; padding: 0.3rem 0.55rem; font-size: 0.72rem; font-weight: 750; text-transform: uppercase; }
.change-kind.modified { background: rgba(219, 152, 77, 0.15); color: #e6a65d; }
.change-kind.moved { background: rgba(89, 153, 213, 0.16); color: #8ec5f5; }
.change-kind.deleted { background: rgba(207, 92, 77, 0.15); color: #ff9f91; }
.production-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(19rem, 100%), 1fr)); gap: 1rem; }
.production-card { display: grid; gap: 1rem; border: 1px solid #363a3d; border-radius: 0.85rem; padding: 1.25rem; background: #181b1d; }
.production-card-heading { display: flex; justify-content: space-between; gap: 1rem; color: #8f9698; font-size: 0.75rem; }
.production-card-heading div { display: flex; align-items: center; gap: 0.4rem; }
.status-dot { width: 0.45rem; height: 0.45rem; border-radius: 50%; background: #68b984; }
.production-card h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: 1.65rem; font-weight: 500; }
.production-card p { min-height: 2.6rem; margin: 0; color: #b9bdbe; line-height: 1.5; }
.production-card .muted { color: #737a7d; }
.production-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin: 0; }
.production-stats div { border-radius: 0.5rem; padding: 0.65rem; background: #121516; }
.open-production { display: flex; align-items: center; justify-content: space-between; border-radius: 0.55rem; padding: 0.8rem 0.95rem; background: #c9802b; color: #161718; font-weight: 800; text-decoration: none; transition: background 120ms ease, transform 120ms ease; }
.open-production:hover { background: #db984d; transform: translateY(-1px); }
.open-production:focus-visible { outline: 3px solid rgba(219, 152, 77, 0.35); outline-offset: 2px; }
.production-empty { display: grid; gap: 0.4rem; }
.production-empty span { color: #8f9698; }
.reader-workspace {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    width: min(110rem, 100%);
    height: calc(100vh - 8.25rem);
    min-height: 30rem;
    align-self: center;
}
.reader-toolbar { display: grid; border: 1px solid #34383b; border-radius: 0.8rem 0.8rem 0 0; background: #1b1e20; }
.reader-toolbar-primary { display: flex; align-items: center; gap: 0.75rem; padding: 0.65rem 1rem; }
.reader-document-actions { display: flex; align-items: center; justify-content: flex-end; gap: 0.65rem; }
.reader-tag-menu { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 0.5rem; border-top: 1px solid #34383b; padding: 0.55rem 1rem; background: #171a1c; }
.reader-readonly-notice { margin: 0; border-top: 1px solid #34383b; padding: 0.55rem 1rem; color: #aeb4b6; font-size: 0.78rem; }
.reader-toolbar a { font-size: 0.85rem; text-decoration: none; }
.reader-toolbar > span { color: #8f9698; font-size: 0.85rem; }
.reader-tag-count, .shot-list-count { margin: 0; color: #9da3a5; font-size: 0.78rem; white-space: nowrap; }
.reader-tag-count b, .shot-list-count b { color: #f4f1e8; }
.reader-context-link, .shot-list-context { margin-left: auto; overflow: hidden; color: #9da3a5; text-overflow: ellipsis; white-space: nowrap; }
.scene-jump { position: relative; display: grid; grid-template-columns: auto auto; align-items: center; gap: 0.35rem 0.65rem; }
.scene-jump label { color: #b9bdbe; font-size: 0.78rem; font-weight: 700; }
.scene-jump > span { display: flex; grid-column: 2; grid-row: 1; }
.scene-jump label { grid-column: 1; grid-row: 1; margin: 0; align-self: center; white-space: nowrap; }
.scene-jump small { grid-column: 1 / -1; grid-row: 2; }
.scene-jump-controls { position: relative; min-width: 18rem; }
.scene-jump input { flex: 1; min-width: 0; width: auto; border: 1px solid #4a5053; border-radius: 0.45rem 0 0 0.45rem; padding: 0.5rem 0.65rem; background: #111416; color: #f4f1e8; font: inherit; }
.scene-jump input:focus { border-color: #db984d; outline: 2px solid rgba(219, 152, 77, 0.2); }
.scene-jump button { border: 0; border-radius: 0 0.45rem 0.45rem 0; padding: 0.5rem 0.7rem; background: #c9802b; color: #171819; font: inherit; font-weight: 750; cursor: pointer; }
.scene-jump small { min-height: 1em; color: #ffb0a4; font-size: 0.7rem; }
.reader-toolbar .reader-report-link { color: #e6a65d; font-weight: 700; white-space: nowrap; }
.reader-toolbar .reader-report-link:hover { color: #ffc47f; }
.reader-toolbar .reader-pdf-link { border: 1px solid #596064; border-radius: 0.45rem; padding: 0.5rem 0.75rem; color: #e5e8e9; font-weight: 700; white-space: nowrap; }
.reader-toolbar .reader-pdf-link:hover { border-color: #db984d; color: #fff; }
.reader-lining-toggle { border: 1px solid #596064; border-radius: 0.45rem; padding: 0.5rem 0.75rem; background: #141719; color: #e5e8e9; font: inherit; font-size: 0.78rem; font-weight: 750; white-space: nowrap; cursor: pointer; }
.reader-lining-toggle:hover { border-color: #db984d; color: #fff; }
.reader-lining-toggle[aria-pressed="false"] { color: #aeb4b6; }
.reader-lining-toggle:focus-visible { border-color: #db984d; outline: 2px solid rgba(219, 152, 77, 0.3); outline-offset: 2px; }
.reader-lining-toggle:disabled { border-color: #3d4245; color: #666d70; cursor: not-allowed; }
.reader-tool-button { border: 1px solid #596064; border-radius: 0.45rem; padding: 0.5rem 0.72rem; background: #141719; color: #e5e8e9; font: inherit; font-size: 0.78rem; font-weight: 750; white-space: nowrap; cursor: pointer; }
.reader-tool-button:hover { border-color: #db984d; color: #fff; }
.reader-tag-tools { display: flex; align-items: center; gap: 0.45rem; white-space: nowrap; }
.reader-tag-kind { display: flex; align-items: center; gap: 0.35rem; border: 1px solid #596064; border-radius: 0.45rem; padding-left: 0.55rem; background: #141719; }
.reader-tag-kind select { border: 0; border-left: 1px solid #444a4d; padding: 0.48rem 1.8rem 0.48rem 0.55rem; background: #1b1f21; color: #fff; font: inherit; font-size: 0.78rem; font-weight: 700; }
.reader-tag-actions { display: flex; align-items: center; gap: 0.25rem; }
.reader-tag-tools button { border: 1px solid #596064; border-radius: 0.45rem; padding: 0.5rem 0.72rem; background: #141719; color: #e5e8e9; font: inherit; font-size: 0.78rem; font-weight: 750; cursor: pointer; }
.reader-tag-tools button:hover, .reader-tag-tools button[aria-pressed="true"] { border-color: #db984d; color: #fff; }
.reader-tag-tools button[aria-pressed="true"] { background: #5e3914; }
.reader-tag-tools .reader-lock-button[aria-pressed="true"] { border-color: #db984d; background: #c9802b; color: #171819; font-weight: 900; }
.reader-tag-kind select:disabled { color: #f4f1e8; opacity: 0.72; cursor: not-allowed; }
.reader-tag-tools span { color: #aeb4b6; font-size: 0.75rem; }
.scene-jump-options { position: absolute; z-index: 20; top: calc(100% + 0.3rem); left: 0; display: grid !important; width: 100%; max-height: 18rem; overflow-y: auto; border: 1px solid #4a5053; border-radius: 0.5rem; background: #f7f7f5; box-shadow: 0 0.5rem 1.25rem rgba(0, 0, 0, 0.3); }
.scene-jump-options[hidden] { display: none !important; }
.scene-jump-options button { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); gap: 0.6rem; width: 100%; border-radius: 0; padding: 0.65rem 0.8rem; background: #f7f7f5; color: #202325; text-align: left; }
.scene-jump-options button[hidden] { display: none; }
.scene-jump-options button + button { border-top: 1px solid #d8d8d4; }
.scene-jump-options button:hover, .scene-jump-options button:focus-visible { outline: 0; background: #e3ecfa; }
.scene-jump-options button strong { color: #1769d2; }
.scene-jump-options button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.reader-body { --scene-index-width: 13rem; display: grid; grid-template-columns: var(--scene-index-width) minmax(0, 1fr); min-height: 0; border: 1px solid #34383b; border-top: 0; border-radius: 0 0 0.8rem 0.8rem; overflow: hidden; background: #25292b; }
.scene-index { display: grid; align-content: start; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 1rem; }
.scene-index { border-right: 1px solid #34383b; text-transform: uppercase; }
.scene-index-heading { display: flex; align-items: center; justify-content: flex-start; gap: 0.75rem; margin-bottom: 0.75rem; }
.scene-index-sizes { display: flex; gap: 0.35rem; }
.scene-index-sizes button { border: 0; padding: 0.15rem 0.4rem; background: transparent; color: #e6a65d; font: inherit; font-size: 0.9rem; cursor: pointer; }
.scene-index-sizes button:hover:not(:disabled) { color: #ffc47f; text-decoration: underline; }
.scene-index-sizes button:disabled { color: #5f6668; cursor: default; }
.scene-index-sizes button:focus-visible { outline: 2px solid #db984d; outline-offset: 2px; }
.shot-delete-dialog { max-width: min(28rem, calc(100% - 2rem)); border: 1px solid #596064; border-radius: 0.75rem; padding: 1.5rem; background: #1b1e20; color: #f4f1e8; }
.shot-delete-dialog::backdrop { background: rgba(0, 0, 0, 0.65); }
.shot-delete-dialog button { margin-right: 0.5rem; padding: 0.6rem 0.85rem; cursor: pointer; }
.scene-index-heading > p { margin: 0; color: #8f9698; font-size: 0.72rem; font-weight: 750; letter-spacing: 0.1em; text-transform: uppercase; }
.scene-index > a { display: grid; grid-template-columns: 2.4rem 1fr; gap: 0.5rem; border-radius: 0.45rem; padding: 0.65rem; color: #c7cbcc; font-size: 0.78rem; line-height: 1.3; text-decoration: none; }
.scene-index > a:hover { background: #303537; color: #fff; }
.scene-index > a strong { color: #e6a65d; }
.scene-index > a span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reader-workspace .scene-index { text-transform: uppercase; }
.screenplay-scroll {
    min-width: 0;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    scroll-behavior: smooth;
}
.screenplay-scroll:focus-visible { outline: 2px solid #db984d; outline-offset: -2px; }
.screenplay-paper {
    --script-left-margin: 1.5in;
    width: min(8.5in, calc(100% - 2rem));
    min-height: 70vh;
    margin: 1rem auto 3rem;
    padding: 0.75in 1in 1in var(--script-left-margin);
    background: #dededb;
    box-shadow: 0 0.75rem 2rem rgba(0, 0, 0, 0.28);
    color: #111;
    font-family: Courier, "Courier New", monospace;
    font-size: 12pt;
    line-height: 1.2;
}
.screenplay-paragraph { min-height: 1.2em; margin: 0 0 1.2em; white-space: pre-wrap; scroll-margin-top: 1rem; }
.screenplay-paragraph.type-scene-heading {
    position: relative;
    margin-top: 3.6em;
    margin-bottom: 1.2em;
    border-top: 4px solid #1769d2;
    padding-top: 1.65em;
    font-weight: 700;
    text-transform: uppercase;
}
.screenplay-paragraph.type-scene-heading::before {
    position: absolute;
    top: -0.72em;
    left: calc(0in - var(--script-left-margin) + 0.1in);
    width: calc(var(--script-left-margin) - 0.25in);
    padding-right: 0.15in;
    background: #dededb;
    color: #1769d2;
    content: attr(data-scene-number);
    font-size: 28pt;
    font-weight: 700;
    line-height: 1;
    text-align: right;
}
.scene-page-eighths { position: absolute; top: 0.35em; right: 0; padding-left: 0.15in; background: #dededb; color: #73777a; font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 12pt; font-weight: 700; line-height: 1; text-transform: none; }
.screenplay-paragraph.type-scene-heading.scene-jump-target { animation: scene-jump-pulse 1.5s ease-out; }
@keyframes scene-jump-pulse {
    0%, 35% { background: rgba(23, 105, 210, 0.18); }
    100% { background: transparent; }
}
.screenplay-paragraph.type-action { position: relative; }
.screenplay-paragraph.type-character { width: 2.2in; margin: 1.2em 0 0 2.2in; text-transform: uppercase; }
.screenplay-paragraph.type-more,
.screenplay-paragraph.continuation-marker { width: 2.2in; margin-right: 0; margin-left: 2.2in; text-align: center; text-transform: uppercase; }
.scene-line-number { font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 8pt; font-weight: 800; line-height: 1; }
.action-line-number { position: absolute; top: 0.15em; right: calc(100% + 0.12in); width: 0.3in; color: #198754; text-align: right; }
.character-line-number { margin-left: 0.12in; color: #c52b34; vertical-align: super; }
.screenplay-paragraph.type-parenthetical { width: 2in; margin: 0 0 0 1.7in; }
.screenplay-paragraph.type-dialogue { width: 3.5in; margin: 0 0 1.2em 1in; }
.screenplay-paragraph.type-transition { margin-left: auto; text-align: right; text-transform: uppercase; }
.screenplay-paragraph.type-shot { font-weight: 700; text-transform: uppercase; }
.screenplay-paragraph.type-title-page { margin: 3em 0; text-align: center; }
.screenplay-empty { color: #333; text-align: center; }
.run-bold { font-weight: 700; }
.run-italic { font-style: italic; }
.run-underline { text-decoration: underline; }
.reader-screenplay-paper { --script-left-margin: 0.9in; position: relative; box-sizing: border-box; width: min(8.5in, calc(100% - 1rem)); padding-right: 0.8in; }
.reader-screenplay-paper .screenplay-paragraph { position: relative; z-index: 2; }
.reader-screenplay-paper.is-dropping-note { cursor: crosshair; }
.reader-annotation-layer { position: absolute; z-index: 1; inset: 0; pointer-events: none; }
.reader-annotation-marker-layer { position: absolute; z-index: 4; inset: 0; pointer-events: none; }
.annotation-highlight { position: absolute; border-radius: 0.15rem; background: #767b7e; opacity: 0.32; }
.annotation-marker { position: absolute; z-index: 2; width: 1.45rem; height: 1.45rem; transform: translateY(-0.1rem); border: 2px solid #555b5e; border-radius: 50%; padding: 0; background: #a7abad; color: #252728; font-size: 0.68rem; line-height: 1; opacity: 0.5; box-shadow: 0 0.12rem 0.35rem rgba(0, 0, 0, 0.28); cursor: pointer; pointer-events: auto; }
.annotation-marker.annotation-highlight { transform: translate(-50%, -72%); }
.annotation-marker.annotation-note { transform: translate(-50%, -0.2rem); cursor: move; touch-action: none; }
.annotation-marker.annotation-note.is-repositioning { opacity: 0.8; box-shadow: 0 0 0 4px rgba(219, 152, 77, 0.28), 0 0.3rem 0.8rem rgba(0, 0, 0, 0.42); }
.annotation-marker-hint { position: absolute; top: 50%; left: calc(100% + 0.35rem); min-width: max-content; transform: translateY(-50%); border-radius: 0.25rem; padding: 0.16rem 0.32rem; background: rgba(45, 49, 51, 0.9); color: #f2f3f3; font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 0.62rem; font-weight: 700; line-height: 1.15; letter-spacing: 0; pointer-events: none; white-space: nowrap; }
.annotation-marker.annotation-note.hint-left .annotation-marker-hint { right: calc(100% + 0.35rem); left: auto; }
.annotation-marker:hover, .annotation-marker:focus-visible { outline: 3px solid rgba(39, 42, 44, 0.3); outline-offset: 2px; }
.reader-lining-layer { position: absolute; z-index: 5; inset: 0; pointer-events: none; }
.reader-lining-layer[hidden] { display: none; }
.reader-shot-line { margin: 0; border: 0; padding: 0; opacity: 0.5; cursor: help; pointer-events: auto; }
.reader-view-workspace .reader-shot-line { cursor: default; }
.reader-view-workspace [data-reader-tags][hidden] { display: none; }
.reader-shot-line:focus-visible { outline: 3px solid rgba(219, 152, 77, 0.55); outline-offset: 4px; }
.reader-lining-notice { position: fixed; z-index: 40; top: 5.25rem; right: 1.25rem; max-width: 24rem; border: 1px solid #596064; border-radius: 0.55rem; padding: 0.75rem 0.9rem; background: #171a1c; color: #c9cecf; box-shadow: 0 0.8rem 2rem rgba(0, 0, 0, 0.4); font-size: 0.78rem; }
.annotation-modal { width: min(36rem, calc(100vw - 2rem)); border: 1px solid #555d60; border-radius: 0.8rem; padding: 0; background: #202426; color: #eef0f0; box-shadow: 0 1.3rem 4rem rgba(0, 0, 0, 0.55); }
.annotation-modal::backdrop { background: rgba(8, 10, 11, 0.72); }
.annotation-modal form { display: grid; gap: 0.9rem; padding: 1.1rem; }
.annotation-modal header, .annotation-modal footer { display: flex; align-items: center; gap: 0.7rem; }
.annotation-modal header { justify-content: space-between; }
.annotation-modal header h2 { margin: 0; font-size: 1.12rem; }
.annotation-modal header button { border: 0; padding: 0.15rem 0.35rem; background: transparent; color: #c9cecf; font-size: 1.4rem; cursor: pointer; }
.annotation-modal .annotation-selection { max-height: 5.5rem; margin: 0; overflow: auto; border-left: 3px solid #db984d; padding: 0.45rem 0.65rem; background: #171a1c; color: #cdd1d2; font-size: 0.84rem; }
.setting-selector { display: grid; gap: 0.4rem; border: 1px solid #4a5053; border-radius: 0.5rem; padding: 0.7rem; background: #171a1c; }
.setting-selector[hidden] { display: none; }
.setting-selector > span { color: #aeb4b6; font-size: 0.75rem; }
.setting-selector > p { margin: 0; border-radius: 0.35rem; padding: 0.65rem; background: #f3f1ea; color: #202325; font-family: Courier, "Courier New", monospace; font-size: 0.9rem; font-weight: 700; line-height: 1.45; text-transform: uppercase; cursor: text; user-select: text; }
.setting-selector > p::selection { background: rgba(118, 123, 126, 0.5); }
.annotation-modal .field { display: grid; gap: 0.3rem; color: #cdd1d2; font-size: 0.78rem; font-weight: 700; }
.annotation-modal textarea, .annotation-modal select { width: 100%; border: 1px solid #555d60; border-radius: 0.4rem; padding: 0.55rem; background: #151819; color: #fff; font: inherit; }
.annotation-modal fieldset { display: grid; gap: 0.4rem; max-height: 12rem; overflow: auto; border: 1px solid #474d50; border-radius: 0.5rem; padding: 0.7rem; }
.annotation-modal legend { padding: 0 0.35rem; color: #cdd1d2; font-size: 0.78rem; font-weight: 750; }
.annotation-modal fieldset label { display: flex; align-items: flex-start; gap: 0.5rem; color: #e0e3e4; font-size: 0.8rem; }
.annotation-modal fieldset p { margin: 0; color: #9da4a6; font-size: 0.78rem; }
.annotation-modal footer { justify-content: flex-end; }
.annotation-modal footer span { flex: 1; }
.annotation-modal .danger-button { border-color: #8d4a4a; background: #4e2424; color: #ffd7d7; }
.category-help { margin: 0; color: #9da4a6; font-size: 0.8rem; line-height: 1.45; }
.category-list { display: grid; gap: 0.45rem; max-height: 20rem; overflow-y: auto; }
.category-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 0.45rem; }
.category-row input, .category-add input { min-width: 0; border: 1px solid #555d60; border-radius: 0.4rem; padding: 0.55rem; background: #151819; color: #fff; font: inherit; }
.category-row button, .category-add button { border: 1px solid #555d60; border-radius: 0.4rem; padding: 0.55rem 0.7rem; background: #303537; color: #fff; font: inherit; font-size: 0.78rem; cursor: pointer; }
.category-row span { min-width: 5rem; color: #858d8f; font-size: 0.72rem; text-align: right; }
.category-add { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.45rem; border-top: 1px solid #3f4548; padding-top: 0.85rem; }
.reader-lining-notice[hidden] { display: none; }
.production-planning-actions { display: flex; justify-content: flex-end; margin-top: 1rem; }
.planning-nav { display: inline-flex; align-items: center; flex: 0 0 auto; gap: 0.2rem; border: 1px solid #41474a; border-radius: 0.5rem; padding: 0.2rem; background: #141719; }
.planning-nav a, .planning-nav span { border-radius: 0.35rem; padding: 0.42rem 0.65rem; color: #aeb4b6; font-size: 0.74rem; font-weight: 750; line-height: 1; text-decoration: none; white-space: nowrap; }
.planning-nav a:hover { background: #272c2e; color: #fff; }
.planning-nav a[aria-current="page"] { background: #c9802b; color: #171819; }
.planning-nav span[aria-disabled="true"] { color: #5f6668; cursor: not-allowed; }
.reader-toolbar .planning-nav a, .reader-toolbar .planning-nav span { text-transform: uppercase; }
.shot-list-page > .planning-nav { margin: -0.75rem 0 1.5rem; }

/* Script lining */
.lining-workspace { display: grid; grid-template-rows: auto minmax(0, 1fr); width: min(110rem, 100%); height: calc(100vh - 8.25rem); min-height: 34rem; }
.lining-toolbar { display: flex; flex-wrap: wrap; min-width: 0; align-items: center; gap: 0.75rem; border: 1px solid #34383b; border-radius: 0.8rem 0.8rem 0 0; padding: 0.65rem 1rem; background: #1b1e20; }
.lining-scene-jump select { width: min(18rem, 24vw); border: 1px solid #454b4f; border-radius: 0.45rem; padding: 0.55rem 0.7rem; background: #141719; color: #cfd3d4; font: inherit; font-size: 0.8rem; }
.lining-tools { display: flex; align-items: center; gap: 0.75rem; border: 1px solid #3b4043; border-radius: 0.5rem; padding: 0.35rem 0.45rem; background: #151819; }
.draw-style-picker { display: flex; align-items: center; gap: 0.5rem; color: #d6dadb; font-size: 0.72rem; font-weight: 800; white-space: nowrap; }
.draw-style-picker select { min-width: 8.5rem; border: 1px solid #697175; border-radius: 0.4rem; padding: 0.48rem 1.9rem 0.48rem 0.65rem; background: #0f1213; color: #fff; font: inherit; font-size: 0.78rem; font-weight: 750; cursor: pointer; }
.draw-style-picker select:focus-visible { border-color: #db984d; outline: 3px solid rgba(219, 152, 77, 0.22); outline-offset: 1px; }
.lining-hint { margin-left: auto; border-left: 1px solid #3b4043; padding: 0.3rem 0 0.3rem 0.75rem; color: #858d8f; font-size: 0.7rem; line-height: 1.35; white-space: nowrap; }
.lining-shot-count { margin: 0; color: #9da3a5; font-size: 0.78rem; white-space: nowrap; }
.lining-shot-count b { color: #f4f1e8; }
.lining-body { min-width: 0; min-height: 0; border: 1px solid #34383b; border-top: 0; border-radius: 0 0 0.8rem 0.8rem; overflow: hidden; background: #25292b; }
.lining-scroll { width: 100%; height: 100%; background: #212527; }
.lining-paper { position: relative; }
.lining-paragraph { position: relative; }
.lining-drawing-layer { position: absolute; z-index: 5; inset: 0; cursor: crosshair; touch-action: none; }
.lining-drawing-layer.is-section-mode { cursor: ns-resize; }
.drawn-shot-line { --line-color: #1769d2; position: absolute; width: 3.2px; min-height: 4px; transform: translateX(-50%); border-radius: 2px; background: var(--line-color); cursor: ew-resize; pointer-events: auto; }
.line-section { position: absolute; left: 50%; min-height: 1px; transform: translateX(-50%); pointer-events: none; }
.line-section { width: 3.2px; border-radius: 2px; background: var(--line-color); }
.drawn-shot-line.is-selected { z-index: 2; box-shadow: 0 0 0 4px rgba(23, 105, 210, 0.2); }
.drawn-shot-line::before, .drawn-shot-line::after { position: absolute; left: 50%; width: 12px; height: 2.4px; transform: translateX(-50%); border-radius: 1px; background: var(--line-color); content: ""; }
.drawn-shot-line::before { top: 0; }
.drawn-shot-line::after { bottom: 0; width: 14px; }
.drawn-shot-line b { position: absolute; top: -1.35em; left: 50%; transform: translateX(-50%); border-radius: 0.2rem; padding: 0.08rem 0.22rem; background: var(--line-color); color: #fff; font-family: ui-sans-serif, system-ui, sans-serif; font-size: 7pt; line-height: 1.2; white-space: nowrap; }
.drawn-shot-line.line-preview { box-shadow: 0 0 0 2px color-mix(in srgb, var(--line-color) 22%, transparent); }
.line-section.line-style-dotted { background: repeating-linear-gradient(to bottom, var(--line-color) 0 5px, transparent 5px 10px); }
/* Both squiggle styles share an even wave and the Standard line's stroke weight. */
.line-section.line-style-squiggly, .line-section.line-style-dirty { --line-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath d='M2.667,-10 L9.333,-5 L2.667,0 L9.333,5 L2.667,10 L9.333,15 L2.667,20' fill='none' stroke='black' stroke-width='3.2' stroke-linejoin='round'/%3E%3C/svg%3E"); width: 12px; border-radius: 0; background: var(--line-color); -webkit-mask: var(--line-wave) center top / 12px 10px repeat-y; mask: var(--line-wave) center top / 12px 10px repeat-y; }
.line-section.line-style-dirty { -webkit-mask: var(--line-wave) center top / 12px 10px repeat-y, linear-gradient(black, black) center / 3.2px 100% no-repeat; mask: var(--line-wave) center top / 12px 10px repeat-y, linear-gradient(black, black) center / 3.2px 100% no-repeat; }
.drawn-shot-line.has-line-sections { background-color: transparent; background-image: none; }
.drawn-shot-line.has-line-sections::before, .drawn-shot-line.has-line-sections::after { background: var(--line-color); }
.line-preview { background: transparent; }
.line-preview::before, .line-preview::after { background: var(--line-color); }
.line-preview [data-preview-stroke] { top: 0; height: 100%; }
.drawn-shot-line[hidden] { display: none; }
.line-handle { position: absolute; z-index: 3; left: 50%; width: 18px; height: 14px; transform: translateX(-50%); cursor: ns-resize; pointer-events: auto; }
.line-handle-start { top: -5px; }
.line-handle-end { bottom: -5px; }
.line-editor { position: absolute; z-index: 8; display: flex; align-items: center; gap: 0.55rem; transform: translateX(-50%); border: 1px solid #464c4f; border-radius: 0.45rem; padding: 0.4rem 0.5rem; background: #16191a; color: #d9ddde; box-shadow: 0 0.6rem 1.4rem rgba(0, 0, 0, 0.42); font-family: ui-sans-serif, system-ui, sans-serif; font-size: 0.68rem; white-space: nowrap; pointer-events: auto; }
.line-editor[hidden] { display: none; }
.line-editor strong { color: #7fb5fa; }
.line-editor > span { color: #858d8f; }
.line-editor a, .line-editor button { border: 0; background: transparent; color: #e6a65d; font: inherit; font-weight: 750; text-decoration: none; cursor: pointer; }
.line-editor select { border: 1px solid #464c4f; border-radius: 0.3rem; padding: 0.2rem 0.3rem; background: #101314; color: #d9ddde; font: inherit; }
.line-editor button { color: #ff9f91; }
.line-editor .line-editor-done { margin-left: 0.65rem; border: 1px solid #697175; border-radius: 0.3rem; padding: 0.3rem 0.65rem; background: #303537; color: #f4f1e8; }
.line-editor .line-editor-done:hover { background: #525a5e; color: #fff; }
.line-editor .line-editor-done:focus-visible { outline: 2px solid #e6a65d; outline-offset: 2px; }
.line-editor button[data-apply-whole-line], .line-editor button[data-apply-line-section], .line-editor button[data-clear-line-sections], .line-editor button[data-edit-line-details] { color: #e6a65d; }
.line-editor button.is-active { border-radius: 0.25rem; background: #c9802b; color: #171819; }
.line-save-status { position: absolute; z-index: 7; top: 0.2in; right: 0.25in; margin: 0; border-radius: 99px; padding: 0.3rem 0.55rem; background: rgba(20, 23, 25, 0.85); color: #61696c; font-family: ui-sans-serif, system-ui, sans-serif; font-size: 0.65rem; pointer-events: none; }
.line-save-status:empty { display: none; }
.shot-fields-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.shot-fields-pair.four-up { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.shot-modal { width: min(82rem, calc(100% - 2rem)); max-width: none; margin: auto; border: 1px solid #454a4d; border-radius: 0.55rem; padding: 0; background: #191b1c; color: #f4f1e8; box-shadow: 0 1.5rem 5rem rgba(0, 0, 0, 0.65); }
.shot-modal::backdrop { background: rgba(5, 7, 8, 0.72); }
.shot-modal form { display: grid; gap: 0.9rem; padding: 1rem; }
.shot-modal header { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; border-bottom: 1px solid #3a3e40; padding-bottom: 0.65rem; }
.shot-modal h2 { margin: 0; font-size: 1.15rem; }
.shot-modal header p { max-width: 60%; margin: 0; overflow: hidden; color: #858c8e; font-size: 0.7rem; text-overflow: ellipsis; white-space: nowrap; }
.shot-modal-hints { min-height: 1rem; margin-left: auto; text-align: right; }
.shot-modal-hints p { max-width: none !important; color: #8f9698 !important; font-weight: 650; }
.shot-modal-hints p[hidden] { display: none; }
.shot-modal-grid { display: grid; gap: 0.85rem; }
.shot-modal-row { display: grid; gap: 0.55rem; }
.shot-modal-primary { grid-template-columns: 5.5rem 10rem 5.5rem 6.5rem 9.5rem 8rem minmax(10rem, 1.3fr) 7.5rem 9rem; }
.shot-modal-secondary { grid-template-columns: minmax(18rem, 2fr) minmax(9rem, 1fr) minmax(24rem, 4fr); }
.shot-location-field { align-content: start; }
.shoot-location-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.45rem; }
.shoot-location-controls > [hidden] { display: none; }
.shot-modal .field { gap: 0.35rem; }
.shot-modal .field label { color: #a4aaac; font-size: 0.65rem; font-weight: 650; letter-spacing: 0.06em; text-transform: uppercase; }
.shot-modal .field input, .shot-modal .field select { min-width: 0; border-radius: 0.4rem; padding: 0.55rem 0.6rem; font-size: 0.8rem; }
.angle-qualifier-hint { color: #8f9698; font-size: 0.66rem; font-weight: 600; line-height: 1.35; }
.angle-qualifier-hint[hidden] { display: none; }
.modal-error { color: #e3a357; font-size: 0.72rem; }
.shot-modal footer { display: flex; justify-content: flex-end; gap: 0.65rem; padding-top: 0.5rem; }
.shot-modal footer button { font: inherit; cursor: pointer; }
.shot-modal footer .button { border: 1px solid #694c2b; }
.shot-modal footer .secondary-button { background: transparent; }

/* Shot list */
.shot-list-page { width: min(110rem, 100%); align-self: start; }
.shot-list-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; margin-bottom: 1rem; border: 1px solid #34383b; border-radius: 0.8rem; padding: 0.65rem 1rem; background: #1b1e20; }
.shot-list-summary { display: flex; align-items: center; gap: 0.7rem; margin: 0; }
.shot-list-summary div { display: flex; align-items: baseline; gap: 0.3rem; }
.shot-list-summary dt { color: #777f82; font-size: 0.68rem; text-transform: uppercase; }
.shot-list-summary dd { margin: 0; color: #d9ddde; font-size: 0.8rem; font-weight: 800; }
.shot-list-context { text-decoration: none; }
.shot-list-empty { display: grid; gap: 0.35rem; }
.shot-list-scenes { display: grid; gap: 1.75rem; }
.shot-scene-group { border: 1px solid #363a3d; border-radius: 0.8rem; overflow: hidden; background: #181b1d; }
.shot-scene-group > header { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.8rem; padding: 1rem 1.15rem; background: #222628; }
.shot-scene-group > header span { color: #e6a65d; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.shot-scene-group > header h2 { margin: 0; overflow: hidden; font-family: Georgia, "Times New Roman", serif; font-size: 1.25rem; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.shot-scene-group > header b { color: #8f9698; font-size: 0.75rem; }
.shot-list-columns, .shot-list-item > summary { display: grid; grid-template-columns: 5rem minmax(15rem, 2fr) minmax(10rem, 1fr) 6rem 1.5rem; align-items: center; gap: 0.8rem; }
.shot-list-columns { padding: 0.55rem 1rem; border-top: 1px solid #303537; border-bottom: 1px solid #303537; color: #727a7d; font-size: 0.68rem; font-weight: 750; letter-spacing: 0.06em; text-transform: uppercase; }
.shot-list-item { scroll-margin-top: 1rem; }
.shot-list-item + .shot-list-item { border-top: 1px solid #303537; }
.shot-list-item > summary { padding: 0.9rem 1rem; cursor: pointer; list-style: none; }
.shot-list-item > summary::-webkit-details-marker { display: none; }
.shot-list-item > summary:hover { background: #202426; }
.shot-list-item > summary b { color: #ff8d94; }
.shot-list-item > summary span { overflow: hidden; color: #d2d6d7; font-size: 0.85rem; text-overflow: ellipsis; white-space: nowrap; }
.shot-list-item > summary span + span { color: #8f9698; font-size: 0.76rem; }
.shot-list-item > summary em { border-radius: 99px; padding: 0.3rem 0.5rem; background: #2c3133; color: #afb5b7; font-size: 0.68rem; font-style: normal; text-align: center; text-transform: capitalize; }
.shot-list-item.status-ready > summary em { background: rgba(219, 152, 77, 0.14); color: #e6a65d; }
.shot-list-item.status-shot > summary em { background: rgba(104, 185, 132, 0.14); color: #86d6a1; }
.shot-list-item > summary i { color: #767e80; font-style: normal; transition: transform 120ms ease; }
.shot-list-item[open] > summary i { transform: rotate(180deg); }
.shot-edit-form { display: grid; gap: 1rem; border-top: 1px solid #343a3c; padding: 1.15rem; background: #141719; }
.shot-edit-form .shot-fields-pair:first-of-type { grid-template-columns: repeat(4, 1fr); }
.shot-anchor-copy { margin: 0; color: #777f82; font-size: 0.75rem; line-height: 1.5; }
.shot-edit-actions { display: flex; justify-content: space-between; gap: 1rem; }
.shot-edit-actions button { border: 0; border-radius: 0.5rem; padding: 0.7rem 0.95rem; background: #c9802b; color: #161718; font: inherit; font-weight: 750; cursor: pointer; }
.shot-edit-actions .danger-button { border: 1px solid #70443f; background: transparent; color: #ff9f91; }
@media (max-width: 1100px) and (min-width: 901px) {
    .shot-modal-primary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .shot-modal-secondary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .shot-notes-field { grid-column: span 2; }
}
@media (max-width: 640px) {
    .site-nav { padding: 0 1rem; }
    .site-nav nav a:first-child { display: none; }
    .section-heading { align-items: stretch; flex-direction: column; }
    .version-row { grid-template-columns: 1fr; }
    .status-pill { justify-self: start; }
    .scene-neighbors { grid-template-columns: 1fr; }
    .candidate-title { align-items: flex-start; flex-direction: column; }
    .shot-list-toolbar { align-items: stretch; flex-direction: column; }
    .shot-list-context { margin-left: 0; }
    .shot-list-summary { grid-template-columns: repeat(3, 1fr); }
    .shot-list-columns { display: none; }
    .shot-list-item > summary { grid-template-columns: 3.5rem minmax(0, 1fr) auto; }
    .shot-list-item > summary span + span { display: none; }
    .shot-list-item > summary i { display: none; }
    .shot-fields-pair, .shot-fields-pair.four-up, .shot-edit-form .shot-fields-pair:first-of-type { grid-template-columns: 1fr; }
    .shot-modal-primary, .shot-modal-secondary { grid-template-columns: 1fr; }
    .shot-notes-field { grid-column: auto; }
    .form-row { grid-template-columns: 1fr; }
    .auth-card { padding: 1.5rem; }
}
@media (max-width: 900px) {
    .reader-toolbar-primary { align-items: flex-start; flex-wrap: wrap; gap: 0.5rem; }
    .reader-context-link { order: 3; margin-left: 0; }
    .reader-document-actions { order: 4; width: 100%; justify-content: flex-start; }
    .reader-tag-menu { align-items: flex-start; }
    .scene-jump { align-self: stretch; grid-template-columns: auto 1fr; }
    .scene-jump > span { justify-self: end; }
    .reader-workspace { height: calc(100vh - 7.25rem); }
    .reader-body { grid-template-rows: auto minmax(0, 1fr); grid-template-columns: 1fr; }
    .scene-index-sizes { display: none; }
    .scene-index { display: flex; gap: 0.4rem; overflow-x: auto; overflow-y: hidden; }
    .scene-index-heading { display: none; }
    .scene-index > a { min-width: 12rem; }
    .screenplay-paper { --script-left-margin: 0.7in; width: calc(100% - 1rem); margin-top: 0.5rem; padding: 0.6in 0.55in 0.6in var(--script-left-margin); overflow-x: hidden; }
    .screenplay-paragraph.type-scene-heading::before { font-size: 20pt; }
    .lining-workspace { height: auto; min-height: calc(100vh - 7rem); }
    .lining-toolbar { align-items: stretch; flex-wrap: wrap; }
    .lining-shot-count { order: 1; }
    .lining-toolbar > .planning-nav { order: 2; }
    .lining-scene-jump { order: 3; flex: 1 1 100%; }
    .lining-scene-jump select { width: 100%; }
    .lining-tools { order: 4; margin-right: 0; }
    .lining-hint { order: 5; margin-left: 0; }
    .lining-scroll { min-height: 65vh; max-height: 70vh; }
    .shot-modal-primary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .shot-modal-secondary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .shot-notes-field { grid-column: span 2; }
}
@media (max-width: 640px) {
    .shot-modal-primary, .shot-modal-secondary { grid-template-columns: 1fr; }
    .shot-notes-field { grid-column: auto; }
}
@media (max-width: 1310.98px) {
    .site-nav, .shell { display: none; }
    .screen-width-warning {
        display: grid;
        min-height: 100vh;
        place-items: center;
        padding: 2rem;
        text-align: center;
    }
    .screen-width-warning p {
        width: min(38rem, 100%);
        margin: 0;
        border: 1px solid #4a5053;
        border-radius: 0.8rem;
        padding: 1.5rem;
        background: #1b1e20;
        color: #f4f1e8;
        box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.35);
        font-size: 1.05rem;
        font-weight: 700;
        line-height: 1.5;
    }
    .auth-page .screen-width-warning { display: none; }
    .auth-page .shell { display: grid; }
}

.reader-view-workspace .annotation-marker { cursor: default; }
.reader-view-workspace [data-annotation-layer][hidden],
.reader-view-workspace [data-annotation-marker-layer][hidden] { display: none; }
.reader-screenplay-paper.hide-numbering .scene-line-number,
.reader-screenplay-paper.hide-numbering .scene-page-eighths,
.reader-screenplay-paper.hide-numbering .type-scene-heading::before,
.reader-screenplay-paper.hide-numbering .reader-shot-line > b { visibility: hidden; }
.reader-screenplay-paper.hide-numbering .type-scene-heading { border-top-color: transparent; }
.reader-view-workspace .reader-toolbar-primary { flex-wrap: wrap; }

.shot-modal-lining { grid-template-columns: repeat(2, minmax(0, 12rem)); }
.shot-modal-lining[hidden] { display: none; }

.reader-pdf-link[aria-disabled="true"] { opacity: 0.65; cursor: progress; }
.reader-pdf-status { font-size: 0.8rem; color: #c7cbcc; }
.settings-link { display: inline-flex; align-items: center; justify-content: center; padding: 0.4rem; border-radius: 0.4rem; }
.settings-link:hover, .settings-link:focus-visible { background: #303537; color: #e6a65d; }
.settings-workspace { max-width: 52rem; margin: 1.5rem auto; }
.settings-card { border: 1px solid #3b4043; border-radius: 0.75rem; background: #191c1d; padding: 1.5rem; margin: 1.25rem 0; }
.settings-card h2 { margin-top: 0; }
.settings-card p { color: #a6adaf; line-height: 1.5; }
.settings-card label { display: block; font-weight: 700; margin-bottom: 0.6rem; }
.settings-card input[type="range"] { width: 100%; padding: 0; accent-color: #d08a2c; cursor: pointer; }
.settings-range-labels { display: flex; justify-content: space-between; font-size: 0.85rem; color: #a6adaf; margin: 0.6rem 0 1rem; }
.settings-card output { display: block; color: #e6a65d; font-weight: 700; }
.settings-save-status { font-size: 0.8rem; margin-bottom: 0; }
.settings-workspace > h1 { font: 750 2rem ui-sans-serif, system-ui, sans-serif; }
.settings-card select { min-width: 16rem; padding: 0.65rem; border: 1px solid #454d50; border-radius: 0.4rem; background: #131718; color: #f4f1e8; font: inherit; }
.category-row { grid-template-columns: minmax(0, 1fr) 10rem auto auto; }
.settings-card .category-row select, .settings-card .category-add select { min-width: 0; width: 10rem; padding: 0.5rem; }
.category-add { grid-template-columns: minmax(0, 1fr) 10rem auto; }
/* Shared workspace heading and control metrics. */
.reader-toolbar-primary, .shot-list-toolbar { min-height: 3.75rem; box-sizing: border-box; gap: 0.65rem; padding: 0.65rem 1rem; }
.planning-nav a, .planning-nav span, .reader-toolbar .planning-nav a, .reader-toolbar .planning-nav span { font-size: 0.88rem; line-height: 1; padding: 0.6rem 0.75rem; text-transform: none; }
.reader-tag-count, .lining-shot-count, .shot-list-count { flex: 0 0 5rem; font-size: 0.78rem; white-space: nowrap; }
.reader-toolbar-primary .reader-context-link, .shot-list-context { font-size: 0.78rem; }
.reader-toolbar-primary button, .reader-toolbar-primary input, .reader-toolbar-primary .reader-pdf-link { font-size: 0.78rem; line-height: 1.2; }
.scene-jump-controls { width: 7.5rem; min-width: 7.5rem; max-width: 7.5rem; }
.scene-jump-controls .scene-jump-options { min-width: 18rem; }
.scene-jump small:empty { display: none; }
.reader-toolbar-primary .reader-lining-toggle, .reader-toolbar-primary .reader-pdf-link { box-sizing: border-box; min-height: 2.2rem; padding: 0.5rem 0.7rem; }
.lining-workspace [data-annotation-marker-layer] { pointer-events: none; }
.lining-workspace [data-annotation-marker-layer] button { pointer-events: none; }
.lining-workspace [data-annotation-layer][hidden], .lining-workspace [data-annotation-marker-layer][hidden] { display: none; }
