*{box-sizing:border-box;margin:0;padding:0}body{color:#e0e0e0;background-color:#0f0f23;min-height:100vh;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}#mobile-app{flex-direction:column;min-height:100vh;padding:1rem;display:flex}:root{--surface:#161311;--surface-elevated:#1e1a17;--surface-card:#242018;--surface-overlay:#0e0b09d9;--primary:#e9c349;--primary-dim:#b8941e;--on-surface:#eae1dd;--on-primary:#3c2f00;--accent-blood:#8a1a1b;--muted:#6b5e55;--success:#4caf50;--warning:#ff9800;--danger:#c62828;--info:#5b9bd5;--hp-high:#4caf50;--hp-mid:#ff9800;--hp-low:#c62828;--element-fire:#ff5722;--element-water:#29b6f6;--element-earth:#8bc34a;--element-air:#b0bec5;--element-fire-bg:#ff572226;--element-water-bg:#29b6f626;--element-earth-bg:#8bc34a26;--element-air-bg:#b0bec526;--rarity-common:#9e9e9e;--rarity-uncommon:#66bb6a;--rarity-rare:#ab47bc;--surface-container-low:#1a1714;--surface-container-high:#2a2520;--surface-container-highest:#302a24;--primary-container:#e9c34926;--on-primary-container:#f5d76e;--tertiary:#9c8bbd;--tertiary-dim:#6b5a8a;--on-tertiary:#1c1230;--outline:#ffffff26;--outline-variant:#ffffff0f;--error-container:#c6282826;--font-display:"Newsreader", Georgia, serif;--font-body:"Manrope", system-ui, sans-serif;--font-stat:"Space Grotesk", monospace;--text-xs:.75rem;--text-sm:.875rem;--text-md:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--text-5xl:3rem;--text-7xl:4.5rem;--text-9xl:8rem;--text-display:2.25rem;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--radius-sm:4px;--radius-md:8px;--radius-lg:16px;--radius-pill:999px;--z-base:5;--z-overlay-low:60;--z-overlay:80;--z-overlay-high:150;--z-overlay-top:250;--z-debug:9999;--header-height:60px;--tab-bar-height:72px;--glow-gold:0 0 12px #e9c34966;--glow-fire:0 0 12px #ff572280;--shadow-card:0 4px 24px #00000080;--shadow-overlay:0 8px 40px #000000bf}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background-color:var(--surface);color:var(--on-surface);-webkit-font-smoothing:antialiased;min-height:100vh}h1,h2,h3,h4{font-family:var(--font-display);color:var(--primary);line-height:1.2}p{line-height:1.6}input,button,select,textarea{font-family:inherit}.btn-cta{justify-content:center;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-xl);color:var(--on-primary);font-family:var(--font-stat);font-weight:600;font-size:var(--text-md);border-radius:var(--radius-md);cursor:pointer;box-shadow:var(--glow-gold);text-transform:uppercase;letter-spacing:.05em;background:linear-gradient(170deg,#f5d76e 0%,#e9c349 50%,#b8941e 100%);border:none;transition:filter .2s,box-shadow .2s;display:inline-flex}.btn-cta:hover:not(:disabled){filter:brightness(1.1);box-shadow:0 0 20px #e9c34999}.btn-cta:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.btn-ghost{justify-content:center;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);color:var(--primary);font-family:var(--font-stat);font-weight:600;font-size:var(--text-md);border:1px solid var(--primary);border-radius:var(--radius-md);cursor:pointer;text-transform:uppercase;letter-spacing:.05em;background:0 0;transition:background .2s,box-shadow .2s;display:inline-flex}.btn-ghost:hover:not(:disabled){box-shadow:var(--glow-gold);background:#e9c3491a}.btn-ghost:disabled{opacity:.4;cursor:not-allowed}.btn-danger{padding:var(--space-sm) var(--space-lg);background:var(--danger);color:var(--on-surface);font-family:var(--font-stat);font-weight:600;font-size:var(--text-md);border-radius:var(--radius-md);cursor:pointer;border:none;justify-content:center;align-items:center;transition:filter .2s;display:inline-flex}.btn-danger:hover:not(:disabled){filter:brightness(1.15)}.btn-danger:disabled{opacity:.4;cursor:not-allowed}.btn-icon{width:40px;height:40px;color:var(--muted);border:1px solid var(--muted);border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-lg);background:0 0;justify-content:center;align-items:center;transition:color .2s,border-color .2s;display:inline-flex}.btn-icon:hover{color:var(--primary);border-color:var(--primary)}.gold-frame{position:relative}.gold-frame:before,.gold-frame:after{content:"";border-color:var(--primary);pointer-events:none;z-index:1;border-style:solid;width:96px;height:96px;position:absolute}.gold-frame:before{border-width:2px 0 0 2px;top:0;left:0}.gold-frame:after{border-width:0 2px 2px 0;bottom:0;right:0}.glass-panel{background:var(--surface-overlay);-webkit-backdrop-filter:blur(12px);border-radius:var(--radius-lg);border:1px solid #ffffff14}.card-base{background:var(--surface-elevated);border-radius:var(--radius-md);box-shadow:var(--shadow-card);padding:var(--space-md);border:1px solid #ffffff0f}.element-badge{align-items:center;gap:var(--space-xs);padding:2px var(--space-sm);border-radius:var(--radius-pill);font-family:var(--font-stat);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;font-weight:600;display:inline-flex}.element-badge.fire{color:var(--element-fire);background:var(--element-fire-bg)}.element-badge.water{color:var(--element-water);background:var(--element-water-bg)}.element-badge.earth{color:var(--element-earth);background:var(--element-earth-bg)}.element-badge.air{color:var(--element-air);background:var(--element-air-bg)}.rarity-badge{padding:2px var(--space-sm);border-radius:var(--radius-pill);font-family:var(--font-stat);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;font-weight:600;display:inline-block}.rarity-badge.common{color:var(--surface);background:var(--rarity-common)}.rarity-badge.uncommon{color:var(--surface);background:var(--rarity-uncommon)}.rarity-badge.rare{color:var(--on-surface);background:var(--rarity-rare)}.hp-bar-track{border-radius:var(--radius-pill);background:#ffffff1a;width:100%;height:6px;overflow:hidden}.hp-bar-fill{border-radius:var(--radius-pill);background:var(--hp-high);height:100%;transition:width .4s,background .4s}.hp-bar-fill.mid{background:var(--hp-mid)}.hp-bar-fill.low{background:var(--hp-low)}.avatar-circle{background:var(--surface-card);border:2px solid var(--primary);font-family:var(--font-stat);color:var(--primary);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-weight:600;display:inline-flex;position:relative}.avatar-circle.sm{width:32px;height:32px;font-size:var(--text-xs)}.avatar-circle.md{width:48px;height:48px;font-size:var(--text-sm)}.avatar-circle.lg{width:64px;height:64px;font-size:var(--text-md)}.avatar-circle.xl{width:80px;height:80px;font-size:var(--text-xl)}.avatar-img{object-fit:cover;border-radius:50%;width:100%;height:100%;display:block}.avatar-badge{background:var(--accent-gold,#ffb800);color:#1a1a1a;min-width:20px;height:20px;font-size:var(--text-xs);pointer-events:none;border-radius:10px;justify-content:center;align-items:center;padding:0 4px;font-weight:700;line-height:1;display:flex;position:absolute;top:-4px;right:-4px}.icon{letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;font-feature-settings:"liga";-webkit-font-smoothing:antialiased;vertical-align:middle;-webkit-user-select:none;user-select:none;direction:ltr;font-family:Material Symbols Outlined;font-size:1.25em;font-style:normal;font-weight:400;line-height:1;display:inline-block}.text-glow{text-shadow:0 0 12px #e9c34999,0 0 24px #e9c3494d}.text-glow-fire{text-shadow:0 0 12px #ff572299,0 0 24px #ff57224d}.gradient-text{background:linear-gradient(170deg,#f5d76e 0%,#e9c349 50%,#b8941e 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.section-label{font-family:var(--font-stat);font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600}.divider{background:var(--outline-variant);width:100%;height:1px}