/* Warm whiteboard by day; deep green chalkboard at night. */
:root {
  --display-font: "DM Sans", sans-serif;
}
.brand {
  font-family: var(--display-font);
  font-size: 29px;
  letter-spacing: -0.8px;
}
.film-heading h2 {
  font-family: var(--display-font);
  font-size: 31px;
  line-height: 1.4;
}
aside h1 {
  font-family: var(--display-font);
  font-size: 28px;
}
.scene-card h4,
.beat-card h4 {
  font-family: var(--display-font);
  font-size: 20px;
  line-height: 1.45;
}
.act-heading {
  font-family: var(--display-font);
  font-size: 20px;
}
.beat-num {
  font-family: var(--display-font);
  font-size: 27px;
}
.conflict {
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  line-height: 1.7;
}
.source-excerpt,
.setup,
.script-line {
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}
.scene-card {
  border-radius: 3px;
}
.scene-card:nth-child(3n + 1) {
  rotate: 0deg;
}
.scene-card:nth-child(3n + 2) {
  rotate: 0deg;
}
.scene-card:hover {
  rotate: 0deg;
}
.board {
  background-color: #f9f8f1;
  background-image: radial-gradient(#9baa942f 0.8px, transparent 0.8px);
}
#theme-toggle,
#language-toggle {
  background: transparent;
  color: inherit;
  border: 1px solid var(--border);
  min-width: 58px;
}
#language-toggle {
  font-family: "Vazirmatn", "DM Sans", sans-serif;
}
.header-actions {
  gap: 8px;
}
:root[data-theme="chalk"] {
  color-scheme: dark;
  color: #e9ecdf;
  background: #091a12;
  --green: #b5d4b8;
  --muted: #9bafa0;
  --border: #3e5048;
}
[data-theme="chalk"] body {
  background: #091a12;
}
[data-theme="chalk"] header,
[data-theme="chalk"] aside {
  background: #08170f;
  border-color: #35483d;
}
[data-theme="chalk"] .brand > span {
  color: #b0c9ad;
}
[data-theme="chalk"] .film-heading,
[data-theme="chalk"] .tab-bar,
[data-theme="chalk"] .draft-notes {
  background: #0c2117;
}
[data-theme="chalk"] .board {
  background-color: #0c2619;
  background-image:
    radial-gradient(ellipse at 20% 20%, #8fa58b0a, transparent 65%),
    repeating-linear-gradient(
      176deg,
      transparent 0px,
      transparent 4px,
      #b4c7a503 5px
    ),
    radial-gradient(#c5d3b71a 0.7px, transparent 0.7px);
  background-size:
    100% 100%,
    100% 100%,
    23px 23px;
}
[data-theme="chalk"] button {
  background: #293e32;
  border-color: #4b6050;
  color: #e0e9d8;
}
[data-theme="chalk"] button:hover {
  background: #3b5341;
}
[data-theme="chalk"] .header-actions #open-reader {
  background: #b6cfa7;
  color: #1c3223;
}
[data-theme="chalk"] .search-box {
  background: #1b2f25;
  border-color: #4e644f;
}
[data-theme="chalk"] .search-box input {
  color: #e6e9da;
}
[data-theme="chalk"] input::placeholder {
  color: #9bad96;
  opacity: 1;
}
[data-theme="chalk"] .search-box button {
  background: #344c3a;
  color: #d9e5cf;
}
[data-theme="chalk"] .movie-result,
[data-theme="chalk"] .film-star {
  background: none;
  border: 0;
}
[data-theme="chalk"] .movie-row.selected {
  background: #314935;
}
[data-theme="chalk"] .movie-result strong {
  color: #e1e8d5;
}
[data-theme="chalk"] .movie-result span,
[data-theme="chalk"] .film-heading p,
[data-theme="chalk"] .library-caption,
[data-theme="chalk"] #search > label,
[data-theme="chalk"] .source-note,
[data-theme="chalk"] .draft-notes summary,
[data-theme="chalk"] .text-empty {
  color: #a5b59a;
}
[data-theme="chalk"] .movie-result .prepared-tag {
  color: #b8d0a0;
}
[data-theme="chalk"] .film-star[aria-pressed="true"] {
  color: #e0c57d;
}
[data-theme="chalk"] .draft-notes summary span {
  color: #93a68a;
}
[data-theme="chalk"] .tab-bar [role="tab"] {
  background: none;
  color: #98ae92;
}
[data-theme="chalk"] .tab-bar [role="tab"][aria-selected="true"] {
  color: #e0e9d4;
  border-color: #d7c68f;
}
[data-theme="chalk"] .board-tools button {
  background: none;
}
[data-theme="chalk"] .beat-card {
  background: #183323;
  border: 1px solid #69836777;
  box-shadow: 1px 3px 0 #101e1633;
}
[data-theme="chalk"] .beat-card h4,
[data-theme="chalk"] .act-heading {
  color: #efe9ca;
}
[data-theme="chalk"] .beat-num {
  color: #b0bf99;
}
[data-theme="chalk"] .template-page {
  color: #bdc9ab;
  background: #3b5140;
}
[data-theme="chalk"] .beat-definition {
  color: #aabb9d;
}
[data-theme="chalk"] .reading {
  color: #d3dfc4;
}
[data-theme="chalk"] .scene-card {
  background: #28351e;
  border-color: #b7bd815c;
  box-shadow: 1px 4px 12px #0c171323;
}
[data-theme="chalk"] .act-row:nth-child(2) .scene-card {
  background: #15382b;
  border-color: #8bb4a663;
}
[data-theme="chalk"] .act-row:nth-child(3) .scene-card {
  background: #2a2938;
  border-color: #b4a2c366;
}
[data-theme="chalk"] .act-row:nth-child(4) .scene-card {
  background: #382b20;
  border-color: #c6a18066;
}
[data-theme="chalk"] .scene-card h4 {
  color: #f2e9c8;
}
[data-theme="chalk"] .card-meta,
[data-theme="chalk"] .note-label,
[data-theme="chalk"] .setup {
  color: #afbc9e;
}
[data-theme="chalk"] .source-excerpt,
[data-theme="chalk"] .scene-card .source-excerpt {
  color: #d9e1c9;
  border-color: #93ab7d;
}
[data-theme="chalk"] .conflict,
[data-theme="chalk"] .change {
  color: #e0e6d1;
}
[data-theme="chalk"] .conflict b {
  color: #edbc99;
}
[data-theme="chalk"] .change strong {
  color: #edce97;
}
[data-theme="chalk"] .source-link {
  color: #c2d8b0;
  border-color: #8ea777;
}
[data-theme="chalk"] .source-link:hover {
  color: #f1edca;
  border-color: #f1edca;
}
[data-theme="chalk"] .unprepared {
  background: #2a4033;
  color: #bacbad;
  border-color: #768e63;
}
[data-theme="chalk"] .line-toggle {
  background: #293f32;
}
[data-theme="chalk"] .line-toggle i {
  filter: brightness(1.4) saturate(0.75);
}
[data-theme="chalk"] .timeline-svg path {
  filter: brightness(1.4) saturate(0.75);
}
[data-theme="chalk"] .timeline-svg > text:not(.axis-label) {
  filter: brightness(1.4);
}
[data-theme="chalk"] .timeline-svg > line,
[data-theme="chalk"] .station line {
  stroke: #73876a;
  opacity: 0.5;
}
[data-theme="chalk"] .graph-label {
  fill: #d4dfc4;
}
[data-theme="chalk"] .axis-label {
  fill: #b0c1a0;
}
[data-theme="chalk"] .station circle {
  fill: #21382a;
  stroke: #e3e7cb;
}
[data-theme="chalk"] .reader,
[data-theme="chalk"] #reader-content {
  background: #0b1b13;
}
[data-theme="chalk"] .reader {
  border-color: #627451;
  box-shadow: 0 10px 45px #0b151355;
}
[data-theme="chalk"] .reader-handle {
  background: #10281b;
}
[data-theme="chalk"] .reader-name > span,
[data-theme="chalk"] .source-nav,
[data-theme="chalk"] #text-size {
  color: #a6b895;
}
[data-theme="chalk"] .reader-controls button {
  background: none;
}
[data-theme="chalk"] #pin-reader {
  background: #3b533b;
  color: #e3ebd5;
}
[data-theme="chalk"] .source-nav {
  border-color: #354b39;
}
[data-theme="chalk"] .source-nav input {
  background: #22352a;
  color: #e0ead3;
  border-color: #516749;
}
[data-theme="chalk"] .script-line {
  color: #d4deca;
}
[data-theme="chalk"] .line-number {
  color: #829478;
}
[data-theme="chalk"] .script-line.page-start {
  border-color: #4d6243;
}
[data-theme="chalk"] .script-line.target {
  background: #4c5030;
  color: #fff1bb;
  box-shadow: inset 3px 0 #ceba71;
}
[data-theme="chalk"] .stage.split #splitter {
  background: #4a6148;
}
[data-theme="chalk"] #toast {
  background: #d0debc;
  color: #223824;
}
[data-theme="chalk"] :focus-visible {
  outline-color: #e1cb8c;
}
[lang="fa"] body {
  font-family: "Vazirmatn", sans-serif;
}
[lang="fa"] {
  --display-font: "Vazirmatn", sans-serif;
}
[lang="fa"] .film-heading h2,
[lang="fa"] .reader-name h3 {
  font-family: "Vazirmatn", sans-serif;
}
[lang="fa"] .tab-bar [role="tab"] span {
  font-size: 12px;
}
[lang="fa"] .eyebrow,
[lang="fa"] .library-caption,
[lang="fa"] .note-label,
[lang="fa"] .prepared-tag {
  letter-spacing: 0;
}
[lang="fa"] .board {
  direction: ltr;
}
[lang="fa"] .beat-card,
[lang="fa"] .scene-card,
[lang="fa"] .act-heading {
  direction: rtl;
  text-align: right;
}
[lang="fa"] .source-excerpt,
[lang="fa"] .setup,
[lang="fa"] .reading,
[lang="fa"] .conflict,
[lang="fa"] .change {
  direction: ltr;
  text-align: left;
}
[lang="fa"] .beat-definition,
[lang="fa"] .text-empty,
[lang="fa"] .unprepared {
  direction: rtl;
}
[lang="fa"] .source-link {
  direction: ltr;
  unicode-bidi: plaintext;
}
[lang="fa"] #timeline,
[lang="fa"] #reader-content {
  direction: ltr;
  text-align: left;
}
[lang="fa"] .movie-result {
  text-align: right;
}
[lang="fa"] .movie-result strong,
[lang="fa"] .reader-name h3,
[lang="fa"] #board-title {
  direction: ltr;
  unicode-bidi: plaintext;
}
[lang="fa"] #source-location {
  margin-left: 0;
  margin-right: auto;
  direction: ltr;
}
[lang="fa"] .header-actions {
  direction: ltr;
}
[lang="fa"] #source-note {
  line-height: 2;
}
@media (max-width: 680px) {
  .brand {
    font-size: 25px;
  }
  .film-heading h2 {
    font-size: 26px;
  }
  #theme-toggle,
  #language-toggle {
    min-width: 0;
    padding: 7px 8px;
    font-size: 10px;
  }
  .header-actions {
    gap: 5px;
  }
  .header-actions #open-reader {
    font-size: 10px;
    padding: 8px;
  }
  .scene-card h4,
  .beat-card h4 {
    font-size: 20px;
  }
}
[lang="fa"] .template-page,
[lang="fa"] .card-meta {
  direction: ltr;
}
[lang="fa"] .act-heading {
  width: max-content;
  max-width: 100%;
}
[lang="fa"] .brand,
[lang="fa"] .scene-card h4 {
  font-family: "Vazirmatn", sans-serif;
}
[lang="fa"] .scene-card h4 {
  direction: ltr;
  text-align: left;
}
[lang="fa"] #board-meta,
[lang="fa"] #reader-id,
[lang="fa"] .movie-result > span {
  direction: ltr;
  unicode-bidi: isolate;
}
[lang="fa"] #source-location {
  direction: rtl;
  unicode-bidi: isolate;
}

/* Square notes keep their source link visible while details scroll within. */
.beats-grid {
  grid-template-columns: repeat(auto-fill, 320px);
}
.act-cards {
  grid-template-columns: repeat(10, 320px);
  align-items: start;
}
.scene-card,
.beat-card {
  width: 320px;
  height: 320px;
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 16px;
  rotate: 0deg;
}
.scene-card h4,
.beat-card h4 {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
  margin: 8px 0 10px;
  flex-shrink: 0;
}
.card-content {
  flex: 1;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding-right: 5px;
}
.card-content .source-excerpt {
  margin: 8px 0;
}
.scene-card > .source-link,
.beat-card > .source-link {
  flex-shrink: 0;
  align-self: flex-start;
  margin-top: 10px;
}
.scene-card > .card-meta,
.beat-card > .beat-top {
  flex-shrink: 0;
}
.film-heading h2 {
  font-size: 27px;
}
.brand {
  font-size: 25px;
  font-weight: 600;
}
aside h1 {
  font-size: 24px;
  font-weight: 500;
}
.act-heading {
  font-family: var(--display-font);
  font-size: 14px;
  font-weight: 500;
}
.conflict {
  font-family: "DM Sans", sans-serif;
  font-size: 11px;
}
[lang="fa"] .conflict,
[lang="fa"] .beat-card h4,
[lang="fa"] .scene-card h4,
[lang="fa"] .act-heading {
  font-family: "Vazirmatn", sans-serif;
}
[lang="fa"] .card-content {
  direction: rtl;
  padding-right: 0;
  padding-left: 5px;
}
[lang="fa"] .card-content .reading,
[lang="fa"] .card-content .source-excerpt,
[lang="fa"] .card-content .setup,
[lang="fa"] .card-content .conflict,
[lang="fa"] .card-content .change {
  direction: ltr;
}
@media (max-width: 680px) {
  .beats-grid {
    grid-template-columns: 320px;
  }
  .scene-card h4,
  .beat-card h4 {
    font-size: 16px;
  }
}
/* Compact cards keep their source link visible without an inner scrollbar. */
.scene-card .card-content { overflow: hidden; padding-right: 0; display:flex; flex-direction:column; gap:7px; }
.scene-card .card-description { font-size:13px; line-height:1.35; margin:0; }
.scene-card .source-excerpt { font-size:11px; line-height:1.35; margin:0; }
.scene-card .conflict { font-size:11px; line-height:1.3; margin:0; }
.scene-card .change { font-size:11px; line-height:1.3; margin:0; }
.scene-card .change strong { font-size:10px; }
.scene-card h4 { font-size:17px; line-height:1.2; }
.sentiment-controls { display:flex; gap:12px; align-items:center; margin:24px; }
.sentiment-controls select { background:var(--surface); color:inherit; border:1px solid currentColor; border-radius:6px; padding:7px; }
.sentiment-method { max-width:850px; margin:24px; font-size:13px; line-height:1.6; opacity:.7; }
.sentiment-series { margin:24px; direction:ltr; }
.sentiment-series h4 { margin-bottom:0; }
.sentiment-series svg { overflow:visible; }
.sentiment-series circle { cursor:pointer; }
.sentiment-series circle:focus { outline:2px solid currentColor; }