@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;600;700&family=Noto+Serif+TC:wght@500;700&family=Roboto+Mono:wght@400;500;600&display=swap');
@import url('includes/gutw-tokens.css');

/* Editorial colours and manual/system theme overrides come from gutw-tokens.css.
   Refresh both consumers with: python design/sync_tokens.py (or --check). */
:root {
  --paper-grid-brightness: .99;
  --bs-body-font-family: "Noto Sans TC", "Microsoft JhengHei", sans-serif;
  --bs-body-font-size: 17px;
  --bs-body-line-height: 1.8;
  --bs-body-bg: var(--background);
  --bs-body-color: var(--foreground);
  --bs-emphasis-color: var(--foreground);
  --bs-secondary-color: var(--text-secondary);
  --bs-secondary-bg: var(--surface-muted);
  --bs-tertiary-color: var(--text-muted);
  --bs-tertiary-bg: var(--surface);
  --bs-heading-color: var(--foreground);
  --bs-link-color: var(--accent-text);
  --bs-link-hover-color: var(--accent-text);
  --bs-border-color: var(--border);
  --bs-code-color: var(--foreground);
  --quarto-body-bg: var(--background);
  --quarto-body-color: var(--foreground);
  --quarto-border-color: var(--border);
}

/* !important inventory: one, the active TOC colour (Quarto sets it with !important). Elsewhere scoped selectors override Quarto/Bootstrap
   without defeating their responsive visibility and sidebar controls. */
html, :root body {
  background: var(--background);
  color: var(--foreground);
  font-family: var(--bs-body-font-family);
  font-size: 17px;
  line-height: 1.8;
  text-autospace: normal;
  font-synthesis: none;
}
::selection { background: var(--surface-muted); color: var(--foreground); }
main, main.content, #quarto-document-content, #quarto-content { min-width: 0; }
main p, main ul, main ol, main dl, .callout { max-width: 36em; overflow-wrap: anywhere; }
p, .footnotes { text-wrap: pretty; }
@supports (word-break: auto-phrase) {
  main p, main ul, main ol, main dl, .callout { word-break: auto-phrase; }
}
:root body :is(h1, h2, h3, h4, h5, h6), .chapter-title {
  font-family: "Noto Serif TC", "PMingLiU", serif;
  color: var(--foreground);
  letter-spacing: -0.02em;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
#quarto-document-content h2 {
  border-top: 1px solid var(--border);
  border-bottom: 0;
  padding-top: 16px;
  margin-top: 48px;
  margin-bottom: 16px;
}
main h3 { font-size: 1.15em; }
:root body :is(.subtitle, .quarto-title-meta, .quarto-title-meta-heading,
  .breadcrumb, .quarto-page-breadcrumbs, .text-muted) { color: var(--text-secondary); }

/* Controls share the wine link role; coral marks the series and one revenue value. */
:root body a, :root body .sidebar-link, :root body .nav-link {
  color: var(--accent-text);
  text-decoration: underline;
  text-decoration-color: currentColor;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
/* Navigation lists and note markers rely on position, not underlines. */
:root body :is(#quarto-sidebar, #TOC, .nav-page, .quarto-page-breadcrumbs) a,
:root body :is(#quarto-sidebar .sidebar-link, a.footnote-ref, a.footnote-back) { text-decoration: none; }
:root body :is(#quarto-sidebar, #TOC) a:hover { text-decoration: underline; }
:root body a:hover, :root body a:focus-visible { color: var(--accent-text); }
:root body a:hover { text-decoration-thickness: 2px; }
:root body :focus-visible { outline: 2px solid var(--accent-text); outline-offset: 3px; }

/* The include joins Quarto's existing fixed header, so its own offset and
   sidebar/TOC/headroom calculations include these 48px on every viewport. */
.paper-series-header {
  height: 48px;
  box-sizing: border-box;
  border-bottom: 1px solid var(--foreground);
  background: var(--background);
}
.paper-series-header-inner {
  height: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  padding-inline: 20px;
  white-space: nowrap;
}
:root body .paper-series-wordmark {
  color: var(--foreground);
  font: 700 17px/1.4 "Noto Serif TC", "PMingLiU", serif;
  letter-spacing: -.04em;
  text-decoration: none;
}
.paper-series-wordmark b { color: var(--brand); display: inline-block; transform: scale(1.3); }
/* 股鼎標誌：襯線字＋橘紅小方塊（貼基線）；「研究室」為欄目標籤 */
.paper-series-wordmark { display: inline-flex; align-items: baseline; }
.paper-series-dot { display: inline-block; flex: none; width: 7px; height: 7px; margin-left: 3px; background: var(--brand); }
.paper-series-tag { margin-left: 12px; font: 500 15px/1.4 "Noto Sans TC", sans-serif; letter-spacing: 0; color: var(--text-secondary, var(--foreground)); }
.paper-series-tag::before { content: ""; display: inline-block; width: 1px; height: 14px; margin-right: 12px; background: var(--border-strong, currentColor); vertical-align: -2px; }
.paper-series-explore {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  margin-left: auto;
  font-size: 13px;
}
.paper-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-control);
  background: transparent;
  color: var(--accent-text);
}
.paper-theme-toggle:hover { background: var(--accent-subtle); }

:root body :is(#quarto-sidebar, .sidebar, #quarto-margin-sidebar,
  .quarto-secondary-nav, .quarto-sidebar-toggle-contents) {
  background: var(--background);
  color: var(--foreground);
}
#quarto-sidebar { border-right: 1px solid var(--border); }
:root body .sidebar-title, :root body .sidebar-title a {
  font-family: "Noto Serif TC", serif;
  font-size: 17px;
  line-height: 1.4;
  font-weight: 700;
  text-wrap: balance;
}
.sidebar-item-section > .sidebar-item-container .sidebar-item-text { font-weight: 600; }
#quarto-sidebar .sidebar-item-section ~ .sidebar-item-section {
  border-top: 1px solid var(--border-subtle);
  margin-top: 12px;
  padding-top: 12px;
}
:root body #quarto-sidebar .sidebar-link.active {
  border-left: 3px solid var(--accent-text);
  padding-left: 8px;
  font-weight: 700;
}
:root body #TOC a.active { border-left: 2px solid var(--accent-text); font-weight: 700; }
/* The single !important: Quarto's bootstrap sets the active TOC colour with !important (#0d6efd). */
:root body .sidebar nav[role=doc-toc] ul > li > a.active,
:root body .sidebar nav[role=doc-toc] ul > li > ul > li > a.active { color: var(--accent-text) !important; border-left-color: var(--accent-text); }
:root body :is(#TOC, #quarto-margin-sidebar) a.nav-link:not(.active) { color: var(--foreground); }
:root body #TOC a { font-size: 13px; text-wrap: pretty; }
:root body #quarto-sidebar .chapter-number {
  color: var(--text-secondary);
  font: 400 11px/1.4 var(--font-figures);
  font-variant-numeric: tabular-nums;
}
:root body :is(.quarto-btn-toggle, .quarto-secondary-nav .quarto-btn-toggle,
  #quarto-sidebar-toggle, .quarto-sidebar-toggle) { min-width: 44px; min-height: 44px; }
:root body .quarto-page-breadcrumbs a { color: var(--accent-text); }
.quarto-page-breadcrumbs :is(.chapter-number, .header-section-number) { display: none; }

/* Search includes Quarto's detached modal and selected result state. */
:root body :is(.aa-DetachedSearchButton, .aa-Autocomplete, .aa-Form,
  .aa-Panel, .aa-DetachedContainer, .aa-DetachedFormContainer, .aa-Input) {
  background: var(--surface);
  color: var(--foreground);
  border-color: var(--border);
  border-radius: 0;
}
:root body :is(.aa-DetachedSearchButtonIcon, .aa-SubmitIcon, .aa-ClearButton,
  .aa-DetachedCancelButton, .aa-DetachedSearchButtonPlaceholder) { color: var(--text-secondary); }
:root body :is(.aa-Item, .search-result-doc, .search-result-title,
  .search-result-text, .search-result-section, .search-result-doc-title) { color: var(--foreground); }
:root body .aa-Item[aria-selected="true"] { background: var(--surface-muted); }
:root body :is(mark, .search-match, .aa-ItemContentTitle mark) {
  background: var(--surface-muted);
  color: var(--foreground);
}

.header-section-number {
  display: inline-block;
  margin-right: 12px;
  color: var(--text-secondary);
  font: 500 12px/1.8 var(--font-figures);
  font-variant-numeric: tabular-nums;
  vertical-align: middle;
}
/* The explore grid belongs only to the first 120px of the title block. */
#title-block-header .quarto-title { position: relative; isolation: isolate; min-height: 120px; }
#title-block-header .quarto-title::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 120px;
  z-index: -1;
  pointer-events: none;
  /* Opaque, slightly darker token lines give about 1.75x the former 60% light grid contrast. */
  background-image: linear-gradient(to right, var(--series-grid) 1px, transparent 1px);
  background-size: calc(100% / 6) 100%;
  filter: brightness(var(--paper-grid-brightness));
  mask-image: linear-gradient(to bottom, black 0%, black calc(100% - 48px), transparent 100%);
}
:root body .quarto-title h1.title { font-size: 48px; font-weight: 700; }
:root body .quarto-title h1.title > :is(.header-section-number, .chapter-number) {
  display: flex;
  align-items: center;
  margin: 0 0 8px;
  color: var(--text-secondary);
  font: 500 12px/1.8 var(--font-figures);
  font-variant-numeric: tabular-nums;
}
.quarto-title h1.title > :is(.header-section-number, .chapter-number)::before {
  content: "";
  order: -2;
  width: 24px;
  height: 2px;
  margin-right: 12px;
  background: var(--brand);
  flex-shrink: 0;
}
/* Separate the section sign from the coral rule without changing the number. */
.quarto-title h1.title > :is(.header-section-number, .chapter-number)::after {
  content: "§";
  order: -1;
}
/* Quarto puts "&nbsp; " between the number and the title; collapse it so the title starts flush left. */
:root body .quarto-title h1.title:has(> .chapter-number) { font-size: 0; }
:root body .quarto-title h1.title > .chapter-title { font-size: 48px; }

/* Tables retain the body's full width; numeric cells are tagged by Lua. */
:root body :is(.table, table) {
  --bs-table-color: var(--foreground);
  --bs-table-bg: var(--background);
  --bs-table-border-color: var(--border-subtle);
  --bs-table-striped-color: var(--foreground);
  --bs-table-striped-bg: transparent;
  --bs-table-hover-color: var(--foreground);
  --bs-table-hover-bg: transparent;
  --bs-table-active-color: var(--foreground);
  --bs-table-active-bg: transparent;
  --bs-table-accent-bg: transparent;
  color: var(--foreground);
}
#quarto-document-content table {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
  font-family: var(--font-figures);
  font-variant-numeric: tabular-nums;
}
#quarto-document-content :is(th, td) {
  background: var(--background);
  border-bottom: 1px solid var(--border-subtle);
  padding: 8px;
  white-space: normal;
  overflow-wrap: anywhere;
  vertical-align: top;
  box-shadow: none;
}
#quarto-document-content thead th { border-bottom: 1px solid var(--foreground); font-weight: 700; }
#quarto-document-content .numeric-cell { text-align: right; white-space: nowrap; }
/* Quarto drops cell classes on this table; column 3 (占比/金額) is addressed by position. */
#quarto-document-content .relation-table-wrap td:nth-child(3) {
  font-family: var(--font-figures);
  font-variant-numeric: tabular-nums;
  overflow-wrap: normal;
  word-break: keep-all;
}
#quarto-document-content .relation-table-wrap td:nth-child(3):empty::before { content: "—"; color: var(--text-muted); }
.keep-whole { white-space: nowrap; }
/* Figures never split mid-number: no anywhere-breaks in numeric cells. */
#quarto-document-content .numeric-cell { overflow-wrap: normal; word-break: keep-all; }
#quarto-document-content :is(th, td).latest-year { font-weight: 600; }
#quarto-document-content .revenue-signature {
  text-decoration-line: underline;
  text-decoration-color: var(--brand);
  text-decoration-thickness: 4px;
  text-underline-offset: 6px;
  text-decoration-skip-ink: none;
}
figure, .num { font-variant-numeric: tabular-nums; }
figcaption, .num { font-family: var(--font-figures); }
main figure, main img, main svg { max-width: 100%; }
.relgraph { max-width: 100%; overflow-x: auto; }
.paper-table { position: relative; min-width: 0; max-width: 100%; }
.paper-table-scroll { min-width: 0; max-width: 100%; overflow-x: auto; }
.paper-table::after {
  content: "";
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 24px;
  z-index: 3;
  pointer-events: none;
  background: linear-gradient(to right, transparent, var(--background));
}
.paper-table.can-scroll-right::after { display: block; }

/* Footnotes remain ordinary expanded document notes, including every URL. */
:root body .footnotes {
  border-top: 1px solid var(--border);
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.6;
}
/* Keep the section border; Pandoc's adjacent horizontal rule is redundant. */
.footnotes > hr { display: none; }
.footnotes::before {
  content: var(--paper-footnote-label);
  display: block;
  margin-block: 12px;
  color: var(--text-secondary);
  font-size: 12px;
}
#quarto-document-content .footnotes :is(li, p) {
  max-width: 100%;
  font-size: 13px;
  line-height: 1.6;
  text-wrap: pretty;
}
.footnotes > ol { max-width: 100%; padding-left: 0; }
.footnotes > ol > li {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  column-gap: 8px;
  margin-bottom: 10px;
}
.footnotes > ol > li > * { grid-column: 2; min-width: 0; }
.footnotes > ol > li > .footnote-badge {
  grid-column: 1;
  grid-row: 1;
  justify-self: stretch;
  align-self: start;
  box-sizing: border-box;
  min-width: 100%;
  text-align: center;
  white-space: nowrap;
}
.footnote-badge-empty { color: var(--text-muted); }
.footnotes p { margin-bottom: 0; }
#quarto-document-content .footnotes li:has(.repeat-note),
#quarto-document-content .footnotes li:has(.repeat-note) :is(p, li) {
  color: var(--text-muted);
  font-size: 12px;
}
/* --text-muted alone is too close to the note colour; mark repeats explicitly (visual label, text unchanged). */
#quarto-document-content .footnotes li:has(.repeat-note) .page-badge { border-style: dashed; }
#quarto-document-content .footnotes .repeat-note::before {
  content: "同上";
  margin-right: 8px;
  padding: 0 4px;
  border: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  font: 500 11px/1.6 var(--font-figures);
}
:root body a.footnote-ref {
  color: var(--accent-text);
  font-family: var(--font-figures);
  font-variant-numeric: tabular-nums;
}
.page-badge {
  display: inline-block;
  padding: 2px 6px;
  border: 1px solid var(--accent-text);
  color: var(--accent-text);
  font: 500 12px/1.55 var(--font-figures);
  font-variant-numeric: tabular-nums;
  vertical-align: baseline;
}
.page-badge.source-badge { border-color: var(--badge-source-border); color: var(--text-secondary); }
.footnotes .source-url {
  display: inline;
  max-width: 100%;
  overflow-wrap: anywhere;
}
/* A word joiner keeps the short link and its following return arrow together. */
.footnotes .source-url::after { content: "\2060"; }
:root body .footnotes .source-url a {
  display: inline-block;
  color: var(--accent-text);
  font-size: 0;
  vertical-align: baseline;
  overflow-wrap: anywhere;
}
.footnotes .source-url a::after { content: "開啟原文 →"; font: 400 13px/1.6 var(--bs-body-font-family); }
:root body .footnotes a.footnote-back { margin-left: 6px; white-space: nowrap; }
a.uri { overflow-wrap: anywhere; }

/* Code uses the reading face; figures, tables and source locators use mono. */
:root body :is(code, kbd, pre, pre code) {
  font-family: var(--bs-body-font-family);
  color: var(--foreground);
  background: var(--surface-muted);
}
:root body :is(pre, div.sourceCode) { max-width: 100%; overflow-x: auto; background: var(--surface-muted); }
:root body code span { color: inherit; }
:root body :is(.code-copy-button, .code-copy-button:hover) { color: var(--text-secondary); background: var(--surface); }
:root body div.callout {
  padding: 16px 20px;
  border-color: var(--border-subtle);
  border-left: 3px solid var(--badge-source-border);
  border-radius: 0;
  background: transparent;
}
:root body div.callout :is(.callout-header, .callout-body) { padding: 0; }
:root body div.callout :is(.callout-header, .callout-body-container) { color: var(--foreground); background: transparent; }
:root body div.callout .callout-icon::before { background-image: none; }
:root body div.callout .callout-icon { color: var(--text-secondary); }
:root body :is(.page-footer, .nav-footer) {
  background: var(--surface-muted);
  color: var(--foreground);
  border-top: 1px solid var(--border);
}
:root body .nav-footer :is(.nav-footer-left, .nav-footer-center, .nav-footer-right) { color: var(--foreground); }
hr { border-color: var(--border); opacity: 1; }

/* Dark grid contrast is another 30% stronger; explicit choices override the OS. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --paper-grid-brightness: 1.25; }
}
:root[data-theme="dark"] { --paper-grid-brightness: 1.25; }
:root[data-theme="light"] { --paper-grid-brightness: .99; }

@media (max-width: 767.98px) {
  :root body .quarto-title h1.title,
  :root body .quarto-title h1.title > .chapter-title { font-size: 32px; }
  :root body .quarto-title h1.title:has(> .chapter-number) { font-size: 0; }
  #quarto-document-content .paper-table-scroll table { min-width: 100%; max-width: none; }
  #quarto-document-content :is(th, td) { min-width: 6em; }
  /* Columns after the Lua reorder: 1 對象, 2 關係, 3 占比/金額, 4 期間. */
  #quarto-document-content .relation-table-wrap table { width: max-content; font-size: 14px; }
  #quarto-document-content .relation-table-wrap col { width: auto; }
  #quarto-document-content .relation-table-wrap :is(th, td) { width: 6em; max-width: 6em; }
  #quarto-document-content .relation-table-wrap :is(th, td):nth-child(1) { width: 8.5em; min-width: 8.5em; max-width: 8.5em; }
  /* The 期間 column sits past the first screen; say so in words, not only with the edge fade. */
  #quarto-document-content .relation-table-wrap::before {
    content: "左右滑動看期間 →";
    display: block;
    margin-bottom: 4px;
    color: var(--text-secondary);
    font-size: 12px;
  }
  #quarto-document-content .relation-table-wrap :is(th, td):nth-child(2) { width: 5em; min-width: 5em; max-width: 5em; white-space: nowrap; }
  /* 11em fits 「新台幣3,960,304仟元」 on one line; the share and amount may only split at 「；」. */
  #quarto-document-content .relation-table-wrap :is(th, td):nth-child(3) {
    width: 11em; min-width: 11em; max-width: 11em;
    font-family: var(--font-figures); overflow-wrap: normal; word-break: keep-all;
  }
  #quarto-document-content .relation-table-wrap :is(th, td):nth-child(4) {
    width: auto;
    min-width: 9em;
    max-width: none;
    color: var(--text-secondary);
    font-size: 12px;
    white-space: nowrap;
  }
  #quarto-document-content tr > :first-child {
    position: sticky;
    left: 0;
    z-index: 1;
    background: var(--background);
  }
  #quarto-document-content thead tr > :first-child { z-index: 2; }
  .footnotes > ol > li { grid-template-columns: 52px minmax(0, 1fr); margin-bottom: 8px; }
  #quarto-document-content .footnotes :is(li, p) { font-size: 12px; }
  /* 44px hit area from padding; the equal negative margin keeps the line box at the text's height. */
  :root body .footnotes .source-url a { padding-block: 12px; margin-block: -12px; }
  .paper-series-header-inner { padding-inline: 12px; gap: 8px; }
}
@media (max-width: 991.98px) {
  #quarto-header .quarto-secondary-nav > .container-fluid { min-width: 0; flex-wrap: nowrap; }
  #quarto-header .quarto-btn-toggle, #quarto-header .quarto-search-button { flex-shrink: 0; }
  :root body .quarto-secondary-nav .quarto-page-breadcrumbs {
    display: block;
    min-width: 0;
    flex: 1;
    align-self: center;
    padding-right: 0;
    margin-left: 0;
  }
  .quarto-page-breadcrumbs .breadcrumb { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  /* Earlier crumbs remain in the accessibility tree without consuming space. */
  .quarto-page-breadcrumbs .breadcrumb-item:not(:last-child) {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }
  .quarto-page-breadcrumbs .breadcrumb-item:last-child { display: block; float: none; padding-left: 0; }
  .quarto-page-breadcrumbs .breadcrumb-item:last-child::before { display: none; }
  .quarto-page-breadcrumbs .breadcrumb-item:last-child > a,
  .quarto-page-breadcrumbs .breadcrumb-item:last-child .chapter-title {
    display: block;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  /* Flex ignores Quarto's whitespace-only node after the hidden chapter number.
     No offsets or string slicing can eat the first ticker digit. */
  .quarto-page-breadcrumbs .breadcrumb-item:last-child > a:has(> .chapter-title) { display: flex; }
}
