/* Matimo sınıf sayfaları (5-8) için ortak düzen */
*{box-sizing:border-box}
html,body{margin:0;background:#eee9df;font-family:Arial,Helvetica,sans-serif}
body{overflow-x:hidden}
.stage{position:relative;width:min(100vw,1055px);margin:0 auto;background:#fffaf1;overflow:hidden;padding-bottom:48px;min-height:100vh}

/* Üst görsel: sınıf başlığı, çizim ve arama kutusu */
.heroDesign{position:relative;width:100%;aspect-ratio:1055/465;overflow:hidden}
.heroDesign .design{position:absolute;z-index:1;left:0;top:0;width:100%;height:auto;display:block;user-select:none;-webkit-user-drag:none}
.home-hit{position:absolute;z-index:12;left:77.4%;top:4.8%;width:18.8%;height:16%;border-radius:999px;border:0;background:transparent;cursor:pointer}
.yn-btn{position:absolute;z-index:12;left:55%;top:6.5%;width:20.5%;height:13%;display:flex;align-items:center;justify-content:center;border-radius:999px;background:#fff6d6;box-shadow:0 4px 15px #0b31551a;border:2px solid #f2d27a;text-decoration:none;color:#7a5200;font-weight:900;font-size:clamp(9px,2.3vw,21px);white-space:nowrap;overflow:hidden}
.yn-btn:hover,.yn-btn:focus-visible{background:#ffefb3}
.search-real{position:absolute;z-index:12;left:4.2%;top:79.1%;width:67.5%;height:16%;border:0;background:transparent;outline:0;padding:0 6.7%;color:#6b7da0;font-size:clamp(13px,1.6vw,22px);font-weight:700;font-family:inherit}
.search-real::placeholder{color:transparent}
.search-real:focus{background:#fffffff7;border-radius:999px;box-shadow:0 0 0 2px #07376e14}
.gradePatch{position:absolute;z-index:9;left:3.65%;top:27.8%;width:9.3%;height:19.5%;background:#fffaf1;display:flex;align-items:center;padding-left:.9%;color:#083777;font-weight:900;font-size:clamp(32px,8.5vw,92px);line-height:1;letter-spacing:-2px;white-space:nowrap;pointer-events:none}
.bookNum{position:absolute;z-index:9;left:76%;top:35.8%;width:19%;height:34.1%;object-fit:fill;pointer-events:none;-webkit-mask-image:radial-gradient(ellipse 26% 43% at 49% 59%,#000 72%,transparent 100%);mask-image:radial-gradient(ellipse 26% 43% at 49% 59%,#000 72%,transparent 100%)}

/* Günün görevi: arama kutusunun altında, kartların üstünde */
.gorevYeri{padding:14px 3.7% 0}
.gorevYeri:empty{display:none}

/* Tema kartları */
.cardsArea{padding:18px 3.7% 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.theme-card{--a:#0d7767;position:relative;display:flex;align-items:center;gap:22px;min-height:150px;padding:20px 54px 20px 62px;border:1px solid #e7e0d2;border-left:0;background:#fffefa;border-radius:24px;box-shadow:0 8px 20px #1f3e5d12;cursor:pointer;color:#07376e;text-align:left;font-family:inherit;transition:transform .18s,box-shadow .18s;overflow:hidden}
.theme-card:hover,.theme-card:focus-visible{transform:translateY(-2px);box-shadow:0 14px 28px #1f3e5d1f}
.theme-card:last-of-type:nth-of-type(odd){grid-column:1/-1}
.c1{--a:#0d7767}.c2,.c5{--a:#1687d7}.c3{--a:#7c3fc6}.c4{--a:#e47712}.c6{--a:#d83256}.c7{--a:#d99210}.c8{--a:#2a8f86}
.num{position:absolute;left:0;top:0;width:66px;height:66px;padding:8px 0 0 11px;color:#fff;font-weight:900;font-size:24px;line-height:1;isolation:isolate}
.num::before{content:"";position:absolute;z-index:-1;inset:0;background:var(--a);clip-path:polygon(0 0,100% 0,0 100%)}
.theme-card::after{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--a)}
.iconWrap{flex:0 0 108px;height:108px;border-radius:24px;background:color-mix(in srgb,var(--a) 11%,#fff);display:flex;align-items:center;justify-content:center;overflow:hidden}
.cardText{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:8px}
.cardText strong{font-size:clamp(20px,2.3vw,27px);line-height:1.18;color:#0b3b7d;font-weight:900;overflow-wrap:anywhere}
.cardText em{font-style:normal;align-self:flex-start;padding:4px 11px;border-radius:999px;background:color-mix(in srgb,var(--a) 12%,#fff);color:color-mix(in srgb,var(--a) 80%,#000);font-size:15px;font-weight:900}
.mk-kart-rozet{top:14px!important;right:16px!important;font-size:18px!important}

/* Simgeler: her tema kendi renginde */
.icon{position:relative;flex:none;width:160px;height:140px;display:flex;align-items:center;justify-content:center;transform:scale(.66)}
.topicIcon{font-size:92px;font-weight:900;line-height:1;color:var(--a)}
.primeIcon b{font-size:62px;font-weight:900;margin:-4px;color:var(--a)}
.primeIcon b:nth-child(2){color:color-mix(in srgb,var(--a) 50%,#fff)}
.fractionIcon{gap:8px;flex-direction:column}
.fractionIcon span:first-child{font-size:72px;font-weight:900;line-height:1;color:var(--a)}
.fractionIcon span:last-child{padding:5px 10px;border-radius:10px;background:var(--a);color:#fff;font-weight:900;font-size:28px}
.algebraIcon span{font-size:76px;font-weight:900;color:var(--a)}
.algebraIcon i{font-style:normal;font-size:54px;font-weight:900;margin:0 3px;color:color-mix(in srgb,var(--a) 50%,#fff)}
.algebraIcon b{font-size:64px;color:var(--a)}
.geometryIcon .sq{width:36%;aspect-ratio:1;background:var(--a);border-radius:8px;transform:translate(-8%,14%)}
.geometryIcon .tri{width:0;height:0;border-left:28px solid transparent;border-right:28px solid transparent;border-bottom:54px solid color-mix(in srgb,var(--a) 55%,#fff);position:absolute;left:49%;top:5%}
.geometryIcon .circ{width:34%;aspect-ratio:1;border-radius:50%;background:color-mix(in srgb,var(--a) 28%,#fff);position:absolute;right:5%;bottom:3%}
.measureIcon .ruler2{width:68%;height:18%;border-radius:6px;background:repeating-linear-gradient(90deg,color-mix(in srgb,var(--a) 45%,#fff) 0 9%,var(--a) 9% 11%,color-mix(in srgb,var(--a) 45%,#fff) 11% 20%);transform:rotate(-38deg)}
.measureIcon b{position:absolute;right:7%;bottom:3%;font-size:52px;color:var(--a)}
.statsIcon{align-items:flex-end;gap:7px;padding:8% 12%}
.statsIcon i{display:block;width:17%;border-radius:6px 6px 2px 2px}
.statsIcon i:nth-child(1){height:32%;background:color-mix(in srgb,var(--a) 40%,#fff)}
.statsIcon i:nth-child(2){height:52%;background:color-mix(in srgb,var(--a) 70%,#fff)}
.statsIcon i:nth-child(3){height:72%;background:var(--a)}
.statsIcon b{position:absolute;right:6%;top:7%;font-size:52px;color:var(--a)}
.probabilityIcon{gap:8px}
.probabilityIcon .die{font-size:86px;line-height:1;color:var(--a)}
.probabilityIcon .coin{width:34%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--a) 55%,#fff);color:#fff;font-weight:900;font-size:38px}

.emptyMsg{display:none;grid-column:1/-1;background:#fff;border-radius:20px;padding:18px;color:#07376e;font-weight:900;text-align:center}

/* Oyun listesi penceresi */
.modal{position:fixed;inset:0;background:rgba(5,28,54,.48);display:none;align-items:center;justify-content:center;z-index:9000;padding:18px}
.modal.open{display:flex}
.modal-card{width:min(760px,94vw);max-height:82vh;overflow:auto;background:#fffaf0;border-radius:28px;padding:22px;box-shadow:0 25px 70px rgba(0,0,0,.28)}
.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.modal-head h2{margin:0;font-size:26px;color:#07376e}
.modal-help{margin:0 0 14px;color:#64758a;font-size:16px;font-weight:700}
.close{border:0;background:#eef1f5;width:42px;height:42px;border-radius:50%;font-size:28px;color:#07376e;cursor:pointer}
.theme-games{display:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.theme-games.active{display:grid}
.game-item{border:1px solid #e8e1d5;background:#fff;border-radius:16px;padding:14px;text-align:left;color:#07376e;cursor:pointer;font-family:inherit}
.game-item:hover{border-color:#0d7767}
.game-item span{display:block;font-weight:900;font-size:17px;line-height:1.28}
.game-item small{display:inline-block;margin-top:7px;padding:5px 9px;border-radius:999px;background:#0d7767;color:#fff;font-weight:900}
.game-item.challenge{grid-column:1/-1;background:linear-gradient(135deg,#fff8e1,#fff1c7);border:1.5px solid #f2d27a}
.game-item.challenge span{color:#8a5a00}
.game-item.challenge small{background:#f5b819;color:#3d2a00}

@media(max-width:760px){
  .theme-games{grid-template-columns:1fr}
  .modal-card{border-radius:22px;padding:16px}
}
/* Telefon: tek sütun, daha büyük yazı */
@media(max-width:640px){
  .gorevYeri{padding:10px 12px 0}
  .cardsArea{grid-template-columns:1fr;gap:10px;padding:12px 12px 0}
  .theme-card{min-height:92px;gap:14px;padding:12px 40px 12px 40px;border-radius:18px}
  .theme-card:last-of-type:nth-of-type(odd){grid-column:auto}
  .num{width:40px;height:40px;padding:5px 0 0 7px;font-size:16px}
  .theme-card::after{width:4px}
  .iconWrap{flex-basis:64px;height:64px;border-radius:16px}
  .icon{transform:scale(.4)}
  .cardText{gap:5px}
  .cardText strong{font-size:18px;line-height:1.2}
  .cardText em{font-size:13px;padding:3px 9px}
  .mk-kart-rozet{top:10px!important;right:12px!important;font-size:15px!important}
}

/* Tema penceresi: bu temada neler öğrenilir */
.kazanim{margin:0 0 14px;padding:14px 16px;border-radius:18px;background:#e7f3ef;border:1.5px solid #cbe6dd;color:#0a5f52;font-size:15px;line-height:1.45}
.kazanim b{display:block;margin-bottom:6px;font-size:16px;color:#0a5f52}
.kazanim ul{margin:0;padding-left:20px}
.kazanim li{margin:3px 0;color:#24525a;font-weight:700}
@media(max-width:640px){.kazanim{font-size:14px;padding:12px 14px}}

/* 3B tema ikonları */
.iconWrap.img{background:transparent}
.iconWrap.img img{width:100%;height:100%;display:block;object-fit:contain}

/* Üst görsel: konu ikonları (yeni öğrenci) / konu yolu (ilerleyen öğrenci) */
.heroDesign{container-type:inline-size}
.hy{position:absolute;z-index:8;left:60%;top:21%;width:39%;height:77%}
.hy-ik{position:absolute;height:auto;mix-blend-mode:multiply;pointer-events:none;user-select:none;animation:hyYuz 6s ease-in-out infinite}
@keyframes hyYuz{0%,100%{translate:0 0}50%{translate:0 -.5cqw}}
.hy svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hy-yol{fill:none;stroke:#d7e7f6;stroke-width:15;stroke-linecap:round;stroke-linejoin:round}
.hy-cizgi{fill:none;stroke:#fff;stroke-width:3.5;stroke-dasharray:2 13;stroke-linecap:round}
.hy-d{position:absolute;transform:translate(-50%,-50%);border-radius:50%;padding:0;cursor:pointer;background:#fff;border:.35cqw solid #dbe5f1;box-shadow:0 .7cqw 1.3cqw #0b31551f;display:flex;align-items:center;justify-content:center;transition:transform .15s}
.hy-d img{width:78%;height:78%;object-fit:contain;mix-blend-mode:multiply;pointer-events:none}
.hy-d:not(.bitti):not(.sira) img{opacity:.7;filter:saturate(.7)}
.hy-d:hover,.hy-d:focus-visible{transform:translate(-50%,-50%) scale(1.08);outline:0}
.hy-d.bitti{border-color:#2f9a6e;background:#f1fbf6}
.hy-d.sira{border-color:#f5b301;background:#fffaf0;box-shadow:0 0 0 .6cqw #f5b30133,0 .8cqw 1.6cqw #d6960033;animation:hyNabiz 2.4s ease-in-out infinite}
@keyframes hyNabiz{0%,100%{box-shadow:0 0 0 .5cqw #f5b30133,0 .8cqw 1.6cqw #d6960033}50%{box-shadow:0 0 0 1.1cqw #f5b30122,0 .8cqw 1.6cqw #d6960033}}
.hy-tik{position:absolute;right:-8%;bottom:-6%;width:38%;height:38%;border-radius:50%;background:#2f9a6e;color:#fff;font:900 1.35cqw/1 Arial,sans-serif;font-style:normal;display:flex;align-items:center;justify-content:center;border:.25cqw solid #fff}
.hy-etiket{position:absolute;background:#083777;color:#fff;font-weight:900;font-size:1.45cqw;line-height:1;padding:.75cqw 1.1cqw;border-radius:1cqw;white-space:nowrap;pointer-events:none;z-index:2}
.hy-etiket:before{content:'';position:absolute;border:.6cqw solid transparent}
.hy-etiket.sag{transform:translate(calc(var(--r) + 1.1cqw),-50%)}
.hy-etiket.sag:before{left:-.6cqw;top:50%;margin-top:-.6cqw;border-left:0;border-right-color:#083777}
.hy-etiket.sol{transform:translate(calc(-100% - var(--r) - 1.1cqw),-50%)}
.hy-etiket.sol:before{right:-.6cqw;top:50%;margin-top:-.6cqw;border-right:0;border-left-color:#083777}
.hy-etiket.ust{transform:translate(-50%,calc(-100% - var(--r) - 1cqw))}
.hy-etiket.ust:before{bottom:-.6cqw;left:50%;margin-left:-.6cqw;border-bottom:0;border-top-color:#083777}
.hy-etiket.alt{transform:translate(-50%,calc(var(--r) + 1cqw))}
.hy-etiket.alt:before{top:-.6cqw;left:50%;margin-left:-.6cqw;border-top:0;border-bottom-color:#083777}
.hy-etiket.altsol{transform:translate(calc(-100% + var(--r)),calc(var(--r) + 1cqw))}
.hy-etiket.altsol:before{top:-.6cqw;right:calc(var(--r) - .6cqw);border-top:0;border-bottom-color:#083777}
.hy-kupa{position:absolute;transform:translate(-50%,-50%);border-radius:50%;background:#f3f5f9;border:.35cqw solid #dbe5f1;display:flex;align-items:center;justify-content:center;font-size:3.3cqw;line-height:1;filter:grayscale(.7);opacity:.85}
.hy-kupa.tamam{background:#ffe9a8;border-color:#f5b301;filter:none;opacity:1;box-shadow:0 0 0 .8cqw #f5b30133}
@media (prefers-reduced-motion:reduce){.hy-ik,.hy-d.sira{animation:none}}
/* Üst görsel eklemeleri: durak numarası, konu adı balonu, sayaç, kutlama, dar ekran */
.hy-no{position:absolute;left:-10%;top:-10%;min-width:36%;height:36%;padding:0 .2cqw;box-sizing:border-box;border-radius:99px;background:#083777;color:#fff;font:900 1.15cqw/1 Arial,sans-serif;display:flex;align-items:center;justify-content:center;border:.22cqw solid #fff;pointer-events:none}
.hy-d.bitti .hy-no{background:#2f9a6e}
.hy-d.sira .hy-no{background:#d99a00}
.hy-ad{position:absolute;left:50%;background:#fff;color:#083777;font-weight:800;font-size:1.25cqw;line-height:1.15;padding:.6cqw .9cqw;border-radius:.8cqw;white-space:nowrap;box-shadow:0 .5cqw 1.4cqw #0b315533;border:1px solid #dbe5f1;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .15s,transform .15s;z-index:5}
.hy-ad.yukari{bottom:calc(100% + .9cqw);transform:translate(-50%,.4cqw)}
.hy-ad.asagi{top:calc(100% + .9cqw);transform:translate(-50%,-.4cqw)}
.hy-d:hover,.hy-d:focus-visible{z-index:6}
@media (hover:hover){.hy-d:hover .hy-ad{opacity:1;visibility:visible;transform:translate(-50%,0)}}
.hy-d:focus-visible .hy-ad{opacity:1;visibility:visible;transform:translate(-50%,0)}
.hy-d:focus-visible{box-shadow:0 0 0 .5cqw #2f6fd6}
.hy-etiket.sayac{background:#fff;color:#083777;border:1px solid #dbe5f1;box-shadow:0 .4cqw 1cqw #0b31551a}
.hy-etiket.sayac.sag:before{border-right-color:#fff}.hy-etiket.sayac.sol:before{border-left-color:#fff}
.hy-etiket.sayac.ust:before{border-top-color:#fff}.hy-etiket.sayac.alt:before,.hy-etiket.sayac.altsol:before{border-bottom-color:#fff}
.hy-kf{position:absolute;width:1cqw;height:.6cqw;margin:-.3cqw 0 0 -.5cqw;z-index:7;pointer-events:none;animation:hyKf 1.4s cubic-bezier(.2,.7,.4,1) both}
@keyframes hyKf{0%{transform:translate(0,0) rotate(0);opacity:1}70%{opacity:1}100%{transform:translate(var(--x),calc(var(--y) + 4cqw)) rotate(var(--d));opacity:0}}
.hy-pop{animation:hyPop .7s ease-out}
@keyframes hyPop{0%{transform:translate(-50%,-50%) scale(1)}35%{transform:translate(-50%,-50%) scale(1.35)}100%{transform:translate(-50%,-50%) scale(1)}}
.hy.dar .hy-etiket{font-size:2.6cqw;padding:1.1cqw 1.6cqw;border-radius:1.6cqw}
.hy.dar .hy-no{font-size:2cqw;border-width:.35cqw}
.hy.dar .hy-tik{font-size:2.2cqw}
.hy.dar .hy-d{border-width:.5cqw}
.hy.dar .hy-kupa{font-size:4.2cqw}
.hy.dar .hy-kf{width:1.8cqw;height:1.1cqw}
@media (prefers-reduced-motion:reduce){.hy-pop{animation:none}}
.hy-ad.sagda{left:auto;right:-15%}
.hy-ad.sagda.yukari,.hy-ad.sagda.asagi{transform:translate(0,.4cqw)}
@media (hover:hover){.hy-d:hover .hy-ad.sagda{transform:none}}
.hy-d:focus-visible .hy-ad.sagda{transform:none}
.hy-kupa-say{position:absolute;left:50%;top:88%;transform:translateX(-50%);background:#083777;color:#fff;font:900 2.3cqw/1 Arial,sans-serif;padding:.7cqw 1.2cqw;border-radius:99px;border:.35cqw solid #fff;white-space:nowrap}
.hy-kupa.tamam .hy-kupa-say{background:#2f9a6e}
.hy-kupa:has(.hy-kupa-say){filter:none}
.hy-kupa:not(.tamam):has(.hy-kupa-say){opacity:1;color:transparent;text-shadow:0 0 0 #9aa5b5}
/* Her sınıfın kendi rengi */
/* Sınıf seçim sayfasındaki renklerle aynı: 5 yeşil, 6 mavi, 7 turuncu, 8 mor */
body.s5{--sr:#0d7767;--sr-k:#0a5f53;--sr-a:#e2f2ec}
body.s6{--sr:#1687d7;--sr-k:#0f63a3;--sr-a:#e3f1fc}
body.s7{--sr:#e47712;--sr-k:#b35300;--sr-a:#fdebd9}
body.s8{--sr:#7c3fc6;--sr-k:#5f2aa3;--sr-a:#efe5fb}
.stage::before{content:"";position:absolute;z-index:20;left:0;right:0;top:0;height:7px;background:var(--sr,transparent);pointer-events:none}
.gradePatch{color:var(--sr-k,#083777)}
.hy-yol{stroke:color-mix(in srgb,var(--sr,#9ec3e8) 30%,#fff)}
.modal-card{border-top:7px solid var(--sr,transparent)}
.modal-head h2{color:var(--sr-k,#07376e)}
.game-item small{background:var(--sr-k,#0d7767)}
.game-item:hover{border-color:var(--sr,#0d7767)}
/* Üst görsel: seri ve rozet düğmeleri */
.hu-ust{position:absolute;z-index:12;left:18%;top:6.5%;height:13%;display:flex;gap:1.1cqw;align-items:center}
.hu-ust>*{height:100%;display:flex;align-items:center;gap:.6cqw;padding:0 1.8cqw;border-radius:999px;font-weight:900;font-size:clamp(9px,1.9cqw,20px);white-space:nowrap;text-decoration:none;box-shadow:0 4px 15px #0b31551a;font-family:inherit}
.hu-seri{background:#fff1e0;border:2px solid #ffc58a;color:#a34700}
.hu-seri b{font-size:1.2em}
.hu-seri.soluk{background:#fff;border-style:dashed;color:#b07a4a}
.hu-rozet{background:var(--sr-a,#eef4ff);border:2px solid color-mix(in srgb,var(--sr,#2f6fd6) 45%,#fff);color:var(--sr-k,#13509f)}
.hu-rozet b{background:var(--sr-k,#13509f);color:#fff;border-radius:99px;padding:.35cqw .8cqw;font-size:.82em}
.hu-rozet:hover,.hu-rozet:focus-visible{background:#fff}
body.s5 .hu-ust{left:17.5%}
/* Baykuş */
.hy-mk{position:absolute;z-index:4;padding:0;border:0;background:transparent;cursor:pointer;aspect-ratio:199/223;filter:drop-shadow(0 .5cqw .6cqw #0b315533)}
.hy-mk img{display:block;width:100%;height:100%;object-fit:contain;animation:mkSall 3.2s ease-in-out infinite;transform-origin:50% 95%;pointer-events:none}
@keyframes mkSall{0%,100%{transform:rotate(-3deg) translateY(0)}50%{transform:rotate(3deg) translateY(-.4cqw)}}
.hy-mk:focus-visible{outline:.4cqw solid #2f6fd6;outline-offset:.3cqw;border-radius:30%}
.hy-mk-sek img{animation:mkSek .5s ease-out,mkSall 3.2s ease-in-out .5s infinite}
@keyframes mkSek{0%{transform:translateY(0)}40%{transform:translateY(-2.2cqw) scale(1.05)}70%{transform:translateY(0) scale(1.03,.95)}100%{transform:none}}
.hy-mk-gel{animation:mkGel .8s cubic-bezier(.2,1.4,.4,1) .3s both}
@keyframes mkGel{0%{opacity:0;transform:translateY(-6cqw) scale(.6)}100%{opacity:1;transform:none}}
.hy-mk.ikon{z-index:3}
.hy-mk-balon{position:absolute;z-index:9;transform:translate(-50%,calc(-100% - 1cqw));background:#fff;color:#083777;border:2px solid #083777;border-radius:1.6cqw;padding:1cqw 1.4cqw;font:800 1.5cqw/1.3 Arial,Helvetica,sans-serif;width:max-content;max-width:24cqw;text-align:center;box-shadow:0 .6cqw 1.6cqw #0b315533;pointer-events:none;animation:mkBalon .35s cubic-bezier(.2,1.4,.4,1) both}
.hy-mk-balon:after{content:"";position:absolute;left:50%;bottom:-1.1cqw;margin-left:-1cqw;border:1cqw solid transparent;border-bottom:0;border-top-color:#083777}
.hy-mk-balon.sagda{transform:translate(-88%,calc(-100% - 1cqw))}.hy-mk-balon.sagda:after{left:88%}
.hy-mk-balon.solda{transform:translate(-14%,calc(-100% - 1cqw))}.hy-mk-balon.solda:after{left:14%}
.hy-mk-balon.alta{transform:translate(-50%,1cqw)}.hy-mk-balon.alta.sagda{transform:translate(-88%,1cqw)}.hy-mk-balon.alta.solda{transform:translate(-14%,1cqw)}
.hy-mk-balon.alta:after{bottom:auto;top:-1.1cqw;border:1cqw solid transparent;border-top:0;border-bottom-color:#083777}
.hy-mk-balon.git{opacity:0;transition:opacity .3s}
@keyframes mkBalon{0%{opacity:0;scale:.6}100%{opacity:1;scale:1}}
.hy.dar .hy-mk-balon{font-size:3.3cqw;max-width:40cqw;padding:1.4cqw 2cqw;border-radius:2.4cqw}
@media (prefers-reduced-motion:reduce){.hy-mk img,.hy-mk-gel,.hy-mk-balon{animation:none}}
@media(max-width:640px){.hu-ust>*{font-size:clamp(11px,3.3cqw,15px);padding:0 2.2cqw}.hu-rozet b{font-size:.9em}.search-real{font-size:15px}}
.gradePatch{left:4.9%;top:28.9%;width:auto;height:19.8%;padding:0;background:transparent;font-family:"Arial Rounded MT Bold","Helvetica Rounded",Arial,Helvetica,sans-serif;font-size:8.3cqw;letter-spacing:.1cqw;-webkit-text-stroke:.32cqw currentColor;paint-order:stroke fill}

/* Ana Sayfa düğmesi: belirgin */
.home-hit{top:6.5%;height:13%;display:flex;align-items:center;justify-content:center;gap:.5em;background:#fff;color:#083777;border:2px solid #083777;text-decoration:none;font-weight:900;font-size:clamp(11px,1.9cqw,20px);box-shadow:0 0 0 .7cqw #fffaf1,0 4px 15px #0b31551a;white-space:nowrap}
.home-hit::before{content:"🏠"}
.home-hit::after{content:"Ana Sayfa"}
.home-hit:hover,.home-hit:focus-visible{background:#eef4ff}
/* Büyüteç: yalnızca yolu büyütür */
.hy{transition:transform .25s ease}
.hy-lup{position:absolute;z-index:12;left:52%;top:35%;width:9.5cqw;height:9.5cqw;padding:0;border-radius:50%;border:2px solid #083777;background:#fff;font-size:4.8cqw;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 3px 10px #0b315533;animation:hyLupN 2.6s ease-in-out infinite}
@keyframes hyLupN{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}
.heroDesign.hy-buyuk{z-index:9500;overflow:visible}
.stage:has(.hy-buyuk){overflow:visible}
.hy-buyuk .hy{z-index:31;background:#fffaf1;border-radius:4cqw;box-shadow:0 0 0 1.5cqw #fffaf1,0 2cqw 6cqw #0006}
.hy-buyuk .hy-lup{display:none}
.hy-perde{position:fixed;inset:0;z-index:30;background:rgba(5,28,54,.6)}
.hy-kapat{position:fixed;top:16px;right:16px;z-index:32;width:46px;height:46px;border-radius:50%;border:0;background:#fff;color:#083777;font:900 22px/1 Arial,sans-serif;cursor:pointer;box-shadow:0 4px 14px #0005}
@media (prefers-reduced-motion:reduce){.hy,.hy-lup{animation:none;transition:none}}
@media(max-width:640px){
  .hu-uz{display:none}
  .hu-ust{gap:1.6cqw}
  .yn-btn{left:52%;width:23.5%;font-size:clamp(10px,3cqw,13px)}
  .home-hit{left:76.8%;width:21.2%;font-size:clamp(10px,2.9cqw,13px);gap:.3em}
}