:root {
    --bg: #f5f6f8;
    --brand-deep: #07054d;
    --brand-deep-rgb: 7, 5, 77;
    --card: rgba(7, 5, 77, 0.78);
    --card-strong: rgba(7, 5, 77, 0.92);
    --sidebar: rgba(7, 5, 77, 0.92);
    --surface-soft: rgba(255, 255, 255, 0.06);
    --surface-soft-hover: rgba(255, 255, 255, 0.12);
    --border: rgba(255, 255, 255, 0.10);
    --text: #f5f6f8;
    --text-on-light: #07054d;            /* navy on white */
    --muted: #b3bbc8;
    --muted-on-light: #4b557b;           /* muted navy on white */
    --primary: #1d4ed8;
    --primary-hover: #1e40af;
    --primary-soft: rgba(29, 78, 216, 0.22);
    --danger: #ff453a;
    --success: #30d158;
    --shadow: 0 12px 30px rgba(0, 0, 30, 0.25), 0 1px 3px rgba(0, 0, 30, 0.18);
    --radius-sm: 2px;
    --radius-md: 3px;
    --radius-lg: 4px;
    --radius-pill: 3px;
}

* { box-sizing: border-box; }

html, body {
    margin: 0; padding: 0;
    color: var(--text);
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display",
        "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}
body {
    min-height: 100vh;
    background-color: var(--bg);
    background-image: url('../img/webbg.png');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}
body.has-sidebar {
    padding-left: 260px;             /* room for fixed sidebar */
}
body.auth {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
body.auth .main-area {
    width: 100%;
    max-width: 460px;
}
body.auth .main-inner {
    padding: 24px;
}

a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: underline; }

/* Full-page loading overlay */
.loading-overlay {
    position: fixed;
    inset: 0;
    z-index: 99999;
    background-color: var(--bg);
    background-image: url('../img/webbg.png');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.18s ease;
}
.loading-overlay.show {
    opacity: 1;
    pointer-events: auto;
}
.loading-logo {
    width: 160px;
    height: 160px;
    object-fit: contain;
    animation: loadingSpin 1.1s linear infinite;
    filter: drop-shadow(0 6px 18px rgba(7, 5, 77, 0.18));
}
@keyframes loadingSpin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
    .loading-logo { animation-duration: 4s; }
}

/* ============================================================== */
/* Sidebar                                                         */
/* ============================================================== */
.sidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: 260px;
    height: 100vh;
    background: var(--sidebar);
    backdrop-filter: blur(28px) saturate(160%);
    -webkit-backdrop-filter: blur(28px) saturate(160%);
    border-right: 1px solid var(--border);
    padding: 22px 14px;
    display: flex;
    flex-direction: column;
    gap: 22px;
    z-index: 10;
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 6px 8px 10px;
    color: var(--text);
    text-decoration: none;
}
.sidebar-brand:hover { text-decoration: none; }
.brand-logo {
    height: 58px;
    width: 58px;
    object-fit: contain;
    display: block;
    border-radius: 10px;
}
.brand-text {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 26px;
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1;
}

.sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
}
.nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 12px;
    border-radius: 10px;
    color: var(--text);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.12s ease, color 0.12s ease;
    opacity: 0.85;
}
.nav-item:hover {
    background: var(--surface-soft-hover);
    text-decoration: none;
    opacity: 1;
}
.nav-item.active {
    background: var(--primary-soft);
    opacity: 1;
}
.nav-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}
.nav-badge {
    margin-left: auto;
    background: var(--primary);
    color: white;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    padding: 3px 7px;
    border-radius: 999px;
    min-width: 18px;
    text-align: center;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}
.nav-item.active .nav-badge {
    background: white;
    color: var(--brand-deep);
}
.nav-sub-item {
    padding-left: 38px;
    font-size: 13px;
    font-weight: 500;
    opacity: 0.75;
    position: relative;
}
.nav-sub-item .nav-sub-marker {
    position: absolute;
    left: 22px;
    top: 50%;
    width: 6px;
    height: 1px;
    background: rgba(255, 255, 255, 0.4);
    transform: translateY(-50%);
}
.nav-sub-item.active { opacity: 1; }

.sidebar-footer {
    border-top: 1px solid var(--border);
    padding-top: 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.user-card {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 6px 8px;
}
.user-name {
    font-size: 13px;
    font-weight: 600;
}
.sidebar-signout {
    width: 100%;
    text-align: center;
    padding: 8px 14px;
    border-radius: var(--radius-pill);
    border: 1px solid var(--border);
    background: var(--surface-soft);
    color: var(--text);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
}
.sidebar-signout:hover { background: var(--surface-soft-hover); }

/* ============================================================== */
/* Main area                                                       */
/* ============================================================== */
.main-area {
    min-height: 100vh;
}
.main-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 36px 40px 60px;
}
body.auth .main-area { width: 100%; }
body.auth .main-inner { padding: 24px; }

/* Headers */
.page-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 16px;
    margin-bottom: 28px;
    color: var(--brand-deep);
}
.page-header h1 {
    margin: 0;
    font-size: 36px;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.15;
    color: var(--brand-deep);
}
.page-header p {
    margin: 6px 0 0;
    color: var(--muted-on-light);
}
.page-header .muted { color: var(--muted-on-light); }
.header-actions { display: flex; gap: 8px; align-items: center; }

h2 { font-size: 20px; font-weight: 700; letter-spacing: -0.01em; }

.muted { color: var(--muted); }
.small { font-size: 12px; }
.spacer { flex: 1; }
.inline { display: inline-block; }

/* Anything sitting directly on the wavy page background uses navy text */
.on-bg, .dashboard-toolbar .muted { color: var(--muted-on-light); }

/* Pills sitting directly on the light wavy page background.
   They flip from translucent light styling to solid navy so they
   remain readable against the white pattern. */
.page-header .committee-tag,
.page-header .status-badge {
    background: var(--brand-deep);
    color: #ffffff;
    border-color: var(--brand-deep);
    box-shadow: 0 1px 2px rgba(7, 5, 77, 0.18);
}
.page-header .status-badge.status-debated {
    background: var(--primary);
    border-color: var(--primary);
    color: #ffffff;
}
.page-header .status-badge.status-pending {
    background: rgba(7, 5, 77, 0.4);
    color: #ffffff;
    border-color: rgba(7, 5, 77, 0.6);
}
.page-header .status-badge.status-passed {
    background: rgba(48, 209, 88, 0.95);
    color: #ffffff;
    border-color: rgba(48, 209, 88, 0.95);
}
.page-header .status-badge.status-failed {
    background: rgba(255, 69, 58, 0.95);
    color: #ffffff;
    border-color: rgba(255, 69, 58, 0.95);
}
.page-header .status-badge.status-summit {
    background: rgba(7, 5, 77, 0.95);
    color: #ffffff;
    border-color: rgba(7, 5, 77, 0.95);
}

/* Secondary buttons sitting on the wavy bg (e.g. ← Back) — navy outlined */
.header-actions button:not(.primary):not(.danger),
.header-actions .button:not(.primary):not(.danger) {
    background: rgba(7, 5, 77, 0.08);
    color: var(--brand-deep);
    border-color: rgba(7, 5, 77, 0.25);
}
.header-actions button:not(.primary):not(.danger):hover,
.header-actions .button:not(.primary):not(.danger):hover {
    background: rgba(7, 5, 77, 0.18);
    color: var(--brand-deep);
}

/* ============================================================== */
/* Role badges, committee tags                                     */
/* ============================================================== */
.role {
    display: inline-block;
    padding: 2px 9px;
    border-radius: var(--radius-pill);
    font-size: 10.5px;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.05em;
    vertical-align: middle;
}
.role-admin    { background: rgba(255, 69, 58, 0.18); color: #ff8a82; border: 1px solid rgba(255, 69, 58, 0.4); }
.role-chair    { background: var(--primary); color: #ffffff; border: 1px solid var(--primary); }
.role-delegate { background: rgba(125, 95, 240, 0.20); color: #cbb8ff; border: 1px solid rgba(125, 95, 240, 0.4); }
.role-advisor  { background: rgba(48, 209, 88, 0.18); color: #aeefc1; border: 1px solid rgba(48, 209, 88, 0.4); }
.role-uploader { background: rgba(74, 108, 240, 0.22); color: #b3c2ff; border: 1px solid rgba(74, 108, 240, 0.4); }
.role-reviewer { background: rgba(125, 95, 240, 0.20); color: #cbb8ff; border: 1px solid rgba(125, 95, 240, 0.4); }

.committee-tag {
    display: inline-block;
    padding: 3px 11px;
    border-radius: var(--radius-pill);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    background: rgba(74, 108, 240, 0.20);
    color: #c7d6ff;
    border: 1px solid rgba(74, 108, 240, 0.42);
    margin-left: 8px;
    vertical-align: middle;
}

/* ============================================================== */
/* Cards                                                            */
/* ============================================================== */
.card {
    background: var(--card);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 22px 24px;
    margin-bottom: 20px;
    box-shadow: var(--shadow);
}
.card h2 { margin-top: 0; }

/* ============================================================== */
/* Forms                                                            */
/* ============================================================== */
.form { display: flex; flex-direction: column; gap: 14px; }
.form label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-weight: 600;
    font-size: 13px;
}
.form label.inline {
    flex-direction: row;
    align-items: center;
    gap: 8px;
    font-weight: 400;
}
.form input[type=text], .form input[type=password], .form input[type=file],
.form input[type=search], .form textarea, .form select {
    padding: 10px 14px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    font: inherit;
    background: rgba(255, 255, 255, 0.97);
    color: var(--text-on-light);
}
.form input::placeholder,
.form textarea::placeholder {
    color: var(--muted-on-light);
}
.form input[type=file] {
    padding: 8px 10px;
}
.form input:focus, .form textarea:focus, .form select:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(74, 108, 240, 0.28);
}
.form-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}
.form-grid .full-width { grid-column: 1 / -1; }
.form-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 8px;
}

/* ============================================================== */
/* Buttons (pill shape, Apple Music style)                          */
/* ============================================================== */
button, .button {
    padding: 9px 18px;
    border-radius: var(--radius-pill);
    border: 1px solid var(--border);
    background: var(--surface-soft);
    cursor: pointer;
    font: inherit;
    font-weight: 600;
    font-size: 13px;
    color: var(--text);
    text-decoration: none;
    display: inline-block;
    line-height: 1.2;
    transition: background 0.15s ease, transform 0.05s ease;
}
button:hover, .button:hover {
    background: var(--surface-soft-hover);
    text-decoration: none;
}
button:active, .button:active { transform: scale(0.98); }
button.primary, .primary.button {
    background: var(--primary);
    color: white;
    border-color: var(--primary);
}
button.primary:hover, .primary.button:hover {
    background: var(--primary-hover);
    border-color: var(--primary-hover);
}
button.danger {
    background: rgba(255, 69, 58, 0.92);
    color: white;
    border-color: rgba(255, 69, 58, 0.92);
}
button.danger:hover { background: var(--danger); }
.link-button {
    background: none;
    border: none;
    padding: 0;
    color: var(--primary);
    cursor: pointer;
    font-weight: 500;
}
.link-button:hover { text-decoration: underline; background: none; }

/* ============================================================== */
/* Auth (login) page                                                */
/* ============================================================== */
.auth-shell {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    padding: 24px;
}
.auth-flash { margin-bottom: 12px; }
.auth-card {
    background: var(--card);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    padding: 32px 32px 24px;
    border: 1px solid var(--border);
    border-radius: 22px;
    box-shadow: var(--shadow);
}
.auth-card h1 {
    margin: 0 0 6px;
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -0.02em;
}
.auth-card .form button.primary { width: 100%; padding: 12px; font-size: 14px; }
.auth-logo {
    margin-top: 28px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
    display: flex;
    justify-content: center;
}
.auth-logo img {
    width: 160px;
    height: auto;
    display: block;
    opacity: 0.95;
}

/* ============================================================== */
/* Tables                                                           */
/* ============================================================== */
.data-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--card);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow);
}
.data-table th, .data-table td {
    text-align: left;
    padding: 12px 18px;
    border-bottom: 1px solid var(--border);
    vertical-align: top;
}
.data-table th {
    background: rgba(255, 255, 255, 0.05);
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
}
.data-table tr:last-child td { border-bottom: none; }
.data-table tbody tr:hover td { background: rgba(255, 255, 255, 0.04); }
.data-table .actions { display: flex; gap: 6px; flex-wrap: wrap; }
.data-table a { color: #b3c2ff; }
.data-table a:hover { color: #d6deff; }

/* Inline forms (admin user reset, etc.) */
.inline-form { display: inline-flex; gap: 4px; align-items: center; }
.inline-form input[type=text] {
    padding: 5px 10px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: var(--radius-pill);
    font: inherit;
    font-size: 12px;
    width: 130px;
    background: rgba(255, 255, 255, 0.97);
    color: var(--text-on-light);
}
.inline-form button {
    padding: 5px 12px;
    font-size: 12px;
}
/* Match committee/delegation dropdowns in inline forms to the create-user form look */
.inline-form select,
.assign-form select {
    padding: 10px 14px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    font: inherit;
    font-size: 14px;
    background: rgba(255, 255, 255, 0.97);
    color: var(--text-on-light);
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2307054d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
    background-repeat: no-repeat;
    background-position: right 10px center;
    padding-right: 32px;
    cursor: pointer;
}
.inline-form select:focus,
.assign-form select:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(74, 108, 240, 0.28);
}
.assign-form .country-picker .country-picker-button {
    padding: 10px 14px;
    border-radius: 10px;
    font-size: 14px;
}

/* Toolbar with search + count */
.dashboard-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}
.dashboard-toolbar input[type=search] {
    flex: 1;
    min-width: 240px;
    max-width: 420px;
    padding: 10px 16px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: var(--radius-pill);
    font: inherit;
    background: rgba(255, 255, 255, 0.97);
    color: var(--text-on-light);
}
.dashboard-toolbar input[type=search]::placeholder { color: var(--muted-on-light); }
.dashboard-toolbar input[type=search]:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(74, 108, 240, 0.28);
}

/* Committee filter pills (Apple Music segmented control vibe) */
.filter-pills {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}
.filter-pill {
    padding: 7px 16px;
    border-radius: var(--radius-pill);
    border: 1px solid rgba(7, 5, 77, 0.18);
    background: rgba(255, 255, 255, 0.6);
    color: var(--brand-deep);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
.filter-pill:hover {
    background: rgba(255, 255, 255, 0.85);
    border-color: rgba(7, 5, 77, 0.3);
}
.filter-pill.active {
    background: var(--brand-deep);
    color: white;
    border-color: var(--brand-deep);
}

/* ============================================================== */
/* Dashboard tabs (Resolutions / Debated)                         */
/* ============================================================== */
.dash-tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid rgba(255,255,255,0.1);
    margin-bottom: 22px;
}
.dash-tab-btn {
    padding: 10px 22px;
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    color: var(--muted);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: color 0.12s, border-color 0.12s;
    display: flex;
    align-items: center;
    gap: 8px;
}
.dash-tab-btn:hover { color: var(--text); }
.dash-tab-btn.active {
    color: var(--text);
    border-bottom-color: var(--primary);
}
.dash-tab-btn .tab-count {
    background: rgba(255,255,255,0.12);
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 999px;
}
.dash-tab-btn.active .tab-count {
    background: var(--primary);
    color: #fff;
}
.dash-tab-panel { display: none; }
.dash-tab-panel.active { display: block; }

/* ============================================================== */
/* Flash messages                                                   */
/* ============================================================== */
.flash-area { margin-bottom: 16px; }
.flash {
    padding: 12px 18px;
    border-radius: var(--radius-md);
    margin-bottom: 8px;
    border: 1px solid transparent;
    background: var(--brand-deep);
    color: #ffffff;
    font-weight: 600;
    font-size: 14px;
    box-shadow: 0 6px 18px rgba(0, 0, 30, 0.18);
    display: flex;
    align-items: center;
    gap: 10px;
}
.flash::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: currentColor;
    flex-shrink: 0;
    opacity: 0.85;
}
.flash-error   {
    background: #d92c2c;
    border-color: #b91c1c;
    color: #ffffff;
}
.flash-success {
    background: #16a34a;
    border-color: #0f7a37;
    color: #ffffff;
}

.empty-state {
    text-align: center;
    padding: 60px 20px;
    color: var(--muted);
    background: var(--card);
    border: 1px dashed var(--border);
    border-radius: var(--radius-lg);
}

.error-card {
    text-align: center;
    padding: 60px 20px;
    background: var(--card);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border);
}
.error-card h1 { font-size: 56px; margin: 0; color: var(--muted); }

/* ============================================================== */
/* PDF viewer + amendments side panel                              */
/* ============================================================== */
.viewer-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 20px;
    align-items: start;
}
.viewer-layout.viewer-layout-final {
    grid-template-columns: minmax(0, 1fr);
}
@media (max-width: 1000px) {
    .viewer-layout { grid-template-columns: 1fr; }
}

.pdf-pane {
    background: var(--card);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow);
}

/* Google Doc embed */
.gdoc-pane {
    background: var(--card);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow);
    display: flex;
    flex-direction: column;
    min-height: 600px;
}
.gdoc-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: rgba(255, 255, 255, 0.05);
    border-bottom: 1px solid var(--border);
    color: var(--text);
}
.gdoc-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    font-size: 13px;
    color: #c7d6ff;
}
.gdoc-frame {
    flex: 1;
    width: 100%;
    border: 0;
    background: white;
    min-height: 70vh;
}
.pdf-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: rgba(255, 255, 255, 0.05);
    border-bottom: 1px solid var(--border);
    color: var(--text);
}
.pdf-toolbar button {
    padding: 5px 12px;
    font-size: 12px;
}
.pdf-container {
    overflow: auto;
    max-height: calc(100vh - 240px);
    padding: 18px;
    background: #232336;
    text-align: center;
}
#pdf-canvas {
    background: white;
    box-shadow: 0 4px 14px rgba(0,0,0,0.4);
    max-width: 100%;
    height: auto;
    border-radius: 4px;
}

.comments-pane {
    background: var(--card);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 18px;
    box-shadow: var(--shadow);
    position: sticky;
    top: 20px;
    max-height: calc(100vh - 40px);
    display: flex;
    flex-direction: column;
}
.comments-pane h2 {
    margin: 0 0 14px;
    font-size: 17px;
}
.comments-list {
    flex: 1;
    overflow-y: auto;
    margin-bottom: 12px;
    padding-right: 4px;
}
.comment {
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 12px 14px;
    margin-bottom: 8px;
    background: rgba(255, 255, 255, 0.05);
}
.comment-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 4px;
}
.comment-header strong { color: var(--text); font-size: 13px; }
.comment-body {
    white-space: pre-wrap;
    word-wrap: break-word;
    font-size: 13px;
}
.comment-meta { font-size: 11px; }
.comment-page-badge {
    display: inline-block;
    background: rgba(74, 108, 240, 0.22);
    color: #c7d6ff;
    padding: 1px 9px;
    border-radius: var(--radius-pill);
    font-size: 11px;
    font-weight: 700;
    border: 1px solid rgba(74, 108, 240, 0.4);
    cursor: pointer;
    font-family: inherit;
}
.comment-page-badge:hover {
    background: rgba(74, 108, 240, 0.36);
}
.comment-page-badge.static { cursor: default; }
.comment-page-badge.static:hover { background: rgba(74, 108, 240, 0.22); }
.comment-delete {
    background: none;
    border: none;
    color: #ff8a82;
    cursor: pointer;
    font-size: 11px;
    padding: 0;
    font-weight: 600;
}
.comment-delete:hover { text-decoration: underline; background: none; }

.comment-form textarea {
    min-height: 70px;
    resize: vertical;
}
/* Help page */
.help-summary p { margin: 4px 0; }
.help-section h3 {
    margin: 22px 0 8px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #c7d6ff;
}
.help-section h3:first-of-type { margin-top: 12px; }
.help-section .help-list {
    margin: 0 0 6px;
    padding-left: 22px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    line-height: 1.55;
}
.help-section .help-list code {
    background: rgba(255, 255, 255, 0.08);
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 13px;
}

/* Settings page */
.settings-list {
    margin: 12px 0 0;
    padding: 0;
    display: grid;
    gap: 6px;
}
.settings-row {
    display: grid;
    grid-template-columns: 200px 1fr;
    align-items: center;
    gap: 16px;
    padding: 10px 12px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
}
.settings-row dt {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--muted);
    margin: 0;
}
.settings-row dd { margin: 0; font-size: 14px; }
@media (max-width: 600px) {
    .settings-row { grid-template-columns: 1fr; gap: 4px; }
}

.chair-amendment-notice {
    padding: 12px 14px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.04);
    border: 1px dashed var(--border);
    color: var(--muted);
    line-height: 1.45;
}

/* Amendment location input (single field, same look as the textarea) */
.amend-location-input {
    width: 100%;
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.97);
    color: var(--text-on-light);
    font: inherit;
    font-size: 14px;
}
.amend-location-input:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(74, 108, 240, 0.28);
}
.amend-location-pill {
    display: inline-block;
    padding: 2px 9px;
    border-radius: var(--radius-pill);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.03em;
    background: rgba(125, 95, 240, 0.20);
    color: #d6c5ff;
    border: 1px solid rgba(125, 95, 240, 0.4);
    margin: 4px 0 6px;
}

/* Working-text editor / readonly */
.working-text-card {
    background: var(--card);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 18px 22px;
    box-shadow: var(--shadow);
    margin-bottom: 20px;
}
.working-text-header { margin-bottom: 10px; }
.working-text-header h2 { margin: 0 0 4px; font-size: 18px; }
.working-text-status {
    margin-left: 6px;
    transition: color 0.2s ease;
}
.working-text-status[data-tone="editing"] { color: #ffd86b; }
.working-text-status[data-tone="saving"]  { color: #ffd86b; }
.working-text-status[data-tone="saved"]   { color: #aeefc1; }
.working-text-status[data-tone="updated"] { color: #c7d6ff; }
.working-text-status[data-tone="error"]   { color: #ffb8b2; }
.working-text-form { display: flex; flex-direction: column; gap: 10px; }
.working-text-area {
    width: 100%;
    min-height: 220px;
    padding: 14px 16px;
    border-radius: var(--radius-md);
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.97);
    color: var(--text-on-light);
    font: 14px / 1.55 ui-monospace, SFMono-Regular, Menlo, monospace;
    resize: vertical;
}
.working-text-area:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(74, 108, 240, 0.28);
}
.working-text-readonly {
    margin: 0;
    padding: 14px 16px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid var(--border);
    color: var(--text);
    font: 14px / 1.55 ui-monospace, SFMono-Regular, Menlo, monospace;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/* ============================================================== */
/* International Summit                                            */
/* ============================================================== */
.summit-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 20px;
}
.committee-card {
    background: var(--card);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 22px 24px;
    box-shadow: var(--shadow);
}
.committee-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border);
}
.committee-header h2 {
    margin: 0;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: -0.01em;
}
.committee-resolutions {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.resolution-link {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 12px 14px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
    text-decoration: none;
    color: var(--text);
}
.resolution-link:hover {
    background: rgba(255, 255, 255, 0.10);
    text-decoration: none;
}
.resolution-link-pending {
    background: rgba(29, 78, 216, 0.13);
    border: 1px solid rgba(29, 78, 216, 0.4);
    border-left: 3px solid var(--primary);
}
.resolution-link-pending:hover {
    background: rgba(29, 78, 216, 0.22);
}
.resolution-title { font-weight: 600; font-size: 14px; }
.empty-committee {
    padding: 12px 0 4px;
    margin: 0;
    font-style: italic;
}

/* Committee leadership + agenda sections inside committee cards */
.committee-section { margin-top: 16px; }
.committee-section:first-of-type { margin-top: 0; }
.section-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
    margin-bottom: 8px;
}
.people-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.people-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
}
.role-tag {
    display: inline-block;
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: rgba(74, 108, 240, 0.18);
    color: #c7d6ff;
    border: 1px solid rgba(74, 108, 240, 0.38);
    padding: 2px 8px;
    border-radius: var(--radius-pill);
    flex-shrink: 0;
}
.person-name { font-weight: 500; }
.agenda-list {
    padding-left: 22px;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.agenda-list li {
    font-size: 13px;
    line-height: 1.55;
}

/* Schedule page */
.schedule-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 20px;
}
.schedule-card { padding: 22px 24px; }
.schedule-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.schedule-list li {
    display: flex;
    gap: 14px;
    padding: 9px 12px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
    align-items: center;
}
.schedule-time {
    font-weight: 600;
    font-size: 12.5px;
    min-width: 108px;
    color: #b3c2ff;
    font-variant-numeric: tabular-nums;
}
.schedule-detail { font-size: 13px; }

/* General Committee organisational tree */
.org-tree {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    align-items: start;
}
@media (max-width: 1100px) {
    .org-tree { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
    .org-tree { grid-template-columns: 1fr; }
}
.org-branch {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-width: 0;
}
.org-node {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}
.org-card {
    background: var(--card);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 14px 16px;
    box-shadow: var(--shadow);
    text-align: center;
    position: relative;
}
.org-root > .org-card {
    border-radius: var(--radius-lg);
    padding: 18px 20px;
    background: var(--card-strong);
}
.org-gc > .org-card {
    background: rgba(255, 255, 255, 0.06);
    box-shadow: none;
}
.org-names {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.org-name {
    font-weight: 700;
    font-size: 14px;
    color: var(--text);
}
.org-root .org-name { font-size: 16px; letter-spacing: -0.01em; }
.org-title {
    font-size: 12px;
    color: var(--muted);
    margin-top: 4px;
    line-height: 1.35;
}
.org-pill {
    display: inline-block;
    margin-top: 8px;
    padding: 2px 9px;
    border-radius: var(--radius-pill);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.org-pill-exec {
    background: rgba(74, 108, 240, 0.22);
    color: #c7d6ff;
    border: 1px solid rgba(74, 108, 240, 0.4);
}
.org-pill-gc {
    background: rgba(125, 95, 240, 0.20);
    color: #d6c5ff;
    border: 1px solid rgba(125, 95, 240, 0.4);
}

.org-children {
    list-style: none;
    padding: 0;
    margin: 16px 0 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: relative;
}
/* Vertical trunk descending from parent to children */
.org-children::before {
    content: "";
    position: absolute;
    top: -14px;
    left: 50%;
    width: 1px;
    height: 14px;
    background: rgba(255, 255, 255, 0.25);
}
.org-child {
    position: relative;
    padding-top: 12px;
}
/* Vertical stub above each child connecting it to the trunk above */
.org-child::before {
    content: "";
    position: absolute;
    top: -10px;
    left: 50%;
    width: 1px;
    height: 22px;
    background: rgba(255, 255, 255, 0.25);
}

/* Large people list (used on Executive + General Committee pages) */
.people-list-large {
    gap: 10px;
}
.people-list-large li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 12px 14px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
}
.people-list-large .person-name {
    font-weight: 600;
    font-size: 14px;
}
.people-list-large .person-title {
    color: var(--muted);
    font-size: 12.5px;
}

/* Contact page */
.contact-recipient {
    margin: 0 0 4px;
    color: var(--muted);
    font-size: 13px;
}
.contact-recipient strong { color: var(--text); }

/* Compact country picker variant for inline forms */
.assign-form { flex-wrap: nowrap; align-items: center; gap: 6px; }
.assign-form .country-picker { min-width: 120px; }
.assign-form .country-picker-button { padding: 5px 10px; font-size: 12px; }
.assign-form .country-picker .country-flag { width: 18px; height: 14px; }
.assign-form .country-picker-popup { min-width: 240px; }

.delegation-cell { display: inline-flex; align-items: center; gap: 8px; }

/* Scrollable wrapper so wide tables stay inside their card */
.table-scroll {
    overflow-x: auto;
    margin: 0 -24px;          /* extend to card edges */
    padding: 0 24px;
    -webkit-overflow-scrolling: touch;
}
.table-scroll .data-table {
    min-width: 0;
}

/* Admin users table: stack the per-row action forms vertically so each row
   stays narrow enough to fit the card; the table-scroll catches any spill. */
.users-table {
    table-layout: auto;
}
.users-table .actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    min-width: 240px;
}
.users-table .actions .inline-form {
    flex-wrap: nowrap;
    width: 100%;
    gap: 4px;
}
.users-table .actions .inline-form input[type="text"] {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
}
.users-table .actions .assign-form .country-picker {
    flex: 1 1 auto;
    min-width: 110px;
}
.users-table th, .users-table td {
    white-space: nowrap;
    padding: 10px 12px;
}
.users-table td:first-child code { font-size: 12px; }

/* Flags removed site-wide. Markup is left in templates for backwards
   compatibility but never renders. */
.country-flag,
.country-flag-inline { display: none !important; }

/* Country picker (searchable dropdown) */
.country-picker {
    position: relative;
    width: 100%;
}
.country-picker-button {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.97);
    color: var(--muted-on-light);
    font: inherit;
    cursor: pointer;
    text-align: left;
}
.country-picker.has-value .country-picker-button { color: var(--text-on-light); }
.country-picker .country-picker-label { flex: 1; }
.country-picker .country-picker-chev { color: var(--muted-on-light); }
.country-picker .country-flag {
    width: 24px;
    height: 18px;
    border-radius: 2px;
    object-fit: cover;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.06);
}
.country-picker.open .country-picker-button {
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(74, 108, 240, 0.25);
}

.country-picker-popup {
    /* When opened, JS moves this to <body> and adds .country-picker-popup-modal
       to make it a centered modal that escapes any card stacking context. */
    position: fixed;
    z-index: 99999;
    background: rgba(15, 13, 67, 0.98);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: 0 24px 60px rgba(0, 0, 30, 0.55);
    padding: 10px;
    max-height: 320px;
    display: flex;
    flex-direction: column;
}
.country-picker-popup-modal {
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%);
    width: min(520px, 92vw) !important;
    max-height: min(70vh, 620px) !important;
    padding: 14px !important;
}
.country-picker-popup-modal .country-picker-search {
    font-size: 14px;
    padding: 10px 14px;
}
.country-picker-popup-modal .country-picker-list li {
    padding: 9px 12px;
    font-size: 14px;
}
.country-picker-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 20, 0.55);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 99998;
    animation: pickerFade 0.12s ease;
}
@keyframes pickerFade {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.country-picker-popup[hidden] { display: none !important; }
.country-picker-list li[hidden] { display: none !important; }
.country-picker.open { z-index: 1000; position: relative; }
.country-picker-search {
    padding: 8px 12px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.06);
    color: var(--text);
    font: inherit;
    margin-bottom: 6px;
}
.country-picker-search::placeholder { color: var(--muted); }
.country-picker-search:focus { outline: none; border-color: var(--primary); }
.country-picker-list {
    list-style: none;
    padding: 0;
    margin: 0;
    overflow-y: auto;
    flex: 1;
}
.country-picker-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 10px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 13px;
    color: var(--text);
}
.country-picker-list li:hover {
    background: rgba(255, 255, 255, 0.08);
}
.country-picker-list li.picker-chairboard {
    color: var(--text);
    background: rgba(74, 108, 240, 0.14);
    border: 1px solid rgba(74, 108, 240, 0.3);
    margin-bottom: 4px;
}
.country-picker-list li.picker-chairboard:hover {
    background: rgba(74, 108, 240, 0.26);
}
.country-picker-list li.picker-chairboard .chairboard-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 18px;
    border-radius: 4px;
    background: rgba(74, 108, 240, 0.4);
    color: #e5ecff;
}
.country-picker-list li.picker-divider {
    height: 1px;
    padding: 0;
    margin: 4px 4px 6px;
    background: rgba(255, 255, 255, 0.12);
    pointer-events: none;
}
.country-picker.is-chairboard .country-picker-label::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--primary);
    margin-right: 8px;
    vertical-align: middle;
}
.country-flag-inline {
    width: 20px;
    height: 15px;
    border-radius: 2px;
    object-fit: cover;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.06);
    vertical-align: middle;
    margin-right: 6px;
}

/* Status badges (pending / debated / passed / failed / summit) */
.status-badge {
    display: inline-block;
    padding: 3px 11px;
    border-radius: var(--radius-pill);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin-left: 8px;
    vertical-align: middle;
    border: 1px solid transparent;
}
.status-pending {
    background: rgba(255, 196, 0, 0.18);
    color: #ffd86b;
    border-color: rgba(255, 196, 0, 0.4);
}
.status-debated {
    background: var(--primary);
    color: #ffffff;
    border-color: var(--primary);
}
.status-passed {
    background: rgba(48, 209, 88, 0.95);
    color: #ffffff;
    border-color: rgba(48, 209, 88, 0.95);
}
.status-failed {
    background: rgba(255, 69, 58, 0.95);
    color: #ffffff;
    border-color: rgba(255, 69, 58, 0.95);
}
.status-summit {
    background: rgba(7, 5, 77, 0.92);
    color: #ffffff;
    border-color: rgba(7, 5, 77, 0.92);
}
.status-awaiting {
    background: #f59e0b;
    color: #1f1500;
    border-color: #b45309;
}
.page-header .status-badge.status-awaiting {
    background: #f59e0b;
    color: #1f1500;
    border-color: #b45309;
}
.status-in-debate {
    background: rgba(16, 185, 129, 0.2);
    color: #34d399;
    border-color: rgba(16, 185, 129, 0.5);
}

/* Approval banner */
.approval-banner {
    background: var(--card);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 14px 18px;
    box-shadow: var(--shadow);
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.approval-banner-chair {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.22), rgba(7, 5, 77, 0.82));
    border-color: rgba(245, 158, 11, 0.55);
}
.approval-banner-uploader {
    background: linear-gradient(135deg, rgba(7, 5, 77, 0.78), rgba(7, 5, 77, 0.92));
    border-color: var(--border);
}
.approval-text {
    flex: 1;
    color: var(--text);
    font-size: 14px;
    line-height: 1.45;
}
.approval-text strong { color: #ffe5a1; }
.approval-banner-uploader .approval-text strong { color: #ffd86b; }

/* Chair action row (status row + summit toggle) on document view */
.chair-actions {
    background: var(--card);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 14px 18px;
    box-shadow: var(--shadow);
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.chair-actions-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.chair-actions-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
    min-width: 168px;
}
.status-btn {
    padding: 8px 16px;
    border-radius: var(--radius-pill);
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.06);
    color: var(--text);
    font: inherit;
    font-weight: 600;
    font-size: 13px;
    cursor: pointer;
    transition: background 0.12s ease, transform 0.05s ease;
}
.status-btn:hover { background: rgba(255, 255, 255, 0.14); }
.status-btn:active { transform: scale(0.98); }
.status-btn[disabled], .status-btn.active { cursor: default; opacity: 1; }

.status-btn-pending.active {
    background: rgba(255, 196, 0, 0.88);
    color: #1f1500;
    border-color: rgba(255, 196, 0, 0.88);
}
.status-btn-debated {
    background: var(--primary);
    color: #ffffff;
    border-color: var(--primary);
}
.status-btn-debated:hover { background: var(--primary-hover); border-color: var(--primary-hover); }
.status-btn-debated.active {
    background: var(--primary);
    color: #ffffff;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.35);
}
.status-btn-passed {
    background: rgba(48, 209, 88, 0.95);
    color: #ffffff;
    border-color: rgba(48, 209, 88, 0.95);
}
.status-btn-passed:hover { background: rgba(48, 209, 88, 1); }
.status-btn-passed.active {
    box-shadow: 0 0 0 3px rgba(48, 209, 88, 0.35);
}
.status-btn-failed {
    background: rgba(255, 69, 58, 0.95);
    color: #ffffff;
    border-color: rgba(255, 69, 58, 0.95);
}
.status-btn-failed:hover { background: rgba(255, 69, 58, 1); }
.status-btn-failed.active {
    box-shadow: 0 0 0 3px rgba(255, 69, 58, 0.35);
}

.status-btn-summit {
    background: rgba(7, 5, 77, 0.92);
    color: #ffffff;
    border-color: rgba(7, 5, 77, 0.92);
}
.status-btn-summit:hover { background: rgba(7, 5, 77, 1); }
.status-btn-summit-on {
    background: var(--primary);
    color: #ffffff;
    border-color: var(--primary);
}
.status-btn-summit-on:hover { background: var(--primary-hover); }

/* Tally Tracker */
.tally-card { padding: 22px 24px; }
.tally-table .num { text-align: right; }
.tally-table th.num { text-align: right; }
.tally-count {
    display: inline-block;
    min-width: 26px;
    padding: 2px 8px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.06);
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    transition: background 0.2s ease;
}
.flash-bump {
    animation: tallyBump 0.45s ease;
}
@keyframes tallyBump {
    0%   { transform: scale(1);   background: rgba(74, 108, 240, 0.45); }
    40%  { transform: scale(1.18); background: rgba(74, 108, 240, 0.55); }
    100% { transform: scale(1);   background: rgba(255, 255, 255, 0.06); }
}
.tally-total {
    font-size: 15px;
    font-variant-numeric: tabular-nums;
    color: #c7d6ff;
}
.tally-record {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.tally-btn {
    padding: 5px 11px;
    font-size: 12px;
    font-weight: 700;
    border-radius: var(--radius-pill);
    border: 1px solid;
    cursor: pointer;
    transition: background 0.12s ease, transform 0.05s ease;
}
.tally-btn:active { transform: scale(0.96); }
.tally-btn-poi {
    background: rgba(255, 196, 0, 0.92);
    color: #1f1500;
    border-color: rgba(255, 196, 0, 0.92);
}
.tally-btn-poi:hover { background: rgba(255, 196, 0, 1); }
.tally-btn-speech {
    background: rgba(74, 108, 240, 0.95);
    color: #ffffff;
    border-color: rgba(74, 108, 240, 0.95);
}
.tally-btn-speech:hover { background: var(--primary-hover); }
.tally-btn-amendment {
    background: rgba(125, 95, 240, 0.95);
    color: #ffffff;
    border-color: rgba(125, 95, 240, 0.95);
}
.tally-btn-amendment:hover { background: rgba(125, 95, 240, 1); }

.tally-recent {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.tally-recent li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 13px;
    flex-wrap: wrap;
}
.tally-recent .mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.tally-event {
    display: inline-block;
    padding: 2px 9px;
    border-radius: var(--radius-pill);
    font-size: 11px;
    font-weight: 700;
}
.tally-event-poi { background: rgba(255, 196, 0, 0.18); color: #ffd86b; border: 1px solid rgba(255, 196, 0, 0.4); }
.tally-event-speech { background: rgba(74, 108, 240, 0.22); color: #c7d6ff; border: 1px solid rgba(74, 108, 240, 0.4); }
.tally-event-amendment { background: rgba(125, 95, 240, 0.22); color: #d6c5ff; border: 1px solid rgba(125, 95, 240, 0.4); }

/* Main Submitter line */
.main-submitter {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 12px 0 8px;
    padding: 8px 14px;
    border-radius: 12px;
    background: rgba(7, 5, 77, 0.06);
    border: 1px solid rgba(7, 5, 77, 0.16);
    width: fit-content;
}
.ms-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--brand-deep);
    opacity: 0.65;
}
.ms-name {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: var(--brand-deep);
}
.ms-name .country-flag-inline {
    width: 28px;
    height: 21px;
    border-radius: 3px;
}

/* Voting card */
.voting-card {
    background: var(--card);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 18px 22px;
    box-shadow: var(--shadow);
    margin-bottom: 20px;
}
.voting-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 14px;
}
.voting-header h2 { margin: 0; font-size: 18px; }
.voting-status-pill {
    display: inline-block;
    padding: 3px 12px;
    border-radius: var(--radius-pill);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.voting-pill-closed {
    background: rgba(255, 255, 255, 0.08);
    color: var(--muted);
    border: 1px solid var(--border);
}
.voting-pill-open {
    background: rgba(48, 209, 88, 0.9);
    color: #ffffff;
}
.voting-pill-locked {
    background: rgba(7, 5, 77, 0.95);
    color: #ffffff;
}
.vote-tally {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.tally-block {
    padding: 14px 16px;
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.04);
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.tally-block.tally-for {
    background: rgba(48, 209, 88, 0.18);
    border-color: rgba(48, 209, 88, 0.42);
}
.tally-block.tally-against {
    background: rgba(255, 69, 58, 0.18);
    border-color: rgba(255, 69, 58, 0.42);
}
.tally-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--primary);
}
.tally-number {
    font-size: 26px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: var(--text);
}
.tally-block.tally-for .tally-number   { color: #c7f5d8; }
.tally-block.tally-against .tally-number { color: #ffc8c4; }

.vote-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.vote-btn {
    padding: 10px 22px;
    border-radius: var(--radius-pill);
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.06);
    color: var(--text);
    font: inherit;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    transition: background 0.12s ease, transform 0.05s ease;
}
.vote-btn:hover { background: rgba(255, 255, 255, 0.14); }
.vote-btn-for {
    border-color: rgba(48, 209, 88, 0.5);
    color: #aeefc1;
}
.vote-btn-for:hover {
    background: rgba(48, 209, 88, 0.92);
    color: #ffffff;
    border-color: rgba(48, 209, 88, 0.92);
}
.vote-btn-for.active {
    background: rgba(48, 209, 88, 0.92);
    color: #ffffff;
    border-color: rgba(48, 209, 88, 0.92);
    box-shadow: 0 0 0 3px rgba(48, 209, 88, 0.35);
}
.vote-btn-against {
    border-color: rgba(255, 69, 58, 0.5);
    color: #ffb8b2;
}
.vote-btn-against:hover {
    background: rgba(255, 69, 58, 0.92);
    color: #ffffff;
    border-color: rgba(255, 69, 58, 0.92);
}
.vote-btn-against.active {
    background: rgba(255, 69, 58, 0.92);
    color: #ffffff;
    border-color: rgba(255, 69, 58, 0.92);
    box-shadow: 0 0 0 3px rgba(255, 69, 58, 0.35);
}

.voting-controls {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding-top: 12px;
    border-top: 1px solid var(--border);
}

/* Agenda item line on resolution view */
.agenda-line {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 8px 0 6px;
    padding: 6px 12px;
    border-radius: var(--radius-pill);
    background: rgba(7, 5, 77, 0.08);
    border: 1px solid rgba(7, 5, 77, 0.2);
}
.agenda-label {
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--brand-deep);
    opacity: 0.7;
}
.agenda-text {
    font-size: 13px;
    color: var(--brand-deep);
    font-weight: 600;
}

.upload-naming-hint {
    margin: 0;
    padding: 8px 12px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--border);
}
.upload-naming-hint code {
    background: rgba(255, 255, 255, 0.1);
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 12.5px;
}

/* Locked committee field on upload form (chair) */
.locked-field {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--border);
}
.locked-field .committee-tag {
    margin-left: 0;
    background: var(--brand-deep);
    color: #ffffff;
    border-color: var(--brand-deep);
}

/* Note Passing */
.notes-banner {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: var(--radius-pill);
    background: rgba(255, 196, 0, 0.16);
    border: 1px solid rgba(255, 196, 0, 0.36);
    color: #ffd86b;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 20px;
}
.notes-compose-header {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 4px;
}
.notes-compose-header:has(.committee-select) {
    grid-template-columns: 1.1fr 0.7fr 1.2fr;
}
@media (max-width: 720px) {
    .notes-compose-header,
    .notes-compose-header:has(.committee-select) { grid-template-columns: 1fr; }
}
.committee-select {
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.97);
    color: var(--text-on-light);
    font: inherit;
    width: 100%;
}
.notes-compose-meta { display: flex; flex-direction: column; gap: 6px; }
.notes-from-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid var(--border);
    font-weight: 600;
    color: var(--text);
}
.notes-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.note-item {
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.04);
}
.note-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 6px;
    flex-wrap: wrap;
}
.note-direction {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    font-size: 13px;
    color: var(--text);
}
.note-delegation {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.note-arrow { color: var(--muted); }
.note-body {
    font-size: 13px;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/* My Committee page */
.my-committee-hero {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}
.my-committee-hero .hero-text { display: flex; flex-direction: column; gap: 4px; }
.my-committee-hero .hero-committee {
    margin: 0;
    font-size: 32px;
    font-weight: 800;
    letter-spacing: -0.02em;
}
.my-committee-hero .hero-delegation {
    color: var(--muted);
    font-size: 13px;
}
.my-committee-hero .committee-tag {
    font-size: 13px;
    padding: 6px 16px;
}
.my-committee-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 0;
}
@media (max-width: 720px) {
    .my-committee-grid { grid-template-columns: 1fr; }
}

/* ================================================================== */
/* My Committee page — uniform redesign                               */
/* ================================================================== */
.mc-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}
@media (max-width: 700px) { .mc-info-grid { grid-template-columns: 1fr; } }

.mc-label {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: #5b6481;
    margin-bottom: 12px;
}

/* Leadership list */
.mc-plain-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.mc-person-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 4px;
    background: rgba(29, 78, 216, 0.06);
    border: 1px solid rgba(29, 78, 216, 0.15);
}
.mc-person-secondary {
    background: #f7f8fb;
    border-color: #e3e5ec;
}
.mc-person-role {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #ffffff;
    background: #1d4ed8;
    padding: 2px 8px;
    border-radius: 2px;
    flex-shrink: 0;
    white-space: nowrap;
}
.mc-person-secondary .mc-person-role {
    background: #e3e5ec;
    color: #5b6481;
}
.mc-person-name { font-size: 13.5px; font-weight: 600; color: #07054d; }

/* Agenda */
.mc-agenda-plain {
    padding-left: 20px;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: #1a2245;
    font-size: 13.5px;
    line-height: 1.5;
}

/* Card with flush table inside */
.mc-section-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px 10px;
    border-bottom: 1px solid #e3e5ec;
}
.mc-section-title {
    font-size: 13px;
    font-weight: 700;
    color: #07054d;
}
.mc-res-group-label {
    padding: 7px 20px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: #5b6481;
    background: #f7f8fb;
    border-top: 1px solid #e3e5ec;
    border-bottom: 1px solid #e3e5ec;
}
.mc-res-group-warn { color: #92600a; background: #fffbf0; border-color: #f0d890; }
.mc-res-group-done { color: #1d4ed8; background: #f0f3ff; border-color: #c9d1f2; }

.mc-res-table {
    width: 100%;
    border: none;
    box-shadow: none;
    border-radius: 0;
}
.mc-res-table td { border-bottom: 1px solid #eef0f5; padding: 11px 16px; }
.mc-res-table tbody tr:last-child td { border-bottom: none; }
.mc-res-table thead th { padding: 8px 16px; }
.mc-row-debated td { opacity: 0.65; }
.mc-row-debated:hover td { opacity: 1; }
.res-locked td { opacity: 0.6; }
.res-locked:hover td { opacity: 0.85; }
.td-action { text-align: right; white-space: nowrap; }
.td-action a { color: #1d4ed8; font-weight: 600; font-size: 13px; }
.mc-empty-res {
    padding: 20px;
    color: #5b6481;
    font-size: 13.5px;
    font-style: italic;
    margin: 0;
    border-top: 1px solid #e3e5ec;
}

/* ================================================================== */
/* My Committee page — dark-mode hero (kept but simplified)           */
/* ================================================================== */
.mc-hero {
    background: linear-gradient(135deg, rgba(29, 78, 216, 0.22) 0%, rgba(7, 5, 77, 0.72) 100%);
    border: 1px solid rgba(29, 78, 216, 0.32);
    padding: 28px 32px;
    margin-bottom: 20px;
}
.mc-hero-eyebrow {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #93b4ff;
    margin-bottom: 6px;
}
.mc-hero-name {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -0.025em;
    margin: 0 0 10px;
    color: var(--text);
    line-height: 1.1;
}
.mc-hero-delegation {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.6);
}
.mc-hero-delegation strong { color: var(--text); font-weight: 600; }
.mc-hero-flag { width: 22px; height: 16px; border-radius: 2px; object-fit: cover; }

.mc-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}
@media (max-width: 700px) { .mc-info-grid { grid-template-columns: 1fr; } }

.mc-label {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--muted);
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.mc-label-warn { color: #d39200; }
.mc-count {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
    border-radius: 999px;
    padding: 1px 7px;
    letter-spacing: 0;
}

/* Leadership */
.mc-chair-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.mc-chair-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: var(--radius-md);
    background: rgba(29, 78, 216, 0.12);
    border: 1px solid rgba(29, 78, 216, 0.25);
}
.mc-chair-deputy {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.07);
}
.mc-chair-role-tag {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    background: var(--primary);
    color: #ffffff;
    padding: 3px 9px;
    border-radius: var(--radius-pill);
    flex-shrink: 0;
    white-space: nowrap;
}
.mc-chair-role-deputy {
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.55);
}
.mc-chair-name { font-size: 14px; font-weight: 600; color: var(--text); }

/* Agenda */
.mc-agenda-list { list-style: none; padding: 0; margin: 0; counter-reset: agenda; display: flex; flex-direction: column; gap: 8px; }
.mc-agenda-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 13.5px;
    line-height: 1.5;
    padding: 11px 14px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.07);
    counter-increment: agenda;
    color: var(--text);
}
.mc-agenda-item::before {
    content: counter(agenda);
    font-size: 10.5px;
    font-weight: 800;
    color: var(--primary);
    background: rgba(29, 78, 216, 0.18);
    border: 1px solid rgba(29, 78, 216, 0.32);
    border-radius: 50%;
    min-width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 1px;
}

/* Resolution lists */
.mc-resolution-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 7px; }
.mc-resolution-link {
    display: block;
    padding: 13px 16px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.07);
    text-decoration: none;
    color: var(--text);
    transition: background 0.12s ease, border-color 0.12s ease;
}
.mc-resolution-link:hover {
    background: rgba(255, 255, 255, 0.09);
    border-color: rgba(255, 255, 255, 0.14);
    text-decoration: none;
    color: var(--text);
}
.mc-resolution-pending {
    background: rgba(29, 78, 216, 0.1);
    border: 1px solid rgba(29, 78, 216, 0.28);
    border-left: 3px solid var(--primary);
}
.mc-resolution-pending:hover { background: rgba(29, 78, 216, 0.18); border-color: rgba(29, 78, 216, 0.4); }
.mc-resolution-debated { opacity: 0.7; }
.mc-resolution-debated:hover { opacity: 1; }
.mc-res-title {
    font-size: 14.5px;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    line-height: 1.35;
}
.mc-res-meta {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 12.5px;
    color: var(--muted);
    flex-wrap: wrap;
}
.mc-dot { opacity: 0.35; }
.mc-amendment-count { color: #93b4ff; font-weight: 600; }

/* Delegation grid */
.mc-delegation-grid {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 8px;
}
.mc-delegation-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.07);
}
.mc-delegation-left { display: flex; align-items: center; gap: 10px; min-width: 0; }
.mc-delegation-flag {
    width: 28px;
    height: 20px;
    object-fit: cover;
    border-radius: 3px;
    flex-shrink: 0;
}
.mc-delegation-country {
    font-size: 13px;
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mc-delegation-display {
    font-size: 11px;
    color: var(--muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mc-empty { color: var(--muted); font-size: 13.5px; font-style: italic; padding: 4px 0; margin: 0; }

/* Amendments grouped by committee */
.amendments-section { padding: 22px 24px; }
.amendments-section .committee-header { margin-bottom: 14px; }
.data-table.embedded {
    box-shadow: none;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
}

/* Amendments overview table column */
.amendment-body {
    max-width: 480px;
    white-space: pre-wrap;
    word-wrap: break-word;
    font-size: 13px;
}

/* ============================================================== */
/* Responsive: collapse sidebar on narrow viewports                */
/* ============================================================== */
@media (max-width: 820px) {
    body.has-sidebar { padding-left: 0; }
    .sidebar {
        position: static;
        width: 100%;
        height: auto;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        padding: 14px 16px;
        gap: 12px;
    }
    .sidebar-brand { flex: 1; padding: 0; }
    .sidebar-nav {
        flex-direction: row;
        flex: 1 0 100%;
        order: 3;
        overflow-x: auto;
        gap: 4px;
    }
    .nav-item span { display: none; }
    .nav-item { padding: 8px 10px; }
    .sidebar-footer {
        border-top: none;
        padding-top: 0;
        flex-direction: row;
        align-items: center;
        gap: 10px;
    }
    .user-card { padding: 0; }
    .sidebar-signout { width: auto; padding: 6px 14px; }
    .main-inner { padding: 24px 18px 40px; }
    .page-header h1 { font-size: 26px; }
}

/* ============================================================== */
/* Phone-specific tweaks (<= 600px) — Apple Music style            */
/* Bottom tab bar nav, slim top header, fully stacked content      */
/* ============================================================== */
@media (max-width: 600px) {
    html, body { font-size: 15px; }
    body.has-sidebar { padding-left: 0; padding-top: 56px; padding-bottom: 72px; }

    /* ---------- Sidebar reshaped into top header + bottom tab bar ---------- */
    .sidebar {
        position: static;
        background: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border: none;
        padding: 0;
        display: contents;          /* let children position themselves */
    }

    /* Slim top header — brand on left, sign-out on right */
    .sidebar-brand {
        position: fixed;
        top: 0; left: 0;
        height: 56px;
        z-index: 30;
        display: flex;
        align-items: center;
        padding: 0 14px;
        gap: 10px;
        background: var(--sidebar);
        backdrop-filter: blur(24px) saturate(160%);
        -webkit-backdrop-filter: blur(24px) saturate(160%);
        border-bottom: 1px solid var(--border);
    }
    .sidebar-brand { right: 0; }    /* span full width */
    .brand-logo { height: 32px; width: 32px; border-radius: 8px; }
    .brand-text { font-size: 18px; font-weight: 700; }

    .sidebar-footer {
        position: fixed;
        top: 8px; right: 12px;
        z-index: 31;
        border-top: none;
        padding: 0;
        gap: 8px;
        display: flex;
        align-items: center;
    }
    .user-card { display: none; }   /* hide name+role chip in top bar */
    .sidebar-signout {
        width: auto;
        padding: 6px 12px;
        font-size: 12px;
    }

    /* Bottom tab bar — Apple Music style */
    .sidebar-nav {
        position: fixed;
        bottom: 0; left: 0; right: 0;
        z-index: 30;
        flex-direction: row;
        justify-content: flex-start;
        align-items: stretch;
        gap: 6px;
        padding: 6px 10px calc(6px + env(safe-area-inset-bottom));
        background: var(--sidebar);
        backdrop-filter: blur(24px) saturate(160%);
        -webkit-backdrop-filter: blur(24px) saturate(160%);
        border-top: 1px solid var(--border);
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    .sidebar-nav::-webkit-scrollbar { display: none; }
    .nav-item {
        flex: 0 0 auto;
        min-width: 0;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 0;
        padding: 8px 10px;
        border-radius: 10px;
        opacity: 0.75;
        position: relative;
    }
    .nav-item span { display: none; }
    .nav-icon { width: 22px; height: 22px; }
    .nav-item.active { background: transparent; opacity: 1; color: var(--primary-hover); }
    .nav-item.active .nav-icon { color: var(--primary-hover); }
    .nav-badge {
        position: absolute;
        top: 2px;
        right: 8px;
        margin-left: 0;
        padding: 1px 5px;
        font-size: 10px;
        min-width: 16px;
    }

    /* ---------- Main content padding (room for fixed bars) ---------- */
    .main-area { min-height: calc(100vh - 56px - 72px); }
    .main-inner { padding: 16px 14px 24px; }

    /* ---------- Page header stacks, no truncation ---------- */
    .page-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        margin-bottom: 16px;
    }
    .page-header h1 { font-size: 22px; }
    .header-actions { flex-wrap: wrap; width: 100%; }
    .header-actions button,
    .header-actions .button { flex: 1 1 auto; text-align: center; }

    /* ---------- Cards and forms ---------- */
    .card, .amendments-section { padding: 16px; }
    .form-grid { grid-template-columns: 1fr; gap: 12px; }
    .form-actions {
        flex-direction: column-reverse;
        align-items: stretch;
    }
    .form-actions button,
    .form-actions .button { width: 100%; text-align: center; }
    .form input[type=text], .form input[type=password], .form input[type=file],
    .form input[type=search], .form textarea, .form select,
    .amend-location-input, .committee-select,
    .dashboard-toolbar input[type=search],
    .inline-form input[type=text] {
        font-size: 16px;             /* prevent iOS auto-zoom */
    }

    /* ---------- Dashboard toolbar full-width search ---------- */
    .dashboard-toolbar { gap: 8px; }
    .dashboard-toolbar input[type=search] {
        flex: 1 1 100%;
        max-width: none;
        min-width: 0;
    }

    /* ---------- Filter pills wrap (no horizontal scroll) ---------- */
    .filter-pills {
        flex-wrap: wrap;
        gap: 6px;
        margin-bottom: 14px;
    }
    .filter-pill { padding: 6px 12px; font-size: 12.5px; }

    /* ---------- Tables → stacked cards. No horizontal scroll. ---------- */
    .data-table,
    .data-table thead,
    .data-table tbody,
    .data-table tr,
    .data-table th,
    .data-table td {
        display: block;
        width: 100%;
    }
    .data-table {
        border: none;
        background: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        box-shadow: none;
        border-radius: 0;
    }
    .data-table thead {
        position: absolute;
        left: -9999px;               /* hide column headers */
    }
    .data-table tr {
        background: var(--card);
        border: 1px solid var(--border);
        border-radius: var(--radius-md);
        padding: 12px 14px;
        margin-bottom: 10px;
        box-shadow: var(--shadow);
    }
    .data-table tbody tr:hover td { background: transparent; }
    .data-table td {
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
        padding: 8px 0;
        white-space: normal;
        word-wrap: break-word;
        overflow-wrap: anywhere;
    }
    .data-table tr td:first-child { padding-top: 0; }
    .data-table tr td:last-child  { padding-bottom: 0; border-bottom: none; }
    .data-table td:empty { display: none; }
    .data-table .actions { flex-wrap: wrap; }
    .amendment-body {
        white-space: pre-wrap;
        max-width: none;
    }

    /* ---------- Status badges / pills: bigger tap targets, no clipping ---- */
    .status-badge,
    .voting-status-pill,
    .committee-tag,
    .role {
        white-space: normal;
        line-height: 1.3;
        padding: 6px 12px;
        font-size: 12px;
    }
    .page-header .status-badge,
    .page-header .committee-tag { padding: 8px 14px; font-size: 13px; }

    /* ---------- Auth (login) ---------- */
    body.auth { padding: 0; }
    body.auth.has-sidebar { padding-top: 0; padding-bottom: 0; }
    body.auth .main-inner { padding: 16px; }
    .auth-card { padding: 24px 20px 20px; border-radius: 18px; }
    .auth-card h1 { font-size: 24px; }
    .auth-logo img { width: 130px; }

    /* ---------- PDF / Gdoc viewer ---------- */
    .viewer-layout { gap: 14px; }
    .pdf-container {
        max-height: 55vh;
        padding: 10px;
    }
    .gdoc-pane { min-height: 380px; }
    .gdoc-frame { min-height: 55vh; }
    .comments-pane {
        position: static;
        max-height: none;
        padding: 14px;
    }

    /* ---------- Committee hero ---------- */
    .my-committee-hero {
        flex-direction: column;
        align-items: flex-start;
    }
    .my-committee-hero .hero-committee { font-size: 24px; }

    /* ---------- Loading overlay ---------- */
    .loading-logo { width: 110px; height: 110px; }

    /* ---------- Prevent any horizontal overflow ---------- */
    html, body { overflow-x: hidden; }
    .card, .note-body, .comment-body { overflow-wrap: anywhere; }
}

/* ============================================================== */
/* Professional refresh — modelundp.org-inspired institutional look */
/* Overrides at the end so each rule wins by cascade order.         */
/* ============================================================== */

/* Cleaner page surface — drop the busy wave background for a calm canvas */
body {
    background-image: none;
    background-color: #f3f4f7;
}
.loading-overlay {
    background-image: none;
    background-color: #f3f4f7;
}

/* Headline accent: a refined serif for top-of-page titles, common
   institutional cue (UN / academic publications). Falls back gracefully. */
.page-header h1,
.auth-card h1,
.my-committee-hero .hero-committee {
    font-family: "Iowan Old Style", "Charter", "Source Serif Pro",
                 Georgia, "Times New Roman", serif;
    font-weight: 700;
    letter-spacing: -0.015em;
}

/* Sidebar: solid institutional navy, no glassy blur */
.sidebar {
    background: var(--brand-deep);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-right: 1px solid rgba(0, 0, 0, 0.15);
}
.nav-item { opacity: 0.78; transition: background 0.12s, opacity 0.12s; }
.nav-item:hover { background: rgba(255, 255, 255, 0.08); opacity: 1; }
.nav-item.active {
    background: rgba(255, 255, 255, 0.12);
    opacity: 1;
    box-shadow: inset 3px 0 0 #ffffff;
}
.sidebar-footer { border-top: 1px solid rgba(255, 255, 255, 0.12); }
.sidebar-signout {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.18);
}
.sidebar-signout:hover { background: rgba(255, 255, 255, 0.16); }

/* Content surfaces become white panels with navy text + subtle border.
   This is the single biggest "less AI / more institutional" lever. */
.card,
.data-table,
.empty-state,
.error-card,
.auth-card,
.gdoc-pane,
.pdf-pane,
.comments-pane,
.amendments-section {
    background: #ffffff;
    color: var(--brand-deep);
    border: 1px solid #e3e5ec;
    box-shadow: 0 1px 2px rgba(7, 5, 77, 0.04),
                0 8px 24px rgba(7, 5, 77, 0.06);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-radius: 12px;
}
.card h1, .card h2, .card h3, .card h4,
.comments-pane h1, .comments-pane h2,
.gdoc-pane h2, .pdf-pane h2,
.amendments-section h1, .amendments-section h2 {
    color: var(--brand-deep);
}
.card p, .card li, .card dd, .card label,
.amendments-section p, .amendments-section li {
    color: #2b3556;
}
.card .muted, .data-table .muted, .amendments-section .muted,
.muted-on-dark { color: #6b7390; }

/* Tables: white surface, navy text, clean column rule */
.data-table th {
    background: #f7f8fb;
    color: #5b6481;
    border-bottom: 1px solid #e3e5ec;
    font-weight: 700;
}
.data-table td {
    color: #1f2540;
    border-bottom: 1px solid #eef0f5;
}
.data-table tbody tr:hover td { background: #f9fafd; }
.data-table a { color: var(--primary); }
.data-table a:hover { color: var(--primary-hover); }

/* Forms: white surface, navy labels, neutral input borders */
.form label { color: var(--brand-deep); }
.form input[type=text], .form input[type=password], .form input[type=file],
.form input[type=search], .form textarea, .form select,
.amend-location-input, .committee-select,
.dashboard-toolbar input[type=search],
.inline-form input[type=text],
.inline-form select, .assign-form select {
    background: #ffffff;
    border: 1px solid #d4d8e3;
    color: var(--brand-deep);
}
.form input:focus, .form textarea:focus, .form select:focus,
.inline-form select:focus, .assign-form select:focus,
.dashboard-toolbar input[type=search]:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(74, 108, 240, 0.18);
}

/* Buttons: flatter, more solid, restrained */
button, .button {
    background: #ffffff;
    color: var(--brand-deep);
    border: 1px solid #d4d8e3;
    border-radius: 8px;
    box-shadow: 0 1px 0 rgba(7, 5, 77, 0.04);
    padding: 8px 16px;
    font-weight: 600;
    letter-spacing: 0.01em;
    transition: background 0.12s, border-color 0.12s;
}
button:hover, .button:hover {
    background: #f3f4f9;
    border-color: #b9c0d2;
}
button.primary, .primary.button {
    background: var(--brand-deep);
    border-color: var(--brand-deep);
    color: #ffffff;
}
button.primary:hover, .primary.button:hover {
    background: #15125e;
    border-color: #15125e;
}
button.danger {
    background: #d92c2c;
    border-color: #d92c2c;
    color: #ffffff;
}
button.danger:hover { background: #b91c1c; border-color: #b91c1c; }

/* Filter pills: cleaner segmented control */
.filter-pill {
    background: #ffffff;
    border: 1px solid #d4d8e3;
    color: var(--brand-deep);
    border-radius: 8px;
    box-shadow: none;
}
.filter-pill:hover { background: #f3f4f9; border-color: #b9c0d2; }
.filter-pill.active {
    background: var(--brand-deep);
    color: #ffffff;
    border-color: var(--brand-deep);
}

/* Status badges & role tags: solid institutional fills (no neon glow) */
.role {
    border-radius: 4px;
    padding: 3px 8px;
    font-weight: 700;
    border: none;
}
.role-admin    { background: #fde7e7; color: #b91c1c; }
.role-chair    { background: #1d4ed8; color: #ffffff; }
.role-delegate { background: #ede4ff; color: #4b2a99; }
.role-advisor  { background: #def7e5; color: #146c2f; }
.role-uploader { background: #e5ebff; color: #1d2e8a; }
.role-reviewer { background: #ede4ff; color: #4b2a99; }

.committee-tag {
    background: #eef1ff;
    color: var(--brand-deep);
    border: 1px solid #c9d1f2;
    border-radius: 4px;
    padding: 3px 9px;
    font-weight: 700;
}

.status-badge {
    border-radius: 4px;
    border: 1px solid transparent;
    padding: 4px 10px;
    font-weight: 700;
}

/* Header pills already navy on page bg — keep but flatten the shadow */
.page-header .status-badge,
.page-header .committee-tag { box-shadow: none; }

/* Flashes: keep colors, drop heavy shadow */
.flash { box-shadow: 0 1px 2px rgba(7, 5, 77, 0.06); border-radius: 8px; }

/* Page header */
.page-header { border-bottom: 1px solid #e3e5ec; padding-bottom: 18px; }
.page-header h1 { font-size: 32px; }

/* Auth card */
.auth-card { border-radius: 14px; }

/* Toolbar count text */
.dashboard-toolbar .muted { color: #5b6481; }

/* Comment / note items inside white panels */
.comment, .note-item {
    background: #f7f8fb;
    border: 1px solid #e3e5ec;
    color: #1f2540;
}
.comment-header strong, .note-direction { color: var(--brand-deep); }
.comment-body, .note-body { color: #1f2540; }
.comment-meta, .note-arrow { color: #6b7390; }

/* Empty state */
.empty-state { color: #6b7390; border-style: solid; }
.empty-state p { color: #6b7390; }

/* PDF viewer toolbar */
.pdf-toolbar, .gdoc-toolbar {
    background: #f7f8fb;
    border-bottom: 1px solid #e3e5ec;
    color: var(--brand-deep);
}
.gdoc-label { color: var(--brand-deep); }
.pdf-container { background: #eceef4; }

/* Mobile (≤600px) phone tweaks for refreshed look */
@media (max-width: 600px) {
    body.has-sidebar { background-color: #f3f4f7; }
    .sidebar-brand,
    .sidebar-nav {
        background: var(--brand-deep);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
    .nav-item.active {
        background: rgba(255, 255, 255, 0.12);
        box-shadow: inset 0 3px 0 #ffffff;
        color: #ffffff;
    }
    .nav-item.active .nav-icon { color: #ffffff; }
    .page-header h1 { font-size: 24px; }
    /* Stacked-card rows from the mobile block: ensure white surface */
    .data-table tr {
        background: #ffffff;
        border-color: #e3e5ec;
        box-shadow: 0 1px 2px rgba(7, 5, 77, 0.05);
    }
    .data-table td {
        border-bottom-color: #eef0f5;
        color: #1f2540;
    }
}

/* ============================================================== */
/* Sharp-corner / blocky pass — overrides hardcoded radii          */
/* ============================================================== */
.card,
.data-table,
.empty-state,
.error-card,
.auth-card,
.gdoc-pane,
.pdf-pane,
.comments-pane,
.amendments-section,
.flash,
.comment,
.note-item,
.notes-from-pill,
.role,
.committee-tag,
.status-badge,
.voting-status-pill,
.filter-pill,
.nav-item,
.nav-badge,
.amend-location-pill,
.amend-location-input,
.brand-logo,
.loading-logo,
.comment-page-badge,
button, .button,
.form input[type=text],
.form input[type=password],
.form input[type=file],
.form input[type=search],
.form textarea,
.form select,
.committee-select,
.dashboard-toolbar input[type=search],
.inline-form input[type=text],
.inline-form select,
.assign-form select,
.assign-form .country-picker .country-picker-button,
.country-picker .country-picker-button,
.country-picker-popup,
.country-flag,
.country-flag-inline,
.delegation-cell,
#pdf-canvas {
    border-radius: 3px;
}

/* The role badge / committee tag still feel best as a tiny chip */
.role, .committee-tag, .nav-badge, .status-badge, .voting-status-pill,
.comment-page-badge, .amend-location-pill { border-radius: 2px; }

/* Cards and major surfaces keep a hint of softness, not a circle */
.card, .data-table, .empty-state, .error-card, .auth-card,
.gdoc-pane, .pdf-pane, .comments-pane, .amendments-section {
    border-radius: 4px;
}

/* Avatars stay subtly rounded but not circular */
.brand-logo { border-radius: 4px; }

/* ============================================================== */
/* Unified select style — every <select> on every page identical    */
/* (Country picker is a custom div component, not a <select>, so it */
/* is unaffected.) Place last so it wins the cascade.               */
/* ============================================================== */
select,
.form select,
.inline-form select,
.assign-form select,
.committee-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    display: inline-block;
    width: auto;
    min-width: 160px;
    padding: 9px 36px 9px 12px;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    color: #ffffff;                       /* white text on navy */
    background-color: #07054d;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 3px;
    box-shadow: 0 1px 2px rgba(7, 5, 77, 0.18);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
    background-repeat: no-repeat;
    background-position: right 10px center;
    cursor: pointer;
    transition: border-color 0.12s ease, box-shadow 0.12s ease,
                background-color 0.12s ease;
}
select:hover,
.form select:hover,
.inline-form select:hover,
.assign-form select:hover,
.committee-select:hover {
    border-color: rgba(255, 255, 255, 0.42);
    background-color: #0a0863;
}
select:focus,
.form select:focus,
.inline-form select:focus,
.assign-form select:focus,
.committee-select:focus {
    outline: none;
    border-color: #6b89f5;
    box-shadow: 0 0 0 3px rgba(74, 108, 240, 0.45);
}
select:disabled,
.form select:disabled,
.inline-form select:disabled {
    background-color: #1c1a55;
    color: rgba(255, 255, 255, 0.55);
    cursor: not-allowed;
}

/* Dropdown options — match the navy theme where browsers respect it
   (Firefox and Safari on macOS honour these; Chrome falls back to OS). */
select option, select optgroup {
    color: #ffffff;
    background-color: #07054d;
}
select option:checked,
select option:hover {
    background-color: #1d4ed8;
    color: #ffffff;
}

/* Some places need a static, read-only chip rather than a real
   editable control — keep them on a quiet light surface so they read
   as informational, not interactive. */
select[disabled].select-readonly,
select.select-readonly {
    background-color: #f3f4f7;
    color: #4f587a;
    border-color: #d4d8e3;
    background-image: none;
    padding-right: 12px;
    box-shadow: none;
    font-weight: 500;
}

/* In the inline assign row on the user-management page, the select
   sits alongside small buttons — match height precisely so they align. */
.inline-form select,
.assign-form select { padding-top: 8px; padding-bottom: 8px; font-size: 13px; }

/* When a select is placed inside a .form label (the create-user panel
   and similar), let it stretch full width like other form fields. */
.form label > select { width: 100%; }

/* ============================================================== */
/* Readability pass — ensure body text on white panels is dark      */
/* enough for WCAG AA (≥4.5:1 against #ffffff)                      */
/* ============================================================== */
.card, .card *, .auth-card, .auth-card *,
.amendments-section, .amendments-section *,
.comments-pane, .comments-pane *,
.gdoc-pane, .gdoc-pane *,
.pdf-pane, .pdf-pane * {
    /* Default to deep navy on white surfaces */
}
.card, .card p, .card li, .card dd, .card label,
.card div, .card span, .card a,
.card td, .card th,
.amendments-section, .amendments-section p, .amendments-section li,
.auth-card, .auth-card label, .auth-card p {
    color: #1a2245;
}
.card .muted, .card .small.muted,
.auth-card .muted,
.amendments-section .muted,
.dashboard-toolbar .muted,
.page-header .muted,
.muted-on-light {
    color: #4f587a;                       /* AA on #fff: ~7.2:1 */
}
/* Restore intentionally colored chips/badges inside cards */
.card .status-badge,
.card .status-badge.status-passed,
.card .status-badge.status-failed,
.card .status-badge.status-debated,
.card .status-badge.status-awaiting,
.card .status-badge.status-summit,
.card .role, .card .role-chair, .card .role-delegate,
.card .role-admin, .card .role-advisor,
.card .committee-tag,
.card .voting-status-pill,
.card .vote-btn,
.card .status-btn,
.card .status-btn-passed,
.card .status-btn-failed,
.card .status-btn-debated,
.card .status-btn-summit,
.card .status-btn-summit-on,
.card button.primary, .card .primary.button,
.card .filter-pill.active,
.card .mc-chair-role-tag,
.card .mc-amendment-count,
.card .mc-hero-eyebrow { color: unset; }
.data-table th { color: #4f587a; }
.data-table td, .data-table td * { color: #1a2245; }
.data-table .muted { color: #4f587a; }

/* Inputs: navy text, gray placeholder */
.form input::placeholder,
.form textarea::placeholder,
.dashboard-toolbar input[type=search]::placeholder,
.inline-form input::placeholder,
.amend-location-input::placeholder {
    color: #6b7390;
    opacity: 1;
}

/* Sidebar is dark — keep nav text bright, but don't repaint chips. */
.sidebar { color: #ffffff; }
.sidebar a, .sidebar .nav-item, .sidebar .nav-item span,
.sidebar .user-name, .sidebar-brand, .sidebar-signout,
.sidebar .brand-text { color: #ffffff; }
.sidebar .muted, .sidebar .small.muted { color: rgba(255, 255, 255, 0.7); }

/* ============================================================== */
/* International Summit committee cards — deep navy with white text */
/* ============================================================== */
.committee-card {
    background: #07054d;
    color: #ffffff;
    border: 1px solid #07054d;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(7, 5, 77, 0.10),
                0 8px 24px rgba(7, 5, 77, 0.18);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
.committee-card,
.committee-card p,
.committee-card li,
.committee-card a,
.committee-card h2,
.committee-card h3,
.committee-card .resolution-title,
.committee-card .section-label { color: #ffffff; }
.committee-card .muted,
.committee-card .empty-committee,
.committee-card .small { color: rgba(255, 255, 255, 0.72); }
.committee-header { border-bottom: 1px solid rgba(255, 255, 255, 0.18); }

.resolution-link {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: #ffffff;
    border-radius: 3px;
}
.resolution-link:hover {
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.32);
    color: #ffffff;
}

/* Chairs collapsible block on the Summit committee card */
.chairs-toggle { padding-top: 4px; }
.chairs-toggle > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 6px 0;
    color: rgba(255, 255, 255, 0.85);
    user-select: none;
}
.chairs-toggle > summary::-webkit-details-marker { display: none; }
.chairs-toggle > summary:hover { color: #ffffff; }
.chairs-toggle .chairs-chev {
    transition: transform 0.15s ease;
    opacity: 0.8;
}
.chairs-toggle[open] > summary .chairs-chev { transform: rotate(180deg); }
.chairs-toggle > .people-list { margin-top: 8px; }

/* Agenda items dropdown — same affordance as chairs */
.agenda-toggle { padding-top: 4px; }
.agenda-toggle > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 6px 0;
    color: rgba(255, 255, 255, 0.85);
    user-select: none;
}
.agenda-toggle > summary::-webkit-details-marker { display: none; }
.agenda-toggle > summary:hover { color: #ffffff; }
.agenda-toggle .chairs-chev {
    transition: transform 0.15s ease;
    opacity: 0.8;
}
.agenda-toggle[open] > summary .chairs-chev { transform: rotate(180deg); }
.agenda-toggle > .agenda-list { margin-top: 8px; }

/* Breathing room between expanded sections inside a committee card */
.committee-section + .committee-section { margin-top: 18px; }
.chairs-toggle[open] + .committee-section,
.agenda-toggle[open] + .committee-section { margin-top: 22px; }

/* ============================================================== */
/* Note Passing page polish                                        */
/* ============================================================== */

/* Section labels (FROM / TO / COMMITTEE / SENT / INBOX) sit on white
   cards now — bump contrast so they're properly readable. */
.card .section-label,
.notes-compose-meta .section-label {
    color: #4f587a;
    font-size: 11px;
    letter-spacing: 0.10em;
}

/* "From" pill on white card: dark text, light gray surface, dark border */
.notes-from-pill {
    background: #f3f4f9;
    border: 1px solid #8c94b0;
    color: #1a2245;
}

/* Note Passing: every dropdown (committee select, country picker) is
   the same uniform white control, same height, same width, same border. */
.notes-compose .committee-select,
.notes-compose select,
.notes-compose .country-picker,
.notes-compose .country-picker .country-picker-button,
.notes-compose .notes-from-pill {
    width: 100%;
    box-sizing: border-box;
    height: 42px;
    min-height: 42px;
    padding: 0 36px 0 14px;
    display: flex;
    align-items: center;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    background-color: #ffffff;
    color: #07054d;
    border: 1px solid #c7cbdb;
    border-radius: 3px;
    box-shadow: 0 1px 0 rgba(7, 5, 77, 0.04);
}
.notes-compose .committee-select,
.notes-compose select {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2307054d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
    background-repeat: no-repeat;
    background-position: right 12px center;
}
.notes-compose .country-picker { padding: 0; }
.notes-compose .country-picker .country-picker-button {
    background-color: #ffffff;
    color: #07054d;
    border: none;
    border-radius: 3px;
    box-shadow: none;
    height: 100%;
    padding: 0 14px;
}
.notes-compose .country-picker.has-value .country-picker-button { color: #07054d; }
.notes-compose .country-picker .country-picker-chev { color: #07054d; }
.notes-compose .country-picker .country-picker-label { color: #07054d; }

/* Hover / focus states */
.notes-compose .committee-select:hover,
.notes-compose select:hover,
.notes-compose .country-picker:hover {
    border-color: #8c94b0;
}
.notes-compose .committee-select:focus,
.notes-compose select:focus {
    outline: none;
    border-color: #1d4ed8;
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.22);
}
.notes-compose .country-picker.open {
    border-color: #1d4ed8;
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.22);
}
.notes-compose .country-picker.open .country-picker-button {
    box-shadow: none;
    border: none;
}

/* The "From" pill is informational, but match the same shell so the
   row reads as a clean three-column header. */
.notes-compose .notes-from-pill {
    background: #f7f8fb;
    color: #1a2245;
    border-color: #c7cbdb;
    font-weight: 600;
}

/* All country-picker buttons match the navy select look across pages */
.country-picker .country-picker-button {
    background-color: #07054d;
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 3px;
    box-shadow: 0 1px 2px rgba(7, 5, 77, 0.18);
    font-weight: 600;
}
.country-picker.has-value .country-picker-button { color: #ffffff; }
.country-picker .country-picker-chev { color: #ffffff; }
.country-picker .country-picker-button:hover {
    background-color: #0a0863;
    border-color: rgba(255, 255, 255, 0.42);
}
.country-picker.open .country-picker-button {
    border-color: #6b89f5;
    box-shadow: 0 0 0 3px rgba(74, 108, 240, 0.45);
}

/* Warning / info banner — was light amber text on light bg, unreadable.
   Switch to dark amber text on a soft cream so it's both visible AND
   still reads as a "heads up". */
.notes-banner {
    background: #fff4d1;
    border: 1px solid #e0b94a;
    color: #6b4a00;
    border-radius: 3px;
    padding: 10px 14px;
    font-weight: 600;
    font-size: 13px;
}
.notes-banner svg { color: #b07d00; }

/* Contact page — make the "To: secretariat@…" line readable on white */
.contact-recipient { color: #4f587a; font-size: 14px; }
.contact-recipient strong { color: #07054d; font-weight: 700; }

/* ============================================================== */
/* Resolution status badges (Passed / Failed / Pending / Debated)  */
/* Larger, plain sans-serif so they read at a glance.              */
/* ============================================================== */
.status-badge,
.page-header .status-badge {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI",
                 Roboto, Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.01em;
    text-transform: none;
    padding: 6px 14px;
    border-radius: 3px;
    line-height: 1.25;
    vertical-align: middle;
    margin-left: 10px;
}
.status-passed,
.page-header .status-passed { background: #15803d; color: #ffffff; border-color: #15803d; }
.status-failed,
.page-header .status-failed { background: #b91c1c; color: #ffffff; border-color: #b91c1c; }
.status-pending,
.page-header .status-pending { background: #fff4d1; color: #6b4a00; border-color: #e0b94a; }
.status-debated,
.page-header .status-debated { background: var(--primary); color: #ffffff; border-color: var(--primary); }
.status-summit,
.page-header .status-summit { background: #07054d; color: #ffffff; border-color: #07054d; }
.status-awaiting { background: #f59e0b; color: #ffffff; border-color: #f59e0b; }
.status-in-debate,
.page-header .status-in-debate { background: #d1fae5; color: #065f46; border-color: #6ee7b7; }

/* Committee tag pill inside the dark committee card — invert for contrast */
.committee-card .committee-tag {
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.28);
}

/* ============================================================== */
/* Admin · All users — card list with expandable edit panel       */
/* ============================================================== */
.users-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.users-head h2 { margin: 0; }
.users-search {
    flex: 1 1 280px;
    max-width: 360px;
    padding: 9px 14px;
    border: 1px solid #c7cbdb;
    border-radius: 3px;
    background: #ffffff;
    color: #07054d;
    font: inherit;
    font-size: 14px;
}
.users-search::placeholder { color: #6b7390; }
.users-search:focus {
    outline: none;
    border-color: #1d4ed8;
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.22);
}

.user-list {
    list-style: none;
    margin: 6px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.user-card {
    border: 1px solid #e3e5ec;
    border-radius: 6px;
    background: #ffffff;
    transition: border-color 0.12s ease, box-shadow 0.12s ease;
}
.user-card.editing {
    border-color: #c9d1f2;
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.10);
}

/* Main row: identity | role | delegation | created | actions */
.user-card-main {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 16px;
    padding: 12px 16px;
}
.user-identity { min-width: 0; }
.user-names {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
}
.user-display {
    font-weight: 700;
    color: #1a2245;
    font-size: 14px;
}
.user-username {
    font-size: 12px;
    color: #4f587a;
    background: #f3f4f7;
    padding: 1px 6px;
    border-radius: 3px;
}
.user-sub { margin-top: 2px; }
.user-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    min-width: 0;
}
.user-created { white-space: nowrap; }
.user-card-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-self: end;
}
.user-edit-toggle {
    background: #f3f4f9;
    border: 1px solid #d4d8e3;
    color: #07054d;
}
.user-edit-toggle:hover { background: #e9ebf3; border-color: #b9c0d2; }

/* Expandable editor panel */
.user-editor {
    border-top: 1px solid #eef0f5;
    padding: 14px 16px 16px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    background: #fafbfd;
    border-radius: 0 0 6px 6px;
}
/* Keep the editor collapsed until "Edit" is pressed — the `display: flex`
   above otherwise overrides the `hidden` attribute, leaving cards editable. */
.user-editor[hidden] { display: none; }
.user-editor-block { display: flex; flex-direction: column; gap: 6px; }
.user-editor-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #4f587a;
}
.user-editor-controls {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.user-editor-controls select { min-width: 160px; }
.user-editor-controls .country-picker { width: 200px; min-width: 200px; }
.user-editor-controls input[type=text] {
    flex: 1 1 220px;
    max-width: 320px;
    padding: 9px 14px;
    border: 1px solid #c7cbdb;
    border-radius: 3px;
    background: #ffffff;
    color: #07054d;
    font: inherit;
    font-size: 14px;
}
.user-editor-controls input[type=text]:focus {
    outline: none;
    border-color: #1d4ed8;
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.22);
}

.user-empty { padding: 18px 4px; }

/* Responsive: stack the main row on narrow screens */
@media (max-width: 760px) {
    .user-card-main {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .user-card-actions { justify-self: start; }
    .user-editor-controls { flex-direction: column; align-items: stretch; }
    .user-editor-controls select,
    .user-editor-controls .country-picker,
    .user-editor-controls input[type=text],
    .user-editor-controls .button,
    .user-editor-controls button { width: 100%; max-width: none; }
}

/* Overrides — appended last so they win cascade order. */

:root {
    --pp-navy-900: #050333;
    --pp-navy-800: #0a0760;
    --pp-navy-700: #11106e;
    --pp-ink:      #161d3d;        /* primary body text on light */
    --pp-ink-soft: #4a5478;        /* secondary text */
    --pp-ink-faint:#737da3;        /* tertiary / placeholder */
    --pp-accent:   #2f50e6;
    --pp-accent-strong: #2440c4;
    --pp-accent-soft: rgba(47, 80, 230, 0.10);
    --pp-line:     #e7e9f3;        /* hairline borders on white */
    --pp-line-soft:#eef0f7;
    --pp-surface:  #ffffff;
    --pp-canvas-1: #f5f7fc;
    --pp-canvas-2: #eceff7;
    --pp-radius-card: 14px;
    --pp-radius-ctrl: 9px;
    --pp-radius-chip: 6px;
    --pp-shadow-sm: 0 1px 2px rgba(16, 22, 60, 0.06);
    --pp-shadow-md: 0 1px 2px rgba(16, 22, 60, 0.05),
                    0 6px 16px rgba(16, 22, 60, 0.07);
    --pp-shadow-lg: 0 2px 4px rgba(16, 22, 60, 0.05),
                    0 12px 32px rgba(16, 22, 60, 0.10);
    --pp-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

body {
    background-color: var(--pp-canvas-1);
    background-image: none;
}
.loading-overlay {
    background-color: var(--pp-canvas-1);
    background-image: none;
}
.loading-logo { animation-duration: 1.4s; filter: none; }

.main-inner { max-width: 1240px; padding: 40px 44px 72px; }

/* ================================================================== */
/* Sidebar                                                            */
/* ================================================================== */
.sidebar {
    background: #1f1851;
    border-right: 1px solid rgba(0, 0, 0, 0.22);
    box-shadow: none;
    padding: 20px 16px 18px;
    gap: 18px;
}
.sidebar-brand {
    gap: 12px;
    padding: 6px 8px 16px;
    margin-bottom: 2px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.brand-logo {
    height: 40px; width: 40px;
    border-radius: 10px;
    box-shadow: none;
}
.brand-text {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.sidebar-nav { gap: 3px; }
.nav-item {
    gap: 13px;
    padding: 10px 12px;
    border-radius: 6px;
    font-size: 13.5px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.78);
    position: relative;
    transition: background 0.12s linear, color 0.12s linear;
}
.nav-item:hover {
    background: rgba(255, 255, 255, 0.07);
    color: #ffffff;
}
.nav-item.active {
    background: rgba(255, 255, 255, 0.10);
    color: #ffffff;
}
.nav-badge {
    background: var(--pp-accent);
    box-shadow: none;
    font-size: 10.5px;
    padding: 3px 7px;
    border-radius: 999px;
}
.nav-item.active .nav-badge { background: #ffffff; color: var(--pp-navy-800); }

/* Footer user identity — fix the bleed from the admin .user-card styles
   and present a clean, readable identity chip on the dark sidebar. */
.sidebar-footer { border-top: 1px solid rgba(255, 255, 255, 0.10); padding-top: 14px; gap: 10px; }
.sidebar .user-card {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 12px;
    box-shadow: none;
    padding: 10px 12px;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
}
.sidebar .user-card .user-name {
    color: #ffffff;
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: 0.005em;
}
.sidebar .user-card .role {
    align-self: flex-start;
    width: auto;
    margin: 0;
    padding: 3px 9px;
    background: rgba(255, 255, 255, 0.14);
    color: #dfe5ff;
    border: 1px solid rgba(255, 255, 255, 0.2);
}
.sidebar-signout {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 10px;
    font-weight: 600;
    padding: 10px 14px;
    transition: background 0.16s var(--pp-ease), border-color 0.16s var(--pp-ease);
}
.sidebar-signout:hover { background: rgba(255, 255, 255, 0.16); border-color: rgba(255, 255, 255, 0.3); }

/* ================================================================== */
/* Page header                                                        */
/* ================================================================== */
.page-header {
    margin-bottom: 30px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--pp-line);
}
.page-header h1 {
    font-size: 33px;
    line-height: 1.12;
    color: var(--pp-navy-800);
}
.page-header p, .page-header .muted { color: var(--pp-ink-soft); font-size: 14px; }

/* ================================================================== */
/* Surfaces — white cards with hairline borders + layered shadow      */
/* ================================================================== */
.card,
.data-table,
.empty-state,
.error-card,
.auth-card,
.gdoc-pane,
.pdf-pane,
.comments-pane,
.amendments-section,
.working-text-card,
.voting-card,
.approval-banner,
.chair-actions {
    background: var(--pp-surface);
    border: 1px solid var(--pp-line);
    border-radius: var(--pp-radius-card);
    box-shadow: var(--pp-shadow-md);
}
.card { padding: 24px 26px; }
.card h2 { color: var(--pp-navy-800); letter-spacing: -0.01em; }

.resolution-link {
    border-radius: 8px;
    transition: background 0.12s linear, border-color 0.12s linear;
}
.resolution-link-pending {
    background: rgba(29, 78, 216, 0.08);
    border: 1px solid rgba(29, 78, 216, 0.3);
    border-left: 3px solid #1d4ed8;
}
.resolution-link-pending:hover {
    background: rgba(29, 78, 216, 0.15);
}

/* ================================================================== */
/* Buttons                                                            */
/* ================================================================== */
button, .button {
    border-radius: var(--pp-radius-ctrl);
    padding: 9px 17px;
    font-weight: 600;
    letter-spacing: 0.005em;
    border: 1px solid var(--pp-line);
    background: var(--pp-surface);
    color: var(--pp-navy-800);
    box-shadow: none;
    transition: background 0.12s linear, border-color 0.12s linear;
}
button:hover, .button:hover {
    background: #f3f4f9;
    border-color: #cdd3e6;
}
button.primary, .primary.button {
    background: var(--pp-navy-800);
    border-color: var(--pp-navy-800);
    color: #ffffff;
    box-shadow: none;
}
button.primary:hover, .primary.button:hover {
    background: #100d56;
    border-color: #100d56;
}
button.danger {
    background: #c12121;
    border-color: #c12121;
    color: #fff;
    box-shadow: none;
}
button.danger:hover { background: #a51b1b; border-color: #a51b1b; }

/* Focus-visible ring for keyboard users across all controls */
a:focus-visible, button:focus-visible, .button:focus-visible,
.filter-pill:focus-visible, .nav-item:focus-visible,
input:focus-visible, textarea:focus-visible, select:focus-visible {
    outline: 2px solid var(--pp-accent);
    outline-offset: 2px;
}

/* ================================================================== */
/* Inputs & forms                                                     */
/* ================================================================== */
.form input[type=text], .form input[type=password], .form input[type=file],
.form input[type=search], .form textarea, .form select,
.amend-location-input, .committee-select,
.dashboard-toolbar input[type=search],
.inline-form input[type=text],
.users-search {
    border-radius: var(--pp-radius-ctrl);
    border: 1px solid #d6dae9;
    background: #ffffff;
    color: var(--pp-ink);
    transition: border-color 0.16s var(--pp-ease), box-shadow 0.16s var(--pp-ease);
}
.form input:focus, .form textarea:focus,
.amend-location-input:focus,
.dashboard-toolbar input[type=search]:focus,
.users-search:focus {
    border-color: var(--pp-accent);
    box-shadow: 0 0 0 3px var(--pp-accent-soft);
}
.form label { color: var(--pp-navy-800); font-size: 12.5px; letter-spacing: 0.01em; }

/* ================================================================== */
/* Tables                                                             */
/* ================================================================== */
.data-table { border-radius: var(--pp-radius-card); overflow: hidden; }
.data-table th {
    background: #f6f7fb;
    color: #6a7297;
    font-size: 10.5px;
    letter-spacing: 0.08em;
    border-bottom: 1px solid var(--pp-line);
    padding: 13px 18px;
}
.data-table td { border-bottom: 1px solid var(--pp-line-soft); padding: 14px 18px; color: var(--pp-ink); }
.data-table tbody tr { transition: background 0.13s var(--pp-ease); }
.data-table tbody tr:hover td { background: #f7f9ff; }
.data-table a { color: var(--pp-accent); font-weight: 600; }
.data-table a:hover { color: var(--pp-accent-strong); }

/* ================================================================== */
/* Filter pills + toolbar                                             */
/* ================================================================== */
.filter-pill {
    border-radius: 999px;
    border: 1px solid #d6dae9;
    background: #ffffff;
    color: var(--pp-navy-800);
    font-weight: 600;
    box-shadow: none;
    transition: background 0.12s linear, border-color 0.12s linear;
}
.filter-pill:hover { background: #f3f4f9; border-color: #c2c9e0; }
.filter-pill.active {
    background: var(--pp-navy-800);
    color: #fff;
    border-color: var(--pp-navy-800);
    box-shadow: none;
}
.dashboard-toolbar input[type=search] { border-radius: 999px; padding-left: 18px; }

/* ================================================================== */
/* Status badges / role chips / committee tags                        */
/* ================================================================== */
.status-badge, .page-header .status-badge { border-radius: var(--pp-radius-chip); }
.role { border-radius: var(--pp-radius-chip); padding: 3px 9px; letter-spacing: 0.04em; }
.committee-tag { border-radius: var(--pp-radius-chip); }
.voting-status-pill { border-radius: 999px; }

/* ================================================================== */
/* Empty state                                                        */
/* ================================================================== */
.empty-state {
    padding: 64px 24px;
    border: 1px solid var(--pp-line);
    border-radius: var(--pp-radius-card);
    color: var(--pp-ink-soft);
    box-shadow: var(--pp-shadow-md);
}
.empty-state p { font-size: 15px; margin-bottom: 16px; color: var(--pp-ink-soft); }
.empty-state p:first-child { font-weight: 600; color: var(--pp-navy-800); }

/* ================================================================== */
/* Schedule                                                           */
/* ================================================================== */
.schedule-card { padding: 24px 26px; }
.schedule-list li {
    border: 1px solid var(--pp-line-soft);
    border-radius: 10px;
    background: #fbfcff;
    padding: 10px 14px;
    transition: background 0.13s var(--pp-ease), border-color 0.13s var(--pp-ease);
}
.schedule-list li:hover { background: #f4f6ff; border-color: #dbe1f4; }
.schedule-time {
    color: var(--pp-accent);
    font-weight: 700;
    letter-spacing: 0.01em;
}
.schedule-detail { color: var(--pp-ink); }

/* ================================================================== */
/* International Summit committee cards                               */
/* ================================================================== */
.committee-card {
    background: #1f1851;            /* matches the sidebar */
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--pp-radius-card);
    box-shadow: var(--pp-shadow-md);
}
.committee-header h2 { letter-spacing: -0.01em; }
.resolution-link {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
}
.resolution-link:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.24);
}

/* ================================================================== */
/* Comments / notes / voting                                          */
/* ================================================================== */
.comment, .note-item {
    background: #f7f8fc;
    border: 1px solid var(--pp-line);
    border-radius: 10px;
}
.flash { border-radius: 10px; box-shadow: var(--pp-shadow-md); }
.tally-count { border-radius: 8px; }

/* ================================================================== */
/* Auth / login                                                       */
/* ================================================================== */
.auth-card {
    border-radius: 12px;
    padding: 32px 32px 24px;
    box-shadow: var(--pp-shadow-md);
    border: 1px solid var(--pp-line);
}
.auth-card h1 { font-size: 28px; color: var(--pp-navy-800); margin-bottom: 4px; }
.auth-card .form button.primary { width: 100%; padding: 12px; font-size: 14px; border-radius: 8px; }

/* ================================================================== */
/* Consistent radii on remaining controls                             */
/* ================================================================== */
.country-picker .country-picker-button,
.assign-form .country-picker .country-picker-button,
select, .form select, .inline-form select,
.assign-form select, .committee-select,
.notes-from-pill, .committee-select {
    border-radius: var(--pp-radius-ctrl);
}
#pdf-canvas { border-radius: 6px; }
.brand-logo, .loading-logo { border-radius: 10px; }

/* ================================================================== */
/* Motion preferences                                                 */
/* ================================================================== */
@media (prefers-reduced-motion: reduce) {
    .nav-item, .committee-card, button, .button, .filter-pill,
    .resolution-link, .schedule-list li, .data-table tbody tr {
        transition: none;
    }
    .nav-item:hover, .committee-card:hover, .resolution-link:hover {
        transform: none;
    }
}

/* ================================================================== */
/* Mobile refinements for the polish layer                            */
/* ================================================================== */
@media (max-width: 820px) {
    .main-inner { padding: 28px 20px 48px; }
    .sidebar { box-shadow: 0 4px 20px rgba(5, 3, 40, 0.2); }
}
@media (max-width: 600px) {
    .main-inner { padding: 18px 15px 28px; }
    .page-header h1 { font-size: 25px; }
    .sidebar .user-card { display: none; }
    .nav-item:hover { transform: none; }
    .nav-item.active::before { display: none; }
    .committee-card:hover { transform: none; }
}

/* ================================================================== */
/* Admin "Sign in as" (impersonation)                                 */
/* ================================================================== */

/* Per-user "Sign in as" button — a quiet accent action next to Edit */
.user-impersonate {
    background: #eef1ff;
    border: 1px solid #c9d1f2;
    color: #1d2e8a;
}
.user-impersonate:hover {
    background: #e2e8ff;
    border-color: #aab6ee;
    color: #16236e;
}
.impersonate-form { display: inline-flex; }

/* Banner shown on every page while an admin is signed in as someone else */
.impersonation-banner {
    position: sticky;
    top: 14px;
    z-index: 60;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 22px;
    padding: 12px 16px 12px 18px;
    border-radius: 12px;
    background: linear-gradient(180deg, #fff7e2 0%, #ffeec6 100%);
    border: 1px solid #e2b34d;
    box-shadow: 0 8px 24px rgba(176, 125, 0, 0.18);
    color: #6b4a00;
}
.impersonation-banner .imp-text {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
}
.impersonation-banner .imp-text svg { color: #b07d00; flex-shrink: 0; }
.impersonation-banner .imp-text strong { color: #4a3300; }
.impersonation-banner .imp-text .role {
    margin-left: 2px;
    background: rgba(176, 125, 0, 0.16);
    color: #6b4a00;
    border: 1px solid rgba(176, 125, 0, 0.32);
    vertical-align: middle;
}
.impersonation-banner .imp-return-form { margin: 0; }
.impersonation-banner .imp-return {
    background: linear-gradient(180deg, #15125e 0%, var(--pp-navy-800) 100%);
    border: 1px solid var(--pp-navy-800);
    color: #ffffff;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(7, 5, 77, 0.28);
    white-space: nowrap;
}
.impersonation-banner .imp-return:hover {
    background: linear-gradient(180deg, #1c1873 0%, #100d56 100%);
    border-color: #100d56;
    color: #ffffff;
}
@media (max-width: 600px) {
    .impersonation-banner { top: 8px; }
    .impersonation-banner .imp-return-form,
    .impersonation-banner .imp-return { width: 100%; }
    .impersonation-banner .imp-return { text-align: center; }
}

/* ================================================================== */
/* Solid sidebar — flat institutional colour                          */
/* ================================================================== */
.sidebar {
    background: #1f1851;
    background-image: none;
    border-right: 1px solid rgba(0, 0, 0, 0.22);
    box-shadow: 1px 0 0 rgba(255, 255, 255, 0.05),
                6px 0 26px rgba(7, 5, 60, 0.16);
}
@media (max-width: 600px) {
    .sidebar-brand,
    .sidebar-nav { background: #1f1851; }
}

/* ================================================================== */
/* Admin user-editor: committee + delegation stacked (equal width)    */
/* on the left, Save button to their right.                           */
/* ================================================================== */
/* Left-align the editor controls (override the legacy centered assign-form) */
.user-editor .assign-form { align-items: flex-start; }
.assign-form .user-editor-controls {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
}
.assign-form .ce-stack {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.assign-form .ce-stack > select,
.assign-form .ce-stack > .country-picker {
    width: 240px;
    min-width: 240px;
    box-sizing: border-box;
}
/* Equal heights: country picker matches the committee select */
.assign-form .ce-stack > select,
.assign-form .ce-stack > .country-picker .country-picker-button {
    height: 40px;
    min-height: 40px;
    font-size: 13px;
    box-sizing: border-box;
}
.assign-form .ce-stack > .country-picker .country-picker-button {
    width: 100%;
}

/* Save button moved into the card actions row, to the left of Edit;
   only shown while the card is being edited. */
.user-card .user-save { display: none; }
.user-card.editing .user-save { display: inline-block; }

/* Auto-filled (read-only) name fields for delegates — clearly non-editable */
#create-user-form input.auto-filled,
#create-user-form input[readonly] {
    background: #f3f4f7;
    color: #4f587a;
    cursor: default;
}

/* ================================================================== */
/* Login — User Agreement                                             */
/* ================================================================== */
.user-agreement {
    margin-top: 2px;
    padding: 14px 16px;
    border: 1px solid var(--pp-line, #e7e9f3);
    border-radius: 10px;
    background: #f7f8fb;
}
.user-agreement .agreement-title {
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--brand-deep);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.agreement-list {
    margin: 0 0 12px;
    padding-left: 18px;
    display: flex;
    flex-direction: column;
    gap: 7px;
    font-size: 12.5px;
    line-height: 1.5;
    color: #2b3556;
}
.agreement-list li { margin: 0; }
.agreement-check.inline {
    align-items: flex-start;
    gap: 9px;
    font-size: 13px;
    font-weight: 600;
    color: var(--brand-deep);
    cursor: pointer;
}
.agreement-check.inline input[type="checkbox"] {
    margin: 2px 0 0;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    accent-color: var(--pp-accent, #2f50e6);
    cursor: pointer;
}
/* The Sign in button must be truly gone until the agreement is accepted —
   override the button display rules that otherwise beat the [hidden] attr. */
#signin-btn[hidden] { display: none !important; }

/* The role-context field's swappable inner controls toggle via the `hidden`
   attribute. The outer .form label rules use display:flex which would
   otherwise override [hidden]. Force form-level hiding to win the cascade
   so an out-of-role label/select can never leak visually. */
.form label[hidden],
.role-context-field [hidden],
#create-chair-position[hidden],
#create-advisor-school[hidden],
.role-context-delegation[hidden] { display: none !important; }

/* ================================================================== */
/* Admin Configurations page                                          */
/* ================================================================== */
.cfg-table input[type="text"] {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #d6dae9;
    border-radius: var(--pp-radius-ctrl);
    background: #ffffff;
    color: var(--pp-ink);
    font: inherit;
    font-size: 14px;
}
.cfg-table .mono-input { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.cfg-table th, .cfg-table td { padding: 10px 14px; vertical-align: middle; }
.cfg-table .cfg-actions { width: 1%; white-space: nowrap; }
.cfg-actions .cfg-remove,
.cfg-committee-row .cfg-remove {
    background: #ffffff;
    border: 1px solid #d99a9a;
    color: #8a1d22;
    padding: 6px 12px;
    font-size: 12.5px;
    border-radius: var(--pp-radius-ctrl);
}
.cfg-actions .cfg-remove:hover,
.cfg-committee-row .cfg-remove:hover { background: #fde7e7; border-color: #c97070; }

/* Committee rows + schedule day rows (same layout) */
.cfg-committee-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.cfg-committee-row {
    border: 1px solid var(--pp-line);
    border-radius: 10px;
    padding: 14px 16px;
    background: #fbfcff;
}
.cfg-committee-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}
.cfg-committee-code,
.cfg-day-title {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #d6dae9;
    border-radius: var(--pp-radius-ctrl);
    background: #ffffff;
    color: var(--pp-ink);
    font: inherit;
    font-size: 14px;
}
.cfg-committee-code { max-width: 220px; }
.cfg-committee-agenda-label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-weight: 600;
    font-size: 13px;
}
.cfg-committee-agenda-label textarea {
    padding: 10px 12px;
    border: 1px solid #d6dae9;
    border-radius: var(--pp-radius-ctrl);
    background: #ffffff;
    color: var(--pp-ink);
    font: 14px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace;
    resize: vertical;
    min-height: 70px;
}

/* "+ Add row" button styling — quieter than primary */
.cfg-add {
    background: #eef1ff;
    border: 1px solid #c9d1f2;
    color: #1d2e8a;
    margin-right: auto;
}
.cfg-add:hover { background: #e2e8ff; border-color: #aab6ee; }

/* Chairs roster */
.cfg-roster-committee + .cfg-roster-committee { margin-top: 16px; }
.cfg-roster-slots {
    list-style: none;
    padding: 0;
    margin: 6px 0 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.cfg-roster-slot {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 12px;
    border: 1px solid var(--pp-line-soft);
    border-radius: 10px;
    background: #fbfcff;
}
.cfg-roster-position { min-width: 200px; }
.cfg-roster-position code {
    background: #f3f4f7;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 12px;
}
.cfg-roster-form {
    flex: 1;
    display: flex;
    gap: 10px;
    align-items: center;
}
.cfg-roster-form input[type="text"] {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #d6dae9;
    border-radius: var(--pp-radius-ctrl);
    background: #ffffff;
    color: var(--pp-ink);
    font: inherit;
    font-size: 14px;
}
.cfg-roster-vacant { flex: 1; }

@media (max-width: 760px) {
    .cfg-roster-slot { flex-direction: column; align-items: stretch; }
    .cfg-roster-position { min-width: 0; }
    .cfg-roster-form { width: 100%; }
}

/* "Back to <admin>" button in the sidebar, shown only while impersonating.
   Small amber accent so it reads as the way out of the temporary session. */
.sidebar-imp-return {
    width: 100%;
    text-align: center;
    padding: 8px 12px;
    border-radius: 10px;
    background: rgba(255, 196, 0, 0.16);
    border: 1px solid rgba(255, 196, 0, 0.42);
    color: #ffd86b;
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.12s linear, border-color 0.12s linear;
}
.sidebar-imp-return:hover {
    background: rgba(255, 196, 0, 0.26);
    border-color: rgba(255, 196, 0, 0.6);
    color: #ffe49a;
}

@media (max-width: 760px) {
    .assign-form .user-editor-controls { flex-direction: column; align-items: stretch; }
    .assign-form .ce-stack { width: 100%; }
    .assign-form .ce-stack > select,
    .assign-form .ce-stack > .country-picker { width: 100%; min-width: 0; }
}

/* ================================================================== */
/* Role badges — solid fills, white text, blocky w/ light rounding   */
/* admin: black · delegate: dark blue · chair: dark red · advisor: purple */
/* ================================================================== */
.role {
    display: inline-block;
    padding: 3px 9px;
    border: 0;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1.25;
    vertical-align: middle;
    background: #1f2540;
    color: #ffffff;
}
.role-admin    { background: #111111; color: #ffffff; }
.role-delegate { background: #11296b; color: #ffffff; }
.role-chair    { background: #8a1d22; color: #ffffff; }
.role-advisor  { background: #4a2a8a; color: #ffffff; }
.role-exec_gc  {
    background: #14532d;                /* dark green */
    color: #ffffff;
    box-shadow: inset 3px 0 0 #000000;  /* black left accent */
    padding-left: 12px;
}

/* The sidebar uses an inverted look — keep it readable on the dark sidebar
   by using a softer translucent fill. The base block above already wins
   on cascade for everything else. */
.sidebar .user-card .role,
.impersonation-banner .imp-text .role {
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;
}

/* ================================================================== */
/* Note Passing — fix broken "To" picker border (was double-bordered: */
/* one on the wrapper, one on the inner button) and keep all three    */
/* controls visually identical.                                       */
/* ================================================================== */
.notes-compose .country-picker {
    /* Wrapper is the visual control: single border, white surface. */
    display: block;
    padding: 0;
    height: 42px;
    background: #ffffff;
    border: 1px solid #c7cbdb;
    border-radius: 3px;
    box-shadow: 0 1px 0 rgba(7, 5, 77, 0.04);
    box-sizing: border-box;
    overflow: hidden;
}
.notes-compose .country-picker .country-picker-button {
    /* Inner button fills the wrapper with no chrome of its own. */
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 0 36px 0 14px;
    background: transparent;
    color: #07054d;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    text-align: left;
}
.notes-compose .country-picker .country-picker-label {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #07054d;
}
.notes-compose .country-picker .country-picker-chev {
    color: #07054d;
    margin-left: 8px;
    flex-shrink: 0;
}
.notes-compose .country-picker:hover { border-color: #8c94b0; }
.notes-compose .country-picker.open {
    border-color: #1d4ed8;
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.22);
}
.notes-compose .country-picker.open .country-picker-button {
    background: transparent;
    border: 0;
    box-shadow: none;
}

/* ================================================================== */
/* Permission-based upload                                            */
/* ================================================================== */

/* Wrapper around the upload form so we can blur it for delegates    */
/* who don't currently have permission to upload.                    */
.upload-shell { position: relative; }
.upload-shell-blocked .form.card {
    filter: blur(4px) saturate(0.7);
    pointer-events: none;
    user-select: none;
    opacity: 0.85;
}
.upload-block-overlay {
    position: absolute;
    inset: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    pointer-events: none;
}
.upload-block-card {
    pointer-events: auto;
    background: #ffffff;
    border: 1px solid var(--pp-line, #e7e9f3);
    border-radius: 12px;
    padding: 26px 28px;
    max-width: 520px;
    box-shadow: 0 6px 24px rgba(16, 22, 60, 0.12);
    text-align: center;
}
.upload-block-card h2 {
    margin: 0 0 10px;
    font-size: 18px;
    color: var(--brand-deep, #07054d);
}
.upload-block-card p {
    margin: 0 0 8px;
    color: #2b3556;
    font-size: 14px;
    line-height: 1.5;
}
.upload-block-card p:last-child { margin: 8px 0 0; }

/* Countdown badge shown to delegates who currently have permission */
.permission-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border-radius: 999px;
    background: #def7e5;
    border: 1px solid #8ed1a5;
    color: #146c2f;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.permission-badge .permission-dot {
    width: 8px; height: 8px;
    border-radius: 999px;
    background: #16a34a;
    box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.18);
}
.permission-badge-warn {
    background: #fff4d1;
    border-color: #e0b94a;
    color: #6b4a00;
}
.permission-badge-warn .permission-dot { background: #d39200; box-shadow: 0 0 0 3px rgba(211, 146, 0, 0.18); }
.permission-badge-expired {
    background: #fde7e7;
    border-color: #d99a9a;
    color: #8a1d22;
}
.permission-badge-expired .permission-dot { background: #8a1d22; box-shadow: none; }
.permission-badge-mini { font-size: 12px; padding: 4px 10px; }

/* Chair-side grant/revoke controls on My Committee */
.upload-permit-controls {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.permit-grant {
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 600;
}
.permit-revoke {
    padding: 6px 12px;
    font-size: 12px;
    background: #ffffff;
    border: 1px solid #d99a9a;
    color: #8a1d22;
}
.permit-revoke:hover { background: #fde7e7; border-color: #c97070; }

/* ================================================================== */
/* My Committee — light-mode overrides for mc-* classes               */
/* (The mc-* base rules use dark-mode rgba values; this block fixes    */
/* them for the white-card professional-refresh context.)              */
/* ================================================================== */
.mc-hero {
    background: linear-gradient(135deg, rgba(29, 78, 216, 0.08) 0%, rgba(7, 5, 77, 0.06) 100%);
    border: 1px solid rgba(29, 78, 216, 0.2);
}
.mc-hero-eyebrow { color: var(--primary); }
.mc-hero-name { color: var(--brand-deep); }
.mc-hero-delegation { color: #4f587a; }
.mc-hero-delegation strong { color: var(--brand-deep); }

.mc-chair-item.mc-chair-deputy {
    background: #f7f8fb;
    border-color: #e3e5ec;
}
.mc-chair-role-deputy {
    background: #e3e5ec;
    color: #4f587a;
}
.mc-chair-name { color: var(--brand-deep); }

.mc-agenda-item {
    background: #f7f8fb;
    border-color: #e3e5ec;
    color: #1a2245;
}

.mc-label { color: #5b6481; }
.mc-label-warn { color: #92600a; }
.mc-count {
    background: #eef0f6;
    border-color: #d4d8e3;
    color: #5b6481;
}

.mc-resolution-link {
    background: #f7f8fb;
    border-color: #e3e5ec;
    color: #1a2245;
}
.mc-resolution-link:hover {
    background: #eef0f6;
    border-color: #c9cedf;
    color: #1a2245;
}
.mc-resolution-pending {
    background: rgba(29, 78, 216, 0.06);
    border-color: rgba(29, 78, 216, 0.22);
    border-left-color: var(--primary);
}
.mc-resolution-pending:hover {
    background: rgba(29, 78, 216, 0.12);
}
.mc-res-title { color: var(--brand-deep); }
.mc-res-meta { color: #5b6481; }
.mc-amendment-count { color: var(--primary); font-weight: 700; }

.mc-delegation-item {
    background: #f7f8fb;
    border-color: #e3e5ec;
}
.mc-delegation-country { color: var(--brand-deep); }
.mc-delegation-display { color: #5b6481; }
.mc-empty { color: #5b6481; }

/* resolution-link used in dashboard/other pages on white cards */
.card .resolution-link {
    background: #f7f8fb;
    border-color: #e3e5ec;
    color: #1a2245;
}
.card .resolution-link:hover {
    background: #eef0f6;
    border-color: #c9cedf;
}
.card .resolution-link .resolution-title { color: var(--brand-deep); }
.card .resolution-link-pending {
    background: rgba(29, 78, 216, 0.06);
    border-color: rgba(29, 78, 216, 0.22);
    border-left-color: var(--primary);
}
.card .resolution-link-pending:hover { background: rgba(29, 78, 216, 0.12); }

/* Voting section on white cards */
.card .tally-block {
    background: #f7f8fb;
    border-color: #e3e5ec;
}
.card .tally-block.tally-for {
    background: rgba(48, 209, 88, 0.08);
    border-color: rgba(48, 209, 88, 0.3);
}
.card .tally-block.tally-against {
    background: rgba(255, 69, 58, 0.08);
    border-color: rgba(255, 69, 58, 0.3);
}
.card .tally-number { color: #1a2245; }
.card .tally-block.tally-for .tally-number   { color: #146c2f; }
.card .tally-block.tally-against .tally-number { color: #8a1d22; }
.card .tally-label { color: var(--primary); }

/* Status buttons on white cards */
.card .status-btn {
    background: #f7f8fb;
    border-color: #d4d8e3;
    color: var(--brand-deep);
}
.card .status-btn:hover { background: #eef0f6; }
.card .status-btn-debated,
.card .status-btn-debated:hover { background: var(--primary); color: #ffffff; border-color: var(--primary); }
.card .status-btn-passed,
.card .status-btn-passed:hover { background: #15803d; color: #ffffff; border-color: #15803d; }
.card .status-btn-failed,
.card .status-btn-failed:hover { background: #b91c1c; color: #ffffff; border-color: #b91c1c; }

/* Role tag on white cards (used in old people-list areas) */
.card .role-tag {
    background: #eef1ff;
    color: #1d2e8a;
    border-color: #c9d1f2;
}

/* ================================================================== */
/* Full-site readability pass — all white surfaces                     */
/* Fixes dark-mode CSS vars (var(--text), var(--muted)) leaking into  */
/* the now-white approval-banner, chair-actions, voting-card, etc.    */
/* ================================================================== */

/* --- Approval banner --- */
.approval-banner-chair {
    background: #fffbeb;
    border: 1px solid #f59e0b;
}
.approval-banner-uploader {
    background: #f0f3ff;
    border: 1px solid #c9d1f2;
}
.approval-text { color: #1a2245; }
.approval-text strong { color: #07054d; }
.approval-banner-uploader .approval-text strong { color: #07054d; }

/* --- Chair actions --- */
.chair-actions-label { color: #5b6481; }
.chair-actions .muted { color: #5b6481; }

/* --- Status buttons (default inactive state) --- */
.status-btn {
    background: #f7f8fb;
    border: 1px solid #d4d8e3;
    color: #07054d;
}
.status-btn:hover { background: #eef0f6; border-color: #b9c0d2; color: #07054d; }
.status-btn-pending.active {
    background: #f59e0b;
    color: #1f1500;
    border-color: #f59e0b;
}
.status-btn-passed { background: #15803d; color: #ffffff; border-color: #15803d; }
.status-btn-passed:hover { background: #166534; border-color: #166534; color: #ffffff; }
.status-btn-failed { background: #b91c1c; color: #ffffff; border-color: #b91c1c; }
.status-btn-failed:hover { background: #991b1b; border-color: #991b1b; color: #ffffff; }
.status-btn-debated { background: var(--primary); color: #ffffff; border-color: var(--primary); }
.status-btn-debated:hover { background: var(--primary-hover); color: #ffffff; border-color: var(--primary-hover); }
.status-btn-debated.active { background: var(--primary); color: #ffffff; border-color: var(--primary); }
.status-btn-summit { background: #07054d; color: #ffffff; border-color: #07054d; }
.status-btn-summit:hover { background: #0a0760; border-color: #0a0760; color: #ffffff; }
.status-btn-summit-on { background: var(--primary); color: #ffffff; border-color: var(--primary); }
.status-btn-summit-on:hover { background: var(--primary-hover); color: #ffffff; border-color: var(--primary-hover); }

/* --- Voting card --- */
.voting-header h2 { color: #07054d; }
.voting-card .muted, .voting-card .small { color: #5b6481; }
.voting-pill-closed {
    background: #f3f4f7;
    border: 1px solid #d4d8e3;
    color: #5b6481;
}
.tally-number { color: #1a2245; }
.tally-block.tally-for .tally-number   { color: #146c2f; }
.tally-block.tally-against .tally-number { color: #8a1d22; }
.tally-block {
    background: #f7f8fb;
    border-color: #e3e5ec;
}
.tally-block.tally-for {
    background: rgba(21, 128, 61, 0.07);
    border-color: rgba(21, 128, 61, 0.25);
}
.tally-block.tally-against {
    background: rgba(185, 28, 28, 0.07);
    border-color: rgba(185, 28, 28, 0.25);
}
.tally-label { color: var(--primary); }

/* --- Vote buttons --- */
.vote-btn {
    background: #f7f8fb;
    border: 1px solid #d4d8e3;
    color: #07054d;
}
.vote-btn:hover { background: #eef0f6; color: #07054d; }
.vote-btn-for  { border-color: rgba(21, 128, 61, 0.45); color: #15803d; }
.vote-btn-for:hover  { background: #15803d; color: #ffffff; border-color: #15803d; }
.vote-btn-for.active { background: #15803d; color: #ffffff; border-color: #15803d; box-shadow: 0 0 0 3px rgba(21, 128, 61, 0.22); }
.vote-btn-against  { border-color: rgba(185, 28, 28, 0.45); color: #b91c1c; }
.vote-btn-against:hover  { background: #b91c1c; color: #ffffff; border-color: #b91c1c; }
.vote-btn-against.active { background: #b91c1c; color: #ffffff; border-color: #b91c1c; box-shadow: 0 0 0 3px rgba(185, 28, 28, 0.22); }

/* --- Chair amendment notice (in comments pane) --- */
.chair-amendment-notice {
    background: #f7f8fb;
    border: 1px dashed #d4d8e3;
    color: #5b6481;
}

/* --- Settings page --- */
.settings-row {
    background: #f7f8fb;
    border: 1px solid #eef0f5;
}
.settings-row dt { color: #5b6481; }

/* --- Tally tracker --- */
.tally-count { background: #eef0f6; color: #1a2245; }
.tally-total { color: #07054d; }

/* Colour-coded event pills in recent activity */
.card .tally-event-poi       { color: #6b4a00; background: #fff4d1; padding: 1px 7px; border-radius: 3px; }
.card .tally-event-speech    { color: #1d2e8a; background: #eef1ff; padding: 1px 7px; border-radius: 3px; }
.card .tally-event-amendment { color: #4b2a99; background: #ede4ff; padding: 1px 7px; border-radius: 3px; }

/* committee-header divider on white surfaces */
.card .committee-header,
.amendments-section .committee-header { border-bottom-color: #e3e5ec; }

/* "Undo" and other link-buttons inside white cards */
.card .link-button, .link-button {
    background: transparent;
    border: none;
    color: var(--primary);
    padding: 0;
    font-weight: 600;
    box-shadow: none;
    cursor: pointer;
    text-decoration: underline;
    font-size: inherit;
}
.card .link-button:hover, .link-button:hover {
    color: var(--primary-hover);
    background: transparent;
    border: none;
}

/* Credits page */
.credits-divider {
    border: none;
    border-top: 1px solid #e3e5ec;
    margin: 20px 0;
}
.credits-tier-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #5b6481;
    margin: 0 0 6px;
    padding: 0;
}
.credits-linkedin {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-left: 10px;
    padding: 3px 10px 3px 8px;
    background: #0a66c2;
    color: #ffffff;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    vertical-align: middle;
}
.credits-linkedin:hover { background: #0958a8; color: #ffffff; text-decoration: none; }

/* agenda-line and main-submitter in document page-header */
.agenda-label { color: #5b6481; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
.agenda-text  { color: #1a2245; font-size: 14px; }
.ms-label     { color: #5b6481; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
.ms-name      { color: #07054d; font-size: 14px; font-weight: 600; }

/* ================================================================== */
/* BLOCKY REVAMP — Sharp corners · Neutral sidebar · Uniform roles     */
/* ================================================================== */

/* --- 1. Radius token overrides ------------------------------------ */
:root {
    --radius-sm:      2px;
    --radius-md:      3px;
    --radius-lg:      4px;
    --radius-pill:    4px;
    --radius-xl:      5px;
    --pp-radius-card: 4px;
    --pp-radius-ctrl: 4px;
    --pp-radius-chip: 3px;
    --pp-shadow-sm:   0 1px 2px rgba(0, 0, 0, 0.07);
    --pp-shadow-md:   0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.05);
    --pp-shadow-lg:   0 2px 6px rgba(0, 0, 0, 0.08), 0 4px 12px rgba(0, 0, 0, 0.06);
}

/* --- 2. Explicit sharp-corner pass -------------------------------- */

/* Major surfaces */
.card, .data-table, .empty-state, .error-card, .auth-card,
.gdoc-pane, .pdf-pane, .comments-pane, .amendments-section,
.voting-card, .approval-banner, .chair-actions,
.working-text-card, .committee-card,
.upload-block-card, .user-editor,
.comment, .note-item, .flash,
.impersonation-banner,
.cfg-committee-row, .cfg-roster-slot,
.schedule-list li { border-radius: 4px; }

/* User card (admin list) */
.user-card { border-radius: 4px; }
.sidebar .user-card { border-radius: 4px; }

/* Buttons and controls */
button, .button { border-radius: 4px; }
.status-btn, .vote-btn, .tally-btn { border-radius: 4px; }
.sidebar-signout, .sidebar-imp-return { border-radius: 4px; }
.auth-card .form button.primary { border-radius: 4px; }

/* Inputs */
.form input[type=text], .form input[type=password], .form input[type=file],
.form input[type=search], .form textarea, .form select,
.amend-location-input, .committee-select,
.dashboard-toolbar input[type=search],
.dashboard-toolbar input[type=search],
.users-search,
.user-editor-controls input[type=text],
.cfg-table input[type=text],
.cfg-committee-code, .cfg-day-title,
.cfg-committee-agenda-label textarea,
.cfg-roster-form input[type=text],
select { border-radius: 4px; }

/* Pill-shape overrides → blocky */
.filter-pill  { border-radius: 4px; }
.permission-badge { border-radius: 4px; }
.voting-status-pill { border-radius: 3px; }
.notes-from-pill { border-radius: 4px; }

/* Chips and small badges */
.status-badge, .role, .committee-tag,
.nav-badge, .amend-location-pill,
.comment-page-badge, .tally-count { border-radius: 3px; }

/* Nav */
.nav-item { border-radius: 3px; }

/* Country picker */
.country-picker .country-picker-button,
.country-picker-popup { border-radius: 4px; }

/* Misc */
.country-flag, .country-flag-inline { border-radius: 2px; }
.brand-logo, .loading-logo { border-radius: 5px; }
.auth-card { border-radius: 6px; }
.user-agreement { border-radius: 4px; }
.notes-banner { border-radius: 4px; }
.amend-location-input { border-radius: 4px; }

/* Search input is no longer a pill */
.dashboard-toolbar input[type=search] {
    border-radius: 4px;
    padding-left: 14px;
}

/* --- 3. Sidebar — neutral charcoal -------------------------------- */
.sidebar {
    background: #242830;
    background-image: none;
    border-right: 1px solid rgba(0, 0, 0, 0.22);
    box-shadow: none;
}
.sidebar-brand {
    border-bottom-color: rgba(255, 255, 255, 0.08);
    gap: 0;
    padding: 14px 16px 12px 28px;
}
.brand-logo-full {
    display: block;
    height: 62px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    border-radius: 0;
    /* PNG has transparent bg — looks clean against charcoal sidebar */
}
/* Hide the old square brand-logo if it somehow still appears */
.brand-text { display: none; }

/* ================================================================== */
/* COUNTRY PICKER BUTTON — input-style, not a grey action button      */
/* ================================================================== */
/* Override the old navy style and prevent grey-button bleed-through  */
.country-picker-button,
.country-picker .country-picker-button,
.assign-form .country-picker .country-picker-button,
.form .country-picker .country-picker-button,
.user-editor .country-picker .country-picker-button,
.notes-compose .country-picker .country-picker-button {
    background: #f5f6fa;
    color: #1a2245;
    border: 1px solid #d0d4e0;
    font-weight: 400;
    box-shadow: none;
}
.country-picker .country-picker-chev { color: #6b7390; }
.country-picker.has-value .country-picker-button,
.country-picker.has-value .country-picker .country-picker-button { color: #07054d; }

/* Hover: subtle light-gray lift, not navy */
.country-picker-button:hover,
.country-picker .country-picker-button:hover,
.assign-form .country-picker .country-picker-button:hover,
.form .country-picker .country-picker-button:hover {
    background: #eaecf4;
    border-color: #b5bdcf;
    color: #07054d;
    box-shadow: none;
}

/* Open/focus: accent ring like other inputs */
.country-picker.open .country-picker-button,
.country-picker .country-picker-button:focus {
    background: #f5f6fa;
    border-color: var(--pp-accent, #2f50e6);
    box-shadow: 0 0 0 2px rgba(47, 80, 230, 0.14);
    color: #07054d;
}

.nav-item {
    color: rgba(255, 255, 255, 0.68);
    border-radius: 3px;
    transition: background 0.1s linear, color 0.1s linear;
}
.nav-item:hover {
    background: rgba(255, 255, 255, 0.07);
    color: rgba(255, 255, 255, 0.92);
}
.nav-item.active {
    background: rgba(255, 255, 255, 0.09);
    color: #ffffff;
    opacity: 1;
    box-shadow: inset 3px 0 0 var(--pp-accent, #2f50e6);
}
.nav-item.active::before { display: none; }
.nav-item.active .nav-icon { color: #ffffff; }
.nav-badge { background: var(--pp-accent, #2f50e6); }
.nav-item.active .nav-badge { background: #ffffff; color: #242830; }

.sidebar-footer { border-top-color: rgba(255, 255, 255, 0.09); }
.sidebar .user-card {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.09);
    border-radius: 4px;
}
.sidebar-signout {
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.13);
}
.sidebar-signout:hover {
    background: rgba(255, 255, 255, 0.13);
    border-color: rgba(255, 255, 255, 0.22);
}
.sidebar-imp-return {
    border-radius: 4px;
    background: rgba(255, 196, 0, 0.14);
    border-color: rgba(255, 196, 0, 0.36);
    color: #ffd86b;
}
.sidebar-imp-return:hover {
    background: rgba(255, 196, 0, 0.24);
    border-color: rgba(255, 196, 0, 0.54);
}

@media (max-width: 600px) {
    .sidebar-brand, .sidebar-nav { background: #242830; }
    .nav-item:hover { transform: none; }
    .nav-item.active::before { display: none; }
}

/* --- 4. Role badges — uniform dark charcoal ----------------------- */
/* Global: all roles get the same very dark gray, no color coding */
.role {
    background: #1d2028;
    color: #f0f1f3;
    border: none;
}
.role-admin    { background: #1d2028; color: #f0f1f3; }
.role-chair    { background: #1d2028; color: #f0f1f3; }
.role-delegate { background: #1d2028; color: #f0f1f3; }
.role-advisor  { background: #1d2028; color: #f0f1f3; }
.role-exec_gc  { background: #1d2028; color: #f0f1f3; box-shadow: none; padding-left: 9px; }

/* Inside white cards — keep white text on dark chip */
.card .role,
.card .role-admin, .card .role-chair,
.card .role-delegate, .card .role-advisor,
.card .role-exec_gc {
    background: #1d2028;
    color: #f0f1f3;
}

/* Inside data-tables — same uniform dark chip */
.data-table .role,
.data-table .role-admin, .data-table .role-chair,
.data-table .role-delegate, .data-table .role-advisor,
.data-table .role-exec_gc {
    background: #1d2028;
    color: #f0f1f3;
}

/* Inside dark sidebar footer — lighter translucent version */
.sidebar .user-card .role {
    background: rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.90);
    border: 1px solid rgba(255, 255, 255, 0.18);
}

/* Inside impersonation banner (amber bg) — dark tinted version */
.impersonation-banner .imp-text .role {
    background: rgba(0, 0, 0, 0.12);
    color: #4a3300;
    border: 1px solid rgba(0, 0, 0, 0.14);
}

/* ================================================================== */
/* SELECT — light input style everywhere, zero blue transitions        */
/* Covers every selector variant so nothing leaks through             */
/* ================================================================== */
select,
.form select,
.inline-form select,
.assign-form select,
.committee-select,
.notes-compose select,
.notes-compose .committee-select {
    background-color: #f5f6fa;
    color: #1a2245;
    border: 1px solid #d0d4e0;
    font-weight: 400;
    box-shadow: none;
    /* Re-declare all background sub-properties explicitly so pp-polish's
       `background` shorthand reset (which zeroes position/repeat) cannot win */
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%231a2245' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 14px 14px;
    padding-right: 34px;
}

select:hover,
.form select:hover,
.inline-form select:hover,
.assign-form select:hover,
.committee-select:hover,
.notes-compose select:hover,
.notes-compose .committee-select:hover {
    background-color: #eaecf4;
    border-color: #b5bdcf;
    color: #07054d;
    box-shadow: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2307054d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 14px 14px;
}

select:focus,
.form select:focus,
.inline-form select:focus,
.assign-form select:focus,
.committee-select:focus,
.notes-compose select:focus,
.notes-compose .committee-select:focus {
    outline: none;
    background-color: #f5f6fa;
    border-color: var(--pp-accent, #2f50e6);
    box-shadow: 0 0 0 2px rgba(47, 80, 230, 0.14);
    color: #07054d;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2307054d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 14px 14px;
}

select:disabled,
.form select:disabled,
.inline-form select:disabled,
.assign-form select:disabled {
    background-color: #eff0f5;
    color: #9aa0b8;
    cursor: not-allowed;
    box-shadow: none;
}

/* ================================================================== */
/* UNIFORM GREY BUTTONS — all interactive buttons same charcoal grey  */
/* ================================================================== */
:root { --btn: #393e4d; --btn-hover: #444a5c; --btn-text: #f0f2f5; }

/* Base: every button element and .button anchor */
button, .button,
a.button, a.primary.button {
    background: var(--btn);
    color: var(--btn-text);
    border-color: rgba(0, 0, 0, 0.18);
    box-shadow: none;
}
button:hover, .button:hover,
a.button:hover, a.primary.button:hover {
    background: var(--btn-hover);
    color: #ffffff;
    border-color: rgba(0, 0, 0, 0.22);
}

/* Primary variant — no more navy */
button.primary, .primary.button {
    background: var(--btn);
    border-color: rgba(0, 0, 0, 0.18);
    color: var(--btn-text);
    box-shadow: none;
}
button.primary:hover, .primary.button:hover {
    background: var(--btn-hover);
    border-color: rgba(0, 0, 0, 0.22);
    color: #ffffff;
}

/* Danger variant — no more red */
button.danger, .danger.button {
    background: var(--btn);
    border-color: rgba(0, 0, 0, 0.18);
    color: var(--btn-text);
    box-shadow: none;
}
button.danger:hover, .danger.button:hover {
    background: var(--btn-hover);
    border-color: rgba(0, 0, 0, 0.22);
    color: #ffffff;
}

/* Admin-page specific buttons */
.cfg-add, .cfg-remove,
.cfg-actions .cfg-remove,
.cfg-committee-row .cfg-remove {
    background: var(--btn);
    border-color: rgba(0, 0, 0, 0.18);
    color: var(--btn-text);
    box-shadow: none;
}
.cfg-add:hover, .cfg-remove:hover,
.cfg-actions .cfg-remove:hover,
.cfg-committee-row .cfg-remove:hover {
    background: var(--btn-hover);
    border-color: rgba(0, 0, 0, 0.22);
    color: #ffffff;
}
.permit-grant, .permit-revoke {
    background: var(--btn);
    border-color: rgba(0, 0, 0, 0.18);
    color: var(--btn-text);
}
.permit-grant:hover, .permit-revoke:hover {
    background: var(--btn-hover);
    border-color: rgba(0, 0, 0, 0.22);
    color: #ffffff;
}
.user-impersonate {
    background: var(--btn);
    border-color: rgba(0, 0, 0, 0.18);
    color: var(--btn-text);
}
.user-impersonate:hover {
    background: var(--btn-hover);
    border-color: rgba(0, 0, 0, 0.22);
    color: #ffffff;
}

/* Status buttons — grey, active state slightly brighter */
.status-btn {
    background: var(--btn);
    border-color: rgba(0, 0, 0, 0.18);
    color: var(--btn-text);
}
.status-btn:hover {
    background: var(--btn-hover);
    color: #ffffff;
}
.status-btn-pending.active,
.status-btn-debated.active,
.status-btn-debated,
.status-btn-passed,
.status-btn-passed:hover,
.status-btn-failed,
.status-btn-failed:hover,
.status-btn-summit,
.status-btn-summit:hover,
.status-btn-summit-on,
.status-btn-summit-on:hover {
    background: var(--btn-hover);
    color: #ffffff;
    border-color: rgba(0, 0, 0, 0.22);
    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.14);
}
.status-btn-debated.active,
.status-btn-debated {
    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.20), 0 0 0 2px rgba(255,255,255,0.10);
}

/* Vote buttons — grey with white text */
.vote-btn, .vote-btn-for, .vote-btn-against {
    background: var(--btn);
    border-color: rgba(0, 0, 0, 0.18);
    color: var(--btn-text);
}
.vote-btn:hover, .vote-btn-for:hover, .vote-btn-against:hover {
    background: var(--btn-hover);
    color: #ffffff;
    border-color: rgba(0, 0, 0, 0.22);
}
.vote-btn-for.active, .vote-btn-against.active {
    background: var(--btn-hover);
    color: #ffffff;
    border-color: rgba(0, 0, 0, 0.22);
    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.20);
}

/* Tally buttons — grey with white text, no amber/blue/purple.
   Use .data-table context (0,2,0) to beat .data-table td * (0,1,1). */
.tally-btn, .tally-btn-poi, .tally-btn-speech, .tally-btn-amendment {
    background: var(--btn);
    border-color: rgba(0, 0, 0, 0.18);
    color: var(--btn-text);
}
.data-table .tally-btn,
.data-table .tally-btn-poi,
.data-table .tally-btn-speech,
.data-table .tally-btn-amendment,
.tally-card .tally-btn,
.tally-card .tally-btn-poi,
.tally-card .tally-btn-speech,
.tally-card .tally-btn-amendment {
    background: var(--btn);
    border-color: rgba(0, 0, 0, 0.18);
    color: var(--btn-text);
}
.tally-btn-poi:hover,
.tally-btn-speech:hover,
.tally-btn-amendment:hover,
.data-table .tally-btn-poi:hover,
.data-table .tally-btn-speech:hover,
.data-table .tally-btn-amendment:hover {
    background: var(--btn-hover);
    color: #ffffff;
    border-color: rgba(0, 0, 0, 0.22);
}

/* Filter pills — dark inactive, darker active (tab-style) */
.filter-pill {
    background: var(--btn);
    border-color: rgba(0, 0, 0, 0.18);
    color: rgba(240, 242, 245, 0.72);
}
.filter-pill:hover {
    background: var(--btn-hover);
    border-color: rgba(0, 0, 0, 0.22);
    color: rgba(240, 242, 245, 0.92);
}
.filter-pill.active {
    background: #2c3040;
    border-color: rgba(0, 0, 0, 0.28);
    color: #ffffff;
    box-shadow: inset 0 -2px 0 var(--pp-accent, #2f50e6);
}

/* Login page submit — full-width grey */
.auth-card .form button.primary {
    background: var(--btn);
    border-color: rgba(0, 0, 0, 0.18);
    color: var(--btn-text);
    box-shadow: none;
}
.auth-card .form button.primary:hover {
    background: var(--btn-hover);
    color: #ffffff;
}

/* Card context: override any blue card-level rules */
.card button.primary, .card .primary.button,
.card .filter-pill.active {
    background: var(--btn-hover);
    color: #ffffff;
    border-color: rgba(0, 0, 0, 0.22);
}

/* ================================================================== */
/* INTERNATIONAL SUMMIT — white cards matching all other pages        */
/* ================================================================== */
.committee-card {
    background: #ffffff;
    border: 1px solid #e7e9f3;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.07), 0 1px 2px rgba(0, 0, 0, 0.04);
    color: #1a2245;
}
.committee-card,
.committee-card p,
.committee-card li,
.committee-card a,
.committee-card h2,
.committee-card h3,
.committee-card .resolution-title,
.committee-card .section-label { color: #1a2245; }

.committee-card .muted,
.committee-card .empty-committee,
.committee-card .small { color: #5b6481; }

.committee-card .committee-header { border-bottom-color: #e3e5ec; }

/* committee-tag chip inside white card */
.committee-card .committee-tag {
    background: #eef1ff;
    color: #1d2e8a;
    border-color: #c9d1f2;
}

/* Resolution links — light tile instead of translucent white */
.committee-card .resolution-link,
.resolution-link {
    background: #f7f8fb;
    border: 1px solid #e3e5ec;
    color: #1a2245;
    border-radius: 4px;
}
.committee-card .resolution-link:hover,
.resolution-link:hover {
    background: #eef0f6;
    border-color: #c9cedf;
    color: #07054d;
}
.committee-card .resolution-title { color: #07054d; }
.committee-card .resolution-link .muted,
.committee-card .resolution-link .small { color: #5b6481; }

/* Chairs / agenda toggles — dark summary text on white card */
.chairs-toggle > summary,
.agenda-toggle > summary {
    color: #5b6481;
}
.chairs-toggle > summary:hover,
.agenda-toggle > summary:hover { color: #1a2245; }

/* Section label inside committee card */
.committee-card .section-label { color: #5b6481; }

/* Role tags inside the people-list on summit card */
.committee-card .role-tag {
    background: #eef1ff;
    color: #1d2e8a;
    border: 1px solid #c9d1f2;
    border-radius: 3px;
}
.committee-card .person-name { color: #1a2245; }
.committee-card .agenda-list li { color: #1a2245; }
