:root{--bg-primary: #0F0F0F;--bg-secondary: #161616;--bg-tertiary: #222222;--bg-spotlight: radial-gradient(circle at 50% 0%, #1F1F1F, #0F0F0F 80%);--text-primary: #EDEDED;--text-secondary: #909090;--text-tertiary: #505050;--accent-color: #EEEEEE;--accent-text: #111111;--accent-subtle: #333333;--gradient-glass: linear-gradient(145deg, #333333 0%, #222222 100%);--success-color: #38A169;--error-color: #E53E3E;--font-family: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, sans-serif;--tracking-tight: -.02em;--font-features: "calt" 1, "ss01" 1, "cv11" 1;--tracking-tighter: -.03em;--font-size-xs: 12px;--font-size-sm: 14px;--font-size-base: 16px;--font-size-lg: 20px;--font-size-xl: 32px;--space-xs: 8px;--space-sm: 16px;--space-md: 24px;--space-lg: 48px;--space-xl: 64px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--ease-physics: cubic-bezier(.2, 0, .2, 1);--duration-fast: .15s;--duration-normal: .2s}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}body{font-family:var(--font-family);background:var(--bg-spotlight);background-color:var(--bg-primary);background-attachment:fixed;color:var(--text-primary);line-height:1.6;letter-spacing:var(--tracking-tight);font-feature-settings:var(--font-features);-webkit-font-smoothing:antialiased;min-height:100vh}h1,h2,h3{font-weight:600;letter-spacing:var(--tracking-tighter);color:var(--text-primary);line-height:1.1}h1{font-size:var(--font-size-xl);margin-bottom:var(--space-sm)}h2{font-size:var(--font-size-lg);margin-bottom:var(--space-sm)}p{color:var(--text-secondary);margin-bottom:var(--space-sm);font-size:var(--font-size-base)}.container{max-width:640px;margin:0 auto;padding:var(--space-md);min-height:100vh;display:flex;flex-direction:column}.center-all{display:flex;justify-content:center;align-items:center;text-align:center}button{cursor:pointer;border:none;font-family:inherit;font-weight:500;font-size:var(--font-size-sm);letter-spacing:var(--tracking-tight);border-radius:var(--radius-sm);transition:opacity var(--duration-fast) var(--ease-physics),transform var(--duration-fast) var(--ease-physics)}button:active{transform:scale(.98);opacity:.8}.btn-primary{background-color:var(--accent-color);color:var(--accent-text);padding:12px 24px;font-weight:600}.btn-secondary{background-color:var(--bg-tertiary);color:var(--text-primary);border:1px solid rgba(255,255,255,.1);padding:12px 20px}.glass-panel{background:var(--bg-secondary);border:1px solid var(--bg-tertiary);box-shadow:inset 0 1px #ffffff0d;border-radius:var(--radius-md)}.animate-fade-in{animation:fadeIn var(--duration-normal) var(--ease-physics) forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:-200% center}to{background-position:200% center}}.image-card-container{width:100%;aspect-ratio:4/3;position:relative;margin-bottom:var(--space-md)}.image-card{width:100%;height:100%;border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--bg-tertiary);background:var(--bg-secondary);position:relative;transition:border-color var(--duration-fast) var(--ease-physics);padding:0}.image-card:active:not(:disabled){transform:scale(.99)}.image-card img{width:100%;height:100%;object-fit:cover;display:block}.image-card.correct{border-color:var(--success-color)}.image-card.wrong{border-color:var(--error-color);opacity:.5}.swipe-card-container{width:100%;max-width:400px;aspect-ratio:3/4;margin:0 auto;position:relative;cursor:grab;z-index:10}.swipe-card-content{background:var(--bg-secondary);border-radius:var(--radius-md);overflow:hidden;width:100%;height:100%;border:1px solid var(--bg-tertiary);position:relative;box-shadow:0 10px 40px -10px #00000080}.swipe-card-content img{width:100%;height:100%;object-fit:cover;pointer-events:none}.swipe-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(0);padding:16px 32px;border:6px solid;border-radius:12px;font-weight:800;font-size:3rem;z-index:20;white-space:nowrap;text-shadow:0 4px 10px rgba(0,0,0,.3);box-shadow:0 4px 20px #0003}.swipe-overlay.real{color:var(--success-color);border-color:var(--success-color)}.swipe-overlay.ai{color:var(--error-color);border-color:var(--error-color)}.absolute-fill{position:absolute;top:0;left:0;width:100%;height:100%}.reveal-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#0006;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center;animation:fadeIn .3s}.reveal-overlay.correct{background:#10b9811a}.reveal-overlay.wrong{background:#ef44441a}.reveal-text{background:var(--bg-secondary);color:var(--text-primary);padding:6px 12px;border-radius:var(--radius-sm);font-weight:500;font-size:var(--font-size-sm);border:1px solid var(--bg-tertiary);box-shadow:0 2px 4px #0000001a;letter-spacing:var(--tracking-tight)}.hidden{opacity:0}.fade-in{opacity:1;transition:opacity .5s ease}.progress-container{width:100%;margin-bottom:var(--space-lg)}.progress-label{display:flex;justify-content:space-between;margin-bottom:var(--space-xs);font-size:var(--font-size-sm);color:var(--text-secondary);font-weight:500}.progress-track{width:100%;height:6px;background:var(--bg-secondary);border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:var(--accent-color);border-radius:3px;transition:width var(--duration-normal) var(--ease-physics)}.glitch-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;background:#000;overflow:hidden;will-change:transform;backface-visibility:hidden;animation:constant-jitter 10s infinite steps(2)}@keyframes constant-jitter{0%,to{transform:translateY(0)}1%,5%{transform:translateY(1px)}10%,15%{transform:translateY(-1px)}20%{transform:translateY(2px)}}.vignette{position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle,transparent 10%,rgba(0,0,0,.95) 100%);z-index:18;pointer-events:none}.black-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000bf;z-index:15;pointer-events:none}.brutalist-grid{position:absolute;width:100%;height:100%;background-image:linear-gradient(rgba(255,255,255,.1) 1.5px,transparent 1.5px),linear-gradient(90deg,rgba(255,255,255,.1) 1.5px,transparent 1.5px);background-size:80px 80px;z-index:15;pointer-events:none;opacity:.4}.glitch-img{position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:.08;filter:grayscale(100%) contrast(150%) brightness(.5);transform:translateZ(0);transition:opacity .1s;animation:signal-flicker 4s infinite steps(1)}@keyframes signal-flicker{0%,30%,70%,to{opacity:.08}5%,35%,75%{opacity:.02}2%{opacity:.15;transform:translate(5px)}}.glitch-container.signal-loss .glitch-img{opacity:.01;filter:invert(100%) brightness(1.5)}.glitch-container.transitioning .glitch-img{animation:tv-roll-brutalist .4s steps(4)}.glitch-layer{position:absolute;top:0;left:0;width:100%;height:100%;background-image:inherit;background-size:inherit;background-position:inherit;mix-blend-mode:exclusion;pointer-events:none;opacity:0}.glitch-layer:nth-of-type(1){animation:glitch-anim-1 .4s infinite steps(2) alternate-reverse;opacity:.3;filter:contrast(2) brightness(1.2)}.glitch-layer:nth-of-type(2){animation:glitch-anim-2 .7s infinite steps(3) alternate;opacity:.2;filter:contrast(1.2)}.glitch-layer:nth-of-type(3){animation:glitch-anim-3 3s infinite steps(1);opacity:.3;filter:invert(100%) contrast(200%)}@keyframes glitch-anim-1{0%{transform:translate3d(-10px,4px,0);clip-path:inset(10% 0 85% 0)}50%{transform:translate3d(10px,-4px,0);clip-path:inset(60% 0 10% 0)}to{transform:translate3d(-5px,0,0);clip-path:inset(20% 0 40% 0)}}@keyframes glitch-anim-2{0%{transform:translate3d(8px,-6px,0);clip-path:inset(45% 0 50% 0)}50%{transform:translate3d(-12px,8px,0);clip-path:inset(5% 0 90% 0)}to{transform:translate3d(5px,0,0);clip-path:inset(85% 0 5% 0)}}@keyframes glitch-anim-3{0%{transform:translateZ(0);clip-path:inset(0% 0 99% 0)}10%{transform:translate3d(40px,0,0);clip-path:inset(30% 0 30% 0);opacity:.4}11%{opacity:0}40%{transform:translate3d(-45px,0,0);clip-path:inset(65% 0 15% 0);opacity:.3}41%{opacity:0}to{transform:translateZ(0)}}@keyframes tv-roll-brutalist{0%{transform:translate3d(0,-100%,0) skew(45deg)}to{transform:translateZ(0) skew(0)}}.noise-flicker{position:absolute;top:0;left:0;width:200%;height:200%;background:url(https://grainy-gradients.vercel.app/noise.svg);opacity:.1;z-index:20;pointer-events:none;animation:static-flicker-primary .05s steps(2) infinite}.noise-flicker.move{opacity:.05;background-size:50% 50%;animation:static-flicker-secondary 6s linear infinite}.glitch-container.signal-loss .noise-flicker{opacity:1!important;background-size:8% 8%}@keyframes static-flicker-primary{0%{transform:translate3d(-5%,-5%,0)}to{transform:translate3d(5%,5%,0)}}@keyframes static-flicker-secondary{0%{transform:translateZ(0) scale(1)}to{transform:translate3d(-10%,-10%,0) scale(1.2)}}.scanlines{position:absolute;top:0;left:0;width:100%;height:100%;background:repeating-linear-gradient(to bottom,transparent 0px,transparent 2px,rgba(255,255,255,.03) 2px,rgba(255,255,255,.03) 4px);background-size:100% 4px;z-index:25;pointer-events:none}.glitch-flash{position:absolute;top:0;left:0;width:100%;height:100%;background:#fff;opacity:0;z-index:30;pointer-events:none}.glitch-flash.active{animation:flash-brutalist .1s steps(2)}@keyframes flash-brutalist{0%{opacity:.5}to{opacity:0}}
