*{box-sizing:border-box}
:root{color-scheme:light;--ink:#211534;--deep:#281740;--purple:#5c3089;--muted:#5c5268;--line:#e6deed;--lime:#defa78;--paper:#f7f4fa}
body{margin:0;background:var(--paper);color:var(--ink);font:1rem/1.5 system-ui,sans-serif;overflow-wrap:anywhere}
a{color:#572b82;text-underline-offset:.18em;font-weight:650} a:focus-visible{outline:3px solid #9b52dc;outline-offset:3px}
.shell{width:min(70rem,100%);margin-inline:auto;padding-inline:1rem}
header{background:var(--deep);color:white}.mast{display:flex;align-items:center;min-height:4.5rem;justify-content:space-between}
.brand{display:flex;align-items:center;gap:.75rem;color:white;text-decoration:none;font-size:1.25rem;font-weight:850;line-height:1.1}
.brand small{display:block;font-size:.62rem;letter-spacing:.12em;margin-top:.25rem}.mark{display:grid;place-items:center;width:2.4rem;height:2.4rem;border-radius:.65rem;background:var(--lime);color:var(--deep);font-size:1.6rem;font-style:italic}
nav{position:fixed;inset:auto 0 0;z-index:2;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:#fff;border-top:1px solid var(--line);padding:.25rem .125rem max(.25rem,env(safe-area-inset-bottom));box-shadow:0 -4px 20px #21153413}
nav a{display:grid;place-content:center;text-align:center;gap:.05rem;min-height:3.25rem;text-decoration:none;font-size:clamp(.64rem,2.9vw,.82rem);color:var(--ink);border-radius:.55rem}
nav span{font-size:1.1rem;line-height:1.15}nav [aria-current]{background:#eee3f8;color:#48216e}
main{padding-block:1rem 1.5rem}h1,h2,h3,p{margin:0 0 .65rem}h1,h2,h3{line-height:1.12}h1{font-size:clamp(1.85rem,5vw,3.3rem);letter-spacing:-.04em}h2{font-size:clamp(1.25rem,3vw,1.6rem)}
.eyebrow{font-size:.73rem;font-weight:850;letter-spacing:.13em;color:var(--purple)}.intro{margin-top:1rem}
.hero{padding:1rem;border-radius:1.15rem;background:radial-gradient(ellipse at top right,#5a3486,transparent 65%),var(--deep);color:white}.hero .eyebrow{color:var(--lime)}.date{font-size:1.24rem;font-weight:750}.date::first-letter,h2::first-letter{text-transform:uppercase}
.button{display:inline-flex;min-height:2.75rem;align-items:center;background:var(--lime);color:var(--deep);border-radius:.6rem;padding:.45rem .75rem;text-decoration:none}
.cards{display:grid;gap:.5rem;list-style:none;padding:0;margin:.8rem 0}.match{background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:.7rem;padding:.6rem .7rem;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:.2rem .4rem;font-size:.92rem}
.match>strong:last-child{text-align:right}.meta{grid-column:1/-1;display:flex;justify-content:space-between;gap:.3rem;color:var(--muted);font-size:.72rem}.meta span{font-weight:850;color:var(--purple)}.versus{color:var(--muted);font-size:.7rem}
.overview{display:grid;gap:.75rem;margin-top:.75rem}.panel{background:#fff;border:1px solid var(--line);border-radius:.9rem;padding:1rem;margin-top:.75rem}.overview>.panel{margin-top:0}.empty{color:var(--muted);background:var(--paper);padding:.65rem;border-radius:.5rem}
table{border-collapse:collapse;width:100%;font-size:.84rem;font-variant-numeric:tabular-nums}th,td{text-align:left;border-bottom:1px solid var(--line);padding:.4rem .22rem}td:last-child,th:last-child{text-align:right}dt{font-weight:750}dd{margin:0 0 .65rem}
footer{padding-block:1rem calc(5.5rem + env(safe-area-inset-bottom));color:var(--muted);font-size:.85rem}.skip{position:absolute;left:.5rem;top:.5rem;z-index:4;background:white;padding:.65rem;transform:translateY(-180%)}.skip:focus{transform:none}
@media(min-width:44rem){.shell{padding-inline:1.5rem}.overview,.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{padding:1.75rem}.panel{padding:1.25rem}}
@media(min-width:52rem){nav{position:static;display:flex;gap:.25rem;border:0;background:none;box-shadow:none;padding:0}nav a{padding:.4rem .65rem;color:white}nav span{display:none}nav [aria-current]{background:var(--lime);color:var(--deep)}footer{padding-bottom:1.5rem}}
.team-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;list-style:none;padding:0}
.team-list li{padding:.55rem;border:1px solid var(--line);border-radius:.6rem}
.team-list img{display:block;width:100%;height:auto;border-radius:.3rem;margin-bottom:.4rem}
.team-list small{display:block;color:var(--muted)}

.team-photo{display:block;cursor:zoom-in}
.photo-viewer{border:0;padding:0;background:#171020;max-width:none;max-height:none}
.photo-viewer::backdrop{background:#171020dd}
.photo-viewer button{display:grid;place-items:center;position:relative;padding:0;border:0;background:none;color:white;cursor:zoom-out}
.photo-viewer img{display:block;width:auto;height:auto;max-width:95vw;max-height:90dvh;object-fit:contain}
.photo-viewer span{position:absolute;top:.75rem;right:.75rem;display:grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:50%;background:#171020;color:white;font-size:1.75rem}
@media(max-width:44rem){
    .photo-viewer{width:100vw;height:100dvh;margin:0}
    .photo-viewer button{width:100%;height:100%}
    .photo-viewer img{max-width:100%;max-height:100%}
}

table + h3{margin-top:1.25rem}
.pool-status{margin-top:1rem;color:var(--muted)}
.overview .results { grid-template-columns: minmax(0, 1fr); }
.result-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: .7rem;
    padding: .65rem .75rem;
    font-size: .92rem;
}
.result-card time {
    display: block;
    margin-bottom: .4rem;
    color: var(--muted);
    font-size: .8rem;
    font-weight: 700;
}
.result-card dl {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    gap: .2rem .65rem;
    margin: 0;
    font-variant-numeric: tabular-nums;
}
.result-card dd { margin: 0; }


.matrix-scroll { max-width: 100%; overflow-x: auto; }
.score-matrix { min-width: 52rem; border-collapse: separate; border-spacing: 0; }
.score-matrix th, .score-matrix td {
    padding: .5rem;
    border-right: 1px solid var(--line);
    text-align: center;
}
.score-matrix th { background: var(--paper); }
.score-matrix th:first-child {
    position: sticky;
    left: 0;
    width: 7rem;
    text-align: left;
}
.score-matrix .matrix-unused { background: var(--paper); }
.matrix-score strong, .matrix-score small, .matrix-score time { display: block; }
.matrix-score small, .matrix-score time { color: var(--muted); }
.matrix-score + .matrix-score { margin-top: .4rem; padding-top: .4rem; border-top: 1px solid var(--line); }
.matrix-hint { color: var(--muted); font-size: .85rem; }
@media (min-width: 58rem) { .matrix-hint { display: none; } }

.score-matrix { min-width: 36rem; }
.score-matrix th:first-child { width: 3.75rem; z-index: 1; }
.team-badge { display: inline-grid; place-items: center; min-width: 2.75rem; min-height: 2.75rem; }
.team-symbol { font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", system-ui, sans-serif; font-size: 1.25rem; line-height: 1; }
.standing-team { display: flex; align-items: center; gap: .45rem; }
.standing-team .team-badge { flex: none; }


.score-matrix .team-badge { position: relative; border: 0; padding: 0; background: transparent; cursor: pointer; }
.score-matrix th:focus-within, .score-matrix th:hover { position: relative; z-index: 2; }
.score-matrix th:first-child:focus-within, .score-matrix th:first-child:hover { position: sticky; }
.team-tooltip {
    position: absolute;
    top: calc(100% + .2rem);
    left: 0;
    width: max-content;
    max-width: 10rem;
    padding: .35rem .55rem;
    border-radius: .4rem;
    background: var(--deep);
    color: #fff;
    font-size: .8rem;
    pointer-events: none;
    visibility: hidden;
}
.score-matrix th:nth-last-child(-n+2):not(:first-child) .team-tooltip { left: auto; right: 0; }
.score-matrix tbody tr:last-child .team-tooltip { top: auto; bottom: calc(100% + .2rem); }
.team-badge:hover .team-tooltip, .team-badge:focus .team-tooltip { visibility: visible; }

.motto {
    margin-block: 1rem;
    padding: 1rem 1.25rem;
    border-left: .25rem solid var(--purple);
    border-radius: 0 .7rem .7rem 0;
    background: #eee7f5;
}
.motto blockquote {
    margin: 0;
    font-size: clamp(1rem, 2.5vw, 1.25rem);
    font-weight: 650;
    line-height: 1.4;
}
@media (max-width: 51.999rem) { main { padding-bottom: calc(5rem + env(safe-area-inset-bottom)); } }
