:root{
  /* Tỉ lệ cỡ chữ: --fs cho chữ nội dung, --fs-big cho tiêu đề/chữ vốn đã lớn. Muốn chỉnh chỉ cần đổi 2 số này. */
  --fs:1.3; --fs-big:1.1;
  --bg:#f4f0e6; --panel:#fffdf8; --text:#2a211c; --muted:#786b60;
  --accent:#7a302c; --accent2:#a15a45; --line:#d8cdbd; --ok:#2f6f4e; --bad:#9a332f;
  --shadow:0 16px 40px rgba(71,49,36,.08);
}
.verb-search{padding:20px;margin-top:16px}.verb-search>label{font-weight:700;display:block;margin-bottom:10px}.verb-search-row{display:flex;gap:10px}.verb-search-row input{flex:1;min-width:0;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--text)}
.verb-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:20px}.verb-filters label{display:grid;gap:8px;color:var(--muted);font-size:calc(14px*var(--fs));font-weight:700;min-width:0}.verb-filters select{width:100%;min-width:0;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--text)}
.verb-match-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:360px;overflow:auto}.verb-match{display:grid;gap:5px;text-align:left;border:1px solid var(--line);border-radius:12px;padding:12px;background:var(--panel);color:var(--text);cursor:pointer}.verb-match:hover{border-color:var(--accent)}.verb-match strong{color:var(--accent);font-family:"Noto Serif",Georgia,serif;font-size:calc(20px*var(--fs))}.verb-match small{color:var(--muted);line-height:1.6}.verb-highlight{outline:2px solid var(--accent);background:color-mix(in srgb,var(--accent) 15%,var(--panel))}
.verb-table{width:100%;min-width:540px;border-collapse:collapse}.verb-table caption{text-align:left;padding:14px;color:var(--accent);font-weight:700;background:var(--panel)}.verb-table th,.verb-table td{position:static;padding:14px;text-align:left;border-bottom:1px solid var(--line)}.verb-table th{font-family:inherit;font-size:calc(14px*var(--fs));color:var(--text);background:color-mix(in srgb,var(--accent) 5%,var(--panel));min-width:140px}.verb-table td{min-width:160px}.verb-table-hint,.verb-invariant p{color:var(--muted);line-height:1.6}.verb-formation{display:flex;gap:30px;flex-wrap:wrap;margin:18px 0}.verb-formation dt{font-size:calc(13px*var(--fs));color:var(--muted);margin-bottom:5px}.verb-formation dd{margin:0;font-family:"Noto Serif",Georgia,serif;font-size:calc(20px*var(--fs))}.verb-source{font-size:calc(13px*var(--fs));color:var(--accent);line-height:1.6}.verb-example{padding:18px 0 0;line-height:1.6}.verb-example p{font-family:"Noto Serif",Georgia,serif;font-size:calc(19px*var(--fs));margin:8px 0}.verb-example small{color:var(--muted)}.text-link{padding:0;border:0;background:none;color:var(--accent);text-decoration:underline;cursor:pointer}.verb-tabs{margin-bottom:16px}
.verb-filters .hidden{display:none}
@media(max-width:760px){.verb-filters{grid-template-columns:1fr 1fr}.verb-match-list{grid-template-columns:1fr}.verb-search-row{flex-wrap:wrap}.verb-search-row input{flex-basis:100%}.verb-table{min-width:510px}.verb-table th,.verb-table td{padding:10px}.verb-table .declension-form{font-size:calc(16px*var(--fs))}.verb-formation{gap:16px}.verb-source{max-width:100%}}
@media(max-width:480px){.verb-filters{grid-template-columns:1fr}.verb-search,.verb-filters{padding:16px}.verb-tabs .tab{flex:1;padding:10px 8px}}
*{box-sizing:border-box}
body{margin:0;font-size:calc(16px*var(--fs));font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:radial-gradient(circle at top,#fffaf0 0,var(--bg) 45%,#eee7d9 100%);color:var(--text);min-height:100vh}
body.dark{--bg:#1f1b18;--panel:#2a2420;--text:#f5eee4;--muted:#b7aa9e;--accent:#d78f7f;--accent2:#c87969;--line:#4b4038;--ok:#78c59b;--bad:#ed8a84;background:#1f1b18}
button,input,select{font:inherit}
.topbar{max-width:1180px;margin:0 auto;padding:24px 20px 10px;display:flex;justify-content:space-between;align-items:center}
.brand{display:flex;gap:14px;align-items:center}.site-logo{width:78px;height:52px;object-fit:contain;flex:0 0 auto;filter:url(#logoPaper)}
h1{font-family:"Noto Serif",Georgia,"Times New Roman",serif;margin:0;font-size:calc(clamp(26px,4vw,40px)*var(--fs-big));font-weight:600}.brand p{margin:5px 0 0;color:var(--muted)}
.icon-btn{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:12px;padding:9px 12px;cursor:pointer}
.shell{max-width:1180px;margin:0 auto;padding:14px 20px 50px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow)}
.controls{padding:16px 18px}.control-row{display:grid;grid-template-columns:1.35fr .8fr 1.45fr;gap:12px;align-items:end}.control-row>label{display:grid;gap:6px;color:var(--muted);font-size:calc(13px*var(--fs));font-weight:700}.control-row>label select,.control-row>label input{width:100%;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:transparent;color:var(--text);outline:none}.control-row>label input:focus,.control-row>label select:focus,.answer-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%, transparent)}
.lesson-picker{min-width:0;margin:0;padding:0;border:0}.lesson-picker legend{padding:0;color:var(--muted);font-size:calc(13px*var(--fs));font-weight:700}.lesson-summary{display:block;margin-top:4px;color:var(--accent);font-size:calc(12px*var(--fs));font-weight:700}.lesson-checks{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}.lesson-check{display:inline-flex;align-items:center;gap:5px;padding:7px 10px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--text);font-size:calc(12px*var(--fs));font-weight:700;line-height:1;cursor:pointer;user-select:none}.lesson-check input{width:15px;height:15px;margin:0;padding:0;accent-color:var(--accent)}.lesson-check:has(input:checked){color:var(--accent);border-color:var(--accent2);background:color-mix(in srgb,var(--accent) 8%,var(--panel))}.lesson-check:focus-within{outline:2px solid var(--accent2);outline-offset:2px}
.stats{display:flex;gap:18px;flex-wrap:wrap;margin-top:13px;color:var(--muted);font-size:calc(14px*var(--fs))}.stats b{color:var(--text)}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.tab{border:1px solid var(--line);background:var(--panel);color:var(--text);padding:10px 14px;border-radius:999px;cursor:pointer}.tab.active{background:var(--accent);color:white;border-color:var(--accent)}a.tab{text-decoration:none;color:var(--text);display:inline-block}
.mode-panel{min-height:420px}.hidden{display:none!important}
.theory-hero{padding:24px;display:flex;align-items:flex-end;justify-content:space-between;gap:22px}.theory-hero .eyebrow{margin-bottom:8px}.theory-hero h2{font-family:"Noto Serif",Georgia,"Times New Roman",serif;font-size:calc(clamp(26px,4vw,38px)*var(--fs-big));font-weight:600;margin:0;color:var(--accent)}.theory-lead{max-width:800px;margin:10px 0 0;color:var(--muted);line-height:1.65}.theory-switcher{display:flex;gap:8px;flex-wrap:wrap;flex:0 0 auto}.theory-lesson{border:1px solid var(--line);background:transparent;color:var(--text);padding:9px 13px;border-radius:999px;cursor:pointer;font-weight:700}.theory-lesson.active{background:var(--accent);border-color:var(--accent);color:#fff}.theory-content{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px}.theory-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:var(--shadow)}.theory-card.wide{grid-column:1/-1}.theory-card h3{font-family:"Noto Serif",Georgia,"Times New Roman",serif;color:var(--accent);font-size:calc(21px*var(--fs-big));margin:0 0 12px}.theory-card p{line-height:1.65;margin:10px 0}.theory-card ul{padding-left:21px;margin:8px 0}.theory-card li{line-height:1.6;margin:8px 0}.theory-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:13px}.theory-table{min-width:560px;font-size:calc(14px*var(--fs))}.theory-table th,.theory-table td{position:static;padding:10px 12px}.theory-table th{background:color-mix(in srgb,var(--accent) 7%,var(--panel));color:var(--accent)}.theory-table td:first-child{font-family:inherit;font-size:calc(14px*var(--fs));color:var(--text);font-weight:600}.theory-example,.theory-formula,.theory-memory{margin-top:13px;border-radius:13px;padding:13px 15px;line-height:1.6}.theory-example{background:color-mix(in srgb,var(--accent2) 8%,transparent);border-left:3px solid var(--accent2);display:grid;gap:5px}.theory-example span{color:var(--muted);font-size:calc(11px*var(--fs));font-weight:800;letter-spacing:.07em;text-transform:uppercase}.theory-formula{background:color-mix(in srgb,var(--accent) 9%,transparent);font-family:"Noto Serif",Georgia,"Times New Roman",serif;font-size:calc(17px*var(--fs));text-align:center}.theory-memory{grid-column:1/-1;background:var(--accent);color:#fff;border:1px solid var(--accent);box-shadow:var(--shadow)}
.theory-hero,.theory-content,.theory-hero h2,.theory-card h3,.theory-formula{font-family:"Segoe UI",Arial,sans-serif;font-kerning:normal;letter-spacing:normal;word-spacing:normal}
.theory-table details{font-weight:400;line-height:1.6}.theory-table summary{cursor:pointer;color:var(--accent);font-weight:700}.theory-table details[open] summary{margin-bottom:5px}.theory-note{padding:11px 13px;border-left:3px solid var(--accent2);background:color-mix(in srgb,var(--accent2) 8%,transparent);border-radius:6px}
.flashcard,.quiz{max-width:780px;margin:0 auto;padding:30px;text-align:center;min-height:360px;display:flex;flex-direction:column;justify-content:center;align-items:center}
.flashcard{cursor:pointer;user-select:none}.eyebrow{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:calc(12px*var(--fs));font-weight:800;margin-bottom:15px}.pali-word{font-family:"Noto Serif",Georgia,"Times New Roman",serif;font-size:calc(clamp(42px,8vw,74px)*var(--fs-big));line-height:1.05;color:var(--accent);word-break:break-word}.tap-hint{margin-top:18px;color:var(--muted);font-size:calc(13px*var(--fs))}.answer{width:100%;margin-top:22px;border-top:1px solid var(--line);padding-top:20px}.meaning{font-size:calc(23px*var(--fs-big));font-weight:750;margin-bottom:18px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;text-align:left}.field{border:1px solid var(--line);border-radius:14px;padding:12px}.field.full{grid-column:1/-1}.field .k{font-size:calc(11px*var(--fs));text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:800;margin-bottom:4px}.field .v{line-height:1.45}
.actions{display:flex;gap:10px;justify-content:center;margin-top:16px;flex-wrap:wrap}.actions button{padding:11px 17px;border-radius:12px;cursor:pointer}.actions button:disabled{opacity:.45;cursor:not-allowed}.primary{border:1px solid var(--accent);background:var(--accent);color:#fff}.secondary{border:1px solid var(--line);background:var(--panel);color:var(--text)}.review-again:not(:disabled){color:var(--bad);border-color:color-mix(in srgb,var(--bad) 55%,var(--line));background:color-mix(in srgb,var(--bad) 7%,var(--panel))}.review-known:not(:disabled){color:var(--ok);border-color:color-mix(in srgb,var(--ok) 55%,var(--line));background:color-mix(in srgb,var(--ok) 8%,var(--panel))}.review-strong:not(:disabled){color:#6b3fa0;border-color:color-mix(in srgb,#6b3fa0 55%,var(--line));background:color-mix(in srgb,#6b3fa0 9%,var(--panel));font-weight:750}.review-hint,.review-status{width:min(760px,100%);margin:10px auto 0;color:var(--muted);font-size:calc(12px*var(--fs));line-height:1.45}.review-status{min-height:18px;color:var(--accent);font-weight:650}.feedback.answer-reveal{background:color-mix(in srgb,var(--accent2) 7%,transparent);border:1px solid var(--line)}
.prompt{color:var(--muted);margin:24px 0 8px}.answer-input{width:min(560px,100%);font-size:calc(18px*var(--fs));border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:transparent;color:var(--text);outline:none;text-align:center}.pali-input{font-family:"Noto Serif",Georgia,"Times New Roman",serif;font-size:calc(22px*var(--fs-big))}.meaning-big{font-size:calc(clamp(26px,5vw,42px)*var(--fs-big));font-weight:760;max-width:650px;line-height:1.22}.feedback{width:min(660px,100%);margin-top:20px;padding:16px;border-radius:14px;text-align:left;line-height:1.5}.feedback.ok{background:color-mix(in srgb,var(--ok) 12%,transparent);border:1px solid color-mix(in srgb,var(--ok) 50%,transparent)}.feedback.bad{background:color-mix(in srgb,var(--bad) 10%,transparent);border:1px solid color-mix(in srgb,var(--bad) 45%,transparent)}
.table-card{padding:0;overflow:hidden}.table-scroll{overflow:auto;max-height:70vh}table{border-collapse:collapse;width:100%;min-width:1400px;font-size:calc(14px*var(--fs))}th,td{border-bottom:1px solid var(--line);padding:12px;vertical-align:top;text-align:left;line-height:1.45}th{position:sticky;top:0;background:var(--panel);z-index:2;color:var(--accent)}td:first-child{font-family:"Noto Serif",Georgia,"Times New Roman",serif;font-weight:700;font-size:calc(17px*var(--fs));color:var(--accent)}
footer{padding:20px;text-align:center;color:var(--muted);font-size:calc(13px*var(--fs))}
.declension-hero{padding:24px;display:flex;align-items:center;justify-content:space-between;gap:22px}.declension-hero h2{margin:0;color:var(--accent);font-family:"Noto Serif",Georgia,"Times New Roman",serif;font-size:calc(clamp(27px,4vw,40px)*var(--fs-big));font-weight:600}.declension-hero p{max-width:780px;margin:10px 0 0;color:var(--muted);line-height:1.65}.declension-count{flex:0 0 auto;min-width:138px;padding:16px;border:1px solid var(--line);border-radius:16px;text-align:center;background:color-mix(in srgb,var(--accent) 6%,var(--panel))}.declension-count b{display:block;color:var(--accent);font-size:calc(32px*var(--fs-big));line-height:1}.declension-count span{display:block;margin-top:7px;color:var(--muted);font-size:calc(12px*var(--fs));font-weight:750}
.declension-controls{margin-top:14px;padding:18px;display:grid;grid-template-columns:1.8fr repeat(4,minmax(0,1fr));gap:12px;align-items:end}.declension-controls label{display:grid;gap:6px;color:var(--muted);font-size:calc(13px*var(--fs));font-weight:700}.declension-controls input,.declension-controls select{width:100%;min-width:0;border:1px solid var(--line);border-radius:12px;padding:11px 12px;background:var(--panel);color:var(--text);outline:none}.declension-controls input:focus,.declension-controls select:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent)}
.declension-suggestions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:44px;padding:10px 2px 0;color:var(--muted);font-size:calc(13px*var(--fs))}.declension-chip{border:1px solid var(--line);border-radius:999px;padding:7px 11px;background:var(--panel);color:var(--text);cursor:pointer}.declension-chip:hover,.declension-chip.active{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 7%,var(--panel))}
.declension-result{margin-top:14px;padding:22px}.declension-result-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:16px}.declension-result-head h3{margin:0;color:var(--accent);font-family:"Noto Serif",Georgia,"Times New Roman",serif;font-size:calc(28px*var(--fs-big))}.declension-result-head p{margin:7px 0 0;color:var(--muted)}.declension-pattern-note{max-width:760px;font-size:calc(13px*var(--fs));line-height:1.5}.declension-source{flex:0 0 auto;max-width:260px;color:var(--muted);font-size:calc(12px*var(--fs));text-align:right;line-height:1.5}.declension-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px}.declension-table{min-width:760px;font-size:calc(14px*var(--fs))}.declension-table th,.declension-table td{position:static;padding:12px 14px}.declension-table th{background:color-mix(in srgb,var(--accent) 7%,var(--panel));color:var(--accent)}.declension-table td:first-child{width:54px;font-family:inherit;font-size:calc(14px*var(--fs));color:var(--text);font-weight:800}.declension-table td:nth-child(2){min-width:230px}.declension-forms{display:flex;gap:6px;flex-wrap:wrap}.declension-form{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border:1px solid var(--line);border-radius:999px;background:color-mix(in srgb,var(--accent2) 6%,var(--panel));color:var(--accent);font-family:"Noto Serif",Georgia,"Times New Roman",serif;font-size:calc(17px*var(--fs));font-weight:700}.declension-form-tag{padding:1px 5px;border-radius:999px;background:color-mix(in srgb,var(--accent) 10%,var(--panel));font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:calc(9px*var(--fs));font-weight:800;text-transform:uppercase}.declension-note{margin-top:15px;padding:13px 15px;border-left:3px solid var(--accent2);border-radius:10px;background:color-mix(in srgb,var(--accent2) 7%,transparent);color:var(--muted);font-size:calc(13px*var(--fs));line-height:1.6}.declension-note b{color:var(--text)}
@media(max-width:760px){.control-row{grid-template-columns:1fr}.field-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.flashcard,.quiz{padding:22px;min-height:390px}.topbar{align-items:flex-start}.stats{gap:10px 16px}.theory-hero{padding:20px;align-items:flex-start;flex-direction:column}.theory-content{grid-template-columns:1fr}.theory-card{padding:17px}.theory-switcher{width:100%}.theory-lesson{flex:1}.theory-memory{grid-column:auto}}
@media(max-width:900px){.declension-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.declension-query{grid-column:1/-1}}
@media(max-width:600px){.declension-hero{align-items:flex-start;flex-direction:column}.declension-count{width:100%;display:flex;align-items:center;justify-content:center;gap:8px}.declension-count b,.declension-count span{display:inline;margin:0}.declension-controls{grid-template-columns:1fr}.declension-query{grid-column:auto}.declension-result{padding:16px}.declension-result-head{flex-direction:column}.declension-source{flex:none}.declension-table{min-width:650px}}

/* ===================== Học & ôn (study.js): FSRS · Active Recall · Admin ===================== */
.auth-bar{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;margin:0 0 12px;padding:10px 14px;border:1px dashed var(--line);border-radius:14px;color:var(--muted);font-size:calc(13px*var(--fs))}
.auth-bar input{flex:1;min-width:180px;max-width:280px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text)}
.auth-bar button{padding:8px 12px;border-radius:10px;cursor:pointer}
.session-return{margin:-6px 0 14px}.session-return button{width:100%;padding:11px 14px;border-radius:12px;cursor:pointer}
.study-stats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;padding:12px}
.study-stats div{background:color-mix(in srgb,var(--accent) 6%,var(--panel));border-radius:14px;padding:12px 6px;text-align:center}
.study-stats b{display:block;color:var(--accent);font-size:calc(26px*var(--fs-big));line-height:1.2}.study-stats span{font-size:calc(12px*var(--fs));color:var(--muted);font-weight:700}
.weak-banner{display:block;width:100%;margin:12px 0 0;padding:12px 16px;border-radius:14px;border:1px solid color-mix(in srgb,var(--bad) 45%,var(--line));background:color-mix(in srgb,var(--bad) 8%,var(--panel));color:var(--bad);font-weight:700;text-align:left;cursor:pointer}
.entry-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0}
.entry-card{display:flex;flex-direction:column;gap:3px;text-align:left;padding:15px;border-radius:18px;border:1px solid var(--line);background:var(--panel);color:var(--text);cursor:pointer;box-shadow:var(--shadow)}
.entry-card b{font-size:calc(16px*var(--fs))}.entry-card strong{font-size:calc(28px*var(--fs-big));color:var(--accent);line-height:1.2}.entry-card small{color:var(--muted);line-height:1.4}
.entry-card.due{border-color:color-mix(in srgb,var(--accent) 45%,var(--line));background:color-mix(in srgb,var(--accent) 5%,var(--panel))}
.entry-card:hover,.lp-row:hover{border-color:var(--accent)}
.study-sec{padding:18px 20px;margin-bottom:12px}.study-sec h3{margin:0 0 12px;color:var(--accent);font-size:calc(19px*var(--fs))}.study-sec h3 small{color:var(--muted);font-weight:500;font-size:calc(13px*var(--fs))}.study-sec h4{margin:18px 0 8px}
.lp-list{display:grid;gap:6px}
.lp-row{display:grid;grid-template-columns:110px 1fr 52px 64px;gap:10px;align-items:center;padding:8px 10px;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--text);cursor:pointer;text-align:left}
.lp-track{height:9px;border-radius:99px;background:color-mix(in srgb,var(--accent) 10%,var(--panel));overflow:hidden}.lp-track span{display:block;height:100%;background:var(--accent)}
.lp-row>span:nth-child(3){font-weight:800;text-align:right}.lp-row small{color:var(--muted);text-align:right}
.road{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.road span{padding:6px 11px;border-radius:999px;background:color-mix(in srgb,var(--accent2) 10%,var(--panel));font-weight:700;font-size:calc(13px*var(--fs))}.road i{color:var(--muted);font-style:normal}
.muted-note{color:var(--muted);font-size:calc(13px*var(--fs));line-height:1.6;margin:10px 0}
.settings-row{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;font-size:calc(14px*var(--fs))}.settings-row button{padding:4px 11px;border-radius:9px;cursor:pointer}.settings-row select{margin-left:6px;padding:7px 9px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text)}
.pr-block{margin-bottom:16px}.pr-block>b{display:block;margin-bottom:6px}.pr-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}.pr-bar button{padding:8px 12px;border-radius:10px;cursor:pointer}.grow{flex:1}
.pr-count{float:right;font-size:calc(14px*var(--fs));color:var(--accent)}
.pr-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.pr-grid label{display:grid;gap:6px;color:var(--muted);font-size:calc(13px*var(--fs));font-weight:700}.pr-grid select,.pr-grid input{width:100%;min-width:0;padding:10px;border:1px solid var(--line);border-radius:11px;background:var(--panel);color:var(--text)}
/* phiên học */
.sess-head{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;padding:12px 16px}.sess-head button{padding:7px 12px;border-radius:10px;cursor:pointer}#sessCount{color:var(--muted);font-size:calc(13px*var(--fs))}#sessTimer{font-weight:800;color:var(--accent)}
.sess-track{height:7px;margin:10px 4px;border-radius:99px;background:color-mix(in srgb,var(--accent) 10%,var(--panel));overflow:hidden}.sess-track span{display:block;height:100%;width:0;background:var(--accent);transition:.2s}
.sess-card{max-width:860px;margin:0 auto;padding:28px;text-align:center}
.q-sub{color:var(--muted);font-size:calc(13px*var(--fs));margin:6px 0}.q-nudge{color:var(--bad);font-weight:700;min-height:18px;margin-top:8px}
.q-choices{display:grid;gap:8px;max-width:620px;margin:10px auto 0}
.q-choice{position:relative;padding:12px 14px 12px 38px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--text);text-align:left;font-size:calc(16px*var(--fs));cursor:pointer;line-height:1.4}
.q-choice small{position:absolute;left:12px;top:12px;color:var(--muted);font-size:calc(12px*var(--fs));font-weight:800}
.q-choice.right{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,var(--panel))}.q-choice.wrong{border-color:var(--bad);background:color-mix(in srgb,var(--bad) 10%,var(--panel))}
/* Che chữ · gõ đủ từ (study.js maskWord): ô trống = một chữ bị che; sau khi trả lời hiện lại chữ đã che */
.mask-word{font-family:"Noto Serif",Georgia,"Times New Roman",serif;font-size:calc(clamp(34px,7vw,60px)*var(--fs-big));line-height:1.2;color:var(--accent);letter-spacing:.02em;word-break:break-word}
.mask-word .mk-gap{display:inline-block;width:.58em;height:.82em;margin:0 .05em;vertical-align:-.08em;border:2px dashed color-mix(in srgb,var(--accent2) 70%,transparent);border-radius:6px;background:color-mix(in srgb,var(--accent2) 10%,transparent)}
.mask-word .mk-open{color:var(--accent2);text-decoration:underline dotted;text-underline-offset:.14em;text-decoration-thickness:2px}
.mask-word .mk-fill{padding:0 .04em;border-radius:6px;background:color-mix(in srgb,var(--ok) 18%,transparent);color:color-mix(in srgb,var(--ok) 80%,var(--text))}
.mask-word.bad .mk-fill{background:color-mix(in srgb,var(--bad) 16%,transparent);color:color-mix(in srgb,var(--bad) 85%,var(--text))}
#mkInfo small{display:block;margin-top:2px;font-size:.92em}
.mask-mean{max-width:650px;margin:10px auto 0;font-size:calc(clamp(18px,3vw,24px)*var(--fs-big));font-weight:700;line-height:1.35}
.sent-q{font-family:"Noto Serif",Georgia,"Times New Roman",serif;font-size:calc(clamp(20px,3.4vw,27px)*var(--fs-big));line-height:1.6;max-width:760px;margin:6px auto 0}
.sent-q mark,.sent-pali mark{background:color-mix(in srgb,var(--accent) 18%,transparent);color:var(--accent);border-radius:4px;padding:0 3px;font-weight:700}
.sent-input{font-size:calc(16px*var(--fs));text-align:left;resize:vertical;font-family:inherit}
.q-result{text-align:left;margin-top:6px}.q-result .feedback{margin:14px auto 0}
.feedback.self-fb{background:color-mix(in srgb,var(--accent2) 8%,transparent);border:1px solid var(--line)}
.rate-bar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-width:700px;margin:16px auto 0}
.rate{display:flex;flex-direction:column;align-items:center;gap:3px;padding:11px 6px;border-radius:12px;border:1px solid var(--line);background:var(--panel);cursor:pointer;font-weight:800}
.rate small{color:var(--muted);font-weight:600}.rate.r1{color:var(--bad)}.rate.r2{color:#a3701f}.rate.r3{color:var(--ok)}.rate.r4{color:#6b3fa0}
.rate.sugg{outline:3px solid color-mix(in srgb,var(--accent) 40%,transparent)}
body.dark .rate.r4{color:#c7a6ef}body.dark .rate.r2{color:#e0b36a}
.sess-end{padding:26px 10px;text-align:center}.sess-end-icon{font-size:calc(56px*var(--fs-big))}.sess-end h2{color:var(--accent);margin:8px 0}
/* chi tiết thẻ */
.study-detail{max-width:760px;margin:14px auto 0;text-align:left}
.sd-head{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;margin-bottom:10px}.sd-word{font-size:calc(30px*var(--fs-big));color:var(--accent)}.sd-meaning{font-size:calc(19px*var(--fs));font-weight:700}
.pali-v{font-family:"Noto Serif",Georgia,"Times New Roman",serif}
.gram-links{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:12px;font-size:calc(13px*var(--fs));color:var(--muted)}
.gram-link{padding:6px 11px;border-radius:999px;border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));background:color-mix(in srgb,var(--accent) 7%,var(--panel));color:var(--accent);font-weight:700;cursor:pointer}
.sent-box{margin-top:12px;padding:12px 14px;border-left:3px solid var(--accent2);border-radius:10px;background:color-mix(in srgb,var(--accent2) 7%,transparent)}.sent-box .k{font-size:calc(11px*var(--fs));text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:800}
.sent-pali{font-family:"Noto Serif",Georgia,"Times New Roman",serif;font-size:calc(19px*var(--fs));line-height:1.6;margin:6px 0}.sent-tr{margin:4px 0;line-height:1.5}.sent-box small{color:var(--muted)}
.fsrs-line{margin-top:12px;color:var(--muted);font-size:calc(12px*var(--fs));line-height:1.6}
.pali-modal{position:fixed;inset:0;z-index:60;background:rgba(30,20,14,.45);display:flex;align-items:flex-start;justify-content:center;padding:26px 12px;overflow:auto}
.pali-modal-box{max-width:820px;width:100%;padding:18px}.pali-modal-x{float:right;padding:7px 12px;border-radius:10px;cursor:pointer}
.pali-toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:70;background:var(--text);color:var(--panel);padding:10px 16px;border-radius:12px;font-weight:700}
.theory-next{grid-column:1/-1;display:flex;justify-content:center;padding:6px 0 4px;color:var(--muted)}.theory-next button{padding:12px 18px;border-radius:12px;cursor:pointer;font-weight:700}
/* admin */
.admin-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 14px}
.af-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:6px}.af{display:grid;gap:6px;color:var(--muted);font-size:calc(13px*var(--fs));font-weight:700}.af.full{grid-column:1/-1}
.af input,.af textarea{width:100%;min-width:0;padding:10px;border:1px solid var(--line);border-radius:11px;background:var(--panel);color:var(--text);font:inherit}.af .pali-input,.af textarea.pali-input{font-family:"Noto Serif",Georgia,"Times New Roman",serif;font-size:calc(18px*var(--fs))}
.af-more{margin-top:12px;padding:8px 12px;border:1px dashed var(--line);border-radius:12px}.af-more summary{cursor:pointer;font-weight:700;color:var(--muted)}
.dup-warn{margin:12px 0;padding:12px 14px;border-radius:12px;border:1px solid #d8b56a;background:color-mix(in srgb,#d8b56a 14%,var(--panel));line-height:1.6}.dup-row{margin:6px 0}.dup-row button{padding:4px 10px;border-radius:8px;cursor:pointer}
.editing{margin-bottom:10px;padding:9px 12px;border-radius:12px;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));background:color-mix(in srgb,var(--accent) 6%,var(--panel))}.editing button{padding:4px 10px;border-radius:8px;cursor:pointer;margin-left:8px}
.bank-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:6px}.bank-filters label{display:grid;gap:5px;color:var(--muted);font-size:calc(13px*var(--fs));font-weight:700;min-width:140px}.bank-filters select,.bank-filters input{padding:9px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text)}
.bank-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);line-height:1.5}.bank-row small{color:var(--muted)}.bank-row .pali-v{font-size:calc(18px*var(--fs));color:var(--accent)}
.bank-acts{display:flex;flex-wrap:wrap;gap:5px;justify-content:flex-end}.bank-acts button{padding:6px 10px;border-radius:9px;cursor:pointer;font-size:calc(13px*var(--fs))}
.st{display:inline-block;margin-left:4px;padding:1px 7px;border-radius:999px;font-size:calc(11px*var(--fs));font-weight:700;background:color-mix(in srgb,var(--accent2) 10%,var(--panel));color:var(--muted)}.st-ok{color:var(--ok)}.st-due{color:#a3701f}.st-weak{color:var(--bad)}
.file-btn{display:inline-block;padding:11px 17px;border-radius:12px;cursor:pointer}
@media(max-width:900px){.study-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.entry-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.af-grid{grid-template-columns:1fr}.pr-grid{grid-template-columns:1fr}.rate-bar{grid-template-columns:repeat(2,minmax(0,1fr))}.lp-row{grid-template-columns:92px 1fr 44px}.lp-row small{display:none}.sess-card{padding:20px 14px}.bank-row{grid-template-columns:1fr}.bank-acts{justify-content:flex-start}}
/* Sửa lỗi có sẵn: thẻ lý thuyết không co trên điện thoại (bảng rộng làm tràn ngang cả trang). Bảng vẫn cuộn ngang trong khung riêng. */
.theory-content>*{min-width:0}

.more-sents{margin-top:10px;border:1px dashed var(--line);border-radius:12px;padding:8px 12px}.more-sents summary{cursor:pointer;font-weight:700;color:var(--muted)}.more-sents .sent-box{margin-top:8px}

/* ===== Hai lộ trình bài học + Pāḷi Trung cấp Phật học (trungcap-theory.js) ===== */
.theory-hero:has(.theory-track){flex-wrap:wrap;align-items:flex-start}
.theory-switcher:has(.theory-track){flex:1 1 100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}
.theory-track{border:1px solid var(--line);border-radius:16px;padding:12px 14px;background:color-mix(in srgb,var(--panel) 70%,transparent)}
.theory-track.active{border-color:var(--accent2);box-shadow:inset 0 0 0 1px var(--accent2)}
.theory-track-head{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.theory-track-icon{font-size:calc(24px*var(--fs-big));line-height:1}
.theory-track-head b{display:block;color:var(--accent);font-size:calc(15px*var(--fs))}
.theory-track-head small{display:block;color:var(--muted);font-size:calc(12px*var(--fs));margin-top:2px}
/* Ô chọn bài sổ xuống (app.js renderTheoryButtons): mỗi lộ trình một ô Bài học, Trung cấp thêm ô Bài tập */
.theory-pick{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 10px;align-items:center;padding:4px 0;color:var(--muted);font-weight:800;font-size:calc(12.5px*var(--fs))}
.theory-pick>span{white-space:nowrap}
.theory-pick+.theory-pick,.theory-track-next+.theory-pick{border-top:1px dashed var(--line);margin-top:6px;padding-top:10px}
.theory-pick select{width:100%;min-width:0;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--panel);color:var(--text);font-weight:700;font-size:calc(14px*var(--fs));outline:none;cursor:pointer;text-overflow:ellipsis}
.theory-pick select:hover{border-color:var(--accent2)}
.theory-pick select:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent)}
.theory-track.active [data-theory-select]{border-color:var(--accent2);color:var(--accent)}
.theory-track-next{margin:4px 0 0;color:var(--muted);font-size:calc(12px*var(--fs))}
@media(max-width:520px){.theory-pick{grid-template-columns:1fr}}
/* Hàng mục con của tab Ngữ pháp */
.gram-nav{margin:-8px 0 16px;padding:8px 10px;border:1px dashed var(--line);border-radius:16px;background:color-mix(in srgb,var(--accent) 5%,var(--panel))}
.gram-nav .tab{font-size:calc(14px*var(--fs))}
@media(max-width:600px){.gram-nav{gap:6px;padding:7px 8px;flex-wrap:nowrap}.gram-nav .tab{flex:1 1 0;min-width:0;padding:7px 6px;font-size:calc(13px*var(--fs));white-space:nowrap;text-align:center}.gram-nav .gn-x{display:none}}
.theory-source{grid-column:1/-1;color:var(--muted);font-size:calc(13px*var(--fs));font-style:italic;padding:0 4px}
.lesson-track-label{flex-basis:100%;margin:6px 0 0;padding:0;border:0;background:none;color:var(--accent);font:inherit;font-size:calc(12px*var(--fs));font-weight:800;text-align:left;cursor:default}
button.lesson-track-label{cursor:pointer}button.lesson-track-label:hover{text-decoration:underline}
.lesson-checks>.lesson-track-label:first-child,.lesson-checks>.lesson-check:first-child+.lesson-track-label{margin-top:2px}
/* Bộ lọc Thẻ nhớ · Danh sách: khung chọn bài trải hết chiều ngang, Loại + Tìm nhanh xuống hàng dưới */
.control-row:has(>.lesson-picker){grid-template-columns:minmax(0,.7fr) minmax(0,1.6fr)}
.control-row>.lesson-picker{grid-column:1/-1}
@media(max-width:760px){.control-row:has(>.lesson-picker){grid-template-columns:1fr}}
/* Tiến độ theo bài (study.js renderHome): mỗi giáo trình một mục sổ xuống, dòng tóm tắt = tiến độ chung */
.lp-group{border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--panel) 70%,transparent)}
.lp-group+.lp-group{margin-top:8px}
.lp-group[open]{border-color:var(--accent2)}
.lp-sum{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(90px,1fr) 52px 64px 16px;gap:10px;align-items:center;padding:11px 12px;cursor:pointer;list-style:none;border-radius:14px}
.lp-sum::-webkit-details-marker{display:none}
.lp-sum::after{content:'▾';color:var(--muted);text-align:center;transition:transform .2s}
.lp-group[open]>.lp-sum::after{transform:rotate(180deg)}
.lp-sum:hover{background:color-mix(in srgb,var(--accent) 5%,transparent)}
.lp-sum>span:nth-child(3){font-weight:800;text-align:right}.lp-sum>small{color:var(--muted);text-align:right}
.lp-name{min-width:0;color:var(--accent);font-size:calc(14px*var(--fs))}
.lp-name small{display:block;color:var(--muted);font-weight:600;font-size:calc(12px*var(--fs));margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-group>.lp-list{padding:6px 4px 8px;border-top:1px dashed var(--line);grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));column-gap:14px}
.lp-empty{margin:0;padding:10px 12px 12px;color:var(--muted);font-size:calc(13px*var(--fs));line-height:1.5}.lp-group>.lp-empty{border-top:1px dashed var(--line)}
/* Ba tính */
.tc-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0}
.tc-g{--g:#2f5f9a;border:1px solid color-mix(in srgb,var(--g) 40%,transparent);border-top:4px solid var(--g);border-radius:12px;padding:10px 11px;background:color-mix(in srgb,var(--g) 7%,var(--panel))}
.tc-g.f{--g:#b0456f}.tc-g.n{--g:#3d7d4f}
body.dark .tc-g{--g:#7fa7dd}body.dark .tc-g.f{--g:#e08aaa}body.dark .tc-g.n{--g:#86c79a}
.tc-g b{display:block;color:var(--g);font-size:calc(15px*var(--fs))}
.tc-g small{display:block;color:var(--muted);font-size:calc(12px*var(--fs));margin-bottom:6px}
.tc-g span{display:block;font-size:calc(13px*var(--fs));line-height:1.55}
/* Chip số đếm */
.tc-chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.tc-chips span{padding:6px 10px;border:1px solid var(--line);border-radius:999px;font-size:calc(13px*var(--fs));background:var(--panel)}
.tc-chips i{color:var(--accent);font-weight:700;margin-right:4px}
/* Bảy vĩ ngữ */
.tc-endings{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin:12px 0}
.tc-endings>div{border:1px solid var(--line);border-radius:12px;padding:9px 4px;text-align:center;background:var(--panel)}
.tc-endings>div.l{background:color-mix(in srgb,var(--accent) 7%,var(--panel));border-color:color-mix(in srgb,var(--accent) 35%,var(--line))}
.tc-endings>div.o{border-style:dashed}
.tc-endings b{display:block;font-size:calc(24px*var(--fs-big));line-height:1.1;color:var(--accent);font-family:"Noto Serif",Georgia,serif}
.tc-endings i{display:block;font-size:calc(13px*var(--fs));margin-top:4px}
.tc-endings small{display:block;font-size:calc(11px*var(--fs));color:var(--muted);line-height:1.3}
/* Câu mẫu + bảng biến cách */
.tc-sentence{border-left:4px solid var(--accent);background:color-mix(in srgb,var(--accent) 6%,var(--panel));border-radius:10px;padding:12px 14px;margin:6px 0 12px}
.tc-sentence i{display:block;font-size:calc(19px*var(--fs));color:var(--accent);font-family:"Noto Serif",Georgia,serif}
.tc-sentence small{display:block;color:var(--muted);font-size:calc(13px*var(--fs));margin-top:5px}
.tc-decl td:not(:first-child){font-size:calc(16px*var(--fs));font-family:"Noto Serif",Georgia,serif}
.tc-decl td b{color:var(--accent)}
.theory-table.tc-decl{min-width:0}
/* Trung cấp · Bài 2: bảng chia động từ 2 cột, ô phân tích từng từ, hình minh hoạ SVG */
.tc-2col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:10px 0}
.tc-cap{font-weight:800;color:var(--accent);margin:0 0 6px}
.tc-conj td small{display:block;font-family:"Segoe UI",Arial,sans-serif;font-size:calc(12px*var(--fs));color:var(--muted);font-weight:400;margin-top:2px}
.tc-words{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0}
.tc-words>div{display:flex;flex-direction:column;gap:2px;border:1px solid var(--line);border-radius:12px;padding:10px;text-align:center;background:var(--panel)}
.tc-words>div.hl{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--panel))}
.tc-words b{font-family:"Noto Serif",Georgia,serif;font-style:italic;font-size:calc(19px*var(--fs));color:var(--accent)}
.tc-words span{font-size:calc(14px*var(--fs))}.tc-words small{color:var(--muted);font-size:calc(12px*var(--fs))}
.tc-fig{--out:#2f5f9a;--in:#3d7d4f;margin:14px 0 10px}
body.dark .tc-fig{--out:#7fa7dd;--in:#86c79a}
.tc-fig-wrap{overflow-x:auto}
.tc-fig svg{display:block;width:100%;max-width:720px;height:auto;margin:0 auto}
.tc-fig figcaption{text-align:center;color:var(--muted);font-size:calc(13px*var(--fs));line-height:1.5;margin-top:6px}
.tcf-h{font-size:15px;font-weight:800;letter-spacing:.05em}.tcf-s{font-size:16px}.tcf-xs{font-size:14px}
.tcf-p{font-family:"Noto Serif",Georgia,serif;font-style:italic;font-weight:700;font-size:19px}.tcf-pb{font-size:17.5px}
.tcf-t{fill:var(--text)}.tcf-m{fill:var(--muted)}.tcf-out-f{fill:var(--out)}.tcf-in-f{fill:var(--in)}.tcf-mut-f{fill:var(--muted)}
.tcf-out,.tcf-in{stroke-width:4;stroke-linecap:round}.tcf-out{stroke:var(--out)}.tcf-in{stroke:var(--in)}
.tcf-center{fill:color-mix(in srgb,var(--accent) 9%,var(--panel));stroke:var(--accent);stroke-width:2.5;stroke-dasharray:6 5}
.tcf-bub{fill:var(--panel);stroke-width:2.2;stroke-linejoin:round}.tcf-bub.out{stroke:var(--out)}.tcf-bub.in{stroke:var(--in)}
.tcf-cover{stroke:var(--panel);stroke-width:4}
.tcf-ground{stroke:var(--line);stroke-width:3}
.tcf-wall{fill:var(--panel);stroke:var(--muted);stroke-width:2}.tcf-roof{fill:var(--accent2)}.tcf-door{fill:var(--muted)}.tcf-pole{stroke:var(--accent2);stroke-width:3}
.tcf-skin{fill:#e0b08a}.tcf-wife{fill:#b0456f}.tcf-robe{fill:#c8862a}.tcf-walker{fill:var(--accent)}
.tcf-leg{stroke:var(--accent);stroke-width:5;stroke-linecap:round}
.tcf-path{stroke:var(--muted);stroke-width:2.5;stroke-dasharray:7 6}
@media(max-width:1000px){.tc-2col{grid-template-columns:1fr}}
@media(max-width:760px){.tc-words{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.tc-fig svg{min-width:540px}.tc-fig figcaption::before{content:"↔ Vuốt ngang để xem hết hình · "}}
/* Tự kiểm tra cuối bài */
.theory-quiz-lead{color:var(--muted);font-size:calc(13px*var(--fs));margin-top:-4px!important}
.tq{padding:12px 0;border-top:1px solid var(--line)}
.tq-q{font-weight:700;line-height:1.55;margin-bottom:8px}
.tq-opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.tq-opt{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:10px;padding:9px 11px;text-align:left;font:inherit;font-size:calc(14px*var(--fs));cursor:pointer}
.tq-opt:hover:not(:disabled){border-color:var(--accent2)}
.tq-opt:disabled{cursor:default}
.tq-opt.ok{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,var(--panel));color:var(--ok);font-weight:700}
.tq-opt.bad{border-color:var(--bad);background:color-mix(in srgb,var(--bad) 10%,var(--panel));color:var(--bad)}
.tq-fb{font-size:calc(13px*var(--fs));line-height:1.55;margin-top:7px}
.tq-fb.ok{color:var(--ok)}.tq-fb.bad{color:var(--bad)}
.tq-score{margin-top:10px;font-weight:800;color:var(--accent)}
@media(max-width:600px){.tc-trio{grid-template-columns:1fr}.tc-endings{grid-template-columns:repeat(4,minmax(0,1fr))}.tq-opts{grid-template-columns:1fr}.lp-sum{grid-template-columns:minmax(0,1fr) 40px 56px 14px;gap:6px 8px}.lp-name{grid-column:1/-1}}
/* ===== Tên trang + tác giả: dòng lộ trình dưới tên, ghi công ở chân trang, hộp "Giới thiệu" ===== */
.brand p.brand-tracks{display:flex;flex-wrap:wrap;gap:2px 14px;margin-top:3px;font-size:calc(13px*var(--fs))}
.brand-tracks small{font-size:calc(12px*var(--fs))}
.siteCredit{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 14px;border-top:1px solid var(--line);margin:14px auto 0;padding-top:14px;max-width:1180px;font-size:calc(13px*var(--fs));color:var(--muted)}
.siteCredit b{color:var(--text)}
.aboutLink{background:none;border:0;padding:0;color:var(--accent);font:inherit;font-weight:800;text-decoration:underline;cursor:pointer}
.aboutDlg{border:1px solid var(--line);border-radius:18px;padding:0;max-width:440px;width:calc(100% - 32px);background:var(--panel);color:var(--text);box-shadow:0 20px 60px rgba(40,28,20,.25)}
.aboutDlg::backdrop{background:rgba(40,28,20,.5)}
.aboutIn{position:relative;padding:24px 22px 20px;text-align:left}
.aboutX{position:absolute;top:12px;right:12px;background:none;border:1px solid var(--line);border-radius:10px;width:32px;height:32px;cursor:pointer;color:var(--muted);font-size:calc(14px*var(--fs))}
.aboutEyebrow{color:var(--accent);font-size:calc(11px*var(--fs));font-weight:800;letter-spacing:.18em}
.aboutName{margin:6px 40px 2px 0;font-size:calc(20px*var(--fs));line-height:1.3;font-family:"Noto Serif",Georgia,serif}
.aboutRole{color:var(--muted);font-size:calc(14px*var(--fs))}
.aboutDlg p.aboutTxt{margin:12px 0;line-height:1.55}
.aboutRow{font-size:calc(14px*var(--fs));color:var(--muted);margin:6px 0;overflow-wrap:anywhere}
.aboutRow a{color:var(--accent);font-weight:700}
.aboutVerse{margin-top:14px;background:color-mix(in srgb,var(--accent) 7%,var(--panel));border-radius:14px;padding:14px 12px;text-align:center;line-height:1.5;font-size:calc(14.5px*var(--fs))}
.aboutVerse p{margin:0 0 10px}.aboutVerse p:last-child{margin:0}
.aboutVerse .pali{display:block;font-family:"Noto Serif",Georgia,serif;color:var(--accent);font-weight:800;letter-spacing:.03em}
.top-actions{display:flex;gap:8px;flex:0 0 auto}
@media(max-width:600px){.top-actions{flex-direction:column;gap:6px}.top-actions .icon-btn{padding:7px 10px}.brand{gap:10px}.site-logo{width:56px;height:40px}.brand p.brand-tracks{font-size:calc(12px*var(--fs))}}

/* ===== Chuyển nhanh giữa 3 trang học: Buddhist English · Hán văn · Pāḷi Phật học ===== */
.siteSwitch{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px;max-width:1180px;margin:0 auto;padding:12px 20px 0;font-size:calc(13px*var(--fs))}
.siteSwitch .ssLabel{color:var(--muted);font-weight:700;margin-right:2px}
.siteSwitch .ssLink{display:inline-flex;align-items:center;gap:6px;padding:5px 12px 5px 5px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--text);text-decoration:none;font-weight:700;line-height:1.2}
.siteSwitch a.ssLink:hover{border-color:var(--accent);color:var(--accent)}
.siteSwitch .ssLink i{font-style:normal;display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 4px;border-radius:999px;background:color-mix(in srgb,var(--accent) 10%,var(--panel));color:var(--accent);font-size:calc(12px*var(--fs));font-weight:900}
.siteSwitch .ssLink.on{background:var(--accent);border-color:var(--accent);color:#fff}
.siteSwitch .ssLink.on i{background:rgba(255,255,255,.22);color:#fff}
body.dark .siteSwitch .ssLink.on{color:#1f1b18}body.dark .siteSwitch .ssLink.on i{color:#1f1b18}
@media(max-width:520px){.siteSwitch{padding:10px 12px 0;gap:4px}.siteSwitch .ssLabel{display:none}.siteSwitch .ssLink{padding:4px 8px 4px 4px;gap:4px;font-size:calc(11.5px*var(--fs))}.siteSwitch .ssLink i{min-width:21px;height:21px;font-size:calc(11px*var(--fs))}}

/* ===== Màn hình đăng nhập (khi đã cấu hình Firebase) ===== */
body.gated main.shell,body.gated footer{display:none}
.auth-gate{max-width:1180px;margin:0 auto;padding:0 20px}
.auth-card{max-width:460px;margin:24px auto 60px;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:var(--shadow)}
.auth-card h2{margin:6px 0 10px;font-family:"Noto Serif",Georgia,serif;color:var(--accent);font-weight:600}
.auth-card p{line-height:1.55;margin:8px 0}
.auth-card>button.primary,.auth-card>button.secondary{width:100%;margin-top:10px;padding:10px 14px;border-radius:11px;cursor:pointer;font-weight:700}
.auth-eyebrow{font-weight:900;color:var(--accent);letter-spacing:.14em;font-size:calc(12px*var(--fs))}
.auth-input{display:block;width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--line);border-radius:11px;background:var(--panel);color:var(--text);font:inherit}
.google-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin-top:12px;background:#fff;color:#1f1f1f;border:1px solid #747775;border-radius:11px;padding:10px 14px;font-weight:700;cursor:pointer;font-size:calc(15px*var(--fs))}
.google-btn:hover{background:#f7f7f7}.google-btn:disabled{opacity:.6;cursor:default}
.google-btn svg{width:20px;height:20px;flex:0 0 auto}
.auth-or{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:calc(13px*var(--fs));margin:16px 0 10px}
.auth-or::before,.auth-or::after{content:"";flex:1;border-top:1px solid var(--line)}
.auth-hint{font-size:calc(12.5px*var(--fs));color:var(--muted);margin-top:10px;line-height:1.45}
.auth-msg{margin-top:8px;color:var(--muted);font-size:calc(14px*var(--fs))}
.auth-warn{background:#fdeee9;border:1px solid #e7b9a8;color:#873d20;border-radius:12px;padding:10px 12px;margin:10px 0 4px;font-size:calc(14px*var(--fs));line-height:1.45}
.auth-warn button{margin-top:8px}
body.dark .auth-warn{background:#3a2622;border-color:#6b4036;color:#f1c3b5}
.auth-credit{border-top:1px solid var(--line);margin-top:16px;padding-top:12px;font-size:calc(13px*var(--fs));color:var(--muted);line-height:1.5;text-align:center}
.auth-credit b{color:var(--text)}.auth-credit .aboutLink{margin-top:4px}
/* Logo ngang hàng với dòng tên "Pāḷi Phật học": cao đúng bằng dòng tiêu đề, canh theo đỉnh khối chữ */
.brand{align-items:flex-start}
.brand h1{line-height:1.25}
.site-logo{height:calc(clamp(26px,4vw,40px)*var(--fs-big)*1.25);width:auto}
/* Nút chọn bài không bị gãy thành 2 dòng ("Bài" / "18") trên điện thoại */
.theory-lesson{white-space:nowrap}
/* ===== Từ của ngày (trang chủ): dùng lại khung chi tiết thẻ + thanh tự đánh giá FSRS ===== */
/* Nền vàng nhạt, viền vàng phát sáng nhịp nhàng + vệt sáng lướt qua; ôn xong thì dịu lại */
.wotd{position:relative;overflow:hidden;padding:14px 20px;margin-bottom:12px;border:2px solid #e2b34f;background:linear-gradient(135deg,#fffaf0 0%,#fff1cf 55%,#ffe7b0 100%);animation:wotdGlow 2.8s ease-in-out infinite}
.wotd::after{content:"";position:absolute;top:0;left:-60%;width:38%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);transform:skewX(-18deg);animation:wotdShine 5s ease-in-out infinite;pointer-events:none}
@keyframes wotdGlow{0%,100%{box-shadow:0 0 8px 1px rgba(226,179,79,.35),var(--shadow)}50%{box-shadow:0 0 0 3px rgba(226,179,79,.28),0 0 26px 8px rgba(226,179,79,.55),var(--shadow)}}
@keyframes wotdShine{0%,72%{left:-60%}100%{left:135%}}
@keyframes wotdTwinkle{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.25) rotate(15deg)}}
.wotd-star{display:inline-block;animation:wotdTwinkle 1.8s ease-in-out infinite}
body.dark .wotd{background:linear-gradient(135deg,#2f271c,#3a2e1a);border-color:#b8913f}
.wotd.done{animation:none;background:var(--panel);border-color:color-mix(in srgb,var(--ok) 35%,var(--line))}.wotd.done::after,.wotd.done .wotd-star{animation:none}.wotd.done::after{display:none}
.wotd-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;margin-top:4px}
.wotd-word{font-size:calc(44px*var(--fs-big));font-weight:700;line-height:1.1;color:var(--accent)}
.wotd-meaning{font-size:calc(20px*var(--fs));font-weight:750}
.wotd-tick{font-size:calc(12px*var(--fs));font-weight:850;color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,var(--panel));border-radius:999px;padding:3px 10px}
.wotd-more{margin-top:6px}.wotd-more>summary{cursor:pointer;font-weight:850;color:var(--accent);list-style:none;display:inline-block;padding:4px 0;font-size:calc(14px*var(--fs))}
.wotd-more>summary::-webkit-details-marker{display:none}.wotd-more>summary::after{content:" ▾"}.wotd-more[open]>summary::after{content:" ▴"}
.wotd-more .sd-head{display:none}
@media(prefers-reduced-motion:reduce){.wotd,.wotd::after,.wotd-star{animation:none}}
.wotd-top{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-bottom:4px}
.wotd-eyebrow{color:var(--accent);font-weight:900;letter-spacing:.12em;font-size:calc(12px*var(--fs))}
.wotd-date{color:var(--muted);font-size:calc(13px*var(--fs))}
.wotd-why{margin-left:auto;padding:3px 10px;border-radius:999px;font-size:calc(12px*var(--fs));font-weight:800;background:color-mix(in srgb,var(--accent2) 10%,var(--panel));color:var(--muted)}
.wotd-why.weak{background:color-mix(in srgb,var(--bad) 12%,var(--panel));color:var(--bad)}
.wotd-why.due{background:color-mix(in srgb,#c47a2c 14%,var(--panel));color:#8a5414}
.wotd-why.fading{background:color-mix(in srgb,#c9a227 16%,var(--panel));color:#7a5c0c}
.wotd-why.new{background:color-mix(in srgb,var(--ok) 12%,var(--panel));color:var(--ok)}
.wotd-why.review{background:color-mix(in srgb,#39749a 12%,var(--panel));color:#2f5f80}
body.dark .wotd-why.due,body.dark .wotd-why.fading{color:#e0b36a}
.wotd .study-detail{max-width:none;margin-top:6px}
.wotd .sd-head{gap:4px 16px;margin-bottom:12px}
.wotd .sd-word{font-size:calc(44px*var(--fs-big));font-weight:700;line-height:1.1}
.wotd .sd-meaning{font-size:calc(20px*var(--fs))}
.wotd-ask{margin:14px 0 0;font-weight:800;text-align:center}
.wotd .rate-bar{margin-top:8px}
.wotd-done{margin-top:12px;padding:10px 14px;border-radius:12px;background:color-mix(in srgb,var(--ok) 12%,var(--panel));color:var(--ok);font-weight:800}
@media(max-width:600px){.wotd{padding:14px}.wotd-why{margin-left:0}
  .wotd .field-grid{grid-template-columns:1fr;gap:0}
  .wotd .field{display:flex;gap:10px;align-items:baseline;border:0;border-bottom:1px dashed var(--line);border-radius:0;padding:7px 2px}
  .wotd .field .k{flex:0 0 31%;margin:0;font-size:calc(10px*var(--fs))}.wotd .field .v{flex:1;min-width:0}
  .wotd-word{font-size:calc(36px*var(--fs-big))}.wotd .sent-pali{font-size:calc(17px*var(--fs))}}

/* ===================== 📝 Bài tập (baitap.js) ===================== */
.bt-hero{padding:22px 24px;margin-bottom:12px}.bt-hero .eyebrow{margin-bottom:8px}
.bt-hero h2{margin:0;color:var(--accent);font-family:"Noto Serif",Georgia,"Times New Roman",serif;font-size:calc(clamp(24px,3.6vw,34px)*var(--fs-big));font-weight:600}
.bt-hero p{max-width:820px;margin:10px 0 0;color:var(--muted);line-height:1.65}
.bt-lessons{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:16px}
.bt-pick-row{display:grid;gap:6px;margin-top:14px;max-width:560px}.bt-pick-row .bt-prog{margin:0 0 0 2px}
.bt-lesson{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--text);text-align:left;cursor:pointer}
.bt-lesson small{color:var(--muted);font-size:calc(12px*var(--fs))}.bt-lesson:hover{border-color:var(--accent)}
.bt-lesson.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--panel));box-shadow:inset 0 0 0 1px var(--accent)}.bt-lesson.active b{color:var(--accent)}
.bt-prog{align-self:stretch;height:6px;margin-top:4px;border-radius:99px;background:color-mix(in srgb,var(--accent) 10%,var(--panel));overflow:hidden}.bt-prog span{display:block;height:100%;background:var(--ok)}
.bt-hint{border-left:3px solid var(--accent2);border-radius:8px;background:color-mix(in srgb,var(--accent2) 8%,transparent);line-height:1.6}
.bt-hint>summary{cursor:pointer;list-style:none;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;padding:10px 13px}
.bt-hint>summary::-webkit-details-marker{display:none}
.bt-hint>summary::after{content:'▾ xem';margin-left:auto;color:var(--muted);font-size:calc(12.5px*var(--fs));white-space:nowrap}
.bt-hint[open]>summary::after{content:'▴ thu gọn'}
.bh-t{font-weight:800}
.bh-sub{color:var(--muted);font-size:calc(13px*var(--fs))}
.bt-hint[open] .bh-sub{display:none}
.bh-list{list-style:none;margin:0;padding:0 13px 13px;display:grid;gap:8px}
.bh-list>li{padding:8px 11px 9px;border:1px solid color-mix(in srgb,var(--accent2) 28%,var(--line));border-radius:10px;background:var(--panel)}
.bh-k{margin-bottom:5px;font-weight:600}
.bh-k b{color:var(--text)}
.bh-row{display:flex;flex-wrap:wrap;gap:5px 6px}
.bh-row+.bh-row{margin-top:5px}
.bh-c{padding:2px 9px;border:1px solid var(--line);border-radius:8px;background:color-mix(in srgb,var(--accent2) 7%,var(--panel))}
.bt-hint i{font-family:"Noto Serif",Georgia,serif;color:var(--accent);font-style:normal;font-weight:700;white-space:nowrap}
.bt-tabs{margin:14px 0 12px}.bt-tabs .tab small{opacity:.75;font-size:calc(12px*var(--fs))}
.bt-bar{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;margin-bottom:12px;color:var(--muted);font-size:calc(14px*var(--fs))}.bt-bar b{color:var(--text)}
.bt-bar button{padding:8px 12px;border-radius:10px;cursor:pointer}
.bt-group-h{margin:16px 0 8px;padding-bottom:4px;border-bottom:1px solid var(--line);color:var(--accent);font-weight:800;font-size:calc(15px*var(--fs))}.bt-group-h small{color:var(--muted);font-weight:700;font-size:calc(12px*var(--fs))}
.bt-bar+.bt-group-h{margin-top:4px}.bt-gloss .bt-group-h{margin:12px 0 2px;font-size:calc(13px*var(--fs))}
.bt-words{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.bt-word{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--text);text-align:left;cursor:pointer;line-height:1.4}
.bt-word:hover{border-color:var(--accent)}.bt-word small{color:var(--muted);font-size:calc(12px*var(--fs))}
.bt-word-top{display:flex;align-items:baseline;justify-content:space-between;gap:6px;width:100%}.bt-word-top b{color:var(--pc,var(--accent));font-size:calc(19px*var(--fs));background:var(--pb,none);border-radius:6px;min-width:var(--pw,0)}
.bt-wrap{position:relative;display:flex;min-width:0}
.tp-homo{display:grid;gap:3px}.tp-homo small,.sd-homo small{color:var(--muted)}
.sd-homo{margin-top:12px;padding:10px 12px;border:1px dashed var(--line);border-radius:12px;text-align:left}
.sd-homo .k{font-size:calc(11px*var(--fs));text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:800;margin-bottom:4px}
.sd-homo ul{margin:0;padding-left:18px;display:grid;gap:2px}
.bt-wrap>.bt-word{flex:1;min-width:0}
.bt-word .bt-mean{color:var(--mc,var(--text));background:var(--mb,none);border-radius:6px}
.bt-vocab.hide-mean .bt-mean{align-self:stretch}
.bt-vocab.hide-pali .bt-wrap{--pc:transparent;--pb:var(--tv-cover);--pw:4.5em}
.bt-vocab.hide-mean .bt-wrap{--mc:transparent;--mb:var(--tv-cover)}
.bt-gloss{margin-top:16px;padding:10px 14px;border:1px dashed var(--line);border-radius:12px}.bt-gloss summary,.bt-gloss-prev summary{cursor:pointer;font-weight:700;color:var(--accent)}
.bt-gloss-prev{margin-top:10px}.bt-gloss-prev summary{color:var(--muted)}
.bt-gloss-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:4px 16px;margin-top:10px}
.bt-g{display:flex;flex-wrap:wrap;gap:0 8px;align-items:baseline;min-width:0;padding:4px 0;border-bottom:1px dotted var(--line);line-height:1.4}.bt-g b{color:var(--accent);flex:0 1 auto;min-width:0;overflow-wrap:anywhere}.bt-g span{color:var(--muted);font-size:calc(13px*var(--fs))}
.bt-chips{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:12px}
.bt-chip{min-width:36px;padding:5px 8px;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--muted);font-weight:700;cursor:pointer}
.bt-chip.ok{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 55%,var(--line));background:color-mix(in srgb,var(--ok) 10%,var(--panel))}
.bt-chip.near{color:#a3701f;border-color:color-mix(in srgb,#a3701f 55%,var(--line));background:color-mix(in srgb,#a3701f 10%,var(--panel))}
.bt-chip.bad{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 55%,var(--line));background:color-mix(in srgb,var(--bad) 9%,var(--panel))}
.bt-chip.cur{outline:2px solid var(--accent);outline-offset:1px;color:var(--text)}
.bt-card{max-width:860px;margin:0 auto;padding:22px 18px;border:1px solid var(--line);border-radius:18px;text-align:center;background:color-mix(in srgb,var(--accent2) 3%,var(--panel))}
.bt-card .sent-q{margin-bottom:8px}.bt-card .feedback{margin:14px auto 0}
.bt-vi{font-size:calc(clamp(21px,3.6vw,29px)*var(--fs-big));font-weight:700;line-height:1.4;max-width:720px;margin:4px auto 10px}
.bt-pali-area{display:block;margin:0 auto;text-align:left;resize:vertical;line-height:1.45}
/* Bảng chia động từ: đại từ nhân xưng dưới mỗi dạng (so, sā, taṃ · tvaṃ · ahaṃ…) */
.verb-pron{margin-top:5px;padding-left:4px;color:var(--muted);font-family:"Noto Serif",Georgia,serif;font-size:calc(14px*var(--fs))}
/* Ảnh "Tám cách Pāḷi" (thơ dễ nhớ) ở trang Danh từ & biến cách */
.tamcach{padding:14px 18px}
.tamcach>summary{cursor:pointer;font-weight:800;color:var(--accent);font-size:calc(16px*var(--fs))}
.tamcach>summary small{color:var(--muted);font-weight:600}
.tamcach-img{display:block;max-width:820px;margin:12px auto 6px;cursor:zoom-in}
.tamcach-img img{display:block;width:100%;height:auto;border-radius:14px;box-shadow:0 6px 20px rgba(120,80,20,.18)}
.tamcach-text{max-width:820px;margin:6px auto 0}
.tamcach-text summary{cursor:pointer;color:var(--muted);font-weight:700;font-size:calc(13.5px*var(--fs))}
.tamcach-text ol{margin:8px 0 0;padding-left:24px;line-height:1.7}
.tamcach-text em{color:#b3261e;font-style:normal;font-weight:700}
body.dark .tamcach-text em{color:#ff9b8f}
.tamcach-note{max-width:820px;margin:10px auto 4px;padding:10px 14px;border-left:4px solid var(--accent);border-radius:10px;background:color-mix(in srgb,var(--accent) 6%,var(--panel));color:var(--text);font-style:italic;line-height:1.65;font-size:calc(14px*var(--fs))}
.tamcach-note b{font-style:normal;color:var(--accent)}
.tamcach-tip{max-width:820px;margin:8px auto 0;color:var(--muted);font-size:calc(13px*var(--fs))}
/* Hàng phím ký tự Pāḷi dùng chung (pali-keys.js); pk-focus: chỉ hiện khi đang gõ trong ô tương ứng */
.pk-bar{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.pk-bar.pk-focus{display:none}.pk-bar.pk-focus.on{display:flex}
.pk-bar button{min-width:38px;padding:5px 7px;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--accent);font-family:"Noto Serif",Georgia,serif;font-size:calc(17px*var(--fs));line-height:1.2;cursor:pointer;touch-action:manipulation}
.pk-bar button:hover{border-color:var(--accent)}
.pk-bar .pk-shift.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.pk-bar.pk-center{justify-content:center}
.pk-note{color:var(--muted);font-size:calc(12.5px*var(--fs));margin:8px 0 0}
.bt-keys{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;margin-top:8px}
.bt-keys button{min-width:40px;padding:6px 8px;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--accent);font-family:"Noto Serif",Georgia,serif;font-size:calc(18px*var(--fs));cursor:pointer}
.bt-ana{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:14px}
.bt-tok{display:flex;flex-direction:column;gap:2px;min-width:118px;max-width:230px;padding:8px 11px;border:1px solid var(--line);border-radius:12px;background:var(--panel);text-align:left;line-height:1.4}
.bt-tok b{color:var(--accent);font-size:calc(18px*var(--fs))}.bt-tok span{font-size:calc(13px*var(--fs))}.bt-tok small{color:var(--muted);font-size:calc(12px*var(--fs))}
.bt-hint-chips{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;align-items:center;margin-top:12px;color:var(--muted);font-size:calc(13px*var(--fs))}
.bt-hint-chips b{padding:4px 10px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--accent);font-size:calc(16px*var(--fs))}
.bt-yours{margin-top:8px;font-family:"Noto Serif",Georgia,serif;font-size:calc(18px*var(--fs));line-height:1.6}
.bt-w{padding:0 2px;border-radius:4px}.bt-w.ok{color:var(--ok)}.bt-w.near{color:#a3701f;text-decoration:underline wavy}.bt-w.bad{color:var(--bad);text-decoration:line-through}
.bt-miss{font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:calc(12px*var(--fs));color:var(--bad);font-weight:700}
.bt-model{margin-top:8px}.bt-model .pali-v{font-size:calc(18px*var(--fs));color:var(--accent);font-weight:700}.bt-model i{color:var(--muted);font-size:calc(13px*var(--fs))}
.bt-nav{margin-top:18px;padding-top:12px;border-top:1px dashed var(--line)}
body.dark .bt-chip.near,body.dark .bt-w.near{color:#e0b36a}
@media(max-width:760px){.bt-lessons{grid-template-columns:repeat(3,minmax(0,1fr))}.bt-hero{padding:18px 16px}.bt-hint i{white-space:normal}}
@media(max-width:480px){.bt-lessons{grid-template-columns:repeat(2,minmax(0,1fr))}.bt-card{padding:16px 10px}.bt-tok{min-width:0;flex:1 1 140px}.bt-bar .grow{display:none}}
/* Giáo trình Quyển 2 (quyen2-theory.js): khung giải thích thêm / dễ nhầm và hình minh hoạ SVG (dùng chung .tc-fig, .tcf-*) */
.q2-tip,.q2-warn{margin-top:12px;padding:12px 14px;border-radius:12px;line-height:1.65}
.q2-tip{background:color-mix(in srgb,#2f5f9a 8%,transparent);border-left:3px solid #2f5f9a}
.q2-warn{background:color-mix(in srgb,#c8862a 11%,transparent);border-left:3px solid #c8862a}
body.dark .q2-tip{border-color:#7fa7dd;background:color-mix(in srgb,#7fa7dd 10%,transparent)}
body.dark .q2-warn{border-color:#e0a95a;background:color-mix(in srgb,#e0a95a 10%,transparent)}
.q2-tip>b:first-child,.q2-warn>b:first-child{display:block;margin-bottom:4px}
.q2-tip p,.q2-warn p{margin:6px 0}.q2-tip ul,.q2-warn ul{margin:6px 0;padding-left:20px}.q2-tip li,.q2-warn li{margin:4px 0}
.q2f-box{fill:var(--panel);stroke:var(--line);stroke-width:2}
.q2f-hl{fill:color-mix(in srgb,var(--accent) 10%,var(--panel));stroke:var(--accent);stroke-width:2.2}
.q2f-a{fill:color-mix(in srgb,var(--out) 12%,var(--panel));stroke:var(--out);stroke-width:2.2}
.q2f-b{fill:color-mix(in srgb,var(--in) 12%,var(--panel));stroke:var(--in);stroke-width:2.2}
.q2f-line{stroke:var(--muted);stroke-width:2;fill:none}
.q2f-arrowhead{fill:var(--muted)}.q2f-acc{fill:var(--accent)}
.q2f-axis{stroke:var(--muted);stroke-width:3}
/* Ảnh minh hoạ vẽ bằng ChatGPT (hinh/q2-*.webp): ảnh không có chữ, chú thích theo số nằm bên dưới */
.q2-photo{margin:14px 0 10px}
.q2-photo img{display:block;width:100%;max-width:760px;height:auto;margin:0 auto;border-radius:14px;border:1px solid var(--line)}
.q2-legend{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;list-style:none;padding:0;margin:10px 0 0;color:var(--text);font-size:calc(13px*var(--fs));line-height:1.45}
.q2-legend li{display:flex;align-items:baseline;gap:6px;margin:0}
.q2-legend b{flex:none;display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#7a302c;color:#fff;font-size:12px;transform:translateY(4px)}
.q2-photo figcaption>p{text-align:center;color:var(--muted);font-size:calc(13px*var(--fs));margin:6px 0 0}
/* Ghi chú riêng cho một đuôi biến cách (declensions.js: {form, note}) */
.declension-form-mark{color:var(--accent);font-weight:800;margin-left:2px}
.declension-form-note{display:block;margin-top:6px;color:var(--muted);font-size:calc(12.5px*var(--fs));line-height:1.45}
/* Bài tập trắc nghiệm cuối bài (app.js · startTheoryQuiz): làm từng câu, thanh tiến độ, xem lại câu sai */
.tq-start{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.tq-start button{padding:11px 16px;border-radius:12px;cursor:pointer;font-weight:700}
.tq-top{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:center;gap:6px 14px;margin-bottom:6px}
.tq-top span{color:var(--ok);font-weight:700}
.tq-bar{height:8px;border-radius:99px;background:color-mix(in srgb,var(--line) 70%,transparent);overflow:hidden}
.tq-bar i{display:block;height:100%;background:var(--accent);border-radius:99px;transition:width .25s}
.tq-nav{margin-top:12px;display:flex;justify-content:flex-end}.tq-nav button{padding:10px 16px;border-radius:12px;cursor:pointer;font-weight:700}
.tq-review{margin-top:10px;display:grid;gap:8px}.tq-review>b{color:var(--bad)}
.tq-rv{border:1px solid var(--line);border-left:3px solid var(--bad);border-radius:10px;padding:10px 12px;line-height:1.55}
.tq-rv .tq-q{margin-bottom:4px}.tq-rv small{display:block;color:var(--muted);margin-top:3px}
/* Thẻ lý thuyết đứng lẻ được kéo ra hết chiều ngang và chia hai cột (app.js · balanceTheoryCards) */
.theory-card.split{column-count:2;column-gap:34px;column-rule:1px dashed var(--line)}
.theory-card.split>h3{column-span:all}
.theory-card.split li,.theory-card.split figure,.theory-card.split .q2-tip,.theory-card.split .q2-warn,.theory-card.split .theory-note,.theory-card.split .theory-example,.theory-card.split .theory-formula,.theory-card.split .theory-table-wrap,.theory-card.split .tc-sentence,.theory-card.split .tc-trio,.theory-card.split .tc-endings{break-inside:avoid}
.theory-card.split>h3+*{margin-top:0}
@media(max-width:760px){.theory-card.split{column-count:1;column-rule:none}}

/* Ba tab trong mỗi bài (app.js renderTheory): 📖 Lý thuyết · ✍️ Bài tập · 📚 Từ vựng */
.theory-content>[hidden]{display:none!important}
.lesson-tabs{grid-column:1/-1;display:flex;gap:6px;padding:6px;background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}
.lesson-tab{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:2px;border:0;background:transparent;color:var(--text);padding:10px 8px;border-radius:11px;cursor:pointer;font-weight:700;font-size:calc(15px*var(--fs));line-height:1.25}
.lesson-tab small{font-weight:600;color:var(--muted);font-size:calc(11.5px*var(--fs))}
.lesson-tab:hover{background:color-mix(in srgb,var(--accent) 8%,transparent)}
.lesson-tab.active{background:var(--accent);color:#fff}
.lesson-tab.active small{color:rgba(255,255,255,.85)}
.tv-bar{display:flex;gap:10px;flex-wrap:wrap;margin:2px 0 16px}
.tv-bar input{flex:1 1 220px;min-width:0;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:transparent;color:var(--text);outline:none}
.tv-bar input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent)}
.tv-bar button{padding:10px 16px;border-radius:12px;cursor:pointer;font-weight:700}
.tv-group+.tv-group{margin-top:18px}
.tv-group h4{margin:0 0 8px;color:var(--accent);font-size:calc(14px*var(--fs))}
.tv-group h4 small{color:var(--muted);font-weight:600;margin-left:3px}
.tv-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px;align-items:start}
.tv-item{position:relative;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--accent) 3%,var(--panel));min-width:0;outline:none}
.tv-head{padding:9px 12px;display:flex;flex-wrap:wrap;align-items:baseline;gap:1px 8px}
.tv-pali{color:var(--pc,var(--accent));font-size:calc(16px*var(--fs))}
.tv-form{color:var(--pc,var(--muted));font-size:calc(13px*var(--fs))}
.tv-mean{flex-basis:100%;color:var(--mc,var(--text));font-size:calc(14px*var(--fs));line-height:1.45}
/* che Pāḷi / che nghĩa: chữ trong suốt trên một dải sọc; rê chuột (điện thoại: chạm) vào từ thì hiện lại */
.tv-pali,.tv-form,.tv-mean{border-radius:6px}
.tv-pali,.tv-form{background:var(--pb,none);min-width:var(--pw,0)}
.tv-mean{background:var(--mb,none)}
.lesson-vocab,.bt-vocab{--tv-cover:repeating-linear-gradient(135deg,color-mix(in srgb,var(--accent) 16%,transparent) 0 6px,color-mix(in srgb,var(--accent) 8%,transparent) 6px 12px)}
.lesson-vocab.hide-pali .tv-item{--pc:transparent;--pb:var(--tv-cover);--pw:4.5em}
.lesson-vocab.hide-mean .tv-item{--mc:transparent;--mb:var(--tv-cover)}
.lesson-vocab .tv-item.open{--pc:initial;--pb:initial;--pw:initial;--mc:initial;--mb:initial}
.tv-hide{display:flex;flex:0 0 auto;border:1px solid var(--line);border-radius:12px;overflow:hidden}
:is(.tv-bar,.bt-bar) .tv-hide button{border:0;border-radius:0;padding:10px 12px;background:transparent;color:var(--muted);white-space:nowrap}
:is(.tv-bar,.bt-bar) .tv-hide button+button{border-left:1px solid var(--line)}
:is(.tv-bar,.bt-bar) .tv-hide button[aria-pressed="true"]{background:color-mix(in srgb,var(--accent) 12%,var(--panel));color:var(--accent)}
.tv-hide i{font-style:normal}
@media(max-width:560px){.tv-hide{flex:1 1 100%}:is(.tv-bar,.bt-bar) .tv-hide button{flex:1 1 0;min-width:0;padding:9px 4px;font-size:calc(13px*var(--fs));white-space:normal;line-height:1.25}.tv-hide i{display:none}}
.tv-tip{margin:-8px 0 14px;color:var(--muted);font-size:calc(12.5px*var(--fs))}
/* máy tính: rê chuột là hiện chi tiết ngay dưới thẻ (đè lên các thẻ bên dưới, không xô lệch lưới) */
@media(hover:hover){
  .tv-tip-t{display:none}
  .lesson-vocab .tv-item:is(:hover,:focus-visible){border-color:var(--accent2);z-index:4;--pc:initial;--pb:initial;--pw:initial;--mc:initial;--mb:initial}
  .tv-item:is(:hover,:focus-visible):has(.tv-pop){border-bottom-left-radius:0;border-bottom-right-radius:0}
  .bt-vocab .bt-wrap:is(:hover,:has(:focus-visible)){z-index:4;--pc:initial;--pb:initial;--pw:initial;--mc:initial;--mb:initial}
  .bt-wrap:is(:hover,:has(:focus-visible))>.bt-word{border-color:var(--accent2)}
  .bt-wrap:is(:hover,:has(:focus-visible)):has(.tv-pop)>.bt-word{border-bottom-left-radius:0;border-bottom-right-radius:0}
  :is(.tv-item,.bt-wrap) .tv-pop{position:absolute;left:-1px;right:-1px;top:100%;visibility:hidden;opacity:0;transition:opacity .12s,visibility .12s;border:1px solid var(--accent2);border-top:1px dashed var(--line);border-radius:0 0 12px 12px;background:color-mix(in srgb,var(--accent) 3%,var(--panel));box-shadow:0 14px 24px rgba(60,25,10,.16)}
  :is(.tv-item:is(:hover,:focus-visible),.bt-wrap:is(:hover,:has(:focus-visible))) .tv-pop{visibility:visible;opacity:1;transition-delay:.05s}
}
/* điện thoại: chạm để mở chi tiết ngay trong lưới */
@media(hover:none){
  .tv-tip-h{display:none}
  .tv-item{cursor:pointer;-webkit-tap-highlight-color:transparent}
  :is(.tv-item,.bt-wrap) .tv-pop{display:none}
  .tv-item.open{border-color:var(--accent2);grid-column:1/-1}
  .tv-item.open .tv-pop{display:grid}
}
:is(.tv-item,.bt-wrap) dl{margin:0;padding:8px 12px 11px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 10px;font-size:calc(13px*var(--fs));line-height:1.5;border-top:1px dashed var(--line)}
:is(.tv-item,.bt-wrap) dt{color:var(--muted);font-weight:700}
/* thẻ hẹp: nhãn nằm trên nội dung cho dễ đọc */
:is(.tv-item,.bt-wrap){container-type:inline-size}
@container (max-width:300px){:is(.tv-item,.bt-wrap) dl{grid-template-columns:minmax(0,1fr);row-gap:1px}:is(.tv-item,.bt-wrap) dd+dt{margin-top:6px}}
:is(.tv-item,.bt-wrap) dd{margin:0;overflow-wrap:anywhere}
.tv-empty{display:grid;gap:6px;text-align:center;padding:28px 16px;border:1px dashed var(--line);border-radius:14px;color:var(--muted);line-height:1.55}
.tv-empty b{color:var(--text);font-size:calc(16px*var(--fs))}
.tv-none{color:var(--muted);text-align:center}
.lesson-tab .lt-name{white-space:nowrap}.lesson-tab .lt-name i{font-style:normal}
@media(max-width:480px){.lesson-tabs{gap:4px;padding:5px}.lesson-tab{padding:8px 4px;font-size:calc(13.5px*var(--fs))}.lesson-tab .lt-name i{display:block;font-size:1.15em;line-height:1.3}}

/* Khung 📘: đối chiếu, bổ sung theo Pāli Hàm Thụ (HT Giác Giới) trong quyen2-theory.js / theory.js */
.q2-pht{margin-top:12px;padding:12px 14px;border-radius:12px;line-height:1.65;background:color-mix(in srgb,#3d7a52 9%,transparent);border-left:3px solid #3d7a52}
body.dark .q2-pht{border-color:#7cc492;background:color-mix(in srgb,#7cc492 10%,transparent)}
.q2-pht>b:first-child{display:block;margin-bottom:4px}
.q2-pht p{margin:6px 0}.q2-pht ul{margin:6px 0;padding-left:20px}.q2-pht li{margin:4px 0}
.q2-pht .tc-chips,.q2-pht .theory-table-wrap{margin:8px 0}
.theory-card.split .q2-pht{break-inside:avoid}

/* Tab 📝 Dịch câu (quyen2-dich.js) — dùng lại khung bt-* của bài tập Trung cấp */
.dich-box .dc-dirs{margin:8px 0 10px}
.dich-box .bt-card{margin-top:10px}
.dc-note{margin-top:8px;font-size:calc(13.5px*var(--fs));color:var(--muted);line-height:1.55}
.dc-hints{display:flex;flex-wrap:wrap;gap:6px 8px;margin-top:8px}
.dc-hints span{border:1px solid var(--line);border-radius:10px;padding:5px 9px;font-size:calc(13px*var(--fs));background:color-mix(in srgb,var(--accent) 3%,var(--panel))}
@media(max-width:480px){.lesson-tab{font-size:calc(12.5px*var(--fs));padding:8px 2px}.lesson-tab .lt-name{white-space:normal;text-align:center}.dich-box .dc-dirs{display:flex;gap:6px}.dich-box .dc-dirs .tab{flex:1;padding:8px 6px}}
/* Quyển 3 — câu tỷ dụ gọn (quyen3-theory.js ex()): chỉ hiện câu Pāḷi, bấm mới mở bản dịch + ghi chú; hai cột trên màn rộng */
.theory-card:has(>.q3-td){display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,400px),1fr));gap:8px 12px;align-items:start}
.theory-card:has(>.q3-td)>h3,.theory-card:has(>.q3-td)>.q3-td-hint{grid-column:1/-1;margin:0}
.q3-td-hint{color:var(--muted);font-size:calc(13px*var(--fs))}
.q3-td{border-left:3px solid var(--accent);background:color-mix(in srgb,var(--accent) 5%,var(--panel));border-radius:10px;padding:8px 12px}
.q3-td[open]{background:color-mix(in srgb,var(--accent) 9%,var(--panel))}
.q3-td summary{cursor:pointer;list-style:none;display:flex;gap:8px;align-items:baseline}
.q3-td summary::-webkit-details-marker{display:none}
.q3-td summary b{flex:0 0 auto;min-width:1.5em;color:var(--muted);font-size:calc(12px*var(--fs))}
.q3-td summary i{min-width:0;overflow-wrap:anywhere;font-family:"Noto Serif",Georgia,serif;font-size:calc(15.5px*var(--fs));line-height:1.5;color:var(--accent)}
.q3-td p,.q3-td small{overflow-wrap:anywhere}
.q3-td p{margin:6px 0 0;line-height:1.55;font-size:calc(14.5px*var(--fs))}
.q3-td small{display:block;margin-top:4px;color:var(--muted);font-size:calc(12.5px*var(--fs));line-height:1.5}

/* ===== Gọn như trang Hán văn (2026-10-29) ===== */
/* banner: nút âm thanh / giao diện ở góc trên (cạnh “Về trang Thừa Tự Pháp”), dòng khẩu hiệu dưới tên trang */
.buddhaTop .btTools{display:flex;gap:4px;margin-right:6px}
.buddhaTop .btTool{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;border:1px solid #ecd9b0;border-radius:999px;background:rgba(255,250,236,.92);box-shadow:0 2px 8px rgba(120,80,20,.12);color:#2d241d;font-size:14px;line-height:1;cursor:pointer}
.buddhaTop .btTool:hover{border-color:#d4a017}
.buddhaTop .btTag{margin-top:7px;font-size:clamp(8px,.85vw,11px);font-weight:800;letter-spacing:.16em;line-height:1.4;color:#8b2b22;text-shadow:0 1px 0 rgba(255,255,255,.85)}
.buddhaTop .btMob .btTag{display:none}
@media(max-width:600px){.buddhaTop .btName .btTag{display:none}.buddhaTop .btMob .btTag{display:block;margin-top:3px;font-size:9.5px;letter-spacing:.1em}}
/* Tổng quan: Ôn tập & luyện tập lên đầu; Thống kê, Lộ trình & tiến độ thu lại, bấm dòng tiêu đề mới mở */
.home-practice h3{margin-bottom:10px}.home-practice .entry-grid{margin:0}
/* 5 ô: Ôn hôm nay, Học mới, Luyện tự do, Ôn nhanh, ✍️ Chữ khuyết */
.home-practice .entry-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:1100px) and (min-width:901px){.home-practice .entry-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.home-practice .entry-grid>*{grid-column:span 2}.home-practice .entry-grid>:nth-child(n+4){grid-column:span 3}}
@media(max-width:900px){.home-practice .entry-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-practice .entry-grid>:last-child{grid-column:1/-1}}
.home-practice+.weak-banner{margin:0 0 12px}
.home-fold{margin-bottom:12px}
.home-fold>summary{display:flex;align-items:center;flex-wrap:wrap;gap:4px 12px;padding:14px 20px;cursor:pointer;list-style:none;user-select:none;border-radius:22px}
.home-fold>summary::-webkit-details-marker{display:none}
.home-fold>summary:hover{background:color-mix(in srgb,var(--accent) 5%,transparent)}
.home-fold>summary h3{margin:0;color:var(--accent);font-size:calc(19px*var(--fs))}
.home-fold .hf-sub{color:var(--muted);font-size:calc(13px*var(--fs))}
.home-fold .hf-hint{margin-left:auto;padding:4px 12px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--accent);font-size:calc(13px*var(--fs));font-weight:800;white-space:nowrap}
.home-fold .hf-hint::after{content:"Xem chi tiết ▾"}.home-fold[open] .hf-hint::after{content:"Thu gọn ▴"}
.home-fold .hf-body{padding:2px 20px 18px}
.home-fold .study-stats{padding:0}
.home-fold h4{margin:16px 0 8px;color:var(--accent)}
.hf-note{margin:0 0 10px;color:var(--muted);font-size:calc(13px*var(--fs))}
/* Luyện tự do, Thẻ nhớ: nút quay lại, mục chọn bài thu gọn theo giáo trình, không tick sẵn */
.mode-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:12px}
.mode-head h3{margin:0;flex:1 1 auto}
.back-btn{padding:7px 12px;border-radius:10px;cursor:pointer;font-weight:700}
.pr-count.need{color:#b9770e}
.pr-how{margin:0 0 14px}
.pr-fill-note{margin:-4px 0 14px;padding:10px 14px;border:1px solid color-mix(in srgb,#e8770c 40%,var(--line));border-radius:12px;background:color-mix(in srgb,#e8770c 8%,var(--panel));line-height:1.5}
.pick-fold{border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--panel) 70%,transparent)}
.pick-fold+.pick-fold{margin-top:8px}
.pick-fold[open]{border-color:var(--accent2)}
.pick-fold>summary{display:flex;align-items:center;flex-wrap:wrap;gap:4px 12px;padding:11px 14px;cursor:pointer;list-style:none;user-select:none;border-radius:14px}
.pick-fold>summary::-webkit-details-marker{display:none}
.pick-fold>summary::after{content:'▾';margin-left:auto;color:var(--muted);transition:transform .2s}
.pick-fold[open]>summary::after{transform:rotate(180deg)}
.pick-fold>summary:hover{background:color-mix(in srgb,var(--accent) 5%,transparent)}
.pick-fold>summary small{color:var(--muted);font-size:calc(12.5px*var(--fs))}.pick-fold>summary small.on{color:var(--accent);font-weight:800}
.pick-body{padding:4px 14px 14px;border-top:1px dashed var(--line)}
.pick-body .pr-bar{margin:8px 0 10px}.pick-body .pr-grid{margin-top:10px}
.pr-more,.flip-pick>.pick-fold{margin-bottom:14px}
#prStart:disabled,#flStart:disabled,.entry-card:disabled{opacity:.5;cursor:default}
.entry-card:disabled:hover{border-color:var(--line)}
.flip-quick{grid-template-columns:repeat(2,minmax(0,1fr));margin:0 0 16px}
.flip-title{color:var(--accent)}
.flip-nav{display:inline-flex;align-items:center;gap:8px}.flip-nav button{padding:5px 11px;border-radius:9px;cursor:pointer}
.flip-ok{color:var(--ok);font-weight:800}
.flip-track{height:6px;margin-bottom:14px;border-radius:99px;background:color-mix(in srgb,var(--accent) 10%,var(--panel));overflow:hidden}.flip-track span{display:block;height:100%;background:var(--ok);transition:width .3s}
.flip-card{min-height:300px;border:1px solid var(--line);border-radius:22px;background:color-mix(in srgb,var(--accent) 3%,var(--panel));box-shadow:var(--shadow)}
.flip-card .study-detail{margin-top:6px}
.flip-run .rate-bar{margin-top:14px}.flip-run .q-sub{text-align:center}
.flip-run kbd,.flip-run .actions kbd{padding:1px 6px;border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;background:var(--panel);font-size:.85em}
.link-btn{padding:0 2px;border:0;background:none;color:var(--accent);font:inherit;font-weight:700;text-decoration:underline;cursor:pointer}
@media(max-width:600px){.home-fold>summary{padding:12px 14px}.home-fold .hf-body{padding:2px 12px 14px}.home-fold .hf-sub{flex-basis:100%;order:3}.flip-quick{grid-template-columns:1fr 1fr}.flip-card{min-height:240px;padding:20px 14px}.mode-head .flip-nav{order:4}}
.flip-card .answer{margin-top:16px;padding-top:14px}.flip-card .meaning{margin-bottom:6px}
.flip-gram{margin:0 0 10px;color:var(--muted);font-size:calc(13.5px*var(--fs))}
.flip-more{width:100%;text-align:left}.flip-more>summary{width:max-content;max-width:100%;margin:0 auto;padding:5px 12px;border:1px solid var(--line);border-radius:999px;color:var(--accent);font-size:calc(13px*var(--fs));font-weight:700;cursor:pointer;list-style:none}
.flip-more>summary::-webkit-details-marker{display:none}.flip-more>summary::after{content:' ▾'}.flip-more[open]>summary::after{content:' ▴'}
.flip-more .sd-head{display:none}
.controls .mode-head h3{color:var(--accent);font-size:calc(18px*var(--fs))}.controls .mode-head h3 small{color:var(--muted);font-weight:500;font-size:calc(13px*var(--fs))}
.lesson-checks>.lp-fold{flex-basis:100%;margin-top:6px}.lp-fold+.lp-fold{margin-top:6px}.lp-fold>summary{padding:9px 12px}.lp-fold .pick-body{padding-top:10px}
.gram-nav .gn-back{font-weight:700;color:var(--accent)}@media(max-width:600px){.gram-nav{gap:4px;padding:6px}.gram-nav .tab{padding:7px 3px;font-size:calc(12.5px*var(--fs))}.gram-nav .gn-back{flex:0 0 auto;padding:7px 8px}}

/* ===== 🎲 Trò chơi Pāḷi (games.js) — đồ họa: trời bình minh nơi chùa, bánh xe Pháp, bảo tháp, bồ-đề, sen ===== */
/* ô giới thiệu ở Tổng quan */
.gm-promo{position:relative;overflow:hidden;isolation:isolate;display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-bottom:12px;padding:20px 24px;border:0;color:#fbe9d2;background:radial-gradient(circle at 86% 64%,rgba(255,214,120,.55),transparent 34%),linear-gradient(120deg,#2b0f1d 0%,#6e1c1a 42%,#c45c16 82%,#eea33a 100%);box-shadow:0 14px 30px rgba(110,40,10,.28)}
.gm-promo::before{content:"";position:absolute;right:-60px;bottom:-120px;z-index:-1;width:380px;height:380px;border-radius:50%;background:repeating-conic-gradient(rgba(255,226,150,.16) 0 6deg,transparent 6deg 18deg);animation:pzSpin 70s linear infinite}
.gm-promo .gp-text{flex:1 1 360px;min-width:0}
.gp-eyebrow{display:inline-block;padding:3px 12px;border-radius:999px;background:rgba(255,232,170,.15);border:1px solid rgba(255,220,140,.45);color:#ffdd94;font-size:calc(12px*var(--fs));font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.gm-promo h3{margin:8px 0 6px;color:#ffe6a0;font-family:"Noto Serif",Georgia,serif;font-size:calc(28px*var(--fs-big));text-shadow:0 2px 12px rgba(0,0,0,.4)}
.gm-promo p{margin:0 0 14px;line-height:1.55;color:#fbe3cf}
.gp-btns{display:flex;flex-wrap:wrap;gap:8px}.gp-btns button{padding:8px 14px;border-radius:999px;cursor:pointer;font-weight:800}
.gm-promo .gp-btns .primary{border:0;background:linear-gradient(180deg,#f8d36a,#e09a1a);color:#4a2504;box-shadow:0 3px 0 #9a5a0a,0 8px 16px rgba(0,0,0,.25)}
.gm-promo .gp-btns .secondary{border:1px solid rgba(255,220,150,.5);background:rgba(255,240,210,.12);color:#ffeccc}
.gm-promo .gp-btns .secondary:hover{background:rgba(255,240,210,.24)}
.gp-art{position:relative;flex:0 0 auto;display:grid;place-items:center;width:124px;height:124px;margin-left:auto;border-radius:50%;background:radial-gradient(circle,rgba(255,240,190,.95) 0,rgba(255,196,100,.45) 45%,transparent 70%)}
.gp-art span{font-size:66px;line-height:1;color:#ffe08a;text-shadow:0 0 18px rgba(255,210,100,.95);animation:pzSpin 24s linear infinite}

/* bảng màu riêng của trò chơi (sáng / tối) */
.pz{--ink:#3b2418;--muted:#7a5b45;--paper:#fffaf0;--paper2:#fcefd6;--line:#ecd3a4;--gold:#c9971a;--maroon:#7a1f1a;--saffron:#d97706;--okc:#2e7d4f;--badc:#b23a2e;color:var(--ink)}
body.dark .pz{--ink:#f4e6cc;--muted:#cdb393;--paper:#2b1a14;--paper2:#38221a;--line:#5c3b28;--gold:#e3b94a;--maroon:#f2b39c;--saffron:#f3a43a;--okc:#7fd3a0;--badc:#f08a7c}
.pz .pali-v{font-family:"Noto Serif",Georgia,serif}
.pz .grow{flex:1}
/* trang chính: trời bình minh */
.pz-hero{position:relative;overflow:hidden;isolation:isolate;min-height:270px;padding:20px 22px 124px;border-radius:26px;color:#fff6e2;background:linear-gradient(180deg,#1d0b1f 0%,#4a1430 28%,#8f2a1d 56%,#df781c 82%,#f7c25a 100%);box-shadow:0 16px 36px rgba(90,30,10,.28)}
.pz-hero-txt{position:relative;z-index:4;max-width:600px}
.pz-kicker{display:inline-block;margin-top:12px;padding:3px 12px;border-radius:999px;background:rgba(255,232,170,.15);border:1px solid rgba(255,220,140,.45);color:#ffe0a0;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.pz-hero h2{margin:8px 0 6px;color:#ffe9a8;font-family:"Noto Serif",Georgia,serif;font-size:clamp(30px,5.2vw,46px);line-height:1.1;text-shadow:0 2px 14px rgba(0,0,0,.45)}
.pz-hero p{margin:0;max-width:540px;color:#fbe7d3;line-height:1.55;text-shadow:0 1px 8px rgba(0,0,0,.4)}.pz-hero p b{color:#ffe49a}
.pz-stars{position:absolute;inset:0;z-index:0;pointer-events:none}
.pz-stars i{position:absolute;border-radius:50%;background:#fff;animation:pzTw 3.4s ease-in-out infinite}
@keyframes pzTw{0%,100%{opacity:.2;transform:scale(.8)}50%{opacity:1;transform:scale(1.3)}}
.pz-sun{position:absolute;z-index:1;right:8%;bottom:30px;display:grid;place-items:center;width:156px;height:156px;border-radius:50%;background:radial-gradient(circle,rgba(255,244,200,.98) 0,rgba(255,206,120,.6) 40%,rgba(255,160,60,0) 70%)}
.pz-sun::before{content:"";position:absolute;inset:-70px;border-radius:50%;background:repeating-conic-gradient(rgba(255,230,160,.26) 0 5deg,transparent 5deg 16deg);-webkit-mask:radial-gradient(circle,#000 28%,transparent 68%);mask:radial-gradient(circle,#000 28%,transparent 68%);animation:pzSpin 80s linear infinite}
.pz-wheel{position:relative;width:98px;height:98px;filter:drop-shadow(0 0 12px rgba(255,214,120,.85));animation:pzSpin 26s linear infinite}
@keyframes pzSpin{to{transform:rotate(360deg)}}
.pz-ground{position:absolute;left:0;bottom:0;z-index:2;width:100%;height:48px}.pz-stupa{position:absolute;z-index:2;right:27%;bottom:26px;width:62px;height:auto}.pz-tree{position:absolute;z-index:2;left:3%;bottom:24px;width:118px;height:auto}
.pz-leaves{position:absolute;inset:0;z-index:3;pointer-events:none}
.pz-leaves i{position:absolute;top:-26px;width:15px;height:19px;border-radius:0 80% 0 80%;background:linear-gradient(135deg,#a9da86,#4f8a3a);opacity:0;animation:pzLeaf 14s linear infinite}
@keyframes pzLeaf{0%{transform:translate(0,0) rotate(0);opacity:0}10%{opacity:.9}50%{transform:translate(46px,150px) rotate(170deg)}100%{transform:translate(-24px,320px) rotate(350deg);opacity:0}}
.pz-back{position:relative;z-index:5;padding:6px 13px;border:1px solid rgba(255,225,160,.55);border-radius:999px;background:rgba(40,10,10,.35);color:#ffe9b8;font:inherit;font-weight:800;cursor:pointer}
.pz-back:hover{background:rgba(255,215,120,.24)}
.pz-tools{position:relative;z-index:6;display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin:-30px 16px 8px;padding:12px 16px;border:1px solid var(--line);border-radius:18px;background:var(--paper);box-shadow:0 10px 24px rgba(90,40,10,.16)}
.pz-src{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-weight:800;color:var(--maroon)}
.pz-src select{min-width:0;max-width:100%;padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:var(--paper2);color:var(--ink);font:inherit;font-weight:700}
.pz-src small{color:var(--muted);font-weight:500}
.gm-snd{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.gm-snd small{flex:1 1 240px;color:var(--muted);font-size:calc(12.5px*var(--fs))}
.gm-snd.off [data-gm-snd-toggle]{border-color:var(--badc);color:var(--badc)}
.pz-sec{display:flex;align-items:center;gap:10px;margin:22px 4px 12px;color:var(--maroon);font-family:"Noto Serif",Georgia,serif;font-size:calc(21px*var(--fs))}
.pz-sec>span{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:50%;font-size:19px;background:radial-gradient(circle,#fff4cc,#f3c14d);box-shadow:0 0 0 3px rgba(212,160,23,.28)}
.pz-sec small{color:var(--muted);font-family:system-ui,sans-serif;font-size:calc(13px*var(--fs));font-weight:500}
.pz-sec::after{content:"";flex:1;min-width:30px;height:2px;background:linear-gradient(90deg,#d4a017,transparent)}
.pz-menu{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.pz-card{position:relative;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:20px 16px 14px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(170deg,color-mix(in srgb,var(--c) 15%,var(--paper)) 0%,var(--paper) 58%);color:var(--ink);font:inherit;text-align:left;cursor:pointer;box-shadow:0 6px 16px rgba(90,40,10,.10);transition:transform .2s,box-shadow .2s}
.pz-card::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(90deg,var(--c),#f4c24c)}
.pz-card::after{content:attr(data-word);position:absolute;right:-6px;bottom:-12px;z-index:-1;color:color-mix(in srgb,var(--c) 16%,transparent);font-family:"Noto Serif",Georgia,serif;font-size:48px;font-style:italic;font-weight:700;white-space:nowrap;pointer-events:none}
.pz-card:hover{transform:translateY(-5px);box-shadow:0 16px 30px color-mix(in srgb,var(--c) 30%,transparent)}
.pz-medal{display:grid;place-items:center;flex:none;width:56px;height:56px;border-radius:50%;font-size:28px;background:radial-gradient(circle at 35% 30%,#fff,color-mix(in srgb,var(--c) 30%,#fff) 58%,color-mix(in srgb,var(--c) 75%,#000) 100%);box-shadow:0 0 0 3px #f4d27a,0 0 0 6px color-mix(in srgb,var(--c) 28%,transparent),0 6px 14px rgba(0,0,0,.18)}
.pz-card:hover .pz-medal{animation:pzBob .8s ease-in-out infinite alternate}
@keyframes pzBob{to{transform:translateY(-3px) rotate(-7deg)}}
.pz-card b{margin-top:8px;color:color-mix(in srgb,var(--c) 68%,var(--ink));font-family:"Noto Serif",Georgia,serif;font-size:calc(18.5px*var(--fs))}
.pz-desc{flex:1;color:var(--muted);font-size:calc(13px*var(--fs));line-height:1.5}
.pz-card small{margin-top:4px;padding:3px 11px;border-radius:999px;background:color-mix(in srgb,var(--c) 13%,var(--paper));color:color-mix(in srgb,var(--c) 75%,var(--ink));font-size:calc(12px*var(--fs));font-weight:800}
.pz-note{margin:16px 4px 0;color:var(--muted);font-size:calc(13px*var(--fs))}
/* khung một trò */
.pz-stage{overflow:hidden;border:1px solid var(--line);border-radius:24px;background:var(--paper);box-shadow:0 14px 30px rgba(90,40,10,.16)}
.pz-band{position:relative;overflow:hidden;isolation:isolate;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:14px 18px;color:#fff3d6;background:linear-gradient(115deg,#2f0d1a 0%,#7a1f1a 46%,color-mix(in srgb,var(--c) 65%,#df781c) 100%)}
.pz-band>:not(.pz-stars){position:relative;z-index:2}
.pz-band h3{margin:0;color:#ffe7a6;font-family:"Noto Serif",Georgia,serif;font-size:calc(22px*var(--fs));text-shadow:0 2px 8px rgba(0,0,0,.35)}
.pz-medal.sm{width:42px;height:42px;font-size:21px}
.pz-pill{padding:5px 12px;border:1px solid rgba(255,220,140,.5);border-radius:999px;background:rgba(255,236,180,.16);color:#fff1c8;font-size:calc(13px*var(--fs));font-weight:800}
.pz-body{position:relative;padding:18px 20px 24px;background:radial-gradient(circle at 10% 0%,color-mix(in srgb,var(--c) 11%,transparent),transparent 42%),radial-gradient(circle at 100% 100%,rgba(212,160,23,.13),transparent 46%),var(--paper)}
.pz-body::before{content:"☸";position:absolute;right:14px;top:4px;color:rgba(201,151,26,.07);font-size:130px;line-height:1;pointer-events:none}
.pz-body>*{position:relative}
/* tràng hạt tiến độ */
.pz-mala{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 16px}
.pz-mala i{position:relative;width:15px;height:15px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#e9d6b0 70%);box-shadow:inset 0 -2px 3px rgba(0,0,0,.18)}
.pz-mala i:not(:last-child)::after{content:"";position:absolute;left:100%;top:50%;width:8px;height:2px;background:#d6b47a}
.pz-mala i.ok{background:radial-gradient(circle at 35% 30%,#fff7c8,#f2b91e 60%,#a8740a)}
.pz-mala i.half{background:radial-gradient(circle at 35% 30%,#fff7c8,#f6d06a 60%,#c9971a);opacity:.75}
.pz-mala i.no{background:radial-gradient(circle at 35% 30%,#f3b0a0,#a8382b 65%,#6e1c14)}
.pz-mala i.cur{box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 40%,transparent),0 0 12px var(--c);animation:pzPulse 1.2s ease-in-out infinite}
@keyframes pzPulse{50%{transform:scale(1.25)}}
/* câu hỏi */
.pz-prompt{margin:4px 0 18px;text-align:center}
.pz-ask-t{margin:0 0 6px;color:var(--muted);font-size:calc(14px*var(--fs))}
.pz-word{color:var(--maroon);font-size:calc(clamp(36px,6.5vw,58px)*var(--fs-big));font-weight:700;line-height:1.15;word-break:break-word;text-shadow:0 6px 18px rgba(212,160,23,.35);animation:pzIn .45s ease-out}
@keyframes pzIn{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}
.pz-mean{margin:6px 0 0;font-size:calc(16px*var(--fs))}
.pz-tag{display:inline-block;margin:10px 0 0;padding:6px 16px;border:1px solid var(--line);border-radius:999px;background:linear-gradient(90deg,color-mix(in srgb,var(--c) 18%,var(--paper)),color-mix(in srgb,#f4c24c 26%,var(--paper)));font-weight:800}
.pz-meanbig{margin:4px 0;color:var(--maroon);font-size:calc(24px*var(--fs-big));font-weight:800;animation:pzIn .4s}
.pz-hint{color:var(--muted)}
.pz-scroll{max-width:780px;margin:6px auto 0;padding:14px 22px;border:1px solid color-mix(in srgb,var(--gold) 55%,var(--line));border-radius:14px;background:linear-gradient(var(--paper2),color-mix(in srgb,var(--paper2) 82%,#e4c88a));box-shadow:inset 0 0 0 4px color-mix(in srgb,var(--paper) 60%,transparent)}
.pz-sent{color:var(--ink);font-size:calc(22px*var(--fs-big));line-height:1.7}
.pz-blank{display:inline-block;min-width:96px;border-bottom:3px solid var(--saffron);color:var(--saffron);text-align:center;animation:pzBlink 1.4s ease-in-out infinite}
@keyframes pzBlink{50%{opacity:.45}}
.pz-opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:780px;margin:0 auto}
.pz-opt{position:relative;display:flex;align-items:center;gap:12px;min-height:62px;padding:12px 16px;border:1px solid var(--line);border-left:5px solid color-mix(in srgb,var(--c) 70%,#d4a017);border-radius:16px;background:linear-gradient(180deg,var(--paper),var(--paper2));color:var(--ink);font:inherit;font-size:calc(17px*var(--fs));text-align:left;cursor:pointer;box-shadow:0 3px 0 color-mix(in srgb,var(--line) 70%,#b8915a),0 6px 14px rgba(90,40,10,.08);transition:transform .12s,box-shadow .12s;animation:pzIn .35s ease-out both}
.pz-opt:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 0 color-mix(in srgb,var(--line) 70%,#b8915a),0 12px 22px color-mix(in srgb,var(--c) 24%,transparent)}
.pz-opt:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 color-mix(in srgb,var(--line) 70%,#b8915a)}
.pz-opt kbd{display:grid;place-items:center;flex:none;width:30px;height:30px;border:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff7d0,#f2c14e);color:#6b3e06;font-family:inherit;font-size:13px;font-weight:900}
.pz-opt.ok{border-color:var(--okc);background:linear-gradient(180deg,color-mix(in srgb,var(--okc) 14%,var(--paper)),color-mix(in srgb,var(--okc) 24%,var(--paper)));box-shadow:0 0 0 3px color-mix(in srgb,var(--okc) 32%,transparent)}
.pz-opt.ok kbd{background:var(--okc);color:#fff}
.pz-opt.no{border-color:var(--badc);background:color-mix(in srgb,var(--badc) 12%,var(--paper));animation:pzShake .38s}
.pz-opt:disabled{cursor:default}
@keyframes pzShake{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.pz-after{max-width:780px;margin:16px auto 0;padding:12px 16px;border-left:5px solid var(--badc);border-radius:14px;background:color-mix(in srgb,var(--badc) 7%,var(--paper2));line-height:1.6;animation:pzIn .3s}
.pz-after.ok{border-left-color:var(--okc);background:color-mix(in srgb,var(--okc) 8%,var(--paper2))}
.pz-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px}.pz-actions.right{justify-content:flex-end}
.pz-btn{padding:9px 16px;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--ink);font:inherit;font-weight:800;cursor:pointer;transition:transform .12s}
.pz-btn:hover:not(:disabled){transform:translateY(-1px);border-color:var(--gold)}
.pz-btn:disabled{opacity:.5;cursor:default}
.pz-btn.gold{border:0;background:linear-gradient(180deg,#f8d36a,#e09a1a);color:#4a2504;box-shadow:0 3px 0 #a8650c,0 8px 16px rgba(224,154,26,.32)}
.pz-btn.sm{padding:6px 12px;font-size:calc(13px*var(--fs))}
.pz-btn kbd{padding:0 5px;border:1px solid rgba(0,0,0,.2);border-radius:5px;font-size:.78em}
.pz-link{padding:0 2px;border:0;background:none;color:var(--maroon);font:inherit;font-weight:800;text-decoration:underline;cursor:pointer}
.pz-msg{color:var(--muted);text-align:center}
.pz-plus{position:absolute;z-index:8;transform:translateX(-50%);color:#e09a1a;font-size:22px;font-weight:900;text-shadow:0 2px 6px rgba(255,255,255,.85);white-space:nowrap;pointer-events:none;animation:pzPlus 1s ease-out forwards}
@keyframes pzPlus{to{opacity:0;margin-top:-60px}}
.pz-spark{position:absolute;z-index:7;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;pointer-events:none;animation:pzSpark .8s ease-out forwards}
@keyframes pzSpark{to{transform:translate(var(--dx),var(--dy)) scale(.2);opacity:0}}
/* ⚡ Thần tốc: trời đêm, vòng đồng hồ vàng */
.pz-night{color:#fbe9d2;background:radial-gradient(circle at 82% 0%,rgba(255,220,150,.28),transparent 40%),linear-gradient(180deg,#1b0d26,#3a1638 62%,#6b2230)}
.pz-night::before{color:rgba(255,220,140,.08)}
.pz-night .pz-ask-t{color:#e7cdb2}
.pz-night .pz-word{color:#ffe08a;text-shadow:0 0 22px rgba(255,200,90,.65)}
.pz-night .pz-opt{border-color:rgba(255,215,140,.35);border-left-color:#f3a43a;background:rgba(255,245,225,.08);color:#fff3dc;box-shadow:none}
.pz-night .pz-opt:hover:not(:disabled){background:rgba(255,245,225,.16)}
.pz-night .pz-opt.ok{background:rgba(127,211,160,.22);border-color:#7fd3a0}
.pz-night .pz-opt.no{background:rgba(240,138,124,.2);border-color:#f08a7c}
.pz-night .pz-plus{color:#ffe08a;text-shadow:0 0 10px rgba(255,200,90,.8)}
.pz-ring{--p:1;display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:conic-gradient(#ffd25a calc(var(--p)*360deg),rgba(255,255,255,.16) 0)}
.pz-ring b{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#3b0f1a;color:#ffe7a6;font-size:17px;font-variant-numeric:tabular-nums}
.pz-ring.low{animation:pzPulse .8s ease-in-out infinite}.pz-ring.low b{color:#ff9a86}
/* 🧩 Xếp chữ: đồng tiền vàng, ô lá bồ-đề */
.pz-slots{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:6px 0 18px}
.pz-slot{width:46px;height:54px;border:0;border-bottom:4px solid color-mix(in srgb,var(--c) 55%,#d4a017);border-radius:14px 14px 6px 6px;background:color-mix(in srgb,#9bd27a 15%,var(--paper2));color:var(--maroon);font-size:24px;font-weight:800;cursor:pointer}
.pz-slot.on{background:linear-gradient(180deg,#fff8dc,#f6dc95);color:#6b2a10;animation:pzPop .25s}
.pz-slot:disabled{cursor:default}
.pz-slots.ok .pz-slot{background:linear-gradient(180deg,#e9f7e6,#bfe3b4);border-bottom-color:var(--okc);color:#1f5a36}
.pz-slots.no .pz-slot{border-bottom-color:var(--badc)}
.pz-slots.shake{animation:pzShake .4s}
.pz-tiles{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:8px}
.pz-tile{width:54px;height:54px;border:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff8d2,#f4c24c 55%,#c2860f);color:#5a2f05;font-size:22px;font-weight:900;cursor:pointer;box-shadow:0 4px 0 #9a6608,0 8px 14px rgba(160,100,10,.3);transition:transform .12s;animation:pzIn .3s both}
.pz-tile:hover:not(:disabled){transform:translateY(-3px) rotate(-5deg)}
.pz-tile:disabled{opacity:.18;transform:scale(.85);box-shadow:none;cursor:default}
@keyframes pzPop{from{transform:scale(.6)}to{transform:none}}
/* ✍️ Chữ khuyết: chữ còn lại là thẻ vàng, chỗ khuyết là ô trống “?”; ô gõ cả từ bên dưới */
.pz-gapw{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:8px 0 12px}
.pz-gapw span{display:grid;place-items:center;min-width:44px;height:54px;padding:0 6px;box-sizing:border-box;border-radius:12px 12px 8px 8px;font-size:26px;font-weight:800;animation:pzIn .3s both}
.gp-ch{background:linear-gradient(180deg,#fff8dc,#f6dc95);color:#6b2a10;box-shadow:0 3px 0 #c9971a}
.gp-hole{border:2px dashed color-mix(in srgb,var(--c) 70%,#d4a017);background:color-mix(in srgb,var(--c) 7%,var(--paper2));color:color-mix(in srgb,var(--c) 55%,transparent);font-size:20px!important}
.gp-open{box-shadow:0 3px 0 #c9971a,0 0 0 3px color-mix(in srgb,var(--c) 45%,transparent);animation:pzPop .3s!important}
.pz-gapw.ok .gp-fill{background:linear-gradient(180deg,#e9f7e6,#bfe3b4);color:#1f5a36;box-shadow:0 3px 0 var(--okc);animation:pzPop .3s}
.pz-gapw.no .gp-fill{background:color-mix(in srgb,var(--badc) 14%,var(--paper));color:var(--badc);box-shadow:0 3px 0 var(--badc);animation:pzPop .3s}
.pz-gapin{display:flex;gap:8px;max-width:560px;margin:0 auto 8px}
.pz-gapin input{flex:1;min-width:0;padding:11px 14px;border:2px solid var(--line);border-radius:14px;background:var(--paper);color:var(--ink);font-family:"Noto Serif",Georgia,serif;font-size:calc(22px*var(--fs-big));text-align:center;outline:none}
.pz-gapin input:focus{border-color:var(--c);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 22%,transparent)}
.pz-gapin input[readonly]{background:var(--paper2)}
.pz-gapin .pz-btn{flex:none}
.pz-gapin.shake{animation:pzShake .4s}
#gpActs{max-width:560px;margin:10px auto 0}
/* Chữ khuyết: màn chọn số từ (10–30) trước mỗi lượt */
.pz-actions.center{justify-content:center}
.pz-count{margin:4px 0 0;color:var(--maroon);font-size:calc(18px*var(--fs));font-weight:800}
.pz-count output{margin-right:4px;font-size:calc(48px*var(--fs-big));line-height:1.1;color:color-mix(in srgb,var(--c) 70%,#5a2408)}
.pz-range{display:block;width:min(420px,100%);margin:10px auto 14px;accent-color:var(--c);cursor:pointer}
.pz-nchips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 12px}
.pz-nchips .pz-btn{min-width:54px}
.pz-ask-t.pz-tq{margin-top:16px}
.pz-pairs .pz-missed .pz-link{color:var(--badc)}
.pz-nchips .pz-btn.on{border-color:var(--c);background:color-mix(in srgb,var(--c) 16%,var(--paper));color:color-mix(in srgb,var(--c) 65%,#3a1a08);box-shadow:0 0 0 2px color-mix(in srgb,var(--c) 30%,transparent)}
/* tràng hạt dài (trên 15 hạt): hạt nhỏ lại */
.pz-mala.many{gap:6px}.pz-mala.many i{width:12px;height:12px}.pz-mala.many i:not(:last-child)::after{width:6px}
.pz-msg b{color:var(--maroon)}
/* 🪷 Tìm cặp thẻ: ao sen, lật 3D */
.pz-pond{overflow:hidden;background:radial-gradient(circle at 20% 10%,rgba(255,255,255,.3),transparent 40%),linear-gradient(165deg,#0f4f57 0%,#1c8784 52%,#6fc8b5 100%)}
.pz-pond::before{display:none}
.pz-pond-t{z-index:2;margin:0 0 14px;color:#effffb;text-align:center;text-shadow:0 1px 6px rgba(0,0,0,.35)}
.pz-body>.pz-pad,.pz-body>.pz-rip{position:absolute}
.pz-pad{z-index:0;border-radius:50%;background:radial-gradient(circle at 40% 35%,#7fd69a,#2e8f58 70%);opacity:.55}
.pz-pad::after{content:"";position:absolute;left:50%;top:50%;width:50%;height:50%;background:#1c8784;clip-path:polygon(0 0,100% 40%,100% 60%)}
.pz-pad.p1{left:-26px;top:10%;width:96px;height:96px}.pz-pad.p2{right:-16px;top:44%;width:74px;height:74px}.pz-pad.p3{left:14%;bottom:-34px;width:84px;height:84px}
.pz-rip{z-index:0;border:2px solid rgba(255,255,255,.35);border-radius:50%;animation:pzRip 6s ease-out infinite}
.pz-rip.r1{right:14%;top:10%;width:60px;height:60px}.pz-rip.r2{left:34%;bottom:8%;width:80px;height:80px;animation-delay:-3s}
@keyframes pzRip{from{transform:scale(.3);opacity:.9}to{transform:scale(2.4);opacity:0}}
.pz-mem{z-index:2;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-width:640px;margin:0 auto}
.pz-mt{aspect-ratio:4/3.3;padding:0;border:0;background:none;cursor:pointer;perspective:800px;animation:pzIn .45s both;animation-delay:var(--d,0s)}
.pz-in{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.3,.7,.3,1)}
.pz-mt.up .pz-in{transform:rotateY(180deg)}
.pz-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:16px;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.pz-cover{border:2px solid rgba(255,255,255,.55);background:radial-gradient(circle at 50% 34%,#66cba9,#1e7b6c 72%);box-shadow:inset 0 0 18px rgba(0,60,50,.5),0 6px 14px rgba(0,40,40,.35)}
.pz-bud{width:44%;height:auto;filter:drop-shadow(0 3px 5px rgba(0,50,40,.45));animation:pzBud 3.4s ease-in-out infinite alternate}
@keyframes pzBud{from{transform:translateY(0) rotate(-3deg)}to{transform:translateY(-3px) rotate(3deg)}}
.pz-mt:hover:not(:disabled) .pz-cover{box-shadow:inset 0 0 18px rgba(0,60,50,.5),0 0 0 3px rgba(255,240,180,.7),0 8px 16px rgba(0,40,40,.4)}
.pz-show{padding:6px;border:2px solid #efb9ca;background:linear-gradient(#fffdf6,#fde3ec);color:#5a3a22;font-size:calc(14px*var(--fs));font-weight:800;line-height:1.25;text-align:center;overflow-wrap:anywhere;transform:rotateY(180deg)}
.pz-show.p span{color:#8a1f3a;font-size:calc(19px*var(--fs))}
.pz-mt.got .pz-show{border-color:#d4a017;background:linear-gradient(#fff9dc,#f7d98a);box-shadow:0 0 0 3px rgba(255,220,120,.7),0 0 22px rgba(255,214,102,.8)}
.pz-mt.miss .pz-show{border-color:#e0705e;animation:pzShake .35s}
.pz-mt:disabled{cursor:default}
.pz-pond .pz-plus{color:#fff3b0;text-shadow:0 0 10px rgba(255,230,150,.9)}
/* kết thúc: sen nở, sao, cánh sen rơi */
.pz-end{min-height:340px;overflow:hidden;text-align:center}
.pz-endbox{z-index:2}
.pz-end .pz-lotus{width:170px;height:auto;animation:pzBloom .9s cubic-bezier(.2,.8,.3,1.3) both}
@keyframes pzBloom{from{opacity:0;transform:scale(.3) translateY(30px)}to{opacity:1;transform:none}}
.pz-stars3{display:flex;justify-content:center;gap:6px;margin:4px 0 2px}
.pz-stars3 i{color:var(--line);font-size:46px;font-style:normal;animation:pzStar .5s both}
.pz-stars3 i.on{color:#f2b91e;text-shadow:0 0 14px rgba(242,185,30,.7)}
@keyframes pzStar{from{transform:scale(0) rotate(-90deg)}to{transform:none}}
.pz-end h2{margin:6px 0;color:var(--maroon);font-family:"Noto Serif",Georgia,serif;font-size:calc(28px*var(--fs-big))}
.pz-sub{margin:6px 0;color:var(--muted)}
.pz-miss,.pz-pairs{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 10px;max-width:720px;margin:8px auto 14px}
.pz-pairs{flex-direction:column;align-items:center;gap:4px}
.pz-chip{padding:4px 12px;border:1px solid var(--line);border-radius:999px;background:var(--paper2);color:var(--ink);font:inherit;font-size:calc(13.5px*var(--fs))}
button.pz-chip{cursor:pointer;font-weight:700}
.pz-end .pz-actions{justify-content:center}
.pz-body>.pz-petals{position:absolute}
.pz-petals{inset:0;z-index:1;overflow:hidden;pointer-events:none}
.pz-petals i{position:absolute;top:-20px;width:14px;height:10px;border-radius:70% 10% 70% 10%;background:linear-gradient(135deg,#ffe0ea,#f18fb0);opacity:.9;animation:pzPetal 4s ease-in forwards}
@keyframes pzPetal{to{transform:translate(30px,440px) rotate(var(--r));opacity:0}}
/* ⚡ Thần tốc: chú tiểu cầm đồng hồ cát đếm giờ — calm · worry (≤10 giây) · panic (≤5 giây) · end; happy / oops khi trả lời */
.pz-speed{display:grid;grid-template-columns:190px minmax(0,1fr);gap:18px;align-items:center}
.pz-monkbox{display:flex;flex-direction:column;align-items:center}
.pz-monk{width:134px;height:auto;overflow:visible;transform-origin:50% 95%;filter:drop-shadow(0 6px 10px rgba(0,0,0,.35))}
.pz-monk .mk-panic,.pz-monk .mk-panicarms,.pz-monk .mk-frown{display:none}
.pz-monk .mk-brow{opacity:0;transition:opacity .3s}
.pz-monkbox.worry .mk-brow{opacity:1}
.pz-monkbox.oops .mk-smile{display:none}.pz-monkbox.oops .mk-frown{display:inline}
.pz-monkbox.panic .mk-calm,.pz-monkbox.panic .mk-calmarms{display:none}
.pz-monkbox.panic .mk-panic,.pz-monkbox.panic .mk-panicarms{display:inline}
.pz-monkbox.calm .pz-monk{animation:mkBob 2.4s ease-in-out infinite}
.pz-monkbox.worry .pz-monk{animation:mkBob .9s ease-in-out infinite}
.pz-monkbox.happy .pz-monk{animation:mkJump .65s ease-out}
.pz-monkbox.oops .pz-monk{animation:mkTilt .7s ease-in-out}
.pz-monkbox.panic .pz-monk{animation:mkShake .26s linear infinite}
.pz-monkbox.end .pz-monk{animation:mkBow 1.2s ease-in-out both}
.pz-monk .mk-eyes{transform-box:fill-box;transform-origin:center;animation:mkBlink 4.2s infinite}
.pz-monk .mk-sandtop{transform-box:fill-box;transform-origin:50% 100%;animation:mkSand 3s linear infinite}
.pz-monk .mk-sweat{animation:mkSweat .9s ease-in infinite}.pz-monk .mk-sweat.s2{animation-delay:-.45s}
@keyframes mkBob{50%{transform:translateY(-4px)}}
@keyframes mkJump{0%,100%{transform:none}40%{transform:translateY(-18px) scale(1.05)}70%{transform:scaleY(.94)}}
@keyframes mkTilt{0%,100%{transform:none}30%{transform:rotate(-9deg)}60%{transform:rotate(5deg)}}
@keyframes mkShake{0%,100%{transform:none}25%{transform:translateX(-3px) rotate(-4deg)}75%{transform:translateX(3px) rotate(4deg)}}
@keyframes mkBow{50%{transform:rotate(9deg) translateY(5px)}}
@keyframes mkBlink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
@keyframes mkSand{from{transform:scaleY(1)}to{transform:scaleY(.15)}}
@keyframes mkSweat{from{transform:translateY(0);opacity:1}to{transform:translateY(14px);opacity:0}}
.pz-bubble{position:relative;margin-top:10px;max-width:190px;min-height:42px;padding:8px 12px;border-radius:16px;background:#fff8e6;color:#4a2508;font-size:calc(14px*var(--fs));font-weight:800;line-height:1.35;text-align:center;box-shadow:0 6px 16px rgba(0,0,0,.3)}
.pz-bubble::before{content:"";position:absolute;left:50%;top:-8px;margin-left:-8px;border:8px solid transparent;border-top:0;border-bottom-color:#fff8e6}
.pz-bubble b{color:#b5460a;font-size:1.2em}
.pz-bubble.hot{background:#ffe1d6;color:#8a1a0a;animation:mkPulse .45s ease-in-out infinite alternate}
.pz-bubble.hot::before{border-bottom-color:#ffe1d6}
.pz-bubble.hot b{display:block;color:#c0260f;font-size:2.1em;line-height:1.05}
@keyframes mkPulse{to{transform:scale(1.07)}}
.pz-night:has(.pz-monkbox.panic){box-shadow:inset 0 0 70px rgba(255,70,40,.42)}
@media(max-width:600px){.pz-speed{grid-template-columns:1fr;gap:10px}.pz-monkbox{flex-direction:row;justify-content:center;gap:12px}.pz-monk{width:80px}.pz-bubble{margin-top:0;max-width:220px}
  .pz-bubble::before{left:-8px;top:50%;margin:-8px 0 0;border:8px solid transparent;border-left:0;border-right-color:#fff8e6}.pz-bubble.hot::before{border-right-color:#ffe1d6}}
/* nhân vật đồng hành (games.js HEROES; Thẻ nhớ dùng Chư thiên): idle · happy (đúng) · sad (sai) */
.pz-play{display:grid;grid-template-columns:170px minmax(0,1fr);gap:18px;align-items:start}
.pz-main{min-width:0}
.pz-herobox{position:sticky;top:70px;display:flex;flex-direction:column;align-items:center}
.pz-char{width:126px;height:auto;overflow:visible;transform-origin:50% 95%;filter:drop-shadow(0 6px 10px rgba(0,0,0,.25))}
.pz-char .ch-happy,.pz-char .ch-sad{display:none}
.pz-herobox.happy .ch-calm,.pz-herobox.sad .ch-calm{display:none}
.pz-herobox.happy .ch-happy,.pz-herobox.sad .ch-sad{display:inline}
.pz-herobox.idle .pz-char{animation:chFloat 3s ease-in-out infinite}
.pz-herobox.idle .ch-deva{animation-duration:2.2s}
.pz-herobox.happy .pz-char{animation:chJump .7s ease-out}
.pz-herobox.sad .pz-char{animation:chDroop .9s ease-in-out}
.pz-char .ch-eyes{transform-box:fill-box;transform-origin:center;animation:mkBlink 4.6s infinite}
.pz-char .ch-tear{animation:mkSweat 1s ease-in infinite}
@keyframes chFloat{50%{transform:translateY(-5px)}}
@keyframes chJump{0%,100%{transform:none}35%{transform:translateY(-16px) scale(1.05)}65%{transform:scaleY(.95)}}
@keyframes chDroop{0%,100%{transform:none}40%{transform:rotate(-6deg) translateY(3px)}}
.pz-herobox .pz-bubble{margin-top:8px}
.pz-with{font-style:normal;font-weight:700;font-size:calc(12px*var(--fs));color:var(--muted)}
.pz-endhero{margin-bottom:4px}
.pz-endhero .pz-herobox,.fl-deva .pz-herobox{position:static;flex-direction:row;justify-content:center;gap:14px}
.pz-endhero .pz-char{width:112px}
.pz-endhero .pz-bubble,.fl-deva .pz-bubble{margin-top:0;max-width:260px}
.pz-endhero .pz-bubble::before,.fl-deva .pz-bubble::before{left:-8px;top:50%;margin:-8px 0 0;border:8px solid transparent;border-left:0;border-right-color:#fff8e6}
.fl-deva{position:relative;z-index:3;margin:0 0 10px}
.fl-deva .pz-char{width:80px}
.fl-deva .pz-petals{position:absolute;left:0;right:0;top:0;z-index:5;height:420px}
.sess-end .fl-deva{margin:0 0 6px}
@media(max-width:600px){.pz-play{grid-template-columns:1fr;gap:8px}.pz-herobox{position:static;flex-direction:row;justify-content:center;gap:12px}.pz-char{width:70px}.pz-endhero .pz-char{width:84px}.fl-deva .pz-char{width:64px}
  .pz-herobox .pz-bubble{margin-top:0}.pz-herobox .pz-bubble::before{left:-8px;top:50%;margin:-8px 0 0;border:8px solid transparent;border-left:0;border-right-color:#fff8e6}}
@media(max-width:900px){.pz-menu{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* khu có 5 trò (Dành cho người mới): 5 cột → 3 cột → 2 cột, trò cuối trải hết hàng */
.pz-menu.n5{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:1180px){.pz-menu.n5{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.pz-menu.n5{grid-template-columns:repeat(2,minmax(0,1fr))}.pz-menu.n5>:last-child{grid-column:1/-1}}
@media(max-width:600px){
  .gm-promo{padding:16px}.gp-art{display:none}.gp-btns [data-game-open]{padding:6px 11px;font-size:calc(13px*var(--fs))}
  .pz-hero{min-height:0;padding:14px 14px 104px}.pz-tree{width:84px;left:2%}.pz-stupa{width:42px;right:30%}.pz-hero-txt{max-width:100%}.pz-hero p{font-size:14px}
  .pz-sun{right:2%;bottom:34px;width:104px;height:104px}.pz-wheel{width:64px;height:64px}
  .pz-tools{margin:-26px 8px 6px;padding:10px 12px}.pz-src{display:grid;width:100%}.pz-src select{width:100%}
  .pz-sec{flex-wrap:wrap;gap:4px 10px;margin:18px 2px 10px;font-size:19px}.pz-sec small{flex-basis:100%;margin-left:46px;margin-top:-6px}.pz-sec::after{display:none}
  .pz-src small,.gm-snd small{display:none}.gm-snd{flex-wrap:nowrap}.gm-snd .pz-btn{flex:1;padding:7px 8px}
  .pz-menu{gap:10px}.pz-card{padding:16px 12px 12px}.pz-desc{display:none}.pz-medal{width:46px;height:46px;font-size:24px}.pz-card::after{font-size:34px}.pz-card b{font-size:16px}
  .pz-band{padding:10px 12px}.pz-band h3{font-size:18px}.pz-medal.sm{width:34px;height:34px;font-size:18px}.pz-body{padding:14px 12px 18px}
  .pz-opts{grid-template-columns:1fr}.pz-opt{min-height:54px}.pz-mem{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.pz-show{font-size:12.5px}.pz-show.p span{font-size:16px}
  .pz-slot{width:36px;height:46px;font-size:19px}.pz-tile{width:46px;height:46px;font-size:19px}
  .pz-gapw{gap:5px}.pz-gapw span{min-width:34px;height:44px;padding:0 4px;font-size:20px}.pz-gapin .pz-btn kbd{display:none}.pz-sent{font-size:calc(18px*var(--fs-big))}.pz-mala{gap:6px}.pz-mala i{width:13px;height:13px}.pz-mala i:not(:last-child)::after{width:6px}.pz-mala.many{gap:5px}.pz-mala.many i{width:10px;height:10px}.pz-mala.many i:not(:last-child)::after{width:5px}.pz-count output{font-size:40px}
}
@media(prefers-reduced-motion:reduce){.fl-deva *,.pz *,.pz *::before,.pz *::after,.gm-promo::before,.gp-art span{animation:none!important;transition:none!important}}
.flip-run .primary kbd{border-color:rgba(255,255,255,.45);background:rgba(255,255,255,.18);color:#fff}