/* Content-led collection and evidence-based progress, within the Nightline palette. */
#woerterView,#fortschrittView,#bestenlisteView{max-width:1120px;width:100%;margin-inline:auto;min-width:0}
#woerterGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
#woerterGrid .dict-card{padding:24px;min-width:0;box-shadow:none}
#woerterGrid .wcard-word{margin-top:0;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
#woerterGrid .lesson-word{font:500 26px/1.2 var(--serif);overflow-wrap:anywhere}
#woerterGrid .lesson-example{line-height:1.65;font-size:15px}
.insights-history{border-top:1px solid var(--hair-soft);margin-top:18px;color:var(--text-muted);font-size:13px}
.insights-history summary{min-height:48px;display:list-item;align-content:center;cursor:pointer;margin-left:17px;padding-block:12px}
.insights-history .dict-card-meta{border:0;margin:0;padding:0 0 12px;gap:12px;flex-wrap:wrap;color:var(--text-muted)}
.insights-due{display:inline-block;color:var(--accent);font-size:13px;font-weight:600;margin-top:14px}
.app[data-section="fortschritt"] #fortschrittView{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;align-items:start}
#fortschrittView>.section-head,#fortschrittReview,#fortschrittTiles{grid-column:1/-1;margin-bottom:0}
#fortschrittReview{padding:22px 24px;box-shadow:none;border-radius:14px;gap:20px}
#freviewBtn{background:var(--nightline-primary);color:white;border-color:var(--nightline-primary);border-radius:9px;min-height:48px;white-space:normal}
#fortschrittTiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:0;background:none;box-shadow:none;gap:0;padding:0}
#fortschrittTiles .stat-tile{border:0;border-radius:0;box-shadow:none;padding:20px 24px;border-bottom:1px solid var(--line-ui);min-width:0}
#fortschrittTiles .stat-tile-n{font:500 32px/1.15 var(--serif);color:var(--text)}
#fortschrittTiles .stat-tile-l{font-size:14px;line-height:1.45}
#fortschrittTiles .insights-time{order:1;grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;padding-block:14px;border:0}
#fortschrittTiles .insights-time .stat-tile-n{font:500 16px/1.4 var(--font)}
#fortschrittTiles .insights-time .stat-tile-l{margin:0}.insights-time-note{font-size:12px;color:var(--text-muted)}
#fortschrittView .fortschritt-panel{padding:24px;margin:0;min-width:0;box-shadow:none}
#fortschrittView .chart-head{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;justify-content:space-between}
#fortschrittView .chart-sub{white-space:normal;font-size:13px;color:var(--text-muted)}
#fortschrittChart svg{width:100%;height:auto;max-height:200px;overflow:visible;margin-top:18px}
#fortschrittChart .chart-day,#fortschrittChart .chart-n{fill:var(--text-muted)}
#fortschrittChart .chart-bar{fill:var(--accent)}#fortschrittChart .chart-bar--today{fill:var(--gold-text)}#fortschrittChart .chart-bar--zero{fill:var(--hair-soft)}
.insights-level-note{font-size:13px;line-height:1.6;color:var(--text-muted);margin:12px 0 20px}
#fortschrittLevels .lvlbar-row{min-height:36px;gap:14px}#fortschrittWeak{grid-column:1/-1}
#bestenlisteView .fortschritt-panel{box-shadow:none;padding:28px;max-width:840px;margin-inline:auto}
#fortschrittGlobalTitle{font:400 16px/1.5 var(--font);color:var(--text-muted);margin:0 0 22px}
#fortschrittLbTabs{display:flex;gap:8px;padding:0 0 20px;border:0;background:none}
#fortschrittLbTabs[hidden]{display:none}#fortschrittLbTabs .lb-tab{min-height:48px;flex:1;border:1px solid var(--line-ui);border-radius:9px;color:var(--text);background:var(--bg);padding:10px 16px}
#fortschrittLbTabs .lb-tab[aria-selected=true]{background:var(--nightline-primary);color:white;border-color:var(--nightline-primary)}
#fortschrittGlobalBoard .leaderboard-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:14px;align-items:center;min-height:66px;padding:12px 16px;border-bottom:1px solid var(--hair-soft);border-radius:0;background:none;animation:none}
#fortschrittGlobalBoard .leaderboard-row.active{background:var(--accent-wash);border-radius:9px}
#fortschrittGlobalBoard .lb-name{overflow-wrap:anywhere;min-width:0}#fortschrittGlobalBoard .lb-count{font:500 22px/1.2 var(--serif);font-variant-numeric:tabular-nums;color:var(--text)}
#fortschrittGlobalBoard .lb-rank{color:var(--text-muted);font-size:14px;background:none}#fortschrittGlobalHint{line-height:1.6;margin-block:22px 12px}#fortschrittGlobalAction{min-height:48px;border-radius:9px;padding:12px 18px}
@media(max-width:720px){#woerterGrid{grid-template-columns:minmax(0,1fr);gap:14px}#woerterGrid .dict-card{padding:20px}.app[data-section="fortschritt"] #fortschrittView{grid-template-columns:minmax(0,1fr);gap:18px}#fortschrittView>.fortschritt-panel{grid-column:1;padding:20px}#fortschrittTiles .stat-tile{padding:16px 10px}#fortschrittTiles .stat-tile-n{font-size:27px}#fortschrittTiles .stat-tile-l{font-size:12px}#fortschrittReview{padding:18px;flex-wrap:wrap}#freviewBtn{width:100%}#bestenlisteView .fortschritt-panel{padding:20px}#fortschrittGlobalBoard .leaderboard-row{padding:12px 5px;gap:10px;grid-template-columns:26px minmax(0,1fr) auto}}
@media(max-width:370px){#fortschrittTiles{grid-template-columns:repeat(2,minmax(0,1fr))}#fortschrittTiles .stat-tile:nth-child(4){grid-column:1/-1}#fortschrittTiles .insights-time{padding-inline:10px}#fortschrittChart .chart-day{font-size:8px}}

/* Scan words first; examples and collection history remain one tap away. */
#woerterGrid{gap:12px}
#woerterGrid .dict-card{padding:16px}
#woerterGrid .wcard-word{margin-bottom:6px;gap:8px}
#woerterGrid .wcard-tags{margin-top:6px}
#woerterGrid .wcard-gloss-details>summary{margin-top:4px}
#woerterGrid .insights-due{margin-top:8px}
#woerterGrid .insights-history{margin-top:4px}
.insights-example{margin-top:8px;border-top:1px solid var(--hair-soft);font-size:14px;color:var(--text-muted)}
.insights-example>summary{min-height:44px;align-content:center;cursor:pointer;margin-left:17px}
#woerterGrid .insights-example .wcard-ex{margin:0;padding:4px 0 8px;border:0}
#woerterGrid .insights-history summary{min-height:44px;padding-block:8px}

#woerterGrid .wcard{gap:4px}
#woerterGrid .wcard-gloss{margin:4px 0 6px}
#woerterGrid .dict-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 8px}
#woerterGrid .dict-card>.wcard{grid-column:1/-1}
#woerterGrid .insights-due{align-self:center;margin:0}
#woerterGrid .insights-history{border:0;margin:0;justify-self:end}
#woerterGrid .insights-history[open]{grid-column:1/-1;justify-self:stretch}
#woerterView .section-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;margin-bottom:16px}
#woerterTitle{grid-column:1;grid-row:1}#woerterCount{grid-column:1;grid-row:2;font-size:13px}
#reviewOpenBtn{grid-column:2;grid-row:1/3;margin:0;border-radius:9px}
#woerterFilters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
#woerterSearch{flex-basis:100%;min-width:0}
#woerterLevels{flex:1;min-width:0}
#woerterSort{padding-inline:10px}

/* A word and its meaning form one compact reading unit; details retain full tap targets. */
#woerterGrid .wcard-word{gap:6px;flex-wrap:wrap;min-height:44px;margin-bottom:2px}
#woerterGrid .lesson-gender{font-size:14px;line-height:1.4;padding:3px 6px;flex:none}
#woerterGrid .lesson-word{font-size:25px;line-height:1.2;min-width:0;flex:1;overflow-wrap:anywhere}
#woerterGrid .wcard .lesson-speak{width:44px;height:44px;min-width:44px;min-height:44px;margin-left:0;border-radius:10px}
#woerterGrid .wcard-gloss{font-size:16px;font-weight:700;line-height:1.45;color:var(--text);margin:4px 0 8px}
#woerterGrid .wcard-plural{line-height:1.5;margin:4px 0 8px}
#woerterGrid .insights-example{margin-top:4px}
#woerterGrid .insights-example>summary,#woerterGrid .insights-history>summary{min-height:44px;line-height:1.5}
#woerterGrid .dict-card-meta{line-height:1.6}
#woerterGrid .insights-due{font-size:12px}

/* Three distinct outcomes; elapsed time remains supporting information. */
#fortschrittTiles{gap:12px}
#fortschrittTiles .stat-tile:not(.insights-time){padding:22px;border:1px solid var(--line-ui);border-radius:14px;background:var(--surface)}
#fortschrittTiles .stat-tile:first-child{background:var(--accent-wash)}
#fortschrittTiles .stat-tile-n{font-variant-numeric:tabular-nums}
#fortschrittTiles .stat-tile-l{font-size:13px}
#fortschrittTiles .insights-time{padding:4px 0 6px}
#fortschrittView.insights-revealed #fortschrittTiles .stat-tile-n[data-count]{animation:insights-number-settle .55s cubic-bezier(.16,1,.3,1) both}
#fortschrittView.insights-revealed #fortschrittChart .chart-bar:not(.chart-bar--zero){transform-box:fill-box;transform-origin:center bottom;animation:insights-bar-reveal .65s cubic-bezier(.16,1,.3,1) both}
@keyframes insights-number-settle{from{transform:translateY(5px);color:var(--accent)}to{transform:translateY(0);color:var(--text)}}
@keyframes insights-bar-reveal{from{transform:scaleY(.15)}to{transform:scaleY(1)}}
@media(max-width:720px){#fortschrittTiles{gap:8px}#fortschrittTiles .stat-tile:not(.insights-time){padding:16px 10px}#fortschrittTiles .stat-tile-l{font-size:12px}#fortschrittTiles .stat-tile-sub{font-size:11px}}
@media(prefers-reduced-motion:reduce){#fortschrittView.insights-revealed #fortschrittTiles .stat-tile-n[data-count],#fortschrittView.insights-revealed #fortschrittChart .chart-bar:not(.chart-bar--zero){animation:none}}