:root {
  --ink: #101a1b;
  --ink-deep: #071113;
  --ink-soft: #45514f;
  --paper: #eee7d7;
  --paper-light: #faf7ef;
  --line: rgba(16, 26, 27, .18);
  --jade: #739487;
  --amber: #dfa94e;
  --content: 1180px;
  --serif: "Noto Serif SC", "Songti SC", serif;
  --display: "ZCOOL XiaoWei", "Noto Serif SC", serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 72px; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--serif); font-size: 16px; line-height: 1.65; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
.skip-link { position: fixed; z-index: 50; left: 1rem; top: -4rem; padding: .6rem .9rem; color: var(--paper); background: var(--ink); transition: top .2s; }
.skip-link:focus { top: 1rem; }

.site-header { min-height: 62px; display: flex; align-items: center; justify-content: space-between; position: sticky; top: 0; z-index: 20; padding: 0 max(1rem, calc((100vw - var(--content)) / 2)); color: #f6f2e7; background: rgba(7,17,19,.96); border-bottom: 1px solid rgba(255,255,255,.14); backdrop-filter: blur(12px); }
.brand { display: inline-flex; gap: .62rem; align-items: center; font-weight: 700; letter-spacing: .06em; white-space: nowrap; }
.brand-mark { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid currentColor; font-family: var(--display); font-size: 1.25rem; font-weight: 400; }
.game-brand-mark { overflow: hidden; border-color: rgba(238,233,222,.58); background: #0c1112; }
.game-brand-mark img { width: 100%; height: 100%; object-fit: contain; image-rendering: pixelated; }
.brand-year { margin-left: .17rem; color: var(--amber); font-size: .72em; }
.site-header nav { display: flex; gap: clamp(1rem, 2vw, 1.8rem); font-size: .8rem; }
.site-header nav a, .header-action { color: rgba(246,242,231,.74); transition: color .2s; }
.site-header nav a:hover, .header-action:hover { color: #fff; }
.header-action { font-size: .78rem; }

.finder-hero { min-height: 390px; position: relative; display: flex; align-items: center; overflow: hidden; isolation: isolate; padding: 2.6rem max(1rem, calc((100vw - var(--content)) / 2)) 2.8rem; color: #f8f5eb; background-color: #071113; background-image: url("assets/game/login-scene.png"), url("assets/hero-mountains.png"); background-position: right center, center 51%; background-size: auto 100%, cover; background-repeat: no-repeat; }
.finder-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(5,14,17,.98) 0%, rgba(8,22,25,.83) 46%, rgba(5,13,23,.22) 86%), linear-gradient(0deg, rgba(3,10,14,.66), transparent 54%); }
.hero-grain { position: absolute; inset: 0; opacity: .14; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.38'/%3E%3C/svg%3E"); mix-blend-mode: soft-light; }
.hero-content { width: min(720px, 100%); position: relative; z-index: 2; }
.eyebrow, .section-kicker { margin: 0; color: #a87529; letter-spacing: .16em; font-size: .72rem; font-weight: 700; }
.finder-hero .eyebrow { color: #e7bd71; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin: .35rem 0 .6rem; font-family: var(--display); font-size: clamp(3.4rem, 5vw, 5.3rem); font-weight: 400; letter-spacing: .025em; line-height: .94; }
h1 span { color: var(--amber); }
.hero-subtitle { max-width: 38rem; margin: .8rem 0 1.2rem; color: rgba(255,255,255,.78); font-size: .9rem; }
.hero-actions { display: flex; align-items: stretch; gap: 1px; max-width: 720px; margin: 1rem 0; background: rgba(255,255,255,.22); }
.hero-actions a { min-width: 0; flex: 1; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .08rem .7rem; padding: .75rem 1rem; color: #f6f1e7; background: rgba(7,17,19,.78); border: 1px solid rgba(255,255,255,.12); transition: background .2s, transform .2s; }
.hero-actions a:hover { transform: translateY(-2px); background: rgba(22,42,42,.94); }
.hero-actions a.primary { color: #111b1b; background: var(--amber); border-color: var(--amber); }
.hero-actions span { grid-column: 1; color: rgba(255,255,255,.58); font-size: .65rem; letter-spacing: .1em; }
.hero-actions .primary span { color: rgba(16,26,27,.6); }
.hero-actions strong { grid-column: 1; font-family: var(--display); font-size: 1.1rem; font-weight: 400; }
.hero-actions b { grid-row: 1 / 3; grid-column: 2; align-self: center; font-size: 1.15rem; font-weight: 400; }
.global-search { min-height: 56px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: .7rem; max-width: 720px; padding: .35rem .35rem .35rem .9rem; color: var(--ink); background: rgba(250,247,239,.98); box-shadow: 0 16px 38px rgba(0,0,0,.22); }
.search-symbol { color: var(--jade); font-size: 1.7rem; line-height: 1; }
.global-search input { width: 100%; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: .98rem; }
.global-search input::placeholder { color: #7b8581; }
.global-search kbd { padding: .12rem .42rem; color: #6c7471; border: 1px solid #c7c7bd; background: #f0eee7; font-family: inherit; font-size: .72rem; }
.global-search button { min-height: 44px; cursor: pointer; border: 0; padding: 0 1.25rem; color: #111b1b; background: var(--amber); font-weight: 700; }
.quick-queries { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: .8rem; color: rgba(255,255,255,.58); font-size: .75rem; }
.quick-queries button { cursor: pointer; border: 0; border-bottom: 1px solid rgba(255,255,255,.3); padding: .05rem 0; color: rgba(255,255,255,.82); background: transparent; }
.hero-emblem { position: absolute; right: max(1rem, calc((100vw - var(--content)) / 2)); bottom: 2.8rem; z-index: 1; width: 136px; height: 136px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; color: rgba(255,255,255,.7); text-align: center; }
.hero-emblem::after { content: ""; position: absolute; inset: 12px; border: 1px solid rgba(223,169,78,.44); border-radius: 50%; }
.emblem-sprite { width: 62px; height: 56px; position: absolute; top: 13px; z-index: 2; background-image: url("assets/monsters/level-1-30.jpg"); background-size: 620px auto; background-repeat: no-repeat; filter: saturate(.92); }
.hero-emblem p { position: absolute; bottom: 15px; z-index: 2; margin: 0; font-size: .65rem; line-height: 1.35; letter-spacing: .08em; }
.hero-emblem strong { color: #f0c879; font-size: 1.1rem; }

.search-results { padding: 2rem max(1rem, calc((100vw - var(--content)) / 2)) 2.8rem; background: var(--paper-light); border-bottom: 1px solid var(--line); }
.results-heading { display: flex; justify-content: flex-start; align-items: end; gap: 2.5rem; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 2rem; }
.results-heading h2, .section-heading h2, .route-copy h2 { margin: .3rem 0 0; font-family: var(--display); font-size: clamp(2.1rem, 3vw, 3.25rem); font-weight: 400; line-height: 1.12; }
.results-heading > p, .section-heading > p { margin: 0; color: var(--ink-soft); font-size: .8rem; }
.material-summary { margin: 1.15rem 0 .8rem; padding: 1rem 1.15rem .85rem; color: #f2ede2; background: var(--ink); border-left: 4px solid var(--amber); }
.material-summary-head { display: flex; align-items: end; justify-content: flex-start; gap: 1.5rem; }
.material-summary-head .section-kicker { color: #e3b866; }
.material-summary-head h3 { margin: .15rem 0 0; font-family: var(--display); font-size: 1.4rem; font-weight: 400; }
.material-summary-head > p { margin: 0; color: rgba(242,237,226,.58); font-size: .72rem; }
.material-totals { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 0 1.25rem; margin-top: .7rem; border-top: 1px solid rgba(255,255,255,.16); }
.material-total { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: .12rem .55rem; align-items: center; min-height: 62px; padding: .55rem 0; border-bottom: 1px solid rgba(255,255,255,.13); }
.summary-kind { align-self: start; margin-top: .12rem; padding: .12rem .36rem; color: #101a1b; background: #dcb267; font-size: .6rem; font-weight: 700; }
.summary-kind.monster { color: #f3eee2; background: #58776d; }
.summary-name { font-weight: 700; }
.material-total strong { grid-row: 1 / 3; grid-column: 3; color: #f1c77b; font-family: var(--display); font-size: 1.75rem; font-weight: 400; line-height: 1; }
.material-total small { margin-left: .12rem; font-family: var(--serif); font-size: .75rem; }
.material-total em { grid-column: 2; color: rgba(242,237,226,.55); font-size: .65rem; font-style: normal; }
.summary-note { margin: .8rem 0 0; color: rgba(242,237,226,.48); font-size: .68rem; }
.result-filters { display: flex; flex-wrap: wrap; gap: .55rem; margin: .9rem 0 .35rem; }
.result-filter { cursor: pointer; border: 0; padding: .4rem .7rem; color: var(--ink-soft); background: transparent; font-size: .78rem; }
.result-filter.active { color: var(--ink); background: #dfd7c6; font-weight: 700; }
.result-list { border-top: 1px solid var(--ink); }
.result-row { min-height: 70px; display: grid; grid-template-columns: 95px minmax(0, 1fr) auto; gap: 1rem; align-items: center; margin: 0 -.65rem; padding: .72rem .65rem; border-bottom: 1px solid var(--line); cursor: pointer; transition: padding .2s, background .2s, color .2s; }
.result-row:hover, .result-row:focus-visible { padding-left: 1.3rem; padding-right: 1.3rem; color: #0c1718; background: rgba(109,144,128,.14); outline: 2px solid transparent; }
.result-kind { color: #9a6b20; font-size: .7rem; letter-spacing: .08em; }
.result-row h3 { margin: 0 0 .15rem; font-size: 1rem; }
.result-row p { margin: 0; color: var(--ink-soft); font-size: .78rem; }
.result-copy { min-width: 0; }.result-title-line { display: flex; align-items: center; gap: .55rem; }.result-title-line h3 { min-width: 0; }
.result-item-icons { display: inline-flex; flex: 0 0 auto; gap: 2px; }
.result-item-icons img { width: 30px; height: 30px; object-fit: contain; image-rendering: pixelated; background: rgba(12,24,24,.07); border: 1px solid rgba(16,26,27,.12); }
.summary-item-icon { width: 38px; height: 38px; display: grid; place-items: center; background: rgba(12,24,24,.07); border: 1px solid rgba(16,26,27,.12); }
.summary-item-icon img { max-width: 32px; max-height: 32px; image-rendering: pixelated; }
.material-total:has(.summary-item-icon) { grid-template-columns: auto 38px minmax(0,1fr) auto; }
.material-total:has(.summary-item-icon) .summary-item-icon { grid-row: 1 / 3; grid-column: 2; }
.material-total:has(.summary-item-icon) .summary-name { grid-column: 3; }
.material-total:has(.summary-item-icon) strong { grid-column: 4; }
.material-total:has(.summary-item-icon) em { grid-column: 3; }
.result-arrow { display: flex; align-items: center; gap: .65rem; color: var(--ink-soft); font-size: .7rem; white-space: nowrap; }
.result-arrow b { display: grid; place-items: center; width: 34px; height: 34px; color: #f3eee2; background: var(--ink); font-size: 1rem; font-weight: 400; transition: transform .2s, background .2s; }
.result-row:hover .result-arrow b, .result-row:focus-visible .result-arrow b { transform: translateX(3px); background: #9a6b20; }
.empty-results { margin: 1.5rem 0 0; color: var(--ink-soft); }

.quick-entry, .latest-guides { padding: 3.4rem max(1rem, calc((100vw - var(--content)) / 2)); }
.quick-entry { background: var(--paper); }
.entry-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 1.6rem; border-top: 1px solid var(--ink); }
.entry-item { min-height: 102px; display: grid; grid-template-columns: 66px minmax(0, 1fr) auto; gap: 1rem; align-items: center; padding: .75rem .8rem .75rem 0; border-bottom: 1px solid var(--line); transition: padding .22s, background .22s; }
.entry-item:nth-child(odd) { border-right: 1px solid var(--line); padding-right: 1.5rem; }
.entry-item:nth-child(even) { padding-left: 1.5rem; }
.entry-item:hover { padding-left: 1rem; background: rgba(109,144,128,.08); }
.entry-item:nth-child(even):hover { padding-left: 2.2rem; }
.entry-item > span:nth-child(2) { display: grid; }
.entry-item small { color: #9a6b20; font-size: .68rem; letter-spacing: .08em; }
.entry-item strong { font-family: var(--display); font-size: 1.55rem; font-weight: 400; }
.entry-item em { color: var(--ink-soft); font-size: .76rem; font-style: normal; }
.entry-item b { font-weight: 400; }
.game-icon { width: 62px; height: 62px; display: block; overflow: hidden; border: 1px solid #9f967f; background-image: url("assets/monsters/level-1-30.jpg"); background-size: 620px auto; background-repeat: no-repeat; box-shadow: inset 0 0 0 3px rgba(255,255,255,.35); }
.sprite-volcano { background-position: 0 0; }
.sprite-flower { background-position: -248px 0; }
.sprite-frog { background-position: -62px 0; }
.sprite-umbrella { background-position: -186px 0; }
.sprite-warrior { background-position: -558px -62px; }
.spirit-icon { display: grid; place-items: center; background: #d8cfb9; }
.spirit-icon img { width: 95%; height: 95%; object-fit: contain; }
.map-entry-icon { background-image: url("assets/game/map-gallery/清阴关.png"); background-position: center; background-size: cover; }
.item-entry-icon { display: grid; place-items: center; background: #d8cfb9; }
.item-entry-icon img { width: 72%; height: 72%; object-fit: contain; image-rendering: pixelated; }
.community-entry-icon { display: grid; place-items: center; color: #f1d292; background: #132526; font-family: var(--display); font-size: 2rem; }

.newcomer-route { display: grid; grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr); gap: clamp(3rem, 7vw, 6rem); padding: 3.5rem max(1rem, calc((100vw - var(--content)) / 2)); color: #f2ede2; background: var(--ink); }
.route-copy .section-kicker { color: #e0b66b; }
.route-copy p { max-width: 25rem; color: rgba(242,237,226,.65); }
.route-copy > a { display: inline-block; margin-top: .7rem; color: #efc679; border-bottom: 1px solid rgba(239,198,121,.5); font-size: .8rem; }
.route-steps { margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.18); }
.route-steps li { display: grid; grid-template-columns: 52px minmax(0,1fr); gap: 1rem; padding: 1rem 0; border-bottom: 1px solid rgba(255,255,255,.13); }
.route-steps li > span { color: #dcb267; font-size: .72rem; }
.route-steps strong { font-family: var(--display); font-size: 1.35rem; font-weight: 400; }
.route-steps p { margin: .05rem 0 0; color: rgba(242,237,226,.58); font-size: .76rem; }

.latest-guides { background: var(--paper-light); }
.guide-lines { margin-top: 1.6rem; border-top: 1px solid var(--ink); }
.guide-lines a { display: grid; grid-template-columns: 140px minmax(0,1fr) minmax(180px,.7fr) 25px; gap: 1rem; align-items: center; min-height: 92px; border-bottom: 1px solid var(--line); transition: padding .2s, background .2s; }
.guide-lines a:hover { padding: 0 1rem; background: rgba(109,144,128,.08); }
.guide-lines span { color: #9a6b20; font-size: .7rem; }
.guide-lines strong { font-family: var(--display); font-size: 1.35rem; font-weight: 400; }
.guide-lines em { color: var(--ink-soft); font-size: .75rem; font-style: normal; }
.guide-lines b { font-weight: 400; }

.guide-directory-page { background: var(--paper-light); }
.directory-hero { min-height: 390px; padding: 5rem max(1rem, calc((100vw - var(--content)) / 2)) 3rem; color: #f7f3e9; background: linear-gradient(90deg,rgba(5,14,17,.96),rgba(5,14,17,.52)), url("assets/game/login-scene.png") right center/auto 100% no-repeat, #071113; }
.directory-hero h1 { margin: .5rem 0 1rem; }
.directory-hero > p:not(.eyebrow) { color: rgba(247,243,233,.68); }
.directory-search { max-width: 680px; min-height: 56px; display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: .8rem; padding: 0 1rem; color: var(--ink); background: var(--paper-light); }
.directory-search span { color: var(--jade); font-size: 1.6rem; }
.directory-search input { width: 100%; border: 0; outline: 0; background: transparent; }
.directory-shell { padding: 3rem max(1rem, calc((100vw - var(--content)) / 2)) 4rem; }
.directory-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; }
.directory-heading h2 { margin: .25rem 0 0; font-family: var(--display); font-size: clamp(2rem,4vw,3.4rem); font-weight: 400; }
.directory-heading > p { margin: 0; color: var(--ink-soft); font-size: .75rem; }
.directory-workspace { display: grid; grid-template-columns: 250px minmax(0,1fr); gap: clamp(2.5rem,5vw,5rem); align-items: start; margin-top: 2rem; }
.directory-sidebar { position: sticky; top: 82px; border-top: 3px solid var(--ink); }
.directory-sidebar-heading { display: grid; gap: .1rem; padding: 1rem .2rem .9rem; border-bottom: 1px solid var(--line); }
.directory-sidebar-heading span { font-family: var(--display); font-size: 1.25rem; }
.directory-sidebar-heading small { color: var(--ink-soft); font-size: .66rem; }
.directory-filters { display: grid; }
.directory-filters button { min-height: 68px; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: .7rem; cursor: pointer; border: 0; border-bottom: 1px solid var(--line); padding: .65rem .2rem; color: var(--ink-soft); background: transparent; text-align: left; transition: padding .2s, color .2s, background .2s; }
.directory-filters button > span { display: grid; gap: .08rem; min-width: 0; }
.directory-filters button strong { color: inherit; font-size: .82rem; font-weight: 600; }
.directory-filters button small { overflow: hidden; color: var(--ink-soft); font-size: .61rem; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.directory-filters button b { color: #9a6b20; font-size: .66rem; font-weight: 500; }
.directory-filters button:hover { padding-left: .65rem; color: var(--ink); background: rgba(109,144,128,.08); }
.directory-filters button[aria-current="true"] { padding-left: .65rem; color: #fff; background: var(--ink); }
.directory-filters button[aria-current="true"] small { color: rgba(255,255,255,.58); }
.directory-filters button[aria-current="true"] b { color: #e4b966; }
.directory-current { min-height: 62px; display: flex; align-items: baseline; justify-content: space-between; gap: 1.5rem; padding: .6rem 0 1rem; border-top: 3px solid var(--ink); }
.directory-current span { font-family: var(--display); font-size: 1.5rem; }
.directory-current p { margin: 0; color: var(--ink-soft); font-size: .7rem; text-align: right; }
.directory-list { border-top: 1px solid var(--ink); }
.directory-list a { min-height: 92px; display: grid; grid-template-columns: 48px minmax(0,1fr) 36px; gap: 1rem; align-items: center; border-bottom: 1px solid var(--line); transition: padding .2s, background .2s; }
.directory-list a:hover { padding: 0 1rem; background: rgba(109,144,128,.1); }
.directory-list > a > span { color: #9a6b20; font-size: .72rem; }
.directory-list div { display: grid; grid-template-columns: 130px minmax(0,1fr) minmax(200px,.75fr); gap: 1rem; align-items: center; }
.directory-list small { color: #9a6b20; font-size: .7rem; }
.directory-list strong { font-family: var(--display); font-size: 1.35rem; font-weight: 400; }
.directory-list p { margin: 0; color: var(--ink-soft); font-size: .74rem; }
.directory-list b { font-weight: 400; }

.mobile-quick-nav { display: none; }
footer { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1.3rem max(1rem, calc((100vw - var(--content)) / 2)); color: #e8e2d4; background: #0a1112; font-size: .75rem; }
footer p { margin: 0; color: rgba(232,226,212,.58); }
footer > a:last-child { color: #e6bb6e; }
.site-disclaimer { max-width: 640px; line-height: 1.6; }
.site-disclaimer span { color: rgba(232,226,212,.78); }

.reveal { opacity: 0; transform: translateY(16px); animation: rise .65s cubic-bezier(.22,.61,.36,1) forwards; }
.delay-1 { animation-delay: .08s; }.delay-2 { animation-delay: .16s; }.delay-3 { animation-delay: .24s; }
@keyframes rise { to { opacity: 1; transform: translateY(0); } }

@media (max-width: 900px) {
  .hero-emblem { display: none; }
  .entry-list { grid-template-columns: 1fr; }
  .entry-item:nth-child(odd) { border-right: 0; padding-right: 1rem; }
  .entry-item:nth-child(even) { padding-left: 0; }
  .entry-item:nth-child(even):hover { padding-left: 1rem; }
}

@media (max-width: 680px) {
  html { scroll-padding-top: 60px; }
  body { padding-bottom: 64px; }
  .site-header { min-height: 60px; padding: 0 1rem; }.site-header nav, .header-action { display: none; }
  .finder-hero { min-height: 460px; align-items: flex-start; padding: 4rem 1rem 2.8rem; background-position: 65% center; }
  .finder-hero::after { background: linear-gradient(90deg, rgba(5,14,17,.95), rgba(8,22,25,.68)); }
  h1 { font-size: clamp(3.2rem, 16vw, 5.3rem); }
  .hero-subtitle { font-size: .9rem; }
  .global-search { grid-template-columns: auto minmax(0,1fr) auto; min-height: 58px; padding-left: .8rem; }.global-search kbd { display: none; }.global-search button { padding: 0 .9rem; }
  .hero-actions { flex-direction: column; }
  .search-results, .quick-entry, .latest-guides, .newcomer-route { padding-left: 1rem; padding-right: 1rem; }
  .results-heading, .section-heading { align-items: start; flex-direction: column; gap: .7rem; }
  .material-summary { padding: 1rem; }.material-summary-head { align-items: start; flex-direction: column; gap: .35rem; }.material-totals { grid-template-columns: 1fr; }
  .result-row { grid-template-columns: 68px minmax(0,1fr) auto; gap: .65rem; margin: 0; padding: .9rem .2rem; }.result-row:hover, .result-row:focus-visible { padding-left: .55rem; padding-right: .55rem; }.result-arrow { font-size: 0; }.result-arrow b { width: 32px; height: 32px; font-size: .95rem; }
  .result-item-icons img { width: 28px; height: 28px; }.result-item-icons img:nth-child(n+4) { display: none; }
  .entry-item { grid-template-columns: 62px minmax(0,1fr) auto; gap: .8rem; min-height: 104px; }.game-icon { width: 58px; height: 58px; background-size: 580px auto; }.sprite-flower { background-position: -232px 0; }.sprite-frog { background-position: -58px 0; }.sprite-umbrella { background-position: -174px 0; }.sprite-warrior { background-position: -522px -58px; }
  .entry-item strong { font-size: 1.3rem; }.entry-item em { display: none; }
  .newcomer-route { grid-template-columns: 1fr; gap: 2.5rem; }
  .guide-lines a { grid-template-columns: 92px minmax(0,1fr) 20px; min-height: 82px; }.guide-lines em { display: none; }
  .directory-hero { min-height: 420px; padding: 4rem 1rem 2rem; background-position: 70% center; }.directory-shell { padding-left: 1rem; padding-right: 1rem; }.directory-heading { align-items: start; flex-direction: column; gap: .4rem; }.directory-workspace { display: block; margin-top: 1.4rem; }.directory-sidebar { position: static; margin: 0 -1rem 1.5rem; border-top-width: 1px; overflow: hidden; }.directory-sidebar-heading { padding-left: 1rem; }.directory-filters { display: flex; gap: 0; overflow-x: auto; padding: 0 1rem .35rem; scrollbar-width: thin; }.directory-filters button { min-width: 145px; min-height: 62px; padding: .55rem .65rem; border-right: 1px solid var(--line); }.directory-filters button small { display: none; }.directory-filters button:hover, .directory-filters button[aria-current="true"] { padding-left: .65rem; }.directory-current { min-height: 54px; }.directory-current p { display: none; }.directory-list div { grid-template-columns: 1fr; gap: .12rem; }.directory-list p { display: none; }
  .mobile-quick-nav { height: 64px; display: grid; grid-template-columns: repeat(6,1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; color: #eee9de; background: rgba(7,17,19,.98); border-top: 1px solid rgba(255,255,255,.13); }
  .mobile-quick-nav a { display: grid; place-items: center; align-content: center; gap: .05rem; font-size: .62rem; }.mobile-quick-nav span { color: #e4b967; font-family: var(--display); font-size: 1.15rem; }
  footer { align-items: flex-start; flex-direction: column; gap: .6rem; }
}

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }

.client-databases { display:grid; grid-template-columns:minmax(260px,.7fr) minmax(0,1.3fr); gap:5rem; padding:4rem max(1rem,calc((100vw - 1220px)/2)); color:#eee8dc; background:#101a1b; }
.database-intro { align-self:start; position:sticky; top:90px; }.database-intro h2 { margin:.35rem 0 .8rem; font-family:var(--display); font-size:clamp(2.5rem,4vw,4.4rem); font-weight:400; line-height:1; }.database-intro>p:last-child { max-width:420px; color:rgba(238,232,220,.6); line-height:1.8; }.database-routes { border-top:1px solid rgba(255,255,255,.22); }.database-routes a { min-height:92px; display:grid; grid-template-columns:42px minmax(0,1fr) auto; gap:1rem; align-items:center; border-bottom:1px solid rgba(255,255,255,.14); color:#eee8dc; transition:padding-left .2s,background .2s; }.database-routes a:hover { padding-left:.7rem; background:rgba(255,255,255,.035); }.database-routes a>span { color:#dfb565; font-size:.65rem; }.database-routes strong { display:block; font-family:var(--display); font-size:1.5rem; font-weight:400; }.database-routes small { color:rgba(238,232,220,.52); }.database-routes b { color:#dfb565; font-size:.7rem; font-weight:400; }
@media(max-width:760px){.client-databases{grid-template-columns:1fr;gap:2rem;padding:3rem 1rem}.database-intro{position:static}.database-routes a{min-height:82px}.database-routes strong{font-size:1.25rem}}