/* Focused learning surfaces. Keep the app's paper, forest and list accents. */
.resource-page .resource-nav{display:flex;flex-wrap:wrap;gap:8px 26px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.resource-nav a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;color:var(--muted)}
.resource-nav a[aria-current]{color:var(--ink);font-weight:650;text-decoration:underline;text-underline-offset:8px;text-decoration-color:var(--green)}
.resource-page .breadcrumb{margin:14px 0 0;padding-top:0;font-size:13px}
.resource-page .index-hero{padding-block:32px 28px;margin:0;min-height:0}
.resource-page .index-hero h1{font-size:clamp(42px,5vw,64px);line-height:1.04;letter-spacing:-.045em;margin:14px 0 22px}
.resource-page .index-hero p{max-width:48ch;font-size:18px;line-height:1.65}
.resource-page .index-hero .eyebrow{font-size:11px;margin:0;letter-spacing:.12em}
.resource-page .index-hero .editorial-note{font-size:13px;line-height:1.7;max-width:58ch}
.resource-hero{display:grid!important;grid-template-columns:minmax(0,1.6fr) minmax(240px,1fr);align-items:center;gap:clamp(24px,5vw,80px)}
.resource-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:24px}
.resource-actions .paper-link{margin:0;white-space:normal;line-height:1.45;text-align:center}
.resource-note{align-self:stretch;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;position:relative;overflow:hidden;padding:30px 32px;border:1px solid var(--line);border-radius:24px;background:var(--laowai-sage)}
.resource-note .resource-note-glyph{display:block;font:64px/1.1 "Songti SC",serif;margin-bottom:26px;color:var(--green)}
.resource-page .resource-note p{font-size:16px;line-height:1.7;margin:12px 0}
.resource-note a{font-size:14px;line-height:1.6;min-height:44px;display:inline-flex;align-items:center;text-underline-offset:4px}
.hsk-editions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:20px 0 0}
.hsk-editions a{display:inline-flex;align-items:center;flex-wrap:wrap;gap:8px;padding:12px 17px;min-height:46px;border:1px solid var(--line);border-radius:12px;text-decoration:none;font-size:14px;line-height:1.4}
.hsk-editions a span{font-size:12px;opacity:.8}
.hsk-editions a[aria-current]{background:var(--green);border-color:var(--green);color:#fff}
.hsk-editions a:last-child{border-color:transparent;text-decoration:underline;text-underline-offset:5px}
.resource-section-heading{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:10px 24px;margin:0 0 24px}
.resource-section-heading h2{font:500 clamp(27px,3vw,36px)/1.2 var(--serif);margin:0}
.resource-section-heading p{font-size:14px;color:var(--muted);max-width:52ch;margin:0;line-height:1.6}
.hsk-level-section{padding-top:36px;scroll-margin-top:24px}
.resource-page .hsk-level-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:0 0 28px}
.hsk-level-card{--level-paper:var(--laowai-sage);display:flex;flex-direction:column;min-width:0;gap:16px;padding:24px 26px;border:1px solid var(--line);border-radius:6px;background:transparent;color:var(--ink);text-decoration:none;transition:border-color .15s ease}
.hsk-level-card:nth-child(3n+2){--level-paper:var(--laowai-blue)}
.hsk-level-card:nth-child(3n){--level-paper:var(--laowai-honey)}
.hsk-level-card:hover{border-color:var(--green)}
.hsk-card-top{display:flex;align-items:center;justify-content:space-between;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.hsk-card-top>span:last-child{display:grid;place-items:center;width:36px;height:36px;background:var(--level-paper);border-radius:50%;color:var(--ink);font-size:18px}
.hsk-level-card h3{font:600 25px/1.2 var(--font-body);letter-spacing:-.025em;margin:0}
.hsk-level-card .hsk-card-count{font:500 30px/1.2 var(--serif);font-variant-numeric:tabular-nums;margin:0}
.hsk-card-count span{display:block;font:400 13px/1.5 var(--font-body);color:var(--muted);margin-top:7px}
.hsk-level-card .hsk-card-added{font-size:13px;line-height:1.5;margin:0}
.hsk-card-link{font-size:14px;margin-top:auto;padding-top:6px;color:var(--green);font-weight:600}
.hsk-level-nav{display:flex;flex-wrap:wrap;gap:8px;padding:22px 0;border-block:1px solid var(--line);margin-bottom:28px}
.hsk-level-nav a{display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;border-radius:10px;background:var(--card);font-size:14px;text-decoration:none;border:1px solid var(--line)}
.hsk-level-nav a[aria-current]{background:var(--green);color:#fff;border-color:var(--green)}
.hsk-word-list{margin-top:42px;scroll-margin-top:24px}
.hsk-list-tools{display:flex;align-items:end;gap:12px;max-width:620px}
.hsk-list-tools label{display:grid;gap:8px;flex:1;min-width:0;font-size:13px;color:var(--muted)}
.hsk-list-tools input{width:100%;min-width:0;min-height:48px;padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);font:400 16px/1.5 var(--font-body)}
.hsk-list-tools .paper-link{min-height:48px;margin:0}
.resource-page .hsk-table-scroll{margin-top:20px}
.resource-page .hsk-table{border-top:1px solid var(--line)}
.resource-page .hsk-table td{padding-block:16px}
.resource-page .hsk-table tr:target{background:var(--laowai-honey)}
.resource-page .hsk-table td:nth-child(2){font-size:26px}
.resource-page .hsk-table a{text-decoration:none;color:var(--green)}
.resource-page .hsk-table a:hover{text-decoration:underline}
.resource-page .hsk-pagination a{border-radius:10px;padding:12px 16px}
.resource-next{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px 40px;padding:32px;margin:44px 0;background:var(--laowai-blue);border-radius:24px}
.resource-next h2{font:500 clamp(28px,3vw,38px)/1.2 var(--serif);margin:12px 0}
.resource-next p{max-width:48ch;line-height:1.65;margin:0}
.resource-next .resource-actions{margin-top:0}
.resource-page .hsk-word-search{padding:32px;border-radius:24px;background:var(--card);border:1px solid var(--line);margin:32px 0 12px}
.hsk-word-search input{border-radius:12px}
.hsk-word-search button{border-radius:12px}
.resource-grammar .lesson-hero{padding:40px 0 32px;margin:0;gap:38px}
.resource-grammar .lesson-hero h1{font-size:clamp(36px,4.8vw,66px);line-height:1.1}
.resource-grammar .lesson-hero .intro{font-size:18px;line-height:1.7}
.resource-grammar .lesson-opening{align-self:center}
.resource-grammar .grammar-index-hero{max-width:820px}
.resource-grammar .grammar-index-hero h1{font-size:clamp(44px,5.5vw,76px)}
.grammar-essentials{margin:36px 0 28px}
.grammar-essential-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.grammar-essential-grid a{display:grid;grid-template-columns:1fr auto;align-content:start;gap:14px 12px;padding:22px;border-radius:18px;background:var(--laowai-sage);color:var(--ink);text-decoration:none;min-width:0}
.grammar-essential-grid a:nth-child(2){background:var(--laowai-blue)}
.grammar-essential-grid a:nth-child(3){background:var(--laowai-honey)}
.grammar-essential-grid a:nth-child(4){background:var(--laowai-pink)}
.grammar-essential-grid [lang=zh-Hans]{grid-column:1/-1;font:36px/1.2 "Songti SC",serif}
.grammar-essential-grid a>span:nth-child(2){font-size:14px;line-height:1.5}
.resource-grammar details.grammar-browse-topics{margin:24px 0;padding:18px 0;border-block:1px solid var(--line)}
.grammar-browse-topics summary{cursor:pointer;min-height:32px;font-size:15px;color:var(--green);font-weight:600}
.grammar-browse-topics .grammar-topic-links{margin-top:20px}
.resource-grammar .grammar-directory-card{background:var(--card);border-radius:20px}
.resource-grammar #practice{scroll-margin-top:28px}
.resource-grammar #practice h2{margin-top:0}
.resource-page [hidden]{display:none!important}
@media(max-width:1000px){.resource-hero{grid-template-columns:minmax(0,1.5fr) minmax(220px,1fr);gap:28px}.resource-note{padding:24px}.resource-page .hsk-level-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.grammar-essential-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){
  .resource-page .resource-nav{gap:6px 20px;padding:12px 0;font-size:13px}
  .resource-page .breadcrumb{margin-top:18px}
  .resource-page .index-hero{padding-block:30px}
  .resource-hero{grid-template-columns:1fr!important}
  .resource-page .index-hero h1{font-size:clamp(40px,9vw,60px)}
  .resource-page .index-hero p{font-size:16px}
  .resource-note{padding:22px;display:grid;grid-template-columns:48px 1fr;gap:6px 18px}
  .resource-note .resource-note-glyph{grid-row:1/4;font-size:44px;margin:0}
  .resource-note p,.resource-note a{grid-column:2;margin:0!important}
  .resource-page .resource-note p{font-size:14px}
  .resource-note a{font-size:13px}
  .hsk-editions{gap:8px;padding-top:16px}
  .hsk-editions a{padding:10px 12px;font-size:13px}
  .hsk-editions a span{display:none}
  .hsk-editions a:last-child{padding-left:0}
  .resource-page .hsk-level-grid{gap:12px}
  .hsk-level-card{padding:18px;gap:14px;border-radius:18px}
  .hsk-level-card h3{font-size:22px}
  .hsk-level-card .hsk-card-count{font-size:33px}
  .hsk-card-top>span:last-child{width:28px;height:28px;font-size:16px}
  .hsk-card-link{font-size:13px;line-height:1.5}
  .hsk-level-nav{gap:6px;padding-block:16px}
  .hsk-level-nav a{padding:9px 12px;font-size:13px}
  .resource-page .hsk-table{min-width:0;width:100%}
  .resource-page .hsk-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .resource-page .hsk-table tbody{display:block}
  .resource-page .hsk-table tr{display:grid;grid-template-columns:44px minmax(0,1fr);gap:0 14px;padding:14px 0;border-bottom:1px solid var(--line)}
  .resource-page .hsk-table td{border:0;padding:0;min-width:0;width:auto;overflow-wrap:anywhere}
  .resource-page .hsk-table td:first-child{grid-column:1;grid-row:1/4;padding-top:10px;font-size:12px}
  .resource-page .hsk-table td:nth-child(n+2){grid-column:2}
  .resource-page .hsk-table td[lang=zh-Latn]{font-size:16px;padding:3px 0}
  .resource-page .hsk-table td:last-child{font-size:12px;line-height:1.6;color:var(--muted);padding-top:4px}
  .resource-page .hsk-table-scroll{overflow:visible}
  .resource-page .hsk-table caption{display:block;font-size:13px;line-height:1.6}
  .resource-next,.resource-page .hsk-word-search{padding:24px}
  .resource-grammar .lesson-hero{padding-top:30px;gap:24px}
  .resource-grammar .lesson-hero h1{font-size:clamp(34px,8vw,48px)}
  .resource-grammar .lesson-hero .intro{font-size:16px}
}
@media(max-width:380px){.resource-page .hsk-level-grid{grid-template-columns:1fr}.resource-actions{gap:12px}.grammar-essential-grid a{padding:16px}.resource-note{padding:18px;grid-template-columns:38px 1fr}}
@media(prefers-reduced-motion:reduce){.hsk-level-card{transition:none}.hsk-level-card:hover{transform:none}}
@media print{.resource-nav,.resource-actions,.hsk-editions,.hsk-level-nav,.hsk-list-tools,.resource-note{display:none!important}.resource-page [data-hsk-entry][hidden]{display:table-row!important}.resource-page .hsk-table{min-width:0}}

.resource-hsk .resource-hero{grid-template-columns:minmax(0,1fr);padding-block:28px;gap:0}
.resource-hsk .index-hero h1{font-size:clamp(32px,5vw,48px);line-height:1.15;max-width:none;margin:12px 0 18px}
.resource-hsk .index-hero p{font-size:16px;line-height:1.65;max-width:70ch}
.resource-hsk .hsk-level-card{padding:20px;gap:12px;border-radius:6px}

.resource-hsk .hsk-source-notes{margin:18px 0;font-size:13px;line-height:1.7;color:var(--muted)}
.resource-hsk .hsk-source-notes summary{cursor:pointer;font-weight:600}
.resource-hsk .hsk-source-notes p{max-width:90ch;margin:10px 0 0}
.resource-hsk .hsk-word-list{margin-top:24px}