:root{--app-height: 100vh;--color-bg: #1a2634;--color-primary: #c0392b;--color-accent: #f1c40f;--color-gold: #f39c12;--color-surface: rgba(22, 33, 48, .82);--color-border: rgba(255, 255, 255, .18);--color-text: #ffffff;--color-text-dim: #b2bec3;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-cartoon: "Lilita One", "Fredoka", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}html,body{width:100%;height:100%;height:var(--app-height, 100dvh);min-height:-webkit-fill-available;overflow:hidden;position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--color-bg);font-family:var(--font-family);touch-action:none}#app{width:100%;width:100vw;height:100%;height:var(--app-height, 100dvh);min-height:-webkit-fill-available;position:relative;overflow:hidden}canvas{position:absolute;top:0;left:0;width:100%!important;height:100%!important;display:block}.game-ui-layer{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;height:var(--app-height, 100dvh);pointer-events:none;display:flex;flex-direction:column;justify-content:space-between;z-index:10;padding:max(14px,env(safe-area-inset-top,14px)) max(16px,env(safe-area-inset-right,16px)) max(14px,env(safe-area-inset-bottom,14px)) max(16px,env(safe-area-inset-left,16px))}.game-ui-header{display:flex;justify-content:space-between;align-items:flex-start;width:100%;padding:8px 12px;pointer-events:none;position:relative;z-index:20;transition:opacity .3s ease}.game-ui-header.fade-out{opacity:0;pointer-events:none}.game-reset-btn{pointer-events:auto;position:relative;display:inline-flex;align-items:center;justify-content:center;background:#082138;border:2.5px solid #041220;border-radius:20px;padding:0 0 5px;cursor:pointer;outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;box-shadow:0 8px 20px #00000073,0 2px 4px #0000004d;transition:transform .12s cubic-bezier(.2,.8,.4,1),box-shadow .12s ease,filter .15s ease;user-select:none;-webkit-user-select:none}.game-reset-btn .reset-btn-inner{position:relative;display:flex;align-items:center;gap:6px;padding:7px 11px 7px 8px;border-radius:17px;background:linear-gradient(180deg,#38bdf8,#0284c7 46%,#0369a1);border:1.5px solid rgba(255,255,255,.4);box-shadow:inset 0 2px 1px #ffffffa6,inset 0 -2px 2px #00000059;overflow:hidden;min-height:44px}.game-reset-btn .reset-btn-gloss{position:absolute;top:0;left:0;right:0;height:48%;background:linear-gradient(180deg,#ffffff73,#ffffff0d);border-radius:16px 16px 36px 36px/16px 16px 10px 10px;pointer-events:none}.game-reset-btn .reset-icon-box{width:24px;height:24px;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;filter:drop-shadow(0 2px 3px rgba(0,0,0,.4));transition:transform .25s cubic-bezier(.34,1.56,.64,1)}.game-reset-btn .reset-icon-svg{width:100%;height:100%;display:block}.game-reset-btn .reset-btn-text{font-family:var(--font-cartoon);font-size:13.5px;font-weight:800;color:#fff;letter-spacing:.2px;text-transform:uppercase;line-height:1;text-shadow:0 2px 0 #052a48,0 3px 5px rgba(0,0,0,.55);-webkit-text-stroke:.5px rgba(4,25,45,.6);position:relative;z-index:1;display:inline-block;transform:scaleX(.88);transform-origin:left center;margin-right:-4px}.game-reset-btn:hover{filter:brightness(1.08)}.game-reset-btn:hover .reset-icon-box{transform:rotate(-35deg) scale(1.08)}.game-reset-btn:active{transform:translateY(4px);padding-bottom:1px;box-shadow:0 2px 6px #0006;filter:brightness(.96)}.game-reset-btn:active .reset-icon-box{transform:rotate(-180deg) scale(.92)}.game-header-left{display:flex;align-items:center;gap:8px;pointer-events:auto}.game-audio-btn{pointer-events:auto;position:relative;display:inline-flex;align-items:center;justify-content:center;background:#082138;border:2.5px solid #041220;border-radius:20px;padding:0 0 5px;cursor:pointer;outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;box-shadow:0 8px 20px #00000073,0 2px 4px #0000004d;transition:transform .12s cubic-bezier(.2,.8,.4,1),box-shadow .12s ease,filter .15s ease;user-select:none;-webkit-user-select:none}.game-audio-btn .audio-btn-inner{position:relative;display:flex;align-items:center;justify-content:center;width:44px;min-height:44px;border-radius:17px;background:linear-gradient(180deg,#38bdf8,#0284c7 46%,#0369a1);border:1.5px solid rgba(255,255,255,.4);box-shadow:inset 0 2px 1px #ffffffa6,inset 0 -2px 2px #00000059;overflow:hidden}.game-audio-btn.muted .audio-btn-inner{background:linear-gradient(180deg,#64748b,#475569 46%,#334155);border:1.5px solid rgba(255,255,255,.25);box-shadow:inset 0 2px 1px #ffffff59,inset 0 -2px 2px #00000080}.game-audio-btn .audio-btn-gloss{position:absolute;top:0;left:0;right:0;height:48%;background:linear-gradient(180deg,#ffffff73,#ffffff0d);border-radius:16px 16px 36px 36px/16px 16px 10px 10px;pointer-events:none}.game-audio-btn .audio-icon-box{width:24px;height:24px;display:flex;align-items:center;justify-content:center;position:relative;filter:drop-shadow(0 2px 3px rgba(0,0,0,.4));transition:transform .2s cubic-bezier(.34,1.56,.64,1)}.game-audio-btn .audio-icon-svg{width:100%;height:100%;display:block}.game-audio-btn:hover{filter:brightness(1.08)}.game-audio-btn:hover .audio-icon-box{transform:scale(1.12)}.game-audio-btn:active{transform:translateY(4px);padding-bottom:1px;box-shadow:0 2px 6px #0006;filter:brightness(.96)}.game-audio-btn:active .audio-icon-box{transform:scale(.92)}.game-timer-card{pointer-events:auto;position:relative;display:inline-flex;flex-direction:column;align-items:center;background:#3e1603;border:2.5px solid #230b01;border-radius:20px;padding:0 0 5px;box-shadow:0 8px 24px #00000085,0 2px 6px #00000059;user-select:none;-webkit-user-select:none;font-family:var(--font-cartoon);transition:transform .25s cubic-bezier(.34,1.56,.64,1),filter .2s ease,box-shadow .2s ease,background .2s ease}.game-timer-card .timer-plate{position:relative;display:flex;align-items:center;gap:10px;background:linear-gradient(180deg,#ffca28,#ff9800 45%,#e65100);padding:6px 14px 6px 10px;border-radius:17px;border:1.5px solid rgba(255,255,255,.45);box-shadow:inset 0 2px 1px #ffffffa6,inset 0 -2px 3px #00000059;overflow:visible}.game-timer-card .timer-clock-badge{width:32px;height:32px;display:flex;align-items:center;justify-content:center;flex-shrink:0;filter:drop-shadow(0 3px 4px rgba(0,0,0,.35))}.game-timer-card .timer-clock-svg{width:100%;height:100%;display:block}.game-timer-card .timer-digits-container{background:linear-gradient(180deg,#241432,#12091c);border:1.5px solid rgba(255,215,0,.55);box-shadow:inset 0 2px 5px #000000d9,0 1px 2px #ffffff4d;border-radius:11px;padding:3px 12px;display:flex;align-items:center;justify-content:center}.game-timer-card .timer-digits{font-family:var(--font-cartoon);font-size:28px;font-weight:900;letter-spacing:1.6px;color:#fffbdf;font-variant-numeric:tabular-nums;line-height:1;background:linear-gradient(180deg,#fff,#fff59d 40%,#ffca28 75%,#ff9800);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 0 #7b2900) drop-shadow(0 3px 5px rgba(0,0,0,.55))}.game-timer-card .timer-sugar-glint{position:absolute;top:4px;right:8px;font-size:10px;color:#fff;filter:drop-shadow(0 0 3px #ffffff);animation:sparkle-twinkle 1.8s infinite alternate ease-in-out;pointer-events:none}.game-timer-card.waiting{filter:drop-shadow(0 0 10px rgba(241,196,15,.3))}.game-timer-card.running{filter:drop-shadow(0 0 12px rgba(255,152,0,.4))}.game-timer-card.urgent{background:#5c0b0b;border-color:#380404;box-shadow:0 8px 28px #e74c3ca6,0 0 20px #ff4b2b8c;animation:cartoon-timer-urgent .65s cubic-bezier(.25,1.25,.5,1) infinite alternate}.game-timer-card.urgent .timer-plate{background:linear-gradient(180deg,#ff5252,#ff1744 40%,#d50000)}.game-timer-card.urgent .timer-digits{background:linear-gradient(180deg,#fff,#ffeb3b 30%,#ff5252 80%,#d50000);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 0 #6e0000) drop-shadow(0 4px 8px rgba(255,23,68,.85))}@keyframes cartoon-timer-urgent{0%{transform:scale(1) rotate(0)}50%{transform:scale(1.04) rotate(1.2deg)}to{transform:scale(1.06) rotate(-1.2deg)}}@keyframes sparkle-twinkle{0%{opacity:.3;transform:scale(.8) rotate(0)}50%{opacity:1;transform:scale(1.25) rotate(18deg)}to{opacity:.4;transform:scale(.85) rotate(-12deg)}}@media (max-height: 480px){.game-ui-header{padding:6px 10px}.game-reset-btn .reset-btn-inner{min-height:38px;padding:5px 9px 5px 7px;gap:5px}.game-reset-btn .reset-icon-box{width:20px;height:20px}.game-reset-btn .reset-btn-text{font-size:12px;transform:scaleX(.86);margin-right:-4px}.game-timer-card .timer-plate{padding:4px 11px 4px 8px;gap:7px}.game-timer-card .timer-clock-badge{width:27px;height:27px}.game-timer-card .timer-digits-container{padding:2px 9px}.game-timer-card .timer-digits{font-size:23px}}.game-controls-hint{position:absolute;top:74px;left:50%;transform:translate(-50%);background:#0f1823bf;border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--color-text-dim);font-size:12px;padding:6px 16px;border-radius:20px;pointer-events:none;transition:opacity 1s ease;white-space:nowrap}.game-controls-hint.fade-out{opacity:0}.touch-joystick-zone{position:absolute;left:0;top:0;bottom:0;width:50vw;height:100%;height:var(--app-height, 100dvh);z-index:10;pointer-events:auto;touch-action:none;transition:opacity .8s ease}.touch-joystick-zone.fade-out{opacity:0;pointer-events:none}.touch-joystick-base{position:absolute;left:max(28px,calc(20px + env(safe-area-inset-left,0px)));bottom:max(28px,calc(20px + env(safe-area-inset-bottom,0px)));width:106px;height:106px;border-radius:50%;background:radial-gradient(circle,#ffffff14,#141c26a6);border:2px solid rgba(255,255,255,.3);box-shadow:0 4px 18px #00000059;pointer-events:none;opacity:.85;display:flex;align-items:center;justify-content:center;transition:border-color .2s ease,opacity .2s ease,box-shadow .2s ease}.touch-joystick-base.active{opacity:1;border-color:#f1c40fcc;box-shadow:0 0 22px #f1c40f59}.touch-joystick-stick{position:absolute;width:50px;height:50px;border-radius:50%;background:radial-gradient(circle,#ffffff59,#f39c12e6 65%,#d35400f2);border:2px solid rgba(255,255,255,.9);box-shadow:0 4px 12px #00000073;will-change:transform}.game-actions-container{position:absolute;right:max(32px,calc(24px + env(safe-area-inset-right,0px)));bottom:max(27px,calc(19px + env(safe-area-inset-bottom,0px)));display:flex;align-items:center;gap:24px;z-index:10;pointer-events:none;transition:opacity .8s ease}.game-actions-container.fade-out{opacity:0;pointer-events:none}.game-action-circle-btn{width:97.2px;height:97.2px;margin:5.4px;flex-shrink:0;border-radius:50%;background:transparent;border:none;padding:0;outline:none;-webkit-tap-highlight-color:transparent;display:flex;align-items:center;justify-content:center;box-shadow:none;cursor:pointer;user-select:none;-webkit-user-select:none;touch-action:manipulation;pointer-events:auto;transition:transform .12s ease,filter .15s ease;filter:drop-shadow(0 6px 16px rgba(0,0,0,.45))}.game-action-circle-btn img{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.game-action-circle-btn:active{transform:scale(.92);filter:drop-shadow(0 2px 6px rgba(0,0,0,.5)) brightness(1.15)}.btn-action-jump:active{transform:translateY(-2px) scale(.92);filter:drop-shadow(0 0 14px rgba(46,204,113,.75)) drop-shadow(0 2px 6px rgba(0,0,0,.5)) brightness(1.15)}.game-action-circle-btn.active{animation:dance-btn-pulse 1.2s infinite alternate ease-in-out}.game-action-circle-btn.active:active{transform:scale(.98)}@keyframes dance-btn-pulse{0%{transform:scale(1);filter:drop-shadow(0 0 10px rgba(241,196,15,.55)) drop-shadow(0 4px 12px rgba(0,0,0,.45))}to{transform:scale(1.08);filter:drop-shadow(0 0 22px rgba(241,196,15,.95)) drop-shadow(0 4px 16px rgba(0,0,0,.5))}}.orientation-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:99999;background:#0f1722f5;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);display:none;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center}@media (orientation: portrait){.orientation-overlay{display:flex}}.orientation-card{max-width:340px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff}.phone-rotate-icon{width:84px;height:84px;color:#f1c40f;margin-bottom:24px;animation:rotate-phone 2.2s ease-in-out infinite alternate}@keyframes rotate-phone{0%{transform:rotate(0)}35%{transform:rotate(0)}75%{transform:rotate(-90deg)}to{transform:rotate(-90deg)}}.orientation-card h2{font-size:26px;font-weight:900;letter-spacing:1.2px;color:#f1c40f;text-transform:uppercase;text-align:center}.game-modal-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#0a1018b3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;z-index:30;pointer-events:auto;opacity:1;transition:opacity .35s ease;padding:20px}.game-modal-overlay.hidden{opacity:0;pointer-events:none}.game-modal-card{background:#1a2634f2;border:1px solid rgba(241,196,15,.4);box-shadow:0 20px 50px #0009;border-radius:20px;max-width:380px;width:100%;padding:28px 24px;text-align:center;color:var(--color-text);animation:pop-in .3s cubic-bezier(.175,.885,.32,1.275)}@keyframes pop-in{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.modal-badge{display:inline-block;font-size:11px;font-weight:700;color:var(--color-gold);background:#f39c1226;border:1px solid rgba(243,156,18,.3);padding:4px 10px;border-radius:12px;margin-bottom:12px;text-transform:uppercase;letter-spacing:.8px}.game-modal-card h2{font-size:22px;font-weight:800;margin-bottom:10px;color:#fff}.game-modal-card p{font-size:14px;line-height:1.5;color:var(--color-text-dim);margin-bottom:22px}.modal-action-btn{width:100%;min-height:48px;background:linear-gradient(135deg,#c0392b,#e74c3c);border:none;border-radius:12px;color:#fff;font-size:16px;font-weight:700;cursor:pointer;box-shadow:0 8px 20px #c0392b66;transition:transform .15s ease,filter .15s ease}.modal-action-btn:active{transform:scale(.96);filter:brightness(1.1)}.final-screen-overlay{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;height:var(--app-height, 100dvh);background-color:#040912;display:flex;align-items:center;justify-content:center;z-index:1000;pointer-events:auto;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s ease;overflow:hidden;touch-action:none}.final-screen-overlay.visible{opacity:1;visibility:visible}.final-screen-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}.final-screen-img{width:100%;height:100%;max-width:100vw;max-height:100%;max-height:var(--app-height, 100dvh);object-fit:contain;object-position:center center;display:block;user-select:none;-webkit-user-select:none;pointer-events:none;transform:translateZ(0)}.timeout-banner-overlay{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;height:var(--app-height, 100dvh);background:radial-gradient(ellipse at center,#0c182ad9,#040910f2);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;pointer-events:auto;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease;overflow:hidden;touch-action:none}.timeout-banner-overlay.visible{opacity:1;visibility:visible}.timeout-banner-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}.timeout-banner-content{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px 36px;animation:cartoon-timeout-pop .45s cubic-bezier(.175,.885,.32,1.35) forwards}@keyframes cartoon-timeout-pop{0%{transform:scale(.35) rotate(-5deg);opacity:0}60%{transform:scale(1.08) rotate(1.5deg);opacity:1}80%{transform:scale(.97) rotate(-.5deg)}to{transform:scale(1) rotate(0);opacity:1}}.timeout-badge-wrap{margin-bottom:12px}.timeout-badge{font-family:var(--font-cartoon);font-size:clamp(12px,2.2vw,17px);font-weight:800;letter-spacing:2px;color:#082138;background:linear-gradient(180deg,#ffe082,#f1c40f);border:2px solid #ffffff;box-shadow:0 4px 12px #00000073,0 0 20px #f1c40f66;padding:6px 20px;border-radius:20px;text-transform:uppercase;display:inline-block}.timeout-title-wrap{position:relative;display:inline-block;padding:6px 16px}.timeout-title-main{font-family:var(--font-cartoon);font-size:clamp(38px,8.5vw,76px);font-weight:900;letter-spacing:3px;line-height:1.05;text-transform:uppercase;color:#fff9e6;background:linear-gradient(180deg,#fff,#fff176,#ff9f43 70%,#ee5253);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 4px 0 #b71540) drop-shadow(0 8px 0 #7b001d) drop-shadow(0 12px 0 #051424) drop-shadow(0 16px 30px rgba(0,0,0,.8));margin:0}.game-loading-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;height:var(--app-height, 100dvh);background:radial-gradient(ellipse at 50% 35%,#0e2242,#050e1f);display:flex;align-items:center;justify-content:center;z-index:1600;pointer-events:auto;opacity:1;transition:opacity .35s ease,visibility .35s ease;padding:16px}.game-loading-overlay.fade-out,.game-loading-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}.game-loading-card{background:#0d1b31e0;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(241,196,15,.32);border-radius:20px;padding:32px 28px;max-width:480px;width:100%;text-align:center;box-shadow:0 20px 50px #000000a6,0 0 30px #f1c40f1f;animation:pop-in .35s cubic-bezier(.175,.885,.32,1.275)}.loading-badge{display:inline-block;font-size:10px;font-weight:700;color:#f1c40f;background:#f1c40f1f;border:1px solid rgba(241,196,15,.35);padding:4px 12px;border-radius:12px;margin-bottom:14px;letter-spacing:1.2px;text-transform:uppercase}.loading-title{font-size:20px;font-weight:800;color:#fff;letter-spacing:.5px;margin-bottom:8px;background:linear-gradient(135deg,#fff 40%,#ffd97d);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.loading-status{font-size:14px;color:#d1d8e0;margin-bottom:22px;font-weight:500}.loading-bar-wrapper{width:100%;height:12px;background:#00000073;border-radius:8px;border:1px solid rgba(255,255,255,.14);overflow:hidden;position:relative;margin-bottom:10px}.loading-bar-fill{height:100%;background:linear-gradient(90deg,#f1c40f,#e67e22);border-radius:8px;box-shadow:0 0 14px #f1c40fb3;transition:width .18s ease-out}.loading-meta{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#a4b0be}.loading-detail{max-width:78%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}.loading-percent{font-weight:700;color:#f1c40f}.loading-error{margin-top:18px;padding:12px;background:#c0392b40;border:1px solid rgba(231,76,60,.4);border-radius:12px}.loading-error.hidden,.hidden{display:none!important}.loading-error-msg{font-size:12px;color:#ff7675;margin-bottom:10px}.loading-retry-btn{background:#c0392b;border:none;color:#fff;padding:6px 16px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer}.flow-placeholder-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;height:var(--app-height, 100dvh);background:radial-gradient(circle at center,#0a1832f0,#040c1afa);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:90;padding:20px;opacity:1;visibility:visible;transition:opacity .3s ease,visibility .3s ease}.flow-placeholder-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}.flow-placeholder-card{background:linear-gradient(180deg,#18283f,#0d1726);border:2px solid rgba(241,196,15,.35);box-shadow:0 16px 40px #000000a6,0 0 24px #f1c40f26;border-radius:24px;padding:26px 28px;max-width:540px;width:100%;text-align:center;color:#fff;display:flex;flex-direction:column;align-items:center;gap:14px;animation:cardFadeIn .3s cubic-bezier(.16,1,.3,1)}@keyframes cardFadeIn{0%{opacity:0;transform:scale(.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}.flow-card-arch-badge{font-family:var(--font-cartoon);font-size:11px;letter-spacing:.8px;color:#ff9f43;background:#ff9f4326;border:1px solid rgba(255,159,67,.35);padding:4px 12px;border-radius:12px;text-transform:uppercase}.flow-card-phase-badge{font-size:12px;font-weight:700;color:#54a0ff;letter-spacing:.5px}.flow-card-title{font-family:var(--font-cartoon);font-size:26px;color:#fff9e6;text-shadow:0 2px 8px rgba(0,0,0,.5);line-height:1.2}.flow-card-body{width:100%}.flow-placeholder-p{font-size:15px;line-height:1.5;color:#dcdde1;margin-bottom:12px}.flow-placeholder-note{font-size:12px;color:#a4b0be;background:#00000040;padding:8px 14px;border-radius:10px;margin-top:8px;border-left:3px solid #f1c40f}.flow-placeholder-stats{background:#ffffff0f;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:10px 16px;font-size:14px;color:#f5f6fa;margin:10px 0;display:flex;flex-direction:column;gap:4px;text-align:left}.flow-card-actions{display:flex;flex-direction:column;gap:10px;width:100%;margin-top:10px}.flow-btn{font-family:var(--font-cartoon);font-size:15px;padding:12px 20px;border-radius:16px;cursor:pointer;border:none;transition:transform .15s ease,box-shadow .15s ease;display:flex;align-items:center;justify-content:center;gap:8px}.flow-btn:active{transform:scale(.97)}.flow-btn-primary{background:linear-gradient(180deg,#ff9f43,#ee5253);color:#fff;box-shadow:0 4px 14px #ee525373;border:2px solid #ffbe76}.flow-btn-secondary{background:#ffffff17;color:#c8d6e5;border:1px solid rgba(255,255,255,.2)}.flow-btn-secondary:hover{background:#ffffff26;color:#fff}.character-select-overlay{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100%;height:var(--app-height, 100dvh);z-index:1500;display:flex;align-items:center;justify-content:center;overflow:hidden;background:url(/assets/pantallas/background_menu.webp) center center / cover no-repeat,#050e1f;transition:opacity .35s ease,visibility .35s ease}.character-select-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}.character-select-overlay.fade-out{opacity:0;pointer-events:none;transition:opacity .25s ease-out}.char-select-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 50%,#050e1f33,#050e1fa6);pointer-events:none}.char-select-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:space-between;width:100%;height:100%;max-width:1200px;padding:clamp(8px,2vh,18px) clamp(10px,2.5vw,28px);box-sizing:border-box}.char-select-header{text-align:center;flex-shrink:0;margin-top:clamp(2px,1vh,8px);margin-bottom:clamp(2px,1vh,6px);animation:charHeaderDrop .4s cubic-bezier(.16,1,.3,1)}@keyframes charHeaderDrop{0%{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}.char-select-title{font-family:var(--font-cartoon);font-size:clamp(24px,5.8vh,38px);color:#fffdf5;text-shadow:0 3px 0 #182c4d,0 6px 14px rgba(0,0,0,.85);letter-spacing:2px;line-height:1.1;margin:0}.char-cards-grid{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:clamp(14px,3.2vw,42px);width:100%;flex:1;min-height:0;padding:clamp(8px,2vh,20px) 0;perspective:1200px}.char-card{position:relative;height:clamp(220px,62vh,360px);aspect-ratio:3 / 4;border-radius:clamp(16px,3vh,24px);border:2.5px solid rgba(255,255,255,.25);box-shadow:0 8px 24px #0000008c,inset 0 1px #fff3;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:#091322;cursor:pointer;outline:none;transform:scale(1) translateY(0);transition:transform .4s cubic-bezier(.34,1.56,.64,1),box-shadow .35s ease,border-color .35s ease,opacity .35s ease,filter .35s ease;flex-shrink:0}.char-card:hover:not(.selected){border-color:#f1c40f99;box-shadow:0 10px 28px #000000a6,0 0 16px #f1c40f4d;transform:translateY(-2px)}.char-card:active:not(.selected){transform:scale(.96)}.char-card.selected{transform:scale(1.305) translateY(-8px)!important;border:4px solid #f1c40f!important;box-shadow:0 22px 52px #000000e6,0 0 36px #f1c40fcc,inset 0 0 16px #f1c40f4d!important;z-index:50!important}.char-cards-grid.has-selection .char-card:not(.selected){transform:scale(.92) translateY(6px);opacity:.72;filter:brightness(.8) saturate(.85);z-index:5}.char-cards-grid.has-selection .char-card:not(.selected):hover{opacity:.95;transform:scale(.96) translateY(2px);filter:brightness(.95) saturate(1);cursor:pointer}.char-card-inner{position:relative;width:100%;height:100%;border-radius:inherit;overflow:hidden;will-change:transform}.char-card[data-char=bego] .char-card-inner{animation:charFloatBego 4.6s ease-in-out infinite}.char-card[data-char=ibai] .char-card-inner{animation:charFloatIbai 5.2s ease-in-out -1.7s infinite}.char-card[data-char=aritz] .char-card-inner{animation:charFloatAritz 4.9s ease-in-out -3.3s infinite}@keyframes charFloatBego{0%,to{transform:translateY(0) rotate(0) rotateY(0)}25%{transform:translateY(-4px) rotate(-.9deg) rotateY(-1.2deg)}75%{transform:translateY(3.5px) rotate(.7deg) rotateY(1deg)}}@keyframes charFloatIbai{0%,to{transform:translateY(0) rotate(0) rotateY(0)}25%{transform:translateY(3.5px) rotate(.8deg) rotateY(1.1deg)}75%{transform:translateY(-4px) rotate(-.7deg) rotateY(-1deg)}}@keyframes charFloatAritz{0%,to{transform:translateY(0) rotate(0) rotateY(0)}25%{transform:translateY(-3.5px) rotate(.9deg) rotateY(-1.1deg)}75%{transform:translateY(4px) rotate(-.8deg) rotateY(1.2deg)}}.char-card-media{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border-radius:inherit;overflow:hidden;background:#091322}.char-video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s ease;will-change:opacity}.char-video.is-active{opacity:1}.char-card-flash{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:radial-gradient(circle at 50% 50%,#fff,#fffffff2 55%,#fff9);opacity:0;pointer-events:none;z-index:6;mix-blend-mode:screen}@keyframes charWhiteFlash{0%{opacity:0;transform:scale(.98)}25%{opacity:.95;transform:scale(1.01)}55%{opacity:.7}to{opacity:0;transform:scale(1)}}.char-card-flash.flashing{animation:charWhiteFlash .32s cubic-bezier(.16,1,.3,1) forwards}.char-card-bottom-ui{position:absolute;bottom:0;left:0;right:0;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:clamp(14px,2.8vh,22px);padding:clamp(28px,6vh,46px) 8px clamp(10px,1.8vh,16px) 8px;background:linear-gradient(to top,rgba(5,14,31,.98) 0%,rgba(5,14,31,.85) 45%,rgba(5,14,31,.35) 80%,transparent 100%);pointer-events:none}.char-card-play-btn{font-family:var(--font-cartoon);font-size:clamp(18px,3.8vh,25px);font-weight:900;letter-spacing:2.5px;text-transform:uppercase;color:#fff;background:linear-gradient(180deg,#ffe100,#ff9800 45%,#ff4500 85%,#d63031);border:3px solid #ffffff;border-radius:26px;padding:clamp(6px,1.4vh,9px) clamp(22px,4vw,36px);margin-bottom:clamp(12px,2.6vh,22px);box-shadow:0 0 0 2.5px #121c2b,0 6px #7a1208,0 8.5px #121c2b,0 12px 24px #000000bf,inset 0 2.5px #ffffffb3,inset 0 -2.5px #0000004d;cursor:pointer;outline:none;opacity:0;visibility:hidden;transform:translateY(14px) scale(.85);pointer-events:none;transition:opacity .25s ease,transform .3s cubic-bezier(.34,1.56,.64,1),visibility .25s ease,filter .15s ease;line-height:1}.char-card.selected .char-card-play-btn{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0) scale(1);animation:brawlPopIn .35s cubic-bezier(.175,.885,.32,1.275) forwards,brawlPulse 2s .35s infinite ease-in-out}@keyframes brawlPopIn{0%{opacity:0;transform:translateY(16px) scale(.75)}70%{opacity:1;transform:translateY(-4px) scale(1.06)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes brawlPulse{0%,to{transform:scale(1);box-shadow:0 0 0 2.5px #121c2b,0 6px #7a1208,0 8.5px #121c2b,0 12px 24px #000000bf,inset 0 2.5px #ffffffb3,inset 0 -2.5px #0000004d}50%{transform:scale(1.05) translateY(-2px);box-shadow:0 0 0 2.5px #121c2b,0 8px #7a1208,0 10.5px #121c2b,0 16px 28px #ff6b0099,inset 0 2.5px #ffffffd9,inset 0 -2.5px #0000004d}}.char-card-play-btn:hover{filter:brightness(1.1);transform:scale(1.06) translateY(-3px)}.char-card-play-btn:active{transform:translateY(4px) scale(.96)!important;box-shadow:0 0 0 2.5px #121c2b,0 2px #7a1208,0 4px #121c2b,0 6px 12px #0009,inset 0 1px #fff6,inset 0 -2px #0006!important;animation:none!important}.char-play-text{display:inline-block;line-height:1;text-shadow:0 2.5px 0 #5f0f06,-1.5px 0 0 #5f0f06,1.5px 0 0 #5f0f06,0 -1.5px 0 #5f0f06,-1.5px 1.5px 0 #5f0f06,1.5px 1.5px 0 #5f0f06,0 5px 10px rgba(0,0,0,.85);filter:drop-shadow(0 2px 3px rgba(0,0,0,.5))}.char-card-name-plate{display:flex;align-items:center;justify-content:center;pointer-events:none}.char-card-name{font-family:var(--font-cartoon);font-size:clamp(16px,3.6vh,24px);color:#fff;letter-spacing:2px;text-shadow:0 2px 0 #07111e,0 4px 10px rgba(0,0,0,.9);line-height:1.1;transition:color .3s ease,text-shadow .3s ease}.char-card.selected .char-card-name{color:#ffeaa7;font-size:clamp(17px,3.8vh,26px);text-shadow:0 3px 0 #8c5200,0 0 16px rgba(254,202,87,.9),0 5px 14px rgba(0,0,0,.95)}@media (max-height: 400px){.char-select-content{padding:3px 10px}.char-select-header{margin-top:2px;margin-bottom:0}.char-select-title{font-size:20px}.char-cards-grid{gap:12px;padding:2px 0}.char-card{height:clamp(190px,58vh,240px)}.char-card.selected{transform:scale(1.278) translateY(-6px)!important}.char-cards-grid.has-selection .char-card:not(.selected){transform:scale(.92) translateY(6px)!important}.char-card-name{font-size:14px}.char-card-bottom-ui{gap:8px;padding-bottom:6px}.char-card-play-btn{padding:4px 20px;font-size:15px;margin-bottom:6px}}.intro-overlay{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100%;height:var(--app-height, 100dvh);background-color:#000;z-index:2000;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:manipulation}.intro-overlay.hidden{display:none!important}.intro-start-screen{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;background-color:#000;display:flex;align-items:center;justify-content:center;z-index:10}.intro-start-screen.hidden{display:none!important}.intro-start-btn{background:#f1c40f14;border:3px solid #f1c40f;border-radius:14px;outline:none;font-family:var(--font-family);font-size:26px;font-weight:900;letter-spacing:1.5px;color:#f1c40f;text-transform:uppercase;text-align:center;cursor:pointer;padding:18px 48px;min-width:240px;display:inline-flex;align-items:center;justify-content:center;user-select:none;-webkit-user-select:none;touch-action:manipulation;box-shadow:0 0 20px #f1c40f38,inset 0 0 12px #f1c40f14;transition:transform .12s ease,background .15s ease,box-shadow .15s ease}.intro-start-btn:hover{background:#f1c40f29;box-shadow:0 0 28px #f1c40f66}.intro-start-btn:active{transform:scale(.96);background:#f1c40f40;box-shadow:0 0 16px #f1c40f4d}.intro-video-wrapper{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;background-color:#000;display:flex;align-items:center;justify-content:center;overflow:hidden;z-index:20}.intro-video-wrapper.hidden{display:none!important}.intro-video{width:100%;height:100%;object-fit:contain;background-color:#000;display:block}.intro-skip-btn{position:absolute;right:28px;bottom:24px;right:max(28px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));background:transparent;border:none;outline:none;color:#fff;font-family:Arial,Helvetica Neue,Helvetica,sans-serif;font-size:16px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;padding:14px 22px;z-index:30;user-select:none;-webkit-user-select:none;touch-action:manipulation;transition:opacity .15s ease}.intro-skip-btn:active{opacity:.55}.greeting-overlay{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100%;height:var(--app-height, 100dvh);background-color:#000;z-index:2000;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:manipulation}.greeting-overlay.hidden{display:none!important}.greeting-video-wrapper{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;background-color:#000;display:flex;align-items:center;justify-content:center;overflow:hidden;z-index:10}.greeting-video-wrapper.hidden{display:none!important}.greeting-video{width:100%;height:100%;max-width:100vw;max-height:100%;max-height:var(--app-height, 100dvh);object-fit:contain;object-position:center center;background-color:#000;display:block}.greeting-end-screen{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;background:#00000073;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;z-index:20;animation:greetingFadeIn .35s ease forwards}.greeting-end-screen.hidden{display:none!important}@keyframes greetingFadeIn{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.greeting-restart-btn{background:#f1c40f14;border:3px solid #f1c40f;border-radius:14px;outline:none;font-family:var(--font-family);font-size:26px;font-weight:900;letter-spacing:1.5px;color:#f1c40f;text-transform:uppercase;text-align:center;cursor:pointer;padding:18px 48px;min-width:240px;display:inline-flex;align-items:center;justify-content:center;user-select:none;-webkit-user-select:none;touch-action:manipulation;box-shadow:0 0 20px #f1c40f38,inset 0 0 12px #f1c40f14;transition:transform .12s ease,background .15s ease,box-shadow .15s ease}.greeting-restart-btn:hover{background:#f1c40f29;box-shadow:0 0 28px #f1c40f66}.greeting-restart-btn:active{transform:scale(.96);background:#f1c40f40;box-shadow:0 0 16px #f1c40f4d}
