/* site.css: copied from the real site (worker/src/pages.js SITE_CSS and worker/public/index.html) */
/* ---- copied from the real site: worker/src/pages.js SITE_CSS and worker/public/index.html ---- */
:root { --bg:#0a0a0c; --bg2:#0f0e12; --panel:#131217; --panel2:#1a1920; --line:#25222b; --line2:#36323d;
        --text:#f2ede3; --muted:#a39c90; --dim:#6f695f; --gold:#d9b26a; --gold2:#ecd6a4; --ivory:#f2ede3;
        --serif:'Cormorant Garamond', Georgia, 'Times New Roman', serif; --sans:Inter, 'Segoe UI', system-ui, sans-serif;
        --mono:'JetBrains Mono', ui-monospace, Consolas, monospace;
        --common:#b9b1a3; --rare:#3b82f6; --epic:#a855f7; --legendary:#f59e0b; --mythic:#e879f9; }
* { box-sizing:border-box; }
* { font-feature-settings:"lnum" 1 !important; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; min-height:100vh; overflow-x:hidden; color:var(--text); background:var(--bg); font:15px/1.65 var(--sans); }
a { color:var(--gold2); text-underline-offset:3px; }
:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
[hidden] { display:none !important; }
.wrap { max-width:1180px; margin:0 auto; padding:0 24px; }
.site-nav { position:sticky; top:0; z-index:20; background:#0a0a0cf2; border-bottom:1px solid #ffffff12; }
.site-nav .wrap { display:flex; align-items:center; gap:32px; min-height:68px; }
.brand { display:inline-flex; align-items:center; gap:11px; color:var(--text); font:700 23px/1 var(--serif); letter-spacing:.03em; text-decoration:none; white-space:nowrap; }
.brand i { width:9px; height:9px; flex:none; background:var(--gold); transform:rotate(45deg); }
.site-nav .brand { margin-right:auto; }
.site-nav nav { display:flex; gap:30px; }
.site-nav nav a { padding:6px 0; border-bottom:1px solid transparent; color:var(--muted); font-size:14px; text-decoration:none; white-space:nowrap; }
.site-nav nav a:hover { color:var(--text); }
.site-nav .lang { color:var(--muted); font-size:13px; text-decoration:none; white-space:nowrap; border:1px solid #ffffff24; border-radius:999px; padding:3px 10px; }
.site-nav .more { position:relative; }
.site-nav .more > button { padding:6px 0; border:0; border-bottom:1px solid transparent; background:none; color:var(--muted); font:inherit; font-size:14px; cursor:pointer; white-space:nowrap; }
.site-nav .more > button::after { content:"▾"; margin-left:5px; font-size:11px; }
.site-nav .more:hover > button, .site-nav .more:focus-within > button { color:var(--text); }
.site-nav .more-menu { display:none; position:absolute; top:100%; right:-14px; min-width:170px; padding:8px 0; background:#131217; border:1px solid var(--line2); border-radius:4px; box-shadow:0 14px 34px #000a; z-index:30; }
.site-nav .more:hover .more-menu, .site-nav .more:focus-within .more-menu { display:block; }
.site-nav .more-menu a { display:block; padding:8px 16px; border:0; }
.site-nav .burger { display:none; padding:0; border:0; }
.site-nav .burger summary { display:grid; place-items:center; justify-content:center; gap:0; width:40px; height:38px; padding:0; border:1px solid #ffffff24; border-radius:2px; font-size:0; list-style:none; cursor:pointer; }
.site-nav .burger summary::-webkit-details-marker { display:none; }
.site-nav .burger summary i, .site-nav .burger summary i::before, .site-nav .burger summary i::after { display:block; width:18px; height:2px; background:var(--text); border-radius:1px; }
.site-nav .burger summary i { position:relative; }
.site-nav .burger summary i::before, .site-nav .burger summary i::after { content:""; position:absolute; left:0; }
.site-nav .burger summary i::before { top:-6px; }
.site-nav .burger summary i::after { top:6px; }
.site-nav .burger[open] summary i { background:transparent; }
.site-nav .burger[open] summary i::before { top:0; transform:rotate(45deg); }
.site-nav .burger[open] summary i::after { top:0; transform:rotate(-45deg); }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:46px; padding:0 22px; border:1px solid transparent; border-radius:2px; font:600 14px/1.2 var(--sans); letter-spacing:.02em; text-decoration:none; white-space:nowrap; cursor:pointer; }
.btn.gold { color:#16130f; background:var(--ivory); }
.btn.gold:hover { background:#fff; }
.btn.ghost { color:var(--text); background:transparent; border-color:#4a453e; }
.btn.ghost:hover { border-color:var(--muted); }
.btn.sm { min-height:38px; padding:0 16px; font-size:13px; }
.kicker { font-size:12px; font-weight:600; letter-spacing:.24em; text-transform:uppercase; color:var(--gold); }
.thumb { display:block; flex:none; width:40px; aspect-ratio:2 / 3; object-fit:cover; border-radius:3px; background:var(--bg2); box-shadow:0 0 0 1px var(--rc, var(--line2)); }
.site-foot { padding:40px 0 52px; border-top:1px solid var(--line); color:var(--muted); font-size:14px; }
.site-foot .wrap { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto; gap:28px; align-items:start; }
.site-foot .brand { font-size:20px; }
.site-foot p { margin:12px 0 0; max-width:400px; }
.site-foot nav { display:flex; flex-wrap:wrap; gap:8px 22px; }
.site-foot nav a { color:var(--muted); text-decoration:none; }
.site-foot nav a:hover { color:var(--text); }
.site-foot nav.project { grid-column:1 / -1; padding-top:18px; border-top:1px solid var(--line); font-size:13px; }

html { scroll-behavior:smooth; }
section { padding:112px 0; scroll-margin-top:68px; }
h2 { margin:14px 0 0; font:600 clamp(38px,4.8vw,60px)/1 var(--serif); letter-spacing:-.005em; }
h1 em, h2 em, h3 em { font-style:italic; font-weight:500; color:var(--gold2); }
.sub { max-width:540px; margin:20px 0 0; color:var(--muted); font-size:16px; }
.head { display:flex; align-items:flex-end; justify-content:space-between; gap:48px; margin-bottom:46px; }
.head .sub { max-width:390px; margin:0; }

.arena { background:var(--bg2); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.arena-in { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:64px; align-items:center; }
.moves { margin:32px 0 0; padding:0; list-style:none; border-top:1px solid var(--line); }
.moves li { display:grid; grid-template-columns:80px minmax(0,1fr); gap:14px; padding:10px 0; border-bottom:1px solid var(--line); color:var(--muted); font-size:14px; }
.moves b { font:500 12px/1.9 var(--mono); letter-spacing:.08em; text-transform:uppercase; color:var(--m); }
.console { min-width:0; overflow:hidden; background:#0c0b0f; border:1px solid var(--line); border-radius:6px; font-family:var(--mono); }
.c-bar { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:11px 16px; border-bottom:1px solid var(--line); color:var(--muted); font-size:12px; }
.c-bar span:first-child { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.c-tag { flex:none; padding:1px 7px; color:#16130f; background:var(--gold2); border-radius:2px; font:500 11px/1.5 var(--mono); letter-spacing:.06em; }
.c-fighters { display:grid; gap:12px; padding:16px; border-bottom:1px solid var(--line); }
.c-f { display:grid; grid-template-columns:34px minmax(0,1fr) 96px; gap:12px; align-items:center; font-size:12px; }
.c-f .thumb { width:34px; }
.c-f a { display:block; overflow:hidden; color:var(--c, var(--text)); font:600 14px/1.3 var(--sans); text-decoration:none; text-overflow:ellipsis; white-space:nowrap; }
.c-f small { display:block; overflow:hidden; color:var(--muted); text-overflow:ellipsis; white-space:nowrap; }
.c-hp { display:grid; gap:5px; color:var(--muted); text-align:right; font-variant-numeric:tabular-nums; }
.c-hp i { position:relative; display:block; height:4px; background:#1f1d24; }
.c-hp i::after { content:""; position:absolute; inset:0 auto 0 0; width:var(--w,100%); background:var(--hc,#4ade80); transition:width .5s; }
.c-log { display:flex; flex-direction:column; justify-content:flex-end; height:316px; margin:0; padding:12px 16px; overflow:hidden; list-style:none; color:#cfc8bb; font-size:12.5px; line-height:1.95; -webkit-mask-image:linear-gradient(180deg, #0000 0, #000 56px); mask-image:linear-gradient(180deg, #0000 0, #000 56px); }
.c-log li { display:grid; flex:none; grid-template-columns:34px minmax(0,1fr) 64px minmax(0,1.3fr); gap:10px; white-space:nowrap; }
.c-log li > span { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.c-log .rn { color:#8a8494; }
.c-log .rn.sd { color:#fca5a5; }
.c-log .who0 { color:var(--c0); }
.c-log .who1 { color:var(--c1); }
.c-log .mv { font-weight:500; }
.c-log .hit { color:#f2ede3; }
.c-log .dim { color:#948d81; }
.c-log li.end { display:block; margin-top:6px; color:var(--gold2); white-space:normal; }
.c-foot { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:11px 16px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }
.c-foot span { min-width:0; }
.c-foot a { flex:none; color:var(--text); text-decoration:none; border-bottom:1px solid var(--gold); white-space:nowrap; }
.c-foot button { flex:none; margin-left:auto; padding:3px 10px; color:var(--muted); background:transparent; border:1px solid var(--line2); border-radius:2px; font:12px var(--mono); cursor:pointer; }
.c-foot button:hover { color:var(--text); border-color:var(--muted); }
.panels { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.panel { position:relative; display:block; height:540px; overflow:hidden; border-radius:4px; background:#141217; color:var(--text); text-decoration:none; }
.panel img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 22%; }
.panel::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, #0a0a0c00 34%, #0a0a0cd4 68%, #0a0a0c 100%); }
.panel .in { position:absolute; left:22px; right:22px; bottom:22px; z-index:1; }
.panel .no, .panel h4 { text-shadow:0 1px 10px #000d; }
.panel .no { font-size:11px; font-weight:600; letter-spacing:.24em; text-transform:uppercase; color:var(--gold); }
.panel h4 { margin:8px 0 12px; font:600 40px/1 var(--serif); }
.panel ul { margin:0 0 18px; padding:0; list-style:none; color:#d8d2c6; font-size:14px; }
.panel li { margin-bottom:3px; }
.board-head { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); color:var(--muted); font-size:12px; }
.board-head b { color:var(--text); font-weight:600; font-size:14px; }
.board ol { margin:0; padding:0; list-style:none; }
.board li { display:grid; grid-template-columns:34px minmax(0,1fr) auto; gap:14px; align-items:center; padding:12px 0; border-bottom:1px solid var(--line); }
.board .thumb { width:34px; }
.board .who { min-width:0; }
.board .who b { display:block; overflow:hidden; color:var(--text); font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.board .who small { display:block; overflow:hidden; color:var(--muted); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.board .rt { text-align:right; }
.board .rt b { display:block; font:600 20px/1.2 var(--serif); font-variant-numeric:tabular-nums; white-space:nowrap; }
.board .rt small { display:block; color:var(--muted); font-size:12px; white-space:nowrap; }
.how { padding:84px 0; }
.trio { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:34px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.t { min-width:0; padding:22px 24px 24px 0; }
.t + .t { padding-left:24px; border-left:1px solid var(--line); }
.t em { font-style:normal; font:500 12px var(--mono); color:var(--gold); }
.t b { display:block; margin:6px 0 6px; font:600 28px/1.1 var(--serif); }
.t span { color:var(--muted); font-size:14px; }