:root{--bg:#020713;--panel:#071024e8;--line:#6930ae;--purple:#bd45ff;--cyan:#15d5ff;--text:#f4f4fa;--muted:#aaa9bd}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% 0,#12113b 0,#020713 54%);color:var(--text);font-family:"Space Grotesk",sans-serif;padding:22px}.hud-shell{max-width:1500px;margin:auto;padding:16px;border:1px solid #7026a8;border-radius:22px;background:linear-gradient(135deg,#040719ee,#030b1fdd);box-shadow:0 0 42px #771cbe55;display:grid;grid-template-columns:30% 1fr;gap:22px}.panel{border:1px solid #2e254f;border-radius:18px;background:linear-gradient(130deg,#071126f2,#030817e8);box-shadow:inset 0 0 25px #081e4a55}.portrait-panel{padding:14px;display:flex;flex-direction:column;justify-content:space-between}.portrait-ring{height:420px;position:relative;display:grid;place-items:center;overflow:hidden;border-radius:50%;border:1px solid #8f32dd;box-shadow:inset 0 0 40px #4c159c,0 0 18px #46149b}.portrait-ring:before,.portrait-ring:after{content:"";position:absolute;border:1px solid #bb4fff;border-radius:50%;inset:13px;opacity:.65}.portrait-ring:after{inset:27px;border-color:#1dd9ff55}.portrait-ring img{position:relative;width:94%;height:94%;object-fit:contain;z-index:2;filter:drop-shadow(0 18px 20px #000)}.hex-grid{position:absolute;bottom:-5%;left:0;width:100%;height:32%;background:linear-gradient(transparent,#5510ac88),linear-gradient(30deg,#7626ca44 12%,transparent 12.5%,transparent 87%,#7626ca44 87.5%),linear-gradient(150deg,#7626ca44 12%,transparent 12.5%,transparent 87%,#7626ca44 87.5%);background-size:28px 50px;z-index:1}.creature-name{font-family:Rajdhani;font-weight:700;font-size:28px;letter-spacing:1px;margin:15px 8px}.creature-name small{color:#57f8a5;font-size:12px;float:right;margin-top:10px}.status-dot{display:inline-block;background:#57f8a5;width:9px;height:9px;border-radius:50%;box-shadow:0 0 10px #57f8a5}.level-card{display:grid;grid-template-columns:1fr 2fr;margin-top:7px;padding:22px;border:1px solid #302754;border-radius:14px}.level-card span{display:block;color:var(--purple);font-family:Rajdhani;font-weight:700;font-size:18px}.level-card strong{font:52px Rajdhani}.stage{border-left:1px solid #514770;padding-left:28px}.stage-gems{display:flex;gap:14px;margin-top:15px}.stage-gems i{width:25px;height:25px;transform:rotate(45deg);border:2px solid #7c739e;background:#0a1022}.stage-gems .active{background:linear-gradient(135deg,#d671ff,#251060);box-shadow:0 0 13px #bc35ff}.dashboard{display:flex;flex-direction:column;gap:22px}.vitals{padding:28px 26px}.vital-row{display:grid;grid-template-columns:65px 175px 1fr 110px;align-items:center;min-height:96px;border-bottom:1px solid #192541;gap:12px}.vital-row:last-child{border:0}.vital-icon{font-size:40px;text-align:center;color:#ff4f83;text-shadow:0 0 15px currentColor}.vital-row:nth-child(2) .vital-icon{filter:saturate(1.4)}.vital-row b,.wallet b{font:700 27px Rajdhani;letter-spacing:.5px}.track,.mini-track{height:32px;border:1px solid #2b2948;background:#010510;border-radius:999px;overflow:hidden}.track i,.mini-track i{display:block;height:100%;border-radius:inherit;box-shadow:0 0 14px currentColor}.health{background:linear-gradient(90deg,#86dc2c,#b8ff55);color:#b8ff55}.hunger{background:linear-gradient(90deg,#ff7625,#ffd64b);color:#ffd64b}.xp{background:linear-gradient(90deg,#7d3dff,#29d7ff);color:#29d7ff}.bond{background:linear-gradient(90deg,#ff4f94,#ff88c5);color:#ff88c5}.vital-row strong{font-size:23px;text-align:right}.wallet{display:flex;align-items:center;padding:24px 70px;min-height:160px;gap:62px}.wallet>div{display:grid;grid-template-columns:90px 1fr;align-items:center;min-width:40%;column-gap:18px}.wallet b{color:var(--purple)}.wallet>div:last-child b{color:var(--cyan)}.wallet strong{font:42px Rajdhani}.wallet hr{height:90px;border:0;border-left:1px solid #362752}.crystal{font-size:70px;filter:drop-shadow(0 0 10px currentColor)}.essence{color:#9750ff}.gem{color:#18cdff}.action-grid{grid-column:1/-1;display:grid;grid-template-columns:repeat(7,1fr);gap:14px}.action-grid button{min-height:190px;border:1px solid #7433b7;border-radius:18px;background:linear-gradient(145deg,#101034,#06091c);color:#fff;font:700 22px Rajdhani;letter-spacing:.7px;cursor:pointer;transition:.2s}.action-grid button:hover{transform:translateY(-5px);border-color:#d455ff;box-shadow:0 12px 28px #7723bf66}.action-grid span{display:block;font:70px/1 sans-serif;margin-bottom:18px;color:#b152ff;text-shadow:0 0 15px #8134ee}.modal{border:1px solid #7c3bc4;border-radius:14px;background:linear-gradient(140deg,#111333,#040713);color:var(--text);box-shadow:0 0 38px #7e27bf88;min-width:340px;padding:14px 18px 22px}.modal::backdrop,.battle-modal::backdrop{background:#000b}.modal h2{text-align:center;margin:0 -18px 14px;padding:8px;color:#f3a2ff;font:700 25px Rajdhani;border-bottom:1px solid #493069}.close{position:absolute;right:10px;top:6px;border:0;background:transparent;color:#efa1ff;font-size:32px;cursor:pointer}.command-list button{width:100%;text-align:left;border:0;border-bottom:1px solid #272946;background:transparent;color:#eee;font:600 20px Rajdhani;padding:11px;cursor:pointer}.command-list button:hover{color:#4eeaff;background:#11213a}.modal-note{color:var(--muted);font-size:13px;margin-top:-6px}.stat-row{display:grid;grid-template-columns:90px 1fr 70px 42px;gap:10px;align-items:center;padding:13px 0;border-bottom:1px solid #252642;font:600 17px Rajdhani}.stat-row button{height:36px;border:1px solid #8d6c85;background:#1b1c2d;color:#fff;border-radius:7px;font-size:26px;cursor:pointer}.stat-row button:hover{border-color:#ffbf4e;color:#ffcf68}.stat-row em{font-style:normal;color:#ffe17c;text-align:right}.battle-modal{border:1px solid #6935a5;background:#02050b;color:white;padding:0;border-radius:18px;overflow:hidden;width:min(1000px,94vw)}.battle-scene{min-height:560px;background:linear-gradient(90deg,#01040baa,#0000),url("assets/wild-wolf-battle.png") center/cover;position:relative}.enemy-card{position:absolute;top:35px;right:40px;text-align:right;text-shadow:0 3px 8px #000}.enemy-card span{letter-spacing:2px;color:#88ddff;font-size:13px}.enemy-card h2{font:700 46px Rajdhani;margin:3px 0}.enemy-card p{margin:0;color:#d8e5fd}.enemy-reward{margin-top:15px;padding:9px 12px;border:1px solid #668ecc;background:#060d20c9;border-radius:8px}.battle-footer{position:absolute;bottom:0;width:100%;background:#020817df;border-top:1px solid #5b3990;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:30px;padding:17px 32px}.battle-footer div:last-child{text-align:right}.mini-track{height:13px;margin-top:7px}.battle-footer button{background:linear-gradient(#d765ff,#6721bf);border:1px solid #eca3ff;color:white;border-radius:9px;padding:10px 35px;font:bold 20px Rajdhani;cursor:pointer;box-shadow:0 0 18px #b943f8}.mini-track.enemy i{background:#ff5464}#toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(100px);padding:13px 22px;border-radius:9px;border:1px solid #4de3ff;background:#07172be8;color:#d9faff;transition:.25s;z-index:10}#toast.show{transform:translateX(-50%) translateY(0)}@media(max-width:900px){body{padding:8px}.hud-shell{grid-template-columns:1fr}.portrait-ring{height:300px;width:300px;margin:auto}.action-grid{grid-template-columns:repeat(3,1fr)}.vital-row{grid-template-columns:48px 100px 1fr 75px}.vital-row b{font-size:19px}.wallet{padding:20px;gap:18px}.wallet>div{grid-template-columns:58px 1fr}.crystal{font-size:48px}}@media(max-width:560px){.action-grid{grid-template-columns:repeat(2,1fr)}.action-grid button{min-height:130px}.vital-row{grid-template-columns:35px 72px 1fr 58px;gap:6px;min-height:66px}.vital-icon{font-size:25px}.vital-row strong{font-size:14px}.track{height:18px}.wallet{flex-direction:column;align-items:stretch}.wallet hr{width:100%;height:1px;border-left:0;border-top:1px solid #362752}.battle-scene{min-height:430px}.enemy-card{right:22px;top:25px}.battle-footer{gap:8px;padding:12px;font-size:12px}.battle-footer button{padding:8px 16px}}