/* Editorial planning surfaces inherit the active template through workspace tokens. */
.tellingSectionHeading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.tellingSectionHeading h2 { margin: 0; font-size: 1.15rem; }
.tellingSectionHeading p { margin: .3rem 0 0; color: var(--tellingMuted); font-size: .82rem; }
.tellingApp .tellingSectionHeading .btn { flex-shrink: 0; font-size: .8rem; }
.telling-book-editor.tellingEnhancedBook > .telling-book-tabs { background: transparent; border: 0; }
.telling-book-editor.tellingEnhancedBook > .telling-book-tabs > .card-header { display: none; }
.telling-book-editor.tellingEnhancedBook > .telling-book-tabs > .card-body { padding: 0; }
.tellingCompactFilters { display: flex; align-items: center; flex-wrap: wrap; gap: .65rem; padding: .65rem 0; margin-bottom: .75rem; }
.tellingCompactFilters > .form-select { width: auto; min-width: 170px; max-width: 240px; }
.tellingSearchField { display: flex; align-items: center; gap: .6rem; position: relative; min-width: 220px; flex: 1; max-width: 440px; margin: 0; }
.tellingSearchField > i { position: absolute; left: .7rem; font-size: .8rem; color: var(--tellingMuted); }
.tellingApp .tellingSearchField .form-control { padding-left: 2rem; min-height: 34px; font-size: .83rem; }
.tellingFilterCount { font-size: .8rem; color: var(--tellingMuted); margin-left: auto; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tellingChapterColumnLabels, .tellingChapterRow { display: grid; grid-template-columns: minmax(240px, 1.8fr) minmax(155px, 1fr) 115px 90px 80px; gap: 1.15rem; align-items: start; }
.tellingChapterColumnLabels { padding: .6rem 1rem; font-size: .75rem; font-weight: 600; color: var(--tellingMuted); }
.tellingChapterPart { border: 1px solid var(--tellingBorder); border-radius: .5rem; overflow: hidden; margin-bottom: 1rem; background: var(--tellingSurface); }
.tellingPartHeading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .65rem 1rem; background: var(--tellingSubtle); }
.tellingPartHeading h3 { margin: 0; font-size: .87rem; font-weight: 600; }
.tellingPartHeading h3 > span { margin-right: .6rem; font-weight: 400; color: var(--tellingMuted); }
.tellingPartHeading > a { font-size: .76rem; white-space: nowrap; text-decoration: none; }
.tellingChapterRow { padding: 1.05rem 1rem; border-top: 1px solid var(--tellingBorder); }
.tellingChapterRow:hover { background: color-mix(in srgb, var(--tellingSubtle) 45%, var(--tellingSurface)); }
.tellingChapterStory { min-width: 0; }
.tellingChapterStory h4 { display: flex; gap: .65rem; align-items: baseline; margin: 0 0 .35rem; font: 600 1.05rem/1.4 Georgia, 'Times New Roman', serif; }
.tellingChapterStory h4 a { color: var(--tellingText); text-decoration: none; }
.tellingChapterStory h4 a:hover { color: var(--content-link, var(--bs-link-color)); text-decoration: underline; }
.tellingChapterNumber { font: 500 .73rem/1.4 var(--bs-body-font-family); color: var(--tellingMuted); font-variant-numeric: tabular-nums; flex-shrink: 0; padding-top: .1rem; }
.tellingChapterSynopsis, .tellingChapterStory .tellingMissingNote { font-size: .83rem; line-height: 1.55; margin: 0; color: var(--tellingMuted); }
.tellingSynopsisDetails { margin-top: .35rem; font-size: .8rem; }
.tellingSynopsisDetails summary { cursor: pointer; color: var(--content-link, var(--bs-link-color)); }
.tellingSynopsisDetails p { white-space: normal; margin: .5rem 0 0; }
.tellingChapterPeople { display: flex; align-items: start; flex-wrap: wrap; gap: .35rem; }
.tellingPersonLink { display: inline-block; background: var(--tellingSubtle); border: 1px solid var(--tellingBorder); color: var(--tellingText); padding: .15rem .4rem; border-radius: .3rem; font-size: .75rem; line-height: 1.6; text-decoration: none; overflow-wrap: anywhere; }
.tellingPersonLink:hover { border-color: var(--interactive-primary, var(--bs-primary)); color: var(--content-link, var(--bs-link-color)); }
.tellingMissingNote { color: var(--tellingMuted); font-size: .8rem; }
.tellingStatus { display: inline-flex; align-items: center; gap: .3rem; border-radius: .3rem; padding: .25rem .5rem; font-size: .73rem; background: var(--tellingSubtle); color: var(--tellingMuted); }
.tellingStatus[data-state="completed"] { color: var(--state-success-text, var(--bs-success-text-emphasis)); background: var(--state-success-surface, var(--bs-success-bg-subtle)); }
.tellingStatus[data-state="needs_review"] { color: var(--state-warning-text, var(--bs-warning-text-emphasis)); background: var(--state-warning-surface, var(--bs-warning-bg-subtle)); }
.tellingStatus[data-state="in_progress"] { color: var(--interactive-selected-text, var(--bs-primary)); background: var(--interactive-selected-surface, var(--bs-primary-bg-subtle)); }
.tellingChapterLength { display: flex; flex-direction: column; font-variant-numeric: tabular-nums; }
.tellingChapterLength strong { font-size: .92rem; font-weight: 600; }
.tellingChapterLength small { color: var(--tellingMuted); font-size: .72rem; }
.tellingApp .tellingWriteChapterLink { font-size: .75rem; padding-inline: .55rem; }
.tellingMobileFieldLabel { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.tellingChapterEmpty { padding: 1.2rem 1rem; margin: 0; color: var(--tellingMuted); font-size: .85rem; }

/* Characters are readable dossiers, not oversized accordion buttons. */
.tellingCharacterGrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: start; }
.tellingApp .tellingCharacterDossier { margin: 0; overflow: hidden; }
.tellingCharacterDossier.is-open { grid-column: 1 / -1; }
.tellingDossierHeader { display: flex; align-items: center; gap: .7rem; padding: 1rem 1rem .75rem; }
.tellingCharacterInitial { display: flex; align-items: center; justify-content: center; width: 38px; height: 42px; flex-shrink: 0; border-radius: .35rem; color: var(--tellingMuted); background: var(--tellingSubtle); border: 1px solid var(--tellingBorder); font: 1.2rem/1 Georgia, serif; }
.tellingDossierIdentity { flex: 1; min-width: 0; }
.tellingDossierIdentity h3 { margin: 0 0 .2rem; font: 600 1.12rem/1.3 Georgia, 'Times New Roman', serif; }
.tellingCharacterRole { font-size: .79rem; color: var(--content-link, var(--bs-link-color)); }
.tellingDossierIdentity small { color: var(--tellingMuted); font-size: .73rem; }
.tellingApp .tellingDossierHeader .btn { font-size: .75rem; padding: .3rem .55rem; flex-shrink: 0; }
.tellingDossierSummary { padding: 0 1rem 1rem; }
.tellingDossierSummary dl { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 0; }
.tellingDossierSummary dt { font-size: .74rem; font-weight: 600; margin-bottom: .3rem; }
.tellingDossierSummary dd { font-size: .82rem; line-height: 1.55; margin: 0; overflow-wrap: anywhere; }
.tellingCharacterAppearances { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin-top: .9rem; padding-top: .7rem; border-top: 1px solid var(--tellingBorder); }
.tellingCharacterAppearances > span { color: var(--tellingMuted); font-size: .74rem; margin-right: .25rem; }
.tellingCharacterMoreAppearances { font-size: .75rem; }
.tellingCharacterMoreAppearances[open] { flex-basis: 100%; }
.tellingCharacterMoreAppearances summary { cursor: pointer; color: var(--content-link, var(--bs-link-color)); }
.tellingCharacterMoreAppearances > div { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .5rem; }
.tellingCharacterDossier > .card-body { border-top: 1px solid var(--tellingBorder); background: var(--tellingSubtle); }
.tellingCharacterDossier [data-character-content] .form-label { font-size: .78rem; }
.tellingApp .tellingCharacterCreate .card-header { background: var(--tellingSubtle); }

/* Compact controls and autonomous chapter columns replace the oversized emotion matrix. */
.tellingApp.telling-emotions > .tellingPageHeader { margin-bottom: .9rem; }
.telling-emotions > .tellingHistory { padding: .6rem .8rem; }
.tellingEmotionFilters { margin-bottom: 0; }
.tellingEmotionFilters > .form-select { flex: 0 1 220px; }
.tellingEmotionFilters .tellingSearchField { max-width: none; }
.tellingFilterPopover { position: relative; flex-shrink: 0; }
.tellingFilterPopover > summary { display: flex; align-items: center; gap: .55rem; cursor: pointer; padding: .4rem .65rem; min-height: 34px; font-size: .8rem; border: 1px solid var(--tellingBorder); border-radius: .35rem; background: var(--tellingSurface); list-style: none; }
.tellingFilterPopover > summary::-webkit-details-marker { display: none; }
.tellingFilterPopover > summary > span { color: var(--tellingMuted); font-size: .72rem; }
.tellingFilterPopover > summary > i:last-child { font-size: .6rem; }
.tellingFilterOptions { position: absolute; top: calc(100% + .4rem); left: 0; z-index: 100; padding: .8rem; width: min(300px, 80vw); max-height: 320px; overflow: auto; border: 1px solid var(--tellingBorder); border-radius: .45rem; background: var(--surface-elevated, var(--bs-body-bg)); box-shadow: var(--shadow-md, none); }
.tellingFilterOptions p { font-size: .76rem; color: var(--tellingMuted); margin: 0 0 .7rem; }
.tellingFilterOptions label { display: flex; gap: .65rem; align-items: flex-start; padding: .4rem .1rem; font-size: .82rem; }
.tellingFilterOptions label small { display: block; color: var(--tellingMuted); font-size: .73rem; }
.tellingFilterOptions .btn { margin-top: .7rem; }
.tellingEmotionBoardMeta { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 30px; font-size: .73rem; color: var(--tellingMuted); }
.tellingEmotionBoardMeta [role="status"] { display: flex; align-items: center; gap: .5rem; }
.tellingEmotionBoardMeta [data-state="error"] { color: var(--state-danger-text, var(--bs-danger-text-emphasis)); }
.tellingEmotionKanban { min-width: 0; }
.tellingEmotionRosterBar { display: flex; align-items: center; flex-wrap: wrap; gap: .65rem; padding: .55rem 0 .9rem; }
.tellingEmotionRosterBar > span { font-size: .75rem; font-weight: 600; }
.tellingEmotionRosterBar > small { font-size: .72rem; color: var(--tellingMuted); margin-left: auto; }
.tellingEmotionRoster { display: flex; gap: .45rem; max-width: 100%; overflow-x: auto; padding-bottom: .2rem; }
.tellingEmotionPerson { display: flex; align-items: center; gap: .5rem; padding: .5rem; border: 1px solid var(--tellingBorder); border-radius: .35rem; background: var(--tellingSurface); cursor: grab; min-width: 0; }
.tellingEmotionInitial { display: flex; justify-content: center; align-items: center; flex: 0 0 25px; height: 28px; background: var(--tellingSubtle); border-radius: .25rem; font: .85rem Georgia, serif; color: var(--tellingMuted); }
.tellingEmotionIdentity { flex: 1; min-width: 0; }
.tellingEmotionIdentity strong { display: block; font-size: .8rem; font-weight: 600; overflow-wrap: anywhere; }
.tellingEmotionIdentity small { display: block; font-size: .7rem; color: var(--tellingMuted); overflow-wrap: anywhere; }
.tellingEmotionRosterChip { flex-shrink: 0; padding: .3rem .5rem; min-width: 100px; max-width: 180px; background: var(--tellingSurface); }
.tellingKanbanColumns { display: grid; grid-auto-flow: column; grid-auto-columns: 280px; gap: .85rem; overflow-x: auto; align-items: stretch; padding: .2rem .1rem .85rem; overscroll-behavior-x: contain; scrollbar-width: thin; }
.tellingKanbanColumn { display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--tellingBorder); border-radius: .5rem; background: var(--tellingSurface); overflow: hidden; }
.tellingKanbanHeader { padding: .8rem .9rem; border-bottom: 1px solid var(--tellingBorder); }
.tellingKanbanChapterNumber { display: block; font-size: .68rem; color: var(--tellingMuted); margin-bottom: .3rem; }
.tellingKanbanHeader h2 { font: 600 1rem/1.4 Georgia, 'Times New Roman', serif; margin: 0; }
.tellingKanbanSynopsis { margin-top: .4rem; font-size: .75rem; }
.tellingKanbanSynopsis > summary { cursor: pointer; color: var(--tellingMuted); }
.tellingKanbanSynopsis > p { margin: .5rem 0 0; font-size: .79rem; line-height: 1.5; max-height: 10rem; overflow-y: auto; white-space: pre-line; }
.tellingKanbanLanes { display: flex; flex-direction: column; gap: .6rem; padding: .65rem; flex: 1; background: var(--tellingSubtle); max-height: min(68dvh, 720px); overflow-y: auto; }
.tellingEmotionLane { position: relative; border: 1px solid var(--tellingBorder); background: var(--tellingSurface); border-radius: .35rem; padding: .55rem; }
.tellingEmotionLane h3 { display: flex; align-items: center; justify-content: space-between; gap: .5rem; font-size: .74rem; font-weight: 600; margin: 0 0 .5rem; color: var(--tellingMuted); }
.tellingLaneCount { font-weight: 400; font-variant-numeric: tabular-nums; }
.tellingEmotionCards { display: flex; flex-direction: column; gap: .4rem; min-height: 46px; }
.tellingLaneEmpty { position: absolute; left: .55rem; top: 2.7rem; font-size: .7rem; color: var(--tellingMuted); margin: 0; pointer-events: none; }
.tellingEmotionPersonActions { display: flex; flex-direction: column; gap: .1rem; }
.tellingApp .tellingEmotionPersonActions .btn { min-height: 25px; min-width: 26px; border-color: transparent; font-size: .68rem; padding: .1rem; }
.tellingApp .tellingKanbanAssign { margin: .65rem; font-size: .76rem; }
.tellingEmotionCards .sortable-ghost { opacity: .3; border-style: dashed; }

@media (max-width: 991.98px) {
    .tellingChapterColumnLabels { display: none; }
    .tellingChapterRow { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: .75rem; }
    .tellingChapterStory { grid-column: 1 / -1; }
    .tellingChapterPeople { grid-column: 1 / -1; }
    .tellingMobileFieldLabel { position: static; width: auto; height: auto; overflow: visible; clip-path: none; display: block; flex-basis: 100%; margin-bottom: .15rem; font-size: .7rem; color: var(--tellingMuted); }
    .tellingWriteChapterLink { align-self: end; }
    .tellingCharacterGrid { grid-template-columns: 1fr; }
}
@media (max-width: 575.98px) {
    .tellingSectionHeading { align-items: flex-start; gap: .6rem; flex-wrap: wrap; }
    .tellingCompactFilters { gap: .5rem; }
    .tellingCompactFilters > .form-select { flex: 1; min-width: 130px; }
    .tellingSearchField { min-width: 100%; max-width: none; }
    .tellingChapterRow { padding: .85rem .75rem; }
    .tellingPartHeading { padding: .6rem .75rem; }
    .tellingPartHeading > a { font-size: .7rem; }
    .tellingDossierHeader, .tellingDossierSummary { padding-inline: .8rem; }
    .tellingDossierSummary dl { grid-template-columns: 1fr; gap: .8rem; }
    .tellingDossierHeader { flex-wrap: wrap; }
    .tellingEmotionFilters .tellingSearchField { order: 3; }
    .tellingEmotionFilters > .btn { order: 4; }
    .tellingFilterOptions { left: auto; right: 0; }
    .tellingEmotionRosterBar > small { margin: 0; }
    .tellingEmotionRoster { flex-basis: 100%; }
    .tellingKanbanColumns { grid-auto-columns: min(82vw, 280px); }
    .tellingEmotionBoardMeta { gap: .5rem; font-size: .69rem; }
}