/* 1000 слів: word list pages. Same palette as the site + the yellow play button from /kids/abc */
.wd{--wd-pencil:#F3C443;--wd-pencil-ink:#3A2C00;--wd-ipa:"Noto Sans","Segoe UI","DejaVu Sans",sans-serif;padding-block:0 3rem}
.wd-hero{background:var(--color-primary);color:#fff;padding-block:2.6rem 2.2rem}
.wd-hero a.back{color:rgba(255,255,255,.65);text-decoration:none;font-size:.875rem}
.wd-hero h1{color:#fff;margin:.6rem 0 .5rem}
.wd-hero p{color:rgba(255,255,255,.85);max-width:46rem}
.wd-hero .tag{display:inline-block;background:#DBEAFE;color:#1E40AF;font-size:.8125rem;font-weight:700;padding:.2rem .65rem;border-radius:100px}
.wd-bar{position:sticky;top:4.1rem;z-index:50;background:var(--color-bg);display:flex;flex-wrap:wrap;gap:.45rem;align-items:center;padding-block:.65rem;border-bottom:1px solid var(--color-border)}
.wd-bar button{font:600 .875rem var(--font-sans);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);border-radius:99px;padding:.45rem .8rem;cursor:pointer;min-height:2.4rem}
.wd-bar button[aria-pressed="true"]{background:var(--color-primary);border-color:var(--color-primary);color:#fff}
.wd-bar .prog{margin-left:auto;font-size:.875rem;color:var(--color-muted);white-space:nowrap}
.wd-list{list-style:none;margin-top:1rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:0 .9rem}
.wd-row{display:grid;grid-template-columns:2rem auto minmax(0,1fr) auto;gap:.15rem .7rem;align-items:center;padding:.6rem 0;border-bottom:1px solid var(--color-border);cursor:pointer}
.wd-row:last-child{border-bottom:0}
.wd-row .num{font-size:.8rem;color:var(--color-muted);text-align:right;font-variant-numeric:tabular-nums}
.wd-row .txt{min-width:0}
.wd-row .en{font-weight:700;color:var(--color-text);font-size:1.05rem}
.wd-row .ipa{font-family:var(--wd-ipa);color:var(--color-muted);font-size:.9em;margin-left:.35rem}
.wd-row .rd{display:block;color:var(--color-primary);font-size:.95em}
.wd-row .uk{display:block;color:var(--color-text);font-size:.95em;opacity:.85}
.wd-row.done .en{color:var(--color-accent)}
.wd.quiz .wd-row:not(.show) .uk{filter:blur(6px);user-select:none}
.wd.quiz .wd-row:not(.show) .uk::after{content:""}
.pl{flex:none;width:2.5rem;height:2.5rem;border-radius:50%;border:0;background:var(--wd-pencil);color:var(--wd-pencil-ink);display:inline-grid;place-items:center;cursor:pointer;transition:transform .12s}
.pl svg{width:58%;height:58%;fill:currentColor}
.pl svg .w{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;opacity:0}
.pl.on svg .w{opacity:1}
.pl.on{transform:scale(1.08);box-shadow:0 0 0 4px rgba(243,196,67,.35)}
@media (prefers-reduced-motion:reduce){.pl{transition:none}.pl.on{transform:none}}
.ok{flex:none;width:2.2rem;height:2.2rem;border-radius:50%;border:1.5px solid var(--color-border);background:var(--color-surface);color:transparent;display:grid;place-items:center;cursor:pointer;font-size:1rem;font-weight:700}
.wd-row.done .ok{background:var(--color-accent);border-color:var(--color-accent);color:#fff}
.wd-nav{display:flex;justify-content:space-between;gap:1rem;margin-top:1.6rem;flex-wrap:wrap}
.wd-nav a{display:block;padding:.8rem 1rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);text-decoration:none;color:var(--color-text);max-width:100%}
.wd-nav small{display:block;color:var(--color-muted);font-size:.8rem}
.wd-nav .nx{margin-left:auto;text-align:right}
.wd-note{margin-top:1.4rem;padding:.9rem 1.1rem;border-left:3px solid var(--wd-pencil);background:var(--color-surface);border-radius:0 8px 8px 0;max-width:46rem}
.wd-note h2{font-size:1.1rem;margin-bottom:.4rem}
.wd-note ul{padding-left:1.1rem;display:grid;gap:.25rem}
.wd-note p+p{margin-top:.4rem}
.wd-search{margin-top:1.6rem}
.wd-search input{width:100%;font:1rem var(--font-sans);padding:.8rem 1rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text)}
.wd-search input:focus{outline:2px solid var(--color-primary);outline-offset:1px}
.wd-search .hint{font-size:.875rem;color:var(--color-muted);margin-top:.4rem}
.wd-sec{margin-top:2rem}
.wd-sec h2{color:var(--color-primary);margin-bottom:.8rem}
.wd-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.8rem}
.wd-card{display:grid;gap:.3rem;padding:1rem 1.1rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);text-decoration:none;color:var(--color-text);transition:border-color .12s}
.wd-card:hover{border-color:var(--color-primary)}
.wd-card b{font-size:1.02rem}
.wd-card span{font-size:.875rem;color:var(--color-muted)}
.wd-card .bar{height:4px;border-radius:2px;background:var(--color-border);overflow:hidden}
.wd-card .bar i{display:block;height:100%;width:0;background:var(--color-accent)}
.wd-res .wd-row{grid-template-columns:auto minmax(0,1fr) auto}
.wd-res .wd-row a{font-size:.8rem;color:var(--color-muted);white-space:nowrap}
.wd-cta{margin-top:2.5rem;background:var(--color-primary);color:#fff;border-radius:var(--radius-lg);padding:1.8rem 1.5rem;display:grid;gap:.9rem;justify-items:start}
.wd-cta h2{color:#fff}.wd-cta p{color:rgba(255,255,255,.85)}
@media (max-width:560px){
  .wd-row{grid-template-columns:auto minmax(0,1fr) auto}
  .wd-row .num{display:none}
  .wd-bar .prog{margin-left:0;width:100%}
  .wd-list{padding:0 .6rem}
}