:root {
    --ink:#16213e;
    --muted:#667085;
    --blue:#1b4d8f;
    --green:#317e54;
    --crimson:#a6192e;
    --gold:#b58224;
    --line:#e3e5e9;
    --paper:#fff;
    --background:#f7f8fa;
    --sans:'Plus Jakarta Sans','Noto Sans Khmer','Segoe UI',sans-serif;
    --mono:'IBM Plex Mono',monospace
}
* {
    box-sizing:border-box
}
body {
    margin:0;
    background:var(--background);
    font-family:var(--sans);
    font-size:13px;
    color:var(--ink)
}
button,input,select {
    font:inherit
}
button,a,input,select {
    -webkit-tap-highlight-color:transparent
}
button {
    cursor:pointer
}
button:disabled {
    opacity:.5;
    cursor:default
}
a {
    color:inherit
}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible {
    outline:3px solid var(--blue);
    outline-offset:3px
}
[hidden] {
    display:none!important
}
.app {
    display:grid;
    grid-template-columns:240px minmax(0,1fr) 330px;
    min-height:100vh;
    padding-bottom:18px
}
.sidebar {
    height:calc(100vh - 18px);
    position:sticky;
    top:0;
    display:flex;
    flex-direction:column;
    background:white;
    border-right:1px solid var(--line)
}
.brand {
    text-align:center;
    padding:20px 18px 18px;
    border-bottom:1px solid var(--line)
}
.brand-logo {
    display:block;
    width:174px;
    max-width:100%;
    height:auto;
    margin:0 auto
}
.eyebrow {
    font-size:9px;
    font-weight:600;
    letter-spacing:1.5px;
    color:var(--muted)
}
.nav-heading {
    padding:28px 22px 12px;
    font-size:9px;
    font-weight:700;
    letter-spacing:1.6px;
    color:var(--muted)
}
.navigation {
    padding:0 12px;
    display:grid;
    gap:6px
}
.nav-item {
    display:flex;
    align-items:center;
    gap:12px;
    padding:13px 14px;
    border-radius:7px;
    text-decoration:none;
    font-weight:600;
    color:#536078
}
.nav-item>span {
    font-size:19px;
    width:20px;
    text-align:center
}
.nav-item:hover {
    background:#f7f8fa
}
.nav-item.active {
    background:#edf2fa;
    color:var(--blue)
}
.sidebar-note {
    margin:auto 22px 24px;
    padding-top:28px
}
.sidebar-note strong {
    display:block;
    font-size:19px;
    margin:9px 0
}
.sidebar-note p {
    color:var(--muted);
    font-size:11px;
    line-height:1.7;
    margin:0 0 12px
}
.source-tag {
    font-size:10px;
    background:#f2f4f7;
    padding:5px 8px;
    border-radius:4px;
    color:var(--muted)
}
.sidebar-footer {
    border-top:1px solid var(--line);
    padding:18px 20px;
    font-size:10px;
    display:flex;
    align-items:center;
    gap:8px;
    color:var(--muted)
}
.status-dot {
    width:6px;
    height:6px;
    background:var(--muted);
    border-radius:50%
}
.main-content {
    min-width:0
}
.topbar {
    height:64px;
    background:white;
    border-bottom:1px solid var(--line);
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:0 30px;
    gap:16px
}
.breadcrumb {
    display:flex;
    gap:12px;
    font-size:11px;
    color:var(--muted)
}
.breadcrumb strong {
    color:var(--ink);
    font-weight:600
}
.platform-tag {
    font-size:10px;
    color:var(--muted);
    white-space:nowrap
}
.workspace {
    max-width:1700px;
    margin:0 auto;
    padding:30px
}
.operations-rail {
    position:sticky;
    top:0;
    align-self:start;
    height:calc(100vh - 18px);
    max-height:calc(100vh - 18px);
    overflow-y:auto;
    border-left:1px solid var(--line);
    background:#fff;
    padding:28px 22px 40px;
    min-width:0
}
.operations-section+ .operations-section {
    border-top:1px solid var(--line);
    margin-top:26px;
    padding-top:26px
}
.operations-heading {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:18px
}
.operations-heading h2 {
    margin:7px 0 0;
    font-size:16px;
    line-height:1.35
}
.feed-badge {
    flex:none;
    border:1px solid #e5d6ae;
    background:#fff9e9;
    color:#89651a;
    border-radius:20px;
    padding:5px 8px;
    font-size:9px;
    font-weight:700;
    white-space:nowrap
}
.feed-badge.connected {
    border-color:#c9e2d2;
    background:#edf7f0;
    color:var(--green)
}
.feed-badge.failed {
    border-color:#edcccb;
    background:#fff3f2;
    color:var(--crimson)
}
.network-status-grid {
    display:grid;
    gap:10px
}
.network-card {
    display:grid;
    grid-template-columns:38px minmax(0,1fr) auto;
    align-items:center;
    gap:11px;
    padding:14px;
    border:1px solid var(--line);
    border-radius:9px;
    background:#fbfcfe
}
.operation-icon {
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:8px;
    color:var(--blue);
    background:#edf3fb
}
.operation-icon svg {
    width:23px;
    height:23px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round
}
.network-copy {
    min-width:0;
    display:grid;
    grid-template-columns:minmax(0,1fr);
    align-items:baseline;
    gap:2px
}
.network-copy>span {
    font-size:11px;
    font-weight:700
}
.network-copy strong {
    font:21px var(--mono);
    white-space:nowrap
}
.network-copy small {
    color:var(--muted);
    font-size:8px;
    line-height:1.3
}
.service-state {
    display:flex;
    align-items:center;
    gap:5px;
    font-size:8px;
    font-weight:700;
    color:var(--muted)
}
.service-state i {
    width:7px;
    height:7px;
    border-radius:50%;
    background:#98a2b3
}
.service-state.connected {
    color:var(--green)
}
.service-state.connected i {
    background:var(--green)
}
.service-state.disconnected {
    color:var(--crimson)
}
.service-state.disconnected i {
    background:var(--crimson)
}
.operations-note {
    margin:12px 0 0;
    color:var(--muted);
    font-size:9px;
    line-height:1.6
}
.flight-heading {
    align-items:center
}
.plane-icon {
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    border-radius:50%;
    background:#edf3fb;
    color:var(--blue);
    font-size:20px;
    transform:rotate(12deg)
}
.arrival-date {
    display:grid;
    gap:7px;
    color:var(--muted);
    font-size:9px;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:.6px
}
.arrival-date input {
    width:100%;
    border:1px solid #d0d5dd;
    border-radius:6px;
    background:#fff;
    color:var(--ink);
    padding:9px 10px
}
.flight-summary {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    margin:13px 0 16px
}
.flight-summary div {
    display:grid;
    gap:4px;
    padding:10px 7px;
    text-align:center;
    border:1px solid var(--line);
    border-radius:7px;
    background:#fafbfd
}
.flight-summary strong {
    font:18px var(--mono)
}
.flight-summary span {
    color:var(--muted);
    font-size:8px
}
.flight-table {
    border:1px solid var(--line);
    border-radius:8px;
    overflow:hidden
}
.flight-table-head {
    display:grid;
    grid-template-columns:1.25fr .9fr .7fr .9fr;
    gap:7px;
    padding:10px;
    background:#f5f7fa;
    color:var(--muted);
    font-size:8px;
    font-weight:700;
    letter-spacing:.4px;
    text-transform:uppercase
}
.flight-table-head span:nth-child(n+2) {
    text-align:right
}
.flight-rows {
    max-height:330px;
    overflow-y:auto
}
.flight-country-row {
    display:grid;
    grid-template-columns:1.25fr .9fr .7fr .9fr;
    align-items:center;
    gap:7px;
    padding:11px 10px;
    border-top:1px solid #eef0f3;
    font-size:9px
}
.flight-country-row:first-child {
    border-top:0
}
.flight-country-row>span:nth-child(n+2) {
    text-align:right
}
.flight-origin {
    min-width:0;
    font-weight:700;
    overflow-wrap:anywhere
}
.flight-origin small,.flight-number small {
    display:block;
    margin-top:3px;
    color:var(--muted);
    font-size:7px;
    font-weight:500
}
.flight-number,.flight-eta {
    font-family:var(--mono)
}
.flight-number {
    min-width:0;
    overflow-wrap:anywhere
}
.flight-status-chip {
    display:inline-block;
    justify-self:end;
    border-radius:12px;
    background:#fff7e2;
    color:#89651a;
    padding:4px 6px;
    font-size:7px;
    font-weight:700;
    line-height:1.25;
    text-align:center!important
}
.flight-status-chip.landed {
    background:#edf7f0;
    color:var(--green)
}
.flight-status-chip.delayed,.flight-status-chip.cancelled {
    background:#fff3f2;
    color:var(--crimson)
}
.flight-status-chip.active {
    background:#edf3fb;
    color:var(--blue)
}
.flight-empty {
    display:grid;
    justify-items:center;
    gap:7px;
    padding:28px 12px;
    text-align:center;
    color:var(--muted)
}
.flight-empty-icon {
    color:#9fb1cd;
    font-size:24px
}
.flight-empty strong {
    color:var(--ink);
    font-size:11px
}
.flight-empty>span:last-child {
    font-size:9px;
    line-height:1.5
}
.page-heading {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    margin-bottom:24px
}
h1 {
    font-size:26px;
    line-height:1.35;
    letter-spacing:-.6px;
    margin:7px 0 8px;
    overflow-wrap:anywhere
}
.page-heading p {
    font-size:12px;
    color:var(--muted);
    margin:0
}
.connection {
    font-size:10px;
    font-weight:600;
    white-space:nowrap;
    border:1px solid var(--line);
    border-radius:20px;
    padding:7px 11px;
    background:white;
    color:var(--muted)
}
.connection.connected {
    color:var(--green);
    background:#edf7f0;
    border-color:#d3e8da
}
.connection.failed {
    color:var(--crimson);
    background:#fff3f2;
    border-color:#f0d6d5
}
.toolbar {
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
    background:white;
    border:1px solid var(--line);
    border-radius:8px;
    padding:14px 16px
}
.day-filter {
    display:flex;
    align-items:center;
    gap:12px;
    font-size:11px;
    font-weight:600
}
select {
    background:#fff;
    border:1px solid #d0d5dd;
    border-radius:5px;
    color:var(--ink);
    padding:9px 30px 9px 10px;
    max-width:100%
}
.timezone {
    font-size:10px;
    color:var(--muted)
}
.toolbar-actions {
    display:flex;
    align-items:center;
    gap:9px;
    margin-left:auto;
    flex-wrap:wrap
}
.auto-refresh {
    font-size:10px;
    display:flex;
    align-items:center;
    gap:5px;
    color:var(--muted);
    margin-right:5px
}
.auto-refresh input {
    accent-color:var(--green)
}
.button {
    border:1px solid #d0d5dd;
    background:#fff;
    color:var(--ink);
    border-radius:5px;
    padding:9px 12px;
    font-size:11px;
    font-weight:600
}
.button:hover {
    background:#f2f4f7
}
.button.primary {
    background:var(--ink);
    border-color:var(--ink);
    color:white
}
.scope-note {
    font-size:10px;
    color:var(--muted);
    line-height:1.8;
    margin:13px 0 22px
}
.notice {
    margin-top:16px;
    padding:14px 16px;
    border:1px solid #edcccb;
    border-left:3px solid var(--crimson);
    background:#fff5f4;
    color:#843728;
    font-size:12px;
    line-height:1.6;
    border-radius:5px
}
.kpi-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
    margin-bottom:22px
}
.kpi {
    background:white;
    border:1px solid var(--line);
    border-left:3px solid var(--ink);
    border-radius:6px;
    padding:19px 18px;
    min-width:0
}
.kpi.checked {
    border-left-color:var(--green)
}
.kpi.missing {
    border-left-color:var(--crimson)
}
.kpi h2 {
    text-transform:uppercase;
    color:var(--muted);
    font-size:9px;
    font-weight:600;
    letter-spacing:1px;
    margin:0 0 12px
}
.kpi>strong {
    font-size:34px;
    line-height:1.2;
    letter-spacing:-1px;
    font-weight:700;
    overflow-wrap:anywhere
}
.kpi strong small {
    font-size:15px;
    font-weight:500;
    letter-spacing:0;
    color:var(--muted)
}
.kpi p {
    font-size:9px;
    font-family:var(--mono);
    line-height:1.7;
    color:var(--muted);
    margin:7px 0 0
}
.overview-grid {
    display:grid;
    grid-template-columns:minmax(0,1.45fr) minmax(270px,1fr);
    gap:20px
}
.country-overview {
    margin-top:22px;
    container-type:inline-size
}
.attendance-type-table {
    margin-top:20px
}
.panel {
    background:white;
    border:1px solid var(--line);
    border-radius:8px;
    padding:22px;
    min-width:0
}
.panel-heading {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
    margin-bottom:22px
}
.panel h2 {
    font-size:14px;
    margin:0;
    font-weight:700
}
.panel-heading>span {
    font-family:var(--mono);
    font-size:10px;
    color:var(--muted)
}
.panel-heading p {
    font-size:11px;
    color:var(--muted);
    margin:7px 0 0
}
.programme-panel {
    padding:0;
    overflow:hidden
}
.programme-heading {
    padding:22px;
    margin:0
}
.programme-actions {
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    justify-content:flex-end
}
.programme-actions .button {
    text-decoration:none;
    white-space:nowrap
}
.programme-frame {
    display:block;
    width:100%;
    min-height:780px;
    height:calc(100vh - 255px);
    border:0;
    border-top:1px solid var(--line);
    background:#eef2f7
}
.programme-fallback {
    min-height:420px;
    display:grid;
    place-content:center;
    justify-items:center;
    gap:14px;
    padding:32px;
    text-align:center
}
.type-bars {
    display:grid;
    gap:18px;
    max-height:480px;
    overflow:auto;
    padding-right:2px
}
.bar-heading {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    font-size:11px;
    margin-bottom:7px
}
.bar-heading>span:first-child {
    overflow-wrap:anywhere
}
.bar-heading .numbers {
    font-family:var(--mono);
    font-size:10px;
    white-space:nowrap;
    color:var(--muted)
}
progress {
    appearance:none;
    -webkit-appearance:none;
    width:100%;
    height:7px;
    border:0;
    display:block;
    border-radius:8px;
    overflow:hidden;
    background:#eef0f3
}
progress::-webkit-progress-bar {
    background:#eef0f3;
    border-radius:8px
}
progress::-webkit-progress-value {
    background:var(--ink);
    border-radius:8px
}
progress::-moz-progress-bar {
    background:var(--ink);
    border-radius:8px
}
.attendance-panel {
    text-align:center
}
.attendance-panel .panel-heading {
    text-align:left
}
.donut {
    --percentage:0%;
    width:184px;
    height:184px;
    margin:28px auto 22px;
    border-radius:50%;
    background:conic-gradient(var(--green) var(--percentage),#e4e3da 0);
    display:grid;
    place-items:center
}
.donut>div {
    width:135px;
    height:135px;
    border-radius:50%;
    background:white;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:5px
}
.donut strong {
    font-size:30px;
    letter-spacing:-.5px
}
.donut span {
    font-size:9px;
    letter-spacing:1px;
    color:var(--muted)
}
.legend {
    display:flex;
    justify-content:center;
    gap:18px;
    font-size:10px;
    color:var(--muted)
}
.legend span {
    display:flex;
    align-items:center;
    gap:6px
}
.legend i {
    width:8px;
    height:8px;
    border-radius:2px
}
.green {
    background:var(--green)
}
.neutral {
    background:#e4e3da
}
.chart-note {
    font-size:10px;
    color:var(--muted);
    line-height:1.7;
    margin-top:16px
}
.search-label {
    display:grid;
    gap:5px;
    font-size:10px;
    color:var(--muted)
}
.search-label input {
    border:1px solid #d0d5dd;
    border-radius:5px;
    padding:9px 11px;
    font-size:12px;
    width:240px;
    max-width:100%
}
.table-scroll {
    overflow-x:auto
}
table {
    width:100%;
    border-collapse:collapse;
    white-space:nowrap;
    font-size:12px
}
th {
    text-align:right;
    background:#f7f8fa;
    font-size:9px;
    letter-spacing:.5px;
    text-transform:uppercase;
    color:var(--muted);
    padding:14px 12px;
    font-weight:600
}
th:first-child,td:first-child {
    text-align:left
}
td {
    text-align:right;
    border-bottom:1px solid #eef0f3;
    padding:16px 12px;
    font-family:var(--mono);
    font-size:11px
}
td:first-child {
    font-family:var(--sans);
    font-weight:600
}
td small {
    display:block;
    font-size:9px;
    font-weight:400;
    color:var(--muted);
    margin-top:5px
}
.table-note {
    font-size:10px;
    line-height:1.7;
    color:var(--muted);
    margin:18px 0 0
}
.empty-state {
    padding:28px 8px!important;
    text-align:center!important;
    font-family:var(--sans)!important;
    font-size:12px!important;
    font-weight:400!important;
    color:var(--muted);
    line-height:1.7
}
.data-footer {
    display:flex;
    justify-content:space-between;
    gap:15px;
    flex-wrap:wrap;
    border-top:1px solid var(--line);
    margin-top:25px;
    padding-top:17px;
    color:var(--muted);
    font-size:9px;
    font-family:var(--mono);
    line-height:1.7
}
.skip-link {
    position:fixed;
    left:12px;
    top:-100px;
    z-index:100;
    padding:12px;
    background:var(--ink);
    color:white
}
.skip-link:focus {
    top:12px
}
.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
}
.khmer-border {
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    height:18px;
    background-color:white;
    background-size:80px 18px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='18'%3E%3Cpath d='M0 17h80' stroke='%23C9A227'/%3E%3Cpath d='M10 2l6 6-6 6-6-6z' fill='%23A6192E'/%3E%3Cpath d='M30 2l6 6-6 6-6-6z' fill='%231B4D8F'/%3E%3Cpath d='M50 2l6 6-6 6-6-6z' fill='%23317E54'/%3E%3Cpath d='M70 2l6 6-6 6-6-6z' fill='%236B3FA0'/%3E%3C/svg%3E");
    z-index:20
}
@media(min-width:1500px) {
    .workspace {
        padding:36px
    }
    .kpi {
        padding:22px
    }
    .kpi>strong {
        font-size:40px
    }
}
@media(max-width:1150px) {
    .app {
        grid-template-columns:220px minmax(0,1fr) 300px
    }
    .workspace {
        padding:24px
    }
    .toolbar-actions {
        margin-left:0
    }
    .kpi-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .overview-grid {
        grid-template-columns:minmax(0,1fr)
    }
    .type-bars {
        max-height:none
    }
    .attendance-panel {
        min-height:330px
    }
}
@media(max-width:1000px) {
    .app {
        grid-template-columns:200px minmax(0,1fr)
    }
    .sidebar {
        grid-column:1;
        grid-row:1 / span 2
    }
    .main-content {
        grid-column:2;
        grid-row:1
    }
    .operations-rail {
        grid-column:2;
        grid-row:2;
        position:static;
        height:auto;
        max-height:none;
        border-left:0;
        border-top:1px solid var(--line);
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:24px;
        padding:24px
    }
    .operations-section+ .operations-section {
        border-top:0;
        border-left:1px solid var(--line);
        margin:0;
        padding:0 0 0 24px
    }
}
@media(max-width:1024px) {
    .app {
        grid-template-columns:minmax(0,1fr)
    }
    .sidebar {
        grid-column:auto;
        grid-row:auto;
        position:relative;
        height:auto
    }
    .main-content {
        grid-column:auto;
        grid-row:auto
    }
    .brand {
        padding:6px 16px
    }
    .brand-logo {
        width:82px
    }
    .nav-heading,.sidebar-note,.sidebar-footer {
        display:none
    }
    .navigation {
        display:flex;
        padding:6px 10px;
        gap:5px;
        overflow:auto
    }
    .nav-item {
        font-size:11px;
        padding:8px 10px;
        white-space:nowrap;
        flex:1;
        justify-content:center;
        gap:6px
    }
    .nav-item>span {
        font-size:15px;
        width:16px
    }
    .topbar {
        display:none
    }
    .platform-tag {
        display:none
    }
    .workspace {
        padding:12px 14px 30px
    }
    .page-heading {
        align-items:center;
        gap:10px;
        margin-bottom:10px
    }
    h1 {
        font-size:17px;
        line-height:1.3;
        margin:2px 0
    }
    .page-heading .eyebrow,.page-heading p {
        display:none
    }
    .connection {
        font-size:9px;
        padding:6px 8px
    }
    .day-filter {
        min-width:0;
        flex:1
    }
    .day-filter>span {
        position:absolute;
        width:1px;
        height:1px;
        padding:0;
        margin:-1px;
        overflow:hidden;
        clip:rect(0,0,0,0);
        white-space:nowrap;
        border:0
    }
    .day-filter select {
        width:100%;
        min-width:112px
    }
    .toolbar {
        flex-wrap:nowrap;
        gap:7px;
        padding:8px 10px
    }
    .timezone,.auto-refresh {
        display:none
    }
    .toolbar-actions {
        flex-wrap:nowrap;
        gap:7px;
        margin-left:0
    }
    .scope-note {
        display:none
    }
    .notice {
        margin-top:8px;
        padding:9px 11px;
        font-size:10px
    }
    #overview {
        display:flex;
        flex-direction:column
    }
    #overview .country-overview {
        order:-1;
        margin:0 0 12px
    }
    #overview .kpi-grid {
        order:1;
        margin:0
    }
    .kpi-grid {
        gap:12px
    }
    .kpi {
        padding:16px 12px
    }
    .kpi h2 {
        font-size:8px
    }
    .kpi>strong {
        font-size:30px
    }
    .kpi p {
        font-size:9px
    }
    .panel {
        padding:14px 12px
    }
    .panel-heading {
        flex-wrap:wrap;
        gap:10px;
        margin-bottom:12px
    }
    .country-view-bar {
        margin-bottom:12px
    }
    .view-switch button {
        padding:7px 10px
    }
    .bar-heading {
        font-size:10px;
        gap:8px
    }
    .bar-heading .numbers {
        font-size:9px
    }
    .search-label {
        width:100%
    }
    .search-label input {
        width:100%
    }
    .data-footer {
        font-size:9px
    }
    .operations-rail {
        grid-column:auto;
        grid-row:auto;
        grid-template-columns:minmax(0,1fr);
        padding:22px 16px 34px
    }
    .operations-section+ .operations-section {
        border-left:0;
        border-top:1px solid var(--line);
        margin-top:2px;
        padding:24px 0 0
    }
}

/* Country attendance can be viewed by status or as one circle per country. */
.country-view-bar { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:20px; }
.view-switch { display:inline-flex; padding:4px; gap:4px; background:#f1f3f7; border:1px solid var(--line); border-radius:8px; }
.view-switch button { border:0; border-radius:5px; background:transparent; padding:9px 14px; color:var(--muted); font-size:11px; font-weight:600; }
.view-switch button:hover { color:var(--blue); }
.view-switch button[aria-pressed="true"] { background:white; color:var(--blue); box-shadow:0 1px 4px #16213e14; }
.country-result-count { color:var(--muted); font:10px var(--mono); }
.ranking-legend { display:flex; gap:20px; flex-wrap:wrap; color:var(--ink); font-size:12px; font-weight:700; }
.ranking-legend span { display:flex; align-items:center; gap:8px; }
.ranking-legend i { width:13px; height:15px; border:2px solid currentColor; border-radius:3px; background:#fff; }
.ranking-legend .checked { color:#299b59; }
.ranking-legend .not-checked { color:#d43b4b; }
.ranking-note { margin:10px 0 18px; }
.ranking-stage { width:min(76%,760px); height:44px; margin:0 auto 22px; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,#213f72,#1b4d8f); border-radius:8px 8px 3px 3px; box-shadow:0 7px 18px #16213e24; }
.ranking-stage span { font-size:10px; font-weight:800; letter-spacing:1.5px; }
.ranking-seating { display:grid; gap:14px; padding:20px; border:1px solid #dce3ed; border-radius:12px; background:#fafbfd; }
.ranking-zone { display:grid; grid-template-columns:minmax(130px,190px) minmax(0,1fr); align-items:center; gap:24px; min-width:0; overflow:hidden; padding:18px 20px; border:1px solid #e1e6ee; border-radius:10px; background:#fff; }
.ranking-zone header { align-self:stretch; display:flex; flex-direction:column; justify-content:center; padding-right:18px; border-right:1px solid #e8ebf0; }
.ranking-position { width:max-content; padding:4px 8px; border-radius:999px; color:var(--blue); background:#edf3fb; font-size:9px; font-weight:800; letter-spacing:1px; text-transform:uppercase; }
.ranking-zone h3 { margin:10px 0 6px; color:var(--ink); font-size:14px; line-height:1.35; }
.ranking-zone header p { margin:0; color:var(--muted); font:10px/1.6 var(--mono); }
.ranking-zone header strong { color:var(--ink); }
.ranking-seat-grid { display:grid; grid-template-columns:repeat(auto-fill,12px); justify-content:center; align-content:center; gap:7px 5px; width:100%; min-width:0; min-height:34px; }
.ranking-seat { position:relative; width:12px; height:13px; border:2px solid currentColor; border-radius:3px 3px 4px 4px; background:#fff; box-shadow:inset 0 -3px 0 currentColor; }
.ranking-seat::before { content:""; position:absolute; left:0; right:0; top:-5px; height:4px; border:2px solid currentColor; border-bottom:0; border-radius:3px 3px 0 0; }
.ranking-seat.checked { color:#299b59; }
.ranking-seat.not-checked { color:#d43b4b; }
.ranking-zone-empty { grid-column:1/-1; color:var(--muted); font-size:11px; text-align:center; }
@container (max-width:720px) {
    .ranking-seating { padding:12px; }
    .ranking-stage { width:90%; }
    .ranking-zone { grid-template-columns:minmax(0,1fr); gap:16px; padding:16px 12px; }
    .ranking-zone header { padding:0 0 12px; border-right:0; border-bottom:1px solid #e8ebf0; }
}
.round-layout-legend { display:flex; gap:20px; flex-wrap:wrap; color:var(--ink); font-size:13px; font-weight:700; }
.round-layout-legend>span { display:flex; align-items:center; gap:8px; }
.round-layout-legend i { width:14px; height:17px; border-radius:3px; }
.round-layout-legend .neutral { background:#eef1f5; border:1px solid #dce2eb; }
.round-layout-note { margin:12px 0 18px; }
.country-round-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:18px 12px; padding:24px 12px; background:#fafbfd; border:1px solid #e0e6ef; border-radius:12px; }
.country-round-grid>.empty-state { grid-column:1/-1; }
.country-round-table { position:relative; display:flex; flex-direction:column; align-items:center; min-width:0; width:100%; max-width:310px; justify-self:center; border:1px solid transparent; border-radius:12px; background:transparent; padding:4px 4px 14px; color:var(--ink); }
.country-round-table:hover,.country-round-table[aria-expanded="true"] { border-color:#c4d4e8; background:#f0f5fc; }
.round-table-art { display:block; position:relative; width:100%; max-width:260px; }
.round-table-art svg { width:100%; display:block; }
.round-table-center { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:58%; display:grid; gap:6px; text-align:center; }
.round-table-flag { width:34px; height:auto; margin:0 auto; border-radius:3px; box-shadow:0 0 0 1px #0000001a; }
.round-table-center strong { font-size:15px; font-weight:700; line-height:1.3; overflow-wrap:anywhere; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
.round-table-center>span:last-child { font:700 14px var(--mono); color:var(--ink); }
.round-table-caption { color:var(--muted); font:10px var(--mono); }
.country-detail { margin-top:18px; padding:18px 20px; background:#f4f7fc; border:1px solid #d4dfee; border-radius:8px; }
.country-detail-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.country-detail h3 { font-size:15px; margin:0; overflow-wrap:anywhere; }
.country-detail dl { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin:20px 0 0; }
.country-detail dt { color:var(--muted); font-size:10px; }
.country-detail dd { font:22px var(--mono); margin:7px 0 0; }
@media(max-width:1024px) {
    .programme-heading { align-items:flex-start; }
    .programme-actions { width:100%; justify-content:flex-start; }
    .programme-frame { min-height:620px; height:75vh; }
    .country-round-grid { grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); padding:16px 8px; }
    .country-detail dl { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .country-detail { padding:16px; }
}
/* Secure access page */
.access-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 32px 18px;
    background:
        radial-gradient(circle at 50% 18%, rgba(49, 111, 180, .11), transparent 34%),
        #f5f7fa;
}

.access-card {
    width: min(100%, 440px);
    padding: 34px;
    border: 1px solid #dce2eb;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 22px 55px rgba(17, 35, 68, .12);
}

.access-logo {
    display: block;
    width: 148px;
    max-height: 142px;
    object-fit: contain;
    margin: 0 auto 24px;
}

.access-card .eyebrow { display: block; text-align: center; }
.access-card h1 { margin: 9px 0 8px; color: #101d3c; font-size: 1.45rem; text-align: center; }
.access-intro { margin: 0 0 26px; color: #65708a; text-align: center; line-height: 1.55; }
.access-form label { display: block; margin-bottom: 8px; color: #172443; font-weight: 700; font-size: .84rem; }

.passcode-field { position: relative; }
.passcode-field input {
    width: 100%;
    min-height: 50px;
    padding: 0 70px 0 14px;
    border: 1px solid #bfc9d8;
    border-radius: 8px;
    color: #101d3c;
    background: #fff;
    font: 600 .95rem "IBM Plex Mono", monospace;
    letter-spacing: .03em;
}
.passcode-field input:focus { outline: 3px solid rgba(35, 91, 166, .16); border-color: #235ba6; }
.passcode-field input:disabled { background: #edf0f4; }
.reveal-code {
    position: absolute;
    right: 6px;
    top: 6px;
    height: 38px;
    padding: 0 10px;
    border: 0;
    border-radius: 6px;
    color: #235ba6;
    background: transparent;
    font-weight: 700;
    cursor: pointer;
}
.access-submit {
    width: 100%;
    min-height: 48px;
    margin-top: 18px;
    border: 0;
    border-radius: 8px;
    color: #fff;
    background: #16213e;
    font-weight: 800;
    cursor: pointer;
}
.access-submit:hover { background: #25365f; }
.access-submit:disabled { cursor: not-allowed; opacity: .48; }
.access-validation { display: block; min-height: 20px; margin-top: 7px; color: #b51232; font-size: .78rem; }
.access-message { margin: 0 0 20px; padding: 12px; border-radius: 8px; font-size: .82rem; line-height: 1.45; }
.access-message.error { border: 1px solid #efb6c1; color: #8f1029; background: #fff2f4; }
.access-help { margin: 22px 0 0; color: #7a8498; font-size: .74rem; text-align: center; line-height: 1.5; }
.sidebar-footer { justify-content: space-between; gap: 10px; }
.sidebar-connection { display: inline-flex; align-items: center; gap: 7px; min-width: 0; }
.sign-out-button { border: 0; padding: 3px 0; color: #52617a; background: transparent; font: inherit; font-size: .7rem; cursor: pointer; text-decoration: underline; }
.sign-out-button:hover { color: #b51232; }

@media (max-width: 560px) {
    .access-page { padding: 18px 12px; }
    .access-card { padding: 26px 20px; }
    .access-logo { width: 128px; margin-bottom: 18px; }
}