/* ============================================================
     POCKET NOTIZEN · „Tonarchiv“
     Konzept: Gesprächsnotizen als redaktionelles Klangarchiv.
     Papier statt Pixel-Grau, Tinte statt Schlagschatten,
     die Wellenform als zentrales Gestaltungselement.
     ============================================================ */
  :root {
    --paper: #F3EEE4;
    --sheet: #FBF8F1;
    --sheet-deep: #EFE9DB;
    --ink: #1F1B16;
    --ink-60: #57503F;
    --ink-40: #8B8270;
    --hairline: #DCD4C2;
    --rule: #C8BFA9;
    --vermilion: #D9481F;
    --vermilion-soft: #F7E4DC;
    --teal: #14655A;
    --teal-soft: #DFEAE5;
    --ochre: #B9770E;
    --ochre-soft: #F3E7CE;
    --stamp-red: #B3261E;
    --serif: 'Iowan Old Style', 'Palatino Linotype', Palatino, Georgia, 'Times New Roman', serif;
    --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
    --mono: ui-monospace, 'SF Mono', 'Cascadia Mono', Menlo, Consolas, monospace;
  }

  * { margin: 0; padding: 0; box-sizing: border-box; }

  body {
    background:
      radial-gradient(ellipse at 20% -10%, rgba(217,72,31,0.045), transparent 55%),
      radial-gradient(ellipse at 90% 110%, rgba(20,101,90,0.05), transparent 50%),
      var(--paper);
    color: var(--ink);
    font-family: var(--sans);
    font-size: 15px;
    line-height: 1.55;
    min-height: 100vh;
    -webkit-font-smoothing: antialiased;
  }

  button { font-family: inherit; cursor: pointer; color: inherit; }
  a { color: inherit; }

  .shell { max-width: 1220px; margin: 0 auto; padding: 0 40px 90px; }

  /* ============ MASTHEAD ============ */
  .masthead {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    padding: 30px 0 18px;
    border-bottom: 3px double var(--ink);
  }
  .masthead-left { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; }
  .wordmark {
    font-family: var(--serif);
    font-size: 30px;
    font-weight: 700;
    letter-spacing: -0.01em;
    display: flex;
    align-items: baseline;
    gap: 12px;
    white-space: nowrap;
  }
  .rec-dot {
    width: 13px; height: 13px;
    border-radius: 50%;
    background: var(--vermilion);
    align-self: center;
    box-shadow: 0 0 0 3px var(--paper), 0 0 0 4.5px var(--vermilion);
    animation: recpulse 2.4s ease-in-out infinite;
  }
  @keyframes recpulse { 0%,100% { opacity: 1; } 50% { opacity: 0.45; } }
  .masthead-claim {
    font-family: var(--mono);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--ink-40);
  }
  .masthead-right { display: flex; align-items: center; gap: 18px; }
  .masthead-date {
    font-family: var(--mono);
    font-size: 11.5px;
    letter-spacing: 0.08em;
    color: var(--ink-60);
    text-transform: uppercase;
    white-space: nowrap;
  }
  .btn-ink {
    background: var(--ink);
    color: var(--sheet);
    border: 1.5px solid var(--ink);
    font-family: var(--mono);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 11px 18px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    box-shadow: 4px 4px 0 rgba(31,27,22,0.22);
    transition: transform .12s ease, box-shadow .12s ease;
    white-space: nowrap;
  }
  .btn-ink:hover { transform: translate(-1px,-1px); box-shadow: 5px 5px 0 rgba(31,27,22,0.28); }
  .btn-ink:active { transform: translate(2px,2px); box-shadow: 1px 1px 0 rgba(31,27,22,0.25); }
  .btn-ink .rec-dot { box-shadow: none; width: 9px; height: 9px; animation: none; }

  /* ============ SUCHPULT ============ */
  .console {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 14px;
    align-items: stretch;
    margin: 26px 0 0;
  }
  .search-slip {
    display: flex;
    align-items: center;
    gap: 14px;
    background: var(--sheet);
    border: 1.5px solid var(--ink);
    padding: 0 18px;
    height: 58px;
    box-shadow: 4px 4px 0 rgba(31,27,22,0.14);
  }
  .search-slip:focus-within { box-shadow: 4px 4px 0 var(--vermilion); border-color: var(--ink); }
  .search-slip svg { flex-shrink: 0; color: var(--ink-60); }
  .search-slip input {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-family: var(--serif);
    font-size: 17px;
    color: var(--ink);
  }
  .search-slip input::placeholder { color: var(--ink-40); font-style: italic; }
  .kbd-hint {
    font-family: var(--mono);
    font-size: 10.5px;
    color: var(--ink-40);
    border: 1px solid var(--hairline);
    padding: 3px 7px;
    letter-spacing: 0.06em;
    white-space: nowrap;
  }

  .period-group {
    display: flex;
    border: 1.5px solid var(--ink);
    background: var(--sheet);
    box-shadow: 4px 4px 0 rgba(31,27,22,0.14);
  }
  .period-btn {
    border: none;
    background: transparent;
    font-family: var(--mono);
    font-size: 11.5px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 0 16px;
    color: var(--ink-60);
    border-left: 1px solid var(--hairline);
  }
  .period-btn:first-child { border-left: none; }
  .period-btn:hover { color: var(--ink); }
  .period-btn.active { background: var(--ink); color: var(--sheet); }

  /* ============ REGISTER (Kunden/Projekte) ============ */
  .register {
    margin-top: 26px;
    border-bottom: 1.5px solid var(--ink);
    display: flex;
    align-items: flex-end;
    gap: 6px;
    flex-wrap: wrap;
  }
  .register-caption {
    font-family: var(--mono);
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--ink-40);
    padding: 0 12px 9px 0;
    white-space: nowrap;
  }
  .tab {
    border: 1.5px solid var(--ink);
    border-bottom: none;
    background: var(--sheet-deep);
    padding: 8px 15px 7px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-size: 13.5px;
    font-weight: 600;
    position: relative;
    top: 1.5px;
    transition: background .12s ease, padding .12s ease;
  }
  .tab::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: var(--tab-color, var(--ink));
  }
  .tab:hover { background: var(--sheet); padding-bottom: 10px; }
  .tab.active { background: var(--sheet); padding-bottom: 12px; }
  .tab .tab-kind {
    font-family: var(--mono);
    font-size: 9px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ink-40);
  }
  .tab .tab-count {
    font-family: var(--mono);
    font-size: 11px;
    color: var(--ink-60);
  }
  .tab.active .tab-count { color: var(--vermilion); font-weight: 700; }

  /* ============ STEMPELLEISTE (Tags) ============ */
  .stamp-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 14px 0 0;
  }
  .stamp {
    font-family: var(--mono);
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    border: 1.5px solid var(--ink-40);
    color: var(--ink-60);
    background: transparent;
    padding: 4px 10px;
    border-radius: 3px;
    transition: all .12s ease;
  }
  .stamp:hover { border-color: var(--ink); color: var(--ink); transform: rotate(-1deg); }
  .stamp.active {
    border-color: var(--stamp-red);
    color: var(--stamp-red);
    background: rgba(179,38,30,0.07);
    transform: rotate(-2deg);
    box-shadow: 1px 1px 0 rgba(179,38,30,0.3);
  }

  /* ============ AKTIVE FILTER ============ */
  .filter-line {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin: 18px 0 0;
    padding: 12px 16px;
    border: 1.5px dashed var(--rule);
    background: rgba(251,248,241,0.6);
  }
  .filter-line.idle { border-style: dashed; }
  .filter-line-label {
    font-family: var(--mono);
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--ink-40);
  }
  .chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--ink);
    color: var(--sheet);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 0.05em;
    padding: 5px 6px 5px 12px;
  }
  .chip.chip-tag { background: var(--stamp-red); }
  .chip.chip-period { background: var(--teal); }
  .chip-x {
    border: none;
    background: rgba(251,248,241,0.25);
    color: var(--sheet);
    width: 17px; height: 17px;
    font-size: 10px;
    line-height: 1;
    display: flex; align-items: center; justify-content: center;
  }
  .chip-x:hover { background: var(--sheet); color: var(--ink); }
  .chip-clear {
    border: none;
    background: none;
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 0.05em;
    color: var(--ink-60);
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  .chip-clear:hover { color: var(--stamp-red); }

  /* ============ ARCHIV-STROM ============ */
  .stream-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin: 34px 0 6px;
  }
  .stream-head h1 {
    font-family: var(--serif);
    font-size: 21px;
    font-weight: 700;
  }
  .stream-count {
    font-family: var(--mono);
    font-size: 11.5px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ink-40);
  }

  .day-group {
    display: grid;
    grid-template-columns: 96px 1fr;
    gap: 0 28px;
    position: relative;
  }
  .day-group::before {
    content: '';
    position: absolute;
    left: 96px;
    top: 0; bottom: 0;
    width: 1.5px;
    background: var(--rule);
  }
  .day-label {
    text-align: right;
    padding: 30px 0 0;
    position: sticky;
    top: 0;
    align-self: start;
  }
  .day-num {
    font-family: var(--serif);
    font-size: 40px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.03em;
  }
  .day-month {
    font-family: var(--mono);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--ink-40);
    margin-top: 4px;
  }
  .day-entries { padding: 26px 0 10px 26px; }

  .entry {
    background: var(--sheet);
    border: 1.5px solid var(--ink);
    padding: 20px 24px 18px;
    margin-bottom: 22px;
    position: relative;
    transition: transform .14s ease, box-shadow .14s ease;
    box-shadow: 3px 3px 0 rgba(31,27,22,0.10);
  }
  .entry:hover { transform: translate(-2px,-2px); box-shadow: 6px 6px 0 rgba(31,27,22,0.16); }
  .entry::before {
    content: '';
    position: absolute;
    left: -33.5px;
    top: 30px;
    width: 12px; height: 12px;
    border-radius: 50%;
    background: var(--paper);
    border: 2.5px solid var(--ink);
  }

  .entry-top {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 8px;
  }
  .entry-time {
    font-family: var(--mono);
    font-size: 11.5px;
    letter-spacing: 0.06em;
    color: var(--ink-60);
  }
  .folder-mark {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-family: var(--mono);
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    border: none;
    background: none;
    padding: 3px 0;
    color: var(--ink);
    border-bottom: 2px solid var(--fm-color, var(--ink));
  }
  .folder-mark:hover { color: var(--vermilion); }
  .entry-actions {
    margin-left: auto;
    display: flex;
    gap: 8px;
    opacity: 0.45;
    transition: opacity .14s ease;
  }
  .entry:hover .entry-actions { opacity: 1; }
  .btn-quiet {
    border: 1.5px solid var(--ink);
    background: var(--sheet);
    font-family: var(--mono);
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 5px 12px;
    transition: all .12s ease;
  }
  .btn-quiet:hover { background: var(--ink); color: var(--sheet); }
  .btn-quiet.open { background: var(--ink); color: var(--sheet); }
  .btn-quiet.open:hover { background: var(--vermilion); border-color: var(--vermilion); }
  .btn-quiet.del:hover { background: var(--stamp-red); border-color: var(--stamp-red); color: var(--sheet); }

  .entry-title {
    font-family: var(--serif);
    font-size: 21px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.01em;
    margin-bottom: 7px;
  }
  .entry-title a { text-decoration: none; }
  .entry-title a:hover { color: var(--vermilion); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1.5px; }

  .entry-excerpt {
    font-size: 14px;
    color: var(--ink-60);
    max-width: 68ch;
    margin-bottom: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .entry-wave {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 0 12px;
    border-top: 1px solid var(--hairline);
  }
  .wave-play {
    width: 34px; height: 34px;
    border: 1.5px solid var(--ink);
    background: var(--sheet);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    transition: all .12s ease;
  }
  .wave-play:hover { background: var(--vermilion); border-color: var(--vermilion); color: var(--sheet); }
  .wave-bars {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 2.5px;
    height: 34px;
  }
  .wave-bars i {
    flex: 1;
    background: var(--ink-40);
    opacity: 0.55;
    min-width: 2px;
    transition: opacity .2s ease, background .2s ease;
  }
  .entry:hover .wave-bars i { opacity: 0.8; }
  .wave-dur {
    font-family: var(--mono);
    font-size: 11.5px;
    color: var(--ink-60);
    white-space: nowrap;
  }
  .entry-stamps { display: flex; gap: 7px; flex-wrap: wrap; }
  .entry-stamps .stamp { font-size: 9.5px; padding: 3px 8px; }

  /* ============ LEERER ZUSTAND ============ */
  .empty {
    display: none;
    border: 1.5px solid var(--ink);
    background: var(--sheet);
    box-shadow: 4px 4px 0 rgba(31,27,22,0.12);
    padding: 66px 40px;
    text-align: center;
    margin-top: 24px;
  }
  .empty.visible { display: block; }
  .empty h3 { font-family: var(--serif); font-size: 24px; margin: 22px 0 8px; }
  .empty p { color: var(--ink-60); font-size: 14px; max-width: 44ch; margin: 0 auto 24px; }

  /* ============ DOSSIER (Detail) ============ */
  .screen { display: none; }
  .screen.visible { display: block; }

  .back-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    border: none;
    background: none;
    font-family: var(--mono);
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--ink-60);
    margin: 30px 0 26px;
    padding: 0;
  }
  .back-link:hover { color: var(--vermilion); }

  .dossier-head { position: relative; padding-right: 150px; margin-bottom: 24px; }
  .dossier-title {
    font-family: var(--serif);
    font-size: 38px;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.02em;
    max-width: 26ch;
    margin-bottom: 14px;
  }
  .dossier-meta {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
    font-family: var(--mono);
    font-size: 11.5px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--ink-60);
  }
  .dossier-meta b { color: var(--ink); font-weight: 600; }
  .id-stamp {
    position: absolute;
    right: 0; top: 4px;
    transform: rotate(3deg);
    border: 2px solid var(--stamp-red);
    color: var(--stamp-red);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 8px 14px;
    text-align: center;
    line-height: 1.5;
    opacity: 0.85;
    border-radius: 3px;
  }

  .filing {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 22px;
    border-top: 1.5px solid var(--ink);
    border-bottom: 1px solid var(--hairline);
    padding: 16px 0;
    margin-bottom: 30px;
  }
  .filing-field label {
    display: block;
    font-family: var(--mono);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--ink-40);
    margin-bottom: 8px;
  }
  .filing-field select {
    width: 100%;
    border: 1.5px solid var(--ink);
    background: var(--sheet);
    font-family: var(--sans);
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink);
    padding: 8px 10px;
    outline: none;
  }
  .tag-editor {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
  }
  .tag-editor .stamp { cursor: default; display: inline-flex; align-items: center; gap: 7px; }
  .tag-editor .stamp:hover { transform: none; }
  .stamp-remove {
    border: none; background: none;
    color: inherit;
    font-size: 10px;
    padding: 0;
    line-height: 1;
    cursor: pointer;
    opacity: 0.7;
  }
  .stamp-remove:hover { opacity: 1; color: var(--stamp-red); }
  .tag-editor input {
    border: none;
    border-bottom: 1.5px dashed var(--rule);
    background: transparent;
    outline: none;
    font-family: var(--mono);
    font-size: 11.5px;
    letter-spacing: 0.05em;
    padding: 5px 2px;
    min-width: 210px;
    color: var(--ink);
  }
  .tag-editor input:focus { border-bottom-color: var(--vermilion); }
  .tag-editor input::placeholder { color: var(--ink-40); }

  .sheet {
    background: var(--sheet);
    border: 1.5px solid var(--ink);
    box-shadow: 4px 4px 0 rgba(31,27,22,0.10);
    padding: 26px 30px;
    margin-bottom: 26px;
  }
  .sheet-caption {
    font-family: var(--mono);
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--ink-40);
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
  }
  .sheet-caption::after { content: ''; flex: 1; height: 1px; background: var(--hairline); }

  /* Player */
  .player { display: flex; align-items: center; gap: 20px; }
  .big-play {
    width: 58px; height: 58px;
    border: 1.5px solid var(--ink);
    background: var(--ink);
    color: var(--sheet);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    box-shadow: 4px 4px 0 rgba(31,27,22,0.22);
    transition: all .12s ease;
  }
  .big-play:hover { background: var(--vermilion); border-color: var(--vermilion); transform: translate(-1px,-1px); }
  .player-mid { flex: 1; min-width: 0; }
  .player-wave {
    display: flex;
    align-items: center;
    gap: 2.5px;
    height: 64px;
    cursor: pointer;
  }
  .player-wave i {
    flex: 1;
    min-width: 2px;
    background: var(--rule);
    transition: background .1s linear;
  }
  .player-wave i.played { background: var(--vermilion); }
  .player-times {
    display: flex;
    justify-content: space-between;
    font-family: var(--mono);
    font-size: 11.5px;
    color: var(--ink-60);
    margin-top: 8px;
  }
  .dl-link {
    font-family: var(--mono);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ink);
    text-decoration: underline;
    text-underline-offset: 4px;
    white-space: nowrap;
  }
  .dl-link:hover { color: var(--vermilion); }

  /* Zusammenfassung */
  .summary-cols { display: grid; grid-template-columns: 1.2fr 1fr; gap: 36px; }
  .summary-body { font-size: 15px; color: var(--ink); }
  .summary-body p { margin-bottom: 12px; max-width: 62ch; }
  .summary-body p:first-child::first-letter {
    font-family: var(--serif);
    font-size: 46px;
    font-weight: 700;
    float: left;
    line-height: 0.85;
    padding: 4px 8px 0 0;
    color: var(--vermilion);
  }

  .band-title {
    font-family: var(--mono);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--ink-40);
    margin-bottom: 10px;
  }
  .topic-band {
    display: flex;
    height: 30px;
    border: 1.5px solid var(--ink);
    margin-bottom: 12px;
    overflow: hidden;
  }
  .topic-band span { display: block; height: 100%; border-right: 1.5px solid var(--ink); }
  .topic-band span:last-child { border-right: none; }
  .topic-legend { display: flex; flex-direction: column; gap: 6px; margin-bottom: 26px; }
  .legend-item {
    display: flex;
    align-items: baseline;
    gap: 10px;
    font-size: 13px;
  }
  .legend-swatch { width: 11px; height: 11px; align-self: center; border: 1px solid var(--ink); flex-shrink: 0; }
  .legend-pct { font-family: var(--mono); font-size: 11.5px; color: var(--ink-60); margin-left: auto; }

  .waypoints { border-left: 1.5px solid var(--ink); padding-left: 18px; }
  .waypoint { position: relative; padding-bottom: 16px; }
  .waypoint:last-child { padding-bottom: 0; }
  .waypoint::before {
    content: '';
    position: absolute;
    left: -23.5px; top: 5px;
    width: 9px; height: 9px;
    background: var(--paper);
    border: 2px solid var(--ink);
    border-radius: 50%;
  }
  .waypoint.key::before { background: var(--vermilion); border-color: var(--vermilion); }
  .wp-time { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.08em; color: var(--ink-40); }
  .wp-text { font-size: 13.5px; }
  .waypoint.key .wp-text { font-weight: 600; }

  /* Wortprotokoll */
  .script-row {
    display: grid;
    grid-template-columns: 64px 150px 1fr;
    gap: 18px;
    padding: 13px 4px;
    border-bottom: 1px solid var(--hairline);
    cursor: pointer;
    transition: background .12s ease;
  }
  .script-row:last-child { border-bottom: none; }
  .script-row:hover { background: rgba(217,72,31,0.05); }
  .sr-time {
    font-family: var(--mono);
    font-size: 11px;
    color: var(--ink-40);
    padding-top: 2px;
  }
  .script-row:hover .sr-time { color: var(--vermilion); }
  .sr-speaker {
    font-family: var(--mono);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
    padding-top: 2px;
    display: flex;
    align-items: flex-start;
    gap: 8px;
  }
  .sr-speaker::before {
    content: '';
    width: 8px; height: 8px;
    margin-top: 3px;
    flex-shrink: 0;
    border-radius: 50%;
  }
  .sr-speaker.s1 { color: var(--vermilion); } .sr-speaker.s1::before { background: var(--vermilion); }
  .sr-speaker.s2 { color: var(--teal); }      .sr-speaker.s2::before { background: var(--teal); }
  .sr-speaker.s3 { color: var(--ochre); }     .sr-speaker.s3::before { background: var(--ochre); }
  .sr-text { font-size: 14.5px; color: var(--ink); max-width: 74ch; }
  .script-hint {
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ink-40);
    margin-top: 14px;
  }

  .foot {
    margin-top: 60px;
    padding-top: 16px;
    border-top: 3px double var(--ink);
    display: flex;
    justify-content: space-between;
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ink-40);
  }

  /* ============ RESPONSIVE ============ */
  @media (max-width: 1199px) {
    .shell { padding: 0 26px 70px; }
    .dossier-title { font-size: 31px; }
    .day-group { grid-template-columns: 70px 1fr; gap: 0 20px; }
    .day-group::before { left: 70px; }
    .day-num { font-size: 31px; }
    .entry::before { left: -25.5px; }
    .day-entries { padding-left: 18px; }
    .summary-cols { grid-template-columns: 1fr; gap: 26px; }
  }

  @media (max-width: 899px) {
    .shell { padding: 0 16px 56px; }
    .masthead { flex-direction: column; align-items: flex-start; gap: 12px; padding-top: 22px; }
    .masthead-right { width: 100%; justify-content: space-between; }
    .console { grid-template-columns: 1fr; }
    .period-group { width: fit-content; }
    .register { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 0; scrollbar-width: none; }
    .register::-webkit-scrollbar { display: none; }
    .tab { white-space: nowrap; flex-shrink: 0; }
    .day-group { grid-template-columns: 1fr; }
    .day-group::before { display: none; }
    .day-label { position: static; text-align: left; padding: 26px 0 0; display: flex; align-items: baseline; gap: 10px; }
    .day-num { font-size: 25px; }
    .day-entries { padding-left: 0; }
    .entry::before { display: none; }
    .entry { padding: 16px 16px 14px; }
    .entry-actions { opacity: 1; width: 100%; margin-left: 0; order: 5; }
    .entry-actions .btn-quiet { flex: 1; }
    .entry-top { row-gap: 10px; }
    .dossier-head { padding-right: 0; }
    .id-stamp { position: static; display: inline-block; margin-bottom: 14px; transform: rotate(-2deg); }
    .dossier-title { font-size: 26px; }
    .filing { grid-template-columns: 1fr; }
    .player { flex-wrap: wrap; }
    .script-row { grid-template-columns: 52px 1fr; }
    .sr-text { grid-column: 1 / -1; }
    .sheet { padding: 18px; }
  }


/* Hermes live-data compatibility */
[hidden]{display:none!important}a{text-decoration-color:currentColor}.masthead a{text-decoration:none}.masthead-date{text-align:right}.btn-ink.is-stat{cursor:default}.btn-ink.is-stat:hover{transform:none;box-shadow:4px 4px 0 rgba(31,27,22,.22)}
.entry-search-hit{margin:0 0 14px;padding:9px 12px;border-left:3px solid var(--vermilion);background:var(--vermilion-soft);font-size:13px;color:var(--ink-60)}mark{background:#F3D2C5;color:var(--ink);padding:0 2px}.no-results{display:none}.no-results.visible{display:block}.register .tab{cursor:pointer}.entry-actions a{text-decoration:none}.entry-actions .btn-quiet{display:inline-flex;align-items:center}.entry-actions .del:disabled{opacity:.5;cursor:wait}
.summary-body h1,.summary-body h2,.summary-body h3{font-family:var(--serif);line-height:1.2;margin:1.15em 0 .45em}.summary-body h1:first-child,.summary-body h2:first-child,.summary-body h3:first-child{margin-top:0}.summary-body h1{font-size:27px}.summary-body h2{font-size:23px}.summary-body h3{font-size:19px}.summary-body ul,.summary-body ol{padding-left:1.35em;margin:8px 0 14px}.summary-body li{margin:4px 0}.summary-body strong{font-weight:700}.summary-body p:first-child::first-letter{font-family:var(--serif);font-size:46px;font-weight:700;float:left;line-height:.85;padding:4px 8px 0 0;color:var(--vermilion)}
.summary-visuals{min-width:0}.pocket-viz{margin-bottom:26px}.pocket-viz:last-child{margin-bottom:0}.viz-heading{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.15em;color:var(--ink-40);margin-bottom:10px}.viz-icon{display:none}.chart-body{display:grid;gap:7px}.chart-row{display:grid;grid-template-columns:minmax(0,1fr) 45px;gap:10px;align-items:center}.chart-label{display:contents}.chart-label span{font-size:13px}.chart-label strong{font-family:var(--mono);font-size:11.5px;color:var(--ink-60);text-align:right}.chart-track{grid-column:1/-1;height:12px;border:1px solid var(--ink);background:var(--sheet-deep);overflow:hidden}.chart-fill{height:100%}.timeline-body{border-left:1.5px solid var(--ink);padding-left:18px}.timeline-item{position:relative;padding-bottom:16px}.timeline-item:last-child{padding-bottom:0}.timeline-dot{position:absolute;left:-23.5px;top:5px;width:9px;height:9px;background:var(--paper);border:2px solid var(--ink);border-radius:50%}.timeline-item:last-child .timeline-dot{background:var(--vermilion);border-color:var(--vermilion)}.timeline-item time{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;color:var(--ink-40)}.timeline-item strong{display:block;font-size:13.5px}.timeline-item p{font-size:12.5px;color:var(--ink-60);margin-top:2px}
.real-audio{display:none}.player-wave i.played{background:var(--vermilion)}.player-wave.disabled{opacity:.45;cursor:default}.recording-filing{grid-template-columns:minmax(200px,320px) 1fr}.filing-value{font-weight:600;font-size:13.5px}.filing-stamps{display:flex;gap:7px;flex-wrap:wrap}.transcript-sheet details>summary{list-style:none;cursor:pointer}.transcript-sheet details>summary::-webkit-details-marker{display:none}.transcript-sheet details>summary.sheet-caption{margin-bottom:0}.transcript-sheet details>summary.sheet-caption::before{content:'+';font-family:var(--mono);color:var(--vermilion);margin-right:2px}.transcript-sheet details[open]>summary.sheet-caption{margin-bottom:18px}.transcript-sheet details[open]>summary.sheet-caption::before{content:'−'}.script-row{cursor:default}.foot a{text-decoration:none}.foot a:hover{color:var(--vermilion)}
@media(max-width:899px){.masthead-date{display:none}.kbd-hint{display:none}.period-btn{padding:0 10px}.summary-cols{grid-template-columns:1fr}.recording-filing{grid-template-columns:1fr}.entry-actions{display:flex}.dossier-head{padding-right:0}}