/* echo-annotator.css — page styles (claude_20261002_cobalt). Former inline style="" attributes are the st-* classes at the end. */
  .legend { position: sticky; top: var(--top); z-index: 20; display: flex; align-items: center; gap: 14px; padding: 7px 16px; background: color-mix(in srgb, var(--paper) 92%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line-soft); font-size: 10.5px; color: var(--ink); }
  html:not(.shelled) .legend { top: 0; }
  .legend span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
  .legend i { display: inline-block; width: 16px; height: 9px; border-radius: 2px; }
  .lg-i { background: var(--m-irgc-bg); border-bottom: 2px solid var(--m-irgc-line); }
  .lg-w { background: var(--m-west-bg); border-bottom: 2px dashed var(--m-west-line); }
  .lg-n { background: var(--note-bg); border: 1px solid var(--note-line); }
  .legend .grow { flex: 1; }
  .wrap { max-width: 680px; }
  .doc-t { margin: 6px 0 2px; font-size: 17px; line-height: 1.3; }
  .meta { color: var(--muted); font-size: 11.5px; }
  .meta b { color: var(--ink); }
  .paras { margin-top: 12px; }
  .pr { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 4px 6px; padding: 7px 0; scroll-margin-top: calc(var(--top) + 40px); }
  .pn { padding-top: 2px; color: var(--muted); font: 400 10px/1.65 var(--font); font-variant-numeric: tabular-nums; }
  .pt { font-size: 13px; line-height: 1.7; overflow-wrap: break-word; }
  .pr.hit .pn { color: var(--cobalt); font-weight: 700; }
  .notes { grid-column: 2; }
  .big .pt { font-size: 15px; } .bigger .pt { font-size: 17px; }
  @media (min-width: 1100px) {
    .wrap { max-width: 1000px; padding-left: 40px; }
    .pr { grid-template-columns: 22px minmax(0, 620px) 280px; gap: 4px 24px; }
    .notes { grid-column: 3; grid-row: 1; }
  }
  /* marks never shift layout: background + underline only */
  .mk { cursor: pointer; border-radius: 1px; -webkit-box-decoration-break: clone; box-decoration-break: clone; text-underline-offset: 3px; text-decoration-thickness: 2px; }
  .mk.i { background: var(--m-irgc-bg); text-decoration-line: underline; text-decoration-style: solid; text-decoration-color: var(--m-irgc-line); }
  .mk.w { background: var(--m-west-bg); text-decoration-line: underline; text-decoration-style: dashed; text-decoration-color: var(--m-west-line); }
  .mk.b { background: var(--m-irgc-bg); text-decoration-line: underline; text-decoration-style: dashed; text-decoration-color: var(--m-west-line); }
  .mk.sel { outline: 2px solid var(--cobalt); outline-offset: 1px; }
  .mk sup { color: var(--muted); font-weight: 700; margin-left: 1px; }
  .hide-i .mk.i, .hide-w .mk.w { background: none; text-decoration: none; cursor: text; }
  .hide-i .mk.i sup, .hide-w .mk.w sup { display: none; }
  .hide-i .mk.b { background: none; } .hide-w .mk.b { text-decoration: none; }
  .pin { outline: 1.5px solid var(--cobalt); outline-offset: 1px; border-radius: 2px; }
  .pinn { display: inline-grid; place-items: center; width: 14px; height: 14px; margin-left: 3px; border-radius: 50%; background: var(--cobalt); color: var(--paper); font: 700 8.5px/1 var(--font); vertical-align: 2px; }
  .note { margin-top: 6px; padding: 8px 10px; border: 1px solid var(--note-line); border-radius: 6px; background: var(--note-bg); font-size: 11.5px; line-height: 1.5; }
  .note .kk { color: var(--cobalt); display: flex; align-items: center; gap: 6px; }
  .note .kk button { margin-left: auto; position: relative; border: 0; background: none; color: var(--muted); font: 700 8.75px/1 var(--font); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
  .note .kk button::after { content: ""; position: absolute; inset: -12px -6px; }
  .note p { margin: 4px 0 0; }
  /* sheet rows */
  .erow { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 9px 0; border-bottom: 1px solid var(--line-soft); cursor: pointer; }
  .erow b { font-size: 12.5px; }
  .erow small { grid-column: 1; color: var(--muted); font-size: 10.5px; }
  .erow .sc { grid-row: 1 / span 2; grid-column: 2; align-self: center; display: flex; align-items: center; gap: 8px; font: 700 13px/1 var(--font); font-variant-numeric: tabular-nums; }
  .erow .tw { grid-column: 1 / -1; display: none; margin-top: 6px; padding: 8px 10px; border-left: 3px solid var(--rule); background: var(--card); border-radius: 0 6px 6px 0; font-size: 12px; line-height: 1.55; white-space: pre-line; }
  .erow.open .tw { display: block; }
  .erow .tw a { font-weight: 700; text-decoration: none; }
  .tag { display: inline-block; padding: 1px 5px; border-radius: 3px; font: 700 8.5px/1.4 var(--font); letter-spacing: .04em; text-transform: uppercase; vertical-align: 1px; }
  .tag.i { background: var(--m-irgc-bg); color: var(--m-irgc-line); } .tag.w { background: var(--m-west-bg); color: var(--m-west-line); }
  .cmp { display: none; gap: 10px; margin: 8px 0 4px; }
  .cmp.on { display: grid; }
  @media (min-width: 640px) { .cmp.on { grid-template-columns: 1fr 1fr; } }
  .cmp > div { padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); font-size: 12px; line-height: 1.55; }
  .cmp mark { background: var(--m-west-bg); color: inherit; }
  .opt { position: relative; display: flex; gap: 10px; align-items: flex-start; padding: 9px 10px; margin-top: 6px; border: 1px solid var(--rule); border-radius: 6px; background: var(--card); cursor: pointer; }
  .opt input { margin: 2px 0 0; accent-color: var(--cobalt); }
  .opt b { display: block; font-size: 12px; } .opt small { color: var(--muted); font-size: 10.5px; }
  .opt:has(input:checked) { border: 2px solid var(--cobalt); padding: 8px 9px; }
  textarea { width: 100%; min-height: 64px; padding: 8px 10px; border: 1px solid var(--rule); border-radius: 6px; background: var(--card); color: var(--ink); font: 16px/1.45 var(--font); resize: vertical; }
  .selbtn { position: fixed; z-index: 45; display: none; }
  .selbtn.show { display: inline-flex; }
  .chk { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px; border-bottom: 1px solid var(--line-soft); font-size: 12px; cursor: pointer; }
  .chk input { accent-color: var(--cobalt); width: 16px; height: 16px; }
  .chk small { color: var(--muted); }
  .top-ph { padding: 6px 12px 10px; }
  .top-ph button { display: block; width: 100%; padding: 7px 0; border: 0; border-bottom: 1px solid var(--line-soft); background: none; color: var(--ink); font: 400 12px/1.4 var(--font); text-align: left; cursor: pointer; }
  .top-ph button span { float: right; color: var(--muted); font-weight: 700; }
  .skel { height: 14px; margin: 10px 0; border-radius: 3px; background: var(--line-soft); }
.st-10f249 { width:80% !important; }
.st-116966 { margin:0 !important; }
.st-27f35b { color:var(--m-west-line) !important; }
.st-63e775 { margin:4px 0 0 !important; }
.st-789157 { color:var(--ink) !important; }
.st-9ea5b3 { font-size:10.5px !important;margin:10px 0 4px !important; }
.st-bb0c09 { border:0 !important; }
.st-bc61e3 { border:0 !important;padding-bottom:0 !important; }
.st-cfe75d { margin:6px 0 0 !important;font-size:11px !important; }
.st-d2c171 { margin-top:10px !important; }
.st-fc305b { color:var(--m-irgc-line) !important; }