@font-face{font-family:Inter;src:url("assets/fonts/Inter-Latin.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:AIONAtreia;src:url("assets/fonts/AIONAtreia-Bold.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap}
*{box-sizing:border-box}
html{color-scheme:dark;font-size:16px;scrollbar-gutter:stable}
body{margin:0;min-height:100vh;font-family:var(--font-body);line-height:1.5;color:var(--text-primary);background:var(--bg-default)}
body::before{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(#070b1466,#070b14b3),url('assets/origin-background.jpg') center/cover no-repeat}
button,input,select{font:inherit}a{color:inherit;text-decoration:none}button,a{touch-action:manipulation}
button{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-1);min-height:var(--button-min-height-sm);padding:var(--spacing-1) var(--spacing-3);border:1px solid var(--border-soft);border-radius:var(--radius-sm);background:var(--button-toggle-bg);color:var(--text-secondary);font-size:var(--font-size-0);font-weight:700;line-height:1;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;transition:all var(--motion-duration-2) var(--motion-ease-standard)}
button:hover{background:var(--button-toggle-bg-hover);border-color:var(--border-accent-strong);color:var(--text-strong)}
button:focus-visible,a:focus-visible{outline:2px solid var(--border-accent-strong);outline-offset:3px}
header{height:64px;display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-1) var(--spacing-4);border-bottom:1px solid var(--border-accent-muted);background:var(--bg-surface);box-shadow:var(--elevation-1)}
.brand{display:flex;align-items:center;gap:var(--spacing-2);font-family:var(--font-title);font-size:var(--font-size-5);font-weight:700}.sigil{font-family:var(--font-body);font-size:40px;color:var(--action-accent);line-height:1}
nav{display:flex;align-items:center;gap:var(--spacing-1);margin:auto}nav a{min-width:clamp(5rem,8vw,8rem);min-height:2.3rem;display:flex;align-items:center;justify-content:center;padding:var(--spacing-1);border:1px solid transparent;border-radius:var(--radius-sm);color:var(--text-soft);font-size:var(--font-size-1);letter-spacing:.1em;text-transform:uppercase}nav a:hover,nav a.active{background:var(--action-accent-soft);border-color:var(--border-accent-strong);color:var(--text-strong)}
.demo{padding:var(--spacing-1) var(--spacing-3);border:1px solid var(--border-accent);border-radius:var(--radius-full);font-size:var(--font-size-0);font-weight:700;letter-spacing:var(--letter-spacing-wide);white-space:nowrap}
main{width:min(100%,92rem);padding:var(--spacing-7) var(--spacing-4);margin:0 auto}
#rankings{padding-top:var(--spacing-4)}
.intro h1{font-size:var(--font-size-5);letter-spacing:var(--letter-spacing-wider)}
.intro{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:var(--spacing-2)}
.intro::after{content:"";background:var(--action-accent);width:80px;height:4px;margin-top:var(--spacing-1);border-radius:var(--radius-full)}
h1{font-family:var(--font-title);font-size:var(--font-size-6);font-weight:700;color:var(--text-strong);letter-spacing:var(--letter-spacing-widest);text-transform:uppercase;margin:0}
.intro>p:last-child{font-size:var(--font-size-2);color:var(--text-soft);max-width:800px;line-height:var(--line-height-relaxed);margin:0}
.eyebrow{font-size:var(--font-size-1);font-weight:400;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;color:var(--text-muted);margin:0 0 var(--spacing-1)}
.workspace{display:grid;grid-template-columns:minmax(14rem,17rem) minmax(0,1fr);gap:var(--spacing-3);align-items:start}
.workspace[hidden],#live-reports[hidden],#ranking-context[hidden],#ranking-panel[hidden]{display:none}
aside,.panel,.fight{background:var(--bg-surface);border:1px solid var(--border-accent);border-radius:var(--radius-sm);box-shadow:var(--elevation-1)}
aside{padding:var(--spacing-3)}.aside-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-2)}.aside-heading h2{font-size:var(--font-size-1);font-weight:400;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;margin:0;color:var(--text-muted)}.aside-heading>span{font-size:var(--font-size-1);color:var(--text-muted)}
#instances{display:grid;gap:var(--spacing-1)}.instance{justify-content:flex-start;text-align:left;width:100%;padding:var(--spacing-1) var(--spacing-2);font-size:var(--font-size-1);font-weight:400;line-height:1.5;letter-spacing:var(--letter-spacing-wide)}.instance.selected,.bosses button.selected{background:var(--button-toggle-pressed-bg);border-color:var(--button-toggle-pressed-border);color:var(--text-strong)}.instance-index{color:var(--text-muted)}.arrow{margin-left:auto}.aside-note{font-size:var(--font-size-1);line-height:var(--line-height-relaxed);color:var(--text-muted);margin:var(--spacing-3) 0 0}
.content{min-width:0;display:grid;gap:var(--spacing-3)}.fight{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4)}.fight h2,dialog h2{font-family:var(--font-body);font-size:var(--font-size-5);font-weight:700;line-height:1.5;color:var(--text-accent);margin:0 0 var(--spacing-1)}.fight p:last-child{font-size:var(--font-size-2);color:var(--text-muted);margin:0}.fight-mark{font-size:var(--font-size-8);color:var(--action-accent);opacity:.45}
.bosses{display:flex;flex-wrap:wrap;gap:var(--spacing-1)}.bosses button{font-size:var(--font-size-1);font-weight:400;line-height:1.5;padding:var(--spacing-1) var(--spacing-2)}
.panel{padding:var(--spacing-3);overflow:hidden}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-3);margin-bottom:var(--spacing-3)}.panel-heading h2{font-size:var(--font-size-4);font-weight:700;line-height:1.5;margin:0}.quiet,.fight-link{background:transparent;border:0;color:var(--text-strong);font-size:var(--font-size-2);font-weight:600;line-height:1.5;text-transform:none;letter-spacing:normal;padding:0;min-height:auto}
.filters{display:flex;gap:var(--spacing-3);margin-bottom:var(--spacing-3)}label{display:flex;flex-direction:column;gap:var(--spacing-1);min-width:0;flex:1}label>span{font-size:var(--font-size-1);font-weight:400;letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;color:var(--text-muted)}
input,select{width:100%;min-height:var(--button-min-height-sm);padding:var(--spacing-1) var(--spacing-2);border:1px solid var(--border-accent);border-radius:var(--radius-sm);background:var(--bg-surface-muted-strong);color:var(--text-strong);font-size:var(--font-size-1);line-height:1.5}select{padding-right:40px}input:focus,select:focus{outline:0;border-color:var(--border-accent-strong);box-shadow:0 0 0 .2rem color-mix(in srgb,var(--action-accent) 20%,transparent)}.search{flex:1;}
.result-count{font-size:var(--font-size-2);color:var(--text-secondary);margin:0 0 var(--spacing-3)}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap;font-variant-numeric:tabular-nums}th{font-size:var(--font-size-1);font-weight:600;text-transform:uppercase;letter-spacing:var(--letter-spacing-wide);color:var(--text-muted);background:var(--bg-surface-strong);padding:var(--spacing-2)}td{font-size:var(--font-size-2);padding:var(--spacing-2);border-bottom:1px solid var(--border-faint)}tbody tr:hover{background:var(--action-accent-soft)}.rank{color:var(--text-muted)}.rank.top{color:var(--action-accent)}.identity{display:flex;gap:var(--spacing-2);align-items:center}.identity img{object-fit:contain}.identity strong{font-size:var(--font-size-2);font-weight:600}.identity small{display:block;font-size:var(--font-size-0);color:var(--text-muted);margin-top:var(--spacing-1)}.class-name,.numeric{color:var(--text-secondary)}.score{position:relative;min-width:110px;color:var(--text-accent)}.score strong{font-size:var(--font-size-3);font-weight:700}.score-bar{position:absolute;bottom:var(--spacing-1);left:var(--spacing-2);height:2px;max-width:calc(100% - 2 * var(--spacing-2));background:var(--border-accent-strong)}.fight-link{font-size:var(--font-size-1)}
.table-note{font-size:var(--font-size-1);color:var(--text-muted);line-height:var(--line-height-relaxed);margin:var(--spacing-3) 0 0}.bottom-note{display:flex;gap:var(--spacing-2);align-items:center;color:var(--text-muted);font-size:var(--font-size-1)}.bottom-note>span{color:var(--action-accent);font-size:var(--font-size-5)}.bottom-note p{margin:0}footer{width:min(100%,92rem);margin:auto;padding:var(--spacing-4);border-top:1px solid var(--border-faint);display:flex;justify-content:space-between;gap:var(--spacing-3);font-size:var(--font-size-1);color:var(--text-muted)}
#empty{text-align:center;padding:var(--spacing-7);color:var(--text-muted)}dialog{width:min(720px,calc(100% - 2 * var(--spacing-4)));padding:var(--spacing-5);background:var(--bg-surface-strong);color:var(--text-primary);border:1px solid var(--border-accent);border-radius:var(--radius-md);box-shadow:var(--elevation-3)}dialog::backdrop{background:#070b14ab;backdrop-filter:blur(4px)}dialog p{font-size:var(--font-size-2);color:var(--text-secondary);line-height:var(--line-height-relaxed)}.close{float:right}dialog .eyebrow{padding-top:var(--spacing-2)}
@media(max-width:1100px){.workspace{grid-template-columns:minmax(0,1fr)}#instances{grid-template-columns:repeat(2,minmax(0,1fr))}.aside-note{margin-top:var(--spacing-2)}}
@media(max-width:600px){header{gap:var(--spacing-2)}nav{margin-left:auto;margin-right:0}nav a:last-child{display:none}.sigil{font-size:32px}.brand{font-size:var(--font-size-4)}.demo{font-size:var(--font-size-0);padding:var(--spacing-1)}h1{overflow-wrap:anywhere}.instance-index{display:none}.instance{letter-spacing:normal}.filters{flex-wrap:wrap}.search{flex-basis:100%}.panel-heading{align-items:flex-start}.quiet{font-size:var(--font-size-1);max-width:110px;text-align:right}footer{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.instance-group{min-width:0}
.instance-group summary.instance{display:flex;align-items:center;gap:var(--spacing-1);min-height:var(--button-min-height-sm);border:1px solid var(--border-soft);border-radius:var(--radius-sm);background:var(--button-toggle-bg);color:var(--text-secondary);text-transform:uppercase;cursor:pointer;list-style:none}
.instance-group summary::-webkit-details-marker{display:none}
.instance-group summary.instance:hover{border-color:var(--border-accent-strong);color:var(--text-strong)}
.instance-group summary.instance.selected{background:var(--button-toggle-pressed-bg);border-color:var(--button-toggle-pressed-border);color:var(--text-strong)}
.instance-group summary:focus-visible{outline:2px solid var(--button-focus-ring);outline-offset:3px}
.instance-group .arrow{transition:transform var(--motion-duration-1) var(--motion-ease-standard)}
.instance-group[open] .arrow{transform:rotate(90deg)}
.instance-bosses{list-style:none;margin:var(--spacing-1) 0 var(--spacing-2) var(--spacing-2);padding:0 0 0 var(--spacing-2);border-left:1px solid var(--border-soft)}
.boss-option{width:100%;justify-content:flex-start;text-align:left;white-space:normal;line-height:1.5;padding:var(--spacing-2);font-size:var(--font-size-1);font-weight:400;text-transform:none;letter-spacing:normal;border-color:transparent;background:transparent}
.boss-option.selected{color:var(--text-accent);background:var(--action-accent-soft);border-color:var(--border-accent-muted)}
#instances a.boss-option{display:block}
@media(max-width:1100px){#instances{grid-template-columns:1fr}}
.report-surface{min-width:0;background:var(--bg-surface-strong);border:1px solid var(--border-accent);border-radius:var(--radius-sm);box-shadow:var(--elevation-1)}
.report-surface:not([hidden]){display:block}
.report-surface>.panel,.report-surface>.fight{margin:0;padding:var(--spacing-4) var(--spacing-5);background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible}
.report-surface>.panel+.panel,.report-surface>.fight+.panel{border-top:1px solid var(--border-faint)}
.report-surface .panel-heading{margin-bottom:var(--spacing-3)}
.report-surface .panel-heading h2{font-size:var(--font-size-3)}
.report-surface th{background:transparent;text-transform:none;letter-spacing:normal;font-weight:400;border-bottom:1px solid var(--border-soft)}
.report-surface .chart-note{font-size:var(--font-size-1);margin-bottom:var(--spacing-3)}
.report-surface .fight h2{font-family:var(--font-title);font-size:var(--font-size-5);color:var(--text-strong);letter-spacing:var(--letter-spacing-wide)}
.report-surface .ranking-kicker{display:none}
@media(max-width:600px){.report-surface>.panel,.report-surface>.fight{padding:var(--spacing-3)}}
.metric-help{display:inline-flex;align-items:center;justify-content:center;inline-size:1rem;block-size:1rem;min-width:1rem;min-height:1rem;flex:0 0 1rem;margin-left:var(--spacing-1);padding:0;border:1px solid var(--border-soft);border-radius:var(--radius-full);font-size:.625rem;font-weight:400;line-height:1;letter-spacing:normal;text-transform:none;background:transparent;color:var(--text-muted)}
.metric-help:hover{color:var(--text-accent);border-color:var(--border-accent)}
.metric-dialog{max-width:32rem}.metric-dialog h2{font-family:var(--font-body);font-size:var(--font-size-4);padding-right:var(--spacing-7)}

.sort-control, .party-switcher { display: flex; flex-wrap: wrap; align-items: center; gap: var(--spacing-3); margin-block: var(--spacing-3); }
.sort-control { width: fit-content; max-width: 100%; margin-left: auto; align-items: flex-end; gap: var(--spacing-1); }
.sort-control select, .party-switcher select { width: auto; max-width: 100%; }
.party-switcher { align-items: flex-start; width: fit-content; max-width: 100%; margin: 0 0 var(--spacing-4); gap: var(--spacing-1); }
.player-link { color: inherit; font-weight: 600; }
.player-link:hover { color: var(--action-accent); text-decoration: underline; }
.report-tools { display: flex; flex-wrap: wrap; align-items: center; gap: var(--spacing-3); margin-top: var(--spacing-4); }
.report-tools [role=status], .timeline-hover { font-size: var(--font-size-1); color: var(--text-muted); }
.timeline-hover { min-height: 1.5em; }

.party-switcher { flex-direction: column; }
.party-switcher > span { font-size: var(--font-size-1); letter-spacing: var(--letter-spacing-wide); text-transform: uppercase; color: var(--text-muted); }
.party-menu { position: relative; min-width: 10rem; max-width: 100%; font-size: var(--font-size-1); }
.party-menu summary, .party-options a { display: flex; align-items: center; gap: var(--spacing-2); padding: var(--spacing-1) var(--spacing-2); }
.party-menu summary { cursor: pointer; list-style: none; border: 1px solid var(--border-accent); border-radius: var(--radius-sm); background: var(--button-toggle-bg); min-height: var(--button-min-height-sm); }
.party-menu summary::-webkit-details-marker { display: none; }
.party-menu summary::after { content: ''; width: .4rem; height: .4rem; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(45deg); margin-left: auto; }
.party-menu summary:focus-visible { outline: 2px solid var(--border-accent-strong); outline-offset: 3px; }
.party-menu img { flex-shrink: 0; object-fit: contain; }
.party-options { position: absolute; top: 100%; left: 0; min-width: 100%; z-index: 10; list-style: none; padding: var(--spacing-1); margin: var(--spacing-1) 0 0; background: var(--bg-default); border: 1px solid var(--border-accent); border-radius: var(--radius-sm); box-shadow: var(--elevation-1); }
.party-options a:hover, .party-options a[aria-current] { background: var(--action-accent-soft); color: var(--text-strong); }

.ranking-toolbar, .ranking-results { display:flex; align-items:center; flex-wrap:wrap; gap:var(--spacing-3); }
.ranking-toolbar { justify-content:space-between; margin-block:var(--spacing-3); }
.ranking-toolbar .result-count, .ranking-toolbar .sort-control { margin:0; }
.ranking-toolbar .sort-control { margin-left:auto; }
#reset[hidden] { display:none; }
#rules-open[hidden], #back-reports[hidden] { display:none; }
#ranking-body tr:focus-within { background:var(--action-accent-soft); }
#ranking-body a:focus-visible { outline:2px solid var(--action-accent); outline-offset:4px; border-radius:var(--radius-xs); }
#ranking-body .numeric, #ranking-body .score { width:8rem; min-width:8rem; text-align:right; }
#rankings th:nth-child(4), #rankings th:nth-child(5), #rankings th:nth-child(6) { text-align:right; }
.player-toolbar { display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:var(--spacing-3); margin-bottom:var(--spacing-4); }
.player-toolbar .party-switcher, .player-toolbar .report-tools { margin:0; }
.player-toolbar .report-tools { margin-left:auto; flex-direction:column; align-items:flex-end; max-width:15rem; text-align:right; }
.buff-tooltip, .cast-tooltip { display:none; position:absolute; bottom:calc(100% + var(--spacing-1)); z-index:20; width:max-content; max-width:min(15rem,75vw); padding:var(--spacing-2); border:1px solid var(--border-accent); border-radius:var(--radius-xs); background:var(--bg-default); box-shadow:var(--elevation-1); color:var(--text-strong); font-size:var(--font-size-2); line-height:1.5; white-space:normal; pointer-events:none; }
.buff-tooltip { right:0; }
.cast-tooltip { left:0; }
.cast-result { font-size:var(--font-size-1); color:var(--text-secondary); }

#fight-meta dt,.insight-grid dt,.skill-summary dt,.advanced-grid dt{display:flex;align-items:center;min-height:1rem}

.marked-label,.filter-picker-current,.filter-option,.identity-context{display:inline-flex;align-items:center;gap:var(--spacing-1)}
.class-mark{object-fit:contain;flex:0 0 auto}.faction-mark{object-fit:contain;flex:0 0 auto}
.faction-label{display:block}.faction-label .marked-label{color:var(--text-muted)}
.class-name .marked-label{white-space:nowrap;color:var(--text-secondary)}
.filter-picker{position:relative;min-width:0}.filter-picker summary{display:flex;align-items:center;gap:var(--spacing-2);min-height:var(--button-min-height-sm);padding:var(--spacing-1) var(--spacing-2);border:1px solid var(--border-accent);border-radius:var(--radius-sm);background:var(--button-toggle-bg);color:var(--text-strong);font-size:var(--font-size-1);line-height:1.5;cursor:pointer;list-style:none}.filter-picker summary::-webkit-details-marker{display:none}.filter-picker summary::after{content:'⌄';margin-left:auto;font-size:var(--font-size-3);line-height:1;color:var(--text-muted)}.filter-picker[open] summary{border-color:var(--border-accent-strong);box-shadow:0 0 0 .2rem color-mix(in srgb,var(--action-accent) 20%,transparent)}.filter-options{position:absolute;z-index:3;top:calc(100% + var(--spacing-1));right:0;left:0;max-height:18rem;overflow:auto;margin:0;padding:var(--spacing-1);list-style:none;border:1px solid var(--border-accent);border-radius:var(--radius-sm);background:var(--bg-surface-strong);box-shadow:var(--elevation-2)}.filter-option{width:100%;justify-content:flex-start;min-height:2.25rem;padding:var(--spacing-1) var(--spacing-2);border-color:transparent;background:transparent;font-size:var(--font-size-1);font-weight:400;letter-spacing:normal;text-align:left;text-transform:none}.filter-option:hover,.filter-option.selected{background:var(--action-accent-soft);border-color:var(--border-accent-muted);color:var(--text-strong)}.filter-option[aria-current='true']{color:var(--text-accent)}
#player-context.identity-context{display:flex;align-items:center;gap:var(--spacing-1)}
