@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600&family=DM+Sans:wght@400;500;600&display=swap');
*{box-sizing:border-box}body{margin:0;background:#070608;color:#ede4df;font:15px/1.6 'DM Sans',sans-serif;background-image:radial-gradient(ellipse at top,#46181b33,transparent 60%)}a{color:inherit;text-decoration:none}button,select{font:inherit}button,a,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:wait;opacity:.45}header{height:100px;padding:0 4%;border-bottom:1px solid #432328;display:flex;align-items:center;gap:36px;background:#090608}header .logo img{width:230px;height:95px;object-fit:contain}nav{display:flex;gap:32px;align-items:center;font-size:13px}nav span{color:#d18075;letter-spacing:2px}.live{margin-left:auto;font-size:10px;letter-spacing:2px;color:#d9907d}.live:before{content:'●';color:#e86042;margin-right:8px}main{max-width:1700px;margin:auto;padding:34px 4%}.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:27px;gap:20px}.eyebrow{font-size:11px;letter-spacing:2px;color:#cf8a79;margin:0 0 10px}h1{font:42px/1.1 'Cormorant Garamond',Georgia,serif;margin:0}#buildSubtitle{color:#aa989d;font-size:13px;margin:9px 0 0}.outline,.primary,.skill-button{display:inline-flex;align-items:center;justify-content:center;padding:11px 17px;border:1px solid #633139;background:#180e12;color:#f1d4cc;border-radius:5px}.primary{background:linear-gradient(135deg,#993a30,#571b25);border-color:#a15344;box-shadow:0 0 22px #d63b211a}.arena-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:22px}.viewport{position:relative;min-height:610px;border:1px solid #69333a;border-radius:8px;overflow:hidden;background:#10131c;box-shadow:0 20px 70px #0007}.viewport canvas{display:block;width:100%;height:100%;touch-action:none}#scene{position:absolute;inset:0}.hud{position:absolute;top:24px;left:26px;right:26px;display:flex;justify-content:space-between;gap:24px;pointer-events:none}.hud>div{display:flex;flex-direction:column;text-shadow:0 2px 9px #000}.hud strong{font:25px 'Cormorant Garamond',serif}.hud span:not(.eyebrow){font-size:11px;color:#cbb7b5}.enemy-hud{text-align:right}.hp-line{height:4px;background:linear-gradient(90deg,#761a2c,#df6951);margin-top:9px}.scene-bottom{position:absolute;bottom:20px;left:24px;right:24px;display:flex;justify-content:space-between;gap:20px;font-size:11px;color:#9f939c;pointer-events:none}.scene-bottom span:first-child{color:#e6bca8}aside{display:flex;flex-direction:column;gap:18px}.card{background:linear-gradient(130deg,#151014,#0b090d);border:1px solid #442930;border-radius:7px;padding:22px}label{display:block;color:#cbb7b7;font-size:12px;margin:13px 0 6px}select{background:#0b080c;border:1px solid #523038;color:#ece1dc;width:100%;padding:11px 9px;border-radius:4px;min-width:0;font-size:13px}.target-card{display:flex;gap:15px;align-items:center;padding:15px 0}.target-card img{height:68px;width:68px;object-fit:contain}.target-card strong{display:block;font-size:14px}.target-card span{display:block;font-size:12px;color:#ab959a}.caption,.footnote{font-size:11px;line-height:1.7;color:#a18d94}.controls{display:flex;gap:8px;margin-top:20px}.controls .primary{flex:1}.controls button{font-size:12px}.skill-button{margin-top:10px;width:100%;border-color:#5c446a;color:#d5b8f3;background:#1a1224}.results-layout{display:grid;grid-template-columns:1.4fr 1fr;gap:22px;margin-top:22px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:19px 0}.metrics span{display:block;font-size:12px;color:#ad979c}.metrics strong{font:35px 'Cormorant Garamond',serif;color:#f1c3ae}.calculation-status{padding:12px;background:#261317;border-left:2px solid #a25142;font-size:12px;color:#d9bdb5}.footnote{margin:25px 0 0;text-align:center}#combatLog{padding:0;margin:10px 0 0;list-style:none;font-size:12px;color:#c1a9b3}#combatLog li{padding:6px 0;border-bottom:1px solid #2b1e27}#combatLog li:first-child{color:#ead4ca}.pop{position:absolute;color:#ffd3a5;font-weight:600;font-size:19px;text-shadow:0 2px 8px #000,0 0 12px #ef7234;animation:impact-rise 1.2s ease-out forwards;white-space:nowrap;pointer-events:none}.pop.skill{color:#bfe9ff;text-shadow:0 0 12px #549bff}#floating{position:absolute;inset:0;pointer-events:none}#sceneError{position:absolute;inset:35% 10%;padding:25px;background:#170d15;border:1px solid #79404b;z-index:4}footer{padding:25px 4%;border-top:1px solid #35232a;display:flex;justify-content:space-between;font-size:11px;color:#9e7d83}@keyframes impact-rise{from{opacity:1;transform:translate(-50%,0) scale(.8)}25%{transform:translate(-50%,-12px) scale(1.1)}to{opacity:0;transform:translate(-50%,-75px) scale(1)}}@media(max-width:1100px){.arena-layout{grid-template-columns:minmax(0,1fr) 270px}.viewport{min-height:590px}.hud strong{font-size:21px}}@media(max-width:760px){header{height:78px;padding:0 5%;gap:10px}header .logo img{width:155px;height:75px}nav{margin-left:auto;font-size:11px}nav span,.live{display:none}.heading{display:block}h1{font-size:32px}.heading>a{margin-top:15px;font-size:12px}.arena-layout,.results-layout{grid-template-columns:1fr}.viewport{min-height:420px}aside{display:grid;grid-template-columns:1fr 1fr;gap:12px}.card{padding:16px}.controls{flex-direction:column}.hud{left:15px;right:15px;top:17px}.hud strong{font-size:20px}.hud .eyebrow{font-size:8px}.scene-bottom span:last-child{display:none}.metrics strong{font-size:28px}.metrics span{font-size:10px}body{font-size:13px}}@media(max-width:450px){aside{grid-template-columns:1fr}.viewport{min-height:370px}.results-layout{gap:12px}.hud{gap:12px}.hud strong{font-size:18px}}@media(prefers-reduced-motion:reduce){.pop{animation:none}}

.hp-line{transform-origin:right;transition:transform .2s}.pop{font-size:clamp(18px,2vw,30px);z-index:3;animation-duration:1.5s}.pop.critical{color:#fff3a1;font-weight:800}.metrics strong{overflow-wrap:anywhere}.metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
.last-strike{position:absolute;z-index:5;bottom:1rem;left:50%;transform:translateX(-50%);background:#180e12ed;color:#ffe0ac;border-radius:5px;padding:.35em .85em;text-align:center;pointer-events:none}.last-strike:empty{display:none}#floating{z-index:4;pointer-events:none}.arena-fallback-enemy{position:absolute;right:12%;top:22%;width:32%;height:56%;object-fit:contain}.spell-choice{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.35rem}.spell-choice small{grid-column:1/-1}
.sungma-check{margin:12px 0;padding:10px 12px;border-left:2px solid #b78550;background:#211719;color:#f6dfc4}.sungma-check div{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:6px}.sungma-check span{font-size:.91em;font-variant-numeric:tabular-nums}
.hit-number{position:absolute;display:inline-flex;align-items:center;gap:.1em;white-space:nowrap;line-height:1;transform:translate(-50%,-50%);animation:arcade-hit 1.05s both;pointer-events:none;font:900 clamp(22px,3.2vw,39px)/1 Arial,Helvetica,sans-serif}
.hit-number::before{content:"";width:.83em;height:.83em;background:url("assets/impact-seal.svg") center/contain no-repeat;filter:drop-shadow(0 1px 1px #210b00)}
.hit-number b{color:#ffe52c;font-weight:900;letter-spacing:.035em;-webkit-text-stroke:2.8px #241500;paint-order:stroke fill;text-shadow:1px 2px #251300,0 3px 3px #150800;font-variant-numeric:tabular-nums}
@keyframes arcade-hit{0%{transform:translate(-50%,-38%) scale(.72);opacity:.75}12%{transform:translate(-50%,-52%) scale(1.09);opacity:1}26%,74%{transform:translate(-50%,-64%) scale(1);opacity:1}100%{transform:translate(-50%,-115%);opacity:0}}
@media(prefers-reduced-motion:reduce){.hit-number{animation:none}}
.fighter-nameplate {
 position:absolute;z-index:3;left:24%;top:47%;max-width:72%;transform:translate(-50%,-100%);pointer-events:none;
}
.fighter-nameplate[hidden]{display:none}
.fighter-nameplate,.hud #fighterName {
 display:flex;align-items:baseline;gap:.27em;white-space:nowrap;
 font:700 clamp(12px,1vw,15px)/1.3 Tahoma,Arial,sans-serif;
 -webkit-text-stroke:2px #090909;paint-order:stroke fill;text-shadow:1px 1px 0 #000;
}
.hud #fighterName{flex-wrap:wrap}
:is(.fighter-nameplate,#fighterName) span {font:inherit;flex:none}
:is(.fighter-nameplate,#fighterName) .champion-level{color:#8cc8ff}
:is(.fighter-nameplate,#fighterName) .player-rank{color:#00ccff}
:is(.fighter-nameplate,#fighterName) :is(.normal-level,.player-name){color:#ffd74c}
.fighter-nameplate .player-name{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
@media(min-width:820px){.arena-layout{align-items:start}.viewport{position:sticky;top:.6rem;min-height:0;height:clamp(460px,65vh,740px)}}
.rotation-picker{border:1px solid #6c4840;margin:.65rem 0;padding:.45rem .7rem;color:#eed5aa}.rotation-picker legend{font-weight:700;font-size:.82rem}.rotation-picker label{display:flex;align-items:center;gap:.55em;margin:.18em 0;color:#efe4d7}.rotation-picker input{width:auto}.rotation-picker[hidden]{display:none}
.scene-bottom #overview{pointer-events:auto;font-size:.75rem;padding:.42rem .65rem;background:#16191bda;color:#f2dfbc;border:1px solid #7c6b50;border-radius:.35rem;cursor:pointer}