:root {
  --ybk-paper: #f4f6f5;
  --ybk-sheet: #ffffff;
  --ybk-ink: #12343b;
  --ybk-ink-soft: #1d4750;
  --ybk-text: #1f2a2c;
  --ybk-muted: #566669;
  --ybk-line: #d6dedc;
  --ybk-tint: #e8eeec;
  --ybk-mark: #b5412b;
  --ybk-on-ink: #e9f0ee;
  --ybk-on-ink-dim: #a9bfc0;
  --ybk-r: 6px;
  --ybk-gap: 24px;
  --ybk-block: 32px;
  --ybk-font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html.ybk-lock { overflow: hidden; }
body { margin: 0; background: var(--ybk-paper); color: var(--ybk-text); font: 400 16px/1.8 var(--ybk-font); overflow-wrap: anywhere; }
img, svg, video, iframe { max-width: 100%; }
img { height: auto; }
a { color: var(--ybk-ink); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
:focus-visible { outline: 2px solid var(--ybk-ink-soft); outline-offset: 2px; }
h1, h2, h3 { margin: 0; font-weight: 600; color: var(--ybk-text); }
h1 { font-size: 28px; line-height: 1.35; }
h2 { font-size: 22px; line-height: 1.4; }
h3 { font-size: 18px; line-height: 1.45; }
p { margin: 0 0 16px; }
ul, ol { margin: 0; padding: 0; list-style: none; }

.ybk-icon { width: 24px; height: 24px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ybk-num { font-variant-numeric: tabular-nums; }
.ybk-hide { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ybk-skip { position: absolute; left: 16px; top: -48px; z-index: 200; padding: 4px 16px; background: var(--ybk-sheet); border-radius: var(--ybk-r); }
.ybk-skip:focus { top: 8px; }

.ybk-wrap { width: calc(100% - 32px); max-width: 1140px; margin-inline: auto; }
.ybk-row { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--ybk-gap); align-items: start; }
.ybk-c8 { grid-column: span 8; min-width: 0; }
.ybk-c4 { grid-column: span 4; min-width: 0; }

.ybk-bar { background: var(--ybk-ink); color: var(--ybk-on-ink); }
.ybk-bar-in { display: flex; align-items: center; gap: 24px; min-height: 64px; }
.ybk-brand { min-width: 0; flex: 0 1 auto; font-size: 17px; font-weight: 600; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ybk-brand a { color: inherit; }
.ybk-brand img { display: block; max-height: 40px; width: auto; }
.ybk-nav { margin-left: auto; flex: none; }
.ybk-nav-list { display: flex; gap: 4px; }
.ybk-nav-list a { display: block; padding: 4px 16px; border-radius: var(--ybk-r); color: var(--ybk-on-ink); }
.ybk-nav-list a:hover, .ybk-nav-list .current-menu-item a { background: var(--ybk-ink-soft); text-decoration: none; }
.ybk-tools { display: flex; gap: 8px; flex: none; }
.ybk-tool { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border: 1px solid var(--ybk-ink-soft); border-radius: var(--ybk-r); background: transparent; color: inherit; cursor: pointer; }
.ybk-tool:hover { background: var(--ybk-ink-soft); }
.ybk-tool-menu { display: none; }

.ybk-drawer, .ybk-finder { position: fixed; inset: 0; z-index: 100; overflow-y: auto; background: var(--ybk-ink); color: var(--ybk-on-ink); }
.ybk-drawer[hidden], .ybk-finder[hidden] { display: none; }
.ybk-drawer { padding: 0 16px 32px; }
.ybk-layer-head { display: flex; align-items: center; justify-content: space-between; min-height: 64px; }
.ybk-layer-title { font-weight: 600; }
.ybk-drawer a, .ybk-finder a { color: inherit; }
.ybk-drawer-list a { display: block; padding: 8px 0; border-bottom: 1px solid var(--ybk-ink-soft); font-size: 18px; }
.ybk-drawer-quick { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 24px; }
.ybk-drawer-quick a, .ybk-finder-quick a { display: block; height: 100%; padding: 8px; border: 1px solid var(--ybk-ink-soft); border-radius: var(--ybk-r); line-height: 1.5; }
.ybk-drawer-quick strong, .ybk-finder-quick strong { display: block; font-size: 14px; font-weight: 600; }
.ybk-drawer-quick small, .ybk-finder-quick small { display: block; font-size: 13px; color: var(--ybk-on-ink-dim); }
.ybk-drawer-more { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 24px; font-size: 14px; }
.ybk-finder-in { width: calc(100% - 32px); max-width: 752px; margin-inline: auto; padding-bottom: 32px; }
.ybk-finder .ybk-search input { border-color: transparent; font-size: 18px; }
.ybk-finder .ybk-search button { background: var(--ybk-paper); color: var(--ybk-ink); }
.ybk-finder-quick { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 24px; }

.ybk-search { display: flex; gap: 8px; margin-bottom: 24px; }
.ybk-search input { flex: 1 1 auto; min-width: 0; height: 48px; padding: 0 16px; border: 1px solid var(--ybk-line); border-radius: var(--ybk-r); background: var(--ybk-sheet); color: var(--ybk-text); font: inherit; }
.ybk-search button { flex: none; height: 48px; padding: 0 24px; border: 0; border-radius: var(--ybk-r); background: var(--ybk-ink); color: var(--ybk-on-ink); font: inherit; font-weight: 600; cursor: pointer; }

.ybk-lead { padding-block: 16px; }
.ybk-lead p { margin: 4px 0 0; color: var(--ybk-muted); font-size: 14px; line-height: 1.6; }

.ybk-block { margin-bottom: var(--ybk-block); }
.ybk-block > h2, .ybk-block-head { margin-bottom: 16px; padding-bottom: 8px; border-bottom: 1px solid var(--ybk-line); }
.ybk-block-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.ybk-block-head a { flex: none; font-size: 13px; }

.ybk-quick { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ybk-quick a { display: block; height: 100%; padding: 16px; border: 1px solid var(--ybk-line); border-radius: var(--ybk-r); background: var(--ybk-sheet); line-height: 1.5; }
.ybk-quick a:hover { border-color: var(--ybk-ink); text-decoration: none; }
.ybk-quick .ybk-icon { display: block; margin-bottom: 8px; color: var(--ybk-ink); }
.ybk-quick strong { display: block; font-size: 15px; font-weight: 600; }
.ybk-quick small { display: block; margin-top: 4px; color: var(--ybk-muted); font-size: 13px; }
.ybk-alert { margin: 8px 0 0; padding: 8px 16px; border-left: 3px solid var(--ybk-mark); background: var(--ybk-sheet); color: var(--ybk-mark); font-size: 14px; line-height: 1.6; }
.ybk-alert a { color: inherit; font-weight: 600; font-variant-numeric: tabular-nums; text-decoration: underline; }

.ybk-list { display: grid; gap: 16px; }
.ybk-card { display: grid; grid-template-columns: 368px minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; min-height: 278px; border: 1px solid var(--ybk-line); border-radius: var(--ybk-r); background: var(--ybk-sheet); overflow: hidden; }
.ybk-card-media { grid-row: 1 / span 2; display: block; }
.ybk-thumb { display: block; width: 368px; height: 276px; object-fit: cover; }
.ybk-thumb-none { display: flex; align-items: center; justify-content: center; background: var(--ybk-tint); color: var(--ybk-muted); font-size: 18px; font-weight: 600; }
.ybk-card-text { min-width: 0; padding: 16px 16px 8px; }
.ybk-card-title { font-size: 18px; line-height: 1.45; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.ybk-card-title a { color: var(--ybk-text); }
.ybk-card-sum { margin: 8px 0 0; color: var(--ybk-muted); font-size: 14px; line-height: 1.7; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.ybk-card-meta { display: flex; flex-wrap: wrap; gap: 0 16px; margin: 0; padding: 8px 16px; border-top: 1px solid var(--ybk-line); color: var(--ybk-muted); font-size: 13px; line-height: 1.7; font-variant-numeric: tabular-nums; align-self: end; }

.ybk-page { padding-top: 24px; }
.ybk-crumbs { display: flex; flex-wrap: wrap; gap: 0 8px; margin-bottom: 8px; color: var(--ybk-muted); font-size: 13px; line-height: 1.7; }
.ybk-crumbs a { color: inherit; }
.ybk-head { margin-bottom: 24px; }
.ybk-head-note { margin: 8px 0 0; color: var(--ybk-muted); }
.ybk-head-page { margin: 4px 0 0; color: var(--ybk-muted); font-size: 13px; }
.ybk-assetlink { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; padding: 4px 16px 4px 8px; border: 1px solid var(--ybk-ink); border-radius: var(--ybk-r); background: var(--ybk-sheet); font-size: 14px; }
.ybk-empty { padding: 16px; border: 1px dashed var(--ybk-line); border-radius: var(--ybk-r); color: var(--ybk-muted); }
.ybk-wayout h2 { margin: 24px 0 8px; font-size: 18px; }

.ybk-doc-meta { display: flex; flex-wrap: wrap; gap: 0 16px; margin: 8px 0 0; color: var(--ybk-muted); font-size: 13px; line-height: 1.7; font-variant-numeric: tabular-nums; }
.ybk-stamp { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0 16px; margin: 8px 0 0; padding: 4px 8px; border: 1px solid var(--ybk-mark); border-radius: var(--ybk-r); color: var(--ybk-mark); font-size: 13px; line-height: 1.7; font-variant-numeric: tabular-nums; }
.ybk-stamp .ybk-icon { width: 16px; height: 16px; margin-right: -8px; }
.ybk-stamp a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

.ybk-prose { max-width: 46em; }
.ybk-prose::after { content: ""; display: block; clear: both; }
.ybk-prose h2 { margin: 32px 0 16px; clear: none; }
.ybk-prose h3 { margin: 24px 0 8px; }
.ybk-prose ul, .ybk-prose ol { margin: 0 0 16px; padding-left: 24px; }
.ybk-prose ul { list-style: disc; }
.ybk-prose ol { list-style: decimal; }
.ybk-prose a { text-decoration: underline; text-underline-offset: 3px; }
.ybk-prose img { border-radius: var(--ybk-r); }
.ybk-prose blockquote { margin: 0 0 16px; padding: 8px 16px; border-left: 3px solid var(--ybk-line); background: var(--ybk-tint); }
.ybk-prose pre { overflow-x: auto; }
.ybk-prose table { clear: both; }
.ybk-figure { float: right; width: 368px; margin: 4px 0 16px 24px; }
.ybk-figure .ybk-thumb { border-radius: var(--ybk-r); }
.ybk-figure figcaption { margin-top: 4px; color: var(--ybk-muted); font-size: 13px; line-height: 1.6; }

.ybk-stack { width: 100%; margin: 0 0 16px; border-collapse: collapse; background: var(--ybk-sheet); font-size: 14px; line-height: 1.6; font-variant-numeric: tabular-nums; }
.ybk-stack th, .ybk-stack td { padding: 8px; border: 1px solid var(--ybk-line); text-align: left; vertical-align: top; }
.ybk-stack thead th, .ybk-stack tr:first-child th { background: var(--ybk-tint); font-weight: 600; }
.ybk-stack a[href^="tel:"] { font-weight: 600; }
.ybk-state { display: inline-block; padding: 0 8px; border: 1px solid var(--ybk-line); border-radius: var(--ybk-r); font-size: 13px; white-space: nowrap; }
.ybk-state-open { border-color: var(--ybk-ink); background: var(--ybk-ink); color: var(--ybk-on-ink); }
.ybk-state-soon { border-color: var(--ybk-ink); color: var(--ybk-ink); }
.ybk-state-over { color: var(--ybk-muted); }
.ybk-sheet { padding-bottom: 8px; }
.ybk-sheet .ybk-prose { max-width: none; }
.ybk-sheet-more { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 24px 0 var(--ybk-block); }
.ybk-sheet-more a { display: flex; align-items: center; gap: 8px; padding: 8px; border: 1px solid var(--ybk-line); border-radius: var(--ybk-r); background: var(--ybk-sheet); font-size: 14px; line-height: 1.5; }

.ybk-doc-tags { margin-top: 16px; }
.ybk-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ybk-chips a { display: block; padding: 0 8px; border: 1px solid var(--ybk-line); border-radius: var(--ybk-r); background: var(--ybk-sheet); font-size: 13px; line-height: 1.9; }
.ybk-sources { margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--ybk-line); }
.ybk-sources h2 { margin-bottom: 8px; font-size: 18px; }
.ybk-sources ol { padding-left: 24px; list-style: decimal; font-size: 14px; line-height: 1.7; }
.ybk-sources li { margin-bottom: 4px; }
.ybk-sources .ybk-num { margin-left: 8px; color: var(--ybk-muted); font-size: 13px; }
.ybk-doc { margin-bottom: var(--ybk-block); }
.ybk-turn { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: var(--ybk-block); }
.ybk-turn a { display: block; padding: 8px 16px; border: 1px solid var(--ybk-line); border-radius: var(--ybk-r); background: var(--ybk-sheet); font-size: 14px; line-height: 1.6; }
.ybk-turn small { display: block; color: var(--ybk-muted); font-size: 13px; }

.ybk-pages { margin-bottom: var(--ybk-block); margin-top: 24px; }
.ybk-pages ul { display: flex; flex-wrap: wrap; gap: 8px; }
.ybk-pages a, .ybk-pages .current, .ybk-pages .dots { display: block; min-width: 40px; padding: 4px 8px; border: 1px solid var(--ybk-line); border-radius: var(--ybk-r); background: var(--ybk-sheet); text-align: center; font-size: 14px; font-variant-numeric: tabular-nums; }
.ybk-pages .current { border-color: var(--ybk-ink); background: var(--ybk-ink); color: var(--ybk-on-ink); }
.ybk-pages .dots { border-color: transparent; background: none; }

.ybk-mod { margin-bottom: 24px; padding: 16px; border: 1px solid var(--ybk-line); border-radius: var(--ybk-r); background: var(--ybk-sheet); }
.ybk-mod h2 { margin-bottom: 8px; font-size: 16px; line-height: 1.5; }
.ybk-tip p { margin: 0; font-size: 15px; line-height: 1.7; }
.ybk-tip a { display: inline-block; margin-top: 8px; font-size: 13px; }
.ybk-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ybk-pair a { display: block; padding: 8px; border: 1px solid var(--ybk-line); border-radius: var(--ybk-r); line-height: 1.5; }
.ybk-pair strong { display: block; font-weight: 600; }
.ybk-pair small { color: var(--ybk-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.ybk-months { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; font-size: 14px; font-variant-numeric: tabular-nums; }
.ybk-recent li { display: flex; justify-content: space-between; gap: 8px; padding: 4px 0; font-size: 14px; line-height: 1.6; }
.ybk-recent time { flex: none; color: var(--ybk-muted); font-size: 13px; }
.ybk-picks { padding: 0; border: 0; background: none; }
.ybk-picks li { margin-bottom: 16px; }
.ybk-pick-media { display: none; }
.ybk-pick-title { display: block; font-size: 15px; line-height: 1.6; }

.ybk-foot { margin-top: 16px; padding-block: 32px 16px; background: var(--ybk-ink); color: var(--ybk-on-ink-dim); font-size: 14px; line-height: 1.8; }
.ybk-foot a { color: var(--ybk-on-ink); }
.ybk-foot h2 { margin-bottom: 8px; color: var(--ybk-on-ink); font-size: 15px; line-height: 1.5; }
.ybk-foot-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ybk-gap); }
.ybk-foot-note { margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--ybk-ink-soft); font-size: 13px; }
.ybk-foot-note p { margin: 0 0 4px; }

@media (min-width: 1172px) {
  .ybk-pick-media { display: block; width: 368px; margin: 0 -2px 8px; }
  .ybk-pick-media .ybk-thumb { border-radius: var(--ybk-r); }
}

@media (max-width: 991px) {
  :root { --ybk-block: 24px; }
  .ybk-c8 { grid-column: 1 / -1; }
  .ybk-side { display: none; }
  .ybk-nav { display: none; }
  .ybk-tools { margin-left: auto; }
  .ybk-tool-menu { display: inline-flex; }
}

@media (max-width: 767px) {
  h1 { font-size: 24px; }
  h2 { font-size: 20px; }
  .ybk-quick { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ybk-finder-quick { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ybk-sheet-more { grid-template-columns: minmax(0, 1fr); }
  .ybk-foot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .ybk-stack, .ybk-stack tbody, .ybk-stack tr, .ybk-stack td, .ybk-stack tbody th { display: block; width: 100%; }
  .ybk-stack { background: none; border: 0; }
  .ybk-stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .ybk-stack tr { margin-bottom: 8px; border: 1px solid var(--ybk-line); border-radius: var(--ybk-r); background: var(--ybk-sheet); }
  .ybk-stack tr:has(> th:only-child), .ybk-stack tr:not(:has(td)) { display: none; }
  .ybk-stack td, .ybk-stack tbody th { padding: 8px; border: 0; border-bottom: 1px solid var(--ybk-tint); }
  .ybk-stack td:last-child { border-bottom: 0; }
  .ybk-stack [data-label]::before { content: attr(data-label); display: block; color: var(--ybk-muted); font-size: 13px; font-weight: 400; }
}

@media (max-width: 719px) {
  .ybk-card { display: block; min-height: 0; width: calc(100% + 32px); margin-inline: -16px; border-inline: 0; border-radius: 0; }
  .ybk-thumb { width: 100%; height: auto; aspect-ratio: 4 / 3; }
  .ybk-card-text { padding: 16px 16px 8px; }
  .ybk-figure { float: none; width: calc(100% + 32px); margin: 0 -16px 16px; }
  .ybk-figure .ybk-thumb { border-radius: 0; }
  .ybk-figure figcaption { padding-inline: 16px; }
  .ybk-turn { grid-template-columns: minmax(0, 1fr); }
}
