*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-void: #08080f;--bg-surface: #111119;--bg-surface-2: #1a1a25;--bg-surface-3: #252530;--text-primary: #e8e4dc;--text-secondary: #a09888;--text-dim: #605848;--el-fire: #E85D3A;--el-fire-dark: #8B2500;--el-fire-light: #FF9966;--el-spirit: #4A90D9;--el-spirit-dark: #1A3A6B;--el-spirit-light: #7FB8E8;--el-nature: #5BAD5B;--el-nature-dark: #1A4A1A;--el-nature-light: #8FD88F;--el-storm: #E8C83A;--el-storm-dark: #8B7500;--el-storm-light: #FFE066;--el-shadow: #9B59B6;--el-shadow-dark: #4A1A6B;--el-shadow-light: #C490D9;--el-steel: #C0C0C0;--el-steel-dark: #606060;--el-steel-light: #E8E8E8;--el-colorless: #B8926A;--el-colorless-dark: #6B5339;--el-colorless-light: #D4B896;--el-rainbow: #E8C83A;--el-rainbow-dark: #8B7500;--el-rainbow-light: #FFE066;--accent-gold: #c9a44e;--accent-gold-light: #f7e7b6;--border-subtle: rgba(255, 255, 255, .06);--border-medium: rgba(255, 255, 255, .1);--space-xs: 4px;--space-sm: 8px;--space-md: 12px;--space-lg: 16px;--space-xl: 24px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--bg-dark: var(--bg-void);--bg-panel: var(--bg-surface);--bg-card: var(--bg-surface-2);--border-glow: rgba(201, 164, 78, .25);--text-gold: var(--accent-gold-light);--text-muted: var(--text-dim);--gap-xs: var(--space-xs);--gap-sm: var(--space-sm);--gap-md: var(--space-md);--gap-lg: var(--space-lg);--gap-xl: var(--space-xl);--hp-green: #2ecc71;--hp-red: #e74c3c;--block-blue: #5dade2;--font-mono: "Courier New", monospace;--phone-width: 390px;--phone-height: 844px;--font-title: "Bangers", cursive;--font-heading: "Bree Serif", "Segoe UI", sans-serif;--font-body: "Alegreya Sans", "Segoe UI", sans-serif;--font-number: "Alegreya Sans", "Segoe UI", sans-serif;--font-size-floor: .75rem;--font-size-sm: .8rem;--font-size-md: .875rem;--overlay-light: rgba(0, 0, 0, .3);--overlay-medium: rgba(0, 0, 0, .5);--overlay-heavy: rgba(0, 0, 0, .7);--overlay-dense: rgba(0, 0, 0, .85)}html,body{height:100%;min-height:100dvh;background:var(--bg-void);color:var(--text-primary);font-family:var(--font-body);font-size:16px;line-height:1.4;-webkit-font-smoothing:antialiased;overflow:hidden;width:100%}*{scrollbar-width:none}*::-webkit-scrollbar{display:none}#root{height:100%;min-height:100dvh}#root:has(.landing){height:auto}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}img{display:block;max-width:100%}.app-frame-stage{display:flex;align-items:center;justify-content:center;height:100%;min-height:100dvh;padding:8px}.app-frame-shell{display:flex;flex-direction:column;overflow:hidden;width:var(--phone-width);height:var(--phone-height);max-height:100%;max-height:calc(100dvh - 16px);background:#000;border-radius:40px;padding:6px;box-shadow:0 0 0 2px #1a1a20,0 20px 60px #000000b3}.app-frame-screen{flex:1;background:var(--bg-void);overflow:hidden;display:flex;flex-direction:column;position:relative;min-height:0;border-radius:34px}.app-screen-loading{flex:1;min-height:0;display:grid;place-items:center;padding:var(--space-xl);background:radial-gradient(circle at top,rgba(201,164,78,.18),transparent 50%),linear-gradient(180deg,#111119fa,#08080f);color:var(--accent-gold-light);font-family:var(--font-heading);font-size:1.05rem;letter-spacing:.08em;text-transform:uppercase}@media(max-width:430px){.app-frame-stage{min-height:100dvh;padding:0}.app-frame-shell{width:100%;height:100dvh;max-height:100dvh;border-radius:0;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);box-shadow:none;background:var(--bg-void)}.app-frame-screen{border-radius:0}}.app-frame-stage--desktop{padding:0}.app-frame-shell--desktop{width:100%;max-width:1200px;height:100dvh;max-height:100dvh;border-radius:0;padding:0;box-shadow:none;background:var(--bg-void)}.app-frame-screen--desktop{border-radius:0;overflow:hidden}.app-frame-shell--desktop .app-frame-screen>*{min-height:0;max-height:100%}.app-frame-stage--reduced-motion *,.app-frame-stage--reduced-motion *:before,.app-frame-stage--reduced-motion *:after{animation-delay:0ms!important;animation-duration:1ms!important;animation-iteration-count:1!important;transition-delay:0ms!important;transition-duration:1ms!important;scroll-behavior:auto!important}.app-frame-mode-toggle{position:fixed;bottom:12px;right:12px;z-index:9999;width:40px;height:40px;border-radius:50%;border:1px solid var(--border-medium);background:var(--bg-surface);color:var(--text-secondary);font-size:1.1rem;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 12px #00000080;transition:border-color .15s,transform .1s;opacity:.7}.app-frame-mode-toggle:hover{opacity:1;border-color:var(--accent-gold)}.app-frame-mode-toggle:active{transform:scale(.92)}.app-frame-mode-toggle:focus-visible{opacity:1;border-color:var(--accent-gold-light);outline:2px solid var(--accent-gold-light);outline-offset:2px}@media(max-width:899px){.app-frame-mode-toggle{display:none}}.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}.icon-inline{width:16px;height:16px;object-fit:contain;vertical-align:middle}.icon-inline--sm{width:12px;height:12px;object-fit:contain;vertical-align:middle}.icon-inline--md{width:20px;height:20px;object-fit:contain;vertical-align:middle}.icon-inline--lg{width:24px;height:24px;object-fit:contain;vertical-align:middle}.block-icon-img{width:12px;height:12px;object-fit:contain;vertical-align:middle}.card-modifier-icon-img{width:14px;height:14px;object-fit:contain}.enemy-intent-icon{width:16px;height:16px;object-fit:contain}.reward-icon-img{width:24px;height:24px;object-fit:contain}.app-frame-shell--desktop .combat-space-floor{width:min(180vw,1600px);height:clamp(180px,36vh,360px)}.app-frame-shell--desktop .combat-battlefield{flex-direction:row;max-width:1280px;margin:0 auto;width:100%;padding:0 24px}.app-frame-shell--desktop .combat-player-area{display:flex;flex:0 0 clamp(210px,18vw,300px);gap:14px;padding:24px 18px}.app-frame-shell--desktop .combat-player-portrait{width:clamp(160px,18vw,240px);height:clamp(160px,18vw,240px)}.app-frame-shell--desktop .combat-enemies{gap:clamp(16px,2vw,28px);padding:clamp(24px,5vh,44px) clamp(32px,4vw,64px)}.app-frame-shell--desktop .enemy-card-shell{width:clamp(120px,14vw,170px)}.app-frame-shell--desktop .enemy-card{padding:14px 16px}.app-frame-shell--desktop .enemy-portrait{width:clamp(110px,12vw,150px);height:clamp(110px,12vw,150px)}.app-frame-shell--desktop .combat-space-haze{width:min(70vw,720px);height:min(38vh,320px)}.app-frame-shell--desktop .combat-space-threshold{width:min(82vw,760px);height:clamp(60px,12vh,96px)}.app-frame-shell--desktop .combat-announcement-stack{top:clamp(20px,3vh,34px);width:min(360px,calc(100% - 24px))}.app-frame-shell--desktop .combat-hand{flex-wrap:wrap;justify-content:center;overflow-x:visible;mask-image:none;-webkit-mask-image:none;padding:var(--gap-sm) var(--gap-lg);gap:var(--gap-sm)}.app-frame-shell--desktop .player-strip{padding:10px 24px;gap:16px;flex-wrap:nowrap;align-items:center}.app-frame-shell--desktop .mana-pip{width:34px;height:34px}.app-frame-shell--desktop .mana-pip-icon{width:34px;height:34px;font-size:1.1rem}.app-frame-shell--desktop .combat-powers-list{flex-wrap:wrap;overflow-x:visible;justify-content:center}.app-frame-shell--desktop .combat-bottom-bar,.app-frame-shell--desktop .combat-top-bar{padding:var(--gap-md) var(--gap-xl)}.app-frame-shell--desktop .combat-top-utility{padding:8px var(--gap-xl)}.app-frame-shell--desktop .combat-powers-bar{padding:6px var(--gap-xl)}.app-frame-shell--desktop .combat-potion-slot{width:38px;height:38px}.app-frame-shell--desktop .combat-screen{display:grid;grid-template-rows:auto auto 1fr auto auto;grid-template-columns:1fr}.app-frame-shell--desktop .battle-stage{flex:1;min-height:0;align-items:flex-end;padding-bottom:8px}.app-frame-shell--desktop .battle-stage .combat-space-floor,.app-frame-shell--desktop .combat-space-floor{width:min(200vw,2000px);height:clamp(200px,40vh,400px)}.app-frame-shell--desktop .battle-sprite--hero .battle-sprite-frame{width:200px;height:200px}.app-frame-shell--desktop .battle-sprite--hero .battle-sprite-shadow{width:180px;height:22px}.app-frame-shell--desktop .battle-sprite--enemy .battle-sprite-frame{width:150px;height:150px}.app-frame-shell--desktop .battle-sprite--enemy .battle-sprite-shadow{width:130px;height:16px}.app-frame-shell--desktop .battle-stage-hero-stats{width:200px}.app-frame-shell--desktop .battle-stage-enemy-hp{width:140px}.app-frame-shell--desktop .hand-wrap{width:100%;background:linear-gradient(180deg,#181824,#0f1018);border-radius:0}.app-frame-shell--desktop .hand-arrow{width:32px;font-size:18px}.app-frame-shell--desktop .hand{width:100%;min-width:0;box-sizing:border-box;flex-wrap:wrap;justify-content:center;overflow-x:visible;mask-image:none;-webkit-mask-image:none;padding:clamp(12px,1.4vw,16px) clamp(16px,2vw,22px);gap:clamp(10px,1.1vw,14px);min-height:clamp(220px,24vh,260px)}.app-frame-shell--desktop .cf--hand{width:clamp(170px,14vw,182px);height:clamp(238px,18vw,256px)}.app-frame-shell--desktop .cf--hand .cw{transform:translateZ(.01px) scale(.7)}.app-frame-shell--desktop .battle-stage .combat-cascade-layer{position:absolute;inset:0;pointer-events:none;z-index:10}.app-frame-shell--desktop .battle-stage .combat-announcement-stack{position:absolute;top:16px;left:50%;transform:translate(-50%);z-index:14}.app-frame-shell--desktop .map-top-bar{padding:var(--space-sm) var(--space-xl);gap:var(--space-lg)}.app-frame-shell--desktop .map-info-item{font-size:.85rem}.app-frame-shell--desktop .map-content{max-width:800px;margin:0 auto}.app-frame-shell--desktop .map-node{width:52px;height:52px}.app-frame-shell--desktop .map-node-icon{width:28px;height:28px;font-size:1.3rem}.app-frame-shell--desktop .map-node--boss{width:60px;height:60px}.app-frame-shell--desktop .map-node--boss .map-node-icon{width:36px;height:36px;font-size:1.6rem}.app-frame-shell--desktop .map-legend{gap:var(--space-md) var(--space-xl);padding:var(--space-md) var(--space-xl)}.app-frame-shell--desktop .shop-screen{padding:var(--space-xl)}.app-frame-shell--desktop .shop-tabs{max-width:600px;margin:0 auto}.app-frame-shell--desktop .shop-buy-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-md);max-width:700px}.app-frame-shell--desktop .shop-potion-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:700px}.app-frame-shell--desktop .shop-relic-grid,.app-frame-shell--desktop .shop-remove-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-sm);max-width:700px}.app-frame-shell--desktop .fusion-screen>*{max-width:800px}.app-frame-shell--desktop .fusion-card-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-sm)}.app-frame-shell--desktop .fusion-modifier-options{flex-direction:row;gap:var(--space-md)}.app-frame-shell--desktop .fusion-modifier-option{flex:1}.app-frame-shell--desktop .fusion-fuse-preview{max-width:480px}.app-frame-shell--desktop .rewards-list{max-width:500px}.app-frame-shell--desktop .rewards-card-choices{max-width:540px;gap:var(--space-md)}.app-frame-shell--desktop .rewards-card{width:140px;min-height:200px}.app-frame-shell--desktop .boss-reward-section{max-width:600px}.app-frame-shell--desktop .boss-relic-choices{flex-direction:row;gap:var(--space-md)}.app-frame-shell--desktop .boss-relic-card{flex:1}.app-frame-shell--desktop .boss-potion-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.app-frame-shell--desktop .element-select-screen{padding:0;gap:0;justify-content:stretch;overflow:hidden;position:relative;isolation:isolate}.app-frame-shell--desktop .element-select-screen:before{background:radial-gradient(ellipse 120% 80% at 50% 100%,rgba(201,164,78,.07),transparent 60%),radial-gradient(circle at 10% 20%,rgba(232,93,58,.06),transparent 40%),radial-gradient(circle at 90% 20%,rgba(74,144,217,.06),transparent 40%),radial-gradient(circle at 30% 80%,rgba(91,173,91,.04),transparent 35%),radial-gradient(circle at 70% 80%,rgba(155,89,182,.04),transparent 35%);opacity:1}.app-frame-shell--desktop .element-select-actions{position:absolute;top:20px;left:28px;right:28px;max-width:none;z-index:10}.app-frame-shell--desktop .element-select-back-btn,.app-frame-shell--desktop .element-select-quick-start-btn{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:#111119b3;border-color:#ffffff1f;font-size:.85rem;padding:8px 18px}.app-frame-shell--desktop .element-select-back-btn:hover,.app-frame-shell--desktop .element-select-quick-start-btn:hover{background:#1e1e2dd9;border-color:#ffffff38}.app-frame-shell--desktop .element-select-title{font-size:clamp(2rem,4vw,3.2rem);letter-spacing:.12em;text-transform:uppercase;color:var(--accent-gold-light);text-shadow:0 0 30px rgba(201,164,78,.5),0 0 60px rgba(201,164,78,.2),0 2px 4px rgba(0,0,0,.6);margin-top:clamp(56px,8vh,80px);padding:0 24px}.app-frame-shell--desktop .element-select-subtitle{font-size:1.1rem;max-width:600px;color:#a09888cc;letter-spacing:.06em;margin-bottom:0;padding:0 24px}.app-frame-shell--desktop .element-select-body{display:flex;flex-direction:column;align-items:center;gap:0;width:100%;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding-bottom:24px}.app-frame-shell--desktop .element-select-grid{display:flex;flex-direction:row;gap:clamp(8px,1vw,16px);width:100%;max-width:1200px;padding:clamp(16px,3vh,32px) clamp(16px,3vw,48px);justify-content:center;align-items:stretch}.app-frame-shell--desktop .element-card{flex:1;max-width:200px;min-height:clamp(260px,36vh,380px);padding:0;border-radius:14px;border-width:2px;border-style:solid;background:linear-gradient(180deg,#11111966,#111119eb 55%,#111119fa);overflow:hidden;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:0;transition:transform .35s cubic-bezier(.2,.9,.3,1),box-shadow .35s cubic-bezier(.2,.9,.3,1),border-color .25s ease,flex .4s cubic-bezier(.2,.9,.3,1);cursor:pointer}.app-frame-shell--desktop .hero-portrait-wrapper{position:absolute;inset:0;width:100%;height:100%;border-radius:0;border:none;overflow:hidden;margin:0;background:transparent;z-index:0}.app-frame-shell--desktop .hero-portrait-img{width:100%;height:100%;object-fit:cover;object-position:center 15%;transition:transform .4s cubic-bezier(.2,.9,.3,1),filter .3s ease;filter:brightness(.7) saturate(.9)}.app-frame-shell--desktop .element-card:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 0%,transparent 30%,rgba(8,8,15,.5) 55%,rgba(8,8,15,.92) 80%,rgba(8,8,15,.98) 100%);z-index:1;pointer-events:none;border-radius:12px;transition:opacity .3s ease}.app-frame-shell--desktop .element-card .element-card-name,.app-frame-shell--desktop .element-card .hero-card-title,.app-frame-shell--desktop .element-card .element-card-desc,.app-frame-shell--desktop .element-card .hero-card-wins,.app-frame-shell--desktop .element-card .hero-card-crucible,.app-frame-shell--desktop .element-card .hero-card-hit{position:relative;z-index:2}.app-frame-shell--desktop .element-card-name{font-size:clamp(.95rem,1.2vw,1.15rem);font-family:var(--font-heading);letter-spacing:.05em;text-shadow:0 2px 8px rgba(0,0,0,.8);margin-top:auto;padding-top:12px}.app-frame-shell--desktop .hero-card-title{font-size:.72rem;color:#a09888b3;text-shadow:0 1px 4px rgba(0,0,0,.6)}.app-frame-shell--desktop .hero-card-wins,.app-frame-shell--desktop .hero-card-crucible,.app-frame-shell--desktop .hero-card-hit{font-size:.6rem;margin-bottom:0;background:#00000080;border-color:#ffffff1a;backdrop-filter:blur(4px)}.app-frame-shell--desktop .element-card>*:last-child{margin-bottom:14px}.app-frame-shell--desktop .element-card:not(.element-card--locked):hover{transform:translateY(-8px) scale(1.02);z-index:5}.app-frame-shell--desktop .element-card:not(.element-card--locked):hover .hero-portrait-img{transform:scale(1.08);filter:brightness(.85) saturate(1.1)}.app-frame-shell--desktop .element-card[data-element=fire]:not(.element-card--locked):hover{box-shadow:0 8px 32px #e85d3a59,0 0 60px #e85d3a26,inset 0 0 30px #e85d3a14}.app-frame-shell--desktop .element-card[data-element=spirit]:not(.element-card--locked):hover{box-shadow:0 8px 32px #4a90d959,0 0 60px #4a90d926,inset 0 0 30px #4a90d914}.app-frame-shell--desktop .element-card[data-element=nature]:not(.element-card--locked):hover{box-shadow:0 8px 32px #5bad5b59,0 0 60px #5bad5b26,inset 0 0 30px #5bad5b14}.app-frame-shell--desktop .element-card[data-element=storm]:not(.element-card--locked):hover{box-shadow:0 8px 32px #e8c83a59,0 0 60px #e8c83a26,inset 0 0 30px #e8c83a14}.app-frame-shell--desktop .element-card[data-element=shadow]:not(.element-card--locked):hover{box-shadow:0 8px 32px #9b59b659,0 0 60px #9b59b626,inset 0 0 30px #9b59b614}.app-frame-shell--desktop .element-card[data-element=steel]:not(.element-card--locked):hover{box-shadow:0 8px 32px #c0c0c04d,0 0 60px #c0c0c01f,inset 0 0 30px #c0c0c00f}.app-frame-shell--desktop .element-card--selected{flex:1.6;max-width:280px;transform:translateY(-4px) scale(1);border-width:2px}.app-frame-shell--desktop .element-card--selected .hero-portrait-img{filter:brightness(.95) saturate(1.15);transform:scale(1.05)}.app-frame-shell--desktop .element-card--selected:before{background:linear-gradient(180deg,transparent 0%,transparent 35%,rgba(8,8,15,.4) 55%,rgba(8,8,15,.88) 78%,rgba(8,8,15,.96) 100%)}.app-frame-shell--desktop .element-card--selected .element-card-name{font-size:clamp(1.1rem,1.4vw,1.3rem)}.app-frame-shell--desktop .element-card--selected[data-element=fire]{border-color:var(--el-fire);box-shadow:0 0 20px #e85d3a73,0 0 60px #e85d3a33,0 12px 40px #00000080,inset 0 0 40px #e85d3a1a}.app-frame-shell--desktop .element-card--selected[data-element=spirit]{border-color:var(--el-spirit);box-shadow:0 0 20px #4a90d973,0 0 60px #4a90d933,0 12px 40px #00000080,inset 0 0 40px #4a90d91a}.app-frame-shell--desktop .element-card--selected[data-element=nature]{border-color:var(--el-nature);box-shadow:0 0 20px #5bad5b73,0 0 60px #5bad5b33,0 12px 40px #00000080,inset 0 0 40px #5bad5b1a}.app-frame-shell--desktop .element-card--selected[data-element=storm]{border-color:var(--el-storm);box-shadow:0 0 20px #e8c83a73,0 0 60px #e8c83a33,0 12px 40px #00000080,inset 0 0 40px #e8c83a1a}.app-frame-shell--desktop .element-card--selected[data-element=shadow]{border-color:var(--el-shadow);box-shadow:0 0 20px #9b59b673,0 0 60px #9b59b633,0 12px 40px #00000080,inset 0 0 40px #9b59b61a}.app-frame-shell--desktop .element-card--selected[data-element=steel]{border-color:var(--el-steel);box-shadow:0 0 20px #c0c0c066,0 0 60px #c0c0c026,0 12px 40px #00000080,inset 0 0 40px #c0c0c014}.app-frame-shell--desktop .element-card--locked{opacity:.5;filter:grayscale(.85) brightness(.6);cursor:not-allowed}.app-frame-shell--desktop .element-card--locked .hero-portrait-wrapper{filter:none}.app-frame-shell--desktop .element-card--locked .hero-portrait-img{filter:brightness(.35) saturate(.2)}.app-frame-shell--desktop .element-card--locked:after{content:"🔒";position:absolute;top:50%;left:50%;transform:translate(-50%,-60%);font-size:2.2rem;z-index:3;opacity:.6;filter:grayscale(1);text-shadow:0 2px 12px rgba(0,0,0,.8);pointer-events:none}.app-frame-shell--desktop .hero-detail-overlay{display:flex;position:fixed;inset:0;z-index:100;align-items:center;justify-content:center;background:#04050ad1;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);cursor:pointer;animation:hero-overlay-in .25s ease-out;overflow-y:auto;padding:24px}@keyframes hero-overlay-in{0%{opacity:0}to{opacity:1}}.app-frame-shell--desktop .hero-detail-panel{cursor:default;max-width:680px;width:calc(100% - 48px);margin:0 auto;max-height:calc(100vh - 48px);overflow-y:auto;padding:clamp(20px,2.5vh,32px) clamp(24px,3vw,40px);background:#111119d1;backdrop-filter:blur(20px) saturate(1.2);-webkit-backdrop-filter:blur(20px) saturate(1.2);border-width:1px;border-style:solid;border-radius:16px;box-shadow:0 20px 60px #00000080,inset 0 1px #ffffff0f;position:relative;animation:hero-detail-slide-in .3s cubic-bezier(.2,.9,.3,1)}@keyframes hero-detail-slide-in{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.app-frame-shell--desktop .hero-detail-panel:before{content:"";position:absolute;top:0;left:24px;right:24px;height:2px;border-radius:0 0 2px 2px;z-index:1}.app-frame-shell--desktop .hero-detail-panel[data-element=fire]:before{background:linear-gradient(90deg,transparent,var(--el-fire),transparent)}.app-frame-shell--desktop .hero-detail-panel[data-element=spirit]:before{background:linear-gradient(90deg,transparent,var(--el-spirit),transparent)}.app-frame-shell--desktop .hero-detail-panel[data-element=nature]:before{background:linear-gradient(90deg,transparent,var(--el-nature),transparent)}.app-frame-shell--desktop .hero-detail-panel[data-element=storm]:before{background:linear-gradient(90deg,transparent,var(--el-storm),transparent)}.app-frame-shell--desktop .hero-detail-panel[data-element=shadow]:before{background:linear-gradient(90deg,transparent,var(--el-shadow),transparent)}.app-frame-shell--desktop .hero-detail-panel[data-element=steel]:before{background:linear-gradient(90deg,transparent,var(--el-steel),transparent)}.app-frame-shell--desktop .hero-detail-panel[data-element=fire]{border-color:#e85d3a4d}.app-frame-shell--desktop .hero-detail-panel[data-element=spirit]{border-color:#4a90d94d}.app-frame-shell--desktop .hero-detail-panel[data-element=nature]{border-color:#5bad5b4d}.app-frame-shell--desktop .hero-detail-panel[data-element=storm]{border-color:#e8c83a4d}.app-frame-shell--desktop .hero-detail-panel[data-element=shadow]{border-color:#9b59b64d}.app-frame-shell--desktop .hero-detail-panel[data-element=steel]{border-color:#c0c0c040}.app-frame-shell--desktop .hero-detail-header{gap:var(--space-xs) var(--space-md)}.app-frame-shell--desktop .hero-detail-name{font-size:1.5rem;text-shadow:0 0 20px rgba(201,164,78,.3)}.app-frame-shell--desktop .hero-detail-title{font-size:.9rem}.app-frame-shell--desktop .hero-detail-element-subtitle{font-size:.82rem}.app-frame-shell--desktop .hero-detail-desc{font-size:.95rem;line-height:1.5}.app-frame-shell--desktop .hero-detail-progress{font-size:.75rem}.app-frame-shell--desktop .hero-detail-stats-grid{grid-template-columns:repeat(3,1fr);gap:var(--space-sm)}.app-frame-shell--desktop .hero-detail-stat{padding:8px 12px;background:#ffffff0a;border:1px solid rgba(255,255,255,.06);border-radius:var(--radius-md)}.app-frame-shell--desktop .hero-detail-stat-label{font-size:.65rem}.app-frame-shell--desktop .hero-detail-stat-value{font-size:.9rem}.app-frame-shell--desktop .hero-detail-section{padding:var(--space-md) var(--space-lg);background:#ffffff06;border-radius:var(--radius-md);border:1px solid rgba(255,255,255,.04)}.app-frame-shell--desktop .hero-detail-section-label{font-size:.7rem;letter-spacing:.1em}.app-frame-shell--desktop .hero-detail-ability-name{font-size:.95rem}.app-frame-shell--desktop .hero-detail-ability-desc,.app-frame-shell--desktop .hero-detail-rule-line{font-size:.82rem}.app-frame-shell--desktop .hero-detail-deck-entry{font-size:.78rem;padding:2px 8px}.app-frame-shell--desktop .hero-confirm-btn{align-self:center;padding:14px 48px;font-family:var(--font-heading);font-size:1.1rem;letter-spacing:.1em;text-transform:uppercase;color:#08080f;background:linear-gradient(135deg,#d4aa4f,#f7e7b6,#d4aa4f 80%,#b8923e);border:2px solid rgba(247,231,182,.4);border-radius:12px;cursor:pointer;box-shadow:0 4px 20px #c9a44e66,0 8px 40px #c9a44e26,inset 0 1px #ffffff4d;transition:transform .2s cubic-bezier(.2,.9,.3,1),box-shadow .2s ease,background .2s ease;position:relative;overflow:hidden}.app-frame-shell--desktop .hero-confirm-btn:before{content:"";position:absolute;top:-50%;left:-100%;width:60%;height:200%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent);transform:skew(-20deg);transition:left .6s ease;pointer-events:none}.app-frame-shell--desktop .hero-confirm-btn:hover:before{left:150%}.app-frame-shell--desktop .hero-confirm-btn:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 6px 28px #c9a44e8c,0 12px 48px #c9a44e33,inset 0 1px #fff6}.app-frame-shell--desktop .hero-confirm-btn:active{transform:translateY(0) scale(.98);box-shadow:0 2px 12px #c9a44e4d}.app-frame-shell--desktop .boon-choice-list{flex-direction:row;max-width:900px;gap:var(--space-lg)}.app-frame-shell--desktop .boon-card{flex:1;min-height:160px}.app-frame-shell--desktop .boon-hero-copy{max-width:600px}.app-frame-shell--desktop .boon-card-title{font-size:1.15rem}.app-frame-shell--desktop .boon-card-desc{font-size:1rem}.app-frame-shell--desktop .rest-choices{flex-direction:row;max-width:700px}.app-frame-shell--desktop .rest-choice-card{flex:1}.app-frame-shell--desktop .rest-hp-section{max-width:500px}.app-frame-shell--desktop .rest-upgrade-list,.app-frame-shell--desktop .rest-brew-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-sm)}.app-frame-shell--desktop .town-services{flex-direction:row;max-width:800px;gap:var(--space-md)}.app-frame-shell--desktop .town-service-card{flex:1}.app-frame-shell--desktop .town-hp-section{max-width:500px}.app-frame-shell--desktop .town-brew-section{max-width:600px}.app-frame-shell--desktop .event-description{max-width:500px;font-size:1rem}.app-frame-shell--desktop .event-choices,.app-frame-shell--desktop .event-outcome,.app-frame-shell--desktop .gameover-hero{max-width:500px}.app-frame-shell--desktop .gameover-stats{max-width:500px;grid-template-columns:repeat(3,1fr)}.app-frame-shell--desktop .gameover-meta-stats{max-width:600px;grid-template-columns:repeat(4,1fr)}.app-frame-shell--desktop .gameover-seed-panel,.app-frame-shell--desktop .gameover-achievement-panel,.app-frame-shell--desktop .gameover-unlock-note,.app-frame-shell--desktop .gameover-unlock-celebration{max-width:500px}.app-frame-shell--desktop .menu-buttons,.app-frame-shell--desktop .menu-utility-buttons{max-width:380px}.app-frame-shell--desktop .menu-settings-panel,.app-frame-shell--desktop .menu-header{max-width:500px}.app-frame-shell--desktop .inspect-modal{max-width:400px}.app-frame-shell--desktop .pile-viewer{max-width:500px}.app-frame-shell--desktop .codex-panel{max-width:700px;max-height:85%;border-radius:var(--radius-lg)}.app-frame-shell--desktop .pause-menu{max-width:500px}.loading-screen{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;background:var(--bg-void, #08080f);z-index:9999}.loading-title{font-family:Skranji,Bangers,cursive;font-size:clamp(2rem,6vw,3.5rem);color:var(--text-primary, #e8e4dc);letter-spacing:2px;text-shadow:0 0 20px rgba(201,164,78,.4)}.loading-bar-track{width:min(80vw,400px);height:12px;background:var(--bg-surface-2, #1a1a25);border-radius:6px;overflow:hidden;border:1px solid var(--bg-surface-3, #252530)}.loading-bar-fill{height:100%;background:linear-gradient(90deg,var(--el-fire, #E85D3A),var(--el-storm, #9b7ed4));border-radius:6px;transition:width 80ms ease-out}.loading-label{font-family:Alegreya Sans,sans-serif;font-size:.85rem;color:var(--text-secondary, #a09888);letter-spacing:1px}
