:root{--color-bg-primary: #1a1a2e;--color-bg-secondary: #16213e;--color-bg-tertiary: #232342;--color-bg-elevated: #1f2937;--color-bg-overlay: rgba(0, 0, 0, .9);--color-bg-bar: #0f0f23;--color-text-primary: #f0f0f0;--color-text-secondary: #a0a0a0;--color-text-muted: #6b7280;--color-text-tertiary: #6b7280;--color-border: rgba(255, 255, 255, .08);--color-border-light: rgba(255, 255, 255, .12);--color-surface-raised: #1f2937;--color-accent: #e94560;--color-accent-hover: #ff6b8a;--color-accent-glow: rgba(233, 69, 96, .4);--color-accent-subtle: rgba(233, 69, 96, .15);--color-store: var(--color-water);--color-store-subtle: rgba(96, 165, 250, .15);--color-channel: var(--color-fire);--color-channel-subtle: rgba(249, 115, 22, .15);--color-success: #4ade80;--color-warning: #facc15;--color-error: #ef4444;--color-nature: #4ade80;--color-water: #60a5fa;--color-fire: #f97316;--color-earth: #d4a574;--color-light: #facc15;--color-shadow: #9ca3af;--color-arcane: #c084fc;--color-energy: #34d399;--color-rarity-legendary: #ff6b6b;--color-rarity-rare: #c084fc;--color-rarity-uncommon: #60a5fa;--color-rarity-common: #4ade80;--color-rarity-basic: #9ca3af;--color-gold: #ffd700;--color-silver: #c0c0c0;--color-bronze: #cd7f32;--bg-dark: var(--color-bg-primary);--bg-card: var(--color-bg-secondary);--accent: var(--color-accent);--text: var(--color-text-primary);--text-dim: var(--color-text-secondary);--nature: var(--color-nature);--water: var(--color-water);--fire: var(--color-fire);--earth: var(--color-earth);--light: var(--color-light);--shadow: var(--color-shadow);--arcane: var(--color-arcane);--energy: var(--color-energy);--space-xs: .25rem;--space-sm: .5rem;--space-md: .75rem;--space-lg: 1rem;--space-xl: 1.5rem;--space-2xl: 2rem;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-size-xs: .7rem;--font-size-sm: .75rem;--font-size-base: .85rem;--font-size-md: .9rem;--font-size-lg: 1rem;--font-size-xl: 1.1rem;--font-size-2xl: 1.25rem;--font-size-3xl: 2rem;--radius-xs: .2rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-full: 9999px;--nav-height: 70px;--header-height: 44px;--max-width: 500px;--safe-area-top: env(safe-area-inset-top, 0px);--safe-area-bottom: env(safe-area-inset-bottom, 0px);--reveal-btn-size: 100px;--reveal-btn-font: .9rem;--section-gap: 1rem;--mana-bar-height: 1.75rem;--transition-fast: .15s ease;--transition-normal: .2s ease;--transition-slow: .3s ease;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .2);--shadow-md: 0 2px 8px rgba(0, 0, 0, .3);--shadow-lg: 0 4px 16px rgba(0, 0, 0, .4);--shadow-glow: 0 0 20px var(--color-accent-glow);--shadow-text: 0 0 4px rgba(0, 0, 0, .8);--glass-bg: rgba(26, 26, 46, .75);--glass-bg-light: rgba(35, 35, 66, .6);--glass-bg-dark: rgba(15, 15, 35, .85);--glass-border: rgba(255, 255, 255, .08);--glass-border-light: rgba(255, 255, 255, .12);--glass-blur: 12px;--glass-blur-heavy: 20px;--glow-accent: 0 0 20px rgba(233, 69, 96, .4);--glow-accent-strong: 0 0 30px rgba(233, 69, 96, .5), 0 0 60px rgba(233, 69, 96, .2);--glow-accent-subtle: 0 0 10px rgba(233, 69, 96, .25);--glow-mana: 0 0 15px rgba(233, 69, 96, .5);--glow-success: 0 0 15px rgba(74, 222, 128, .4);--glow-legendary: 0 0 25px rgba(255, 107, 107, .5), 0 0 50px rgba(255, 107, 107, .25);--glow-rare: 0 0 20px rgba(192, 132, 252, .4);--glow-nature: 0 0 15px rgba(74, 222, 128, .4);--glow-water: 0 0 15px rgba(96, 165, 250, .4);--glow-fire: 0 0 15px rgba(249, 115, 22, .4);--glow-earth: 0 0 15px rgba(212, 165, 116, .4);--glow-light: 0 0 15px rgba(250, 204, 21, .4);--glow-shadow: 0 0 15px rgba(156, 163, 175, .3);--glow-arcane: 0 0 15px rgba(192, 132, 252, .4);--glow-energy: 0 0 15px rgba(52, 211, 153, .4);--gradient-ethereal: radial-gradient(ellipse at 50% 0%, rgba(233, 69, 96, .12) 0%, transparent 50%);--gradient-ethereal-bottom: radial-gradient(ellipse at 50% 100%, rgba(233, 69, 96, .08) 0%, transparent 40%);--gradient-glass-highlight: linear-gradient(180deg, rgba(255, 255, 255, .08) 0%, transparent 50%);--gradient-shimmer: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, .1) 50%, transparent 100%);--gradient-accent-btn: linear-gradient(180deg, var(--color-accent) 0%, rgba(200, 50, 80, 1) 100%);--shadow-glow-soft: 0 4px 20px rgba(0, 0, 0, .3), 0 0 40px rgba(233, 69, 96, .1);--shadow-elevated-glass: 0 8px 32px rgba(0, 0, 0, .4), 0 0 0 1px var(--glass-border)}@media (max-width: 380px){:root{--reveal-btn-size: 85px;--reveal-btn-font: .8rem;--section-gap: .75rem;--space-lg: .75rem;--font-size-base: .8rem}}@media (max-height: 600px){:root{--reveal-btn-size: 70px;--reveal-btn-font: .75rem;--section-gap: .5rem;--mana-bar-height: 1.5rem;--header-height: 36px;--nav-height: 60px}}a,button,[role=button],input,textarea,select,[tabindex]{-webkit-tap-highlight-color:transparent;outline:none}a:focus-visible,button:focus-visible,[role=button]:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.btn{font-family:var(--font-family);font-size:var(--font-size-base);font-weight:600;padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);border:none;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);-webkit-tap-highlight-color:transparent;position:relative;overflow:hidden}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--gradient-accent-btn);color:#fff;box-shadow:0 2px 10px #e945604d}.btn-primary:hover:not(:disabled){box-shadow:0 4px 20px #e9456066}.btn-primary:active:not(:disabled){transform:scale(.97);box-shadow:0 2px 15px #e9456080;opacity:.9}.btn-secondary{background:var(--glass-bg-light);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--color-text-primary);border:1px solid var(--glass-border)}.btn-secondary:hover:not(:disabled){background:var(--glass-bg);border-color:var(--glass-border-light)}.btn-secondary:active:not(:disabled){background:var(--color-bg-elevated)}.btn-outline{background:transparent;border:2px solid var(--color-accent);color:var(--color-accent)}.btn-blue{background:#3b82f6;color:#fff}.btn-blue:active:not(:disabled){background:#2563eb}.btn-outline:active:not(:disabled){background:var(--color-accent);color:#fff}.btn-ghost{background:transparent;color:var(--color-text-secondary);border:none}.btn-ghost:active:not(:disabled){color:var(--color-accent)}.btn-xs{padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-xs)}.btn-sm{padding:var(--space-xs) var(--space-md);font-size:var(--font-size-sm)}.btn-lg{padding:var(--space-md) var(--space-xl);font-size:var(--font-size-lg)}.btn-block{width:100%}.card{background:var(--glass-bg-light);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:var(--radius-lg);padding:var(--space-lg);border:1px solid var(--glass-border);transition:transform var(--transition-fast),box-shadow var(--transition-fast),border-color var(--transition-fast)}.card:hover{border-color:var(--glass-border-light);box-shadow:var(--shadow-elevated-glass)}.card-compact{padding:var(--space-md)}.card-bordered{border:1px solid var(--glass-border-light)}.card-elevated{box-shadow:var(--shadow-md)}.card-accent{border:1px solid rgba(233,69,96,.3);background:#e945600d;box-shadow:0 0 20px #e945601a}.card-accent:hover{border-color:#e9456080;box-shadow:0 0 30px #e9456033}.card-accent-strong{border:2px solid var(--color-accent);background:var(--color-accent-subtle);box-shadow:var(--shadow-glow)}.badge{display:inline-flex;align-items:center;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:700;line-height:1}.badge-accent{background:var(--color-accent);color:#fff}.badge-dark{background:#000000b3;color:#fff}.badge-rarity-10,.badge-rarity-9{background:var(--color-rarity-legendary);color:#000}.badge-rarity-8,.badge-rarity-7{background:var(--color-rarity-rare);color:#000}.badge-rarity-6,.badge-rarity-5{background:var(--color-rarity-uncommon);color:#000}.badge-rarity-4,.badge-rarity-3{background:var(--color-rarity-common);color:#000}.badge-rarity-2,.badge-rarity-1{background:var(--color-rarity-basic);color:#000}.badge-nature{background:var(--color-nature);color:#000}.badge-water{background:var(--color-water);color:#000}.badge-fire{background:var(--color-fire);color:#000}.badge-earth{background:var(--color-earth);color:#000}.badge-light{background:var(--color-light);color:#000}.badge-shadow{background:var(--color-shadow);color:#fff}.badge-arcane{background:var(--color-arcane);color:#000}.badge-energy{background:var(--color-energy);color:#000}.chip{display:inline-flex;align-items:center;gap:var(--space-xs);padding:.35rem .75rem;border-radius:var(--radius-full);font-size:var(--font-size-sm);font-weight:500;background:var(--color-bg-secondary);color:var(--color-text-secondary);border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.chip:hover{border-color:var(--color-text-muted)}.chip.active{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.chip-icon{font-size:.9em}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-sm)}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-sm)}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-sm)}.grid-responsive{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-sm)}@media (min-width: 380px){.grid-responsive{grid-template-columns:repeat(3,1fr)}}.input{width:100%;padding:var(--space-lg);border-radius:var(--radius-md);border:2px solid var(--color-bg-secondary);background:var(--color-bg-secondary);color:var(--color-text-primary);font-size:var(--font-size-lg);font-family:var(--font-family);transition:border-color var(--transition-fast)}.input:focus{outline:none;border-color:var(--color-accent)}.input::placeholder{color:var(--color-text-secondary)}.input-sm{padding:var(--space-md);font-size:var(--font-size-base)}.textarea{resize:vertical;min-height:100px}.checkbox-label{display:flex;align-items:flex-start;gap:var(--space-sm);font-size:var(--font-size-base);color:var(--color-text-secondary);cursor:pointer}.checkbox-label input[type=checkbox]{width:18px;height:18px;margin-top:2px;accent-color:var(--color-accent);cursor:pointer;flex-shrink:0}.progress-bar{background:var(--color-bg-bar);border-radius:var(--radius-md);height:.5rem;overflow:hidden}.progress-bar-fill{height:100%;background:var(--color-accent);transition:width var(--transition-slow)}.progress-bar-lg{height:var(--mana-bar-height);border-radius:var(--radius-md)}.thumbnail{aspect-ratio:3/4;background:var(--color-bg-secondary);border-radius:var(--radius-md);overflow:hidden;position:relative;cursor:pointer}.thumbnail img{width:100%;height:100%;object-fit:cover}.thumbnail-badge{position:absolute;top:var(--space-xs);right:var(--space-xs);background:#000000b3;padding:.1rem .3rem;border-radius:var(--radius-xs);font-size:var(--font-size-xs);font-weight:700}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--color-bg-overlay);display:flex;align-items:flex-start;justify-content:center;padding:var(--space-lg);padding-top:max(var(--space-2xl),var(--safe-area-top));z-index:10001;overflow-y:auto;overscroll-behavior-y:contain}.modal-content{max-width:500px;width:100%;background:var(--color-bg-secondary);border-radius:var(--radius-xl);padding:var(--space-xl);position:relative}.modal-close{position:absolute;top:var(--space-md);right:var(--space-md);background:#000000b3;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.15);color:#ffffffe6;font-size:1.25rem;font-weight:300;width:44px;height:44px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;-webkit-tap-highlight-color:transparent}.modal-close:hover{background:#000000e6}.divider{height:1px;background:#ffffff1a;margin:var(--space-lg) 0}.divider-sm{margin:var(--space-sm) 0}.text-accent{color:var(--color-accent)}.text-muted{color:var(--color-text-muted)}.text-dim{color:var(--color-text-secondary)}.text-success{color:var(--color-success)}.text-warning{color:var(--color-warning)}.text-error{color:var(--color-error)}.text-xs{font-size:var(--font-size-xs)}.text-sm{font-size:var(--font-size-sm)}.text-base{font-size:var(--font-size-base)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.text-bold{font-weight:700}.text-medium{font-weight:500}.text-center{text-align:center}.text-right{text-align:right}.text-uppercase{text-transform:uppercase;letter-spacing:.05em}.flex{display:flex}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.flex-1{flex:1}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.gap-xs{gap:var(--space-xs)}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.gap-lg{gap:var(--space-lg)}.p-sm{padding:var(--space-sm)}.p-md{padding:var(--space-md)}.p-lg{padding:var(--space-lg)}.p-xl{padding:var(--space-xl)}.mt-sm{margin-top:var(--space-sm)}.mt-md{margin-top:var(--space-md)}.mt-lg{margin-top:var(--space-lg)}.mt-xl{margin-top:var(--space-xl)}.mb-sm{margin-bottom:var(--space-sm)}.mb-md{margin-bottom:var(--space-md)}.mb-lg{margin-bottom:var(--space-lg)}.mb-xl{margin-bottom:var(--space-xl)}.hidden{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes scaleIn{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes slideUp{0%{transform:translate(-50%) translateY(20px);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}@keyframes slideDown{0%{transform:translate(-50%) translateY(0);opacity:1}to{transform:translate(-50%) translateY(20px);opacity:0}}@keyframes pulse{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}@keyframes scan{0%{top:0}50%{top:calc(100% - 4px)}to{top:0}}@keyframes levelUp{0%{transform:scale(.5) rotate(-10deg);opacity:0}50%{transform:scale(1.2) rotate(5deg)}to{transform:scale(1) rotate(0);opacity:1}}@keyframes shine{0%,to{filter:brightness(1)}50%{filter:brightness(1.3)}}@keyframes dots{0%,20%{content:"."}40%{content:".."}60%,to{content:"..."}}.animate-fadeIn{animation:fadeIn .3s ease}.animate-scaleIn{animation:scaleIn .5s ease}.animate-pulse{animation:pulse 2s ease infinite}.animate-levelUp{animation:levelUp .6s ease}.animate-shine{animation:shine 1s ease infinite}.overlay{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10000;animation:fadeIn .3s ease}.overlay-dark{background:#000000e6}.overlay-medium{background:#000c}.scan-container{position:relative;width:150px;height:150px;margin-bottom:var(--space-2xl)}.scan-ring{position:absolute;top:0;right:0;bottom:0;left:0;border:3px solid var(--color-accent);border-radius:50%;animation:pulse 2s ease infinite}.scan-ring-inner{position:absolute;top:20px;right:20px;bottom:20px;left:20px;border:2px solid var(--color-accent);border-radius:50%;opacity:.7;animation:pulse 2s ease infinite .3s}.scan-ring-center{position:absolute;top:40px;right:40px;bottom:40px;left:40px;border:2px solid var(--color-accent);border-radius:50%;opacity:.5;animation:pulse 2s ease infinite .6s}.scan-line{position:absolute;left:0;right:0;height:4px;background:linear-gradient(90deg,transparent,var(--color-accent),transparent);animation:scan 2s ease-in-out infinite}.scanning-text:after{content:"";animation:dots 1.5s infinite}.onboarding-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000f2;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10001;animation:fadeIn .3s ease;padding:var(--space-md);box-sizing:border-box}.onboarding-card{background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--space-2xl);max-width:320px;width:100%;text-align:center;animation:slideUp .4s ease}.onboarding-card.slide-left{animation:onboardingSlideLeft .25s ease}.onboarding-card.slide-right{animation:onboardingSlideRight .25s ease}@keyframes onboardingSlideLeft{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes onboardingSlideRight{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}.onboarding-icon{font-size:3.5rem;margin-bottom:var(--space-md);line-height:1}.onboarding-title{color:var(--color-accent);font-size:var(--font-size-xl);margin:0 0 var(--space-md) 0;font-weight:700}.onboarding-content{color:var(--color-text-primary);font-size:var(--font-size-base);line-height:1.6;margin:0 0 var(--space-lg) 0}.onboarding-dots{display:flex;justify-content:center;gap:var(--space-sm);margin-bottom:var(--space-lg)}.onboarding-dot{width:10px;height:10px;border-radius:50%;background:var(--color-text-dim);transition:background .2s ease,transform .2s ease;cursor:pointer}.onboarding-dot:hover{background:var(--color-text-secondary)}.onboarding-dot.active{background:var(--color-accent);transform:scale(1.2)}.onboarding-buttons{display:flex;justify-content:space-between;gap:var(--space-md)}.onboarding-btn{flex:1;padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);font-weight:700;font-size:var(--font-size-base);cursor:pointer;transition:opacity .2s ease,transform .1s ease}.onboarding-btn:active{transform:scale(.98)}.onboarding-btn-back{background:transparent;border:2px solid var(--color-text-dim);color:var(--color-text-dim)}.onboarding-btn-back:hover{border-color:var(--color-text-secondary);color:var(--color-text-secondary)}.onboarding-btn-skip{background:transparent;border:2px solid var(--color-text-dim);color:var(--color-text-dim)}.onboarding-btn-skip:hover{border-color:var(--color-text-secondary);color:var(--color-text-secondary)}.onboarding-btn-next{background:var(--color-accent);border:none;color:#fff}.onboarding-btn-next:hover{opacity:.9}.first-time-tooltip{position:fixed;z-index:10002;animation:fadeIn .2s ease,bounceIn .3s ease}@keyframes bounceIn{0%{transform:scale(.9)}50%{transform:scale(1.02)}to{transform:scale(1)}}.first-time-tooltip.tooltip-exit{animation:fadeOut .2s ease forwards}@keyframes fadeOut{to{opacity:0;transform:scale(.95)}}.first-time-tooltip-content{background:var(--color-bg-secondary);border:1px solid var(--color-accent);border-radius:var(--radius-md);padding:var(--space-md);max-width:260px;box-shadow:var(--shadow-lg),0 0 20px #e9456033}.first-time-tooltip-title{color:var(--color-accent);font-weight:700;font-size:var(--font-size-base);margin-bottom:var(--space-xs)}.first-time-tooltip-text{color:var(--color-text-primary);font-size:var(--font-size-sm);line-height:1.5;margin-bottom:var(--space-md)}.first-time-tooltip-dismiss{background:var(--color-accent);color:#fff;border:none;border-radius:var(--radius-sm);padding:var(--space-xs) var(--space-md);font-size:var(--font-size-sm);font-weight:700;cursor:pointer;width:100%;transition:opacity .2s ease}.first-time-tooltip-dismiss:hover{opacity:.9}.first-time-tooltip-arrow{position:absolute;width:0;height:0;border:8px solid transparent}.first-time-tooltip-above .first-time-tooltip-arrow{bottom:-16px;left:50%;transform:translate(-50%);border-top-color:var(--color-accent);border-bottom:none}.first-time-tooltip-below .first-time-tooltip-arrow{top:-8px;left:50%;transform:translate(-50%);border-bottom-color:var(--color-accent);border-top:none}.first-time-tooltip-left .first-time-tooltip-arrow{right:-16px;top:50%;transform:translateY(-50%);border-left-color:var(--color-accent);border-right:none}.first-time-tooltip-right .first-time-tooltip-arrow{left:-8px;top:50%;transform:translateY(-50%);border-right-color:var(--color-accent);border-left:none}.walkthrough-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:10003;background:#000000d9;animation:fadeIn .3s ease}.walkthrough-overlay.has-spotlight{background:radial-gradient(ellipse var(--spotlight-width, 100px) var(--spotlight-height, 100px) at var(--spotlight-x, 50%) var(--spotlight-y, 50%),transparent 0%,transparent 50%,rgba(0,0,0,.85) 51%)}.walkthrough-pulse{position:fixed;border:3px solid var(--color-accent);border-radius:var(--radius-lg);animation:walkthroughPulse 1.5s ease-in-out infinite;pointer-events:none}@keyframes walkthroughPulse{0%,to{transform:scale(1);opacity:1;box-shadow:0 0 #e9456066}50%{transform:scale(1.02);opacity:.8;box-shadow:0 0 0 8px #e9456000}}.walkthrough-hint{position:fixed;left:50%;transform:translate(-50%);background:var(--color-bg-secondary);border:1px solid var(--color-accent);border-radius:var(--radius-lg);padding:var(--space-lg);max-width:300px;width:calc(100% - 40px);text-align:center;box-shadow:var(--shadow-lg),0 0 30px #e945604d;animation:slideUp .3s ease}.walkthrough-hint-center{top:50%;transform:translate(-50%,-50%)}.walkthrough-hint-title{color:var(--color-accent);font-size:var(--font-size-lg);font-weight:700;margin-bottom:var(--space-sm)}.walkthrough-hint-text{color:var(--color-text-primary);font-size:var(--font-size-base);line-height:1.5;margin-bottom:var(--space-lg)}.walkthrough-skip{background:transparent;border:1px solid var(--color-text-dim);color:var(--color-text-dim);border-radius:var(--radius-sm);padding:var(--space-xs) var(--space-md);font-size:var(--font-size-sm);cursor:pointer;transition:border-color .2s ease,color .2s ease}.walkthrough-skip:hover{border-color:var(--color-text-secondary);color:var(--color-text-secondary)}.toast{position:fixed;bottom:calc(var(--nav-height) + 30px);left:50%;transform:translate(-50%);background:var(--color-bg-secondary);color:var(--color-text-primary);padding:var(--space-md) var(--space-xl);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:2000;animation:slideUp .3s ease;max-width:90%;text-align:center;font-size:var(--font-size-base)}.toast-exit{animation:slideDown .3s ease forwards}.toast-success{background:linear-gradient(135deg,#059669,#10b981);border-left:3px solid #34d399}.toast-error{background:linear-gradient(135deg,#dc2626,#ef4444);border-left:3px solid #f87171}.toast-warning{background:linear-gradient(135deg,#d97706,#f59e0b);border-left:3px solid #fbbf24;color:#1f2937}.discovery-celebration{text-align:center;animation:scaleIn .5s ease}.discovery-title{font-size:var(--font-size-2xl);margin-bottom:var(--space-sm)}.discovery-subject{font-size:var(--font-size-xl);margin-bottom:var(--space-lg)}.discovery-rewards{display:flex;gap:var(--space-lg);justify-content:center;margin-bottom:var(--space-lg);font-size:var(--font-size-2xl);font-weight:700}.discovery-flavor{color:var(--color-text-secondary);font-style:italic;max-width:300px;margin:0 auto}.discovery-drops{margin-bottom:var(--space-lg);padding:var(--space-sm) var(--space-md);background:#ffffff1a;border-radius:var(--radius-lg);animation:dropBounce .5s ease-out}.discovery-drops-title{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--space-xs);text-transform:uppercase;letter-spacing:.1em}.discovery-drop-item{display:flex;align-items:center;justify-content:center;gap:var(--space-sm);font-size:var(--font-size-lg);font-weight:600;opacity:0;animation:itemCascade .4s ease-out forwards,itemGlow 1s ease-in-out .4s infinite}@keyframes itemCascade{0%{opacity:0;transform:translateY(-10px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.drop-item-icon{font-size:var(--font-size-xl)}.drop-item-name{text-shadow:0 0 10px currentColor}@keyframes dropBounce{0%{transform:scale(0);opacity:0}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}@keyframes itemGlow{0%,to{filter:brightness(1)}50%{filter:brightness(1.3)}}.discovery-celebration.legendary{position:relative}.discovery-celebration.legendary:before{content:"";position:absolute;top:-60px;right:-60px;bottom:-60px;left:-60px;background:radial-gradient(circle at center,rgba(255,107,107,.3) 0%,transparent 70%);animation:legendary-glow 2s ease-in-out infinite;pointer-events:none;z-index:-1}@keyframes legendary-glow{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}.discovery-celebration.legendary .discovery-title{background:linear-gradient(90deg,var(--color-rarity-legendary) 0%,#ffd700 50%,var(--color-rarity-legendary) 100%);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent!important;animation:shimmer 2s linear infinite}@keyframes shimmer{to{background-position:200% center}}.legendary-particles{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;z-index:10}.legendary-particle{position:absolute;width:8px;height:8px;background:var(--color-rarity-legendary);border-radius:50%;left:50%;top:50%;animation:particle-burst 1.5s ease-out forwards}@keyframes particle-burst{0%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) scale(0);opacity:0}}.level-up-content{text-align:center;animation:levelUp .6s ease}.level-up-emoji{font-size:4rem;margin-bottom:var(--space-sm)}.level-up-title{color:var(--color-accent);font-size:var(--font-size-3xl);margin-bottom:var(--space-sm);animation:shine 1s ease infinite}.level-up-number{font-size:3rem;font-weight:700;color:var(--color-energy)}.level-up-subtitle{color:var(--color-text-secondary);margin-top:var(--space-lg)}.level-up-confetti{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;z-index:10000}.confetti-piece{position:absolute;width:10px;height:10px;top:-20px;animation:confetti-fall 2.5s ease-out forwards}.confetti-piece:nth-child(odd){border-radius:50%}@keyframes confetti-fall{0%{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}.spinner{width:30px;height:30px;border:3px solid var(--color-accent);border-top-color:transparent;border-radius:50%;animation:spin 1s linear infinite}.spinner-sm{width:16px;height:16px;border:2px solid var(--color-accent);border-top-color:transparent;border-radius:50%;animation:spin 1s linear infinite;display:inline-block;vertical-align:middle}.btn-loading{position:relative;pointer-events:none}.btn-loading:after{content:"";position:absolute;right:8px;top:50%;transform:translateY(-50%);width:14px;height:14px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite}.skeleton{background:linear-gradient(90deg,var(--color-bg-secondary) 25%,var(--color-bg-tertiary) 50%,var(--color-bg-secondary) 75%);background-size:200% 100%;animation:skeleton-shimmer 1.5s ease-in-out infinite;border-radius:var(--radius-md)}@keyframes skeleton-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-grid-item{aspect-ratio:3/4}.skeleton-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-sm)}@media (min-width: 380px){.skeleton-grid{grid-template-columns:repeat(3,1fr)}}.skeleton-text{height:1em;border-radius:var(--radius-xs)}.skeleton-text-sm{height:.8em;width:60%}.skeleton-avatar{width:40px;height:40px;border-radius:50%}.thumbnail-pending{opacity:.7}.thumbnail-error{opacity:.6}.thumbnail-loading-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#00000080}.discovery-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--color-bg-overlay);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-lg);z-index:10000;touch-action:pan-y}.discovery-modal-container{position:relative;max-width:400px;width:100%;overflow:hidden}.discovery-modal-counter{text-align:center;color:var(--color-text-secondary);font-size:var(--font-size-base);margin-bottom:var(--space-sm)}.discovery-modal-card{background:var(--color-bg-secondary);border-radius:var(--radius-xl);overflow:hidden;position:relative;will-change:transform,opacity;display:flex;flex-direction:column;max-height:calc(var(--vh, 1vh) * 85)}.discovery-modal-card:before{content:"";position:absolute;top:var(--space-sm);left:50%;transform:translate(-50%);width:36px;height:4px;background:#ffffff4d;border-radius:2px;z-index:10}.discovery-modal-image{width:100%;aspect-ratio:3/4;object-fit:cover;flex-shrink:0}.discovery-modal-content{padding:var(--space-lg);flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;min-height:0}.discovery-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-sm)}.discovery-modal-subject{margin:0;font-size:var(--font-size-xl)}.discovery-modal-rarity{font-weight:700}.discovery-modal-badges{display:flex;gap:var(--space-sm);margin-bottom:var(--space-md)}.discovery-modal-badge{padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);font-size:var(--font-size-sm);font-weight:700}.discovery-modal-badge-element{color:#000}.discovery-modal-badge-xp{background:var(--color-accent);color:#fff}.discovery-modal-flavor{color:var(--color-text-secondary);font-style:italic;margin:0;line-height:1.5}.discovery-modal-date{color:var(--color-text-secondary);font-size:var(--font-size-sm);margin-top:var(--space-md)}.discovery-modal-actions{display:flex;gap:var(--space-sm);margin-top:var(--space-lg);justify-content:center}.discovery-action-btn{padding:var(--space-sm) var(--space-xl);border-radius:var(--radius-full);border:none;background:var(--color-bg-tertiary);color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:600;cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.discovery-action-btn:active{transform:scale(.95)}.discovery-action-share{background:var(--color-accent);color:#fff}.discovery-action-share:active{background:var(--color-accent-hover)}.discovery-action-delete{background:#ef444426;color:var(--color-error)}.discovery-action-delete:active{background:#ef44444d}.discovery-action-retry{background:var(--color-warning);color:var(--color-bg-primary)}.discovery-action-retry:active{background:#c8a011}.discovery-action-retry:disabled{opacity:.7;cursor:wait}.discovery-action-retry.loading{animation:pulse 2s ease-in-out infinite}.discovery-action-share-card{background:transparent;color:var(--color-accent);border:1.5px solid var(--color-accent)}.discovery-action-share-card:active{background:var(--color-accent);color:#fff}.discovery-action-share-card:disabled{opacity:.7;cursor:wait}.btn-accent-outline{background:transparent;color:var(--color-accent);border:1.5px solid var(--color-accent)}.btn-accent-outline:active:not(:disabled){background:var(--color-accent);color:#fff}.btn-accent-outline:disabled{opacity:.7;cursor:wait}.discovery-modal-pending-info{padding:var(--space-md);margin:var(--space-md) 0;background:#ffc1071a;border-radius:var(--radius-md);border:1px solid rgba(255,193,7,.3)}.discovery-modal-pending-text{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:1.5;margin:0}.discovery-nav-btn{position:absolute;top:50%;transform:translateY(-50%);background:#00000080;border:none;color:#fff;font-size:2rem;padding:var(--space-sm);cursor:pointer;border-radius:50%;width:44px;height:44px;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent}.discovery-nav-btn:active{background:#000000b3}.discovery-nav-prev{left:var(--space-sm)}.discovery-nav-next{right:var(--space-sm)}.post-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--color-bg-overlay);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:var(--space-md);padding-top:max(var(--space-md),env(safe-area-inset-top));padding-bottom:max(var(--space-md),env(safe-area-inset-bottom));z-index:10001;overflow:hidden}.post-modal-centered{justify-content:center}.post-modal-card{max-width:500px;width:100%;max-height:calc(var(--vh, 1vh) * 90);background:var(--color-bg-secondary);border-radius:var(--radius-xl);overflow:hidden;display:flex;flex-direction:column;position:relative}.post-modal-card:before{content:"";position:absolute;top:8px;left:50%;transform:translate(-50%);width:36px;height:4px;background:#ffffff4d;border-radius:2px;z-index:10}.post-modal-hero{position:relative;flex-shrink:0;background:#0a0a0a}.post-modal-hero .modal-close{position:absolute;top:var(--space-md);right:var(--space-md);z-index:10}.post-modal-image{width:100%;max-height:calc(var(--vh, 1vh) * 55);object-fit:contain;display:block;margin:0 auto}@media (min-height: 700px){.post-modal-image{max-height:calc(var(--vh, 1vh) * 50)}}@media (min-height: 800px){.post-modal-image{max-height:calc(var(--vh, 1vh) * 55)}}.post-author-chip{position:absolute;bottom:var(--space-md);left:var(--space-md);display:flex;align-items:center;gap:var(--space-sm);background:#000000b3;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-full);cursor:pointer;transition:background var(--transition-fast)}.post-author-chip:active{background:#000000d9}.post-author-name{font-weight:600;color:var(--color-accent);font-size:var(--font-size-sm)}.post-author-level{color:var(--color-text-secondary);font-size:var(--font-size-xs)}.post-modal-body{flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:var(--space-lg);padding-bottom:calc(var(--space-xl) + env(safe-area-inset-bottom,0px));min-height:0}.post-discovery-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-sm)}.post-subject{margin:0;font-size:var(--font-size-xl);font-weight:600}.post-rarity{font-weight:700;font-size:var(--font-size-lg)}.post-meta-row{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md);font-size:var(--font-size-sm)}.post-element-badge{padding:2px var(--space-sm);border-radius:var(--radius-xs);font-size:var(--font-size-xs);font-weight:700;color:#000}.post-essence{color:var(--color-accent);font-weight:600}.post-time{margin-left:auto;color:var(--color-text-muted)}.post-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-sm)}.post-modal-title{margin:0;font-size:var(--font-size-xl)}.post-modal-rarity{font-weight:700;font-size:var(--font-size-md)}.post-modal-badges{display:flex;gap:var(--space-sm);margin-bottom:var(--space-md)}.post-modal-badge{padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:700}.post-modal-meta{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-sm);font-size:var(--font-size-sm);color:var(--color-text-secondary)}.post-meta-essence{color:var(--color-accent);font-weight:600}.post-meta-date{margin-left:auto}.post-author-header{padding:var(--space-md) var(--space-lg);display:flex;align-items:center;gap:var(--space-sm);cursor:pointer;flex-shrink:0}.post-content{padding:var(--space-md);flex-shrink:0}.post-caption{color:var(--color-text-primary);margin:var(--space-md) 0;font-size:var(--font-size-md);line-height:1.4}.hashtag{color:var(--color-primary);cursor:pointer;transition:opacity .15s}.hashtag:hover{opacity:.8;text-decoration:underline}.hashtag:active{opacity:.6}.post-flavor{color:var(--color-text-secondary);font-style:italic;margin:0;font-size:var(--font-size-base);line-height:1.4}.post-actions{display:flex;gap:var(--space-sm);margin-top:var(--space-lg)}.post-action-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-md) var(--space-lg);background:var(--color-bg-tertiary);border:none;border-radius:var(--radius-full);color:var(--color-text-secondary);font-size:var(--font-size-md);font-weight:500;cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.post-action-btn:active{transform:scale(.96);background:var(--color-bg-elevated)}.post-action-btn.liked{background:#ff475726;color:#ff4757}.post-action-danger{flex:0;padding:var(--space-md);color:var(--color-error);background:#ef44441a}.post-action-danger:active{background:#ef444433}.post-action-secondary{flex:0;padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm);background:transparent;color:var(--color-text-muted);opacity:.5;filter:grayscale(1)}.post-action-secondary:hover,.post-action-secondary:active{opacity:1;filter:grayscale(0);background:var(--color-bg-tertiary)}.comments-section{border-top:1px solid rgba(255,255,255,.05);margin-top:var(--space-lg);padding-top:var(--space-lg)}.comments-title{margin:0 0 var(--space-md) 0;font-size:var(--font-size-md);color:var(--color-text-secondary)}.comment-item{padding:var(--space-sm) 0}.comment-item+.comment-item{margin-top:var(--space-md)}.comment-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-xs)}.comment-author{font-weight:700;cursor:pointer;color:var(--color-accent)}.comment-delete-btn{background:none;border:none;color:var(--color-error);cursor:pointer;font-size:var(--font-size-sm);min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;margin:-8px;padding:8px;-webkit-tap-highlight-color:transparent}.comment-actions{display:flex;gap:var(--space-xs);align-items:center}.comment-edit-btn{background:none;border:none;color:var(--color-text-secondary);cursor:pointer;font-size:var(--font-size-xs);padding:4px 8px;-webkit-tap-highlight-color:transparent}.edit-timer{color:var(--color-text-muted);font-size:var(--font-size-xs);opacity:.8}.load-more-comments{display:block;width:100%;margin-top:var(--space-md);padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm)}.comment-footer{display:flex;gap:var(--space-sm);align-items:center;flex-wrap:wrap}.comment-edited{font-size:var(--font-size-xs);color:var(--color-text-muted);font-style:italic}.comment-reply-count{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.comment-reply-btn{background:none;border:none;color:var(--color-text-secondary);cursor:pointer;font-size:var(--font-size-xs);padding:4px 8px;-webkit-tap-highlight-color:transparent}.comment-reply-btn:hover{color:var(--color-accent)}.comment-replies{margin-left:var(--space-lg);margin-top:var(--space-sm);padding-left:var(--space-sm);border-left:2px solid rgba(255,255,255,.1)}.comment-reply{padding:var(--space-xs) 0}.comment-reply+.comment-reply{margin-top:var(--space-sm)}.comment-inline-reply-form{margin-top:var(--space-sm);padding:var(--space-sm);background:var(--color-bg-tertiary);border-radius:var(--radius-md)}.comment-reply-input{width:100%;min-height:60px;padding:var(--space-sm);background:var(--color-bg-secondary);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-md);color:var(--color-text-primary);font-size:var(--font-size-sm);resize:vertical;margin-bottom:var(--space-sm)}.comment-reply-input:focus{outline:none;border-color:var(--color-accent)}.comment-reply-actions{display:flex;gap:var(--space-sm);justify-content:flex-end}.comment-reply-cancel,.comment-reply-submit{padding:var(--space-xs) var(--space-md);border-radius:var(--radius-sm);font-size:var(--font-size-sm);cursor:pointer;border:none}.comment-reply-cancel{background:transparent;color:var(--color-text-secondary)}.comment-reply-submit{background:var(--color-accent);color:#fff}.comment-reply-submit:disabled{opacity:.5;cursor:not-allowed}.comment-edit-form{padding:var(--space-sm)}.comment-edit-input{width:100%;min-height:60px;padding:var(--space-sm);background:var(--color-bg-tertiary);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-md);color:var(--color-text-primary);font-size:var(--font-size-sm);resize:vertical;margin-bottom:var(--space-sm)}.comment-edit-actions{display:flex;gap:var(--space-sm);justify-content:flex-end}.comment-edit-cancel,.comment-edit-save{padding:var(--space-xs) var(--space-md);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:500;cursor:pointer;border:none;transition:all var(--transition-fast)}.comment-edit-cancel{background:var(--color-bg-tertiary);color:var(--color-text-primary)}.comment-edit-save{background:var(--color-accent);color:#fff}.comment-edit-save:disabled{opacity:.5;cursor:not-allowed}.comment-content{margin:0;font-size:var(--font-size-md);line-height:1.4;word-break:break-word}.comment-date{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.comment-form{margin-top:var(--space-lg);padding-bottom:var(--space-md)}.comment-input-row{display:flex;gap:var(--space-sm);align-items:center;background:var(--color-bg-primary);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius-full);padding:4px 4px 4px var(--space-md);transition:border-color var(--transition-fast)}.comment-input-row:focus-within{border-color:var(--color-accent)}.comment-input{flex:1;height:32px;padding:0;border:none;background:transparent;color:var(--color-text-primary);font-size:var(--font-size-base);font-family:inherit;resize:none;box-sizing:border-box;line-height:32px}.comment-input:focus{outline:none}.comment-input::placeholder{color:var(--color-text-muted)}.comment-submit-btn{flex-shrink:0;height:32px;padding:0 var(--space-lg);background:var(--color-accent);border:none;border-radius:var(--radius-full);color:#fff;font-size:var(--font-size-sm);font-weight:600;cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.comment-submit-btn:active{transform:scale(.95);background:var(--color-accent-hover)}.comment-submit-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.post-form-label{display:block;margin-bottom:var(--space-sm);color:var(--color-text-secondary);font-size:var(--font-size-base)}.post-form-textarea{width:100%;min-height:80px;padding:var(--space-md);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius-lg);background:var(--color-bg-primary);color:var(--color-text-primary);font-size:var(--font-size-md);font-family:inherit;resize:vertical;box-sizing:border-box;transition:border-color var(--transition-fast)}.post-form-textarea:focus{outline:none;border-color:var(--color-accent)}.post-form-counter{text-align:right;color:var(--color-text-secondary);font-size:var(--font-size-sm);margin-top:var(--space-xs)}.hashtag-suggestions{margin-top:var(--space-md)}.hashtag-suggestions-label{display:block;color:var(--color-text-secondary);font-size:var(--font-size-sm);margin-bottom:var(--space-xs)}.hashtag-chips{display:flex;flex-wrap:wrap;gap:var(--space-xs)}.chip-hashtag{--chip-color: var(--color-accent);padding:.25rem .6rem;font-size:var(--font-size-xs);border:1px solid color-mix(in srgb,var(--chip-color) 50%,transparent);background:color-mix(in srgb,var(--chip-color) 15%,transparent);color:var(--color-text-primary)}.chip-hashtag:hover{background:color-mix(in srgb,var(--chip-color) 25%,transparent);border-color:var(--chip-color)}.chip-hashtag.active{background:var(--chip-color);border-color:var(--chip-color);color:#000}.post-form-error{color:var(--color-error);font-size:var(--font-size-base);margin-top:var(--space-sm)}.post-form-actions{display:flex;gap:var(--space-md);margin-top:var(--space-lg)}.post-form-actions .btn{flex:1}.post-date{color:var(--color-text-muted);font-size:var(--font-size-xs);margin:var(--space-sm) 0 0 0}.mention{color:var(--color-accent);cursor:pointer;font-weight:500}.mention:hover{text-decoration:underline}.mention-dropdown{position:absolute;left:var(--space-md);right:var(--space-md);bottom:calc(100% + var(--space-xs));background:var(--color-bg-secondary);border:1px solid rgba(255,255,255,.15);border-radius:var(--radius-md);box-shadow:0 -4px 20px #0000004d;max-height:200px;overflow-y:auto;z-index:100}.mention-option{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);cursor:pointer;transition:background var(--transition-fast)}.mention-option:hover,.mention-option.selected{background:var(--color-bg-tertiary)}.mention-avatar{width:28px;height:28px;background:linear-gradient(135deg,var(--color-accent),#3b82f6);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs);color:#fff;font-weight:600;flex-shrink:0}.mention-name{font-size:var(--font-size-sm);color:var(--color-text-primary);font-weight:500}.comment-form{position:relative}.public-profile-view{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--color-bg-primary);z-index:9999;overflow-y:auto;overscroll-behavior-y:contain}.public-profile-container{max-width:600px;margin:0 auto}.public-profile-header{padding:var(--space-md) var(--space-lg)}.public-profile-back{background:var(--color-bg-tertiary);border:none;border-radius:var(--radius-full);color:var(--color-text-primary);font-size:var(--font-size-sm);font-weight:500;cursor:pointer;padding:var(--space-sm) var(--space-md);-webkit-tap-highlight-color:transparent;transition:all var(--transition-fast)}.public-profile-back:active{transform:scale(.95);background:var(--color-bg-secondary)}.public-profile-name{margin:0 0 2px;font-size:var(--font-size-lg);font-weight:600}.public-profile-info{padding:var(--space-md) var(--space-lg);border-bottom:1px solid rgba(255,255,255,.1);display:flex;gap:var(--space-md);align-items:flex-start}.public-profile-avatar{width:48px;height:48px;min-width:48px;background:linear-gradient(135deg,var(--color-accent),#3b82f6);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xl);color:#fff;font-weight:700}.public-profile-details{flex:1;min-width:0}.public-profile-meta{display:flex;align-items:baseline;gap:var(--space-sm);flex-wrap:wrap}.public-profile-level{color:var(--color-text-secondary);font-size:var(--font-size-base)}.public-profile-badges{display:flex;align-items:center;gap:var(--space-sm);margin-top:var(--space-xs);flex-wrap:wrap}.streak-badge{display:inline-flex;align-items:center;gap:4px;font-size:var(--font-size-sm);font-weight:600;color:var(--color-fire);background:#ff6b3526;padding:2px 8px;border-radius:var(--radius-full)}.streak-badge.streak-hot{animation:streak-fire 1.5s ease-in-out infinite}@keyframes streak-fire{0%,to{text-shadow:0 0 4px rgba(255,107,53,.5)}50%{text-shadow:0 0 8px rgba(255,107,53,.8),0 0 12px rgba(255,200,100,.4)}}.element-badge{display:inline-flex;align-items:center;gap:4px;font-size:var(--font-size-sm);font-weight:500;padding:2px 8px;border-radius:var(--radius-full);background:#ffffff1a}.public-profile-bio{margin:var(--space-xs) 0 0 0;font-size:var(--font-size-sm);color:var(--color-text-secondary);font-style:italic;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.public-profile-stats{display:flex;align-items:center;gap:var(--space-md);margin-top:var(--space-sm);flex-wrap:wrap}.public-profile-stat{font-size:var(--font-size-sm)}.public-profile-stat-value{font-weight:700;color:var(--color-accent)}.public-profile-stat-likes .public-profile-stat-value{color:var(--color-error)}.public-profile-stat-label{color:var(--color-text-secondary)}.edit-bio-btn{background:var(--color-accent-subtle);border:none;border-radius:var(--radius-full);color:var(--color-accent);padding:var(--space-xs) var(--space-md);cursor:pointer;font-size:var(--font-size-xs);font-weight:600;margin-left:auto;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.edit-bio-btn:active{transform:scale(.95);background:var(--color-accent);color:#fff}.public-profile-posts{padding:var(--space-sm)}.public-profile-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-xs)}.public-profile-post-thumb{position:relative;aspect-ratio:3/4;cursor:pointer;overflow:hidden;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.public-profile-post-thumb img{width:100%;height:100%;object-fit:cover}.public-profile-post-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#000c);padding:var(--space-xs)}.public-profile-post-meta{display:flex;justify-content:space-between;align-items:center}.public-profile-post-element,.public-profile-post-rarity{font-size:var(--font-size-xs);font-weight:700}.public-profile-post-likes{position:absolute;top:var(--space-xs);right:var(--space-xs);background:#0009;padding:.1rem var(--space-xs);border-radius:var(--radius-sm);font-size:var(--font-size-xs);color:#fff}.public-profile-empty{text-align:center;color:var(--color-text-secondary);padding:var(--space-2xl)}.public-profile-load-more{width:100%;padding:var(--space-lg);margin-top:var(--space-lg);background:var(--color-bg-secondary);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-md);color:var(--color-text-primary);cursor:pointer}.bio-editor-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--color-bg-overlay);display:flex;align-items:flex-start;justify-content:center;padding:var(--space-2xl) var(--space-lg);padding-top:max(var(--space-2xl),var(--safe-area-top));z-index:10002;overflow-y:auto;overscroll-behavior-y:contain}.bio-editor-content{max-width:400px;width:100%;background:var(--color-bg-secondary);border-radius:var(--radius-xl);padding:var(--space-xl)}.bio-editor-title{margin:0 0 var(--space-lg) 0}.bio-editor-input{width:100%;min-height:100px;padding:var(--space-md);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius-lg);background:var(--color-bg-primary);color:var(--color-text-primary);font-size:var(--font-size-md);font-family:inherit;resize:vertical;box-sizing:border-box;transition:border-color var(--transition-fast)}.bio-editor-counter{text-align:right;color:var(--color-text-secondary);font-size:var(--font-size-sm);margin-top:var(--space-xs)}.bio-editor-error{color:var(--color-error);font-size:var(--font-size-sm);margin-top:var(--space-sm)}.bio-editor-actions{display:flex;gap:var(--space-sm);margin-top:var(--space-lg)}.bio-action-btn{flex:1;padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-full);border:none;background:var(--color-bg-tertiary);color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:600;cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.bio-action-btn:active{transform:scale(.97)}.bio-action-save:active{background:var(--color-accent-hover)}.bio-action-save:disabled{opacity:.5;cursor:not-allowed;transform:none}.pwa-update-banner{position:fixed;bottom:1rem;left:50%;transform:translate(-50%);background:var(--color-accent);color:#fff;padding:var(--space-md) var(--space-lg);border-radius:var(--radius-md);display:flex;align-items:center;gap:var(--space-md);z-index:9999;font-size:var(--font-size-base);box-shadow:0 4px 12px #0000004d}.pwa-update-btn{background:#fff;color:var(--color-accent);border:none;padding:var(--space-xs) var(--space-md);border-radius:var(--radius-sm);font-weight:700;cursor:pointer}.pwa-dismiss-btn{background:transparent;color:#fff;border:none;padding:var(--space-xs) var(--space-md);border-radius:var(--radius-sm);font-weight:700;cursor:pointer;opacity:.8}.debug-panel{position:fixed;bottom:60px;left:10px;right:10px;background:#000000e6;color:#0f0;font-family:monospace;font-size:10px;padding:var(--space-sm);border-radius:var(--radius-md);max-height:150px;overflow-y:auto;z-index:9999}@media (min-height: 700px){.comments-section{min-height:180px}}@media (min-height: 800px){.post-content{padding:var(--space-lg)}.comments-section{padding:var(--space-lg);min-height:200px}}@media (min-width: 768px) and (min-height: 900px){.post-modal{justify-content:center}.post-modal-card{max-height:calc(var(--vh, 1vh) * 85)}.post-modal-image{max-height:calc(var(--vh, 1vh) * 50)}}.modal-enter{animation:modalEnter .2s ease-out}@keyframes modalEnter{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.img-fade{opacity:0;transition:opacity .2s ease}.img-fade.loaded{opacity:1}.achievements-section{margin-top:var(--space-sm)}.achievements-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;padding:var(--space-sm) var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-text);transition:all var(--transition-fast)}.achievements-toggle:hover{background:var(--color-surface-light)}.achievements-title{font-weight:600}.achievements-count{color:var(--color-text-secondary);font-size:var(--font-size-sm)}.achievements-chevron{font-size:var(--font-size-xs);color:var(--color-text-secondary);transition:transform var(--transition-fast)}.achievements-content{margin-top:var(--space-sm);animation:slideDown .2s ease-out}.achievements-content.hidden{display:none}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.achievements-grid{display:flex;flex-direction:column;gap:var(--space-sm)}.achievements-loading,.achievements-error{text-align:center;padding:var(--space-lg);color:var(--color-text-secondary)}.achievements-error-container{display:flex;flex-direction:column;align-items:center;gap:var(--space-md);padding:var(--space-lg)}.achievements-error-container .achievements-error{padding:0}.achievement-card{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-fast)}.achievement-card.unlocked{border-color:var(--color-border-light)}.achievement-card.locked{opacity:.7}.achievement-icon{flex-shrink:0;width:48px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);border:2px solid;font-size:24px}.achievement-info{flex:1;min-width:0}.achievement-name{font-weight:600;font-size:var(--font-size-base);margin-bottom:2px}.achievement-desc{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:1.3}.achievement-progress-bar{height:4px;background:var(--color-surface-dark);border-radius:2px;margin-top:var(--space-xs);overflow:hidden}.achievement-progress-fill{height:100%;border-radius:2px;transition:width var(--transition-normal)}.achievement-progress-text{font-size:var(--font-size-xs);color:var(--color-text-secondary);margin-top:2px}.achievement-tier{flex-shrink:0;font-size:var(--font-size-xs);font-weight:700;letter-spacing:.05em}.achievement-unlock-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:9999;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.achievement-unlock-card{background:var(--color-surface);border-radius:var(--radius-xl);padding:var(--space-xl);text-align:center;max-width:320px;margin:var(--space-lg);animation:unlockPop .4s cubic-bezier(.175,.885,.32,1.275)}@keyframes unlockPop{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.achievement-unlock-title{font-size:var(--font-size-sm);text-transform:uppercase;letter-spacing:.15em;color:var(--color-text-secondary);margin-bottom:var(--space-md)}.achievement-unlock-icon{width:80px;height:80px;margin:0 auto var(--space-md);display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:40px;animation:iconPulse 2s ease-in-out infinite}@keyframes iconPulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.achievement-unlock-name{font-size:var(--font-size-xl);font-weight:700;margin-bottom:var(--space-xs)}.achievement-unlock-tier{font-size:var(--font-size-sm);font-weight:700;letter-spacing:.1em}.challenges-section{margin-top:var(--space-sm)}.challenges-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;padding:var(--space-sm) var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-text);transition:all var(--transition-fast)}.challenges-toggle:hover{background:var(--color-surface-light)}.challenges-title{font-weight:600}.challenges-count{color:var(--color-text-secondary);font-size:var(--font-size-sm)}.challenges-chevron{font-size:var(--font-size-xs);color:var(--color-text-secondary);transition:transform var(--transition-fast)}.challenges-content{margin-top:var(--space-sm);animation:slideDown .2s ease-out}.challenges-content.hidden{display:none}.challenges-list{display:flex;flex-direction:column;gap:var(--space-sm)}.challenges-loading,.challenges-error{text-align:center;padding:var(--space-lg);color:var(--color-text-secondary)}.challenge-card{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-fast)}.challenge-card.completed{border-color:var(--color-success);background:#22c55e0d}.challenge-card.claimed{opacity:.6}.challenge-icon{flex-shrink:0;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);font-size:20px}.challenge-info{flex:1;min-width:0}.challenge-name{font-weight:600;font-size:var(--font-size-base);color:var(--color-text)}.challenge-desc{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-top:2px}.challenge-progress-bar{margin-top:var(--space-xs);height:4px;background:var(--color-surface-dark);border-radius:2px;overflow:hidden}.challenge-progress-fill{height:100%;transition:width .3s ease}.challenge-progress-text{font-size:var(--font-size-xs);color:var(--color-text-secondary);margin-top:2px}.challenge-reward{flex-shrink:0;text-align:right;min-width:60px}.challenge-reward-value{font-weight:600;font-size:var(--font-size-sm);color:var(--color-accent)}.challenge-reward-xp{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.challenge-claim-btn{padding:var(--space-xs) var(--space-sm);background:var(--color-success);color:#fff;border:none;border-radius:var(--radius-sm);font-size:var(--font-size-sm);font-weight:600;cursor:pointer;transition:all var(--transition-fast)}.challenge-claim-btn:hover{background:#16a34a}.challenge-claim-btn:disabled{opacity:.5;cursor:not-allowed}.challenge-claimed-text{font-size:var(--font-size-xs);color:var(--color-success);font-weight:500}.challenges-badge{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);margin-left:auto;background:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast);min-height:28px}.challenges-badge:hover,.challenges-badge:focus{background:var(--color-bg-elevated);border-color:var(--color-accent)}.challenges-badge.has-claimable{border-color:var(--color-success);animation:badge-pulse 2s ease-in-out infinite}@keyframes badge-pulse{0%,to{box-shadow:0 0 #4ade8066}50%{box-shadow:0 0 8px 4px #4ade8033}}.challenges-badge-icon{font-size:var(--font-size-base);color:var(--color-accent)}.challenges-badge-count{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-primary)}.challenges-badge.all-complete .challenges-badge-count{color:var(--color-success)}.inventory-badge{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);margin-left:var(--space-xs);background:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--radius-full);font-size:var(--font-size-sm);cursor:pointer;transition:all var(--transition-fast);min-height:28px}.inventory-badge:hover,.inventory-badge:focus{background:var(--color-bg-elevated);border-color:var(--color-accent)}.inventory-badge.has-items{border-color:var(--color-accent)}.inventory-badge.has-effect{border-color:var(--color-success);animation:badge-pulse 2s ease-in-out infinite}.inventory-badge-icon{font-size:var(--font-size-base)}.inventory-badge-count{font-size:var(--font-size-xs);font-weight:600;color:var(--color-text-secondary)}.inventory-badge-count:empty{display:none}.challenges-popup-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;z-index:1000;display:flex;flex-direction:column;justify-content:flex-end;animation:popup-overlay-fade-in .2s ease}.challenges-popup-overlay.closing{animation:popup-overlay-fade-out .2s ease forwards}@keyframes popup-overlay-fade-in{0%{opacity:0}to{opacity:1}}@keyframes popup-overlay-fade-out{0%{opacity:1}to{opacity:0}}.challenges-popup{background:var(--color-bg-secondary);border-radius:var(--radius-xl) var(--radius-xl) 0 0;padding:var(--space-lg);max-height:70vh;overflow-y:auto;animation:popup-slide-up .25s ease-out}.challenges-popup-overlay.closing .challenges-popup{animation:popup-slide-down .2s ease-in forwards}@keyframes popup-slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes popup-slide-down{0%{transform:translateY(0)}to{transform:translateY(100%)}}.challenges-popup:before{content:"";display:block;width:40px;height:4px;background:var(--color-text-muted);border-radius:2px;margin:0 auto var(--space-md)}.challenges-popup-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-md)}.challenges-popup-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text-primary)}.challenges-popup-close{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--color-bg-tertiary);border:none;border-radius:50%;color:var(--color-text-secondary);cursor:pointer;font-size:var(--font-size-xl);line-height:1;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.challenges-popup-close:hover{background:var(--color-bg-elevated);color:var(--color-text-primary)}.challenges-popup-list{display:flex;flex-direction:column;gap:var(--space-md)}.inventory-popup-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;z-index:1000;display:flex;flex-direction:column;justify-content:flex-end;animation:popup-overlay-fade-in .2s ease}.inventory-popup-overlay.closing{animation:popup-overlay-fade-out .2s ease forwards}.inventory-popup{background:var(--color-bg-secondary);border-radius:var(--radius-xl) var(--radius-xl) 0 0;padding:var(--space-lg);max-height:80vh;overflow-y:auto;animation:popup-slide-up .25s ease-out}.inventory-popup-overlay.closing .inventory-popup{animation:popup-slide-down .2s ease-in forwards}.inventory-popup:before{content:"";display:block;width:40px;height:4px;background:var(--color-text-muted);border-radius:2px;margin:0 auto var(--space-md)}.inventory-popup-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-md)}.inventory-popup-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text-primary)}.inventory-popup-close{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--color-bg-tertiary);border:none;border-radius:50%;color:var(--color-text-secondary);cursor:pointer;font-size:var(--font-size-xl);line-height:1;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.inventory-popup-close:hover{background:var(--color-bg-elevated);color:var(--color-text-primary)}.inventory-effects-section,.inventory-items-section{margin-bottom:var(--space-lg)}.inventory-effects-section.hidden{display:none}.inventory-section-title{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-sm)}.inventory-effects-list{display:flex;flex-wrap:wrap;gap:var(--space-sm)}.active-effect-badge{display:flex;align-items:center;gap:var(--space-xs);background:var(--color-accent);color:#fff;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-full);font-size:var(--font-size-sm)}.active-effect-icon{font-size:1em}.active-effect-name{font-weight:500}.active-effect-timer{opacity:.8;font-size:var(--font-size-xs)}.inventory-items-list{display:flex;flex-direction:column;gap:var(--space-sm)}.inventory-empty,.inventory-loading,.inventory-error{text-align:center;color:var(--color-text-secondary);padding:var(--space-xl)}.inventory-error-container{display:flex;flex-direction:column;align-items:center;gap:var(--space-md);padding:var(--space-xl)}.inventory-error-container .inventory-error{padding:0}.inventory-item-card{display:flex;align-items:center;gap:var(--space-md);background:var(--color-bg-tertiary);border-radius:var(--radius-lg);padding:var(--space-md);border-left:3px solid var(--rarity-color, var(--color-text-muted))}.item-icon-wrapper{position:relative;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--color-bg-secondary);border-radius:var(--radius-md);font-size:1.5rem}.item-quantity{position:absolute;bottom:-4px;right:-4px;background:var(--color-accent);color:#fff;font-size:var(--font-size-xs);font-weight:600;padding:2px 6px;border-radius:var(--radius-full);min-width:20px;text-align:center}.item-info{flex:1;min-width:0}.item-name{font-weight:600;color:var(--color-text-primary);margin-bottom:2px}.item-rarity{font-size:var(--font-size-xs);font-weight:500;display:flex;align-items:center;gap:var(--space-sm)}.item-element{opacity:.9}.item-effect{font-size:var(--font-size-xs);color:var(--color-text-secondary);margin-top:2px}.item-use-btn{background:var(--color-accent);color:#fff;border:none;border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm);font-weight:600;cursor:pointer;transition:all var(--transition-fast);flex-shrink:0}.item-use-btn:hover:not(:disabled){background:var(--color-accent-hover);transform:scale(1.05)}.item-use-btn:disabled{opacity:.5;cursor:not-allowed}.storage-upgrade-section{display:none}.storage-upgrade-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-sm)}.storage-upgrade-title{font-size:var(--font-size-base);font-weight:600;color:var(--color-text-primary)}.storage-upgrade-capacity{font-size:var(--font-size-sm);color:var(--color-accent);font-weight:600}.storage-upgrade-info{display:flex;justify-content:space-between;align-items:center}.storage-level-text{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.storage-upgrade-btn{background:var(--color-accent);color:#fff;font-size:var(--font-size-sm);font-weight:600;padding:var(--space-xs) var(--space-sm);border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.storage-upgrade-btn:active:not(:disabled){transform:scale(.95);opacity:.9}.storage-upgrade-btn.disabled{background:var(--color-bg-elevated);color:var(--color-text-secondary);cursor:not-allowed}.storage-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:2000;padding:var(--space-md)}.storage-modal{background:var(--color-bg-secondary);border-radius:var(--radius-lg);width:100%;max-width:360px;padding:var(--space-lg);box-shadow:0 8px 32px #00000080}.storage-modal-title{font-size:var(--font-size-xl);font-weight:700;color:var(--color-text-primary);text-align:center;margin-bottom:var(--space-xs)}.storage-modal-subtitle{font-size:var(--font-size-sm);color:var(--color-text-secondary);text-align:center;margin-bottom:var(--space-lg)}.storage-modal-elements{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-sm);margin-bottom:var(--space-lg)}.storage-element-btn{display:flex;flex-direction:column;align-items:center;gap:var(--space-xs);padding:var(--space-sm);background:var(--color-bg-primary);border:2px solid transparent;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.storage-element-btn:not(.cant-afford):hover,.storage-element-btn:not(.cant-afford):focus{border-color:var(--element-color);background:var(--color-bg-elevated)}.storage-element-btn.selected{border-color:var(--element-color);background:var(--color-bg-elevated);box-shadow:0 0 12px #e945604d}.storage-element-btn.cant-afford{opacity:.4;cursor:not-allowed}.storage-element-icon{font-size:24px}.storage-element-name{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-primary)}.storage-element-essence{font-size:var(--font-size-xs);color:var(--element-color);font-weight:600}.storage-modal-footer{display:flex;justify-content:space-between;align-items:center}.storage-selected-count{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.storage-modal-buttons{display:flex;gap:var(--space-sm)}.storage-modal-cancel{background:var(--color-bg-elevated);color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:600;padding:var(--space-sm) var(--space-md);border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.storage-modal-cancel:active{opacity:.8}.storage-modal-confirm{background:var(--color-accent);color:#fff;font-size:var(--font-size-sm);font-weight:600;padding:var(--space-sm) var(--space-md);border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.storage-modal-confirm:disabled{background:var(--color-bg-elevated);color:var(--color-text-secondary);cursor:not-allowed}.storage-modal-confirm:not(:disabled):active{transform:scale(.95);opacity:.9}.camera-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999;background:#000;display:flex;flex-direction:column}.camera-overlay.hidden{display:none}.camera-overlay video{flex:1;width:100%;object-fit:cover}.camera-controls{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:center;align-items:center;padding:var(--space-xl);padding-bottom:calc(var(--space-xl) + env(safe-area-inset-bottom,0px));background:linear-gradient(transparent,#0009)}.camera-close-btn{position:absolute;top:var(--space-md);left:var(--space-md);top:calc(var(--space-md) + env(safe-area-inset-top,0px));width:44px;height:44px;border-radius:50%;border:none;background:#00000080;color:#fff;font-size:24px;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent}.camera-close-btn:active{background:#000000b3}.camera-capture-btn{width:72px;height:72px;border-radius:50%;border:4px solid white;background:transparent;cursor:pointer;position:relative;-webkit-tap-highlight-color:transparent}.camera-capture-btn:after{content:"";position:absolute;top:4px;left:4px;right:4px;bottom:4px;border-radius:50%;background:#fff;transition:transform .1s ease}.camera-capture-btn:active:after{transform:scale(.9)}.status-popover{position:fixed;top:calc(var(--header-height) + var(--safe-area-top) + 4px);right:var(--space-md);background:var(--color-bg-secondary);border:1px solid rgba(255,255,255,.15);border-radius:var(--radius-lg);padding:var(--space-md);min-width:180px;z-index:1000;box-shadow:var(--shadow-lg);animation:popover-enter .15s ease-out}@keyframes popover-enter{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.status-popover-row{display:flex;justify-content:space-between;align-items:center;padding:var(--space-xs) 0;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.status-popover-row:first-child{padding-top:0}.status-popover-row:last-child{padding-bottom:0}.status-popover-label{color:var(--color-text-secondary)}.status-popover-value{color:var(--color-text-primary);font-weight:500;display:flex;align-items:center;gap:var(--space-xs)}.status-popover-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.status-popover-dot.online{background:var(--color-nature)}.status-popover-dot.syncing{background:var(--color-energy)}.status-popover-dot.offline{background:#f44}.status-popover-value.excellent{color:var(--color-nature)}.status-popover-value.good{color:var(--color-energy)}.status-popover-value.marginal{color:var(--color-fire)}.status-popover-value.poor{color:#f44}.recovery-modal-overlay{z-index:10000}.recovery-modal{max-width:340px;padding:var(--space-lg);text-align:center}.recovery-modal-header{margin-bottom:var(--space-md)}.recovery-icon{font-size:2.5rem;display:block;margin-bottom:var(--space-sm)}.recovery-modal-header h2{font-size:var(--font-size-lg);margin:0;color:var(--color-text-primary)}.recovery-modal-body{margin-bottom:var(--space-lg)}.recovery-modal-body p{color:var(--color-text-secondary);font-size:var(--font-size-sm);margin:var(--space-sm) 0}.recovery-preview{margin:var(--space-md) 0;border-radius:var(--radius-md);overflow:hidden;background:var(--color-bg-secondary)}.recovery-preview-img{width:100%;max-height:200px;object-fit:cover;display:block}.recovery-age{font-size:var(--font-size-xs);opacity:.6}.recovery-modal-actions{display:flex;flex-direction:column;gap:var(--space-sm)}.recovery-btn-retry,.recovery-btn-dismiss{width:100%}.recovery-btn-retry{background:var(--color-nature)}.recovery-btn-retry:active:not(:disabled){opacity:.9;transform:scale(.98)}.public-profile-actions{margin-top:var(--space-sm);display:flex;gap:var(--space-sm);align-items:center}.follow-btn{background:var(--color-accent);border:none;border-radius:var(--radius-full);color:#fff;padding:var(--space-xs) var(--space-lg);cursor:pointer;font-size:var(--font-size-sm);font-weight:600;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.follow-btn:active:not(:disabled){transform:scale(.95)}.follow-btn:disabled{opacity:.6;cursor:not-allowed}.follow-btn.following{background:var(--color-bg-tertiary);color:var(--color-text-primary);border:1px solid rgba(255,255,255,.15)}.follow-btn.following:active:not(:disabled){background:var(--color-error);color:#fff;border-color:transparent}.block-btn{background:transparent;border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-full);color:var(--color-text-secondary);padding:var(--space-xs) var(--space-md);cursor:pointer;font-size:var(--font-size-xs);transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.block-btn:active:not(:disabled){transform:scale(.95)}.block-btn:disabled{opacity:.6;cursor:not-allowed}.block-btn.blocked{background:var(--color-error);color:#fff;border-color:transparent}.post-action-secondary{opacity:.7}.post-action-secondary:hover{opacity:1}.report-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:10002;padding:var(--space-lg)}.report-modal{background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--space-lg);max-width:400px;width:100%}.report-modal-title{font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--space-md);color:var(--color-text-primary)}.report-reasons{display:flex;flex-direction:column;gap:var(--space-sm);margin-bottom:var(--space-md)}.report-reason-option{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-bg-tertiary);border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-fast)}.report-reason-option:hover{background:var(--color-bg-elevated)}.report-reason-option input[type=radio]{accent-color:var(--color-accent)}.report-details-input{width:100%;min-height:80px;padding:var(--space-sm);background:var(--color-bg-tertiary);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-md);color:var(--color-text-primary);font-size:var(--font-size-sm);resize:vertical;margin-bottom:var(--space-md)}.report-details-input::placeholder{color:var(--color-text-muted)}.report-modal-actions{display:flex;gap:var(--space-sm);justify-content:flex-end}.report-action-btn{padding:var(--space-xs) var(--space-lg);border-radius:var(--radius-full);font-size:var(--font-size-sm);font-weight:500;cursor:pointer;transition:all var(--transition-fast);border:none;background:var(--color-bg-tertiary);color:var(--color-text-primary)}.report-action-btn:hover:not(:disabled){background:var(--color-bg-elevated)}.report-action-submit{background:var(--color-error);color:#fff}.report-action-submit:hover:not(:disabled){background:#b33}.report-action-submit:disabled{opacity:.5;cursor:not-allowed}.public-profile-stat-clickable{cursor:pointer;padding:var(--space-xs);margin:calc(-1 * var(--space-xs));border-radius:var(--radius-sm);transition:background var(--transition-fast);-webkit-tap-highlight-color:transparent}.public-profile-stat-clickable:active{background:#ffffff1a}.notification-bell{position:relative;cursor:pointer;padding:var(--space-xs);margin-left:var(--space-xs);-webkit-tap-highlight-color:transparent;display:inline-flex;align-items:center;justify-content:center}.notification-bell-icon{color:var(--color-text-secondary);transition:color var(--transition-fast)}.notification-bell:active .notification-bell-icon{color:var(--color-accent)}.notification-badge{position:absolute;top:0;right:-2px;background:var(--color-error);color:#fff;font-size:10px;font-weight:700;min-width:16px;height:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 4px;line-height:1}.notification-dropdown{position:fixed;top:44px;right:var(--space-sm);width:320px;max-width:calc(100vw - var(--space-lg));max-height:60vh;background:var(--color-bg-secondary);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-lg);box-shadow:0 8px 32px #0006;z-index:9998;overflow:hidden;display:flex;flex-direction:column;animation:dropdown-enter .15s ease-out}.notification-dropdown.closing{animation:dropdown-exit .15s ease-out forwards}@keyframes dropdown-enter{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes dropdown-exit{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-8px)}}.notification-dropdown-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md);border-bottom:1px solid rgba(255,255,255,.1);flex-shrink:0}.notification-dropdown-title{font-weight:600;font-size:var(--font-size-base)}.notification-mark-all{background:none;border:none;color:var(--color-accent);font-size:var(--font-size-xs);cursor:pointer;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);transition:background var(--transition-fast);-webkit-tap-highlight-color:transparent}.notification-mark-all:disabled{color:var(--color-text-dim);cursor:not-allowed}.notification-mark-all:active:not(:disabled){background:#ffffff1a}.notification-list{flex:1;overflow-y:auto;overscroll-behavior-y:contain}.notification-loading,.notification-empty,.notification-error{text-align:center;color:var(--color-text-secondary);padding:var(--space-xl);font-size:var(--font-size-sm)}.notification-error{color:var(--color-error)}.notification-error-container{display:flex;flex-direction:column;align-items:center;gap:var(--space-md);padding:var(--space-lg)}.notification-error-container .notification-error{padding:0}.notification-item{display:flex;gap:var(--space-sm);padding:var(--space-md);border-bottom:1px solid rgba(255,255,255,.05);cursor:pointer;transition:background var(--transition-fast);-webkit-tap-highlight-color:transparent}.notification-item:last-child{border-bottom:none}.notification-item:active{background:#ffffff0d}.notification-item.unread{background:rgba(var(--color-accent-rgb, 139, 92, 246),.1)}.notification-item.unread:active{background:rgba(var(--color-accent-rgb, 139, 92, 246),.15)}.notification-avatar{width:36px;height:36px;min-width:36px;background:linear-gradient(135deg,var(--color-accent),#3b82f6);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-base);color:#fff;font-weight:700}.notification-avatar.milestone{background:linear-gradient(135deg,#fbbf24,#f59e0b);font-size:18px}.notification-item.milestone{background:linear-gradient(90deg,rgba(251,191,36,.1),transparent)}.notification-content{flex:1;min-width:0}.notification-message{margin:0;font-size:var(--font-size-sm);color:var(--color-text-primary);line-height:1.4}.notification-preview{margin:var(--space-xs) 0 0;font-size:var(--font-size-xs);color:var(--color-text-secondary);font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.notification-time{font-size:var(--font-size-xs);color:var(--color-text-dim)}.followers-list-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;z-index:10000;display:flex;align-items:center;justify-content:center;padding:var(--space-md)}.followers-list-content{background:var(--color-bg-secondary);border-radius:var(--radius-lg);width:100%;max-width:400px;max-height:80vh;display:flex;flex-direction:column;overflow:hidden}.followers-list-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md) var(--space-lg);border-bottom:1px solid rgba(255,255,255,.1);flex-shrink:0}.followers-list-title{margin:0;font-size:var(--font-size-lg);font-weight:600}.followers-list-close{background:none;border:none;font-size:1.5rem;color:var(--color-text-secondary);cursor:pointer;padding:0;line-height:1;-webkit-tap-highlight-color:transparent}.followers-list-close:active{color:var(--color-text-primary)}.followers-list-body{flex:1;overflow-y:auto;overscroll-behavior-y:contain}.followers-list-items{padding:var(--space-sm)}.follower-item{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md);border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-fast);-webkit-tap-highlight-color:transparent}.follower-item:active{background:#ffffff0d}.follower-avatar{width:40px;height:40px;min-width:40px;background:linear-gradient(135deg,var(--color-accent),#3b82f6);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-base);color:#fff;font-weight:700}.follower-info{flex:1;min-width:0}.follower-name{display:block;font-weight:600;font-size:var(--font-size-base);color:var(--color-text-primary)}.follower-level{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.follower-follow-btn{background:var(--color-accent);border:none;border-radius:var(--radius-full);color:#fff;padding:var(--space-xs) var(--space-md);cursor:pointer;font-size:var(--font-size-xs);font-weight:600;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent;flex-shrink:0}.follower-follow-btn:active:not(:disabled){transform:scale(.95)}.follower-follow-btn:disabled{opacity:.6}.follower-follow-btn.following{background:var(--color-bg-tertiary);color:var(--color-text-primary);border:1px solid rgba(255,255,255,.15)}.followers-list-load-more{display:block;width:calc(100% - var(--space-lg));margin:var(--space-sm) var(--space-md) var(--space-md);padding:var(--space-sm);background:var(--color-bg-tertiary);border:none;border-radius:var(--radius-md);color:var(--color-text-secondary);font-size:var(--font-size-sm);cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.followers-list-load-more:active{background:var(--color-bg-elevated)}.bio-editor-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;z-index:10001;display:flex;align-items:center;justify-content:center;padding:var(--space-md)}.bio-editor-content{background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--space-lg);width:100%;max-width:360px}.bio-editor-title{margin:0 0 var(--space-md);font-size:var(--font-size-lg);text-align:center}.bio-editor-input{width:100%;min-height:100px;padding:var(--space-md);background:var(--color-bg-tertiary);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-md);color:var(--color-text-primary);font-family:inherit;font-size:var(--font-size-base);resize:vertical}.bio-editor-input:focus{outline:none;border-color:var(--color-accent)}.bio-editor-counter{text-align:right;font-size:var(--font-size-xs);color:var(--color-text-dim);margin-top:var(--space-xs)}.bio-editor-error{color:var(--color-error);font-size:var(--font-size-sm);text-align:center;margin-top:var(--space-sm)}.bio-editor-actions{display:flex;gap:var(--space-md);margin-top:var(--space-lg)}.bio-action-btn{flex:1;padding:var(--space-sm) var(--space-md);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:600;cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent;background:var(--color-bg-tertiary);color:var(--color-text-primary)}.bio-action-btn:active:not(:disabled){transform:scale(.97)}.bio-action-btn:disabled{opacity:.6;cursor:not-allowed}.bio-action-save{background:var(--color-accent);color:#fff}.scan-indicator{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:100;display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);padding:var(--space-lg);background:var(--color-bg-secondary);border:2px solid var(--color-accent);border-radius:var(--radius-lg);box-shadow:0 4px 30px #00000080;cursor:pointer;transition:top .3s ease-out,left .3s ease-out,transform .3s ease-out,padding .3s ease-out,min-width .3s ease-out,border-color var(--transition-fast);-webkit-tap-highlight-color:transparent;animation:scan-indicator-enter .3s ease-out;min-width:200px;text-align:center}.scan-indicator.hidden{display:none}.scan-indicator.minimized{top:calc(var(--header-height) + var(--space-sm));left:var(--space-sm);transform:none;min-width:auto;padding:var(--space-sm);flex-direction:row}.scan-indicator.minimized .scan-indicator-info{display:none}.scan-indicator.minimized .scan-indicator-thumb{width:36px;height:36px}.scan-indicator.minimized .scan-indicator-close{display:none}@keyframes scan-indicator-enter{0%{opacity:0;transform:translate(-50%,-50%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.scan-indicator.uploading,.scan-indicator.analyzing{animation:scan-indicator-enter .3s ease-out,scan-pulse 2s ease-in-out infinite}@keyframes scan-pulse{0%,to{box-shadow:0 4px 20px #0000004d,0 0 #8b5cf666}50%{box-shadow:0 4px 20px #0000004d,0 0 15px 5px #8b5cf633}}.scan-indicator.complete{border-color:var(--color-success);animation:scan-indicator-enter .3s ease-out,scan-complete-pulse 1s ease-in-out infinite}@keyframes scan-complete-pulse{0%,to{box-shadow:0 4px 20px #0000004d,0 0 #4ade8066}50%{box-shadow:0 4px 20px #0000004d,0 0 15px 5px #4ade804d}}.scan-indicator.error{border-color:var(--color-error)}.scan-indicator-thumb{position:relative;width:48px;height:48px;border-radius:var(--radius-md);overflow:hidden;flex-shrink:0;transition:width .3s ease-out,height .3s ease-out}.scan-indicator-thumb img{width:100%;height:100%;object-fit:cover}.scan-indicator-spinner{position:absolute;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center}.scan-indicator-spinner:after{content:"";width:20px;height:20px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.scan-indicator-check{position:absolute;top:0;left:0;right:0;bottom:0;background:#4ade80cc;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.5rem;font-weight:700}.scan-indicator-error-icon{position:absolute;top:0;left:0;right:0;bottom:0;background:#ef4444cc;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.5rem;font-weight:700}.scan-indicator-info{display:flex;flex-direction:column;gap:2px;min-width:80px}.scan-indicator-status{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-primary)}.scan-indicator-time{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.scan-indicator-close{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:var(--color-bg-tertiary);border:none;border-radius:50%;color:var(--color-text-secondary);cursor:pointer;font-size:1rem;line-height:1;margin-left:var(--space-xs);transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.scan-indicator-close:active{background:var(--color-bg-elevated);color:var(--color-text-primary)}.scan-result-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000bf;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:10000;display:flex;flex-direction:column;justify-content:flex-end;animation:popup-overlay-fade-in .2s ease}.scan-result-overlay.closing{animation:popup-overlay-fade-out .2s ease forwards}.scan-result-popup{background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur-heavy));-webkit-backdrop-filter:blur(var(--glass-blur-heavy));border-radius:var(--radius-xl) var(--radius-xl) 0 0;border-top:1px solid var(--glass-border-light);padding:var(--space-lg);max-height:85vh;overflow-y:auto;animation:popup-slide-up .25s ease-out;position:relative}.scan-result-popup:after{content:"";position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(233,69,96,.5),transparent);pointer-events:none}.scan-result-overlay.closing .scan-result-popup{animation:popup-slide-down .2s ease-in forwards}.scan-result-popup:before{content:"";display:block;width:40px;height:4px;background:#fff3;border-radius:2px;margin:0 auto var(--space-md)}.scan-result-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-md)}.scan-result-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text-primary)}.scan-result-close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:var(--color-bg-tertiary);border:none;border-radius:50%;color:var(--color-text-secondary);cursor:pointer;font-size:var(--font-size-xl);line-height:1;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.scan-result-close:active{background:var(--color-bg-elevated);color:var(--color-text-primary)}.scan-result-content{display:flex;flex-direction:column;gap:var(--space-md)}.scan-result-image{width:100%;aspect-ratio:1;max-height:280px;border-radius:var(--radius-lg);overflow:hidden;background:var(--color-bg-tertiary);position:relative;border:1px solid var(--glass-border)}.scan-result-image img{width:100%;height:100%;object-fit:cover}.scan-result-image.rarity-high{box-shadow:0 0 25px #c084fc4d}.scan-result-image.rarity-legendary{box-shadow:0 0 35px #ff6b6b66,0 0 70px #ff6b6b33;animation:legendary-image-glow 2s ease-in-out infinite}@keyframes legendary-image-glow{0%,to{box-shadow:0 0 30px #ff6b6b66,0 0 60px #ff6b6b33}50%{box-shadow:0 0 45px #ff6b6b80,0 0 90px #ff6b6b4d}}.scan-result-details{text-align:center}.scan-result-subject{margin:0 0 var(--space-sm);font-size:var(--font-size-xl);font-weight:700;color:var(--color-text-primary)}.scan-result-popup.rarity-rare .scan-result-subject{color:var(--color-rarity-rare);text-shadow:0 0 12px rgba(192,132,252,.5)}.scan-result-popup.rarity-legendary .scan-result-subject{background:linear-gradient(90deg,var(--color-rarity-legendary) 0%,#ffd700 50%,var(--color-rarity-legendary) 100%);background-size:200% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:shimmer-text 2s linear infinite}@keyframes shimmer-text{to{background-position:200% center}}.scan-result-popup.rarity-legendary:after{background:linear-gradient(90deg,transparent,rgba(255,107,107,.6),transparent)}.scan-result-meta{display:flex;justify-content:center;gap:var(--space-lg);margin-bottom:var(--space-md)}.scan-result-rarity{font-size:var(--font-size-lg);letter-spacing:2px}.scan-result-element{font-size:var(--font-size-base);font-weight:600;text-transform:uppercase}.scan-result-new-element{display:flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);margin-bottom:var(--space-md);background:linear-gradient(90deg,transparent,rgba(233,69,96,.15),transparent);border-radius:var(--radius-md);animation:new-element-pulse 2s ease-in-out infinite}.new-element-icon{font-size:1.2rem}.new-element-text{font-size:var(--font-size-sm);font-weight:600;color:var(--element-color, var(--color-accent));text-transform:uppercase;letter-spacing:.05em}@keyframes new-element-pulse{0%,to{opacity:.8}50%{opacity:1}}.scan-result-new-subject{background:linear-gradient(135deg,var(--color-warning) 0%,var(--color-energy) 100%);color:var(--color-bg);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);font-weight:700;font-size:var(--font-size-sm);text-align:center;margin-bottom:var(--space-sm);animation:new-subject-pulse 2s ease-in-out infinite;text-transform:uppercase;letter-spacing:.05em}@keyframes new-subject-pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.02);opacity:.9}}.scan-result-first-of-day{background:linear-gradient(135deg,var(--color-nature) 0%,var(--color-light) 100%);color:var(--color-bg);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);font-weight:700;font-size:var(--font-size-sm);text-align:center;margin-bottom:var(--space-sm);animation:first-of-day-pulse 2s ease-in-out infinite;text-transform:uppercase;letter-spacing:.05em}.scan-result-first-of-day .first-of-day-main{display:block}.scan-result-first-of-day .first-of-day-streak{display:block;font-size:var(--font-size-xs);font-weight:600;margin-top:4px;text-transform:none;letter-spacing:normal}.scan-result-first-of-day.streak-celebration{background:linear-gradient(135deg,gold,#ff8c00,#ff4500);animation:streak-celebration 1.5s ease-in-out infinite;box-shadow:0 0 20px #ffa50066}@keyframes streak-celebration{0%,to{transform:scale(1);box-shadow:0 0 15px #ffa50066}50%{transform:scale(1.03);box-shadow:0 0 25px #ffa50099,0 0 40px #ff64004d}}@keyframes first-of-day-pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.02);opacity:.9}}.scan-result-duplicate{background:#ffa50026;border:1px solid rgba(255,165,0,.4);color:var(--color-warning);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);margin-bottom:var(--space-sm);text-align:center}.scan-result-duplicate .duplicate-warning{display:block;font-weight:600;font-size:var(--font-size-sm);margin-bottom:2px}.scan-result-duplicate .duplicate-hint{display:block;font-size:var(--font-size-xs);opacity:.8}.scan-result-rewards{display:flex;justify-content:center;gap:var(--space-xl);margin-bottom:var(--space-md);padding:var(--space-md);background:#23234280;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:var(--radius-md);border:1px solid var(--glass-border);position:relative}.scan-result-rewards:before{content:"";position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);pointer-events:none}.scan-result-reward{display:flex;flex-direction:column;align-items:center;gap:2px}.scan-result-reward-value{font-size:var(--font-size-xl);font-weight:700;text-shadow:0 0 8px currentColor}.scan-result-reward-label{font-size:var(--font-size-xs);color:var(--color-text-secondary);text-transform:uppercase}.scan-result-flavor{font-style:italic;color:var(--color-text-secondary);margin:var(--space-md) 0;font-size:var(--font-size-sm);line-height:1.5}.scan-result-drops{margin:var(--space-md) 0;padding:var(--space-md);background:var(--color-bg-tertiary);border-radius:var(--radius-md)}.scan-result-drops-label{font-size:var(--font-size-xs);color:var(--color-text-secondary);text-transform:uppercase;margin-bottom:var(--space-sm)}.scan-result-drop{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-xs) 0}.scan-result-drop-name{font-weight:600}.scan-result-drop-qty{font-size:var(--font-size-sm);opacity:.8}.scan-result-achievements{margin:var(--space-md) 0;padding:var(--space-md);background:linear-gradient(135deg,#fbbf241a,#f59e0b1a);border:1px solid rgba(251,191,36,.3);border-radius:var(--radius-md)}.scan-result-achievements-label{font-size:var(--font-size-xs);color:#fbbf24;text-transform:uppercase;margin-bottom:var(--space-sm)}.scan-result-achievement{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-xs) 0}.scan-result-achievement-icon{font-size:1.5rem}.scan-result-achievement-info{display:flex;flex-direction:column}.scan-result-achievement-name{font-weight:600;color:#fbbf24}.scan-result-achievement-desc{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.scan-result-actions{display:flex;gap:.75rem;margin-top:var(--space-lg)}.scan-result-actions .btn{flex:1}.help-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:var(--color-surface-3);color:var(--color-text-secondary);font-size:.7rem;font-weight:600;cursor:pointer;margin-left:var(--space-xs);flex-shrink:0;transition:background-color .15s ease}.help-icon:hover,.help-icon:focus{background:var(--color-accent);color:#fff;outline:none}.help-popover{position:fixed;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);max-width:280px;box-shadow:var(--shadow-lg);z-index:5000;animation:fadeIn .15s ease}.help-popover-title{font-weight:600;margin-bottom:var(--space-xs);color:var(--color-text)}.help-popover-text{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:1.5;white-space:pre-line}.profile-help-btn{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-surface-3);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-secondary);font-size:var(--font-size-sm);cursor:pointer;transition:all .15s ease}.profile-help-btn:hover{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.profile-help-btn .help-icon{margin-left:0}.help-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-bg-overlay);z-index:5000;display:flex;align-items:flex-end;animation:fadeIn .2s ease}.help-modal-overlay.closing{animation:fadeOut .2s ease forwards}.help-modal-overlay.closing .help-modal{animation:slideDown .2s ease forwards}.help-modal{background:var(--color-bg-secondary);border-radius:var(--radius-xl) var(--radius-xl) 0 0;width:100%;max-height:85vh;display:flex;flex-direction:column;animation:slideUp .2s ease;will-change:transform,opacity}.help-modal:before{content:"";position:absolute;top:var(--space-sm);left:50%;transform:translate(-50%);width:36px;height:4px;background:#ffffff4d;border-radius:2px}.help-modal-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-lg) var(--space-lg) var(--space-md);border-bottom:1px solid var(--color-border)}.help-modal-title{font-size:var(--font-size-xl);font-weight:600}.help-modal-close{background:none;border:none;color:var(--color-text-secondary);font-size:1.5rem;cursor:pointer;padding:var(--space-xs);line-height:1}.help-modal-content{flex:1;overflow-y:auto;padding:var(--space-md) var(--space-lg) var(--space-xl);-webkit-overflow-scrolling:touch}.help-section{margin-bottom:var(--space-lg)}.help-section:last-child{margin-bottom:0}.help-section-title{color:var(--color-accent);font-size:var(--font-size-base);font-weight:600;margin:0 0 var(--space-sm) 0;text-transform:uppercase;letter-spacing:.05em}.help-section-item{color:var(--color-text-secondary);font-size:var(--font-size-sm);line-height:1.5;margin:0 0 var(--space-sm) 0;white-space:pre-line}.help-section-item:last-child{margin-bottom:0}.section-divider{height:1px;background:linear-gradient(90deg,transparent,var(--glass-border-light),transparent);margin:var(--space-lg) 0}.glass-container{background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-lg)}.glass-panel{background:var(--glass-bg-light);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-lg);position:relative}.glass-panel:before{content:"";position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);pointer-events:none}.text-glow{text-shadow:0 0 8px currentColor}.glow-border{border-color:#e9456066;box-shadow:0 0 15px #e9456033}.camera-flash{position:fixed;top:0;left:0;right:0;bottom:0;background:#fff;z-index:99999;pointer-events:none;animation:camera-flash .3s ease-out forwards}@keyframes camera-flash{0%{opacity:.85}to{opacity:0}}.shared-post-view{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--color-bg-primary);z-index:10000;display:flex;flex-direction:column;overflow-y:auto}.shared-post-content{flex:1;display:flex;flex-direction:column;max-width:500px;width:100%;margin:0 auto;padding:var(--space-md)}.shared-post-image-container{width:100%;aspect-ratio:1;max-height:50vh;background:#0a0a0a;border-radius:var(--radius-lg);overflow:hidden;margin-bottom:var(--space-lg)}.shared-post-image{width:100%;height:100%;object-fit:contain}.shared-post-info{flex:1}.shared-post-author{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md)}.shared-post-author-name{font-weight:600;color:var(--color-text)}.shared-post-author-level{font-size:var(--font-size-xs);color:var(--color-text-secondary);background:var(--color-surface-alt);padding:2px 8px;border-radius:var(--radius-sm)}.shared-post-discovery{margin-bottom:var(--space-lg)}.shared-post-subject{font-size:var(--font-size-xl);margin:0 0 var(--space-sm) 0;color:var(--color-text)}.shared-post-meta{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md)}.shared-post-rarity{font-weight:700;font-size:var(--font-size-lg)}.shared-post-element{padding:4px 10px;border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:600;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3)}.shared-post-caption{color:var(--color-text);margin:0 0 var(--space-sm) 0}.shared-post-flavor{color:var(--color-text-secondary);font-style:italic;font-size:var(--font-size-sm);margin:0}.shared-post-stats{display:flex;gap:var(--space-lg);color:var(--color-text-secondary);font-size:var(--font-size-sm);margin-bottom:var(--space-xl);padding-top:var(--space-md);border-top:1px solid var(--color-border)}.shared-post-stat{display:flex;align-items:center;gap:var(--space-xs)}.shared-post-comments{margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--color-border)}.shared-post-comment-list{display:flex;flex-direction:column;gap:var(--space-sm)}.shared-post-comment{font-size:var(--font-size-sm);line-height:1.4}.shared-post-comment-author{font-weight:600;color:var(--color-text-primary);margin-right:var(--space-xs)}.shared-post-comment-text{color:var(--color-text-secondary)}.shared-post-comment-more{font-size:var(--font-size-sm);color:var(--color-accent);margin-top:var(--space-sm);font-style:italic}.shared-post-cta{text-align:center;padding:var(--space-xl) 0}.shared-post-cta-text{color:var(--color-text-secondary);margin-bottom:var(--space-lg)}.shared-post-btn{width:100%;padding:var(--space-md) var(--space-xl);font-size:var(--font-size-md);font-weight:600}.shared-post-login-prompt{margin-top:var(--space-lg);color:var(--color-text-secondary);font-size:var(--font-size-sm)}.shared-post-branding{text-align:center;padding:var(--space-lg);background:var(--color-surface);border-top:1px solid var(--color-border)}.shared-post-logo{display:block;font-size:var(--font-size-lg);font-weight:700;letter-spacing:.15em;color:var(--color-text);margin-bottom:var(--space-xs)}.shared-post-tagline{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.shared-post-error .shared-post-content{justify-content:center;text-align:center}.shared-post-error-icon{font-size:4rem;margin-bottom:var(--space-lg)}.shared-post-error-title{font-size:var(--font-size-xl);color:var(--color-text);margin:0 0 var(--space-md) 0}.shared-post-error-text{color:var(--color-text-secondary);margin:0 0 var(--space-xl) 0}.hashtag-feed-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:#000000d9;display:flex;flex-direction:column;animation:fadeIn .2s ease-out}.hashtag-feed-container{display:flex;flex-direction:column;height:100%;max-width:600px;margin:0 auto;width:100%;background:var(--color-background)}.hashtag-feed-header{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);background:var(--color-surface);border-bottom:1px solid var(--color-border);flex-shrink:0}.hashtag-feed-back{background:none;border:none;color:var(--color-primary);font-size:var(--font-size-xl);cursor:pointer;padding:var(--space-xs);margin:calc(-1 * var(--space-xs));transition:opacity .15s}.hashtag-feed-back:hover{opacity:.7}.hashtag-feed-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-primary);margin:0}.hashtag-feed-scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}.hashtag-feed-list{padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-md)}.hashtag-feed-loading{text-align:center;color:var(--color-text-secondary);padding:var(--space-xl)}.camera-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000;z-index:10004;animation:fadeIn .2s ease}.camera-modal-content{width:100%;height:100%;display:flex;flex-direction:column;position:relative}.camera-modal-video-container{width:100%;height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#000}.camera-modal-video{width:100%;height:100%;object-fit:contain;background:#000;transform-origin:center center}.camera-modal-controls{position:absolute;bottom:0;left:0;right:0;padding:var(--space-xl);padding-bottom:calc(var(--space-xl) + var(--safe-area-bottom, 0px));display:flex;align-items:center;justify-content:center;gap:var(--space-xl);background:linear-gradient(transparent,#0009)}.camera-modal-close{position:absolute;top:var(--space-lg);left:var(--space-lg);top:calc(var(--space-lg) + var(--safe-area-top, 0px));width:44px;height:44px;border-radius:50%;background:#00000080;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);color:#ffffffe6;font-size:1.25rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s ease;-webkit-tap-highlight-color:transparent}.camera-modal-close:active{background:#000000b3}.camera-modal-switch{width:52px;height:52px;border-radius:50%;background:#ffffff26;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:2px solid rgba(255,255,255,.3);color:#fff;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s ease,transform .2s ease;-webkit-tap-highlight-color:transparent}.camera-modal-switch:active{background:#ffffff40;transform:rotate(180deg)}.camera-modal-capture{width:72px;height:72px;border-radius:50%;background:#fff;border:4px solid rgba(255,255,255,.5);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .1s ease,opacity .2s ease;-webkit-tap-highlight-color:transparent}.camera-modal-capture:active:not(:disabled){transform:scale(.92)}.camera-modal-capture:disabled{opacity:.5;cursor:not-allowed}.camera-modal-capture-inner{width:58px;height:58px;border-radius:50%;background:#fff;border:2px solid rgba(0,0,0,.1);transition:background .2s ease}.camera-modal-capture:active:not(:disabled) .camera-modal-capture-inner{background:#f0f0f0}.camera-modal-lens-picker{position:absolute;bottom:140px;left:50%;transform:translate(-50%);display:flex;gap:var(--space-xs);padding:var(--space-xs);background:#0006;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:20px;z-index:1}.camera-modal-lens{min-width:44px;height:36px;padding:0 var(--space-sm);border-radius:18px;border:none;background:transparent;color:#ffffffb3;font-size:.8rem;font-weight:600;cursor:pointer;transition:background .2s ease,color .2s ease;-webkit-tap-highlight-color:transparent}.camera-modal-lens:active{background:#ffffff26}.camera-modal-lens.active{background:#fff3;color:#ffc107}.camera-modal-zoom-controls{position:absolute;right:var(--space-lg);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:var(--space-xs);z-index:2}.camera-modal-zoom-btn{width:40px;height:40px;border-radius:50%;border:none;background:#00000080;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fffc;font-size:.75rem;font-weight:600;cursor:pointer;transition:background .2s ease,color .2s ease,transform .1s ease;-webkit-tap-highlight-color:transparent}.camera-modal-zoom-btn:active{transform:scale(.92)}.camera-modal-zoom-btn.active{background:#fff3;color:#ffc107}.camera-modal-zoom-indicator{margin-top:var(--space-sm);padding:var(--space-xs) var(--space-sm);background:#0009;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:12px;color:#ffffffb3;font-size:.7rem;font-weight:600;min-width:36px;text-align:center;transition:color .2s ease,background .2s ease}.camera-modal-zoom-indicator.active{color:#ffc107;background:#000000b3}.camera-focus-ring{position:absolute;width:70px;height:70px;border:2px solid rgba(255,255,255,.9);border-radius:50%;pointer-events:none;z-index:5;transform:translate(-50%,-50%);animation:focusRing .5s ease-out forwards}@keyframes focusRing{0%{transform:translate(-50%,-50%) scale(1.3);opacity:1}to{transform:translate(-50%,-50%) scale(1);opacity:.6}}.camera-focus-ring.success{border-color:#4caf50e6;animation:focusSuccess .4s ease-out forwards}@keyframes focusSuccess{0%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-50%) scale(1.1);opacity:0}}.settings-radio-group{display:flex;flex-direction:column;gap:var(--space-sm)}.settings-radio-option{display:flex;align-items:flex-start;gap:var(--space-sm);padding:var(--space-md);background:var(--glass-bg-light);border:1px solid var(--glass-border);border-radius:var(--radius-md);cursor:pointer;transition:border-color .2s ease,background .2s ease;-webkit-tap-highlight-color:transparent}.settings-radio-option:hover{border-color:var(--glass-border-light)}.settings-radio-option.selected{border-color:var(--color-accent);background:#e945601a}.settings-radio-option input[type=radio]{width:20px;height:20px;margin-top:2px;accent-color:var(--color-accent);cursor:pointer;flex-shrink:0}.settings-radio-label{flex:1}.settings-radio-title{font-weight:600;color:var(--color-text-primary);margin-bottom:var(--space-xs)}.settings-radio-desc{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:1.4}.streak-milestone-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:10001;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease}.streak-milestone-overlay.active{opacity:1}.streak-milestone-overlay.closing{opacity:0}.streak-milestone-backdrop{position:absolute;top:0;left:0;right:0;bottom:0;background:#000000d9}.streak-milestone-confetti{position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;pointer-events:none}.confetti-particle{position:absolute;width:10px;height:10px;border-radius:2px;left:var(--x);top:-20px;animation:confetti-fall var(--duration) linear var(--delay) forwards;transform:rotate(var(--rotation))}@keyframes confetti-fall{0%{top:-20px;opacity:1;transform:rotate(var(--rotation)) translate(0)}to{top:100vh;opacity:0;transform:rotate(calc(var(--rotation) + 720deg)) translate(50px)}}.streak-milestone-card{position:relative;background:var(--color-surface);border-radius:var(--radius-xl);padding:var(--space-xl) var(--space-lg);text-align:center;max-width:340px;margin:var(--space-lg);box-shadow:0 25px 50px #00000080;transform:scale(.8);opacity:0;transition:transform .4s cubic-bezier(.175,.885,.32,1.275),opacity .3s ease}.streak-milestone-overlay.active .streak-milestone-card{transform:scale(1);opacity:1}.streak-milestone-overlay.closing .streak-milestone-card{transform:scale(.9);opacity:0}.streak-milestone-card:before{content:"";position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;border-radius:calc(var(--radius-xl) + 2px);background:linear-gradient(135deg,gold,#ff6b35,#e94560,#7b2cbf);z-index:-1;animation:milestone-glow 3s ease-in-out infinite}@keyframes milestone-glow{0%,to{opacity:.8;filter:blur(4px)}50%{opacity:1;filter:blur(8px)}}.streak-milestone-emoji{font-size:64px;margin-bottom:var(--space-sm);animation:milestone-bounce 1s ease-in-out infinite}@keyframes milestone-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.streak-milestone-title{font-size:var(--font-size-xl);font-weight:700;margin:0 0 var(--space-xs);background:linear-gradient(135deg,gold,#ff6b35);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.streak-milestone-subtitle{font-size:var(--font-size-base);color:var(--color-text-secondary);margin:0 0 var(--space-lg)}.streak-milestone-rewards{display:flex;flex-direction:column;gap:var(--space-md);margin-bottom:var(--space-lg)}.streak-milestone-reward{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--glass-bg-light);border-radius:var(--radius-md);border:1px solid var(--glass-border)}.streak-milestone-reward-icon{font-size:24px;flex-shrink:0}.streak-milestone-reward-value{font-size:var(--font-size-lg);font-weight:700;color:var(--color-text-primary)}.streak-milestone-reward-label{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-left:auto}.streak-milestone-item .streak-milestone-reward-value{font-size:var(--font-size-base);color:#7b2cbf}.streak-milestone-btn{width:100%;padding:var(--space-md) var(--space-lg);font-size:var(--font-size-base);font-weight:600;font-family:var(--font-family);border:none;border-radius:var(--radius-md);background:linear-gradient(135deg,gold,#ff6b35);color:#000;cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.streak-milestone-btn:active{transform:scale(.97);opacity:.9}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:var(--font-family);background:var(--color-bg-primary);color:var(--color-text-primary);height:100vh;height:calc(var(--vh, 1vh) * 100);overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#app{display:flex;flex-direction:column;height:100%;max-width:var(--max-width);margin:0 auto;padding:0 var(--space-md);overflow:hidden}.app-header{display:flex;flex-direction:column;gap:var(--space-xs);padding:var(--space-xs) 0 var(--space-sm);flex-shrink:0;position:relative}.app-header:before{content:"";position:absolute;top:-20px;left:50%;transform:translate(-50%);width:200px;height:60px;background:radial-gradient(ellipse,rgba(233,69,96,.08) 0%,transparent 70%);pointer-events:none;z-index:-1}.header-top{display:flex;justify-content:space-between;align-items:center}.header-left{display:flex;align-items:center;gap:.6rem}.app-header h1{font-size:var(--font-size-xl);letter-spacing:.12em;white-space:nowrap;margin:0;background:linear-gradient(180deg,var(--color-text-primary) 0%,rgba(240,240,240,.75) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.header-username{font-size:var(--font-size-sm);color:var(--color-accent);font-weight:500;opacity:.9;cursor:pointer;-webkit-tap-highlight-color:transparent}.header-username:active{opacity:.7}.header-username:before{content:"·";margin-right:var(--space-sm);color:var(--color-text-secondary)}.header-stats{display:flex;align-items:center;justify-content:center;gap:var(--space-sm);font-size:var(--font-size-sm);color:var(--color-text-secondary);flex-wrap:wrap}.header-stats>span:first-child{font-weight:500;color:var(--color-text)}.header-stats .streak{color:var(--color-fire);font-weight:500}.header-stats .streak.milestone-7{color:var(--color-warning)}.header-stats .streak.milestone-30{color:var(--color-rarity-rare)}.header-stats .streak.milestone-100{color:var(--color-rarity-legendary);text-shadow:0 0 8px var(--color-rarity-legendary)}.streak-countdown{font-size:.75em;opacity:.9;margin-left:.25em}.streak-countdown.at-risk{color:var(--color-warning);animation:streak-pulse 2s infinite}.streak-countdown.safe{color:var(--color-success)}@keyframes streak-pulse{0%,to{opacity:1}50%{opacity:.5}}.header-badge{display:inline-flex;align-items:center;gap:2px;padding:6px 10px;min-height:32px;background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius-full);font-size:10px;color:var(--color-text-secondary);cursor:pointer;transition:all .15s ease;-webkit-tap-highlight-color:transparent}.header-badge:active{transform:scale(.95);background:var(--color-bg-elevated)}.header-badge.has-claimable,.header-badge.has-effect{border-color:var(--color-accent);color:var(--color-accent);animation:badge-pulse 2s ease-in-out infinite}@keyframes badge-pulse{0%,to{opacity:1}50%{opacity:.7}}.header-badge-icon{font-size:11px}.header-badge-count{font-weight:600}.header-badge-count:empty{display:none}.status-indicator{width:10px;height:10px;border-radius:50%;display:inline-block;flex-shrink:0;cursor:pointer;background:linear-gradient(90deg,var(--status-connection, rgba(160, 160, 160, .6)) 50%,var(--status-gps, rgba(160, 160, 160, .6)) 50%);transition:background .3s ease,box-shadow .3s ease;position:relative}.status-indicator:before{content:"";position:absolute;top:-17px;right:-17px;bottom:-17px;left:-17px}.status-indicator.online{box-shadow:0 0 8px #4ade8099}.status-indicator.syncing{animation:status-pulse 2s ease-in-out infinite}@keyframes status-pulse{0%,to{opacity:1;box-shadow:0 0 6px #34d39980}50%{opacity:.7;box-shadow:0 0 12px #34d399b3}}.view{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.view.hidden{display:none!important}.view-scroll{flex:1;overflow-y:auto;min-height:0;padding-bottom:calc(var(--nav-height) + 24px + var(--safe-area-bottom));-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain}.nav-bar{position:fixed;bottom:0;left:0;right:0;max-width:var(--max-width);margin:0 auto;z-index:1000;display:flex;justify-content:space-around;padding:.6rem var(--space-md);padding-bottom:calc(.6rem + var(--safe-area-bottom));background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border-top:1px solid var(--glass-border-light);box-shadow:0 -4px 30px #0000004d,inset 0 1px #ffffff0d}.nav-btn{background:none;border:none;color:var(--color-text-secondary);font-size:var(--font-size-xs);cursor:pointer;padding:var(--space-xs) var(--space-lg);display:flex;flex-direction:column;align-items:center;gap:.2rem;-webkit-tap-highlight-color:transparent;transition:color var(--transition-fast),transform .1s ease;position:relative}.nav-btn-icon{font-size:1.2rem;transition:transform var(--transition-fast),filter var(--transition-fast)}.nav-btn.active{color:var(--color-accent)}.nav-btn.active:after{content:"";position:absolute;bottom:-2px;left:50%;transform:translate(-50%);width:4px;height:4px;background:var(--color-accent);border-radius:50%;box-shadow:var(--glow-accent-subtle)}.nav-btn.active .nav-btn-icon{filter:drop-shadow(0 0 6px rgba(233,69,96,.5));transform:scale(1.05)}.nav-btn:active{color:var(--color-accent);transform:scale(.95)}.loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;height:calc(var(--vh, 1vh) * 100);gap:var(--space-xl)}.loading-screen h1{font-size:var(--font-size-3xl);letter-spacing:.15em;background:linear-gradient(180deg,var(--color-text-primary) 0%,rgba(240,240,240,.75) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.loading-spinner{width:40px;height:40px;border:3px solid var(--color-bg-secondary);border-top-color:var(--color-accent);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.login-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;height:calc(var(--vh, 1vh) * 100);padding:var(--space-2xl);padding-bottom:calc(var(--space-2xl) + var(--safe-area-bottom));max-width:400px;margin:0 auto}.login-screen h1{font-size:var(--font-size-3xl);letter-spacing:.15em;margin-bottom:var(--space-sm)}.login-screen .subtitle{color:var(--color-text-secondary);margin-bottom:var(--space-2xl)}.login-form{width:100%;display:flex;flex-direction:column;gap:var(--space-lg)}.login-form input{width:100%;padding:var(--space-lg);border-radius:var(--radius-md);border:2px solid var(--color-bg-secondary);background:var(--color-bg-secondary);color:var(--color-text-primary);font-size:var(--font-size-lg)}.login-form input:focus{outline:none;border-color:var(--color-accent)}.login-form input::placeholder{color:var(--color-text-secondary)}.login-form button{width:100%;padding:var(--space-lg);border-radius:var(--radius-md);border:none;background:var(--color-accent);color:#fff;font-size:var(--font-size-lg);font-weight:700;cursor:pointer;transition:opacity var(--transition-fast)}.login-form button:disabled{opacity:.5;cursor:not-allowed}.login-form button:not(:disabled):active{opacity:.8}.login-error{color:var(--color-accent);font-size:var(--font-size-base);text-align:center;min-height:1.25rem}.pre-alpha-notice{background:#f9731626;border:1px solid rgba(249,115,22,.4);border-radius:var(--radius-md);padding:var(--space-md);font-size:var(--font-size-sm);color:var(--color-text-secondary);text-align:left;line-height:1.5}.pre-alpha-notice strong{color:var(--color-fire)}.pre-alpha-notice.hidden{display:none}.privacy-checkbox{display:flex;align-items:flex-start;gap:var(--space-sm);font-size:var(--font-size-base);color:var(--color-text-secondary);cursor:pointer;text-align:left}.privacy-checkbox input[type=checkbox]{width:18px;height:18px;margin-top:2px;accent-color:var(--color-accent);cursor:pointer;flex-shrink:0}.privacy-checkbox a{color:var(--color-accent);text-decoration:underline}.privacy-checkbox.hidden{display:none}.login-toggle{margin-top:var(--space-lg);color:var(--color-text-secondary);font-size:var(--font-size-base)}.login-toggle a{color:var(--color-accent);text-decoration:none;cursor:pointer}.login-toggle a:hover{text-decoration:underline}.forgot-password-link{margin-top:var(--space-sm);font-size:var(--font-size-sm)}.forgot-password-link a{color:var(--color-text-secondary);text-decoration:none;cursor:pointer}.forgot-password-link a:hover{color:var(--color-accent);text-decoration:underline}.auth-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--color-bg-primary);z-index:2000;display:flex;align-items:center;justify-content:center;padding:var(--space-2xl)}.auth-overlay.hidden{display:none}.auth-modal{width:100%;max-width:400px;display:flex;flex-direction:column;align-items:center;text-align:center}.auth-modal h2{font-size:var(--font-size-2xl);margin-bottom:var(--space-md)}.auth-modal .auth-description{color:var(--color-text-secondary);margin-bottom:var(--space-xl);line-height:1.5}.auth-modal form{width:100%;display:flex;flex-direction:column;gap:var(--space-lg)}.auth-modal input{width:100%;padding:var(--space-lg);border-radius:var(--radius-md);border:2px solid var(--color-bg-secondary);background:var(--color-bg-secondary);color:var(--color-text-primary);font-size:var(--font-size-lg)}.auth-modal input:focus{outline:none;border-color:var(--color-accent)}.auth-modal input::placeholder{color:var(--color-text-secondary)}.auth-modal button[type=submit]{width:100%;padding:var(--space-lg);border-radius:var(--radius-md);border:none;background:var(--color-accent);color:#fff;font-size:var(--font-size-lg);font-weight:700;cursor:pointer;transition:opacity var(--transition-fast)}.auth-modal button[type=submit]:disabled{opacity:.5;cursor:not-allowed}.auth-modal button[type=submit]:not(:disabled):active{opacity:.8}.auth-modal .login-error{color:var(--color-accent);font-size:var(--font-size-base);text-align:center;min-height:1.25rem}.auth-success{color:var(--color-nature);font-size:var(--font-size-base);text-align:center;margin:var(--space-lg) 0}.auth-success.hidden{display:none}.auth-back-btn{margin-top:var(--space-xl);padding:var(--space-md) var(--space-xl);border-radius:var(--radius-md);border:1px solid var(--color-text-secondary);background:transparent;color:var(--color-text-secondary);font-size:var(--font-size-base);cursor:pointer;transition:all var(--transition-fast)}.auth-back-btn:active{background:var(--color-bg-secondary);color:var(--color-text-primary)}#camera-input{display:none}.section-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-sm) 0;flex-shrink:0}.section-header h2{font-size:var(--font-size-lg);font-weight:600;margin:0}.section-header span{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.section-title{font-size:var(--font-size-sm);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-md)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--space-2xl);color:var(--color-text-secondary);gap:var(--space-sm)}.empty-state-icon{font-size:3rem;opacity:.5}.empty-state-text{font-size:var(--font-size-base)}.empty-state-hint{font-size:var(--font-size-sm);opacity:.7}.loading-state{display:flex;align-items:center;justify-content:center;padding:var(--space-2xl);color:var(--color-text-secondary)}.error-state{text-align:center;padding:var(--space-2xl);color:var(--color-error)}.landscape-blocker{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:99999;background:var(--color-bg-primary);flex-direction:column;align-items:center;justify-content:center;gap:var(--space-lg);text-align:center;padding:var(--space-2xl)}.landscape-blocker-icon{font-size:4rem;animation:rotate-phone 2s ease-in-out infinite}.landscape-blocker-text{font-size:var(--font-size-lg);color:var(--color-text-secondary)}@keyframes rotate-phone{0%,to{transform:rotate(0)}25%{transform:rotate(-15deg)}75%{transform:rotate(15deg)}}@media (min-aspect-ratio: 4/3) and (max-height: 600px){.landscape-blocker{display:flex}}#reveal-view{justify-content:flex-start;gap:var(--section-gap);padding:var(--section-gap) 0;padding-bottom:0;overflow-y:auto;overscroll-behavior-y:contain}#reveal-view .recent-discoveries{margin-top:auto;margin-bottom:calc(var(--nav-height) + 10px + var(--safe-area-bottom))}.mana-section{flex-shrink:0}.mana-meter{background:var(--glass-bg-light);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:var(--radius-lg);padding:var(--space-md);border:1px solid var(--glass-border);position:relative;overflow:hidden}.mana-meter:before{content:"";position:absolute;top:0;left:-100%;width:50%;height:100%;background:var(--gradient-shimmer);animation:mana-shimmer 5s ease-in-out infinite;pointer-events:none}@keyframes mana-shimmer{0%,to{left:-100%;opacity:0}50%{left:150%;opacity:1}}.mana-bar-container{background:#0f0f2399;border-radius:var(--radius-md);height:var(--mana-bar-height);overflow:visible;position:relative;border:1px solid rgba(255,255,255,.05)}.mana-progress-bar{height:100%;background:linear-gradient(90deg,rgba(233,69,96,.85) 0%,var(--color-accent) 50%,#ff6b8a 100%);width:0%;transition:width .5s ease-out,box-shadow .3s ease;border-radius:var(--radius-md);position:relative}.mana-progress-bar:after{content:"";position:absolute;top:0;right:0;width:30%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.25));border-radius:inherit;pointer-events:none}.mana-progress-bar.overcharge{background:linear-gradient(90deg,var(--color-warning) 0%,var(--color-fire) 50%,#ff8c42 100%);animation:overchargeGlow 1.5s ease-in-out infinite}@keyframes overchargeGlow{0%,to{box-shadow:0 0 15px #facc1580,0 0 30px #f973164d}50%{box-shadow:0 0 25px #facc15b3,0 0 50px #f9731666}}.mana-progress-bar.gathering{box-shadow:var(--glow-mana),inset 0 0 10px #ffffff26;animation:manaGlowEnhanced 2s ease-in-out infinite}@keyframes manaGlowEnhanced{0%,to{box-shadow:var(--glow-mana),inset 0 0 8px #ffffff1a}50%{box-shadow:0 0 25px #e9456099,0 0 45px #e945604d,inset 0 0 12px #ffffff26}}.mana-progress-bar.milestone-pulse{animation:manaMilestone .4s ease-out}@keyframes manaMilestone{0%{transform:scaleY(1);filter:brightness(1)}50%{transform:scaleY(1.15);filter:brightness(1.3)}to{transform:scaleY(1);filter:brightness(1)}}.mana-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-weight:700;font-size:var(--font-size-base);text-shadow:var(--shadow-text)}.mana-info{display:flex;justify-content:space-between;margin-top:var(--space-xs);font-size:var(--font-size-sm);color:var(--color-text-secondary)}.mana-hint{margin:var(--space-sm) 0 0 0;font-size:var(--font-size-sm);color:var(--color-text-secondary);text-align:center;opacity:.8}.mana-hint.hidden{display:none}.gps-quality-badge{display:block;margin:var(--space-xs) auto 0;font-size:var(--font-size-xs);padding:2px 8px;border-radius:var(--radius-sm);text-align:center}.gps-quality-badge.marginal{background:#ffc10726;color:#ffc107}.gps-quality-badge.poor{background:#f4433626;color:#f44336}.gps-quality-badge.hidden{display:none}.reveal-section{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;gap:var(--space-md)}.stored-mana{display:flex;align-items:center;justify-content:center;gap:var(--space-sm);font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--space-sm)}.stored-mana-dots{display:flex;gap:var(--space-xs)}.stored-mana-dot{width:10px;height:10px;border-radius:50%;border:2px solid var(--color-accent);background:transparent;transition:background var(--transition-fast)}.stored-mana-dot.filled{background:var(--color-accent)}.reveal-controls{display:flex;align-items:center;gap:var(--space-md)}.store-mana-btn{padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-full);border:1px solid rgba(96,165,250,.4);background:#60a5fa1a;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--color-store);font-size:var(--font-size-sm);font-weight:600;cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.store-mana-btn:hover:not(:disabled){background:#60a5fa33;box-shadow:var(--glow-water)}.store-mana-btn:active:not(:disabled){transform:scale(.95);background:var(--color-store);color:#fff;box-shadow:0 0 20px #60a5fa99}.store-mana-btn:disabled{opacity:.5;cursor:wait;transform:none}.channel-mana-btn{padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-full);border:1px solid rgba(249,115,22,.4);background:#f973161a;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--color-channel);font-size:var(--font-size-sm);font-weight:600;cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.channel-mana-btn:hover:not(:disabled){background:#f9731633;box-shadow:var(--glow-fire)}.channel-mana-btn:active:not(:disabled){transform:scale(.95);background:var(--color-channel);color:#fff;box-shadow:0 0 20px #f9731699}.channel-mana-btn:disabled{opacity:.5;cursor:wait;transform:none}.reveal-btn-wrapper{position:relative;display:inline-flex;align-items:center;justify-content:center}.reveal-btn-wrapper:before{content:"";position:absolute;width:calc(var(--reveal-btn-size) * 1.6);height:calc(var(--reveal-btn-size) * 1.6);border-radius:50%;background:radial-gradient(circle,rgba(233,69,96,.15) 0%,rgba(233,69,96,.05) 40%,transparent 70%);pointer-events:none;opacity:0;transition:opacity .3s ease}.reveal-btn-wrapper.ready:before{opacity:1;animation:aura-pulse 3s ease-in-out infinite}@keyframes aura-pulse{0%,to{transform:scale(1);opacity:.6}50%{transform:scale(1.15);opacity:1}}.reveal-progress-ring{position:absolute;width:calc(var(--reveal-btn-size) * 1.15);height:calc(var(--reveal-btn-size) * 1.15);transform:rotate(-90deg);pointer-events:none}.progress-ring-bg{fill:none;stroke:var(--color-bg-tertiary);stroke-width:4}.progress-ring-fill{fill:none;stroke:var(--color-accent);stroke-width:4;stroke-linecap:round;stroke-dasharray:339.3;stroke-dashoffset:339.3;transition:stroke-dashoffset .3s ease-out}.reveal-progress-ring.charging .progress-ring-fill{filter:drop-shadow(0 0 4px var(--color-accent-glow))}.reveal-progress-ring.ready .progress-ring-fill{filter:drop-shadow(0 0 10px rgba(233,69,96,.6))}.reveal-btn{width:var(--reveal-btn-size);height:var(--reveal-btn-size);border-radius:50%;border:3px solid rgba(233,69,96,.5);background:var(--glass-bg-dark);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--color-text-secondary);font-size:var(--reveal-btn-font);font-weight:700;cursor:not-allowed;transition:all var(--transition-slow);-webkit-tap-highlight-color:transparent;position:relative;overflow:hidden}.reveal-btn:before{content:"";position:absolute;top:0;left:15%;right:15%;height:35%;background:linear-gradient(180deg,rgba(255,255,255,.12) 0%,transparent 100%);border-radius:50% 50% 0 0;pointer-events:none}.reveal-btn.ready{background:linear-gradient(180deg,var(--color-accent) 0%,rgba(200,50,80,1) 100%);border-color:var(--color-accent);color:#fff;cursor:pointer;box-shadow:var(--glow-accent-strong);animation:reveal-breathe-enhanced 2.5s ease-in-out infinite}.reveal-btn.ready:active{animation:none;transform:scale(.95);box-shadow:0 0 40px #e94560b3}@keyframes reveal-breathe-enhanced{0%,to{transform:scale(1);box-shadow:0 0 25px #e9456080,0 0 50px #e9456033}50%{transform:scale(1.04);box-shadow:0 0 35px #e9456099,0 0 70px #e945604d,0 0 100px #e945601a}}.reveal-btn.charging{animation:charge-pulse .6s ease-out}@keyframes charge-pulse{0%{transform:scale(1);box-shadow:0 0 0 0 var(--color-accent)}50%{transform:scale(1.1);box-shadow:0 0 0 20px #e9456000}to{transform:scale(1)}}.btn-subtitle{display:block;font-size:.6rem;font-weight:400;opacity:.7;margin-top:2px;text-transform:none}.reveal-btn .btn-subtitle{font-size:.55rem}.recent-discoveries{flex-shrink:0}.recent-header{font-size:var(--font-size-sm);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-sm)}.recent-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-sm)}.recent-item{aspect-ratio:3/4;background:var(--glass-bg-light);border-radius:var(--radius-md);overflow:hidden;position:relative;cursor:pointer;border:1px solid var(--glass-border);transition:transform var(--transition-fast),box-shadow var(--transition-fast),border-color var(--transition-fast)}.recent-item:active{transform:scale(.97)}.recent-item:hover,.recent-item:focus{border-color:#e945604d;box-shadow:0 4px 20px #0000004d,0 0 15px #e9456026}.recent-item img{width:100%;height:100%;object-fit:cover}.recent-item .rarity-badge{position:absolute;top:var(--space-xs);right:var(--space-xs);background:#000000bf;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);padding:.15rem .4rem;border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:700;border:1px solid rgba(255,255,255,.1)}.recent-empty{grid-column:1 / -1;text-align:center;color:var(--color-text-secondary);font-size:var(--font-size-sm);padding:var(--space-lg);opacity:.6}#grimoire-view{padding:0}.grimoire-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-xs) var(--space-md);flex-shrink:0}.grimoire-header h2{font-size:var(--font-size-lg);font-weight:600;margin:0}.grimoire-header span{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.grimoire-filters{display:flex;gap:var(--space-sm);padding:var(--space-sm) 0;overflow-x:auto;flex-shrink:0;-webkit-overflow-scrolling:touch;scrollbar-width:none}.grimoire-filters::-webkit-scrollbar{display:none}.filter-chip{background:var(--color-bg-secondary);border:1px solid transparent;border-radius:var(--radius-full);padding:.5rem .85rem;min-height:36px;font-size:var(--font-size-sm);color:var(--color-text-secondary);cursor:pointer;white-space:nowrap;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent;display:inline-flex;align-items:center}.filter-chip:hover{border-color:var(--color-text-muted)}.filter-chip:active{transform:scale(.95)}.filter-chip.active{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.filter-chip .filter-icon{margin-right:var(--space-xs)}.grimoire-scroll{flex:1;overflow-y:auto;min-height:0;padding-bottom:calc(var(--nav-height) + 10px + var(--safe-area-bottom));-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain}.grimoire-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-sm)}@media (min-width: 380px){.grimoire-grid{grid-template-columns:repeat(3,1fr)}}.grimoire-item{aspect-ratio:3/4;background:var(--color-bg-secondary);border-radius:var(--radius-md);overflow:hidden;position:relative;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;transition:transform .1s ease}.grimoire-item:active{transform:scale(.97)}.grimoire-item img{width:100%;height:100%;object-fit:cover}.grimoire-item .rarity-badge{position:absolute;top:var(--space-xs);right:var(--space-xs);background:#000000b3;padding:.125rem .375rem;border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:700}.grimoire-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:var(--color-text-secondary);text-align:center;gap:var(--space-sm)}.grimoire-empty-icon{font-size:3rem;opacity:.5}.grimoire-sentinel{grid-column:1 / -1;display:flex;justify-content:center;align-items:center;padding:var(--space-md);min-height:60px}.grimoire-loading{display:flex;align-items:center;justify-content:center}.grimoire-loading .spinner{width:24px;height:24px}#profile-view{display:flex;flex-direction:column;padding:0}.profile-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-xs) var(--space-md);flex-shrink:0}.profile-scroll{flex:1;overflow-y:auto;min-height:0;padding:0 var(--space-md);padding-bottom:calc(var(--nav-height) + 10px + var(--safe-area-bottom));-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain}.profile-title{display:flex;flex-direction:column;gap:.1rem}.profile-header h2{font-size:var(--font-size-lg);font-weight:600;margin:0}.profile-subtitle{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.logout-btn{background:none;border:1px solid var(--color-accent);color:var(--color-accent);font-size:var(--font-size-sm);padding:var(--space-xs) var(--space-md);border-radius:var(--radius-md);cursor:pointer;-webkit-tap-highlight-color:transparent}.logout-btn:active{background:var(--color-accent);color:#fff}.profile-card{background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--space-md);margin-bottom:var(--space-md)}.profile-level{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:var(--space-sm)}.profile-level-title{font-size:var(--font-size-xl);font-weight:700}.profile-level-xp{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.profile-xp-bar{background:var(--color-bg-bar);border-radius:var(--radius-md);height:.5rem;overflow:hidden}.profile-xp-fill{height:100%;background:var(--color-accent);transition:width var(--transition-slow)}.profile-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-sm);margin-top:var(--space-sm);padding-top:var(--space-sm);border-top:1px solid rgba(255,255,255,.1)}.profile-stat-mana{grid-column:1 / -1;justify-self:center}.profile-stat{text-align:center}.profile-stat-value{font-size:var(--font-size-lg);font-weight:700}.profile-stat-label{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.profile-stat-mana .profile-stat-value{display:flex;align-items:center;justify-content:center;gap:4px;font-size:var(--font-size-base)}.profile-stat-mana .profile-stat-label{display:flex;align-items:center;gap:6px}.profile-stat-mana{cursor:pointer;padding:2px var(--space-sm);border-radius:var(--radius-sm);transition:background var(--transition-fast);-webkit-tap-highlight-color:transparent;border:1.5px solid transparent}.profile-stat-mana:active{background:var(--color-accent-subtle)}.profile-stat-mana.can-upgrade{border-color:var(--color-accent);animation:pulse-glow 2s ease-in-out infinite}@keyframes pulse-glow{0%,to{border-color:var(--color-accent)}50%{border-color:#e9456099}}.mana-upgrade-indicator{display:none}.mana-upgrade-hint{font-size:10px;color:var(--color-accent)}.profile-section-title{font-size:var(--font-size-sm);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-top:var(--space-sm);margin-bottom:var(--space-xs)}.element-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.element-item{display:flex;align-items:center;gap:var(--space-xs);background:var(--color-bg-secondary);padding:.4rem .6rem;border-radius:var(--radius-md)}.element-icon{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs)}.element-info{flex:1}.element-name{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.element-value{font-size:var(--font-size-md);font-weight:700}.element-header{display:flex;justify-content:space-between;align-items:center}.xp-bonus{font-size:var(--font-size-xs);font-weight:700}.mastery-row{display:flex;justify-content:space-between;align-items:center;margin-top:var(--space-xs)}.mastery-stars{font-size:var(--font-size-xs);letter-spacing:-1px}.mastery-star{opacity:.3}.mastery-star.filled{opacity:1}.mastery-upgrade-btn{font-size:.65rem;padding:2px 6px;min-height:22px;border:none;background:var(--color-accent-subtle);color:var(--color-accent);border-radius:var(--radius-full);cursor:pointer;font-weight:600;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.mastery-upgrade-btn:active:not(.disabled){transform:scale(.95);background:var(--color-accent);color:#fff}.mastery-upgrade-btn.disabled{opacity:.3;cursor:not-allowed;background:var(--color-bg-tertiary);color:var(--color-text-secondary)}.mastery-maxed{font-size:.55rem;color:var(--color-text-secondary);font-weight:700}.email-section{margin-top:var(--space-lg);padding:var(--space-md);background:var(--color-bg-secondary);border-radius:var(--radius-md)}.email-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-sm)}.email-title{font-size:var(--font-size-sm);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em}.email-status{font-size:var(--font-size-xs);padding:2px 8px;border-radius:var(--radius-sm)}.email-status.not-set{color:var(--color-text-secondary);background:#ffffff1a}.email-status.unverified{color:var(--color-warning);background:#f9731633}.email-status.verified{color:var(--color-nature);background:#22c55e33}.email-content{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm)}.email-address{font-size:var(--font-size-base);color:var(--color-text-primary);word-break:break-all}.email-actions{display:flex;gap:var(--space-xs);flex-shrink:0}.email-btn{padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);border:1px solid rgba(255,255,255,.2);background:transparent;color:var(--color-text-secondary);font-size:var(--font-size-sm);cursor:pointer;transition:all var(--transition-fast)}.email-btn:active{background:var(--color-bg-elevated);color:var(--color-text-primary)}.email-btn.hidden{display:none}.email-edit{display:flex;flex-direction:column;gap:var(--space-sm)}.email-edit.hidden{display:none}.email-edit input{width:100%;padding:var(--space-sm);border-radius:var(--radius-sm);border:1px solid rgba(255,255,255,.2);background:var(--color-bg-elevated);color:var(--color-text-primary);font-size:var(--font-size-base)}.email-edit input:focus{outline:none;border-color:var(--color-accent)}.email-edit input::placeholder{color:var(--color-text-secondary)}.email-edit-actions{display:flex;gap:var(--space-sm);justify-content:flex-end}.email-btn-cancel{border-color:var(--color-text-secondary)}.email-btn-save{background:var(--color-accent);border-color:var(--color-accent);color:#fff}.email-btn-save:active{opacity:.8;background:var(--color-accent);color:#fff}.email-error{color:var(--color-accent);font-size:var(--font-size-sm);text-align:center}.email-error.hidden{display:none}.camera-mode-section{margin-top:var(--space-lg);padding:var(--space-md);background:var(--color-bg-secondary);border-radius:var(--radius-md)}.camera-mode-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-sm)}.camera-mode-title{font-size:var(--font-size-sm);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em}.profile-footer{display:flex;align-items:center;gap:var(--space-sm);margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid rgba(255,255,255,.1)}.profile-footer-btn{flex:1;padding:var(--space-sm);background:var(--color-bg-secondary);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-md);color:var(--color-text-primary);font-size:var(--font-size-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:var(--space-xs);-webkit-tap-highlight-color:transparent}.profile-footer-btn:active{background:var(--color-bg-elevated)}#language-select{background:var(--color-bg-elevated);color:var(--color-text-primary);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-md);padding:var(--space-xs) var(--space-sm);padding-right:var(--space-lg);font-size:var(--font-size-sm);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23888' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 6px center}#language-select:focus{outline:none;border-color:var(--color-accent)}.profile-footer .logout-btn{padding:var(--space-sm) var(--space-md);background:none;border:1px solid var(--color-accent);border-radius:var(--radius-md);color:var(--color-accent);font-size:var(--font-size-sm);cursor:pointer;-webkit-tap-highlight-color:transparent}.profile-footer .logout-btn:active{background:var(--color-accent);color:#fff}#leaderboard-view{padding:0}.leaderboard-header{display:flex;flex-direction:column;gap:var(--space-xs);padding:var(--space-xs) var(--space-md);flex-shrink:0}.leaderboard-title-row{display:flex;justify-content:space-between;align-items:center}.leaderboard-header h2{font-size:var(--font-size-lg);font-weight:600;margin:0}.leaderboard-title-row span{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.leaderboard-tabs{display:flex;gap:var(--space-xs)}.leaderboard-tab{flex:1;padding:var(--space-sm) var(--space-md);background:transparent;border:1px solid var(--color-bg-tertiary);border-radius:var(--radius-sm);color:var(--color-text-secondary);font-size:var(--font-size-sm);cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent;min-height:44px}.leaderboard-tab:active{transform:scale(.95)}.leaderboard-tab.active{background:var(--color-accent);border-color:var(--color-accent);color:#fff}.player-rank-banner{background:var(--color-accent-subtle);border:1px solid var(--color-accent);border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md);margin-bottom:var(--space-md);text-align:center;font-size:var(--font-size-md)}.player-rank-banner span{font-weight:700;color:var(--color-accent)}.leaderboard-scroll{flex:1;overflow-y:auto;min-height:0;padding-bottom:calc(var(--nav-height) + 10px + var(--safe-area-bottom));-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain}.leaderboard-list{display:flex;flex-direction:column;gap:var(--space-sm)}.leaderboard-entry{background:var(--color-bg-secondary);border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md)}.leaderboard-entry.current-player{border:2px solid var(--color-accent);background:var(--color-accent-subtle);box-shadow:0 0 10px var(--color-accent-glow)}.you-badge{background:var(--color-accent);color:#fff;font-size:var(--font-size-xs);padding:.1rem .35rem;border-radius:var(--radius-sm);margin-left:var(--space-xs);font-weight:700;text-transform:uppercase;letter-spacing:.5px}.leaderboard-main{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:2px}.leaderboard-rank{font-size:var(--font-size-lg);font-weight:700;min-width:2.5rem;color:var(--color-text-secondary)}.leaderboard-entry:nth-child(1) .leaderboard-rank{color:var(--color-gold)}.leaderboard-entry:nth-child(2) .leaderboard-rank{color:var(--color-silver)}.leaderboard-entry:nth-child(3) .leaderboard-rank{color:var(--color-bronze)}.leaderboard-name{font-weight:600;flex:1}.leaderboard-name.clickable-name{color:var(--color-accent);cursor:pointer;padding:var(--space-xs) var(--space-sm);margin:calc(-1 * var(--space-xs)) calc(-1 * var(--space-sm));border-radius:var(--radius-sm);transition:background var(--transition-fast);-webkit-tap-highlight-color:transparent}.leaderboard-name.clickable-name:active{background:var(--color-accent-subtle)}.leaderboard-level{font-size:var(--font-size-base);color:var(--color-accent);font-weight:600}.leaderboard-stats{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-left:2.5rem;margin-bottom:0}.leaderboard-essence{display:flex;gap:var(--space-xs);flex-wrap:wrap;font-size:var(--font-size-xs);margin-left:2.5rem}.leaderboard-loading,.leaderboard-error{text-align:center;color:var(--color-text-secondary);padding:var(--space-2xl)}.leaderboard-error{color:var(--color-accent)}.leaderboard-empty{text-align:center;padding:3rem var(--space-lg);color:var(--color-text-secondary)}.leaderboard-empty p{margin:0}.leaderboard-empty-hint{font-size:var(--font-size-base);margin-top:var(--space-sm)!important;opacity:.7}#chronicle-view{padding:0}.chronicle-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-xs) var(--space-md);flex-shrink:0}.chronicle-header h2{font-size:var(--font-size-lg);font-weight:600;margin:0}.chronicle-header span{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.chronicle-scroll{flex:1;overflow-y:auto;min-height:0;padding-bottom:calc(var(--nav-height) + 10px + var(--safe-area-bottom));-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain}.chronicle-list{display:flex;flex-direction:column;gap:2px}.chronicle-card{background:var(--color-bg-secondary);overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;opacity:0;transform:translateY(12px);transition:opacity .3s ease-out,transform .3s ease-out}.chronicle-card.visible{opacity:1;transform:translateY(0)}.chronicle-card:active,.chronicle-card.visible:active{transform:scale(.98)}.chronicle-image-wrap{position:relative}.chronicle-image{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}.chronicle-author{position:absolute;bottom:var(--space-sm);left:var(--space-sm);display:flex;align-items:center;gap:var(--space-xs);background:#000000bf;border-radius:var(--radius-full);padding:4px 10px;cursor:pointer}.chronicle-author-name{font-weight:600;color:#fff;font-size:var(--font-size-sm)}.chronicle-author-level{color:var(--color-text-secondary);font-size:var(--font-size-xs)}.chronicle-time{position:absolute;bottom:var(--space-sm);right:var(--space-sm);background:#000000b3;border-radius:var(--radius-full);padding:3px 8px;color:#ffffffd9;font-size:var(--font-size-xs)}.chronicle-content{padding:var(--space-xs) var(--space-sm) var(--space-sm)}.chronicle-discovery{display:flex;justify-content:space-between;align-items:center}.chronicle-subject{font-weight:600;font-size:var(--font-size-sm)}.chronicle-rarity{font-weight:700;font-size:var(--font-size-sm)}.chronicle-meta{display:flex;align-items:center;gap:var(--space-xs);margin-top:2px}.chronicle-element{padding:1px 6px;border-radius:var(--radius-xs);font-size:var(--font-size-xs);font-weight:700;color:#000}.chronicle-essence{color:var(--color-accent);font-weight:600;font-size:var(--font-size-xs)}.chronicle-stats-inline{margin-left:auto;display:flex;gap:var(--space-sm);color:var(--color-text-tertiary);font-size:var(--font-size-xs)}.chronicle-like-btn{background:none;border:none;padding:4px 8px;margin:-4px -8px;color:inherit;font-size:inherit;font-family:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:var(--radius-sm);transition:background .15s ease}.chronicle-like-btn:active{background:#ffffff1a}.chronicle-like-btn.liked{color:#ff4757}.chronicle-caption{margin-top:var(--space-xs);color:var(--color-text-secondary);font-size:var(--font-size-xs);font-style:italic;line-height:1.3}.double-tap-heart{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);font-size:4rem;pointer-events:none;animation:heart-pop .8s ease-out forwards;z-index:10}@keyframes heart-pop{0%{transform:translate(-50%,-50%) scale(0);opacity:1}50%{transform:translate(-50%,-50%) scale(1.2);opacity:1}to{transform:translate(-50%,-50%) scale(1);opacity:0}}.chronicle-loading,.chronicle-error,.chronicle-empty{text-align:center;padding:var(--space-2xl);color:var(--color-text-secondary)}.chronicle-empty p:first-child{font-style:italic;margin-bottom:var(--space-sm)}.pulse-highlight{animation:pulse-scale .5s ease}@keyframes pulse-scale{0%{transform:scale(1)}50%{transform:scale(1.3);color:var(--color-warning)}to{transform:scale(1)}}.empty-hint{color:var(--color-text-muted);font-size:var(--font-size-sm);font-style:italic;text-align:center;padding:var(--space-lg)}