:root {
  --bg: var(--tg-theme-bg-color, #0f1115);
  --surface: var(--tg-theme-secondary-bg-color, #191c22);
  --surface-soft: color-mix(in srgb, var(--surface) 74%, var(--bg));
  --text: var(--tg-theme-text-color, #f5f7fa);
  --hint: var(--tg-theme-hint-color, #9298a2);
  --accent: var(--tg-theme-button-color, #5b8cff);
  --accent-text: var(--tg-theme-button-text-color, #ffffff);
  --line: color-mix(in srgb, var(--hint) 22%, transparent);
  --danger: #ff6570;
  --success: #4bd37b;
  --warning: #f4bd4f;
  --radius: 17px;
}

* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
[hidden] { display:none !important; }
html, body { width:100%; max-width:100%; min-height:100%; margin:0; overflow-x:hidden; }
html { background:var(--bg); }
body {
  padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);
  background:var(--bg); color:var(--text);
  font-family:-apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
  touch-action:pan-y; overscroll-behavior-x:none;
}
button, input, select, textarea { font:inherit; }
button { cursor:pointer; }
.shell, main, .screen { width:100%; max-width:100%; min-width:0; }
.shell { max-width:720px; min-height:100vh; margin:0 auto; padding:0 16px 104px; overflow-x:clip; }

.topbar { padding:22px 2px 10px; }
.today-heading { min-width:0; }
.today-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; min-width:0; }
.market-widget { min-width:0; max-width:62%; margin-top:1px; padding:0; border:0; background:transparent; color:var(--hint); text-align:right; line-height:1.22; }
.market-widget strong, .market-widget span { display:block; overflow-wrap:anywhere; }
.market-widget strong { color:var(--text); font-size:12px; }
.market-widget span { margin-top:2px; font-size:10px; }
.market-widget .market-leaders { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.market-widget.near strong { color:var(--warning); }
.market-widget.close strong { color:#ff8b3d; }
.market-widget.below strong { color:var(--danger); }
.market-details { margin-top:9px; padding:10px 11px; border:1px solid var(--line); border-radius:13px; background:var(--surface-soft); color:var(--hint); font-size:11px; line-height:1.45; }
.market-details b { color:var(--text); font-weight:700; }
.market-details div + div { margin-top:3px; }
@media (max-width:370px) { .today-title-row { gap:8px; } .market-widget { max-width:64%; } .market-widget .market-leaders { display:none; } }
.eyebrow { color:var(--hint); font-size:13px; font-weight:650; text-transform:capitalize; }
h1 { margin:3px 0 0; font-size:31px; line-height:1.12; letter-spacing:-.8px; }
.page-title { margin:22px 2px 18px; }
.page-title h1 { margin:0; }
.page-title p { margin:5px 0 0; color:var(--hint); font-size:13px; }

.today-summary { display:flex; flex-wrap:wrap; gap:7px; min-height:32px; margin:10px 0 2px; }
.today-summary span { padding:7px 10px; border:1px solid var(--line); border-radius:999px; background:var(--surface-soft); color:var(--hint); font-size:12px; }
.today-summary b { color:var(--text); font-size:14px; }
.today-summary .success, .today-summary .success b { color:var(--success); }
.today-summary .danger, .today-summary .danger b, .danger { color:var(--danger); }
.plan-warnings { display:flex; flex-wrap:wrap; gap:7px; margin-top:10px; }
.plan-warnings span { width:100%; padding:9px 11px; border-radius:12px; background:color-mix(in srgb, var(--warning) 11%, transparent); color:var(--warning); font-size:12px; line-height:1.35; }
.section-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:24px 2px 10px; }
.section-head h2 { margin:0; font-size:19px; letter-spacing:-.2px; }
.text-btn { min-height:40px; padding:7px 0; border:0; background:transparent; color:var(--accent); font-weight:680; }

.stack, .timeline { display:grid; gap:9px; }
.timeline { position:relative; }
.card { min-width:0; padding:14px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }
.plan-item { display:grid; grid-template-columns:54px minmax(0, 1fr); gap:11px; align-items:start; }
.plan-marker { min-width:0; padding-top:2px; color:var(--accent); text-align:left; }
.plan-marker strong, .plan-marker small { display:block; line-height:1.15; }
.plan-marker strong { font-size:14px; font-weight:780; }
.plan-marker small { margin-top:4px; color:var(--hint); font-size:10px; overflow-wrap:anywhere; }
.plan-content { min-width:0; }
.plan-kicker { margin-bottom:5px; color:var(--hint); font-size:11px; font-weight:700; letter-spacing:.15px; }
.plan-title { font-size:16px; font-weight:730; line-height:1.3; overflow-wrap:anywhere; }
.plan-meta { margin-top:5px; color:var(--hint); font-size:12px; line-height:1.4; overflow-wrap:anywhere; }
.plan-details, .task-details { margin-top:9px; color:var(--hint); font-size:13px; line-height:1.45; overflow-wrap:anywhere; white-space:pre-wrap; }
.plan-details summary, .task-details summary { min-height:36px; padding:8px 0 3px; cursor:pointer; color:var(--hint); font-weight:620; list-style-position:inside; }
.plan-details > div { padding:7px 0 2px; border-top:1px solid var(--line); }
.status { display:inline-flex; align-items:center; margin-left:5px; padding:2px 6px; border-radius:999px; background:var(--surface-soft); color:var(--hint); font-weight:700; }
.status.ready, .status.review { background:color-mix(in srgb, var(--success) 13%, transparent); color:var(--success); }
.status.working { background:color-mix(in srgb, var(--accent) 13%, transparent); color:var(--accent); }
.status.needs_info, .status.error { background:color-mix(in srgb, var(--warning) 13%, transparent); color:var(--warning); }
.solution-note { margin-top:8px; padding:9px 10px; border-radius:11px; background:var(--surface-soft); color:var(--hint); font-size:12px; line-height:1.4; }
.plan-actions { margin-top:12px; }
#unscheduledHint { text-align:center; }
#unscheduledHint .text-btn { margin-top:6px; font-size:13px; }

.plan-task-compact.task { display:block; gap:0; padding:0; overflow:hidden; }
.plan-task-compact > summary {
  position:relative; min-width:0; min-height:70px; display:grid; grid-template-columns:54px minmax(0, 1fr);
  gap:11px; align-items:start; padding:12px 14px; cursor:pointer; list-style:none;
}
.plan-task-compact > summary::-webkit-details-marker { display:none; }
.plan-task-compact > summary::after {
  content:'›'; position:absolute; right:13px; margin-top:18px; color:var(--hint);
  font-size:20px; line-height:1; transform:rotate(90deg); transition:transform .15s;
}
.plan-task-compact[open] > summary::after { transform:rotate(-90deg); }
.plan-task-compact > summary .plan-content { padding-right:15px; }
.task-expand { padding:0 14px 13px 79px; }
.task-expand .plan-details { margin-top:0; }
.task-expand .plan-actions { margin-top:9px; }

.lesson-tasks { margin-top:12px; padding:10px 0 0 10px; border-top:1px solid var(--line); border-left:2px solid color-mix(in srgb, var(--accent) 55%, transparent); }
.lesson-tasks-head, .cluster-head { display:flex; align-items:center; justify-content:space-between; gap:9px; }
.lesson-tasks-head { margin:0 2px 5px; color:var(--hint); font-size:11px; font-weight:720; }
.nested-task-list { min-width:0; display:grid; gap:3px; }
.nested-task { min-width:0; border-bottom:1px solid var(--line); }
.nested-task:last-child { border-bottom:0; }
.nested-task > summary { grid-template-columns:24px minmax(0, 1fr); min-height:58px; padding:8px 22px 8px 0; }
.nested-task > summary::after { right:2px; margin-top:13px; }
.nested-task .plan-marker { color:var(--accent); }
.nested-task .plan-marker strong { font-size:16px; }
.nested-task .plan-kicker { margin-bottom:2px; }
.nested-task .plan-title { font-size:14px; line-height:1.25; }
.nested-task .plan-meta { margin-top:3px; font-size:11px; }
.nested-task .task-expand { padding:0 2px 10px 24px; }

.timeline-cluster { padding:12px 14px; }
.cluster-head strong { display:block; margin-top:2px; font-size:15px; }
.cluster-head + .nested-task-list { margin-top:5px; }
.timeline-overflow { min-width:0; }
.timeline-overflow > summary { min-height:42px; display:flex; align-items:center; justify-content:center; cursor:pointer; list-style:none; color:var(--accent); font-size:12px; font-weight:720; }
.timeline-overflow > summary::-webkit-details-marker { display:none; }
.timeline-overflow .less-label { display:none; }
.timeline-overflow[open] > summary .more-label { display:none; }
.timeline-overflow[open] > summary .less-label { display:inline; }
.related-overflow { border-bottom:1px solid var(--line); }
.timeline-main-overflow > summary { border:1px solid var(--line); border-radius:13px; background:var(--surface-soft); }
.timeline-more { margin-top:9px; }

.task { display:grid; gap:11px; }
.task-main { min-width:0; }
.task-title { font-size:15px; font-weight:710; line-height:1.3; overflow-wrap:anywhere; }
.meta { display:flex; flex-wrap:wrap; gap:7px; margin-top:5px; color:var(--hint); font-size:12px; line-height:1.35; }
.pill { padding:2px 7px; border-radius:999px; background:color-mix(in srgb, var(--accent) 14%, transparent); color:var(--accent); }
.task-actions { display:flex; flex-wrap:wrap; gap:7px; justify-content:flex-start; }
.icon-btn, .primary-btn, .secondary-btn { min-height:44px; border-radius:12px; padding:10px 12px; font-weight:700; }
.icon-btn { width:auto; border:1px solid var(--line); background:transparent; color:var(--text); font-size:13px; }
.icon-btn.done { color:var(--success); }
.solve { color:var(--accent); }
.primary-btn { border:0; background:var(--accent); color:var(--accent-text); }
.secondary-btn { border:1px solid var(--line); background:transparent; color:var(--text); }
.compact { min-height:40px; padding:8px 11px; font-size:13px; }
button:disabled { cursor:default; opacity:.5; }
.task-group > summary { min-height:44px; padding:5px 3px; cursor:pointer; font-weight:710; line-height:1.5; }
.task-group > .stack { margin-top:11px; }
.task-overflow > summary { min-height:40px; cursor:pointer; color:var(--accent); font-size:13px; }

.event-time { padding-top:2px; color:var(--accent); font-size:13px; font-weight:760; }
details.event { display:block; }
details.event summary { display:grid; grid-template-columns:58px minmax(0, 1fr); gap:10px; cursor:pointer; list-style:none; }
details.event summary::-webkit-details-marker { display:none; }
.event-title { font-weight:690; line-height:1.3; overflow-wrap:anywhere; }
details.event summary .meta { display:block; line-height:1.4; }
.event-teachers { display:block; margin-top:4px; font-size:13px; line-height:1.35; }
.event-description { margin-top:12px; padding-top:12px; border-top:1px solid var(--line); color:var(--hint); font-size:13px; line-height:1.45; overflow-wrap:anywhere; white-space:pre-wrap; }
.week-range { margin:-4px 2px 10px; color:var(--hint); font-size:12px; text-align:center; }
.week-day { min-width:0; border-bottom:1px solid var(--line); }
.week-day > summary { min-height:50px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 2px; cursor:pointer; list-style:none; font-size:14px; font-weight:720; text-transform:capitalize; }
.week-day > summary::-webkit-details-marker { display:none; }
.week-day-count { min-width:26px; padding:3px 7px; border-radius:999px; background:var(--surface); color:var(--hint); font-size:11px; text-align:center; }
.week-day[open] { padding-bottom:14px; }
.week-day[open] > summary { color:var(--accent); }
.week-timeline { gap:7px; }
.week-timeline > .card { padding:12px; }
.week-timeline > .plan-task-compact { padding:0; }

.create-panel { margin-bottom:12px; }
.create-panel summary { min-height:40px; cursor:pointer; color:var(--accent); font-weight:680; }
.create-panel form, .spanish-form { display:grid; gap:12px; padding-top:14px; }
.create-panel label, .spanish-form label { display:grid; gap:6px; color:var(--hint); font-size:13px; }
.create-panel input, .create-panel select, .create-panel textarea,
.spanish-form input, .spanish-form select {
  width:100%; min-width:0; padding:12px; border:1px solid var(--line); border-radius:11px;
  background:var(--bg); color:var(--text); color-scheme:dark; font-size:16px;
}
.upload-panel > summary { min-height:40px; cursor:pointer; color:var(--accent); font-weight:700; }
.upload-summary { min-width:0; display:grid; gap:3px; }
.upload-summary small { color:var(--hint); font-size:11px; font-weight:500; line-height:1.35; overflow-wrap:anywhere; }
.upload-panel form { display:grid; gap:11px; padding-top:12px; }
.upload-panel p { margin:0; color:var(--hint); font-size:13px; line-height:1.45; }
.upload-panel label { display:grid; gap:6px; color:var(--hint); font-size:13px; }
.upload-panel textarea { width:100%; min-width:0; resize:vertical; padding:11px; border:1px solid var(--line); border-radius:11px; background:var(--bg); color:var(--text); color-scheme:dark; font-size:16px; line-height:1.4; }
.field-hint { color:var(--hint); font-size:11px; font-weight:400; }
.upload-panel input[type="file"] { width:100%; min-width:0; padding:7px; border:1px solid var(--line); border-radius:11px; background:var(--bg); color:var(--hint); font-size:13px; }
.upload-panel input[type="file"]::file-selector-button { min-height:36px; margin-right:9px; padding:7px 10px; border:0; border-radius:9px; background:var(--surface); color:var(--text); font-weight:650; }
.file-picker { position:relative; }
.file-picker input[type="file"] { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0; }
.file-picker-control { min-width:0; min-height:48px; display:grid; grid-template-columns:auto minmax(0, 1fr); align-items:center; gap:10px; padding:6px; border:1px solid var(--line); border-radius:11px; background:var(--bg); cursor:pointer; }
.file-picker-button { min-height:36px; display:grid; place-items:center; padding:7px 10px; border-radius:9px; background:var(--surface); color:var(--text); font-size:13px; font-weight:680; }
.file-picker-count { min-width:0; overflow:hidden; color:var(--hint); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.upload-files { min-width:0; display:grid; gap:6px; }
.upload-file { min-width:0; display:grid; grid-template-columns:minmax(0, 1fr) auto; align-items:center; gap:8px; padding:8px 10px; border-radius:10px; background:var(--surface-soft); color:var(--hint); font-size:12px; }
.upload-file span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.upload-file button { min-width:38px; min-height:36px; padding:4px 8px; border:0; background:transparent; color:var(--accent); font-size:12px; font-weight:680; }
.upload-status { min-height:18px; color:var(--hint); font-size:12px; line-height:1.4; }
.segmented { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:2px; margin-bottom:12px; padding:4px; border-radius:14px; background:var(--surface); }
.segmented button { min-width:0; min-height:42px; padding:8px 5px; border:0; border-radius:11px; background:transparent; color:var(--hint); font-size:13px; font-weight:680; }
.segmented button.active { background:var(--bg); color:var(--text); }
.spanish-tabs { grid-template-columns:repeat(2, minmax(0, 1fr)); }

.habit-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:9px; }
.habit { min-height:112px; display:flex; flex-direction:column; justify-content:space-between; }
.habit .emoji { font-size:22px; }
.habit strong { font-size:20px; }
.habit small { color:var(--hint); line-height:1.2; }
.habit.failed { outline:1px solid color-mix(in srgb, var(--danger) 60%, transparent); }
.habit .fail-btn { min-height:38px; padding:7px 0 0; border:0; background:transparent; color:var(--hint); text-align:left; font-size:11px; }
.settings-note { margin:8px 0; color:var(--hint); font-size:13px; line-height:1.45; overflow-wrap:anywhere; }
.mail-alert { min-width:0; display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:10px; padding:9px 11px; border-radius:12px; background:color-mix(in srgb, var(--warning) 11%, transparent); color:var(--warning); font-size:12px; line-height:1.35; }
.mail-alert span { min-width:0; overflow-wrap:anywhere; }
.mail-alert .text-btn { flex:0 0 auto; min-height:34px; padding:4px; color:inherit; font-size:12px; }
.mail-alert.danger { background:color-mix(in srgb, var(--danger) 11%, transparent); color:var(--danger); }
.mail-panel { margin-bottom:12px; padding:0; overflow:hidden; }
.mail-panel > summary { min-width:0; min-height:62px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 14px; cursor:pointer; list-style:none; }
.mail-panel > summary::-webkit-details-marker { display:none; }
.mail-status-main { min-width:0; display:grid; grid-template-columns:10px minmax(0, 1fr); gap:10px; align-items:start; }
.mail-dot { width:9px; height:9px; margin-top:5px; border-radius:50%; background:var(--hint); }
.mail-status-main strong, .mail-status-main small { display:block; min-width:0; overflow-wrap:anywhere; }
.mail-status-main strong { font-size:15px; line-height:1.3; }
.mail-status-main small { margin-top:3px; color:var(--hint); font-size:11px; line-height:1.35; }
.mail-chevron { flex:0 0 auto; color:var(--hint); font-size:23px; line-height:1; transform:rotate(90deg); transition:transform .15s; }
.mail-panel[open] .mail-chevron { transform:rotate(-90deg); }
.mail-panel-body { min-width:0; padding:12px 14px 14px; border-top:1px solid var(--line); }
.mail-detail, .mail-empty, .mail-privacy { color:var(--hint); font-size:12px; line-height:1.45; overflow-wrap:anywhere; }
.mail-detail { margin:0; }
.mail-empty { margin:12px 0 0; }
.mail-privacy { margin:11px 0 0; font-size:10px; }
.mail-metrics { min-width:0; display:flex; flex-wrap:wrap; gap:6px; margin-top:11px; }
.mail-metrics span { min-width:0; padding:6px 8px; border-radius:10px; background:var(--surface-soft); color:var(--hint); font-size:11px; overflow-wrap:anywhere; }
.mail-metrics b { color:var(--text); font-size:13px; }
.mail-last-seen { margin-top:9px; color:var(--hint); font-size:11px; line-height:1.4; overflow-wrap:anywhere; }
.mail-recent { min-width:0; margin-top:14px; }
.mail-recent > strong { display:block; margin-bottom:3px; font-size:12px; }
.mail-recent-row { min-width:0; display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:8px; padding:8px 0; border-bottom:1px solid var(--line); }
.mail-recent-row:last-child { border-bottom:0; }
.mail-recent-row span, .mail-recent-row b, .mail-recent-row small { min-width:0; display:block; overflow-wrap:anywhere; }
.mail-recent-row b { font-size:12px; line-height:1.35; }
.mail-recent-row small, .mail-recent-row time { margin-top:2px; color:var(--hint); font-size:10px; line-height:1.35; }
.mail-recent-row time { white-space:nowrap; }
.mail-recent-row small::before { content:""; display:inline-block; width:6px; height:6px; margin:0 5px 1px 0; border-radius:50%; background:var(--hint); }
.mail-outcome-created small::before, .mail-outcome-retired small::before { background:var(--success); }
.mail-outcome-retrying small::before { background:var(--warning); }
.mail-outcome-ignored small::before, .mail-outcome-duplicate small::before { background:var(--line); }
.mail-recent-more { margin-top:1px; }
.mail-recent-more > summary { padding:8px 0 4px; color:var(--accent); font-size:11px; cursor:pointer; list-style:none; }
.mail-recent-more > summary::-webkit-details-marker { display:none; }
.mail-recent-more > summary::after { content:" ›"; }
.mail-recent-more[open] > summary::after { content:" ⌃"; }
.mail-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:13px; }
.mail-actions button { min-width:0; }
.mail-panel.success .mail-dot { background:var(--success); }
.mail-panel.warning .mail-dot { background:var(--warning); }
.mail-panel.danger .mail-dot { background:var(--danger); }

.screen { display:none; }
.screen.active { display:block; animation:appear .15s ease-out; }
@keyframes appear { from { opacity:.5; transform:translateY(3px); } }
.empty { display:grid; gap:5px; padding:27px 16px; color:var(--hint); text-align:center; }
.empty strong { color:var(--text); }
.version { margin-top:24px; color:var(--hint); font-size:12px; text-align:center; }
.bottom-nav {
  position:fixed; z-index:20; left:50%; bottom:0; transform:translateX(-50%);
  width:min(720px, 100%); display:grid; grid-template-columns:repeat(5, minmax(0, 1fr));
  padding:7px 8px calc(7px + env(safe-area-inset-bottom)); border-top:1px solid var(--line);
  background:color-mix(in srgb, var(--bg) 94%, transparent); backdrop-filter:blur(18px);
}
.bottom-nav button { position:relative; min-width:0; min-height:49px; display:grid; place-items:center; gap:2px; padding:5px 2px; border:0; background:transparent; color:var(--hint); }
.bottom-nav button span { font-size:20px; line-height:1; }
.bottom-nav button small { max-width:100%; overflow:hidden; font-size:10px; text-overflow:ellipsis; }
.bottom-nav button.active { color:var(--accent); }
.bottom-nav button.attention::after { content:""; position:absolute; top:5px; right:calc(50% - 16px); width:7px; height:7px; border:2px solid var(--bg); border-radius:50%; background:var(--danger); }
.toast {
  position:fixed; z-index:30; left:50%; bottom:88px; transform:translate(-50%, 14px);
  max-width:calc(100% - 32px); padding:10px 14px; border-radius:12px;
  background:var(--text); color:var(--bg); opacity:0; pointer-events:none;
  transition:.18s; font-size:13px; text-align:center;
}
.toast.show { opacity:1; transform:translate(-50%, 0); }
.skeleton { min-height:70px; opacity:.42; animation:pulse 1s infinite alternate; }
@keyframes pulse { to { opacity:.78; } }

.translation-status { min-height:18px; margin-top:-6px; color:var(--hint); font-size:12px; line-height:1.4; }
.practice-prompt { padding:14px 0 4px; line-height:1.5; }
.practice-prompt strong { color:var(--text); font-size:22px; }
#practiceResult { line-height:1.5; }
#practiceResult .correct, .word-list .correct { color:var(--success); }
#practiceResult .incorrect, .word-list .incorrect { color:var(--danger); }
#conjugationReference { margin-top:10px; }
#conjugationReference > summary { min-height:40px; cursor:pointer; font-weight:680; }
#conjugationReference .spanish-form { margin-top:14px; }
.spanish-reading p { margin-bottom:2px; font-size:17px; line-height:1.65; }
.word-list { display:grid; gap:8px; margin:12px 0; line-height:1.45; }
.word-list > div { min-width:0; overflow-wrap:anywhere; }
.spanish-word-head { min-width:0; display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:5px 10px; }
.spanish-word-head > span { color:var(--hint); font-size:12px; white-space:nowrap; }
.spanish-word-row { min-width:0; display:grid; grid-template-columns:minmax(0, 1fr) auto; align-items:baseline; gap:5px 9px; }
.spanish-word-value { min-width:0; overflow-wrap:anywhere; }
.spanish-word-row .text-btn { min-height:30px; padding:2px 0 2px 6px; font-size:12px; }
.word-tag { display:inline-block; margin-left:5px; color:var(--hint); font-size:11px; font-weight:500; white-space:nowrap; }
.word-list-overflow { margin-top:-3px; }
.word-list-overflow > summary { min-height:36px; display:flex; align-items:center; cursor:pointer; list-style:none; color:var(--accent); font-size:12px; font-weight:700; }
.word-list-overflow > summary::-webkit-details-marker { display:none; }
.word-list-overflow > summary::after { content:"↓"; margin-left:5px; }
.word-list-overflow[open] > summary::after { content:"↑"; }
.word-list-overflow .word-list { margin-top:5px; }
.flashcard-wrap { display:grid; gap:12px; }
.flashcard { min-height:190px; width:100%; display:grid; place-items:center; align-content:center; gap:13px; padding:22px 16px; border:1px solid var(--line); border-radius:16px; background:var(--bg); color:var(--text); text-align:center; }
.flashcard strong { font-size:24px; overflow-wrap:anywhere; }
.flashcard-direction, #spanishCardHint { color:var(--hint); font-size:12px; }
.card-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.spanish-group h3 { margin:18px 2px 8px; font-size:16px; text-transform:capitalize; }
.tense { margin-bottom:7px; }
.tense summary { min-height:40px; cursor:pointer; font-weight:680; text-transform:capitalize; }
.tense-forms { display:grid; gap:9px; margin-top:13px; }
.tense-forms > div { display:grid; grid-template-columns:85px minmax(0, 1fr); gap:8px; font-size:13px; }
.tense-forms span { color:var(--hint); }

@media (max-width:520px) {
  .habit-grid { grid-template-columns:1fr; }
  .habit { min-height:auto; flex-direction:row; align-items:center; }
  .habit .fail-btn { text-align:right; }
}
@media (max-width:370px) {
  .shell { padding-right:12px; padding-left:12px; }
  .plan-item { grid-template-columns:48px minmax(0, 1fr); gap:9px; }
  .plan-title { font-size:15px; }
  .bottom-nav button small { font-size:9px; }
  .mail-actions { grid-template-columns:1fr; }
  .mail-recent-row { grid-template-columns:1fr; gap:1px; }
  .mail-recent-row time { white-space:normal; }
}