@import "https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700;800&family=Inter:wght@500;700;900&display=swap";:root{--app-height:100dvh;--app-width:100vw;color:#f4ead6;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--gold:#d8b26a;--ink:#1c1510;--parchment:#d9c69b;--blood:#7d3027;--stone:#322a23;background:#120e0b;font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}html,body,#app{min-height:100%;margin:0}body{background:radial-gradient(circle at 18% 12%,#d8b26a33,#0000 25rem),radial-gradient(circle at 78% 8%,#7e382938,#0000 28rem),linear-gradient(135deg,#120e0b 0%,#21150f 48%,#171b1a 100%);overflow-x:hidden}body:before{content:"";pointer-events:none;opacity:.22;mix-blend-mode:overlay;background-image:linear-gradient(45deg,#ffffff09 25%,#0000 25%),linear-gradient(-45deg,#ffffff06 25%,#0000 25%);background-size:8px 8px;position:fixed;inset:0}button,input{font:inherit}button{cursor:pointer;border:0}.shell{width:min(1560px,100%);min-height:var(--app-height);grid-template-columns:minmax(0,1.45fr) minmax(360px,.55fr);gap:clamp(14px,2vw,24px);margin:0 auto;padding:clamp(14px,2vw,28px);display:grid}.stage-card,.panel>*{background:linear-gradient(145deg,#221b14ed,#120e0beb);border:2px solid #6b5738;box-shadow:0 26px 80px #0000007a,inset 0 0 0 1px #ffe5ab17,inset 0 18px 40px #ffd28209}.stage-card{min-height:calc(var(--app-height) - 56px);border-radius:14px;flex-direction:column;padding:clamp(14px,2vw,22px);display:flex;position:sticky;top:18px}.brand-row{border-bottom:1px solid #d8b26a57;justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px;padding-bottom:12px;display:flex}.eyebrow{text-transform:uppercase;letter-spacing:.22em;color:#c19b58;margin:0 0 4px;font-size:.78rem;font-weight:900}.eyebrow:before,.eyebrow:after{content:"◆";color:#7d3027;margin:0 .55em;font-size:.7em}.eyebrow:before{margin-left:0}h1{letter-spacing:.02em;color:#f5dfac;text-shadow:0 3px #2c170e,0 10px 30px #0000008c;margin:0;font-family:Cinzel,serif;font-size:clamp(1.9rem,3.8vw,3.65rem);line-height:.93}#canvas-wrap{touch-action:none;background:radial-gradient(circle at 50% 43%,#ff772275,#0000 10rem),radial-gradient(circle at 50% 68%,#ffce6b3d,#0000 14rem),linear-gradient(#48262285,#0c090726);border:2px solid #3f3328;border-radius:10px;flex:1;min-height:650px;position:relative;overflow:hidden}#canvas-wrap:before{content:"";pointer-events:none;z-index:2;border:1px solid #d8b26a47;position:absolute;inset:12px}#canvas-wrap:after{content:"";pointer-events:none;background:radial-gradient(#0009,#0000 68%);border-radius:50%;height:16%;position:absolute;inset:auto 9% 7%}.hint-row{color:#cdbb91;flex-wrap:wrap;justify-content:center;gap:10px;padding-top:12px;font-weight:800;display:flex}.hint-row span{text-transform:uppercase;letter-spacing:.08em;background:#0a08068c;border:1px solid #d8b26a59;border-radius:4px;padding:8px 12px;font-size:.76rem}.panel{flex-direction:column;gap:12px;padding-bottom:18px;display:flex}.panel>*{border-radius:10px;padding:16px}.primary-button,.file-button{color:#24170c;letter-spacing:.04em;text-transform:uppercase;background:linear-gradient(#e4c47b,#a8732f);border:1px solid #f2d792;border-radius:6px;justify-content:center;align-items:center;gap:8px;min-height:48px;padding:12px 16px;font-weight:950;display:inline-flex;box-shadow:0 5px #563519,0 15px 30px #00000057}.primary-button:active,.file-button:active{transform:translateY(4px);box-shadow:0 1px #563519}.hero-card{position:relative}.hero-card:before{content:"Character";color:#6f5a37;text-transform:uppercase;letter-spacing:.12em;font-family:Cinzel,serif;font-weight:800;position:absolute;top:10px;right:14px}.hero-card label{color:#c49c58;text-transform:uppercase;letter-spacing:.13em;font-size:.78rem;font-weight:900;display:block}#hero-name{color:#f7ecd6;background:#140f0b;border:1px solid #d8b26a6b;border-radius:4px;width:100%;margin-top:7px;padding:11px 12px;font-family:Cinzel,serif;font-size:1.25rem;font-weight:800;box-shadow:inset 0 1px 14px #00000052}.hero-title{color:#e0c27d;margin:10px 0 0;font-weight:900}.photo-card{grid-template-columns:1fr auto;align-items:center;gap:14px;display:grid}.photo-card strong{color:#f0d69a;font-family:Cinzel,serif}.photo-card p{color:#b9aa8b;margin:5px 0 0;font-size:.9rem}.file-button input{display:none}.selectors{grid-template-columns:1fr;gap:10px;display:grid}.selector{background:linear-gradient(#5b452b47,#0000002e);border:1px solid #d8b26a52;border-radius:8px;padding:12px}.selector-header{justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:7px;display:flex}.selector h2{text-transform:uppercase;letter-spacing:.08em;color:#d1ad68;margin:0;font-family:Cinzel,serif;font-size:.88rem}.selector .value{color:#d8b26a;text-align:center;background:#14100c;border:1px solid #d8b26a73;place-items:center;width:24px;height:24px;font-family:Cinzel,serif;font-size:.74rem;font-weight:900;display:inline-grid}.choice-row{grid-template-columns:38px 1fr 38px;gap:7px;display:grid}.choice-row button{color:#f5e6c8;background:#211811;border:1px solid #d8b26a59;border-radius:4px;font-size:1.15rem;font-weight:950}.choice-row .equip{background:linear-gradient(#5b3923b3,#1e1610d9);justify-content:center;align-items:center;gap:8px;min-height:42px;padding:5px;font-size:.88rem;display:flex}.sigil{color:#d8b26a;background:#14100c;border:1px solid #d8b26a80;place-items:center;min-width:24px;height:24px;font-family:Cinzel,serif;font-size:.78rem;display:inline-grid}.stat-card h2{color:#f0d69a;margin:0 0 10px;font-family:Cinzel,serif}.stats{gap:8px;display:grid}.stat-row{text-transform:uppercase;letter-spacing:.08em;color:#cbb990;grid-template-columns:86px 1fr 36px;align-items:center;gap:9px;font-size:.78rem;font-weight:900;display:grid}.meter{background:#110d09;border:1px solid #d8b26a47;height:12px;overflow:hidden}.meter>i{background:linear-gradient(90deg,#6f7f56,#d8b26a,#8e3b30);height:100%;display:block}@media (width<=1050px){.shell{grid-template-columns:1fr}.stage-card{min-height:68vh;position:static}.selectors{grid-template-columns:1fr 1fr}#canvas-wrap{min-height:500px}}@media (width<=620px){.selectors{grid-template-columns:1fr}.brand-row,.photo-card{flex-direction:column;grid-template-columns:1fr;align-items:stretch}.shell{padding:10px}h1{font-size:2.35rem}}@media (orientation:landscape) and (height<=860px){html,body,#app{height:var(--app-height);overflow:hidden}.shell{height:var(--app-height);grid-template-columns:minmax(0,1fr) minmax(320px,380px);gap:10px;min-height:0;padding:10px;overflow:hidden}.stage-card{height:calc(var(--app-height) - 20px);min-height:0;padding:10px;position:static}.brand-row{margin-bottom:8px;padding-bottom:8px}h1{font-size:clamp(1.55rem,3.2vw,2.4rem)}.eyebrow{margin-bottom:2px;font-size:.68rem}.primary-button,.file-button{min-height:40px;padding:9px 12px;font-size:.78rem}#canvas-wrap{flex:auto;min-height:0}.hint-row{gap:6px;padding-top:7px}.hint-row span{padding:5px 8px;font-size:.64rem}.panel{max-height:calc(var(--app-height) - 20px);overscroll-behavior:contain;-webkit-overflow-scrolling:touch;gap:8px;padding-bottom:4px;overflow-y:auto}.panel>*{padding:10px}#hero-name{padding:8px 10px;font-size:1.02rem}.hero-title,.photo-card p{font-size:.82rem}.selectors{gap:7px}.selector{padding:8px}.selector-header{margin-bottom:5px}.choice-row{grid-template-columns:32px 1fr 32px;gap:5px}.choice-row .equip{min-height:36px;font-size:.74rem}.stat-card h2{margin-bottom:7px;font-size:1rem}.stats{gap:5px}.stat-row{grid-template-columns:70px 1fr 28px;gap:6px;font-size:.68rem}}@media (orientation:landscape) and (height<=700px){.shell{grid-template-columns:minmax(0,1fr) minmax(300px,340px)}.photo-card,.hero-card:before{display:none}.selectors{grid-template-columns:1fr 1fr}.selector h2{font-size:.72rem}.sigil{min-width:20px;height:20px;font-size:.66rem}}.enter-arena{letter-spacing:.04em;justify-content:center;width:100%;margin-top:14px;font-size:.92rem}.back-to-forge{z-index:20;border:1px solid var(--gold,#d8b26a);color:var(--gold,#d8b26a);font:inherit;letter-spacing:.03em;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#120e0bd1;border-radius:12px;padding:10px 16px;font-size:.82rem;display:none;position:fixed;top:16px;left:16px}.back-to-forge:hover{background:#281e14eb}body.mode-arena .panel,body.mode-arena .brand-row,body.mode-arena .hint-row{display:none}body.mode-arena #app{padding:0}body.mode-arena .shell{height:var(--app-height,100vh);display:block}body.mode-arena .stage-card{background:#14110d;border:none;border-radius:0;height:100%;margin:0;padding:0}body.mode-arena #canvas-wrap{border-radius:0;height:100%}body.mode-arena .back-to-forge{display:block}