/* ── CHINESE APP EMBED ───────────────────────────────────── */
#chinese-section{padding:32px 0}
.chinese-header{margin-bottom:32px}
.chinese-title{font-family:'Bebas Neue',sans-serif;font-size:2.5rem;letter-spacing:0.12em;color:var(--text);margin-bottom:8px}
.chinese-desc{font-size:0.85rem;color:var(--text-dim);line-height:1.7;max-width:560px;margin-bottom:16px}
.hsk-filter{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.hsk-option{
  padding:6px 14px;background:var(--cell);border:1px solid var(--cell-border);
  border-radius:5px;cursor:pointer;font-size:0.72rem;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--text-dim);transition:all 0.15s;
  font-family:'DM Mono',monospace;
}
.hsk-option:hover{border-color:var(--accent);color:var(--accent)}
.hsk-option.selected{background:var(--accent);color:var(--bg);border-color:var(--accent)}
.flashcard{
  background:var(--surface);border:1px solid var(--cell-border);
  border-radius:16px;padding:56px 48px;
  max-width:480px;min-height:280px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:16px;cursor:pointer;transition:border-color 0.2s;
  position:relative;
}
.flashcard:hover{border-color:var(--accent2)}
.flashcard-hint{
  position:absolute;top:16px;right:20px;
  font-size:0.65rem;letter-spacing:0.15em;text-transform:uppercase;
  color:var(--text-dim);
}
.fc-char{
  font-size:96px;line-height:1;color:var(--text);
  transition:transform 0.15s;
}
.flashcard:hover .fc-char{transform:scale(1.04)}
.fc-pinyin{
  font-family:'Lora',serif;font-style:italic;
  font-size:1.4rem;color:var(--accent2);
  opacity:0;transition:opacity 0.25s;
}
.fc-pinyin.visible{opacity:1}
.fc-definition{
  font-size:0.9rem;color:var(--text-dim);
  opacity:0;transition:opacity 0.25s;text-align:center;
}
.fc-definition.visible{opacity:1}
.fc-hsk{
  font-size:0.65rem;letter-spacing:0.15em;text-transform:uppercase;
  color:var(--cell-border);margin-top:8px;
}
.chinese-controls{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap;align-items:center}
.cn-btn{
  background:transparent;border:1px solid var(--accent);color:var(--accent);
  font-family:'DM Mono',monospace;font-size:0.72rem;letter-spacing:0.1em;
  padding:8px 20px;border-radius:6px;cursor:pointer;transition:all 0.15s;
  text-transform:uppercase;
}
.cn-btn:hover{background:var(--accent);color:var(--bg)}
.cn-counter{font-size:0.75rem;color:var(--text-dim);margin-left:8px}
.progress-bar{
  width:100%;max-width:480px;height:3px;background:var(--cell);
  border-radius:2px;margin-bottom:24px;overflow:hidden;
}
.progress-fill{height:100%;background:var(--accent);transition:width 0.4s ease;width:0%}

