:root{
  --bg:#F4F5F2; --card:#FFFFFF; --ink:#15181C; --muted:#56606B; --line:#D9DDD6;
  --accent:#0B7A45; --accent-ink:#FFFFFF; --tint:#E3F4EA; --tint-ink:#0B5E36;
  --dark:#15181C; --dark-2:#1F2429; --bright:#3DDC84; --bright-ink:#0B2416;
  --amber:#FFF1D1; --amber-ink:#4A3200;
}
body[data-theme="anfisa"]{
  --bg:#FBF6F7; --line:#EBDCE1; --accent:#B0305F; --tint:#FBE1EA; --tint-ink:#7A1E41;
  --bright:#FF7EB0; --bright-ink:#3B0A1E; --muted:#5E5458;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{background:var(--bg);color:var(--ink);font-family:'Golos Text',system-ui,sans-serif;font-size:16px}
h1,.title,.big,.avatar,.timer,.ch-title{font-family:'Unbounded',sans-serif}
.muted{color:var(--muted)} .small{font-size:14px} .light{color:#B9C2CB}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.error{color:#A1182E;font-weight:600}
[hidden]{display:none!important}

.btn{min-height:44px;padding:0 16px;border:2px solid var(--line);border-radius:12px;background:var(--card);
  color:var(--ink);font:inherit;font-size:15px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.btn:hover{border-color:var(--accent)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
.btn.accent{background:var(--bright);border-color:var(--bright);color:var(--bright-ink);font-weight:600}
.btn.outline-light{background:transparent;color:#fff;border-color:#2E343B}
.btn:disabled{opacity:.5;cursor:default}

/* вход */
#login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}
.login-box{width:100%;max-width:440px;display:flex;flex-direction:column;gap:16px}
.login-box h1{margin:0;font-size:32px}
.kid-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.kid-btn{min-height:120px;border-radius:20px;border:0;font-family:'Unbounded',sans-serif;font-size:22px;font-weight:700;color:#fff;cursor:pointer}
.kid-btn.mir{background:#15181C} .kid-btn.anfisa{background:#B0305F}
.pin-form{display:flex;flex-direction:column;gap:10px;background:var(--card);padding:20px;border-radius:16px}
.pin-form input{min-height:52px;border:2px solid var(--line);border-radius:12px;font-size:24px;text-align:center;letter-spacing:.3em}

/* урок */
#lesson{padding:16px;display:flex;flex-direction:column;gap:16px;max-width:1280px;margin:0 auto}
.topbar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;align-items:center;background:var(--card);border-radius:16px;padding:12px 16px}
.who{display:flex;gap:12px;align-items:center;min-width:0}
.avatar{width:44px;height:44px;border-radius:12px;background:var(--dark);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex:none}
body[data-theme="anfisa"] .avatar{background:var(--accent)}
.title{font-weight:700;font-size:17px}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{border-radius:999px;padding:8px 14px;font-size:14px;font-weight:500;background:var(--bg);border:0;font-family:inherit;color:var(--ink)}
.pill.status{background:var(--tint);color:var(--tint-ink);font-weight:600;display:inline-flex;align-items:center;gap:8px}
.pill.status i{width:8px;height:8px;border-radius:50%;background:var(--accent)}
.pill.status.paused{background:#ECEDEA;color:var(--muted)} .pill.status.paused i{background:#9AA3AC}
.pill.points{background:#FFF1D1;color:#6B4700;font-weight:600;cursor:pointer}
.pill.ghost{cursor:pointer}

.layout{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start}
.chat-card{flex:999 1 560px;min-width:0;background:var(--card);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:12px;min-height:70vh}
.side{flex:1 1 260px;display:flex;flex-direction:column;gap:16px}
.chat{display:flex;flex-direction:column;gap:12px;overflow-y:auto;max-height:62vh;padding-right:4px}
.msg{max-width:86%;padding:12px 14px;border-radius:16px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.msg.tutor{align-self:flex-start;background:var(--bg);border-bottom-left-radius:4px}
.msg.kid{align-self:flex-end;background:var(--dark);color:#fff;border-bottom-right-radius:4px}
body[data-theme="anfisa"] .msg.kid{background:#15181C}
.msg .q{display:block;margin-top:8px;padding:10px 12px;background:var(--tint);border-radius:12px;font-weight:600;color:var(--ink)}
.typing{color:var(--muted);font-size:14px}
.choices{display:flex;flex-wrap:wrap;gap:8px}
.answer-row{display:flex;gap:8px;flex-wrap:wrap}
.answer-row input{flex:1 1 200px;min-width:0;min-height:48px;border:2px solid var(--line);border-radius:12px;padding:0 14px;font:inherit;font-size:16px}
.answer-row input:focus{outline:none;border-color:var(--accent)}
.tools{display:flex;flex-wrap:wrap;gap:8px}

.card{background:var(--card);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:8px}
.card.dark{background:var(--dark);color:#fff}
.card .big{font-size:24px;font-weight:700;line-height:1.2}
.eyebrow{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#B9C2CB}
.label{font-weight:600}
.bar{height:10px;border-radius:999px;background:#2E343B;overflow:hidden}
.bar div{height:100%;background:var(--bright);width:0}

/* оверлеи */
.overlay{position:fixed;inset:0;background:rgba(21,24,28,.55);display:flex;align-items:center;justify-content:center;padding:16px;z-index:10}
.dark-overlay{background:#15181C}
.break-box{width:100%;max-width:420px;color:#fff;display:flex;flex-direction:column;gap:18px}
.break-box .eyebrow{color:var(--bright)}
.timer{font-size:64px;font-weight:700;line-height:1}
.challenge{background:#1F2429;border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:12px}
.ch-title{font-weight:700;font-size:20px;line-height:1.25}
.challenge input{background:#15181C;color:#fff;border-color:#2E343B}
.rewards-box{width:100%;max-width:440px;max-height:90vh;overflow:auto;background:var(--bg);border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:12px}
.rewards-head{display:flex;justify-content:space-between;align-items:center}
.rewards-head .big{font-size:36px;font-weight:700}
.reward-list{display:flex;flex-direction:column;gap:10px}
.reward{background:var(--card);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:8px}
.reward .row{display:flex;justify-content:space-between;gap:8px;font-weight:600}
.reward .bar{background:#E6E9E3} .reward .bar div{background:var(--accent)}

@media (max-width:640px){
  #lesson{padding:10px;gap:10px}
  /* переписка прокручивается внутри, поле ответа всегда на экране */
  .chat-card{height:calc(100dvh - 150px);min-height:420px;padding:12px}
  .chat{flex:1;min-height:0;max-height:none}
  .tools .btn{min-height:40px;padding:0 12px;font-size:14px}
  .msg{max-width:94%}
  .pill.ghost{display:none}
}

/* ---------- серии, табло, план ---------- */
.pill.streak{background:#FFF1D1;color:#6B4700;font-weight:700}
.pill.streak.bump{animation:bump .45s ease}
@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.35)}100%{transform:scale(1)}}
.bar.light{background:#E6E9E3}
.bar.light div{background:var(--accent)}
.scoreboard{display:flex;flex-direction:column;gap:6px}
.score-row{display:flex;justify-content:space-between;gap:8px;font-size:15px;padding:6px 10px;border-radius:10px}
.score-row.me{background:var(--tint);color:var(--tint-ink);font-weight:600}
.plan{display:flex;flex-wrap:wrap;gap:6px}
.plan span{font-size:13px;padding:5px 10px;border-radius:999px;background:var(--bg);color:var(--muted)}
.plan span.done{text-decoration:line-through}
.plan span.now{background:var(--accent);color:var(--accent-ink);font-weight:600}

/* всплывающий множитель */
#pop{position:fixed;left:50%;top:32%;transform:translate(-50%,-50%) scale(.6);opacity:0;pointer-events:none;z-index:30;
  display:flex;flex-direction:column;align-items:center;font-family:'Unbounded',sans-serif;font-weight:700;color:var(--accent);
  text-shadow:0 2px 0 #fff,0 0 18px rgba(255,255,255,.9)}
#pop-mult{font-size:72px;line-height:1}
#pop-pts{font-size:28px}
#pop.show{animation:popup 1.1s cubic-bezier(.2,1.4,.4,1) forwards}
@keyframes popup{0%{opacity:0;transform:translate(-50%,-30%) scale(.5)}25%{opacity:1;transform:translate(-50%,-50%) scale(1.15)}
  70%{opacity:1;transform:translate(-50%,-60%) scale(1)}100%{opacity:0;transform:translate(-50%,-90%) scale(.9)}}

/* уведомления */
#toasts{position:fixed;top:12px;right:12px;left:12px;z-index:40;display:flex;flex-direction:column;align-items:flex-end;gap:8px;pointer-events:none}
.toast{pointer-events:auto;max-width:380px;background:#15181C;color:#fff;border-radius:14px;padding:12px 14px;font-size:15px;line-height:1.4;
  box-shadow:0 8px 24px rgba(0,0,0,.25);animation:toastin .35s ease}
.toast.rival{background:#1E3A8A}
.toast.daily{background:#0B7A45}
.toast.rush{background:#E0400F}
@keyframes toastin{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}

/* ---------- РАШ-РЕЖИМ ---------- */
/* в раше — тёмная тема: на тёмном огонь и ×2 смотрятся ярче (папа, 14.10) */
body.rush{--bg:#1A0D09;--card:#24130D;--ink:#F7ECE4;--muted:#C9A894;--line:#4A2516;
  --accent:#FF5A1F;--accent-ink:#fff;--tint:#3D1A0C;--tint-ink:#FFB48C;--dark:#0E0604;
  color:var(--ink);background:linear-gradient(180deg,#0B0504 0%,#1A0906 55%,#2E0C04 100%) fixed;color-scheme:dark}
body.rush .card.dark{background:#120705;border:1px solid #3A1A0C}
body.rush .msg.kid{background:#3A1A0C;color:#FFE6D6}
body.rush .msg .q{color:var(--ink)}
body.rush .answer-row input{background:#140A07;color:var(--ink)}
body.rush .answer-row input::placeholder{color:#8E6D5C}
body.rush .pill.points{background:#3D2A08;color:#FFD27A}
body.rush .pill.status.paused{background:#2A1A14;color:var(--muted)}
body.rush .bar.light,body.rush .reward .bar{background:#3A1A0C}
body.rush .eyebrow{color:#C9A894}
body.rush #pop{text-shadow:0 2px 0 #000,0 0 22px rgba(255,90,20,.9)}
body.rush .bar div{background:linear-gradient(90deg,#FFB000,#FF4A12)}
body.rush .pill.streak{background:linear-gradient(90deg,#FF7A00,#E8420F);color:#fff;animation:glow 1s ease-in-out infinite}
@keyframes glow{0%,100%{box-shadow:0 0 0 rgba(255,90,20,0)}50%{box-shadow:0 0 18px rgba(255,90,20,.8)}}
#lesson{position:relative;z-index:1}
#flames{position:fixed;left:0;right:0;bottom:0;height:46vh;z-index:0;pointer-events:none;display:none}
body.rush #flames{display:block}
#flames canvas{display:block;width:100%;height:100%}
/* тёмно-красное зарево внизу — на нём огонь светится */
body.rush::before{content:"";position:fixed;left:0;right:0;bottom:0;height:42vh;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,110,30,0) 0%,rgba(230,70,15,.28) 55%,rgba(170,30,8,.55) 100%)}
@media (prefers-reduced-motion:reduce){#pop.show,.pill.streak.bump{animation:none}}
@media (max-width:640px){#flames{height:150px} #pop-mult{font-size:56px}}

/* значок ×2 в огоньке */
#rush-badge{position:fixed;z-index:35;pointer-events:none;width:116px;height:139px;right:22px;bottom:22px;opacity:0;
  transform:scale(.3);transition:right .7s cubic-bezier(.3,1.3,.5,1),bottom .7s cubic-bezier(.3,1.3,.5,1),width .7s,height .7s,opacity .3s,transform .4s}
#rush-badge svg{width:100%;height:100%;overflow:visible}
body.rush #rush-badge{opacity:1;transform:scale(1);animation:badge-pulse 1s ease-in-out infinite}
#rush-badge.intro{right:calc(50% - 130px);bottom:calc(50% - 156px);width:260px;height:312px;animation:badge-in .8s cubic-bezier(.2,1.6,.4,1) both!important}
@keyframes badge-in{0%{transform:scale(0) rotate(-20deg);opacity:0}60%{transform:scale(1.15) rotate(4deg);opacity:1}100%{transform:scale(1) rotate(0)}}
@keyframes badge-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}
#rush-badge .fl{transform-box:fill-box;transform-origin:50% 100%}
#rush-badge .fl-out{animation:fl-flick .5s ease-in-out infinite alternate}
#rush-badge .fl-mid{animation:fl-flick .38s ease-in-out infinite alternate-reverse}
#rush-badge .fl-core{animation:fl-flick .3s ease-in-out infinite alternate}
@keyframes fl-flick{0%{transform:scaleY(.94) scaleX(1.03) skewX(-2deg)}100%{transform:scaleY(1.05) scaleX(.97) skewX(2deg)}}
@media (max-width:640px){#rush-badge{width:84px;height:100px;right:12px;bottom:12px}}
@media (prefers-reduced-motion:reduce){#rush-badge,#rush-badge .fl{animation:none!important}}

/* мини-игры на перерыве */
.break-box.wide{max-width:760px}
.choice{display:flex;gap:10px;flex-wrap:wrap}
.choice .btn{flex:1 1 140px;min-height:52px;font-size:16px}
.game-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.game-card{background:#1F2429;border:2px solid #2E343B;border-radius:16px;padding:14px 12px;color:#fff;font:inherit;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.game-card:hover{border-color:var(--bright)}
.game-card .gi{font-size:40px;line-height:1}
.game-card .gn{font-weight:600;font-size:15px}
.game-card .gr{font-size:12px;color:#B9C2CB}
.game-stage{display:flex;flex-direction:column;gap:8px}
.game-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.game-head #game-title{font-weight:600}
.game-head #game-score{font-family:'Unbounded',sans-serif;font-weight:700;font-size:22px;color:var(--bright)}
.game-head #game-exit{margin-left:auto;min-height:38px}
#game-canvas{width:100%;height:min(66vh,560px);border-radius:16px;display:block;touch-action:none;background:#000}
.game-over{background:#1F2429;border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:10px;align-items:center;text-align:center}
.go-score{font-family:'Unbounded',sans-serif;font-weight:700;font-size:56px;color:var(--bright)}
.go-new{color:#FFD21F;font-weight:700}

body.on-break #rush-badge{display:none}
