:root{--color-primary: #ab3030;--color-primary-hover: #933030;--color-primary-light: rgba(171, 48, 48, .08);--color-primary-border: rgba(171, 48, 48, .2);--color-bg-light: #f2f2f2;--color-bg-cool: #d5dee1;--color-text: #000000;--color-text-secondary: #3d3d3d;--color-text-muted: #6b7280;--color-surface: #ffffff;--color-border: rgba(0, 0, 0, .08);--color-border-hover: rgba(0, 0, 0, .15);--color-success: #16a34a;--color-success-bg: rgba(22, 163, 74, .08);--color-success-border: rgba(22, 163, 74, .2);--color-error: #dc2626;--color-error-bg: rgba(220, 38, 38, .06);--color-error-border: rgba(220, 38, 38, .15);--color-warning: #d97706;--color-warning-bg: rgba(217, 119, 6, .06);--color-warning-border: rgba(217, 119, 6, .15);--font-heading: "PT Serif", Georgia, serif;--font-body: "PT Sans", system-ui, sans-serif;--step--2: clamp(.69rem, calc(.66rem + .18vw) , .8rem);--step--1: clamp(.83rem, calc(.79rem + .22vw) , .96rem);--step-0: clamp(1rem, calc(.95rem + .24vw) , 1.13rem);--step-1: clamp(1.2rem, calc(1.13rem + .33vw) , 1.35rem);--step-2: clamp(1.44rem, calc(1.34rem + .48vw) , 1.62rem);--step-3: clamp(1.73rem, calc(1.58rem + .72vw) , 1.94rem);--step-4: clamp(2.07rem, calc(1.86rem + 1.07vw) , 2.33rem);--step-5: clamp(2.49rem, calc(2.13rem + 1.79vw) , 3.49rem);--space-3xs: clamp(.25rem, calc(.23rem + .09vw) , .31rem);--space-2xs: clamp(.5rem, calc(.48rem + .12vw) , .56rem);--space-xs: clamp(.75rem, calc(.7rem + .24vw) , .88rem);--space-sm: clamp(1rem, calc(.95rem + .24vw) , 1.13rem);--space-md: clamp(1.5rem, calc(1.41rem + .47vw) , 1.75rem);--space-lg: clamp(2rem, calc(1.87rem + .65vw) , 2.33rem);--space-xl: clamp(3rem, calc(2.8rem + .98vw) , 3.5rem);--space-2xl: clamp(4rem, calc(3.73rem + 1.31vw) , 4.66rem);--safe-top: env(safe-area-inset-top);--safe-bottom: env(safe-area-inset-bottom);--safe-left: env(safe-area-inset-left);--safe-right: env(safe-area-inset-right);color-scheme:light}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--color-bg-light);color:var(--color-text);min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:var(--step-0);line-height:1.6}#root{min-height:100vh}h1,h2,h3,h4{font-family:var(--font-heading);color:var(--color-text);line-height:1.2}.glass-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:1.25rem;box-shadow:0 1px 3px #0000000a,0 4px 16px #00000008;transition:box-shadow .3s ease,border-color .3s ease}.glass-card:hover{border-color:var(--color-border-hover);box-shadow:0 2px 8px #0000000f,0 8px 24px #0000000a}.glass-card-inner{background:var(--color-bg-light);border:1px solid var(--color-border);border-radius:.875rem}.badge{display:inline-flex;align-items:center;gap:.375rem;padding:.25rem .75rem;border-radius:999px;font-family:var(--font-body);font-size:var(--step--2);font-weight:600;letter-spacing:.025em;text-transform:uppercase;border:1px solid var(--color-border);background:var(--color-bg-light);color:var(--color-text-secondary);transition:all .2s ease}.badge-accent{border-color:var(--accent-color, var(--color-primary-border));background:var(--color-primary-light);color:var(--accent-color, var(--color-primary))}.badge-solid{background:var(--accent-color, var(--color-primary));border-color:transparent;color:var(--color-surface)}.badge-streak{background:#d977061a;border-color:#d9770640;color:var(--color-warning)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.875rem 1.5rem;border-radius:.75rem;font-family:var(--font-body);font-size:var(--step--1);font-weight:700;cursor:pointer;transition:all .2s ease;border:none;outline:none;position:relative;overflow:hidden;min-height:48px}.btn-primary{background:var(--color-primary);color:var(--color-surface);box-shadow:0 2px 8px #ab303033}.btn-primary:hover{background:var(--color-primary-hover);box-shadow:0 4px 16px #ab30304d;transform:translateY(-1px)}.btn-primary:active{transform:translateY(0) scale(.98)}.btn-ghost{background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border)}.btn-ghost:hover{background:var(--color-bg-light);border-color:var(--color-border-hover)}.option-btn{display:flex;align-items:flex-start;gap:.75rem;width:100%;padding:1rem 1.25rem;border-radius:.75rem;font-family:var(--font-body);font-size:var(--step--1);line-height:1.6;text-align:left;cursor:pointer;background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text-secondary);transition:all .25s ease;position:relative;overflow:hidden;min-height:48px}.option-btn:hover{border-color:var(--color-primary-border);color:var(--color-text);transform:translate(4px);box-shadow:0 2px 12px #ab30300f}.option-btn:active{transform:translate(2px) scale(.995)}.option-letter{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border-radius:.5rem;font-size:var(--step--2);font-weight:700;background:var(--color-primary-light);border:1px solid var(--color-primary-border);color:var(--color-primary);margin-top:.1rem}.progress-track{width:100%;height:.5rem;border-radius:999px;background:var(--color-bg-cool);overflow:hidden}.progress-fill{height:100%;border-radius:999px;background:var(--color-primary);transition:width .6s cubic-bezier(.4,0,.2,1);position:relative}.progress-fill:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:shimmer 2s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.icon-ring{display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;border-radius:.875rem;background:var(--color-primary-light);border:1px solid var(--color-primary-border);color:var(--color-primary);position:relative}.icon-ring:after{content:"";position:absolute;inset:-3px;border-radius:inherit;background:radial-gradient(circle,rgba(171,48,48,.1),transparent 70%);animation:pulse-glow 3s ease-in-out infinite;z-index:-1}@keyframes pulse-glow{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.15)}}.stat-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:1rem;padding:1.25rem;transition:all .3s ease}.stat-card:hover{border-color:var(--color-border-hover);box-shadow:0 4px 16px #0000000a}.stat-label{font-family:var(--font-body);font-size:var(--step--2);font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.stat-value{font-family:var(--font-heading);font-size:var(--step-3);font-weight:700;margin-top:.5rem;color:var(--color-text)}.feedback-correct{background:var(--color-success-bg);border:1px solid var(--color-success-border);border-radius:.875rem;padding:1rem 1.25rem}.feedback-incorrect{background:var(--color-error-bg);border:1px solid var(--color-error-border);border-radius:.875rem;padding:1rem 1.25rem}.perspective-card{width:100%;padding:1.5rem;border-radius:1rem;text-align:left;cursor:pointer;transition:all .35s cubic-bezier(.4,0,.2,1);border:1px solid var(--color-border);background:var(--color-surface);position:relative;overflow:hidden}.perspective-card:hover{border-color:var(--color-border-hover);transform:translateY(-2px);box-shadow:0 8px 24px #0000000f}.perspective-card-selected{border-color:var(--color-primary);background:var(--color-surface);box-shadow:0 0 0 1px var(--color-primary-border),0 4px 20px #ab303014}.alert{display:flex;gap:.75rem;padding:1rem 1.25rem;border-radius:.875rem;font-family:var(--font-body);font-size:var(--step--1);line-height:1.6}.alert-amber{background:var(--color-warning-bg);border:1px solid var(--color-warning-border);color:var(--color-warning)}.alert-sky{background:#0e74900f;border:1px solid rgba(14,116,144,.15);color:#0e7490}.alert-rose{background:var(--color-error-bg);border:1px solid var(--color-error-border);color:var(--color-error)}.game-container{position:relative;z-index:1;min-height:100vh;padding:var(--space-md);padding-top:max(var(--space-md),var(--safe-top));padding-bottom:max(var(--space-md),var(--safe-bottom));padding-left:max(var(--space-md),var(--safe-left));padding-right:max(var(--space-md),var(--safe-right))}@media(min-width:768px){.game-container{padding:var(--space-xl)}}.game-inner{max-width:72rem;margin:0 auto}.history-item{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-radius:.875rem;background:var(--color-bg-light);border:1px solid var(--color-border);transition:all .2s ease;min-height:48px}.history-item:hover{border-color:var(--color-border-hover)}@keyframes score-fly{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-40px) scale(1.3)}}.score-fly{animation:score-fly .8s ease-out forwards;position:absolute;font-weight:700;font-size:var(--step-1);pointer-events:none}.accuracy-ring{width:120px;height:120px}.accuracy-ring circle{fill:none;stroke-width:8;stroke-linecap:round}.accuracy-ring .track{stroke:var(--color-bg-cool)}.accuracy-ring .fill{stroke:var(--color-primary);transition:stroke-dashoffset 1.2s cubic-bezier(.4,0,.2,1);transform-origin:center;transform:rotate(-90deg)}.option-btn:focus-visible,.btn:focus-visible,.perspective-card:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--color-primary);outline-offset:4px;box-shadow:0 0 0 4px #ab303026;border-radius:inherit}@media(prefers-reduced-motion:reduce){.progress-fill:after{animation:none}.icon-ring:after{animation:none}.score-fly{animation:none}*{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}.social-post{background:var(--color-surface);border:1px solid var(--color-border);border-radius:.875rem;overflow:hidden}.social-post-header{display:flex;align-items:center;gap:.625rem;padding:.875rem 1.25rem;border-bottom:1px solid var(--color-border)}.social-post-avatar{width:2.25rem;height:2.25rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-body);font-weight:700;font-size:var(--step--2);color:var(--color-surface);flex-shrink:0}.social-post-meta{display:flex;flex-direction:column;gap:.0625rem}.social-post-author{font-family:var(--font-body);font-size:var(--step--1);font-weight:600;color:var(--color-text)}.social-post-handle{font-family:var(--font-body);font-size:var(--step--2);color:var(--color-text-muted)}.social-post-body{padding:1rem 1.25rem;font-family:var(--font-body);font-size:var(--step-0);line-height:1.75;color:var(--color-text-secondary)}.social-post-footer{display:flex;align-items:center;gap:1.5rem;padding:.625rem 1.25rem;border-top:1px solid var(--color-border);color:var(--color-text-muted);font-family:var(--font-body);font-size:var(--step--2)}.social-post-action{display:flex;align-items:center;gap:.3rem}.phase-stepper{display:flex;align-items:center;gap:.25rem;margin-bottom:1rem}.phase-step{display:flex;align-items:center;gap:.25rem;font-family:var(--font-body);font-size:var(--step--2);font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-muted);opacity:.5;transition:all .3s ease}.phase-step.active{opacity:1;color:var(--color-primary)}.phase-step.done{opacity:.7;color:var(--color-success)}.phase-step-dot{width:.375rem;height:.375rem;border-radius:50%;background:currentColor}.phase-step-divider{width:1rem;height:1px;background:var(--color-bg-cool);margin:0 .125rem}.split-screen{display:grid;grid-template-columns:1fr;gap:var(--space-md)}@media(min-width:1024px){.split-screen{grid-template-columns:1fr 1fr;gap:var(--space-lg);align-items:start}}.macro-watermark{position:relative;overflow:hidden}.macro-watermark:before{content:attr(data-tactic);position:absolute;bottom:-.5rem;right:-.5rem;font-family:var(--font-heading);font-size:clamp(4rem,10vw,8rem);font-weight:900;letter-spacing:-.04em;line-height:.85;color:#00000008;pointer-events:none;text-transform:uppercase;white-space:nowrap;z-index:0}.macro-watermark>*{position:relative;z-index:1}.option-pill{display:inline-flex;align-items:center;gap:.5rem;padding:.875rem 1.25rem;border-radius:999px;font-family:var(--font-body);font-size:var(--step--1);font-weight:600;line-height:1.4;text-align:left;cursor:pointer;background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text-secondary);transition:all .25s ease;position:relative;overflow:hidden;min-height:48px}.option-pill:hover{background:var(--color-primary-light);border-color:var(--color-primary-border);color:var(--color-text);transform:translateY(-2px);box-shadow:0 4px 12px #ab303014}.option-pill:active{transform:translateY(0) scale(.98)}.option-pill:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.hint-banner{display:flex;align-items:flex-start;gap:.75rem;padding:1.25rem 1.5rem;border-radius:.875rem;background:var(--color-warning-bg);border:1px solid var(--color-warning-border)}.hint-banner-icon{flex-shrink:0;margin-top:.1rem}.hint-banner-content{display:flex;flex-direction:column;gap:.5rem}.hint-banner-title{font-family:var(--font-body);font-size:var(--step--1);font-weight:700;color:var(--color-warning)}.hint-banner-body{font-family:var(--font-body);font-size:var(--step--1);line-height:1.6;color:var(--color-text-secondary)}.hint-banner-retry{display:inline-flex;align-items:center;gap:.375rem;padding:.5rem 1rem;border-radius:999px;font-family:var(--font-body);font-size:var(--step--2);font-weight:600;background:var(--color-warning-bg);border:1px solid var(--color-warning-border);color:var(--color-warning);cursor:pointer;transition:all .2s ease;align-self:flex-start;min-height:40px}.hint-banner-retry:hover{background:#d977061f;transform:translateY(-1px)}.wallet-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:1rem;padding:var(--space-lg);position:relative;overflow:hidden}.wallet-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--color-primary)}.wallet-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-md)}.wallet-card-badge{display:inline-flex;align-items:center;gap:.375rem;padding:.25rem .75rem;border-radius:999px;font-family:var(--font-body);font-size:var(--step--2);font-weight:700;text-transform:uppercase;letter-spacing:.05em;background:var(--color-primary-light);border:1px solid var(--color-primary-border);color:var(--color-primary)}.wallet-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:var(--space-md)}@media(max-width:480px){.wallet-card-grid{grid-template-columns:1fr}}.wallet-card-stat{padding:1rem;border-radius:.75rem;background:var(--color-bg-light);border:1px solid var(--color-border)}.wallet-card-stat-label{font-family:var(--font-body);font-size:var(--step--2);font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);margin-bottom:.375rem}.wallet-card-stat-value{font-family:var(--font-heading);font-size:var(--step-1);font-weight:700;color:var(--color-text)}.wallet-card-insight{padding:1rem 1.25rem;border-radius:.75rem;background:var(--color-primary-light);border:1px solid var(--color-primary-border);margin-bottom:1rem}.wallet-card-insight-label{font-family:var(--font-body);font-size:var(--step--2);font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--color-primary);margin-bottom:.375rem}.wallet-card-insight-value{font-family:var(--font-body);font-size:var(--step--1);line-height:1.6;color:var(--color-text-secondary)}.wallet-card-footer{display:flex;align-items:center;justify-content:space-between;padding-top:1rem;border-top:1px solid var(--color-border);font-family:var(--font-body);font-size:var(--step--2);color:var(--color-text-muted)}.segment-btn{background:transparent;border:none;border-radius:4px;color:inherit;font:inherit;padding:2px 4px;margin:0 -2px;cursor:pointer;text-align:left;transition:all .2s ease;position:relative;z-index:1;min-height:32px}.segment-btn:hover,.segment-btn:focus-visible{outline:none;background:#0000000f}.segment-btn.spotted{background:var(--color-primary-light);color:var(--color-primary);box-shadow:0 2px 12px #ab303026;transform:translateY(-2px);z-index:10;font-weight:600}.segment-dim{opacity:.4;transition:opacity .3s ease}@keyframes shudder{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.wrong-click{animation:shudder .3s ease;background:var(--color-error-bg)!important;color:var(--color-error);border-radius:4px}@keyframes pristine-glow{0%{box-shadow:0 0 #16a34a00}50%{box-shadow:0 0 20px #16a34a33}to{box-shadow:0 0 8px #16a34a1a}}.pristine-glow{animation:pristine-glow 1.5s ease-out forwards}@keyframes breathe{0%,to{transform:scale(.9);opacity:.15}50%{transform:scale(1.1);opacity:.4}}.breathing-circle{width:48px;height:48px;border-radius:50%;background:currentColor;animation:breathe 4s ease-in-out infinite}@keyframes ambient-drift{0%{transform:translate(0) scale(1)}33%{transform:translate(3vw,-5vh) scale(1.05)}66%{transform:translate(-2vw,4vh) scale(.95)}to{transform:translate(0) scale(1)}}.ambient-orb{position:absolute;border-radius:50%;filter:blur(80px);animation:ambient-drift 20s infinite alternate ease-in-out;opacity:.4;mix-blend-mode:multiply;content-visibility:auto}@keyframes shimmer-sweep{0%{background-position:-200% center}to{background-position:200% center}}.shimmer-text{font-family:var(--font-heading);background:linear-gradient(110deg,var(--color-text) 20%,var(--color-primary) 40%,var(--color-text) 60%);background-size:200% auto;color:transparent;-webkit-background-clip:text;background-clip:text;animation:shimmer-sweep 8s linear infinite}@keyframes intense-pulse{0%{box-shadow:0 0 #ab30304d}70%{box-shadow:0 0 0 15px #ab303000}to{box-shadow:0 0 #ab303000}}.irresistible-glow{animation:intense-pulse 3s infinite}*{scrollbar-width:none;-ms-overflow-style:none}*::-webkit-scrollbar{display:none}.warmup-banner{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:999px;background:#0e749014;border:1px solid rgba(14,116,144,.2);font-family:var(--font-body);font-size:var(--step--2);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#0e7490;margin-bottom:1rem}.warmup-banner-dot{width:.5rem;height:.5rem;border-radius:50%;background:#0e7490;animation:pulse-glow 2s ease-in-out infinite}.comparison-layout{display:grid;grid-template-columns:1fr;gap:1rem}@media(min-width:768px){.comparison-layout{grid-template-columns:1fr 1fr;gap:1.25rem}.tactic-map-grid{grid-template-columns:repeat(4,1fr)!important}}.comparison-card{padding:1.25rem 1.5rem;border-radius:.875rem;cursor:pointer;transition:all .3s ease;position:relative;border:2px solid var(--color-border);background:var(--color-surface);min-height:48px}.comparison-card:hover{border-color:var(--color-border-hover);transform:translateY(-2px);box-shadow:0 8px 24px #0000000f}.comparison-card.comparison-correct{border-color:var(--color-success-border);background:var(--color-success-bg);box-shadow:0 0 16px #16a34a14}.comparison-card.comparison-wrong{border-color:var(--color-error-border);background:var(--color-error-bg);animation:shudder .3s ease}.comparison-label{display:inline-flex;align-items:center;gap:.25rem;padding:.2rem .5rem;border-radius:999px;font-family:var(--font-body);font-size:var(--step--2);font-weight:700;text-transform:uppercase;letter-spacing:.04em;margin-bottom:.75rem}.comparison-label-neutral{background:#0000000a;border:1px solid var(--color-border);color:var(--color-text-muted)}.comparison-label-manipulated{background:var(--color-warning-bg);border:1px solid var(--color-warning-border);color:var(--color-warning)}.trust-marker{display:flex;align-items:flex-start;gap:.625rem;padding:.875rem 1rem;border-radius:.625rem;background:var(--color-success-bg);border:1px solid var(--color-success-border);font-family:var(--font-body);font-size:var(--step--1);line-height:1.6;color:var(--color-text-secondary)}.trust-marker-icon{flex-shrink:0;margin-top:.1rem;color:var(--color-success)}.trust-marker-label{font-family:var(--font-body);font-size:var(--step--2);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-success);margin-bottom:.25rem}.mobile-tactic-inline{display:block}.desktop-tactic-only{display:none}@media(min-width:1024px){.mobile-tactic-inline{display:none}.desktop-tactic-only{display:flex;flex-direction:column;gap:1rem}}.resource-card{display:flex;flex-direction:column;gap:.375rem;padding:1rem 1.25rem;border-radius:.75rem;background:var(--color-bg-light);border:1px solid var(--color-border);transition:all .2s ease;text-decoration:none;min-height:48px}.resource-card:hover{border-color:var(--color-primary-border);background:var(--color-surface);transform:translate(4px)}.resource-card-name{font-family:var(--font-body);font-size:var(--step--1);font-weight:600;color:var(--color-primary)}.resource-card-desc{font-family:var(--font-body);font-size:var(--step--2);line-height:1.5;color:var(--color-text-muted)}.refresher-interstitial{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:1.5rem;background:#0000004d;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.refresher-interstitial-card{width:100%;max-width:30rem;max-height:90vh;overflow-y:auto;background:#fffffffa;border:1px solid rgba(0,0,0,.08);border-radius:1.5rem;padding:2rem;box-shadow:0 24px 64px #0000001f,inset 0 1px #0000000a}.refresher-interstitial-card .glass-card{border:none;box-shadow:none;padding:0;background:transparent}.refresher-skip-link{background:none;border:none;font-family:var(--font-body);font-size:.78rem;color:var(--color-text-muted);cursor:pointer;padding:.375rem;transition:color .2s ease}.refresher-skip-link:hover{color:var(--color-text-secondary)}.skip-confirm{overflow:hidden;text-align:center;padding:.875rem 1rem;border-radius:.875rem;background:#fbbf240f;border:1px solid rgba(251,191,36,.15)}@media(max-width:480px){.refresher-interstitial{padding:1rem;align-items:flex-end}.refresher-interstitial-card{max-height:85vh;border-radius:1.5rem 1.5rem .75rem .75rem;padding:1.5rem}}
