:root{--ink:#18313b;--muted:#6d8389;--paper:#f8fffc;--teal:#159d91;--teal2:#34c5b2;--gold:#f2b84b;--coral:#ee705f;--plum:#5c375f;--wine:#7e2947;--line:#dceae6;--good:#16895f;--bad:#c64646;--shadow:0 24px 70px rgba(28,75,76,.13);font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink)}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 8% 2%,#d9fff2 0,transparent 31%),radial-gradient(circle at 93% 7%,#fff0c9 0,transparent 28%),linear-gradient(145deg,#f8fffc,#f7f4ff);overflow-x:hidden}.aurora{position:fixed;width:460px;height:460px;border-radius:50%;filter:blur(75px);opacity:.18;pointer-events:none}.aurora-one{background:#2ccbb7;left:-230px;top:42%}.aurora-two{background:#ee705f;right:-260px;bottom:-100px}.topbar{width:min(1440px,calc(100% - 32px));margin:18px auto 0;padding:15px 22px;display:flex;align-items:center;justify-content:space-between;border:1px solid rgba(255,255,255,.8);background:rgba(255,255,255,.72);backdrop-filter:blur(16px);border-radius:22px;box-shadow:0 10px 34px rgba(47,96,92,.09)}.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,var(--teal2),var(--teal));color:white;font:900 23px Georgia;box-shadow:0 8px 20px rgba(21,157,145,.25)}.brand strong,.brand small{display:block}.brand strong{font-size:18px}.brand small{color:var(--muted);margin-top:2px}.top-progress{display:flex;align-items:center;gap:12px;font-weight:800}.progress-track{width:190px;height:9px;border-radius:10px;background:#e3eeeb;overflow:hidden}.progress-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--teal),var(--gold));border-radius:inherit;transition:width .35s}.layout{position:relative;width:min(1440px,calc(100% - 32px));margin:16px auto 28px;display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:18px}.workspace,.sidebar>section{border:1px solid rgba(255,255,255,.88);background:rgba(255,255,255,.78);backdrop-filter:blur(16px);box-shadow:var(--shadow)}.workspace{padding:26px;border-radius:30px}.slide-head{display:flex;justify-content:space-between;gap:15px;align-items:flex-start}.eyebrow{color:var(--teal);font-size:11px;font-weight:900;letter-spacing:.14em}.slide-head h1{margin:7px 0 20px;font-size:clamp(25px,3vw,38px);line-height:1.1}.badge{padding:9px 13px;border:1px solid #eadfbf;border-radius:999px;background:#fff9e9;color:#886622;font-size:13px;font-weight:800;white-space:nowrap}.badge.done{background:#e9fbf4;border-color:#bde8d7;color:var(--good)}.exercise{display:grid;grid-template-columns:minmax(330px,48%) minmax(300px,1fr);gap:24px;padding:20px;border-radius:25px;background:linear-gradient(145deg,rgba(229,252,246,.8),rgba(255,248,231,.75));border:1px solid var(--line)}.sticker-frame{margin:0;min-height:510px;display:grid;place-items:center;padding:12px;border-radius:22px;background:radial-gradient(circle,#fff 30%,#eff9f5);border:1px solid #d9ebe5;overflow:hidden}.sticker-frame img{display:block;width:100%;height:100%;max-height:560px;object-fit:contain;filter:drop-shadow(0 15px 18px rgba(43,75,70,.12));animation:arrive .35s ease}.questions{display:flex;flex-direction:column;gap:14px}fieldset{margin:0;padding:17px;border:1px solid var(--line);border-radius:19px;background:rgba(255,255,255,.82);min-width:0}legend{padding:0 7px;font-weight:850;font-size:17px}legend span{display:inline-grid;place-items:center;width:27px;height:27px;margin-right:7px;border-radius:9px;background:#dff8f2;color:var(--teal)}.hint{margin:0 0 10px;color:var(--muted);font-size:13px}.letter-options,.check-options{display:flex;flex-wrap:wrap;gap:9px}.choice{border:1px solid #cfe2dd;background:#fff;color:var(--ink);cursor:pointer;border-radius:13px;font-weight:800;transition:.18s transform,.18s box-shadow,.18s border-color}.choice:hover:not(:disabled){transform:translateY(-2px);border-color:var(--teal2);box-shadow:0 7px 18px rgba(28,157,144,.12)}.choice.selected{color:#fff;background:linear-gradient(135deg,var(--plum),var(--wine));border-color:transparent;box-shadow:0 7px 18px rgba(92,55,95,.2)}.choice:disabled{cursor:default;opacity:.68}.letter-options .choice{width:65px;height:52px;font-size:23px}.check-options .choice{padding:11px 14px;font-size:15px}.feedback{min-height:20px;margin:12px 0 0;font-size:13px;font-weight:700}.feedback.muted{color:var(--muted)}.feedback.good{color:var(--good)}.feedback.bad{color:var(--bad)}.primary-button,.secondary-button,.danger-button,.page-jump button,.text-button{font:inherit;cursor:pointer}.primary-button{margin-top:auto;padding:15px 20px;border:0;border-radius:15px;background:linear-gradient(135deg,var(--teal2),var(--teal));box-shadow:0 12px 28px rgba(21,157,145,.23);color:white;font-weight:900;font-size:16px}.primary-button:hover{filter:saturate(1.15);transform:translateY(-1px)}.controls{margin-top:18px;display:flex;align-items:center;justify-content:space-between;gap:10px}.secondary-button{padding:11px 15px;border:1px solid var(--line);border-radius:13px;background:#fff;color:var(--ink);font-weight:800}.secondary-button:disabled{opacity:.38;cursor:default}.page-jump{display:flex;align-items:center;gap:5px}.page-jump>button{border:0;background:transparent;color:var(--muted);font-size:25px}.page-jump>button:disabled{opacity:.2}.page-jump div{display:flex;gap:5px}.dot{width:34px;height:34px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--muted);font-weight:800;cursor:pointer}.dot.active{background:var(--plum);color:#fff;border-color:var(--plum)}.dot.done:not(.active){border-color:#78cbb5;color:var(--good);background:#effbf7}.reset-row{display:flex;justify-content:space-between;gap:10px;margin-top:11px;color:var(--muted);font-size:12px}.text-button{border:0;background:transparent;color:var(--wine);font-weight:800}.sidebar{display:flex;flex-direction:column;gap:16px}.sidebar>section{border-radius:24px;padding:19px}.score-card{display:flex;align-items:center;gap:16px}.score-ring{width:100px;aspect-ratio:1;border-radius:50%;display:grid;place-content:center;text-align:center;background:radial-gradient(circle at center,#fff 53%,transparent 55%),conic-gradient(var(--teal) var(--score),#e5efec 0)}.score-ring strong{font-size:23px}.score-ring span{font-size:11px;color:var(--muted)}.score-copy h2{font-size:19px;margin:0 0 8px}.score-copy p{margin:5px 0;color:var(--muted);font-size:13px}.score-copy b{color:var(--ink)}.section-title{display:flex;justify-content:space-between;gap:10px;align-items:center}.section-title h2{margin:4px 0 0;font-size:20px}.counter{min-width:30px;height:30px;display:grid;place-items:center;background:#fff0ed;color:var(--coral);border-radius:10px;font-weight:900}.journal{margin-top:14px;max-height:560px;overflow:auto;display:grid;gap:9px}.empty{padding:24px 10px;text-align:center;color:var(--muted);font-size:13px}.journal-entry{padding:12px;border-left:3px solid var(--coral);border-radius:10px;background:#fff8f6;font-size:12px}.journal-entry strong{display:block;margin-bottom:5px}.journal-entry span{display:block;color:#785d5d;line-height:1.4}.danger-button{padding:12px;border:1px solid #edcfd4;border-radius:14px;background:rgba(255,255,255,.72);color:var(--wine);font-weight:800}.danger-button:hover{background:#fff3f4}@keyframes arrive{from{opacity:0;transform:translateY(7px) scale(.985)}}
@media(max-width:1050px){.layout{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:1fr 1.4fr}.danger-button{grid-column:1/-1}.journal{max-height:300px}}@media(max-width:760px){.topbar{width:min(100% - 18px,1440px);padding:12px}.progress-track{display:none}.layout{width:min(100% - 18px,1440px)}.workspace{padding:15px;border-radius:22px}.exercise{grid-template-columns:1fr;padding:13px}.sticker-frame{min-height:340px;max-height:480px}.slide-head h1{font-size:25px}.sidebar{display:flex}.controls{flex-wrap:wrap}.page-jump{order:3;width:100%;justify-content:center}.reset-row{align-items:flex-start}.brand small{display:none}}@media(max-width:430px){.slide-head{display:block}.badge{display:inline-block;margin-bottom:10px}.sticker-frame{min-height:290px}.secondary-button{flex:1}.dot{width:31px;height:31px}.top-progress{font-size:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* Финальная яркая тема и два типа компоновки карточек. */
body{background:radial-gradient(circle at 8% 2%,#caffef 0,transparent 30%),radial-gradient(circle at 92% 5%,#ffe7a8 0,transparent 27%),radial-gradient(circle at 86% 88%,#ffd8d2 0,transparent 24%),linear-gradient(145deg,#f6fff9,#f8f3ff)}
.workspace{background:linear-gradient(155deg,rgba(255,255,255,.92),rgba(241,255,250,.86));border-color:rgba(255,255,255,.95);box-shadow:0 25px 80px rgba(24,112,104,.16)}
.exercise{position:relative;overflow:hidden;background:linear-gradient(145deg,rgba(213,251,241,.92),rgba(255,241,202,.78));border-color:rgba(32,176,157,.2);box-shadow:inset 0 1px rgba(255,255,255,.9)}
.exercise::after{content:"";position:absolute;inset:auto -80px -110px auto;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(238,112,95,.18),transparent 68%);pointer-events:none}
.exercise.horizontal{grid-template-columns:1fr}
.exercise.horizontal .sticker-frame{min-height:340px;max-height:455px}
.exercise.horizontal .sticker-frame img{width:min(100%,820px);max-height:420px}
.exercise.horizontal .questions{display:grid;grid-template-columns:minmax(230px,.82fr) minmax(320px,1.18fr);align-items:stretch}
.exercise.horizontal .primary-button{grid-column:1/-1;margin-top:0}
.exercise.vertical{grid-template-columns:minmax(300px,47%) minmax(300px,1fr)}
.sticker-frame{position:relative;isolation:isolate;background:linear-gradient(145deg,#d2fff1,#fff1ba);border:2px solid rgba(255,255,255,.96);box-shadow:inset 0 0 0 1px rgba(20,154,141,.16),0 18px 38px rgba(37,106,95,.15)}
.sticker-frame::before,.sticker-frame::after{content:"";position:absolute;z-index:-1;pointer-events:none;filter:blur(1px)}
.sticker-frame::before{width:72%;height:64%;left:8%;top:11%;border-radius:43% 57% 62% 38%/54% 38% 62% 46%;background:linear-gradient(135deg,rgba(21,157,145,.56),rgba(52,197,178,.25));transform:rotate(-4deg)}
.sticker-frame::after{width:47%;height:43%;right:6%;bottom:8%;border-radius:62% 38% 48% 52%;background:linear-gradient(135deg,rgba(242,184,75,.62),rgba(238,112,95,.35));transform:rotate(8deg)}
.sticker-frame[data-tone="1"]::before{background:linear-gradient(135deg,rgba(238,112,95,.5),rgba(242,184,75,.28))}.sticker-frame[data-tone="2"]::before{background:linear-gradient(135deg,rgba(92,55,95,.38),rgba(238,112,95,.28))}.sticker-frame[data-tone="3"]::before{background:linear-gradient(135deg,rgba(124,164,74,.5),rgba(52,197,178,.28))}.sticker-frame[data-tone="4"]::before{background:linear-gradient(135deg,rgba(242,184,75,.56),rgba(255,225,126,.3))}
.sticker-frame img{position:relative;z-index:1}
.image-caption{position:absolute;z-index:3;left:10%;right:10%;bottom:7%;padding:10px 8px;text-align:center;border-radius:46% 54% 45% 55%/48% 42% 58% 52%;background:#fff;color:#111;font-family:"Arial Rounded MT Bold","Segoe UI",sans-serif;font-size:clamp(18px,2.1vw,31px);font-weight:950;line-height:1.05;letter-spacing:.01em;box-shadow:0 0 0 8px rgba(255,255,255,.96),0 8px 16px rgba(20,40,35,.12)}
.choice.selected{background:linear-gradient(135deg,#8b3154,#65406f);box-shadow:0 9px 24px rgba(126,41,71,.27),0 0 0 3px rgba(255,205,103,.3)}
.dot.active{color:#442a16;border-color:#ffc65a;background:linear-gradient(145deg,#ffe887,#ffb84f 58%,#ff8b68);box-shadow:0 8px 18px rgba(238,144,63,.3),0 0 0 3px rgba(255,215,123,.24);transform:translateY(-2px)}
.page-jump>button{width:34px;height:34px;border-radius:11px;background:rgba(21,157,145,.09);color:var(--teal);font-weight:900;line-height:1}.page-jump>button:hover:not(:disabled){background:rgba(21,157,145,.17);box-shadow:0 7px 18px rgba(21,157,145,.13)}
.cursor-glow{position:fixed;z-index:9999;width:12px;height:12px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,#fff6bd 0 18%,rgba(255,190,77,.9) 25%,rgba(35,201,178,.5) 55%,transparent 72%);transform:translate(-50%,-50%);animation:cursorFade .65s ease-out forwards}
@keyframes cursorFade{to{opacity:0;transform:translate(-50%,-50%) scale(3)}}
@media(max-width:900px){.exercise.horizontal .questions{grid-template-columns:1fr}.exercise.horizontal .primary-button{grid-column:auto}.exercise.vertical{grid-template-columns:1fr}.exercise.vertical .sticker-frame{min-height:430px;max-height:620px}}
@media(max-width:760px){.exercise.horizontal .sticker-frame{min-height:260px;max-height:370px}.exercise.horizontal .sticker-frame img{max-height:335px}.exercise.vertical .sticker-frame{min-height:360px;max-height:520px}.image-caption{bottom:6%;font-size:clamp(17px,5vw,25px)}}
@media(max-width:430px){.exercise.horizontal .sticker-frame{min-height:220px}.exercise.vertical .sticker-frame{min-height:320px}.questions{gap:11px}fieldset{padding:14px}.check-options .choice{flex:1 1 auto}.page-jump div{gap:3px}.dot{width:30px;height:30px;border-radius:9px}}
@media(max-width:760px){.exercise.horizontal,.exercise.vertical{grid-template-columns:1fr}.exercise.horizontal .questions,.exercise.vertical .questions{display:flex;flex-direction:column}.exercise.horizontal .primary-button{grid-column:auto}}
.stressed-vowel{display:inline-block;font-size:2em;font-weight:950;line-height:.5;vertical-align:-.08em}
.check-input{width:100%;min-height:50px;padding:12px 14px;border:2px solid #cfe2dd;border-radius:13px;background:#fff;color:var(--ink);font:800 17px/1.3 Inter,"Segoe UI",Arial,sans-serif;outline:0;transition:border-color .18s,box-shadow .18s}
.exercise.vertical.portrait-large{grid-template-columns:minmax(380px,58%) minmax(300px,1fr)}
.exercise.vertical.portrait-large .sticker-frame{min-height:640px;padding:6px}
.exercise.vertical.portrait-large .sticker-frame img{max-height:700px}
@media(max-width:900px){.exercise.vertical.portrait-large{grid-template-columns:1fr}.exercise.vertical.portrait-large .sticker-frame{min-height:540px;max-height:680px}}
@media(max-width:760px){.exercise.vertical.portrait-large .sticker-frame{min-height:450px;max-height:650px}}
@media(max-width:430px){.exercise.vertical.portrait-large .sticker-frame{min-height:400px;max-height:580px}}
.check-input:focus{border-color:var(--teal);box-shadow:0 0 0 4px rgba(21,157,145,.14)}
.check-input:disabled{background:#f1f8f5;color:var(--good);opacity:.86}

/* Уровень 2: коррекционное задание появляется в левой колонке под изображением. */
#checkField[hidden]{display:none!important}
.exercise.horizontal .questions{grid-template-columns:1fr}
.visual-column{min-width:0;display:flex;flex-direction:column;gap:14px}
.correction-inline[hidden]{display:none!important}
.correction-inline{width:100%;animation:correctionReveal .24s ease}
.correction-field{background:rgba(255,255,255,.88);box-shadow:0 12px 32px rgba(25,111,99,.08)}
.correction-field .primary-button{width:100%;margin-top:14px}
@keyframes correctionReveal{from{opacity:0;transform:translateY(-8px)}}
@media(max-width:760px){.visual-column{gap:11px}.correction-inline,.correction-field{width:100%;min-width:0}.correction-field .check-options{max-width:100%}}