/* ZORELO v3.0.0 – glossy gameplay / app-feel pass */

/* Global interaction polish */
.zorelo-game-page-v14 button,
.zorelo-game-page-v14 a,
.zorelo-game-page-v14 input,
.zorelo-game-page-v14 textarea,
.zorelo-game-page-v14 .zo-reaction-pad,
.zorelo-game-page-v14 .zo-stop-circle,
.zorelo-game-page-v14 .zo-target-area,
.zorelo-game-page-v14 .zo-mover-stage{
  -webkit-tap-highlight-color:transparent;
}
.zorelo-game-page-v14 button,
.zorelo-game-page-v14 .zo-reaction-pad,
.zorelo-game-page-v14 .zo-stop-circle,
.zorelo-game-page-v14 .zo-target-area,
.zorelo-game-page-v14 .zo-mover-stage{touch-action:manipulation;user-select:none;-webkit-user-select:none}
.zorelo-game-page-v14 button:focus-visible,
.zorelo-game-page-v14 a:focus-visible,
.zorelo-game-page-v14 input:focus-visible,
.zorelo-game-page-v14 textarea:focus-visible{outline:4px solid rgba(55,105,255,.24)!important;outline-offset:3px!important}

/* App-like play card */
.zorelo-v14-play-wrap{
  position:relative!important;
  padding:18px!important;
  border:1px solid rgba(211,222,241,.95)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(244,248,255,.94))!important;
  box-shadow:0 22px 60px rgba(26,53,112,.10)!important;
  overflow:hidden!important;
}
.zorelo-v14-play-wrap:before{
  content:"";position:absolute;inset:-2px auto auto -2px;width:42%;height:5px;border-radius:0 999px 999px 0;
  background:linear-gradient(90deg,#25b8ff,#5262ff,#9b53ff);opacity:.9;z-index:2
}
.zorelo-v14-play-wrap:fullscreen{padding:clamp(16px,3vw,40px)!important;background:#eef4ff!important;overflow:auto!important}
.zorelo-v14-play-wrap:fullscreen .zorelo-game-root{min-height:calc(100vh - 150px)!important}

/* Unified game toolbar */
.zorelo-game-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 2px 14px;margin:0 0 4px;border-bottom:1px solid #e6edf7}
.zorelo-game-toolbar-copy{display:flex;align-items:center;gap:9px;color:#526680;font-size:.92rem;letter-spacing:.02em}
.zorelo-game-toolbar-copy .dot{width:9px;height:9px;border-radius:50%;background:#26c98d;box-shadow:0 0 0 5px rgba(38,201,141,.12)}
.zorelo-game-toolbar-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.zorelo-game-tool{min-height:42px!important;padding:0 13px!important;border-radius:13px!important;border:1px solid #dce5f2!important;background:#fff!important;color:#365071!important;display:inline-flex!important;align-items:center!important;gap:7px!important;font-size:.9rem!important;box-shadow:0 6px 16px rgba(27,57,118,.05)!important;transition:transform .16s ease,box-shadow .16s ease,background .16s ease!important}
.zorelo-game-tool:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(27,57,118,.09)!important}
.zorelo-game-tool.is-on,.zorelo-game-tool[aria-pressed="true"]{background:linear-gradient(135deg,#edf4ff,#f4efff)!important;border-color:#b9c9ff!important;color:#244bc5!important}

/* Glossy stage */
.zorelo-game-root{position:relative!important;overflow:hidden!important;background:
 radial-gradient(circle at 12% 10%,rgba(64,182,255,.13),transparent 24%),
 radial-gradient(circle at 88% 12%,rgba(127,83,255,.13),transparent 28%),
 linear-gradient(145deg,#ffffff 0%,#f7fbff 54%,#f2f8ff 100%)!important;
 border:1px solid #dce7f3!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 16px 42px rgba(35,67,133,.06)!important}
.zorelo-game-root:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,rgba(255,255,255,.5),transparent 28%);opacity:.45}
.zo-game{position:relative;z-index:1}

/* Intro screen */
.zo-intro-layout{gap:clamp(30px,5vw,70px)!important}
.zo-intro-copy h2{font-size:clamp(2.7rem,4.4vw,4.6rem)!important;line-height:.98!important;margin-bottom:16px!important}
.zo-intro-copy p{font-size:1.24rem!important;line-height:1.62!important;color:#435a7a!important}
.zo-intro-chips{display:flex;gap:9px;flex-wrap:wrap;margin:18px 0 6px}
.zo-intro-chips span{display:inline-flex;align-items:center;min-height:36px;padding:0 12px;border-radius:999px;background:rgba(255,255,255,.78);border:1px solid #dce5f1;color:#51647e;font-size:.88rem;box-shadow:0 7px 16px rgba(32,60,120,.045)}
.zo-intro-art{position:relative!important;border-radius:32px!important;box-shadow:0 24px 52px rgba(31,61,127,.18)!important;transform:rotate(1.2deg);transition:transform .24s ease,box-shadow .24s ease}
.zo-intro-art:after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.65);pointer-events:none}
.zo-intro-art:hover{transform:rotate(0) translateY(-3px);box-shadow:0 30px 60px rgba(31,61,127,.22)!important}

/* Primary / secondary controls */
.zo-start,.zo-secondary,.zo-choice,.zo-duel button,.zo-option-grid button,.zo-poll-option,.zo-sort-item button,.zo-more-clue{
  transition:transform .13s ease,box-shadow .13s ease,filter .13s ease,background .13s ease!important;
}
.zo-start{min-height:68px!important;padding:0 34px!important;border-radius:19px!important;background:linear-gradient(135deg,#1763ec 0%,#4366f4 58%,#7258ef 100%)!important;box-shadow:0 15px 30px rgba(37,83,202,.25),inset 0 1px 0 rgba(255,255,255,.25)!important;font-size:1.2rem!important;letter-spacing:.01em!important}
.zo-start:hover{transform:translateY(-3px)!important;box-shadow:0 19px 34px rgba(37,83,202,.31),inset 0 1px 0 rgba(255,255,255,.28)!important}
.zo-start:active,.is-pressed{transform:translateY(1px) scale(.985)!important}
.zo-start:disabled{filter:saturate(.65);opacity:.72;cursor:wait;transform:none!important}
.zo-start.is-loading:after{content:"";display:inline-block;width:16px;height:16px;margin-left:10px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;vertical-align:-3px;animation:zoSpin .7s linear infinite}
.zo-secondary{min-height:52px!important;border-radius:16px!important;background:rgba(255,255,255,.9)!important;backdrop-filter:blur(12px);box-shadow:0 8px 20px rgba(33,62,121,.07)!important}
.zo-actions{gap:12px!important;flex-wrap:wrap!important}

/* Questions and answers */
.zo-question{background:rgba(255,255,255,.94)!important;backdrop-filter:blur(12px);border:1px solid #d9e4f1!important;box-shadow:0 16px 36px rgba(29,58,119,.08)!important}
.zo-choice,.zo-duel button,.zo-option-grid button,.zo-poll-option,.zo-choice-grid button{min-height:66px!important;border-radius:18px!important;font-size:1.12rem!important}
.zo-choice:hover,.zo-duel button:hover,.zo-option-grid button:hover,.zo-poll-option:hover,.zo-choice-grid button:hover{transform:translateY(-2px)!important;box-shadow:0 14px 28px rgba(31,61,127,.12)!important}
.zo-feedback{border-radius:20px!important;padding:20px 22px!important;box-shadow:0 10px 24px rgba(30,58,118,.06)!important}
.zo-feedback.good{background:linear-gradient(135deg,#eafbf3,#f4fffa)!important;border-color:#afe7cd!important}
.zo-feedback.bad{background:linear-gradient(135deg,#fff1f4,#fff8fa)!important;border-color:#ffc4d0!important}

/* Timers / live stats */
.zo-timer{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:46px!important;padding:0 15px!important;border-radius:999px!important;background:#fff!important;border:1px solid #dbe5f2!important;color:#2d4b78!important;box-shadow:0 8px 19px rgba(26,54,115,.055)!important;font-size:1.05rem!important;font-variant-numeric:tabular-nums}
.zo-live-stats{display:grid;grid-template-columns:repeat(3,minmax(100px,1fr));gap:12px;width:min(620px,100%);margin:0 auto 18px}
.zo-live-stats>div{padding:14px;border-radius:18px;background:#fff;border:1px solid #dce6f2;box-shadow:0 8px 20px rgba(29,58,119,.055);text-align:center}
.zo-live-stats span{display:block;font-size:1.5rem;color:#153873;font-variant-numeric:tabular-nums}.zo-live-stats small{display:block;margin-top:4px;color:#738099;font-size:.8rem;text-transform:uppercase;letter-spacing:.12em}

/* Reaction / click / target games */
.zo-reaction-pad,.zo-click-pad{border:0!important;box-shadow:0 20px 44px rgba(29,58,119,.15),inset 0 1px 0 rgba(255,255,255,.28)!important;overflow:hidden;position:relative}
.zo-reaction-pad:before,.zo-click-pad:before{content:"";position:absolute;inset:-40% auto auto -20%;width:65%;height:180%;background:linear-gradient(100deg,rgba(255,255,255,.3),transparent);transform:rotate(20deg);pointer-events:none}
.zo-click-pad.is-hit{animation:zoHit .15s ease}
.zo-target{box-shadow:0 12px 28px rgba(255,73,102,.34),0 0 0 10px rgba(255,255,255,.34)!important;transition:transform .1s ease!important}
.zo-target:active{transform:scale(.86)!important}
.zo-target-area.is-miss{animation:zoMiss .22s ease}
.zo-stop-circle{border:10px solid rgba(255,255,255,.7)!important;box-shadow:0 24px 50px rgba(26,57,122,.16),inset 0 0 0 1px rgba(54,92,183,.12)!important;cursor:pointer}

/* Sorting feels more tangible */
.zo-sort-list{gap:12px!important}
.zo-sort-item{transition:transform .15s ease,box-shadow .15s ease!important;box-shadow:0 9px 22px rgba(29,58,119,.055)!important}
.zo-sort-item:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(29,58,119,.1)!important}
.zo-sort-item button{min-width:52px!important;min-height:50px!important}

/* Result screen */
.zo-result-screen{justify-content:center!important;text-align:center!important}
.zo-best-badge{display:inline-flex;align-items:center;justify-content:center;align-self:center;min-height:42px;padding:0 16px;border-radius:999px;background:linear-gradient(135deg,#fff3bd,#ffe083);color:#8a5d00;border:1px solid #f5d768;box-shadow:0 10px 22px rgba(218,168,35,.18);font-size:.95rem;letter-spacing:.02em;margin-bottom:4px}
.zo-score-big{text-shadow:0 8px 28px rgba(29,58,119,.10)}
.zo-publish{width:min(640px,100%)!important;padding:18px!important;border-radius:20px!important;background:rgba(255,255,255,.72)!important;border:1px solid #dce6f2!important;box-shadow:0 10px 24px rgba(29,58,119,.055)!important}
.zo-publish input{min-height:54px!important}

/* Friendly error state */
.zo-error-screen{justify-content:center!important;text-align:center!important}
.zo-error-icon{width:74px;height:74px;border-radius:24px;display:grid;place-items:center;margin:0 auto 4px;background:linear-gradient(135deg,#eef4ff,#f6efff);color:#3e5dd2;font-size:2rem;box-shadow:0 12px 28px rgba(29,58,119,.08)}
.zo-error{font-size:1.08rem;line-height:1.6;color:#5d6f88;max-width:700px;margin:0 auto}

/* Toast */
.zorelo-toast{position:fixed;left:50%;bottom:max(22px,env(safe-area-inset-bottom));transform:translate(-50%,18px);z-index:999999;max-width:min(520px,calc(100vw - 28px));padding:13px 18px;border-radius:16px;background:rgba(20,38,78,.94);color:#fff;box-shadow:0 16px 44px rgba(13,28,66,.28);opacity:0;pointer-events:none;transition:.22s ease;font-size:.95rem;backdrop-filter:blur(14px)}
.zorelo-toast.is-show{opacity:1;transform:translate(-50%,0)}
.zorelo-toast.is-good{background:rgba(18,113,81,.95)}

/* Lightweight celebration */
.zo-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:30}
.zo-confetti i{position:absolute;left:calc((var(--i) * 5.6%));top:-20px;width:9px;height:16px;border-radius:3px;background:linear-gradient(180deg,#ffd64d,#ff7b64);animation:zoConfetti 1.35s cubic-bezier(.25,.7,.25,1) forwards;animation-delay:calc((var(--i) % 5) * .035s);transform:rotate(calc(var(--i) * 22deg))}
.zo-confetti i:nth-child(3n){background:linear-gradient(180deg,#49d7ff,#5075ff)}
.zo-confetti i:nth-child(4n){background:linear-gradient(180deg,#56e3a2,#26b77d)}
.zo-confetti i:nth-child(5n){background:linear-gradient(180deg,#ff78be,#a85cff)}

/* App safe area / mobile */
@supports(padding:max(0px)){.zorelo-game-page-v14{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}}
@media(max-width:760px){
  .zorelo-game-toolbar{align-items:flex-start;flex-direction:column;padding-bottom:12px}.zorelo-game-toolbar-actions{width:100%}.zorelo-game-tool{flex:1;justify-content:center;min-width:0!important}
  .zo-intro-copy h2{font-size:2.5rem!important}.zo-intro-copy p{font-size:1.08rem!important}.zo-intro-chips{gap:6px}.zo-intro-chips span{font-size:.78rem;min-height:32px;padding:0 9px}
  .zo-start{width:100%;min-height:64px!important}.zo-actions>.zo-secondary,.zo-actions>a.zo-secondary{flex:1;min-width:145px;justify-content:center}
  .zo-live-stats{grid-template-columns:repeat(3,1fr);gap:7px}.zo-live-stats>div{padding:10px 6px}.zo-live-stats span{font-size:1.18rem}.zo-live-stats small{font-size:.68rem;letter-spacing:.06em}
}
@media(prefers-reduced-motion:reduce){
  .zorelo-game-page-v14 *, .zorelo-game-page-v14 *:before,.zorelo-game-page-v14 *:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}.zo-confetti{display:none!important}
}
@keyframes zoSpin{to{transform:rotate(360deg)}}
@keyframes zoHit{0%{transform:scale(1)}50%{transform:scale(.985)}100%{transform:scale(1)}}
@keyframes zoMiss{0%,100%{transform:translateX(0)}35%{transform:translateX(-5px)}70%{transform:translateX(5px)}}
@keyframes zoConfetti{0%{opacity:0;transform:translateY(-20px) rotate(0)}12%{opacity:1}100%{opacity:0;transform:translateY(620px) rotate(520deg)}}

/* Memory / visual / estimation families */
.zo-pattern-grid,.zo-sequence-grid,.zo-card-memory-grid,.zo-number-grid,.zo-color-grid{gap:12px!important}
.zo-pattern-cell,.zo-sequence-cell,.zo-card-memory,.zo-number-grid button{border-radius:17px!important;box-shadow:0 9px 22px rgba(29,58,119,.07)!important;transition:transform .12s ease,box-shadow .12s ease,background .12s ease!important}
.zo-pattern-cell:hover,.zo-sequence-cell:hover,.zo-card-memory:hover,.zo-number-grid button:hover{transform:translateY(-2px)!important;box-shadow:0 14px 28px rgba(29,58,119,.12)!important}
.zo-pattern-cell.flash,.zo-sequence-cell.active{box-shadow:0 0 0 7px rgba(61,100,230,.12),0 15px 30px rgba(35,75,180,.18)!important}
.zo-memory-number,.zo-memory-word{padding:20px 28px;border-radius:24px;background:rgba(255,255,255,.9);border:1px solid #dce6f2;box-shadow:0 16px 36px rgba(29,58,119,.08)}
.zo-compare-card,.zo-estimate-box,.zo-search-target{border-radius:24px!important;background:rgba(255,255,255,.9)!important;border:1px solid #dce6f2!important;box-shadow:0 14px 32px rgba(29,58,119,.075)!important}
.zo-compare-value{font-variant-numeric:tabular-nums}

/* Precision games */
.zo-point-area,.zo-line-stage,.zo-color-stage,.zo-mover-stage,.zo-target-area{border-radius:28px!important;border:1px solid #d7e4f1!important;background:linear-gradient(145deg,#f7fbff,#eaf2ff)!important;box-shadow:inset 0 1px 0 #fff,0 16px 36px rgba(28,57,120,.08)!important;overflow:hidden!important}
.zo-point-area:after,.zo-line-stage:after,.zo-color-stage:after,.zo-mover-stage:after,.zo-target-area:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 80% 15%,rgba(255,255,255,.65),transparent 30%)}
.zo-mover-target,.zo-line-marker{filter:drop-shadow(0 8px 14px rgba(20,48,112,.22))}

/* Polls / decision games */
.zo-poll-options,.zo-duel,.zo-option-grid,.zo-choice-grid{gap:14px!important}
.zo-poll-option{min-height:170px!important;padding:22px!important;font-size:1.25rem!important;background:linear-gradient(145deg,#fff,#f7f9ff)!important}
.zo-poll-result{gap:14px!important}.zo-poll-result>div{border-radius:22px!important;background:linear-gradient(145deg,#fff,#f6f9ff)!important;border:1px solid #dce5f1!important;box-shadow:0 12px 28px rgba(29,58,119,.07)!important}
.zo-poll-result>div>span{font-size:2.2rem!important;font-variant-numeric:tabular-nums}

/* Typing / text input games */
.zo-typing-text,.zo-flawless-sentence{border-radius:22px!important;background:rgba(255,255,255,.92)!important;border:1px solid #dce6f2!important;box-shadow:0 14px 32px rgba(29,58,119,.07)!important;line-height:1.75!important}
.zo-typing-input,.zo-alpha-input,.zo-answer-input,.zo-number-input{border-radius:18px!important;background:#fff!important;box-shadow:0 10px 24px rgba(29,58,119,.055)!important;transition:border-color .15s ease,box-shadow .15s ease!important}
.zo-typing-input:focus,.zo-alpha-input:focus,.zo-answer-input:focus,.zo-number-input:focus{box-shadow:0 0 0 6px rgba(53,94,224,.09),0 14px 30px rgba(29,58,119,.07)!important}

/* Visual reveal / flags */
.zo-reveal-emoji,.zo-flag{filter:drop-shadow(0 12px 24px rgba(29,58,119,.12));transform:translateZ(0)}
.zo-clue-stack{gap:10px!important}.zo-clue{border-radius:17px!important;background:#fff!important;border:1px solid #dce6f2!important}
