:root {
  --hk-blue-900: #001b57;
  --hk-blue-700: #0033a1;
  --hk-blue-600: #1a4cc4;
  --hk-blue-50: #eef2fb;
  --hk-orange-500: #f58220;
  --hk-orange-600: #f05a1a;
  --hk-cta: #c4470f;
  --hk-cta-hover: #a63a0a;
  --hk-paper: #faf7f2;
  --hk-paper-2: #f2ede4;
  --hk-paper-3: #e8e1d3;
  --hk-ink: #13131a;
  --hk-ink-700: #2a2a33;
  --hk-ink-500: #5a5a66;
  --hk-line: #e2ddd2;
  --hk-display: 'Sofia Sans', 'Manrope', system-ui, sans-serif;
  --hk-body: 'Manrope', system-ui, sans-serif;
  --hk-serif: 'PT Serif', Georgia, serif;
  --hk-shadow-book: 0 1px 2px rgba(0,0,0,.06), 0 8px 24px rgba(20,20,40,.12), 0 24px 48px -12px rgba(20,20,40,.18);
  --bs-body-font-family: var(--hk-body);
  --bs-body-font-size: 1rem;
  --bs-body-color: var(--hk-ink);
  --bs-body-bg: var(--hk-paper);
  --bs-primary: #0033a1;
  --bs-primary-rgb: 0, 51, 161;
  --bs-link-color: #0033a1;
  --bs-link-color-rgb: 0, 51, 161;
  --bs-link-hover-color: #001b57;
  --bs-link-hover-color-rgb: 0, 27, 87;
  --bs-border-color: #e2ddd2;
}
body { margin: 0; }
.hk { font-family: var(--hk-body); color: var(--hk-ink); background: var(--hk-paper); line-height: 1.55; font-size: 1rem; }
@media (min-width: 1200px) { .hk .container { max-width: 1280px; } }
.hk a { text-underline-offset: 4px; }
.hk :focus-visible { outline: 3px solid var(--hk-orange-500); outline-offset: 2px; }
.hk .btn { --bs-btn-font-family: var(--hk-body); --bs-btn-font-weight: 700; --bs-btn-font-size: .8125rem; --bs-btn-padding-x: 1.25rem; --bs-btn-border-radius: 2px; letter-spacing: .06em; text-transform: uppercase; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; }
.hk .btn-primary { --bs-btn-bg: #0033a1; --bs-btn-border-color: #0033a1; --bs-btn-hover-bg: #001b57; --bs-btn-hover-border-color: #001b57; --bs-btn-active-bg: #001b57; --bs-btn-active-border-color: #001b57; }
.hk .btn-cta { --bs-btn-color: #fff; --bs-btn-bg: var(--hk-cta); --bs-btn-border-color: var(--hk-cta); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--hk-cta-hover); --bs-btn-hover-border-color: var(--hk-cta-hover); --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--hk-cta-hover); --bs-btn-active-border-color: var(--hk-cta-hover); }
.hk .btn-ink { --bs-btn-color: #fff; --bs-btn-bg: var(--hk-ink); --bs-btn-border-color: var(--hk-ink); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #000; --bs-btn-hover-border-color: #000; }
.hk .btn-outline-ink { --bs-btn-color: var(--hk-ink); --bs-btn-border-color: var(--hk-ink); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--hk-ink); --bs-btn-hover-border-color: var(--hk-ink); --bs-btn-border-width: 1.5px; }
.hk .btn-outline-primary { --bs-btn-color: #0033a1; --bs-btn-border-color: #0033a1; --bs-btn-hover-bg: #0033a1; --bs-btn-hover-border-color: #0033a1; --bs-btn-border-width: 1.5px; }
.hk .btn-white { --bs-btn-color: var(--hk-blue-700); --bs-btn-bg: #fff; --bs-btn-border-color: #fff; --bs-btn-hover-color: var(--hk-blue-900); --bs-btn-hover-bg: var(--hk-blue-50); --bs-btn-hover-border-color: var(--hk-blue-50); }
.hk .btn-outline-light { --bs-btn-border-width: 1.5px; }
.btn-compact { min-height: 44px !important; --bs-btn-padding-x: 1rem !important; }
.icon-btn { width: 44px; height: 44px; border: 0; background: transparent; color: inherit; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.icon-btn:hover { background: rgba(0,0,0,.06); }
.kicker { display: inline-flex; align-items: center; gap: .75rem; font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--hk-ink-500); }
.kicker::before { content: ""; width: 28px; height: 2px; background: var(--hk-orange-500); flex: none; }
.kicker-light { color: #c9d4f2; }
.label { font-size: .6875rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--hk-blue-700); }
.badge-hk { display: inline-block; font-size: .6875rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: .3125rem .5rem; border-radius: 2px; color: #fff; background: var(--hk-blue-700); }
.badge-orange { background: var(--hk-cta); }
.badge-ink { background: var(--hk-ink); }
.meta { font-size: .8125rem; color: var(--hk-ink-500); }
.muted { color: var(--hk-ink-500); }
.display-xl { font-family: var(--hk-display); font-weight: 800; font-size: clamp(2.5rem, 1.4rem + 4vw, 4.75rem); line-height: .98; letter-spacing: -.02em; margin: 1.25rem 0 0; }
.display-lg { font-family: var(--hk-display); font-weight: 800; font-size: clamp(2rem, 1.3rem + 2.4vw, 3.25rem); line-height: 1.02; letter-spacing: -.015em; margin: .75rem 0 0; }
.display-md { font-family: var(--hk-display); font-weight: 700; font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); line-height: 1.1; margin: .5rem 0 0; }
.accent { font-family: var(--hk-serif); font-style: italic; font-weight: 400; color: var(--hk-orange-600); letter-spacing: 0; }
.accent-light { font-family: var(--hk-serif); font-style: italic; font-weight: 400; color: var(--hk-orange-500); }
.lede { font-family: var(--hk-serif); font-style: italic; font-size: clamp(1.0625rem, 1rem + .3vw, 1.25rem); line-height: 1.55; color: var(--hk-ink-700); max-width: 560px; margin: 1.5rem 0 0; }
.link-more { color: var(--hk-blue-700); font-weight: 700; font-size: .875rem; text-decoration: none; display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; border-bottom: 1.5px solid currentColor; padding-top: .5rem; }
.link-more:hover { color: var(--hk-blue-900); }
.link-card { color: inherit; text-decoration: none; display: block; }
.link-card:hover { color: inherit; }
.link-card:hover .hover-title { text-decoration: underline; text-decoration-thickness: 1.5px; }
.topbar { background: var(--hk-blue-900); color: #dfe6f7; font-size: .8125rem; }
.topbar a { color: #dfe6f7; text-decoration: none; display: inline-flex; align-items: center; gap: .375rem; min-height: 36px; }
.topbar a:hover { color: #fff; text-decoration: underline; }
.site-header { background: var(--hk-paper); border-bottom: 1px solid var(--hk-line); position: relative; z-index: 5; }
.site-header .navbar { padding: 0; min-height: 84px; }
.brand { padding: 0; margin: 0; display: flex; align-items: center; }
.brand-logo { height: 40px; width: auto; display: block; }
.main-nav .nav-link { color: var(--hk-ink-700); font-weight: 600; font-size: .9375rem; padding: 1.875rem 0 calc(1.875rem - 2px); margin: 0 1rem; border-bottom: 2px solid transparent; }
.main-nav .nav-link:hover { color: var(--hk-blue-700); }
.main-nav .nav-link.active { color: var(--hk-ink); border-bottom-color: var(--hk-orange-500); }
@media (max-width: 991.98px) {
  .site-header .navbar { min-height: 64px; }
  .brand-logo { height: 30px; }
  .main-nav { padding-top: .5rem; }
  .main-nav .nav-link { margin: 0; padding: .875rem 0; border-bottom: 1px solid var(--hk-line); font-size: 1.0625rem; }
  .main-nav .nav-link.active { border-bottom-color: var(--hk-line); color: var(--hk-blue-700); }
}
.app-banner { background: var(--hk-paper-2); border-bottom: 1px solid var(--hk-line); padding: .375rem .75rem .375rem .25rem; }
.app-banner-title { font-weight: 700; font-size: .875rem; line-height: 1.3; }
.app-banner-sub { font-size: .75rem; color: var(--hk-ink-500); line-height: 1.3; }
.section { padding: 6rem 0; }
.section-sm { padding: 4rem 0; }
.bg-paper-2 { background: var(--hk-paper-2); }
.bg-navy { background: var(--hk-blue-900); color: #fff; }
.bg-blue { background: var(--hk-blue-700); color: #fff; }
.section-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1.5rem; flex-wrap: wrap; margin-bottom: 3rem; }
.section-intro { font-family: var(--hk-serif); font-style: italic; color: var(--hk-ink-500); max-width: 380px; margin: 0; }
@media (max-width: 767.98px) { .section { padding: 3.5rem 0; } .section-sm { padding: 2.5rem 0; } .section-head { margin-bottom: 2rem; } }
.hero { background: var(--hk-paper-2); position: relative; overflow: hidden; }
.hero .carousel-item { min-height: 600px; }
.hero-slide { padding: 4.5rem 0 6rem; }
.hero-art { position: relative; min-height: 460px; }
.hero-cover { position: absolute; right: 8%; top: 0; width: 46%; max-width: 300px; box-shadow: var(--hk-shadow-book); border-radius: 2px; transform: rotate(2deg); z-index: 2; }
.hero-spread { position: absolute; left: 0; bottom: 10px; width: 78%; box-shadow: var(--hk-shadow-book); border-radius: 2px; transform: rotate(-3deg); z-index: 1; }
.hero-photo { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 2px; box-shadow: var(--hk-shadow-book); }
.hero-cover-solo { display: block; width: 62%; max-width: 320px; margin: 0 auto; box-shadow: var(--hk-shadow-book); border-radius: 2px; transform: rotate(-2deg); }
.hero-stamp { position: absolute; z-index: 3; right: 0; top: 18%; width: 112px; height: 112px; border-radius: 50%; background: var(--hk-cta); color: #fff; display: flex; align-items: center; justify-content: center; text-align: center; font-size: .6875rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; line-height: 1.3; transform: rotate(12deg); padding: .75rem; }
.hero-facts { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin-top: 1.5rem; font-size: .875rem; color: var(--hk-ink-500); }
.hero-facts strong { color: var(--hk-ink); font-weight: 700; }
.hero-controls { position: absolute; left: 0; right: 0; bottom: 0; border-top: 1px solid var(--hk-line); background: rgba(250,247,242,.7); backdrop-filter: blur(6px); z-index: 4; }
.hero-controls .container { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 64px; }
.hero-dots { display: flex; gap: .375rem; margin: 0; padding: 0; list-style: none; position: static; }
.hero-dots button { width: 28px; height: 4px; border: 0; padding: 0; border-radius: 2px; background: var(--hk-paper-3); }
.hero-dots button.active { width: 44px; background: var(--hk-orange-500); }
.hero-arrow { width: 44px; height: 44px; border-radius: 999px; border: 1px solid var(--hk-line); background: #fff; color: var(--hk-ink); display: inline-flex; align-items: center; justify-content: center; }
.hero-arrow:hover { border-color: var(--hk-ink); }
@media (max-width: 991.98px) {
  .hero .carousel-item { min-height: 0; }
  .hero-slide { padding: 2.5rem 0 6.5rem; }
  .hero-art { min-height: 340px; margin-top: 1rem; }
  .hero-cover { width: 50%; right: 4%; }
  .hero-stamp { width: 92px; height: 92px; font-size: .625rem; }
}
.news-lead-img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 2px; display: block; }
.news-img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 2px; display: block; }
.news-cover-wrap { aspect-ratio: 3 / 2; border-radius: 2px; display: flex; align-items: center; justify-content: center; padding: 1.25rem; }
.news-cover-wrap img { height: 100%; width: auto; box-shadow: var(--hk-shadow-book); border-radius: 2px; }
.tint-teal { background: #d7ecec; } .tint-pink { background: #f6e1ea; } .tint-sand { background: #ece4d4; } .tint-blue { background: var(--hk-blue-50); }
.news-meta { display: flex; align-items: center; gap: .75rem; margin-top: 1.25rem; }
.news-lead-title { font-family: var(--hk-display); font-weight: 700; font-size: clamp(1.75rem, 1.3rem + 1.4vw, 2.5rem); line-height: 1.08; margin: .875rem 0 0; }
.news-title { font-family: var(--hk-display); font-weight: 700; font-size: 1.3125rem; line-height: 1.2; margin: .75rem 0 0; }
.news-excerpt { font-family: var(--hk-serif); color: var(--hk-ink-500); margin: .75rem 0 0; }
.news-lead-excerpt { font-family: var(--hk-serif); font-style: italic; font-size: 1.125rem; color: var(--hk-ink-700); margin: 1rem 0 0; }
.photo-credit { font-size: .75rem; color: var(--hk-ink-500); margin-top: .5rem; }
.book-row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(170px, 1fr); gap: 2rem; overflow-x: auto; padding: .5rem .25rem 1rem; scroll-snap-type: x mandatory; }
.book { scroll-snap-align: start; position: relative; }
.book-cover { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; box-shadow: var(--hk-shadow-book); border-radius: 2px; display: block; background: #fff; }
.book-flag { position: absolute; top: .625rem; left: -.375rem; z-index: 1; }
.book-series { margin-top: 1.125rem; }
.book-title { font-family: var(--hk-display); font-weight: 700; font-size: 1.125rem; line-height: 1.2; margin: .375rem 0 0; }
.book-author { font-size: .875rem; color: var(--hk-ink-500); margin-top: .25rem; }
.book-link { display: inline-flex; align-items: center; gap: .375rem; font-size: .8125rem; font-weight: 700; color: var(--hk-blue-700); text-decoration: none; margin-top: .5rem; min-height: 32px; }
.book-link:hover { text-decoration: underline; }
.top5 { background: radial-gradient(120% 120% at 100% 100%, #2a1f3a 0%, transparent 55%), var(--hk-ink); color: #fff; }
.top5 .kicker { color: #c8c8d6; }
.top5-feature { display: flex; gap: 2rem; align-items: flex-start; }
.top5-feature-cover { flex: 0 0 180px; position: relative; }
.top5-feature-cover img { width: 100%; box-shadow: 0 20px 40px rgba(0,0,0,.45); border-radius: 2px; }
.top5-num1 { position: absolute; top: -18px; left: -18px; width: 64px; height: 64px; border-radius: 50%; background: var(--hk-cta); color: #fff; display: flex; align-items: center; justify-content: center; font-family: var(--hk-display); font-weight: 800; font-size: 1.375rem; }
.top5-title { font-family: var(--hk-display); font-weight: 800; font-size: 2rem; line-height: 1.05; margin: .5rem 0 0; }
.top5-author { color: #c8c8d6; margin-top: .5rem; font-size: .9375rem; }
.top5-text { font-family: var(--hk-serif); font-style: italic; color: #e4e4ee; border-left: 2px solid var(--hk-orange-500); padding-left: 1rem; margin: 1.25rem 0 1.5rem; }
.top5-list { list-style: none; margin: 0; padding: 0; }
.top5-item { display: flex; align-items: center; gap: 1.25rem; padding: 1rem 0; border-top: 1px solid rgba(255,255,255,.12); color: #fff; text-decoration: none; }
.top5-item:hover { color: #fff; }
.top5-item:hover .hover-title { text-decoration: underline; }
.top5-list li:last-child .top5-item { border-bottom: 1px solid rgba(255,255,255,.12); }
.top5-rank { font-family: var(--hk-display); font-weight: 300; font-size: 2.25rem; color: #9a9aac; width: 48px; flex: none; }
.top5-thumb { width: 44px; flex: none; box-shadow: 0 6px 14px rgba(0,0,0,.4); border-radius: 1px; }
.top5-name { font-family: var(--hk-display); font-weight: 700; font-size: 1.0625rem; line-height: 1.2; }
.top5-by { font-size: .8125rem; color: #b8b8c8; margin-top: .125rem; }
.top5-note { font-size: .75rem; color: #a8a8ba; margin-top: 1rem; }
@media (max-width: 575.98px) { .top5-feature { flex-direction: column; } .top5-feature-cover { flex-basis: auto; width: 160px; } }
.series-tile { position: relative; display: block; height: 100%; min-height: 230px; padding: 1.25rem; border: 1px solid var(--hk-line); background: var(--hk-paper-2); color: var(--hk-ink); text-decoration: none; border-radius: 2px; overflow: hidden; transition: border-color .2s; }
.series-tile:hover { color: var(--hk-ink); border-color: var(--hk-ink); }
.series-tile:hover .hover-title { text-decoration: underline; }
.series-tile.is-blue { background: var(--hk-blue-700); border-color: var(--hk-blue-700); color: #fff; }
.series-tile.is-blue:hover { color: #fff; }
.series-tile.is-orange { background: var(--hk-orange-500); border-color: var(--hk-orange-500); }
.series-num { font-family: var(--hk-display); font-weight: 300; font-size: 2.25rem; line-height: 1; opacity: .55; }
.series-name { font-family: var(--hk-display); font-weight: 700; font-size: 1.125rem; line-height: 1.15; margin-top: 4.5rem; max-width: 60%; position: relative; z-index: 1; }
.series-sub { font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; margin-top: .375rem; opacity: .8; max-width: 60%; position: relative; z-index: 1; }
.series-cover { position: absolute; right: -14px; bottom: -22px; width: 42%; box-shadow: var(--hk-shadow-book); border-radius: 2px; transform: rotate(6deg); }
.award-num { font-family: var(--hk-display); font-weight: 800; font-size: clamp(6rem, 3rem + 8vw, 11rem); line-height: .8; color: var(--hk-orange-500); }
.award-text { font-family: var(--hk-serif); font-size: 1.125rem; line-height: 1.6; color: #e4e9f7; max-width: 520px; margin: 1.5rem 0 0; }
.award-fact { border-top: 1px solid rgba(255,255,255,.22); padding: 1rem 0; display: flex; gap: 1.25rem; }
.award-fact-k { flex: none; width: 92px; font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #c9d4f2; padding-top: .25rem; }
.award-fact-v { font-family: var(--hk-display); font-weight: 600; font-size: 1.1875rem; line-height: 1.25; }
.award-fact-v small { display: block; font-family: var(--hk-body); font-weight: 400; font-size: .875rem; color: #dfe6f7; margin-top: .125rem; }
.award-card { background: #fff; color: var(--hk-ink); border-radius: 2px; overflow: hidden; height: 100%; display: flex; flex-direction: column; }
.award-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: center 30%; display: block; }
.award-card-body { padding: 1.75rem; display: flex; flex-direction: column; gap: .75rem; flex: 1; }
.award-card-title { font-family: var(--hk-display); font-weight: 800; font-size: 1.75rem; line-height: 1.05; margin: 0; }
.award-card-text { font-family: var(--hk-serif); color: var(--hk-ink-700); margin: 0; }
.club-shot { width: 100%; height: 520px; object-fit: cover; object-position: top; border-radius: 2px; display: block; }
@media (max-width: 767.98px) { .club-shot { height: 420px; } }
.benefits { list-style: none; padding: 0; margin: 1.25rem 0 0; display: flex; flex-direction: column; gap: .625rem; }
.benefit { display: flex; gap: .75rem; align-items: flex-start; }
.benefit svg { flex: none; margin-top: .1875rem; }
.store-btn { background: var(--hk-ink); color: #fff; text-decoration: none; border-radius: 8px; padding: .5rem 1.125rem; min-height: 52px; display: inline-flex; flex-direction: column; justify-content: center; line-height: 1.2; }
.store-btn:hover { background: #000; color: #fff; }
.store-btn small { font-size: .6875rem; }
.store-btn strong { font-size: 1.0625rem; font-weight: 700; }
.qr { width: 92px; height: auto; }
.store-card { background: #fff; border: 1px solid var(--hk-line); border-radius: 2px; padding: 2rem; height: 100%; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; gap: 1.75rem; }
.store-card-title { font-family: var(--hk-display); font-weight: 800; font-size: 1.75rem; line-height: 1.08; margin: .75rem 0 0; }
.store-covers { display: flex; margin-top: 1.5rem; }
.store-covers img { width: 78px; box-shadow: var(--hk-shadow-book); border-radius: 2px; margin-right: -18px; border: 2px solid #fff; }
.about-text { font-family: var(--hk-serif); font-size: 1.0625rem; line-height: 1.7; color: var(--hk-ink-700); max-width: 560px; }
.stat-num { font-family: var(--hk-display); font-weight: 800; font-size: 2.25rem; line-height: 1; color: var(--hk-blue-700); }
.stat-label { font-size: .8125rem; color: var(--hk-ink-500); margin-top: .5rem; max-width: 200px; }
.stats { border-top: 1px solid var(--hk-line); padding-top: 2rem; margin-top: 2.5rem; }
.about-collage { position: relative; min-height: 440px; }
.about-collage img { position: absolute; width: 46%; box-shadow: var(--hk-shadow-book); border-radius: 2px; }
.about-collage .c1 { left: 2%; top: 6%; transform: rotate(-5deg); }
.about-collage .c2 { left: 30%; top: 22%; z-index: 2; transform: rotate(2deg); }
.about-collage .c3 { right: 0; top: 2%; transform: rotate(7deg); width: 40%; }
.newsletter-box { background: var(--hk-blue-700); color: #fff; border-radius: 2px; padding: 3.5rem; }
.newsletter-title { font-family: var(--hk-display); font-weight: 800; font-size: clamp(1.875rem, 1.3rem + 1.8vw, 2.75rem); line-height: 1.05; margin: .75rem 0 0; }
.newsletter-text { font-family: var(--hk-serif); color: #dfe6f7; margin: 1rem 0 0; max-width: 440px; }
.nl-label { font-size: .8125rem; color: #dfe6f7; margin-bottom: .375rem; }
.nl-input { height: 52px; border-radius: 2px; border: 0; }
.nl-input:focus { box-shadow: 0 0 0 .25rem rgba(245,130,32,.5); }
@media (max-width: 767.98px) { .newsletter-box { padding: 2rem 1.5rem; } }
.site-footer { background: var(--hk-paper); border-top: 1px solid var(--hk-line); padding: 4.5rem 0 2rem; font-size: .875rem; }
.footer-logo { height: 36px; width: auto; display: block; }
.footer-about { color: var(--hk-ink-500); margin: 1.25rem 0 0; max-width: 260px; }
.footer-head { font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--hk-ink); margin-bottom: 1rem; }
.footer-links { list-style: none; padding: 0; margin: 0; }
.footer-links a { color: var(--hk-ink-700); text-decoration: none; display: inline-block; padding: .3125rem 0; }
.footer-links a:hover { color: var(--hk-blue-700); text-decoration: underline; }
.social { display: flex; gap: .5rem; margin-top: 1.25rem; }
.social a { width: 44px; height: 44px; border: 1px solid var(--hk-line); border-radius: 2px; display: inline-flex; align-items: center; justify-content: center; color: var(--hk-ink); }
.social a:hover { border-color: var(--hk-ink); }
.footer-bottom { border-top: 1px solid var(--hk-line); margin-top: 3.5rem; padding-top: 1.5rem; color: var(--hk-ink-500); font-size: .8125rem; }
.footer-bottom a { color: var(--hk-ink-500); text-decoration: none; }
.footer-bottom a:hover { color: var(--hk-ink); text-decoration: underline; }
.crumbs { font-size: .8125rem; color: var(--hk-ink-500); padding: 1.25rem 0; }
.crumbs a { color: var(--hk-ink-500); text-decoration: none; }
.crumbs a:hover { color: var(--hk-blue-700); text-decoration: underline; }
.article-head { max-width: 860px; }
.article-title { font-family: var(--hk-display); font-weight: 800; font-size: clamp(2.25rem, 1.4rem + 3vw, 4rem); line-height: 1; letter-spacing: -.015em; margin: 1rem 0 0; }
.byline { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; font-size: .8125rem; color: var(--hk-ink-500); margin-top: 1.75rem; padding-top: 1.25rem; border-top: 1px solid var(--hk-line); }
.article-figure { margin: 3rem 0 0; }
.article-figure img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 2px; display: block; }
.article-figure figcaption { font-size: .8125rem; color: var(--hk-ink-500); margin-top: .75rem; }
.prose { font-family: var(--hk-serif); font-size: 1.1875rem; line-height: 1.75; color: #24242c; }
.prose p { margin: 0 0 1.25em; }
.prose h2 { font-family: var(--hk-display); font-weight: 800; font-size: 1.875rem; line-height: 1.1; margin: 2.5rem 0 1rem; }
.dropcap::first-letter { float: left; font-family: var(--hk-display); font-weight: 800; font-size: 4.25rem; line-height: .85; color: var(--hk-blue-700); padding: .375rem .625rem 0 0; }
.pull { border-left: 3px solid var(--hk-orange-500); padding: .25rem 0 .25rem 1.5rem; margin: 2rem 0; font-style: italic; font-size: 1.375rem; line-height: 1.5; color: var(--hk-ink); }
.nom-season { font-family: var(--hk-body); font-weight: 700; font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--hk-blue-700); margin: 1.75rem 0 .5rem; }
.nom-list { list-style: none; padding: 0; margin: 0; font-family: var(--hk-body); font-size: 1rem; line-height: 1.5; }
.nom-list li { padding: .75rem 0; border-top: 1px solid var(--hk-line); display: flex; flex-wrap: wrap; gap: .25rem 1rem; justify-content: space-between; }
.nom-list li:last-child { border-bottom: 1px solid var(--hk-line); }
.nom-pub { color: var(--hk-ink-500); }
.winner-box { background: var(--hk-blue-700); color: #fff; padding: 1.5rem 1.75rem; border-radius: 2px; margin: 1.5rem 0 2rem; font-family: var(--hk-body); }
.winner-box .label { color: #c9d4f2; }
.winner-title { font-family: var(--hk-display); font-weight: 800; font-size: 1.5rem; line-height: 1.15; margin-top: .375rem; }
.side-card { border: 1px solid var(--hk-line); background: #fff; border-radius: 2px; padding: 1.5rem; }
.side-card + .side-card { margin-top: 1.5rem; }
.side-title { font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 1rem; }
.side-list { list-style: none; padding: 0; margin: 0; font-size: .9375rem; }
.side-list li { padding: .5rem 0; border-top: 1px solid var(--hk-line); }
.side-list li:first-child { border-top: 0; padding-top: 0; }
.tag { display: inline-flex; align-items: center; min-height: 36px; padding: 0 .875rem; border: 1px solid var(--hk-line); border-radius: 2px; font-size: .8125rem; font-weight: 600; color: var(--hk-ink); text-decoration: none; background: #fff; }
.tag:hover { border-color: var(--hk-blue-700); color: var(--hk-blue-700); }
.club-inline { background: var(--hk-paper-2); border-radius: 2px; padding: 1.75rem; display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: center; margin-top: 3rem; }
.club-inline-body { flex: 1 1 280px; min-width: 0; }
.club-inline-title { font-family: var(--hk-display); font-weight: 700; font-size: 1.375rem; line-height: 1.2; margin: .5rem 0 0; }
.post-nav { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; border-top: 1px solid var(--hk-line); border-bottom: 1px solid var(--hk-line); padding: 1.25rem 0; margin-top: 3rem; }
.post-nav a { text-decoration: none; color: var(--hk-ink); max-width: 46%; }
.post-nav a:hover .hover-title { text-decoration: underline; }
.post-nav .hover-title { font-family: var(--hk-display); font-weight: 700; font-size: 1.0625rem; line-height: 1.2; margin-top: .25rem; }
@media (max-width: 575.98px) { .post-nav a { max-width: 100%; } }
.carousel-indicators.hero-dots { position: static; margin: 0; padding: 0; justify-content: flex-start; z-index: auto; gap: .375rem; }
.carousel-indicators.hero-dots [data-bs-target] { box-sizing: content-box; width: 28px; height: 4px; margin: 0; padding: 10px 0; border: 0; background-clip: content-box; background-color: var(--hk-paper-3); opacity: 1; border-radius: 2px; text-indent: 0; transition: width .3s; }
.carousel-indicators.hero-dots .active { width: 44px; background-color: var(--hk-orange-500); }
.hero-focus { font-size: .8125rem; color: var(--hk-ink-500); }
.hero-focus strong { color: var(--hk-ink); }
.visually-hidden-focusable:focus { position: static !important; }
.page-head { padding: .5rem 0 3rem; border-bottom: 1px solid var(--hk-line); }
.page-title { font-family: var(--hk-display); font-weight: 800; font-size: clamp(2.25rem, 1.4rem + 3vw, 4rem); line-height: 1; letter-spacing: -.015em; margin: .875rem 0 0; }
.page-intro { font-family: var(--hk-serif); font-style: italic; font-size: 1.0625rem; color: var(--hk-ink-500); max-width: 520px; margin: 1rem 0 0; }
.k-small { font-size: .6875rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--hk-ink-500); }
.v-strong { font-weight: 700; margin-top: .125rem; }
.v-strong a { color: var(--hk-ink); text-decoration: underline; text-decoration-color: var(--hk-orange-500); text-underline-offset: 4px; }
.v-strong a:hover { color: var(--hk-blue-700); }
.book-hero { padding: .5rem 0 5rem; }
.book-main-cover { width: 100%; max-width: 420px; box-shadow: var(--hk-shadow-book); border-radius: 2px; display: block; margin: 0 auto; }
.book-thumbs { display: flex; gap: .75rem; margin-top: 1.5rem; justify-content: center; flex-wrap: wrap; }
.book-thumb-btn { border: 2px solid transparent; padding: 0; background: none; border-radius: 3px; }
.book-thumb-btn.is-active { border-color: var(--hk-orange-500); }
.book-thumb-btn img { width: 72px; height: 96px; object-fit: cover; display: block; border-radius: 1px; }
.book-series-pill { display: inline-flex; align-items: center; gap: .5rem; font-size: .8125rem; font-weight: 600; padding: .375rem .875rem; min-height: 36px; border: 1px solid var(--hk-line); border-radius: 999px; background: #fff; color: var(--hk-ink); text-decoration: none; }
.book-series-pill::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--hk-orange-500); }
.book-h1 { font-family: var(--hk-display); font-weight: 800; font-size: clamp(2.25rem, 1.5rem + 2.5vw, 3.5rem); line-height: 1.02; letter-spacing: -.015em; margin: 1rem 0 0; }
.book-people { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; margin-top: 1.5rem; padding: 1.25rem 0; border-top: 1px solid var(--hk-line); border-bottom: 1px solid var(--hk-line); }
.buy-box { background: #fff; border: 1px solid var(--hk-line); border-top: 3px solid var(--hk-orange-500); padding: 1.5rem; margin-top: 2rem; border-radius: 2px; }
.status { display: inline-flex; align-items: center; gap: .5rem; font-size: .875rem; font-weight: 700; }
.status::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: #15803d; }
.status-soon::before { background: #d97706; }
.price { font-family: var(--hk-display); font-weight: 800; font-size: 2rem; line-height: 1; }
.buy-note { font-size: .8125rem; color: var(--hk-ink-500); margin: .75rem 0 0; }
.specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem 2rem; }
.tabs-hk { border-bottom: 1px solid var(--hk-line); gap: 2rem; }
.tabs-hk .nav-link { color: var(--hk-ink-500); font-weight: 700; font-size: .875rem; letter-spacing: .04em; border: 0; border-bottom: 2px solid transparent; border-radius: 0; padding: .875rem 0; background: none; min-height: 44px; }
.tabs-hk .nav-link:hover { color: var(--hk-ink); }
.tabs-hk .nav-link.active { color: var(--hk-ink); border-bottom-color: var(--hk-orange-500); background: none; }
.preview-img { width: 100%; border-radius: 2px; box-shadow: var(--hk-shadow-book); display: block; }
.card-book { position: relative; display: flex; flex-direction: column; height: 100%; }
.card-book .book-title { font-size: 1.0625rem; }
.card-book-foot { display: flex; justify-content: space-between; align-items: center; gap: .5rem; margin-top: auto; padding-top: .75rem; }
.card-book-body { padding-bottom: .5rem; }
.card-price { font-family: var(--hk-display); font-weight: 800; font-size: 1.125rem; }
.card-buy { font-size: .8125rem; font-weight: 700; color: var(--hk-cta); text-decoration: none; display: inline-flex; align-items: center; gap: .25rem; min-height: 44px; }
.card-buy:hover { color: var(--hk-cta-hover); text-decoration: underline; }
.card-soon { font-size: .8125rem; font-weight: 700; color: var(--hk-ink-500); }
.vol { position: absolute; top: .625rem; right: .625rem; z-index: 1; width: 36px; height: 36px; border-radius: 50%; background: #fff; color: var(--hk-ink); font-family: var(--hk-display); font-weight: 800; font-size: .9375rem; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 8px rgba(0,0,0,.18); }
.filter-group { border-top: 1px solid var(--hk-line); padding: 1.25rem 0; }
.filter-title { font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; margin-bottom: .5rem; }
.hk .form-check { padding-left: 0; display: flex; align-items: center; gap: .625rem; min-height: 36px; margin: 0; }
.hk .form-check .form-check-input { float: none; margin: 0; width: 1.125rem; height: 1.125rem; border-color: #b9b2a2; flex: none; }
.hk .form-check-input:checked { background-color: var(--hk-blue-700); border-color: var(--hk-blue-700); }
.hk .form-check-label { font-size: .9375rem; }
.filter-count { color: var(--hk-ink-500); font-size: .8125rem; margin-left: auto; }
.chip { display: inline-flex; align-items: center; gap: .25rem; min-height: 36px; padding: 0 .375rem 0 .875rem; border-radius: 999px; background: var(--hk-blue-50); color: var(--hk-blue-700); font-size: .8125rem; font-weight: 700; border: 0; }
.chip-x { width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.chip:hover .chip-x { background: rgba(0,51,161,.12); }
.results-bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; padding-bottom: 1.25rem; border-bottom: 1px solid var(--hk-line); margin-bottom: 2rem; }
.hk .form-select, .hk .form-control { border-radius: 2px; border-color: #cfc8b8; min-height: 48px; }
.hk .form-select:focus, .hk .form-control:focus { border-color: var(--hk-blue-700); box-shadow: 0 0 0 .2rem rgba(0,51,161,.18); }
.sort-select { width: auto; min-height: 44px !important; font-size: .875rem; font-weight: 600; }
.hk .form-label { font-size: .8125rem; font-weight: 700; margin-bottom: .375rem; }
.pagination-hk { gap: .375rem; }
.pagination-hk .page-link { color: var(--hk-ink); border: 1px solid var(--hk-line); min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; border-radius: 2px !important; font-weight: 700; background: #fff; }
.pagination-hk .page-link:hover { border-color: var(--hk-ink); color: var(--hk-ink); }
.pagination-hk .active > .page-link { background: var(--hk-ink); border-color: var(--hk-ink); color: #fff; }
.series-hero { padding: 1rem 0 4.5rem; }
.series-hero-covers { position: relative; min-height: 400px; }
.series-hero-covers img { position: absolute; width: 42%; box-shadow: var(--hk-shadow-book); border-radius: 2px; }
.series-hero-covers .sh1 { left: 4%; top: 10%; transform: rotate(-7deg); }
.series-hero-covers .sh2 { left: 29%; top: 0; z-index: 2; transform: rotate(1deg); }
.series-hero-covers .sh3 { right: 2%; top: 12%; transform: rotate(8deg); }
.meta-row { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; margin-top: 2rem; padding-top: 1.25rem; border-top: 1px solid rgba(19,19,26,.12); }
.diary-card { display: flex; gap: 1.5rem; align-items: center; background: #fff; border: 1px solid var(--hk-line); border-radius: 2px; padding: 1.5rem; }
.diary-card img { width: 120px; flex: none; box-shadow: var(--hk-shadow-book); border-radius: 2px; }
@media (max-width: 575.98px) { .diary-card { flex-direction: column; align-items: flex-start; } }
.author-avatar { width: 168px; height: 168px; border-radius: 50%; background: var(--hk-blue-700); color: #fff; font-family: var(--hk-display); font-weight: 800; font-size: 3.5rem; display: flex; align-items: center; justify-content: center; flex: none; }
.bio { font-family: var(--hk-serif); font-size: 1.125rem; line-height: 1.75; color: var(--hk-ink-700); }
.bio p { margin: 0 0 1.25em; }
.art-card { background: #fff; border: 1px solid var(--hk-line); border-radius: 2px; padding: 1rem; }
.art-card img { width: 100%; display: block; border-radius: 1px; }
.art-card figcaption { font-size: .8125rem; color: var(--hk-ink-500); margin-top: .75rem; }
.pills-hk { display: flex; flex-wrap: wrap; gap: .5rem; }
.pills-hk .nav-link { border: 1px solid var(--hk-line); border-radius: 999px; color: var(--hk-ink); font-weight: 700; font-size: .8125rem; padding: 0 1.125rem; min-height: 44px; display: inline-flex; align-items: center; background: #fff; }
.pills-hk .nav-link:hover { border-color: var(--hk-ink); }
.pills-hk .nav-link.active { background: var(--hk-ink); border-color: var(--hk-ink); color: #fff; }
.feature-news { background: #fff; border: 1px solid var(--hk-line); border-radius: 2px; overflow: hidden; }
.feature-news img { width: 100%; height: 100%; min-height: 360px; object-fit: cover; display: block; }
.feature-news-body { padding: 2.5rem; }
@media (max-width: 767.98px) { .feature-news-body { padding: 1.5rem; } .feature-news img { min-height: 240px; } }
.timeline { list-style: none; padding: 0; margin: 0; border-left: 2px solid var(--hk-line); }
.tl-item { position: relative; padding: 0 0 2.25rem 2rem; }
.tl-item:last-child { padding-bottom: 0; }
.tl-item::before { content: ""; position: absolute; left: -7px; top: .4rem; width: 12px; height: 12px; border-radius: 50%; background: var(--hk-orange-500); }
.tl-year { font-family: var(--hk-display); font-weight: 800; font-size: 1.75rem; line-height: 1; color: var(--hk-blue-700); }
.tl-title { font-family: var(--hk-display); font-weight: 700; font-size: 1.1875rem; margin-top: .375rem; }
.tl-text { font-family: var(--hk-serif); color: var(--hk-ink-700); margin: .25rem 0 0; max-width: 520px; }
.ph-box { background: var(--hk-paper-3); border-radius: 2px; display: flex; align-items: center; justify-content: center; text-align: center; color: var(--hk-ink-500); font-size: .875rem; padding: 1.5rem; }
.ph-map { aspect-ratio: 4 / 3; }
.hk textarea.form-control { min-height: 160px; }
:root {
  --hk-display: 'Raleway', system-ui, sans-serif;
  --hk-body: 'Google Sans', system-ui, sans-serif;
  --hk-serif: 'Google Sans', system-ui, sans-serif;
}
.hk { font-variant-numeric: lining-nums; }
.display-xl, .display-lg, .page-title, .article-title, .book-h1 { letter-spacing: -.02em; }
.accent, .accent-light { font-family: var(--hk-display); font-style: italic; font-weight: 600; letter-spacing: -.01em; }
.lede, .section-intro, .news-lead-excerpt, .page-intro, .top5-text, .pull { font-style: normal; }
.lede { font-size: clamp(1.0625rem, 1rem + .3vw, 1.25rem); }
.prose { font-size: 1.125rem; line-height: 1.75; }
.bio { font-size: 1.0625rem; }
.news-title, .book-title, .top5-name, .series-name, .tl-title, .award-fact-v, .post-nav .hover-title { letter-spacing: -.005em; }
.kicker { display: block; font-family: var(--hk-display); font-size: 1.0625rem; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--hk-blue-700); }
.kicker::before { content: none; }
.kicker-light { color: #c9d4f2; }
.top5 .kicker { color: #c8c8d6; }
.award-card.link-card, .award-card.link-card:hover, .award-card.link-card:focus { color: var(--hk-ink); }
.search-panel { position: absolute; left: 0; right: 0; top: 100%; background: var(--hk-paper); border-bottom: 1px solid var(--hk-line); box-shadow: 0 18px 36px -18px rgba(20,20,40,.28); padding: 1.5rem 0 2rem; z-index: 30; }
.search-field { display: flex; align-items: center; gap: .75rem; border-bottom: 2px solid var(--hk-ink); padding-bottom: .375rem; }
.search-field:focus-within { border-bottom-color: var(--hk-blue-700); }
.search-field input { flex: 1; min-width: 0; border: 0; background: transparent; font-family: var(--hk-display); font-weight: 600; font-size: clamp(1.25rem, 1rem + 1.2vw, 1.875rem); color: var(--hk-ink); outline: none; padding: .25rem 0; }
.search-field input::placeholder { color: #8a8a98; }
.search-hint { font-size: .8125rem; color: var(--hk-ink-500); margin: .75rem 0 0; }
.search-results { list-style: none; margin: 1rem 0 0; padding: 0; }
.search-result { display: flex; align-items: center; gap: 1rem; padding: .625rem 0; border-bottom: 1px solid var(--hk-line); color: var(--hk-ink); text-decoration: none; min-height: 44px; }
.search-result:hover { color: var(--hk-ink); }
.search-result:hover .hover-title { text-decoration: underline; }
.search-result img { width: 40px; height: 60px; object-fit: cover; box-shadow: 0 2px 6px rgba(0,0,0,.15); border-radius: 1px; flex: none; }
.search-result-title { font-family: var(--hk-display); font-weight: 700; line-height: 1.2; }
.search-result-author { font-size: .8125rem; color: var(--hk-ink-500); }
.icon-btn.is-active { background: rgba(0,0,0,.07); }
.form-success { display: flex; align-items: center; gap: .5rem; font-weight: 700; margin: 1rem 0 0; color: #15803d; }
.newsletter-box .form-success { color: #fff; }
.copied { font-size: .8125rem; font-weight: 700; color: #15803d; }
.hk .btn { text-transform: none; letter-spacing: 0; --bs-btn-font-size: .9375rem; }
.label { font-size: .8125rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
.badge-hk { font-size: .75rem; font-weight: 600; letter-spacing: 0; text-transform: none; padding: .25rem .5625rem; }
.k-small { font-size: .8125rem; font-weight: 500; letter-spacing: 0; text-transform: none; }
.footer-head, .side-title, .filter-title { font-family: var(--hk-display); font-size: 1rem; font-weight: 700; letter-spacing: 0; text-transform: none; }
.nom-season, .award-fact-k, .series-sub { letter-spacing: 0; text-transform: none; font-size: .875rem; }
.top5-num1 { font-size: 1.25rem; }
.cookie-bar { position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 60; max-width: 760px; margin: 0 auto; background: #fff; color: var(--hk-ink); border: 1px solid var(--hk-line); border-radius: 4px; box-shadow: 0 20px 48px -12px rgba(20,20,40,.35); padding: 1.25rem 1.5rem; }
.cookie-title { font-family: var(--hk-display); font-weight: 700; font-size: 1.125rem; margin: 0; }
.cookie-text { font-size: .9375rem; color: var(--hk-ink-700); margin: .375rem 0 0; }
.cookie-text a { color: var(--hk-blue-700); }
.cookie-opts { border-top: 1px solid var(--hk-line); margin-top: 1rem; padding-top: .5rem; }
.cookie-opt { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .625rem 0; border-bottom: 1px solid var(--hk-line); }
.cookie-opt:last-child { border-bottom: 0; }
.cookie-opt-name { font-weight: 700; }
.cookie-opt-desc { font-size: .8125rem; color: var(--hk-ink-500); }
.hk .form-switch { padding-left: 0; min-height: 44px; display: flex; align-items: center; }
.hk .form-switch .form-check-input { width: 2.75rem; height: 1.5rem; margin: 0; float: none; cursor: pointer; }
.hk .form-switch .form-check-input:disabled { opacity: .6; cursor: not-allowed; }
.to-top { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 50; width: 48px; height: 48px; border-radius: 50%; border: 0; background: var(--hk-ink); color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 10px 24px -8px rgba(0,0,0,.45); }
.to-top:hover { background: var(--hk-blue-700); }
.az { display: flex; flex-wrap: wrap; gap: .25rem; }
.az-btn { min-width: 40px; height: 44px; padding: 0 .5rem; border: 1px solid var(--hk-line); border-radius: 2px; background: #fff; color: var(--hk-ink); font-family: var(--hk-display); font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.az-btn:hover { border-color: var(--hk-ink); }
.az-btn.is-active { background: var(--hk-ink); border-color: var(--hk-ink); color: #fff; }
.az-btn:disabled { color: #b9b2a2; background: transparent; border-color: transparent; cursor: default; }
.az-letter { font-family: var(--hk-display); font-weight: 800; font-size: 2.5rem; line-height: 1; color: var(--hk-blue-700); border-bottom: 1px solid var(--hk-line); padding-bottom: .75rem; margin: 2.5rem 0 1rem; }
.author-card { display: flex; align-items: center; gap: 1rem; padding: 1rem; background: #fff; border: 1px solid var(--hk-line); border-radius: 2px; color: var(--hk-ink); text-decoration: none; height: 100%; }
.author-card:hover { border-color: var(--hk-ink); color: var(--hk-ink); }
.author-card:hover .hover-title { text-decoration: underline; }
.avatar-sm { width: 56px; height: 56px; border-radius: 50%; flex: none; display: flex; align-items: center; justify-content: center; font-family: var(--hk-display); font-weight: 800; font-size: 1.125rem; color: #fff; background: var(--hk-blue-700); }
.avatar-sm.alt { background: var(--hk-cta); }
.avatar-sm.ink { background: var(--hk-ink); }
.author-name { font-family: var(--hk-display); font-weight: 700; font-size: 1.0625rem; line-height: 1.2; }
.author-meta { font-size: .8125rem; color: var(--hk-ink-500); margin-top: .125rem; }
.series-card { display: block; background: #fff; border: 1px solid var(--hk-line); border-radius: 2px; color: var(--hk-ink); text-decoration: none; height: 100%; overflow: hidden; }
.series-card:hover { border-color: var(--hk-ink); color: var(--hk-ink); }
.series-card:hover .hover-title { text-decoration: underline; }
.series-card-art { position: relative; height: 220px; display: flex; align-items: flex-end; justify-content: center; padding-top: 1.5rem; overflow: hidden; }
.series-card-art img { width: 38%; box-shadow: var(--hk-shadow-book); border-radius: 2px; margin: 0 -6%; position: relative; }
.series-card-art img:nth-child(1) { transform: rotate(-6deg) translateY(14px); }
.series-card-art img:nth-child(2) { z-index: 2; transform: translateY(-4px); }
.series-card-art img:nth-child(3) { transform: rotate(6deg) translateY(14px); }
.series-card-body { padding: 1.25rem; border-top: 1px solid var(--hk-line); }
.series-card-title { font-family: var(--hk-display); font-weight: 800; font-size: 1.375rem; line-height: 1.1; margin: 0; }
.series-card-meta { font-size: .875rem; color: var(--hk-ink-500); margin-top: .375rem; }
.tint-lilac { background: #e7e3f3; } .tint-mint { background: #dcefe3; } .tint-peach { background: #f7e3d6; }
.rank-list { list-style: none; margin: 0; padding: 0; }
.rank-item { display: flex; align-items: center; gap: 1.25rem; padding: 1rem 0; border-bottom: 1px solid var(--hk-line); }
.rank-num { font-family: var(--hk-display); font-weight: 300; font-size: 2.25rem; width: 56px; flex: none; color: var(--hk-ink-500); }
.rank-item:nth-child(-n+3) .rank-num { font-weight: 800; color: var(--hk-cta); }
.rank-cover { width: 56px; flex: none; box-shadow: 0 4px 12px rgba(0,0,0,.18); border-radius: 1px; }
.rank-body { flex: 1; min-width: 0; }
.rank-title { font-family: var(--hk-display); font-weight: 700; font-size: 1.125rem; line-height: 1.2; color: var(--hk-ink); text-decoration: none; }
.rank-title:hover { color: var(--hk-ink); text-decoration: underline; }
.prize-card { background: #fff; border: 1px solid var(--hk-line); border-radius: 2px; overflow: hidden; height: 100%; display: flex; flex-direction: column; }
.prize-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.prize-card-body { padding: 1.5rem; display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.big-search { display: flex; align-items: center; gap: .75rem; border-bottom: 2px solid var(--hk-ink); padding-bottom: .375rem; max-width: 760px; }
.big-search:focus-within { border-bottom-color: var(--hk-blue-700); }
.big-search input { flex: 1; min-width: 0; border: 0; background: transparent; outline: none; font-family: var(--hk-display); font-weight: 700; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.5rem); color: var(--hk-ink); padding: .25rem 0; }
.nf { position: relative; overflow: hidden; background: var(--hk-blue-900); color: #fff; }
.nf-art { width: 100%; max-width: 640px; display: block; margin-left: auto; border-radius: 2px; box-shadow: 0 30px 60px -20px rgba(0,0,0,.6); transform: rotate(-2deg); }
.nf-code { font-family: var(--hk-display); font-weight: 800; font-size: clamp(6rem, 3rem + 10vw, 12rem); line-height: .85; color: var(--hk-orange-500); letter-spacing: -.04em; }
.nf-text { font-size: 1.125rem; color: #dfe6f7; max-width: 460px; margin: 1.25rem 0 0; }
.nf .big-search { border-bottom-color: rgba(255,255,255,.6); }
.nf .big-search input { color: #fff; font-size: 1.375rem; }
.nf .big-search input::placeholder { color: #aab6d8; }
.nf .link-more { color: #fff; }
.sg-swatch { border: 1px solid var(--hk-line); border-radius: 2px; overflow: hidden; background: #fff; }
.sg-chip { height: 88px; }
.sg-meta { padding: .75rem; font-size: .8125rem; }
.sg-meta strong { display: block; font-size: .9375rem; }
.c-blue-900 { background: #001b57; } .c-blue-700 { background: #0033a1; } .c-blue-50 { background: #eef2fb; }
.c-orange-500 { background: #f58220; } .c-cta { background: #c4470f; } .c-paper { background: #faf7f2; } .c-paper-2 { background: #f2ede4; } .c-ink { background: #13131a; } .c-ink-500 { background: #5a5a66; } .c-line { background: #e2ddd2; }
.sg-row { border-top: 1px solid var(--hk-line); padding: 1.25rem 0; }
.sg-tag { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8125rem; color: var(--hk-ink-500); }
.footer-bottom .btn.btn-link { min-height: 0; font-size: .8125rem; font-weight: 400; color: var(--hk-ink-500); text-decoration: none; vertical-align: baseline; }
.footer-bottom .btn.btn-link:hover { color: var(--hk-ink); text-decoration: underline; }
.cookie-bar .btn.btn-link { color: var(--hk-blue-700); }
.radio-band { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; background: var(--hk-ink); color: #fff; border-radius: 4px; padding: 1.5rem 2rem; position: relative; overflow: hidden; }
.radio-band:hover { color: #fff; }
.radio-band::after { content: ""; position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border-radius: 50%; border: 2px solid rgba(245,130,32,.35); box-shadow: 0 0 0 28px rgba(245,130,32,.08), 0 0 0 56px rgba(245,130,32,.05); pointer-events: none; }
.radio-icon { width: 56px; height: 56px; flex: none; border-radius: 50%; background: var(--hk-cta); color: #fff; display: flex; align-items: center; justify-content: center; }
.radio-body { flex: 1 1 260px; min-width: 0; display: flex; flex-direction: column; }
.radio-kicker { font-size: .8125rem; color: #c8c8d6; }
.radio-title { font-family: var(--hk-display); font-weight: 800; font-size: 1.5rem; line-height: 1.15; }
.radio-text { font-size: .9375rem; color: #c8c8d6; }
.radio-btn { position: relative; z-index: 1; }
@media (max-width: 575.98px) { .radio-band { padding: 1.25rem; } .radio-btn { width: 100%; } }
@media (max-width: 767.98px) {
  .hk .container { padding-left: 1.25rem; padding-right: 1.25rem; }
  .hk .row.g-5, .hk .row.gx-5 { --bs-gutter-x: 1.5rem; }
  .hk .row.g-5, .hk .row.gy-5 { --bs-gutter-y: 2.5rem; }
  .top5-num1 { left: -8px; top: -12px; width: 52px; height: 52px; font-size: 1.0625rem; }
}
.main-nav .nav-link, .site-header .btn { white-space: nowrap; }
@media (min-width: 992px) and (max-width: 1199.98px) {
  .main-nav .nav-link { margin: 0 .625rem; font-size: .875rem; }
  .site-header .btn-outline-ink.d-lg-inline-flex { display: none !important; }
}
.card-book-foot { flex-wrap: wrap; row-gap: 0; }
.card-price { white-space: nowrap; }
@media (max-width: 575.98px) {
  .cookie-bar { left: .5rem; right: .5rem; bottom: .5rem; padding: 1rem; }
  .cookie-title { font-size: 1rem; }
  .cookie-text { font-size: .8125rem; }
  .cookie-bar .btn { flex: 1 1 auto; }
}
.hk .container { padding-left: 1.5rem; padding-right: 1.5rem; }
@media (min-width: 1200px) { .hk .container { max-width: 1328px; } }
@media (max-width: 767.98px) { .hk .container { padding-left: 1.25rem; padding-right: 1.25rem; } }
