/* Module: narrative
   Includes shared editor styles used in #route-narrative, #route-notes and #route-script. */


/* Extracted from core/utilities.css (phase 2, conservative) */
#route-narrative :is(.panel,.route-main){
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  padding: 0;
  isolation: isolate;
  min-height: 0;
  overflow-x: hidden;
}#route-narrative :is(.panel,.route-main) .sticky{
  position: sticky;
  top: 0;
  z-index: 40;
  margin: 0 0 8px;
  padding: 8px 10px 6px;
  background: var(--surface);
  backdrop-filter: none;
  box-shadow: 0 8px 18px rgba(0,0,0,.28);
  border-bottom: 1px solid var(--border);
  overflow-x: hidden;
}#route-narrative :is(.panel,.route-main) .sticky::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--surface);
}#route-narrative .narrative-form{
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  height: 100%;
  min-height: 0;
  padding: 0 10px 10px;
}#route-narrative .narrative-header-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:32px;
  margin:0 0 6px;
}#route-narrative .narrative-page-title{
  margin:0;
}#route-narrative .narrative-header-main{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  align-items:end;
  gap:12px;
}#route-narrative .narrative-poster-wrap{
  min-width:0;
}#route-narrative .narrative-poster-frame{
  width:clamp(190px, 21vw, 320px);
  border-radius:0;
  position:relative;
}#route-narrative .narrative-poster-controls{
  position:absolute;
  top:6px;
  right:6px;
  display:flex;
  align-items:center;
  gap:4px;
  z-index:2;
}#route-narrative .narrative-poster-{
  width:30px;
  min-width:30px;
  height:30px;
  min-height:30px;
  padding:0;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:.8rem;
  line-height:1;
  letter-spacing:0;
  background:rgba(26,23,20, .88);
  border:1px solid rgba(101, 132, 189, .34);
  color:var(--text-secondary);
  box-shadow:none;
  transition:background-color .16s ease, border-color .16s ease, color .16s ease;
}#route-narrative .narrative-poster-:hover{
  background:rgba(32, 51, 83, .94);
  border-color:rgba(131, 164, 224, .5);
  color:var(--text-primary);
}#route-narrative .narrative-poster-.btn-danger.red{
  background:rgba(102, 41, 41, .9);
  border-color:rgba(231, 120, 120, .28);
  color:#ffdede;
}#route-narrative .narrative-poster-.btn-danger.red:hover{
  background:rgba(124, 49, 49, .94);
  border-color:rgba(243, 142, 142, .45);
  color:#fff0f0;
}#route-narrative .narrative-poster-:disabled{
  opacity:.52;
  cursor:not-allowed;
}#route-narrative .narrative-poster- .ms-action-icon-svg{
  width:14px;
  height:14px;
}#route-narrative .narrative-series-meta{
  min-width:0;
  text-align:right;
  align-self:end;
}#route-narrative .narrative-series-meta-title{
  margin:0 0 2px;
}#route-narrative .narrative-series-meta-note{
  margin-bottom:4px;
}#route-narrative .narrative-series-meta-row{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:center;
  gap:6px;
}#route-narrative .narrative-series-meta-dates{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:center;
  gap:6px;
  margin-top:4px;
}#route-narrative .narrative-series-meta-label{
  margin-left:6px;
}#route-narrative :is(.two-pane,.route-body){
  grid-template-columns:minmax(0, 1fr);
}#route-narrative .narrative-inline-nav-pane{
  margin-top:6px;
  padding:6px;
  border:1px solid color-mix(in srgb, var(--border) 84%, white 16%);
  border-radius:0;
  background:
    var(--ms-color-surface-primary);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
  max-width:100%;
  min-width:0;
  overflow:hidden;
}#route-narrative .narrative-inline-nav-label{
  margin:0;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}#route-narrative .narrative-inline-nav-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:6px;
}#route-narrative .narrative-inline-nav-actions{
  position:relative;
  display:flex;
  align-items:center;
}#route-narrative .narrative-inline-add-btn{
  min-height:30px;
  padding:0 10px;
  font-size:.78rem;
  letter-spacing:.04em;
  text-transform:uppercase;
}#route-narrative .narrative-preset-menu{
  position:absolute;
  top:calc(100% + 6px);
  right:0;
  min-width:220px;
  z-index:50;
  display:grid;
  gap:4px;
  padding:6px;
  border:1px solid rgba(95,125,176,.45);
  background:var(--menu-bg, #101a2b);
  box-shadow:0 12px 24px rgba(0,0,0,.38);
}#route-narrative .narrative-preset-menu[hidden]{
  display:none;
}#route-narrative .narrative-preset-menu-item{
  min-height:34px;
  border:1px solid transparent;
  background:transparent;
  color:#e8effd;
  text-align:left;
  padding:0 10px;
  font-weight:700;
}#route-narrative .narrative-preset-menu-item:hover{
  background:rgba(84,81,158,.24);
  border-color:rgba(95,125,176,.4);
}#route-narrative .narrative-preset-menu-item[disabled]{
  opacity:.45;
  pointer-events:none;
}#route-narrative .narrative-inline-nav-scroll{
  display:flex;
  align-items:flex-start;
  gap:6px;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  overflow-y:hidden;
  flex-wrap:nowrap;
  padding-bottom:1px;
}#route-narrative .narrative-inline-nav-scroll .narrative-nav-group{
  display:flex;
  align-items:center;
  gap:6px;
  margin:0;
  padding:4px;
  min-width:max-content;
  flex:0 0 auto;
  border:1px solid color-mix(in srgb, var(--border) 84%, white 16%);
  border-radius:0;
  background:
    var(--ms-color-surface-primary);
}#route-narrative .narrative-inline-nav-scroll .narrative-nav-group[data-preset-id="credits_production"]{
  border-color:rgba(94,131,198,.62);
  background:
    var(--ms-color-surface-primary);
}#route-narrative .narrative-inline-nav-scroll .narrative-nav-group[data-preset-id="description"]{
  border-color:rgba(85,164,132,.58);
  background:
    var(--ms-color-surface-primary);
}#route-narrative .narrative-inline-nav-scroll .narrative-nav-group[data-preset-id="philosophy"]{
  border-color:rgba(188,146,79,.54);
  background:
    var(--ms-color-surface-primary);
}#route-narrative .narrative-inline-nav-scroll .narrative-nav-group[data-preset-id="visual_style"]{
  border-color:rgba(167,102,176,.6);
  background:
    var(--ms-color-surface-primary);
}#route-narrative .narrative-inline-nav-scroll .narrative-nav-group-title{
  margin:0;
  padding:0;
  white-space:nowrap;
  border-radius:0;
  display:inline-flex;
  align-items:center;
  gap:4px;
  background:transparent;
}#route-narrative .narrative-inline-nav-scroll .narrative-nav-group-head{
  display:flex;
  align-items:center;
  gap:0;
}#route-narrative .narrative-nav-group-remove{
  width:18px;
  height:18px;
  border:0;
  background:transparent;
  color:#9fb7dd;
  font-weight:800;
  line-height:1;
  border-radius:0;
  margin-right:2px;
  padding:0;
}#route-narrative .narrative-nav-group-remove:hover{
  border-color:transparent;
  color:#ffc2c2;
  background:rgba(228,39,36,.18);
}/* @254 nav-item base rimosso — coperto dal blocco 2-id underline */
#route-narrative .narrative-inline-nav-scroll .narrative-nav-item-label{
  display:inline-block;
}#route-narrative .narrative-inline-nav-scroll .narrative-nav-item-close{
  display:inline-flex;
  width:16px;
  height:16px;
  align-items:center;
  justify-content:center;
  border-radius:0;
  color:#97afd5;
  line-height:1;
  font-size:.82rem;
  cursor:pointer;
}#route-narrative .narrative-inline-nav-scroll .narrative-nav-item-close .ms-action-icon-svg{
  width:14px;
  height:14px;
}#route-narrative .narrative-inline-nav-scroll .narrative-nav-item-close:hover{
  background:rgba(228,39,36,.18);
  color:#ffc4c4;
}#route-narrative .narrative-sections-empty{
  min-height:34px;
  display:flex;
  align-items:center;
  padding:0 10px;
  border:1px dashed rgba(95,125,176,.45);
  background:rgba(14,23,39,.54);
  white-space:nowrap;
}@media (max-width: 980px){
#route-narrative .narrative-inline-nav-pane{
    padding:8px;
  }#route-narrative .narrative-inline-nav-scroll .narrative-nav-group{
    gap:4px;
  }#route-narrative .narrative-header-main{
    grid-template-columns:1fr;
    align-items:start;
  }#route-narrative .narrative-series-meta{
    text-align:left;
  }#route-narrative .narrative-series-meta-row,
  #route-narrative .narrative-series-meta-dates{
    justify-content:flex-start;
  }#route-narrative .narrative-poster-controls{
    right:4px;
    top:4px;
  }
}#route-narrative .narrative-panel-card{
  display: none;
  grid-column: 1 / -1;
  width: 100%;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
}#route-narrative .narrative-panel-card.is-active{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-content: start;
}#route-narrative .narrative-panel-card .section-title{
  margin: 0;
  grid-column: 1 / -1;
  padding: 8px 0 6px;
}#route-narrative .narrative-panel-card .field{
  margin-bottom: 0;
}#route-narrative .narrative-panel-card .span-2{
  grid-column: 1 / -1;
}#route-narrative .narrative-panel-card.narrative-single-textarea .field{
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}#route-narrative .narrative-panel-card.narrative-single-textarea.is-active{
  grid-template-rows: auto minmax(0, 1fr);
  min-height: calc(100% - 2px);
  overflow: hidden;
}#route-narrative .narrative-panel-card.narrative-single-textarea .field .label{
  display:none;
}/* box navy .textarea/.narrative-rich-editor rimosso — inerte (textarea display:none inline; rich-editor trasparente da blocco editoriale) */
#route-narrative .narrative-toolbar-host{
  margin-top: 6px;
  border: 0;
  border-radius:0;
  background: transparent;
  padding:0;
}#route-narrative .narrative-toolbar-host[hidden]{
  display:none;
}#route-narrative .narrative-toolbar-host .narrative-text-toolbar{
  border:0;
  padding:0 0 6px;
  margin:0;
}#route-narrative .narrative-toolbar-host .narrative-tool-btn,
#route-narrative .narrative-toolbar-host .narrative-tool-select,
#route-narrative .narrative-toolbar-host .narrative-tool-color{
  border-radius:0;
}#route-narrative :is(.two-pane,.route-body){
  grid-template-columns: minmax(0, 1fr) !important;
}#route-narrative :is(.panel,.route-main) .sticky{
  margin: 0 !important;
  padding: 8px 0 0 !important;
  background: var(--workspace-panel-bg, #1f2430) !important;
  background-image: none !important;
  box-shadow: none !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 74%, black 26%) !important;
}#route-narrative .narrative-header-bar,
#route-narrative .narrative-header-main,
#route-narrative .narrative-inline-nav-pane,
#route-narrative .narrative-toolbar-host{
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}#route-narrative .narrative-form{
  padding: 0 !important;
}#route-narrative .narrative-inline-nav-pane{
  margin-top: 4px !important;
  padding: 4px 0 !important;
  border: 0 !important;
}#route-narrative .narrative-text-toolbar{
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  margin: 0 !important;
  padding: 0 0 6px !important;
}#route-narrative .narrative-panel-card{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}#route-narrative .narrative-panel-card.is-active{
  padding: 0 !important;
}#route-narrative .narrative-panel-card.narrative-single-textarea .field{
  padding: 0 !important;
  margin: 0 !important;
}/* box navy editor (!important) rimosso — inerte: rich-editor reso trasparente dal blocco editoriale/2-id (vince per ordine/specificità) */
#route-narrative .narrative-form{
  padding: var(--ui-space-12) !important;
}#route-narrative :is(.panel,.route-main) .sticky{
  padding: var(--ui-space-12) !important;
}#route-narrative .narrative-panel-card.is-active{
  padding: var(--ui-space-12) !important;
}#route-narrative .narrative-inline-nav-pane{
  margin-top: 0 !important;
  padding: var(--ui-space-12) !important;
}#route-narrative .narrative-panel-card.narrative-single-textarea .field .textarea,
#route-narrative .narrative-panel-card.narrative-single-textarea .field .narrative-rich-editor{
  padding: var(--ui-space-12) !important;
}#route-narrative .narrative-inline-nav-pane{
  margin-top:6px !important;
  padding:8px 0 6px !important;
  border:0 !important;
}#route-narrative .narrative-inline-nav-topbar{
  display:flex !important;
  justify-content:flex-end !important;
  align-items:center !important;
  margin:0 0 8px !important;
}#route-narrative .narrative-inline-nav-label{
  position:relative;
  display:flex;
  align-items:center;
}#route-narrative .narrative-inline-add-btn{
  min-height:30px !important;
  padding:0 10px !important;
  border-radius:8px !important;
  border:1px solid rgba(99,126,176,.56) !important;
  background:rgba(18,29,47,.7) !important;
  color:#e4edff !important;
  letter-spacing:.02em !important;
  text-transform:none !important;
}#route-narrative .narrative-inline-add-btn:hover{
  border-color:rgba(132,164,226,.66) !important;
  background:rgba(30,45,71,.82) !important;
}#route-narrative .narrative-inline-nav-scroll{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  column-gap:14px !important;
  row-gap:8px !important;
  width:100%;
  min-width:0;
  max-width:100%;
  overflow-x:auto;
  overflow-y:visible !important;
  padding:0 0 2px !important;
  scrollbar-gutter:stable both-edges;
}#route-narrative .narrative-nav-row-break{
  order:2;
  flex:0 0 100%;
  height:0;
  margin:0;
  padding:0;
  pointer-events:none;
}#route-narrative .narrative-nav-group{
  display:contents !important;
}#route-narrative .narrative-nav-group-head{
  order:1;
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:6px;
}#route-narrative .narrative-nav-subadd-btn{
  order:3;
  width:auto !important;
  min-height:34px;
  margin:0 !important;
  padding:0 11px !important;
  border-radius:10px !important;
  border:1px dashed rgba(112,146,209,.64) !important;
  background:rgba(26,23,20,.52) !important;
  color:var(--text-primary) !important;
  font-size:1rem !important;
  font-weight:700 !important;
  line-height:1 !important;
}#route-narrative .narrative-nav-subadd-btn:hover{
  border-color:rgba(139,172,233,.84) !important;
  background:rgba(36,32,28,.78) !important;
  color:var(--text-primary) !important;
}#route-narrative .narrative-nav-subadd-btn:focus-visible{
  outline:2px solid rgba(126,162,229,.72);
  outline-offset:2px;
  border-radius:10px !important;
}#route-narrative .narrative-nav-add-slot{
  order:1;
  flex:0 0 auto;
  position:relative;
  display:flex;
  align-items:center;
  align-self:flex-start;
  padding-top:2px;
}#route-narrative .narrative-nav-add-btn{
  width:auto !important;
  min-height:34px;
  margin:0 !important;
  padding:0 11px !important;
  border-radius:10px !important;
  border:1px dashed rgba(112,146,209,.64) !important;
  background:rgba(26,23,20,.52) !important;
  box-shadow:none !important;
  color:var(--text-primary) !important;
  font-size:1rem !important;
  font-weight:700 !important;
  line-height:1 !important;
}#route-narrative .narrative-nav-add-btn:hover{
  border-color:rgba(139,172,233,.84) !important;
  background:rgba(36,32,28,.78) !important;
  color:var(--text-primary) !important;
}#route-narrative .narrative-nav-add-btn:focus-visible{
  outline:2px solid rgba(126,162,229,.72);
  outline-offset:2px;
  border-radius:10px !important;
}#route-narrative .narrative-nav-group-title{
  appearance:none;
  border:0 !important;
  background:transparent !important;
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:color-mix(in srgb, var(--text) 74%, transparent) !important;
  margin:0;
  padding:6px 2px 9px !important;
  border-bottom:3px solid transparent !important;
  border-radius:0 !important;
  font-size:clamp(1.05rem, 1.2vw, 1.18rem);
  font-weight:700;
  line-height:1.1;
  cursor:pointer;
  white-space:nowrap;
}#route-narrative .narrative-nav-group-progress{
  /* contatore sotto-tab (es. 1/7) — stile quiet UNICO (ex 4 blocchi pill/dark) */
  display:inline-flex;
  align-items:center;
  min-height:auto;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--text-muted, var(--text-tertiary, #8f9aac));
  font-size:.68rem;
  font-weight:760;
  letter-spacing:.08em;
  line-height:1;
}#route-narrative .narrative-nav-group-title:hover{
  color:color-mix(in srgb, var(--text) 92%, white 8%) !important;
}#route-narrative .narrative-nav-group-title:focus-visible{
  outline:2px solid rgba(134,164,229,.72);
  outline-offset:2px;
}#route-narrative .narrative-nav-group.is-active .narrative-nav-group-title,
#route-narrative .narrative-nav-group-title.is-active{
  color:var(--text-primary) !important;
  border-bottom-color:var(--control) !important;
}#route-narrative .narrative-nav-group.is-active .narrative-nav-group-progress,
#route-narrative .narrative-nav-group-title.is-active .narrative-nav-group-progress{
  color:var(--text-secondary);
}#route-narrative .narrative-nav-item{
  /* solo props vive; visual/hover/active governati dal blocco 2-id underline */
  order:3;
  margin:0 !important;
  line-height:1.15;
  white-space:nowrap;
}#route-narrative .narrative-nav-item.is-hidden-by-preset{
  display:none !important;
}#route-narrative .narrative-nav-item-close{
  width:15px !important;
  height:15px !important;
  border-radius:999px !important;
  font-size:.76rem !important;
}#route-narrative .narrative-nav-item-close .ms-action-icon-svg{
  width:14px !important;
  height:14px !important;
}#route-narrative .narrative-nav-item-close:hover{
  background:rgba(228,39,36,.2) !important;
}#route-narrative .narrative-sections-empty{
  order:4;
  flex:0 0 100%;
  min-height:34px;
  display:flex;
  align-items:center;
  border:1px dashed rgba(95,125,176,.45) !important;
  border-radius:10px;
  background:rgba(14,23,39,.54) !important;
  padding:0 10px;
}#route-narrative .narrative-toolbar-host{
  margin-top:4px !important;
  padding:0 !important;
  position:relative;
  z-index:90;
}#route-narrative .narrative-toolbar-host .narrative-text-toolbar{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:6px !important;
  border:0 !important;
  background:transparent !important;
  padding:0 0 8px !important;
  margin:0 !important;
  overflow:visible !important;
}#route-narrative .narrative-nav-add-slot .narrative-preset-menu{
  top:calc(100% + 8px);
  right:0;
  left:auto;
  min-width:240px;
  z-index:1400;
}#route-narrative :is(.panel,.route-main),
#route-narrative :is(.panel,.route-main) .sticky,
#route-narrative .narrative-inline-nav-pane{
  overflow:visible !important;
}/* box editor legacy (monospace/navy) rimosso — stile editoriale unico de-scoped sopra */
#route-narrative .narrative-rich-editor-wrap{
  position:relative;
}#route-narrative .narrative-rich-editor-wrap .narrative-text-toolbar.narrative-inline-text-toolbar{
  position:absolute;
  left:12px;
  right:12px;
  bottom:12px;
  z-index:35;
  border:1px solid var(--border) !important;
  border-radius:12px !important;
  background:rgba(15,29,54,.56) !important;
  padding:8px !important;
  margin:0 !important;
  box-shadow:0 12px 24px rgba(0,0,0,.34);
}#route-narrative .narrative-rich-editor-wrap .narrative-text-toolbar.narrative-inline-text-toolbar[hidden]{
  display:none !important;
}#route-narrative .narrative-rich-editor-wrap .narrative-tool-btn,
#route-narrative .narrative-rich-editor-wrap .narrative-tool-select,
#route-narrative .narrative-rich-editor-wrap .narrative-tool-color{
  border-radius:10px !important;
}#route-narrative .narrative-rich-editor.is-inline-toolbar-active{
  padding-bottom:72px !important;
}#route-narrative .narrative-toolbar-host{
  display:none !important;
}@media (max-width: 980px){
#route-narrative .narrative-inline-nav-scroll{
    column-gap:10px !important;
    row-gap:6px !important;
  }#route-narrative .narrative-nav-group-title{
    font-size:1rem;
  }
}#route-narrative .narrative-panel-card.narrative-single-textarea.is-active{
  display:flex !important;
  flex-direction:column !important;
  flex:1 1 auto !important;
  min-height:0 !important;
  height:100% !important;
}#route-narrative .narrative-panel-card.narrative-single-textarea.is-active .field{
  display:flex !important;
  flex-direction:column !important;
  flex:1 1 auto !important;
  min-height:0 !important;
}#route-narrative .narrative-panel-card.narrative-single-textarea.is-active .narrative-rich-editor-wrap{
  position:relative;
  display:flex !important;
  flex-direction:column !important;
  flex:1 1 auto !important;
  min-height:0 !important;
}#route-narrative .narrative-panel-card.narrative-single-textarea.is-active .field .textarea,
#route-narrative .narrative-panel-card.narrative-single-textarea.is-active .field .narrative-rich-editor{
  flex:1 1 auto !important;
  min-height:0 !important;
  height:100% !important;
  border-radius:12px !important;
}#route-narrative :is(.panel,.route-main){
  overflow-y:auto !important;
  overflow-x:hidden !important;
  min-height:0 !important;
}#route-narrative :is(.panel,.route-main) .sticky,
#route-narrative .narrative-inline-nav-pane{
  overflow:visible !important;
}#route-narrative .narrative-form{
  flex:1 1 auto !important;
  min-height:0 !important;
}


/* Extracted: shared narrative/notes/script editor baseline */
/* === Steps: allineamento visuale con Narrative/Personaggi === */:is(#route-narrative, #route-notes) .narrative-panel-card.narrative-single-textarea .field .narrative-rich-editor{
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  border: 1px solid color-mix(in srgb, var(--border) 78%, black 22%);
  background: var(--entity-name-bg, var(--editor-field-bg, #101a2b));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--border) 36%, transparent 64%);
}:is(#route-narrative, #route-notes, #route-script) .narrative-text-toolbar{
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px;
  margin-bottom: 2px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(15,29,54,.56);
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-btn{
  border: 1px solid var(--border-2);
  background: rgba(35,66,119,.56);
  color: #deebff;
  border-radius: 10px;
  padding: 7px 11px;
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.1;
  cursor: pointer;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-btn:hover{
  border-color: var(--control);
  background: rgba(51,94,170,.72);
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-btn{
  width: 42px;
  padding: 7px 0;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}:is(#route-narrative, #route-notes, #route-script) .align-icon{
  display: inline-block;
  width: 16px;
  height: 12px;
  /* Icon glyph construction: keep gradient lines as vector-like strokes. */
  background:
    linear-gradient(currentColor, currentColor) 0 0 / 100% 2px no-repeat,
    linear-gradient(currentColor, currentColor) 0 5px / 86% 2px no-repeat,
    linear-gradient(currentColor, currentColor) 0 10px / 100% 2px no-repeat;
  opacity: .95;
}:is(#route-narrative, #route-notes, #route-script) .align-icon.align-center{
  background:
    linear-gradient(currentColor, currentColor) 50% 0 / 100% 2px no-repeat,
    linear-gradient(currentColor, currentColor) 50% 5px / 70% 2px no-repeat,
    linear-gradient(currentColor, currentColor) 50% 10px / 100% 2px no-repeat;
}:is(#route-narrative, #route-notes, #route-script) .align-icon.align-right{
  background:
    linear-gradient(currentColor, currentColor) 100% 0 / 100% 2px no-repeat,
    linear-gradient(currentColor, currentColor) 100% 5px / 86% 2px no-repeat,
    linear-gradient(currentColor, currentColor) 100% 10px / 100% 2px no-repeat;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-select{
  border: 1px solid var(--border-2);
  background: rgba(35,66,119,.56);
  color: #deebff;
  border-radius: 10px;
  padding: 7px 11px;
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.1;
  min-width: 160px;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-select:focus{
  outline: none;
  border-color: var(--control);
  box-shadow: 0 0 0 2px rgba(79,124,255,.24);
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-color{
  min-height: 35px;
  border: 1px solid var(--border-2);
  background: rgba(35,66,119,.56);
  color: #deebff;
  border-radius: 10px;
  padding: 4px 9px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-color:hover{
  border-color: var(--control);
  background: rgba(51,94,170,.72);
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-color-label{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  font-size: .78rem;
  font-weight: 800;
  opacity: .95;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-color-input{
  width: 24px;
  height: 24px;
  padding: 0;
  border: 1px solid rgba(8, 13, 23, .58);
  border-radius: 6px;
  background: transparent;
  cursor: pointer;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-color-input::-webkit-color-swatch-wrapper{
  padding: 0;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-color-input::-webkit-color-swatch{
  border: 0;
  border-radius: 4px;
}/* Textarea pulite: niente scrollbar interne, si espandono in altezza */.narrative-form .textarea{
  width: 100%;
  overflow: hidden;        /* nasconde la scroll interna */
  resize: none;            /* niente “angolino” di resize */
  min-height: 96px;        /* base comoda; cambia a piacere */
  line-height: 1.4;
  font-size: var(--ms-font-editor, var(--editor-font-size, 16px));
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor{
  white-space: pre-wrap;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor:focus{
  outline: none;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor h1{
  font-size: var(--ms-font-h1, var(--typo-title-size, 34px));
  margin: .2em 0;
  line-height: 1.2;
  font-weight: var(--ms-font-weight-strong);
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor h2{
  font-size: var(--ms-font-h2, var(--typo-heading-size, 26px));
  margin: .2em 0;
  line-height: 1.25;
  font-weight: var(--ms-font-weight-strong);
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor h3{
  font-size: var(--ms-font-h3, var(--typo-subheading-size, 22px));
  margin: .2em 0;
  line-height: 1.3;
  font-weight: var(--ms-font-weight-strong);
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor h4{
  font-size: var(--ms-font-h4, 18px);
  margin: .2em 0;
  line-height: 1.35;
  font-weight: 700;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor blockquote{
  margin: .5em 0;
  padding-left: .8em;
  border-left: 3px solid var(--accent-3);
  color: var(--muted);
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor [style*="text-align:left"]{
  text-align: left;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor [style*="text-align:center"]{
  text-align: center;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor [style*="text-align:right"]{
  text-align: right;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor [style*="text-align:justify"]{
  text-align: justify;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor code{
  padding: .1em .35em;
  border: 1px solid var(--border-2);
  border-radius: 6px;
  background: rgba(20, 35, 58, .8);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .95em;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor span[data-fs="small"]{
  font-size: .9em;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor span[data-fs="base"]{
  font-size: 1em;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor span[data-fs="large"]{
  font-size: 1.2em;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor span[data-fs="xlarge"]{
  font-size: 1.4em;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor span[data-fc]{
  color: inherit;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor span[data-hl]{
  border-radius: .2em;
  padding: .04em .16em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}:is(#route-narrative, #route-notes, #route-script) .narrative-rich-editor pre{
  margin: .5em 0;
  padding: .6em .7em;
  border: 1px solid var(--border-2);
  border-radius: 8px;
  background: rgba(20, 35, 58, .8);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  overflow: auto;
}/* opzionale: variante più compatta per le note brevi */.narrative-form .textarea[data-compact]{
  min-height: 72px;
}


/* Extracted: shared narrative/notes/script toolbar actions */
/* === Narrative: Asana-like sections nav + minimal text toolbar === */:is(#route-narrative, #route-notes, #route-script) .narrative-tool-divider{
  width:1px;
  height:20px;
  background:color-mix(in srgb, var(--border) 78%, transparent);
  margin:0 2px;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-btn{
  min-width:30px;
  min-height:30px;
  border-radius:8px !important;
  border:1px solid rgba(91,121,173,.54) !important;
  background:rgba(18,30,48,.74) !important;
  color:#d8e5fb !important;
  padding:0 9px !important;
  font-size:.88rem;
  font-weight:700;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-btn:hover{
  border-color:rgba(126,162,229,.76) !important;
  background:rgba(36,53,82,.88) !important;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-btn{
  width:30px !important;
  padding:0 !important;
  justify-content:center;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-plus-btn{
  width:auto !important;
  min-width:30px !important;
  min-height:34px !important;
  margin:0 !important;
  padding:0 11px !important;
  border-radius:10px !important;
  border:1px dashed rgba(112,146,209,.64) !important;
  background:rgba(26,23,20,.52) !important;
  color:var(--text-primary) !important;
  font-size:1rem !important;
  line-height:1 !important;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-plus-btn:hover{
  border-color:rgba(139,172,233,.84) !important;
  background:rgba(36,32,28,.78) !important;
  color:var(--text-primary) !important;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-plus-btn:focus-visible{
  outline:2px solid rgba(126,162,229,.72);
  outline-offset:2px;
  border-radius:10px !important;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-color{
  min-height:30px !important;
  border-radius:8px !important;
  border:1px solid rgba(91,121,173,.54) !important;
  background:rgba(18,30,48,.74) !important;
  padding:0 7px !important;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-color:hover{
  border-color:rgba(126,162,229,.76) !important;
  background:rgba(36,53,82,.88) !important;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-color-input{
  width:18px !important;
  height:18px !important;
  border-radius:4px !important;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-insert-wrap{
  position:relative;
  z-index:120;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-insert-wrap[open]{
  z-index:130;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-insert-wrap > summary{
  list-style:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-insert-wrap > summary::-webkit-details-marker{
  display:none;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-insert-menu{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  z-index:1400;
  width:240px;
  display:grid;
  gap:2px;
  padding:8px;
  border:1px solid rgba(92,122,173,.62);
  border-radius:12px;
  background:rgba(26,23,20,.98);
  box-shadow:0 20px 32px rgba(0,0,0,.42);
}/* evita clipping del menu Insert nel blocco sticky */:is(#route-narrative, #route-notes, #route-script) .narrative-tool-insert-title{
  margin:1px 2px 6px;
  font-size:.8rem;
  color:#98accf;
  font-weight:700;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-menu-item{
  min-height:32px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:#e3edff;
  display:flex;
  align-items:center;
  gap:10px;
  text-align:left;
  padding:0 10px;
  font-size:.95rem;
  font-weight:650;
  cursor:pointer;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-menu-ico{
  width:16px;
  height:16px;
  flex:0 0 16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#9fb7dd;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-menu-ico svg{
  width:16px;
  height:16px;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-menu-item:hover .narrative-tool-menu-ico{
  color:#d5e5ff;
}:is(#route-narrative, #route-notes, #route-script) .narrative-tool-menu-item:hover{
  border-color:rgba(92,122,173,.56);
  background:rgba(35,51,79,.72);
}/* Narrative editors like Script editor (visual + focus behavior) */@media (max-width: 980px){
:is(#route-narrative, #route-notes, #route-script) .narrative-tool-insert-menu{
    width:min(260px, calc(100vw - 48px));
  }
}

/* Narrative redesign: cover hero + Netflix-like sub tiles */
#route-narrative .narrative-header-main{
  position:relative;
  display:block !important;
  margin:0 0 10px !important;
}
#route-narrative .narrative-poster-wrap{
  width:100% !important;
  min-width:0;
}
#route-narrative .narrative-poster-frame{
  width:100% !important;
  min-height:clamp(280px, 34vw, 440px);
  aspect-ratio:auto !important;
  border-radius:18px !important;
  border:1px solid rgba(96, 126, 182, .36) !important;
  overflow:hidden !important;
  position:relative !important;
  background:#060b13 !important;
  box-shadow:0 18px 40px rgba(0, 0, 0, .34);
}
#route-narrative .narrative-poster-frame > .poster{
  position:absolute !important;
  inset:0;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  filter:saturate(1.08) contrast(1.05);
}
#route-narrative .narrative-poster-frame::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(94deg, rgba(2, 4, 10, .92) 0%, rgba(2, 4, 10, .72) 34%, rgba(2, 4, 10, .24) 72%, rgba(2, 4, 10, .08) 100%);
  pointer-events:none;
}
#route-narrative .narrative-poster-frame::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(180deg, rgba(2, 4, 10, .32) 0%, rgba(2, 4, 10, .04) 40%, rgba(2, 4, 10, .56) 100%);
  pointer-events:none;
}
#route-narrative .narrative-poster-frame.is-empty-cover > .poster{
  opacity:.22;
}
#route-narrative .narrative-cover-overlay{
  position:relative;
  z-index:2;
  width:min(980px, 100%);
  min-height:clamp(280px, 34vw, 440px);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  padding:18px 18px 20px;
}
#route-narrative .narrative-header-bar{
  min-height:0 !important;
  margin:0 !important;
}
#route-narrative .narrative-brand-lockup{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  max-width:min(860px, 100%);
}
#route-narrative .narrative-series-logo{
  display:block;
  max-width:clamp(180px, 30vw, 360px);
  max-height:118px;
  width:auto;
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 8px 14px rgba(0, 0, 0, .45));
}
#route-narrative .narrative-logo-controls{
  display:flex;
  align-items:center;
  gap:6px;
}
#route-narrative .narrative-logo-{
  width:30px;
  min-width:30px;
  height:30px;
  min-height:30px;
  padding:0;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(15, 24, 39, .72);
  border:1px solid rgba(106, 136, 193, .46);
  color:var(--text-secondary);
}
#route-narrative .narrative-logo-:hover{
  background:rgba(26,23,20, .86);
  border-color:rgba(134, 165, 224, .6);
  color:#f1f6ff;
}
#route-narrative .narrative-logo-.btn-danger.red{
  background:rgba(102, 41, 41, .84);
  border-color:rgba(231, 120, 120, .38);
  color:#ffe3e3;
}
#route-narrative .narrative-logo-.btn-danger.red:hover{
  background:rgba(124, 49, 49, .92);
  border-color:rgba(243, 142, 142, .54);
  color:#fff0f0;
}
#route-narrative .narrative-logo-:disabled{
  opacity:.5;
  cursor:not-allowed;
}
#route-narrative .narrative-logo- .ms-action-icon-svg{
  width:14px;
  height:14px;
}
#route-narrative .narrative-brand-lockup .narrative-page-title{
  margin:0;
  font-size:clamp(1.35rem, 2.8vw, 2.15rem);
  line-height:1.08;
  font-weight:800;
  letter-spacing:.01em;
  color:#f7f9ff;
  text-shadow:0 10px 20px rgba(0, 0, 0, .45);
}
#route-narrative .narrative-series-logo:not([hidden]) + .narrative-page-title{
  display:none;
}
#route-narrative.is-series-logo-missing .narrative-brand-lockup .narrative-page-title{
  display:block;
}
#route-narrative .narrative-series-meta{
  min-width:0;
  max-width:min(900px, 100%);
  text-align:left !important;
  align-self:flex-start !important;
}
#route-narrative .narrative-series-meta-title{
  margin:0 0 4px;
  color:#f3f7ff;
  font-size:1.02rem;
  font-weight:760;
}
#route-narrative .narrative-series-meta-note{
  margin:0 0 8px;
  color:rgba(229, 236, 255, .86);
}
#route-narrative .narrative-series-meta-facts{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:0 0 8px;
}
#route-narrative .narrative-series-meta-facts .pill{
  background:rgba(9, 16, 28, .68);
  border:1px solid rgba(115, 147, 207, .52);
  color:var(--text-secondary);
}
#route-narrative .narrative-series-meta-summary{
  margin:0 0 10px;
  color:rgba(225, 234, 252, .9);
  max-width:min(900px, 100%);
  display:block;
  overflow:visible;
  white-space:normal;
}
#route-narrative .narrative-series-meta-row,
#route-narrative .narrative-series-meta-dates{
  justify-content:flex-start !important;
  align-items:center;
  gap:8px;
  color:rgba(223, 232, 251, .94);
}
#route-narrative .narrative-series-meta-dates > span{
  white-space:nowrap;
}
#route-narrative .narrative-series-meta-label{
  margin-left:8px;
}
#route-narrative .narrative-series-meta .pill{
  background:rgba(12, 20, 34, .72);
  border-color:rgba(115, 147, 207, .54);
  color:var(--text-secondary);
}
#route-narrative .narrative-poster-controls{
  top:12px !important;
  right:12px !important;
  z-index:4 !important;
}

#route-narrative .narrative-inline-nav-pane{
  margin-top:2px !important;
  padding:6px 0 2px !important;
  border:0 !important;
  background:transparent !important;
}
#route-narrative .narrative-inline-nav-scroll{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:flex-start !important;
  column-gap:12px !important;
  row-gap:8px !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  padding:0 0 6px !important;
  overflow:visible !important;
}
#route-narrative .narrative-nav-row-break{
  order:2;
  flex:0 0 100%;
  height:0;
  margin:0;
  padding:0;
  display:block !important;
}
#route-narrative .narrative-nav-group{
  display:contents !important;
}
#route-narrative .narrative-nav-group-head{
  order:1;
  display:flex;
  align-items:center;
  gap:6px;
}
#route-narrative .narrative-nav-group-title{
  appearance:none;
  margin:0 !important;
  padding:7px 10px !important;
  border-radius:999px !important;
  border:0 !important;
  background:rgba(16, 26, 42, .62) !important;
  color:#cfddf6 !important;
  font-size:.9rem;
  font-weight:720;
  line-height:1;
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
#route-narrative .narrative-nav-group.is-active .narrative-nav-group-title,
#route-narrative .narrative-nav-group-title.is-active{
  background:rgba(40, 62, 98, .84) !important;
  color:var(--text-primary) !important;
}
/* (blocco "tile" base @1276 rimosso — geometria/visual coperte dal 2-id; struttura migrata lì) */
/* (gradienti ::before/::after del vecchio "tile" rimossi — nascosti dal 2-id display:none) */
#route-narrative .narrative-nav-item.is-active .narrative-nav-item-label{
  color:#fff;
  text-shadow:0 2px 6px rgba(0, 0, 0, .55);
}
#route-narrative .narrative-nav-item.is-hidden-by-preset{
  display:none !important;
}
#route-narrative .narrative-nav-item-label{
  position:relative;
  z-index:2;
  display:block;
  width:100%;
  max-width:100%;
  color:#f4f8ff;
  font-size:.88rem;
  font-weight:700;
  line-height:1.2;
  white-space:normal !important;
}
#route-narrative .narrative-nav-item-close{
  position:absolute;
  top:8px;
  right:8px;
  z-index:3;
  width:18px !important;
  height:18px !important;
  border-radius:999px !important;
  background:rgba(8, 13, 22, .58);
  border:1px solid rgba(145, 171, 221, .36);
  color:#d5e5ff !important;
}
#route-narrative .narrative-nav-item-close:hover{
  background:rgba(170, 38, 38, .58) !important;
  border-color:rgba(244, 148, 148, .55);
  color:#fff4f4 !important;
}
#route-narrative .narrative-nav-subadd-btn,
#route-narrative .narrative-nav-add-btn{
  width:26px !important;
  min-width:26px !important;
  min-height:26px !important;
  height:26px !important;
  padding:0 !important;
  border-radius:999px !important;
  border:0 !important;
  background:rgba(29, 46, 74, .72) !important;
  font-size:.82rem !important;
  line-height:1 !important;
}
#route-narrative .narrative-nav-subadd-btn{
  display:none !important;
}
#route-narrative .narrative-nav-add-slot{
  order:1;
  flex:0 0 auto;
  display:flex;
  align-items:center;
  align-self:flex-start;
  padding-top:0 !important;
}

@media (max-width: 980px){
  #route-narrative .narrative-poster-frame{
    min-height:240px;
  }
  #route-narrative .narrative-cover-overlay{
    min-height:240px;
    padding:14px 14px 16px;
  }
  #route-narrative .narrative-nav-item{
    width:clamp(138px, 36vw, 188px) !important;
    flex-basis:clamp(138px, 36vw, 188px);
  }
}
@media (max-width: 640px){
  #route-narrative .narrative-poster-frame{
    min-height:210px;
  }
  #route-narrative .narrative-cover-overlay{
    min-height:210px;
    gap:10px;
  }
  #route-narrative .narrative-series-logo{
    max-width:220px;
    max-height:78px;
  }
  #route-narrative .narrative-nav-item{
    width:clamp(128px, 62vw, 180px) !important;
    flex-basis:clamp(128px, 62vw, 180px);
  }
}

/* Scroll behavior: cover + tabs + content must move together */
#route-narrative :is(.panel,.route-main){
  display:block !important;
  grid-template-rows:none !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}
#route-narrative :is(.panel,.route-main) .sticky{
  position:relative !important;
  top:auto !important;
  z-index:1 !important;
}
#route-narrative .narrative-form{
  display:block !important;
  height:auto !important;
  min-height:0 !important;
}

/* Narrative: no inner scrolling in rich-text subsections */
#route-narrative .narrative-panel-card.narrative-single-textarea.is-active{
  display:block !important;
  height:auto !important;
  min-height:0 !important;
}
#route-narrative .narrative-panel-card.narrative-single-textarea.is-active .field,
#route-narrative .narrative-panel-card.narrative-single-textarea.is-active .narrative-rich-editor-wrap{
  display:block !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
}
#route-narrative .narrative-panel-card.narrative-single-textarea.is-active .field .textarea,
#route-narrative .narrative-panel-card.narrative-single-textarea.is-active .field .narrative-rich-editor{
  height:auto !important;
  min-height:180px !important;
  max-height:none !important;
}
#route-narrative .narrative-rich-editor.textarea,
#route-narrative .narrative-panel-card.narrative-single-textarea .field .narrative-rich-editor{
  overflow:visible !important;
}

/* Narrative header: remove residual shadow from main hero area */
#route-narrative .narrative-header-main,
#route-narrative .narrative-poster-frame{
  box-shadow:none !important;
}

/* -------------------------------------------------------------------------- */
/* Narrative Editorial Transformation v1 — dark mode only                     */
/* -------------------------------------------------------------------------- */
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative{
  /* alias dei token editoriali promossi nel design system (single source of truth) */
  --narrative-editorial-accent:var(--editorial-accent, var(--accent-editorial, #9fb78f));
  --narrative-editorial-line:var(--editorial-line, var(--line-soft, rgba(139, 157, 188, .18)));
  --narrative-editorial-line-quiet:var(--editorial-line-quiet, var(--line-quiet, rgba(139, 157, 188, .1)));
  --narrative-route-canvas:var(--editorial-canvas, var(--surface-raised, var(--workspace-panel-bg, #101722)));
  background:var(--narrative-route-canvas) !important;
  background-color:var(--narrative-route-canvas) !important;
  background-image:none !important;
}

#workspaceMain.workspace-main > #route-narrative.route-page{
  background:var(--narrative-route-canvas, var(--surface-raised, var(--workspace-panel-bg, #101722))) !important;
  background-color:var(--narrative-route-canvas, var(--surface-raised, var(--workspace-panel-bg, #101722))) !important;
  background-image:none !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative :is(.panel,.route-main){
  background:var(--narrative-route-canvas, var(--surface-raised, #101722)) !important;
  background-color:var(--narrative-route-canvas, var(--surface-raised, #101722)) !important;
  background-image:none !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative :is(.panel,.route-main) .sticky{
  padding:16px 18px 10px !important;
  background:var(--narrative-route-canvas, var(--surface-raised, #101722)) !important;
  border-bottom:1px solid var(--narrative-editorial-line-quiet) !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-header-main{
  margin:0 0 14px !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-poster-frame{
  min-height:clamp(320px, 36vw, 500px);
  border:1px solid var(--narrative-editorial-line) !important;
  border-radius:12px !important;
  background:var(--surface-raised, #101722) !important;
  box-shadow:none !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-poster-frame::before{
  background:
    linear-gradient(92deg, rgba(5, 8, 15, .94) 0%, rgba(5, 8, 15, .74) 38%, rgba(5, 8, 15, .24) 74%, rgba(5, 8, 15, .08) 100%);
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-poster-frame::after{
  background:
    linear-gradient(180deg, rgba(5, 8, 15, .16) 0%, transparent 44%, rgba(5, 8, 15, .66) 100%);
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-cover-overlay{
  width:min(1040px, 100%);
  min-height:clamp(320px, 36vw, 500px);
  padding:clamp(24px, 3.3vw, 48px);
  gap:22px;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-brand-lockup{
  gap:14px;
  max-width:min(920px, 100%);
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-brand-lockup .narrative-page-title{
  max-width:min(820px, 100%);
  font-size:clamp(2.45rem, 5.2vw, 5.7rem);
  line-height:.96;
  font-weight:760;
  letter-spacing:-.015em;
  color:var(--text-primary, #f4f7ff);
  text-shadow:0 16px 52px rgba(0, 0, 0, .5);
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-series-logo{
  max-width:clamp(260px, 36vw, 520px);
  max-height:150px;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-series-meta{
  max-width:min(880px, 100%);
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-series-meta-title{
  margin:0 0 10px;
  color:var(--text-secondary, #b8c7df);
  font-size:.72rem;
  font-weight:760;
  letter-spacing:.16em;
  line-height:1.2;
  text-transform:uppercase;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-series-meta-facts{
  gap:12px;
  margin:0 0 14px;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-series-meta .pill,
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-series-meta-facts .pill,
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-series-meta-dates .pill{
  min-height:auto;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent !important;
  color:var(--text-secondary, #b8c7df);
  font-size:.76rem;
  font-weight:690;
  letter-spacing:.045em;
  line-height:1.25;
  text-transform:uppercase;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-series-meta-summary{
  max-width:min(780px, 100%);
  margin:0 0 16px;
  color:var(--text-primary, #f4f7ff);
  font-size:clamp(1rem, 1.35vw, 1.22rem);
  line-height:1.6;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-series-meta-dates{
  gap:10px;
  color:var(--text-muted, #8f9aac);
  font-size:.73rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-inline-nav-pane{
  margin-top:0 !important;
  padding:0 0 2px !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-inline-nav-scroll{
  column-gap:24px !important;
  row-gap:10px !important;
  align-items:center !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-nav-group-title{
  min-height:34px;
  padding:8px 0 10px !important;
  border:0 !important;
  border-bottom:2px solid transparent !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--text-secondary, #b8c7df) !important;
  font-size:clamp(.92rem, 1vw, 1.02rem);
  font-weight:720;
  letter-spacing:.01em;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-nav-group-title:hover{
  color:var(--text-primary, #f4f7ff) !important;
  background:transparent !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-nav-group.is-active .narrative-nav-group-title,
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-nav-group-title.is-active{
  background:transparent !important;
  color:var(--text-primary, #f4f7ff) !important;
  border-bottom-color:var(--narrative-editorial-accent) !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-nav-item{
  width:auto !important;
  flex:0 0 auto;
  height:auto !important;
  min-height:30px !important;
  max-height:none !important;
  padding:4px 0 7px !important;
  border:0 !important;
  border-bottom:1px solid transparent !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:var(--text-muted, #8f9aac) !important;
  transform:none !important;
  transition:color .22s ease, border-color .22s ease, opacity .22s ease;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-nav-item::before,
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-nav-item::after{
  display:none !important;
}

/* @1654 hover/active (dark) rimossi — governati dal blocco 2-id underline */
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-nav-item-label{
  font-size:.86rem;
  font-weight:660;
  line-height:1.25;
  color:currentColor !important;
  white-space:nowrap !important;
  text-shadow:none !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-form{
  padding:22px 22px 34px !important;
  background:var(--narrative-route-canvas, var(--surface-raised, #101722));
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-panel-card.is-active{
  gap:18px 22px;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-panel-card .section-title{
  position:relative;
  margin:0 0 4px;
  padding:0 0 16px;
  color:var(--text-primary, #f4f7ff);
  font-size:clamp(1.65rem, 2.1vw, 2.35rem);
  font-weight:760;
  line-height:1.08;
  letter-spacing:-.01em;
  border-bottom:1px solid var(--narrative-editorial-line-quiet);
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-panel-card .field{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:0;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-panel-card .label{
  margin:0;
  color:var(--text-muted, #8f9aac);
  font-size:.72rem;
  font-weight:760;
  letter-spacing:.13em;
  line-height:1.2;
  text-transform:uppercase;
}

/* Campi editoriali (input + editor) — stile underline UNICO per dark e light
   (de-scoped; token globali --editorial-*; vedi design-system.css .field-editorial) */
#route-narrative .narrative-panel-card :is(.input,.textarea),
#route-narrative .narrative-rich-editor.textarea,
#route-narrative .narrative-panel-card.narrative-single-textarea .field .narrative-rich-editor{
  border:0 !important;
  border-bottom:1px solid var(--editorial-line) !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--text-primary, #f4f7ff) !important;
  box-shadow:none !important;
  padding:12px 0 14px !important;
  font-family:inherit !important;
  font-size:clamp(.98rem, 1vw, 1.06rem) !important;
  line-height:1.65 !important;
}

#route-narrative .narrative-panel-card .textarea,
#route-narrative .narrative-rich-editor.textarea{
  min-height:180px !important;
}

#route-narrative .narrative-panel-card.narrative-single-textarea .field .textarea,
#route-narrative .narrative-panel-card.narrative-single-textarea .field .narrative-rich-editor{
  min-height:360px !important;
}

#route-narrative .narrative-panel-card :is(.input,.textarea)::placeholder,
#route-narrative .narrative-rich-editor.textarea:empty::before{
  color:var(--text-muted, #8f9aac);
}

#route-narrative .narrative-panel-card :is(.input,.textarea):focus,
#route-narrative .narrative-rich-editor.textarea:focus{
  border-bottom-color:var(--editorial-accent) !important;
  outline:0 !important;
  box-shadow:0 1px 0 0 var(--editorial-accent) !important;
}

/* Narrative cleanup: remove section close chrome and route-only bottom gap. */
#route-narrative :is(.narrative-nav-item-close,.narrative-nav-group-remove,[data-nav-remove-target]){
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative :is(.narrative-nav-add-slot,.narrative-nav-add-btn,.narrative-nav-subadd-btn){
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

/* contatore sotto-tab completate (es. 1/7) — riattivato, stile quiet da riga ~1678 */

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-poster-controls{
  opacity:.86;
  transition:opacity .22s ease;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative :is(.narrative-poster-frame:hover,.narrative-poster-frame:focus-within) .narrative-poster-controls,
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-poster-controls:focus-within{
  opacity:1;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-poster-{
  width:auto;
  min-width:32px;
  border-color:var(--line-soft, rgba(160, 178, 212, .18)) !important;
  background:color-mix(in srgb, var(--surface-raised, #101722) 82%, transparent) !important;
  color:var(--text-secondary, #b8c7df) !important;
  box-shadow:none !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative #posterUpload.narrative-poster-{
  gap:7px;
  padding:0 11px;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative #posterDelete.narrative-poster-{
  width:32px;
  min-width:32px;
  opacity:.72;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-poster-action-label{
  display:inline-flex;
  align-items:center;
  color:currentColor;
  font-size:.72rem;
  font-weight:740;
  letter-spacing:.02em;
  line-height:1;
  white-space:nowrap;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-poster-:hover,
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-poster-:focus-visible{
  border-color:var(--line-visible, rgba(160, 178, 212, .32)) !important;
  background:var(--state-hover-bg, rgba(160, 178, 212, .10)) !important;
  color:var(--text-primary, #f4f7ff) !important;
}

body:has(#route-narrative) #workspaceMain.workspace-main{
  padding-bottom:0 !important;
}

body:has(#route-narrative) #workspaceMain.workspace-main > #route-narrative.route-page{
  padding-bottom:0 !important;
}

:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-form{
  padding-bottom:10px !important;
}

/* (blocco "DS 3.5 pill" sotto-tab rimosso — interamente sovrascritto dal 2-id underline) */


/* ════════════════════════════════════════════════════════════════
   NARRATIVE — refinements (conservativi, no rotture di layout)
   ════════════════════════════════════════════════════════════════ */

/* Card: niente ombre */
#route-narrative .narrative-panel-card{ box-shadow:none !important; }

/* Input & editor: si MANTIENE lo stile editoriale a sottolineatura della baseline
   (trasparente, bordo inferiore, focus accento) — lo stesso "bello" di Crediti.
   Niente box scuri. Per l'editor solo un filo di respiro verticale per la scrittura. */
#route-narrative .narrative-rich-editor.textarea,
#route-narrative .narrative-panel-card.narrative-single-textarea .field .narrative-rich-editor{
  min-height:260px !important;
  line-height:1.75 !important;
}

/* TAB di sezione: sottolineatura editoriale (solo sull'head, layout invariato) */
#route-narrative .narrative-nav-group-head{
  position:relative;
}
#route-narrative .narrative-nav-group:is(.is-active,.is-current,[aria-current="page"],[aria-selected="true"],.active) .narrative-nav-group-head::after{
  content:"";
  position:absolute;
  left:2px; right:2px; bottom:0;
  height:2px;
  background:var(--accent);
  border-radius:2px;
}

/* Tag serie colorati per ruolo: Anno=blu · Genere=viola · Episodi=ambra */
#route-narrative .narrative-series-meta-facts #n_coverYear{
  color:#9DB7E0 !important;
  border-color:color-mix(in srgb, var(--control) 55%, transparent) !important;
  background:color-mix(in srgb, var(--control) 16%, color-mix(in srgb, var(--bg-base) 58%, transparent)) !important;
}
#route-narrative .narrative-series-meta-facts #n_coverGenre{
  color:#C2B6F5 !important;
  border-color:color-mix(in srgb, var(--accent) 55%, transparent) !important;
  background:color-mix(in srgb, var(--accent) 16%, color-mix(in srgb, var(--bg-base) 58%, transparent)) !important;
}
#route-narrative .narrative-series-meta-facts #n_coverEpisodes{
  color:#D9BE8E !important;
  border-color:color-mix(in srgb, var(--warning) 55%, transparent) !important;
  background:color-mix(in srgb, var(--warning) 16%, color-mix(in srgb, var(--bg-base) 58%, transparent)) !important;
}


/* ════ NARRATIVE — tipografia uniformata al sistema globale --type-* ════
   Stesso font/peso UI di Navbar e Sidebar per tab e voci; editor in font UI
   (niente monospace). Titoli di sezione restano display serif (intenzionale). */

/* Tab di sezione + sotto-tab + voci nav → ruolo LABEL UI (come Navbar/Sidebar) */
#route-narrative .narrative-nav-group-text,
#route-narrative .narrative-inline-nav-scroll .narrative-nav-item,
#route-narrative .narrative-nav-item-label{
  font-family:var(--font-ui, var(--font-sans)) !important;
  font-size:var(--type-label-size, 13px) !important;
  font-weight:var(--type-label-weight, 500) !important;
  letter-spacing:var(--type-label-spacing, 0) !important;
}

/* Editor di scrittura → ruolo BODY UI (Inter), niente monospace */
#route-narrative .narrative-rich-editor,
#route-narrative .narrative-rich-editor.textarea,
#route-narrative .narrative-panel-card.narrative-single-textarea .field .narrative-rich-editor{
  font-family:var(--font-ui, var(--font-sans)) !important;
  font-size:var(--type-body-size, 15px) !important;
  font-weight:var(--type-body-weight, 400) !important;
  line-height:var(--type-body-line, 1.65) !important;
}

/* Titoli di sezione → display serif uniforme */
#route-narrative .narrative-panel-card .section-title{
  font-family:var(--font-display, var(--font-serif)) !important;
  font-weight:var(--type-heading-weight, 600) !important;
}


/* ════ NARRATIVE — editor BOX uniforme (come Direttive). Batte narrative.css:1778
   (stile underline a 1,5,1) con stessa specificità (1,5,1) caricata DOPO. Solo rich-editor. ════ */
/* Editor come i campi di Crediti: underline trasparente, niente box; riempie l'altezza. */
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-panel-card.narrative-single-textarea .field .narrative-rich-editor,
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-panel-card .field .narrative-rich-editor.textarea{
  border:0 !important;
  border-bottom:1px solid var(--narrative-editorial-line) !important;
  border-radius:0 !important;
  background:transparent !important;
  padding:12px 2px !important;
  box-shadow:none !important;
}
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-panel-card.narrative-single-textarea .field .narrative-rich-editor:focus,
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-panel-card .field .narrative-rich-editor.textarea:focus{
  border-bottom-color:var(--accent) !important;
  box-shadow:0 1px 0 0 var(--accent) !important;
}
/* riempie l'altezza fino in fondo (il pannello/field hanno già min-height:100%) */
#route-narrative .narrative-panel-card.narrative-single-textarea .field{
  display:flex !important; flex-direction:column !important; min-height:0 !important;
}
#route-narrative .narrative-panel-card.narrative-single-textarea .field .narrative-rich-editor-wrap{
  display:flex !important; flex-direction:column !important; flex:1 1 auto !important; min-height:0 !important;
}
body[data-theme-resolved="dark"] #route-narrative .narrative-panel-card.narrative-single-textarea .field .narrative-rich-editor{
  flex:1 1 auto !important; min-height:200px !important;
}


/* ════ NARRATIVE — CHIP: 2 ID (#workspaceMain #route-narrative) per battere
   unified-pass:433 che vale (2,1,0) per via di :is(... #route-steps … #actAdd …). ════ */
/* (blocco pill sotto-tab rimosso — sostituito dall'underline 2-id più sotto) */


/* Titoli di sezione rimossi ovunque (anche nei pannelli generati via JS, es. Direttive):
   la chip/tab attiva indica già la sezione. */
#route-narrative .section-title,
#workspaceMain #route-narrative .section-title{ display:none !important; }


/* ════ NARRATIVE — toolbar di formattazione FISSA in cima all'editor ════
   (non più flottante a comparsa; al posto del titolo di sezione rimosso) */
#route-narrative .narrative-rich-editor-wrap .narrative-text-toolbar.narrative-inline-text-toolbar{
  position:static !important;
  left:auto !important; right:auto !important; bottom:auto !important; top:auto !important;
  z-index:auto !important;
  margin:0 0 8px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  display:flex !important;
  flex-wrap:wrap;
  align-items:center;
  gap:4px;
}
#route-narrative .narrative-rich-editor-wrap .narrative-text-toolbar.narrative-inline-text-toolbar[hidden]{
  display:flex !important;
}
/* niente più padding-bottom extra: la toolbar non è più in basso */
#route-narrative .narrative-rich-editor.is-inline-toolbar-active{ padding-bottom:18px !important; }

/* ════ NARRATIVE — SWAP stili: MAIN tab = chip · SUB-tab = underline ════ */

/* MAIN tab (nav-group-head) → stile navbar attiva: default piatto, attivo = state-selected */
#workspaceMain #route-narrative .narrative-inline-nav-scroll .narrative-nav-group-head{
  display:inline-flex !important; align-items:center; gap:8px;
  min-height:30px !important; padding:0 14px !important;
  border-radius:var(--radius-sm, 8px) !important;
  background:transparent !important;
  border:1px solid transparent !important;
  color:var(--text-secondary) !important;
  box-shadow:none !important;
}
#workspaceMain #route-narrative .narrative-inline-nav-scroll .narrative-nav-group-head:hover{
  background:var(--state-hover-bg, var(--surface-raised)) !important;
  color:var(--text-primary) !important;
}
#workspaceMain #route-narrative .narrative-nav-group:is(.is-active,.is-current,[aria-current="page"],[aria-selected="true"],.active) .narrative-nav-group-head{
  background:var(--state-selected-bg) !important;
  border-color:var(--state-selected-border) !important;
  color:var(--text-primary) !important;
}
/* via la vecchia underline del main tab + eventuale bg del title interno */
#route-narrative .narrative-nav-group .narrative-nav-group-head::after{ display:none !important; }
#workspaceMain #route-narrative .narrative-nav-group-head .narrative-nav-group-title{
  background:transparent !important; border:0 !important; color:inherit !important; box-shadow:none !important;
}

/* SUB-tab (nav-item) → underline (era chip). Sorgente UNICA: geometria + visual qui. */
#workspaceMain #route-narrative .narrative-inline-nav-scroll .narrative-nav-item{
  background:transparent !important; background-color:transparent !important;
  border:0 !important; border-radius:0 !important;
  padding:0 8px !important;
  color:var(--text-secondary) !important;
  box-shadow:none !important;
  min-height:30px !important; height:auto !important; max-height:none !important;
  width:auto !important; flex:0 0 auto !important;
  /* struttura (migrata da @1276, ora sorgente unica) */
  display:flex !important; align-items:center !important; justify-content:flex-start !important;
  gap:6px; position:relative; overflow:hidden; text-align:left; aspect-ratio:auto !important;
}
/* il display:flex 2-id qui sopra deve cedere all'hiding (preset/gruppo non attivo):
   il JS usa .is-hidden-by-preset + attr [hidden] → ri-vinciamo a pari/maggiore specificità */
#workspaceMain #route-narrative .narrative-inline-nav-scroll .narrative-nav-item.is-hidden-by-preset,
#workspaceMain #route-narrative .narrative-inline-nav-scroll .narrative-nav-item[hidden]{
  display:none !important;
}
#workspaceMain #route-narrative .narrative-inline-nav-scroll .narrative-nav-item::before,
#workspaceMain #route-narrative .narrative-inline-nav-scroll .narrative-nav-item::after{ display:none !important; }
#workspaceMain #route-narrative .narrative-inline-nav-scroll .narrative-nav-item:hover{
  background:transparent !important; color:var(--text-primary) !important; box-shadow:none !important;
}
#workspaceMain #route-narrative .narrative-inline-nav-scroll .narrative-nav-item.is-active{
  background:transparent !important;
  color:var(--text-primary) !important;
  box-shadow:inset 0 -2px 0 var(--accent) !important;
}


/* ════ NARRATIVE — form: via background scuro + padding extra (toglie la "cozzaglia") ════ */
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-form{
  background:transparent !important;
  background-image:none !important;
}


/* ════ NARRATIVE — wrap editor trasparente (unified-pass:6830 lo metteva --surface-input) ════ */
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-panel-card.narrative-single-textarea .field .narrative-rich-editor-wrap,
:is([data-theme-resolved="dark"], body.theme-dark) #route-narrative .narrative-panel-card .field .narrative-rich-editor-wrap{
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  border:0 !important;
  box-shadow:none !important;
}


/* ════ NARRATIVE — TUTTI gli editor coerenti (anche Direttive): underline trasparente.
   2 id (#workspaceMain) per battere unified-pass:6830 (--surface-input) su ogni pannello. ════ */
#workspaceMain #route-narrative .narrative-rich-editor.textarea,
#workspaceMain #route-narrative .narrative-panel-card .field .narrative-rich-editor{
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  border:0 !important;
  border-bottom:1px solid var(--editorial-line) !important;
  border-radius:0 !important;
  box-shadow:none !important;
  white-space:pre-wrap;
}
#workspaceMain #route-narrative .narrative-rich-editor-wrap{
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  border:0 !important;
  box-shadow:none !important;
}
#workspaceMain #route-narrative .narrative-rich-editor.textarea:focus{
  border-bottom-color:var(--editorial-accent) !important;
  box-shadow:0 1px 0 0 var(--editorial-accent) !important;
}


/* Label del campo editor (es. "DIRETTIVE") nascosta: ridondante con la tab attiva.
   Solo i campi che contengono il rich-editor → restano le altre label (es. TAG CSV, Crediti). */
#route-narrative .narrative-panel-card .field:has(.narrative-rich-editor) > .label,
#workspaceMain #route-narrative .narrative-panel-card .field:has(.narrative-rich-editor) > .label{
  display:none !important;
}


/* Icona nei tab principali (Crediti/Descrizione/Filosofia/Stile) */
#route-narrative .narrative-nav-group-ico{
  display:inline-flex; align-items:center; justify-content:center;
  width:16px; height:16px; flex:0 0 16px;
  margin-right:7px;
}
#route-narrative .narrative-nav-group-ico svg{
  width:16px; height:16px; display:block;
  stroke:currentColor; fill:none;
}
#route-narrative .narrative-nav-group-title{ display:inline-flex !important; align-items:center !important; }