:root{--pur:#5B4FA8;--pur2:#8B7BE6;--lav:#F3F0FF;--ink:#231C5C;--mute:#7C74A8;--teal:#3FC1C9;--sun:#FFC93C;--coral:#FF6F61;--green:#2FB36B;--r:20px;--sh:0 10px 30px #2a1f7a1a}
*{box-sizing:border-box}html,body{margin:0}body{font-family:'Nunito',system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);-webkit-tap-highlight-color:transparent}
img{max-width:100%}a{color:inherit}button{font:inherit;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
/* ================= PANEL ================= */
body.panel{background:#F6F4FF;min-height:100vh}
.topbar{display:flex;align-items:center;gap:18px;padding:10px 22px;background:#fff;box-shadow:0 2px 14px #2a1f7a14;position:sticky;top:0;z-index:20;flex-wrap:wrap}
.topbar .logo{display:flex;align-items:center;gap:8px;text-decoration:none;font-weight:900;font-size:15px;color:var(--pur)}.topbar .logo img{height:30px}.topbar .logo span{background:var(--lav);border-radius:8px;padding:2px 8px;letter-spacing:1px}
.menu{display:flex;gap:4px;flex:1;flex-wrap:wrap}.menu a{text-decoration:none;padding:9px 14px;border-radius:12px;font-weight:700;color:var(--mute)}.menu a.on,.menu a:hover{background:var(--lav);color:var(--pur)}
.who{display:flex;align-items:center;gap:10px}.chip{background:var(--lav);color:var(--pur);border-radius:999px;padding:3px 10px;font-size:12px;font-weight:800}
.wrap{max-width:1200px;margin:0 auto;padding:24px 20px 60px}.wrap.narrow{max-width:760px}
.page-h{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:6px 0 18px;flex-wrap:wrap}.page-h h1{margin:4px 0;font-size:30px;font-weight:900}
.card{background:#fff;border-radius:var(--r);padding:20px;box-shadow:var(--sh);margin-bottom:18px}.card h3{margin:0 0 12px;font-size:19px}
.card.ok{border-left:6px solid var(--green)}.card.empty,.empty{color:var(--mute);text-align:center;padding:28px}
.muted{color:var(--mute)}.small{font-size:13px}.r{text-align:right}.err{color:#C62828}.ok{color:var(--green)}
.btn{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:14px;padding:11px 18px;background:var(--lav);color:var(--pur);font-weight:800;text-decoration:none;font-size:15px;transition:.15s}
.btn:hover{filter:brightness(.97);transform:translateY(-1px)}.btn.pri{background:var(--pur);color:#fff}.btn.big{padding:15px 24px;font-size:17px}.btn.sm{padding:7px 12px;font-size:13px;border-radius:10px}
.btn.ghost{background:transparent;border:2px solid #E4DEFA}.btn.danger{background:#FFE7E4;color:#C62828}.btn.wa{background:#25D366;color:#fff}.btn.wa.sent{opacity:.5}
.form label{display:block;font-weight:700;font-size:14px;margin:0 0 12px}.form input,.form select,.form textarea,.inline input,.inline select,label textarea{display:block;width:100%;margin-top:6px;padding:12px 14px;border:2px solid #E4DEFA;border-radius:14px;background:#fff;font-size:15px}
.form input:focus,.form select:focus,textarea:focus{outline:none;border-color:var(--pur2)}
label.chk{display:flex!important;align-items:center;gap:8px;font-weight:700}label.chk input{width:auto!important;margin:0!important}
.inline{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}.inline label{margin:0;flex:1;min-width:160px}.inline h3{width:100%}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.grid2.top{align-items:start}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.row.sb{justify-content:space-between}.row.wrapx{margin-bottom:20px}
.alert{padding:14px 16px;border-radius:14px;margin-bottom:14px;font-weight:700}.alert.err{background:#FFE7E4;color:#B71C1C}
.toast{position:fixed;left:50%;top:-80px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:14px 20px;border-radius:16px;font-weight:800;z-index:99;transition:top .35s;box-shadow:var(--sh);max-width:92vw}
.toast.show{top:18px}.toast.err{background:#C62828}.toast.wa{background:#1B8F4A;top:80px}.toast.wa a{color:#fff}
.cards3{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px;margin-bottom:18px}
.cls{text-decoration:none;display:block;transition:.2s}.cls:hover{transform:translateY(-3px)}.cls-h{display:flex;gap:14px;align-items:center}.cls-h img{width:58px;height:58px}.cls-h h3{margin:0}
.cls-b{display:flex;justify-content:space-between;margin:14px 0 8px;font-size:14px}
.bar{height:12px;border-radius:9px;background:#EDE9FC;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--pur2));border-radius:9px}
.fruitbox img{width:40px;height:40px;display:block;margin:0 auto}
.codebox{background:#fff;border-radius:18px;padding:10px 18px;box-shadow:var(--sh);text-align:center}.codebox span{display:block;font-size:12px;color:var(--mute);font-weight:700}.codebox b{font-size:28px;letter-spacing:4px;color:var(--pur)}
.tabs{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:16px}.tabs a{text-decoration:none;padding:10px 16px;border-radius:14px;font-weight:800;color:var(--mute);background:#fff}.tabs a.on{background:var(--pur);color:#fff}.tabs .sp{flex:1}
.scroll{overflow-x:auto}
table{border-collapse:collapse;width:100%}.list td,.list th{padding:10px;border-bottom:1px solid #F0ECFC;text-align:left;vertical-align:middle}.list th{font-size:13px;color:var(--mute)}.list tr.off{opacity:.5}
.list a{text-decoration:none;font-weight:700;display:inline-flex;align-items:center;gap:8px}
.heat th,.heat td{padding:6px;border:1px solid #F0ECFC;text-align:center;font-size:12px;min-width:44px}.heat th img{width:26px;display:block;margin:0 auto}.heat th.cur{background:#FFF6DC}
.heat .stick{position:sticky;left:0;background:#fff;text-align:left;min-width:170px;z-index:1}.heat .stick a{text-decoration:none;font-weight:700;display:flex;align-items:center;gap:6px}
.heat td.part{background:#FFF3C4}.heat td.s1{background:#D8F5E3}.heat td.s2{background:#9EE3B8}.heat td.s3{background:#4CC97F;color:#fff}.heat td{color:#1a6b3c}
.av{width:56px;height:56px}.av.xs{width:30px;height:30px}.av.big{width:110px;height:110px}.fr{width:34px;height:34px;vertical-align:middle}
.stars .st{font-style:normal;color:#D8D2F0;font-size:1.1em}.stars .st.on{color:#FFB300}
.withav{display:flex;align-items:center;gap:12px}
.weeklist .wk{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid #F0ECFC}.weeklist .wk img{width:40px;height:40px}.acts-mini{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.am{background:#F6F4FF;border-radius:10px;padding:4px 8px;font-size:13px}.am.ok{background:#E3F7EC;color:#1a6b3c}
.avpick{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}.avpick label{margin:0;cursor:pointer}.avpick input{display:none}.avpick img{width:46px;height:46px;border-radius:12px;padding:4px;border:3px solid transparent}.avpick input:checked+img{border-color:var(--pur2);background:var(--lav)}
.prow{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid #F0ECFC;align-items:center}
.pickrows{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px;margin:14px 0}.pr{display:flex;align-items:center;gap:8px;padding:10px;border:2px solid #F0ECFC;border-radius:14px;font-weight:700}
.shots{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px;margin:14px 0}
.shot{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px;border:3px solid #F0ECFC;border-radius:18px;cursor:pointer;position:relative}.shot input{position:absolute;top:10px;left:10px;width:22px;height:22px}
.shot:has(input:checked){border-color:var(--pur2);background:#FBFAFF}.shot.none{opacity:.55}.shot .art{width:100%;aspect-ratio:4/3;object-fit:contain;border-radius:12px;background:#F6F4FF}.shot .art.ph{display:grid;place-items:center}
.walist{display:flex;flex-wrap:wrap;gap:8px}
.kpigrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin-bottom:18px}.kpi{text-align:center}.kpi b{display:block;font-size:34px;color:var(--pur)}.kpi span{color:var(--mute);font-weight:700}
details.card summary{cursor:pointer;display:flex;align-items:center;gap:8px;flex-wrap:wrap}details.card .ic{width:30px}details form{margin-top:14px}
.book{text-decoration:none}.bcov{aspect-ratio:4/3;border-radius:14px;background:#F6F4FF center/cover;margin-bottom:10px}
.hero-kid{display:flex;gap:20px;align-items:center}.hero-kid h1{margin:0}.kpis{display:flex;gap:18px;margin:10px 0;font-size:15px}.kpis b{font-size:22px;color:var(--pur)}
.weekgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px;margin-bottom:22px}
.wcell{background:#fff;border-radius:16px;padding:10px 6px;text-align:center;box-shadow:var(--sh);opacity:.45}.wcell img{width:40px;height:40px}.wcell span{display:block;font-weight:900;font-size:13px}.wcell.part{opacity:.8}.wcell.done{opacity:1;outline:3px solid var(--c)}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-bottom:22px}.gi{background:#fff;border-radius:16px;padding:8px;box-shadow:var(--sh);text-decoration:none;font-size:13px;font-weight:700}.gi img{width:100%;aspect-ratio:4/3;object-fit:contain;border-radius:10px;background:#F6F4FF}
.brand{display:flex;gap:14px;align-items:center;margin-bottom:18px;flex-wrap:wrap}.brand img{height:84px}.brand img.blogo{height:44px}.brand h1{margin:0;font-weight:900}
.auth .auth-box{max-width:460px;margin:40px auto;padding:0 18px}.back-link{display:inline-block;margin-bottom:10px;color:var(--mute);text-decoration:none;font-weight:700}
.checks{list-style:none;padding:0;columns:2}.checks li.ok{color:var(--green)}.checks li.no{color:#C62828}
@media (max-width:760px){.grid2,.grid3{grid-template-columns:1fr}.topbar{padding:8px 12px;gap:8px}.menu{order:3;flex-basis:100%;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}.menu a{white-space:nowrap;padding:8px 12px}.who b{display:none}.page-h h1{font-size:24px}.wrap{padding:16px 12px 50px}.card{padding:16px;border-radius:16px}.tabs{flex-wrap:nowrap;overflow-x:auto}.tabs a{white-space:nowrap}.tabs .sp{display:none}.hero-kid{flex-direction:column;text-align:center}.kpis{justify-content:center;flex-wrap:wrap}.inline label{min-width:100%}.cards3{grid-template-columns:1fr}}
/* ================= KID WORLD ================= */
body.kid{min-height:100vh;color:#fff;background:#1B1650;overflow-x:hidden;user-select:none;-webkit-user-select:none}
body.kid.space,body.kid.scene-space{background:radial-gradient(900px 500px at 80% -10%,#5B45C0 0%,transparent 60%),radial-gradient(700px 500px at 0% 110%,#1E5C7A 0%,transparent 55%),#1B1650}
body.kid.space::before,body.kid.scene-space::before,body.kid.scene-sea::before{content:"";position:fixed;inset:0;pointer-events:none;background-image:radial-gradient(2px 2px at 20% 30%,#fffa 50%,transparent),radial-gradient(1.5px 1.5px at 70% 20%,#fff9 50%,transparent),radial-gradient(2.5px 2.5px at 40% 80%,#fff8 50%,transparent),radial-gradient(1.5px 1.5px at 85% 65%,#fffb 50%,transparent),radial-gradient(2px 2px at 10% 70%,#fff9 50%,transparent);background-size:360px 360px;animation:twinkle 6s ease-in-out infinite alternate}
@keyframes twinkle{to{opacity:.45}}
body.kid.scene-park{background:#8FD0EA url(../img/bg_park.jpg) center/cover fixed}body.kid.scene-room{background:#F6D7E8 url(../img/bg_room.jpg) center/cover fixed;color:var(--ink)}
body.kid.scene-winter{background:linear-gradient(#6FA8E0,#CDE6FB 70%,#fff);color:var(--ink)}body.kid.scene-sea{background:linear-gradient(#2C9BD1,#0B4F7A)}
body.kid.landing{background:radial-gradient(900px 500px at 80% -10%,#5B45C0 0%,transparent 60%),#1B1650}
.kid-wrap{max-width:1100px;margin:0 auto;padding:16px 16px 60px;position:relative;z-index:1}.kid-wrap.center{display:flex;flex-direction:column;align-items:center}
.kid-top{display:flex;align-items:center;gap:14px;margin-bottom:14px}.kid-top h1{margin:0;font-size:clamp(22px,4vw,32px);font-weight:900}.kid-top p{margin:2px 0 0;opacity:.85;font-weight:700}.kid-top>div{flex:1}
.kid-top.sticky{position:sticky;top:8px;z-index:5;background:#1b1650cc;backdrop-filter:blur(8px);border-radius:24px;padding:8px 12px}
.scene-room .kid-top,.scene-winter .kid-top,.scene-park .kid-top{background:#ffffffd9;color:var(--ink);border-radius:24px;padding:8px 12px}
.kbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:64px;height:64px;border-radius:22px;border:0;background:#ffffff26;color:#fff;font-size:28px;font-weight:900;text-decoration:none;padding:0 18px;box-shadow:0 6px 0 #0003;transition:transform .1s}
.kbtn:active{transform:translateY(4px);box-shadow:0 2px 0 #0003}.kbtn.go{background:var(--sun);color:var(--ink);font-size:24px}.kbtn.go img{width:34px}.kbtn.ghost{background:#ffffff33;font-size:20px}
.scene-room .kbtn.back,.scene-winter .kbtn.back,.scene-park .kbtn.back,.scene-room .kbtn.say,.scene-winter .kbtn.say,.scene-park .kbtn.say{background:var(--pur);color:#fff}
.kbtn.say.big{font-size:22px;height:56px}
.robi.float{animation:float 3.2s ease-in-out infinite}@keyframes float{50%{transform:translateY(-14px)}}
.robi.big{height:220px}
.kid-card{background:#fff;color:var(--ink);border-radius:32px;padding:26px;max-width:620px;width:100%;text-align:center;box-shadow:0 20px 50px #0006;margin-top:10px}.kid-card.wide{max-width:780px}
.kid-card h1{margin:6px 0;font-size:30px;font-weight:900}.kid-card p{font-size:19px;font-weight:700;color:var(--mute)}
.kid-err{background:#FFE7E4;color:#C62828;border-radius:16px;padding:12px;font-weight:900;font-size:18px;margin:10px 0}.shake{animation:shake .4s}@keyframes shake{25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}
.codein{width:100%;font-size:44px;letter-spacing:12px;text-align:center;text-transform:uppercase;font-weight:900;border:4px solid #E4DEFA;border-radius:22px;padding:12px;margin:10px 0 16px;color:var(--pur)}
.kid-link{display:inline-flex;align-items:center;gap:10px;margin-top:18px;font-weight:900;color:var(--pur);text-decoration:none;font-size:19px}.kid-link img{width:36px}
.pick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:16px}
.pick{background:#fff;color:var(--ink);border-radius:28px;padding:16px 10px;text-align:center;text-decoration:none;box-shadow:0 8px 0 #0002;transition:transform .15s}.pick:active{transform:scale(.95)}
.pick img{width:90px;height:90px}.pick b{display:block;font-size:22px;margin-top:6px}
.pass .slots{display:flex;gap:14px;justify-content:center;margin:12px 0}.slot{width:86px;height:86px;border-radius:24px;border:4px dashed #D9D2F5;display:grid;place-items:center}.slot.on{border-style:solid;border-color:var(--sun);background:#FFF8E0}.slot img{width:64px}
.fruits{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:10px 0 16px}.fruit{background:#F6F4FF;border:0;border-radius:22px;padding:10px;aspect-ratio:1;display:grid;place-items:center;transition:transform .1s}.fruit img{width:80%}.fruit:active,.fruit.pop{transform:scale(.9)}
video#cam{width:100%;border-radius:20px;background:#000}
/* landing */
.land{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 20px 90px;gap:20px;position:relative;z-index:1;text-align:center}
.land-logo{height:40px;background:#fff;padding:9px 16px;border-radius:14px;box-shadow:0 8px 20px #0004}
.land-hero .robi{height:min(30vh,230px)}.land-hero h1{margin:8px 0 4px;font-size:clamp(34px,6vw,58px);font-weight:900;letter-spacing:.5px}.land-hero p{margin:0;font-size:clamp(17px,2.4vw,22px);opacity:.85;font-weight:700}
.kid-start{display:inline-flex;align-items:center;gap:18px;background:var(--sun);color:var(--ink);text-decoration:none;font-weight:900;font-size:clamp(30px,5vw,44px);padding:18px 46px 18px 26px;border-radius:40px;box-shadow:0 12px 0 #C99A1D,0 24px 40px #0005;transition:transform .12s}
.kid-start img{width:clamp(64px,9vw,92px)}.kid-start:active{transform:translateY(8px);box-shadow:0 4px 0 #C99A1D}
.kid-start{animation:bob 2.6s ease-in-out infinite}@keyframes bob{50%{transform:translateY(-6px)}}
.staff{position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:center;align-items:center;gap:6px;flex-wrap:wrap;padding:12px 12px calc(12px + env(safe-area-inset-bottom));background:#120e33cc;backdrop-filter:blur(6px);font-size:14px;font-weight:700}
.staff span{opacity:.6;margin-right:6px}.staff a{color:#fff;text-decoration:none;padding:7px 14px;border-radius:999px;border:1px solid #ffffff33;opacity:.85}.staff a:hover{background:#ffffff1a;opacity:1}
/* map */
.me{display:flex;align-items:center;gap:10px}.me .av{width:58px;height:58px;background:#fff;border-radius:18px;padding:4px}
.starpill{background:var(--sun);color:var(--ink);border-radius:999px;padding:10px 16px;font-weight:900;font-size:22px}
.path{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 0 40px}
.month{margin:22px 0 6px}.month span{background:#ffffff22;border-radius:999px;padding:6px 18px;font-weight:900;letter-spacing:1px}
.stop{display:flex;align-items:center;gap:14px;text-decoration:none;color:#fff;width:min(520px,92vw);padding:6px;position:relative}
.stop.pos0{transform:translateX(-18%)}.stop.pos1{transform:translateX(0)}.stop.pos2{transform:translateX(18%)}.stop.pos3{transform:translateX(0)}
.stop .planet{flex:none;width:96px;height:96px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff9,transparent 45%),var(--c);display:grid;place-items:center;box-shadow:0 0 0 6px #ffffff22,0 12px 26px #0006;position:relative;transition:transform .2s}
.stop .planet img{width:58px}.stop:hover .planet{transform:scale(1.07)}.stop .lbl{font-weight:800;font-size:17px;line-height:1.2}.stop .lbl b{display:block;color:var(--sun);font-size:14px}
.stop.locked{opacity:.45;pointer-events:none}.stop.locked .planet{background:#ffffff22}.stop.done .planet{box-shadow:0 0 0 6px var(--sun),0 12px 26px #0006}
.stop.cur .planet{animation:pulse 1.6s infinite}@keyframes pulse{50%{box-shadow:0 0 0 14px #ffc93c55,0 12px 26px #0006}}
.stop .ship{position:absolute;width:48px!important;right:-18px;top:-16px;animation:float 2s ease-in-out infinite}
.stop .stars{position:absolute;left:16px;bottom:-6px;background:#fff;border-radius:999px;padding:0 6px;font-size:14px}
/* week */
.story{display:grid;grid-template-columns:minmax(220px,1fr) 1.3fr;gap:20px;align-items:center;margin-bottom:22px}
.stage-anim{position:relative;height:320px}.stage-anim .robi{position:absolute;left:50%;bottom:0;height:270px;transform:translateX(-50%);filter:drop-shadow(0 16px 20px #0005)}
.stage-anim .robi.float{animation:floatc 3.2s ease-in-out infinite}@keyframes floatc{50%{transform:translate(-50%,-14px)}}
.prop{position:absolute;width:84px;filter:drop-shadow(0 8px 10px #0004)}.prop.p0{left:4%;top:10%;animation:orbit 7s ease-in-out infinite}.prop.p1{right:4%;top:4%;animation:orbit 8s ease-in-out infinite reverse}.prop.p2{right:10%;bottom:12%;width:64px;animation:spin 9s linear infinite}
@keyframes orbit{50%{transform:translate(12px,-18px) rotate(8deg)}}@keyframes spin{to{transform:rotate(360deg)}}
.bubble{background:#fff;color:var(--ink);border-radius:32px;padding:24px;box-shadow:0 20px 50px #0005;position:relative}.bubble .kbtn{background:var(--pur);color:#fff}.bubble p{font-size:clamp(18px,2.4vw,23px);font-weight:700;line-height:1.5;margin:0 0 14px}
.bubble::before{content:"";position:absolute;left:-18px;top:44%;border:18px solid transparent;border-right-color:#fff;border-left:0}
.acts{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.act{background:#fff;color:var(--ink);border-radius:28px;padding:18px;text-decoration:none;display:flex;flex-direction:column;align-items:center;gap:8px;box-shadow:0 8px 0 color-mix(in srgb,var(--c) 60%,#000 0%);position:relative;transition:transform .15s}
.act:active{transform:translateY(4px)}.act .thumb{position:relative;width:120px;height:120px;border-radius:30px;background:color-mix(in srgb,var(--c) 16%,#fff);display:grid;place-items:center;overflow:hidden}.act .thumb img{width:78px;height:78px}.act .thumb img.ph{width:100%;height:100%;object-fit:cover}.act .thumb img.lock{position:absolute;right:6px;bottom:6px;width:40px;height:40px}
.act.locked{opacity:.6;pointer-events:none;box-shadow:0 8px 0 #0002}.act.locked .thumb img:not(.lock){filter:grayscale(1)}.act .wait{font-size:14px;font-weight:800;color:var(--mute)}.act b{font-size:21px;text-align:center}.act .num{position:absolute;left:14px;top:12px;background:var(--c);color:#fff;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:900}
.act .play{background:var(--c);color:#fff;border-radius:999px;padding:6px 16px;font-weight:900}.act.done{outline:4px solid var(--sun)}.act .stars{font-size:26px}
@media (max-width:760px){.story{grid-template-columns:1fr}.stage-anim{height:240px}.stage-anim .robi{height:200px}.bubble::before{display:none}}
/* play */
.game{background:#ffffffee;color:var(--ink);border-radius:32px;padding:18px;min-height:60vh;box-shadow:0 20px 50px #0005;position:relative;touch-action:none}
.reward,.rest{position:fixed;inset:0;background:#120e33dd;display:none;place-items:center;z-index:60;padding:20px}.reward.on,.rest.on{display:grid}
.rw-card{background:#fff;color:var(--ink);border-radius:36px;padding:26px 30px;text-align:center;max-width:460px;width:100%;animation:popin .5s cubic-bezier(.2,1.6,.4,1)}@keyframes popin{from{transform:scale(.5);opacity:0}}
.rw-card .robi{height:150px;animation:float 2s ease-in-out infinite}.rw-card h2{font-size:36px;margin:6px 0;font-weight:900}.rw-stars{font-size:62px;letter-spacing:6px;color:#E4DEFA}.rw-stars i{font-style:normal;display:inline-block}.rw-stars i.on{color:#FFB300;animation:starpop .5s both}
@keyframes starpop{from{transform:scale(0) rotate(-90deg)}60%{transform:scale(1.4)}}.rw-btns{display:flex;gap:12px;justify-content:center;margin-top:16px}.rw-btns .kbtn.ghost{background:var(--lav);color:var(--pur)}
.confetti{position:fixed;inset:0;pointer-events:none;z-index:70;overflow:hidden}.confetti i{position:absolute;top:-20px;width:14px;height:18px;border-radius:4px;animation:fall 2.6s linear forwards}@keyframes fall{to{transform:translateY(110vh) rotate(720deg)}}
/* share / book */
.share-msg{font-size:18px!important;color:var(--ink)!important;background:#F6F4FF;border-radius:18px;padding:14px 16px;line-height:1.5;text-align:left}
.share .shareimg{width:100%;border-radius:20px;margin:14px 0;background:#F6F4FF}.story-sm{font-size:16px!important}
.bookview{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}.bpage{margin:0;background:#fff;color:var(--ink);border-radius:22px;padding:12px}
.bimg{position:relative;aspect-ratio:4/3;container-type:size;overflow:hidden;border-radius:14px;background:#F6F4FF}.bimg>img:first-child{width:100%;height:100%;object-fit:contain}
.blay{position:absolute;transform-origin:center}.blay.txt{font-weight:800;padding:.2em .35em;border-radius:.4em;white-space:nowrap;line-height:1.2}
.bpage figcaption{display:flex;justify-content:space-between;align-items:center;gap:8px;font-weight:800;margin-top:8px}.bpage audio{height:36px;max-width:60%}
/* ================= PRINT ================= */
body.print{background:#EDEAF8}.printbar{display:flex;gap:10px;align-items:center;padding:14px 20px;background:#fff;position:sticky;top:0;z-index:5;flex-wrap:wrap}
.cards-print{display:grid;grid-template-columns:repeat(2,1fr);gap:8mm;padding:10mm;max-width:210mm;margin:0 auto}
.lc-top img{height:7mm!important}
.lcard{background:#fff;border:2px dashed #C9C0F0;border-radius:6mm;padding:5mm;break-inside:avoid;height:62mm;display:flex;flex-direction:column;justify-content:space-between}
.lc-top{display:flex;align-items:center;gap:6px;font-weight:900;font-size:11px;color:var(--pur)}.lc-top img{height:9mm}
.lc-mid{display:flex;align-items:center;gap:8px}.lc-mid .av{width:16mm;height:16mm}.lc-mid b{font-size:20px;display:block}.lc-mid small{color:var(--mute);font-weight:700}.lc-mid>div:nth-child(2){flex:1}.lc-mid .qr img{width:24mm!important;height:24mm!important}
.lc-pass{display:flex;align-items:center;gap:4px;background:#FFF6DC;border-radius:3mm;padding:2mm 3mm;font-weight:800;font-size:11px}.lc-pass span{flex:1}.lc-pass img{width:10mm;height:10mm}.lc-pass em{font-style:normal;background:var(--pur);color:#fff;border-radius:50%;width:5mm;height:5mm;display:grid;place-items:center;font-size:9px}
.lc-code{font-size:11px;color:var(--mute);font-weight:700}
.certpage{width:297mm;height:210mm;margin:10px auto;background:#fff;padding:9mm;box-shadow:var(--sh);break-after:page;overflow:hidden}
.cert-in{height:100%;border:3mm solid #5B4FA8;border-radius:8mm;padding:9mm 16mm;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;
  background:radial-gradient(60mm 60mm at 0 0,#EFEAFF,transparent 70%),radial-gradient(60mm 60mm at 100% 100%,#F1EDFF,transparent 70%)}
.cert-top{display:flex;justify-content:space-between;align-items:center;width:100%;font-weight:800;color:var(--mute)}.cert-top img{height:12mm}
.cert-medal{width:28mm;margin-top:2mm}.cert-in h1{font-size:40px;margin:2mm 0 0;color:var(--pur);font-weight:900;letter-spacing:1px}.cert-for{margin:3mm 0 0;color:var(--mute);font-weight:700}
.cert-in h2{font-size:46px;margin:2mm 0;font-weight:900;color:var(--ink);border-bottom:1mm solid #EFEAFF;padding:0 14mm 2mm}.cert-txt{font-size:19px;max-width:190mm;font-weight:600;line-height:1.5}
.cert-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:flex-end;width:100%}.cert-foot div{display:flex;flex-direction:column;min-width:60mm;border-top:.5mm solid #D9D2F5;padding-top:2mm}.cert-foot span{color:var(--mute);font-size:13px;font-weight:700}.cert-robi{height:34mm}
@media print{.noprint{display:none!important}body.print{background:#fff}.certpage{margin:0;box-shadow:none}.cards-print{padding:0}@page{margin:8mm}body.cert{}}
@page{size:auto}
body.cert{--x:0}
@media print{body.cert @page{size:A4 landscape}}
/* ================= PANEL v2: sade, kurumsal görünüm ================= */
body.panel{--bg:#F6F6F9;--sf:#fff;--bd:#E6E4EE;--tx:#1E1B2E;--mu:#6B6880;--ac:#5B4FA8;--ac2:#EEEBFA;background:var(--bg);color:var(--tx);font-size:15px}
body.panel .topbar{height:64px;padding:0 24px;gap:22px;box-shadow:none;border-bottom:1px solid var(--bd);flex-wrap:nowrap}
body.panel .topbar .logo img{height:26px}body.panel .topbar .logo span{font-size:11px;background:var(--ac2);color:var(--ac);border-radius:6px;padding:3px 7px;letter-spacing:1.5px}
body.panel .menu{gap:2px;height:100%;align-items:stretch;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}body.panel .menu::-webkit-scrollbar{display:none}
body.panel .menu a{display:flex;align-items:center;gap:7px;border-radius:0;padding:0 12px;color:var(--mu);font-weight:700;font-size:14px;border-bottom:2px solid transparent;white-space:nowrap}
body.panel .menu a.on,body.panel .menu a:hover{background:none;color:var(--ac);border-bottom-color:var(--ac)}
.who{gap:10px}.uav{width:34px;height:34px;border-radius:50%;background:var(--ac);color:#fff;display:grid;place-items:center;font-weight:800;font-size:14px}.wn{display:flex;flex-direction:column;line-height:1.15}.wn b{font-size:14px}.wn small{color:var(--mu);font-size:12px}
.icon-btn{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;color:var(--mu);border:1px solid var(--bd);text-decoration:none}.icon-btn:hover{color:var(--ac);border-color:var(--ac)}
body.panel .wrap{padding:28px 24px 60px}
body.panel .page-h{margin:0 0 20px;align-items:center}body.panel .page-h h1{font-size:26px;font-weight:800;margin:2px 0;letter-spacing:-.2px}.page-h .sub{margin:2px 0 0;color:var(--mu);font-size:14px}
.crumb{display:inline-flex;align-items:center;gap:4px;color:var(--mu);text-decoration:none;font-size:13px;font-weight:700}.crumb:hover{color:var(--ac)}.ph-right{display:flex;gap:8px;flex-wrap:wrap}
body.panel .card{border-radius:14px;box-shadow:0 1px 2px #1e1b2e0d;border:1px solid var(--bd);padding:20px}
.card-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px;gap:10px}.card-h h3{margin:0;font-size:16px}.card-h a{color:var(--ac);font-weight:700;text-decoration:none}
body.panel .btn{border-radius:10px;padding:9px 14px;font-size:14px;background:#fff;border:1px solid var(--bd);color:var(--tx);box-shadow:0 1px 1px #1e1b2e0a}.btn .ui{flex:none}
body.panel .btn:hover{transform:none;border-color:#cfcbe0;background:#FAFAFD}body.panel .btn.pri{background:var(--ac);border-color:var(--ac);color:#fff}body.panel .btn.pri:hover{background:#4E43A0}
body.panel .btn.big{padding:12px 20px;font-size:15px}body.panel .btn.sm{padding:6px 10px;font-size:13px}body.panel .btn.ghost{background:transparent}body.panel .btn.danger{background:#FFF1F1;border-color:#F6D2D2;color:#B42318}body.panel .btn.wa{background:#1FAF55;border-color:#1FAF55;color:#fff}
body.panel .form input,body.panel .form select,body.panel .form textarea,body.panel .inline input,body.panel .inline select,body.panel .filters input,body.panel .filters select{border:1px solid var(--bd);border-radius:10px;padding:10px 12px;font-size:14px;background:#fff}
body.panel .form label,body.panel .filters label{font-size:13px;color:#3D3950}
body.panel .tabs{border-bottom:1px solid var(--bd);gap:4px;margin-bottom:18px}body.panel .tabs a{background:none;border-radius:0;padding:10px 12px;border-bottom:2px solid transparent;font-size:14px}body.panel .tabs a.on{background:none;color:var(--ac);border-bottom-color:var(--ac)}
body.panel .tabs .btn{margin-left:4px}
.list.tbl th{font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--mu);font-weight:800;background:#FAFAFC}.list.tbl td{border-bottom:1px solid #F0EFF5;font-size:14px}
.kpis6{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;margin-bottom:18px}
.kpi2{background:#fff;border:1px solid var(--bd);border-radius:14px;padding:16px;display:flex;gap:14px;align-items:flex-start}.kpi2 .ki{width:42px;height:42px;border-radius:12px;background:var(--ac2);color:var(--ac);display:grid;place-items:center;flex:none}
.kpi2 small{display:block;color:var(--mu);font-weight:700;font-size:13px}.kpi2 b{display:block;font-size:28px;font-weight:800;line-height:1.2;margin:2px 0}.kpi2 em{font-style:normal;color:var(--mu);font-size:12px}
.dash{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,1fr);gap:18px}
.bars{width:100%;height:auto;display:block}.bars .grid{stroke:#EEEDF3}.bars .ax{font-size:10px;fill:#9A97AB}.bars .lb{font-size:10px;fill:#6B6880;text-anchor:middle}.bars rect{fill:#C9C2EE}.bars rect.cur{fill:var(--ac)}
.feed{list-style:none;margin:0;padding:0}.feed li{display:flex;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid #F0EFF5}.feed li:last-child{border:0}.feed div{flex:1;min-width:0}.feed b{display:block;font-size:14px}.feed span{display:block;color:var(--mu);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.feed time{color:#9A97AB;font-size:12px;white-space:nowrap}
.av2{width:30px;height:30px;border-radius:50%;background:#F0EEF8;color:var(--ac);display:grid;place-items:center;font-weight:800;font-size:13px;flex:none}
.rates{display:flex;gap:6px;align-items:flex-end;overflow-x:auto;padding-bottom:4px}.rate{flex:1;min-width:22px;text-align:center}.rate .rb{height:120px;background:#F4F3F8;border-radius:6px;display:flex;align-items:flex-end;overflow:hidden}.rate .rb i{display:block;width:100%;border-radius:6px 6px 0 0;opacity:.85}.rate span{font-size:10px;color:var(--mu);font-weight:700}
.pbar{height:8px;background:#F0EFF5;border-radius:6px;overflow:hidden;margin-bottom:4px}.pbar i{display:block;height:100%;background:var(--ac);border-radius:6px}
.filters{display:grid;grid-template-columns:2fr 1.4fr 1fr 1fr 1fr auto;gap:12px;align-items:end}.filters label{margin:0}.filters input,.filters select{width:100%;margin-top:6px}
.tag{display:inline-block;border-radius:6px;padding:3px 8px;font-size:12px;font-weight:800;background:#F0EFF5;color:#3D3950;white-space:nowrap}.tag.t-admin{background:#EEEBFA;color:var(--ac)}.tag.t-teacher{background:#E7F5EE;color:#157347}.tag.t-parent{background:#FFF4E0;color:#9A5B00}.tag.t-student{background:#E8F3FF;color:#1E5FA8}
.logs td{vertical-align:top}.nowrap{white-space:nowrap}.ua{max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pager{display:flex;gap:6px;justify-content:center}.pager a{min-width:36px;height:36px;border-radius:10px;border:1px solid var(--bd);display:grid;place-items:center;text-decoration:none;font-weight:700;background:#fff}.pager a.on{background:var(--ac);color:#fff;border-color:var(--ac)}
body.panel .codebox{border:1px solid var(--bd);box-shadow:none;border-radius:12px}body.panel .codebox b{font-size:22px}
body.panel .heat th,body.panel .heat td{border-color:#F0EFF5}
@media (max-width:980px){.dash{grid-template-columns:1fr}.filters{grid-template-columns:1fr 1fr}}
@media (max-width:760px){body.panel .topbar{height:auto;flex-wrap:wrap;padding:10px 14px;gap:8px}body.panel .menu{order:3;flex-basis:100%;height:44px}.wn{display:none}body.panel .wrap{padding:18px 14px 50px}.filters{grid-template-columns:1fr}}
/* ================= ÖĞRENCİ v2 ================= */
.staff{position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:center;gap:12px;flex-wrap:wrap;padding:14px 14px calc(14px + env(safe-area-inset-bottom));background:linear-gradient(transparent,#120e33e6 40%);backdrop-filter:none}
.staff a{display:inline-flex;align-items:center;gap:8px;background:#ffffff14;border:1px solid #ffffff2e;color:#fff;text-decoration:none;font-weight:800;font-size:15px;padding:10px 18px;border-radius:14px;opacity:1;backdrop-filter:blur(6px);transition:background .15s}
.staff a:hover{background:#ffffff26}.staff a .ui{opacity:.85}
.robi.mid{height:min(22vh,170px);margin-top:4px}
.kbtn.wide{width:100%;height:72px;font-size:26px}.kbtn.scan{background:#EEEBFA;color:var(--pur);box-shadow:0 6px 0 #d4ccf2}.kbtn.scan img{width:40px}
.or{display:flex;align-items:center;gap:12px;margin:18px 0 14px;color:#9a92c7;font-weight:800}.or::before,.or::after{content:"";flex:1;height:2px;background:#EEEBFA}
.kid-top{background:#ffffff14;border:1px solid #ffffff1f;border-radius:26px;padding:10px 12px;backdrop-filter:blur(8px)}
.kid-top .kt h1{font-size:clamp(22px,3.4vw,32px);line-height:1.15}.kid-top .kt p{font-size:16px}
.badge{display:inline-block;background:var(--c,#8B7BE6);color:#fff;border-radius:999px;padding:4px 12px;font-weight:900;font-size:14px;margin-bottom:4px;box-shadow:0 3px 0 #0002}
.bookpill{display:flex;align-items:center;gap:8px;background:#fff;color:var(--ink);border-radius:18px;padding:8px 14px 8px 10px;font-size:13px;font-weight:700;line-height:1.2;box-shadow:0 4px 0 #0002}.bookpill img{width:36px}.bookpill b{font-size:16px;color:var(--pur)}
.kbtn.back,.kbtn.say{width:64px;padding:0;flex:none}
.game{background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--c,#8B7BE6) 9%,#fff) 0 46px,color-mix(in srgb,var(--c,#8B7BE6) 15%,#fff) 46px 92px)!important;border:6px solid #fff}
.kid-card h1{letter-spacing:-.3px}
@media (max-width:900px) and (orientation:portrait){
 .kid-wrap{padding:12px 12px 40px}.story{grid-template-columns:1fr;gap:12px}.stage-anim{height:230px}.stage-anim .robi{height:200px}.bubble{padding:18px}.bubble::before{display:none}
 .acts{grid-template-columns:1fr 1fr;gap:12px}.act{padding:14px}.act .thumb{width:96px;height:96px}.act b{font-size:18px}
 .kid-top{gap:8px}.bookpill span{display:none}.stop{width:min(560px,94vw)}.stop .planet{width:84px;height:84px}
 .pick-grid{grid-template-columns:repeat(3,1fr)}.fruits{gap:10px}}
@media (max-width:520px){.acts{grid-template-columns:1fr}.pick-grid{grid-template-columns:repeat(2,1fr)}.kbtn.wide{font-size:22px}.staff a span{display:none}.staff a{padding:12px}}
.bubble .kbtn.say{width:auto;padding:0 22px;height:56px;font-size:20px}
.kpis6{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.kpi2 b{font-size:26px}
.steps3{display:grid;grid-template-columns:1fr 1.35fr 1fr;gap:16px;align-items:start}.step{position:relative;padding-top:26px}.step .sn{position:absolute;top:-12px;left:18px;width:30px;height:30px;border-radius:50%;background:var(--ac,#5B4FA8);color:#fff;display:grid;place-items:center;font-weight:800;font-size:14px}
.step .btn{margin:0 6px 8px 0}.tbl.mini td,.tbl.mini th{font-size:12px;padding:6px 8px;white-space:nowrap}
@media (max-width:980px){.steps3{grid-template-columns:1fr}}
.slogo{max-height:56px;max-width:180px;object-fit:contain}.slogo-sm{height:34px;max-width:130px;object-fit:contain;vertical-align:middle}
.logoform{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.logoform .slogo{max-height:40px;max-width:110px;background:#fff;border:1px solid #E6E4EE;border-radius:8px;padding:3px}.nologo{font-size:12px;color:#9A97AB;border:1px dashed #D9D6E6;border-radius:8px;padding:8px 10px}
.topbar .logo .sep{width:1px;height:24px;background:#E6E4EE;display:inline-block;margin:0 4px}
.lc-slogo{height:9mm!important;max-width:28mm;object-fit:contain;margin-left:auto}.lc-top{justify-content:space-between}
.cert-slogo{height:14mm;max-width:50mm;object-fit:contain}
.kid-slogo{height:56px;max-width:140px;object-fit:contain;background:#fff;border-radius:14px;padding:6px 10px}
.hk-logo{float:right;margin-left:12px}
.hero-kid{position:relative}.hk-logo{position:absolute;right:20px;top:20px;float:none;margin:0}
@media (max-width:760px){.hk-logo{position:static;display:block;margin:0 auto 8px}}
