.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);font-family:var(--font-body);font-size:var(--font-size-md);text-decoration:none;border-radius:var(--border-radius-lg);cursor:pointer;transition:all var(--transition-fast);-webkit-tap-highlight-color:transparent}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn--primary{background:linear-gradient(135deg,var(--color-accent) 0,var(--color-primary) 100%);color:var(--bg-dark);box-shadow:0 4px 15px rgba(212,175,55,.3)}.btn--primary:hover:not(:disabled){box-shadow:0 6px 20px rgba(212,175,55,.5);transform:translateY(-2px)}.btn--secondary{background:var(--bg-card);color:var(--text-primary);border:var(--border-subtle)}.btn--secondary:hover:not(:disabled){background:var(--bg-card-hover);border-color:var(--color-primary)}.btn--ghost{background:0 0;color:var(--text-primary)}.btn--ghost:hover:not(:disabled){background:rgba(255,255,255,.1)}.btn--danger{background:var(--color-error);color:#fff}.btn--danger:hover:not(:disabled){background:#d32f2f}.btn--icon{width:48px;height:48px;padding:0;border-radius:var(--border-radius-full)}.btn--icon-sm{width:36px;height:36px;font-size:var(--font-size-sm)}.btn--icon-lg{width:64px;height:64px;font-size:var(--font-size-xl)}.btn--record{width:80px;height:80px;padding:0;border-radius:var(--border-radius-full);background:var(--color-error);color:#fff;font-size:var(--font-size-2xl);box-shadow:0 0 0 4px rgba(244,67,54,.3)}.btn--record.recording{animation:1s ease-in-out infinite recording-pulse;box-shadow:0 0 0 4px rgba(244,67,54,.3),var(--shadow-fire)}.card{background:var(--bg-card);border-radius:var(--border-radius-lg);border:var(--border-subtle);padding:var(--space-md);transition:all var(--transition-medium)}.card:hover{background:var(--bg-card-hover);box-shadow:var(--shadow-card-hover)}.card--interactive{cursor:pointer}.card--interactive:active{transform:scale(.98)}.card--glow{box-shadow:var(--shadow-glow)}.card--glow:hover{box-shadow:var(--shadow-glow-strong)}.card__header{display:flex;align-items:center;gap:var(--space-md);margin-bottom:var(--space-md)}.card__icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xl);background:rgba(196,167,125,.2);border-radius:var(--border-radius-md)}.card__title{font-family:var(--font-display);font-size:var(--font-size-lg);color:var(--text-accent)}.card__subtitle{font-size:var(--font-size-sm);color:var(--text-secondary)}.card__body{color:var(--text-primary)}.card__footer{display:flex;justify-content:space-between;align-items:center;margin-top:var(--space-md);padding-top:var(--space-md);border-top:var(--border-subtle)}.poi-card{position:relative;overflow:hidden}.poi-card__status{position:absolute;top:var(--space-sm);right:var(--space-sm);width:12px;height:12px;border-radius:var(--border-radius-full)}.poi-card__status--locked{background:var(--text-muted)}.poi-card__status--available{background:var(--color-accent);animation:2s ease-in-out infinite poi-pulse}.poi-card__status--completed{background:var(--color-success)}.poi-card__progress{height:4px;background:rgba(255,255,255,.1);border-radius:2px;margin-top:var(--space-md);overflow:hidden}.poi-card__progress-bar{height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-accent));border-radius:2px;transition:width var(--transition-slow)}.mission-card{position:relative}.mission-card__type{position:absolute;top:var(--space-sm);right:var(--space-sm);padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-xs);background:var(--color-accent);color:var(--bg-dark);border-radius:var(--border-radius-sm)}.mission-card__constraints{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin-top:var(--space-sm)}.constraint-tag{padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-xs);background:rgba(255,255,255,.1);border-radius:var(--border-radius-sm);color:var(--text-secondary)}.character-card{text-align:center;padding:var(--space-lg)}.character-card__avatar{width:100px;height:100px;margin:0 auto var(--space-md);position:relative}.character-card__silhouette{width:100%;height:100%;background:var(--char-color,var(--color-primary));mask-image:var(--mask-url);mask-size:contain;mask-repeat:no-repeat;mask-position:center;-webkit-mask-image:var(--mask-url);-webkit-mask-size:contain;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;animation:3s ease-in-out infinite silhouette-glow;--glow-color:var(--char-color, var(--color-primary))}.character-card__name{font-family:var(--font-display);font-size:var(--font-size-lg);color:var(--text-accent)}.character-card__role{font-size:var(--font-size-sm);color:var(--text-secondary);margin-top:var(--space-xs)}.character-card--locked{opacity:.5;filter:grayscale(.8)}.modal-overlay{position:fixed;inset:0;background:var(--bg-overlay);z-index:var(--z-modal-backdrop);display:flex;align-items:center;justify-content:center;padding:var(--space-md);opacity:0;visibility:hidden;transition:all var(--transition-medium)}.modal-overlay.active{opacity:1;visibility:visible}.modal{background:var(--bg-card);border-radius:var(--border-radius-xl);border:var(--border-subtle);max-width:400px;width:100%;max-height:80vh;overflow-y:auto;transform:scale(.9) translateY(20px);transition:transform var(--transition-medium)}.modal-overlay.active .modal{transform:scale(1) translateY(0)}.modal__header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-lg);border-bottom:var(--border-subtle)}.modal__title{font-family:var(--font-display);font-size:var(--font-size-xl);color:var(--text-accent)}.modal__close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:0 0;border:none;color:var(--text-secondary);cursor:pointer;border-radius:var(--border-radius-full);transition:all var(--transition-fast)}.modal__close:hover{background:rgba(255,255,255,.1);color:var(--text-primary)}.modal__body{padding:var(--space-lg)}.modal__footer{display:flex;gap:var(--space-md);padding:var(--space-lg);border-top:var(--border-subtle)}.modal__footer .btn{flex:1}.toast-container{position:fixed;top:calc(var(--safe-area-top) + var(--space-md));left:var(--space-md);right:var(--space-md);z-index:var(--z-toast);display:flex;flex-direction:column;gap:var(--space-sm);pointer-events:none}.toast{background:var(--bg-card);border-radius:var(--border-radius-lg);padding:var(--space-md);display:flex;align-items:center;gap:var(--space-md);box-shadow:var(--shadow-card);pointer-events:auto;animation:slide-down var(--transition-medium) forwards}.toast.hiding{animation:slide-up var(--transition-medium) forwards reverse}.toast__icon{font-size:var(--font-size-xl)}.toast__content{flex:1}.toast__title{font-weight:600;color:var(--text-primary)}.toast__message{font-size:var(--font-size-sm);color:var(--text-secondary)}.toast--success{border-left:4px solid var(--color-success)}.toast--warning{border-left:4px solid var(--color-warning)}.toast--error{border-left:4px solid var(--color-error)}.toast--info{border-left:4px solid var(--color-info)}.toast--achievement{border-left:4px solid var(--color-accent)}.progress-bar{height:8px;background:rgba(255,255,255,.1);border-radius:4px;overflow:hidden}.progress-bar__fill{height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-accent));border-radius:4px;transition:width var(--transition-slow)}.progress-ring{position:relative;display:inline-flex;align-items:center;justify-content:center}.progress-ring__svg{transform:rotate(-90deg)}.progress-ring__circle{fill:none;stroke:rgba(255,255,255,0.1);stroke-width:4}.progress-ring__progress{fill:none;stroke:var(--color-accent);stroke-width:4;stroke-linecap:round;transition:stroke-dashoffset var(--transition-slow)}.progress-ring__value{position:absolute;font-family:var(--font-display);font-size:var(--font-size-lg);color:var(--text-accent)}.badge{display:inline-flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-xs);font-weight:600;border-radius:var(--border-radius-full);background:var(--bg-card);border:var(--border-subtle)}.badge--primary{background:var(--color-primary);color:var(--bg-dark);border:none}.badge--accent{background:var(--color-accent);color:var(--bg-dark);border:none}.badge--success{background:var(--color-success);color:#fff;border:none}.badge--xp{background:linear-gradient(135deg,var(--color-accent),var(--color-primary));color:var(--bg-dark);border:none}.input{width:100%;padding:var(--space-md);font-family:var(--font-body);font-size:var(--font-size-md);color:var(--text-primary);background:rgba(255,255,255,.05);border:var(--border-subtle);border-radius:var(--border-radius-lg);transition:all var(--transition-fast)}.input::placeholder{color:var(--text-muted)}.input:focus{outline:0;border-color:var(--color-accent);box-shadow:0 0 0 3px rgba(212,175,55,.2)}.input--error{border-color:var(--color-error)}.input-group{display:flex;flex-direction:column;gap:var(--space-sm)}.input-label{font-size:var(--font-size-sm);color:var(--text-secondary);font-weight:600}.input-error{font-size:var(--font-size-xs);color:var(--color-error)}.speech-bubble{position:relative;background:var(--bg-card);border-radius:var(--border-radius-lg);padding:var(--space-md);margin-top:var(--space-md);border:var(--border-subtle);animation:bubble-appear var(--transition-medium) forwards}.speech-bubble::before{content:'';position:absolute;top:-8px;left:50%;transform:translateX(-50%);border:8px solid transparent;border-bottom-color:var(--bg-card)}.speech-bubble.hidden{animation:bubble-disappear var(--transition-medium) forwards}.speech-bubble__text{color:var(--text-ghost);font-style:italic;line-height:var(--line-height-relaxed)}.speech-bubble__cursor{display:inline-block;width:2px;height:1em;background:var(--text-accent);margin-left:2px;animation:.8s infinite cursor-blink}.audio-meter{display:flex;gap:3px;align-items:flex-end;height:60px}.audio-meter__bar{width:4px;background:linear-gradient(to top,var(--color-success) 0,var(--color-warning) 70%,var(--color-error) 100%);border-radius:2px;transition:height 50ms ease-out}.skeleton{background:linear-gradient(90deg,rgba(255,255,255,.05) 0,rgba(255,255,255,.1) 50%,rgba(255,255,255,.05) 100%);background-size:200% 100%;animation:1.5s infinite shimmer;border-radius:var(--border-radius-md)}.spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.1);border-top-color:var(--color-accent);border-radius:50%;animation:.8s linear infinite spinner}.loading-dots{display:flex;gap:var(--space-xs)}.loading-dots span{width:8px;height:8px;background:var(--color-accent);border-radius:50%;animation:1s ease-in-out infinite ghost-float}.loading-dots span:nth-child(2){animation-delay:.2s}.loading-dots span:nth-child(3){animation-delay:.4s}.empty-state{text-align:center;padding:var(--space-2xl)}.empty-state__icon{font-size:4rem;margin-bottom:var(--space-md);opacity:.5}.empty-state__title{font-family:var(--font-display);font-size:var(--font-size-xl);color:var(--text-primary);margin-bottom:var(--space-sm)}.empty-state__text{color:var(--text-secondary);max-width:300px;margin:0 auto}.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}.skip-link{position:absolute;top:-40px;left:0;background:var(--color-accent);color:var(--bg-dark);padding:var(--space-sm) var(--space-md);z-index:10000;text-decoration:none;font-weight:600;border-radius:0 0 var(--border-radius-md) 0;transition:top .2s}.skip-link:focus{top:0;outline:3px solid var(--text-primary);outline-offset:2px}:focus-visible{outline:3px solid var(--color-accent);outline-offset:2px}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--color-accent);outline-offset:2px}:focus:not(:focus-visible){outline:0}.lazy-loading{opacity:.5;filter:blur(5px);transition:opacity .3s,filter .3s}.lazy-loaded{opacity:1;filter:blur(0);animation:.3s ease-out lazyFadeIn}.lazy-error{opacity:.3;background:var(--bg-card)}@keyframes lazyFadeIn{from{opacity:.5;filter:blur(5px)}to{opacity:1;filter:blur(0)}}.btn,.btn-primary,button.primary{background:var(--color-primary);color:var(--bg-darker);border:none;border-radius:var(--border-radius-md);padding:14px 20px;font-family:var(--font-display);font-weight:500;font-size:var(--font-size-md);letter-spacing:.01em;box-shadow:0 1px 0 rgba(255,255,255,.15) inset,var(--shadow-card);transition:transform var(--transition-fast),box-shadow var(--transition-fast),background var(--transition-fast)}.btn-primary:hover,.btn:hover{background:var(--color-accent-2);transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn-secondary,.btn.secondary{background:0 0;color:var(--text-accent);border:1px solid var(--color-accent);border-radius:var(--border-radius-md);padding:13px 19px;font-family:var(--font-display);font-size:var(--font-size-md)}.btn-secondary:hover{background:rgba(255,200,138,.08)}.btn-ghost{background:0 0;color:var(--text-secondary);border:none;padding:10px 14px;font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase}.btn-ghost:hover{color:var(--text-accent)}.card{background:var(--bg-card);border:var(--border-subtle);border-radius:var(--border-radius-lg);padding:var(--space-lg);box-shadow:var(--shadow-card);backdrop-filter:blur(6px);position:relative}.card.card-paper{background:linear-gradient(180deg,rgba(255,246,224,.06) 0,rgba(255,246,224,.02) 100%);border:1px solid rgba(255,200,138,.18);border-top:3px solid var(--color-accent);border-radius:2px}.card-title{font-family:var(--font-display);font-size:var(--font-size-xl);line-height:var(--line-height-tight);color:var(--text-primary);margin:0 0 var(--space-sm)}.bottom-nav{position:fixed;left:0;right:0;bottom:0;height:calc(var(--nav-height) + var(--safe-area-bottom));padding-bottom:var(--safe-area-bottom);background:linear-gradient(180deg,rgba(15,6,3,.85) 0,rgba(15,6,3,.98) 100%);border-top:1px solid rgba(255,200,138,.15);backdrop-filter:blur(12px);display:grid;grid-template-columns:repeat(5,1fr);z-index:var(--z-fixed)}.bottom-nav .nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--text-muted);text-decoration:none;font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;text-transform:uppercase;transition:color var(--transition-fast)}.bottom-nav .nav-item svg{width:22px;height:22px}.bottom-nav .nav-item.active{color:var(--text-accent)}.bottom-nav .nav-item.active::before{content:"";position:absolute;top:0;width:24px;height:2px;background:var(--color-accent);border-radius:1px;box-shadow:0 0 8px var(--color-accent)}.app-header{position:sticky;top:0;height:calc(var(--header-height) + var(--safe-area-top));padding-top:var(--safe-area-top);background:linear-gradient(180deg,rgba(15,6,3,.85) 0,rgba(15,6,3,0) 100%);display:flex;align-items:center;justify-content:space-between;padding-left:var(--space-lg);padding-right:var(--space-lg);z-index:var(--z-sticky)}.app-header .app-title{font-family:var(--font-italic);font-style:italic;font-size:var(--font-size-xl);color:var(--text-primary)}.app-header .app-title .year{color:var(--text-accent);font-family:var(--font-mono);font-style:normal;font-size:11px;letter-spacing:.2em;margin-left:8px;vertical-align:middle}.app-header.hidden{display:none}.app-header__profile{width:40px;height:40px;display:grid;place-items:center;padding:0;color:var(--text-secondary);background:0 0;border:none;border-radius:var(--border-radius-full);cursor:pointer;transition:color var(--transition-fast),background var(--transition-fast)}.app-header__profile:hover{color:var(--text-accent);background:rgba(255,200,138,.08)}.app-header__icon svg{width:22px;height:22px;display:block}input[type=email],input[type=text],textarea{background:rgba(255,246,224,.04);border:1px solid rgba(255,200,138,.2);border-radius:var(--border-radius-md);color:var(--text-primary);font-family:var(--font-body);font-size:var(--font-size-md);padding:12px 14px;width:100%}input:focus,textarea:focus{outline:0;border-color:var(--color-accent);box-shadow:0 0 0 3px rgba(255,200,138,.15)}.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;background:rgba(255,200,138,.1);border:1px solid rgba(255,200,138,.2);border-radius:var(--border-radius-full);font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--text-accent)}.chip.chip-locked{color:var(--text-muted);background:0 0}.chip.chip-done{color:var(--color-success);border-color:var(--color-success)}.divider-ornament{display:flex;align-items:center;gap:12px;color:var(--text-muted);margin:var(--space-xl) 0}.divider-ornament::after,.divider-ornament::before{content:"";flex:1;border-top:1px solid rgba(255,200,138,.2)}.divider-ornament::after{border-top-style:dashed}.record-orb{width:180px;height:180px;border-radius:50%;background:radial-gradient(circle at 30% 30%,var(--color-accent) 0,var(--color-primary) 40%,var(--color-secondary) 100%);box-shadow:0 0 60px rgba(255,200,138,.35),0 0 120px rgba(217,83,79,.25),inset 0 2px 20px rgba(255,246,224,.25);display:grid;place-items:center;color:var(--bg-darker);border:none;cursor:pointer;position:relative;transition:transform var(--transition-medium)}.record-orb::before{content:"";position:absolute;inset:-16px;border-radius:50%;border:1px solid rgba(255,200,138,.25);animation:2.4s ease-in-out infinite orb-pulse}.record-orb.recording{background:radial-gradient(circle at 30% 30%,#ffb3a0 0,var(--color-fire) 45%,var(--color-secondary) 100%)}.record-orb.recording::before{animation:.9s ease-in-out infinite orb-pulse}@keyframes orb-pulse{0%,100%{transform:scale(1);opacity:.7}50%{transform:scale(1.15);opacity:0}}.waveform{display:flex;align-items:center;gap:3px;height:48px;width:100%}.waveform .bar{flex:1;background:var(--color-accent);border-radius:1px;opacity:.85;transform-origin:center;animation:1.2s ease-in-out infinite wave}@keyframes wave{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}.sheet{position:fixed;left:0;right:0;bottom:0;background:var(--bg-warm);border-top-left-radius:14px;border-top-right-radius:14px;padding:var(--space-xl) var(--space-lg) calc(var(--space-xl) + var(--safe-area-bottom));box-shadow:0 -10px 40px rgba(0,0,0,.5);z-index:var(--z-modal)}.sheet-handle{width:40px;height:4px;background:rgba(255,246,224,.25);border-radius:2px;margin:0 auto var(--space-lg)}