:root{
  --navy:#1D2A4D; --ink2:#3A4B73; --muted:#4A5778; --sky:#DFF3FF; --white:#fff;
  --blue:#2D7FF9; --blue-d:#1A5FD0; --coral:#FF7A59; --coral-d:#E5532F; --sun:#FFC93C; --sun-d:#D9A41A;
  --green:#3BB273; --green-d:#2E9A5F; --grape:#8E5CF7; --grape-d:#6E3FD8; --gold:#E0A400; --gold-d:#B98500;
  --shadow:#C6DDF2;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{font-size:clamp(8px,min(1.22vw,2.05vh),18px)}
html,body{margin:0;height:100%;overflow:hidden;background:var(--sky);color:var(--navy);font-family:'Baloo 2',system-ui,sans-serif;user-select:none;-webkit-user-select:none}
input,textarea,select{user-select:text;-webkit-user-select:text}
button{font-family:inherit;color:inherit;cursor:pointer;border:0;background:none}
#app{position:fixed;inset:0;overflow:hidden}
.screen{position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden;animation:fadein .35s ease-out}
.scroll{overflow-y:auto;-webkit-overflow-scrolling:touch}
@keyframes fadein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes hop{0%,100%{transform:translateY(0) scale(1)}40%{transform:translateY(-14px) scale(1.04)}60%{transform:translateY(0) scale(.98)}}
@keyframes talk{0%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(-6px) rotate(-2deg)}75%{transform:translateY(-3px) rotate(2deg)}}
@keyframes think{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
@keyframes ring{0%{transform:scale(1);opacity:.55}100%{transform:scale(1.9);opacity:0}}
@keyframes pop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.07);opacity:1}100%{transform:scale(1)}}
@keyframes shake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-10px)}40%,80%{transform:translateX(10px)}}
@keyframes drift{from{transform:translateX(0)}to{transform:translateX(70px)}}
@keyframes wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-6deg)}75%{transform:rotate(6deg)}}
@keyframes twinkle{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes bar{0%,100%{height:.8rem}50%{height:3rem}}
@keyframes fall{0%{transform:translateY(-40px) rotate(0);opacity:1}100%{transform:translateY(105vh) rotate(540deg);opacity:.2}}
@keyframes grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.float{animation:float 3.2s ease-in-out infinite}
.hop{animation:hop 1.2s ease-in-out infinite}
.pop{animation:pop .45s ease-out both}
.shake{animation:shake .45s ease-in-out}
.thinking .av-wrap{animation:think .8s ease-in-out infinite}
body.speaking .av-wrap.live{animation:talk .9s ease-in-out infinite}
body.speaking .av-wrap.live .av-img{animation:talkimg .45s ease-in-out infinite;transform-origin:60px 110px;transform-box:view-box}
body.speaking .av-wrap.live .mouth{animation:wiggle .25s linear infinite;transform-origin:60px 80px;transform-box:view-box}

/* Dekor */
.cloud{position:absolute;height:3.4rem;border-radius:3rem;background:#fff;opacity:.9;animation:drift 10s ease-in-out infinite alternate;pointer-events:none}
.hills{position:absolute;left:0;right:0;bottom:0;width:100%;height:22vh;pointer-events:none}
.confetti{position:fixed;top:0;width:1rem;height:1rem;border-radius:.25rem;animation:fall 2.2s ease-in forwards;pointer-events:none;z-index:50}

/* Üst bar */
.top{position:relative;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.4rem 2.2rem;z-index:2}
.top h1{margin:0;font-size:2.3rem;font-weight:800;line-height:1.05;text-align:center}
.round{width:4.4rem;height:4.4rem;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 .35rem 0 var(--shadow);flex-shrink:0}
.round svg{width:2.3rem;height:2.3rem}
.pill{display:flex;align-items:center;gap:.5rem;padding:.5rem 1.1rem;border-radius:2rem;background:#fff;box-shadow:0 .3rem 0 var(--shadow);font-size:1.5rem;font-weight:800}
.pill svg{width:1.8rem;height:1.8rem}
.lockbtn{display:flex;align-items:center;gap:.4rem;padding:.6rem 1rem;border-radius:1.4rem;background:#fff;font-size:1.1rem;font-weight:700;box-shadow:0 .3rem 0 var(--shadow)}
.lockbtn svg{width:1.4rem;height:1.4rem}

/* Kartlar ve butonlar */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;padding:.9rem 2.2rem;border-radius:2.5rem;background:var(--blue);color:#fff;font-size:2rem;font-weight:800;box-shadow:0 .55rem 0 var(--blue-d);transition:transform .1s}
.btn:active{transform:translateY(.3rem);box-shadow:0 .25rem 0 var(--blue-d)}
.btn.green{background:var(--green);box-shadow:0 .55rem 0 var(--green-d)}
.btn.grape{background:var(--grape);box-shadow:0 .55rem 0 var(--grape-d)}
.btn.coral{background:var(--coral-d);box-shadow:0 .55rem 0 #B23A1B}
.btn.small{font-size:1.4rem;padding:.6rem 1.4rem}
.btn[disabled]{opacity:.5}
.card{background:#fff;border-radius:2.2rem;box-shadow:0 .6rem 0 var(--shadow)}
.bubble{position:relative;padding:1.1rem 1.4rem;border-radius:1.8rem;background:#fff;font-size:1.6rem;font-weight:700;line-height:1.25;box-shadow:0 .35rem 0 var(--shadow);text-align:center}

/* Avatar seçimi */
.av-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.3rem;width:min(66rem,92vw)}
.av-card{position:relative;display:flex;align-items:center;gap:1rem;padding:.9rem 1.2rem;border-radius:2rem;background:#fff;border:.4rem solid #fff;text-align:left;box-shadow:0 .5rem 0 var(--shadow);transition:transform .2s}
.av-card:active{transform:scale(.97)}
.av-card .face{width:7.4rem;height:7.4rem;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.av-card .face svg{width:6.8rem;height:6.8rem}
.av-card b{display:block;font-size:2.1rem;line-height:1}
.av-card span{font-size:1.2rem;font-weight:600;color:var(--ink2);line-height:1.2}
.badge{position:absolute;top:-.8rem;right:1rem;padding:.2rem .9rem;border-radius:1.2rem;background:var(--navy);color:#fff;font-size:1rem;font-weight:700}

/* Ana menü */
.home-body{position:relative;flex:1;display:flex;gap:2.2rem;padding:.2rem 2.4rem 2rem;min-height:0;z-index:1}
.home-left{width:20rem;display:flex;flex-direction:column;align-items:center;gap:.8rem;padding-top:.5rem}
.home-left .big{width:16rem;height:16rem;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 .8rem 0 var(--shadow);margin-top:1rem}
.home-left .big svg{width:14rem;height:14rem}
.modes{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:1.3rem}
.mode{display:flex;flex-direction:column;gap:.5rem;padding:1.4rem;border-radius:2.2rem;text-align:left;transition:transform .2s;overflow:hidden}
.mode:active{transform:scale(.97)}
.mode .ic{width:5.4rem;height:5.4rem;border-radius:1.6rem;display:flex;align-items:center;justify-content:center}
.mode .ic svg{width:3.2rem;height:3.2rem}
.mode b{font-size:2.3rem;line-height:1}
.mode span{font-size:1.25rem;font-weight:600;color:var(--ink2);line-height:1.2}
.mode.chat{grid-row:span 2;align-items:center;justify-content:center;text-align:center}
.mode.chat .ic{width:8rem;height:8rem;border-radius:50%;border:.5rem solid #fff}
.mode.chat .ic svg{width:4rem;height:4rem}
.progress{height:.9rem;border-radius:.5rem;background:#fff;overflow:hidden}
.progress>div{height:100%;border-radius:.5rem;background:var(--green);transition:width .4s}

/* Sohbet */
.chat-body{flex:1;display:flex;gap:1.8rem;padding:0 2.2rem;min-height:0}
.chat-av{width:22rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;border-radius:2.4rem;background:#FFE3D9}
.chat-av svg.av-svg{width:15rem;height:15rem}
.bars{display:flex;align-items:center;gap:.5rem;height:3rem;visibility:hidden}
body.speaking .bars{visibility:visible}
.bars i{display:block;width:.6rem;border-radius:.4rem;background:var(--coral);animation:bar .9s ease-in-out infinite}
.msgs{flex:1;display:flex;flex-direction:column;gap:1rem;padding:.5rem .3rem 1rem;min-height:0}
.msg{max-width:80%;padding:1rem 1.4rem;font-size:1.6rem;font-weight:600;line-height:1.3;animation:pop .35s ease-out both}
.msg.ai{align-self:flex-start;background:#fff;border-radius:1.8rem 1.8rem 1.8rem .5rem;box-shadow:0 .3rem 0 #F2C9B8}
.msg.me{align-self:flex-end;background:var(--blue);color:#fff;border-radius:1.8rem 1.8rem .5rem 1.8rem}
.msg .src{display:block;margin-top:.3rem;font-size:1rem;color:var(--muted);font-weight:600}
.chat-foot{display:flex;align-items:center;justify-content:center;gap:1.4rem;padding:1rem 2.2rem 1.4rem}
.mic{position:relative;width:8.4rem;height:8.4rem;flex-shrink:0}
.mic button{position:relative;width:100%;height:100%;border-radius:50%;border:.45rem solid #fff;background:var(--coral);display:flex;align-items:center;justify-content:center;box-shadow:0 .6rem 0 #C2452A;z-index:1}
.mic button svg{width:3.8rem;height:3.8rem}
.mic .r{position:absolute;inset:0;border-radius:50%;background:var(--coral);animation:ring 1.6s ease-out infinite;display:none}
.mic .r.b{animation-delay:.8s}
.mic.on .r{display:block}
.mic.on button{background:var(--coral-d)}
.typebox{display:flex;gap:.6rem;flex:1;max-width:34rem}
.typebox input{flex:1;height:4rem;border-radius:2rem;border:.2rem solid #F2C9B8;padding:0 1.3rem;font-family:inherit;font-size:1.4rem;color:var(--navy);background:#fff}
.typebox button{width:4rem;height:4rem;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center}
.typebox button svg{width:1.8rem;height:1.8rem}
.miclabel{font-size:1.4rem;font-weight:800;min-width:14rem}

/* Ders / test */
.opt-grid{display:grid;gap:1.2rem;width:100%}
.opt{min-height:6rem;padding:.8rem;border-radius:1.8rem;border:.35rem solid #DDE8F8;background:#F2F7FF;font-size:1.8rem;font-weight:800;line-height:1.15;box-shadow:0 .45rem 0 #B8CDEE}
.opt.ok{background:#C9F2D8;border-color:var(--green);box-shadow:0 .45rem 0 var(--green-d)}
.opt.no{background:#FFE3D9;border-color:var(--coral);box-shadow:0 .45rem 0 var(--coral-d)}
.dots{display:flex;gap:.5rem}
.dots i{width:1.6rem;height:1.6rem;border-radius:50%;background:#fff;display:block}
.dots i.d{background:var(--green)} .dots i.c{background:var(--blue);border:.25rem solid #fff}
.lesson-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem;width:100%}
.lesson{display:flex;align-items:center;gap:1rem;padding:1.2rem 1.4rem;border-radius:1.8rem;background:#fff;text-align:left;box-shadow:0 .45rem 0 #B8CDEE}
.lesson b{font-size:1.6rem;line-height:1.1;display:block}
.lesson small{font-size:1.1rem;font-weight:700;color:var(--muted)}
.lesson .st{margin-left:auto;padding:.3rem .8rem;border-radius:1rem;font-size:1rem;font-weight:800;flex-shrink:0}

/* Öğrenme */
.islands{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1rem;padding:0 2.2rem}
.island{height:7.4rem;border-radius:2rem;border:.35rem solid transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.1rem;animation:float 3s ease-in-out infinite;font-size:1.25rem;font-weight:800}
.island svg{width:3rem;height:3rem}
.island.sel{border-color:var(--navy)}

/* Masal */
.story-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem}
.story-card{padding:1.1rem 1.3rem;border-radius:1.8rem;background:#fff;text-align:left;box-shadow:0 .45rem 0 #C6B2F5;display:flex;flex-direction:column;gap:.3rem;border-left:0}
.story-card b{font-size:1.5rem;line-height:1.1}
.story-card small{font-size:1rem;font-weight:700;color:var(--muted)}
.story-text p{margin:0 0 .9rem;font-size:1.55rem;line-height:1.45;font-weight:600;color:var(--ink2);transition:background .3s}
.story-text p.cur{background:#FFF0B3;color:var(--navy);border-radius:.8rem;padding:.2rem .5rem}
.chip{padding:.5rem 1rem;border-radius:1.2rem;border:.25rem solid #EBE2FF;background:#F7F3FF;font-size:1.2rem;font-weight:800}
.chip.sel{border-color:var(--grape);background:#EBE2FF}

/* Müzik */
.xylo{display:flex;align-items:flex-end;justify-content:center;gap:.9rem;padding:1.2rem;height:19rem}
.xylo button{width:6.6rem;border-radius:1.3rem;display:flex;align-items:flex-end;justify-content:center;padding-bottom:.8rem;font-size:1.7rem;font-weight:800;transition:transform .08s}
.xylo button.hit,.pad.hit{transform:translateY(.4rem) scale(.97);filter:brightness(1.1)}
.pad{flex:1;height:8.5rem;border-radius:2rem;border:.35rem solid #fff;font-size:1.9rem;font-weight:800;transition:transform .08s}
.inst{height:11rem;border-radius:1.8rem;border:.35rem solid #F3E3B0;background:#FFFBEF;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;font-size:1.6rem;font-weight:800}
.inst svg{width:6.4rem;height:5.6rem}
.inst.ok{background:#C9F2D8;border-color:var(--green)} .inst.no{background:#FFE3D9;border-color:var(--coral)}
.tabs2{display:flex;gap:.5rem;padding:.4rem;border-radius:2rem;background:#fff;box-shadow:0 .35rem 0 #EBCB6A}
.tabs2 button{padding:.6rem 1.6rem;border-radius:1.6rem;font-size:1.6rem;font-weight:800}
.tabs2 button.on{background:var(--gold);color:var(--navy)}

/* Ebeveyn bölümü (yetişkin arayüzü) */
.adult{font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif}
.adult h2{font-size:1.9rem;margin:0}
.gate{position:absolute;inset:0;background:var(--navy);display:flex;align-items:center;justify-content:center;gap:2.4rem;padding:2rem}
.gate .box{width:min(34rem,90vw);background:#fff;border-radius:2rem;padding:2.2rem;display:flex;flex-direction:column;gap:1rem}
.field{display:flex;flex-direction:column;gap:.35rem}
.field label{font-size:1.05rem;font-weight:700}
.field input,.field textarea,.field select{height:3.4rem;padding:0 1rem;border-radius:.9rem;border:.15rem solid #D5DCEB;font-size:1.1rem;font-family:inherit;color:var(--navy);background:#fff}
.field textarea{height:auto;padding:.8rem 1rem;resize:vertical}
.abtn{height:3.3rem;padding:0 1.3rem;border-radius:.9rem;background:var(--navy);color:#fff;font-size:1.05rem;font-weight:700;font-family:inherit}
.abtn.ghost{background:#fff;color:var(--navy);border:.15rem solid #D5DCEB}
.abtn.ok{background:var(--green-d)}
.abtn.danger{background:#B23A1B}
.hint{font-size:.95rem;color:var(--muted);line-height:1.45}
.err{font-size:1rem;color:#B23A1B;font-weight:600}
.parent{position:absolute;inset:0;display:flex;background:#F4F6FB}
.side{width:15rem;background:var(--navy);color:#fff;display:flex;flex-direction:column;gap:.4rem;padding:1.6rem 1rem}
.side button{text-align:left;padding:.85rem 1rem;border-radius:.8rem;color:#D7DEEE;font-size:1.05rem;font-weight:600}
.side button.on{background:#fff;color:var(--navy)}
.pmain{flex:1;min-width:0;padding:1.6rem 2rem;display:flex;flex-direction:column;gap:1rem}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.9rem}
.kpi{background:#fff;border-radius:1.1rem;padding:1rem 1.1rem}
.kpi small{display:block;font-size:.85rem;font-weight:600;color:var(--muted)}
.kpi b{font-size:1.7rem}
.panel{background:#fff;border-radius:1.1rem;padding:1.1rem}
.panel h3{margin:0 0 .6rem;font-size:1.05rem}
.tag{display:inline-block;padding:.3rem .7rem;border-radius:.7rem;font-size:.9rem;font-weight:600;margin:0 .35rem .35rem 0}
.chart{height:10rem;display:flex;align-items:flex-end;gap:.8rem;border-bottom:.12rem solid #E3E8F2;position:relative}
.chart .col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:.2rem;height:100%;font-size:.8rem;font-weight:600;color:var(--muted)}
.chart .col i{display:block;width:100%;border-radius:.5rem .5rem 0 0;background:var(--blue);transform-origin:bottom;animation:grow .7s ease-out both}
.chart .limit{position:absolute;left:0;right:0;border-top:.15rem dashed var(--coral)}
.rec{display:flex;gap:.7rem;align-items:center;width:100%;text-align:left;padding:.75rem .9rem;border-radius:.9rem;border:.15rem solid #fff;background:#fff}
.rec.on{border-color:var(--blue)}
.mtag{width:5.4rem;flex-shrink:0;padding:.3rem 0;border-radius:.6rem;font-size:.8rem;font-weight:700;text-align:center}
.line{display:flex;gap:.6rem;align-items:flex-start;font-size:.95rem;line-height:1.45;padding:.25rem 0}
.line .who{width:4.6rem;flex-shrink:0;padding:.15rem 0;border-radius:.5rem;font-size:.8rem;font-weight:700;text-align:center}
.flag{display:flex;gap:.7rem;padding:.9rem 1rem;border-radius:1rem;background:#FFF4E0;border:.15rem solid #F5B94A;font-size:.95rem;line-height:1.45}
.toast{position:fixed;left:50%;bottom:2rem;transform:translateX(-50%);background:var(--navy);color:#fff;padding:.8rem 1.4rem;border-radius:1.2rem;font-size:1.2rem;font-weight:700;z-index:99;animation:pop .3s ease-out both}
.setup{position:absolute;inset:0;background:var(--sky);display:flex;align-items:center;justify-content:center;padding:1.5rem}
.setup .box{width:min(46rem,94vw);max-height:94vh;overflow-y:auto;background:#fff;border-radius:2rem;padding:2.2rem;display:flex;flex-direction:column;gap:1rem}
.row{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}
.timesup{position:absolute;inset:0;background:#2C3B63;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.2rem;text-align:center}
.timesup h1{font-size:3rem;margin:0}
.timesup svg.av-svg{width:14rem;height:14rem}
.parent.screen,.gate.screen{flex-direction:row}
.timesup .lockbtn{color:var(--navy)}
[style*="'Baloo 2'"]{font-family:'Baloo 2',system-ui,sans-serif!important}
@keyframes rise{from{transform:translateY(0)}to{transform:translateY(calc(-100vh - 12rem))}}
.mcard{height:8.4rem;border:0;background:none;padding:0;perspective:60rem}
.mcard .mi{position:relative;width:100%;height:100%;transition:transform .4s;transform-style:preserve-3d}
.mcard.open .mi{transform:rotateY(180deg)}
.mcard .mf,.mcard .mb{position:absolute;inset:0;border-radius:1.4rem;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 .4rem 0 #A9C8F5}
.mcard .mf{background:var(--blue);color:#fff;font-size:3rem;font-weight:800}
.mcard .mb{background:#fff;font-size:3.8rem;transform:rotateY(180deg)}
.modes{grid-template-columns:repeat(4,minmax(0,1fr))}
.mode.wide{grid-row:span 2;align-items:center;justify-content:center;text-align:center}
.mode b{font-size:2rem}
.home-left{width:16.5rem}
.home-left .big{width:13.5rem;height:13.5rem}
.home-left .big svg{width:12rem;height:12rem}
.mode.chat.wide .ic{border-radius:1.6rem}

/* ===================== Sürüm 2: yeni bileşenler ===================== */
body.font-lexend,body.font-lexend button,body.font-lexend input{font-family:'Lexend','Baloo 2',sans-serif}
body.font-atkinson,body.font-atkinson button,body.font-atkinson input{font-family:'Atkinson Hyperlegible','Baloo 2',sans-serif}
body.big-text{zoom:1.08}
.screen{animation:screenin .38s cubic-bezier(.2,.8,.3,1)}
@keyframes screenin{from{opacity:0;transform:translateX(28px) scale(.985)}to{opacity:1;transform:none}}
.overlay{position:fixed;inset:0;background:rgba(29,42,77,.45);display:flex;align-items:center;justify-content:center;z-index:40;padding:1rem;animation:fadein .25s}
.lay-row{min-height:0}
.act-body{flex:1;display:flex;flex-direction:column;padding:0 2rem 1.4rem;min-height:0;position:relative}
.act-side{width:14rem;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem}
.ico-c{width:2.6rem;height:2.6rem;border-radius:.8rem;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle}
.ico-c svg{width:1.7rem;height:1.7rem}.ico-c.sm{width:2.2rem;height:2.2rem}
.lvb{display:inline-block;padding:.05rem .6rem;border-radius:.8rem;background:#fff;font-size:1rem;font-weight:800;color:var(--navy);border:.12rem solid #E3E8F2}
.q-prompt{font-size:2.4rem;font-weight:800;text-align:center;line-height:1.15}
.q-visual{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;max-width:100%}
.q-visual svg{max-width:100%;height:auto}
.opt .optnum{position:absolute;margin:-1rem 0 0 -.4rem;width:1.8rem;height:1.8rem;border-radius:50%;background:var(--navy);color:#fff;font-size:1rem;display:inline-flex;align-items:center;justify-content:center}
.opt{position:relative}
.opt.reading{border-color:var(--sun);background:#FFF8E1}
.opt svg{max-width:100%}
/* Avatar ifadeleri */
#pav.happy .av-wrap{animation:yay .7s ease-out}
#pav.sad .av-wrap{animation:aww .7s ease-out}
@keyframes yay{0%{transform:none}30%{transform:translateY(-22px) rotate(-6deg) scale(1.08)}60%{transform:translateY(0) rotate(4deg)}100%{transform:none}}
@keyframes aww{0%,100%{transform:none}30%{transform:translateY(6px) rotate(6deg) scale(.96)}60%{transform:rotate(-4deg)}}
#pav.happy::after{content:'★';position:absolute;font-size:2.4rem;color:#FFC93C;animation:spark .8s ease-out forwards;margin:-12rem 0 0 6rem}
#pav{position:relative}
@keyframes spark{from{opacity:1;transform:scale(.4)}to{opacity:0;transform:translateY(-30px) scale(1.4)}}
/* Derslik sahneleri */
.scene-class{background:linear-gradient(#E9F3FF 0 86%,#F1E4CF 86%)}
.subj-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.1rem}
.mode.subj{min-height:12rem;animation:pop .45s ease-out both}
.mode.subj b{font-size:1.75rem}
.mode.subj .ic{width:4.4rem;height:4.4rem;border-radius:1.2rem}
.mode.subj .ic svg{width:2.6rem;height:2.6rem}
.map{position:relative;margin:0 auto;max-width:60rem}
.map-path{position:absolute;inset:0;width:100%;height:100%}
.map-node{position:absolute;transform:translateX(-50%);display:flex;align-items:center;gap:.8rem;text-align:left;animation:pop .45s ease-out both}
.map-dot{width:5rem;height:5rem;border-radius:50%;border:.4rem solid;display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:800;box-shadow:0 .4rem 0 rgba(29,42,77,.18);flex-shrink:0}
.map-dot svg{width:2.4rem;height:2.4rem}
.map-label{background:#fff;border-radius:1.1rem;padding:.4rem .9rem;box-shadow:0 .3rem 0 rgba(29,42,77,.1);display:flex;flex-direction:column;max-width:17rem}
.map-label b{font-size:1.3rem;line-height:1.1;white-space:nowrap}.map-label>span{white-space:nowrap;display:flex}.map-label small{font-size:.95rem;color:var(--muted);font-weight:600}
/* Ana menü */
.home-right{flex:1;display:flex;flex-direction:column;gap:1rem;min-width:0;min-height:0}
.quests{display:flex;gap:.7rem;flex-wrap:wrap}
.quest{flex:1;min-width:14rem;display:flex;align-items:center;gap:.6rem;background:#fff;border-radius:1.2rem;padding:.5rem .8rem;box-shadow:0 .3rem 0 var(--shadow)}
.quest .qi{font-size:1.8rem}.quest .qt{flex:1;display:flex;flex-direction:column;gap:.25rem;min-width:0}
.quest .qt b{font-size:1.05rem;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.quest .qt small{font-size:.85rem;color:var(--muted)}
.quest .progress{height:.55rem}
.quest .qs{font-size:1rem;font-weight:800;color:var(--gold)}
.quest.done{background:#E6F7EC}.quest.fam{border:.15rem dashed #C6B2F5}
.home-right .modes{flex:1;min-height:0}
.mode{position:relative}
.mode .say{position:absolute;right:.8rem;top:.8rem;width:2.6rem;height:2.6rem;border-radius:50%;background:rgba(255,255,255,.85);display:flex;align-items:center;justify-content:center;color:var(--navy)}
.mode .say svg{width:1.5rem;height:1.5rem}
.night-modes{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:1fr!important}
.shopbtn{gap:.3rem;font-size:1.2rem}
/* Mağaza */
.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:1rem;align-content:start;flex:1;min-height:0;padding:.3rem .3rem 1rem}
.shop-item{background:#fff;border-radius:1.4rem;padding:.8rem;display:flex;flex-direction:column;align-items:center;gap:.3rem;box-shadow:0 .4rem 0 #EBCB6A;border:.25rem solid transparent}
.shop-item b{font-size:1.1rem;text-align:center;line-height:1.1}
.shop-item .price{font-weight:800;color:var(--gold-d);font-size:1.1rem}
.shop-item.on{border-color:var(--green)}.shop-item.own .price{color:var(--green-d)}
.shop-item.lock{opacity:.6}
/* Etkinlikler */
.rule-cue{color:#fff;font-size:1.8rem;font-weight:800;padding:.4rem 1.6rem;border-radius:2rem}
.symc{border:.15rem solid;border-radius:.4rem;aspect-ratio:1;transition:background .15s}
.sdk{border:.12rem solid #C5CCDA;background:#fff;font-size:3rem;display:flex;align-items:center;justify-content:center;aspect-ratio:1}
.sdk.g{background:#F4F6FB}.sdk.sel{background:#FFF1C2;box-shadow:inset 0 0 0 .3rem var(--sun)}
.fw{border-radius:.4rem;padding:0 .1rem;transition:background .3s}.fw.ok{background:#C9F2D8}.fw.miss{background:#FFE3D9}
.breath-ball{width:12rem;height:12rem;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#A6E3BC);display:flex;align-items:center;justify-content:center;box-shadow:0 0 3rem rgba(59,178,115,.4)}
.mv-av{transition:transform .3s}
.mv-jump{animation:hop .6s ease-in-out infinite}.mv-stretch{animation:stretch 2s ease-in-out infinite}.mv-toes{animation:toes 2s ease-in-out infinite}
.mv-march{animation:march .5s ease-in-out infinite}.mv-flamingo{animation:wiggle 1.6s ease-in-out infinite}.mv-shoulders{animation:talk 1s ease-in-out infinite}.mv-tree{animation:sway 2.4s ease-in-out infinite}
@keyframes stretch{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.18) translateY(-12px)}}
@keyframes toes{0%,100%{transform:none}50%{transform:rotate(25deg) translateY(20px)}}
@keyframes march{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-10px) rotate(3deg)}}
@keyframes sway{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}
/* Ebeveyn */
.check{display:flex;align-items:flex-start;gap:.5rem;font-size:.95rem;line-height:1.35;margin:.2rem 0}
.check input{width:1.3rem;height:1.3rem;flex-shrink:0;margin-top:.1rem}
.linkbtn{color:var(--blue);text-decoration:underline;font-weight:700;padding:0}
.steps{display:flex;gap:.4rem}.steps i{flex:1;height:.4rem;border-radius:.2rem;background:#E3E8F2}.steps i.d{background:var(--green)}.steps i.c{background:var(--blue)}
.errlog{background:#1D2A4D;color:#D7DEEE;border-radius:.8rem;padding:.8rem;font-size:.75rem;max-height:14rem;overflow:auto;white-space:pre-wrap;user-select:text;-webkit-user-select:text}
.plans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}
.plan{position:relative;border:.18rem solid #E3E8F2;border-radius:1rem;padding:1rem;display:flex;flex-direction:column;gap:.35rem}
.plan.best{border-color:var(--sun);background:#FFFBEA}
.plan .pr{font-size:1.6rem;font-weight:800}.plan .pr small{font-size:.9rem;font-weight:600;color:var(--muted)}
.abtn[disabled]{opacity:.5;cursor:not-allowed}
.adult .box h3{margin-top:0}
/* Sınıfa göre görünüm */
body.g-pre .opt{min-height:7.5rem;font-size:2.2rem;border-radius:2.2rem}
body.g-pre .q-prompt{font-size:2.8rem}
body.g-pre .mode span{display:none}
body.g-big .mode b{font-size:1.8rem}
body.g-big .q-prompt{font-size:2.1rem}
/* Gece / uyku teması */
body.night{--sky:#1E2550;--navy:#F3F5FF;--ink2:#C9D0EA;--muted:#AEB6D6;--shadow:#141A3C}
body.night .screen{background:linear-gradient(#141A3C,#2A2F6B)!important}
body.night .cloud{background:#3B4380;opacity:.5}
body.night .hills path:first-child{fill:#2B3470}body.night .hills path:last-child{fill:#232A60}
body.night .card,body.night .bubble,body.night .pill,body.night .quest,body.night .mode{background:#2C3470!important;color:#F3F5FF}
body.night .mode span{color:#C9D0EA}
body.night .adult,body.night .adult .screen{--navy:#1D2A4D;--ink2:#3A4B73;--muted:#4A5778}
/* Yön uyarısı (web ve dikey telefon) */
#rotate{display:none;position:fixed;inset:0;z-index:100;background:var(--sky);color:var(--navy);flex-direction:column;align-items:center;justify-content:center;gap:.8rem;text-align:center;padding:2rem;font-family:'Baloo 2',sans-serif}
#rotate div{font-size:4rem}#rotate b{font-size:1.6rem}#rotate span{font-size:1.1rem}
@media (orientation:portrait) and (max-width:560px){#rotate{display:flex}}
/* Telefon (alçak yatay ekran) */
@media (max-height:520px){
  .top{padding-top:.6rem!important;padding-bottom:.3rem!important}
  .home-left{width:13rem}.home-left .big{width:10rem;height:10rem;margin-top:.2rem}.home-left .big svg{width:8.5rem;height:8.5rem}
  .home-left .bubble{font-size:1.1rem}
  .quest{min-width:11rem;padding:.3rem .6rem}.quest .qi{font-size:1.3rem}
  .mode{padding:.9rem}.mode .ic{width:3.8rem;height:3.8rem}.mode .ic svg{width:2.3rem;height:2.3rem}.mode span{font-size:1.05rem}
  .act-side,.lay-side{width:10rem!important}.act-side .av-wrap svg,.lay-side .av-wrap svg{width:7rem;height:7rem}
  .opt{min-height:4.6rem}
  .av-wrap svg{max-width:10rem;max-height:10rem}
  .shop-item .prev svg{max-width:5.5rem;max-height:5.5rem}
  .q-prompt{font-size:2rem}
}

/* ===================== Sürüm 3: güvenlik, destek, bakım, eğlence ===================== */
.nbadge{display:inline-flex;align-items:center;justify-content:center;min-width:1.4rem;height:1.4rem;border-radius:.7rem;background:#FF5B5B;color:#fff;font-size:.8rem;font-weight:800;padding:0 .3rem;margin-left:.3rem}
.care-scr .top h1{color:#fff}
.cd-banner{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:#E6F7EC;border:.15rem solid #A6DDB9;border-radius:.9rem;padding:.5rem .9rem;font-weight:700}
.cd-banner.warn{background:#FFF1C2;border-color:#EBCB6A}
.pin-dots{display:flex;gap:1rem;justify-content:center;margin:.6rem 0}.pin-dots i{width:1.3rem;height:1.3rem;border-radius:50%;border:.18rem solid #fff;opacity:.6}.pin-dots i.on{background:var(--sun);border-color:var(--sun);opacity:1}
.pinpad{display:grid;grid-template-columns:repeat(3,4.6rem);gap:.7rem;justify-content:center}.pinpad button{height:4.2rem;border-radius:1rem;background:#2C3B63;color:#fff;font-size:1.8rem;font-weight:800}.pinpad button:active{background:#3D5089}
.quickbar{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center;margin-top:.4rem}
.quickbar button{display:flex;flex-direction:column;align-items:center;gap:.1rem;background:#fff;border-radius:1rem;padding:.35rem .5rem;font-size:.85rem;font-weight:800;box-shadow:0 .25rem 0 var(--shadow);min-width:4.6rem}
.quickbar button span{font-size:1.5rem;line-height:1}
.ckhost:empty{display:none}
.checkin{position:relative;flex:1;min-width:20rem;background:#FFF8E1;border:.18rem solid #EBCB6A;border-radius:1.2rem;padding:.5rem .8rem;display:flex;flex-direction:column;gap:.35rem}
.checkin b{font-size:1.1rem}.ck-opts{display:flex;gap:.35rem;flex-wrap:wrap}
.ck-opts button{background:#fff;border-radius:.8rem;padding:.2rem .55rem;font-size:.95rem;font-weight:700;display:flex;align-items:center;gap:.25rem;box-shadow:0 .2rem 0 #EBCB6A}
.ck-opts button span{font-size:1.2rem}.ck-x{position:absolute;right:.4rem;top:.2rem;font-size:1.4rem;color:var(--muted);width:2rem;height:2rem}
/* Dertleşme: görüntülü konuşma */
.care-scr{background:radial-gradient(circle at 50% 30%,#3D4B8F,#1E2550 70%)!important}
.helper-card{display:flex;flex-direction:column;align-items:center;gap:.3rem;background:rgba(255,255,255,.95);border-radius:2rem;padding:1.2rem 1.6rem;box-shadow:0 .6rem 0 rgba(0,0,0,.25);min-width:14rem}
.helper-card b{font-size:1.6rem}.helper-card span{font-size:1.05rem;color:var(--ink2)}.helper-card.light{background:#fff;box-shadow:0 .6rem 0 #A6DDB9}
.vc-top{display:flex;align-items:center;gap:.6rem;justify-content:center;color:#fff;font-size:1.3rem;padding:1rem}
.vc-dot{width:.8rem;height:.8rem;border-radius:50%;background:#3BB273;box-shadow:0 0 .6rem #3BB273}
.vc-stage{flex:1;position:relative;display:flex;align-items:center;justify-content:center;min-height:0}
.vc-helper{border-radius:50%;background:radial-gradient(circle at 50% 40%,#FFF6E5,#FFD6E7);padding:1rem;box-shadow:0 0 0 .6rem rgba(255,255,255,.15),0 1.6rem 3rem rgba(0,0,0,.35);animation:breathe 4s ease-in-out infinite}
.vc-helper svg{display:block;max-height:52vh;width:auto}
.vc-helper.ringing{animation:ring 1s ease-in-out infinite}
.vc-helper.talking .hp-head{animation:nod 1.6s ease-in-out infinite;transform-origin:100px 150px}
.vc-helper.concerned .hp-brow-l{transform:rotate(10deg);transform-origin:76px 66px}.vc-helper.concerned .hp-brow-r{transform:rotate(-10deg);transform-origin:124px 66px}
@keyframes breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.015)}}
@keyframes ring{0%,100%{transform:rotate(0)}25%{transform:rotate(-4deg)}75%{transform:rotate(4deg)}}
@keyframes nod{0%,100%{transform:rotate(0)}30%{transform:rotate(-2deg) translateY(1px)}70%{transform:rotate(2deg)}}
.vc-self{position:absolute;right:2rem;bottom:1rem;width:11rem;height:8rem;border-radius:1rem;background:#2C3470;border:.2rem solid rgba(255,255,255,.5);overflow:hidden;display:flex;align-items:center;justify-content:center}
.vc-self video{display:none;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.vc-self.on video{display:block}.vc-self.on span{display:none}
.vc-sub{position:absolute;left:50%;bottom:.6rem;transform:translateX(-50%);max-width:70%;background:rgba(0,0,0,.55);color:#fff;font-size:1.35rem;font-weight:700;padding:.4rem 1rem;border-radius:1rem;text-align:center}
.vc-sub:empty{display:none}
.vc-moods{display:flex;gap:.5rem;justify-content:center;padding:.4rem 1rem;flex-wrap:wrap}
.vc-moods button{background:rgba(255,255,255,.92);border-radius:1rem;padding:.3rem .7rem;font-weight:800;font-size:1rem;display:flex;align-items:center;gap:.3rem}.vc-moods span{font-size:1.5rem}
.vc-bar{display:flex;align-items:center;justify-content:center;gap:1rem;padding:.4rem 1.6rem 1.2rem}
.vc-bar .mic{transform:scale(.72);margin:-1.4rem -.8rem}
.vc-btn{width:4rem;height:4rem;border-radius:50%;background:rgba(255,255,255,.9);font-size:1.7rem}.vc-btn.end{background:#FF5B5B;color:#fff;transform:rotate(135deg)}
/* Günlük ve profil */
.emo-btn{font-size:2.4rem;width:4rem;height:4rem;border-radius:1rem;background:#FFF8E1}.emo-btn.on{background:#FFE38A;box-shadow:inset 0 0 0 .2rem #E0A400}
.diary-page{background:repeating-linear-gradient(#fff 0 2.3rem,#F2E6C9 2.3rem 2.4rem)!important}
.diary-card{padding:1rem;display:flex;flex-direction:column;gap:.5rem}
.grow-card{display:flex;align-items:center;gap:.7rem;background:#E6F7EC;border-radius:1rem;padding:.5rem .9rem;font-size:1rem}.grow-card b{font-size:1.4rem}
.kid-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin-top:.6rem}.kid-kpis div{background:#F4F6FB;border-radius:1rem;padding:.6rem;display:flex;flex-direction:column;align-items:center}.kid-kpis span{font-size:2rem}.kid-kpis b{font-size:2rem}.kid-kpis small{font-weight:700;color:var(--ink2)}
.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(7.4rem,1fr));gap:.6rem;margin-top:.6rem}
.badge-i{display:flex;flex-direction:column;align-items:center;gap:.2rem;padding:.5rem;border-radius:1rem;background:#F4F6FB;filter:grayscale(1);opacity:.45;text-align:center}.badge-i span{font-size:2.2rem}.badge-i small{font-weight:700;font-size:.85rem;line-height:1.1}
.badge-i.on{filter:none;opacity:1;background:#FFF1C2}
/* Bakım ve giydirme */
.meter{display:flex;align-items:center;gap:.6rem;margin:.25rem 0;font-weight:700;font-size:1rem}.meter span{width:6.5rem}.meter div{flex:1;height:.9rem;background:#EEF1F6;border-radius:.5rem;overflow:hidden}.meter i{display:block;height:100%;border-radius:inherit;transition:width .5s}
.food{display:flex;flex-direction:column;align-items:center;gap:.15rem;background:#F4F6FB;border-radius:1rem;padding:.5rem;font-weight:800;font-size:.95rem;box-shadow:0 .25rem 0 #DCE2EE}.food span{font-size:2.2rem;line-height:1.1}.food.on{background:#FFF1C2;box-shadow:inset 0 0 0 .2rem #E0A400}
.food .sw{width:2.6rem;height:2.6rem;border-radius:.7rem;border:.15rem solid #1D2A4D;display:flex;align-items:center;justify-content:center;font-size:1.2rem}
.dress-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(8rem,1fr));gap:.6rem}
.pet-big{font-size:9rem;line-height:1;transition:transform .3s}
.pet-big.feed,.pet-big.water,.pet-big.pet{animation:hop .5s 2}.pet-big.play{animation:wiggle .5s 3}.pet-big.walk{animation:march .5s 4}.pet-big.bath,.pet-big.brush{animation:wiggle 1s 2}
.pet-tree{position:absolute;right:8%;bottom:20%;font-size:5rem}.pet-bubbles{position:absolute;top:18%;font-size:3rem;animation:float 2s infinite}
.aquarium{position:relative;border-radius:1.6rem;background:linear-gradient(#BDE7FF,#4DA3FF);border:.5rem solid #9AA9C7;overflow:hidden;box-shadow:inset 0 0 3rem rgba(0,0,0,.15)}
.aq-water{position:absolute;inset:0;background:#7E8F5A;pointer-events:none;transition:opacity .6s}
.aq-fish{position:absolute;font-size:3.2rem;animation:swim linear infinite}
@keyframes swim{0%{left:-10%;transform:scaleX(-1)}49%{transform:scaleX(-1)}50%{left:95%;transform:scaleX(1)}100%{left:-10%;transform:scaleX(1)}}
.aq-weed{position:absolute;bottom:.2rem;font-size:3rem}
#flakes i{position:absolute;top:0;width:.5rem;height:.5rem;border-radius:.1rem;background:#E0A400;animation:sink 1.2s ease-in forwards}
@keyframes sink{to{transform:translateY(55vh);opacity:.2}}
.baby-svg.sleep{filter:brightness(.92)}.baby-svg.toy,.baby-svg.hug{animation:hop .5s 2}.baby-svg.park{animation:march .6s 3}
.reward{display:flex;flex-direction:column;align-items:center;gap:.3rem;background:#F4F6FB;border-radius:1.2rem;padding:.8rem;text-align:center}.reward.lock{opacity:.7}.reward small{color:var(--ink2);font-weight:700}
.swatch{width:2.8rem;height:2.8rem;border-radius:50%;border:.2rem solid #fff;box-shadow:0 0 0 .15rem #C5CCDA}.swatch.on{box-shadow:0 0 0 .3rem #1D2A4D}
.chip.on{background:#1D2A4D;color:#fff;border-color:#1D2A4D}
/* Eğlence ve zekâ oyunları */
.fun-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.2rem}.fun-grid .mode{min-height:12rem}
.scale{--tilt:0deg;display:flex;flex-direction:column;align-items:center;width:26rem}
.scale .beam{width:100%;height:.6rem;background:#7E4E2B;border-radius:.3rem;display:flex;justify-content:space-between;transform:rotate(var(--tilt));transition:transform .6s;position:relative}
.scale .pan{width:9rem;min-height:4.4rem;margin-top:.6rem;border-bottom:.5rem solid #9AA9C7;border-radius:0 0 4rem 4rem;display:flex;align-items:flex-end;justify-content:center;font-size:2rem;padding:.2rem;background:rgba(154,169,199,.15);word-break:break-all;text-align:center}
.scale .pan span{display:block;transform:translateY(-.2rem)}
.scale .post{width:.6rem;height:6rem;background:#7E4E2B}
.hanoi{flex:1;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;min-height:14rem}
.peg{position:relative;display:flex;flex-direction:column-reverse;align-items:center;gap:.25rem;border-radius:1rem;background:#F4F6FB;padding:.6rem 0;border-bottom:.6rem solid #7E4E2B}
.peg.sel{background:#FFF1C2}.peg .rod{position:absolute;bottom:0;top:1.2rem;width:.6rem;background:#B97A47;border-radius:.3rem}
.disk{position:relative;height:1.8rem;border-radius:.9rem;border:.15rem solid #1D2A4D;z-index:1}
.pgrid{display:grid;gap:.2rem}.pw{width:3.6rem;height:3.6rem;border-radius:.4rem;background:#F4F6FB;display:flex;align-items:center;justify-content:center;font-size:2.4rem;font-style:normal}
.pw.w{background:#8B5A2B}.pw.g{background:#C9F2D8;box-shadow:inset 0 0 0 .25rem #3BB273}
.dpad{display:grid;grid-template-columns:repeat(3,4.4rem);gap:.4rem}.dpad button{height:4.4rem;border-radius:1rem;background:#fff;font-size:2rem;box-shadow:0 .3rem 0 #DCE2EE}
.logic-grid{display:grid;gap:.35rem;align-items:center}.logic-grid b{font-size:1.2rem;text-align:center;display:flex;flex-direction:column}.logic-grid small{font-size:.8rem;color:var(--ink2)}
.lg{height:3rem;border-radius:.6rem;background:#F4F6FB;font-size:1.4rem;font-weight:800;color:#1E7A47}.lg.on{background:#C9F2D8}
.nono{display:grid;gap:.25rem;align-items:center}.nono .cc{font-size:1rem;text-align:center;align-self:end;line-height:1.1}.nono .rc{font-size:1.1rem;text-align:right;padding-right:.4rem}
.nc{height:4.2rem;border-radius:.4rem;background:#F4F6FB;border:.12rem solid #C5CCDA;font-size:1.6rem}.nc.on{background:#1D2A4D}.nc.x{color:#9AA9C7}
/* Karaoke ve fotoğraf */
.kara{flex:1;overflow:auto;display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1rem 2rem}
.kl{font-size:2.4rem;font-weight:800;color:rgba(255,255,255,.55);text-align:center}.kl span{transition:color .15s}
.kl span.on{color:#FFD43B;text-shadow:0 0 1rem rgba(255,212,59,.6)}.kl span.done{color:#fff}
.big-pick{width:18rem;min-height:14rem;align-items:center;justify-content:center;text-align:center;cursor:pointer}
.stk{display:grid;grid-template-columns:repeat(6,1fr);gap:.3rem}.stk button{font-size:1.8rem;height:2.8rem;border-radius:.6rem;background:#F4F6FB}
.rep-prev{display:flex;gap:1rem;flex-wrap:wrap}.rep-prev img{width:calc(50% - .5rem);min-width:20rem;border-radius:.6rem;box-shadow:0 .3rem 1rem rgba(0,0,0,.15)}
.tbl{width:100%;border-collapse:collapse;font-size:.95rem}.tbl th,.tbl td{padding:.35rem .5rem;border-bottom:.1rem solid #EEF1F6;text-align:left}
.prof{display:flex;flex-direction:column;gap:.3rem;padding:.6rem .9rem;border-radius:.9rem;background:#F4F6FB;min-width:12rem}.prof.on{background:#E6F7EC;box-shadow:inset 0 0 0 .15rem #A6DDB9}
.mood-cal{display:grid;grid-template-columns:repeat(14,1fr);gap:.3rem}.mood-cal div{display:flex;flex-direction:column;align-items:center;gap:.2rem}.mood-cal small{font-size:.7rem;color:var(--ink2)}.mood-cal span{display:flex;flex-direction:column;gap:.15rem}.mood-cal i{width:1.4rem;height:.8rem;border-radius:.3rem;display:block}
@media (max-height:520px){
  .quickbar button{min-width:3.8rem;font-size:.75rem}.quickbar button span{font-size:1.2rem}
  .vc-helper svg{max-height:42vh}.checkin{min-width:15rem}
  .fun-grid .mode{min-height:9rem}.pw{width:2.6rem;height:2.6rem;font-size:1.7rem}.nc{height:3.2rem}
}

/* Görselli yardımcı karakter */
.vc-helper .helper-img .hp-head,.hc-face .helper-img .hp-head{transform-box:view-box;transform-origin:100px 200px;transition:transform .4s,filter .4s}
.vc-helper.talking .helper-img .hp-head{animation:talkimg .5s ease-in-out infinite}
.vc-helper.concerned .helper-img .hp-head{transform:rotate(-3deg);filter:saturate(.85) brightness(.97)}
.vc-helper.talking{box-shadow:0 0 0 .6rem rgba(255,255,255,.15),0 0 0 1.1rem rgba(123,216,143,.35),0 1.6rem 3rem rgba(0,0,0,.35)}
.hc-face .helper-img{border-radius:50%;background:radial-gradient(circle at 50% 40%,#FFF6E5,#FFD6E7)}
@keyframes talkimg{0%,100%{transform:scale(1,1) rotate(0)}35%{transform:scale(1.012,1.028) rotate(-.7deg)}70%{transform:scale(1.006,1.012) rotate(.5deg)}}

/* ================= v4: yeni etkinlikler ================= */
.fun-ic{width:6.4rem;height:6.4rem;object-fit:contain;filter:drop-shadow(0 .4rem .5rem rgba(29,42,77,.18))}.fun-emo{font-size:4.2rem;line-height:1}
.chip.on,.seg .chip.on{background:var(--blue);color:#fff;border-color:var(--blue)}
.seg{gap:.5rem;flex-wrap:wrap}.chip.big{font-size:1.35rem;padding:.55rem 1.3rem}
.act-grid3{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem;padding:0 2.2rem 1.4rem;align-content:center;justify-content:center}
.act-card{align-items:center;text-align:center;justify-content:center;min-height:13rem;position:relative;box-shadow:0 .45rem 0 rgba(29,42,77,.12)}
.act-card b{font-size:1.7rem}.act-card span{font-size:1.15rem}.act-ic{width:6.4rem;height:6.4rem;object-fit:contain}.act-emo{font-size:4.4rem;line-height:1.1}
.act-ok{position:absolute;top:.6rem;right:.8rem;background:var(--green);color:#fff;border-radius:50%;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;font-weight:800}
/* Laboratuvar */
.lab-scr{background:linear-gradient(160deg,#EEF5FF,#F6F1FF)}
.lab-stage{flex:1.1;display:flex;align-items:center;justify-content:center;position:relative;min-width:0;padding:1rem;overflow:hidden}
.lab-svg{width:100%;height:100%;max-height:52vh}
.lab-shelf{display:flex;flex-wrap:wrap;gap:.7rem}
.lab-ing{display:flex;align-items:center;gap:.5rem;background:#fff;border-radius:1.2rem;padding:.55rem .9rem;font-weight:800;font-size:1.15rem;box-shadow:0 .3rem 0 #D5DCEB}.lab-ing span{font-size:1.9rem}
.lab-dot{width:1.8rem;height:1.8rem;border-radius:50%;border:.15rem solid #1D2A4D;display:inline-block}
.lab-fact{background:#FFF8E1;border-left:.4rem solid #E0A400;border-radius:1rem;padding:.8rem 1rem;font-size:1.1rem;line-height:1.4}
.lab-safe{margin:0 2.2rem 1.2rem;background:#fff;border-radius:1rem;padding:.6rem 1rem;font-size:1.05rem;font-weight:600;color:var(--ink2)}
.lab-q{display:flex;flex-direction:column;gap:.6rem;background:#fff;border-radius:1.2rem;padding:1rem;font-size:1.3rem}
.lab-pour{position:absolute;top:8%;left:50%;font-size:4.4rem;animation:pour .65s ease-in-out}
.lab-stir{position:absolute;top:30%;left:46%;font-size:3.6rem;animation:wiggle .4s linear 4}
@keyframes pour{0%{transform:translate(-10%,-30px) rotate(0)}50%{transform:translate(-10%,0) rotate(-70deg)}100%{transform:translate(-10%,-20px) rotate(-10deg);opacity:0}}
.lab-erupt circle{animation:erupt 1.4s ease-out infinite;transform-box:fill-box}
@keyframes erupt{0%{transform:translate(0,0) scale(.4);opacity:1}100%{transform:translate(var(--dx),var(--dy)) scale(1.1);opacity:0}}
.lab-lava{animation:grow 1.2s ease-out both;transform-origin:150px 64px}
.lab-foam{animation:pop .6s ease-out both}
.lab-swirl{animation:swirl 2.4s ease-in-out infinite alternate}
@keyframes swirl{0%{transform:scale(.4) rotate(0)}100%{transform:scale(1.25) rotate(160deg)}}
/* Bahçe */
.gd-scr{background:linear-gradient(170deg,#EFF9E8,#E6F4FF)}
.gd-stage{flex:1;padding:.4rem;overflow:hidden;min-height:0;display:flex}.gd-svg{width:100%;height:100%}
.gd-spot{cursor:pointer}.gd-sun{animation:twinkle 1s ease-in-out 2}
.gd-tools{display:flex;gap:.5rem;flex-wrap:wrap}
.gd-tool{display:flex;flex-direction:column;align-items:center;gap:.1rem;background:#fff;border-radius:1rem;padding:.4rem .7rem;font-weight:800;font-size:1rem;box-shadow:0 .3rem 0 #D5DCEB;min-width:6.2rem}
.gd-tool span{font-size:2rem;height:2.6rem;display:flex;align-items:center}.gd-tool img{width:2.6rem;height:2.6rem;object-fit:contain}
.gd-tool.on{background:#FFF1C2;box-shadow:inset 0 0 0 .2rem #E0A400}
.gd-step{background:#2E7D4F;color:#fff;border-radius:1rem;padding:.8rem 1rem;font-size:1.25rem;font-weight:700}
.gd-meter{display:flex;align-items:center;gap:.6rem;font-weight:800;font-size:1.1rem}.gd-meter div{flex:1;height:1rem;background:#E3E8F2;border-radius:1rem;overflow:hidden}.gd-meter i{display:block;height:100%;transition:width .6s}
.gd-harv{margin:0 2.2rem 1.4rem;display:flex;gap:1rem;flex-wrap:wrap;font-weight:800;font-size:1.3rem}
.orch{position:relative;display:flex;flex-direction:column;background:linear-gradient(#DDF1FF 0 60%,#BDE5A4 60%);overflow:hidden}
.orch-tree{position:relative;flex:1;display:flex;justify-content:center}.orch-tree img{height:100%;max-height:34vh;object-fit:contain}
.orch-fr{position:absolute;inset:0 22%}
.orch-it{position:absolute;font-size:2.6rem;background:rgba(255,255,255,.55);border-radius:50%;width:4rem;height:4rem;display:flex;align-items:center;justify-content:center}
.orch-it.g{position:static}.orch-it.on{box-shadow:0 0 0 .3rem #FFC93C;background:#fff;transform:scale(1.15)}.orch-it.done{visibility:hidden}
.orch-ground{display:flex;justify-content:center;gap:1rem;padding:1rem;flex-wrap:wrap}
.orch-bask{flex:1;display:flex;flex-direction:column;align-items:center;background:#fff;border-radius:1.2rem;padding:.6rem;box-shadow:0 .35rem 0 #D5DCEB;min-height:12rem}.orch-bask img{width:6rem}.orch-bask b{font-size:1.2rem}.orch-bask span{font-size:1.6rem;word-break:break-all}
/* Ejderha */
.race-scr{background:linear-gradient(170deg,#F1FAEE,#E7F3FF)}
.race-intro{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7rem;padding:0 2rem 1.4rem;font-size:1.3rem;text-align:center}
.race-intro p{margin:0;max-width:44rem;font-weight:600}.race-hero{display:flex;align-items:flex-end;gap:2rem}.race-dr-big{width:10rem;transform:scaleX(1);filter:hue-rotate(-95deg) saturate(1.3)}
.race-track{position:relative;height:30vh;margin:0 2rem;overflow:hidden;padding:0}
.race-bg{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 9rem,rgba(59,178,115,.18) 9rem 9.6rem),linear-gradient(#D9F0FF,#EAF7FF 60%,#BFE3A6 60%);animation:scroll 3s linear infinite}
@keyframes scroll{to{background-position:-9.6rem 0,0 0}}
.race-road{position:absolute;left:0;right:0;bottom:12%;height:22%;background:#C9B79A;border-top:.3rem dashed #fff}
.race-flag{position:absolute;right:1%;bottom:18%;height:55%}
.race-run{position:absolute;bottom:16%;transition:left .5s ease-out;animation:hop .5s ease-in-out infinite}.race-run.dash{animation:dash .5s ease-out,hop .5s ease-in-out infinite}
@keyframes dash{0%{filter:drop-shadow(-1rem 0 0 rgba(255,201,60,.8))}100%{filter:none}}
.race-dr{position:absolute;bottom:14%;height:52%;transition:left .2s linear;filter:hue-rotate(-95deg) saturate(1.3);animation:hop .7s ease-in-out infinite}
.race-dr.near{animation:hop .35s ease-in-out infinite}.race-dr.hug{animation:wiggle .3s linear 6}
.race-gap{position:absolute;top:.6rem;left:50%;transform:translateX(-50%);font-weight:800;color:#E5532F;font-size:1.3rem}
.race-q{margin:1rem 2rem 1.4rem;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;padding:1rem;min-height:0}
.race-prompt{font-size:2rem;font-weight:800;text-align:center}.race-vis{max-height:12vh;display:flex;justify-content:center;transform:scale(.85)}.race-vis svg{max-height:12vh}
.race-opts{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}
.race-opt{min-width:9rem;padding:.8rem 1.4rem;border-radius:1.2rem;background:#F1F5FC;font-size:1.8rem;font-weight:800;box-shadow:0 .35rem 0 #D5DCEB}.race-opt.ok{background:#3BB273;color:#fff}.race-opt.bad{background:#FF7A59;color:#fff}
.race-end{display:flex;align-items:center;gap:1.4rem}.race-end img{width:9rem}.race-end h2{margin:0;font-size:2.2rem}.race-end p{margin:.3rem 0 .8rem;font-size:1.3rem}
/* Spor */
.sp-scr{background:linear-gradient(160deg,#FFF4EC,#EAF6FF)}
.sp-stage{flex:1;display:flex;align-items:flex-end;justify-content:center;padding:1rem;min-height:0;background:radial-gradient(circle at 50% 85%,#DFF1FF,#fff 70%)}
.sp-coach{max-width:100%;object-fit:contain;transition:transform .15s}.sp-coach.beat{animation:pop .25s ease-out}.sp-coach.rest{opacity:.85}
.sp-lbl{font-size:1.4rem}.sp-moves{display:flex;flex-wrap:wrap;gap:.4rem}.sp-moves span{background:#fff;border-radius:1rem;padding:.3rem .7rem;font-weight:700;font-size:1.05rem}
.sp-ring{position:relative;width:13rem;height:13rem}.sp-ring svg{width:100%;height:100%}.sp-ring b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:4rem}
#ring{transition:stroke-dashoffset .1s linear}
.sp-cue{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.2rem}.sp-cue b{font-size:2.2rem}.sp-cue span{font-size:1.3rem}
.sp-next{font-size:1.3rem;color:var(--ink2)}
.sp-prog{height:.8rem;margin:0 2rem 1rem;background:#E3E8F2;border-radius:1rem;overflow:hidden}.sp-prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,#2BB673,#4DA3FF);transition:width .1s linear}
/* Giydirme */
.dress-scr{background:linear-gradient(160deg,#F3F0FF,#EAF4FF)}
.doll{position:relative;height:100%;max-width:100%}.doll img{position:absolute;display:block}.doll .doll-body{position:relative;width:100%;height:100%;object-fit:contain}
.doll.mini{height:34vh}.doll.tall{height:100%}
.dress-stage{width:26rem;display:flex;align-items:center;justify-content:center;padding:6% 0 1%;background:radial-gradient(ellipse at 50% 92%,#D8E1F0 0 22%,transparent 23%),#fff;border-radius:2rem}
.dress-pick{display:flex;flex-direction:column;align-items:center;gap:.4rem;background:#fff;border-radius:2rem;padding:1.6rem 2rem 1rem;box-shadow:0 .4rem 0 #D5DCEB}.dress-pick.on{box-shadow:0 0 0 .3rem var(--grape),0 .4rem 0 #C6B2F5}.dress-pick b{font-size:1.6rem}
.dress-grid2{display:grid;grid-template-columns:repeat(auto-fill,minmax(9rem,1fr));gap:.7rem;align-content:start;flex:1;min-height:0}
.dress-it{display:flex;flex-direction:column;align-items:center;gap:.2rem;background:#F4F6FB;border-radius:1rem;padding:.6rem;font-weight:800;font-size:1rem}.dress-it img{height:6rem;max-width:100%;object-fit:contain}
.dress-it.on{background:#EFE7FF;box-shadow:inset 0 0 0 .2rem var(--grape)}
/* Görüntülü arama öncesi */
.vc-pre{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;color:#fff}
.vc-name{font-size:2.6rem}.vc-sub2{font-size:1.3rem;opacity:.8}
.vc-act{display:flex;flex-direction:column;align-items:center;gap:.3rem;font-weight:700}
.vc-round{width:6rem;height:6rem;border-radius:50%;font-size:2.4rem;color:#fff;display:flex;align-items:center;justify-content:center}
.vc-round.red{background:#FF5B5B;transform:rotate(135deg)}.vc-round.green{background:#2BB673}
.vc-round.pulse{animation:vcpulse 1.4s ease-out infinite}
@keyframes vcpulse{0%{box-shadow:0 0 0 0 rgba(43,182,115,.6)}100%{box-shadow:0 0 0 1.6rem rgba(43,182,115,0)}}
.vc-helper.idle{animation:none;opacity:.95}
.vc-helper.calling{animation:ring 1s ease-in-out infinite;filter:blur(1.5px) brightness(.85)}
.vc-helper.connect{animation:pop .5s ease-out}
.vc-helper{position:relative}.vc-ringtxt{position:absolute;left:0;right:0;bottom:-2.6rem;text-align:center;color:#fff;font-weight:800;font-size:1.4rem;animation:twinkle 1.2s ease-in-out infinite}
/* Zamanlayıcı */
.slchip{position:fixed;right:1rem;bottom:1rem;z-index:40;background:rgba(29,42,77,.85);color:#fff;border-radius:1.4rem;padding:.35rem .9rem;font-size:1.05rem;pointer-events:none}.slchip.warn{background:#E5532F}
.sl-count{display:flex;align-items:baseline;gap:.6rem;font-size:1.5rem;font-weight:700}.sl-count b{font-size:3rem}
.lab-lava{transform-box:view-box}
.gd-tools{flex-wrap:nowrap}.gd-tool{min-width:0;flex:1;font-size:.9rem;padding:.35rem .3rem}
.orch{background:linear-gradient(#DDF1FF 0 62%,#BDE5A4 62%)}.orch-tree{flex:1.6}.orch-ground{flex:1;align-items:center}
.dress-stage{background:radial-gradient(ellipse 34% 4% at 50% 97%,#DDE4F0 0 98%,transparent 100%),#fff}
.vc-self{top:1rem;bottom:auto}.vc-pre .chip{color:var(--navy)}
.race-run svg{width:7.5rem;height:7.5rem}
.crep{border-bottom:.1rem solid #EEF1F6;padding:.35rem 0}.crep summary{cursor:pointer;font-size:.95rem}

/* ================= 7 yaş üstü: zarif, sade tema (okul öncesi eski tasarımı korur) ================= */
.ic3d{display:none}
body:not(.g-pre){--shadow:#DCE3EF;background:#F3F6FB}
body:not(.g-pre):not(.font-atkinson),body:not(.g-pre):not(.font-atkinson) button,body:not(.g-pre):not(.font-atkinson) input,body:not(.g-pre):not(.font-atkinson) textarea{font-family:'Lexend','Baloo 2',system-ui,sans-serif}
body:not(.g-pre) .cloud,body:not(.g-pre) .hills{display:none}
body:not(.g-pre) .home-scr{background:radial-gradient(1200px 500px at 85% -10%,#E3EEFF 0,transparent 60%),radial-gradient(900px 500px at -10% 110%,#E9F7EF 0,transparent 60%),#F5F7FB}
body:not(.g-pre) .top{padding:1.2rem 2.2rem}
body:not(.g-pre) .top h1{font-size:2rem;font-weight:700;letter-spacing:-.01em}
body:not(.g-pre) .round{width:3.9rem;height:3.9rem;box-shadow:0 .15rem .5rem rgba(29,42,77,.10);border:.1rem solid #E6EBF3}
body:not(.g-pre) .round svg{width:2rem;height:2rem}
body:not(.g-pre) .pill,body:not(.g-pre) .lockbtn{box-shadow:0 .15rem .5rem rgba(29,42,77,.08);border:.1rem solid #E6EBF3;font-weight:600}
body:not(.g-pre) .pill{font-size:1.3rem;padding:.45rem 1rem}
body:not(.g-pre) .btn{border-radius:1.2rem;font-size:1.55rem;font-weight:600;padding:.85rem 1.9rem;box-shadow:0 .5rem 1.2rem rgba(45,127,249,.28)}
body:not(.g-pre) .btn:active{transform:translateY(.1rem);box-shadow:0 .2rem .6rem rgba(45,127,249,.25)}
body:not(.g-pre) .btn.green{box-shadow:0 .5rem 1.2rem rgba(59,178,115,.28)}
body:not(.g-pre) .btn.grape{box-shadow:0 .5rem 1.2rem rgba(142,92,247,.28)}
body:not(.g-pre) .btn.small{font-size:1.2rem;padding:.55rem 1.2rem}
body:not(.g-pre) .card{border-radius:1.6rem;box-shadow:0 .3rem 1.4rem rgba(29,42,77,.07);border:.1rem solid #E9EEF5}
body:not(.g-pre) .bubble{border-radius:1.2rem;font-size:1.35rem;font-weight:500;box-shadow:0 .2rem .8rem rgba(29,42,77,.07);border:.1rem solid #E9EEF5}
body:not(.g-pre) .mode{border-radius:1.6rem;box-shadow:0 .3rem 1.2rem rgba(29,42,77,.07)!important;border:.1rem solid rgba(29,42,77,.06);padding:1.3rem}
body:not(.g-pre) .mode:hover{box-shadow:0 .6rem 1.8rem rgba(29,42,77,.12)!important}
body:not(.g-pre) .mode b{font-size:1.75rem;font-weight:700;letter-spacing:-.01em}
body:not(.g-pre) .mode span{font-size:1.1rem;font-weight:400;color:#53607E}
body:not(.g-pre) .mode .say{background:rgba(255,255,255,.75);width:2.3rem;height:2.3rem}
body:not(.g-pre) .modes .mode .ic{display:none}
body:not(.g-pre) .modes .mode .ic3d{display:block;width:6rem;height:6rem;object-fit:contain;filter:drop-shadow(0 .5rem .6rem rgba(29,42,77,.15));margin-bottom:.3rem}
body:not(.g-pre) .modes .mode.chat .ic3d{width:10rem;height:10rem}
body:not(.g-pre) .home-left .big{box-shadow:0 .6rem 2rem rgba(29,42,77,.10);border:.1rem solid #E6EBF3}
body:not(.g-pre) .quest{border-radius:1rem;box-shadow:0 .15rem .6rem rgba(29,42,77,.06);border:.1rem solid #E9EEF5}
body:not(.g-pre) .quest .qt b{font-weight:600;font-size:.98rem}
body:not(.g-pre) .quickbar button{box-shadow:0 .15rem .5rem rgba(29,42,77,.08);border:.1rem solid #E6EBF3;font-weight:600;border-radius:.9rem}
body:not(.g-pre) .tabs2{box-shadow:0 .15rem .6rem rgba(29,42,77,.08);border:.1rem solid #E6EBF3}
body:not(.g-pre) .tabs2 button{font-size:1.3rem;font-weight:600;padding:.5rem 1.3rem}
body:not(.g-pre) .tabs2 button.on{background:var(--navy);color:#fff}
body:not(.g-pre) .chip{border-width:.12rem;border-color:#E3E8F2;background:#fff;font-weight:600}
body:not(.g-pre) .chip.on,body:not(.g-pre) .seg .chip.on{background:var(--navy);border-color:var(--navy);color:#fff}
body:not(.g-pre) .fun-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
body:not(.g-pre) .fun-grid .mode{min-height:11rem}
body:not(.g-pre) .lab-ing,body:not(.g-pre) .gd-tool,body:not(.g-pre) .race-opt,body:not(.g-pre) .dress-it,body:not(.g-pre) .orch-bask{box-shadow:0 .15rem .6rem rgba(29,42,77,.08);border:.1rem solid #E6EBF3;font-weight:600}
body:not(.g-pre) .act-card{box-shadow:0 .3rem 1.2rem rgba(29,42,77,.07)!important}
body:not(.g-pre) .gd-step{font-weight:500}
body:not(.g-pre) .race-prompt{font-weight:600}
body:not(.g-pre) .vc-moods button{font-weight:600}
.quickbar button img{width:2rem;height:2rem;object-fit:contain}
.quickbar .qb-av{width:2rem;height:2rem;display:flex;align-items:center;justify-content:center}.quickbar .qb-av svg{width:2.2rem;height:2.2rem}

/* ================= Okuma Atölyesi ================= */
.ok-scr{background:#FFF8EA!important}
.ok-scr.ok-font-lexend,.ok-scr.ok-font-lexend button{font-family:'Lexend',sans-serif}.ok-scr.ok-font-atkinson,.ok-scr.ok-font-atkinson button{font-family:'Atkinson Hyperlegible',sans-serif}
.ok-scr .ok-prompt,.ok-scr .ok-opt,.ok-scr .ok-read,.ok-scr .bubble{letter-spacing:.04em;word-spacing:.18em}
body.dys-all,body.dys-all button{letter-spacing:.03em;word-spacing:.12em}body.dys-all .bubble{line-height:1.6}
.ok-hub{flex:1;display:flex;gap:1.2rem;padding:0 2rem 1.4rem;min-height:0}
.ok-plan{width:24rem;display:flex;flex-direction:column;gap:.6rem;padding:1.2rem}.ok-plan>b{font-size:1.5rem}
.ok-steps{display:flex;flex-direction:column;gap:.5rem}
.ok-step{display:flex;align-items:center;gap:.7rem;background:#F6F1E4;border-radius:1rem;padding:.5rem .8rem;font-size:1.15rem;font-weight:600;text-align:left}.ok-step img{width:2.8rem;height:2.8rem;object-fit:contain}.ok-step em{margin-left:auto;color:#2BB673;font-style:normal;font-weight:800}.ok-step.done{background:#E3F6E9}
.ok-grid{flex:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;align-content:center}
.ok-tile{align-items:center;text-align:center;justify-content:center;min-height:11rem}.ok-tile b{font-size:1.4rem!important}.ok-tile span{font-size:1rem!important}
.ok-menu{flex:1;display:flex;gap:1.6rem;align-items:center;justify-content:center;padding:0 2rem 2rem}.ok-menu .ok-tile{width:22rem;min-height:15rem;background:#fff}
.ok-big{font-size:3.4rem!important;font-weight:700;color:var(--navy)!important;letter-spacing:.08em}
.ok-q{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:0 2rem 1.6rem;min-height:0}
.ok-prog{display:flex;gap:.4rem}.ok-prog i{width:2.2rem;height:.5rem;border-radius:1rem;background:#E8E1D0}.ok-prog i.d{background:#2BB673}.ok-prog i.c{background:#E0A400}
.ok-prompt{font-size:2rem;font-weight:600;text-align:center;line-height:1.4;max-width:60rem}
.ok-say{font-size:1.6rem;background:#fff;border-radius:50%;width:3rem;height:3rem;box-shadow:0 .15rem .5rem rgba(0,0,0,.08)}
.ok-vis{display:flex;align-items:center;gap:1.2rem}
.ok-emo{font-size:5rem;line-height:1}.ok-emo.s{font-size:3.6rem}
.ok-opts{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}
.ok-opt{min-width:9rem;min-height:7rem;padding:.8rem 1.4rem;border-radius:1.4rem;background:#fff;font-size:1.8rem;font-weight:600;box-shadow:0 .2rem .8rem rgba(0,0,0,.08);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;border:.2rem solid transparent}
.ok-opts.big .ok-opt{font-size:3rem;min-width:10rem}.ok-opt small{font-size:1.1rem;color:#53607E}
.ok-opt.good{border-color:#2BB673;background:#E3F6E9}.ok-opt.bad{border-color:#E5532F;background:#FDECE7;opacity:.7}
.ok-fb{min-height:2.2rem;font-size:1.4rem;font-weight:600;color:#53607E;text-align:center;max-width:56rem}
.ok-syl{display:flex;gap:.3rem;align-items:center}.ok-syl span{font-size:3rem;font-weight:700;padding:.3rem 1rem;border-radius:1rem;background:#FFE0B2;letter-spacing:.06em}.ok-syl span.h1{background:#C8E6FF}.ok-syl b{font-size:2rem;color:#9AA6BF}
.ok-syl.xl span{font-size:5rem}
.ok-letter{font-size:6rem;font-weight:700;letter-spacing:.1em;color:var(--navy)}.ok-letter.xl{font-size:10rem;line-height:1}.ok-letter span{color:#2D7FF9;margin-left:.5rem}
.ok-word{font-size:3.6rem;font-weight:700;letter-spacing:.12em}
.ok-letters{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.2rem;padding:0 2rem 2rem}
.ok-lgrid{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}
.ok-lcard{width:9rem;height:10rem;border-radius:1.4rem;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 .2rem .8rem rgba(0,0,0,.08)}.ok-lcard b{font-size:3.4rem;letter-spacing:.08em}.ok-lcard span{font-size:2.2rem}.ok-lcard.k{box-shadow:inset 0 0 0 .2rem #2BB673}
.ok-lshow{width:24rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;padding:1rem;text-align:center}.ok-lshow b{font-size:2rem}
.ok-trace{flex:1;display:flex;flex-direction:column;align-items:center;gap:.6rem;padding:1rem;min-height:0}.ok-trace canvas{flex:1;min-height:0;max-width:100%;aspect-ratio:1;background:#fff;border-radius:1rem;touch-action:none;border:.15rem solid #EEE6D2}
.ok-read{flex:1.4;padding:1.4rem 2rem;font-size:2rem;line-height:1.9}.ok-read h3{margin:0 0 .6rem;font-size:1.8rem}.ok-read p{margin:.2rem 0;padding:.1rem .6rem;border-radius:.6rem;transition:background .3s}.ok-read p.on{background:#FFF0B3}
.ok-words span{cursor:pointer;border-radius:.4rem;padding:0 .1rem}.ok-words span.rd{background:#DDF3E4}
.ok-side{flex:1;display:flex;flex-direction:column;gap:1rem;justify-content:center;min-width:0}
.ok-tabs{display:flex;gap:.4rem}.ok-tabs span{flex:1;text-align:center;padding:.4rem;border-radius:.8rem;background:#F0EADA;font-weight:600;font-size:1rem}.ok-tabs span.on{background:var(--navy);color:#fff}.ok-tabs span.d{background:#DDF3E4}
.ok-ctl{display:flex;flex-direction:column;gap:.7rem;align-items:center}
.ok-timer{font-size:4rem;font-weight:700}
.ok-score{display:flex;flex-direction:column;align-items:center}.ok-score b{font-size:4.4rem;line-height:1}.ok-score span{font-size:1.2rem}
.ok-bars,.ok-pbars{display:flex;gap:.4rem;align-items:flex-end;height:6rem;width:100%;max-width:22rem}.ok-bars i{flex:1;background:#2BB673;border-radius:.3rem .3rem 0 0}
.ok-pbars{height:9rem;max-width:none}.ok-pbars div{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}.ok-pbars i{width:70%;background:#2D7FF9;border-radius:.3rem .3rem 0 0}.ok-pbars small{font-size:.75rem}
.ok-done{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;text-align:center;padding:0 2rem 2rem;margin:0 auto}.ok-done img{width:9rem}.ok-done h2{margin:0;font-size:2.6rem}.ok-done p{margin:0;font-size:1.4rem;max-width:44rem}
.ok-slots{display:flex;gap:.5rem}.ok-slots span{width:4.4rem;height:5rem;border-bottom:.3rem solid var(--navy);font-size:3.4rem;font-weight:700;text-align:center}
.ok-tiles{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center}.ok-tile2{width:4.6rem;height:4.6rem;border-radius:1rem;background:#fff;font-size:2.6rem;font-weight:700;box-shadow:0 .2rem .6rem rgba(0,0,0,.1)}.ok-tile2[disabled]{opacity:.3}
.ok-ran{display:grid;grid-template-columns:repeat(5,4.6rem);gap:1.2rem 2rem;padding:1rem}.ok-ran i{width:4.6rem;height:4.6rem;border-radius:50%}

/* ================= Kukla Gösterisi ================= */
.kk-scr{background:linear-gradient(160deg,#FFF1E6,#F1EBFF)}
.kk-sub{display:flex;align-items:center;gap:1rem;padding:0 2.2rem .8rem;font-size:1.3rem;font-weight:600}.kk-sub span{flex:1}
.kk-grid{flex:1;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:.8rem;padding:0 2.2rem 1.4rem;align-content:start}
.kk-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:.2rem;background:#fff;border-radius:1.2rem;padding:.6rem .3rem;box-shadow:0 .2rem .8rem rgba(29,42,77,.08);border:.12rem solid transparent}
.kk-card img{height:9.5rem;max-width:100%;object-fit:contain;transition:transform .2s}.kk-card b{font-size:1.05rem;text-align:center}
.kk-card.on{border-color:var(--grape);background:#F4EEFF}.kk-card.on img{transform:translateY(-.4rem) scale(1.05)}
.kk-card i{position:absolute;top:.4rem;right:.5rem;background:var(--grape);color:#fff;border-radius:50%;width:1.9rem;height:1.9rem;display:flex;align-items:center;justify-content:center;font-style:normal;font-weight:800}
.kk-cast{display:flex;justify-content:center;gap:1rem;padding:0 2rem}.kk-cast img{height:9rem}
.kk-bob{animation:hop .8s ease-in-out infinite}.kk-bob:nth-child(2){animation-delay:.2s}.kk-bob:nth-child(3){animation-delay:.4s}
.kk-topics{flex:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;padding:1rem 2.2rem 1.4rem;align-content:start}
.kk-topic{display:flex;align-items:center;gap:.6rem;background:#fff;border-radius:1.2rem;padding:.9rem 1rem;font-size:1.25rem;font-weight:700;text-align:left;box-shadow:0 .2rem .8rem rgba(29,42,77,.08)}
.kk-topic span{font-size:2rem}.kk-topic.own{grid-column:span 2}.kk-topic.own input{flex:1;border:0;font-size:1.2rem;background:#F4F6FB;border-radius:.8rem;padding:.5rem .8rem;min-width:0}.kk-topic.own button{font-size:1.4rem;background:var(--green);color:#fff;border-radius:.8rem;width:2.8rem;height:2.6rem}
.kk-mini{display:flex}.kk-mini img{height:3rem;margin-right:-.6rem}
.kk-show{background:#2A1A12}
.kk-title{color:#FFE7B3!important}
.kk-stage{position:absolute;inset:0;overflow:hidden}
.kk-bg{position:absolute;left:4%;right:4%;top:9%;bottom:16%;border-radius:1rem;transition:background .8s;display:flex;align-items:flex-start;justify-content:center;overflow:hidden}
.kk-bg span{font-size:4rem;letter-spacing:3rem;opacity:.55;margin-top:2rem;white-space:nowrap}
.kk-front{position:absolute;left:0;right:0;bottom:0;height:24%;background:linear-gradient(#B5482E,#7A2A18);border-top:.5rem solid #E2A83B;box-shadow:0 -.6rem 1.4rem rgba(0,0,0,.35);z-index:5}
.kk-pp{position:absolute;bottom:14%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;z-index:4;animation:kkrise .9s ease-out both}
.kk-pp img{height:44vh;transition:transform .25s}.kk-pp.flip img{transform:scaleX(-1)}
.kk-pp b{position:absolute;bottom:-3.6rem;color:#FFE7B3;font-size:1.2rem;z-index:6;text-shadow:0 .1rem .3rem #000}
@keyframes kkrise{from{transform:translate(-50%,60%)}to{transform:translate(-50%,0)}}
.kk-pp.talk img{animation:kktalk .38s ease-in-out infinite}
.kk-pp.flip.talk img{animation:kktalkf .38s ease-in-out infinite}
@keyframes kktalk{0%,100%{transform:rotate(0) translateY(0)}50%{transform:rotate(-3deg) translateY(-.6rem)}}
@keyframes kktalkf{0%,100%{transform:scaleX(-1) rotate(0) translateY(0)}50%{transform:scaleX(-1) rotate(-3deg) translateY(-.6rem)}}
.kk-pp.jump{animation:kkjump .6s ease-out}
@keyframes kkjump{0%,100%{transform:translate(-50%,0)}40%{transform:translate(-50%,-14%)}}
.kk-pp.bow img{transform:rotate(14deg) translateY(.6rem)}.kk-pp.flip.bow img{transform:scaleX(-1) rotate(14deg) translateY(.6rem)}
.kk-pp.shake{animation:wiggle .3s linear 3}
.kk-pp.wave img{animation:kkwave .5s ease-in-out 3}
@keyframes kkwave{0%,100%{rotate:0deg}50%{rotate:8deg}}
.kk-say{position:absolute;bottom:100%;margin-bottom:.6rem;width:max-content;max-width:30vw;background:#fff;border-radius:1.2rem;padding:.7rem 1rem;font-size:1.25rem;font-weight:600;line-height:1.35;box-shadow:0 .4rem 1rem rgba(0,0,0,.3);opacity:0;transform:translateY(.6rem);transition:.25s;z-index:7}
.kk-say.on{opacity:1;transform:none}
.kk-say::after{content:'';position:absolute;top:100%;left:50%;border:.7rem solid transparent;border-top-color:#fff;transform:translateX(-50%)}
.kk-cur{position:absolute;top:0;bottom:0;width:51%;z-index:20;background:repeating-linear-gradient(90deg,#B3261E 0 2.2rem,#8E1B15 2.2rem 4.4rem);box-shadow:inset 0 -2rem 2rem rgba(0,0,0,.25);transition:transform 1.2s ease-in-out}
.kk-cur.l{left:0;transform-origin:left}.kk-cur.r{right:0;transform-origin:right}
.kk-cur.l.open{transform:translateX(-88%)}.kk-cur.r.open{transform:translateX(88%)}
.kk-end{position:absolute;inset:0;z-index:25;display:flex;align-items:center;justify-content:center}
.kk-endc{display:flex;align-items:center;gap:1.4rem;background:#fff;border-radius:1.6rem;padding:1.6rem 2rem;max-width:44rem}.kk-endc img{width:8rem}.kk-endc h2{margin:0;font-size:2.2rem}.kk-endc p{font-size:1.3rem;margin:.4rem 0 .8rem}

/* ================= Dikey (portre) tablet düzeni ================= */
@media (orientation:portrait) and (min-width:561px){
  .lay-row{flex-direction:column!important}
  .lay-row>*{width:auto!important;max-width:none!important}
  .home-body{flex-direction:column;gap:1rem;padding:.2rem 1.6rem 1.4rem}
  .home-left{width:auto;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem;padding-top:0}
  .home-left .big,body:not(.g-pre) .home-left .big{width:9rem;height:9rem;margin-top:0}.home-left .big svg{width:8rem;height:8rem}
  .home-left .quickbar{flex-direction:row;flex-wrap:nowrap}
  .modes,body:not(.g-pre) .modes{grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-rows:none;grid-auto-rows:minmax(0,1fr)}
  .modes .mode.chat,.modes .mode.wide{grid-row:auto!important}
  .chat-body{flex-direction:column;padding:0 1.6rem}.chat-av{width:auto;flex-direction:row;padding:1rem;border-radius:1.6rem}.chat-av svg.av-svg{width:8rem;height:8rem}
  .fun-grid,body:not(.g-pre) .fun-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .act-grid3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kk-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.kk-topics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .av-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dress-stage{width:auto;height:46vh}
  .kk-pp img{height:30vh}.kk-say{max-width:44vw}
  .gd-stage{min-height:34vh}
  .sp-stage{min-height:40vh}
  .race-track{height:22vh}
}
/* Arkadaş seçimi: ses ve başla düğmeleri sol üstte kare öbek */
.av-main{margin-left:17rem}.av-main .av-grid{width:min(60rem,calc(100vw - 22rem))}
.av-ctrl{position:absolute;top:1.4rem;left:1.4rem;z-index:3;width:15rem;display:grid;gap:.6rem;background:#fff;border-radius:1.6rem;padding:.9rem;box-shadow:0 .4rem 1.4rem rgba(29,42,77,.12)}
.av-ctrl>b{font-size:1.05rem;text-align:center;line-height:1.2}
.av-ctrl-g{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.av-sq{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;border-radius:1.1rem;background:#F3F6FB;border:.2rem solid transparent;font-weight:800;font-size:1rem;color:var(--navy)}
.av-sq span{font-size:2.2rem;line-height:1}.av-sq.on{background:var(--c);color:#fff;border-color:var(--c);box-shadow:0 .3rem .8rem rgba(29,42,77,.18)}
.av-go{aspect-ratio:2/1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;border-radius:1.1rem;background:var(--blue);color:#fff;font-weight:800;font-size:1.1rem;box-shadow:0 .35rem 0 #1F5FC2;text-align:center;line-height:1.15;padding:.4rem}
.av-go:active{transform:translateY(.15rem);box-shadow:0 .15rem 0 #1F5FC2}
@media (orientation:portrait) and (min-width:561px){.av-main{margin-left:0;padding-top:17.5rem!important}.av-main .av-grid{width:92vw}}
@media (max-height:520px){.av-ctrl{width:11rem;padding:.6rem;top:.8rem;left:.8rem}.av-sq span{font-size:1.6rem}.av-main{margin-left:12.5rem}.av-main .av-grid{width:calc(100vw - 15rem)}}
.av-card b{font-size:1.47rem}.av-card span{font-size:.85rem}.av-card .badge{font-size:.8rem}
/* Arkadaş kartları kalan alanın ortasında; son satır da ortalı */
.av-main{position:absolute!important;top:0;bottom:0;right:0;left:17rem;margin-left:0!important;justify-content:center;padding:1.2rem 1.6rem!important}
.av-main .av-grid{display:flex;flex-wrap:wrap;justify-content:center;width:100%;max-width:62rem}
.av-main .av-grid>.av-card{flex:0 0 calc((100% - 2.6rem)/3)}
@media (orientation:portrait) and (min-width:561px){.av-main{left:0;top:15rem}.av-main .av-grid>.av-card{flex-basis:calc((100% - 1.3rem)/2)}}
@media (max-height:520px){.av-main{left:12.5rem}}
/* Ses ve başla kutusu: sol şeridin dikeyde ortasında */
.av-ctrl{top:50%;transform:translateY(-50%)}
@media (orientation:portrait) and (min-width:561px){.av-ctrl{top:1.4rem;left:50%;transform:translateX(-50%)}}
/* Ebeveyn menüsü: dar, sıkı, düz yazı */
.parent .side{width:12.5rem;gap:0;padding:.8rem .5rem;overflow-y:auto;flex-shrink:0;font-family:Tahoma,Verdana,'Segoe UI',sans-serif}
.parent .side button{font-family:Tahoma,Verdana,'Segoe UI',sans-serif;font-size:.88rem;font-weight:600;padding:.42rem .6rem;border-radius:.5rem;line-height:1.2;text-transform:none;letter-spacing:0;min-height:0;box-shadow:none}
.parent .side>.row{padding:0 .3rem .5rem!important}
.parent .side>.row svg{width:38px;height:38px}
.parent .side>.row>div>div:first-child{font-family:Tahoma,Verdana,sans-serif!important;font-size:1.05rem!important}
.parent .side>div[style*="margin-top:auto"]{font-size:.72rem!important;padding-top:.5rem!important}
.parent .side button[data-a="kid"]{text-align:center;margin-top:.3rem!important}
/* Ana ekran: avatar köşesinde profil, büyük görüntülü sohbet ve günlük */
.av-holder{position:relative;display:inline-block}
.av-prof{position:absolute;top:.6rem;right:-.8rem;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;width:4.4rem;height:4.4rem;border-radius:50%;background:var(--blue,#3B7BF6);color:#fff;border:.25rem solid #fff;box-shadow:0 .3rem .8rem rgba(29,42,77,.25);font-size:.7rem;font-weight:800;line-height:1}
.av-prof svg{width:1.7rem;height:1.7rem}
.quickbar .qb-big{flex:1 1 0;min-width:7.6rem;flex-direction:row;gap:.5rem;padding:.7rem .9rem;font-size:1.15rem;border-radius:1.2rem;line-height:1.15;text-align:left}
.quickbar .qb-big img{width:2.8rem;height:2.8rem;flex-shrink:0}
@media (max-height:620px),(max-width:900px){.quickbar .qb-big{min-width:6rem;padding:.5rem .6rem;font-size:.95rem}.quickbar .qb-big img{width:2.1rem;height:2.1rem}.av-prof{width:3.6rem;height:3.6rem;font-size:.6rem}.av-prof svg{width:1.4rem;height:1.4rem}}
.home-left .quickbar{width:100%}
.quickbar .qb-big{flex:0 0 100%;justify-content:flex-start;white-space:nowrap}
@media (orientation:portrait) and (min-width:561px){.quickbar .qb-big{flex:0 0 auto;padding:.6rem 1.1rem}}
.parent .side button[data-a="kid"]{display:flex;align-items:center;justify-content:center;gap:.35rem}.parent .side button[data-a="kid"] svg{width:1rem;height:1rem}
/* Okuma Atölyesi ebeveyn değerlendirmesi */
.okr h4{margin:1rem 0 .4rem;font-size:1.02rem;color:var(--navy,#1D2A4D)}
.okr-sum{margin-top:.6rem;padding:.8rem 1rem;background:#F3F6FC;border-radius:.8rem;line-height:1.5}
.okr-plan{margin:0;padding-left:1.3rem;line-height:1.5}.okr-plan li{margin-bottom:.35rem}
.okr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(19rem,1fr));gap:.6rem}
.okr-row{border:.1rem solid #E6EBF3;border-radius:.8rem;padding:.6rem .75rem;display:flex;flex-direction:column;gap:.35rem}
.okr-h{display:flex;justify-content:space-between;align-items:center;gap:.5rem}.okr-h .tag{font-size:.75rem;white-space:nowrap}
.okr-m{display:flex;flex-direction:column;gap:.2rem;font-size:.82rem;color:#5A6787}
.okr-bar{height:.5rem;border-radius:.3rem;background:#EEF1F6;overflow:hidden}.okr-bar i{display:block;height:100%;border-radius:inherit}
.okr-t{font-size:.88rem;line-height:1.45}
.okr-ai{margin-top:1rem;padding:.8rem 1rem;border-radius:.8rem;background:#F1EEFF}
.okr-aitxt{white-space:pre-wrap;margin-top:.5rem;line-height:1.5;font-size:.92rem}
/* "Bugün nasıl hissediyorsun?" kare kart: Günlük düğmesinin altında */
.quickbar .ck-sq{flex:0 0 100%;width:100%}
.ck-sq .checkin{position:relative;display:flex;flex-direction:column;gap:.5rem;background:#FFF8E1;border:.12rem solid #F2D9A6;border-radius:1.2rem;padding:.7rem .6rem .6rem;margin:0;text-align:center}
.ck-sq .checkin b{font-size:1rem;line-height:1.2;padding:0 1.6rem}
.ck-sq .ck-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem}
.ck-sq .ck-opts button{aspect-ratio:1;flex-direction:column;justify-content:center;gap:.15rem;padding:.2rem;font-size:.78rem;border-radius:.9rem;box-shadow:0 .15rem 0 #EBCB6A;min-width:0}
.ck-sq .ck-opts button span{font-size:1.7rem}
.ck-sq .ck-x{top:.25rem;right:.3rem}
@media (max-height:820px) and (orientation:landscape){.ck-sq .ck-opts button{aspect-ratio:auto;height:3.4rem}.ck-sq .ck-opts button span{font-size:1.3rem}}
@media (orientation:portrait) and (min-width:561px){.quickbar .ck-sq{flex:0 0 22rem}}
.quickbar .ck-sq button{min-width:0;border:0}
.quickbar .ck-sq .ck-x{background:transparent;box-shadow:none;padding:0;width:1.8rem;height:1.8rem;font-size:1.3rem;display:flex;align-items:center;justify-content:center;color:var(--muted)}
.quests .quest.fam{flex-basis:100%}
.home-left:has(.ck-sq .checkin)>.bubble{display:none}
.home-left:has(.ck-sq .checkin) .big{width:11rem;height:11rem;margin-top:.2rem}
.home-left:has(.ck-sq .checkin) .big svg{width:9.5rem;height:9.5rem}
.home-left:has(.ck-sq .checkin){gap:.5rem}
@media (max-height:620px) and (orientation:landscape){.home-left:has(.ck-sq .checkin) .big{width:8rem;height:8rem}.home-left:has(.ck-sq .checkin) .big svg{width:7rem;height:7rem}.home-left:has(.ck-sq .checkin) .qb-big{padding:.35rem .6rem}.ck-sq .ck-opts button{height:2.7rem;flex-direction:row}.ck-sq .ck-opts button span{font-size:1.1rem}}
.ck-sq .checkin{min-width:0;width:100%;box-sizing:border-box}
@media (orientation:portrait) and (min-width:561px){.home-left .quickbar{align-items:center}.quickbar .qb-big{height:4.2rem}}
.parent .side button.side-exit{margin-top:.5rem;background:#E5383B;color:#fff;text-align:center}
.parent .side button.side-exit:active{background:#C42B2E}
/* Okuma grafikleri */
.okg h4{margin:1.1rem 0 .4rem;font-size:1rem}
.okg-top{display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.6rem}
.okg-f{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;margin:.3rem 0}
.okg-f>span{width:5.2rem;font-size:.85rem;font-weight:700;color:#5A6787}
.okg-f .chip{height:2rem;font-size:.85rem;padding:0 .7rem}
.okg-k{margin-top:.8rem}.okg-k .kpi span{display:block;font-size:.8rem;margin-top:.15rem;color:#8A95B0}
.okg-leg{display:flex;flex-wrap:wrap;gap:.3rem .9rem;font-size:.82rem;margin-bottom:.2rem}.okg-leg i,.okg-t i{display:inline-block;width:.75rem;height:.75rem;border-radius:.2rem;margin-right:.35rem;vertical-align:-.05rem}
.okg-t{width:100%;border-collapse:collapse;font-size:.9rem}.okg-t th{text-align:left;color:#5A6787;font-weight:700;padding:.35rem .4rem;border-bottom:.12rem solid #E6EBF3}.okg-t td{padding:.4rem;border-bottom:.08rem solid #EEF1F6}.okg-t small{color:#8A95B0}
.okg-k .kpi span b{font-size:.85rem}
/* Web: tam ekran düğmesi */
.web-fs{position:fixed;left:calc(.8rem + env(safe-area-inset-left,0px));bottom:calc(.8rem + env(safe-area-inset-bottom,0px));z-index:40;display:flex;align-items:center;gap:.35rem;height:2.4rem;padding:0 .8rem;border:0;border-radius:1.2rem;background:rgba(29,42,77,.78);color:#fff;font:700 .8rem var(--font,sans-serif);cursor:pointer;opacity:.75}
.web-fs:hover{opacity:1}.web-fs svg{width:1.1rem;height:1.1rem}
@media (max-width:700px){.web-fs span{display:none}}