:root {
  color-scheme: light;
  font-family: Inter, "Noto Sans JP", system-ui, sans-serif;
  background: #f3f5f7;
  color: #17202a;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { max-width: 100%; overflow-x: hidden; }
body { margin: 0; }
.topbar { display: flex; min-width: 0; flex-wrap: wrap; justify-content: space-between; gap: 1rem; align-items: center; padding: 1rem 1.5rem; background: #17324d; color: white; }
.topbar-controls { display: flex; min-width: 0; flex-wrap: wrap; gap: .65rem; align-items: center; justify-content: flex-end; }
.topbar-controls[hidden] { display: none; }
.time-remaining { display: flex; gap: .45rem; align-items: baseline; white-space: nowrap; }
.time-remaining-label { font-size: .82rem; }
#time-remaining { min-width: 5.1rem; color: white; font-variant-numeric: tabular-nums; font-weight: 800; letter-spacing: .04em; text-align: left; }
.topbar-action { border: 1px solid rgb(255 255 255 / 70%); border-radius: .4rem; background: transparent; color: white; font-weight: 700; }
.topbar-action:hover, .topbar-action:focus-visible { border-color: white; background: rgb(255 255 255 / 12%); }
.badge { margin-left: .75rem; padding: .2rem .5rem; border-radius: .4rem; background: #8b2f2f; font-size: .8rem; }
main { width: 100%; max-width: 1100px; margin: 2rem auto; padding: 0 1rem; }
main:has(#workspace:not([hidden])) { max-width: none; margin: 1rem auto; padding: 0 1.25rem; }
.task-bar { display: flex; min-width: 0; flex-wrap: wrap; gap: .75rem; align-items: baseline; margin-bottom: .75rem; padding: .7rem 1rem; border: 1px solid #9aa9b8; border-radius: .6rem; background: white; }
.task-bar strong { flex: 0 0 auto; color: #17324d; }
.workspace-grid {
  display: grid;
  width: 100%;
  min-width: 0;
  /* Preserve the previous Searching width, including the old Chat minimum.
     5.05rem = reclaimed 3.25rem rail space + two original .9rem gaps. */
  --previous-chat-width: max(22rem, calc((100% - 5.05rem) / 4));
  --previous-search-width: max(14rem, calc((100% - 5.05rem - var(--previous-chat-width)) / 3.9));
  --previous-reading-width: calc(100% - 5.05rem - var(--previous-chat-width) - var(--previous-search-width));
  /* Return one third of the initial Evaluative column equally to Reading and Chat.
     2.35rem is the reclaimed rail width minus the added column gap. */
  --initial-evaluates-width: calc((var(--previous-reading-width) + var(--previous-chat-width)) * .25 + 2.35rem);
  --returned-pane-width: calc(var(--initial-evaluates-width) / 6);
  grid-template-columns: var(--previous-search-width) calc(var(--previous-reading-width) * .75 + var(--returned-pane-width)) calc(var(--previous-chat-width) * .75 + var(--returned-pane-width)) minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-areas:
    "searching reading chatting evaluates"
    "searching writing chatting evaluates";
  gap: .9rem;
  height: calc(100vh - 11rem);
  min-height: 34rem;
}
.pane { min-width: 0; max-width: 100%; min-height: 0; padding: 1rem 1.1rem; overflow-x: hidden; overflow-y: auto; }
#pane-searching { grid-area: searching; }
#pane-reading { position: relative; grid-area: reading; padding: 0; overflow: hidden; }
#pane-writing { grid-area: writing; }
#pane-chatting { display: flex; grid-area: chatting; min-height: 0; flex-direction: column; overflow: hidden; }
.pane h1 { position: sticky; top: -1rem; margin: -1rem -1.1rem .6rem; padding: .55rem 1.1rem; background: #eef3f8; border-bottom: 1px solid #d8dee5; font-size: 1.02rem; z-index: 1; }
.reading-shell { width: 100%; height: 100%; min-height: 0; }
.reading-stage { position: relative; min-width: 0; min-height: 0; height: 100%; padding: 1rem 1.1rem; overflow-x: hidden; overflow-y: auto; box-sizing: border-box; }
.reading-toolbar { position: sticky; top: -1rem; display: flex; align-items: center; justify-content: space-between; gap: .75rem; min-height: 2.7rem; margin: -1rem -1.1rem .6rem; padding: .2rem 1.1rem; background: #eef3f8; border-bottom: 1px solid #d8dee5; z-index: 1; }
.reading-toolbar h1 { position: static; margin: 0; padding: 0; border: 0; z-index: auto; }
.reading-toolbar [data-reading-bookmark] { flex-shrink: 0; padding: .35rem .8rem; }
.reading-empty-source { margin: .9rem 0; color: #4c6175; }
.global-memo-library { grid-area: evaluates; display: flex; min-width: 0; min-height: 0; }
.global-memo-library .memo-library-view { width: 100%; min-width: 0; min-height: 0; padding: 1rem; overflow-y: auto; overflow-x: hidden; border: 1px solid #b9c9d5; background: #f7fafc; overflow-wrap: anywhere; }
.memo-library-heading { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .6rem; align-items: end; }
.memo-library-heading h2 { display: flex; width: 100%; gap: .5rem; align-items: center; margin: 0; color: #294c66; font-size: 1rem; }
.memo-library-controls { display: grid; width: 100%; min-width: 0; gap: .5rem; }
.memo-library-filter { display: grid; grid-template-columns: minmax(0, 1fr); min-width: 0; gap: .2rem; color: #526777; font-size: .72rem; font-weight: 700; }
.memo-library-filter select { width: 100%; min-width: 0; padding: .25rem; font: inherit; }
.memo-library-item button { padding: .28rem .5rem; font-size: .72rem; }
.memo-library-empty { margin: .8rem 0; padding: 1.2rem; border: 1px dashed #c8d3dc; border-radius: .45rem; color: #607487; font-size: .82rem; text-align: center; }
.memo-library-list { display: grid; gap: .55rem; margin: .7rem 0 0; padding: 0; list-style: none; }
.memo-library-item { padding: .65rem; border: 1px solid #c8d3dc; border-radius: .45rem; background: white; }
.memo-library-source { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .35rem; align-items: center; color: #314d62; font-size: .78rem; }
.memo-library-object-type { grid-column: 1 / -1; justify-self: end; max-width: 100%; box-sizing: border-box; padding: .1rem .35rem; border-radius: 999px; background: #e8eef4; color: #53697b; font-size: .66rem; }
.memo-library-item blockquote { margin: .4rem 0 .25rem; color: #5a6d7b; font-size: .76rem; line-height: 1.45; }
.memo-library-item p { margin: 0 0 .4rem; color: #243746; font-size: .82rem; line-height: 1.45; white-space: pre-wrap; }
.memo-library-count { min-width: 1.8rem; flex-shrink: 0; padding: .1rem .45rem; border-radius: 999px; background: #38678f; color: white; font-size: .78rem; font-weight: 800; line-height: 1.35; text-align: center; white-space: nowrap; writing-mode: horizontal-tb; box-sizing: border-box; }
.memo-added-toast { position: absolute; top: 2.6rem; right: 1rem; z-index: 7; margin: 0; padding: .38rem .75rem; border-radius: 999px; background: #17324d; color: white; box-shadow: 0 2px 8px rgb(0 0 0 / 25%); font-size: .74rem; pointer-events: none; }
.memo-added-toast[hidden] { display: none; }
.pane-focused { outline: 2px solid #38678f; outline-offset: -1px; }
@media (max-width: 68rem) {
  .workspace-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
    grid-template-areas: "searching" "reading" "writing" "chatting" "evaluates";
    height: auto;
  }
  .pane { max-height: 34rem; }
  .global-memo-library { max-height: 34rem; }
}
button { cursor: pointer; padding: .55rem .8rem; }
input { min-width: 10rem; padding: .5rem; }
#sync-status { font-size: .85rem; color: #4c6175; margin-top: .6rem; }
dialog { max-width: 36rem; border: 1px solid #9aa9b8; border-radius: .75rem; }
#rubric-dialog { width: min(44rem, calc(100vw - 2rem)); max-width: 44rem; padding: 1.4rem 1.6rem; }
#rubric-dialog [data-task-prompt] p { margin: .5rem 0; line-height: 1.6; }
#rubric-dialog .task-dialog-question { color: #17324d; font-size: 1.06rem; font-weight: 700; }
#rubric-dialog h4 { margin: 1rem 0 .35rem; color: #294c66; }
.task-dialog-list { margin: 0 0 .4rem; padding-left: 1.25rem; line-height: 1.55; }
.task-dialog-list li { margin: .32rem 0; }
.task-dialog-steps { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); column-gap: .9rem; row-gap: .7rem; align-items: start; margin: .5rem 0 .6rem; }
.task-dialog-step-label { padding: .45rem .6rem; border-radius: .5rem; background: #e2e8ef; color: #17324d; font-size: .92rem; font-weight: 700; text-align: center; }
.task-dialog-step-label[data-tone="concerns"] { background: #f6d08c; color: #3a2a05; }
.task-dialog-step-label[data-tone="central-concern"] { background: #35a8a3; color: #fff; }
.task-dialog-step-label[data-tone="solutions"] { background: #f19a9a; color: #4a1414; }
.task-dialog-step-label[data-tone="justifications"] { background: #2e6b6b; color: #fff; }
.task-dialog-step-label[data-tone="strategic-plan"] { background: #5a78c8; color: #fff; }
#rubric-dialog [data-task-prompt] .task-dialog-step-text { margin: .25rem 0 0; line-height: 1.55; }
.pause-dialog { width: min(32rem, calc(100vw - 2rem)); padding: 1.5rem; color: #17202a; box-shadow: 0 1rem 3rem rgb(0 0 0 / 35%); }
.pause-dialog::backdrop { background: rgb(35 39 43 / 72%); }
.pause-dialog h2 { margin: 0 0 .8rem; color: #17324d; font-size: 1.25rem; }
.pause-dialog p { margin: 0 0 1rem; line-height: 1.55; }
.pause-dialog-progress { color: #526777; font-size: .85rem; font-weight: 700; }
.pause-dialog-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .6rem; margin-top: 1.25rem; }
.pause-dialog-actions button { min-width: 6.5rem; border-radius: .4rem; }
.pause-dialog-primary { border: 1px solid #24577f; background: #24577f; color: white; font-weight: 700; }

/* Keep the complete 16:9 content visible; controls occupy the spaces cleared in the slides. */
#tutorial-dialog { width: min(90vw, calc((100dvh - 3rem) * 16 / 9)); max-width: none; max-height: none; padding: 0; margin: auto; border: 1px solid #17324d; border-radius: 0; background: white; box-shadow: 0 1rem 4rem rgb(0 0 0 / 45%); overflow: hidden; }
#tutorial-dialog::backdrop { background: rgb(0 0 0 / 62%); }
.tutorial-canvas { position: relative; width: 100%; aspect-ratio: 16 / 9; container-type: inline-size; }
#tutorial-image { display: block; width: 100%; height: 100%; object-fit: contain; }
#tutorial-image[hidden] { display: none; }
#tutorial-progress { position: absolute; left: 88.960966%; top: 1.211286%; width: 7.413033%; height: 10.322047%; padding: .375cqw .75cqw; color: #a6a6a6; font: 700 4.166667cqw/1.15 "Times New Roman", serif; white-space: nowrap; }
.tutorial-canvas button { cursor: pointer; border: .078125cqw solid white; border-radius: 0; background: #376092; color: white; box-shadow: 0 .188648cqw .328084cqw rgb(0 0 0 / 35%); font: 400 1.875cqw/1 Arial, sans-serif; padding: 0; }
.tutorial-canvas button:focus-visible { outline: 3px solid #cb8519; outline-offset: 3px; }
.tutorial-canvas button:disabled { cursor: default; }
/* Geometry and type are taken from the 960 x 540 PowerPoint controls. */
.tutorial-canvas .tutorial-arrow { position: absolute; top: 82.820078%; width: 11.09375%; height: 14.305556%; border: 0; background: transparent; box-shadow: none; filter: drop-shadow(0 .188648cqw .164042cqw rgb(0 0 0 / 35%)); }
.tutorial-arrow svg { display: block; width: 100%; height: 100%; overflow: visible; }
.tutorial-arrow path { fill: #376092; stroke: white; stroke-width: .75; stroke-linejoin: miter; }
.tutorial-previous { left: 2.624984%; }
.tutorial-next { left: 86.281271%; }
#tutorial-skip { position: absolute; left: 43.632613%; top: 91.388889%; width: 12.734769%; height: 5.736746%; white-space: nowrap; }
#tutorial-last { position: absolute; left: 68.5625%; top: 43.333333%; width: 25.5%; height: 13.333333%; border: .104167cqw solid #b9c9d5; border-radius: 1.40625cqw; background: #24577f; font-weight: 700; font-size: 2.291667cqw; }
.tutorial-loading { position: absolute; left: 15%; right: 15%; bottom: 15%; text-align: center; }
.tutorial-loading p:not([hidden]) { display: inline-block; padding: .5rem; background: white; }
.tutorial-canvas [hidden] { display: none !important; }
.search-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 0; margin-bottom: 1rem; }
.search-field { display: flex; min-width: 0; flex-direction: column; font-size: .86rem; font-weight: 600; }
.search-field input { width: 100%; min-width: 0; height: 2.55rem; margin-top: .35rem; box-sizing: border-box; border: 1px solid #8fa1b3; border-radius: .45rem 0 0 .45rem; }
.search-submit { height: 2.55rem; border: 1px solid #38678f; border-radius: 0 .45rem .45rem 0; background: #38678f; color: white; }
.source-grid { display: grid; min-width: 0; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: 1rem; }
.source-card { border: 1px solid #cbd5df; border-radius: .6rem; padding: 1rem; }
.source-card-pinned { border-color: #38678f; background: #f4f8fc; box-shadow: inset 3px 0 #38678f; }
.source-heading { display: flex; justify-content: space-between; gap: .75rem; align-items: start; }
.source-title { margin: 0; color: #17324d; font-size: 1rem; line-height: 1.45; }
.source-id { display: block; margin-top: .18rem; color: #617487; font-size: .74rem; }
.pin-indicator { flex: 0 0 auto; }
.source-meta-row { display: flex; min-width: 0; flex-wrap: wrap; justify-content: space-between; gap: .45rem; align-items: center; margin: .75rem 0; }
.source-type { padding: .15rem .4rem; background: #e8eef4; border-radius: .3rem; font-size: .8rem; }
.source-actions { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; }
.source-action { border-radius: .4rem; }
.source-action-primary { border: 1px solid #24577f; background: #24577f; color: white; font-weight: 700; }
.source-action-secondary { border: 1px solid #38678f; background: white; color: #24577f; }
.source-action-secondary.is-pinned { background: #dceaf5; font-weight: 700; }
.source-action-summary { margin-left: auto; padding: .32rem .55rem; border: 1px solid #b6c2ce; background: #f7f9fb; color: #4c6175; font-size: .8rem; }
.source-summary { margin: .75rem 0 0; padding: .7rem; border-radius: .4rem; background: #eef3f8; font-size: .9rem; line-height: 1.55; }
.reader-content-grid { display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr); gap: 1rem; align-items: start; }
.reader-text-column { position: relative; min-width: 0; }
.reader-article { margin: .7rem 0 0; border: 1px solid #d8e0e6; background: white; }
.source-page-header { padding: 1.5rem 1.35rem 1.25rem; border-bottom: 1px solid #d9e1e7; }
.source-site-line, .source-byline { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1rem; align-items: baseline; }
.source-site-name { color: #17324d; font-weight: 800; letter-spacing: .03em; }
.source-page-type { padding: .18rem .45rem; border-radius: 999px; background: #e8eef4; color: #526777; font-size: .72rem; }
.source-page-header h2 { margin: .75rem 0 .55rem; color: #1e2d39; font-size: 1.55rem; line-height: 1.35; }
.source-byline { margin: 0; color: #637585; font-size: .78rem; }
.source-deck { margin: .85rem 0 0; color: #425869; font-size: .9rem; line-height: 1.65; }
.reader-template-article { border-top: 5px solid #203f58; }
.reader-template-article .source-site-line { padding-bottom: .55rem; border-bottom: 2px solid #203f58; }
.reader-template-article .source-page-header h2 { font-family: "Yu Mincho", "Noto Serif JP", serif; font-size: 1.7rem; }
.reader-template-blog { border: 0; border-radius: 1.1rem; background: #fffdfa; box-shadow: 0 3px 14px rgb(76 65 55 / 10%); }
.reader-template-blog .source-page-header { padding-top: 1.8rem; border-bottom-style: dashed; background: #f8f0e7; text-align: center; }
.reader-template-blog .source-site-line, .reader-template-blog .source-byline { justify-content: center; }
.reader-template-blog .source-page-header h2 { color: #604b3f; font-family: "Yu Mincho", "Noto Serif JP", serif; }
.reader-template-information { border-radius: .35rem; border-top: 0; }
.reader-template-information .source-site-line { margin: -1.5rem -1.35rem 1rem; padding: .75rem 1.35rem; background: #2f627b; }
.reader-template-information .source-site-name { color: white; }
.reader-template-information .source-page-type { background: #e6f1f5; color: #28546b; }
.reader-template-reviews { border-radius: .8rem; border-top: 5px solid #745c7d; }
.reader-template-reviews .source-page-header { background: #f7f2f8; }
.reader-template-reviews .source-site-name { color: #654c6e; }
.reader-paragraph { margin: 0; padding: 1.15rem .35rem 1rem; border-bottom: 1px solid #e0e6eb; transition: background-color .2s ease, box-shadow .2s ease; }
.reader-paragraph { padding-right: 1.35rem; padding-left: 1.35rem; }
.reader-paragraph:first-child { padding-top: 1.25rem; }
.reader-body { margin: 0; color: #243746; font-size: 1.02rem; line-height: 1.9; user-select: text; }
.selection-memo-button { position: absolute; z-index: 4; padding: .28rem .5rem; border: 1px solid #315f82; border-radius: 999px; background: #315f82; color: white; font-size: .75rem; box-shadow: 0 2px 8px rgb(23 50 77 / 25%); }
.selection-memo-button[hidden] { display: none; }
.annotation-color-1 { --annotation-fill: #cce9df; --annotation-edge: #438e79; }
.annotation-color-2 { --annotation-fill: #ccdef3; --annotation-edge: #4c7fad; }
.annotation-color-3 { --annotation-fill: #e5d5f1; --annotation-edge: #8962a4; }
.annotation-color-4 { --annotation-fill: #f3d2df; --annotation-edge: #ad607b; }
.annotation-color-5 { --annotation-fill: #f3cfbf; --annotation-edge: #b56c4d; }
.annotation-color-6 { --annotation-fill: #f5edb7; --annotation-edge: #9b861e; }
.annotation-color-7 { --annotation-fill: #d9dde2; --annotation-edge: #606b79; }
.annotation-highlight { padding: .04em 0; border-radius: .18rem; background: var(--annotation-fill); color: inherit; box-shadow: inset 0 -.14em var(--annotation-edge); cursor: pointer; }
.annotation-highlight.is-linked { outline: 2px solid var(--annotation-edge); outline-offset: 1px; filter: saturate(1.2); }
.reader-paragraph.citation-target { border-color: #d17900; background: transparent; outline: 2px dashed #d17900; outline-offset: -3px; box-shadow: inset 5px 0 #d17900; }
.reader-paragraph.citation-target .annotation-highlight { box-shadow: inset 0 -.18em var(--annotation-edge); }
.source-table-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
.source-table { width: 100%; min-width: calc(var(--source-table-columns) * 9rem); border-collapse: collapse; table-layout: fixed; color: #243746; font-size: .9rem; line-height: 1.55; user-select: text; }
.source-table th, .source-table td { padding: .6rem .7rem; border: 1px solid #d8e2e8; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.source-table th { background: #335563; color: white; font-weight: 700; }
.source-table tbody tr:nth-child(even) { background: #f1f5f6; }
.source-table-numeric { min-width: 44rem; }
.source-table-numeric .source-table-label-column { width: 11rem; }
.source-table-numeric th, .source-table-numeric td { padding: .4rem .35rem; text-align: center; }
.source-table-numeric td:first-child { text-align: left; }
.source-table-numeric td:not(:first-child) { white-space: nowrap; overflow-wrap: normal; }
.source-table .source-table-group th { background: #e5eef3; color: #243746; text-align: left; }
.source-table-emphasis td:not(:first-child) { font-weight: 700; }
.source-table-passage.citation-target { outline: 2px dashed #d17900; outline-offset: 2px; }
.source-figure { margin: .15rem 0; }
.source-figure img { display: block; width: 100%; height: auto; border: 1px solid #cbd7df; border-radius: .65rem; background: #f4f7f8; }
.source-figure-caption { margin-top: .7rem; color: #526879; font-size: .86rem; line-height: 1.65; }
.source-figure-caption::before { content: "Figure: "; color: #2e5168; font-weight: 800; }
.source-table-image .source-figure-caption::before { content: "Table: "; }
.annotation-card { display: block; min-width: 0; padding: .65rem; border: 1px solid #b9c9d5; border-left: 5px solid var(--annotation-edge); border-radius: .5rem; background: #f8fbfd; color: #243746; font-size: .82rem; font-weight: 400; line-height: 1.45; text-align: left; box-shadow: 0 2px 6px rgb(23 50 77 / 8%); transition: border-color .15s ease, box-shadow .15s ease; }
.annotation-card.is-linked { box-shadow: 0 0 0 2px color-mix(in srgb, var(--annotation-edge) 35%, transparent); }
.annotation-card-quote { display: block; margin: 0 0 .45rem; color: #50687a; font-size: .75rem; line-height: 1.45; }
.annotation-card-quote::before { content: "“"; }
.annotation-card-quote::after { content: "”"; }
.legacy-annotation-label { display: inline-block; margin-right: .3rem; padding: .08rem .3rem; border-radius: 999px; background: #e6ebef; color: #5b6c79; font-size: .68rem; }
.annotation-card-text { display: block; margin: 0 0 .5rem; color: #243746; font-size: .86rem; line-height: 1.5; white-space: pre-wrap; }
.annotation-card label { display: block; color: #465d70; font-size: .76rem; font-weight: 700; }
.annotation-card textarea { display: block; width: 100%; min-height: 4.25rem; margin: .3rem 0 .45rem; box-sizing: border-box; font: inherit; font-weight: 400; }
.annotation-palette { display: flex; flex-wrap: wrap; gap: .45rem; margin: 0 0 .55rem; }
.annotation-color-dot { width: 1.25rem; height: 1.25rem; padding: 0; border: 2px solid white; border-radius: 50%; background: var(--annotation-fill); box-shadow: 0 0 0 1px var(--annotation-edge); }
.annotation-color-dot[aria-pressed="true"] { box-shadow: 0 0 0 2px #243746, inset 0 0 0 2px white; }
.annotation-card-actions { display: flex; min-width: 0; flex-wrap: wrap; gap: .35rem; }
.annotation-card-actions { margin-top: .15rem; }
.annotation-card-actions button { padding: .3rem .48rem; font-size: .72rem; }
.object-annotation-cards { display: grid; gap: .55rem; margin-top: .6rem; }
.object-annotation-card { position: relative; }
.annotation-marker { position: relative; z-index: 2; display: inline-flex; margin-left: .2rem; vertical-align: -.16em; }
.annotation-marker:is(:hover, :focus-within, .is-pinned) { z-index: 41; }
.annotation-marker-button { display: inline-grid; width: 1.08rem; height: 1rem; padding: 0; place-items: center; border: 0; background: transparent; color: var(--annotation-edge); line-height: 1; }
.annotation-marker-button svg { display: block; width: 1rem; height: .94rem; overflow: visible; fill: var(--annotation-fill); stroke: var(--annotation-edge); stroke-linejoin: round; stroke-width: 1.4; }
.annotation-marker-button:hover svg, .annotation-marker.is-pinned .annotation-marker-button svg, .annotation-marker.is-linked .annotation-marker-button svg { filter: drop-shadow(0 0 2px var(--annotation-edge)); stroke-width: 2; }
.annotation-marker-popover { position: fixed; z-index: 40; display: none; width: min(18rem, calc(100vw - 1.5rem)); white-space: normal; }
.annotation-marker-popover-left { right: auto; }
.annotation-marker:hover > .annotation-marker-popover, .annotation-marker:focus-within > .annotation-marker-popover, .annotation-marker.is-pinned > .annotation-marker-popover { display: block; }
.source-title .annotation-marker-popover, .source-summary .annotation-marker-popover { width: min(13rem, calc(100vw - 3rem)); }
.reader-note-card, .chat-note-card { width: 100%; }
@keyframes memo-jump-pulse {
  0%, 100% { filter: none; }
  35% { filter: brightness(.9) saturate(1.45); box-shadow: 0 0 0 5px color-mix(in srgb, var(--annotation-edge) 30%, transparent); }
}
.memo-jump-flash { animation: memo-jump-pulse 1.6s ease-out; }
.chat-header { flex: 0 0 auto; min-width: 0; margin-right: -1.1rem; margin-left: -1.1rem; }
.chat-header h1 { margin-right: 0; margin-left: 0; }
.chat-header p { margin: 0 1.1rem .7rem; color: #4c6175; font-size: .84rem; line-height: 1.45; }
.chat-messages { flex: 1 1 auto; min-width: 0; min-height: 0; margin: 0 -.3rem; padding: 0 .3rem .6rem; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.chat-composer { flex: 0 0 auto; margin: 0 -.2rem -.2rem; padding: .7rem .2rem .2rem; border-top: 1px solid #d8e0e6; background: white; }
.chat-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .55rem; align-items: end; }
.chat-form-actions { display: grid; gap: .4rem; }
.chat-form label, .chat-form textarea { display: block; width: 100%; box-sizing: border-box; }
.chat-form label { color: #40576a; font-size: .8rem; font-weight: 700; }
.chat-form textarea { height: 9rem; min-height: 9rem; max-height: var(--chat-input-max-height, 60vh); margin: .35rem 0 0; resize: vertical; font: inherit; font-weight: 400; }
#chat-prompt[data-resized="true"] { min-height: 4.5rem; }
.chat-form button { min-height: 2.55rem; border: 1px solid #24577f; border-radius: .4rem; background: #24577f; color: white; font-weight: 700; }
#chat-status { min-height: 1.15rem; margin: .35rem 0 0; color: #607487; font-size: .76rem; line-height: 1.4; }
.chat-message { min-width: 0; max-width: 100%; margin: 1rem 0; padding: 1rem; overflow-wrap: anywhere; border-left: 4px solid #38678f; border-top: 4px solid #38678f; background: #f7fafc; }
.chat-message:first-child { margin-top: .25rem; }
.chat-message-label { display: block; margin-bottom: .25rem; color: #294e69; font-size: .75rem; }
.chat-message .chat-prompt { width: fit-content; max-width: 85%; margin: 0 0 .85rem auto; padding: .6rem .75rem; border-radius: .7rem .7rem .15rem .7rem; background: #e4eef6; text-align: left; }
.chat-output { width: fit-content; max-width: 100%; margin-right: auto; padding: .6rem .75rem; border-radius: .7rem .7rem .7rem .15rem; background: white; }
.chat-answer { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.chat-stopped { color: #53697b; font-style: italic; }
.chat-answer > :first-child { margin-top: 0; }
.chat-answer > :last-child { margin-bottom: 0; }
.chat-answer p { margin: 0 0 .55rem; line-height: 1.55; }
.chat-answer h3, .chat-answer h4, .chat-answer h5 { margin: .2rem 0 .5rem; color: #203f58; line-height: 1.35; }
.chat-answer h3 { font-size: 1.05rem; }
.chat-answer h4 { font-size: 1rem; }
.chat-answer h5 { font-size: .95rem; }
.chat-answer ul, .chat-answer ol { margin: 0 0 .55rem; padding-left: 1.3rem; }
.chat-answer li { margin: .18rem 0; line-height: 1.5; }
.chat-selection-note-button { position: fixed; z-index: 20; }
.chat-annotation-cards:empty { display: none; }
.citation-list, .response-utilities { display: flex; min-width: 0; max-width: 100%; flex-wrap: wrap; gap: .5rem; margin-top: .75rem; align-items: center; }
.citation-list button { display: grid; min-width: 0; max-width: 100%; overflow: hidden; text-align: left; }
.citation-source-title { display: block; max-width: 100%; overflow: hidden; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.citation-source-id { display: block; margin-top: .14rem; color: #617487; font-size: .68rem; }
.copy-answer-button { position: relative; display: inline-grid; width: 2rem; height: 2rem; padding: 0; place-items: center; border: 1px solid #8da1b1; border-radius: .4rem; background: white; color: #294e69; }
.copy-answer-button:hover, .copy-answer-button:focus-visible { border-color: #24577f; background: #edf5fa; color: #173f5d; }
.copy-answer-button svg { width: 1rem; height: 1rem; fill: none; stroke: currentcolor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.copy-answer-button::after { position: absolute; z-index: 4; bottom: calc(100% + .4rem); left: 0; padding: .32rem .45rem; border-radius: .3rem; background: #20384b; color: white; content: attr(data-tooltip); font-size: .72rem; font-weight: 600; line-height: 1; opacity: 0; pointer-events: none; transform: translateY(.2rem); transition: opacity .12s ease, transform .12s ease; white-space: nowrap; }
.copy-answer-button:hover::after, .copy-answer-button:focus-visible::after { opacity: 1; transform: translateY(0); }
/* Keep editor/highlight layers below the sticky Writing title while scrolling. */
.writing-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; isolation: isolate; }
.writing-editor-section { display: flex; min-height: 100%; flex-direction: column; }
.writing-editor-label { display: block; }
.annotatable-textarea { position: relative; margin: .5rem 0 0; }
#time-remaining.time-warning { color: #ff8177; }
.questionnaire-timer { margin: 0 0 .8rem; color: #17324d; font-weight: 800; font-variant-numeric: tabular-nums; }
.questionnaire-timer.time-warning { color: #c0392b; }
#report-editor { position: relative; z-index: 2; display: block; width: 100%; height: var(--draft-editor-default-height, 15rem); min-height: 6rem; max-height: var(--draft-editor-max-height, 50vh); box-sizing: border-box; margin: 0; padding: .5rem; resize: vertical; background: transparent; font: inherit; line-height: 1.5; }
#report-editor[data-resized] { min-height: 6rem; }
.draft-highlight-overlay { position: absolute; z-index: 1; inset: 0; overflow: hidden; border: 1px solid transparent; pointer-events: none; }
.draft-highlight-overlay > div { min-height: 100%; padding: .5rem; color: transparent; font: inherit; line-height: 1.5; overflow-wrap: break-word; white-space: pre-wrap; }
.draft-highlight-overlay .annotation-highlight { color: transparent; }
.draft-selection-note-button { top: .35rem; right: .35rem; left: auto; }
.writing-editor-meta { display: flex; min-width: 0; flex-wrap: wrap; justify-content: space-between; gap: 1rem; align-items: baseline; }
.writing-autosave-status, .writing-word-count { margin: .35rem 0 0; color: #788895; font-size: .75rem; line-height: 1.35; }
.writing-word-count { margin-left: auto; white-space: nowrap; text-align: right; }
.writing-action-bar { display: flex; min-width: 0; flex-wrap: wrap; justify-content: space-between; gap: 1rem; align-items: end; margin-top: .8rem; }
.submit-final-action { min-height: 2.55rem; margin-left: auto; border: 1px solid #24577f; border-radius: .4rem; background: #24577f; color: white; font-weight: 700; }
.submit-final-action:hover { background: #1c496d; }
.submit-final-action:disabled { border-color: #9aa9b8; background: #9aa9b8; cursor: default; }
.writing-submit-status { min-height: 1.15rem; margin: .35rem 0 0; color: #4c6175; font-size: .78rem; line-height: 1.4; text-align: right; }
.questionnaire-panel { max-width: 58rem; margin: 1rem auto; }
html:has(.questionnaire-form), body:has(.questionnaire-form) { overflow-x: clip; }
body:has(.questionnaire-form) .topbar { position: sticky; top: 0; z-index: 10; }
.questionnaire-form { display: grid; gap: 1.2rem; }
.questionnaire-section { display: grid; gap: .85rem; }
.questionnaire-area-references { margin: 0 0 .5rem; }
.questionnaire-area-references-multiple { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: 1rem; align-items: start; }
@media (max-width: 700px) { .questionnaire-area-references-multiple { grid-template-columns: minmax(0, 1fr); } }
.questionnaire-area-reference { margin: 0 0 .5rem; padding: 1rem; background: #fff; border: 1px solid #d2dce5; border-radius: .6rem; }
.questionnaire-area-reference img { display: block; width: auto; max-width: 100%; height: auto; max-height: 34rem; margin: 0 auto; object-fit: contain; }
.questionnaire-area-reference figcaption { margin-top: .65rem; text-align: center; color: #24577f; font-size: .9rem; line-height: 1.5; }
.questionnaire-item { display: grid; gap: .45rem; border: 1px solid #d2dce5; border-radius: .45rem; padding: .85rem; }
.questionnaire-item legend { padding: 0 .25rem; font-weight: 700; }
.questionnaire-option { display: flex; gap: .45rem; align-items: flex-start; }
.questionnaire-scale { margin: 0; color: #4c6175; }
.questionnaire-matrix { width: 100%; border-collapse: collapse; }
.questionnaire-matrix th, .questionnaire-matrix td { border: 1px solid #d2dce5; padding: .4rem; text-align: center; }
.questionnaire-matrix th:first-child { text-align: left; }
.questionnaire-other-text { width: min(100%, 32rem); margin-left: 1.5rem; }
.questionnaire-submit-status { min-height: 1.2rem; }
.questionnaire-item { scroll-margin-top: 5rem; }
.questionnaire-item--missing { border: 2px solid #b42318; background: #fff8f6; }
.questionnaire-item-error { color: #9f1b13; font-weight: 600; margin: .25rem 0; }
.questionnaire-validation { border: 1px solid #b42318; border-radius: .45rem; padding: .85rem; background: #fff8f6; color: #9f1b13; }
.questionnaire-validation p { margin: 0 0 .6rem; }
.questionnaire-validation-links { display: flex; flex-wrap: wrap; gap: .5rem; }
.questionnaire-validation-links button { background: white; color: #9f1b13; border: 1px solid #b42318; padding: .3rem .65rem; }
.recall-panel { max-width: 80rem; }
main:has(.recall-panel) { max-width: 1360px; }
.recall-panel h1 { margin-bottom: .4rem; }
.recall-panel h1, .recall-selection-heading, .recall-answer-heading { color: #24577f; }
.recall-panel p { line-height: 1.65; }
.recall-examples { margin: .5rem 0 1rem; padding-left: 0; list-style: none; line-height: 1.65; }
.recall-examples li + li { margin-top: .35rem; }
.recall-notice { padding: .8rem 1rem; border-left: 4px solid #bd8b2c; background: #fff7e7; }
.recall-selection-list { display: grid; gap: .8rem; }
.recall-selection-count { position: sticky; top: 0; z-index: 2; padding: .7rem; background: #e8f0f7; font-weight: 700; }
.recall-selection-card { padding: 1rem; background: white; border: 1px solid #b8c9d8; border-radius: .6rem; }
.recall-selection-card:has(input:checked) { border-color: #24577f; box-shadow: inset 4px 0 #24577f; }
.recall-selection-label { display: flex; align-items: flex-start; gap: .7rem; font-weight: 700; line-height: 1.6; cursor: pointer; }
.recall-panel input[type="radio"], .recall-panel input[type="checkbox"] { min-width: 0; width: 1rem; height: 1rem; flex: 0 0 1rem; padding: 0; margin: .2rem .15rem 0 0; }
.recall-selection-label input { margin-top: .4rem; }
.recall-panel details { margin-top: .8rem; }
.recall-panel summary { cursor: pointer; color: #24577f; padding: .3rem 0; line-height: 1.6; }
.recall-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; align-items: stretch; }
.recall-column { display: flex; flex-direction: column; min-width: 0; }
.recall-column > h3 { margin: 0 0 .75rem; line-height: 1.25; color: #24577f; }
.recall-card-panel { min-width: 0; padding: 1rem; background: white; border: 1px solid #cad5df; border-radius: .6rem; }
.recall-conversation-panel { position: relative; flex: 1; min-height: 24rem; overflow: hidden; }
.recall-conversation-scroll { position: absolute; inset: 0; padding: 1rem; overflow: auto; overscroll-behavior: contain; }
.recall-conversation-scroll > .recall-exchange { padding: 0; border: 0; border-radius: 0; background: transparent; }
.recall-exchange { min-width: 0; padding: .8rem 1rem; background: white; border: 1px solid #cad5df; border-radius: .6rem; }
.recall-exchange h3 { margin: 0 0 .6rem; color: #24577f; }
.recall-exchange h3, .recall-conversation-heading, .recall-answer-heading { font-size: 1.755em; }
.recall-exchange h4 { margin: .6rem 0 .3rem; font-size: .85rem; }
.recall-message { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.65; font-size: .93rem; padding: .7rem .8rem; border-radius: .5rem; }
.recall-prompt { background: #eaf2fa; }
.recall-response { background: #f4f5f6; }
.recall-answer-form { display: grid; gap: 1rem; flex: 1; align-content: start; }
.recall-answer-hint { font-size: .9rem; margin: 0; }
.recall-answer-form fieldset { margin: 0; padding: .9rem; border: 1px solid #b8c9d8; border-radius: .5rem; min-width: 0; background: white; }
.recall-answer-form legend { font-weight: 700; padding: 0 .25rem; line-height: 1.6; }
.recall-text-field p { margin: .2rem 0 .6rem; }
.recall-text-field select { width: 100%; padding: .4rem; margin-bottom: .6rem; font: inherit; }
.recall-text-field textarea { width: 100%; resize: vertical; min-height: 6rem; padding: .6rem; font: inherit; line-height: 1.6; border: 1px solid #aabfd0; border-radius: .3rem; }
.recall-rating-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .4rem; }
.recall-rating-options label { display: flex; align-items: flex-start; gap: .3rem; padding: .45rem; border: 1px solid #d3dce4; border-radius: .4rem; font-size: .86rem; line-height: 1.5; cursor: pointer; }
.recall-rating-options label:has(input:checked) { background: #e2effc; border-color: #24577f; }
.recall-rating-number { flex: 1 1 5rem; }
.recall-rating-special { grid-column: 1 / -1; }
.recall-card-nav, .recall-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0; }
.recall-card-nav button[aria-current] { background: #24577f; color: white; opacity: 1; }
.recall-primary { background: #24577f; color: white; border: 1px solid #24577f; border-radius: .4rem; font-weight: 700; padding: .75rem 1rem; margin-top: .5rem; }
.recall-muted { color: #546674; font-size: .85rem; }
.recall-status { min-height: 1.5rem; color: #24577f; }
.recall-status:empty { display: none; }
.recall-review-list { display: grid; grid-template-columns: repeat(var(--recall-review-count, 6), minmax(5.5rem, 1fr)); gap: .5rem; margin: 1.5rem 0 0; padding-bottom: .25rem; overflow-x: auto; }
.recall-review-item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .55rem; min-width: 0; min-height: 6.5rem; margin: 0; padding: .9rem .35rem; border: 1px solid #b8c9d8; border-radius: .6rem; background: white; color: #24577f; font-size: 1rem; font-weight: 600; line-height: 1.7; text-align: center; overflow-wrap: anywhere; }
.recall-review-title { font-size: 1rem; white-space: nowrap; }
.recall-review-answer-status { font-size: .8rem; font-weight: 400; line-height: 1.5; }
.recall-review-item:hover, .recall-review-item:focus-visible { border-color: #24577f; background: #e8f0f7; }
.recall-submit-actions { display: flex; justify-content: center; margin: 3rem 0 1rem; }
.recall-submit-review { max-width: 100%; min-height: 3.75rem; margin: 0; padding: 1rem 2rem; font-size: 1.1rem; line-height: 1.6; }
@media (max-width: 850px) {
  .recall-grid { grid-template-columns: minmax(0, 1fr); }
  .recall-conversation-panel { min-height: 0; }
  .recall-conversation-scroll { position: static; max-height: 65vh; padding: 0; }
}
#materials-panel { position: relative; padding: 1rem; border: 1px solid #aabfd0; border-radius: 0 .6rem .6rem .6rem; background: #e9f1f7; }
/* Raise the folder tab into the free space beside Submit without reducing the draft. */
#materials-panel > h2 { position: absolute; bottom: calc(100% - 1px); left: -1px; box-sizing: border-box; width: min(60%, 28rem); min-height: 5rem; margin: 0; padding: .75rem 1rem; border: 1px solid #aabfd0; border-bottom: 0; border-radius: .85rem 1.6rem 0 0; background: #e9f1f7; font-size: 1.15rem; line-height: 1.5; }
.materials-empty { color: #4c6175; }
.material-source-list { display: grid; gap: .7rem; padding: 0; list-style: none; }
.material-source { padding: .75rem; border: 1px solid #cbd5df; border-radius: .5rem; background: white; }
.material-source-heading { display: flex; flex-direction: column; gap: .6rem; align-items: flex-start; }
.material-source-heading > span { max-width: 100%; overflow-wrap: anywhere; }
.material-source-heading small { display: block; margin-top: .2rem; color: #617487; }
.material-source-actions { display: flex; flex-wrap: wrap; gap: .4rem; }
.material-source-actions button[aria-pressed="true"], .material-cite-source { border-color: #38678f; background: #38678f; color: white; }
.material-annotations { display: flex; flex-wrap: wrap; gap: .35rem; margin: .55rem 0 0; padding: 0; list-style: none; }
.material-annotations li { margin: 0; }
.material-annotation-color { display: inline-block; width: .72rem; height: .72rem; margin-right: .35rem; border-radius: 50%; background: var(--annotation-fill); box-shadow: inset 0 0 0 1px var(--annotation-edge); vertical-align: -.05rem; }
.material-annotation button { padding: .3rem .48rem; font-size: .74rem; }
/* Writing draft notes: side rail of icon chips, popover on hover/click (2026-09-02) */
.draft-editor-row { display: flex; gap: .5rem; align-items: stretch; min-width: 0; }
.draft-editor-row .annotatable-textarea { flex: 1 1 auto; min-width: 0; }
.draft-note-rail { position: relative; flex: 0 0 2.2rem; margin-top: .5rem; }
.draft-note-group { position: absolute; right: 0; display: flex; gap: .14rem; align-items: start; }
.draft-note-chip { margin-left: 0; }
.draft-note-chip .annotation-marker-popover { width: min(20rem, 60vw); }
.draft-note-chip .annotation-card { box-shadow: 0 8px 22px rgb(23 50 77 / 22%); }
.memo-library-note-card { margin: .45rem 0; }

/* Reading packs retain original figures alongside the existing text-note anchors. */
.source-section-heading { margin: 1.5rem 0 .55rem; font-size: 1.12rem; line-height: 1.4; color: #294653; }
.source-figure-open { display: block; width: 100%; padding: 0; border: 0; background: transparent; text-align: left; cursor: zoom-in; }
.source-figure-open > span { display: block; margin-top: .3rem; color: #385a70; font-size: .8rem; }
.source-figure-open:focus-visible { outline: 2px solid #17668b; outline-offset: 3px; }
.source-figure-dialog { width: 94vw; max-width: 1800px; height: 92vh; max-height: 92vh; padding: 1rem; border: 1px solid #bccbd4; border-radius: .8rem; }
.source-figure-dialog::backdrop { background: rgba(12, 28, 38, .6); }
.source-figure-dialog-controls { display: flex; justify-content: flex-end; gap: .65rem; margin-bottom: .65rem; }
.source-figure-dialog-viewport { width: 100%; height: calc(100% - 3rem); overflow: auto; }
.source-figure-dialog-viewport img { display: block; width: 100%; height: 100%; object-fit: contain; }
.source-figure-dialog.is-actual-size .source-figure-dialog-viewport img { width: auto; height: auto; max-width: none; max-height: none; }

/* Use the same speech card for every discussion source in both topics. */
.discussion-comment { border: 1px solid #a5aeb8; border-radius: 12px; padding: 16px 18px; margin: 16px 0 16px calc(var(--reply-depth, 0) * 14px); background: #fff; }
.discussion-speaker { display: flex; align-items: center; gap: 6px; color: var(--speaker-color, #334155); font-size: 1.05rem; font-weight: 700; margin: 0 0 12px; overflow-wrap: anywhere; }
.discussion-speaker-dot { display: inline-block; width: 8px; height: 8px; min-width: 8px; border-radius: 50%; background: var(--speaker-color, #334155); }
.discussion-comment .reader-paragraph { margin: 0 0 12px; padding: 0; border: 0; }
.discussion-comment .reader-paragraph:last-child { margin-bottom: 0; }
.discussion-comment .reader-body { margin: 0; line-height: 1.6; white-space: pre-wrap; }
.discussion-comment .discussion-speaker-passage .discussion-speaker { display: block; margin: 0; }
.discussion-section-heading { margin: 1.3rem 0 .7rem; padding: 0; }

/* Six-point ratings retain native radio selection and keyboard navigation. */
.rating-stars-block { width: min(100%, 32rem); margin: .35rem 0 .55rem; }
.rating-stars { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .25rem; }
.rating-star { position: relative; display: flex; align-items: center; justify-content: center; height: 2.8rem; min-width: 0; cursor: pointer; border: 2px solid transparent; border-radius: .4rem; }
.rating-stars .rating-star input[type="radio"] { position: absolute; width: 1px; min-width: 0; height: 1px; margin: 0; padding: 0; opacity: 0; }
.rating-star svg { width: 2rem; height: 2rem; pointer-events: none; overflow: visible; }
.rating-star polygon { fill: none; stroke: #657b90; stroke-width: 1.6; stroke-linejoin: round; }
.rating-star.is-filled polygon { fill: #24577f; stroke: #24577f; }
.rating-star:hover { background: #edf4fa; }
.rating-star:has(input:focus-visible) { border-color: #24577f; outline: 2px solid white; outline-offset: -4px; }
.rating-star-endpoints { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; color: #4c6175; font-size: .86rem; line-height: 1.5; margin-top: .2rem; }
.rating-star-endpoints span:last-child { text-align: right; }
.questionnaire-star-matrix { display: grid; gap: .6rem; }
.questionnaire-matrix-row { min-width: 0; margin: 0; padding: .55rem .65rem; border: 1px solid #d2dce5; border-radius: .4rem; }
.questionnaire-matrix-row legend { font-weight: 500; font-size: .95rem; }

.source-text-flow { line-height: 1.65; }
.source-text-flow > :first-child { margin-top: 0; }
.source-text-flow > :last-child { margin-bottom: 0; }
.source-flow-title { margin: 0 0 .85rem; font-size: 1.15rem; line-height: 1.4; }
.source-flow-authors { margin: 0; font-weight: 600; }
.source-flow-authors sup { font-size: .72em; line-height: 0; vertical-align: super; }
.source-flow-heading { margin: 1.4rem 0 .45rem; font-size: 1rem; line-height: 1.5; }
.source-flow-paragraph { margin: .65rem 0 1rem; }
.source-flow-list { list-style: none; margin: .65rem 0 1rem; padding-left: 1.35rem; }
.source-flow-list li { margin: .7rem 0; padding: 0; }
.source-flow-list .source-flow-list { margin: .4rem 0 .85rem; padding-left: 1.65rem; }
.source-flow-list .source-flow-list li { margin: .4rem 0; }
.source-flow-item-text { position: relative; }
.source-flow-bullet { position: absolute; left: -1.3em; width: 1.2em; }
.source-flow-footnotes { margin: 1.3rem 0; border-top: 1px solid #d8e2e8; color: #4e606c; font-size: .85rem; }
.source-flow-text.citation-target { outline: 2px dashed #d17900; outline-offset: 2px; }

.source-omitted-anchor { display: block; height: 0; overflow: hidden; }

/* Japanese guide copy; leave the English formal workspace controls unchanged. */
#tutorial-dialog { font-family: "Yu Gothic", Meiryo, sans-serif; }
#tutorial-progress { font-family: "Yu Gothic", Meiryo, sans-serif; font-size: 3cqw; }
#tutorial-skip { left: 38%; width: 24%; font-family: "Yu Gothic", Meiryo, sans-serif; font-size: 1.5cqw; }
#tutorial-last { left: 35%; top: 85%; width: 30%; height: 10%; font-family: "Yu Gothic", Meiryo, sans-serif; font-size: 1.8cqw; }

/* Readable guide text makes the image-based tutorial usable with page translation. */
#tutorial-dialog.has-translatable-text[open] { display: grid; grid-template-columns: minmax(0, 3fr) minmax(18rem, 2fr); align-items: start; width: min(96vw, 1600px); max-height: 94dvh; overflow: auto; }
.tutorial-text-panel { padding: 1rem 1.25rem; max-height: 88dvh; overflow: auto; font-size: 1rem; line-height: 1.6; }
.tutorial-text-panel h2 { font-size: 1.1rem; margin-top: 0; }
#tutorial-readable-text { white-space: pre-wrap; }
@media (max-width: 900px) { #tutorial-dialog.has-translatable-text[open] { grid-template-columns: minmax(0, 1fr); } .tutorial-text-panel { max-height: 45dvh; } }