:root{--pink:#d986a6;--pink2:#f8e1e9;--ink:#2c2430;--muted:#746a76;--shadow:0 16px 45px #9d537522}
*{box-sizing:border-box}
body{margin:0;background:#fff9fb;color:var(--ink);font:16px/1.45 system-ui,-apple-system,Segoe UI,sans-serif}
button{font:inherit;cursor:pointer;border:0}
header{height:72px;padding:0 max(22px,5vw);display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid #f2dce5}
.header-actions{display:flex;gap:10px;align-items:center}
.header-actions>button{background:#fff;border:1px solid #ead4dd;padding:9px 14px;border-radius:999px;font-weight:700}
.logo{background:none;font-size:25px;font-weight:850;color:#a52e64}.logo span{color:var(--ink);font-size:20px}
.score{background:var(--pink2);padding:9px 15px;border-radius:999px;font-weight:750}
main{max-width:1160px;margin:auto;padding:38px 24px}
.hero{background:linear-gradient(125deg,#fff,#fbe8ed);border:1px solid #f2d7df;border-radius:28px;padding:40px;display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow)}
h1{font-size:clamp(31px,5vw,54px);line-height:1.04;margin:8px 0 15px}.hero p{max-width:590px;color:var(--muted);font-size:18px}
.eyebrow{font-size:12px!important;font-weight:900!important;letter-spacing:.13em;color:#a74168!important;margin:0}
.mascot{font-size:105px;color:#c96c91;filter:drop-shadow(0 9px 0 #fff)}
.lessons{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:15px;margin-top:28px}
.lesson{background:#fff;text-align:left;padding:20px;border:1px solid #f0dce4;border-radius:18px;box-shadow:0 8px 25px #8b446311;transition:.15s}
.lesson:hover{transform:translateY(-2px);border-color:#dfaabd}.lesson strong{display:block;font-size:17px;min-height:48px}
.lesson.completed{background:#fff7fa;border-color:#e5b9ca;cursor:not-allowed}.lesson.completed:hover{transform:none;border-color:#e5b9ca}.lesson.completed small{color:#9b496b;font-weight:700}
.progress{height:9px;background:#f4e8ed;border-radius:9px;margin:15px 0 7px;overflow:hidden}.progress i{display:block;height:100%;background:var(--pink);border-radius:9px}.lesson small{color:var(--muted)}
.topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.topline button,#retry,#solution{background:#fff;border:1px solid #ead4dd;padding:10px 14px;border-radius:11px}
.exercise-grid{display:grid;grid-template-columns:minmax(320px,680px) minmax(260px,1fr);gap:34px;align-items:start}
.board-card{background:#fff;padding:16px;border:1px solid #f0dce4;border-radius:24px;box-shadow:0 18px 48px #8b446326}
.turn-indicator{display:flex;align-items:center;gap:9px;width:max-content;margin:0 0 12px 3px;padding:7px 12px;border:1px solid #ecd4de;border-radius:999px;background:#fff9fb;font-size:14px}.turn-dot{width:17px;height:17px;border:2px solid #2c2430;border-radius:50%;background:#fff;box-shadow:0 1px 3px #2c243033}.turn-indicator.black .turn-dot{background:#2c2430}.turn-indicator[hidden]{display:none}
.board{position:relative;width:100%;aspect-ratio:1;touch-action:none;overflow:hidden;border:1px solid #edceda;border-radius:14px;background:#f9edf1;box-shadow:inset 0 0 0 5px #fff,0 5px 18px #8b44631a}
.board img,.board>svg,.board-position,.board-position svg{position:absolute;inset:0;width:100%;height:100%;user-select:none}.board>svg{z-index:3;pointer-events:none}.board-position{z-index:1}.board-position svg{display:block}.board img{z-index:1;display:none}
.selected{fill:#d986a638;stroke:#a83c68;stroke-width:2}.dragging-piece{filter:drop-shadow(0 4px 3px #5b244866);opacity:.94}
aside{background:#fff;padding:28px;border-radius:22px;border:1px solid #f0dce4}h2{font-size:27px;line-height:1.15;margin:9px 0}#instruction{color:var(--muted);font-size:18px}
.status{min-height:58px;margin:22px 0;padding:15px;border-radius:12px;background:#f8f1f4}.status.ok{background:#e3f7ec;color:#176a40}.status.bad{background:#ffe7ed;color:#a71f46}
.actions{display:flex;gap:9px;flex-wrap:wrap}.actions button{padding:11px 15px;border-radius:11px}.primary{background:#c95885!important;color:#fff;font-weight:800}
.parent-head{margin-bottom:24px}.stat-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}
.stat-card,.report-card{background:#fff;border:1px solid #f0dce4;border-radius:18px;padding:22px;box-shadow:0 8px 25px #8b446311}.stat-card strong{display:block;font-size:34px}.stat-card span,.error-row small{color:var(--muted)}
.error-row{display:grid;grid-template-columns:1fr auto;gap:16px;padding:14px 0;border-bottom:1px solid #f2e6eb}.error-row:last-child{border:0}.error-badge{align-self:center;background:#ffe3eb;color:#a9224c;padding:6px 10px;border-radius:999px;font-weight:800}
.reset-card{margin-top:22px}.reset-card>p{color:var(--muted)}.reset-row{display:grid;grid-template-columns:minmax(260px,1fr) minmax(330px,1.2fr) auto;gap:20px;align-items:center;padding:15px 0;border-bottom:1px solid #f2e6eb}.reset-row:last-child{border:0}.reset-row small{color:var(--muted)}.lesson-stats{display:grid;grid-template-columns:repeat(4,minmax(62px,1fr));gap:7px}.lesson-stats span{display:grid;gap:1px;padding:7px 8px;text-align:center;background:#fff7fa;border:1px solid #f0dce4;border-radius:10px;color:var(--muted);font-size:11px}.lesson-stats b{color:var(--ink);font-size:16px}.reset-button{background:#fff0f3;color:#a61f45;border:1px solid #efbdcb;padding:9px 13px;border-radius:10px;font-weight:750}.reset-button:hover{background:#ffe0e8}.reset-button:disabled{opacity:.45;cursor:not-allowed}
.login-overlay{position:fixed;z-index:20;inset:0;display:grid;place-items:center;padding:20px;background:#2c243088;backdrop-filter:blur(3px)}.login-overlay[hidden]{display:none}.login-card{width:min(390px,100%);padding:28px;background:#fff;border:1px solid #efcfdb;border-radius:22px;box-shadow:0 24px 70px #2c243055}.login-card h2{margin-bottom:20px}.login-card label{display:grid;gap:6px;margin:13px 0;font-weight:700}.login-card input{width:100%;padding:11px 12px;border:1px solid #dfc4cf;border-radius:10px;font:inherit}.login-card input:focus{outline:3px solid #f3d9e3;border-color:#c95885}.login-error{margin:12px 0 0;color:#a71f46}.login-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:20px}.login-actions button{padding:10px 15px;border-radius:10px}.login-actions button:first-child{background:#fff;border:1px solid #ead4dd}
@media(max-width:800px){main{padding:22px 14px}.hero{padding:25px}.mascot{font-size:70px}.exercise-grid{grid-template-columns:1fr}.board-card{padding:9px}aside{padding:20px}.stat-cards{grid-template-columns:1fr 1fr}.reset-row{grid-template-columns:1fr auto}.lesson-stats{grid-column:1/-1;grid-row:2}.header-actions>button{font-size:13px;padding:8px}.score{display:none}}
