:root{--neon-cyan:#00f0ff;--neon-magenta:#d83f87;--neon-gold:gold;--neon-green:#1aff66;--color-sunset-orange:#ff6b35;--color-mamak-neon:#7fff00;--color-spicy-accent:#ffb347;--color-teh-tarik:#f5e6d3;--void-black:#020204;--bg-primary:#0a0e17;--bg-secondary:#141b2d;--bg-card:#1a2235;--glass-white:#ffffff1a;--glass-white-strong:#ffffff26;--tier-free:#00f0ff;--tier-pro:#f59e0b;--tier-ultimate:#d83f87;--soul-loading:#d83f87;--soul-processing:#f5a623;--soul-ready:#1aff66;--soul-error:#f44;--ghost-bg:#000;--ghost-text:#666;--ghost-accent:#034;--text-primary:#fff;--text-secondary:#ffffffb3;--text-tertiary:#ffffff80;--text-muted:#ffffff4d;--font-display:"Oxanium",sans-serif;--font-body:"Rajdhani",sans-serif;--font-mono:"Kode Mono",monospace;--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--text-5xl:3rem;--font-light:300;--font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;--leading-tight:1.1;--leading-snug:1.25;--leading-normal:1.5;--leading-relaxed:1.625;--duration-instant:.1s;--duration-fast:.2s;--duration-normal:.3s;--duration-slow:.5s;--duration-slower:.7s;--ease-bounce:cubic-bezier(.68,-.55,.265,1.55);--ease-spring:cubic-bezier(.68,-.6,.32,1.6);--ios-spring:cubic-bezier(.34,1.56,.64,1);--ios-spring-soft:cubic-bezier(.25,1,.5,1);--ease-out-expo:cubic-bezier(.16,1,.3,1);--space-0:0;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--viewport-width:430px;--viewport-height:932px;--safe-area-top:59px;--safe-area-bottom:34px;--touch-target-min:44px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-2xl:24px;--radius-full:9999px;--border-thin:1px;--border-medium:2px;--border-thick:3px;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 4px 6px #0006;--shadow-lg:0 10px 15px #00000080;--shadow-xl:0 20px 25px #0009;--glow-cyan:0 0 20px #00f0ff80;--glow-magenta:0 0 20px #d83f8780;--glow-gold:0 0 20px #ffd70080;--glow-green:0 0 20px #1aff6680;--z-base:0;--z-dropdown:100;--z-sticky:200;--z-fixed:300;--z-modal-backdrop:400;--z-modal:500;--z-popover:600;--z-tooltip:700;--z-toast:800;--z-max:9999}.theme-sunset{--theme-gradient:linear-gradient(180deg,#2d1b69 0%,#ff6b35 100%);--theme-accent:var(--color-sunset-orange)}.theme-mamak{--theme-gradient:linear-gradient(135deg,#1a2a1a 0%,#2d2d1a 100%);--theme-accent:var(--color-mamak-neon)}.theme-klcc-night{--theme-gradient:linear-gradient(180deg,#0a0a1a 0%,#1b263b 100%);--theme-accent:#fff}.theme-batik{--theme-gradient:linear-gradient(135deg,#2a1a1a 0%,#4a3636 100%);--theme-accent:var(--neon-gold)}.theme-anime{--theme-gradient:linear-gradient(135deg,#1a0a2e 0%,#0a0a0a 100%);--theme-accent:var(--neon-magenta)}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{font-family:var(--font-body);font-weight:var(--font-normal);line-height:var(--leading-normal);color:var(--text-primary);background-color:var(--bg-primary)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}:focus-visible{outline:2px solid var(--neon-cyan);outline-offset:2px}.skip-to-content{padding:var(--space-2)var(--space-4);background:var(--neon-cyan);color:var(--void-black);font-weight:var(--font-bold);z-index:var(--z-max);transition:top var(--duration-fast);position:absolute;top:-100%;left:50%;transform:translate(-50%)}.skip-to-content:focus{top:var(--space-2)}.device-frame{width:var(--viewport-width);height:var(--viewport-height);background:var(--bg-primary);max-width:100%;margin:0 auto;position:relative;overflow:hidden}.safe-area-top{height:var(--safe-area-top);width:100%}.safe-area-bottom{height:var(--safe-area-bottom);width:100%}.touch-target{min-width:var(--touch-target-min);min-height:var(--touch-target-min)}.glass{background:var(--glass-white);-webkit-backdrop-filter:blur(10px)}.text-glow-cyan{text-shadow:0 0 10px var(--neon-cyan),0 0 20px var(--neon-cyan)}.text-glow-magenta{text-shadow:0 0 10px var(--neon-magenta),0 0 20px var(--neon-magenta)}.text-glow-gold{text-shadow:0 0 10px var(--neon-gold),0 0 20px var(--neon-gold)}@keyframes float{0%,to{opacity:.6;transform:translateY(0)scale(1)}50%{opacity:1;transform:translateY(-20px)scale(1.05)}}@keyframes pulse{0%,to{opacity:.8;transform:translate(-50%)scale(1)}50%{opacity:1;transform:translate(-50%)scale(1.1)}}@keyframes tierPulse{0%,to{box-shadow:0 4px 20px}50%{box-shadow:0 4px 30px,0 0 40px}}@keyframes shimmer{0%{background-position:-200%}to{background-position:200%}}.btn-press{transition:transform var(--duration-fast)var(--ease-spring),box-shadow var(--duration-fast)ease;will-change:transform;-webkit-tap-highlight-color:transparent}.btn-press:active{transform:scale(.95)}@keyframes btnRipple{0%{opacity:.5;transform:scale(0)}to{opacity:0;transform:scale(2)}}@keyframes jellyPress{0%{transform:scale(1)}30%{transform:scale(.92)}50%{transform:scale(1.05)}70%{transform:scale(.98)}to{transform:scale(1)}}@keyframes jellyBounce{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes peelLift{0%{transform:perspective(500px)rotateX(0)translateY(0);box-shadow:0 2px 8px #0003}to{transform:perspective(500px)rotateX(-5deg)translateY(-4px);box-shadow:0 12px 24px #0000004d,0 4px 12px #00f0ff33}}.btn-jelly{transition:transform var(--duration-fast)var(--ease-spring),box-shadow var(--duration-fast)ease,background var(--duration-fast)ease;will-change:transform;-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-user-select:none;user-select:none}.btn-jelly:active{animation:jellyPress .4s var(--ease-spring)}.btn-jelly-sm{transition:transform var(--duration-instant)var(--ease-spring);will-change:transform;-webkit-tap-highlight-color:transparent}.btn-jelly-sm:active{animation:jellyBounce .25s var(--ease-spring)}.btn-peel{transition:transform var(--duration-normal)var(--ease-spring),box-shadow var(--duration-normal)ease;will-change:transform,box-shadow}button{will-change:transform!important;-webkit-tap-highlight-color:transparent!important;touch-action:manipulation!important;-webkit-user-select:none!important;user-select:none!important;transition:transform .15s cubic-bezier(.68,-.6,.32,1.6)!important}button:active{animation:.4s cubic-bezier(.68,-.6,.32,1.6) jellyPress!important;transform:scale(.92)!important}button:not([class*=icon]):not([class*=close]){min-width:44px!important;min-height:44px!important}input[type=range]{appearance:none;cursor:pointer;border-radius:4px;outline:none;height:8px}input[type=range]::-webkit-slider-thumb{appearance:none;cursor:pointer;background:linear-gradient(135deg,#00f0ff 0%,#00d4e8 100%);border:3px solid #fff;border-radius:50%;width:24px;height:24px;transition:transform .15s cubic-bezier(.68,-.6,.32,1.6);box-shadow:0 2px 8px #0000004d}input[type=range]::-webkit-slider-thumb:active{transform:scale(1.2)}input[type=range]::-moz-range-thumb{cursor:pointer;background:linear-gradient(135deg,#00f0ff 0%,#00d4e8 100%);border:3px solid #fff;border-radius:50%;width:24px;height:24px;box-shadow:0 2px 8px #0000004d}.card-lift{transition:transform var(--duration-normal)var(--ios-spring),box-shadow var(--duration-normal)ease;will-change:transform,box-shadow}.card-lift:hover{transform:translateY(-4px)scale(1.02);box-shadow:0 12px 40px #0006,0 0 20px #00f0ff1a}.card-lift:active{transform:translateY(-2px)scale(.98)}.input-glow{transition:border-color var(--duration-fast)ease,box-shadow var(--duration-fast)ease;border:1px solid #ffffff1a}.input-glow:focus{border-color:var(--neon-cyan);outline:none;box-shadow:0 0 0 3px #00f0ff33,0 0 20px #00f0ff26}@keyframes inputFocusPulse{0%,to{box-shadow:0 0 0 3px #00f0ff33}50%{box-shadow:0 0 0 5px #00f0ff4d}}.nav-tap{transition:color var(--duration-fast)ease;position:relative;overflow:hidden}.nav-tap:after{content:"";opacity:0;transition:opacity var(--duration-fast)ease,transform var(--duration-normal)var(--ease-spring);background:radial-gradient(circle,#00f0ff4d 0%,#0000 70%);position:absolute;inset:0;transform:scale(0)}.nav-tap:active:after{opacity:1;transform:scale(1)}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@keyframes slideOutLeft{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-30%)}}@keyframes slideInUp{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes slideInDown{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}.slide-in-right{animation:slideInRight var(--duration-normal)var(--ease-out-expo)}.slide-in-up{animation:slideInUp var(--duration-normal)var(--ease-out-expo)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.modal-backdrop{animation:fadeIn var(--duration-fast)ease;-webkit-backdrop-filter:blur(8px);background:#000000bf}.modal-content{animation:slideInUp var(--duration-normal)var(--ios-spring)}@keyframes springSheetUp{0%{opacity:0;transform:translateY(100%)}60%{opacity:1;transform:translateY(-5%)}to{opacity:1;transform:translateY(0)}}@keyframes springSheetDown{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100%)}}.sheet-spring{animation:springSheetUp var(--duration-slow)var(--ease-spring)}.sheet-spring-close{animation:springSheetDown var(--duration-normal)ease-in}@keyframes auroraShift{0%{background-position:0 0}25%{background-position:50%}50%{background-position:100% 100%}75%{background-position:50%}to{background-position:0 0}}.bg-aurora{background-color:#0000;background-image:radial-gradient(100% 60% at 50% -10%,#00f0ff26 0%,#0000 60%),radial-gradient(80% 50% at 90% 20%,#d83f871f 0%,#0000 50%),radial-gradient(60% 40% at 10% 80%,#9b5de51a 0%,#0000 40%),radial-gradient(50% 30% at 70% 70%,#ffe66d14 0%,#0000 40%);background-position:0 0,0 0,0 0,0 0;background-repeat:repeat,repeat,repeat,repeat;background-size:200% 200%;background-attachment:scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box;animation:30s ease-in-out infinite auroraShift}.bg-scanlines{position:relative}.bg-scanlines:after{content:"";pointer-events:none;opacity:.02;z-index:1;background:repeating-linear-gradient(0deg,#0000,#0000 2px,#ffffff08 2px 4px);position:absolute;inset:0}@keyframes particleFloat{0%{opacity:0;transform:translateY(0)scale(1)}10%{opacity:1}90%{opacity:.8}to{opacity:0;transform:translateY(-100vh)scale(.5)}}@keyframes confettiFall{0%{opacity:1;transform:translateY(-10%)rotate(0)}to{opacity:0;transform:translateY(100vh)rotate(720deg)}}@keyframes sparkle{0%,to{opacity:0;transform:scale(0)}50%{opacity:1;transform:scale(1)}}.particle{border-radius:50%;animation:12s ease-out infinite particleFloat;position:absolute}@keyframes pullRefreshSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pullRefreshBounce{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.pull-refresh-indicator{border:2px solid #0000;border-top-color:var(--neon-cyan);border-right-color:var(--neon-cyan);border-radius:50%;width:32px;height:32px;animation:1s linear infinite pullRefreshSpin}.pull-refresh-active .pull-refresh-indicator{animation:.6s linear infinite pullRefreshSpin,.5s ease-in-out pullRefreshBounce}@keyframes winnerBeam{0%{opacity:0;transform:scaleY(0)}50%{opacity:1;transform:scaleY(1.2)}to{opacity:.8;transform:scaleY(1)}}@keyframes winnerGlow{0%,to{box-shadow:0 0 20px #1aff664d,0 0 40px #1aff6633,0 0 60px #1aff661a}50%{box-shadow:0 0 30px #1aff6680,0 0 60px #1aff6666,0 0 90px #1aff6633}}.winner-beam{background:linear-gradient(to bottom,transparent 0%,var(--neon-green)20%,var(--neon-green)80%,transparent 100%);width:4px;height:100%;animation:winnerBeam .8s var(--ease-spring);position:absolute;top:0;left:50%;transform:translate(-50%)}.winner-card{animation:2s ease-in-out infinite winnerGlow}.btn-jelly{will-change:transform;-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-user-select:none;user-select:none;cursor:pointer;transition:transform .15s cubic-bezier(.68,-.6,.32,1.6),box-shadow .2s,background .2s!important}.btn-jelly:hover{transform:scale(1.02);box-shadow:0 6px 20px #00f0ff40}.btn-jelly:active{animation:.4s cubic-bezier(.68,-.6,.32,1.6) jellyPress!important;transform:scale(.92)!important}.btn-jelly-sm{min-width:36px;min-height:36px}.btn-peel{will-change:transform;transform-style:preserve-3d;transition:transform .3s,box-shadow .3s!important}.btn-peel:hover{animation:.3s forwards peelLift}.btn-peel:active{transform:perspective(500px)rotateX(-2deg)translateY(-2px)scale(.98)}button:not([class*=icon]):not([class*=close]):not([class*=dot]){min-width:44px;min-height:44px}
