/* Новая оболочка (редизайн): верхняя панель с вкладками на десктопе, нижние
   вкладки на телефоне — и экран «Память». Токены — из today.css. Старое
   боковое меню убрано из разметки; его правила в base.css больше ни к чему
   не применяются. */
body{background:var(--ground)}
.app{display:block}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.shell{position:sticky;top:0;z-index:4;display:flex;align-items:center;gap:24px;padding:12px clamp(16px,3vw,32px);background:var(--surface);border-bottom:1px solid var(--rule);color:var(--text)}
.shell .brand{padding:0;font-size:17px;font-weight:700;letter-spacing:-.3px}
.shell .brand{gap:8px}
.shell .brand-mark{width:30px;height:auto}
.shell .brand-word{height:20px;width:auto}
.shell-tabs{display:flex;gap:4px}
.shell-tabs button{height:36px;padding:0 14px;border-radius:10px;background:none;color:var(--text-muted);font-size:14px;font-weight:500}
.shell-tabs button:hover{color:var(--text)}
.shell-tabs button.active{background:var(--surface-2);color:var(--text);font-weight:600}
.shell-actions{margin-left:auto;gap:8px}
.shell .language{height:36px;margin:0;padding:0 12px;border:1px solid var(--rule);border-radius:10px;background:transparent;color:var(--text);display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500}
.shell .language span{font-size:15px}
.shell .icon-btn{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--rule);border-radius:10px;background:transparent;color:var(--text);box-shadow:none}
.shell .icon-btn i{width:17px}
.shell .icon-btn:hover,.shell .language:hover{background:var(--surface-2)}
.shell .mini-avatar{width:36px;height:36px;background:var(--surface-2);color:var(--text);font-size:14px;font-weight:600}
.main{margin:0 auto;max-width:1320px;width:auto;padding:40px clamp(16px,4vw,64px) 64px}


/* «Память» */
#memory.screen.active{color:var(--text)}
.mem{display:flex;flex-wrap:wrap;gap:28px;align-items:flex-start}
.mem-main{flex:999 1 560px;min-width:0;display:flex;flex-direction:column;gap:20px}
.mem-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.mem-kicker{font-size:14px;color:var(--text-muted)}
.mem-total{display:flex;align-items:baseline;gap:10px;margin-top:4px}
.mem-total b{font-size:48px;font-weight:700;letter-spacing:-1.4px;line-height:1}
.mem-total span{font-size:16px;color:var(--text-muted)}
.mem-tools{display:flex;gap:10px;flex-wrap:wrap}
.mem-tools input{width:240px;height:44px;padding:0 14px;border:1px solid var(--rule);border-radius:12px;background:var(--surface);color:var(--text);font-size:15px}
.mem-primary,.mem-secondary{min-height:44px;padding:0 16px;border-radius:12px;font-size:14px;font-weight:600}
.mem-primary{background:var(--inverse);color:var(--inverse-ink)}
.mem-secondary{background:var(--surface);color:var(--text);border:1px solid var(--rule)}
.mem-card{background:var(--surface);border-radius:22px;padding:20px;display:flex;flex-direction:column;gap:16px;box-shadow:0 1px 2px rgba(22,24,29,.06)}
.mem-chips{display:flex;gap:8px;flex-wrap:wrap}
.mem-chip{height:36px;padding:0 14px;border-radius:18px;border:1px solid var(--rule);background:var(--surface);color:var(--text);font-size:13px;font-weight:500;display:flex;align-items:center;gap:8px}
.mem-chip.active{background:var(--inverse);border-color:var(--inverse);color:var(--inverse-ink)}
.dot{flex:none;width:10px;height:10px;border-radius:3px;background:var(--mem-strong)}
.dot.all{background:currentColor}.dot.weak{background:var(--mem-weak)}.dot.risk{background:var(--mem-risk)}.dot.new{background:var(--mem-new)}
.mem-map{display:grid;grid-template-columns:repeat(32,minmax(0,1fr));gap:3px}
.mem-map i{aspect-ratio:1;border-radius:3px;background:var(--mem-strong);cursor:pointer}
.mem-map i.weak{background:var(--mem-weak)}.mem-map i.risk{background:var(--mem-risk)}.mem-map i.new{background:var(--mem-new)}
.mem-map i.dim{background:var(--surface-2)}
.mem-map i.selected{outline:2px solid var(--text);outline-offset:1px}
.mem-hint{margin:0;font-size:13px;color:var(--text-muted)}
.mem-list{gap:0;padding:8px 20px}
.mem-row{display:flex;align-items:center;gap:14px;min-height:48px;padding:12px 10px;margin:0 -10px;width:calc(100% + 20px);border-bottom:1px solid var(--rule);border-radius:10px;background:none;color:var(--text);text-align:left}
.mem-row:last-child{border-bottom:0}
.mem-row:hover{background:var(--surface-2)}
.mem-row.selected{background:var(--accent-soft)}
.mem-row b{flex:1 1 140px;min-width:0;font-size:15px;font-weight:600;overflow-wrap:anywhere}
.mem-row .tr{flex:1 1 160px;min-width:0;font-size:14px;color:var(--text-muted)}
.mem-row .bar{flex:none;width:90px;height:6px;border-radius:3px;background:var(--surface-2);overflow:hidden}
.mem-row .bar i{display:block;height:100%;background:var(--mem-strong)}
.mem-row .bar i.weak{background:var(--mem-weak)}.mem-row .bar i.risk{background:var(--mem-risk)}
.mem-row .due{flex:none;width:120px;text-align:right;font-size:13px;color:var(--text-muted);font-weight:500}
.mem-row .due.risk,.mem-due.risk{color:var(--risk-text)}
.mem-empty{margin:12px 0;font-size:14px;color:var(--text-muted)}

.mem-detail{flex:1 1 340px;max-width:420px;min-width:0;position:sticky;top:84px;background:var(--surface);border-radius:24px;padding:24px;display:flex;flex-direction:column;gap:18px;box-shadow:0 1px 2px rgba(22,24,29,.06)}
.mem-back{display:none;align-self:flex-start;padding:0;background:none;color:var(--accent);font-size:14px;font-weight:600}
.mem-state{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--text-muted)}
.mem-state.risk{color:var(--risk-text)}
.mem-term{margin:-10px 0 0;font-size:32px;font-weight:700;letter-spacing:-.6px;overflow-wrap:anywhere}
.mem-translation{margin:-14px 0 0;font-size:17px}
.mem-muted{margin:-12px 0 0;font-size:14px;color:var(--text-muted)}
.mem-history .mem-muted{margin:0}
.mem-section{display:flex;flex-direction:column;gap:8px}
.mem-section h3{margin:0;font-size:13px;font-weight:500;color:var(--text-muted)}
.mem-due{margin:0;font-size:15px;font-weight:600}
.mem-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;padding:14px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.mem-stats dt{font-size:12px;color:var(--text-muted)}
.mem-stats dd{margin:2px 0 0;font-size:15px;font-weight:600}
.mem-history{display:flex;gap:6px;flex-wrap:wrap}
.mem-rating{padding:5px 9px;border-radius:8px;font-size:12px;font-weight:500;background:var(--accent-soft);color:var(--text)}
.mem-rating.forgot{background:#fdebe1;color:#8a3206}.mem-rating.hard{background:#fff3d6;color:#7a5b00}.mem-rating.easy{background:#e6f6ee;color:#0b5a3c}
body.dark .mem-rating.forgot{background:#3d2216;color:#ffb48a}body.dark .mem-rating.hard{background:#3a3214;color:#ffe08a}body.dark .mem-rating.easy{background:#15362a;color:#8fe3bd}
.mem-notes p{margin:0 0 6px;font-size:14px;line-height:1.5}
.mem-notes .example{font-style:italic;color:var(--text-muted)}
.mem-actions{display:flex;gap:8px;flex-wrap:wrap}
.mem-actions button{flex:1 1 140px;min-height:48px;border-radius:14px}
.mem-trouble{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:14px;border-radius:14px;background:var(--bad-soft)}
.mem-trouble .trouble-badge{font-size:12px;font-weight:600;letter-spacing:.3px;text-transform:uppercase;color:var(--bad)}
.mem-trouble small{font-size:13px;line-height:1.45;color:var(--text)}
.mem-trouble .link-button{padding:0;background:none;color:var(--accent);font-size:13px;font-weight:600}

@media(max-width:800px){
  .shell{gap:8px;padding:10px 16px}
  .shell-tabs{display:none}
  .shell .language{padding:0 9px}
  .shell .language b{display:none}
  .shell .top-actions .icon-btn{display:grid}
  .shell-actions{gap:6px}
  .main{padding:20px 16px 96px}
  .mobile-nav{background:var(--surface);border-color:var(--rule);height:64px;justify-content:space-around;padding:0 4px}
  .mobile-nav button{flex:1;min-width:0;padding:6px 0;font-size:11px;color:var(--text-muted)}
  .mobile-nav button.active{color:var(--accent)}
  .mem-total b{font-size:36px}
  .mem-tools{width:100%}
  .mem-tools input{flex:1 1 100%;width:auto}
  .mem-tools button{flex:1 1 0}
  .mem-map{grid-template-columns:repeat(16,minmax(0,1fr))}
  .mem-list{padding:4px 16px}
  .mem-row{gap:10px}
  .mem-row .tr,.mem-row .bar{display:none}
  .mem-row .due{width:auto}
  .mem-detail{display:none;position:static;max-width:none;flex-basis:100%}
  .mem.detail-open .mem-main{display:none}
  .mem.detail-open .mem-detail{display:flex}
  .mem-back{display:block}
}

/* Старая тёмная тема красит все кнопки правилом `body.dark button{color:var(--ink)}`
   (theme.css), и оно сильнее одиночного класса. Кнопкам нового дизайна с
   цветом, отличным от основного текста, возвращаем их цвет. */
body.dark .today-start,body.dark .mem-primary,body.dark .mem-chip.active,body.dark #home .topic-card .btn-primary,body.dark #home .topic-card .topic-danger{color:var(--inverse-ink)}
body.dark .text-link,body.dark .mem-back,body.dark .mobile-nav button.active,body.dark .mem-trouble .link-button{color:var(--accent)}
body.dark .shell-tabs button,body.dark .mobile-nav button,body.dark #home .topic-more{color:var(--text-muted)}
body.dark .shell-tabs button.active,body.dark .shell-tabs button:hover{color:var(--text)}
body.dark .shell .icon-btn,body.dark .shell .language{background:transparent;border-color:var(--rule)}
body.dark .shell .icon-btn:hover,body.dark .shell .language:hover{background:var(--surface-2)}
body.dark .mobile-nav{background:var(--surface);border-color:var(--rule)}
body.dark #home .coach-conflict{color:var(--scene-ink)}
/* Логотип Lingarik: у каждой картинки светлая и тёмная версия, видна та, что под текущую тему. */
.theme-dark{display:none}
body.dark .theme-light{display:none}
body.dark .theme-dark{display:inline-block}
.coach-label .coach-avatar{width:26px;height:auto}
.coach-label:has(.coach-avatar)::before{display:none}
.auth-brand:has(.auth-logo){justify-content:center}
.auth-logo{width:170px;height:auto}