@import"https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap";:root{--color-green-neon: #87B49B;--color-green-light: #A7D5BF;--color-green-mid: #557A66;--color-green-border: #4D6D5B;--color-green-border-light: #678C78;--color-green-dark: #24372E;--color-green-panel: #15221C;--color-green-deep: #101A16;--color-gold: #CDAE79;--color-gold-dark: #8E6B36;--color-red: #B36E6E;--color-red-dark: #7B4545;--color-bg: #0F1714;--color-panel: rgba(21, 34, 28, .9);--color-card: rgba(28, 45, 37, .82);--color-overlay: #182720;--color-text: #E5DED0;--color-text-secondary: #9AA99B;--color-text-muted: #6F7F72;--glow-green: 0 0 0 1px rgba(135, 180, 155, .2), 0 8px 22px rgba(0, 0, 0, .36);--glow-green-strong: 0 0 0 1px rgba(167, 213, 191, .38), 0 12px 28px rgba(0, 0, 0, .42);--glow-gold: 0 0 0 1px rgba(189, 145, 84, .24), 0 8px 22px rgba(0, 0, 0, .35);--glow-red: 0 0 0 1px rgba(199, 137, 137, .24), 0 8px 22px rgba(0, 0, 0, .35);--radius-xs: 6px;--radius-sm: 8px;--radius-md: 10px;--radius-lg: 12px;--radius-xl: 16px;--font-heading: "EB Garamond", "Crimson Text", Georgia, serif;--font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Consolas", monospace}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--color-bg) url(../bg_battle.png) center / cover no-repeat fixed!important;color:var(--color-text);min-height:100vh}#root{min-height:100vh}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--color-green-deep)}::-webkit-scrollbar-thumb{background:var(--color-green-border);border-radius:var(--radius-xs)}::-webkit-scrollbar-thumb:hover{background:var(--color-green-border-light)}::selection{background:#87b49b3d;color:var(--color-text)}.panel{background:var(--color-panel);border:1px solid var(--color-green-border);border-radius:var(--radius-lg);backdrop-filter:blur(8px)}.panel-header{font-family:var(--font-heading);text-transform:uppercase;letter-spacing:.1em;font-size:.8rem;font-weight:600;color:var(--color-green-light);border-bottom:1px solid var(--color-green-border);padding-bottom:8px;margin-bottom:12px}.glow{box-shadow:var(--glow-green)}.glow-strong{box-shadow:var(--glow-green-strong)}.glow-gold{box-shadow:var(--glow-gold)}.text-label{color:var(--color-text-secondary);font-size:.7rem;text-transform:uppercase;letter-spacing:.1em}.text-stat{color:var(--color-gold);font-family:var(--font-mono);font-weight:700}.text-damage{color:var(--color-red);font-family:var(--font-mono);font-weight:700}.text-heal{color:var(--color-green-light);font-family:var(--font-mono);font-weight:700}.hp-bar{height:6px;background:#080c0ae6;border:1px solid var(--color-green-border);border-radius:var(--radius-xs);overflow:hidden}.hp-bar-fill{height:100%;border-radius:5px;transition:width .3s ease}.hp-bar-fill--ally{background:linear-gradient(90deg,#4a7a63,#87b49b)}.hp-bar-fill--enemy{background:linear-gradient(90deg,#8d5555,#b36e6e)}.badge-magical{background:#87b49b2e;color:#c6dfd1;border:1px solid rgba(135,180,155,.42);font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;padding:2px 8px;border-radius:var(--radius-xs)}.badge-hunter{background:#bd91542e;color:var(--color-gold);border:1px solid rgba(189,145,84,.42);font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;padding:2px 8px;border-radius:var(--radius-xs)}.badge-brute{background:#b36e6e2e;color:var(--color-red);border:1px solid rgba(179,110,110,.42);font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;padding:2px 8px;border-radius:var(--radius-xs)}.arena-perspective{perspective:900px;perspective-origin:50% 35%;display:flex;justify-content:center;align-items:flex-start;padding-top:20px;width:100%;height:100%}.arena-grid-3d{transform:rotateX(10deg);transform-style:preserve-3d;filter:drop-shadow(0 20px 40px rgba(0,0,0,.6))}.arena-background{position:relative;overflow:hidden;border-radius:var(--radius-xl)}.arena-background:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.2) 0%,transparent 20%,transparent 80%,rgba(0,0,0,.35) 100%),radial-gradient(ellipse at 50% 50%,rgba(80,50,20,.15) 0%,transparent 70%);pointer-events:none;z-index:1}.hex-cell{fill:transparent;stroke:#c5d6cc33;stroke-width:2.5;transition:fill .15s ease,stroke .15s ease}.hex-cell:hover{fill:#a3c0b014;stroke:#c5d6cc52}.hex-cell--zone-player{fill:#87b49b33;stroke:#a7d5bfad;stroke-width:2.5}.hex-cell--zone-player:hover{fill:#87b49b52;stroke:#bfe1cedb}.hex-cell--zone-enemy{fill:transparent;stroke:#c5d6cc33;stroke-width:2.5}.hex-cell--zone-enemy:hover{fill:#a3c0b014;stroke:#c5d6cc52}.hex-cell--zone-neutral{fill:transparent;stroke:#c5d6cc33;stroke-width:2.5}.hex-cell--terrain-1,.hex-cell--terrain-2,.hex-cell--terrain-3,.hex-cell--terrain-4{opacity:1}.hex-cell--obstacle{fill:#00000040;stroke:#ccd6cf47;stroke-width:1.2}.hex-cell--selected{fill:#87b49b42;stroke:#d3e1d8;stroke-width:2}.hex-cell--selected-beast{fill:#0047ff7a;stroke:#3880fffa;stroke-width:2.8}.hex-cell--selected-beast:hover{fill:#0047ff94;stroke:#5c9eff}.hex-cell--move-range{fill:#68977d3d;stroke:#90c0a7d6;stroke-width:2;cursor:pointer;animation:pulse-move 1.5s ease-in-out infinite}.hex-cell--move-range:hover{fill:#7dac9261;stroke:#b1d7c1;stroke-width:2.5}.hex-cell--attack-range{fill:#c652524d;stroke:#d68080d6;stroke-width:2;cursor:pointer;animation:pulse-attack 1.5s ease-in-out infinite}.hex-cell--attack-range:hover{fill:#d45e5e66;stroke:#e4b1b1;stroke-width:2.5}@keyframes pulse-move{0%,to{fill:#68977d26}50%{fill:#7dac924d}}@keyframes pulse-attack{0%,to{fill:#bf58583d}50%{fill:#d45e5e61}}@keyframes dash-flow-move{to{stroke-dashoffset:-20}}@keyframes dash-flow-attack{to{stroke-dashoffset:-16}}@keyframes arrow-pulse-attack{0%,to{opacity:.65}50%{opacity:1}}.battle-hud-top{position:absolute;top:0;left:0;right:0;z-index:10;display:flex;justify-content:center;align-items:flex-start;pointer-events:none}.battle-hud-top>*{pointer-events:auto}.round-badge{background:#15221cbf;border:none;border-radius:0 0 10px 10px;padding:4px 24px 8px;text-align:center;box-shadow:none;pointer-events:none}.round-badge--waiting{background:#321e1ebf}.round-badge--waiting .round-badge__label{color:#dcb9b9}.round-badge--waiting .round-badge__timer{color:#ecd8d8;text-shadow:0 0 10px rgba(132,92,92,.34)}.round-badge__label{font-family:var(--font-heading);font-size:.7rem;color:#c7d9ce;text-transform:uppercase;letter-spacing:.15em}.round-badge__timer{font-family:var(--font-mono);font-size:1.8rem;font-weight:700;color:#e9e2d8;text-shadow:0 0 10px rgba(95,120,107,.25);line-height:1}.player-tag{display:flex;align-items:center;gap:8px;padding:6px 16px;border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:.8rem;font-weight:600}.player-tag--me{background:#4f766247;border:1px solid rgba(116,162,137,.48);color:#c7dfd1}.player-tag--enemy{background:#68444447;border:1px solid rgba(157,106,106,.48);color:#e1c2c2}.battle-turn-guidance{position:absolute;top:102px;left:50%;transform:translate(-50%);z-index:9;pointer-events:none;width:auto;max-width:min(92vw,640px);padding:0;border:0;background:transparent;box-shadow:none;text-align:center}.battle-turn-guidance__text{display:inline-block;font-family:var(--font-heading);font-size:1rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#d8ebe1;line-height:1.2;text-shadow:0 2px 10px rgba(0,0,0,.65)}.battle-confirm-dock{position:absolute;left:50%;bottom:18px;transform:translate(-50%);z-index:11;width:min(92vw,440px);pointer-events:none}.chakra-button.battle-confirm-btn{width:100%;min-height:68px;border-radius:16px;border:2px solid #5d816e;background-color:#1a2f26!important;background-image:linear-gradient(180deg,#244034,#1a2f26 52%,#12201a)!important;color:#e9e2d8;font-family:var(--font-heading);font-size:1.12rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;box-shadow:0 8px 24px #0000006b,inset 0 1px #ffffff0f;pointer-events:auto}.chakra-button.battle-confirm-btn:hover:not(:disabled){border-color:#a9ccb8;background-color:#20372c!important;background-image:linear-gradient(180deg,#2b4b3d,#20372c 52%,#15261e)!important}.chakra-button.battle-confirm-btn:disabled,.chakra-button.battle-confirm-btn[disabled]{opacity:.62;cursor:not-allowed}.chakra-button.battle-confirm-btn:active:not(:disabled){background-color:#14241d!important;background-image:linear-gradient(180deg,#1d342a,#14241d 52%,#0e1914)!important;box-shadow:0 6px 16px #00000073,inset 0 2px #0000002e}.chakra-button.battle-confirm-btn.battle-leave-btn{width:auto;min-width:0;min-height:32px;padding:0 14px;border-radius:8px;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;background-color:#b4505040!important;background-image:none!important;border:1px solid rgba(180,80,80,.4)!important;color:#d4a0a0!important;box-shadow:none!important;font-weight:500}.chakra-button.battle-confirm-btn.battle-leave-btn:hover:not(:disabled){background-color:#b4505066!important;background-image:none!important;border-color:#b4505099!important;color:#e8c0c0!important;box-shadow:none!important}.chakra-button.battle-confirm-btn.battle-leave-btn:active:not(:disabled){background-color:#b4505080!important;background-image:none!important;box-shadow:none!important}.battle-panel{background:linear-gradient(180deg,#1e342b,#172a22 60%,#101d18);border:2px solid #5d816e;border-radius:var(--radius-lg);box-shadow:0 8px 24px #0000006b,inset 0 1px #ffffff0f;overflow:hidden;width:100%;max-width:100%}.battle-panel--enemy{background:linear-gradient(180deg,#3b2222,#2d1919 60%,#1f1212);border-color:#8f6262}.battle-panel__header{padding:6px 14px;border-bottom:1px solid rgba(159,195,175,.24);text-align:center}.battle-panel--enemy .battle-panel__header{border-bottom-color:#b9868642}.battle-panel__title{font-family:var(--font-heading);font-size:1.1rem;color:#c7d9ce;text-transform:uppercase;letter-spacing:.15em;font-weight:700}.battle-panel--enemy .battle-panel__title{color:#d7b3b3}.battle-panel__body{padding:8px}.battle-panel--ready{border-color:#9fc5ae;box-shadow:0 8px 24px #0000006b,0 0 16px #8ab59f6b,0 0 30px #709a854d,inset 0 1px #ffffff0f;animation:ready-panel-breathe 1.5s ease-in-out infinite}.battle-panel--ready .battle-panel__header{border-bottom-color:#b6d4c575}.battle-panel--ready .battle-panel__title{color:#e3eee8}.action-buttons{position:absolute;bottom:16px;right:16px;z-index:10;display:flex;flex-direction:column;gap:8px;align-items:center}.action-btn{width:52px;height:52px;border-radius:var(--radius-sm);border:2px solid rgba(118,157,136,.5);background:linear-gradient(180deg,#293e35e6,#17251ff2);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s ease;box-shadow:0 4px 12px #0006}.action-btn:hover{border-color:#aacdbad1;box-shadow:0 0 16px #87b49b4d;transform:translateY(-2px)}.action-btn--active{border-color:#cdae79;background:linear-gradient(180deg,#554221e6,#372814f2);box-shadow:0 0 16px #bd915466}.action-btn__label{font-family:var(--font-mono);font-size:.6rem;font-weight:700;color:#d8b880;text-transform:uppercase;letter-spacing:.05em}@keyframes turn-pulse{0%,to{box-shadow:0 0 8px #87b49b38}50%{box-shadow:0 0 20px #87b49b75}}.turn-indicator-pulse{animation:turn-pulse 2s ease-in-out infinite}@keyframes beast-glow{0%,to{box-shadow:0 0 8px #87b49b33}50%{box-shadow:0 0 16px #87b49b66}}.beast-selected-glow{animation:beast-glow 1.5s ease-in-out infinite}@keyframes ready-panel-breathe{0%,to{box-shadow:0 8px 24px #0000006b,0 0 12px #8ab59f54,0 0 24px #709a853d,inset 0 1px #ffffff0f}50%{box-shadow:0 8px 24px #0000006b,0 0 24px #8ab59f94,0 0 46px #709a8566,inset 0 1px #ffffff0f}}@keyframes log-entry-appear{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.battle-log-entry-appear{animation:log-entry-appear .3s ease-out}@keyframes pending-pulse{0%,to{opacity:.3}50%{opacity:1}}.pending-dot{animation:pending-pulse 1.2s ease-in-out infinite}.beast-ko:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 45%,rgba(179,110,110,.15) 45%,rgba(179,110,110,.15) 55%,transparent 55%);pointer-events:none;border-radius:var(--radius-sm)}.team-select{position:relative;height:100vh;width:100vw;overflow:hidden;display:flex;flex-direction:column}.team-select__header{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;border-bottom:1px solid rgba(93,129,110,.2);background:#0f171499;backdrop-filter:blur(8px);z-index:5}.team-select__title{font-family:var(--font-heading);font-size:1.2rem;color:#c7d9ce;text-transform:uppercase;letter-spacing:.12em;font-weight:600}.team-select__game-id{font-family:var(--font-mono);font-size:.7rem;color:var(--color-gold);letter-spacing:.06em;opacity:.8}.team-slot{display:flex;align-items:center;gap:10px;padding:8px 12px;border:1px dashed rgba(93,129,110,.3);border-radius:var(--radius-md);background:#0000002e;cursor:pointer;transition:all .15s ease;min-height:48px}.team-slot:hover{border-color:#87b49b80;background:#87b49b0f}.team-slot--active{border:2px solid var(--color-green-neon);background:#87b49b1a;box-shadow:inset 0 0 12px #87b49b14}.team-slot--active .team-slot__number,.team-slot--active .team-slot__tier{color:var(--color-green-light)}.team-slot__number{font-family:var(--font-mono);font-size:.75rem;font-weight:700;color:var(--color-text-muted);min-width:18px}.team-slot__tier{font-family:var(--font-mono);font-size:.72rem;color:var(--color-text-muted);letter-spacing:.04em}.team-slot__selecting{margin-left:auto;font-family:var(--font-mono);font-size:.55rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--color-green-neon);padding:2px 8px;border:1px solid rgba(135,180,155,.35);border-radius:var(--radius-xs);background:#87b49b1f;animation:turn-pulse 2s ease-in-out infinite}.team-slot--filled{border:1px solid rgba(93,129,110,.45);background:linear-gradient(180deg,#1e342b80,#172a2280);cursor:default}.team-slot--filled.team-slot--active{border:2px solid var(--color-green-light)}.team-slot__remove{color:#e06060;cursor:pointer;transition:all .15s;font-size:.75rem;padding:2px 6px;font-weight:600}.team-slot__remove:hover{color:#ff7a7a;text-shadow:0 0 8px rgba(224,96,96,.4)}.team-select__timer-bar{height:3px;border-radius:3px;transition:width 1s linear}.team-select__confirm-dock{padding:12px 0 0}.team-select__filters{display:flex;gap:6px;flex-wrap:wrap;align-items:center;padding:8px 0}.coin-flip-screen{position:relative}.coin-flip-screen:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,#81a0903d,#070b09b8 65%);pointer-events:none}.coin-flip-stage{position:relative;width:280px;height:300px;display:flex;align-items:center;justify-content:center;perspective:1200px;z-index:1}.coin-flip-shadow{position:absolute;bottom:28px;width:190px;height:30px;background:radial-gradient(ellipse at center,#000000a6,#00000005 75%);filter:blur(2px);animation:coin-shadow-bounce 2.9s ease-out forwards}.coin-3d{width:190px;height:190px;position:relative;transform-style:preserve-3d;animation:coin-toss-arc 2.9s cubic-bezier(.2,.7,.25,1) forwards}.coin-face{position:absolute;inset:0;border-radius:50%;border:5px solid #B08A59;box-shadow:inset 0 0 0 2px #e9d09e4d,inset 0 8px 18px #00000047,0 10px 28px #00000073;backface-visibility:hidden;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 25%,#e7d0a0,#c5a16b 55%,#8c693a);overflow:hidden}.coin-face img{width:64%;height:64%;object-fit:contain;image-rendering:auto;filter:drop-shadow(0 2px 2px rgba(0,0,0,.35))}.coin-face--tails{transform:rotateY(180deg)}.coin-result{opacity:0;transform:translateY(10px);transition:opacity .32s ease,transform .32s ease;z-index:1}.coin-result--visible{opacity:1;transform:translateY(0)}@keyframes coin-toss-arc{0%{transform:translateY(120px) rotateX(0) rotateY(0) scale(.84)}20%{transform:translateY(-150px) rotateX(720deg) rotateY(900deg) scale(.98)}45%{transform:translateY(-80px) rotateX(1440deg) rotateY(1980deg) scale(1.02)}68%{transform:translateY(-25px) rotateX(1980deg) rotateY(2700deg) scale(1)}to{transform:translateY(0) rotateX(2160deg) rotateY(2880deg) scale(1)}}@keyframes coin-shadow-bounce{0%{transform:scale(1.1);opacity:.7}22%{transform:scale(.55);opacity:.35}55%{transform:scale(.78);opacity:.5}to{transform:scale(1);opacity:.65}}
