:root{--accent:#a99bff;--accent-deep:#6f5fd6;--accent-ink:#100c2a;--tile-face:#212534;--tile-ink:#cbd2e2;--board-bg:#10121b;--board-line:#323647}
body{background:radial-gradient(ellipse at 8% 0%,#201c36 0,transparent 42%),var(--bg)}
button,select,input{font:inherit}button,select{cursor:pointer}button,a,input,select,summary{touch-action:manipulation}button:disabled{opacity:.4;cursor:not-allowed}a{color:inherit;text-decoration:none}button{color:var(--text);border:0}h4{font-weight:550;margin-bottom:var(--s3)}p{color:var(--muted)}[hidden]{display:none!important}
.jv-title{font-weight:700}.jv-status strong{color:var(--accent)}.jv-sheet-item{font-weight:600}
.intro{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s5);padding:var(--s3) 0 var(--s2)}
.intro>*{min-width:0}
.eyebrow{font:var(--fs-xs)/1.5 var(--mono);letter-spacing:.12em;color:var(--muted);display:flex;align-items:center;gap:var(--s2)}
.tiny-line{width:1.5rem;height:1px;background:var(--subtle);display:inline-block}
.intro p{font-size:var(--fs-sm)}
.hero-tagline{font-size:var(--fs-xs);letter-spacing:var(--track-caps);color:var(--subtle);margin-top:var(--s2)}
.match-controls{display:flex;gap:var(--s3);align-items:end;flex-wrap:wrap}
.select-label{display:flex;min-width:0;flex-direction:column;gap:var(--s1);color:var(--muted);font:var(--fs-xs)/1.4 var(--mono);letter-spacing:.1em}
.select-label select{font:var(--fs-sm)/1.4 var(--font);letter-spacing:0}
select{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);color:var(--text);padding:0 var(--s5) 0 var(--s3);min-height:var(--tap);max-width:min(15rem,100%)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);background:var(--raised);border:1px solid var(--line);border-radius:var(--radius-sm);min-height:var(--tap);padding:0 var(--s4);font-size:var(--fs-sm);font-weight:550;transition:background .15s,transform .15s}
@media(hover:hover){.button:hover:not(:disabled){background:#2c3145}.button.primary:hover:not(:disabled){background:#d7cbff}.jv-link-btn:hover{color:var(--text)}.direction:hover{color:var(--accent);border-color:var(--accent)}}
.button:active:not(:disabled){transform:translateY(1px);background:#2c3145}
.button.primary{background:var(--accent);color:var(--accent-ink);border-color:transparent;font-weight:750}
.button.primary span{padding-left:var(--s4);font-size:var(--fs-lg)}
.button.quiet{background:transparent;font-size:var(--fs-xs)}
.button.small{font-size:var(--fs-xs);padding:0 var(--s3);min-height:var(--tap)}.jv-link-btn span{margin-left:var(--s2);display:inline-grid;place-items:center;border:1px solid var(--subtle);border-radius:50%;width:1rem;height:1rem;font:var(--fs-xs) var(--mono)}
.match-strip{display:flex;justify-content:space-between;gap:var(--s2);align-items:center}
.pills{display:flex;gap:var(--s2);flex-wrap:wrap}
.pill{font:var(--fs-xs)/1.3 var(--mono);letter-spacing:.08em;color:var(--accent);padding:var(--s1) var(--s2);border:1px solid #51466d;border-radius:var(--radius-sm);background:#a99bff10}
.pill.subdued{color:var(--muted);border-color:var(--line);background:transparent}
.pill.verified{color:var(--jev);border-color:#306456}
.arena{display:grid;grid-template-columns:1fr;gap:var(--s4);position:relative;border-radius:var(--radius-lg)}.board-card{display:flex;flex-direction:column}
.board-header{display:flex;justify-content:space-between;align-items:start;margin-bottom:var(--s3);gap:var(--s2)}
.board-header h2{font-size:var(--fs-md);font-weight:520;margin-top:var(--s1);letter-spacing:-.02em}
.status-dot{height:6px;width:6px;border-radius:50%;display:inline-block}
.human-dot{background:var(--human)}.jev-dot{background:var(--jev)}
.score-wrap{text-align:right;display:flex;flex-direction:column;line-height:1.2;min-width:0}
.score-wrap>span{font:var(--fs-xs) var(--mono);letter-spacing:.12em;color:var(--subtle);margin-bottom:var(--s1)}
.score-wrap strong{font-variant-numeric:tabular-nums;font-size:var(--fs-2xl);letter-spacing:-.04em;font-weight:650}.is-jev .score-wrap strong{color:var(--jev)}
.score-wrap small{font:var(--fs-xs) var(--mono);color:var(--subtle);margin-top:var(--s1);letter-spacing:.02em;min-height:1rem}.board{--fit-max:34rem;--fit-reserve:17rem;display:grid;grid-template-rows:repeat(4,1fr);gap:2.2%;padding:2.2%;background:var(--board-bg);border:1px solid var(--board-line);border-radius:var(--radius);aspect-ratio:1;touch-action:none;container-type:inline-size;width:100%;margin-inline:auto;}
.board-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2.9%;min-height:0}
.tile{display:grid;place-items:center;background:var(--tile-face);border-radius:var(--radius-sm);min-width:0;font-size:clamp(15px,4vw,34px);font-size:9cqw;font-weight:720;letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:var(--tile-ink);user-select:none;transition:background .14s,color .14s}
.tile[data-e="1"]{background:#333c51;color:#e9edfa}.tile[data-e="2"]{background:#45516a;color:#f7f8fc}.tile[data-e="3"]{background:#65567e;color:#fff3ff}.tile[data-e="4"]{background:#82699c;color:#fff}.tile[data-e="5"]{background:#a887bb;color:#191322}.tile[data-e="6"]{background:#c6a4d3;color:#24152c}.tile[data-e="7"]{background:#e1b9cc;color:#352130}.tile[data-e="8"]{background:#e7c29d;color:#342318}.tile[data-e="9"]{background:#eacf80;color:#342a13}
.tile[data-e="10"]{background:#e7d573;color:#332d12}.tile[data-e="11"]{background:#f5e687;color:#262414;box-shadow:0 0 23px #f2de5720}.tile[data-e="12"],.tile[data-e="13"],.tile[data-e="14"]{background:#89dac6;color:#122e27}
.tile[data-e="10"],.tile[data-e="11"],.tile[data-e="12"],.tile[data-e="13"],.tile[data-e="14"]{font-size:clamp(12px,3vw,27px);font-size:6.8cqw}
.tile.large{font-size:clamp(11px,2.6vw,23px);font-size:5.6cqw}
.tile.spawn{animation:spawn .23s ease-out}.tile.merged{animation:merge .2s ease-out}
.board.preview{opacity:.85}
.board-footer{display:flex;justify-content:space-between;flex-wrap:wrap;font-size:var(--fs-xs);color:var(--muted);padding-top:var(--s3);gap:var(--s2)}
.board-footer strong{font-family:var(--mono);color:var(--text);margin-left:var(--s1)}
.board-footer>span:last-child{color:var(--subtle)}
.versus{display:none}
.play-footer{display:flex;justify-content:space-between;align-items:center;gap:var(--s4);flex-wrap:wrap}
#game-status{font-size:var(--fs-sm);color:var(--text)}
.control-help{font-size:var(--fs-xs);margin-top:var(--s1);color:var(--subtle)}
.control-help span{padding:0 var(--s2)}
.direction-pad{display:flex;gap:var(--s2)}
.direction{min-height:var(--tap);min-width:var(--tap);background:var(--surface);border:1px solid var(--line);border-bottom-width:3px;border-radius:var(--radius-sm);color:var(--muted);font-size:var(--fs-xl)}
.direction:active{color:var(--accent);border-color:var(--accent)}
.recovery{display:flex;gap:var(--s2);flex-wrap:wrap}.recovery:empty{display:none}
.error-banner{background:#472637;border:1px solid #87506c;color:#ffe0eb;padding:var(--s3) var(--s4);border-radius:var(--radius-sm);font-size:var(--fs-sm)}
.panel-tabs{display:flex;gap:var(--s5);border-bottom:1px solid var(--line);overflow:auto;white-space:nowrap}
.panel-tabs button{font-size:var(--fs-sm);min-height:var(--tap);padding:0;background:transparent;border-bottom:2px solid transparent;color:var(--subtle)}
.panel-tabs button.active{color:var(--accent);border-bottom-color:var(--accent)}
.detail-panel{padding-top:var(--s2);min-height:16rem}
.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:var(--s4);margin-bottom:var(--s5)}
.panel-heading h2{margin-top:var(--s1)}
.panel-heading.compact{margin:var(--s6) 0 var(--s4)}
.toggle{display:flex;align-items:center;gap:var(--s2);min-height:var(--tap);font-size:var(--fs-xs);color:var(--muted)}
input[type=checkbox]{accent-color:var(--accent);width:1.1rem;height:1.1rem}
.decision-metrics,.analytics-kpis{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3);margin-bottom:var(--s5)}
.metric{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s4);min-width:0}
.metric>span{display:block;font:var(--fs-xs) var(--mono);letter-spacing:.06em;color:var(--subtle);margin-bottom:var(--s2)}
.metric>strong{font-size:var(--fs-xl);font-weight:550;letter-spacing:-.03em}
.metric>small{display:block;font-size:var(--fs-xs);margin-top:var(--s1);color:var(--muted)}
#metric-source{font-size:var(--fs-lg)}
.table-scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;text-align:left;font-size:var(--fs-xs);font-variant-numeric:tabular-nums}
th{font-weight:500;color:var(--subtle);font-size:var(--fs-xs);white-space:nowrap;padding:var(--s3);border-bottom:1px solid var(--line)}
td{padding:var(--s3);border-bottom:1px solid var(--line-soft)}
tbody tr.selected{background:#a99bff10}tbody tr.selected td:first-child{color:var(--accent)}
td:first-child{font-weight:550}
td .selected-tag{margin-left:var(--s2);font:var(--fs-xs) var(--mono);border:1px solid #51466d;border-radius:var(--radius-sm);color:var(--accent);padding:2px var(--s1)}
caption{text-align:left;color:var(--muted);padding:0 0 var(--s2)}
.empty-state{text-align:center!important;color:var(--subtle);padding:var(--s6)!important;font-weight:400!important}
.panel-footnote{font-size:var(--fs-xs);margin-top:var(--s4);color:var(--subtle);max-width:60rem}
.raw-evidence{margin-top:var(--s4);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);padding:var(--s3)}
.raw-evidence summary{font-size:var(--fs-xs);color:var(--muted);cursor:pointer;min-height:var(--tap);display:flex;align-items:center}
.raw-evidence p{font-size:var(--fs-xs);margin-top:var(--s2)}
pre{white-space:pre-wrap;overflow-wrap:anywhere;font:var(--fs-xs)/1.65 var(--mono);max-height:23rem;overflow:auto;color:var(--muted);margin-bottom:0}
.inline-controls{display:flex;gap:var(--s2);flex-wrap:wrap}
.chart-grid{display:grid;grid-template-columns:1fr;gap:var(--s4)}
.chart-card>p{font-size:var(--fs-xs);color:var(--subtle);margin:var(--s1) 0 var(--s4)}
.chart-card h3{font-size:var(--fs-md)}
.chart{min-height:11rem}
.chart svg{width:100%;height:11.5rem;overflow:visible}
.chart text{fill:var(--subtle);font:10px var(--mono)}
.chart .grid-line{stroke:var(--line);stroke-width:.6}
.chart .human-line{stroke:var(--human)}.chart .jev-line{stroke:var(--jev)}
.chart polyline{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.legend-line{display:inline-block;width:15px;height:2px;vertical-align:middle}
.legend-line.human-line{background:var(--human)}.legend-line.jev-line{background:var(--jev)}
.heatmap-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);margin-bottom:var(--s5)}
.heatmap-grid article:last-child{grid-column:1/-1}
.heatmap{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;max-width:16rem}
.heat-cell{aspect-ratio:1;display:grid;place-items:center;border:1px solid #a99bff28;border-radius:var(--radius-sm);font:var(--fs-xs) var(--mono);background:var(--surface);font-variant-numeric:tabular-nums}
.heat-cell[data-intensity="1"]{background:#302c44}.heat-cell[data-intensity="2"]{background:#474059}.heat-cell[data-intensity="3"]{background:#65577d}.heat-cell[data-intensity="4"]{background:#8c76ad;color:#fff}.heat-cell[data-intensity="5"]{background:#baa5db;color:#231b34}
.direction-stat{display:grid;grid-template-columns:1.25rem 1fr 1fr;align-items:center;gap:var(--s2);border-bottom:1px solid var(--line);padding:var(--s2) 0;font:var(--fs-xs) var(--mono)}
.direction-stat span:nth-child(2){color:var(--human)}.direction-stat span:nth-child(3){color:var(--jev)}
dl{margin:0}dl>div{display:flex;justify-content:space-between;gap:var(--s3);border-bottom:1px solid var(--line);padding:var(--s2) 0;font-size:var(--fs-xs)}
dt{color:var(--subtle)}dd{margin:0;text-align:right;word-break:break-word;color:var(--muted);font-family:var(--mono);max-width:65%}
.analytics-bottom{display:flex;align-items:start;flex-direction:column;gap:var(--s3);margin-top:var(--s5)}
.analytics-bottom p{font-size:var(--fs-xs);max-width:34rem;color:var(--subtle)}
.replay-control{display:flex;gap:var(--s4);align-items:center;flex-wrap:wrap;background:var(--surface);padding:var(--s4);border-radius:var(--radius-sm);border:1px solid var(--line)}
.replay-control label{font-size:var(--fs-xs);white-space:nowrap}
.replay-control strong{color:var(--accent)}
input[type=range]{width:100%;min-height:var(--tap);accent-color:var(--accent)}
.audit-grid{display:grid;grid-template-columns:1fr;gap:var(--s5);margin-top:var(--s5)}
.audit-grid h3{margin-bottom:var(--s3)}.audit-grid p{font-size:var(--fs-xs)}
.export-buttons{display:flex;gap:var(--s2);flex-wrap:wrap;margin-top:var(--s4)}
.file-import{display:block;font-size:var(--fs-xs);color:var(--muted);margin-top:var(--s5)}
.file-import input{display:block;margin-top:var(--s2);font-size:var(--fs-xs);max-width:100%}
.scope-tabs{display:flex;gap:var(--s2);flex-wrap:wrap;margin-bottom:var(--s3)}
.scope-tabs button{min-height:var(--tap);padding:0 var(--s4);border:1px solid var(--line);border-radius:var(--radius-sm);font-size:var(--fs-xs);background:var(--surface);color:var(--muted)}
.scope-tabs button.active{background:#a99bff20;color:var(--accent);border-color:#5b4d7b}
#leader-more{margin-top:var(--s4)}
.history-row{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);padding:var(--s4) 0;border-bottom:1px solid var(--line);font-size:var(--fs-sm)}
.history-row small{display:block;color:var(--subtle);font-size:var(--fs-xs);margin-top:var(--s1)}
#event-timeline{max-height:19rem;overflow:auto;margin-top:var(--s3)}
#event-timeline>div{display:grid;grid-template-columns:2.5rem 1fr 7.8rem;gap:var(--s2);font:10px var(--mono);border-top:1px solid var(--line);padding:var(--s2);color:var(--muted)}
.site-footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--s3);border-top:1px solid var(--line);margin-top:var(--s5);padding-top:var(--s5);font:var(--fs-xs) var(--mono);letter-spacing:.08em;color:var(--subtle)}
dialog{background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:var(--radius-lg);max-width:39rem;padding:var(--s5);width:calc(100% - 2rem);box-shadow:var(--shadow)}
dialog::backdrop{background:#05070bbb;backdrop-filter:blur(3px)}
dialog p{font-size:var(--fs-sm);margin-top:var(--s4)}
.dialog-header{display:flex;justify-content:space-between;align-items:start;gap:var(--s5)}
.dialog-close{background:none;color:var(--muted);font-size:var(--fs-num);line-height:1;min-width:var(--tap);min-height:var(--tap)}
dialog .inline-controls{margin-top:var(--s5)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes spawn{from{transform:scale(.78);opacity:.3}to{transform:scale(1);opacity:1}}
@keyframes merge{50%{transform:scale(1.06)}}
@media(min-width:600px){.arena{grid-template-columns:1fr 1fr;gap:var(--s5)}.board{--fit-max:28rem;--fit-reserve:21rem}.board-card{padding:var(--s4)}.board-header h2{font-size:var(--fs-lg)}.versus{display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--bg);border:1px solid var(--line);border-radius:50%;width:2.4rem;height:2.4rem;place-items:center;font:10px var(--mono);color:var(--subtle);z-index:2}.decision-metrics,.analytics-kpis{grid-template-columns:repeat(4,1fr)}.chart-grid{grid-template-columns:1fr 1fr}.heatmap-grid{grid-template-columns:1fr 1fr 1fr 1.4fr}.heatmap-grid article:last-child{grid-column:auto}.audit-grid{grid-template-columns:1fr 1fr}.analytics-bottom{flex-direction:row;align-items:center;justify-content:space-between}}
@media(min-width:900px){.intro{padding:var(--s4) 0 var(--s2)}.board-card{padding:var(--s5)}}
@media(min-width:1280px){.board{--fit-max:30rem;--fit-reserve:22rem}}
@media(max-height:560px){.intro{padding:var(--s2) 0}.hero-tagline,.intro p{font-size:var(--fs-xs)}.board{--fit-reserve:11rem}.board-header{margin-bottom:var(--s2)}.board-header h2{display:none}.board-footer{padding-top:var(--s2)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
