/*
  Palabras v6.2 Theme Stability Pass
  Purpose: consolidate the final theme behavior from the stable v5 build without changing app logic.
  Scope: CSS-only. Keep current visuals, reduce theme surprises, and create a documented baseline for later cleanup.
*/

*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
:root{
  --tc:#C1440E;--tl:#F5E6DF;--sage:#4A7A4A;
  --cr:#FAF6F1;--cr2:#F0E8DF;--cr3:#E0D0C0;--wh:#FFFFFF;--bd:#E0D0C0;
  --tx:#2C1A0E;--tx2:#7A5040;--tx3:#A08070;
  --pVerb-bg:#FFF0E8;--pVerb-tx:#B03000;--pNoun-bg:#FFF8E0;--pNoun-tx:#8B5E00;
  --pAdv-bg:#F0ECFF;--pAdv-tx:#5C3A9A;--pAdj-bg:#E8F5E8;--pAdj-tx:#2A6A2A;
  --pPhr-bg:#E8F0FF;--pPhr-tx:#1A4A9A;--pOth-bg:#F0F0F0;--pOth-tx:#505050;
  --l1-bg:#FFF0E8;--l1-tx:#B03000;--l2-bg:#FFF8E0;--l2-tx:#8B5E00;
  --l3-bg:#F0ECFF;--l3-tx:#5C3A9A;--l4-bg:#E8F5E8;--l4-tx:#2A6A2A;--l5-bg:#E8F0FF;--l5-tx:#1A4A9A;
}

/* Theme: Dark mode is isolated to a single class on html/body. Review controls never touch this class. */
html.theme-dark, body.theme-dark{
  --cr:#160E08;--cr2:#221408;--cr3:#2E1C0E;--wh:var(--bg);--bd:#3A2518;--tl:#2A1408;
  --tx:#F0E0D0;--tx2:#C0A080;--tx3:#80604A;
  --pVerb-bg:#3A1A08;--pVerb-tx:#FF9060;--pNoun-bg:#3A2A00;--pNoun-tx:#FFCC60;
  --pAdv-bg:#1E1040;--pAdv-tx:#B090FF;--pAdj-bg:#0A2A0A;--pAdj-tx:#70D870;
  --pPhr-bg:#0A1A3A;--pPhr-tx:#70AAFF;--pOth-bg:#282828;--pOth-tx:#AAAAAA;
  --l1-bg:#3A1A08;--l1-tx:#FF9060;--l2-bg:#3A2A00;--l2-tx:#FFCC60;
  --l3-bg:#1E1040;--l3-tx:#B090FF;--l4-bg:#0A2A0A;--l4-tx:#70D870;--l5-bg:#0A1A3A;--l5-tx:#70AAFF;
}
html.theme-dark .hm-day, body.theme-dark .hm-day{background:#2A1A10}
html.theme-dark .hm-day[data-l="1"], body.theme-dark .hm-day[data-l="1"]{background:#5A2A10}
html.theme-dark .hm-day[data-l="2"], body.theme-dark .hm-day[data-l="2"]{background:#8A4020}
html.theme-dark .hm-day[data-l="3"], body.theme-dark .hm-day[data-l="3"]{background:#BA5A30}
html.theme-dark .hm-day[data-l="4"], body.theme-dark .hm-day[data-l="4"]{background:var(--tc)}
body{font-family:-apple-system,sans-serif;background:var(--cr);color:var(--tx);min-height:100vh;font-size:15px;transition:background .2s,color .2s}
button{cursor:pointer;border:none;background:none;font-family:inherit;font-size:15px;color:inherit;transition:opacity .1s}
button:active{opacity:.7}
input,select,textarea{font-family:inherit;font-size:14px;border:1.5px solid var(--bd);border-radius:10px;padding:9px 11px;background:var(--wh);color:var(--tx);width:100%;outline:none;transition:border-color .15s}
input:focus,select:focus,textarea:focus{border-color:var(--tc)}
.bp{background:var(--tc);color:#fff;padding:10px 18px;border-radius:10px;font-weight:600;white-space:nowrap;font-size:13px}
.bs{background:var(--cr2);color:var(--tx);padding:10px 18px;border-radius:10px;border:1.5px solid var(--bd);font-weight:500;white-space:nowrap;font-size:13px}
.bdgr{background:#C62828;color:#fff;padding:10px 18px;border-radius:10px;font-weight:600;font-size:13px}

/* Review controls: grouped segmented controls */
.review-controls{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  margin:10px 0 12px;
  flex-wrap:wrap;
}
.seg-group{
  display:inline-flex;
  align-items:center;
  gap:3px;
  padding:4px;
  border-radius:999px;
  background:var(--tl);
  border:1px solid var(--bd);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}
.seg-btn{
  min-width:62px;
  padding:7px 13px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  line-height:1;
  color:var(--tx2);
  background:transparent;
  border:1px solid transparent;
}
.seg-btn.on{
  background:var(--tc);
  color:white;
  border-color:rgba(0,0,0,.12);
  box-shadow:0 2px 8px rgba(0,0,0,.10);
}
.seg-btn:hover{opacity:.92}
.seg-group.view .seg-btn{min-width:42px;padding-left:11px;padding-right:11px}
@media (max-width:430px){
  .review-controls{gap:7px}
  .seg-btn{min-width:54px;padding:7px 10px;font-size:11px}
  .seg-group.view .seg-btn{min-width:38px}
}

.screen{min-height:100vh;display:flex;flex-direction:column;background:var(--cr)}
.topbar{background:var(--wh);border-bottom:1px solid var(--bd);padding:10px 12px;display:flex;align-items:center;gap:8px;position:sticky;top:0;z-index:40}
.topbar-title{font-family:Georgia,serif;font-size:1.1rem;color:var(--tc)}
.topbar-sub{font-size:11px;color:var(--tx3);margin-top:1px}
.ib{width:34px;height:34px;border-radius:9px;background:var(--cr2);display:flex;align-items:center;justify-content:center;font-size:15px;border:1px solid var(--bd);flex-shrink:0;cursor:pointer}
.back-btn{display:flex;align-items:center;gap:4px;font-size:13px;color:var(--tx2);font-weight:500;padding:4px 2px}
.back-btn span{font-size:16px}
.login-outer{flex:1;display:flex;align-items:center;justify-content:center;padding:24px}
.login-box{background:var(--wh);border:1px solid var(--bd);border-radius:20px;padding:28px 20px;width:100%;max-width:360px}
.login-logo{text-align:center;margin-bottom:22px}
.login-logo .mark{font-size:2.4rem;margin-bottom:6px}
.login-logo h1{font-family:Georgia,serif;font-size:1.7rem;color:var(--tc)}
.login-logo p{font-size:12px;color:var(--tx3);margin-top:3px}
.ltabs{display:flex;border-bottom:1px solid var(--bd);margin-bottom:16px}
.ltab{flex:1;text-align:center;padding:9px;font-size:13px;font-weight:500;color:var(--tx3);border-bottom:2px solid transparent;cursor:pointer}
.ltab.on{color:var(--tc);border-bottom-color:var(--tc)}
.lerr{background:#FFEBEE;color:#C62828;border-radius:8px;padding:8px 12px;font-size:13px;margin-bottom:12px;display:none}
.lerr.show{display:block}
.lerr.success{background:#E8F5E8;color:#2A6A2A;border:1px solid #9BC89B}
.fg{margin-bottom:11px}
.fg label{display:block;font-size:11px;color:var(--tx2);margin-bottom:4px;font-weight:600;text-transform:uppercase;letter-spacing:.4px}
.demo-hint{text-align:center;margin-top:10px;font-size:12px;color:var(--tx3)}
.lang-page{flex:1;padding:16px;overflow-y:auto}
.lang-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}
.lcard{border:1.5px solid var(--bd);border-radius:14px;padding:12px 10px;cursor:pointer;background:var(--wh);text-align:left;position:relative}
.lcard.active{border-color:var(--tc);background:var(--tl)}
.lcard .lck{position:absolute;top:8px;right:8px;width:18px;height:18px;border-radius:50%;background:var(--tc);display:none;align-items:center;justify-content:center;font-size:10px;color:#fff}
.lcard.active .lck{display:flex}
.lcard .lflag{font-size:1.5rem;margin-bottom:5px}
.lcard .lname{font-size:13px;font-weight:600}
.lcard .lnat{font-size:11px;color:var(--tx3);margin-top:1px}
.lcard .lwc{font-size:11px;color:var(--tx3);margin-top:3px}
.lang-section-title{font-size:11px;font-weight:700;color:var(--tx3);text-transform:uppercase;letter-spacing:.5px;margin:16px 0 8px}
.custom-lang-form{background:var(--cr2);border-radius:12px;padding:12px;margin-top:12px}
.home-content{flex:1;padding:12px;overflow-y:auto}
.sgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.sc{background:var(--wh);border:1px solid var(--bd);border-radius:12px;padding:10px;text-align:center}
.sc .n{font-size:1.4rem;font-weight:700;color:var(--tc)}
.sc .l{font-size:11px;color:var(--tx3);margin-top:2px}
.banner{background:var(--tl);border:1px solid var(--cr3);border-radius:14px;padding:12px;margin-bottom:12px}
.banner h3{font-size:.88rem;color:var(--tc);font-weight:600;margin-bottom:3px}
.banner p{font-size:12px;color:var(--tx2);margin-bottom:10px}
.bbtns{display:flex;gap:8px;flex-wrap:wrap}
.listcard{background:var(--wh);border:1px solid var(--bd);border-radius:14px;padding:12px;margin-bottom:12px}
.row2{display:flex;gap:8px;margin-bottom:9px}
.filters{display:flex;gap:8px;margin-bottom:9px}
.filters select{flex:1;font-size:12px;padding:7px 8px}
.pill{display:inline-flex;align-items:center;padding:2px 7px;border-radius:20px;font-size:10px;font-weight:600;line-height:1.7}
.pVerb{background:var(--pVerb-bg);color:var(--pVerb-tx)}.pNoun{background:var(--pNoun-bg);color:var(--pNoun-tx)}
.pAdverb{background:var(--pAdv-bg);color:var(--pAdv-tx)}.pAdjective{background:var(--pAdj-bg);color:var(--pAdj-tx)}
.pPhrase{background:var(--pPhr-bg);color:var(--pPhr-tx)}.pOther{background:var(--pOth-bg);color:var(--pOth-tx)}
.pl1{background:var(--l1-bg);color:var(--l1-tx)}.pl2{background:var(--l2-bg);color:var(--l2-tx)}
.pl3{background:var(--l3-bg);color:var(--l3-tx)}.pl4{background:var(--l4-bg);color:var(--l4-tx)}.pl5{background:var(--l5-bg);color:var(--l5-tx)}
.ptag{background:var(--cr2);color:var(--tx2);border:1px solid var(--bd)}
.witem{border-bottom:1px solid var(--cr2);padding:9px 0;display:flex;align-items:center;gap:8px}
.witem:last-child{border-bottom:none;padding-bottom:0}.witem:first-child{padding-top:0}
.witem.wisel{background:var(--tl);border-radius:8px;padding-left:6px;padding-right:6px;margin-left:-6px;margin-right:-6px}
.winfo{flex:1;min-width:0}
.wes{font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wen{font-size:12px;color:var(--tx2);margin-top:1px}
.wpills{display:flex;gap:4px;margin-top:4px;flex-wrap:wrap}
.wacts{display:flex;gap:4px;flex-shrink:0}
.wacts button{width:30px;height:30px;border-radius:8px;background:var(--cr2);font-size:12px;display:flex;align-items:center;justify-content:center;border:1px solid var(--bd)}
.settings-screen{flex:1;overflow-y:auto}
.settings-header{padding:20px 16px 8px;border-bottom:1px solid var(--bd);background:var(--wh)}
.settings-avatar{width:56px;height:56px;border-radius:50%;background:var(--tl);border:2px solid var(--bd);display:flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:700;color:var(--tc);font-family:Georgia,serif;margin-bottom:10px}
.settings-username{font-size:1rem;font-weight:600}
.settings-meta{font-size:12px;color:var(--tx3);margin-top:2px}
.stabs{display:flex;padding:0 16px;background:var(--wh);border-bottom:1px solid var(--bd);overflow-x:auto}
.stab{padding:10px 14px;font-size:13px;font-weight:500;color:var(--tx3);border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap}
.stab.on{color:var(--tc);border-bottom-color:var(--tc)}
.settings-body{padding:12px 16px}
.sgroup{background:var(--wh);border:1px solid var(--bd);border-radius:14px;margin-bottom:14px;overflow:hidden}
.sgroup-title{font-size:11px;font-weight:700;color:var(--tx3);text-transform:uppercase;letter-spacing:.5px;padding:10px 14px 4px}
.srow{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--cr2);gap:12px}
.srow:last-child{border-bottom:none}
.srow-info{flex:1;min-width:0}
.srow-label{font-size:14px;font-weight:500}
.srow-sub{font-size:12px;color:var(--tx3);margin-top:2px}
.toggle{position:relative;width:44px;height:24px;flex-shrink:0}
.toggle input{opacity:0;width:0;height:0;position:absolute}
.tslider{position:absolute;inset:0;border-radius:24px;background:var(--cr3);cursor:pointer;transition:.2s}
.tslider:before{content:'';position:absolute;width:18px;height:18px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.2s}
.toggle input:checked+.tslider{background:var(--tc)}
.toggle input:checked+.tslider:before{transform:translateX(20px)}
.rev-screen{flex:1;overflow-y:auto}
.rev{max-width:480px;margin:0 auto;padding:12px}
.rcard{background:var(--wh);border:1px solid var(--bd);border-radius:16px;padding:22px 16px;text-align:center;margin-bottom:12px}
.rword{font-size:1.8rem;font-weight:700;color:var(--tc);font-family:Georgia,serif;margin-bottom:6px}
.rsent{font-size:13px;color:var(--tx2);font-style:italic;line-height:1.6;margin-bottom:12px}
.rtrans{font-size:1rem;color:var(--tx);padding-top:12px;border-top:1px solid var(--bd);margin-top:12px}
.modes{display:flex;gap:6px;justify-content:center;margin-bottom:12px;flex-wrap:wrap}
.mbtn{padding:5px 10px;border-radius:20px;font-size:12px;border:1.5px solid var(--bd);background:var(--wh);color:var(--tx2);font-weight:500}
.mbtn.on{background:var(--tc);color:#fff;border-color:var(--tc)}
.gbtns{display:flex;gap:10px;justify-content:center;margin-top:12px}
.gcr{background:var(--sage);color:#fff;padding:10px 24px;border-radius:10px;font-weight:700;font-size:14px}
.gwr{background:var(--cr2);color:var(--tx2);padding:10px 24px;border-radius:10px;font-weight:700;font-size:14px;border:1.5px solid var(--bd)}
.mcopts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.mcopt{padding:10px 8px;border:1.5px solid var(--bd);border-radius:10px;background:var(--wh);color:var(--tx);font-size:12px;text-align:center;cursor:pointer;font-weight:500}
.mcopt.ok{background:var(--l4-bg);border-color:var(--sage);color:var(--l4-tx)}
.mcopt.no{background:#FFEBEE;border-color:#C62828;color:#C62828}
.fb{padding:9px;border-radius:8px;margin-top:10px;text-align:center;font-weight:600;font-size:13px}
.fb.ok{background:var(--l4-bg);color:var(--l4-tx)}.fb.no{background:#FFEBEE;color:#C62828}
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:100;display:flex;align-items:flex-end;justify-content:center}
.modal{background:var(--wh);border-radius:20px 20px 0 0;padding:18px 16px;padding-bottom:calc(18px + env(safe-area-inset-bottom,14px));width:100%;max-height:92vh;overflow-y:auto}
.mhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.mhead h2{font-size:.95rem;font-weight:700;margin:0}
.mclose{font-size:18px;color:var(--tx2);width:30px;height:30px;display:flex;align-items:center;justify-content:center}
.mfoot{display:flex;gap:8px;margin-top:14px}
.mfoot button{flex:1}
.tabs{display:flex;border-bottom:1px solid var(--bd);margin-bottom:12px}
.tab{padding:8px 11px;font-size:12px;font-weight:500;color:var(--tx3);white-space:nowrap;border-bottom:2px solid transparent;cursor:pointer}
.tab.on{color:var(--tc);border-bottom-color:var(--tc)}
.brow{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.blbl{width:70px;color:var(--tx2);text-align:right;flex-shrink:0;font-size:11px}
.btrk{flex:1;background:var(--cr2);border-radius:4px;height:13px;overflow:hidden}
.bfil{height:100%;border-radius:4px}
.bcnt{width:22px;color:var(--tx3);font-size:11px;text-align:right}
.col-map{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.col-map label{font-size:11px;color:var(--tx2);margin-bottom:3px;display:block;font-weight:600}
.swi{display:flex;align-items:center;gap:10px;padding:8px;background:var(--cr2);border-radius:10px;margin-bottom:6px}
.swi label{flex:1;font-size:13px}
.tag-input-row{display:flex;flex-wrap:wrap;gap:4px;align-items:center;padding:6px 8px;background:var(--cr2);border-radius:10px;border:1.5px solid var(--bd);min-height:38px}
.tag-chip{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;background:var(--wh);border:1px solid var(--bd);border-radius:14px;font-size:12px}
.tag-chip button{font-size:11px;color:var(--tx3);padding:0;line-height:1}
.tag-input-row input{border:none;background:transparent;flex:1;min-width:80px;padding:3px 0;font-size:13px}
.tag-input-row input:focus{border:none;outline:none}
.history-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--cr2);font-size:13px}
.history-row:last-child{border-bottom:none}
.history-dot{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:6px}
.history-dot.ok{background:var(--sage)}.history-dot.no{background:#C62828}
.failed-list{max-height:200px;overflow-y:auto;border:1px solid var(--bd);border-radius:10px;margin-top:10px}
.failed-row{padding:8px 10px;border-bottom:1px solid var(--cr2);font-size:13px}
.failed-row:last-child{border-bottom:none}
.heatmap{display:flex;gap:3px;overflow-x:auto;padding:6px 2px;justify-content:center}
.hm-week{display:flex;flex-direction:column;gap:3px}
.hm-day{width:13px;height:13px;border-radius:3px;background:var(--cr2)}
.hm-day[data-l="1"]{background:#FFE0CC}.hm-day[data-l="2"]{background:#FFB380}
.hm-day[data-l="3"]{background:#E07030}.hm-day[data-l="4"]{background:var(--tc)}
.hm-legend{display:flex;align-items:center;gap:4px;justify-content:center;font-size:11px;color:var(--tx3);margin-top:8px}
.hm-legend-box{width:11px;height:11px;border-radius:2px}
.empty{text-align:center;padding:24px 16px;color:var(--tx3);font-size:13px}

.sync-status-pill{
  position:fixed;
  top:calc(10px + env(safe-area-inset-top,0px));
  left:50%;
  transform:translateX(-50%);
  z-index:450;
  display:none;
  align-items:center;
  gap:7px;
  max-width:calc(100vw - 24px);
  padding:8px 14px;
  border-radius:999px;
  font-size:12px;
  font-weight:600;
  box-shadow:0 8px 24px rgba(0,0,0,.18);
  border:1px solid rgba(255,255,255,.2);
  white-space:nowrap;
}
.sync-status-pill.show{display:flex}
.sync-status-pill.offline{background:#3D2B1F;color:#FAF6F1}
.sync-status-pill.pending{background:#7A5040;color:#FAF6F1}
.sync-status-pill.syncing{background:var(--tc);color:#fff}
.sync-status-pill.synced{background:var(--sage);color:#fff}
.sync-status-pill.failed{background:#C62828;color:#fff}
.sync-status-dot{width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.85;flex-shrink:0}

.toast{position:fixed;bottom:32px;left:50%;transform:translateX(-50%);background:#3D2B1F;color:#FAF6F1;padding:9px 18px;border-radius:10px;font-size:13px;z-index:300;white-space:nowrap;pointer-events:none;animation:fadeup .2s}
.storage-bar{height:4px;background:var(--cr2);border-radius:2px;overflow:hidden;margin-top:6px}
.storage-fill{height:100%;border-radius:2px;background:var(--sage);transition:width .3s}
.storage-fill.warn{background:#B5841C}.storage-fill.danger{background:#C62828}
@keyframes fadeup{from{opacity:0;transform:translateX(-50%) translateY(8px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}

/* Learning system v1 additions */
.sound-btn{border:0;background:transparent;color:var(--tx3);font-size:13px;vertical-align:middle;padding:2px 4px;border-radius:6px}
.sound-btn:hover{background:var(--cr2);color:var(--tc)}
html.theme-dark.theme-grey, body.theme-dark.theme-grey{
  --bg:#202124;--card:#2b2c2f;--cr2:#34363a;--cr3:#3f4146;--tx:#f1f3f4;--tx2:#c7c9cc;--tx3:#9aa0a6;--bd:#474a50;--tl:#303236;
}
html.theme-dark.theme-mono, body.theme-dark.theme-mono{
  --bg:#050505;--card:#121212;--cr2:#1c1c1c;--cr3:#2a2a2a;--tx:#ffffff;--tx2:#d8d8d8;--tx3:#9e9e9e;--bd:#303030;--tc:#ffffff;--tl:#151515;
}

/* Learning system v2 visual fixes */
.session-card{background:var(--cr2);border:1px solid var(--bd);border-radius:14px;padding:12px}
.session-metrics{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.session-metrics span{font-size:11px;background:var(--card);border:1px solid var(--bd);border-radius:999px;padding:4px 8px;color:var(--tx2)}
.search-clear{position:absolute;right:7px;top:50%;transform:translateY(-50%);border:0;background:var(--cr2);color:var(--tx3);border-radius:999px;width:22px;height:22px;font-size:16px;line-height:20px}
.search-clear:hover{background:var(--cr3);color:var(--tx)}
html.theme-dark .seg-group{background:var(--card)}
html.theme-dark.theme-grey, body.theme-dark.theme-grey{
  --bg:#181a1b;--card:#242628;--cr2:#2e3032;--cr3:#3a3d40;--tx:#f1f3f4;--tx2:#c9cdd1;--tx3:#9ba1a6;--bd:#45484c;--tl:#2b2d30;
  --tc:#d96b34;--sage:#8fa08f;
}
html.theme-dark.theme-grey .banner,
html.theme-dark.theme-grey .listcard,
html.theme-dark.theme-grey .rcard,
html.theme-dark.theme-grey .modal,
html.theme-dark.theme-grey .sc,
html.theme-dark.theme-grey .witem,
html.theme-dark.theme-grey .session-card{background:var(--card)!important;border-color:var(--bd)!important}
html.theme-dark.theme-grey .bp{background:#3a3d40!important;color:#f1f3f4!important;border-color:#55595e!important}
html.theme-dark.theme-grey .seg-btn.on{background:#4a4d51!important;color:#fff!important}
html.theme-dark.theme-mono, body.theme-dark.theme-mono{
  --bg:#0b0b0c;--card:#151516;--cr2:#202123;--cr3:#2f3033;--tx:#f7f7f8;--tx2:#d1d5db;--tx3:#9ca3af;--bd:#3f4145;--tc:#f7f7f8;--sage:#f7f7f8;--tl:#1b1c1e;
}
html.theme-dark.theme-mono .banner,
html.theme-dark.theme-mono .listcard,
html.theme-dark.theme-mono .rcard,
html.theme-dark.theme-mono .modal,
html.theme-dark.theme-mono .sc,
html.theme-dark.theme-mono .witem,
html.theme-dark.theme-mono .session-card{background:var(--card)!important;border-color:var(--bd)!important}
html.theme-dark.theme-mono .bp,
html.theme-dark.theme-mono .seg-btn.on{background:#f7f7f8!important;color:#111!important;border-color:#f7f7f8!important}
html.theme-dark.theme-mono .pill,
html.theme-dark.theme-mono .ptag{filter:grayscale(1);background:#2f3033!important;color:#f7f7f8!important}
html.theme-dark.theme-mono .topbar-title{color:#f7f7f8!important}

html:not(.theme-dark) .seg-group{background:var(--card);}

/* v3 theme correction and summary/session polish */
html.theme-dark.theme-grey, body.theme-dark.theme-grey{
  --bg:#17191b!important;--card:#242629!important;--cr2:#2d3033!important;--cr3:#383c40!important;--tx:#f0f2f4!important;--tx2:#c7ccd1!important;--tx3:#969da4!important;--bd:#454a50!important;--tl:#2b2e31!important;--tc:#c9cdd1!important;--sage:#b7bdc3!important;
}
html.theme-dark.theme-grey .topbar-title[style*="Palabras"], html.theme-dark.theme-grey .topbar-title{color:#c9cdd1!important}
html.theme-dark.theme-grey .bp, html.theme-dark.theme-grey .seg-btn.on{background:#4a4f55!important;color:#fff!important;border-color:#60656c!important}
html.theme-dark.theme-grey .n, html.theme-dark.theme-grey .banner h3, html.theme-dark.theme-grey h2{color:#d8dde2!important}
html.theme-dark.theme-mono, body.theme-dark.theme-mono{
  --bg:#000!important;--card:#111!important;--cr2:#1f1f1f!important;--cr3:#777!important;--tx:#fff!important;--tx2:#fff!important;--tx3:#777!important;--bd:#777!important;--tl:#111!important;--tc:#fff!important;--sage:#fff!important;
}
html.theme-dark.theme-mono .topbar-title{color:#fff!important}
html.theme-dark.theme-mono .bp, html.theme-dark.theme-mono .seg-btn.on{background:#fff!important;color:#000!important;border-color:#fff!important}
html.theme-dark.theme-mono .bs, html.theme-dark.theme-mono input, html.theme-dark.theme-mono select, html.theme-dark.theme-mono textarea{border-color:#777!important}
html.theme-dark.theme-mono .n, html.theme-dark.theme-mono .banner h3, html.theme-dark.theme-mono h2{color:#fff!important}
html.theme-dark.theme-focus, body.theme-dark.theme-focus{
  --bg:#15120f;--card:#392F2A;--cr2:#2a221e;--cr3:#5D542D;--tx:#f6efe2;--tx2:#dccbab;--tx3:#A48648;--bd:#5D542D;--tl:#241c18;--tc:#A48648;--sage:#b7a967;
}
html.theme-dark.theme-focus .topbar-title{color:#A48648!important}
.session-summary{text-align:left!important;padding:18px!important}
.summary-hero{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:16px}
.summary-hero h2{margin:0 0 4px;font-family:Georgia,serif;color:var(--tx)}
.summary-hero p{margin:0;color:var(--tx3);font-size:12px}
.summary-score{font-size:2.1rem;font-weight:900;line-height:1}
.summary-grid{display:grid;grid-template-columns:repeat(5,minmax(80px,1fr));gap:8px;margin-bottom:14px}
.summary-grid div{background:var(--cr2);border:1px solid var(--bd);border-radius:12px;padding:10px;text-align:center}
.summary-grid strong{display:block;font-size:1.25rem}
.summary-grid span{font-size:11px;color:var(--tx3)}
.missed-panel{background:var(--cr2);border:1px solid var(--bd);border-radius:12px;padding:12px}
.panel-title{font-size:11px;font-weight:800;color:var(--tx3);text-transform:uppercase;letter-spacing:.4px;margin-bottom:8px}
.session-grid{display:grid;grid-template-columns:2fr repeat(6, minmax(72px, 1fr));gap:10px;align-items:center}
.session-grid>div:not(:first-child){text-align:center;border-left:1px solid var(--bd);padding-left:8px}
.session-grid strong{display:block;font-size:1rem;color:var(--tx)}
.session-grid span{display:block;font-size:10px;color:var(--tx3);margin-top:2px}
@media(max-width:720px){.summary-grid{grid-template-columns:repeat(2,1fr)}.session-grid{grid-template-columns:1fr 1fr 1fr}.session-grid>div:not(:first-child){border-left:0;padding-left:0}}

/* v4 strict grey/mono cleanup */
html.theme-dark.theme-grey body, body.theme-dark.theme-grey, html.theme-dark.theme-grey .screen{background:#17191b!important}
html.theme-dark.theme-grey .topbar, html.theme-dark.theme-grey .home-content, html.theme-dark.theme-grey .banner, html.theme-dark.theme-grey .listcard, html.theme-dark.theme-grey .modal-bg, html.theme-dark.theme-grey .modal, html.theme-dark.theme-grey .rcard, html.theme-dark.theme-grey .sc, html.theme-dark.theme-grey .witem, html.theme-dark.theme-grey input, html.theme-dark.theme-grey select, html.theme-dark.theme-grey textarea{
  background:#242629!important;color:#f0f2f4!important;border-color:#454a50!important;
}
html.theme-dark.theme-grey .topbar-title, html.theme-dark.theme-grey .n, html.theme-dark.theme-grey h1, html.theme-dark.theme-grey h2, html.theme-dark.theme-grey h3{color:#d8dde2!important}
html.theme-dark.theme-grey .bp, html.theme-dark.theme-grey .seg-btn.on{background:#4a4f55!important;color:#fff!important;border-color:#60656c!important}
html.theme-dark.theme-grey .pill{filter:grayscale(1)}
html.theme-dark.theme-mono body, body.theme-dark.theme-mono, html.theme-dark.theme-mono .screen{background:#000!important}
html.theme-dark.theme-mono .topbar, html.theme-dark.theme-mono .home-content, html.theme-dark.theme-mono .banner, html.theme-dark.theme-mono .listcard, html.theme-dark.theme-mono .modal-bg, html.theme-dark.theme-mono .modal, html.theme-dark.theme-mono .rcard, html.theme-dark.theme-mono .sc, html.theme-dark.theme-mono .witem, html.theme-dark.theme-mono input, html.theme-dark.theme-mono select, html.theme-dark.theme-mono textarea{
  background:#111!important;color:#fff!important;border-color:#777!important;
}
html.theme-dark.theme-mono .topbar-title, html.theme-dark.theme-mono .n, html.theme-dark.theme-mono h1, html.theme-dark.theme-mono h2, html.theme-dark.theme-mono h3{color:#fff!important}
html.theme-dark.theme-mono .bp, html.theme-dark.theme-mono .seg-btn.on{background:#fff!important;color:#000!important;border-color:#fff!important}
html.theme-dark.theme-mono .bs, html.theme-dark.theme-mono .pill{filter:grayscale(1)!important}
.custom-list{margin-bottom:10px}
.custom-lcard{position:relative;padding:0}
.custom-lcard .lcard-main{display:block;width:100%;height:100%;background:transparent;border:0;color:inherit;padding:16px 10px;text-align:center}
.custom-del{position:absolute;top:6px;right:6px;border:1px solid var(--bd);background:var(--cr2);color:var(--tx3);border-radius:999px;width:24px;height:24px;font-size:15px}
.custom-del:hover{color:#C62828;border-color:#C62828}

/* v5: strict non-orange grey/mono + themed heatmap */
html.theme-dark.theme-grey, html.theme-dark.theme-grey body, body.theme-dark.theme-grey, html.theme-dark.theme-grey .screen, html.theme-dark.theme-grey .home-content, html.theme-dark.theme-grey .lang-page, html.theme-dark.theme-grey .settings-shell, html.theme-dark.theme-grey .modal-bg{
  background:#17191b!important;background-color:#17191b!important;
}
html.theme-dark.theme-grey .sgroup, html.theme-dark.theme-grey .srow, html.theme-dark.theme-grey .topbar, html.theme-dark.theme-grey .tabs, html.theme-dark.theme-grey .banner, html.theme-dark.theme-grey .listcard, html.theme-dark.theme-grey .modal, html.theme-dark.theme-grey .rcard, html.theme-dark.theme-grey .sc, html.theme-dark.theme-grey .witem, html.theme-dark.theme-grey .lcard, html.theme-dark.theme-grey .custom-lang-form, html.theme-dark.theme-grey input, html.theme-dark.theme-grey select, html.theme-dark.theme-grey textarea{
  background:#242629!important;background-color:#242629!important;color:#f0f2f4!important;border-color:#454a50!important;
}
html.theme-dark.theme-grey .palabras-brand{color:#C1440E!important}
html.theme-dark.theme-grey .hm-day[data-l="0"]{background:#2b2f33!important}
html.theme-dark.theme-grey .hm-day[data-l="1"]{background:#3b4147!important}
html.theme-dark.theme-grey .hm-day[data-l="2"]{background:#555c63!important}
html.theme-dark.theme-grey .hm-day[data-l="3"]{background:#7a838c!important}
html.theme-dark.theme-grey .hm-day[data-l="4"]{background:#c7cdd3!important}

html.theme-dark.theme-mono, html.theme-dark.theme-mono body, body.theme-dark.theme-mono, html.theme-dark.theme-mono .screen, html.theme-dark.theme-mono .home-content, html.theme-dark.theme-mono .lang-page, html.theme-dark.theme-mono .settings-shell, html.theme-dark.theme-mono .modal-bg{
  background:#000!important;background-color:#000!important;
}
html.theme-dark.theme-mono .sgroup, html.theme-dark.theme-mono .srow, html.theme-dark.theme-mono .topbar, html.theme-dark.theme-mono .tabs, html.theme-dark.theme-mono .banner, html.theme-dark.theme-mono .listcard, html.theme-dark.theme-mono .modal, html.theme-dark.theme-mono .rcard, html.theme-dark.theme-mono .sc, html.theme-dark.theme-mono .witem, html.theme-dark.theme-mono .lcard, html.theme-dark.theme-mono .custom-lang-form, html.theme-dark.theme-mono input, html.theme-dark.theme-mono select, html.theme-dark.theme-mono textarea{
  background:#111!important;background-color:#111!important;color:#fff!important;border-color:#777!important;
}
html.theme-dark.theme-mono .palabras-brand{color:#C1440E!important}
html.theme-dark.theme-mono .hm-day[data-l="0"]{background:#111!important}
html.theme-dark.theme-mono .hm-day[data-l="1"]{background:#333!important}
html.theme-dark.theme-mono .hm-day[data-l="2"]{background:#777!important}
html.theme-dark.theme-mono .hm-day[data-l="3"]{background:#bbb!important}
html.theme-dark.theme-mono .hm-day[data-l="4"]{background:#fff!important}

html.theme-dark.theme-focus .hm-day[data-l="0"]{background:#2a221e!important}
html.theme-dark.theme-focus .hm-day[data-l="1"]{background:#392F2A!important}
html.theme-dark.theme-focus .hm-day[data-l="2"]{background:#59290B!important}
html.theme-dark.theme-focus .hm-day[data-l="3"]{background:#5D542D!important}
html.theme-dark.theme-focus .hm-day[data-l="4"]{background:#A48648!important}
html.theme-dark.theme-palabras .palabras-brand, html.theme-dark .palabras-brand, .palabras-brand{color:#C1440E!important}

/* v5 base/palabras heatmap colors */
html:not(.theme-dark) .hm-day[data-l="0"]{background:#F1E7D6}
html:not(.theme-dark) .hm-day[data-l="1"]{background:#E8C7A7}
html:not(.theme-dark) .hm-day[data-l="2"]{background:#D8915D}
html:not(.theme-dark) .hm-day[data-l="3"]{background:#C1440E}
html:not(.theme-dark) .hm-day[data-l="4"]{background:#7A2B09}
html.theme-dark.theme-palabras .hm-day[data-l="0"], html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .hm-day[data-l="0"]{background:#2a1b12!important}
html.theme-dark.theme-palabras .hm-day[data-l="1"], html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .hm-day[data-l="1"]{background:#3c2415!important}
html.theme-dark.theme-palabras .hm-day[data-l="2"], html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .hm-day[data-l="2"]{background:#6b3515!important}
html.theme-dark.theme-palabras .hm-day[data-l="3"], html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .hm-day[data-l="3"]{background:#a84a16!important}
html.theme-dark.theme-palabras .hm-day[data-l="4"], html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .hm-day[data-l="4"]{background:#d96b34!important}

/* v6 final non-orange grey/mono and brand fixes */
html.theme-dark.theme-grey, html.theme-dark.theme-grey body, body.theme-dark.theme-grey, html.theme-dark.theme-grey .screen, html.theme-dark.theme-grey .settings-hero, html.theme-dark.theme-grey .settings-shell, html.theme-dark.theme-grey .profile-head, html.theme-dark.theme-grey .topbar, html.theme-dark.theme-grey .tabs, html.theme-dark.theme-grey .modal-bg, html.theme-dark.theme-grey .home-content, html.theme-dark.theme-grey .lang-page{
  background:#17191b!important;background-color:#17191b!important;
}
html.theme-dark.theme-grey .sgroup, html.theme-dark.theme-grey .srow, html.theme-dark.theme-grey .banner, html.theme-dark.theme-grey .listcard, html.theme-dark.theme-grey .modal, html.theme-dark.theme-grey .rcard, html.theme-dark.theme-grey .sc, html.theme-dark.theme-grey .witem, html.theme-dark.theme-grey .lcard, html.theme-dark.theme-grey .custom-lang-form, html.theme-dark.theme-grey input, html.theme-dark.theme-grey select, html.theme-dark.theme-grey textarea{
  background:#242629!important;background-color:#242629!important;color:#f0f2f4!important;border-color:#454a50!important;
}
html.theme-dark.theme-grey .topbar-sub, html.theme-dark.theme-grey .srow-sub, html.theme-dark.theme-grey .l, html.theme-dark.theme-grey label{color:#aab1b8!important}
html.theme-dark.theme-grey *{box-shadow-color:#454a50!important}

html.theme-dark.theme-mono, html.theme-dark.theme-mono body, body.theme-dark.theme-mono, html.theme-dark.theme-mono .screen, html.theme-dark.theme-mono .settings-hero, html.theme-dark.theme-mono .settings-shell, html.theme-dark.theme-mono .profile-head, html.theme-dark.theme-mono .topbar, html.theme-dark.theme-mono .tabs, html.theme-dark.theme-mono .modal-bg, html.theme-dark.theme-mono .home-content, html.theme-dark.theme-mono .lang-page{
  background:#000!important;background-color:#000!important;
}
html.theme-dark.theme-mono .sgroup, html.theme-dark.theme-mono .srow, html.theme-dark.theme-mono .banner, html.theme-dark.theme-mono .listcard, html.theme-dark.theme-mono .modal, html.theme-dark.theme-mono .rcard, html.theme-dark.theme-mono .sc, html.theme-dark.theme-mono .witem, html.theme-dark.theme-mono .lcard, html.theme-dark.theme-mono .custom-lang-form, html.theme-dark.theme-mono input, html.theme-dark.theme-mono select, html.theme-dark.theme-mono textarea{
  background:#111!important;background-color:#111!important;color:#fff!important;border-color:#777!important;
}
html.theme-dark.theme-mono .topbar-sub, html.theme-dark.theme-mono .srow-sub, html.theme-dark.theme-mono .l, html.theme-dark.theme-mono label{color:#aaa!important}

html .palabras-brand, body .palabras-brand, .topbar-title.palabras-brand, html.theme-dark.theme-focus .palabras-brand, html.theme-dark.theme-grey .palabras-brand, html.theme-dark.theme-mono .palabras-brand{color:#C1440E!important}
.custom-del{z-index:5;cursor:pointer}

/* v11-from-v6: CSS-only modal/settings fixes */
.modal-bg{
  position:fixed!important;
  inset:0!important;
  z-index:99999!important;
  background:rgba(0,0,0,.72)!important;
  backdrop-filter:blur(3px);
  display:flex;
  align-items:flex-start;
  justify-content:center;
  overflow:auto;
  padding:24px 12px;
}
.modal{
  position:relative!important;
  z-index:100000!important;
  max-height:calc(100vh - 48px);
  overflow:auto;
}
#sdarktheme{
  margin-left:auto;
  max-width:360px;
  width:min(360px,55vw);
}
.srow:has(#sdarktheme){align-items:center}
html.theme-dark.theme-grey, html.theme-dark.theme-grey body, body.theme-dark.theme-grey, html.theme-dark.theme-grey .screen, html.theme-dark.theme-grey .settings-header, html.theme-dark.theme-grey .settings-screen, html.theme-dark.theme-grey .settings-body, html.theme-dark.theme-grey .stabs, html.theme-dark.theme-grey .settings-shell, html.theme-dark.theme-grey .profile-head{
  background:#17191b!important;
  background-color:#17191b!important;
  border-color:#454a50!important;
}
html.theme-dark.theme-grey .sgroup, html.theme-dark.theme-grey .srow, html.theme-dark.theme-grey .banner, html.theme-dark.theme-grey .listcard, html.theme-dark.theme-grey .modal, html.theme-dark.theme-grey .rcard, html.theme-dark.theme-grey .sc, html.theme-dark.theme-grey .witem, html.theme-dark.theme-grey .lcard, html.theme-dark.theme-grey .custom-lang-form, html.theme-dark.theme-grey input, html.theme-dark.theme-grey select, html.theme-dark.theme-grey textarea{
  background:#242629!important;
  background-color:#242629!important;
  color:#f0f2f4!important;
  border-color:#454a50!important;
}
html.theme-dark.theme-grey .settings-header *, html.theme-dark.theme-grey .settings-username{color:#f0f2f4!important}
html.theme-dark.theme-grey .settings-meta, html.theme-dark.theme-grey .topbar-sub, html.theme-dark.theme-grey .srow-sub, html.theme-dark.theme-grey .l, html.theme-dark.theme-grey label{color:#aab1b8!important}
html.theme-dark.theme-grey .storage-bar{background:#2b2f33!important}

html.theme-dark.theme-mono, html.theme-dark.theme-mono body, body.theme-dark.theme-mono, html.theme-dark.theme-mono .screen, html.theme-dark.theme-mono .settings-header, html.theme-dark.theme-mono .settings-screen, html.theme-dark.theme-mono .settings-body, html.theme-dark.theme-mono .stabs, html.theme-dark.theme-mono .settings-shell, html.theme-dark.theme-mono .profile-head{
  background:#000!important;
  background-color:#000!important;
  border-color:#777!important;
}
html.theme-dark.theme-mono .sgroup, html.theme-dark.theme-mono .srow, html.theme-dark.theme-mono .banner, html.theme-dark.theme-mono .listcard, html.theme-dark.theme-mono .modal, html.theme-dark.theme-mono .rcard, html.theme-dark.theme-mono .sc, html.theme-dark.theme-mono .witem, html.theme-dark.theme-mono .lcard, html.theme-dark.theme-mono .custom-lang-form, html.theme-dark.theme-mono input, html.theme-dark.theme-mono select, html.theme-dark.theme-mono textarea{
  background:#111!important;
  background-color:#111!important;
  color:#fff!important;
  border-color:#777!important;
}
html.theme-dark.theme-mono .settings-header *, html.theme-dark.theme-mono .settings-username{color:#fff!important}
html.theme-dark.theme-mono .settings-meta, html.theme-dark.theme-mono .topbar-sub, html.theme-dark.theme-mono .srow-sub, html.theme-dark.theme-mono .l, html.theme-dark.theme-mono label{color:#aaa!important}
html.theme-dark.theme-mono .storage-bar{background:#111!important;border:1px solid #777!important}

/* v12: visual text contrast fixes */
.modal-bg{
  backdrop-filter:blur(48px)!important;
  -webkit-backdrop-filter:blur(48px)!important;
}
html.theme-dark select option,
body.theme-dark select option{
  background:#1b1b1b!important;
  color:#f7f7f7!important;
}
html.theme-dark.theme-palabras select,
html.theme-dark.theme-palabras select option,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) select,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) select option{
  background:#1E1208!important;
  color:#fff!important;
}
html.theme-dark.theme-grey select,
html.theme-dark.theme-grey select option{
  background:#242629!important;
  color:#f0f2f4!important;
}
html.theme-dark.theme-mono select,
html.theme-dark.theme-mono select option{
  background:#111!important;
  color:#fff!important;
}
html.theme-dark.theme-focus select,
html.theme-dark.theme-focus select option{
  background:#392F2A!important;
  color:#f6efe2!important;
}

/* Review buttons: avoid white text on white button in Black/White */
html.theme-dark.theme-mono .gcr{
  background:#fff!important;
  color:#000!important;
  border:1.5px solid #fff!important;
}
html.theme-dark.theme-mono .gwr{
  background:#111!important;
  color:#fff!important;
  border:1.5px solid #777!important;
}
html.theme-dark.theme-grey .gcr{
  background:#c7cdd3!important;
  color:#111!important;
  border:1.5px solid #c7cdd3!important;
}
html.theme-dark.theme-grey .gwr{
  background:#242629!important;
  color:#f0f2f4!important;
  border:1.5px solid #454a50!important;
}

/* Segments in strict mono/grey: keep selected text readable */
html.theme-dark.theme-mono .seg-btn.on{
  background:#fff!important;
  color:#000!important;
  border-color:#fff!important;
}
html.theme-dark.theme-grey .seg-btn.on{
  background:#c7cdd3!important;
  color:#111!important;
  border-color:#c7cdd3!important;
}

/* Dark Theme row: extra fallback for browsers without :has support */
#sdarktheme{
  display:block;
  min-width:260px;
}
@media(max-width:640px){
  #sdarktheme{width:100%;max-width:none;margin-left:0;margin-top:8px}
}

/* v13: mobile-first modal and Statistics presentation refinements */

/* Restore the old bottom-sheet feel instead of the heavy full-screen modal. */
.modal-bg{
  align-items:flex-end!important;
  justify-content:center!important;
  padding:0!important;
  background:rgba(0,0,0,.58)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
}
.modal{
  width:100%!important;
  max-width:560px!important;
  max-height:min(78svh, 720px)!important;
  border-radius:22px 22px 0 0!important;
  padding:18px 16px calc(18px + env(safe-area-inset-bottom,14px))!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
}

/* Statistics header/tabs should behave like a horizontal mobile nav, not clip text. */
.modal .mhead{
  position:sticky;
  top:0;
  z-index:2;
  background:var(--wh);
  padding-bottom:10px;
  margin-bottom:8px;
}
html.theme-dark .modal .mhead{background:var(--wh)}
.modal .tabs{
  display:flex!important;
  flex-wrap:nowrap!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch;
  gap:0;
  margin-left:-2px;
  margin-right:-2px;
  padding:0 2px 2px;
  scrollbar-width:none;
}
.modal .tabs::-webkit-scrollbar{display:none}
.modal .tab{
  flex:0 0 auto!important;
  padding:10px 13px!important;
  font-size:14px!important;
  line-height:1.1;
}

/* Keep statistic cards clean and not too tall on mobile. */
.modal .sgrid{
  gap:10px!important;
}
.modal .sc{
  min-height:84px;
}

/* Session history cards: mobile-friendly two/three-column rhythm instead of squeezed desktop grid. */
@media(max-width:640px){
  .modal{
    max-width:100%!important;
    max-height:76svh!important;
  }
  .session-grid{
    grid-template-columns:1.25fr 1fr 1fr!important;
    gap:10px 8px!important;
    align-items:start!important;
  }
  .session-grid>div:first-child{
    grid-column:1 / -1;
    text-align:left!important;
    border-left:0!important;
    padding-left:0!important;
    padding-bottom:4px;
  }
  .session-grid>div:not(:first-child){
    border-left:0!important;
    padding-left:0!important;
    text-align:center!important;
    background:var(--card);
    border:1px solid var(--bd);
    border-radius:12px;
    padding:8px 6px!important;
  }
  .session-grid strong{font-size:1rem!important}
  .session-grid span{font-size:10px!important}
  .modal .mbtn{
    padding:8px 14px!important;
    font-size:13px!important;
  }
}

/* Desktop/tablet can remain centered-ish but still soft and contained. */
@media(min-width:760px){
  .modal-bg{
    align-items:center!important;
    padding:24px!important;
  }
  .modal{
    border-radius:20px!important;
    max-height:86vh!important;
  }
}

/* If the browser has trouble with svh, fall back gracefully. */
@supports not (height: 1svh){
  .modal{max-height:78vh!important}
  @media(max-width:640px){.modal{max-height:76vh!important}}
}

/* v14: prevent Statistics header/tabs from overlapping scrollable content */
.stats-modal{
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}
.stats-modal .mhead{
  flex:0 0 auto!important;
  position:relative!important;
  top:auto!important;
  z-index:4!important;
  margin-bottom:0!important;
  padding-bottom:12px!important;
  background:var(--wh)!important;
}
.stats-modal .tabs{
  flex:0 0 auto!important;
  position:relative!important;
  z-index:3!important;
  background:var(--wh)!important;
  margin-bottom:0!important;
  padding-top:0!important;
  padding-bottom:4px!important;
}
.stats-content{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
  padding-top:16px!important;
  padding-bottom:calc(20px + env(safe-area-inset-bottom,14px))!important;
  overscroll-behavior:contain;
}

/* Apply the same blur/tint behavior to every theme, including Grey and Black/White. */
html.theme-dark.theme-grey .modal-bg,
html.theme-dark.theme-mono .modal-bg,
html.theme-dark.theme-focus .modal-bg,
html.theme-dark.theme-palabras .modal-bg,
html.theme-dark .modal-bg{
  background:rgba(0,0,0,.58)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
}

/* Black/White contrast fixes for pills, active tabs, mode buttons, and stats cards. */
html.theme-dark.theme-mono .mbtn.on,
html.theme-dark.theme-mono .tab.on,
html.theme-dark.theme-mono .stab.on{
  background:#fff!important;
  color:#000!important;
  border-color:#fff!important;
}
html.theme-dark.theme-mono .mbtn,
html.theme-dark.theme-mono .tab,
html.theme-dark.theme-mono .stab{
  color:#aaa!important;
}
html.theme-dark.theme-mono .sc,
html.theme-dark.theme-mono .session-card,
html.theme-dark.theme-mono .session-grid>div:not(:first-child){
  background:#111!important;
  color:#fff!important;
  border-color:#777!important;
}
html.theme-dark.theme-mono .n,
html.theme-dark.theme-mono .session-grid strong{
  color:#fff!important;
}
html.theme-dark.theme-mono .l,
html.theme-dark.theme-mono .session-grid span{
  color:#aaa!important;
}

/* Grey theme equivalent contrast fixes */
html.theme-dark.theme-grey .mbtn.on,
html.theme-dark.theme-grey .tab.on,
html.theme-dark.theme-grey .stab.on{
  background:#c7cdd3!important;
  color:#111!important;
  border-color:#c7cdd3!important;
}
html.theme-dark.theme-grey .mbtn,
html.theme-dark.theme-grey .tab,
html.theme-dark.theme-grey .stab{
  color:#aab1b8!important;
}
html.theme-dark.theme-grey .sc,
html.theme-dark.theme-grey .session-card,
html.theme-dark.theme-grey .session-grid>div:not(:first-child){
  background:#242629!important;
  color:#f0f2f4!important;
  border-color:#454a50!important;
}
html.theme-dark.theme-grey .n,
html.theme-dark.theme-grey .session-grid strong{
  color:#f0f2f4!important;
}
html.theme-dark.theme-grey .l,
html.theme-dark.theme-grey .session-grid span{
  color:#aab1b8!important;
}

@media(max-width:640px){
  .stats-modal .mhead{
    padding-top:2px!important;
  }
  .stats-modal .tabs{
    border-bottom:1px solid var(--bd)!important;
  }
  .stats-content{
    padding-left:0!important;
    padding-right:0!important;
  }
}

/* v15: remove Statistics overview, mobile theme row, and grey/BW contrast fixes */

/* Dark Theme row: always stack on mobile and never overlap label. */
.theme-select-row{
  align-items:flex-start!important;
}
.theme-select-row .srow-info{
  flex:0 0 auto!important;
  min-width:120px;
}
.theme-select-row #sdarktheme{
  flex:1 1 auto;
}
@media(max-width:760px){
  .theme-select-row{
    display:block!important;
  }
  .theme-select-row .srow-info{
    margin-bottom:8px!important;
  }
  .theme-select-row #sdarktheme{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    display:block!important;
  }
}

/* Statistics tabs: active state should be text + underline, not a filled white block. */
.stats-modal .tab,
.modal .tab{
  background:transparent!important;
  border-radius:0!important;
}
.stats-modal .tab.on,
.modal .tab.on{
  background:transparent!important;
  color:var(--tc)!important;
  border-bottom-color:var(--tc)!important;
}

/* Black/White theme: strict black/white/grey without big white active tab blocks. */
html.theme-dark.theme-mono .stats-modal .tab.on,
html.theme-dark.theme-mono .modal .tab.on,
html.theme-dark.theme-mono .tab.on,
html.theme-dark.theme-mono .stab.on{
  background:transparent!important;
  color:#fff!important;
  border-bottom-color:#fff!important;
}
html.theme-dark.theme-mono .stats-modal .tab,
html.theme-dark.theme-mono .modal .tab,
html.theme-dark.theme-mono .tab,
html.theme-dark.theme-mono .stab{
  background:transparent!important;
  color:#aaa!important;
}
html.theme-dark.theme-mono .mbtn.on{
  background:#fff!important;
  color:#000!important;
  border-color:#fff!important;
}
html.theme-dark.theme-mono .mbtn{
  background:#111!important;
  color:#fff!important;
  border-color:#777!important;
}
html.theme-dark.theme-mono .stats-modal,
html.theme-dark.theme-mono .stats-modal .mhead,
html.theme-dark.theme-mono .stats-modal .tabs,
html.theme-dark.theme-mono .stats-content{
  background:#000!important;
  color:#fff!important;
}
html.theme-dark.theme-mono .sc,
html.theme-dark.theme-mono .session-card,
html.theme-dark.theme-mono .session-grid>div:not(:first-child){
  background:#111!important;
  color:#fff!important;
  border-color:#777!important;
}
html.theme-dark.theme-mono .n,
html.theme-dark.theme-mono .session-grid strong{
  color:#fff!important;
}
html.theme-dark.theme-mono .l,
html.theme-dark.theme-mono .session-grid span,
html.theme-dark.theme-mono .srow-sub,
html.theme-dark.theme-mono .topbar-sub{
  color:#aaa!important;
}

/* Grey theme: neutral greys, no white filled active tab blocks. */
html.theme-dark.theme-grey .stats-modal .tab.on,
html.theme-dark.theme-grey .modal .tab.on,
html.theme-dark.theme-grey .tab.on,
html.theme-dark.theme-grey .stab.on{
  background:transparent!important;
  color:#f0f2f4!important;
  border-bottom-color:#c7cdd3!important;
}
html.theme-dark.theme-grey .stats-modal .tab,
html.theme-dark.theme-grey .modal .tab,
html.theme-dark.theme-grey .tab,
html.theme-dark.theme-grey .stab{
  background:transparent!important;
  color:#aab1b8!important;
}
html.theme-dark.theme-grey .mbtn.on{
  background:#c7cdd3!important;
  color:#111!important;
  border-color:#c7cdd3!important;
}
html.theme-dark.theme-grey .mbtn{
  background:#242629!important;
  color:#f0f2f4!important;
  border-color:#454a50!important;
}
html.theme-dark.theme-grey .stats-modal,
html.theme-dark.theme-grey .stats-modal .mhead,
html.theme-dark.theme-grey .stats-modal .tabs,
html.theme-dark.theme-grey .stats-content{
  background:#17191b!important;
  color:#f0f2f4!important;
}
html.theme-dark.theme-grey .sc,
html.theme-dark.theme-grey .session-card,
html.theme-dark.theme-grey .session-grid>div:not(:first-child){
  background:#242629!important;
  color:#f0f2f4!important;
  border-color:#454a50!important;
}
html.theme-dark.theme-grey .n,
html.theme-dark.theme-grey .session-grid strong{
  color:#f0f2f4!important;
}
html.theme-dark.theme-grey .l,
html.theme-dark.theme-grey .session-grid span,
html.theme-dark.theme-grey .srow-sub,
html.theme-dark.theme-grey .topbar-sub{
  color:#aab1b8!important;
}

/* v16: Palabras dark header/scroll separation + improved session history */

/* Prevent sticky top bar from visually blending/overlapping with the scroll content in Palabras Dark. */
html.theme-dark.theme-palabras .topbar,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .topbar{
  background:#050201!important;
  background-color:#050201!important;
  border-bottom:1px solid rgba(217,107,52,.22)!important;
  box-shadow:0 8px 18px rgba(0,0,0,.32)!important;
}
html.theme-dark.theme-palabras .home-content,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .home-content{
  padding-top:18px!important;
  position:relative;
  z-index:1;
}
html.theme-dark.theme-palabras .topbar + .home-content,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .topbar + .home-content{
  margin-top:0!important;
}

/* Session History: vertically aligned, comparable columns, no missed metric. */
.session-history-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.session-grid{
  grid-template-columns:minmax(145px,2fr) repeat(5,minmax(74px,1fr))!important;
  align-items:stretch!important;
}
.session-title{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
}
.session-no{
  width:34px;
  height:34px;
  border-radius:10px;
  background:var(--cr2);
  border:1px solid var(--bd);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  font-size:12px;
  font-weight:800;
  color:var(--tx);
}
.session-grid>div:not(:first-child){
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:48px;
}
@media(max-width:640px){
  .session-grid{
    grid-template-columns:1fr 1fr 1fr!important;
    gap:9px!important;
  }
  .session-grid>div:first-child{
    grid-column:1 / -1;
  }
  .session-grid>div:not(:first-child){
    min-height:58px;
  }
  .session-title{
    padding-bottom:2px;
  }
  .session-no{
    width:32px;
    height:32px;
  }
}

/* v17: audio + single-row session history */
.session-history-list{
  overflow-x:auto!important;
  -webkit-overflow-scrolling:touch;
  padding-bottom:4px;
}
.session-history-list .session-grid{
  grid-template-columns:minmax(150px,1.5fr) repeat(5,minmax(82px,1fr))!important;
  min-width:660px!important;
  align-items:stretch!important;
}
.session-history-list .session-grid>div:first-child{
  grid-column:auto!important;
}
.session-history-list .session-grid>div:not(:first-child){
  border-left:1px solid var(--bd)!important;
  padding-left:8px!important;
  background:transparent!important;
  border-radius:0!important;
  display:flex!important;
  justify-content:center!important;
  min-height:52px!important;
}
@media(max-width:640px){
  .session-history-list .session-grid{
    grid-template-columns:minmax(150px,1.5fr) repeat(5,minmax(82px,1fr))!important;
    min-width:660px!important;
  }
  .session-history-list .session-grid>div:first-child{
    grid-column:auto!important;
  }
  .session-history-list .session-grid>div:not(:first-child){
    border-left:1px solid var(--bd)!important;
    padding-left:8px!important;
    text-align:center!important;
  }
}

/* v19: Session History pinned session info + Due/New columns */
.session-history-list{
  overflow-x:auto!important;
  overflow-y:visible!important;
  -webkit-overflow-scrolling:touch;
  padding-bottom:6px;
}
.session-history-list .session-grid{
  grid-template-columns:minmax(168px,1.65fr) repeat(7,minmax(82px,1fr))!important;
  min-width:860px!important;
  align-items:stretch!important;
  gap:8px!important;
}
.session-history-list .session-grid>div:first-child{
  position:sticky!important;
  left:0!important;
  z-index:3!important;
  background:var(--cr2)!important;
  border-right:1px solid var(--bd)!important;
  padding-right:8px!important;
  box-shadow:8px 0 12px rgba(0,0,0,.14);
}
.session-history-list .session-grid>div:not(:first-child){
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  min-height:52px!important;
  text-align:center!important;
}
html.theme-dark.theme-palabras .session-history-list .session-grid>div:first-child,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .session-history-list .session-grid>div:first-child{
  background:#1E1208!important;
}
html.theme-dark.theme-grey .session-history-list .session-grid>div:first-child{
  background:#242629!important;
}
html.theme-dark.theme-mono .session-history-list .session-grid>div:first-child{
  background:#111!important;
}
@media(max-width:640px){
  .session-history-list .session-grid{
    grid-template-columns:minmax(150px,1.55fr) repeat(7,minmax(76px,1fr))!important;
    min-width:790px!important;
  }
  .session-history-list .session-grid>div:first-child{
    grid-column:auto!important;
  }
  .session-history-list .session-title{
    gap:7px!important;
  }
  .session-history-list .session-no{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    font-size:10px!important;
  }
}

/* v20: Review exit modal polish */
.review-exit-bg{
  align-items:flex-end!important;
  padding:0 16px calc(env(safe-area-inset-bottom,0px) + 34px)!important;
}
.review-exit-modal{
  width:100%!important;
  max-width:430px!important;
  border-radius:22px!important;
  padding:20px 18px!important;
  padding-bottom:22px!important;
  margin-bottom:18px!important;
  border:1px solid var(--bd)!important;
  box-shadow:0 18px 55px rgba(0,0,0,.38)!important;
}
.review-exit-modal .mhead{
  margin-bottom:12px!important;
  padding-bottom:0!important;
  background:transparent!important;
}
.review-exit-modal .mhead h2{
  font-size:1.08rem!important;
  line-height:1.25!important;
  color:var(--tx)!important;
  letter-spacing:.2px;
}
.review-exit-text{
  font-size:14px!important;
  color:var(--tx2)!important;
  line-height:1.6!important;
  margin:0 0 18px!important;
}
.review-exit-modal .mfoot{
  gap:10px!important;
  margin-top:4px!important;
}
.review-exit-modal .mfoot button{
  min-height:48px!important;
  border-radius:14px!important;
  font-weight:800!important;
  font-size:14px!important;
}
.review-exit-modal .review-discard{
  background:transparent!important;
  color:var(--tx)!important;
  border:1.5px solid var(--bd)!important;
}
.review-exit-modal .review-save{
  background:var(--tc)!important;
  color:#fff!important;
  border:1.5px solid var(--tc)!important;
}

/* Theme-specific contrast */
html.theme-dark.theme-mono .review-exit-bg{
  background:rgba(0,0,0,.62)!important;
}
html.theme-dark.theme-mono .review-exit-modal{
  background:#111!important;
  border-color:#777!important;
}
html.theme-dark.theme-mono .review-exit-text{
  color:#d8d8d8!important;
}
html.theme-dark.theme-mono .review-exit-modal .review-discard{
  background:#111!important;
  color:#fff!important;
  border-color:#777!important;
}
html.theme-dark.theme-mono .review-exit-modal .review-save{
  background:#fff!important;
  color:#000!important;
  border-color:#fff!important;
}

html.theme-dark.theme-grey .review-exit-bg{
  background:rgba(0,0,0,.58)!important;
}
html.theme-dark.theme-grey .review-exit-modal{
  background:#242629!important;
  border-color:#454a50!important;
}
html.theme-dark.theme-grey .review-exit-text{
  color:#c7ccd1!important;
}
html.theme-dark.theme-grey .review-exit-modal .review-discard{
  background:#242629!important;
  color:#f0f2f4!important;
  border-color:#454a50!important;
}
html.theme-dark.theme-grey .review-exit-modal .review-save{
  background:#c7cdd3!important;
  color:#111!important;
  border-color:#c7cdd3!important;
}

html.theme-dark.theme-palabras .review-exit-modal,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .review-exit-modal{
  background:#1E1208!important;
  border-color:rgba(217,107,52,.25)!important;
}
html.theme-dark.theme-palabras .review-exit-modal .review-discard,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .review-exit-modal .review-discard{
  color:#f3e5d8!important;
  border-color:rgba(217,107,52,.28)!important;
}
html.theme-dark.theme-focus .review-exit-modal{
  background:#392F2A!important;
}
html.theme-dark.theme-focus .review-exit-modal .review-save{
  background:#A48648!important;
  color:#15110d!important;
  border-color:#A48648!important;
}

@media(max-width:420px){
  .review-exit-bg{
    padding-left:12px!important;
    padding-right:12px!important;
    padding-bottom:calc(env(safe-area-inset-bottom,0px) + 30px)!important;
  }
  .review-exit-modal .mfoot{
    gap:8px!important;
  }
  .review-exit-modal .mfoot button{
    font-size:13px!important;
  }
}


/* v21: theme consistency polish + clearer session meta */
.session-title{
  align-items:flex-start!important;
}
.session-meta{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.session-type{
  line-height:1.15;
  text-transform:none;
}
.session-lang,
.session-date{
  display:block;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.session-date{
  opacity:.92;
}

.toast{
  bottom:calc(env(safe-area-inset-bottom,0px) + 26px)!important;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 10px 26px rgba(0,0,0,.28);
}

.modal .mhead,
.stats-modal .mhead{
  padding-bottom:10px;
  border-bottom:1px solid var(--bd);
}
.modal .mhead h2,
.stats-modal .mhead h2{
  font-size:1.02rem!important;
  line-height:1.2;
  color:var(--tx)!important;
}
.modal .tabs,
.stats-modal .tabs{
  padding-top:8px;
}

.ib{
  transition:background .18s ease,border-color .18s ease,transform .12s ease,box-shadow .18s ease;
}
.ib:active{
  transform:translateY(1px);
}

/* Palabras / earth dark */
html.theme-dark.theme-palabras .ib,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .ib{
  background:#24160D!important;
  border-color:rgba(217,107,52,.28)!important;
  color:#F4E7DA!important;
  box-shadow:0 6px 14px rgba(0,0,0,.18);
}
html.theme-dark.theme-palabras .lcard,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .lcard{
  background:#1B110B!important;
  border-color:rgba(217,107,52,.20)!important;
}
html.theme-dark.theme-palabras .lcard.active,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .lcard.active{
  background:#26170D!important;
  border-color:#D96B34!important;
}
html.theme-dark.theme-palabras .toast,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .toast{
  background:#3D2516!important;
  color:#FAF0E6!important;
  border-color:rgba(217,107,52,.24)!important;
}
html.theme-dark.theme-palabras .toggle .tslider,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .toggle .tslider{
  background:#3A2A20!important;
  border:1px solid rgba(217,107,52,.22);
}
html.theme-dark.theme-palabras .toggle .tslider:before,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .toggle .tslider:before{
  background:#F9F1E8!important;
}
html.theme-dark.theme-palabras .toggle input:checked + .tslider,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .toggle input:checked + .tslider{
  background:#D96B34!important;
  border-color:#D96B34!important;
}

/* Grey dark */
html.theme-dark.theme-grey .ib{
  background:#2A2D31!important;
  border-color:#4B5057!important;
  color:#EEF2F5!important;
}
html.theme-dark.theme-grey .lcard{
  background:#242629!important;
  border-color:#454A50!important;
}
html.theme-dark.theme-grey .lcard.active{
  background:#2D3136!important;
  border-color:#C7CDD3!important;
}
html.theme-dark.theme-grey .toast{
  background:#2B2F34!important;
  color:#F1F3F4!important;
  border-color:#4B5057!important;
}
html.theme-dark.theme-grey .toggle .tslider{
  background:#4B5057!important;
}
html.theme-dark.theme-grey .toggle .tslider:before{
  background:#F3F5F6!important;
}
html.theme-dark.theme-grey .toggle input:checked + .tslider{
  background:#C7CDD3!important;
  border-color:#C7CDD3!important;
}
html.theme-dark.theme-grey .toggle input:checked + .tslider:before{
  background:#17191B!important;
}

/* Black / White */
html.theme-dark.theme-mono .ib{
  background:#111!important;
  border-color:#777!important;
  color:#FFF!important;
}
html.theme-dark.theme-mono .lcard{
  background:#0D0D0D!important;
  border-color:#777!important;
}
html.theme-dark.theme-mono .lcard.active{
  background:#151515!important;
  border-color:#FFF!important;
}
html.theme-dark.theme-mono .toast{
  background:#111!important;
  color:#FFF!important;
  border-color:#777!important;
}
html.theme-dark.theme-mono .toggle .tslider{
  background:#2A2A2A!important;
  border:1px solid #777!important;
}
html.theme-dark.theme-mono .toggle .tslider:before{
  background:#FFF!important;
}
html.theme-dark.theme-mono .toggle input:checked + .tslider{
  background:#FFF!important;
  border-color:#FFF!important;
}
html.theme-dark.theme-mono .toggle input:checked + .tslider:before{
  background:#000!important;
}
html.theme-dark.theme-mono .modal .mhead h2,
html.theme-dark.theme-grey .modal .mhead h2,
html.theme-dark.theme-palabras .modal .mhead h2,
html.theme-dark.theme-mono .stats-modal .mhead h2,
html.theme-dark.theme-grey .stats-modal .mhead h2,
html.theme-dark.theme-palabras .stats-modal .mhead h2{
  color:inherit!important;
}

/* Focus theme */
html.theme-dark.theme-focus .ib{
  background:#4A3B32!important;
  border-color:#7B6657!important;
  color:#F8E7C2!important;
}
html.theme-dark.theme-focus .toast{
  background:#4A3B32!important;
  color:#FFF8E8!important;
  border-color:#7B6657!important;
}
html.theme-dark.theme-focus .lcard.active{
  border-color:#A48648!important;
  background:#443730!important;
}
html.theme-dark.theme-focus .toggle .tslider{
  background:#5A4A40!important;
}
html.theme-dark.theme-focus .toggle input:checked + .tslider{
  background:#A48648!important;
  border-color:#A48648!important;
}
html.theme-dark.theme-focus .toggle input:checked + .tslider:before{
  background:#15110D!important;
}

@media(max-width:640px){
  .session-history-list .session-meta{
    gap:1px!important;
  }
  .session-history-list .session-type{
    font-size:13px!important;
  }
  .session-history-list .session-lang,
  .session-history-list .session-date{
    font-size:11px!important;
  }
}


/* --------------------------------------------------------------------------
   v6.2 THEME STABILITY LAYER
   --------------------------------------------------------------------------
   This final layer intentionally comes after the historical patch blocks.
   It creates one predictable place for theme-critical behavior while preserving
   the current stable visual design.
-------------------------------------------------------------------------- */

/* Global brand anchor: Palabras must keep the identity orange in every mode. */
.palabras-brand,
.topbar-title.palabras-brand,
html.theme-dark .palabras-brand,
html.theme-dark.theme-grey .palabras-brand,
html.theme-dark.theme-mono .palabras-brand,
html.theme-dark.theme-focus .palabras-brand,
html.theme-dark.theme-palabras .palabras-brand{
  color:#C1440E!important;
}

/* Base dark theme defaults used by Palabras Dark / Earth unless specialized. */
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus),
body.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus){
  --cr:#050201;
  --cr2:#1E1208;
  --cr3:#2B1A0F;
  --wh:#130B06;
  --bd:#3A2518;
  --tl:#26170D;
  --tx:#F3E5D8;
  --tx2:#C9AA8C;
  --tx3:#8F735D;
}

/* Grey Dark: only neutral greys, no brown background leakage. */
html.theme-dark.theme-grey,
body.theme-dark.theme-grey{
  --cr:#17191B;
  --cr2:#242629;
  --cr3:#2F3338;
  --wh:#1F2226;
  --bd:#454A50;
  --tl:#2A2D31;
  --tx:#F0F2F4;
  --tx2:#C7CCD1;
  --tx3:#AAB1B8;
  --tc:#C7CDD3;
  --sage:#8FA596;
}

/* Black / White: strict monochrome, with orange reserved for brand only. */
html.theme-dark.theme-mono,
body.theme-dark.theme-mono{
  --cr:#000;
  --cr2:#111;
  --cr3:#222;
  --wh:#000;
  --bd:#777;
  --tl:#111;
  --tx:#FFF;
  --tx2:#D8D8D8;
  --tx3:#AAA;
  --tc:#FFF;
  --sage:#FFF;
}

/* Focus / Earth-like comfort theme. */
html.theme-dark.theme-focus,
body.theme-dark.theme-focus{
  --cr:#15110D;
  --cr2:#392F2A;
  --cr3:#4A3B32;
  --wh:#211A16;
  --bd:#6A584A;
  --tl:#392F2A;
  --tx:#FFF8E8;
  --tx2:#E2CFA7;
  --tx3:#BBAA82;
  --tc:#A48648;
  --sage:#5D542D;
}

/* Theme-aware core surfaces. */
html.theme-dark .screen,
html.theme-dark body,
html.theme-dark .home-content,
html.theme-dark .settings-screen,
html.theme-dark .settings-body,
html.theme-dark .lang-page{
  background:var(--cr)!important;
  color:var(--tx)!important;
}
html.theme-dark .topbar,
html.theme-dark .settings-header,
html.theme-dark .stabs,
html.theme-dark .tabs,
html.theme-dark .modal,
html.theme-dark .sgroup,
html.theme-dark .srow,
html.theme-dark .banner,
html.theme-dark .listcard,
html.theme-dark .rcard,
html.theme-dark .sc,
html.theme-dark .witem,
html.theme-dark .lcard,
html.theme-dark .custom-lang-form,
html.theme-dark input,
html.theme-dark select,
html.theme-dark textarea{
  background:var(--wh)!important;
  color:var(--tx)!important;
  border-color:var(--bd)!important;
}
html.theme-dark .banner,
html.theme-dark .lcard.active,
html.theme-dark .witem.wisel{
  background:var(--tl)!important;
}
html.theme-dark .topbar-sub,
html.theme-dark .settings-meta,
html.theme-dark .srow-sub,
html.theme-dark .l,
html.theme-dark label,
html.theme-dark .tab,
html.theme-dark .stab{
  color:var(--tx3)!important;
}
html.theme-dark .tab.on,
html.theme-dark .stab.on{
  color:var(--tc)!important;
  border-bottom-color:var(--tc)!important;
  background:transparent!important;
}
html.theme-dark .bp,
html.theme-dark .mbtn.on,
html.theme-dark .seg-btn.on{
  background:var(--tc)!important;
  color:#fff!important;
  border-color:var(--tc)!important;
}

/* Black / White exception: selected actions should be readable black on white. */
html.theme-dark.theme-mono .bp,
html.theme-dark.theme-mono .mbtn.on,
html.theme-dark.theme-mono .seg-btn.on,
html.theme-dark.theme-mono .gcr,
html.theme-dark.theme-mono .review-save{
  background:#fff!important;
  color:#000!important;
  border-color:#fff!important;
}
html.theme-dark.theme-mono .bs,
html.theme-dark.theme-mono .mbtn,
html.theme-dark.theme-mono .seg-btn,
html.theme-dark.theme-mono .ib,
html.theme-dark.theme-mono .gwr{
  background:#111!important;
  color:#fff!important;
  border-color:#777!important;
}

/* Grey exception: selected actions are neutral and readable. */
html.theme-dark.theme-grey .bp,
html.theme-dark.theme-grey .mbtn.on,
html.theme-dark.theme-grey .seg-btn.on,
html.theme-dark.theme-grey .gcr,
html.theme-dark.theme-grey .review-save{
  background:#C7CDD3!important;
  color:#111!important;
  border-color:#C7CDD3!important;
}
html.theme-dark.theme-grey .bs,
html.theme-dark.theme-grey .mbtn,
html.theme-dark.theme-grey .seg-btn,
html.theme-dark.theme-grey .ib,
html.theme-dark.theme-grey .gwr{
  background:#242629!important;
  color:#F0F2F4!important;
  border-color:#454A50!important;
}

/* Modal backdrop should stay consistent across all dark themes. */
html.theme-dark .modal-bg{
  background:rgba(0,0,0,.58)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
}

/* Dropdown option contrast in dark mode. */
html.theme-dark select option{
  background:var(--wh)!important;
  color:var(--tx)!important;
}

/* Toggle controls: keep on/off states readable and theme-consistent. */
html.theme-dark .toggle .tslider{
  background:var(--cr3)!important;
  border:1px solid var(--bd)!important;
}
html.theme-dark .toggle .tslider:before{
  background:#fff!important;
}
html.theme-dark .toggle input:checked + .tslider{
  background:var(--tc)!important;
  border-color:var(--tc)!important;
}
html.theme-dark.theme-mono .toggle input:checked + .tslider:before,
html.theme-dark.theme-grey .toggle input:checked + .tslider:before{
  background:#000!important;
}

/* Toasts: predictable visibility above mobile safe area. */
.toast{
  bottom:calc(env(safe-area-inset-bottom,0px) + 26px)!important;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 10px 26px rgba(0,0,0,.28);
}
html.theme-dark .toast{
  background:var(--cr2)!important;
  color:var(--tx)!important;
  border-color:var(--bd)!important;
}

/* Heatmap theme consistency. */
html.theme-dark.theme-grey .hm-day[data-l="0"]{background:#2B2F33!important}
html.theme-dark.theme-grey .hm-day[data-l="1"]{background:#3B4147!important}
html.theme-dark.theme-grey .hm-day[data-l="2"]{background:#555C63!important}
html.theme-dark.theme-grey .hm-day[data-l="3"]{background:#7A838C!important}
html.theme-dark.theme-grey .hm-day[data-l="4"]{background:#C7CDD3!important}
html.theme-dark.theme-mono .hm-day[data-l="0"]{background:#111!important}
html.theme-dark.theme-mono .hm-day[data-l="1"]{background:#333!important}
html.theme-dark.theme-mono .hm-day[data-l="2"]{background:#777!important}
html.theme-dark.theme-mono .hm-day[data-l="3"]{background:#BBB!important}
html.theme-dark.theme-mono .hm-day[data-l="4"]{background:#FFF!important}
html.theme-dark.theme-focus .hm-day[data-l="0"]{background:#2A221E!important}
html.theme-dark.theme-focus .hm-day[data-l="1"]{background:#392F2A!important}
html.theme-dark.theme-focus .hm-day[data-l="2"]{background:#59290B!important}
html.theme-dark.theme-focus .hm-day[data-l="3"]{background:#5D542D!important}
html.theme-dark.theme-focus .hm-day[data-l="4"]{background:#A48648!important}
html.theme-dark.theme-palabras .hm-day[data-l="0"],
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .hm-day[data-l="0"]{background:#2A1B12!important}
html.theme-dark.theme-palabras .hm-day[data-l="1"],
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .hm-day[data-l="1"]{background:#3C2415!important}
html.theme-dark.theme-palabras .hm-day[data-l="2"],
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .hm-day[data-l="2"]{background:#6B3515!important}
html.theme-dark.theme-palabras .hm-day[data-l="3"],
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .hm-day[data-l="3"]{background:#A84A16!important}
html.theme-dark.theme-palabras .hm-day[data-l="4"],
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .hm-day[data-l="4"]{background:#D96B34!important}


/* =========================================================
   v6.3 MODAL SYSTEM STABILITY LAYER
   Purpose:
   - Stabilize modal/bottom-sheet behavior without visual redesign.
   - Centralize modal rules after previous iterative patches.
   - Keep the tested v5/v6.2 look as much as possible.
   ========================================================= */

/* Shared modal overlay */
.modal-bg{
  position:fixed!important;
  inset:0!important;
  z-index:99990!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:center!important;
  padding:0!important;
  background:rgba(0,0,0,.58)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
  overflow:hidden!important;
}

/* Shared modal shell */
.modal{
  position:relative!important;
  z-index:99991!important;
  width:100%!important;
  max-width:560px!important;
  max-height:min(78svh,720px)!important;
  overflow:auto!important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  border-radius:22px 22px 0 0!important;
  padding:18px 16px calc(18px + env(safe-area-inset-bottom,14px))!important;
  background:var(--wh)!important;
  color:var(--tx)!important;
  border:1px solid var(--bd)!important;
  box-shadow:0 -18px 55px rgba(0,0,0,.34)!important;
}

/* Modal header */
.modal .mhead{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin:0!important;
  padding:0 0 12px!important;
  border-bottom:1px solid var(--bd)!important;
  background:var(--wh)!important;
  color:var(--tx)!important;
}
.modal .mhead h2{
  margin:0!important;
  color:var(--tx)!important;
  font-size:1.08rem!important;
  line-height:1.25!important;
  letter-spacing:.2px;
}
.modal .mclose{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  border-radius:12px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid transparent!important;
  background:transparent!important;
  color:var(--tx2)!important;
  font-size:18px!important;
}
.modal .mclose:hover,
.modal .mclose:active{
  background:var(--cr2)!important;
  border-color:var(--bd)!important;
  color:var(--tx)!important;
}

/* Modal footer/actions */
.modal .mfoot{
  display:flex!important;
  gap:10px!important;
  margin-top:14px!important;
}
.modal .mfoot button{
  min-height:46px!important;
  border-radius:14px!important;
  font-weight:800!important;
}

/* Statistics modal: header/tabs fixed, content scrolls */
.stats-modal{
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}
.stats-modal .mhead{
  flex:0 0 auto!important;
  position:relative!important;
  z-index:4!important;
}
.stats-modal .tabs{
  flex:0 0 auto!important;
  display:flex!important;
  flex-wrap:nowrap!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  position:relative!important;
  z-index:3!important;
  background:var(--wh)!important;
  color:var(--tx2)!important;
  border-bottom:1px solid var(--bd)!important;
  padding:8px 2px 4px!important;
  margin:0!important;
}
.stats-modal .tabs::-webkit-scrollbar{display:none}
.stats-modal .tab{
  flex:0 0 auto!important;
  background:transparent!important;
  color:var(--tx2)!important;
  border-radius:0!important;
  border-bottom:3px solid transparent!important;
  padding:10px 13px!important;
  font-size:14px!important;
  line-height:1.1!important;
}
.stats-modal .tab.on{
  background:transparent!important;
  color:var(--tc)!important;
  border-bottom-color:var(--tc)!important;
}
.stats-content{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding-top:16px!important;
  padding-bottom:calc(20px + env(safe-area-inset-bottom,14px))!important;
}

/* Switch Language modal */
.lang-grid,
.modal .lang-grid{
  position:relative!important;
  z-index:1!important;
}
.modal .lcard{
  color:var(--tx)!important;
}

/* Review exit modal is a smaller raised sheet */
.review-exit-bg{
  align-items:flex-end!important;
  padding:0 16px calc(env(safe-area-inset-bottom,0px) + 34px)!important;
}
.review-exit-modal{
  max-width:430px!important;
  border-radius:22px!important;
  padding:20px 18px 22px!important;
  margin-bottom:18px!important;
}
.review-exit-modal .mhead{
  border-bottom:0!important;
  padding-bottom:0!important;
  margin-bottom:12px!important;
}
.review-exit-text{
  font-size:14px!important;
  color:var(--tx2)!important;
  line-height:1.6!important;
  margin:0 0 18px!important;
}

/* Desktop/tablet presentation */
@media(min-width:760px){
  .modal-bg{
    align-items:center!important;
    padding:24px!important;
    overflow:auto!important;
  }
  .modal{
    border-radius:20px!important;
    max-height:86vh!important;
    box-shadow:0 18px 55px rgba(0,0,0,.32)!important;
  }
  .review-exit-bg{
    align-items:center!important;
    padding:24px!important;
  }
  .review-exit-modal{
    margin-bottom:0!important;
  }
}

/* Small mobile tuning */
@media(max-width:420px){
  .modal{
    max-height:76svh!important;
    padding-left:14px!important;
    padding-right:14px!important;
  }
  .modal .mhead h2{
    font-size:1rem!important;
  }
  .review-exit-bg{
    padding-left:12px!important;
    padding-right:12px!important;
    padding-bottom:calc(env(safe-area-inset-bottom,0px) + 30px)!important;
  }
}

/* Theme-specific modal contrast */
html.theme-dark.theme-mono .modal,
html.theme-dark.theme-mono .modal .mhead,
html.theme-dark.theme-mono .stats-modal .tabs,
html.theme-dark.theme-mono .stats-content{
  background:#000!important;
  color:#fff!important;
  border-color:#777!important;
}
html.theme-dark.theme-mono .modal .mclose{
  color:#aaa!important;
}
html.theme-dark.theme-mono .modal .mclose:hover,
html.theme-dark.theme-mono .modal .mclose:active{
  background:#111!important;
  color:#fff!important;
  border-color:#777!important;
}
html.theme-dark.theme-mono .stats-modal .tab{
  color:#aaa!important;
}
html.theme-dark.theme-mono .stats-modal .tab.on{
  color:#fff!important;
  border-bottom-color:#fff!important;
}

html.theme-dark.theme-grey .modal,
html.theme-dark.theme-grey .modal .mhead,
html.theme-dark.theme-grey .stats-modal .tabs,
html.theme-dark.theme-grey .stats-content{
  background:#17191b!important;
  color:#f0f2f4!important;
  border-color:#454a50!important;
}
html.theme-dark.theme-grey .modal .mclose{
  color:#aab1b8!important;
}
html.theme-dark.theme-grey .modal .mclose:hover,
html.theme-dark.theme-grey .modal .mclose:active{
  background:#242629!important;
  color:#f0f2f4!important;
  border-color:#454a50!important;
}
html.theme-dark.theme-grey .stats-modal .tab{
  color:#aab1b8!important;
}
html.theme-dark.theme-grey .stats-modal .tab.on{
  color:#f0f2f4!important;
  border-bottom-color:#c7cdd3!important;
}

html.theme-dark.theme-palabras .modal,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .modal,
html.theme-dark.theme-palabras .modal .mhead,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .modal .mhead,
html.theme-dark.theme-palabras .stats-modal .tabs,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-modal .tabs,
html.theme-dark.theme-palabras .stats-content,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-content{
  background:#1E1208!important;
  color:#f3e5d8!important;
  border-color:rgba(217,107,52,.25)!important;
}
html.theme-dark.theme-palabras .modal .mclose,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .modal .mclose{
  color:#d7bfa9!important;
}
html.theme-dark.theme-palabras .modal .mclose:hover,
html.theme-dark.theme-palabras .modal .mclose:active,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .modal .mclose:hover,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .modal .mclose:active{
  background:#24160D!important;
  color:#F4E7DA!important;
  border-color:rgba(217,107,52,.28)!important;
}

html.theme-dark.theme-focus .modal,
html.theme-dark.theme-focus .modal .mhead,
html.theme-dark.theme-focus .stats-modal .tabs,
html.theme-dark.theme-focus .stats-content{
  background:#392F2A!important;
  color:#f6efe2!important;
  border-color:#7B6657!important;
}


/* =========================================================
   v6.3.2 MODAL BORDER POLISH
   Purpose:
   - Keep the cleaner v6.3 modal system and all its improvements.
   - Do NOT restore old modal styling.
   - Remove the visible outer modal border across all themes.
   - Preserve subtle internal separators and card borders.
   ========================================================= */

/* Remove the outer modal frame globally while keeping the cleaner v6.3 modal behavior. */
.modal,
.stats-modal,
.review-exit-modal{
  border-color:transparent!important;
}

/* Keep modal surface clean without changing layout/scroll behavior. */
.modal{
  box-shadow:0 18px 55px rgba(0,0,0,.34)!important;
}

/* Internal separators stay visible but softer. */
.modal .mhead,
.stats-modal .mhead,
.stats-modal .tabs{
  border-bottom-color:color-mix(in srgb, var(--bd) 72%, transparent)!important;
}

/* Palabras Dark: keep v6.3 cleaner structure, only soften the surface and remove the outside outline. */
html.theme-dark.theme-palabras .modal,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .modal,
html.theme-dark.theme-palabras .stats-modal,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-modal,
html.theme-dark.theme-palabras .review-exit-modal,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .review-exit-modal{
  background:#1E1208!important;
  border-color:transparent!important;
}

html.theme-dark.theme-palabras .modal .mhead,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .modal .mhead,
html.theme-dark.theme-palabras .stats-modal .mhead,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-modal .mhead,
html.theme-dark.theme-palabras .stats-modal .tabs,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-modal .tabs,
html.theme-dark.theme-palabras .stats-content,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-content{
  background:#1E1208!important;
}

/* Palabras Dark internal lines should remain subtle, not an outer frame. */
html.theme-dark.theme-palabras .modal .mhead,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .modal .mhead,
html.theme-dark.theme-palabras .stats-modal .mhead,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-modal .mhead,
html.theme-dark.theme-palabras .stats-modal .tabs,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-modal .tabs{
  border-bottom-color:rgba(217,107,52,.16)!important;
}

/* Grey: remove only modal outer border, keep clean grey surfaces. */
html.theme-dark.theme-grey .modal,
html.theme-dark.theme-grey .stats-modal,
html.theme-dark.theme-grey .review-exit-modal{
  border-color:transparent!important;
}

/* Black / White: remove only modal outer border, preserve strict contrast inside. */
html.theme-dark.theme-mono .modal,
html.theme-dark.theme-mono .stats-modal,
html.theme-dark.theme-mono .review-exit-modal{
  border-color:transparent!important;
}

/* Focus/Earth: remove only modal outer border. */
html.theme-dark.theme-focus .modal,
html.theme-dark.theme-focus .stats-modal,
html.theme-dark.theme-focus .review-exit-modal{
  border-color:transparent!important;
}

/* Fallback for browsers without color-mix support. */
@supports not (color: color-mix(in srgb, white 50%, black)){
  .modal .mhead,
  .stats-modal .mhead,
  .stats-modal .tabs{
    border-bottom-color:rgba(127,127,127,.22)!important;
  }
}


/* =========================================================
   v6.3.4 PALABRAS DARK STATISTICS ADJUSTMENT
   Base:
   - Built from v6.3.2 because it had the preferred modal look.
   Purpose:
   - Keep v6.3.2 improvements.
   - Fix Palabras Dark Statistics only where needed.
   - Do not recolor the actual level/type filled bars.
   - Make the full Levels/Types scale visible.
   - Make Today cards use the same surface as the main modal.
   ========================================================= */

/* Today cards: match the main modal surface instead of using the darker #130B06-like card surface. */
html.theme-dark.theme-palabras .stats-modal .sc,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-modal .sc{
  background:#1E1208!important;
  border-color:rgba(217,107,52,.16)!important;
  box-shadow:none!important;
}

/* Levels / Types: keep original fill colors, only make the full track/scale visible. */
html.theme-dark.theme-palabras .stats-modal .btrk,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-modal .btrk{
  background:rgba(164,134,72,.16)!important;
  border:1px solid rgba(164,134,72,.14)!important;
}

/* Keep labels/counts readable without changing the actual metric color language. */
html.theme-dark.theme-palabras .stats-modal .blbl,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-modal .blbl{
  color:#DCC7B0!important;
}

html.theme-dark.theme-palabras .stats-modal .bcnt,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-modal .bcnt{
  color:#B89B83!important;
}

/* Keep the v6.3.2 borderless modal and do not add an outer frame back. */
html.theme-dark.theme-palabras .stats-modal,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-modal,
html.theme-dark.theme-palabras .modal,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .modal{
  border-color:transparent!important;
}


/* =========================================================
   v6.3.5 STATISTICS TRACK + SURFACE POLISH
   Base:
   - Built from v6.3.4.
   Purpose:
   - Remove borders from full Levels/Types track.
   - Apply the same Statistics surface/track idea to Palabras Earth / Focus.
   - Keep the actual bar fill colors unchanged.
   ========================================================= */

/* Palabras Dark: full track visible, but without border edges. */
html.theme-dark.theme-palabras .stats-modal .btrk,
html.theme-dark:not(.theme-grey):not(.theme-mono):not(.theme-focus) .stats-modal .btrk{
  background:rgba(164,134,72,.16)!important;
  border:none!important;
  box-shadow:none!important;
}

/* Palabras Earth / Focus: Today cards use the same surface as the big modal. */
html.theme-dark.theme-focus .stats-modal .sc{
  background:#392F2A!important;
  border-color:rgba(164,134,72,.18)!important;
  box-shadow:none!important;
}

/* Palabras Earth / Focus: make full Levels/Types track visible without border edges. */
html.theme-dark.theme-focus .stats-modal .btrk{
  background:rgba(164,134,72,.18)!important;
  border:none!important;
  box-shadow:none!important;
}

/* Palabras Earth / Focus: improve label/count readability only. */
html.theme-dark.theme-focus .stats-modal .blbl{
  color:#F2E4C7!important;
}

html.theme-dark.theme-focus .stats-modal .bcnt{
  color:#CDBB91!important;
}

/* Palabras Earth / Focus: keep modal surface consistent. */
html.theme-dark.theme-focus .stats-modal,
html.theme-dark.theme-focus .stats-modal .mhead,
html.theme-dark.theme-focus .stats-modal .tabs,
html.theme-dark.theme-focus .stats-content{
  background:#392F2A!important;
}

/* Palabras Earth / Focus: keep separators subtle. */
html.theme-dark.theme-focus .stats-modal .mhead,
html.theme-dark.theme-focus .stats-modal .tabs{
  border-bottom-color:rgba(164,134,72,.22)!important;
}

/* =========================================================
   v6.4.4 LIGHT STATISTICS SESSION POLISH
   Purpose:
   - Remove the inconsistent sticky shadow in Statistics > Sessions.
   - Make light-theme session history flatter and more coherent.
   - Keep dark themes clean and shadow-free as before.
   ========================================================= */

/* Sessions tab: remove the sticky first-column drop shadow in every theme. */
.session-history-list .session-grid>div:first-child{
  box-shadow:none!important;
}

/* Replace the shadow with a clean divider so the pinned column still feels anchored. */
.session-history-list .session-grid>div:first-child{
  border-right:1px solid var(--bd)!important;
}

/* Light theme: cleaner, more unified session surfaces. */
html:not(.theme-dark) .session-card,
body:not(.theme-dark) .session-card{
  background:#F3ECE3!important;
  border-color:#DCCFC0!important;
  box-shadow:none!important;
}

html:not(.theme-dark) .session-history-list .session-grid{
  gap:10px!important;
}

html:not(.theme-dark) .session-history-list .session-grid>div:first-child{
  background:#F3ECE3!important;
  border-right:1px solid #DCCFC0!important;
}

html:not(.theme-dark) .session-history-list .session-grid>div:not(:first-child){
  background:#F7F1E9!important;
  border:1px solid #DCCFC0!important;
  border-radius:12px!important;
  padding:10px 8px!important;
}

html:not(.theme-dark) .session-no{
  background:#F7F1E9!important;
  border-color:#DCCFC0!important;
}

html:not(.theme-dark) .session-grid span{
  color:#9D7E6B!important;
}

/* Keep dark themes explicitly shadow-free here as well for consistency. */
html.theme-dark .session-history-list .session-grid>div:first-child,
body.theme-dark .session-history-list .session-grid>div:first-child{
  box-shadow:none!important;
}