:root{color-scheme:dark;--ink:#e9e6d4;--muted:#b7bbaa;--bronze:#a08c59;--panel:#242b28;--ally:#64c8cc;--enemy:#f0806d;font-family:system-ui,sans-serif;color:var(--ink);font-size:14px}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#283a30}button,input,summary{font:inherit}button,input{border:1px solid #758070;color:var(--ink);background:#1b2421;border-radius:3px}button{cursor:pointer;padding:11px 16px;font-weight:600}button:hover{background:#36473f;border-color:#dfd3aa}button:active{transform:translateY(1px)}button:disabled{opacity:.5;cursor:default;transform:none}button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid #f2db96;outline-offset:3px}input{padding:10px;width:100%}label{display:block;color:var(--muted);margin:18px 0 8px}h1,h2{font-family:Georgia,serif;font-weight:normal;text-wrap:balance}h1{font-size:clamp(38px,4vw,62px);margin:12px 0 18px}h2{font-size:29px;margin:12px 0 18px}p{line-height:1.6;color:var(--muted)}kbd{font-family:inherit;font-size:11px;padding:2px 4px;border:1px solid #69746b;border-radius:2px;margin-left:5px;color:#e4dfc6}#game,#unity-canvas,#bars{position:absolute;inset:0;width:100%;height:100%}#unity-canvas{outline:none;touch-action:none}#bars{pointer-events:none;overflow:hidden}.bar{position:absolute;transform:translate(-50%,-100%);width:74px;display:flex;flex-direction:column;align-items:center}.bar .track{position:relative;height:7px;width:100%;background:#15201c;border:1px solid #0d1713;box-shadow:0 1px 2px #0007}.bar .track i{display:block;height:100%;background:var(--ally)}.bar.enemy .track i{background:var(--enemy)}.bar b{font-size:11px;color:#fff;text-shadow:0 1px 2px #000}.bar.minion{width:36px}.bar.minion b{display:none}.bar.minion .track{height:4px}.bar.tower,.bar.core{width:95px}#loading{position:absolute;inset:0;display:grid;align-content:center;justify-items:center;background:#202c26;z-index:20}#loading h1{margin:5px}#loading small{color:var(--muted);margin-top:12px}.sigil{font-size:72px;color:#c5b880}progress{width:240px;height:5px;accent-color:#b5a575}.panel{background:var(--panel);padding:34px;max-width:540px;color:var(--ink);border:1px solid var(--bronze);box-shadow:8px 14px 40px #09100c55;border-radius:4px}#entry{position:absolute;left:6vw;top:50%;transform:translateY(-50%);width:390px;padding:30px 34px}.crest{color:#c4b88c;font-size:46px;float:right}.kicker{font-size:12px;text-transform:uppercase;letter-spacing:.13em;color:#d9c796;margin:8px 0}#entry h1{font-size:48px}.lead{font-family:Georgia,serif;font-size:23px;line-height:1.3;color:var(--ink)}.intro{font-size:13px}.primary{color:#18231d;background:#cebd83;border-color:#ddcca0}.primary:hover{background:#e2d299;color:#13251b}#entry>button{width:100%;margin:14px 0}#play{display:flex;justify-content:space-between}details{padding-top:12px;border-top:1px solid #586254}summary{cursor:pointer;color:var(--muted);padding:6px 0}details button{margin-top:12px}.join{display:flex;gap:8px}.join button{margin:0}.footnote{font-size:11px;margin:20px 0 0}#entryError{color:#ffa997}#hud{pointer-events:none}#hud button{pointer-events:auto}#score{position:absolute;top:0;left:50%;transform:translateX(-50%);padding:13px 24px;background:#202b27ed;border:1px solid #8e8159;border-top:0;display:flex;gap:30px;align-items:center;border-radius:0 0 5px 5px;font-size:12px}.ally{color:var(--ally)}.enemy{color:var(--enemy)}#time{font-variant-numeric:tabular-nums;font-size:17px;min-width:40px;text-align:center;color:#f1e9d2}#topRight{position:absolute;right:20px;top:18px;display:flex;gap:8px}#matchRoom{position:absolute;left:18px;top:15px;font-size:12px;text-shadow:0 1px 3px #152117}#matchRoom button{margin-left:10px;font-size:11px;padding:5px 8px}#hint{position:absolute;left:50%;bottom:133px;transform:translateX(-50%);font-size:12px;text-shadow:0 1px 4px #000;white-space:nowrap;background:#192920c9;padding:6px 12px;border-radius:3px}#hint span{margin:0 8px;color:#a8b2a2}#heroHud{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);display:flex;gap:16px;align-items:center;background:#202b27f5;border:1px solid #94845b;padding:13px 17px;border-radius:4px;box-shadow:4px 8px 16px #0b171344;max-width:calc(100vw - 350px)}#portrait{position:relative;width:65px;height:79px;display:grid;place-items:center;background:#556055;border:1px solid #a39365;color:#ddd2a7;flex-shrink:0}#portrait>span{font-size:57px}#portrait b{position:absolute;bottom:-6px;right:-7px;background:#192b26;padding:2px 8px;border:1px solid #b7a271;color:#f5deb1}#vitals{width:220px;flex-shrink:0}.heroName{font-family:Georgia,serif;font-size:20px;margin-bottom:8px}.heroName small{font-family:system-ui,sans-serif;color:var(--muted);font-size:10px;margin-left:5px}.meter{height:18px;background:#101b16;position:relative;margin:3px 0;border:1px solid #0a1711;overflow:hidden}.meter i{position:absolute;inset:0 auto 0 0;background:#497d6c;width:100%;transform-origin:left;transition:transform .12s}.meter strong{position:absolute;inset:0;text-align:center;font-size:11px;line-height:16px;font-weight:600;text-shadow:0 1px #11271e}.meter.mana{height:12px}.meter.mana i{background:#487997}.meter.mana strong{font-size:9px;line-height:11px}.stats{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);margin-top:5px}#abilities{display:flex;gap:7px}.ability{position:relative;width:58px;height:65px;padding:5px;background:#34443b;display:flex;align-items:center;justify-content:center;font-size:29px;color:#ddc996}.ability kbd{position:absolute;left:3px;top:3px;margin:0;font-size:10px;background:#18291f}.ability .cd{position:absolute;inset:0;display:grid;place-items:center;background:#13211ce8;color:#e6e9de;font-size:21px}.ability small{position:absolute;bottom:3px;font-size:9px;color:#bbc9da}#gear{width:175px;flex-shrink:0}#shopOpen{display:flex;width:100%;justify-content:space-between;font-size:11px;padding:5px;background:transparent;border:0}#gold{color:#ead18c;font-variant-numeric:tabular-nums}#inventory{display:flex;gap:4px;margin-top:9px}.slot{width:25px;height:25px;background:#17251f;border:1px solid #75826b;text-align:center;font-size:16px;color:#dbca9b}#lane{position:absolute;left:18px;bottom:18px;width:230px;padding:9px 10px;background:#24322cf0;border:1px solid #8b855f;border-radius:3px}#lane svg{width:100%;display:block}#lane small{display:flex;justify-content:space-between;font-size:9px;color:#ccd1bb}#death{position:absolute;left:50%;top:20%;transform:translateX(-50%);text-align:center;padding:15px 25px;background:#242b28eb;border:1px solid #a38b62}#death h2{margin:0;font-size:25px}#death p{margin:8px 0}#connection{position:absolute;left:50%;top:70px;transform:translateX(-50%);padding:10px 20px;background:#542d26;color:#ffe4c1}dialog{position:fixed;width:min(540px,90vw);max-height:88vh;overflow:auto}dialog::backdrop{background:#10241cab}dialog .close{position:absolute;right:12px;top:10px;font-size:20px;padding:3px 10px}.check{display:flex;align-items:center;gap:10px}.check input{width:auto}#menu>button,#result>button{width:100%;margin-top:12px}#shopItems{display:flex;flex-direction:column;gap:12px;margin:25px 0}.shopItem{display:flex;align-items:center;gap:15px;padding-bottom:12px;border-bottom:1px solid #566350}.shopIcon{font-size:28px;color:#d4be84;width:32px;text-align:center}.shopDesc{flex:1}.shopDesc p{font-size:12px;margin:4px 0}.shopItem button{min-width:85px}dt{margin-top:12px;font-weight:600;color:#e4d2a3}dd{margin:3px 0 0;color:var(--muted);font-size:13px;line-height:1.5}#toast{position:absolute;top:90px;left:50%;transform:translateX(-50%);background:#24382eef;border:1px solid #9cab89;padding:12px 20px;pointer-events:none}#result{text-align:center}#result h1{font-size:48px}#resultText{white-space:pre-line}[hidden]{display:none!important}@media(max-width:1300px){#heroHud{max-width:none;left:auto;right:16px;transform:none;gap:10px}#lane{width:180px}#vitals{width:170px}.ability{width:49px}#portrait{width:53px}#gear{width:157px}#hint{bottom:133px;font-size:11px}}@media(max-height:740px){#entry{padding:20px 28px}#entry h1{margin:4px 0;font-size:40px}.lead{font-size:20px}.intro{font-size:12px}#entry label{margin-top:10px}#heroHud{bottom:9px}#hint{bottom:124px}}

#portraitImage{width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.1)}

.combat-number { position:absolute; left:50%; top:-22px; white-space:nowrap; font-style:normal; font-size:17px; font-weight:800; color:#ffe1a4; text-shadow:0 2px 3px #161b1c,1px 0 #161b1c,-1px 0 #161b1c; animation:combat-number .8s ease-out forwards; pointer-events:none; }
.combat-number.received { color:#ffc0a6; }
@keyframes combat-number { from { opacity:1; transform:translate(-50%,0) scale(1.1); } 65% { opacity:1; } to { opacity:0; transform:translate(-50%,-42px) scale(.95); } }
#heroHud.received-hit { animation:received-hit .22s ease-out; }
@keyframes received-hit { from { box-shadow:inset 0 0 24px #b43b2980,0 0 9px #b43b2970; } to { box-shadow:inset 0 0 24px #b43b2900,0 0 9px #b43b2900; } }
@media(prefers-reduced-motion:reduce) { .combat-number { animation:none; } #heroHud.received-hit { animation:none; } }

#chargeHud { position:absolute; bottom:172px; left:50%; transform:translateX(-50%); width:300px; padding:10px 14px; color:#f5ddb1; background:#182326eb; border:1px solid #b79d67; text-align:center; pointer-events:none; }
#chargeHud span { font-size:13px; }
#chargeHud>div { height:5px; background:#080f13; margin-top:7px; overflow:hidden; }
#chargeFill { display:block; height:100%; background:#f2c676; transform-origin:left; transition:transform .08s linear; }
.ability.charging { border-color:#f2c676; box-shadow:inset 0 0 18px #a9742950; }

/* Armory: physical item portraits, immediate purchase comparison and reasons. */
#shop{width:min(780px,94vw);max-width:780px;padding:28px 32px}
#shop>h2{margin-bottom:8px}#shop>p:not(.kicker){margin:8px 0;font-size:13px}
#shopOverview{display:flex;justify-content:space-between;gap:24px;padding:16px 0 12px;border-bottom:1px solid #586254}
#shopOverview>div{display:flex;gap:14px;align-items:baseline}#shopOverview span{color:var(--muted);font-size:12px}
#shopOverview strong{font-variant-numeric:tabular-nums;font-size:17px}#shopGold{color:#ead18c}
#shopItems{margin:8px 0 14px;gap:0}.shopItem{padding:14px 0;gap:18px;margin:0}
.shopIcon{display:block;width:88px;height:88px;flex:0 0 88px;object-fit:contain;background:#172420;border:1px solid #566350}
.shopDesc h3{margin:0 0 5px;font-family:Georgia,serif;font-size:20px;font-weight:normal;color:var(--ink)}
.shopDesc .itemPurpose{font-size:12px;color:var(--muted);margin:0 0 7px}
.shopDesc .itemGain{color:#e6d19a;font-size:13px;margin:0 0 4px}
.shopDesc .itemComparison{font-size:11px;color:#beddd2;margin:0;font-variant-numeric:tabular-nums}
.shopAction{width:154px;flex:0 0 154px;text-align:right}.shopAction .owned{display:block;color:var(--muted);font-size:11px;margin-bottom:7px}
.shopAction button{width:100%;display:flex;justify-content:space-between;gap:8px;padding:10px 12px;color:#19291f;background:#cebd83;border-color:#ddcca0}
.shopAction button:hover:not(:disabled){background:#e2d299}.shopAction button:disabled{opacity:1;color:#b7bbaa;background:#253029;border-color:#526050}
.buyReason{display:block;min-height:15px;margin-top:5px;color:#ecc6a1;font-size:11px}
#shopStatus{min-height:21px;color:var(--muted)}.slot{overflow:hidden}.slot img{display:block;width:100%;height:100%;object-fit:contain}
@media(max-width:650px){#shop{padding:22px 18px}.shopItem{gap:12px}.shopIcon{width:62px;height:72px;flex-basis:62px}.shopDesc h3{font-size:17px}.shopDesc .itemPurpose{display:none}.shopAction{width:116px;flex-basis:116px}.shopAction button{padding:9px 6px;font-size:12px}.shopDesc .itemComparison{max-width:180px}.buyReason{font-size:10px}}

@media(max-height:800px){#shop{padding:18px 26px}#shop>h2{font-size:25px;margin:8px 0}#shopOverview{padding:10px 0}.shopItem{padding:9px 0;gap:15px}.shopIcon{width:66px;height:66px;flex-basis:66px}.shopDesc h3{font-size:18px;margin-bottom:4px}.shopDesc .itemPurpose{display:none}.shopDesc .itemGain{margin-bottom:4px}#shopItems{margin:4px 0 10px}.shopAction .owned{margin-bottom:4px}.shopAction button{padding:8px 10px}.buyReason{margin-top:3px}}

/* Live personal record and final two-player comparison share the same rows. */
#statistics,#result{width:min(720px,94vw);max-width:720px;padding:26px 32px}
#statistics h2{margin-bottom:8px}#statisticsStatus{font-size:12px;margin:0 0 16px;color:var(--muted)}
.combatTable{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums;table-layout:fixed;text-align:right}
.combatTable th,.combatTable td{padding:10px 8px;border-bottom:1px solid #46564b;overflow-wrap:anywhere}
.combatTable th:first-child{width:52%;padding-left:0;text-align:left}.combatTable th:last-child,.combatTable td:last-child{padding-right:0}
.combatTable thead th{font-weight:600;padding-top:0;padding-bottom:14px}.combatTable tbody th{font-weight:400;color:#c5cbb9}
.combatTable tbody td{font-weight:600;color:var(--ink)}.combatTable tbody tr:nth-child(3) th,.combatTable tbody tr:nth-child(7) th{padding-top:16px}
.statisticsNote{font-size:11px;line-height:1.55;color:var(--muted);text-align:left;margin:16px 0 0}
#result h1{margin:5px 0 8px;font-size:40px}#resultText{font-size:13px;margin:0 0 22px}
#result[open]{display:flex;flex-direction:column;overflow:hidden}#result>*{flex-shrink:0}
#result #resultStats{flex:1 1 auto;min-height:0;padding:2px;overflow:auto;scrollbar-gutter:stable;overscroll-behavior:contain}#resultStats:focus-visible{outline:2px solid #f2db96;outline-offset:-2px}#resultStats thead th{position:sticky;top:0;background:#14282b;z-index:1}
#rematchStatus{margin:16px 0 0}
.resultActions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}.resultActions>button{width:100%;margin:0}
@media(max-height:800px){#statistics,#result{padding:20px 26px}.combatTable th,.combatTable td{padding-top:6px;padding-bottom:6px}.combatTable tbody tr:nth-child(3) th,.combatTable tbody tr:nth-child(7) th{padding-top:9px}#result h1{font-size:32px}#resultText{margin-bottom:15px}.statisticsNote{margin-top:12px}#rematchStatus{margin-top:12px}.resultActions{margin-top:10px}}
@media(max-width:650px){#statistics,#result{padding:22px 18px}.combatTable{font-size:12px}.combatTable th:first-child{width:48%}.resultActions>button{font-size:12px;padding:10px 6px}}

.bar.camp{width:104px}.bar.neutral .track>i{background:#c7a34e}.bar.camp b{color:#ead4a1;font-size:10px}

/* Death presentation is local; health and respawn time remain authoritative. */
body.hero-dead #unity-canvas{filter:grayscale(1) brightness(.58);transition:filter .3s ease}
body.hero-dead #game:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse,transparent 28%,#120b12aa 100%);z-index:1}
#death{z-index:5;top:13%;width:min(520px,70vw);padding:24px 32px 22px;border:0;border-top:1px solid #bc956d;border-bottom:1px solid #806448;background:linear-gradient(90deg,#17201d00,#111a19f5 15%,#111a19f5 85%,#17201d00);box-shadow:none;pointer-events:none}
#death .deathEyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.25em;color:#baa487;margin:0 0 9px}
#death h2{font-size:42px;text-transform:uppercase;letter-spacing:.1em;color:#e3d6c5;margin:0}
#deathCause{font-size:13px;color:#c6bbb2;min-height:21px}
.deathClock{width:82px;height:82px;margin:16px auto 10px;border-radius:50%;border:2px solid #92744e;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#101816;box-shadow:0 0 0 5px #b6965b12}
.deathClock strong{font-size:30px;font-variant-numeric:tabular-nums;color:#ebd6ae;line-height:1.1}.deathClock span{font-size:10px;color:#b3a896}
#death small{font-size:11px;color:#a8aca2}#death #respawn{color:#d7ccb6;font-size:13px}
@media(max-height:760px){#death{top:10%;padding:12px 24px}#death h2{font-size:30px}.deathClock{width:62px;height:62px;margin:8px auto}.deathClock strong{font-size:23px}}