:root {
    --up-navy: #143A68;
    --up-blue: #175FAE;
    --up-blue-light: #4E8FD1;
    --up-blue-soft: #EAF3FF;

    --up-yellow: #FFD21A;
    --up-yellow-hover: #E7B900;

    --up-bg: #F4F8FD;
    --up-text: #1E293B;
}:root {
    --up-navy: #143A68;
    --up-blue: #175FAE;
    --up-blue-light: #4E8FD1;
    --up-blue-soft: #EAF3FF;
    --up-yellow: #FFD21A;
    --up-yellow-hover: #E7B900;
    --up-bg: #F4F8FD;
    --up-text: #1E293B;
}

body { background: var(--up-bg); }

.up-header {
    background:
        radial-gradient(circle at 88% -30%, rgba(255,210,26,.22), transparent 30%),
        linear-gradient(108deg, var(--up-navy) 0%, var(--up-blue) 58%, var(--up-blue-light) 100%);
}

.up-panel-button {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    padding: 0 .95rem;
    border-radius: .8rem;
    border: 1px solid rgba(255,255,255,.28);
    background: rgba(255,255,255,.12);
    color: #fff;
    font-weight: 900;
    white-space: nowrap;
    transition: .15s ease;
    box-shadow: 0 4px 14px rgba(23,56,95,.14);
}
.up-panel-button i { color: var(--up-yellow); }
.up-panel-button:hover {
    background: var(--up-yellow);
    border-color: var(--up-yellow);
    color: var(--up-navy);
    transform: translateY(-1px);
}
.up-panel-button:hover i { color: var(--up-navy); }

.up-primary {
    background: var(--up-yellow) !important;
    color: var(--up-navy) !important;
    border-color: var(--up-yellow) !important;
    font-weight: 900;
    box-shadow: 0 5px 16px rgba(242,185,0,.20);
}
.up-primary:hover {
    background: var(--up-yellow-hover) !important;
    border-color: var(--up-yellow-hover) !important;
}

.up-secondary { background: var(--up-navy) !important; color:#fff !important; }
.up-secondary:hover { background: var(--up-blue) !important; }
.up-brand-icon { color: var(--up-yellow) !important; }
.up-selected, tr.up-selected { background: var(--up-blue-soft) !important; box-shadow: inset 5px 0 0 var(--up-blue); }
.up-hero {
    background:
        radial-gradient(circle at 94% 25%, rgba(255,210,26,.18), transparent 26%),
        linear-gradient(115deg, var(--up-navy) 0%, var(--up-blue) 50%, var(--up-blue-light) 100%);
}

@media (max-width: 640px) {
    .up-panel-button span { display:none; }
    .up-panel-button { width:44px; padding:0; }
}

body { background: var(--up-bg); }

.up-header {
    background:
        radial-gradient(circle at 88% -30%, rgba(255,210,26,.22), transparent 30%),
        linear-gradient(108deg, var(--up-navy) 0%, var(--up-blue) 58%, var(--up-blue-light) 100%);
}

.up-panel-button {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    padding: 0 .95rem;
    border-radius: .8rem;
    border: 1px solid rgba(255,255,255,.28);
    background: rgba(255,255,255,.12);
    color: #fff;
    font-weight: 900;
    white-space: nowrap;
    transition: .15s ease;
    box-shadow: 0 4px 14px rgba(23,56,95,.14);
}
.up-panel-button i { color: var(--up-yellow); }
.up-panel-button:hover {
    background: var(--up-yellow);
    border-color: var(--up-yellow);
    color: var(--up-navy);
    transform: translateY(-1px);
}
.up-panel-button:hover i { color: var(--up-navy); }

.up-primary {
    background: var(--up-yellow) !important;
    color: var(--up-navy) !important;
    border-color: var(--up-yellow) !important;
    font-weight: 900;
    box-shadow: 0 5px 16px rgba(242,185,0,.20);
}
.up-primary:hover {
    background: var(--up-yellow-hover) !important;
    border-color: var(--up-yellow-hover) !important;
}

.up-secondary { background: var(--up-navy) !important; color:#fff !important; }
.up-secondary:hover { background: var(--up-blue) !important; }
.up-brand-icon { color: var(--up-yellow) !important; }
.up-selected, tr.up-selected { background: var(--up-blue-soft) !important; box-shadow: inset 5px 0 0 var(--up-blue); }
.up-hero {
    background:
        radial-gradient(circle at 94% 25%, rgba(255,210,26,.18), transparent 26%),
        linear-gradient(115deg, #17385F 0%, #2F69A8 50%, #4F89C7 100%);
}

@media (max-width: 640px) {
    .up-panel-button span { display:none; }
    .up-panel-button { width:44px; padding:0; }
}
