.guide-topbar { position: static; flex-wrap: wrap; padding-block: 12px; }
.guide-nav { display: flex; gap: 24px; margin-left: auto; color: var(--muted); font-size: 1rem; }
.guide-nav a { display: inline-flex; align-items: center; min-height: 44px; }
.guide-nav a:hover, .guide-nav a[aria-current] { color: var(--gold); }
.learn-wrap { width: min(calc(100% - 64px),1000px); margin-inline: auto; padding-bottom: 72px; }
.breadcrumbs { margin-block: 28px 40px; font-size: .875rem; line-height: 1.6; color: var(--muted); }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 0; list-style: none; }
.breadcrumbs li { overflow-wrap: anywhere; }
.breadcrumbs li + li::before { content: '/'; margin-right: 8px; color: var(--gold); }
.breadcrumbs a:hover { text-decoration: underline; text-underline-offset: 4px; }
.reading { max-width: 760px; margin-inline: auto; }
.reading-header { margin-bottom: 36px; }
.reading-header h1 { max-width: 900px; font-size: clamp(2rem,4vw,2.8rem); line-height: 1.16; letter-spacing: -.035em; font-weight: 650; }
.reading-lead { margin-top: 24px; color: #c0c9cf; font-size: 1.125rem; line-height: 1.8; }
.reading-meta { margin-top: 22px; color: var(--muted); font-size: .875rem; }
.contents { margin-bottom: 42px; padding: 24px 28px; background: var(--panel); border-left: 2px solid var(--gold); font-size: 1rem; line-height: 1.7; }
.contents ol { margin-bottom: 0; padding-left: 22px; }
.contents li + li { margin-top: 8px; }
.contents a { text-decoration: underline; text-underline-offset: 4px; }
.reading-body { font-size: 1.0625rem; line-height: 1.8; color: #cdd5d9; }
.reading-body section + section { margin-top: 48px; padding-top: 36px; border-top: 1px solid var(--line); }
.reading-body h2, .reading-cta h2, .related > h2 { color: var(--text); font-size: clamp(1.5rem,3vw,2rem); line-height: 1.3; letter-spacing: -.02em; }
.reading-body h3 { margin-top: 30px; font-size: 1.25rem; color: var(--text); }
.reading-body p { margin-top: 18px; }
.reading-body li + li { margin-top: 14px; }
.reading-body ul, .reading-body ol { padding-left: 24px; }
.reading-body strong { color: var(--text); }
.reading-body a { color: var(--gold); text-decoration: underline; text-underline-offset: 4px; overflow-wrap: anywhere; }
.reading-body .source-note { font-size: .875rem; color: var(--muted); }
.formula { margin-block: 24px; padding: 24px; border: 1px solid #5c563f; border-radius: 8px; background: #1c211b; }
.formula p { margin: 0; }
.formula p + p { margin-top: 12px; }
.formula strong { font-size: clamp(1.35rem,4vw,1.85rem); color: var(--gold); }
.exercise { margin-top: 18px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.exercise summary { padding: 20px 24px; cursor: pointer; font-size: 1rem; font-weight: 600; color: var(--text); }
.exercise summary::marker { color: var(--gold); }
.exercise[open] summary { border-bottom: 1px solid var(--line); }
.exercise > div { padding: 0 24px 24px; }
.table-scroll { margin-top: 24px; overflow-x: auto; border: 1px solid var(--line); border-radius: 8px; }
.table-scroll table { width: 100%; border-collapse: collapse; font-size: 1rem; text-align: left; }
.table-scroll caption { padding: 16px; text-align: left; color: var(--muted); font-size: .875rem; }
.table-scroll th, .table-scroll td { padding: 14px 16px; border-top: 1px solid var(--line); vertical-align: top; }
.table-scroll thead { background: #19221f; color: var(--green); }
.reading-cta { margin-block: 44px 0; padding: 32px; border: 1px solid #5c563f; border-radius: 10px; background: linear-gradient(110deg,#25271e,#121e1a); }
.reading-cta > p:not(.eyebrow) { margin-top: 16px; color: #c0c9cf; }
.reading-cta .button { margin-top: 24px; text-align: center; white-space: normal; }
.reading-cta .reading-small { font-size: .875rem; }
.guide-cards { display: grid; gap: 22px; }
.guide-card { padding: 28px 0; border-top: 1px solid var(--line); }
.guide-label { color: var(--green); font-size: .875rem; margin-bottom: 12px; }
.guide-card h2, .guide-card h3 { font-size: clamp(1.25rem,2.6vw,1.6rem); line-height: 1.35; }
.guide-card h2 a, .guide-card h3 a { display: block; }
.guide-card a span { color: var(--gold); }
.guide-card a:hover { color: var(--gold); text-decoration: underline; text-underline-offset: 5px; }
.guide-card > p:last-child { margin-top: 14px; color: var(--muted); font-size: 1rem; }
.related { margin-top: 64px; padding-top: 32px; border-top: 1px solid var(--line); }
.related > h2 { margin-bottom: 28px; }
.related .guide-cards { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 32px; }
@media (max-width: 780px) {
  .learn-wrap { width: calc(100% - 40px); padding-bottom: 48px; }
  .breadcrumbs { margin-block: 22px 30px; }
  .guide-topbar { gap: 6px 16px; }.guide-nav { gap: 16px; }
  .reading-header h1 { font-size: clamp(1.9rem,5.7vw,2.6rem); }
  .contents, .reading-cta { padding: 24px; }
  .reading-body { font-size: 1rem; }.related .guide-cards { grid-template-columns: 1fr; gap: 8px; }
}
@media (max-width: 480px) {
  .guide-topbar .brand { order: 0; }.guide-topbar .locale-switch { order: 1; margin-left: auto; }
  .guide-nav { order: 2; flex-basis: 100%; margin-left: 0; }
  .reading-cta .button { width: 100%; }.exercise summary { padding: 18px; }.exercise > div { padding: 0 18px 18px; }
  .table-scroll th, .table-scroll td { padding: 12px; }.formula { padding: 20px; }
}
.hub-start { margin-top: 40px; padding-top: 30px; border-top: 1px solid var(--line); }
