.scGame{
  --ink:#2f4658;
  --violet:#7655c5;
  --blue:#3c83ce;
  --gold:#ffcb59;
  --green:#31b777;
  --red:#d64a56;
  direction:rtl;
  position:relative;
  overflow:hidden;
  border-radius:32px;
  padding:22px;
  color:var(--ink);
  background:
    radial-gradient(circle at 12% 8%,rgba(255,255,255,.94),transparent 18%),
    linear-gradient(180deg,#d7f2ff 0 32%,#e6d09f 32% 100%);
  font-family:"Alexandria",Tahoma,Arial,sans-serif;
  box-shadow:0 25px 72px rgba(48,75,95,.24);
  isolation:isolate
}
.scGame *{box-sizing:border-box}
.scGame button{font:inherit}
.scWorld{position:absolute;inset:0;pointer-events:none}
.scBolt{position:absolute;font-size:52px;filter:drop-shadow(0 7px 7px rgba(120,77,18,.2));animation:scBolt 3.5s ease-in-out infinite}
.scBoltOne{left:6%;top:58px}.scBoltTwo{right:7%;top:138px;animation-delay:-1.8s}
.scCloud{position:absolute;width:125px;height:39px;border-radius:999px;background:rgba(255,255,255,.83);filter:drop-shadow(0 7px 8px rgba(50,115,142,.12));animation:scCloud 24s linear infinite}
.scCloud:before,.scCloud:after{content:"";position:absolute;border-radius:50%;background:inherit}
.scCloud:before{width:58px;height:58px;right:20px;bottom:7px}
.scCloud:after{width:43px;height:43px;left:20px;bottom:8px}
.scCloudOne{top:72px;right:-150px}
.scCloudTwo{top:155px;left:-140px;animation-duration:30s;animation-delay:-13s;transform:scale(.78)}

.scHeader{position:relative;z-index:4;display:flex;align-items:flex-start;justify-content:space-between;gap:15px;padding:2px 3px 16px}
.scTitleBlock{max-width:770px}
.scKicker{display:inline-flex;padding:7px 13px;border-radius:999px;background:rgba(255,255,255,.84);font-size:12px;font-weight:900;box-shadow:0 7px 17px rgba(38,95,120,.1)}
.scHeader h1{margin:8px 0 3px;font-size:clamp(31px,5vw,52px);line-height:1;color:#77408a;text-shadow:0 3px 0 rgba(255,255,255,.72)}
.scHeader h1 span{display:inline-block;animation:scTitle 2.2s ease-in-out infinite}
.scHeader p{margin:0;font-weight:800;color:#477481}
.scSound{border:0;border-radius:999px;background:#fff;cursor:pointer;font-weight:900;padding:11px 16px;white-space:nowrap;box-shadow:0 8px 19px rgba(28,74,92,.16)}

.scLevels{position:relative;z-index:4;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.scLevels button{appearance:none;border:2px solid transparent;border-radius:20px;padding:11px 8px;background:rgba(255,255,255,.89);cursor:pointer;box-shadow:0 8px 18px rgba(31,82,102,.1);transition:.22s}
.scLevels button span,.scLevels button b,.scLevels button small{display:block}
.scLevels button span{font-size:26px}.scLevels button b{font-size:17px}
.scLevels button small{margin-top:3px;color:#687b82;font-size:11px}
.scLevels button:hover{transform:translateY(-3px)}
.scLevels button.is-active{transform:translateY(-4px);border-color:var(--gold);background:#fff2bf;box-shadow:0 12px 26px rgba(221,157,24,.25)}

.scStats{position:relative;z-index:4;display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:12px 0}
.scStats>div{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;align-items:center;gap:0 7px;padding:8px 10px;border-radius:17px;background:rgba(255,255,255,.9);box-shadow:0 6px 15px rgba(33,82,98,.1)}
.scStats>div>span{grid-row:1/3;font-size:23px}
.scStats small{font-size:10px;color:#6d777a;font-weight:900}
.scStats b{font-size:18px}.scStats em{font-style:normal}
.scTimerChip.is-warning{background:#ffe1e4;color:#9c1d2d;animation:scWarning .6s ease-in-out infinite}

.scArena{position:relative;z-index:2;min-height:900px;overflow:hidden;border-radius:29px;background:linear-gradient(180deg,#acdff2 0 30%,#8fb36f 30% 53%,#be9669 53% 100%);box-shadow:inset 0 0 0 5px rgba(255,255,255,.3),inset 0 -25px 45px rgba(50,31,17,.2),0 15px 35px rgba(58,80,72,.16)}
.scArena:before{content:"";position:absolute;left:-5%;right:-5%;bottom:-115px;height:315px;border-radius:50% 50% 0 0;background:linear-gradient(180deg,#6e4b31,#3b291f);box-shadow:inset 0 18px 0 rgba(255,255,255,.04)}
.scStadium{position:absolute;inset:0 0 auto;height:31%;background:linear-gradient(180deg,#8ed2ed,#b6e2f2)}
.scStand{position:absolute;bottom:0;width:43%;height:130px;background:
  repeating-linear-gradient(0deg,#425461 0 14px,#5a6e7a 15px 28px),
  repeating-linear-gradient(90deg,rgba(255,255,255,.14) 0 13px,transparent 14px 26px);
  clip-path:polygon(0 35%,100% 0,100% 100%,0 100%);opacity:.9}
.scStandLeft{left:0}.scStandRight{right:0;transform:scaleX(-1)}
.scFlag{position:absolute;top:33px;font-size:37px;animation:scFlag 2.7s ease-in-out infinite}
.scFlagOne{left:7%}.scFlagTwo{right:7%;animation-delay:-1.2s}

.scTrack{position:absolute;z-index:4;left:-4%;right:-4%;bottom:120px;height:285px;border-radius:50% 50% 0 0;background:
  repeating-linear-gradient(90deg,transparent 0 13%,rgba(255,255,255,.62) 13.2% 13.8%,transparent 14% 26%),
  linear-gradient(180deg,#d8905e,#a45c3f);
  border-top:12px solid #f6d7bb;
  box-shadow:inset 0 18px 0 rgba(255,255,255,.11),0 -9px 0 rgba(68,106,54,.32)}
.scTrack i{position:absolute;left:2%;right:2%;height:3px;background:rgba(255,255,255,.7)}
.scTrack i:nth-child(1){top:22%}.scTrack i:nth-child(2){top:43%}.scTrack i:nth-child(3){top:64%}.scTrack i:nth-child(4){top:84%}
.scFinishLine{position:absolute;right:8%;top:17px;font-size:61px;filter:drop-shadow(0 10px 7px rgba(60,42,23,.2))}

.scRunner{position:absolute;z-index:18;left:7%;bottom:232px;font-size:86px;filter:drop-shadow(0 15px 8px rgba(57,39,25,.25));transition:left .5s cubic-bezier(.2,.8,.2,1);animation:scRunner 1s ease-in-out infinite}
.scRunner.is-fast{animation-duration:.42s}

.scClockPanel{position:absolute;z-index:16;right:26px;top:42px;text-align:center}
.scClockRing{width:122px;height:122px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#e84e73 360deg,#e8edf0 0);box-shadow:0 13px 0 rgba(68,48,31,.2),0 20px 27px rgba(59,66,61,.17)}
.scClockCore{width:90px;height:90px;display:grid;place-items:center;border-radius:50%;background:#fff;font-size:42px;box-shadow:inset 0 0 0 5px #f1d6ef}
.scClockPanel b{display:inline-block;margin-top:8px;padding:6px 12px;border-radius:999px;background:#fff;color:#76428b;font-size:11px;box-shadow:0 7px 16px rgba(62,57,40,.12)}

.scQuestionCard{position:absolute;z-index:17;left:50%;top:32px;transform:translateX(-50%);width:370px;min-height:325px;padding:31px 20px 18px;text-align:center;border-radius:31px;background:linear-gradient(160deg,#fff,#fff0c3);border:5px solid rgba(255,255,255,.9);box-shadow:0 16px 0 rgba(87,64,40,.19),0 25px 34px rgba(44,64,61,.2)}
.scQuestionCard.is-correct{animation:scCardCorrect .62s}
.scQuestionCard.is-wrong{animation:scCardWrong .5s}
.scType{position:absolute;top:-15px;left:50%;transform:translateX(-50%);min-width:145px;padding:6px 12px;border-radius:999px;background:#7655c5;color:#fff;font-size:10px;font-weight:1000;box-shadow:0 5px 0 #53359e}
.scQuestionCard>small{display:block;color:#866844;font-weight:900}
.scQuestionBox{min-height:158px;display:grid;place-items:center}
.scQuestion{font-family:"Baloo Bhaijaan 2","Alexandria",sans-serif;font-size:clamp(45px,6vw,76px);font-weight:900;color:#6d294f;line-height:1.08}
.scQuestionImage{width:145px;height:145px;border-radius:25px;background:#fff;overflow:hidden;align-items:center;justify-content:center;box-shadow:0 10px 22px rgba(55,53,43,.14)}
.scQuestionImage:not([hidden]){display:flex}
.scQuestionImage img{width:100%;height:100%;object-fit:contain}
.scQuestionImage span{display:none;font-size:47px;font-weight:900;color:#6d294f}
.scReplay{border:0;border-radius:999px;padding:8px 13px;background:#fff;color:#684696;cursor:pointer;font-size:10px;font-weight:900;box-shadow:0 5px 0 rgba(77,56,32,.14)}
.scHintText{margin:8px 0 2px;color:#675844;font-size:11px;font-weight:900}
.scAudioFallback{display:block;min-height:27px;color:#7c386c;font-size:22px}
.scQuestionTimer{height:11px;margin-top:8px;border-radius:999px;background:#e4e7ea;overflow:hidden}
.scQuestionTimer span{display:block;width:100%;height:100%;background:linear-gradient(90deg,#35b96f,#ffcb56,#e64c57);transition:width .08s linear}

.scOptions{position:absolute;z-index:20;left:7%;right:7%;top:410px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;align-items:stretch}
.scOption{position:relative;min-height:126px;border:0;border-radius:21px;padding:10px;background:linear-gradient(145deg,#fff,#fff0c3);color:#533545;cursor:pointer;box-shadow:0 9px 0 #b98a55,0 15px 20px rgba(45,44,36,.17);font-family:"Baloo Bhaijaan 2","Alexandria",sans-serif;font-size:29px;font-weight:900;transition:.17s;overflow:hidden}
.scOption:hover{transform:translateY(-5px)}
.scOption.is-correct{animation:scOptionCorrect .65s;background:linear-gradient(145deg,#e8ffd8,#72d88b);box-shadow:0 8px 0 #3b9956}
.scOption.is-wrong{animation:scOptionWrong .48s;background:linear-gradient(145deg,#ffd6d8,#ee858e);box-shadow:0 8px 0 #a33a44}
.scOption.is-hint{opacity:.17;filter:grayscale(1);pointer-events:none}
.scOption[disabled]{cursor:default}
.scOptionImage{width:100%;height:88px;display:flex;align-items:center;justify-content:center;border-radius:15px;background:#fff;overflow:hidden}
.scOptionImage img{width:100%;height:100%;object-fit:contain}
.scOptionImage span{display:none;font-size:20px;color:#613948}
.scOption small{display:block;margin-top:5px;font-family:"Alexandria",sans-serif;font-size:9px;color:#665a52}

.scHintMeter{position:absolute;z-index:14;left:21px;top:310px;width:110px;padding:13px 8px;text-align:center;border-radius:20px;background:linear-gradient(145deg,#70451f,#4b2e18);border:5px solid #d6a04e;box-shadow:0 10px 0 rgba(69,45,23,.25),0 17px 22px rgba(70,61,31,.18);color:#fff}
.scHintMeter span,.scHintMeter b,.scHintMeter small{display:block}
.scHintMeter span{font-size:31px}.scHintMeter b{font-size:27px}.scHintMeter small{font-size:9px}
.scMessage{position:absolute;z-index:24;left:17%;right:17%;bottom:29px;min-height:45px;padding:10px 14px;text-align:center;border-radius:17px;background:rgba(255,255,255,.94);color:#465d68;font-weight:900;box-shadow:0 8px 19px rgba(72,70,51,.14)}
.scBankStatus{position:absolute;z-index:24;left:18%;right:18%;bottom:8px;text-align:center;color:#fff1ce;font-size:9px;font-weight:900;text-shadow:0 2px 4px rgba(65,43,27,.6)}
.scPerfect{position:absolute;z-index:34;left:50%;top:54%;transform:translate(-50%,-50%);pointer-events:none;color:#fff56d;font-size:clamp(33px,7vw,70px);font-weight:1000;text-shadow:0 5px 0 #d52c67,0 13px 25px rgba(0,0,0,.25)}

.scProgress{height:14px;margin:13px 4px;border-radius:999px;background:#d8c69e;overflow:hidden;box-shadow:inset 0 2px 5px rgba(82,63,30,.15)}
.scProgress span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#7655c5,#3d83cf,#ffca5c,#32b878);transition:.35s}
.scSummary{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:11px 0}
.scSummary>div{padding:10px;border-radius:16px;background:rgba(255,255,255,.88);text-align:center;box-shadow:0 7px 18px rgba(0,0,0,.055)}
.scSummary small,.scSummary b{display:block}.scSummary small{font-size:10px;color:#6b7280}.scSummary b{font-size:19px}
.scActions,.scShare{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.scActions button,.scShare button,.scEnd button{border:0;border-radius:16px;padding:11px 18px;font-weight:900;cursor:pointer;box-shadow:0 6px 0 rgba(0,0,0,.14)}
.scPrimary{background:linear-gradient(145deg,#7655c5,#51349b);color:#fff}
.scSecondary{background:#fff;color:#365b68}
.scGold{background:linear-gradient(145deg,#ffd56d,#eab442);color:#5a3b0b}
.scShare{margin-top:11px}.scShare button{padding:8px 14px;background:rgba(255,255,255,.83);font-size:12px;color:#3f5d67}

.scEnd{display:none;position:absolute;z-index:60;inset:0;align-items:center;justify-content:center;padding:20px;background:rgba(34,47,57,.81);backdrop-filter:blur(5px)}
.scEnd.is-visible{display:flex}
.scEndCard{width:min(500px,100%);padding:29px;text-align:center;border-radius:31px;background:linear-gradient(160deg,#fff,#fff0c5);box-shadow:0 28px 80px rgba(0,0,0,.35);animation:scEndIn .38s}
.scEndBadge{font-size:26px}.scCup{font-size:72px}.scStars{font-size:37px}
.scEndCard h2{margin:6px;font-size:30px;color:#66418f}
.scEndStats{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:15px 0}
.scEndStats>div{padding:11px;border-radius:17px;background:#fff;box-shadow:0 7px 17px rgba(78,70,37,.08)}
.scEndStats b,.scEndStats small{display:block}.scEndStats b{font-size:19px}.scEndStats small{font-size:9px;color:#77766b}
.scBest{font-weight:900;color:#9b671a}.scEndCard button{background:linear-gradient(145deg,#7655c5,#51349b);color:#fff}

.scPaused .scWorld *,.scPaused .scRunner{animation-play-state:paused!important}
.scPaused .scOptions{pointer-events:none;filter:grayscale(.25)}

@keyframes scCloud{from{transform:translateX(0)}to{transform:translateX(-130vw)}}
@keyframes scBolt{50%{transform:translateY(11px) rotate(8deg) scale(1.08)}}
@keyframes scTitle{50%{transform:scale(1.08) rotate(6deg)}}
@keyframes scFlag{50%{transform:rotate(-7deg) translateY(-4px)}}
@keyframes scRunner{50%{transform:translateY(-8px) rotate(-2deg)}}
@keyframes scWarning{50%{transform:scale(1.06)}}
@keyframes scCardCorrect{45%{transform:translateX(-50%) translateY(-11px) scale(1.05);filter:brightness(1.12)}}
@keyframes scCardWrong{20%,60%{transform:translateX(calc(-50% - 8px))}40%,80%{transform:translateX(calc(-50% + 8px))}}
@keyframes scOptionCorrect{45%{transform:translateY(-8px) scale(1.07);filter:brightness(1.14)}}
@keyframes scOptionWrong{20%,60%{transform:translateX(-7px)}40%,80%{transform:translateX(7px)}}
@keyframes scEndIn{from{opacity:0;transform:scale(.72)}to{opacity:1;transform:scale(1)}}

@media(max-width:1020px){
  .scGame{padding:13px;border-radius:20px}
  .scHeader p{font-size:12px}
  .scLevels{gap:6px}.scLevels button{padding:8px 4px}.scLevels button small{display:none}
  .scStats{grid-template-columns:repeat(3,1fr);gap:4px}
  .scStats>div{display:block;text-align:center;padding:6px 2px}
  .scStats>div>span{font-size:18px}.scStats small{display:block;font-size:8px}.scStats b{font-size:15px}
  .scArena{min-height:1120px}
  .scClockPanel{right:3px;top:37px;transform:scale(.72);transform-origin:right top}
  .scQuestionCard{top:50px;width:250px}
  .scOptions{left:5%;right:5%;top:420px;grid-template-columns:repeat(3,1fr);gap:8px}
  .scOption{min-height:122px;font-size:25px}
  .scTrack{bottom:142px}.scRunner{bottom:245px}
  .scHintMeter{left:3px;top:690px;transform:scale(.72);transform-origin:left top}
  .scMessage{left:5%;right:5%;bottom:29px;font-size:12px}.scBankStatus{left:5%;right:5%;bottom:8px}
}
@media(max-width:620px){
  .scHeader h1{font-size:29px}.scKicker{font-size:9px}.scSound{padding:9px 10px;font-size:11px}
  .scArena{min-height:1260px}
  .scQuestionCard{top:58px;width:220px}
  .scQuestionImage{width:120px;height:120px}
  .scOptions{top:410px;grid-template-columns:repeat(2,1fr)}
  .scOption{min-height:126px}
  .scTrack{bottom:150px}.scRunner{bottom:255px;font-size:69px}
  .scHintMeter{display:none}
  .scSummary{grid-template-columns:repeat(2,1fr)}
  .scEndStats{grid-template-columns:repeat(2,1fr)}
}
@media(prefers-reduced-motion:reduce){.scGame *{animation:none!important;transition:none!important}}