:root{--pink-50:#fff0f7;--pink-100:#ffd9ec;--pink-200:#ffb3d1;--pink-300:#ff8fb8;--pink-500:#ff5fa2;--pink-700:#d63384;--blue-100:#cfe9ff;--blue-300:#8ec5ff;--mint:#c7f5d9;--mint-700:#2f9e6b;--lemon:#ffe5a8;--lemon-700:#d49b00;--lavender:#e2cffc;--peach:#ffd4b3;--ink:#4a2a4d;--ink-soft:#6b4a6d;--bg-grad:radial-gradient(ellipse at top, var(--pink-100) 0%, var(--lavender) 60%, var(--blue-100) 100%);--font-ui:"Fredoka", system-ui, -apple-system, sans-serif;--font-fancy:"Caveat", "Fredoka", cursive;--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--ease-soft:cubic-bezier(.4, 0, .2, 1);--shadow-soft:0 8px 24px #ff5fa22e;--shadow-pop:0 4px 0 #d6338459, 0 12px 24px #ff5fa240;--sa-top:env(safe-area-inset-top,0px);--sa-bottom:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}html,body{overscroll-behavior:none;touch-action:none;background:var(--bg-grad);width:100%;height:100%;color:var(--ink);font-family:var(--font-ui);margin:0;padding:0;font-weight:600;overflow:hidden}#app{width:100vw;height:100dvh;position:fixed;inset:0;overflow:hidden}.splash{z-index:100;background:var(--bg-grad);transition:opacity .5s var(--ease-soft);flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex;position:fixed;inset:0}.splash.hidden{opacity:0;pointer-events:none}.splash-logo{font-family:var(--font-fancy);color:var(--pink-700);text-shadow:0 4px 0 var(--pink-100);animation:pop .8s var(--ease-spring);align-items:center;gap:12px;font-size:72px;line-height:1;display:flex}.splash-title{text-align:center}.splash-tag{font-family:var(--font-fancy);color:var(--ink-soft);font-size:28px;animation:2s ease-in-out infinite float}.splash-sparkle{font-size:56px;animation:3s linear infinite spin;display:inline-block}@keyframes pop{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.kawaii-card{-webkit-backdrop-filter:blur(18px);box-shadow:var(--shadow-soft);background:#ffffffb8;border:2px solid #fffc;border-radius:28px;padding:22px}.kawaii-btn{background:linear-gradient(180deg, var(--pink-200) 0%, var(--pink-300) 100%);color:#fff;font-family:var(--font-ui);letter-spacing:.02em;cursor:pointer;box-shadow:var(--shadow-pop);transition:transform .2s var(--ease-spring), box-shadow .2s var(--ease-soft);text-shadow:0 2px #d6338459;border:none;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:14px 26px;font-size:20px;font-weight:700;display:inline-flex}.kawaii-btn:active{transform:translateY(2px)scale(.98);box-shadow:0 2px #d6338459}.kawaii-btn.secondary{color:var(--pink-700);text-shadow:none;background:linear-gradient(#fff 0%,#ffe9f3 100%);box-shadow:0 4px #d6338426,0 8px 18px #ff5fa21f}.kawaii-btn.mint{color:var(--mint-700);text-shadow:none;background:linear-gradient(#d8fce6 0%,#8fe3b3 100%);box-shadow:0 4px #2f9e6b40,0 8px 18px #2f9e6b2e}.kawaii-btn.lemon{color:var(--lemon-700);text-shadow:none;background:linear-gradient(#fff3c4 0%,#ffd966 100%)}.kawaii-btn.large{padding:18px 36px;font-size:24px}.kawaii-btn.small{opacity:.85;padding:10px 22px;font-size:15px}.kawaii-btn.icon{border-radius:50%;width:48px;height:48px;padding:12px;font-size:22px}#runner-canvas,#doodle-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.hud{top:calc(12px + var(--sa-top));z-index:10;pointer-events:none;font-family:var(--font-ui);justify-content:space-between;align-items:center;display:flex;position:absolute;left:12px;right:12px}.hud-pill{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--shadow-soft);color:var(--ink);background:#ffffffd1;border-radius:999px;align-items:center;gap:6px;padding:8px 14px;font-size:16px;font-weight:700;display:flex}.hud-hearts{letter-spacing:2px;font-size:18px}.hud-timer{color:var(--pink-700)}.hud-score{color:var(--mint-700)}.hud-pause-btn{pointer-events:auto;cursor:pointer;transition:transform .2s var(--ease-spring);border:none;font-size:18px}.hud-pause-btn:active{transform:scale(.9)}.pause-overlay{z-index:40;-webkit-backdrop-filter:blur(8px);transition:opacity .3s var(--ease-soft);background:#4a2a4d73;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.pause-overlay.pause-hidden{opacity:0;pointer-events:none}.pause-overlay.pause-hidden .pause-card{transform:scale(.85)}.pause-overlay.pause-visible{opacity:1;pointer-events:auto}.pause-overlay.pause-visible .pause-card{transform:scale(1)}.pause-card{min-width:260px;max-width:340px;transition:transform .35s var(--ease-spring);flex-direction:column;align-items:center;gap:18px;padding:32px 28px;display:flex}.pause-title{font-family:var(--font-fancy);color:var(--pink-700);text-shadow:0 3px 0 var(--pink-100);margin:0;font-size:42px}.pause-actions{flex-direction:column;align-items:stretch;gap:10px;width:100%;display:flex}.toast{box-shadow:var(--shadow-pop);font-family:var(--font-fancy);color:var(--pink-700);opacity:0;pointer-events:none;z-index:50;transition:opacity .3s, transform .4s var(--ease-spring);background:#fffffff2;border-radius:999px;padding:14px 28px;font-size:36px;position:absolute;top:24%;left:50%;transform:translate(-50%)scale(.6)}.toast.show{opacity:1;transform:translate(-50%)scale(1)}.screen{z-index:20;background:var(--bg-grad);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:18px;padding:24px;display:flex;position:absolute;inset:0}.screen h1{font-family:var(--font-fancy);color:var(--pink-700);text-shadow:0 4px 0 var(--pink-100);margin:0;font-size:64px}.screen h2{font-family:var(--font-fancy);color:var(--ink);margin:0;font-size:40px}.screen p{color:var(--ink-soft);max-width:320px;margin:0;font-size:16px;line-height:1.5}.char-preview{width:100%;min-height:280px;box-shadow:inset 0 -8px 0 #d6338414, var(--shadow-soft);background:linear-gradient(#fff7fb 0%,#ffe9f3 100%);border-radius:24px;flex:1;position:relative;overflow:hidden}.char-gender{gap:12px;display:flex}.char-gender .kawaii-btn{opacity:.55;padding:10px 22px;font-size:18px}.char-gender .kawaii-btn.active{opacity:1;transform:scale(1.05)}.char-customize{grid-template-columns:1fr;gap:12px;width:100%;display:grid}.swatch-row{background:#ffffffb3;border-radius:18px;align-items:center;gap:8px;padding:8px 12px;display:flex}.swatch-row .label{color:var(--ink-soft);text-transform:uppercase;letter-spacing:.08em;min-width:60px;font-size:13px;font-weight:700}.swatches{flex-wrap:wrap;flex:1;gap:6px;display:flex}.swatch{cursor:pointer;width:28px;height:28px;transition:transform .15s var(--ease-spring);border:3px solid #fff;border-radius:50%;box-shadow:0 2px 6px #0000001f}.swatch.active{box-shadow:0 0 0 3px var(--pink-300), 0 2px 6px #0000002e;transform:scale(1.2)}.swatch.square{border-radius:8px}.doodle-root{background:var(--bg-grad);z-index:30;padding:calc(8px + var(--sa-top)) 8px calc(8px + var(--sa-bottom)) 8px;flex-direction:column;gap:6px;display:flex;position:absolute;inset:0}.doodle-header{justify-content:space-between;align-items:center;padding:0 8px;display:flex}.doodle-header-actions{gap:6px;display:flex}.doodle-title{font-family:var(--font-fancy);color:var(--pink-700);font-size:28px;line-height:1}.doodle-subtitle{color:var(--ink-soft);opacity:.8;font-size:12px}.doodle-canvas-wrap{min-height:0;box-shadow:var(--shadow-soft);background:#fff;border:4px solid #fff;border-radius:24px;flex:1;justify-content:center;align-items:center;padding:clamp(10px,2vmin,22px);display:flex;position:relative;overflow:hidden}.painter-stack{aspect-ratio:1;max-width:100%;height:100%;max-height:100%;position:relative}.painter-stack canvas{display:block}.doodle-toolbar{box-shadow:var(--shadow-soft);scrollbar-width:none;background:#ffffffd9;border-radius:20px;align-items:center;gap:6px;padding:8px 12px;display:flex;overflow-x:auto}.doodle-toolbar::-webkit-scrollbar{display:none}.palette-row{flex-wrap:nowrap}.color-dot{cursor:pointer;width:28px;height:28px;transition:transform .15s var(--ease-spring);border:3px solid #fff;border-radius:50%;flex:0 0 28px;box-shadow:0 2px 4px #00000026}.color-dot.active{box-shadow:0 0 0 3px var(--ink), 0 2px 4px #00000026;transform:scale(1.25)}.tool-btn{font-family:var(--font-ui);cursor:pointer;color:var(--pink-700);background:#fff;border:2px solid #d633841f;border-radius:16px;flex:none;padding:8px 14px;font-size:14px;font-weight:700}.tool-btn.mint{color:var(--mint-700);background:linear-gradient(#d8fce6,#8fe3b3);border-color:#0000}.tool-btn.active{box-shadow:0 2px #2f9e6b40,0 6px 12px #2f9e6b2e}.brush-style-row{gap:4px;margin-left:auto;display:flex}.brush-style-btn{cursor:pointer;font-family:var(--font-ui);color:var(--ink-soft);background:#d633840f;border:2px solid #0000;border-radius:12px;flex-direction:column;flex:none;align-items:center;gap:1px;padding:4px 8px;display:flex}.brush-style-btn .bs-emoji{font-size:16px}.brush-style-btn .bs-label{font-size:9px;font-weight:700}.brush-style-btn.active{border-color:var(--pink-300);color:var(--pink-700);background:linear-gradient(#fff7fb,#ffe9f3)}.slider-row{gap:16px}.slider-group{flex:1;align-items:center;gap:6px;min-width:0;display:flex}.slider-label{color:var(--ink-soft);white-space:nowrap;font-size:12px;font-weight:700}.slider-group input[type=range]{height:6px;accent-color:var(--pink-500);cursor:pointer;flex:1}.slider-value{color:var(--pink-700);text-align:right;min-width:24px;font-size:12px;font-weight:700}.doodle-actions{justify-content:center;gap:8px;display:flex}.controls-hint{bottom:calc(20px + var(--sa-bottom));color:var(--ink-soft);pointer-events:none;z-index:11;background:#ffffffb3;border-radius:999px;padding:6px 14px;font-size:12px;animation:2.5s ease-in-out infinite float;position:absolute;left:50%;transform:translate(-50%)}.hidden{display:none!important}.flex{display:flex}.col{flex-direction:column}.gap-8{gap:8px}.gap-12{gap:12px}.gap-16{gap:16px}.center{justify-content:center;align-items:center}.row-wrap{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.menu-screen-v2{background:var(--bg-grad);z-index:20;position:absolute;inset:0;overflow:hidden}.menu-canvas-fullscreen{z-index:1;width:100%;height:100%;display:block;position:absolute;inset:0}.menu-overlay-top{top:calc(20px + var(--sa-top));text-align:center;pointer-events:none;z-index:3;padding:0 20px;position:absolute;left:0;right:0}.menu-overlay-bottom{bottom:calc(20px + var(--sa-bottom));pointer-events:none;z-index:3;flex-direction:column;align-items:center;gap:8px;padding:0 20px;display:flex;position:absolute;left:0;right:0}.menu-overlay-bottom>*{pointer-events:auto}.menu-title{font-family:var(--font-fancy);color:var(--pink-700);text-shadow:0 4px 0 var(--pink-100), 0 8px 24px #ff5fa259;animation:titlePop 1s var(--ease-spring) both;margin:0;font-size:56px;line-height:1}.emoji-pop{animation:4s linear infinite spin;display:inline-block}.menu-subtitle{font-family:var(--font-fancy);color:var(--ink-soft);text-shadow:0 2px 4px #fff9;margin:4px 0 0;font-size:20px}.menu-actions{flex-direction:column;align-items:stretch;gap:10px;width:100%;max-width:320px;display:flex}.menu-footer{opacity:.75;color:var(--ink-soft);text-shadow:0 1px 2px #ffffffb3;margin:4px 0 0;font-size:12px}.menu-bg-sparkles{pointer-events:none;z-index:2;position:absolute;inset:0;overflow:hidden}.menu-sparkle{opacity:.75;filter:drop-shadow(0 0 6px #ff8fb873);animation:7s ease-in-out infinite drift;position:absolute}@keyframes drift{0%{opacity:0;transform:translateY(0)rotate(0)}20%{opacity:.9}to{opacity:0;transform:translateY(-120px)rotate(360deg)}}@keyframes titlePop{0%{opacity:0;transform:scale(.3)rotate(-8deg)}60%{opacity:1;transform:scale(1.15)rotate(4deg)}to{opacity:1;transform:scale(1)rotate(0)}}.menu-overlay{z-index:20;pointer-events:none;transition:opacity .5s var(--ease-soft), transform .5s var(--ease-soft);background:linear-gradient(#fff0f740 0%,#e2cffc2e 50%,#cfe9ff38 100%);position:absolute;inset:0;overflow:hidden}.menu-overlay>*{pointer-events:auto}.menu-overlay .menu-bg-sparkles{pointer-events:none}.menu-overlay.menu-in{opacity:1;transform:translateY(0)}.menu-overlay.menu-out{opacity:0;transform:translateY(20px);pointer-events:none!important}.menu-overlay.menu-out *{pointer-events:none!important}.char-select-v2{background:var(--bg-grad);z-index:20;position:absolute;inset:0;overflow:hidden}.char-canvas-fullscreen{z-index:1;width:100%;height:100%;display:block;position:absolute;inset:0}.char-pose-strip{top:calc(20px + var(--sa-top));z-index:5;flex-direction:column;gap:8px;display:flex;position:absolute;right:16px}.pose-pill{cursor:pointer;width:52px;height:52px;transition:transform .2s var(--ease-spring);opacity:.7;background:#ffffffd9;border:2px solid #fff;border-radius:50%;font-size:22px;box-shadow:0 4px 12px #ff5fa22e}.pose-pill.active{opacity:1;box-shadow:0 0 0 3px var(--pink-300), 0 4px 12px #ff5fa240;transform:scale(1.12)}.char-drawer{-webkit-backdrop-filter:blur(20px);height:56%;max-height:540px;padding:0 16px calc(12px + var(--sa-bottom));z-index:4;transition:transform .35s var(--ease-spring);will-change:transform;background:#fffffff0;border-radius:28px 28px 0 0;flex-direction:column;display:flex;position:absolute;bottom:0;left:0;right:0;box-shadow:0 -8px 24px #d6338426}.char-drawer.collapsed{transform:translateY(calc(100% - 120px))}.char-drawer-toggle{cursor:pointer;background:0 0;border:none;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:100%;height:32px;margin:4px auto;padding:0;display:flex;position:relative}.char-drawer-handle{pointer-events:none;background:#d6338440;border-radius:999px;width:48px;height:5px}.char-drawer-chevron{color:var(--pink-700);opacity:.55;transition:transform .25s var(--ease-soft);pointer-events:none;font-size:14px}.char-drawer.collapsed .char-drawer-chevron{transform:rotate(180deg)}.char-drawer.collapsed .char-tab-panel,.char-drawer.collapsed .char-save-btn{opacity:0;pointer-events:none;transition:opacity .2s var(--ease-soft)}.char-tabs{scrollbar-width:none;border-bottom:1px solid #d633841f;gap:6px;margin-bottom:10px;padding:2px 4px 8px;display:flex;overflow-x:auto}.char-tabs::-webkit-scrollbar{display:none}.char-tab{cursor:pointer;color:var(--ink-soft);min-width:60px;font-family:var(--font-ui);background:0 0;border:none;border-radius:14px;flex-direction:column;align-items:center;gap:2px;padding:6px 10px;display:flex}.char-tab.active{background:linear-gradient(180deg, var(--pink-100), var(--pink-200));color:var(--pink-700);box-shadow:0 2px 6px #ff5fa240}.tab-emoji{font-size:20px}.tab-label{font-size:11px;font-weight:700}.char-tab-panel{flex-direction:column;flex:1;gap:14px;padding:4px 4px 12px;display:flex;overflow-y:auto}.pill-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px;display:grid}.option-pill{cursor:pointer;font-family:var(--font-ui);color:var(--ink-soft);transition:transform .15s var(--ease-spring);background:#fff;border:2px solid #d633841f;border-radius:16px;flex-direction:column;align-items:center;gap:4px;padding:10px 8px;display:flex}.option-pill.active{border-color:var(--pink-300);color:var(--pink-700);background:linear-gradient(#fff7fb,#ffe9f3);transform:scale(1.04);box-shadow:0 4px 12px #ff5fa233}.pill-emoji{font-size:24px}.pill-label{font-size:11px;font-weight:700}.color-section{flex-direction:column;gap:6px;display:flex}.color-section-label{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);font-size:12px;font-weight:700}.color-row{flex-wrap:wrap;gap:8px;display:flex}.color-row .swatch{cursor:pointer;width:36px;height:36px;transition:transform .15s var(--ease-spring);border:3px solid #fff;border-radius:50%;box-shadow:0 2px 6px #0000001f}.color-row .swatch.active{box-shadow:0 0 0 3px var(--pink-300), 0 2px 6px #0000002e;transform:scale(1.2)}.char-save-btn{margin-top:6px}.preloader-screen{padding:max(22px, var(--sa-top)) 22px max(22px, var(--sa-bottom));background:radial-gradient(circle at 18% 18%, #ffffffdb, transparent 26%), radial-gradient(circle at 82% 12%, #ffe5a88f, transparent 24%), radial-gradient(circle at 50% 92%, #8ec5ff61, transparent 34%), var(--bg-grad);z-index:200;transition:opacity .5s var(--ease-soft);justify-content:center;gap:14px}.preloader-screen.fade-out{opacity:0;pointer-events:none}.preloader-bg{pointer-events:none;position:absolute;inset:0;overflow:hidden}.preloader-card{z-index:1;-webkit-backdrop-filter:blur(18px);background:#ffffffad;border:2px solid #ffffffe6;border-radius:34px;flex-direction:column;align-items:center;gap:12px;width:min(430px,100%);padding:clamp(22px,6vmin,38px);display:flex;position:relative;box-shadow:0 26px 70px #d6338433,inset 0 1px #fffffff2}.preloader-orb{background:linear-gradient(145deg, #fff, var(--pink-100));border-radius:50%;place-items:center;width:78px;height:78px;font-size:40px;animation:2.6s ease-in-out infinite float;display:grid;box-shadow:0 14px 32px #ff5fa242,inset 0 -5px #d6338414}.preloader-title{font-family:var(--font-fancy);text-align:center;color:var(--pink-700);text-shadow:0 4px 0 var(--pink-100), 0 8px 24px #ff5fa259;animation:titlePop 1s var(--ease-spring) both;margin:0;font-size:clamp(44px,12vmin,64px);line-height:.9}.preloader-tag{font-family:var(--font-fancy);color:var(--ink-soft);text-align:center;margin:-2px 0 4px;font-size:clamp(20px,5vmin,26px)}.preloader-progress-row{grid-template-columns:68px 1fr;align-items:center;gap:10px;width:100%;display:grid}.preloader-percent{color:var(--pink-700);text-align:center;background:linear-gradient(#fffffff5,#ffe9f3eb);border-radius:18px;padding:8px 6px;font-size:20px;font-weight:900;box-shadow:inset 0 -3px #d6338414,0 8px 18px #ff5fa21f}.preloader-bar{background:#ffffff9e;border:2px solid #ffffffe6;border-radius:999px;width:100%;height:22px;position:relative;overflow:hidden;box-shadow:inset 0 2px 7px #d633842e,0 8px 20px #ff5fa22e}.preloader-fill{width:0%;height:100%;transition:width .28s var(--ease-soft);background:linear-gradient(120deg,#0000 0 18%,#ffffffb3 22%,#0000 30%) 0 0/58px 100%,linear-gradient(90deg,#ffb3cf,#ff5fa2 48%,#8ec5ff 100%);border-radius:999px;animation:.9s linear infinite preloaderShine;box-shadow:0 0 18px #ff5fa2ad}.preloader-steps{grid-template-columns:repeat(5,1fr);gap:7px;width:100%;margin-top:2px;display:grid}.preloader-steps span{background:#ffffffbf;border-radius:999px;height:7px;animation:1.4s ease-in-out infinite loadingStepPulse;box-shadow:inset 0 -2px #d6338414}.preloader-steps span:nth-child(2){animation-delay:.12s}.preloader-steps span:nth-child(3){animation-delay:.24s}.preloader-steps span:nth-child(4){animation-delay:.36s}.preloader-steps span:nth-child(5){animation-delay:.48s}.preloader-label{min-height:18px;color:var(--pink-700);text-align:center;margin:4px 0 0;font-size:14px;font-weight:800}.preloader-hint{max-width:320px;color:var(--ink-soft);opacity:.78;text-align:center;margin:-4px 0 0;font-size:12px;line-height:1.45}@keyframes preloaderShine{0%{background-position:-58px 0,0 0}to{background-position:58px 0,0 0}}@keyframes loadingStepPulse{0%,to{background:#ffffffb8;transform:scaleY(1)}50%{background:#ff5fa259;transform:scaleY(1.35)}}@media (width<=480px){.preloader-card{border-radius:28px}.preloader-progress-row{grid-template-columns:62px 1fr}.preloader-percent{font-size:18px}}.kawaii-btn.opt-pill{border-radius:18px;width:auto;min-width:56px;height:auto;padding:8px 12px;font-size:16px}.back-btn{top:calc(12px + var(--sa-top));z-index:5;position:absolute;left:12px}.pill-grid-thumb{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px}.option-pill-thumb{border-radius:18px;gap:6px;padding:8px 6px 6px}.option-pill-thumb .pill-thumb,.option-pill-thumb .pill-thumb-img{object-fit:contain;background:linear-gradient(#fff7fb 0%,#ffe9f3 100%);border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:72px;height:72px;font-size:36px;display:flex;box-shadow:inset 0 2px #ffffffe6,inset 0 -3px #d6338414}.option-pill-thumb .pill-thumb-img{background:#fff;padding:4px}.option-pill-thumb.active{transform:scale(1.06)}.option-pill-thumb.active .pill-thumb,.option-pill-thumb.active .pill-thumb-img{box-shadow:inset 0 0 0 3px var(--pink-300), 0 4px 12px #ff5fa22e}.char-loading{z-index:6;pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.char-spinner{border:6px solid #ffffff8c;border-top-color:var(--pink-500);border-radius:50%;width:56px;height:56px;animation:.9s linear infinite spin;box-shadow:0 8px 24px #ff5fa240}.char-touch-catcher{z-index:2;touch-action:none;cursor:grab;background:0 0;height:44%;position:absolute;top:0;left:0;right:0}.char-touch-catcher:active{cursor:grabbing}.doodle-history-screen{z-index:45;padding:calc(18px + var(--sa-top)) 18px calc(18px + var(--sa-bottom));-webkit-backdrop-filter:blur(14px);animation:historyFade .28s var(--ease-soft) both;background:radial-gradient(circle at 15% 10%,#ffffffb8,#0000 28%),linear-gradient(135deg,#ffd9ece6,#e2cffce6 48%,#cfe9ffeb);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.history-panel{background:#ffffffbd;border:2px solid #ffffffdb;border-radius:34px;flex-direction:column;gap:16px;width:min(960px,100%);height:min(760px,100%);padding:clamp(16px,3vmin,28px);display:flex;position:relative;overflow:hidden;box-shadow:0 24px 70px #d6338438,inset 0 1px #fffffff2}.history-header{z-index:1;justify-content:space-between;align-items:center;gap:12px;display:flex}.history-kicker{text-transform:uppercase;letter-spacing:.14em;color:var(--mint-700);margin:0 0 2px;font-size:13px}.history-header h1{font-family:var(--font-fancy);color:var(--pink-700);text-shadow:0 4px 0 var(--pink-100);margin:0;font-size:clamp(42px,7vmin,68px);line-height:.9}.history-grid{scrollbar-width:thin;flex:1;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;padding:4px 4px 10px;display:grid;overflow-y:auto}.history-card{transform:rotate(var(--tilt,-1deg));transition:transform .22s var(--ease-spring), box-shadow .22s var(--ease-soft);background:linear-gradient(#fffffff5,#ffe9f3e6);border:2px solid #fffffff2;border-radius:24px;flex-direction:column;gap:8px;padding:10px;display:flex;position:relative;box-shadow:0 10px 24px #ff5fa229}.history-card:nth-child(2n){--tilt:1deg}.history-card:nth-child(3n){--tilt:-.4deg}.history-card:hover{transform:translateY(-4px)rotate(0)scale(1.02);box-shadow:0 16px 32px #ff5fa23d}.history-card img{aspect-ratio:1;object-fit:contain;background:#fff;border-radius:18px;width:100%;box-shadow:inset 0 0 0 2px #d6338414}.history-card-info{flex-direction:column;gap:2px;min-width:0;display:flex}.history-card-info strong{color:var(--pink-700);white-space:nowrap;text-overflow:ellipsis;font-size:15px;overflow:hidden}.history-card-info span{color:var(--ink-soft);opacity:.82;font-size:11px}.history-empty{text-align:center;max-width:360px;color:var(--ink-soft);margin:auto;display:none}.history-empty.visible{display:block}.history-empty-emoji{filter:drop-shadow(0 8px 14px #ff5fa238);font-size:76px;animation:2.8s ease-in-out infinite float}.history-empty h2{font-family:var(--font-fancy);color:var(--pink-700);margin:4px 0;font-size:42px}.history-empty p{margin:0;line-height:1.5}.history-footer{justify-content:center;display:flex}.history-footer .kawaii-btn:disabled{opacity:.45;cursor:default;transform:none}@keyframes historyFade{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.death-puzzle-screen{z-index:60;padding:calc(18px + var(--sa-top)) 18px calc(18px + var(--sa-bottom));opacity:0;pointer-events:none;transition:opacity .26s var(--ease-soft);background:radial-gradient(circle at 18% 16%,#ffffffd1,#0000 24%),radial-gradient(circle at 84% 12%,#ffe5a8b8,#0000 22%),linear-gradient(135deg,#ff8fb8e6,#e2cffcf0 48%,#8ec5ffe6);justify-content:center;align-items:center;display:flex;position:absolute;inset:0;overflow:hidden}.death-puzzle-screen.puzzle-visible{opacity:1;pointer-events:auto}.death-puzzle-card{z-index:2;-webkit-backdrop-filter:blur(22px);width:min(680px,100%);max-height:100%;transition:transform .38s var(--ease-spring);background:#ffffffc7;border:2px solid #ffffffe6;border-radius:36px;flex-direction:column;gap:14px;padding:clamp(18px,4vmin,34px);display:flex;position:relative;transform:translateY(18px)scale(.96);box-shadow:0 28px 80px #4a2a4d38,inset 0 1px #fffffff2}.puzzle-visible .death-puzzle-card{transform:translateY(0)scale(1)}.puzzle-badge{color:var(--mint-700);text-transform:uppercase;letter-spacing:.14em;background:linear-gradient(90deg,#c7f5d9f2,#ffe5a8f2);border-radius:999px;align-self:center;padding:7px 14px;font-size:12px;box-shadow:0 8px 18px #2f9e6b1f}.death-puzzle-card h1{text-align:center;font-family:var(--font-fancy);color:var(--pink-700);text-shadow:0 4px 0 var(--pink-100), 0 14px 30px #ff5fa240;margin:0;font-size:clamp(44px,8vmin,72px);line-height:.88}.puzzle-intro{text-align:center;max-width:420px;color:var(--ink-soft);margin:-4px auto 0;font-size:16px;line-height:1.45}.puzzle-question-card{background:linear-gradient(#fffffff0,#fff0f7e6);border:2px solid #ffffffe6;border-radius:26px;padding:16px 18px;box-shadow:inset 0 -4px #d633840f,0 10px 24px #ff5fa21f}.puzzle-question-kicker{color:var(--lemon-700);text-transform:uppercase;letter-spacing:.13em;margin-bottom:5px;font-size:12px}.puzzle-question-card h2{color:var(--ink);margin:0;font-size:clamp(20px,4.8vmin,30px);line-height:1.15}.puzzle-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.puzzle-option{min-height:72px;color:var(--ink);font-family:var(--font-ui);text-align:left;cursor:pointer;transition:transform .18s var(--ease-spring), box-shadow .18s var(--ease-soft), filter .18s var(--ease-soft);background:linear-gradient(#fffffff5,#ffe9f3eb);border:2px solid #ffffffeb;border-radius:22px;align-items:center;gap:10px;padding:12px;font-size:16px;font-weight:800;display:flex;box-shadow:0 8px 18px #ff5fa221}.puzzle-option:not(:disabled):hover{transform:translateY(-3px)scale(1.02);box-shadow:0 14px 28px #ff5fa233}.puzzle-option:disabled{cursor:default}.puzzle-option-letter{background:linear-gradient(180deg, var(--pink-200), var(--pink-300));color:#fff;text-shadow:0 2px #d6338447;border-radius:50%;flex:0 0 38px;justify-content:center;align-items:center;width:38px;height:38px;display:inline-flex;box-shadow:0 4px #d633842e}.puzzle-option.correct{color:var(--mint-700);animation:answerPop .42s var(--ease-spring);background:linear-gradient(#eafff1,#a6efc3);border-color:#2f9e6b59}.puzzle-option.correct .puzzle-option-letter{text-shadow:none;background:linear-gradient(#c7f5d9,#72d79e)}.puzzle-option.incorrect{color:var(--pink-700);filter:saturate(.95);background:linear-gradient(#fff1f6,#ffc2d8)}.puzzle-feedback{background:#ffffffc7;border:2px solid #ffffffdb;border-radius:22px;min-height:0;padding:13px 16px;display:none;box-shadow:0 10px 22px #4a2a4d1a}.puzzle-feedback.show{animation:pop .34s var(--ease-spring);flex-direction:column;gap:4px;display:flex}.puzzle-feedback strong{color:var(--pink-700);font-size:18px}.puzzle-feedback.correct strong{color:var(--mint-700)}.puzzle-feedback span{color:var(--ink-soft);font-size:14px;line-height:1.45}.puzzle-continue{align-self:center;min-width:210px}.puzzle-continue:disabled{opacity:.45;cursor:default;transform:none}.puzzle-orb{filter:blur(2px);opacity:.42;border-radius:50%;width:280px;height:280px;animation:7s ease-in-out infinite orbFloat;position:absolute}.puzzle-orb-one{background:radial-gradient(circle,#ffe5a8f2,#ff8fb81a);bottom:8%;left:-80px}.puzzle-orb-two{background:radial-gradient(circle,#c7f5d9f2,#8ec5ff1a);animation-delay:-2.5s;top:5%;right:-90px}.puzzle-sparkles span{z-index:1;filter:drop-shadow(0 8px 12px #ff5fa233);font-size:clamp(24px,5vmin,46px);animation:6.5s ease-in-out infinite puzzleDrift;position:absolute}.puzzle-sparkles span:first-child{animation-delay:-.4s;top:18%;left:9%}.puzzle-sparkles span:nth-child(2){animation-delay:-1.6s;top:24%;left:84%}.puzzle-sparkles span:nth-child(3){animation-delay:-2.4s;bottom:18%;left:13%}.puzzle-sparkles span:nth-child(4){animation-delay:-3.1s;bottom:13%;right:16%}.puzzle-sparkles span:nth-child(5){animation-delay:-4.2s;top:8%;left:50%}@keyframes answerPop{0%{transform:scale(.96)}70%{transform:scale(1.04)}to{transform:scale(1)}}@keyframes orbFloat{0%,to{transform:translate(0,0)scale(1)}50%{transform:translate(20px,-18px)scale(1.08)}}@keyframes puzzleDrift{0%,to{opacity:.55;transform:translateY(0)rotate(-6deg)}50%{opacity:1;transform:translateY(-18px)rotate(8deg)}}@media (width<=560px){.death-puzzle-screen{padding:calc(10px + var(--sa-top)) 10px calc(10px + var(--sa-bottom))}.death-puzzle-card{border-radius:28px;gap:10px}.puzzle-options{grid-template-columns:1fr;gap:8px}.puzzle-option{border-radius:18px;min-height:58px;font-size:15px}.puzzle-option-letter{flex-basis:34px;width:34px;height:34px}.puzzle-feedback span{font-size:13px}.history-panel{border-radius:28px}.history-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.history-card{border-radius:20px;padding:8px}}