/* ---------- 👓 Readability fixes (v256) — loaded last, with 290-contrast-guard.js ----------
   The guard fixes text colours on the fly; these are the cases it leaves alone on purpose
   (faded with opacity, or a button colour that needs changing rather than its text). */
/* Idioms: "Literally: …" was faded to 75 % (3.5 : 1) — keep it italic and quieter, but readable */
.idiom-literal{ font-style:italic; color:var(--muted,#56635d) !important; opacity:1 !important; }
body.dark-mode .idiom-literal{ color:#b9c8c1 !important; }
/* Voice Studio bonus button: white on orange was 2.9 : 1 */
#vsBonusGo, .vs-w-go{ background:#c2410c !important; border-color:#c2410c !important; color:#fff !important; }
/* the Today badge on the home card */
.vc-td-badge{ color:#0b5e58; }
body.dark-mode .vc-td-badge{ color:#99f6e4; }
/* sidebar: the lit section's name in full white */
html.vc-side #vcTopNav button.vd-on{ color:#fff !important; }
/* locked levels stay visibly locked, but their names can be read */
.cat-chip.locked{ opacity:.62; }

/* ---------- Start Here banner (v256, owner: "this banner on the start page seems a bit big") ---------- */
@media (min-width:1024px){
  html.vc-web-studio.vc-vd .vc244-home-hero{ min-height:0 !important; padding:26px 32px !important; gap:22px !important; align-items:center; }
  html.vc-web-studio.vc-vd .vc244-home-hero h1{ font-size:clamp(28px, 2.3vw, 38px) !important; line-height:1.12 !important; margin:6px 0 4px !important; }
  html.vc-web-studio.vc-vd .vc244-home-hero p{ font-size:14px !important; line-height:1.55 !important; margin:0 !important; }
  html.vc-web-studio.vc-vd .vc244-home-hero > div > * + *{ margin-top:12px !important; }
  html.vc-web-studio.vc-vd .vc244-home-hero .vc244-home-stats > div{ padding:9px 12px !important; }
  html.vc-web-studio.vc-vd .vc244-home-hero .vc244-home-stats > div > div:first-child{ font-size:20px !important; line-height:1.15; }
  html.vc-web-studio.vc-vd .vc244-home-session{ padding:18px 20px !important; }
  html.vc-web-studio.vc-vd .vc244-home-session > * + *{ margin-top:8px !important; }
}
/* its main button: solid gold like the other main buttons in this look (it was pale mint with white text) */
html.vc-web-studio.vc-vd #vdHomeGo{ background:#f5c84c !important; background-image:none !important; color:#1c2b20 !important; font-weight:800 !important; box-shadow:0 6px 16px -6px rgba(0,0,0,.35) !important; }
html.vc-web-studio.vc-vd #vdHomeGo:hover{ background:#f8d56d !important; }
html.vc-web-studio.vc-vd #vdHomeGo *{ color:inherit !important; }
/* same, at the Garden look's strength (its rules use > .vd-wrap > div:first-child + ids) */
@media (min-width:1024px){
  html.vc-garden.vc-web-studio.vc-vd #vd-starthere>.vd-wrap>div.vc244-home-hero:first-of-type{ min-height:0 !important; padding:24px 30px !important; }
  html.vc-garden.vc-web-studio.vc-vd #vd-starthere>.vd-wrap>div.vc244-home-hero:first-of-type h1{ font-size:clamp(28px, 2.4vw, 40px) !important; }
  html.vc-garden.vc-web-studio.vc-vd #vd-starthere .vc244-home-session{ padding:18px 20px !important; }
}
html.vc-garden.vc-web-studio.vc-vd #vd-starthere #vdHomeGo#vdHomeGo{ background:#f5c84c !important; background-image:none !important; color:#1c2b20 !important; font-weight:800 !important; }
html.vc-garden.vc-web-studio.vc-vd #vd-starthere #vdHomeGo#vdHomeGo:hover{ background:#f8d56d !important; }
html.vc-garden.vc-web-studio.vc-vd #vd-starthere #vdHomeGo#vdHomeGo *{ color:inherit !important; }

/* ---------- Build the Sentence: pattern chips with their English, in groups (v256) ---------- */
@media (min-width:1024px){ #patternCats{ display:block !important; } }   /* phones show the dropdown instead (234-chip-select.js) */
#patternCats .pc-group{ margin:0 0 12px; }
#patternCats .pc-group:last-child{ margin-bottom:0; }
#patternCats .pc-group-h{ font:800 11px/1.2 var(--font, 'Plus Jakarta Sans', sans-serif); letter-spacing:.06em; text-transform:uppercase; color:var(--muted,#56635d); margin:0 0 7px 2px; }
#patternCats .pc-group-row{ display:flex; flex-wrap:wrap; gap:8px; }
#patternCats .pc-chip{ display:inline-flex !important; flex-direction:column; align-items:flex-start; justify-content:center; gap:2px; line-height:1.2; padding:8px 14px !important; min-height:44px; height:auto !important; white-space:normal; text-align:left; }
#patternCats .pc-chip .pc-top{ font-weight:700; }
#patternCats .pc-chip .pc-en{ font-size:11.5px; font-weight:600; color:color-mix(in srgb, currentColor 78%, transparent); }

/* Quiz: "Forgive accents & tones" switch under the typing box (v256) */
.vc-forgive{ display:inline-flex; align-items:center; gap:8px; margin:10px 0 0 4px; font:600 13.5px var(--font, sans-serif); color:var(--muted,#56635d); cursor:pointer; min-height:36px; }
.vc-forgive input{ width:18px; height:18px; accent-color:var(--cover,#0F766E); margin:0; }

/* ---------- small UI fixes from the v256 sweep ---------- */
/* game pages showed three labels above the title (hero kicker, breadcrumb, and this one) — keep two */
html.vc-web-studio .vc245-page-hero .vc252-game-kicker{ display:none !important; }
/* Events: the count pill is hidden while there are no events, but its inline-flex class showed it as an empty white pill */
#vdEvCount[hidden], [hidden].inline-flex{ display:none !important; }

/* ---------- More sheet on phones / outside the desktop Garden look (v257, owner: "the More screen on phone looks funky") ----------
   v250 added a description under each group name and a subtitle under "All sections", styled only for computers:
   on phones the name and description ran together ("LearnStart your…") and "✎ Edit bar" was squeezed onto two lines. */
html:not(.vc-web-studio) #moreSheetPanel .vc250-group-heading{ display:flex; flex-direction:column; align-items:flex-start; gap:2px; min-width:0; flex:1 1 auto; text-align:left; }
html:not(.vc-web-studio) #moreSheetPanel .vc250-group-title{ font-weight:800; font-size:15px; line-height:1.2; }
html:not(.vc-web-studio) #moreSheetPanel .vc250-group-subtitle{ font-weight:600; font-size:12px; line-height:1.3; color:var(--muted,#56635d); }
html:not(.vc-web-studio) #moreSheetPanel .vc250-group-subtitle:empty{ display:none; }
html:not(.vc-web-studio) #moreSheetPanel .vc250-more-title-wrap{ min-width:0; flex:1 1 auto; padding-right:8px; }
html:not(.vc-web-studio) #moreSheetPanel .vc250-more-subtitle{ margin:2px 0 0; font-size:12.5px; line-height:1.35; color:var(--muted,#56635d); font-weight:500; }
html:not(.vc-web-studio) #moreSheetPanel #navEditToggle{ white-space:nowrap; padding:8px 12px; min-height:40px; font-size:13px; flex:none; }
html.vc-ph #moreSheetPanel .vc250-group-subtitle{ text-transform:none !important; letter-spacing:0 !important; font-size:12px !important; font-weight:600 !important; }

/* ---------- 🎨 one Look picker in Settings › App (v257, 292-look-picker.js) ---------- */
.vc-look-old{ display:none !important; }   /* the five old switches — still in the page for code that clicks them */
.vc-look{ margin:0 0 14px; font-family:var(--font, 'Plus Jakarta Sans', sans-serif); }
.vc-look-h{ display:flex; align-items:baseline; gap:8px; margin:0 0 8px; }
.vc-look-h b{ font-size:15px; font-weight:800; color:var(--ink,#062822); }
.vc-look-h span{ font-size:12.5px; color:var(--muted,#56635d); font-weight:600; }
.vc-look-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:8px; }
.vc-look .vc-look-opt{ display:flex; align-items:flex-start; gap:10px; text-align:left; padding:11px 12px; min-height:56px; border-radius:14px; border:1.5px solid var(--line,#e6dfcf) !important; background:var(--card,#fff) !important; color:var(--ink,#062822); cursor:pointer; font:inherit; position:relative; }
.vc-look .vc-look-opt:hover{ border-color:color-mix(in srgb, var(--cover,#0F766E) 45%, var(--line,#e6dfcf)); }
.vc-look .vc-look-opt.on{ border-color:var(--cover,#0F766E) !important; background:color-mix(in srgb, var(--cover,#0F766E) 9%, var(--card,#fff)) !important; box-shadow:inset 0 0 0 1px var(--cover,#0F766E); }
.vc-look-opt.on::after{ content:'✓'; position:absolute; top:8px; right:10px; width:20px; height:20px; border-radius:50%; background:var(--cover,#0F766E); color:#fff; font:800 12px/20px sans-serif; text-align:center; }
.vc-look-ic{ font-size:20px; line-height:1; flex:none; width:24px; text-align:center; margin-top:1px; }
.vc-look-t{ display:grid; gap:2px; min-width:0; padding-right:18px; }
.vc-look-t b{ font-size:14px; font-weight:800; }
.vc-look-t small{ font-size:12px; line-height:1.35; color:var(--muted,#56635d); font-weight:500; }
.vc-look-side{ display:inline-flex; align-items:center; gap:8px; margin:10px 0 0 2px; font:600 13.5px var(--font, sans-serif); color:var(--ink,#062822); cursor:pointer; min-height:36px; }
.vc-look-side input{ width:18px; height:18px; accent-color:var(--cover,#0F766E); margin:0; }
body.dark-mode .vc-look-opt{ background:var(--card); color:var(--ink); }

/* v258 attendance */
.bk-pay-row{ display:flex; flex-wrap:wrap; gap:6px; }
.bk-att-chip.due{ background:#fde8e8 !important; color:#9b1c1c !important; }
body.dark-mode .bk-att-chip.due{ background:#4a1d1d !important; color:#fecaca !important; }
.bk-card.missed{ border-left:4px solid #c2410c; }
.bk-card.bk-focus{ box-shadow:0 0 0 3px color-mix(in srgb, var(--cover,#0F766E) 45%, transparent); }
.bk-missed-head{ font:800 14px var(--font, sans-serif); margin:4px 2px 8px; color:var(--ink,#062822); }
.bk-att-set{ display:inline-flex; align-items:center; gap:6px; font:600 12.5px var(--font, sans-serif); color:var(--muted,#56635d); }
.bk-att-set select{ min-height:36px; border-radius:10px; border:1px solid var(--line,#e6dfcf); padding:4px 8px; font:600 13px var(--font, sans-serif); background:var(--card,#fff); color:var(--ink,#062822); }
.sd-att{ display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.sd-att .bk-pay-chip{ font-size:12px; }

/* v259 Voices: the points table folds */
.vs-w-more{ margin:10px 0 4px; border:1px solid var(--line,#e6dfcf); border-radius:14px; background:var(--card,#fff); }
.vs-w-more > summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:8px; min-height:46px; padding:10px 14px; font:800 14px var(--font, sans-serif); color:var(--ink,#062822); }
.vs-w-more > summary::-webkit-details-marker{ display:none; }
.vs-w-more > summary::after{ content:'▾'; margin-left:auto; transition:transform .2s; color:#4f5d57; }
.vs-w-more[open] > summary::after{ transform:rotate(180deg); }
.vs-w-more-hint{ display:none; }
.vs-w-more[open] > summary{ border-bottom:1px solid var(--line,#e6dfcf); }
.vs-w-more > :not(summary){ margin-left:14px; margin-right:14px; }
.vs-w-more > :last-child{ margin-bottom:12px; }
.vs-fine-in{ margin-top:10px !important; }

/* v259: the ✎ pencils pill lives in the sidebar's bottom corner (it used to float over the page's left edge) */
@media (min-width:1280px){
  html.vc-side #vcSuggestModeBtn{ left:16px !important; right:auto !important; bottom:16px !important; top:auto !important; max-width:calc(var(--side-px, 248px) - 32px); }
}
/* v259: Progress "Suggested next" title on its dark green card */
#vd-progress .from-teal-800 h2, #vd-progress .from-teal-800 h2 *{ color:#fff !important; }

/* v263: one-time welcome after moving from the old address */
#vcMovedIn{ position:fixed; z-index:9150; left:50%; transform:translateX(-50%); bottom:calc(84px + env(safe-area-inset-bottom)); width:min(460px, calc(100vw - 32px));
  background:var(--card,#fff); color:var(--ink,#062822); border:1px solid var(--line,#e6dfcf); border-radius:18px; padding:16px 18px; box-shadow:0 18px 40px -18px rgba(6,40,34,.45);
  font:500 14px/1.45 var(--font, system-ui, sans-serif); }
#vcMovedIn b{ display:block; font-size:15.5px; margin-bottom:4px; }
#vcMovedIn p{ margin:4px 0; } #vcMovedIn .vc-mi-x{ color:var(--muted,#4f5d57); font-size:13px; }
#vcMovedIn .vc-mi-b{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; justify-content:flex-end; }
#vcMovedIn .vc-mi-b button{ min-height:42px; margin:0; }
@media (min-width:1024px){ #vcMovedIn{ bottom:24px; } }
body.dark-mode #vcMovedIn{ background:#14201d; color:#e8f1ed; border-color:#2a3a35; }

/* v264: Homework on phones (and everywhere) — owner: "make this section look better on phone" */
.msg-tabs.vc-one-tab{ display:none !important; }                       /* a lone "My homework" / "My bookings" tab looked like a big button */
#hwList .hw-card .section-note{ margin-bottom:0; }                       /* the general 16px under every note made each card airy */
#hwList .hw-done{ margin-top:8px; padding:12px 14px; }
#hwList .hw-done-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
#hwList .hw-done-title{ font-weight:800; font-size:15px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#hwList .hw-done-chip{ flex-shrink:0; font:800 12px var(--font); color:var(--ok-ink, #166534); background:var(--ok-bg, #dcfce7); border-radius:999px; padding:3px 9px; }
#hwList .hw-meta{ margin-top:3px; line-height:1.4; }
#hwList .hw-stars{ font-size:12px; letter-spacing:-1px; }
#hwList .hw-mini-acts{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
#hwList .hw-mini{ flex:0 0 auto !important; width:auto !important; min-height:36px; margin:0 !important; padding:6px 12px !important; font-size:13px !important; border-radius:999px !important; white-space:nowrap; }
#hwList .hw-mini.hw-delete-btn, #hwList .hw-mini.hw-archive-btn{ background:transparent !important; box-shadow:none !important; }
#hwList .hw-done-head{ opacity:1; color:var(--muted); display:flex; align-items:center; justify-content:space-between; gap:8px; }
#hwList .hw-head-link{ border:0; background:none; padding:6px 2px; font:800 12px var(--font); color:var(--cover, #0F766E); cursor:pointer; text-transform:none; letter-spacing:0; opacity:1; }
#hwList .hw-section-head .hw-head-link{ opacity:1; }
#hwList .hw-more-done{ margin-top:8px; }

/* v267: teacher records the lines of a Tone practice homework */
.hw-own-row{ display:grid; grid-template-columns:1fr; gap:6px; }
.hw-own-row .teacher-search{ margin:0 !important; }
.hw-own-row #hwOwnAdd{ margin:0; min-height:42px; }
.hw-own-row #hwSentAdd{ margin:0; min-height:42px; }
@media (min-width:640px){ .hw-own-row{ grid-template-columns:1.4fr 1fr auto; } }
.hw-line .fav-icon-btn{ min-width:36px; min-height:36px; }
.hw-line .hw-line-rec.on{ background:#dc2626 !important; color:#fff !important; border-radius:999px; animation:vcRecPulse 1.2s ease-in-out infinite; }
@keyframes vcRecPulse{ 50%{ opacity:.65; } }
@media (prefers-reduced-motion: reduce){ .hw-line .hw-line-rec.on{ animation:none; } }
.hw-line-clip{ display:inline-block; margin-left:4px; font-size:11.5px; font-weight:800; color:var(--ok-ink, #166534); background:var(--ok-bg, #dcfce7); border-radius:999px; padding:1px 7px; white-space:nowrap; }

/* v268: teacher recording sets — studio (teacher) and "From my teachers" (student) */
.ts-form .teacher-search{ margin-bottom:6px; }
.ts-rec-row{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:6px; }
.ts-rec-row #tsRecBtn{ margin:0; min-height:44px; }
.ts-rec-row #tsRecBtn.on{ background:#dc2626 !important; border-color:#dc2626 !important; color:#fff !important; }
.ts-preview{ flex:1 1 220px; min-width:0; } .ts-preview audio{ width:100%; }
.ts-en-note{ font-weight:600; font-size:12px; color:var(--muted,#4f5d57); text-transform:none; letter-spacing:0; }
.ts-set{ border:1px solid var(--paper-dark,#e7dcc2); border-radius:14px; padding:10px 12px; margin:0 0 10px; background:var(--card,#fff); }
.ts-set-h{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; }
.ts-set b{ font-size:15px; } .ts-set small{ display:block; color:var(--muted,#4f5d57); font-size:12.5px; }
.ts-set summary{ cursor:pointer; list-style:none; } .ts-set summary::-webkit-details-marker{ display:none; }
.ts-set summary::after{ content:'▾'; float:right; color:var(--muted,#4f5d57); } .ts-set[open] summary::after{ content:'▴'; }
.ts-set-acts{ display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 4px; align-items:center; }
.ts-set-acts button{ margin:0 !important; min-height:38px; padding:6px 12px !important; width:auto !important; }
.ts-set-acts .ts-who{ width:auto; max-width:100%; margin:0 !important; min-height:38px; }
.ts-lines{ list-style:none; margin:6px 0 0; padding:0; counter-reset:ts; }
.ts-line{ display:flex; align-items:center; gap:10px; padding:7px 4px; border-top:1px solid var(--paper,#f4efe2); }
.ts-line > span:nth-child(2){ flex:1; min-width:0; } .ts-line .ts-vn{ font-weight:700; font-size:15px; } .ts-line small{ font-size:12.5px; }
.ts-line.now{ background:var(--ok-bg,#dcfce7); border-radius:10px; }
.ts-line .fav-icon-btn{ min-width:36px; min-height:36px; }
.ts-line .ts-play.on{ background:var(--cover,#0F766E) !important; color:#fff !important; border-radius:999px; }
.ts-line-acts{ display:flex; gap:2px; } .ts-line-acts button[disabled]{ opacity:.3; }
.ts-pick-row{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; }
.vc-tone-auto{ display:inline-block; font-size:11.5px; font-weight:700; color:var(--muted,#4f5d57); background:var(--paper,#f4efe2); border-radius:999px; padding:1px 8px; font-style:normal; }
body.dark-mode .ts-set{ background:var(--card); border-color:rgba(255,255,255,.12); }
body.dark-mode .ts-line{ border-color:rgba(255,255,255,.08); }

/* v269 · B1–B2 lessons (131-upper-levels.js) */
.vc-up-lv{ display:inline-block; font-size:11px; font-weight:800; letter-spacing:.04em; padding:1px 7px; border-radius:999px; background:var(--ok-bg,#d7f5e6); color:var(--ok-ink,#065f46); vertical-align:middle; margin-left:4px; }
.vc-up-formula{ font-size:13.5px; font-weight:800; letter-spacing:.01em; background:rgba(15,118,110,.08); border-radius:8px; padding:6px 10px; margin:4px 0 6px; overflow-wrap:anywhere; }
.vc-up-pat .vc-up-ex{ display:block; width:100%; text-align:left; margin-bottom:6px; padding:10px 14px; }
.vc-up-pat .vc-up-en{ font-size:12px; font-weight:400; opacity:.78; margin-top:2px; }
.vc-up-pat .vc-up-practice{ display:block; margin:8px 0 2px; min-height:40px; }
body.dark-mode .vc-up-formula{ background:rgba(94,234,212,.10); }

/* v270 · classroom: the call bar always fits (247-call-fit.js) */
#liveShell.vc-bar-tight .live-bottombar .live-input{ display:none !important; }
#liveShell.vc-bar-tighter .live-bottombar .live-acts{ gap:2px !important; }
#liveShell.vc-bar-tighter .live-bottombar .live-act{ min-width:44px !important; padding-left:2px !important; padding-right:2px !important; }
#liveShell.vc-bar-tighter .live-bottombar .live-act .la-lb{ font-size:10.5px !important; }

/* v270 · 🎲 Activities menu (was 🧰 Teach): name on one line, what it does underneath */
#vcTeachMenu.vc-teach-menu{ width:min(320px, calc(100vw - 16px)); max-height:min(76vh, calc(100vh - 140px)); overflow-y:auto; }
#vcTeachMenu .vc-tm-head{ padding:10px 12px 4px; }
#vcTeachMenu .vc-tm-title{ display:block; font-size:15px; color:#fff; }
#vcTeachMenu .vc-tm-sub{ display:block; font-size:12px; color:rgba(255,255,255,.78); margin-top:2px; line-height:1.35; }
#vcTeachMenu .vc-tm-lang{ margin:6px 12px 6px; }
#vcTeachMenu .vc-tm-item{ align-items:flex-start; text-align:left; gap:10px; }
#vcTeachMenu .vc-tm-item .lmi-icon{ font-size:18px; line-height:1.2; flex:none; }
#vcTeachMenu .lmi-txt{ display:flex; flex-direction:column; min-width:0; }
#vcTeachMenu .lmi-txt .lmi-t{ font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#vcTeachMenu .lmi-txt .lmi-hint{ margin-left:0 !important; font-size:12px; opacity:.72; white-space:normal; line-height:1.3; }

/* v270 · the room tour is offered under the call header, not over the call bar */
#vcTourHint.vth-room{ top:calc(env(safe-area-inset-top, 0px) + 112px); bottom:auto !important; left:50% !important; right:auto !important; transform:translateX(-50%) !important; z-index:9450; }

/* Offline downloads stay readable in both settings layouts. */
.vc259-row:has(#offlineDownloads){display:block!important}
.vc259-row:has(#offlineDownloads)>.vc259-l{margin-bottom:12px}
#offlineDownloads{box-sizing:border-box;max-width:100%;padding:16px;border:1px solid var(--border, #bcd5c8);border-radius:16px;background:var(--card, #f5f9ef)}
#offlineDownloads h5{font-size:16px;font-weight:700;margin:20px 0 8px}
#offlineDownloads label{font-size:13px;font-weight:600}
#offlineDownloads select{min-height:42px;padding:8px;border:1px solid var(--border, #bcd5c8);border-radius:10px;background:var(--card, #fff);color:inherit}
#offlineDownloads progress{accent-color:#0f766e;margin:12px 0}
#offlineDownloads [hidden]{display:none!important}
#offlineDownloads .section-note{line-height:1.55;overflow-wrap:anywhere}

/* v272 · mini games: no-timer switch, wrong answer waits for Next, retry + review, tone games door */
.mg-untimed{ display:flex; align-items:center; gap:8px; justify-content:center; margin:10px auto 4px; font-size:14px; font-weight:600; cursor:pointer; }
.mg-untimed input{ width:18px; height:18px; accent-color:var(--cover,#0F766E); }
.mg-fb .mg-next{ display:block; margin:12px auto 0; min-width:140px; }
.mg-review-added{ margin:10px 0; padding:10px 12px; border-radius:12px; background:var(--ok-bg,#d7f5e6); color:var(--ok-ink,#065f46); font-weight:700; font-size:14px; display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; }
.mg-result .mg-retry{ display:block; margin:12px auto 6px; }
.mg-tone-pick{ display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:12px; margin-top:12px; }
body.dark-mode .mg-review-added{ background:rgba(16,185,129,.16); color:#a7f3d0; }

/* v315 · the empty teacher list already says "Are you a Vietnamese teacher? Set up your profile" — don't repeat it below */
body:has(#teacherEmptyApply) .teacher-apply-note{ display:none; }