.battle-page{padding-block:clamp(2rem,5vw,4rem)}.battle-intro{max-width:760px;margin-bottom:2rem}.battle-intro h1,.battle-theme h2,.battle-side h3,.battle-archive h2{font-family:Barlow Condensed,sans-serif}.battle-status{margin-block:1rem}.battle-status[data-state=error]{color:#9b1c2c;font-weight:700}.battle-card{background:#fffaf2;border:1px solid #d8caba;border-left:5px solid #9b1c2c;box-shadow:0 18px 38px #3e2a1d17}.battle-theme{border-bottom:1px solid #d8caba;padding:clamp(1.25rem,3vw,2rem)}.battle-theme p{max-width:760px}.battle-grid{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.battle-side{align-content:start;gap:1rem;padding:clamp(1rem,3vw,1.75rem);display:grid}.battle-side+.battle-side{border-left:1px solid #d8caba}.battle-side[data-winner=true]{background:#f8ecdd}.battle-side__image{aspect-ratio:510/250;object-fit:cover;width:100%}.battle-side__label,.battle-side__author{color:#9b1c2c;margin:0;font-weight:700}.battle-side h3{margin:0;font-size:clamp(1.6rem,3vw,2.25rem)}.battle-side__argument{white-space:pre-line}.battle-play,.battle-vote{color:#fff;font:inherit;cursor:pointer;background:#171513;border:0;justify-self:start;padding:.8rem 1rem;font-weight:700}.battle-vote{background:#9b1c2c}.battle-vote[aria-pressed=true]{outline-offset:3px;outline:3px solid #171513}.battle-vote:disabled{cursor:default;opacity:.6}.battle-player{aspect-ratio:16/9;border:0;width:100%}.battle-score{margin:0;font-weight:700}.battle-footer{border-top:1px solid #d8caba;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem 1.5rem;padding:1rem clamp(1rem,3vw,1.75rem);display:flex}.battle-archive{margin-top:clamp(2.5rem,6vw,5rem)}.battle-archive__grid{gap:.65rem;display:grid}.battle-archive .battle-result{grid-template-columns:minmax(0,1fr) 2.5rem minmax(0,1fr);display:grid}.battle-result__header{border-bottom:1px solid var(--line);grid-column:1/-1;justify-content:space-between;align-items:baseline;gap:1rem;padding:.5rem .9rem;display:flex}.battle-result__theme{overflow-wrap:anywhere;margin:0;font-size:.85rem;font-weight:600}.battle-result__header .battle-score{flex-shrink:0;font-size:.85rem}.battle-result__side{border-left:4px solid #0000;min-width:0}.battle-result__side[data-winner=true]{border-left-color:var(--accent);background:#efe4d566}.battle-result__main{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.75rem;padding:.8rem .9rem .55rem;display:grid}.battle-result__copy{overflow-wrap:anywhere;gap:.15rem;min-width:0;display:grid}.battle-result__date{margin:0;font-size:.9rem;font-weight:700}.battle-result__song{color:var(--accent);margin:0;font-family:inherit;font-size:.85rem;font-weight:600;line-height:1.35}.battle-result__participant{flex-wrap:wrap;align-items:center;gap:.45rem;padding:0 .9rem .65rem;display:flex}.battle-result__avatar{border:2px solid var(--paper);width:30px;height:30px;box-shadow:0 0 0 1px var(--line);object-fit:cover;background:var(--accent);color:#fff;text-transform:uppercase;border-radius:50%;flex-shrink:0;place-items:center;font-size:.68rem;display:grid}.battle-result__name{overflow-wrap:anywhere;min-width:0;margin:0;font-size:.78rem;font-weight:700}.battle-result__winner{color:var(--accent);margin-left:auto;font-size:.8rem}.battle-result__vs{border-inline:1px solid var(--line);color:var(--accent);place-items:center;margin:0;font-family:Barlow Condensed,sans-serif;font-size:1rem;font-weight:700;display:grid}.battle-result__play{color:var(--accent);font:inherit;cursor:pointer;background:0 0;border:0;padding:.35rem}.battle-result__play:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.battle-result__play strong{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.battle-result__player{aspect-ratio:16/9;background:#171716;width:calc(100% - 1.8rem);margin:0 .9rem .8rem}.battle-result__unresolved{border-top:1px solid var(--line);grid-column:1/-1;margin:0;padding:.5rem .9rem;font-size:.85rem}@media (width<=620px){.battle-archive .battle-result{grid-template-columns:minmax(0,1fr)}.battle-result__vs{border-inline:0;border-block:1px solid var(--line);padding-block:.25rem}.battle-result__header{align-items:start}}@media (width<=720px){.battle-grid{grid-template-columns:1fr}.battle-side+.battle-side{border-top:1px solid #d8caba;border-left:0}}
