:root{--navy:#16375c;--ink:#24323f;--cream:#fff9e8;--yellow:#ffd75b;--green:#50b985;--blue:#73a9ff;--purple:#9c7ae5;--red:#ef7777;--orange:#ffad63;--paper:#fff;--line:#dce6ee}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Nunito,ui-rounded,"Segoe UI",system-ui,sans-serif;color:var(--ink);background:linear-gradient(#fffdf7,#f6fbff);overflow-x:hidden}a{color:inherit}.kid-topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:16px;padding:10px 20px;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);box-shadow:0 4px 18px rgba(29,56,81,.07)}.kid-brand{display:flex;align-items:center;gap:10px;text-decoration:none}.kid-brand img{width:52px;height:52px;border-radius:16px}.kid-brand b{font-size:21px;color:var(--navy)}.kid-brand small{display:block;font-size:11px;color:#607284;white-space:nowrap}.kid-topbar nav{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}.kid-topbar nav a{padding:9px 12px;border-radius:999px;text-decoration:none;font-weight:900;font-size:13px;background:#f5f8fb}.kid-topbar nav .live{background:#eafff1;color:#147047}.language-picker{font-size:11px;font-weight:900;color:#587080}.language-picker select{display:block;margin-top:2px;padding:7px;border:1px solid #cad7df;border-radius:10px;background:white;max-width:150px}main{max-width:1420px;margin:auto}.hero-kid{margin:24px 20px 0;border-radius:34px;min-height:540px;display:grid;grid-template-columns:1.05fr .95fr;gap:28px;align-items:center;padding:48px;background:radial-gradient(circle at 12% 12%,#fff7ba 0 15%,transparent 36%),radial-gradient(circle at 90% 10%,#dff5ff 0 16%,transparent 38%),linear-gradient(135deg,#fff7dc,#ecfff5 58%,#eef4ff);position:relative;overflow:hidden;border:1px solid #dfe8ec}.hero-kid:before,.hero-kid:after{content:"";position:absolute;border-radius:50%;filter:blur(1px);opacity:.45}.hero-kid:before{width:160px;height:160px;background:#ffd0db;left:-50px;bottom:-40px}.hero-kid:after{width:180px;height:180px;background:#d7c8ff;right:-60px;top:30px}.hero-copy{position:relative;z-index:2}.pill{display:inline-flex;padding:7px 12px;border-radius:999px;background:#fff0a8;color:#755500;font-weight:1000;font-size:12px;letter-spacing:.06em}.pill.blue{background:#e7f1ff;color:#285a9c}.pill.green{background:#e4f9ed;color:#21744c}.pill.purple{background:#efe9ff;color:#6341a1}.pill.red{background:#ffe6e6;color:#a43d3d}.pill.orange{background:#fff0df;color:#9a541e}.hero-kid h1{font-size:clamp(42px,6vw,76px);line-height:.98;margin:15px 0;color:var(--navy);letter-spacing:-.04em}.hero-kid h1 em{font-style:normal;color:#df6e63;text-decoration:underline wavy #ffd75b 5px;text-underline-offset:7px}.hero-copy p{font-size:20px;line-height:1.6;max-width:760px}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.big-btn{border:0;padding:13px 17px;border-radius:14px;font-weight:1000;text-decoration:none;background:white;box-shadow:0 8px 18px rgba(30,60,90,.09);cursor:pointer;font-size:14px}.big-btn.primary{background:var(--navy);color:white}.hero-progress{display:flex;align-items:center;gap:8px;margin-top:24px;font-size:12px;font-weight:900;color:#60707d}.hero-progress i{width:40px;height:3px;background:#c8d6df;border-radius:4px}.hero-playground{position:relative;min-height:430px}.mini-board{width:min(78vw,410px);aspect-ratio:1;margin:30px auto 0;border:10px solid var(--navy);border-radius:22px;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);overflow:hidden;transform:rotate(3deg);box-shadow:0 25px 45px rgba(30,60,90,.22)}.mini-board .sq:nth-child(odd){background:#f0d9b5}.mini-board .sq:nth-child(even){background:#6d9f55}.orbit{position:absolute;z-index:3;font-size:58px;animation:floaty 3.6s ease-in-out infinite;filter:drop-shadow(0 7px 8px rgba(0,0,0,.18))}.o1{left:2%;top:3%;animation-delay:.2s}.o2{right:3%;top:1%;animation-delay:.7s}.o3{left:7%;bottom:6%;animation-delay:1.1s}.o4{right:5%;bottom:7%;animation-delay:1.6s}.speech-bubble{position:absolute;right:2%;bottom:-5px;background:white;padding:13px 17px;border-radius:20px 20px 5px 20px;box-shadow:0 8px 25px rgba(20,55,90,.14);font-size:13px;z-index:4}@keyframes floaty{0%,100%{transform:translateY(0) rotate(-5deg)}50%{transform:translateY(-18px) rotate(6deg)}}section:not(.hero-kid){margin:34px 20px}.section-head{text-align:center;max-width:850px;margin:0 auto 22px}.section-head h2{font-size:clamp(30px,4vw,48px);margin:10px 0;color:var(--navy);letter-spacing:-.03em}.section-head p{font-size:17px;line-height:1.55;color:#60707d}.learning-map{padding:35px 20px;border-radius:28px;background:white;border:1px solid var(--line)}.map-track{display:grid;grid-template-columns:repeat(8,minmax(120px,1fr));gap:12px;overflow-x:auto;padding-bottom:8px}.map-track a{min-width:120px;text-decoration:none;background:linear-gradient(#fff,#f7fbff);border:1px solid #dce7ef;border-radius:20px;padding:15px;text-align:center;position:relative;transition:.2s}.map-track a:hover{transform:translateY(-5px);box-shadow:0 12px 26px rgba(24,63,93,.12)}.map-track a b{position:absolute;left:8px;top:8px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:white;font-size:11px}.map-track a span{font-size:34px;display:block;margin:10px}.map-track a strong,.map-track a small{display:block}.map-track a small{margin-top:4px;color:#718392}.story-zone{display:grid;gap:16px}.story-card{display:grid;grid-template-columns:.55fr 1.45fr;gap:28px;align-items:center;padding:30px;border-radius:28px;background:#fff8e9;border:1px solid #f2dfbc}.story-illustration{height:260px;position:relative;display:grid;place-items:center}.old-piece,.modern-piece{font-size:100px;position:absolute;animation:floaty 4s ease-in-out infinite}.old-piece{left:8%;top:20%}.modern-piece{right:8%;bottom:10%;animation-delay:.9s}.travel-line{width:66%;height:10px;border-radius:10px;background:repeating-linear-gradient(90deg,#ffb157 0 20px,transparent 20px 32px);transform:rotate(-18deg)}.story-card h2{font-size:38px;color:var(--navy);margin:10px 0}.story-card p{font-size:17px;line-height:1.65}.story-card button,.teacher-card button,.rule-copy button,.notation-game button,.score-sheet-wrap button{border:0;border-radius:12px;padding:10px 14px;font-weight:900;background:var(--navy);color:white;cursor:pointer}.goal-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.goal-cards article{background:white;border:1px solid var(--line);border-radius:20px;padding:18px;text-align:center}.goal-cards span{font-size:36px}.goal-cards h3{margin:6px;color:var(--navy)}.board-school,.piece-zone,.rules-zone,.notation-zone,.video-zone,.practice-zone,.rating-zone,.champion-zone{padding:38px;border-radius:30px;background:white;border:1px solid var(--line)}.demo-layout{display:grid;grid-template-columns:minmax(320px,650px) minmax(280px,1fr);gap:24px;align-items:center}.demo-layout.reverse{grid-template-columns:minmax(280px,1fr) minmax(320px,650px)}.board-card,.rule-demo{position:relative;width:100%;max-width:650px;margin:auto}.equal-board{width:100%;aspect-ratio:1;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(8,minmax(0,1fr));border:8px solid var(--navy);border-radius:20px;overflow:hidden;position:relative}.equal-board .square{min-width:0;min-height:0;display:grid;place-items:center;position:relative;font-weight:900}.equal-board .light{background:#f0d9b5}.equal-board .dark{background:#6d9f55}.equal-board .square img{width:86%;height:86%;object-fit:contain;z-index:2;transition:transform .45s cubic-bezier(.2,.85,.2,1)}.equal-board .square.glow:after{content:"";width:36%;height:36%;border-radius:50%;background:rgba(255,224,61,.82);box-shadow:0 0 0 8px rgba(255,224,61,.18);animation:pulse 1s ease-in-out infinite;position:absolute}.equal-board .square.target{outline:6px solid #ffd83e;outline-offset:-6px}.equal-board .coord{position:absolute;font-size:10px;font-weight:1000;color:rgba(20,40,50,.7);left:4px;bottom:2px}.arrow-layer{position:absolute;inset:8px;width:calc(100% - 16px);height:calc(100% - 16px);pointer-events:none;overflow:visible}.arrow-layer line,.arrow-layer path{stroke:#ff5b52;stroke-width:7;stroke-linecap:round;fill:none;stroke-dasharray:18 14;animation:arrowDash 1.05s linear infinite;filter:drop-shadow(0 1px 1px rgba(0,0,0,.15));opacity:.78}.arrow-layer marker path{fill:#ff5b52;stroke:none;opacity:.82}@keyframes arrowDash{to{stroke-dashoffset:-60}}@keyframes pulse{50%{transform:scale(1.18);opacity:.55}}.teacher-card{background:linear-gradient(#f8fbff,#fff);border:1px solid #dbe7ef;border-radius:24px;padding:24px;box-shadow:0 12px 32px rgba(25,61,89,.08)}.teacher-face{font-size:48px}.teacher-card h3{font-size:30px;color:var(--navy);margin:8px 0 15px}.memory-rule{padding:14px;border-radius:14px;background:#fff8d8;margin:10px 0}.memory-rule b,.memory-rule span{display:block}.memory-rule span{color:#6f7780;margin-top:3px}.setup-steps{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.setup-steps button{background:#eef4f8;color:var(--navy)}.setup-steps button.active{background:var(--green);color:white}.listen-wide{width:100%}.piece-picker{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:22px}.piece-picker button{border:2px solid transparent;background:#f8fbfd;border-radius:18px;padding:12px;cursor:pointer}.piece-picker button.active{border-color:#8f6bd1;background:#f3edff;transform:translateY(-3px)}.piece-picker img{width:70px;height:70px}.piece-picker b,.piece-picker small{display:block}.piece-picker b{color:var(--navy);font-size:17px}.piece-picker small{color:#73828e}.piece-emoji{font-size:70px}.kid-callout{background:#fff3c9;padding:14px;border-radius:14px;margin:15px 0}.rule-tabs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:22px}.rule-tabs button{border:1px solid #d4e0e9;border-radius:999px;background:white;padding:9px 13px;font-weight:900;color:var(--navy);cursor:pointer}.rule-tabs button.active{background:var(--red);border-color:var(--red);color:white}.rule-stage{display:grid;grid-template-columns:minmax(320px,650px) minmax(280px,1fr);gap:25px;align-items:center}.play-rule{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);z-index:5;border:0;background:var(--navy);color:white;border-radius:999px;padding:12px 18px;font-weight:900;box-shadow:0 8px 18px rgba(0,0,0,.16);cursor:pointer}.rule-copy{padding:20px}.rule-copy h3{font-size:34px;color:var(--navy);margin:12px 0}.rule-copy p{font-size:17px;line-height:1.65}.remember-box{background:#fff4cc;border-left:6px solid var(--yellow);padding:14px;border-radius:12px;margin:18px 0}.notation-grid{display:grid;grid-template-columns:minmax(320px,600px) 1fr;gap:26px;align-items:center}.notation-game{background:#f6fbff;border-radius:22px;padding:24px;text-align:center}.target-square{font-size:72px;font-weight:1000;color:var(--navy);margin:12px}.notation-game #notationStatus{font-weight:900;margin-bottom:12px}.notation-chips{display:flex;gap:7px;flex-wrap:wrap;justify-content:center}.notation-chips span{background:white;border:1px solid #d9e3ea;padding:8px 10px;border-radius:10px;font-weight:900}.score-sheet-wrap{display:grid;grid-template-columns:.7fr 1.3fr;gap:22px;margin-top:26px;align-items:center;background:#fff9ea;padding:22px;border-radius:20px}.score-sheet{width:100%;border-collapse:collapse;background:white}.score-sheet th,.score-sheet td{border:1px solid #9aaaba;padding:8px;text-align:center}.score-sheet th{background:#e9f2f8}.video-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.video-grid article{border:1px solid #dbe7ef;border-radius:20px;overflow:hidden;background:#fbfdff}.video-grid video{width:100%;aspect-ratio:16/9;background:#1b2f44;display:block}.video-grid h3,.video-grid p{margin-left:16px;margin-right:16px}.video-grid h3{color:var(--navy)}.practice-levels{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.practice-levels a{text-decoration:none;padding:18px;border:2px solid #e0e8ee;border-radius:20px;background:linear-gradient(#fff,#f8fbff);text-align:center;transition:.2s}.practice-levels a:hover{transform:translateY(-5px);border-color:#7fb7f6}.practice-levels b{display:grid;place-items:center;width:34px;height:34px;margin:auto;border-radius:50%;background:var(--navy);color:white}.practice-levels span{display:block;font-size:35px;margin:8px}.practice-levels h3{font-size:18px;color:var(--navy);margin:6px}.practice-levels p{font-size:13px;color:#667784}.rating-road{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.rating-road article{padding:18px;border-radius:18px;background:#f8fbff;border:1px solid #dce7ef}.rating-road span{font-size:32px}.rating-road h3{color:var(--navy)}.tournament-box{margin-top:20px;background:#f4f0ff;border-radius:20px;padding:22px;line-height:1.6}.champion-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.champion-grid article{overflow:hidden;background:white;border:1px solid #dde7ee;border-radius:18px}.champion-grid img{width:100%;height:230px;object-fit:cover;background:#eef3f6}.champion-grid div{padding:14px}.champion-grid h3{color:var(--navy);margin:0 0 8px}.photo-note{font-size:11px;color:#6f7c86}.live-finale{margin:34px 20px 45px!important;background:linear-gradient(135deg,#16375c,#275d8c);color:white;border-radius:28px;padding:30px 38px;display:flex;align-items:center;justify-content:space-between;gap:20px}.live-finale h2{font-size:34px;margin:4px 0}.live-finale p{margin:0;opacity:.9}.live-finale a{background:#35c878;color:#0d3b26;text-decoration:none;padding:13px 18px;border-radius:14px;font-weight:1000;white-space:nowrap}.live-dot{display:inline-block;width:11px;height:11px;background:#39e183;border-radius:50%;box-shadow:0 0 0 8px rgba(57,225,131,.16);animation:pulse 1.3s infinite}footer{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;padding:25px;border-top:1px solid var(--line);font-size:12px;color:#6f7d87}footer a{text-decoration:none;font-weight:900}@media(max-width:1050px){.hero-kid{grid-template-columns:1fr}.hero-playground{min-height:390px}.map-track{grid-template-columns:repeat(8,150px)}.piece-picker{grid-template-columns:repeat(3,1fr)}.practice-levels{grid-template-columns:repeat(3,1fr)}.champion-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:780px){.kid-topbar{flex-wrap:wrap;padding:9px}.kid-brand small{white-space:normal}.kid-topbar nav{width:100%;overflow:auto;flex-wrap:nowrap}.kid-topbar nav a{white-space:nowrap}.language-picker{margin-left:auto}.hero-kid{margin:12px 8px 0;padding:25px 18px;border-radius:24px}.hero-kid h1{font-size:44px}.hero-copy p{font-size:16px}.orbit{font-size:40px}.story-card,.demo-layout,.demo-layout.reverse,.rule-stage,.notation-grid,.score-sheet-wrap{grid-template-columns:1fr}.goal-cards{grid-template-columns:repeat(2,1fr)}section:not(.hero-kid){margin:24px 8px}.board-school,.piece-zone,.rules-zone,.notation-zone,.video-zone,.practice-zone,.rating-zone,.champion-zone{padding:22px 12px}.piece-picker{grid-template-columns:repeat(2,1fr)}.video-grid{grid-template-columns:1fr}.practice-levels{grid-template-columns:1fr 1fr}.rating-road{grid-template-columns:1fr 1fr}.champion-grid{grid-template-columns:1fr 1fr}.live-finale{margin:24px 8px 35px!important;flex-direction:column;align-items:flex-start}.equal-board{border-width:6px;border-radius:14px}}@media(max-width:480px){.practice-levels,.rating-road,.champion-grid{grid-template-columns:1fr}.hero-progress{display:none}.kid-topbar .language-picker{width:100%}.language-picker select{max-width:none;width:100%}}
/* V3 child-teaching upgrades */
.equal-board{grid-auto-rows:minmax(0,1fr)!important}.equal-board .square{aspect-ratio:1/1;overflow:hidden}.piece-pop{animation:piecePop .45s cubic-bezier(.2,.9,.3,1.2)}@keyframes piecePop{0%{transform:scale(.2) rotate(-12deg);opacity:.2}75%{transform:scale(1.14) rotate(4deg)}100%{transform:scale(1);opacity:1}}.hero-spark{animation:heroSpark .5s ease;box-shadow:inset 0 0 0 5px rgba(255,223,82,.8)}@keyframes heroSpark{50%{filter:brightness(1.28)}}
.animation-caption{margin:12px 0;padding:11px 13px;border-radius:13px;background:#eef7ff;color:#24415d;font-weight:800;font-size:13px}.piece-actions,.rule-actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.piece-actions button,.rule-actions button{flex:1;min-width:130px}.rule-steps{display:grid;gap:8px;margin:14px 0}.rule-steps div{background:#f7fbff;border:1px solid #dce8ef;border-radius:12px;padding:10px 12px;font-weight:700;line-height:1.45}.score-example{background:#fff;border:2px dashed #f3b847;border-radius:14px;padding:12px;margin:12px 0;line-height:1.55}.tiny-note{font-size:12px;color:#667784}.video-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.video-grid article{box-shadow:0 7px 20px rgba(31,62,91,.07);transition:.2s}.video-grid article:hover{transform:translateY(-4px);box-shadow:0 13px 28px rgba(31,62,91,.13)}.video-copy{padding:12px 14px 16px;position:relative}.video-copy h3,.video-copy p{margin-left:0;margin-right:0}.video-number{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--navy);color:white;font-weight:1000}.video-listen{border:0;border-radius:11px;background:#e8f6ef;color:#146943;font-weight:900;padding:9px 11px;cursor:pointer}.is-speaking{background:#ffe39a!important;color:#5d4100!important}.is-paused{background:#dff0ff!important;color:#174c78!important}.rating-road.detailed{grid-template-columns:repeat(3,1fr)}.rating-road.detailed article small{display:block;margin-top:10px;padding-top:10px;border-top:1px dashed #d6e1e8;color:#637686;font-weight:700;line-height:1.45}.format-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:16px 0}.format-cards span{background:white;border:1px solid #ded8f3;border-radius:13px;padding:11px}.champion-grid{grid-template-columns:repeat(5,1fr)}.champion-grid article{transition:.2s}.champion-grid article:hover{transform:translateY(-5px)}.champion-grid p{font-size:13px;line-height:1.5}.setup-steps button{transition:.18s}.setup-steps button.active{transform:scale(1.04);box-shadow:0 6px 16px rgba(80,185,133,.22)}
@media(max-width:1150px){.video-grid{grid-template-columns:repeat(2,1fr)}.champion-grid{grid-template-columns:repeat(3,1fr)}.rating-road.detailed{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.video-grid,.champion-grid,.rating-road.detailed,.format-cards{grid-template-columns:1fr}.piece-actions,.rule-actions{flex-direction:column}.score-sheet-wrap{overflow-x:auto}.score-sheet{min-width:620px}}

/* V4: child-friendly animation cleanup */
.equal-board .square.glow:after{width:18%;height:18%;box-shadow:0 0 0 4px rgba(255,224,61,.16);background:rgba(255,222,77,.8)}
.equal-board .square.target{outline:3px solid #ffb52e;outline-offset:-3px}
.rule-demo .arrow-layer,.board-card .arrow-layer{inset:8px}
.video-grid video{background:#12263a}
.language-flash{position:fixed;right:18px;bottom:18px;z-index:100;background:#16375c;color:#fff;padding:10px 14px;border-radius:14px;box-shadow:0 8px 24px rgba(0,0,0,.18);font-weight:900;opacity:0;transform:translateY(12px);transition:.25s;pointer-events:none}.language-flash.show{opacity:1;transform:none}