/* ==========================================================================
   PALEXODE DISCORD PALWORLD SHOP - DESIGN SYSTEM & STYLESHEET
   ========================================================================== */

:root {
    --bg-primary: #0a0d14;
    --bg-secondary: #121824;
    --bg-card: rgba(22, 29, 44, 0.75);
    --bg-card-hover: rgba(30, 41, 62, 0.85);

    --accent-discord: #5865f2;
    --accent-discord-hover: #4752c4;
    --accent-cyan: #00f2fe;
    --accent-purple: #9d4edd;
    --accent-gold: #ffb703;
    --accent-green: #2ec4b6;
    --accent-red: #e63946;

    --rarity-common: #8d99ae;
    --rarity-uncommon: #2ec4b6;
    --rarity-rare: #3a86ff;
    --rarity-epic: #9d4edd;
    --rarity-legendary: #ffb703;

    --text-primary: #f8f9fa;
    --text-secondary: #94a3b8;
    --text-muted: #64748b;

    --border-color: rgba(255, 255, 255, 0.08);
    --border-glow: rgba(0, 242, 254, 0.3);

    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 20px;
    --radius-full: 9999px;

    --font-heading: 'Segoe UI Variable Display', 'Segoe UI', system-ui, sans-serif;
    --font-body: 'Segoe UI Variable Text', 'Segoe UI', system-ui, sans-serif;

    --shadow-card: 0 10px 30px rgba(0, 0, 0, 0.5);
    --shadow-glow: 0 0 25px rgba(0, 242, 254, 0.2);
}

/* Reset & Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-body);
    background-color: var(--bg-primary);
    color: var(--text-primary);
    min-height: 100vh;
    overflow-x: hidden;
    line-height: 1.5;
}

.global-data-loader {
    position: fixed;
    top: 1rem;
    left: 50%;
    z-index: 10000;
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 42px;
    padding: 0.65rem 1rem;
    transform: translateX(-50%);
    border: 1px solid rgba(0, 242, 254, 0.38);
    border-radius: var(--radius-full);
    color: var(--text-primary);
    background: rgba(7, 22, 27, 0.94);
    box-shadow:
        0 10px 32px rgba(0, 0, 0, 0.42),
        0 0 20px rgba(0, 242, 254, 0.12);
    backdrop-filter: blur(12px);
    font-size: 0.82rem;
    font-weight: 700;
    pointer-events: none;
    animation: global-loader-in 0.18s ease-out;
}

.global-data-loader[hidden] {
    display: none;
}

.global-data-loader-spinner {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    border: 2px solid rgba(255, 255, 255, 0.22);
    border-top-color: var(--accent-cyan);
    border-radius: 50%;
    animation: global-loader-spin 0.72s linear infinite;
}

.home-block-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}
.home-dynamic-block {
    min-width: 0;
    background-position: center;
    background-size: cover;
}
.home-dynamic-block.layout-wide {
    grid-column: 1/-1;
}
.home-dynamic-block.layout-centered {
    grid-column: 1/-1;
    width: min(1200px, 100%);
    justify-self: center;
}
.home-content-block {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-height: 180px;
    padding: 1.5rem;
}
.home-content-block .home-block-emoji {
    font-size: 3rem;
}
.home-content-block p {
    margin-top: 0.55rem;
    color: var(--text-secondary);
    white-space: pre-wrap;
}
.home-video-block {
    display: grid;
    gap: 1rem;
    padding: 1.25rem;
}
.home-video-heading {
    display: flex;
    align-items: center;
    gap: 1rem;
}
.home-video-heading .home-block-emoji {
    font-size: 2.5rem;
}
.home-video-heading p {
    margin-top: 0.35rem;
    color: var(--text-secondary);
    white-space: pre-wrap;
}
.home-video-frame {
    position: relative;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 16/9;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: #000;
}
.home-video-frame iframe,
.home-video-frame video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    object-fit: contain;
}
.home-video-url[hidden] {
    display: none;
}
.home-video-url progress {
    width: 100%;
    height: 10px;
    accent-color: var(--accent-cyan);
}
.home-page-editor {
    display: grid;
    gap: 1rem;
}
.home-editor-size-help {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.75rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
}
.home-editor-size-help span {
    padding: 0.25rem 0.5rem;
    border-radius: 99px;
    color: var(--text-muted);
    background: rgba(255, 255, 255, 0.05);
}
.home-block-editor-list {
    display: grid;
    gap: 0.75rem;
}
.home-block-editor {
    padding: 1rem;
    border: 1px solid var(--border-color);
    border-radius: 11px;
    background: rgba(3, 15, 20, 0.55);
}
.home-block-editor > header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.7rem;
    margin-bottom: 0.8rem;
}
.home-block-editor > header > span {
    color: #ffe083;
    font-size: 0.7rem;
}
.home-block-editor > header > div {
    display: flex;
    gap: 0.35rem;
}
.home-block-fields {
    display: grid;
    grid-template-columns: 110px minmax(170px, 0.5fr) minmax(260px, 1fr);
    gap: 0.65rem;
}
.home-block-fields label {
    display: grid;
    gap: 0.3rem;
    color: var(--text-muted);
    font-size: 0.75rem;
}
.home-block-fields .wide {
    grid-column: 1/-1;
}
.home-block-fields input,
.home-block-fields select,
.home-block-fields textarea {
    width: 100%;
    padding: 0.65rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: var(--text-primary);
    background: rgba(4, 16, 22, 0.9);
}
.home-block-enabled {
    display: flex !important;
    flex-direction: row;
    align-items: center;
}
.home-block-enabled input {
    width: auto;
}
@media (max-width: 760px) {
    .home-block-layout {
        grid-template-columns: 1fr;
    }
    .home-dynamic-block {
        grid-column: 1 !important;
    }
    .home-block-fields {
        grid-template-columns: 1fr;
    }
    .home-block-fields .wide {
        grid-column: auto;
    }
    .home-block-editor > header {
        grid-template-columns: 1fr;
    }
    .home-block-editor > header > div {
        justify-content: flex-start;
    }
}

@keyframes global-loader-spin {
    to {
        transform: rotate(360deg);
    }
}
@keyframes global-loader-in {
    from {
        opacity: 0;
        transform: translate(-50%, -6px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .global-data-loader {
        animation: none;
    }
    .global-data-loader-spinner {
        animation-duration: 1.5s;
    }
}

/* Background Animated Effects */
.bg-glow-orb {
    display: none;
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
    opacity: 0.18;
}

.orb-1 {
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, var(--accent-discord), var(--accent-purple));
    top: -100px;
    left: -100px;
}

.orb-2 {
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, var(--accent-cyan), var(--accent-discord));
    bottom: -150px;
    right: -150px;
}

.bg-grid-overlay {
    display: none;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
    background-size: 40px 40px;
    z-index: 0;
    pointer-events: none;
}

/* App Header */
.app-header {
    position: relative;
    top: 0;
    z-index: 100;
    background: #0a0f18;
    border-bottom: 1px solid var(--border-color);
}

/* Les flous dynamiques provoquent des recompositions coûteuses pendant le scroll. */
body * {
    backdrop-filter: none !important;
}

.header-container {
    width: 100%;
    max-width: 1840px;
    margin: 0 auto;
    padding: 1rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2.25rem;
}

.section-nav {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    flex: 1;
    justify-content: center;
    flex-wrap: nowrap;
}

.section-nav-btn {
    background: transparent;
    border: 1px solid transparent;
    color: var(--text-secondary);
    padding: 0.7rem 1.15rem;
    border-radius: var(--radius-full);
    font-family: var(--font-heading);
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    white-space: nowrap;
}

.section-nav-btn:hover {
    color: var(--text-primary);
    background: rgba(255, 255, 255, 0.06);
}

.section-nav-btn.active {
    color: white;
    background: linear-gradient(135deg, var(--accent-discord), var(--accent-purple));
    box-shadow: 0 4px 14px rgba(88, 101, 242, 0.25);
}

.section-nav-dropdown {
    position: relative;
}
.section-nav-dropdown[hidden] {
    display: none !important;
}
.section-nav-dropdown > summary {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.7rem 1rem;
    border: 1px solid transparent;
    border-radius: var(--radius-full);
    color: var(--text-secondary);
    font-family: var(--font-heading);
    font-weight: 750;
    cursor: pointer;
    list-style: none;
    white-space: nowrap;
}
.section-nav-dropdown > summary::-webkit-details-marker {
    display: none;
}
.section-nav-dropdown > summary span {
    font-size: 0.78rem;
    transition: transform 0.18s ease;
}
.section-nav-dropdown[open] > summary,
.section-nav-dropdown:has(.section-nav-btn.active) > summary {
    color: #fff;
    background: rgba(255, 255, 255, 0.07);
}
.section-nav-dropdown[open] > summary span {
    transform: rotate(180deg);
}
.section-nav-menu {
    position: absolute;
    top: calc(100% - 2px);
    left: 50%;
    z-index: 140;
    display: grid;
    width: max-content;
    min-width: 260px;
    gap: 0.3rem;
    padding: 0.72rem 0.55rem 0.55rem;
    border: 1px solid var(--border-color);
    border-radius: 13px;
    background: #0c141f;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.45);
    transform: translateX(-50%);
}
.section-nav-menu .section-nav-btn {
    display: grid;
    width: 100%;
    gap: 0.12rem;
    padding: 0.7rem 0.85rem;
    border-radius: 9px;
    text-align: left;
}
.section-nav-menu .section-nav-btn small {
    color: var(--text-muted);
    font-family: var(--font-body);
    font-size: 0.68rem;
    font-weight: 500;
}
.section-nav-menu .section-nav-btn.active small {
    color: rgba(255, 255, 255, 0.78);
}
.section-nav-admin-menu {
    left: auto;
    right: 0;
    min-width: 220px;
    transform: none;
}

.nav-toggle {
    display: none;
    width: 44px;
    height: 44px;
    padding: 10px;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.05);
    cursor: pointer;
    place-content: center;
    gap: 5px;
}
.nav-toggle[hidden] {
    display: none !important;
}
.nav-toggle span {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: var(--text-primary);
    transition:
        transform 0.18s ease,
        opacity 0.18s ease;
}
.nav-toggle.open span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}
.nav-toggle.open span:nth-child(2) {
    opacity: 0;
}
.nav-toggle.open span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.theme-toggle {
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}
.theme-toggle-track {
    position: relative;
    display: block;
    width: 54px;
    height: 30px;
    border: 1px solid var(--border-color);
    border-radius: 999px;
    background: #202a3a;
    box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.25);
    transition:
        background 0.2s ease,
        border-color 0.2s ease;
}
.theme-toggle-thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    display: grid;
    width: 22px;
    height: 22px;
    place-items: center;
    border-radius: 50%;
    background: #f6f8fb;
    color: #172033;
    transition: transform 0.22s ease;
}
.theme-toggle svg {
    position: absolute;
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: opacity 0.18s ease;
}
.theme-icon-sun {
    opacity: 0;
}
.theme-icon-moon {
    opacity: 1;
}
html[data-theme='light'] .theme-toggle-track {
    background: #dcecff;
    border-color: #a9bfd8;
}
html[data-theme='light'] .theme-toggle-thumb {
    transform: translateX(24px);
    background: #fff4b8;
    color: #a85b00;
}
html[data-theme='light'] .theme-icon-sun {
    opacity: 1;
}
html[data-theme='light'] .theme-icon-moon {
    opacity: 0;
}

.brand-logo {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    flex: 0 0 auto;
}

.logo-icon {
    width: 44px;
    height: 44px;
    background: linear-gradient(135deg, var(--accent-discord), var(--accent-cyan));
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    position: relative;
    box-shadow: 0 0 15px rgba(88, 101, 242, 0.4);
}
.logo-icon svg {
    width: 23px;
    height: 23px;
    fill: #fff;
}

.logo-text .brand-title {
    font-family: var(--font-heading);
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: 0.5px;
}

.brand-wordmark {
    position: relative;
    display: inline-flex;
    align-items: baseline;
    margin: 0;
    color: #fff9df;
    font-family: 'Cooper Black', 'Arial Rounded MT Bold', 'Trebuchet MS', var(--font-heading);
    font-size: 1.34rem;
    font-weight: 900;
    letter-spacing: -0.035em;
    line-height: 1;
    text-transform: uppercase;
    -webkit-text-stroke: 1.5px #102b4a;
    paint-order: stroke fill;
    text-shadow:
        0 2px 0 #102b4a,
        2px 2px 0 #102b4a,
        -2px 2px 0 #102b4a,
        0 4px 0 #20b7ca,
        0 0 9px rgba(44, 218, 235, 0.38);
    transform: rotate(-1deg);
}
.brand-wordmark::after {
    content: '✦';
    position: absolute;
    top: -0.48em;
    right: -0.65em;
    color: #64ecf4;
    font-family: sans-serif;
    font-size: 0.48em;
    -webkit-text-stroke: 0;
    text-shadow: 0 0 6px rgba(80, 230, 242, 0.8);
    transform: rotate(10deg);
}
.brand-wordmark > span:last-child {
    color: #fff9df;
}
.brand-initial {
    position: relative;
    z-index: 1;
    display: inline-block;
    margin-right: 0.015em;
    color: #fff4c7;
    font-size: 1.62em;
    letter-spacing: -0.08em;
    transform: rotate(-4deg) translateY(0.03em);
}
.footer-wordmark {
    font-size: 1rem;
}
html[data-theme='light'] .brand-wordmark {
    color: #fff9df;
    -webkit-text-stroke-color: #183657;
    text-shadow:
        0 2px 0 #183657,
        2px 2px 0 #183657,
        -2px 2px 0 #183657,
        0 4px 0 #1598ad,
        0 0 7px rgba(21, 152, 173, 0.2);
}

.brand-wordmark-image-wrap {
    display: flex;
    width: 185px;
    height: 40px;
    align-items: center;
    margin: 0;
}
.brand-wordmark-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: left center;
    filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.35));
}
.footer-wordmark-image {
    display: block;
    width: 145px;
    height: 38px;
    object-fit: contain;
    object-position: left center;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.28));
}
html[data-theme='light'] :is(.brand-wordmark-image, .footer-wordmark-image) {
    filter: drop-shadow(0 2px 4px rgba(31, 48, 65, 0.2));
}

.api-badge {
    font-size: 0.75rem;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

.api-badge strong {
    color: var(--text-primary);
}

.badge-dot {
    width: 6px;
    height: 6px;
    background-color: #2ec4b6;
    border-radius: 50%;
    box-shadow: 0 0 8px #2ec4b6;
}

.badge-dot.offline {
    background-color: var(--accent-gold);
    box-shadow: 0 0 8px var(--accent-gold);
}

.live-pulse {
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(0.95);
        opacity: 0.8;
    }
    50% {
        transform: scale(1.15);
        opacity: 1;
    }
    100% {
        transform: scale(0.95);
        opacity: 0.8;
    }
}

/* User Profile Badge */
.header-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 0 0 auto;
    min-width: 0;
}

.auth-btn {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-discord));
    color: #07111f;
    border: none;
    padding: 0.65rem 1rem;
    border-radius: var(--radius-md);
    font-family: var(--font-heading);
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(0, 242, 254, 0.25);
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.auth-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 242, 254, 0.35);
}

.auth-btn.ghost {
    background: rgba(255, 255, 255, 0.06);
    color: var(--text-primary);
    box-shadow: none;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
}
.logout-icon {
    display: none;
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.user-profile-badge {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    padding: 0.4rem 0.9rem;
    border-radius: var(--radius-md);
}

.user-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 2px solid var(--accent-discord);
}

.user-details {
    display: flex;
    flex-direction: column;
}

.user-name {
    font-size: 0.82rem;
    font-weight: 600;
}

.user-balance {
    font-size: 0.75rem;
    color: var(--accent-gold);
    font-weight: 600;
}

/* Cart Button */
.cart-btn {
    display: flex;
    align-items: center;
    background: linear-gradient(135deg, var(--accent-discord), var(--accent-purple));
    color: white;
    border: none;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    order: -1;
    padding: 0;
    justify-content: center;
    border-radius: 50%;
    font-family: var(--font-heading);
    font-weight: 700;
    cursor: pointer;
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
    box-shadow: 0 4px 15px rgba(88, 101, 242, 0.3);
}

.cart-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(88, 101, 242, 0.5);
}

.cart-icon-wrapper {
    position: relative;
    width: 21px;
    height: 21px;
    display: block;
}

.cart-icon-wrapper svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.cart-badge {
    position: absolute;
    top: -8px;
    right: -10px;
    background: var(--accent-gold);
    color: #000;
    font-size: 0.7rem;
    font-weight: 800;
    padding: 0.1rem 0.4rem;
    border-radius: var(--radius-full);
}

/* Main Layout */
.main-layout {
    max-width: 1350px;
    margin: 0 auto;
    padding: 2rem 1.5rem;
    position: relative;
    /* Keep inventory tooltips above the following site footer. Both used to
       share z-index: 1, so the later-painted footer covered Palbox details. */
    z-index: 2;
}

/* Site Footer */
.site-footer {
    position: relative;
    z-index: 1;
    margin-top: 3rem;
    border-top: 1px solid rgba(255, 255, 255, 0.09);
    background: #080d14;
    color: var(--text-secondary);
}

.site-footer-grid {
    width: min(100% - 3rem, 1350px);
    margin: 0 auto;
    padding: 2.5rem 0 2rem;
    display: grid;
    grid-template-columns: minmax(280px, 1.5fr) repeat(2, minmax(150px, 0.75fr)) minmax(230px, 1fr);
    gap: 2.5rem;
}

.site-footer-brand,
.site-footer-info,
.site-footer-links {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.65rem;
}
.site-footer-logo {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    color: #fff;
    font-family: var(--font-heading);
    font-size: 1.15rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-decoration: none;
}
.site-footer-logo span {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--accent-discord), var(--accent-cyan));
}
.site-footer-brand p,
.site-footer-info p {
    max-width: 440px;
    font-size: 0.82rem;
    line-height: 1.65;
}
.site-footer-links > strong,
.site-footer-info > strong {
    margin-bottom: 0.2rem;
    color: var(--text-primary);
    font-size: 0.82rem;
}
.site-footer-links a {
    color: var(--text-secondary);
    font-size: 0.82rem;
    text-decoration: none;
    transition: color 0.15s ease;
}
.site-footer-links a:hover {
    color: var(--accent-cyan);
}
.site-footer-socials {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: start;
    gap: 0.8rem;
}
.site-footer-socials a {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.045);
    color: var(--text-primary);
    transition:
        transform 0.18s ease,
        border-color 0.18s ease,
        background 0.18s ease,
        box-shadow 0.18s ease;
}
.site-footer-socials a:hover {
    transform: translateY(-2px);
    border-color: var(--accent-cyan);
    background: rgba(0, 242, 254, 0.08);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25);
}
.site-footer-socials svg,
.site-footer-socials img {
    width: 33px;
    height: 33px;
    object-fit: contain;
}
.site-footer-socials svg {
    fill: currentColor;
}
.top-servers-logo-light-theme {
    display: none;
}
html[data-theme='light'] .top-servers-logo-dark-theme {
    display: none;
}
html[data-theme='light'] .top-servers-logo-light-theme {
    display: block;
}
.site-footer-status {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.25rem;
    font-size: 0.78rem;
}
.site-footer-status strong {
    color: var(--text-primary);
}
.site-footer-bottom {
    width: min(100% - 3rem, 1350px);
    margin: 0 auto;
    padding: 1rem 0 1.25rem;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    color: var(--text-muted);
    font-size: 0.72rem;
}

@media (max-width: 900px) {
    .site-footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 2rem;
    }
}
.tournament-prize-results {
    display: grid;
    gap: 0.25rem;
    max-height: 180px;
    overflow: auto;
}
.tournament-prize-results button {
    display: grid;
    grid-template-columns: 30px 1fr auto;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.04);
    color: var(--text-primary);
}
.tournament-prize-results img {
    width: 28px;
    height: 28px;
    object-fit: contain;
}
.tournament-prize-selected {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.35rem;
}
.tournament-prize-selected span {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.3rem;
    border-radius: 6px;
    background: rgba(0, 242, 254, 0.1);
}
.tournament-prize-selected input {
    width: 58px;
}
.tournament-prize-selected button {
    border: 0;
    background: none;
    color: #ff8d98;
    cursor: pointer;
}
.tournament-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-top: 0.35rem;
}
.tournament-form > label,
.tournament-form > .wide {
    gap: 0.5rem;
    color: var(--text-muted);
    font-size: 0.82rem;
    font-weight: 700;
}
.tournament-form input,
.tournament-form select,
.tournament-form textarea,
.reward-pal-customizer input,
.reward-pal-customizer select {
    width: 100%;
    min-height: 42px;
    padding: 0.65rem 0.75rem;
    border: 1px solid rgba(132, 162, 181, 0.24);
    border-radius: 8px;
    background: rgba(4, 16, 22, 0.88);
    color: var(--text-primary);
    font: inherit;
    outline: none;
}
.tournament-form input:focus,
.tournament-form select:focus,
.tournament-form textarea:focus,
.reward-pal-customizer input:focus,
.reward-pal-customizer select:focus {
    border-color: var(--accent-cyan);
    box-shadow: 0 0 0 3px rgba(0, 242, 254, 0.1);
}
.tournament-form input[type='datetime-local'] {
    color-scheme: dark;
}
.tournament-player-results:empty {
    display: none;
}
.tournament-player-results {
    padding: 0.4rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(3, 15, 20, 0.95);
}
.tournament-prize-row {
    grid-template-columns: minmax(220px, 0.7fr) 140px minmax(320px, 1.3fr) auto;
    background: rgba(4, 18, 24, 0.5);
}
.tournament-prize-selected .pal-configure {
    padding: 0.25rem 0.45rem;
    border: 1px solid rgba(0, 242, 254, 0.3);
    border-radius: 5px;
    color: var(--accent-cyan);
}
.reward-pal-customizer {
    width: min(920px, calc(100vw - 2rem));
    max-height: 90vh;
    overflow: auto;
}
.reward-pal-customizer fieldset {
    margin: 0.8rem 0;
    padding: 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
}
.reward-pal-customizer legend {
    padding: 0 0.4rem;
    color: #ffe083;
}
.reward-pal-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.65rem;
}
.reward-pal-grid label {
    display: grid;
    gap: 0.3rem;
    color: var(--text-muted);
    font-size: 0.8rem;
}
@media (max-width: 900px) {
    .tournament-form,
    .tournament-prize-row,
    .reward-pal-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 600px) {
    .tournament-form,
    .tournament-prize-row,
    .reward-pal-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .site-footer-grid {
        width: min(100% - 2rem, 1350px);
        grid-template-columns: 1fr;
        padding-top: 2rem;
    }
    .site-footer-bottom {
        width: min(100% - 2rem, 1350px);
        flex-direction: column;
    }
}

.page-section {
    display: none;
}

.page-section.active {
    display: block;
}

@keyframes sectionFade {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Hero Banner */
.hero-banner {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    padding: 3.5rem 3rem;
    margin-bottom: 2.5rem;
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-card);
}

.hero-background {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0.72;
}

.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(10, 13, 20, 0.95) 20%, rgba(10, 13, 20, 0.6) 100%);
}

.hero-content {
    position: relative;
    z-index: 2;
    max-width: 800px;
}

.hero-chip {
    display: inline-block;
    background: rgba(0, 242, 254, 0.15);
    color: var(--accent-cyan);
    border: 1px solid var(--accent-cyan);
    padding: 0.3rem 0.8rem;
    border-radius: var(--radius-full);
    font-size: 0.75rem;
    font-weight: 700;
    margin-bottom: 1rem;
    letter-spacing: 0.5px;
}

.hero-title {
    font-family: var(--font-heading);
    font-size: 2.5rem;
    font-weight: 800;
    line-height: 1.15;
    margin-bottom: 0.8rem;
}

.hero-title span {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-discord));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.hero-description {
    color: var(--text-secondary);
    font-size: 1rem;
    margin-bottom: 1.8rem;
    line-height: 1.6;
}

.hero-actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
}

.hero-action-btn {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.75rem 1rem;
    border-radius: var(--radius-md);
    font-family: var(--font-heading);
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
}

.hero-action-btn:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.12);
}

.hero-action-btn.primary {
    background: linear-gradient(135deg, var(--accent-discord), var(--accent-purple));
    border-color: transparent;
}

.home-stats-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 0.5rem;
}

.stat-card {
    background: rgba(18, 24, 36, 0.82);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 1rem 1.1rem;
    backdrop-filter: blur(10px);
}

.stat-card.compact {
    padding: 0.85rem 1rem;
}

.stat-label {
    display: block;
    font-size: 0.76rem;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 0.35rem;
}

.stat-value {
    display: block;
    font-family: var(--font-heading);
    font-size: 1.55rem;
    font-weight: 800;
}

.stat-sub {
    display: block;
    margin-top: 0.25rem;
    color: var(--text-secondary);
    font-size: 0.82rem;
}

/* Player Selector Bar */
.player-select-container {
    background: rgba(18, 24, 36, 0.85);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--radius-md);
    padding: 1rem 1.2rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.player-select-label {
    font-weight: 600;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--accent-cyan);
}

.player-input-group {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    flex: 1;
}

.player-dropdown,
.player-text-input {
    background: rgba(10, 13, 20, 0.8);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.6rem 1rem;
    border-radius: var(--radius-sm);
    font-family: var(--font-body);
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.2s ease;
}

.player-dropdown {
    flex: 1;
    min-width: 200px;
    cursor: pointer;
}

.player-text-input {
    flex: 1;
    min-width: 220px;
}

.player-dropdown:focus,
.player-text-input:focus {
    border-color: var(--accent-cyan);
    box-shadow: 0 0 10px rgba(0, 242, 254, 0.2);
}

.divider-text {
    font-size: 0.8rem;
    color: var(--text-muted);
}

.btn-refresh-players {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.6rem 0.9rem;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: background 0.2s ease;
}

.btn-refresh-players:hover {
    background: rgba(255, 255, 255, 0.1);
}

/* Toolbar & Category Filters */
.toolbar-section {
    margin-bottom: 2rem;
}

.section-header.slim {
    margin-bottom: 1rem;
}

.section-note {
    color: var(--text-secondary);
    font-size: 0.88rem;
    margin-top: 0.25rem;
}

.category-tabs {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    overflow-x: auto;
    padding-bottom: 0.8rem;
    margin-bottom: 1.2rem;
    scrollbar-width: thin;
}

.category-tab {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    color: var(--text-secondary);
    padding: 0.6rem 1.2rem;
    border-radius: var(--radius-full);
    font-family: var(--font-heading);
    font-weight: 600;
    font-size: 0.88rem;
    cursor: pointer;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.2s ease;
}

.category-tab:hover {
    color: var(--text-primary);
    border-color: rgba(255, 255, 255, 0.2);
    background: var(--bg-card-hover);
}

.category-tab.active {
    background: linear-gradient(135deg, var(--accent-discord), var(--accent-purple));
    color: white;
    border-color: transparent;
    box-shadow: 0 4px 15px rgba(88, 101, 242, 0.3);
}

.search-filter-bar {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box {
    flex: 1;
    min-width: 280px;
    position: relative;
    display: flex;
    align-items: center;
}

.search-icon {
    position: absolute;
    left: 1rem;
    color: var(--text-muted);
}

.search-box input {
    width: 100%;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.75rem 1rem 0.75rem 2.8rem;
    border-radius: var(--radius-md);
    font-size: 0.9rem;
    outline: none;
    transition: all 0.2s ease;
}

.search-box input:focus {
    border-color: var(--accent-discord);
    box-shadow: 0 0 15px rgba(88, 101, 242, 0.2);
}

.custom-select {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.75rem 1.2rem;
    border-radius: var(--radius-md);
    font-size: 0.9rem;
    outline: none;
    cursor: pointer;
    min-width: 180px;
}

/* Items Grid Section */
.section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

.section-title {
    font-family: var(--font-heading);
    font-size: 1.4rem;
    font-weight: 700;
}

.items-count {
    font-size: 0.85rem;
    color: var(--text-muted);
}

.items-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.5rem;
}

/* Item Card */
.item-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 1.3rem;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    transition:
        transform 0.25 ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease;
    backdrop-filter: blur(10px);
}

.item-card:hover {
    transform: translateY(-5px);
    border-color: rgba(255, 255, 255, 0.25);
    box-shadow: var(--shadow-card);
}

/* Rarity Glow Borders */
.item-card.rarity-common {
    --item-rarity-color: var(--rarity-common);
}
.item-card.rarity-uncommon {
    --item-rarity-color: var(--rarity-uncommon);
}
.item-card.rarity-rare {
    --item-rarity-color: var(--rarity-rare);
}
.item-card.rarity-epic {
    --item-rarity-color: var(--rarity-epic);
}
.item-card.rarity-legendary {
    --item-rarity-color: var(--rarity-legendary);
    box-shadow: 0 0 15px rgba(255, 183, 3, 0.15);
}
.item-card[class*='rarity-'] {
    border: 1px solid color-mix(in srgb, var(--item-rarity-color) 65%, transparent);
    border-top: 4px solid var(--item-rarity-color);
    background: linear-gradient(
        145deg,
        color-mix(in srgb, var(--item-rarity-color) 13%, var(--bg-card)),
        var(--bg-card) 55%
    );
}

.card-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.item-icon-frame {
    width: 60px;
    height: 60px;
    background: rgba(10, 13, 20, 0.6);
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    border: 1px solid var(--border-color);
}

.catalog-item-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.catalog-item-placeholder {
    color: var(--text-muted);
    font-size: 1.8rem;
}

.rarity-badge {
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
    padding: 0.2rem 0.6rem;
    border-radius: var(--radius-full);
    letter-spacing: 0.5px;
}

.rarity-badge.common {
    background: rgba(141, 153, 174, 0.15);
    color: var(--rarity-common);
}
.rarity-badge.uncommon {
    background: rgba(46, 196, 182, 0.15);
    color: var(--rarity-uncommon);
}
.rarity-badge.rare {
    background: rgba(58, 134, 255, 0.15);
    color: var(--rarity-rare);
}
.rarity-badge.epic {
    background: rgba(157, 78, 221, 0.15);
    color: var(--rarity-epic);
}
.rarity-badge.legendary {
    background: rgba(255, 183, 3, 0.2);
    color: var(--rarity-legendary);
    border: 1px solid var(--rarity-legendary);
}

.item-title {
    font-family: var(--font-heading);
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 0.4rem;
}

.item-bundle-size,
.cart-item-bundle {
    color: var(--accent-cyan);
    font-size: 0.75rem;
    font-weight: 700;
}

.item-desc {
    font-size: 0.82rem;
    color: var(--text-secondary);
    margin-bottom: 1.2rem;
    flex: 1;
    line-height: 1.4;
}

.card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    margin-top: auto;
    padding-top: 0.8rem;
    border-top: 1px solid var(--border-color);
}

.item-price {
    font-family: var(--font-heading);
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--accent-gold);
}

.item-price.has-item-promotion,
.admin-catalog-price.has-item-promotion {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.item-price.has-item-promotion strong,
.admin-catalog-price.has-item-promotion strong {
    color: #ffbd2e;
}
.item-original-price {
    color: var(--text-muted);
    text-decoration: line-through;
    font-weight: 500;
}
.has-item-promotion small {
    color: #50e3a4;
    font-size: 0.68rem;
    font-weight: 800;
}
.admin-promotion-input {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
}
.admin-promotion-input input {
    border-radius: 10px 0 0 10px;
}
.admin-promotion-input span {
    align-self: stretch;
    display: grid;
    place-items: center;
    min-width: 42px;
    border: 1px solid var(--border-color);
    border-left: 0;
    border-radius: 0 10px 10px 0;
    background: rgba(4, 16, 22, 0.8);
    color: var(--accent);
    font-weight: 800;
}
.field-label-row {
    display: flex;
    align-items: baseline;
    gap: 0.45rem;
}
.field-optional {
    color: var(--text-muted);
    font-size: 0.7rem;
    font-weight: 500;
}

.btn-add-cart {
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.55rem 1rem;
    border-radius: var(--radius-sm);
    font-family: var(--font-heading);
    font-weight: 600;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-add-cart:hover {
    background: var(--accent-discord);
    border-color: var(--accent-discord);
    color: white;
    box-shadow: 0 4px 12px rgba(88, 101, 242, 0.3);
}

/* Cart Drawer */
.cart-drawer-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(6px);
    z-index: 200;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.cart-drawer-overlay.active {
    opacity: 1;
    pointer-events: auto;
}

.cart-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 420px;
    max-width: 100vw;
    background: var(--bg-secondary);
    z-index: 201;
    box-shadow: -10px 0 30px rgba(0, 0, 0, 0.7);
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.cart-drawer.active {
    transform: translateX(0);
}

.cart-drawer-header {
    padding: 1.2rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.cart-drawer-header h3 {
    font-family: var(--font-heading);
    font-size: 1.2rem;
    font-weight: 700;
}

.btn-close-drawer {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 1.8rem;
    cursor: pointer;
}

.cart-drawer-body {
    flex: 1;
    padding: 1.5rem;
    overflow-y: auto;
}

.cart-empty {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--text-muted);
}

.empty-icon {
    font-size: 3.5rem;
    margin-bottom: 1rem;
}

.empty-sub {
    font-size: 0.8rem;
    display: block;
    margin-top: 0.5rem;
}

.cart-item-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-sm);
    padding: 0.8rem;
    margin-bottom: 0.8rem;
}

.cart-item-info {
    flex: 1;
}

.cart-item-image {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    padding: 4px;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-sm);
    background: rgba(10, 13, 20, 0.6);
}

.cart-item-title {
    font-size: 0.9rem;
    font-weight: 600;
}

.cart-item-price {
    font-size: 0.8rem;
    color: var(--accent-gold);
}

.cart-item-price.has-discount {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.3rem;
}

.cart-item-price.has-discount small {
    flex-basis: 100%;
    color: var(--accent-cyan);
}

.cart-item-original-price {
    color: var(--text-muted);
    text-decoration: line-through;
}

.cart-qty-controls {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.qty-btn {
    width: 26px;
    height: 26px;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    color: white;
    border-radius: 4px;
    cursor: pointer;
}

.qty-val {
    font-size: 0.85rem;
    font-weight: 700;
    min-width: 20px;
    text-align: center;
}

.cart-drawer-footer {
    padding: 1.5rem;
    border-top: 1px solid var(--border-color);
    background: var(--bg-primary);
}

.cart-promo-row {
    display: flex;
    gap: 0.6rem;
    margin-bottom: 1.2rem;
}

.promo-input {
    flex: 1;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    color: white;
    padding: 0.5rem 0.8rem;
    border-radius: var(--radius-sm);
    font-size: 0.85rem;
}

.btn-apply-promo {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.5rem 0.9rem;
    border-radius: var(--radius-sm);
    font-size: 0.85rem;
    cursor: pointer;
}

.cart-summary {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.2rem;
}

.summary-line {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: var(--text-secondary);
}

.total-line {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--text-primary);
    padding-top: 0.5rem;
    border-top: 1px dashed var(--border-color);
}

.total-line #cartTotal {
    color: var(--accent-gold);
}

.btn-checkout {
    width: 100%;
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-discord));
    color: #000;
    border: none;
    padding: 0.9rem;
    border-radius: var(--radius-md);
    font-family: var(--font-heading);
    font-weight: 800;
    font-size: 1rem;
    cursor: pointer;
    box-shadow: 0 4px 20px rgba(0, 242, 254, 0.4);
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.btn-checkout:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 25px rgba(0, 242, 254, 0.6);
}

/* Map Section */
.map-layout {
    display: grid;
    grid-template-columns: minmax(300px, 360px) minmax(0, 1fr);
    gap: 1.25rem;
    align-items: start;
}

.map-world-switch {
    display: inline-flex;
    gap: 0.35rem;
    margin: 0 0 0.85rem;
    padding: 0.3rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(6, 18, 26, 0.75);
}

.map-world-switch button {
    padding: 0.55rem 0.85rem;
    border: 0;
    border-radius: 7px;
    color: var(--text-muted);
    background: transparent;
    cursor: pointer;
}

.map-world-switch button.active {
    color: #071a27;
    background: var(--accent-cyan);
    font-weight: 700;
}

.map-stage {
    position: relative;
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    aspect-ratio: 1;
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1px solid var(--border-color);
    background: #071a27;
    box-shadow: var(--shadow-card);
    cursor: grab;
    touch-action: none;
    user-select: none;
}

.map-stage.dragging {
    cursor: grabbing;
}

.map-layout:fullscreen,
.admin-pal-map-canvas:fullscreen {
    width: 100vw;
    height: 100vh;
    max-height: none;
    aspect-ratio: auto;
    border: 0;
    border-radius: 0;
    background: #020b10;
}

.map-layout:fullscreen {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(280px, 24vw, 380px);
    align-items: center;
    gap: 1rem;
    padding: 1rem;
}

.map-layout:fullscreen .map-stage {
    grid-column: 1;
    grid-row: 1;
    width: min(100%, calc(100vh - 2rem));
    height: min(100%, calc(100vh - 2rem));
    aspect-ratio: 1;
    justify-self: center;
}

.map-layout:fullscreen .map-side-panel {
    grid-column: 2;
    grid-row: 1;
    max-height: calc(100vh - 2rem);
    overflow: auto;
}

.map-plane,
.map-background-image,
.map-trail-layer,
.map-layer {
    position: absolute;
    inset: 0;
}

.map-plane {
    transform-origin: 0 0;
}

.map-background-image {
    width: 100%;
    height: 100%;
    object-fit: fill;
    image-rendering: auto;
    pointer-events: none;
}

.map-trail-layer {
    z-index: 2;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.map-layer {
    z-index: 3;
    pointer-events: none;
}

.map-loading {
    position: absolute;
    inset: 0;
    z-index: 8;
    display: grid;
    place-items: center;
    color: var(--text-secondary);
    background: #071a27;
    transition: opacity 0.25s ease;
}

.map-loading.hidden {
    opacity: 0;
    pointer-events: none;
}

.map-grid {
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
    background-size: 48px 48px;
    opacity: 0.45;
}

.map-terrain {
    background:
        radial-gradient(ellipse at 18% 24%, rgba(46, 196, 182, 0.22), transparent 18%),
        radial-gradient(ellipse at 34% 58%, rgba(58, 134, 255, 0.2), transparent 18%),
        radial-gradient(ellipse at 68% 28%, rgba(255, 183, 3, 0.18), transparent 20%),
        radial-gradient(ellipse at 82% 74%, rgba(157, 78, 221, 0.17), transparent 22%);
    filter: blur(10px);
    opacity: 0.85;
}

.map-overlay-label {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 3;
    background: rgba(8, 12, 18, 0.7);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-full);
    padding: 0.45rem 0.8rem;
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    color: var(--accent-cyan);
}

.map-canvas {
    z-index: 2;
}

.map-layer {
    pointer-events: none;
}

.map-marker {
    position: absolute;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    transition:
        left 0.75s ease,
        top 0.75s ease;
}

.marker-label {
    background: rgba(10, 13, 20, 0.88);
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--radius-full);
    padding: 0.28rem 0.6rem;
    font-size: 0.74rem;
    white-space: nowrap;
    transform: scale(var(--marker-scale, 1));
}

.marker-ping {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(0, 242, 254, 0.75);
    filter: blur(1px);
    box-shadow: 0 0 18px rgba(0, 242, 254, 0.55);
    animation: pulse 2s infinite;
    transform-origin: center;
}

.map-controls {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 6;
    display: grid;
    gap: 0.4rem;
}

.map-controls button {
    width: 38px;
    height: 38px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 9px;
    color: white;
    background: rgba(7, 17, 27, 0.86);
    font-size: 1.15rem;
    cursor: pointer;
}

.map-controls button:hover {
    border-color: var(--accent-cyan);
}

.marker-ping.base {
    background: rgba(255, 183, 3, 0.75);
    box-shadow: 0 0 18px rgba(255, 183, 3, 0.55);
}

.player-marker .marker-label {
    border-color: rgba(0, 242, 254, 0.22);
}

.player-precision-dot {
    position: absolute;
    width: 8px;
    height: 8px;
    border: 1.5px solid #fff;
    border-radius: 50%;
    background: #00eaff;
    box-shadow:
        0 0 0 2px rgba(0, 234, 255, 0.25),
        0 0 8px rgba(0, 234, 255, 0.8);
    transform: translate(-50%, -50%) scale(var(--marker-scale, 1));
    transform-origin: center;
    padding: 0;
    pointer-events: auto;
    cursor: pointer;
    z-index: 3;
}

.player-cluster-hit {
    position: absolute;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    transform: translate(-50%, -50%) scale(var(--marker-scale, 1));
    transform-origin: center;
    pointer-events: auto;
    cursor: pointer;
    z-index: 4;
}

.player-cluster-hit:not(.multiple) {
    pointer-events: none;
}

.player-cluster-hit.multiple b {
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border: 2px solid white;
    border-radius: 50%;
    color: #071a27;
    background: #ffd24a;
    box-shadow: 0 0 10px rgba(255, 210, 74, 0.65);
    font-size: 11px;
}

.player-cluster-label {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 7px);
    display: grid;
    gap: 3px;
    min-width: max-content;
    padding: 0.45rem 0.55rem;
    border: 1px solid rgba(0, 234, 255, 0.4);
    border-radius: 8px;
    color: white;
    background: rgba(5, 15, 22, 0.94);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.45);
    opacity: 0;
    visibility: hidden;
    transform: translate(-50%, 4px);
    transition:
        opacity 0.15s ease,
        transform 0.15s ease;
    font-size: 12px;
    text-align: left;
    white-space: nowrap;
}

.player-cluster-hit:hover .player-cluster-label,
.player-cluster-hit:focus-visible .player-cluster-label {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0);
}

.base-marker .marker-label {
    border-color: rgba(255, 183, 3, 0.22);
}

.base-precision-marker {
    position: absolute;
    width: 16px;
    height: 16px;
    padding: 0;
    border: 1px solid white;
    border-radius: 4px;
    color: #15202a;
    background: #ffb703;
    box-shadow: 0 0 0 2px rgba(255, 183, 3, 0.22);
    transform: translate(-50%, -50%) scale(var(--marker-scale, 1));
    transform-origin: center;
    cursor: pointer;
    pointer-events: auto;
    z-index: 2;
}

.base-icon {
    display: grid;
    place-items: center;
    font-size: 11px;
    line-height: 1;
}

.map-pinned-label {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 7px);
    display: none;
    min-width: max-content;
    padding: 0.4rem 0.5rem;
    border: 1px solid rgba(0, 234, 255, 0.4);
    border-radius: 7px;
    color: white;
    background: rgba(5, 15, 22, 0.94);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.45);
    transform: translateX(-50%);
    font-size: 11px;
    line-height: 1.35;
    text-align: left;
    white-space: nowrap;
    pointer-events: none;
}

.map-pinned-label small {
    display: block;
    color: var(--text-muted);
}
.player-precision-dot:hover .map-pinned-label,
.player-precision-dot:focus-visible .map-pinned-label,
.player-precision-dot.pinned .map-pinned-label,
.base-precision-marker:hover .map-pinned-label,
.base-precision-marker:focus-visible .map-pinned-label,
.base-precision-marker.pinned .map-pinned-label {
    display: block;
}
.player-precision-dot.pinned,
.base-precision-marker.pinned {
    z-index: 8;
    outline: 2px solid #fff;
    outline-offset: 2px;
}

.map-legend {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    right: 1rem;
    z-index: 3;
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    background: rgba(10, 13, 20, 0.68);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 0.75rem 0.9rem;
    font-size: 0.82rem;
    color: var(--text-secondary);
}

.map-filter {
    border: 0;
    padding: 0;
    color: var(--text-muted);
    background: transparent;
    cursor: pointer;
    opacity: 0.55;
}

.map-filter.active {
    color: var(--text-primary);
    opacity: 1;
}

.legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    margin-right: 0.35rem;
}

.player-dot {
    background: var(--accent-cyan);
    box-shadow: 0 0 8px var(--accent-cyan);
}
.base-dot {
    background: var(--accent-gold);
    box-shadow: 0 0 8px var(--accent-gold);
}
.track-dot {
    background: var(--accent-purple);
    box-shadow: 0 0 8px var(--accent-purple);
}

.map-side-panel {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.map-camp-members {
    color: var(--accent-cyan) !important;
    font-size: 0.72rem;
}

.panel-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 1rem;
    backdrop-filter: blur(10px);
    box-shadow: var(--shadow-card);
}

.panel-card h4,
.card-heading h4,
.inventory-header h4,
.gate-card h3 {
    font-family: var(--font-heading);
    font-weight: 700;
}

.data-list.compact {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    margin-top: 0.9rem;
    max-height: min(42vh, 520px);
    overflow: auto;
}

.data-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: var(--radius-md);
    padding: 0.7rem 0.8rem;
}

.map-select-row {
    width: 100%;
    color: var(--text-primary);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.map-select-row span {
    display: block;
    margin-top: 0.2rem;
    color: var(--text-muted);
    font-size: 0.78rem;
}
.map-select-row small {
    color: var(--text-secondary);
}
.map-select-row:hover,
.map-select-row.pinned {
    border-color: var(--accent-cyan);
    background: rgba(0, 234, 255, 0.09);
}

.data-row strong {
    display: block;
    font-size: 0.9rem;
}

.data-row span,
.data-row small {
    color: var(--text-secondary);
    font-size: 0.78rem;
}

.map-live-stats {
    display: flex;
    gap: 0.7rem;
    flex-wrap: wrap;
}

.map-stat {
    background: rgba(18, 24, 36, 0.82);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-full);
    padding: 0.45rem 0.75rem;
    color: var(--text-secondary);
    font-size: 0.82rem;
}

.map-stat.loaded {
    border-color: rgba(6, 214, 160, 0.45);
}
.map-stat.offline {
    border-color: rgba(239, 71, 111, 0.45);
}

/* Admin Section */
.admin-gate {
    min-height: 420px;
    display: grid;
    place-items: center;
}

.gate-card {
    max-width: 640px;
    background: rgba(18, 24, 36, 0.82);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 2rem;
    text-align: center;
    box-shadow: var(--shadow-card);
}

.gate-icon {
    font-size: 3rem;
    margin-bottom: 1rem;
}

.gate-card p {
    margin: 0.75rem auto 1.4rem;
    color: var(--text-secondary);
    max-width: 52ch;
}

.admin-panel {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.admin-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.admin-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    gap: 1rem;
    align-items: start;
}

.card-heading {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.card-heading span {
    color: var(--text-secondary);
    font-size: 0.82rem;
}

.admin-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.admin-item-picker {
    position: relative;
}

.map-load-indicator {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    color: var(--text-muted);
    cursor: default;
}

.map-load-indicator::before {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ef476f;
    box-shadow: 0 0 10px rgba(239, 71, 111, 0.55);
    content: '';
}

.map-load-indicator.loaded {
    color: #80ffdb;
}

.map-load-indicator.loaded::before {
    background: #06d6a0;
    box-shadow: 0 0 10px rgba(6, 214, 160, 0.7);
}

.admin-item-picker > input[type='search'] {
    width: 100%;
}

.admin-item-selection {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 58px;
    margin-top: 0.55rem;
    padding: 0.55rem 0.7rem;
    border: 1px dashed var(--border-color);
    border-radius: var(--radius-md);
    color: var(--text-muted);
    background: rgba(10, 13, 20, 0.45);
}

.admin-item-selection.selected {
    border-style: solid;
    color: var(--text-primary);
}

.admin-bundle-selection {
    display: grid;
    gap: 0.55rem;
}
.admin-bundle-item {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) 125px 38px;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.45rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.035);
}
.admin-bundle-item label {
    display: grid;
    grid-template-columns: auto 72px;
    align-items: center;
    gap: 0.45rem;
}
.admin-bundle-item input {
    width: 72px;
    padding: 0.5rem;
}
.admin-bundle-item button {
    width: 34px;
    height: 34px;
    padding: 0;
}
@media (max-width: 650px) {
    .admin-bundle-item {
        grid-template-columns: 40px minmax(0, 1fr) auto;
    }
    .admin-bundle-item label {
        grid-column: 2;
    }
    .admin-bundle-item button {
        grid-column: 3;
        grid-row: 1;
    }
}

.admin-item-selection img,
.admin-item-option img {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    object-fit: contain;
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.04);
}

.admin-item-selection span,
.admin-item-option span {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.admin-item-selection small,
.admin-item-option small {
    color: var(--text-muted);
}

.admin-item-options {
    position: absolute;
    z-index: 30;
    top: 100%;
    right: 0;
    left: 0;
    max-height: 390px;
    margin-top: 0.35rem;
    overflow-y: auto;
    border: 1px solid var(--accent-cyan);
    border-radius: var(--radius-md);
    background: #0b111b;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.55);
}

.admin-item-option {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 0.75rem;
    padding: 0.55rem 0.7rem;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    color: var(--text-primary);
    text-align: left;
    background: transparent;
    cursor: pointer;
}

.admin-item-option:hover,
.admin-item-option:focus-visible {
    background: rgba(0, 242, 254, 0.11);
    outline: none;
}

.admin-item-options-more,
.admin-item-options-empty {
    padding: 0.8rem;
    color: var(--text-muted);
    text-align: center;
    font-size: 0.78rem;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.admin-form label {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    color: var(--text-secondary);
    font-size: 0.82rem;
}

.admin-form input,
.admin-form select,
.player-picker select {
    background: rgba(10, 13, 20, 0.82);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.72rem 0.85rem;
    border-radius: var(--radius-md);
    outline: none;
}

.admin-form input:focus,
.admin-form select:focus,
.player-picker select:focus {
    border-color: var(--accent-cyan);
    box-shadow: 0 0 12px rgba(0, 242, 254, 0.18);
}

.reward-quest-independent {
    align-items: center;
    min-height: 76px;
}
.reward-quest-independent > input[type='checkbox'] {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin: 0;
    padding: 0;
}
.reward-quest-independent > span {
    display: grid;
    flex: 1 1 auto;
    gap: 0.2rem;
    min-width: 0;
}
.admin-reward-template[draggable='true'] {
    cursor: grab;
}
.admin-reward-template[draggable='true']:active {
    cursor: grabbing;
}
.admin-reward-template.dragging {
    opacity: 0.42;
}
.admin-reward-template.drop-before {
    box-shadow: 0 -3px 0 var(--accent-cyan);
}
.admin-reward-template.drop-after {
    box-shadow: 0 3px 0 var(--accent-cyan);
}

.btn-primary.wide {
    width: 100%;
    padding: 0.85rem 1rem;
}

.admin-catalog-list {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    margin-top: 1rem;
    max-height: 280px;
    overflow: auto;
}

.admin-catalog-toolbar {
    display: grid;
    gap: 0.45rem;
    margin-top: 1rem;
}
.admin-catalog-toolbar > label {
    color: var(--text-secondary);
    font-size: 0.78rem;
}
.admin-catalog-search {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: rgba(10, 13, 20, 0.82);
    transition:
        border-color 0.2s,
        box-shadow 0.2s;
}
.admin-catalog-search:focus-within {
    border-color: var(--accent-cyan);
    box-shadow: 0 0 12px rgba(0, 242, 254, 0.18);
}
.admin-catalog-search > span {
    padding-left: 0.85rem;
    color: var(--text-muted);
    font-size: 1.15rem;
}
.admin-catalog-search input {
    width: 100%;
    border: 0;
    outline: 0;
    padding: 0.78rem 0.85rem;
    background: transparent;
    color: var(--text-primary);
}

.admin-catalog-row {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto auto;
    gap: 0.8rem;
    align-items: center;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: var(--radius-md);
    padding: 0.75rem;
}

.admin-catalog-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.05);
    padding: 3px;
    overflow: hidden;
}

.admin-catalog-meta strong {
    display: block;
    font-size: 0.9rem;
}

.admin-catalog-meta span {
    display: block;
    color: var(--text-secondary);
    font-size: 0.78rem;
}

.admin-catalog-price {
    color: var(--accent-gold);
    font-weight: 700;
    font-family: var(--font-heading);
}

.player-picker {
    display: flex;
    gap: 0.6rem;
    align-items: center;
    margin-bottom: 1rem;
}

.player-picker select {
    flex: 1;
}

.inventory-player-picker {
    position: relative;
    flex: 1;
    min-width: 0;
}
.inventory-player-trigger {
    display: flex;
    width: 100%;
    min-height: 44px;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.65rem 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: var(--text-primary);
    background: rgba(4, 16, 22, 0.9);
    cursor: pointer;
    text-align: left;
}
.inventory-player-trigger:hover,
.inventory-player-trigger[aria-expanded='true'] {
    border-color: var(--accent-cyan);
    box-shadow: 0 0 0 3px rgba(0, 242, 254, 0.08);
}
.inventory-player-trigger span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.inventory-player-menu {
    position: absolute;
    z-index: 120;
    top: calc(100% + 0.4rem);
    left: 0;
    width: 100%;
    min-width: min(520px, calc(100vw - 2rem));
    padding: 0.55rem;
    border: 1px solid rgba(0, 242, 254, 0.3);
    border-radius: 10px;
    background: rgba(3, 15, 20, 0.98);
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.55);
}
.inventory-player-menu[hidden] {
    display: none;
}
.inventory-player-search {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.7rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: rgba(7, 23, 29, 0.96);
}
.inventory-player-search span {
    color: var(--accent-cyan);
    font-size: 1.05rem;
}
.inventory-player-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    color: var(--text-primary);
    background: transparent;
}
.inventory-player-options {
    display: grid;
    gap: 0.25rem;
    max-height: 320px;
    margin-top: 0.45rem;
    overflow-y: auto;
}
.inventory-player-options button {
    display: grid;
    gap: 0.12rem;
    width: 100%;
    padding: 0.6rem 0.7rem;
    border: 1px solid transparent;
    border-radius: 7px;
    color: var(--text-primary);
    background: transparent;
    cursor: pointer;
    text-align: left;
}
.inventory-player-options button:hover,
.inventory-player-options button[aria-selected='true'] {
    border-color: rgba(0, 242, 254, 0.28);
    background: rgba(0, 242, 254, 0.08);
}
.inventory-player-options button small {
    overflow: hidden;
    color: var(--text-muted);
    font-size: 0.68rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}
html[data-theme='light'] .inventory-player-menu,
html[data-theme='light'] .inventory-player-trigger,
html[data-theme='light'] .inventory-player-search {
    color: var(--text-primary);
    background: #fff;
    border-color: var(--border-color);
}
@media (max-width: 600px) {
    .palworld-player-picker {
        align-items: stretch;
        flex-direction: column;
    }
    .inventory-player-menu {
        min-width: 100%;
    }
    .palworld-player-picker > .btn-secondary {
        width: 100%;
    }
}

.player-detail-empty {
    min-height: 420px;
    display: grid;
    place-items: center;
    text-align: center;
    color: var(--text-muted);
    border: 1px dashed rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
}

.player-detail-shell {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.player-lookup-card {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1rem;
}

.player-lookup-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
}

.player-lookup-header h4 {
    font-size: 1rem;
    margin-bottom: 0.35rem;
}

.player-lookup-header p {
    color: var(--text-secondary);
    font-size: 0.85rem;
    line-height: 1.5;
}

.player-lookup-header code {
    font-family: monospace;
    color: var(--accent-cyan);
}

.player-lookup-actions {
    display: flex;
    gap: 0.6rem;
    align-items: center;
    flex-wrap: wrap;
    min-width: min(100%, 560px);
}

.player-lookup-actions input {
    flex: 1;
    min-width: 260px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.8rem 0.95rem;
    border-radius: var(--radius-md);
    outline: none;
}

.player-lookup-actions input:focus {
    border-color: var(--accent-discord);
    box-shadow: 0 0 0 3px rgba(88, 101, 242, 0.18);
}

.player-profile-hint {
    color: var(--text-secondary);
    font-size: 0.84rem;
}

.profile-view-shell {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.profile-view-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.profile-view-tab {
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.04);
    color: var(--text-secondary);
    border-radius: var(--radius-full);
    padding: 0.55rem 0.9rem;
    font-size: 0.84rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.profile-view-tab:hover {
    border-color: rgba(255, 255, 255, 0.18);
    color: var(--text-primary);
}

.profile-view-tab.active {
    background: linear-gradient(135deg, var(--accent-discord), var(--accent-purple));
    color: white;
    border-color: transparent;
}

.profile-view-panels {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.profile-tab-panel {
    display: none;
}

.profile-tab-panel.active {
    display: block;
}

.player-profile-card {
    background: rgba(18, 24, 36, 0.85);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 1rem;
}

.profile-top {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    margin-bottom: 1rem;
}

.profile-top h4 {
    font-size: 1.05rem;
}

.profile-top span {
    color: var(--text-secondary);
    font-size: 0.82rem;
}

.status-pill {
    padding: 0.35rem 0.75rem;
    border-radius: var(--radius-full);
    font-size: 0.78rem;
    font-weight: 700;
    border: 1px solid transparent;
}

.status-pill.online {
    color: var(--accent-green);
    border-color: rgba(46, 196, 182, 0.25);
    background: rgba(46, 196, 182, 0.1);
}

.status-pill.offline {
    color: var(--text-muted);
    border-color: rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.04);
}

.profile-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.profile-grid.meta {
    margin-top: 0.9rem;
}

.profile-grid div {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: var(--radius-md);
    padding: 0.8rem;
}

.profile-grid span {
    display: block;
    color: var(--text-muted);
    font-size: 0.76rem;
    margin-bottom: 0.25rem;
}

.profile-grid strong {
    font-size: 0.86rem;
    word-break: break-word;
}

.inventory-panel {
    background: rgba(14, 18, 28, 0.94);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 1rem;
}

.raw-save-details {
    margin-top: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    background: rgba(4, 10, 18, 0.72);
    overflow: hidden;
}

.raw-save-details summary {
    padding: 1rem;
    cursor: pointer;
    font-weight: 700;
}

.raw-save-details pre {
    max-height: 520px;
    margin: 0;
    padding: 1rem;
    overflow: auto;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    color: #b8d7e8;
    font:
        0.78rem/1.45 Consolas,
        monospace;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.inventory-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.inventory-header span {
    color: var(--text-secondary);
    font-size: 0.8rem;
}

.inventory-tabs {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.inventory-tab {
    padding: 0.35rem 0.7rem;
    border-radius: var(--radius-full);
    background: rgba(255, 255, 255, 0.05);
    font-size: 0.78rem;
    color: var(--text-secondary);
}

.inventory-tab.active {
    background: rgba(0, 242, 254, 0.14);
    color: var(--accent-cyan);
}

.inventory-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 0.75rem;
    max-height: 460px;
    overflow: auto;
}

.inventory-section {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 0.9rem;
}

.inventory-section-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    color: var(--text-secondary);
}

.inventory-section-head h5 {
    color: var(--text-primary);
    font-family: var(--font-heading);
    font-size: 0.92rem;
}

.inventory-section-head span {
    font-size: 0.78rem;
}

.mini-metadata-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 0.75rem;
    margin-top: 0.9rem;
}

.mini-metadata-card {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 14px;
    padding: 0.75rem 0.8rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.mini-metadata-card span {
    font-size: 0.72rem;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.mini-metadata-card strong {
    font-size: 0.84rem;
    word-break: break-word;
    line-height: 1.35;
}

.inventory-slot {
    position: relative;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.02));
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 14px;
    padding: 0.75rem 0.65rem 0.6rem;
    min-height: 124px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.35rem;
}

.inventory-slot .slot-index {
    position: absolute;
    top: 0.35rem;
    left: 0.4rem;
    font-size: 0.7rem;
    color: var(--text-muted);
}

.inventory-slot .slot-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: rgba(255, 255, 255, 0.05);
    font-size: 1.2rem;
}

.inventory-slot strong {
    font-size: 0.8rem;
    line-height: 1.2;
}

.inventory-slot small {
    color: var(--text-secondary);
    font-size: 0.72rem;
}

.inventory-slot.rarity-legendary {
    box-shadow:
        0 0 0 1px rgba(255, 183, 3, 0.16),
        0 0 18px rgba(255, 183, 3, 0.08);
}

.empty-line {
    color: var(--text-muted);
    padding: 1rem;
}

.admin-workspace-nav {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.65rem;
    width: 100%;
    margin: 1.25rem 0;
    border: 1px solid rgba(182, 221, 229, 0.32);
    background: #09151b;
    position: relative;
    z-index: 20;
    padding: 0.7rem;
    border-radius: 14px;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.22);
}

.admin-nav-group {
    min-width: 0;
    padding: 0.55rem;
    border: 1px solid rgba(182, 221, 229, 0.1);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.018);
    display: grid;
    grid-template-rows: auto 1fr;
}

.admin-nav-group-title {
    display: block;
    margin: 0 0.35rem 0.45rem;
    color: var(--accent-cyan);
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.admin-nav-group-links {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-rows: minmax(38px, auto);
    gap: 0.3rem;
    align-content: start;
}

.admin-nav-group:last-child .admin-nav-group-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-workspace-tab {
    min-width: 0;
    border: 1px solid transparent;
    border-radius: 7px;
    padding: 0.55rem 0.65rem;
    color: #afbec3;
    background: transparent;
    font-family: var(--font-heading);
    font-size: 0.82rem;
    font-weight: 650;
    line-height: 1.2;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition:
        color 0.18s ease,
        background 0.18s ease,
        border-color 0.18s ease,
        transform 0.18s ease;
}

.admin-workspace-tab.active {
    color: #06171d;
    border-color: rgba(105, 235, 246, 0.65);
    background: linear-gradient(135deg, #9ee7ed, #bdd0d4);
    box-shadow: 0 4px 14px rgba(65, 210, 224, 0.16);
}
.admin-workspace-tab:hover {
    color: #fff;
    border-color: rgba(182, 221, 229, 0.2);
    background: rgba(255, 255, 255, 0.07);
    transform: translateY(-1px);
}
.admin-workspace-tab.active:hover {
    color: #06171d;
}

.admin-workspace-view {
    display: none;
}
.admin-workspace-view.active {
    display: block;
}

@media (max-width: 1600px) {
    .admin-workspace-nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        position: static;
    }
}

@media (max-width: 680px) {
    .admin-workspace-nav {
        grid-template-columns: 1fr;
        padding: 0.55rem;
    }
    .admin-nav-group {
        padding: 0.5rem;
    }
    .admin-workspace-tab {
        padding: 0.65rem 0.7rem;
    }
    .admin-nav-group-links,
    .admin-nav-group:last-child .admin-nav-group-links {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.admin-give-layout {
    display: grid;
    gap: 1.25rem;
}
.admin-give-layout[data-admin-give-panel] {
    display: none;
}
.admin-give-layout[data-admin-give-panel].active {
    display: grid;
}
.admin-give-layout[data-admin-give-panel='pal'].active {
    grid-template-columns: minmax(300px, 0.72fr) minmax(0, 1.28fr);
    align-items: start;
}
.admin-give-kind-tabs {
    display: flex;
    gap: 0.55rem;
    margin: 0 0 1rem;
}
.admin-give-kind-tabs button {
    padding: 0.7rem 1.1rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    color: var(--text-muted);
    background: rgba(5, 19, 25, 0.75);
    cursor: pointer;
}
.admin-give-kind-tabs button.active {
    color: #082027;
    border-color: var(--accent-cyan);
    background: var(--accent-cyan);
}
.admin-give-lower {
    display: grid;
    grid-template-columns: minmax(300px, 0.7fr) minmax(520px, 1.3fr);
    gap: 1.25rem;
    align-items: start;
}
.admin-give-catalog.panel-card,
.admin-give-order.panel-card,
.admin-give-player-panel.panel-card {
    padding: 1rem;
}
.admin-give-catalog > label {
    display: grid;
    gap: 0.55rem;
    color: var(--text-muted);
}
.admin-give-catalog input,
.admin-give-catalog select {
    width: 100%;
    padding: 0.85rem 1rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(4, 16, 22, 0.8);
    color: var(--text-primary);
}
.admin-give-results {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 0.9rem;
    margin-top: 1rem;
    max-height: 500px;
    overflow: auto;
    padding: 0.25rem;
}
#adminGivePalCatalog {
    display: flex;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
}
#adminGivePalResults {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    align-content: start;
}
.admin-give-result {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    min-height: 76px;
    padding: 0.9rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(8, 26, 32, 0.72);
    color: var(--text-primary);
    text-align: left;
    cursor: pointer;
    content-visibility: auto;
    contain-intrinsic-size: auto 76px;
    contain: layout paint style;
}
.admin-give-filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.6rem;
    margin-top: 0.7rem;
}
.admin-give-favorite-filter {
    display: flex !important;
    align-items: center;
    justify-content: center;
}
.admin-give-favorite-filter input {
    width: auto;
}
.admin-give-favorite {
    color: #53636a;
    font-size: 1.15rem;
    font-style: normal;
}
.admin-give-favorite.active {
    color: #ffd85c;
    text-shadow: 0 0 10px rgba(255, 216, 92, 0.45);
}
.admin-give-result.rarity-common,
.admin-give-cart-row.rarity-common {
    --give-rarity: var(--rarity-common);
}
.admin-give-result.rarity-uncommon,
.admin-give-cart-row.rarity-uncommon {
    --give-rarity: var(--rarity-uncommon);
}
.admin-give-result.rarity-rare,
.admin-give-cart-row.rarity-rare {
    --give-rarity: var(--rarity-rare);
}
.admin-give-result.rarity-epic,
.admin-give-cart-row.rarity-epic {
    --give-rarity: var(--rarity-epic);
}
.admin-give-result.rarity-legendary,
.admin-give-cart-row.rarity-legendary {
    --give-rarity: var(--rarity-legendary);
}
.admin-give-result[class*='rarity-'],
.admin-give-cart-row[class*='rarity-'] {
    border-left: 4px solid var(--give-rarity);
    background: linear-gradient(
        100deg,
        color-mix(in srgb, var(--give-rarity) 16%, transparent),
        rgba(8, 26, 32, 0.72) 58%
    );
}
.admin-give-result:hover {
    border-color: var(--give-rarity, var(--accent-cyan));
    transform: translateY(-1px);
}
.admin-give-result.selected {
    border-color: var(--accent-cyan);
    box-shadow: 0 0 0 2px rgba(0, 242, 254, 0.2);
}
.admin-give-result img {
    width: 42px;
    height: 42px;
    object-fit: contain;
}
.admin-give-result span {
    min-width: 0;
    display: grid;
}
.admin-give-result small {
    color: var(--text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
}
.admin-give-order h5 {
    margin: 0.25rem 0 0.75rem;
}
.admin-give-cart-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}
.admin-give-cart-heading h5 {
    margin: 0;
}
.admin-give-cart {
    display: grid;
    gap: 0.55rem;
    margin-bottom: 1rem;
    max-height: 430px;
    overflow: auto;
}
.admin-give-players {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
    margin: 0.7rem 0 1rem;
    max-height: 520px;
    overflow: auto;
    padding-right: 0.25rem;
}
.admin-teleport-page {
    display: grid;
    gap: 1rem;
}
.admin-teleport-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
    gap: 1rem;
    align-items: start;
}
.admin-teleport-card {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(4, 18, 24, 0.55);
}
.admin-teleport-card > label:not(.admin-player-check) {
    display: grid;
    gap: 0.35rem;
    color: var(--text-muted);
    font-size: 0.82rem;
}
.admin-teleport-card select {
    width: 100%;
    min-height: 44px;
    padding: 0.65rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: var(--text-primary);
    background: rgba(4, 16, 22, 0.92);
}
.admin-teleport-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}
.admin-teleport-actions > button {
    flex: 1 1 190px;
}
@media (max-width: 800px) {
    .admin-teleport-grid {
        grid-template-columns: 1fr;
    }
}
.admin-give-cart-row,
.admin-player-check {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.65rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
}
.admin-player-check {
    min-height: 64px;
    cursor: pointer;
    background: rgba(8, 26, 32, 0.55);
}
.admin-player-check:hover {
    border-color: var(--accent-cyan);
}
.admin-player-check input {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
    accent-color: var(--accent-cyan);
}
.admin-player-check span {
    min-width: 0;
    display: grid;
}
.admin-player-check small {
    color: var(--text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
}
.admin-give-cart-row span {
    flex: 1;
    display: grid;
}
.admin-give-cart-row input {
    width: 82px;
    padding: 0.45rem;
}
.admin-give-cart-row button {
    border: 0;
    background: transparent;
    color: #ff7b86;
    cursor: pointer;
    font-size: 1.2rem;
}
.admin-give-quantity-presets {
    display: flex;
    flex-wrap: wrap;
    gap: 0.2rem;
}
.admin-give-quantity-presets button {
    padding: 0.28rem 0.4rem;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    color: var(--accent-cyan);
    background: rgba(0, 242, 254, 0.06);
    font-size: 0.7rem;
}
.admin-give-confirm-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.55rem;
    margin: 0.8rem 0;
}
.admin-give-confirm-stats span {
    display: grid;
    padding: 0.65rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    text-align: center;
}
.admin-give-confirm-popup ul {
    display: grid;
    gap: 0.35rem;
    max-height: 240px;
    padding: 0;
    overflow: auto;
    list-style: none;
}
.admin-give-confirm-popup li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.45rem 0.6rem;
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.04);
}
.admin-player-check.all {
    margin-bottom: 0.55rem;
    border-color: var(--accent-cyan);
}
.admin-give-player-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.7rem;
}
.admin-give-player-heading h5 {
    margin: 0;
}
.admin-give-player-heading span {
    color: var(--accent-cyan);
    font-size: 0.85rem;
}
.admin-give-status {
    margin-top: 0.8rem;
    color: var(--text-muted);
    white-space: pre-line;
}
.admin-give-templates {
    display: grid;
    gap: 0.55rem;
    padding-top: 0.8rem;
    border-top: 1px solid var(--border-color);
}
.admin-give-templates h6 {
    margin: 0.35rem 0 0;
    color: var(--text-primary);
    font-size: 0.82rem;
    text-transform: uppercase;
}
.admin-give-templates > div:not(.admin-give-personal-history) {
    display: flex;
    gap: 0.45rem;
}
.admin-give-templates input,
.admin-give-templates select {
    min-width: 0;
    flex: 1;
    padding: 0.6rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: var(--text-primary);
    background: rgba(4, 16, 22, 0.9);
}
.admin-give-personal-history {
    display: grid;
    gap: 0.4rem;
    max-height: 180px;
    overflow: auto;
}
.admin-give-personal-history button {
    display: grid;
    gap: 0.2rem;
    padding: 0.55rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: var(--text-primary);
    background: rgba(4, 16, 22, 0.7);
    text-align: left;
    cursor: pointer;
}
.admin-give-personal-history strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.admin-give-personal-history small,
.admin-player-check small {
    color: var(--text-muted);
}
.admin-give-preferences {
    display: grid;
    gap: 0.55rem;
    margin: 0.8rem 0;
}
.admin-give-preferences label {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    color: var(--text-muted);
}
.admin-player-check.self {
    margin-top: 0.55rem;
    border-color: rgba(0, 242, 254, 0.28);
}
.admin-give-reason {
    display: grid;
    gap: 0.45rem;
    margin: 1rem 0;
    color: var(--text-muted);
}
.admin-give-reason select,
.admin-history-filters input,
.admin-history-filters select {
    padding: 0.75rem 0.85rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(4, 16, 22, 0.9);
    color: var(--text-primary);
}
.admin-pal-customizer {
    display: grid;
    gap: 1rem;
    padding: 1rem;
}
.admin-pal-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 92px;
    gap: 0.75rem;
    align-items: stretch;
    padding: 0.75rem;
    border: 1px solid rgba(107, 225, 235, 0.28);
    border-radius: 11px;
    background: linear-gradient(135deg, rgba(21, 47, 43, 0.82), rgba(5, 20, 27, 0.94));
}
.admin-pal-hero #adminGivePalChoice {
    padding: 0.25rem 0.5rem;
}
.admin-pal-hero #adminGivePalChoice img {
    width: 72px;
    height: 72px;
    filter: drop-shadow(0 8px 12px rgba(0, 0, 0, 0.45));
}
.admin-pal-hero #adminGivePalChoice strong {
    font-size: 1.12rem;
    color: #fff;
}
.admin-pal-level {
    display: grid;
    place-items: center;
    align-content: center;
    gap: 0.15rem;
    padding: 0.55rem;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 9px;
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    background: rgba(22, 25, 22, 0.86);
}
.admin-pal-level input {
    width: 100%;
    padding: 0;
    border: 0;
    outline: 0;
    color: #fff;
    background: transparent;
    text-align: center;
    font-size: 1.8rem;
    font-weight: 900;
}
.admin-pal-variant-picker {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
}
.admin-pal-variant {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 58px;
    padding: 0.65rem;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    color: var(--text-primary);
    background: rgba(18, 22, 20, 0.78);
    cursor: pointer;
}
.admin-pal-variant input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.admin-pal-variant span {
    font-size: 1.25rem;
}
.admin-pal-variant.alpha span {
    color: #ff5260;
}
.admin-pal-variant.lucky span {
    color: #88e9ff;
}
.admin-pal-variant:has(input:checked) {
    border-color: var(--accent-cyan);
    box-shadow:
        inset 0 0 0 1px var(--accent-cyan),
        0 0 18px rgba(0, 229, 255, 0.08);
}
.admin-pal-gender-lock {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.75rem;
    padding: 0.7rem 0.8rem;
    border-left: 3px solid #8fa4a8;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.035);
}
.admin-pal-gender-lock > span {
    font-size: 1.45rem;
    color: #dce7e8;
}
.admin-pal-gender-lock > div {
    display: grid;
    gap: 0.12rem;
}
.admin-pal-gender-lock small {
    color: var(--text-muted);
}
.admin-pal-gender-select {
    display: grid;
    grid-template-columns: minmax(120px, 0.4fr) minmax(180px, 0.6fr);
    align-items: center;
    gap: 0.35rem 0.75rem;
    margin-top: 0.75rem;
    padding: 0.7rem 0.8rem;
    border-left: 3px solid #8fa4a8;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.035);
}
.admin-pal-gender-select select {
    width: 100%;
    padding: 0.62rem 0.7rem;
    border: 1px solid var(--border-color);
    border-radius: 7px;
    color: var(--text-primary);
    background: rgba(4, 16, 22, 0.9);
}
.admin-pal-gender-select small {
    grid-column: 1 / -1;
    color: var(--text-muted);
}
.admin-pal-potential-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.admin-pal-potential-grid > label:nth-of-type(-n + 3) {
    grid-column: span 1;
}
.admin-pal-star-level select {
    min-height: 48px;
    color: #ffe276;
    font-weight: 800;
    letter-spacing: 0.08em;
}
.admin-pal-stat-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.45rem;
    margin: 0 0 0.75rem;
}
.admin-pal-stat-toolbar span {
    margin-right: auto;
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.admin-pal-stat-toolbar button {
    padding: 0.42rem 0.65rem;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 6px;
    color: var(--text-primary);
    background: rgba(25, 27, 23, 0.88);
    cursor: pointer;
    font-size: 0.7rem;
    font-weight: 800;
}
.admin-pal-stat-toolbar button:hover {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan);
}
.admin-pal-stepper {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) 34px;
    overflow: hidden;
    border: 1px solid var(--border-color);
    border-radius: 7px;
    background: rgba(4, 16, 22, 0.9);
}
.admin-pal-fields .admin-pal-stepper input {
    border: 0;
    border-radius: 0;
    text-align: center;
}
.admin-pal-stepper button {
    border: 0;
    color: #d8f8fa;
    background: rgba(104, 139, 143, 0.45);
    cursor: pointer;
    font-size: 1.2rem;
}
.admin-pal-stepper button:hover {
    color: #001014;
    background: var(--accent-cyan);
}
.admin-pal-passive-slots {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}
.admin-pal-passive-slot {
    position: relative;
    display: grid;
    min-width: 0;
    gap: 0.28rem;
}
.admin-pal-passive-slot > span {
    color: var(--text-muted);
    font-size: 0.68rem;
}
.admin-pal-passive-trigger,
.admin-pal-passive-option {
    width: 100%;
    min-height: 46px;
    padding: 0.62rem 0.75rem;
    border: 2px solid #65777a;
    border-left-width: 6px;
    border-radius: 5px;
    color: #e8f0f1;
    background: linear-gradient(105deg, rgba(33, 39, 34, 0.98), rgba(13, 24, 29, 0.99));
    font-weight: 700;
    cursor: pointer;
    text-align: left;
}
.admin-pal-passive-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}
.admin-pal-passive-trigger span {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.admin-pal-passive-menu {
    position: absolute;
    z-index: 90;
    top: calc(100% + 5px);
    left: 0;
    right: 0;
    display: none;
    padding: 0.55rem;
    border: 1px solid rgba(113, 225, 235, 0.42);
    border-radius: 8px;
    background: #07141b;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.65);
}
.admin-pal-passive-slot.open {
    z-index: 95;
}
.admin-pal-passive-slot.open .admin-pal-passive-menu {
    display: grid;
    gap: 0.45rem;
}
.admin-pal-passive-slot.open-up .admin-pal-passive-menu {
    top: auto;
    bottom: calc(100% + 5px);
}
.admin-pal-passive-menu input {
    width: 100%;
    min-height: 42px;
    padding: 0.6rem 0.7rem;
    border: 1px solid var(--accent-cyan);
    border-radius: 6px;
    color: #fff;
    background: #020d12;
}
.admin-pal-passive-options {
    display: grid;
    gap: 0.35rem;
    max-height: min(310px, 45vh);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 0.2rem;
}
.admin-pal-passive-option {
    min-height: 40px;
    padding: 0.5rem 0.65rem;
}
.admin-pal-passive-option:hover:not(:disabled) {
    filter: brightness(1.22);
    translate: 2px 0;
}
.admin-pal-passive-option:disabled {
    display: none;
}
.admin-pal-passive-trigger[data-rank='-1'],
.admin-pal-passive-trigger[data-rank='-2'],
.admin-pal-passive-option[data-rank='-1'],
.admin-pal-passive-option[data-rank='-2'] {
    border-color: #ff4c55;
    color: #ffb2b6;
    background: linear-gradient(105deg, rgba(63, 17, 20, 0.98), rgba(23, 20, 22, 0.99));
}
.admin-pal-passive-trigger[data-rank='1'],
.admin-pal-passive-option[data-rank='1'] {
    border-color: #d9e5e6;
    color: #f5ffff;
}
.admin-pal-passive-trigger[data-rank='2'],
.admin-pal-passive-option[data-rank='2'] {
    border-color: #45e4ca;
    color: #77ffe9;
    background: linear-gradient(105deg, rgba(11, 55, 51, 0.98), rgba(11, 31, 39, 0.99));
}
.admin-pal-passive-trigger[data-rank='3'],
.admin-pal-passive-option[data-rank='3'] {
    border-color: #f4d416;
    color: #ffe94e;
    background: linear-gradient(105deg, rgba(62, 53, 3, 0.98), rgba(35, 34, 18, 0.99));
}
.admin-pal-passive-trigger[data-rank='4'],
.admin-pal-passive-option[data-rank='4'] {
    border-color: #52eadb;
    color: #77fff1;
    background: linear-gradient(105deg, rgba(6, 59, 52, 0.98), rgba(26, 37, 87, 0.99));
}
.admin-pal-passive-trigger[data-rank='5'],
.admin-pal-passive-option[data-rank='5'] {
    border-color: #91fff3;
    color: #b7fff8;
    background: linear-gradient(105deg, rgba(11, 75, 67, 0.99), rgba(35, 52, 126, 0.99), rgba(108, 29, 127, 0.98));
    box-shadow: inset 0 0 12px rgba(102, 235, 255, 0.15);
}
.admin-pal-customizer fieldset {
    border: 1px solid var(--border-color);
    border-radius: 10px;
    padding: 0.9rem;
}
.admin-pal-customizer legend {
    padding: 0 0.45rem;
    color: var(--accent-cyan);
    font-weight: 700;
}
.admin-pal-manual-toggle {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    padding: 0.8rem;
    border: 1px solid rgba(255, 190, 70, 0.4);
    border-radius: 9px;
    background: rgba(110, 69, 8, 0.2);
}
.admin-pal-manual-toggle input {
    margin-top: 0.2rem;
    accent-color: #ffb940;
}
.admin-pal-manual-toggle span {
    display: grid;
    gap: 0.2rem;
}
.admin-pal-manual-toggle small,
.admin-pal-fields label small {
    color: var(--text-muted);
    font-size: 0.68rem;
}
.admin-pal-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}
.admin-pal-fields.four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.admin-pal-fields label {
    display: grid;
    gap: 0.3rem;
    color: var(--text-muted);
    font-size: 0.76rem;
}
.admin-pal-fields label.wide {
    grid-column: 1 / -1;
}
.admin-pal-fields input,
.admin-pal-fields select,
.admin-pal-fields textarea,
.admin-pal-coordinates input {
    width: 100%;
    padding: 0.62rem 0.7rem;
    border: 1px solid var(--border-color);
    border-radius: 7px;
    color: var(--text-primary);
    background: rgba(4, 16, 22, 0.9);
}
.admin-pal-work-disabled {
    display: grid;
    gap: 0.35rem;
    margin-top: 1rem;
}
.admin-pal-work-disabled > strong {
    color: var(--text-primary);
    font-size: 0.82rem;
}
.admin-pal-work-disabled > small {
    color: var(--text-muted);
    font-size: 0.7rem;
}
.admin-pal-work-checks {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
    margin-top: 0.35rem;
}
.admin-pal-work-checks label {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 0.65rem;
    border: 1px solid var(--border-color);
    border-radius: 7px;
    color: var(--text-muted);
    background: rgba(4, 16, 22, 0.55);
    font-size: 0.73rem;
    cursor: pointer;
}
.admin-pal-work-checks input {
    margin: 0;
    accent-color: var(--accent-cyan);
}
.admin-pal-subheading {
    margin: 1rem 0 0.55rem;
    color: var(--accent-cyan);
    font-size: 0.76rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.admin-pal-subheading:first-of-type {
    margin-top: 0;
}
.admin-pal-native-note {
    display: block;
    margin-top: 0.8rem;
    color: var(--text-muted);
    font-size: 0.7rem;
}
.admin-pal-check {
    display: flex !important;
    grid-template-columns: auto 1fr;
    flex-direction: row;
    align-items: center;
}
.admin-pal-check input {
    width: auto;
}
#adminGivePalChoice {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    min-height: 60px;
}
#adminGivePalChoice img {
    width: 54px;
    height: 54px;
    object-fit: contain;
}
#adminGivePalChoice span {
    display: grid;
}
.admin-palpedia-number {
    display: inline-grid;
    min-width: 42px;
    place-items: center;
    padding: 0.22rem 0.38rem;
    border: 1px solid rgba(112, 233, 245, 0.42);
    border-radius: 6px;
    color: var(--accent-cyan);
    background: rgba(0, 229, 255, 0.08);
    font-size: 0.7rem;
    font-weight: 900;
}
.admin-palpedia-number.hero {
    min-width: 48px;
    align-self: center;
    font-size: 0.78rem;
}
.admin-pal-base-stats {
    display: grid;
    gap: 0.7rem;
    padding: 0.8rem;
    border: 1px solid rgba(0, 229, 255, 0.25);
    border-radius: 10px;
    background: rgba(0, 229, 255, 0.06);
}
.admin-pal-base-stats > div {
    display: grid;
    gap: 0.15rem;
}
.admin-pal-base-stats small {
    color: var(--text-muted);
}
.admin-pal-base-stats dl {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.55rem;
    margin: 0;
}
.admin-pal-base-stats dl div {
    display: grid;
    gap: 0.15rem;
    padding: 0.55rem;
    border-radius: 8px;
    background: rgba(2, 12, 17, 0.65);
}
.admin-pal-base-stats dt {
    color: var(--text-muted);
    font-size: 0.7rem;
}
.admin-pal-base-stats dd {
    margin: 0;
    color: var(--accent-cyan);
    font-weight: 800;
}
.admin-pal-boss-stats-note {
    display: grid;
    gap: 0.2rem;
    margin: 0;
    padding: 0.7rem 0.8rem;
    border-left: 3px solid #ff5965;
    border-radius: 6px;
    color: #ffd9dc;
    background: rgba(117, 20, 29, 0.22);
}
.admin-pal-boss-stats-note span {
    color: var(--text-muted);
    font-size: 0.72rem;
    line-height: 1.45;
}
.admin-pal-delivery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
    margin-bottom: 0.8rem;
}
.admin-pal-delivery label {
    position: relative;
    display: flex;
    min-height: 54px;
    gap: 0.6rem;
    align-items: center;
    justify-content: center;
    padding: 0.7rem;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    background: rgba(22, 25, 22, 0.76);
    cursor: pointer;
    text-align: center;
}
.admin-pal-delivery label:has(input:checked) {
    border-color: var(--accent-cyan);
    box-shadow: inset 0 0 0 1px var(--accent-cyan);
}
.admin-pal-delivery input {
    accent-color: var(--accent-cyan);
}
.admin-pal-capture-select {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(190px, 0.55fr);
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.8rem;
    padding: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-left: 4px solid var(--accent-cyan);
    border-radius: 8px;
    background: linear-gradient(105deg, rgba(8, 40, 45, 0.86), rgba(7, 19, 26, 0.94));
}
.admin-pal-capture-select > span {
    display: grid;
    gap: 0.18rem;
}
.admin-pal-capture-select small {
    color: var(--text-muted);
}
.admin-pal-capture-select select {
    width: 100%;
    min-height: 46px;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--accent-cyan);
    border-radius: 7px;
    color: #dcfbff;
    background: #041118;
    font-weight: 800;
}
.admin-pal-spawn-map {
    display: grid;
    gap: 0.7rem;
}
.admin-workspace-view.active[data-admin-view-panel='bosses'] {
    display: grid;
    gap: 1.2rem;
}
#adminPalBossBuilder {
    grid-template-columns: minmax(280px, 0.75fr) minmax(0, 1.25fr);
    margin: 1rem 0;
}
#adminGivePalCatalogHome,
#adminGivePalFormHome {
    display: none;
}
@media (max-width: 680px) {
    .admin-pal-variant-picker {
        grid-template-columns: 1fr;
    }
    .admin-pal-fields.four {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .admin-pal-passive-slots,
    .admin-pal-delivery {
        grid-template-columns: 1fr;
    }
    .admin-pal-potential-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.pal-boss-row {
    align-items: center;
    gap: 1rem;
}
.pal-boss-row > div:first-child {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}
.pal-boss-row small {
    color: var(--text-muted);
}
.pal-boss-row .boss-error {
    color: #ff8e99;
}
.pal-boss-actions {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.admin-workspace-view.active[data-admin-view-panel='reboot'] {
    display: grid;
}
.restart-page {
    display: grid;
    gap: 1rem;
    width: 100%;
}
.restart-status-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}
.restart-status-grid > div {
    display: grid;
    gap: 0.25rem;
    padding: 0.9rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(4, 16, 22, 0.7);
}
.restart-status-grid span,
.restart-status-grid small {
    color: var(--text-muted);
}
.restart-status-grid strong.online {
    color: #69e6a6;
}
.restart-status-grid strong.offline,
.restart-status-grid em {
    color: #ff8e99;
}
.restart-settings-form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
}
.restart-settings-form > label:not(.admin-pal-manual-toggle),
.restart-message-grid label {
    display: grid;
    gap: 0.35rem;
    color: var(--text-muted);
}
.restart-settings-form input:not([type='checkbox']),
.restart-settings-form select {
    width: 100%;
    padding: 0.7rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: var(--text-primary);
    background: rgba(4, 16, 22, 0.9);
}
.restart-settings-form input:not([type='checkbox']),
.restart-settings-form select {
    min-height: 52px;
}
.restart-schedule-field {
    grid-template-rows: auto 52px auto;
    align-content: start;
}
.restart-mode-field {
    grid-template-rows: auto 52px;
    align-content: start;
}
.restart-schedule-field small {
    min-height: 1em;
    color: var(--text-muted);
    font-size: 0.68rem;
}
.restart-schedule-field[hidden] {
    display: none !important;
}
.restart-settings-form:not([data-schedule-mode='both']) .restart-schedule-field:not([hidden]) {
    grid-column: span 2;
}
.restart-settings-form .admin-pal-manual-toggle {
    justify-content: flex-start;
    align-items: center;
    min-height: 74px;
}
.restart-settings-form .admin-pal-manual-toggle > input[type='checkbox'] {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin: 0;
    padding: 0;
}
.restart-settings-form .admin-pal-manual-toggle > span {
    flex: 1 1 auto;
    min-width: 0;
}
.restart-settings-form .wide {
    grid-column: 1 / -1;
}
.restart-settings-form fieldset {
    padding: 1rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
}
.restart-message-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}
.restart-message-grid label:last-child {
    grid-column: 1 / -1;
}
.restart-manual {
    display: flex;
    align-items: center;
    gap: 1rem;
}
.restart-manual > div {
    display: grid;
    flex: 1;
}
.restart-manual small {
    color: var(--text-muted);
}
.restart-manual label {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--text-muted);
}
.restart-manual input {
    width: 75px;
    padding: 0.55rem;
    border: 1px solid var(--border-color);
    border-radius: 7px;
    color: white;
    background: #07171d;
}
.restart-action-button {
    display: inline-grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 0.15rem 0.55rem;
    min-height: 48px;
    padding: 0.65rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 9px;
    color: #fff;
    background: linear-gradient(135deg, #274a66, #153044);
    box-shadow: 0 5px 16px rgba(0, 0, 0, 0.28);
    cursor: pointer;
    text-align: left;
}
.restart-action-button > span {
    grid-row: 1 / span 2;
    font-size: 1.2rem;
}
.restart-action-button strong {
    font-size: 0.84rem;
}
.restart-action-button small {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.68rem;
}
.restart-action-button:hover {
    translate: 0 -1px;
    filter: brightness(1.16);
    border-color: rgba(255, 255, 255, 0.55);
}
.restart-action-button:disabled {
    opacity: 0.5;
    cursor: wait;
    translate: none;
}
.restart-action-button.scheduled {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #a94120, #6f241c);
    border-color: #e87445;
    text-align: center;
}
.restart-action-button.scheduled > span {
    grid-row: auto;
}
.restart-manual .restart-action-button.scheduled {
    flex: 0 0 auto;
    margin-left: auto;
    align-self: center;
}
.restart-emergency-actions {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) auto auto;
    gap: 0.8rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid rgba(255, 91, 105, 0.35);
    border-radius: 11px;
    background: rgba(83, 16, 25, 0.22);
}
.restart-emergency-actions > div {
    display: grid;
}
.restart-emergency-actions > div small {
    color: var(--text-muted);
}
.restart-action-button.force-restart {
    background: linear-gradient(135deg, #a95a13, #71380d);
    border-color: #e99b43;
}
.restart-action-button.force-stop {
    background: linear-gradient(135deg, #a51f32, #681522);
    border-color: #ef5267;
}
.maintenance-admin-banner {
    position: sticky;
    top: 0;
    z-index: 90;
    padding: 0.65rem 1rem;
    color: #241600;
    background: linear-gradient(90deg, #ffc44d, #ff9f43);
    text-align: center;
    font-weight: 800;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.3);
}
.maintenance-server-controls {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) repeat(3, minmax(170px, 0.7fr));
    gap: 0.75rem;
    align-items: stretch;
    margin-top: 1rem;
    padding: 1rem;
    border: 1px solid rgba(255, 196, 77, 0.3);
    border-radius: 10px;
    background: rgba(255, 159, 67, 0.06);
}
.maintenance-server-controls > div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.2rem;
}
.maintenance-server-controls > div small {
    color: var(--text-muted);
}
.restart-action-button.maintenance-exit {
    border-color: rgba(46, 220, 140, 0.55);
    background: rgba(46, 220, 140, 0.1);
}
.restart-action-button.maintenance-exit:hover {
    border-color: #2edc8c;
    background: rgba(46, 220, 140, 0.18);
}
@media (max-width: 980px) {
    .maintenance-server-controls {
        grid-template-columns: 1fr 1fr;
    }
    .maintenance-server-controls > div {
        grid-column: 1 / -1;
    }
}
@media (max-width: 600px) {
    .maintenance-server-controls {
        grid-template-columns: 1fr;
    }
}
.maintenance-blocker {
    min-height: 55vh;
    margin: 2rem auto;
    padding: 3rem 1.5rem;
    place-items: center;
    align-content: center;
    gap: 0.7rem;
    width: min(760px, 100%);
    border: 1px solid rgba(255, 190, 70, 0.4);
    border-radius: 16px;
    background: rgba(30, 23, 12, 0.88);
    text-align: center;
}
.maintenance-blocker:not([hidden]) {
    display: grid;
}
.maintenance-blocker > span {
    font-size: 3rem;
}
.maintenance-blocker h2,
.maintenance-blocker p {
    margin: 0;
}
.maintenance-blocker p {
    color: var(--text-muted);
}
.maintenance-admin-page form {
    display: grid;
    gap: 1rem;
}
.maintenance-admin-page fieldset {
    padding: 1rem;
    border: 1px solid var(--border-color);
    border-radius: 11px;
}
.maintenance-section-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 0.65rem;
}
.maintenance-switch {
    display: flex;
    gap: 0.7rem;
    align-items: flex-start;
    padding: 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(4, 16, 22, 0.7);
    cursor: pointer;
}
.maintenance-switch.featured {
    border-color: rgba(255, 190, 70, 0.45);
    background: rgba(100, 65, 10, 0.16);
}
.maintenance-switch.danger {
    border-color: rgba(255, 80, 96, 0.4);
}
.maintenance-switch input {
    width: 19px;
    height: 19px;
    accent-color: #ffad35;
}
.maintenance-switch span {
    display: grid;
    gap: 0.2rem;
}
.maintenance-switch small {
    color: var(--text-muted);
}
.maintenance-password-row {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 0.6rem;
    align-items: end;
    margin-top: 0.8rem;
}
.maintenance-password-row label {
    display: grid;
    gap: 0.3rem;
    color: var(--text-muted);
}
.maintenance-password-row input {
    min-height: 44px;
    padding: 0.65rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: #ffd978;
    background: #061116;
    font-family: monospace;
}
.maintenance-action-choice {
    display: grid;
    gap: 0.3rem;
    margin-top: 0.75rem;
    color: var(--text-muted);
}
.maintenance-action-choice select {
    width: 100%;
    min-height: 44px;
    padding: 0.65rem;
    border: 1px solid rgba(255, 190, 70, 0.34);
    border-radius: 8px;
    color: var(--text-primary);
    background: #061116;
}
.maintenance-action-choice small {
    color: var(--text-muted);
    font-size: 0.7rem;
}
.maintenance-palworld-schedule {
    display: grid;
    grid-template-columns: minmax(210px, auto) 1fr;
    gap: 1rem;
    align-items: end;
    margin-top: 0.75rem;
    padding: 0.75rem;
    border: 1px solid rgba(255, 190, 70, 0.22);
    border-radius: 9px;
    background: rgba(100, 65, 10, 0.1);
}
.maintenance-palworld-schedule label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--text-muted);
}
.maintenance-palworld-schedule input {
    width: 78px;
    min-height: 40px;
    padding: 0.5rem;
    border: 1px solid var(--border-color);
    border-radius: 7px;
    color: #fff;
    background: #061116;
}
.maintenance-palworld-schedule p {
    margin: 0;
    color: var(--text-muted);
    font-size: 0.72rem;
}
.maintenance-message-settings {
    display: grid;
    gap: 0.75rem;
    margin-top: 0.8rem;
    background: rgba(255, 190, 70, 0.035);
}
.maintenance-message-settings > label {
    display: grid;
    gap: 0.3rem;
    color: var(--text-muted);
}
.maintenance-message-settings > label small {
    color: var(--text-muted);
    font-size: 0.7rem;
}
.maintenance-message-settings input {
    width: 100%;
    min-height: 42px;
    padding: 0.6rem;
    border: 1px solid var(--border-color);
    border-radius: 7px;
    color: var(--text-primary);
    background: #061116;
}
.copy-icon-button {
    width: 44px;
    height: 44px;
    border: 1px solid var(--accent-cyan);
    border-radius: 8px;
    color: var(--accent-cyan);
    background: rgba(0, 229, 255, 0.08);
    cursor: pointer;
    font-size: 1.2rem;
}
.maintenance-form-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem;
}
.maintenance-form-actions span {
    margin-right: auto;
    color: var(--text-muted);
}
.maintenance-history-panel {
    margin-top: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--border-color);
}
.maintenance-history-list {
    display: grid;
    gap: 0.55rem;
}
.maintenance-history-entry {
    display: grid;
    grid-template-columns: minmax(150px, 0.4fr) minmax(220px, 1fr) auto;
    gap: 0.8rem;
    align-items: center;
    padding: 0.75rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(4, 16, 22, 0.65);
}
.maintenance-history-entry > span {
    display: grid;
    color: var(--text-muted);
    font-size: 0.75rem;
}
.maintenance-history-entry > div {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}
.maintenance-history-entry div span {
    padding: 0.2rem 0.45rem;
    border-radius: 999px;
    color: #ffd17a;
    background: rgba(255, 174, 48, 0.12);
    font-size: 0.7rem;
}
.maintenance-history-entry > small {
    color: var(--text-muted);
}
.page-section[hidden] {
    display: none !important;
}
@media (max-width: 700px) {
    .maintenance-password-row {
        grid-template-columns: 1fr auto;
    }
    .maintenance-password-row label {
        grid-column: 1 / -1;
    }
    .maintenance-palworld-schedule {
        grid-template-columns: 1fr;
    }
    .maintenance-form-actions {
        align-items: stretch;
        flex-direction: column;
    }
    .maintenance-history-entry {
        grid-template-columns: 1fr;
    }
}
.admin-pal-map-canvas {
    position: relative;
    aspect-ratio: 1 / 1;
    max-height: 620px;
    overflow: hidden;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    cursor: grab;
    background: #06161c;
    touch-action: none;
}
.admin-pal-map-canvas.dragging {
    cursor: grabbing;
}
.admin-pal-map-plane {
    position: absolute;
    width: min(100%, 100vh);
    height: min(100%, 100vh);
    left: 50%;
    top: 50%;
    translate: -50% -50%;
    transform-origin: 0 0;
    will-change: transform;
}
.admin-pal-map-canvas img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.admin-pal-map-canvas span {
    display: none;
    position: absolute;
    width: 9px;
    height: 9px;
    border: 2px solid white;
    border-radius: 50%;
    background: #ff405d;
    box-shadow: 0 0 7px #ff405d;
    transform: translate(-50%, -50%) scale(var(--spawn-marker-scale, 1));
    pointer-events: none;
}
.admin-pal-map-canvas span.active {
    display: block;
}
.admin-pal-map-controls {
    position: absolute;
    z-index: 5;
    top: 0.75rem;
    left: 0.75rem;
    display: grid;
    gap: 0.35rem;
}
.admin-pal-map-controls button {
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 9px;
    color: white;
    background: rgba(7, 17, 27, 0.88);
    font-size: 1.1rem;
    cursor: pointer;
}
.map-fullscreen-button {
    position: absolute;
    z-index: 5;
    top: 0.75rem;
    right: 0.75rem;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 9px;
    color: white;
    background: rgba(7, 17, 27, 0.88);
    font-size: 1.2rem;
    cursor: pointer;
}
.map-fullscreen-button:hover {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan);
}
.admin-pal-map-canvas:fullscreen .map-fullscreen-button {
    position: fixed;
}

@media (max-width: 800px), (orientation: portrait) {
    .map-layout:fullscreen {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(0, 1fr) minmax(150px, 34vh);
    }
    .map-layout:fullscreen .map-stage {
        grid-column: 1;
        grid-row: 1;
        width: min(100%, calc(66vh - 1rem));
        height: min(100%, calc(66vh - 1rem));
    }
    .map-layout:fullscreen .map-side-panel {
        grid-column: 1;
        grid-row: 2;
        flex-direction: row;
        max-height: none;
    }
    .map-layout:fullscreen .map-side-panel > * {
        flex: 1;
        min-width: 0;
        overflow: auto;
    }
}
.admin-pal-coordinates {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.6rem;
}
.admin-pal-coordinates label {
    display: grid;
    gap: 0.25rem;
    color: var(--text-muted);
}
.admin-pal-coordinate-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
}
.admin-pal-coordinate-heading small {
    color: var(--text-muted);
    font-size: 0.68rem;
}
.btn-secondary.compact,
.btn-danger.compact {
    padding: 0.45rem 0.65rem;
    font-size: 0.78rem;
}
.btn-danger {
    border: 1px solid rgba(255, 80, 96, 0.55);
    border-radius: 8px;
    background: rgba(255, 80, 96, 0.12);
    color: #ff8e99;
    cursor: pointer;
}
.admin-catalog-actions {
    display: flex;
    gap: 0.45rem;
}
.admin-history-page {
    width: 100%;
}
.admin-history-subnav {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
    padding: 0.4rem;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: rgba(8, 26, 32, 0.65);
}
.admin-history-subnav button {
    flex: 1;
    padding: 0.75rem 1rem;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--text-muted);
    font-family: var(--font-heading);
    font-weight: 700;
    cursor: pointer;
}
.admin-history-subnav button.active {
    background: linear-gradient(135deg, var(--accent-discord), var(--accent-purple));
    color: white;
}
[data-history-panel] {
    display: none;
}
[data-history-panel].active {
    display: block;
}
.admin-history-filters {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) 190px 160px auto;
    gap: 0.7rem;
    margin-bottom: 1rem;
}
.admin-history-table-wrap {
    overflow: auto;
    max-height: 680px;
    border: 1px solid var(--border-color);
    border-radius: 10px;
}
.admin-history-table {
    width: 100%;
    min-width: 1050px;
    border-collapse: collapse;
}
.admin-history-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 0.75rem;
    background: #10232a;
    color: var(--text-muted);
    text-align: left;
}
.history-cell-list {
    display: grid;
    gap: 0.45rem;
    min-width: 150px;
}
.history-cell-list > span {
    display: grid;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.history-cell-list > span:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}
.admin-history-table td {
    padding: 0.75rem;
    border-top: 1px solid var(--border-color);
    vertical-align: top;
}
.admin-history-table td strong,
.admin-history-table td small {
    display: block;
}
.admin-history-table td small {
    margin-top: 0.2rem;
    color: var(--text-muted);
}
.history-status {
    display: inline-flex;
    padding: 0.25rem 0.5rem;
    border-radius: 99px;
}
.history-status.success {
    color: #69e6a6;
    background: rgba(52, 211, 153, 0.12);
}
.history-status.failed {
    color: #ff8e99;
    background: rgba(255, 80, 96, 0.12);
}
.admin-wide-search {
    width: 100%;
    padding: 0.8rem 1rem;
    margin-bottom: 1rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(4, 16, 22, 0.9);
    color: var(--text-primary);
}
.admin-account-filters {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(200px, 320px);
    gap: 0.75rem;
    margin-bottom: 1rem;
}
.admin-account-filters .admin-wide-search {
    margin-bottom: 0;
}
.admin-account-filters select {
    padding: 0.8rem 1rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(4, 16, 22, 0.9);
    color: var(--text-primary);
}
.admin-accounts-list {
    display: grid;
    gap: 0.7rem;
}
.admin-whitelist-role-setting {
    display: flex;
    align-items: end;
    gap: 0.75rem;
    margin: 1rem 0;
}
.admin-whitelist-role-setting label {
    display: grid;
    flex: 1;
    gap: 0.4rem;
    color: var(--text-muted);
}
.admin-whitelist-role-setting select {
    width: 100%;
    padding: 0.7rem 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: #08171d;
    color: var(--text-primary);
}
.admin-whitelist-form {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(190px, 0.7fr) minmax(260px, 1fr) auto;
    gap: 0.75rem;
    align-items: end;
    margin: 1rem 0;
}
.admin-whitelist-form label {
    display: grid;
    gap: 0.4rem;
    color: var(--text-muted);
}
.admin-whitelist-form input,
.admin-whitelist-form select {
    width: 100%;
    padding: 0.7rem 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: #08171d;
    color: var(--text-primary);
}
.admin-discord-combobox {
    position: relative;
    min-width: 0;
}
.admin-discord-results {
    position: absolute;
    z-index: 60;
    top: calc(100% + 0.35rem);
    left: 0;
    right: 0;
    max-height: 320px;
    overflow-y: auto;
    padding: 0.35rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: #08171d;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.45);
}
.admin-discord-result {
    display: grid;
    gap: 0.15rem;
    width: 100%;
    padding: 0.7rem 0.75rem;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--text-primary);
    text-align: left;
    cursor: pointer;
}
.admin-discord-result:hover,
.admin-discord-result:focus-visible {
    background: rgba(0, 242, 254, 0.1);
    outline: none;
}
.admin-discord-result span,
.admin-discord-empty {
    color: var(--text-muted);
    font-size: 0.78rem;
    overflow-wrap: anywhere;
}
.admin-discord-empty {
    padding: 1rem;
    text-align: center;
}
.admin-whitelist-list {
    display: grid;
    gap: 0.7rem;
    margin-top: 1rem;
}
.admin-whitelist-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1rem;
    padding: 0.85rem 1rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(8, 26, 32, 0.6);
}
.admin-whitelist-toolbar > div {
    display: grid;
    gap: 0.2rem;
}
.admin-whitelist-toolbar span,
.admin-whitelist-toolbar label {
    color: var(--text-muted);
    font-size: 0.85rem;
}
.admin-whitelist-toolbar label {
    display: grid;
    gap: 0.35rem;
    min-width: 220px;
}
.admin-whitelist-toolbar select {
    width: 100%;
    padding: 0.65rem 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: #08171d;
    color: var(--text-primary);
}
.admin-whitelist-row {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(240px, 1fr) 150px auto;
    align-items: center;
    gap: 0.8rem;
    padding: 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(8, 26, 32, 0.6);
}
.admin-whitelist-row > div {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}
.admin-whitelist-row small {
    color: var(--text-muted);
    overflow-wrap: anywhere;
}
.admin-whitelist-status {
    width: fit-content;
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    font-size: 0.8rem;
    background: rgba(52, 211, 153, 0.14);
    color: #75e6bd;
}
.admin-whitelist-status.removed {
    background: rgba(148, 163, 184, 0.14);
    color: #b6c1d1;
}
.admin-whitelist-error {
    color: #ff8d96 !important;
}
.admin-account-row {
    display: grid;
    grid-template-columns: 48px minmax(220px, 0.8fr) minmax(340px, 1.2fr) minmax(210px, 0.7fr);
    align-items: center;
    gap: 0.8rem;
    padding: 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(8, 26, 32, 0.6);
}
.admin-account-row img {
    width: 48px;
    height: 48px;
    border-radius: 50%;
}
.admin-account-row > div,
.admin-account-row > label {
    display: grid;
    gap: 0.25rem;
}
.admin-account-row small {
    color: var(--text-muted);
}
.admin-account-row input {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid var(--border-color);
    border-radius: 7px;
    background: #08171d;
    color: var(--text-primary);
}
.admin-account-balances {
    display: grid;
    gap: 0.45rem;
}
.admin-account-adjust {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.65rem;
}
.admin-account-adjust > div {
    display: flex;
    gap: 0.3rem;
}
.admin-account-adjust input {
    width: 76px;
}
.admin-account-adjust button {
    width: 30px;
    min-height: 30px;
    border: 1px solid var(--border-color);
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.08);
    color: var(--text-primary);
    cursor: pointer;
}
.admin-account-adjust button:hover {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan);
}
.admin-account-ban {
    display: grid;
    gap: 0.45rem;
}
.admin-account-ban .compact {
    width: 100%;
    justify-content: center;
}
.admin-ban-permanent {
    display: flex !important;
    grid-template-columns: none !important;
    align-items: center;
    gap: 0.5rem !important;
    color: var(--text-muted);
}
.admin-ban-permanent input {
    width: 18px;
    height: 18px;
    accent-color: var(--accent-cyan);
}
.admin-ban-error {
    color: #ff7b86 !important;
}
.admin-ban-modal-container {
    width: 650px;
}
.admin-ban-modal-body {
    display: grid;
    gap: 1rem;
    max-height: min(70vh, 680px);
    overflow-y: auto;
}
.admin-ban-field {
    display: grid;
    gap: 0.45rem;
    color: var(--text-muted);
}
.admin-ban-field textarea,
.admin-ban-field input,
.admin-ban-duration-fields input,
.admin-ban-duration-fields select {
    width: 100%;
    padding: 0.75rem 0.85rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: #08171d;
    color: var(--text-primary);
    resize: vertical;
}
.admin-ban-mode-fieldset {
    display: grid;
    gap: 0.55rem;
    margin: 0;
    padding: 0.85rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
}
.admin-ban-mode-fieldset legend {
    padding: 0 0.4rem;
    color: var(--text-primary);
    font-weight: 700;
}
.admin-ban-mode-card {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(8, 26, 32, 0.6);
    cursor: pointer;
}
.admin-ban-mode-card:has(input:checked) {
    border-color: var(--accent-cyan);
    background: rgba(0, 229, 255, 0.08);
}
.admin-ban-mode-card.danger:has(input:checked) {
    border-color: #ff6070;
    background: rgba(255, 96, 112, 0.08);
}
.admin-ban-mode-card input {
    width: 18px;
    height: 18px;
    accent-color: var(--accent-cyan);
}
.admin-ban-mode-card span {
    display: grid;
    gap: 0.15rem;
}
.admin-ban-mode-card small {
    color: var(--text-muted);
}
.admin-ban-duration-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}
.admin-ban-duration-fields label {
    display: grid;
    gap: 0.4rem;
    color: var(--text-muted);
}
.admin-ban-preview {
    padding: 0.8rem;
    border: 1px solid rgba(0, 229, 255, 0.22);
    border-radius: 9px;
    background: rgba(0, 229, 255, 0.06);
    color: var(--text-secondary);
}
.admin-ban-modal-container .btn-danger {
    padding: 0.65rem 1rem;
    border-radius: 8px;
}
.admin-ban-history-filters {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) 220px auto;
    gap: 0.75rem;
    margin-bottom: 1rem;
}
.admin-ban-history-filters input,
.admin-ban-history-filters select {
    width: 100%;
    padding: 0.75rem 0.85rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: #08171d;
    color: var(--text-primary);
}
.admin-ban-history-list {
    display: grid;
    gap: 0.65rem;
}
.admin-ban-history-row {
    display: grid;
    grid-template-columns: minmax(190px, 0.8fr) minmax(240px, 1.15fr) minmax(190px, 0.8fr) minmax(190px, 0.8fr);
    gap: 0.85rem;
    align-items: center;
    padding: 0.85rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(8, 26, 32, 0.6);
}
.admin-ban-history-row > div {
    display: grid;
    gap: 0.22rem;
}
.admin-ban-history-row small {
    color: var(--text-muted);
}
.admin-discord-publisher-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.85rem;
    margin-top: 1rem;
}
.admin-discord-publisher-form > label {
    display: grid;
    gap: 0.35rem;
    padding: 0.9rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(8, 26, 32, 0.6);
}
.admin-discord-publisher-form > label > span {
    font-weight: 700;
    color: var(--text-primary);
}
.admin-discord-publisher-form > label > small {
    min-height: 2.2em;
    color: var(--text-muted);
}
.admin-discord-publisher-form select {
    width: 100%;
    padding: 0.7rem 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: #08171d;
    color: var(--text-primary);
}
.admin-discord-publisher-form .discord-site-link-option {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin-top: 0.25rem;
    padding: 0.55rem 0.65rem;
    border: 1px solid rgba(88, 101, 242, 0.25);
    border-radius: 8px;
    background: rgba(88, 101, 242, 0.08);
    color: var(--text-primary);
    font-size: 0.8rem;
    cursor: pointer;
}
.admin-discord-publisher-form .discord-site-link-option input {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--accent-discord);
}
.admin-discord-publisher-actions {
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
    gap: 0.65rem;
}
.admin-discord-publisher-help {
    display: grid;
    gap: 0.25rem;
    margin-top: 1rem;
    padding: 0.85rem;
    border-left: 3px solid var(--accent-cyan);
    background: rgba(0, 229, 255, 0.05);
    color: var(--text-muted);
}
.admin-discord-publisher-help strong {
    color: var(--text-primary);
}
@media (max-width: 1000px) {
    .admin-ban-history-row {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 700px) {
    .admin-ban-history-row,
    .admin-ban-history-filters,
    .admin-discord-publisher-form {
        grid-template-columns: 1fr;
    }
    .admin-discord-publisher-actions {
        grid-column: auto;
        flex-direction: column;
    }
}
.admin-bans-heading {
    margin-top: 1.5rem;
}
.admin-bans-list {
    display: grid;
    gap: 0.7rem;
}
.admin-ban-row {
    display: grid;
    grid-template-columns: 48px 1fr auto;
    align-items: center;
    gap: 0.8rem;
    padding: 0.8rem;
    border: 1px solid rgba(255, 96, 112, 0.25);
    border-radius: 10px;
    background: rgba(40, 12, 20, 0.28);
}
.admin-ban-row img {
    width: 48px;
    height: 48px;
    border-radius: 50%;
}
.admin-ban-icon {
    width: 48px;
    height: 48px;
    display: grid !important;
    place-items: center;
    border-radius: 50%;
    background: rgba(255, 96, 112, 0.12);
    font-size: 1.25rem;
}
.admin-ban-row > div {
    display: grid;
    gap: 0.2rem;
}
.admin-ban-row small {
    color: var(--text-muted);
}
.admin-permissions-matrix {
    display: grid;
    gap: 0.8rem;
    margin-top: 1rem;
}
.admin-permissions-warning {
    margin: 0.8rem 0;
    padding: 0.8rem 1rem;
    border: 1px solid rgba(255, 183, 3, 0.5);
    border-radius: 9px;
    background: rgba(255, 183, 3, 0.1);
    color: #ffd36a;
}
.admin-role-policy {
    overflow: hidden;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: rgba(8, 26, 32, 0.6);
}
.admin-role-policy[open] {
    border-color: rgba(0, 229, 255, 0.2);
}
.admin-role-policy summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 58px;
    padding: 0.8rem 1rem;
    cursor: pointer;
    list-style: none;
    background: rgba(4, 18, 24, 0.72);
}
.admin-role-policy summary::-webkit-details-marker {
    display: none;
}
.role-identity,
.role-permission-count {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}
.role-identity i {
    flex: 0 0 auto;
    width: 13px;
    height: 13px;
    border: 2px solid rgba(255, 255, 255, 0.16);
    border-radius: 50%;
}
.role-identity strong {
    color: #fff;
}
.role-type-badge {
    padding: 0.18rem 0.45rem;
    border-radius: 999px;
    color: var(--text-muted);
    background: rgba(255, 255, 255, 0.07);
    font-size: 0.62rem;
    font-weight: 700;
    text-transform: uppercase;
}
.role-type-badge.automatic {
    color: #72e8bd;
    background: rgba(52, 211, 153, 0.12);
}
.role-type-badge.whitelist {
    color: #75dfff;
    background: rgba(0, 190, 255, 0.12);
}
.role-type-badge.locked {
    color: #ffb8c0;
    background: rgba(255, 80, 96, 0.12);
}
.admin-role-policy.role-locked {
    opacity: 0.78;
}
.role-permission-count {
    color: var(--text-muted);
    font-size: 0.72rem;
}
.role-permission-count b {
    color: var(--accent-cyan);
    font-size: 1rem;
    transition: transform 0.2s;
}
.admin-role-policy[open] .role-permission-count b {
    transform: rotate(180deg);
}
.permission-groups {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
    padding: 1rem;
}
.permission-group {
    padding: 0.75rem;
    border: 1px solid rgba(134, 183, 194, 0.13);
    border-radius: 9px;
    background: rgba(2, 14, 19, 0.48);
}
.permission-group h6 {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin: 0 0 0.55rem;
    color: var(--accent-cyan);
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.permission-group > div {
    display: grid;
    gap: 0.4rem;
}
.permission-option {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.55rem;
    align-items: center;
    min-height: 43px;
    padding: 0.45rem 0.55rem;
    border-radius: 7px;
    color: var(--text-muted);
    cursor: pointer;
}
.permission-option:hover {
    background: rgba(255, 255, 255, 0.045);
}
.permission-option input {
    width: 17px;
    height: 17px;
    accent-color: var(--accent-cyan);
}
.permission-option > span {
    display: grid;
    min-width: 0;
}
.permission-option strong {
    color: var(--text-secondary);
    font-size: 0.78rem;
}
.permission-option small {
    color: #55767e;
    font: 0.62rem monospace;
}
.permission-option.permission-automatic {
    cursor: default;
}
.permission-option.permission-automatic input {
    accent-color: var(--accent-green);
}
.permission-option em {
    padding: 0.12rem 0.38rem;
    border-radius: 999px;
    background: rgba(52, 211, 153, 0.12);
    color: #75e6bd;
    font-size: 0.6rem;
    font-style: normal;
    text-transform: uppercase;
}
@media (max-width: 760px) {
    .permission-groups {
        grid-template-columns: 1fr;
    }
    .role-type-badge {
        display: none;
    }
    .role-permission-count {
        white-space: nowrap;
    }
}

@media (max-width: 1050px) {
    .admin-give-lower {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 650px) {
    .admin-give-players {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 650px) {
    .admin-give-filters {
        grid-template-columns: 1fr;
    }
    .admin-give-cart-row {
        flex-wrap: wrap;
    }
}
@media (max-width: 900px) {
    .admin-pal-fields.four {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 600px) {
    .admin-pal-fields,
    .admin-pal-fields.four,
    .admin-pal-coordinates {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 900px) {
    .admin-pal-work-checks {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 600px) {
    .admin-pal-work-checks {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 900px) {
    .admin-history-filters {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 650px) {
    .admin-history-subnav {
        flex-direction: column;
    }
}
@media (max-width: 1100px) {
    .admin-account-row {
        grid-template-columns: 48px 1fr;
    }
    .admin-account-balances,
    .admin-account-ban {
        grid-column: 1 / -1;
    }
}
@media (max-width: 760px) {
    .admin-account-adjust {
        align-items: stretch;
        flex-direction: column;
    }
    .admin-ban-row {
        grid-template-columns: 40px 1fr;
    }
    .admin-ban-row button {
        grid-column: 1 / -1;
    }
}
@media (max-width: 1000px) {
    .admin-whitelist-form,
    .admin-whitelist-row {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 650px) {
    .admin-whitelist-toolbar {
        align-items: stretch;
        flex-direction: column;
    }
    .admin-whitelist-toolbar label {
        min-width: 0;
    }
    .admin-workspace-nav {
        position: static;
    }
}
@media (max-width: 650px) {
    .admin-account-filters {
        grid-template-columns: 1fr;
    }
    .admin-whitelist-role-setting {
        align-items: stretch;
        flex-direction: column;
    }
}

.admin-shop-page {
    width: 100%;
}

.admin-workspace-view.active[data-admin-view-panel='shop'] {
    display: grid;
    gap: 1.25rem;
}
.admin-server-overview {
    width: 100%;
}
.admin-server-overview-grid,
.admin-server-rates-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 0.75rem;
}
.admin-server-overview-card,
.admin-server-rate {
    display: grid;
    gap: 0.25rem;
    min-height: 92px;
    padding: 0.9rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(8, 26, 32, 0.6);
}
.admin-server-overview-card span,
.admin-server-rate span {
    color: var(--text-muted);
    font-size: 0.78rem;
}
.admin-server-overview-card strong,
.admin-server-rate strong {
    color: var(--text-primary);
    font-size: 1.2rem;
}
.admin-server-rates {
    margin-top: 1.2rem;
}
.admin-server-rates-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
}
.admin-server-rate-group {
    padding: 1rem;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: linear-gradient(145deg, rgba(8, 26, 32, 0.82), rgba(12, 19, 30, 0.72));
}
.admin-server-rate-group h5 {
    margin: 0 0 0.75rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid var(--border-color);
    color: var(--text-primary);
    font-size: 0.95rem;
}
.admin-server-rate-group > div {
    display: grid;
    gap: 0.5rem;
}
.admin-server-rate-group .admin-server-rate {
    grid-template-columns: minmax(160px, 1fr) auto;
    align-items: center;
    min-height: 0;
    padding: 0.65rem 0.7rem;
}
.admin-server-rate-group .admin-server-rate span {
    color: var(--text-secondary);
    font-size: 0.82rem;
}
.admin-server-rate-group .admin-server-rate strong {
    padding: 0.18rem 0.42rem;
    border-radius: 5px;
    background: rgba(107, 114, 148, 0.22);
    font-family: monospace;
    font-size: 0.82rem;
}
.admin-server-rate-group .admin-server-rate small {
    grid-column: 1 / -1;
    color: var(--text-muted);
    font-style: italic;
}
@media (max-width: 900px) {
    .admin-server-rates-grid {
        grid-template-columns: 1fr;
    }
}
.lottery-page,
.admin-workspace-view.active[data-admin-view-panel='lottery'] {
    display: grid;
    gap: 1.2rem;
    width: 100%;
}
.lottery-hero {
    overflow: visible;
}
.lottery-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 0.75rem;
    margin: 1rem 0;
}
.lottery-stat,
.lottery-history-row {
    padding: 0.85rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(8, 26, 32, 0.65);
}
.lottery-stat {
    display: grid;
    gap: 0.25rem;
}
.lottery-stat span,
.lottery-history-row small {
    color: var(--text-muted);
}
.lottery-stat strong {
    font-size: 1.35rem;
}
.lottery-claim-form {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) auto auto;
    gap: 0.75rem;
    align-items: end;
}
.lottery-claim-form label {
    display: grid;
    gap: 0.4rem;
    color: var(--text-muted);
}
.lottery-claim-form input {
    width: 100%;
    padding: 0.75rem 0.85rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: #08171d;
    color: var(--text-primary);
}
.lottery-claim-form select {
    width: 100%;
    padding: 0.75rem 0.85rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: #08171d;
    color: var(--text-primary);
}
.home-vote-claim {
    margin: 0 0 1.2rem;
}
.user-ticket-balance {
    display: flex;
    gap: 0.65rem;
    color: var(--text-muted);
    font-size: 0.78rem;
}
.user-ticket-balance strong {
    color: var(--text-primary);
}
.user-crown-balance {
    color: #ffe083;
    font-size: 0.82rem;
}

.pending-reward-notice {
    position: relative;
    z-index: 25;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.85rem;
    width: min(1180px, calc(100% - 2rem));
    margin: 0.75rem auto 0;
    padding: 0.75rem 1rem;
    border: 1px solid rgba(255, 215, 96, 0.4);
    border-radius: 12px;
    background: linear-gradient(100deg, rgba(72, 53, 15, 0.96), rgba(16, 36, 41, 0.98));
    color: var(--text-primary);
    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.25);
    text-align: left;
    cursor: pointer;
}
.pending-reward-notice[hidden] {
    display: none;
}
.pending-reward-notice.ready {
    border-color: rgba(87, 235, 170, 0.55);
    background: linear-gradient(100deg, rgba(18, 67, 50, 0.97), rgba(14, 39, 43, 0.98));
}
.pending-reward-notice-icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 50%;
    background: rgba(255, 215, 96, 0.12);
    font-size: 1.25rem;
}
.pending-reward-notice-copy {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
}
.pending-reward-notice-copy strong {
    color: #ffe083;
}
.pending-reward-notice.ready .pending-reward-notice-copy strong {
    color: #77edb7;
}
.pending-reward-notice-copy small {
    overflow: hidden;
    color: var(--text-muted);
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pending-reward-notice-action {
    color: #fff0ad;
    font-size: 0.8rem;
    font-weight: 700;
    white-space: nowrap;
}
.pending-reward-notice-action b {
    margin-left: 0.35rem;
    font-size: 1rem;
}
.pending-reward-notice:hover {
    transform: translateY(-1px);
    filter: brightness(1.08);
}
@media (max-width: 650px) {
    .pending-reward-notice {
        grid-template-columns: auto 1fr;
    }
    .pending-reward-notice-action {
        grid-column: 1 / -1;
        padding-left: 57px;
    }
    .pending-reward-notice-copy small {
        white-space: normal;
    }
}

.rewards-page {
    display: grid;
    gap: 1rem;
    width: 100%;
}
.rewards-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    background: radial-gradient(circle at 85% 20%, rgba(255, 205, 64, 0.16), transparent 34%), rgba(8, 26, 32, 0.72);
}
.rewards-hero p {
    max-width: 720px;
    color: var(--text-muted);
}
.crown-orb {
    display: grid;
    flex: 0 0 130px;
    min-height: 130px;
    place-items: center;
    align-content: center;
    border: 1px solid rgba(255, 215, 96, 0.42);
    border-radius: 50%;
    background: rgba(255, 197, 45, 0.08);
    box-shadow: 0 0 40px rgba(255, 197, 45, 0.1);
}
.crown-orb span {
    font-size: 1.8rem;
}
.crown-orb strong {
    color: #ffe083;
    font-size: 1.7rem;
}
.crown-orb small {
    color: var(--text-muted);
}
.reward-kind-tabs {
    display: flex;
    gap: 0.5rem;
    padding: 0.4rem;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: rgba(8, 26, 32, 0.65);
}
.reward-kind-tabs button {
    flex: 1;
    padding: 0.75rem;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    font-weight: 700;
}
.reward-kind-tabs button.active {
    color: #102128;
    background: linear-gradient(135deg, #ffe083, #d9a832);
}
.user-rewards-list {
    display: grid;
    gap: 0.8rem;
}
.user-reward-card {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: rgba(8, 26, 32, 0.72);
}
.user-reward-card.pending {
    border-color: rgba(255, 215, 96, 0.38);
    box-shadow: inset 3px 0 #e7bd4d;
}
.reward-card-icon {
    display: grid;
    width: 60px;
    height: 60px;
    place-items: center;
    border-radius: 50%;
    background: rgba(255, 215, 96, 0.1);
    font-size: 1.7rem;
}
.reward-card-copy > span {
    color: #e7bd4d;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}
.reward-card-copy h4 {
    margin: 0.2rem 0;
}
.reward-card-copy p {
    margin: 0;
    color: var(--text-muted);
}
.reward-loot {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.7rem;
}
.reward-loot b {
    padding: 0.3rem 0.5rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    font-size: 0.75rem;
}
.reward-card-action {
    display: grid;
    gap: 0.35rem;
    text-align: center;
}
.reward-card-action small {
    color: var(--text-muted);
}
.admin-rewards-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}
.admin-reward-nav {
    display: flex;
    gap: 0.5rem;
    width: 100%;
    margin-bottom: 1rem;
    padding: 0.4rem;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: rgba(8, 26, 32, 0.65);
}
.admin-reward-nav button {
    flex: 1;
    padding: 0.8rem 1rem;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--text-muted);
    font-weight: 700;
    cursor: pointer;
}
.admin-reward-nav button.active {
    background: linear-gradient(135deg, #d3a72d, #ffe083);
    color: #152128;
}
.admin-reward-section {
    display: none;
    width: 100%;
}
.admin-reward-section.active {
    display: grid;
    gap: 1rem;
}
.reward-schedule-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}
.reward-schedule-fields[hidden],
#rewardQuestOrder[hidden],
#rewardQuestChallenges[hidden] {
    display: none;
}
.reward-event-dates {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.65rem;
}
.reward-event-dates b {
    padding: 0.3rem 0.5rem;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    color: var(--text-muted);
    font-size: 0.72rem;
}
.event-status {
    padding: 0.4rem 0.65rem;
    border: 1px solid var(--border-color);
    border-radius: 99px;
    color: var(--text-muted);
}
.event-status.live {
    border-color: rgba(87, 235, 170, 0.45);
    color: #77edb7;
}
.event-status.finished {
    color: #a5aeb1;
    background: rgba(255, 255, 255, 0.05);
}
.user-reward-card.locked {
    opacity: 0.55;
    filter: saturate(0.45);
}
.admin-reward-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}
.admin-reward-form label {
    display: grid;
    gap: 0.35rem;
    color: var(--text-muted);
    font-size: 0.8rem;
}
.admin-reward-form .wide {
    grid-column: 1 / -1;
}
.admin-reward-form input,
.admin-reward-form select,
.admin-reward-form textarea {
    width: 100%;
    padding: 0.7rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: #08171d;
    color: var(--text-primary);
    resize: vertical;
}
.reward-item-builder {
    display: grid;
    gap: 0.7rem;
    padding: 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(4, 16, 22, 0.42);
}
.reward-picker-controls {
    display: grid;
    grid-template-columns: 130px 1fr;
    gap: 0.55rem;
    margin-top: 0.35rem;
}
.reward-picker-results {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.4rem;
    max-height: 280px;
    overflow-y: auto;
}
.reward-picker-result {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: 0.55rem;
    align-items: center;
    padding: 0.45rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: rgba(8, 28, 34, 0.85);
    color: var(--text-primary);
    text-align: left;
    cursor: pointer;
}
.reward-picker-result:hover {
    border-color: #e7bd4d;
}
.reward-picker-result img,
.reward-picker-fallback {
    width: 40px;
    height: 40px;
    object-fit: contain;
}
.reward-picker-fallback {
    display: grid;
    place-items: center;
}
.reward-picker-result span {
    display: grid;
    min-width: 0;
}
.reward-picker-result strong,
.reward-picker-result small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.reward-picker-result small {
    color: var(--text-muted);
}
.reward-picker-result b {
    color: #ffe083;
    font-size: 0.7rem;
}
.reward-selected-items {
    display: grid;
    gap: 0.4rem;
    margin-top: 0.45rem;
}
.reward-selected-item {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 110px 32px;
    gap: 0.55rem;
    align-items: center;
    padding: 0.45rem;
    border: 1px solid rgba(255, 215, 96, 0.2);
    border-radius: 8px;
}
.reward-selected-item img {
    width: 40px;
    height: 40px;
    object-fit: contain;
}
.reward-selected-item > span {
    display: grid;
}
.reward-selected-item small {
    color: var(--text-muted);
}
.reward-selected-item label {
    font-size: 0.68rem;
}
.reward-selected-item input {
    padding: 0.4rem;
}
.reward-selected-item button {
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 80, 96, 0.14);
    color: #ff8994;
    cursor: pointer;
}
.reward-progress-badge {
    padding: 0.45rem 0.7rem;
    border: 1px solid rgba(255, 215, 96, 0.35);
    border-radius: 99px;
    color: #ffe083;
    background: rgba(255, 197, 45, 0.08);
}
.quest-evidence-panel {
    display: grid;
    grid-column: 1 / -1;
    gap: 0.7rem;
    padding-top: 0.8rem;
    border-top: 1px solid var(--border-color);
}
.quest-challenge-list {
    display: grid;
    gap: 0.55rem;
}
.quest-challenge-list section {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.6rem;
    padding: 0.7rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(3, 15, 20, 0.45);
}
.quest-challenge-list section > div:first-child {
    display: grid;
}
.quest-challenge-list b {
    color: #ffe083;
    font-size: 0.7rem;
}
.quest-challenge-list small {
    color: var(--text-muted);
}
.quest-file-button {
    align-self: center;
    padding: 0.45rem 0.65rem;
    border: 1px solid rgba(255, 215, 96, 0.35);
    border-radius: 7px;
    color: #ffe083;
    cursor: pointer;
}
.quest-file-button input {
    display: none;
}
.quest-proof-thumbs {
    display: flex;
    grid-column: 1 / -1;
    flex-wrap: wrap;
    gap: 0.4rem;
}
.quest-proof-thumbs img {
    width: 76px;
    height: 58px;
    object-fit: cover;
    border: 1px solid var(--border-color);
    border-radius: 6px;
}
.quest-submission-state {
    display: grid;
    gap: 0.2rem;
    padding: 0.65rem;
    border-radius: 8px;
}
.quest-submission-state.waiting {
    color: #ffe083;
    background: rgba(255, 197, 45, 0.08);
}
.quest-submission-state.rejected {
    color: #ff9da5;
    background: rgba(255, 70, 90, 0.08);
}
.quest-attachment {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.7rem;
    border: 1px dashed rgba(255, 215, 96, 0.35);
    border-radius: 9px;
}
.quest-attachment > img {
    width: 88px;
    height: 66px;
    object-fit: cover;
    border-radius: 6px;
}
.quest-attachment > div {
    display: grid;
    min-width: 0;
    margin-right: auto;
}
.quest-attachment > div strong {
    overflow: hidden;
    text-overflow: ellipsis;
}
.quest-attachment > small {
    color: var(--text-muted);
}
.quest-challenge-list .quest-attachment {
    grid-column: 1/-1;
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr) auto;
    align-items: center;
    background: rgba(0, 242, 254, 0.035);
    border-color: rgba(0, 242, 254, 0.28);
}
.quest-challenge-list .quest-attachment > img {
    width: 96px;
    height: 72px;
    border: 1px solid rgba(0, 242, 254, 0.3);
    background: #041118;
}
.quest-remove-file {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 38px;
    padding: 0.45rem 0.7rem;
    border: 1px solid rgba(255, 82, 102, 0.55);
    border-radius: 7px;
    color: #ff9aa6;
    background: rgba(255, 65, 87, 0.1);
    font-weight: 800;
    cursor: pointer;
}
.quest-remove-file:hover {
    color: #fff;
    background: rgba(255, 65, 87, 0.28);
}
.quest-remove-file span {
    font-size: 1.1rem;
}
.quest-no-proof {
    align-self: center;
}
.quest-submit-evidence {
    min-height: 46px;
}
@media (max-width: 700px) {
    .quest-challenge-list section {
        grid-template-columns: 1fr;
    }
    .quest-file-button {
        justify-self: start;
    }
    .quest-challenge-list .quest-attachment {
        grid-template-columns: 72px minmax(0, 1fr);
    }
    .quest-challenge-list .quest-attachment > img {
        width: 72px;
        height: 56px;
    }
    .quest-remove-file {
        grid-column: 1/-1;
        width: 100%;
    }
}
.quest-review-popup {
    width: min(920px, 100%);
    max-height: 90vh;
    overflow-y: auto;
}
.quest-review-challenges {
    display: grid;
    gap: 0.75rem;
    margin: 1rem 0;
}
.quest-review-challenges section {
    padding: 0.75rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
}
.quest-review-challenges section > div:first-child {
    display: flex;
    gap: 0.55rem;
    align-items: baseline;
    margin-bottom: 0.6rem;
}
.quest-review-challenges section > div:last-child {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 0.5rem;
}
.quest-review-challenges img {
    width: 100%;
    height: 120px;
    object-fit: cover;
    border-radius: 7px;
}
.quest-review-actions {
    grid-template-columns: 1fr 1fr;
}
.reward-grant-actions {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.reward-account-results {
    display: grid;
    max-height: 300px;
    overflow-y: auto;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: #08171d;
}
.reward-account-results[hidden] {
    display: none;
}
.reward-account-results button {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.7rem;
    border: 0;
    border-bottom: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-primary);
    text-align: left;
    cursor: pointer;
}
.reward-account-results button:hover {
    background: rgba(255, 215, 96, 0.08);
}
.reward-account-results button span {
    display: grid;
}
.reward-account-results small {
    color: var(--text-muted);
}
.reward-account-results b {
    color: #77edb7;
    font-size: 0.7rem;
}
.reward-account-picker {
    display: grid;
    gap: 0.65rem;
}
.reward-account-toolbar {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.55rem;
}
.reward-account-selection {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    color: #ffe083;
}
.reward-account-list {
    display: grid;
    max-height: 440px;
    overflow-y: auto;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: #08171d;
}
.reward-account-row {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.7rem !important;
    align-items: center;
    margin: 0 !important;
    padding: 0.65rem 0.75rem;
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}
.reward-account-row:hover {
    background: rgba(255, 215, 96, 0.06);
}
.reward-account-row input {
    width: 18px !important;
    height: 18px;
    accent-color: #e7bd4d;
}
.reward-account-row span {
    display: grid;
    min-width: 0;
}
.reward-account-row strong,
.reward-account-row small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.reward-account-row small {
    color: var(--text-muted);
}
.reward-account-row b {
    color: #ff9da5;
    font-size: 0.7rem;
}
.reward-account-row b.whitelisted {
    color: #77edb7;
}
.reward-progress-filters {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) repeat(3, minmax(150px, 0.55fr));
    gap: 0.55rem;
    margin-top: 1rem;
}
.reward-progress-filters input,
.reward-progress-filters select {
    min-width: 0;
    padding: 0.7rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: #08171d;
    color: var(--text-primary);
}
.reward-progress-summary,
.reward-pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.75rem;
    color: var(--text-muted);
    font-size: 0.78rem;
}
.reward-pagination {
    justify-content: center;
}
.reward-pagination span {
    min-width: 110px;
    text-align: center;
}
.admin-reward-templates,
.reward-history-list {
    display: grid;
    gap: 0.55rem;
    margin-top: 1rem;
}
.admin-reward-template-group {
    display: grid;
    gap: 0.65rem;
    padding: 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: rgba(4, 18, 24, 0.45);
}
.admin-reward-template-group > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.25rem 0.2rem 0.65rem;
    border-bottom: 1px solid var(--border-color);
}
.admin-reward-template-group > header > div {
    display: grid;
    gap: 0.18rem;
}
.admin-reward-template-group > header strong {
    color: var(--text-primary);
}
.admin-reward-template-group > header small,
.admin-reward-template-group > header > span {
    color: var(--text-muted);
}
.admin-reward-template-group [data-template-group-list] {
    display: grid;
    gap: 0.55rem;
}
.admin-reward-template,
.reward-history-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(8, 26, 32, 0.6);
}
.reward-template-actions,
.reward-template-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    justify-content: flex-end;
}
.reward-template-form-actions {
    justify-content: flex-start;
}
.admin-reward-template > div,
.reward-history-row > div {
    display: grid;
    gap: 0.2rem;
}
.admin-reward-template span,
.admin-reward-template small,
.reward-history-row small {
    color: var(--text-muted);
}
.admin-reward-template.inactive {
    opacity: 0.55;
}
@media (max-width: 850px) {
    .admin-rewards-layout {
        grid-template-columns: 1fr;
    }
    .admin-reward-nav {
        flex-direction: column;
    }
    .reward-schedule-fields,
    .reward-progress-filters {
        grid-template-columns: 1fr;
    }
    .reward-account-toolbar {
        grid-template-columns: 1fr;
    }
    .user-reward-card {
        grid-template-columns: 52px 1fr;
    }
    .reward-card-action {
        grid-column: 1 / -1;
    }
    .rewards-hero {
        align-items: flex-start;
    }
    .crown-orb {
        flex-basis: 100px;
        min-height: 100px;
    }
    .reward-picker-results {
        grid-template-columns: 1fr;
    }
}
.lottery-rankings {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}
.lottery-ranking-group {
    display: grid;
    gap: 0.45rem;
}
.lottery-ranking-row {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: rgba(8, 26, 32, 0.6);
}
.lottery-history {
    display: grid;
    gap: 0.65rem;
    margin-top: 1rem;
}
.lottery-history-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.65rem;
    align-items: center;
}
.lottery-history-row > div {
    display: grid;
    gap: 0.2rem;
}
.lottery-admin-actions {
    display: flex !important;
    flex-wrap: wrap;
    gap: 0.45rem !important;
    justify-content: flex-end;
}
.admin-lottery-page .admin-form {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}
@media (max-width: 800px) {
    .lottery-claim-form {
        grid-template-columns: 1fr;
    }
}
.admin-purchases-page,
.admin-loyalty-page {
    width: 100%;
}
.admin-purchase-filters {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) 190px auto;
    gap: 0.7rem;
    margin-bottom: 1rem;
}
.admin-purchase-filters input,
.admin-purchase-filters select,
.admin-loyalty-form input,
.admin-loyalty-form select {
    width: 100%;
    padding: 0.75rem 0.85rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: #08171d;
    color: var(--text-primary);
}
.admin-purchase-table-wrap {
    max-height: 720px;
    overflow: auto;
    border: 1px solid var(--border-color);
    border-radius: 10px;
}
.admin-purchase-table {
    width: 100%;
    min-width: 1280px;
    border-collapse: collapse;
}
.admin-purchase-table th {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 0.75rem;
    background: #10232a;
    color: var(--text-muted);
    text-align: left;
}
.admin-purchase-table td {
    padding: 0.75rem;
    border-top: 1px solid var(--border-color);
    vertical-align: top;
}
.admin-purchase-table td > strong,
.admin-purchase-table td > small,
.purchase-item-line strong,
.purchase-item-line small {
    display: block;
}
.admin-purchase-table small,
.purchase-item-line {
    color: var(--text-muted);
    font-size: 0.78rem;
}
.purchase-items {
    display: grid;
    gap: 0.45rem;
    max-width: 300px;
}
.purchase-item-line {
    padding-bottom: 0.35rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.admin-loyalty-form {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.75rem;
    align-items: end;
}
.season-reset-panel form {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}
.season-preparation-panel {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
    border: 1px solid rgba(0, 242, 254, 0.28);
    border-radius: 12px;
    background: rgba(0, 242, 254, 0.045);
}
.season-preparation-panel p {
    margin-top: 0.35rem;
    color: var(--text-secondary);
}
.season-reset-panel .season-preparation-panel form {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    gap: 0.7rem;
    align-items: end;
    margin-top: 0;
}
.season-preparation-panel form label {
    display: grid;
    gap: 0.35rem;
}
.season-draft-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}
html[data-season-context='draft'] body::before {
    position: sticky;
    z-index: 1000;
    top: 0;
    display: block;
    padding: 0.55rem 1rem;
    color: #041016;
    background: linear-gradient(90deg, #70efb1, #00e5ff);
    content: 'PRÉVISUALISATION STAFF · SAISON EN PRÉPARATION · invisible pour les joueurs';
    text-align: center;
    font-weight: 900;
    letter-spacing: 0.035em;
}
@media (max-width: 650px) {
    .season-reset-panel .season-preparation-panel form {
        grid-template-columns: 1fr;
    }
}
.season-reset-panel form > label {
    display: grid;
    gap: 0.4rem;
    color: var(--text-muted);
}
.season-reset-panel form input {
    width: 100%;
    padding: 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: #08171d;
    color: var(--text-primary);
}
.season-warning {
    display: grid;
    gap: 0.3rem;
    padding: 1rem;
    border: 1px solid rgba(255, 91, 91, 0.45);
    border-radius: 10px;
    background: rgba(120, 20, 20, 0.16);
}
.season-category-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 0.65rem;
}
.season-category {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(8, 26, 32, 0.6);
    cursor: pointer;
}
.season-category input {
    width: auto !important;
}
.season-category span {
    display: grid;
    gap: 0.15rem;
}
.season-selection-actions {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.loyalty-code-generator {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.45rem;
}
.loyalty-code-generator .btn-secondary {
    min-height: 42px;
}
.admin-loyalty-form label,
.admin-loyalty-field {
    display: grid;
    gap: 0.4rem;
    color: var(--text-muted);
}
.admin-loyalty-form .admin-loyalty-checkbox {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 48px;
    padding: 0.55rem 0.7rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(8, 26, 32, 0.6);
    cursor: pointer;
}
.admin-loyalty-checkbox input {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
    accent-color: var(--accent-cyan);
}
.admin-loyalty-checkbox span {
    display: grid;
    gap: 0.1rem;
}
.admin-loyalty-checkbox small {
    color: var(--text-muted);
    font-size: 0.72rem;
}
.loyalty-multiselect {
    position: relative;
}
.loyalty-multiselect-trigger {
    width: 100%;
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.75rem 0.85rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: #08171d;
    color: var(--text-primary);
    cursor: pointer;
    text-align: left;
}
.loyalty-multiselect-trigger[aria-expanded='true'] {
    border-color: var(--accent-cyan);
    box-shadow: 0 0 0 2px rgba(0, 229, 255, 0.1);
}
.loyalty-multiselect-menu {
    position: absolute;
    z-index: 30;
    top: calc(100% + 0.35rem);
    left: 0;
    right: 0;
    max-height: 280px;
    overflow-y: auto;
    padding: 0.4rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: #0b1b22;
    box-shadow: 0 16px 35px rgba(0, 0, 0, 0.38);
}
.loyalty-multiselect-menu[hidden] {
    display: none;
}
.loyalty-multiselect-option {
    display: flex !important;
    grid-template-columns: none !important;
    align-items: center;
    gap: 0.65rem !important;
    padding: 0.55rem 0.6rem;
    border-radius: 7px;
    cursor: pointer;
}
.loyalty-multiselect-option:hover {
    background: rgba(0, 229, 255, 0.08);
}
.loyalty-multiselect-option input {
    width: 18px !important;
    height: 18px;
    flex: 0 0 auto;
    accent-color: var(--accent-cyan);
}
.loyalty-multiselect-option span {
    min-width: 0;
    display: grid;
}
.loyalty-multiselect-option strong,
.loyalty-multiselect-option small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.loyalty-multiselect-option small {
    color: var(--text-muted);
    font-size: 0.72rem;
}
.admin-percentage-input {
    position: relative;
}
.admin-percentage-input input {
    padding-right: 2.2rem;
}
.admin-percentage-input span {
    position: absolute;
    right: 0.8rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-muted);
}
.admin-loyalty-list {
    display: grid;
    gap: 0.65rem;
    margin-top: 1rem;
}
.admin-loyalty-group {
    display: grid;
    gap: 0.65rem;
}
.admin-loyalty-group + .admin-loyalty-group {
    margin-top: 0.65rem;
    padding-top: 1rem;
    border-top: 1px solid var(--border-color);
}
.admin-loyalty-group-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.7rem 0.85rem;
    border-radius: 9px;
    background: rgba(8, 26, 32, 0.72);
}
.admin-loyalty-group-heading > div {
    display: grid;
    gap: 0.2rem;
}
.admin-loyalty-group-heading small {
    color: var(--text-muted);
}
.admin-loyalty-group-heading > span {
    min-width: 2rem;
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    background: rgba(0, 229, 255, 0.12);
    color: var(--accent-cyan);
    text-align: center;
    font-weight: 700;
}
.admin-loyalty-group.unique .admin-loyalty-group-heading {
    border: 1px solid rgba(255, 193, 7, 0.22);
}
.admin-loyalty-group.unique .admin-loyalty-group-heading > span {
    background: rgba(255, 193, 7, 0.12);
    color: var(--accent-gold);
}
.admin-loyalty-row {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(190px, 1fr) 100px auto;
    gap: 0.8rem;
    align-items: center;
    padding: 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(8, 26, 32, 0.6);
}
.admin-loyalty-row > div {
    display: grid;
    gap: 0.2rem;
}
.admin-loyalty-row small {
    color: var(--text-muted);
}
.admin-loyalty-history-filters {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) 200px;
    gap: 0.75rem;
    margin-bottom: 1rem;
}
.admin-loyalty-history-filters input,
.admin-loyalty-history-filters select {
    width: 100%;
    padding: 0.75rem 0.85rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: #08171d;
    color: var(--text-primary);
}
.admin-loyalty-history-list {
    display: grid;
    gap: 0.65rem;
}
.admin-loyalty-history-row {
    display: grid;
    grid-template-columns: minmax(180px, 0.8fr) minmax(170px, 0.7fr) minmax(210px, 0.9fr) minmax(190px, 0.8fr);
    gap: 0.8rem;
    align-items: center;
    padding: 0.85rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(8, 26, 32, 0.6);
}
.admin-loyalty-history-row > div {
    display: grid;
    gap: 0.2rem;
}
.admin-loyalty-history-row small {
    color: var(--text-muted);
}
@media (max-width: 1000px) {
    .admin-loyalty-form,
    .admin-loyalty-row {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 900px) {
    .admin-loyalty-history-row,
    .admin-loyalty-history-filters {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 760px) {
    .admin-purchase-filters {
        grid-template-columns: 1fr;
    }
}

.admin-player-page {
    width: 100%;
}

.admin-player-page > .card-heading {
    margin-bottom: 0.9rem;
}

.admin-page-kicker,
.pw-eyebrow {
    display: block;
    color: #8babb4;
    font-size: 0.69rem;
    letter-spacing: 0.13em;
    margin-bottom: 0.25rem;
}

.palworld-player-picker {
    max-width: 760px;
}

.palworld-inventory-shell {
    --pw-cyan: #91eff8;
    --pw-line: rgba(187, 220, 224, 0.34);
    --pw-panel: rgba(10, 27, 31, 0.96);
    --pw-panel-2: rgba(18, 39, 43, 0.92);
    gap: 0;
    color: #d7e6e8;
    border: 1px solid var(--pw-line);
    background:
        linear-gradient(120deg, rgba(18, 43, 47, 0.96), rgba(8, 21, 26, 0.98)),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.03) 0 2px, transparent 2px 8px);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.36);
}

.pw-inventory-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.15rem;
    border-bottom: 1px solid var(--pw-line);
    background: repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.035) 0 3px, transparent 3px 8px);
}

.pw-inventory-toolbar h3 {
    font-size: 1.35rem;
    color: #f1fbfc;
}

.pw-clear-inventory {
    margin-left: auto;
    white-space: nowrap;
}

.pw-player-facts {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    color: #8fa5aa;
    font-size: 0.76rem;
}

.pw-player-facts strong {
    color: #e9f7f8;
}

.pw-inventory-layout {
    display: grid;
    grid-template-columns: minmax(420px, 0.9fr) minmax(620px, 1.35fr);
    min-height: 670px;
}

.pw-bag-panel,
.pw-loadout-panel {
    min-width: 0;
    padding: 1rem;
}

.pw-bag-panel {
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--pw-line);
    background: linear-gradient(180deg, rgba(6, 23, 27, 0.98), rgba(8, 28, 28, 0.96));
}

.pw-section-tabs {
    display: flex;
    border: 1px solid var(--pw-line);
    margin-bottom: 1rem;
    overflow-x: auto;
}

.pw-section-tab,
.pw-pal-tab {
    flex: 1;
    min-width: max-content;
    padding: 0.65rem 0.9rem;
    border: 0;
    border-right: 1px solid var(--pw-line);
    background: repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.035) 0 3px, transparent 3px 8px);
    color: #aab8bb;
    font-size: 0.86rem;
    cursor: pointer;
}

.pw-section-tab.active,
.pw-pal-tab.active {
    color: #13252a;
    background: #b9cdd1;
}

.pw-container-panel,
.pw-pal-panel {
    display: none;
}
.pw-container-panel.active,
.pw-pal-panel.active {
    display: block;
}

.pw-pal-filters {
    display: grid;
    grid-template-columns: minmax(240px, 1.8fr) repeat(4, minmax(115px, 0.65fr)) auto auto;
    gap: 0.65rem;
    align-items: end;
    margin: -0.35rem 0 1rem;
    padding: 0.8rem;
    border: 1px solid var(--pw-line);
    background: rgba(4, 18, 22, 0.62);
}

.pw-pal-filters.is-hidden {
    display: none;
}
.pw-pal-filters label {
    display: grid;
    gap: 0.28rem;
    min-width: 0;
}
.pw-pal-filters label > span {
    color: #91abb0;
    font-size: 0.68rem;
    letter-spacing: 0.04em;
}
.pw-pal-filters input,
.pw-pal-filters select {
    width: 100%;
    min-height: 38px;
    border: 1px solid rgba(187, 220, 224, 0.3);
    border-radius: 6px;
    padding: 0.48rem 0.58rem;
    color: #e8f5f6;
    background: rgba(8, 25, 29, 0.95);
}
.pw-pal-filters input:focus,
.pw-pal-filters select:focus {
    outline: 1px solid var(--pw-cyan);
    border-color: var(--pw-cyan);
}
.pw-pal-search {
    position: relative;
}
.pw-pal-search > span {
    position: absolute;
    left: 0.6rem;
    bottom: 0.55rem;
    color: var(--pw-cyan) !important;
    font-size: 1rem !important;
}
.pw-pal-search input {
    padding-left: 1.8rem;
}
.pw-pal-filter-count {
    align-self: center;
    color: var(--pw-cyan);
    white-space: nowrap;
    font-size: 0.82rem;
}
.pw-pal-card[hidden] {
    display: none;
}

@media (max-width: 1180px) {
    .pw-pal-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .pw-pal-search {
        grid-column: 1 / -1;
    }
}

@media (max-width: 620px) {
    .pw-pal-filters {
        grid-template-columns: 1fr;
    }
    .pw-pal-search {
        grid-column: auto;
    }
}

.pw-container-panel {
    flex: 1;
}

.pw-container-summary {
    display: flex;
    justify-content: space-between;
    padding: 0 0.15rem 0.7rem;
    color: #91abb0;
    font-size: 0.76rem;
}

.pw-slot-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(64px, 1fr));
    gap: 0.48rem;
    align-content: start;
}

.pw-slot {
    position: relative;
    min-width: 0;
    aspect-ratio: 1 / 1;
    border: 1px solid rgba(194, 218, 221, 0.2);
    background:
        linear-gradient(135deg, rgba(31, 51, 51, 0.7), rgba(6, 19, 23, 0.9)),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.025) 0 2px, transparent 2px 6px);
    overflow: hidden;
}

.pw-slot.filled::after {
    content: '';
    position: absolute;
    inset: auto 0 0;
    height: 4px;
    background: #33d4ef;
    box-shadow: 0 0 12px rgba(51, 212, 239, 0.55);
}

.pw-slot.filled.rarity-uncommon::after {
    background: #65d46e;
    box-shadow: 0 0 12px rgba(101, 212, 110, 0.6);
}
.pw-slot.filled.rarity-rare::after {
    background: #39aef4;
    box-shadow: 0 0 12px rgba(57, 174, 244, 0.6);
}
.pw-slot.filled.rarity-epic::after {
    background: #bd52ed;
    box-shadow: 0 0 12px rgba(189, 82, 237, 0.65);
}
.pw-slot.filled.rarity-legendary::after {
    background: #ffd341;
    box-shadow: 0 0 14px rgba(255, 211, 65, 0.7);
}
.pw-slot.removable {
    cursor: pointer;
}
.pw-slot.removable:hover {
    border-color: #ff7885;
    box-shadow: inset 0 0 0 1px rgba(255, 120, 133, 0.45);
}
.pw-slot.catalog-only {
    opacity: 0.78;
}
.pw-slot.catalog-only .pw-slot-quantity {
    color: #7f9ca1;
}
.pw-slot.filled:hover {
    overflow: visible;
    z-index: 20;
}

.pw-item-tooltip {
    position: absolute;
    z-index: 30;
    left: calc(100% + 0.55rem);
    top: 0;
    display: none;
    width: min(340px, 72vw);
    padding: 0.8rem;
    border: 1px solid rgba(145, 239, 248, 0.45);
    border-radius: 6px;
    color: #dcebed;
    background: linear-gradient(135deg, rgba(27, 46, 54, 0.99), rgba(7, 18, 25, 0.99));
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.62);
    pointer-events: none;
}
.pw-slot.filled:hover .pw-item-tooltip {
    display: block;
}
.pw-slot-grid > .pw-slot:nth-child(6n + 4) .pw-item-tooltip,
.pw-slot-grid > .pw-slot:nth-child(6n + 5) .pw-item-tooltip,
.pw-slot-grid > .pw-slot:nth-child(6n) .pw-item-tooltip {
    left: auto;
    right: calc(100% + 0.55rem);
}
.pw-item-tooltip header {
    display: flex;
    justify-content: space-between;
    gap: 0.7rem;
    padding-bottom: 0.55rem;
    border-bottom: 2px solid currentColor;
}
.pw-item-tooltip header strong {
    color: #f4fbfc;
    font-size: 1rem;
}
.pw-item-tooltip header span {
    white-space: nowrap;
}
.pw-item-tooltip header .rarity-epic {
    color: #d75cff;
}
.pw-item-tooltip header .rarity-legendary {
    color: #ffd341;
}
.pw-item-tooltip header .rarity-rare {
    color: #50bfff;
}
.pw-item-tooltip header .rarity-uncommon {
    color: #73dc79;
}
.pw-item-tooltip > div {
    display: grid;
    grid-template-columns: 90px 1fr;
    gap: 0.75rem;
    align-items: center;
    padding: 0.7rem 0;
}
.pw-item-tooltip img {
    width: 90px;
    height: 90px;
    margin: 0;
    object-fit: contain;
}
.pw-item-tooltip dl {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.35rem 0.7rem;
    margin: 0;
}
.pw-item-tooltip dt {
    color: #8fa9ae;
}
.pw-item-tooltip dd {
    margin: 0;
    color: #eefafa;
    text-align: right;
}
.pw-item-tooltip p {
    margin: 0;
    color: #c1d4d7;
    line-height: 1.4;
}
.pw-item-tooltip small {
    display: block;
    margin-top: 0.6rem;
    color: #718e94;
    overflow-wrap: anywhere;
}

.pw-slot.empty {
    opacity: 0.56;
}

.pw-slot-diagonal::after {
    content: '';
    position: absolute;
    width: 140%;
    height: 1px;
    left: -20%;
    top: 50%;
    background: rgba(192, 218, 221, 0.22);
    transform: rotate(-45deg);
}

.pw-slot img {
    display: block;
    width: 72%;
    height: 72%;
    margin: 11% auto 0;
    object-fit: contain;
    filter: drop-shadow(0 4px 7px rgba(0, 0, 0, 0.65));
}

.pw-slot-fallback {
    display: grid;
    place-items: center;
    height: 70%;
    font-size: 1.8rem;
    color: #73949b;
}

.pw-slot-weight,
.pw-slot-number {
    position: absolute;
    z-index: 2;
    padding: 0.05rem 0.2rem;
    color: #e8f5f6;
    background: rgba(8, 17, 19, 0.78);
    font-size: 0.59rem;
}

.pw-slot-weight {
    top: 0;
    left: 0;
}
.pw-slot-number {
    top: 0;
    right: 0;
    color: #91abb0;
}

.pw-slot-quantity {
    position: absolute;
    right: 0.25rem;
    bottom: 0.18rem;
    z-index: 2;
    color: white;
    font-size: 0.92rem;
    text-shadow: 0 2px 3px #000;
}

.pw-slot-name {
    position: absolute;
    left: 0.2rem;
    right: 1.6rem;
    bottom: 0.22rem;
    z-index: 2;
    overflow: hidden;
    color: #a9c1c5;
    font-size: 0.55rem;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.pw-weight-bar {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.75rem;
    margin-top: auto;
    padding: 0.7rem 0.8rem;
    border: 1px solid var(--pw-line);
    color: #d8ebed;
}

.pw-weight-bar > div {
    height: 10px;
    border: 1px solid #b9d5d9;
    background: rgba(0, 0, 0, 0.35);
}

.pw-weight-bar i {
    display: block;
    height: 100%;
    background: #d5eef1;
}

.pw-loadout-panel {
    background:
        linear-gradient(120deg, transparent 0 32%, rgba(40, 71, 72, 0.18) 32% 60%, transparent 60%),
        linear-gradient(180deg, #152a30, #102525);
}

.pw-loadout-title {
    display: grid;
    grid-template-columns: 140px 1fr;
    border: 1px solid var(--pw-line);
    margin-bottom: 1rem;
}

.pw-loadout-title span,
.pw-loadout-title strong {
    padding: 0.55rem 0.75rem;
}

.pw-loadout-title span {
    border-right: 1px solid var(--pw-line);
    color: #a9bdc0;
}

.pw-loadout-body {
    display: grid;
    grid-template-columns: minmax(145px, 0.72fr) minmax(210px, 1.1fr) minmax(180px, 0.9fr);
    gap: 1rem;
    min-height: 570px;
}

.pw-equipment-column {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}

.pw-equipment-group h5 {
    border-left: 4px solid var(--pw-cyan);
    margin-bottom: 0.6rem;
    padding-left: 0.55rem;
    color: #a7f1f7;
    font: 500 0.86rem var(--font-body);
}

.pw-equipment-slots {
    display: grid;
    grid-template-columns: repeat(2, minmax(64px, 94px));
    gap: 0.55rem;
}

.pw-character-figure {
    position: relative;
    min-height: 520px;
    align-self: end;
    filter: drop-shadow(0 18px 18px rgba(0, 0, 0, 0.45));
}

.pw-character-figure span {
    position: absolute;
    display: block;
    background: linear-gradient(135deg, #526a72, #172a31 52%, #879ba0);
    border: 1px solid rgba(154, 239, 246, 0.35);
    box-shadow: inset 0 0 25px rgba(34, 235, 246, 0.1);
}

.pw-figure-head {
    width: 72px;
    height: 82px;
    border-radius: 48% 48% 42% 42%;
    left: calc(50% - 36px);
    top: 30px;
}
.pw-figure-body {
    width: 132px;
    height: 225px;
    border-radius: 40% 40% 22% 22%;
    left: calc(50% - 66px);
    top: 105px;
    clip-path: polygon(18% 0, 82% 0, 100% 42%, 78% 100%, 22% 100%, 0 42%);
}
.pw-figure-arm {
    width: 42px;
    height: 220px;
    top: 118px;
    border-radius: 40px;
    transform-origin: top;
}
.pw-figure-arm.left {
    left: calc(50% - 98px);
    transform: rotate(9deg);
}
.pw-figure-arm.right {
    right: calc(50% - 98px);
    transform: rotate(-9deg);
}
.pw-figure-leg {
    width: 54px;
    height: 215px;
    top: 307px;
    border-radius: 0 0 32px 32px;
}
.pw-figure-leg.left {
    left: calc(50% - 58px);
    transform: rotate(2deg);
}
.pw-figure-leg.right {
    right: calc(50% - 58px);
    transform: rotate(-2deg);
}

.pw-character-figure > strong {
    position: absolute;
    z-index: 3;
    left: 50%;
    bottom: 28px;
    transform: translateX(-50%);
    color: #d9fbff;
    font-size: 0.8rem;
    letter-spacing: 0.08em;
    text-shadow: 0 2px 4px #000;
}

.pw-pal-storage {
    padding: 1rem;
    border-top: 1px solid var(--pw-line);
    background: #0b2023;
}

.pw-pal-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
    gap: 0.65rem;
    min-width: 0;
}
.pw-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    min-height: 42px;
    margin-top: 0.8rem;
}
.pw-pagination:empty {
    display: none;
}
.pw-pagination button {
    padding: 0.45rem 0.75rem;
    border: 1px solid var(--pw-line);
    border-radius: 6px;
    color: #dff8fa;
    background: rgba(8, 28, 31, 0.92);
    cursor: pointer;
}
.pw-pagination button:disabled {
    opacity: 0.4;
    cursor: default;
}
.pw-pagination span {
    color: #91abb0;
    font-size: 0.76rem;
}

.pw-pal-card {
    position: relative;
    display: grid;
    grid-template-columns: 68px 1fr;
    gap: 0.7rem;
    align-items: center;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    padding: 0.55rem;
    border: 1px solid rgba(173, 218, 223, 0.2);
    background: linear-gradient(135deg, rgba(33, 64, 66, 0.7), rgba(8, 25, 28, 0.92));
}
.pw-pal-card:hover,
.pw-pal-card:focus-visible {
    z-index: 20;
    overflow: visible;
    border-color: rgba(145, 239, 248, 0.55);
    outline: none;
}

.pw-pal-tooltip {
    position: absolute;
    z-index: 30;
    left: calc(100% + 0.55rem);
    top: 0;
    display: none;
    width: min(380px, 78vw);
    padding: 0.8rem;
    border: 1px solid rgba(145, 239, 248, 0.45);
    border-radius: 6px;
    color: #dcebed;
    background: linear-gradient(135deg, rgba(27, 46, 54, 0.99), rgba(7, 18, 25, 0.99));
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.62);
    pointer-events: none;
}
.pw-pal-card:hover .pw-pal-tooltip,
.pw-pal-card:focus-visible .pw-pal-tooltip {
    display: block;
}
.pw-pal-grid > .pw-pal-card:nth-child(3n) .pw-pal-tooltip {
    left: auto;
    right: calc(100% + 0.55rem);
}
.pw-pal-tooltip header {
    display: flex;
    justify-content: space-between;
    gap: 0.7rem;
    padding-bottom: 0.55rem;
    border-bottom: 2px solid var(--pw-cyan);
}
.pw-pal-tooltip header strong {
    color: #f4fbfc;
    font-size: 1rem;
}
.pw-pal-tooltip header span {
    color: #a8edf3;
    white-space: nowrap;
}
.pw-pal-tooltip-summary {
    display: grid;
    grid-template-columns: 82px 1fr;
    gap: 0.75rem;
    align-items: center;
    padding: 0.7rem 0;
}
.pw-pal-tooltip-portrait {
    display: grid;
    width: 82px;
    height: 82px;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(128, 230, 239, 0.3);
    border-radius: 50%;
    background: rgba(2, 11, 13, 0.5);
}
.pw-pal-tooltip-portrait img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.pw-pal-tooltip dl {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.3rem 0.65rem;
    margin: 0;
    font-size: 0.72rem;
}
.pw-pal-tooltip dt {
    color: #8fa9ae;
}
.pw-pal-tooltip dd {
    margin: 0;
    color: #eefafa;
    text-align: right;
}
.pw-pal-tooltip-ivs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    padding-bottom: 0.65rem;
}
.pw-pal-tooltip-ivs b {
    padding: 0.18rem 0.35rem;
    border: 1px solid rgba(145, 239, 248, 0.25);
    color: #a8edf3;
    font-size: 0.65rem;
}
.pw-pal-tooltip section {
    padding: 0.5rem 0;
    border-top: 1px solid rgba(173, 218, 223, 0.15);
}
.pw-pal-tooltip section > strong {
    color: #a8edf3;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.pw-pal-tooltip section p {
    margin: 0.2rem 0 0;
    color: #d7e7e9;
    font-size: 0.72rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}
.pw-pal-tooltip > small {
    display: block;
    margin-top: 0.35rem;
    color: #718e94;
    overflow-wrap: anywhere;
}
.pw-pal-tooltip.viewport-positioned,
.pw-item-tooltip.viewport-positioned {
    position: fixed;
    left: var(--viewport-tooltip-left, 12px) !important;
    top: var(--viewport-tooltip-top, 12px) !important;
    right: auto !important;
    transform: none !important;
    max-width: calc(100vw - 24px);
    max-height: calc(100vh - 24px);
    overflow: auto;
    overscroll-behavior: contain;
}

.pw-pal-portrait {
    position: relative;
    width: 64px;
    height: 64px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(2, 11, 13, 0.5);
    border: 1px solid rgba(128, 230, 239, 0.3);
    overflow: visible;
}

.pw-pal-portrait img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 50%;
}
.pw-pal-boss-icon {
    position: absolute;
    z-index: 2;
    top: -8px;
    left: -8px;
    width: 28px;
    height: 24px;
    filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.7));
    pointer-events: none;
}
.pw-pal-boss-icon svg {
    display: block;
    width: 100%;
    height: 100%;
    fill: #ef2b32;
}
.pw-pal-info {
    min-width: 0;
}
.pw-pal-info strong,
.pw-pal-info span {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.pw-pal-info strong {
    color: #edfafa;
    font-size: 0.82rem;
}
.pw-pal-info span {
    color: #8fa9ae;
    font-size: 0.7rem;
    margin-top: 0.2rem;
}
.pw-pal-info small {
    display: block;
    margin-top: 0.25rem;
    color: #78969b;
    font-size: 0.62rem;
    white-space: normal;
    overflow-wrap: anywhere;
}
.pw-pal-info .pw-pal-stars,
.pw-pal-tooltip .pw-pal-stars {
    display: inline;
    margin: 0;
    overflow: visible;
    color: #ffd45f;
    font-size: inherit;
    letter-spacing: 0.08em;
    text-shadow: 0 0 8px rgba(255, 196, 53, 0.35);
    white-space: nowrap;
}
.pw-pal-ivs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-top: 0.4rem;
}
.pw-pal-ivs b {
    padding: 0.15rem 0.3rem;
    border: 1px solid rgba(145, 239, 248, 0.22);
    color: #a8edf3;
    font-size: 0.6rem;
    font-weight: 600;
}
.pw-pal-card {
    align-items: start;
}
.pw-pal-index {
    position: absolute;
    top: 0.2rem;
    right: 0.35rem;
    color: #6e9298;
    font-size: 0.62rem;
}

@media (max-width: 900px) {
    .pw-pal-tooltip {
        position: fixed;
        left: 50% !important;
        right: auto !important;
        top: 50%;
        transform: translate(-50%, -50%);
        max-height: 88vh;
        overflow: auto;
    }
}

.pw-empty-message {
    padding: 1.25rem;
    color: #7f9ca1;
    border: 1px dashed rgba(173, 218, 223, 0.2);
}

.pw-paldb-credit {
    margin-top: 1rem;
    color: #63848a;
    text-align: right;
    font-size: 0.68rem;
}

.storage-scope-tabs {
    margin-top: 1rem;
}
.storage-audit-shell {
    margin-top: 1rem;
}
.storage-container-list {
    display: grid;
    gap: 0.8rem;
    padding: 1rem;
}
.storage-container-card {
    padding: 0.8rem;
    border: 1px solid var(--pw-line);
    background: rgba(8, 28, 31, 0.92);
}
.storage-container-card > small {
    display: block;
    margin-bottom: 0.35rem;
    color: #78969b;
}
.storage-filter-bar {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(170px, auto) auto;
    gap: 0.65rem;
    align-items: center;
    padding: 1rem 1rem 0;
}
.storage-guild-controls {
    display: grid;
    grid-template-columns: minmax(280px, 1.25fr) minmax(220px, 0.75fr) minmax(280px, 1fr);
    gap: 0.8rem;
    padding: 1rem;
    border-bottom: 1px solid var(--pw-line);
}
.storage-guild-controls label {
    display: grid;
    gap: 0.35rem;
    color: #91abb0;
    font-size: 0.75rem;
}
.storage-guild-controls input,
.storage-guild-controls select {
    width: 100%;
    min-height: 42px;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--pw-line);
    border-radius: 6px;
    color: #e9f7f8;
    background: rgba(5, 20, 24, 0.95);
}
.storage-guild-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 1rem;
    padding: 1rem;
    border: 1px solid var(--pw-line);
    background: rgba(8, 28, 31, 0.92);
}
.storage-member-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 0.45rem;
    padding: 0 1rem 1rem;
}
.storage-member {
    display: grid;
    grid-template-columns: 10px 1fr auto;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 0.65rem;
    border: 1px solid rgba(173, 218, 223, 0.18);
    background: rgba(5, 20, 24, 0.74);
}
.storage-member i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #77888c;
}
.storage-member.online i {
    background: #2edc8c;
    box-shadow: 0 0 8px rgba(46, 220, 140, 0.65);
}
.storage-member b {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #e8f5f6;
}
.storage-member small {
    color: #78969b;
}
.storage-camp-card {
    margin: 0 1rem 1rem;
    border: 1px solid var(--pw-line);
    background: rgba(5, 20, 24, 0.58);
}
.storage-camp-card > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.8rem 1rem;
    border-bottom: 1px solid var(--pw-line);
}
.storage-camp-card .storage-container-list {
    grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
}
.storage-camp-card.storage-global {
    grid-column: 1 / -1;
}
.storage-camp-card.storage-global .storage-container-card:only-child {
    grid-column: 1 / -1;
}
.storage-item span {
    min-width: 0;
}
.storage-item span small {
    display: block;
    overflow: hidden;
    color: #66868d;
    font-size: 0.62rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.storage-result-count {
    padding: 0 1rem 1rem;
    color: #78969b;
    text-align: right;
}
@media (max-width: 700px) {
    .storage-guild-controls {
        grid-template-columns: 1fr;
    }
    .storage-camp-card > header {
        align-items: flex-start;
        flex-direction: column;
    }
}
.storage-filter-bar input,
.storage-filter-bar select {
    width: 100%;
}
.storage-filter-bar span {
    color: var(--text-muted);
    font-size: 0.78rem;
    white-space: nowrap;
}
.storage-members {
    margin: 0.45rem 0;
    color: #9fc5ca;
}
.storage-members summary {
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 700;
}
.storage-members div {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.45rem;
}
.storage-members span {
    padding: 0.2rem 0.45rem;
    border: 1px solid var(--pw-line);
    border-radius: 999px;
    font-size: 0.72rem;
}
.storage-items {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 0.4rem;
    margin-top: 0.7rem;
}
.storage-item {
    display: grid;
    grid-template-columns: 34px 1fr auto;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem;
    border: 1px solid rgba(173, 218, 223, 0.18);
    border-bottom: 3px solid #8da4a8;
}
.storage-item.rarity-uncommon {
    border-bottom-color: #65d46e;
}
.storage-item.rarity-rare {
    border-bottom-color: #39aef4;
}
.storage-item.rarity-epic {
    border-bottom-color: #bd52ed;
}
.storage-item.rarity-legendary {
    border-bottom-color: #ffd341;
}
.storage-item img {
    width: 34px;
    height: 34px;
    object-fit: contain;
}

@media (max-width: 1180px) {
    .pw-inventory-layout {
        grid-template-columns: 1fr;
    }
    .pw-bag-panel {
        border-right: 0;
        border-bottom: 1px solid var(--pw-line);
        min-height: 620px;
    }
}

@media (max-width: 760px) {
    .pw-inventory-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }
    .pw-loadout-body {
        grid-template-columns: 1fr 1fr;
    }
    .pw-character-figure {
        display: none;
    }
    .pw-slot-grid {
        grid-template-columns: repeat(4, minmax(54px, 1fr));
    }
    .pw-item-tooltip {
        position: fixed;
        left: 50% !important;
        right: auto !important;
        top: 50%;
        transform: translate(-50%, -50%);
    }
    .pw-equipment-slots {
        grid-template-columns: repeat(3, minmax(54px, 1fr));
    }
}

/* Modal Backdrop & Container */
.modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(8px);
    z-index: 300;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.modal-backdrop.active {
    opacity: 1;
    pointer-events: auto;
}

.modal-container {
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    width: 580px;
    max-width: 100%;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.8);
    overflow: hidden;
    transform: scale(0.95);
    transition: transform 0.3s ease;
}

.modal-backdrop.active .modal-container {
    transform: scale(1);
}

.modal-header {
    padding: 1.2rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-title-group {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.modal-icon {
    font-size: 1.6rem;
}

.modal-subtitle {
    font-size: 0.78rem;
    color: var(--text-muted);
}

.modal-close {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 1.8rem;
    cursor: pointer;
}

.modal-body {
    padding: 1.5rem;
}

.delivery-target-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 1rem;
    margin-bottom: 1.2rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.target-row {
    display: flex;
    justify-content: space-between;
    font-size: 0.88rem;
}

.status-badge.live {
    color: var(--accent-green);
    font-weight: 700;
}

/* Console Logs Box */
.api-console-box {
    background: #080b10;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-sm);
    font-family: monospace;
    overflow: hidden;
}

.console-header {
    background: #111622;
    padding: 0.5rem 0.8rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}
.dot.red {
    background: #ff5f56;
}
.dot.yellow {
    background: #ffbd2e;
}
.dot.green {
    background: #27c93f;
}

.console-title {
    font-size: 0.7rem;
    color: var(--text-muted);
    margin-left: 0.5rem;
}

.console-body {
    padding: 0.8rem;
    max-height: 180px;
    overflow-y: auto;
    font-size: 0.8rem;
    line-height: 1.6;
}

.log-entry {
    margin-bottom: 0.3rem;
}
.log-entry.system {
    color: var(--accent-cyan);
}
.log-entry.success {
    color: #2ec4b6;
}
.log-entry.warn {
    color: var(--accent-gold);
}

/* Receipt Box */
.receipt-box {
    background: rgba(46, 196, 182, 0.1);
    border: 1px solid var(--accent-green);
    border-radius: var(--radius-md);
    padding: 1.2rem;
    text-align: center;
    margin-top: 1.2rem;
}

.receipt-icon {
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
}
.receipt-box h4 {
    font-family: var(--font-heading);
    color: var(--accent-green);
    font-size: 1.1rem;
}
.receipt-box p {
    font-size: 0.85rem;
    color: var(--text-secondary);
    margin-top: 0.3rem;
}
.receipt-id {
    font-size: 0.75rem;
    color: var(--text-muted);
    margin-top: 0.6rem;
    font-weight: bold;
}

.modal-footer {
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    display: flex;
    justify-content: flex-end;
    gap: 0.8rem;
}

.btn-secondary {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.6rem 1.2rem;
    border-radius: var(--radius-sm);
    cursor: pointer;
}

.btn-primary {
    background: var(--accent-discord);
    color: white;
    border: none;
    padding: 0.6rem 1.4rem;
    border-radius: var(--radius-sm);
    font-weight: 700;
    cursor: pointer;
}

/* Toast Notifications */
.toast-container {
    position: fixed;
    top: 1.25rem;
    right: 2rem;
    z-index: 5000;
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.toast {
    background: var(--bg-card);
    border: 1px solid var(--accent-cyan);
    color: var(--text-primary);
    padding: 0.8rem 1.2rem;
    border-radius: var(--radius-md);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    gap: 0.8rem;
    font-size: 0.9rem;
    animation: toastIn 0.3s ease;
    max-width: min(440px, calc(100vw - 2rem));
    transition:
        opacity 0.3s ease,
        transform 0.3s ease;
}
.toast-success {
    border-color: #2dcc8f;
    background: color-mix(in srgb, var(--bg-card) 92%, #2dcc8f);
}
.toast-error {
    border-color: #ff5d70;
    background: color-mix(in srgb, var(--bg-card) 92%, #ff5d70);
}
.toast-warning {
    border-color: #ffbd4a;
    background: color-mix(in srgb, var(--bg-card) 92%, #ffbd4a);
}
.toast-info {
    border-color: var(--accent-cyan);
}
.toast-icon {
    display: grid;
    place-items: center;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    color: #061218;
    background: var(--accent-cyan);
    font-weight: 900;
}
.toast-success .toast-icon {
    background: #2dcc8f;
}
.toast-error .toast-icon {
    color: white;
    background: #ff5d70;
}
.toast-warning .toast-icon {
    background: #ffbd4a;
}

@keyframes toastIn {
    from {
        transform: translateY(-20px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@media (max-width: 600px) {
    .toast-container {
        top: 0.75rem;
        right: 0.75rem;
        left: 0.75rem;
    }
    .toast {
        width: 100%;
    }
}

/* Responsive Breakpoints */
@media (max-width: 1180px) {
    .header-container {
        flex-wrap: wrap;
        gap: 1rem 1.5rem;
    }
    .nav-toggle {
        display: grid;
    }
    .nav-toggle {
        order: 100;
        margin-left: 0.15rem;
    }
    .section-nav {
        display: none;
        order: 3;
        flex-basis: 100%;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.45rem;
        padding: 0.65rem;
        border: 1px solid var(--border-color);
        border-radius: 12px;
        background: #0c141f;
    }
    .section-nav.open {
        display: grid;
    }
    .section-nav-btn {
        width: 100%;
        padding: 0.8rem 1rem;
        text-align: left;
        border-radius: 8px;
    }
    .section-nav-btn.active {
        box-shadow: none;
    }
    .section-nav-dropdown {
        width: 100%;
    }
    .section-nav-dropdown > summary {
        justify-content: space-between;
        padding: 0.8rem 1rem;
        border-radius: 8px;
    }
    .section-nav-menu {
        position: static;
        width: 100%;
        min-width: 0;
        margin-top: 0.25rem;
        padding: 0.35rem 0 0.2rem 0.65rem;
        border: 0;
        border-left: 2px solid rgba(88, 101, 242, 0.45);
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        transform: none;
    }
}

/* Thème clair */
html[data-theme='light'] {
    --bg-primary: #eef3f8;
    --bg-secondary: #e4ebf3;
    --bg-card: rgba(255, 255, 255, 0.92);
    --bg-card-hover: #fff;
    --text-primary: #172033;
    --text-secondary: #52647a;
    --text-muted: #718096;
    --border-color: rgba(43, 65, 91, 0.16);
    --border-glow: rgba(44, 119, 190, 0.28);
    --accent-cyan: #087da8;
    --shadow-card: 0 10px 28px rgba(55, 78, 105, 0.13);
    --shadow-glow: 0 0 22px rgba(36, 113, 160, 0.12);
}
html[data-theme='light'] body {
    background: var(--bg-primary);
    color: var(--text-primary);
}
html[data-theme='light'] .app-header,
html[data-theme='light'] .site-footer {
    background: #fff;
}
html[data-theme='light'] .section-nav,
html[data-theme='light'] .admin-workspace-nav {
    background: #f7f9fc;
}
html[data-theme='light'] .section-nav-menu {
    background: #fff;
}
html[data-theme='light']
    :is(
        .panel-card,
        .stat-card,
        .player-select-container,
        .item-card,
        .admin-catalog-row,
        .admin-account-row,
        .admin-whitelist-row,
        .admin-role-policy,
        .maintenance-history-entry,
        .lottery-history-row,
        .admin-loyalty-row,
        .admin-reward-template,
        .cart-drawer,
        .modal-content,
        .technology-action-popup,
        .inventory-panel,
        .pw-panel
    ) {
    background-color: #fff;
    color: var(--text-primary);
    box-shadow: var(--shadow-card);
}
.tournament-page,
.tournament-admin-card {
    display: grid;
    gap: 1rem;
}
.tournament-hero {
    margin-bottom: 1rem;
}
.tournament-layout {
    display: grid;
    grid-template-columns: minmax(240px, 0.55fr) minmax(0, 1.45fr);
    gap: 1rem;
}
.tournament-ranking {
    display: grid;
    gap: 0.45rem;
}
.tournament-ranking > div {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: 0.55rem;
    align-items: center;
    padding: 0.65rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
}
.tournament-ranking small {
    grid-column: 2/-1;
    color: var(--text-muted);
}
.tournament-bracket {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    padding: 0.5rem 0 1rem;
}
.tournament-round {
    display: flex;
    flex: 0 0 235px;
    flex-direction: column;
    justify-content: space-around;
    gap: 0.8rem;
}
.tournament-round h5 {
    color: #ffe083;
    text-align: center;
}
.tournament-match {
    padding: 0.55rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(3, 15, 20, 0.65);
}
.tournament-match > div {
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.4rem;
}
.tournament-match .winner {
    color: #70efb1;
    font-weight: 800;
}
.tournament-match footer {
    display: grid;
    grid-template-columns: 50px auto 50px 1fr;
    gap: 0.35rem;
    align-items: center;
    padding-top: 0.4rem;
    border-top: 1px solid var(--border-color);
}
.tournament-match footer input {
    min-width: 0;
}
.tournament-form {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}
.tournament-form label {
    display: grid;
    gap: 0.3rem;
}
.tournament-form .wide {
    grid-column: 1/-1;
}
.tournament-player-results {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 0.4rem;
    max-height: 220px;
    overflow: auto;
    margin-top: 0.5rem;
}
.tournament-player-results button {
    display: grid;
    grid-template-columns: 1fr auto;
    text-align: left;
    padding: 0.55rem;
    border: 1px solid var(--border-color);
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.04);
    color: var(--text-primary);
}
.tournament-player-results small {
    grid-column: 1;
}
.tournament-selected {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.6rem;
}
.tournament-selected span {
    padding: 0.35rem 0.5rem;
    border-radius: 99px;
    background: rgba(0, 242, 254, 0.12);
}
.tournament-selected button {
    margin-left: 0.4rem;
    border: 0;
    background: none;
    color: #ff8d98;
    cursor: pointer;
}
.tournament-prize-row {
    display: grid;
    grid-template-columns: 1fr 130px 1.4fr auto;
    gap: 0.6rem;
    align-items: end;
    padding: 0.7rem;
    margin: 0.5rem 0;
    border: 1px solid var(--border-color);
    border-radius: 9px;
}
.tournament-place-options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}
.tournament-place-options label {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.2rem;
    padding: 0.3rem;
    border: 1px solid var(--border-color);
    border-radius: 5px;
}
@media (max-width: 900px) {
    .tournament-layout,
    .tournament-form,
    .tournament-prize-row {
        grid-template-columns: 1fr;
    }
    .tournament-form .wide {
        grid-column: auto;
    }
}
html[data-theme='light']
    :is(
        input,
        select,
        textarea,
        .search-box,
        .custom-select,
        .promo-input,
        .player-input-group,
        .admin-item-selection,
        .admin-catalog-search,
        .admin-promotion-input span
    ) {
    background-color: #f7f9fc;
    color: var(--text-primary);
    border-color: var(--border-color);
}
html[data-theme='light'] :is(.admin-form input, .admin-form select, .player-picker select) {
    background: #f7f9fc;
    color: var(--text-primary);
}
html[data-theme='light']
    :is(
        .item-icon-frame,
        .cart-item-image,
        .admin-catalog-icon,
        .user-profile-badge,
        .cart-btn,
        .nav-toggle,
        .site-footer-socials a
    ) {
    background: #edf2f7;
}
html[data-theme='light'] :is(.section-nav-btn:hover, .admin-workspace-tab:hover, .category-tab:hover) {
    background: rgba(49, 83, 120, 0.08);
}
html[data-theme='light'] .hero-overlay {
    background: linear-gradient(90deg, rgba(238, 243, 248, 0.97), rgba(238, 243, 248, 0.72));
}
html[data-theme='light'] .hero-title {
    color: #142035;
}
html[data-theme='light'] .cart-drawer-footer {
    background: #f7f9fc;
}
html[data-theme='light'] .cart-drawer-overlay {
    background: rgba(25, 39, 58, 0.42);
}
html[data-theme='light'] .site-footer-logo {
    color: #172033;
}
html[data-theme='light'] .map-stage {
    background: #dce7f0;
}
html[data-theme='light'] .empty-line {
    color: var(--text-muted);
}

@media (max-width: 600px) {
    .section-nav {
        grid-template-columns: 1fr;
    }
    .auth-btn {
        padding: 0.6rem 0.75rem;
    }
    .auth-btn.ghost {
        width: 40px;
        height: 40px;
        padding: 0;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }
    .auth-btn.ghost .logout-label {
        display: none;
    }
    .auth-btn.ghost .logout-icon {
        display: block;
        margin: 0;
    }
    .header-actions {
        width: 100%;
        flex-basis: 100%;
        gap: 0.5rem;
        justify-content: flex-end;
    }
    .logo-text .api-badge {
        white-space: normal;
    }
    .logo-text {
        min-width: 0;
    }
    .brand-logo {
        min-width: 0;
    }
    .header-container {
        gap: 0.75rem;
    }
    .logo-icon {
        display: flex;
        width: 34px;
        height: 34px;
        flex: 0 0 34px;
        border-radius: 9px;
    }
    .logo-icon svg {
        width: 18px;
        height: 18px;
    }
    .brand-logo {
        gap: 0.5rem;
    }
    .logo-text .brand-title {
        font-size: 0.95rem;
    }
    .brand-wordmark-image-wrap {
        width: 132px;
        height: 30px;
    }
    .api-badge {
        font-size: 0.6rem;
    }
    .cart-btn,
    .nav-toggle {
        width: 40px;
        height: 40px;
    }
    .cart-btn {
        flex-basis: 40px;
    }
    .section-nav-btn {
        text-align: center;
    }
}

@media (max-width: 390px) {
    .api-badge {
        max-width: 150px;
    }
    .auth-btn:not(.ghost) {
        font-size: 0.72rem;
    }
}

@media (max-width: 768px) {
    .app-header,
    .admin-workspace-nav {
        backdrop-filter: none;
    }
    .bg-glow-orb {
        display: none;
    }
    .header-container {
        flex-direction: row;
        align-items: center;
        padding: 0.85rem 1rem;
    }
    .section-nav {
        justify-content: flex-start;
    }
    .header-actions {
        margin-left: auto;
        flex-wrap: nowrap;
        justify-content: flex-end;
    }
    .user-profile-badge {
        display: none;
    }
    .logo-icon {
        width: 38px;
        height: 38px;
    }
    .logo-text .brand-title {
        font-size: 1.1rem;
    }
    .api-badge {
        font-size: 0.68rem;
    }
    .hero-title {
        font-size: 1.8rem;
    }
    .hero-actions {
        flex-direction: column;
    }
    .home-stats-grid {
        grid-template-columns: 1fr;
    }
    .player-select-container {
        flex-direction: column;
        align-items: stretch;
    }
    .cart-drawer {
        width: 100vw;
    }
    .map-layout,
    .admin-grid,
    #adminPalBossBuilder {
        grid-template-columns: 1fr;
    }
    .admin-give-layout[data-admin-give-panel='pal'].active {
        grid-template-columns: 1fr;
    }
    #adminGivePalResults {
        min-height: 0;
        max-height: 600px;
    }
    .map-stage,
    .map-side-panel {
        grid-column: 1;
        grid-row: auto;
    }
    .map-side-panel {
        order: 2;
    }
    .map-stage {
        min-height: 0;
    }
    .admin-summary-grid,
    .form-grid,
    .profile-grid {
        grid-template-columns: 1fr;
    }
    .restart-status-grid,
    .restart-settings-form,
    .restart-message-grid {
        grid-template-columns: 1fr;
    }
    .restart-settings-form:not([data-schedule-mode='both']) .restart-schedule-field:not([hidden]) {
        grid-column: auto;
    }
    .restart-message-grid label:last-child {
        grid-column: auto;
    }
    .restart-manual {
        align-items: stretch;
        flex-direction: column;
    }
    .restart-manual .restart-action-button.scheduled {
        width: auto;
        margin-left: auto;
        align-self: flex-end;
    }
    .restart-emergency-actions {
        grid-template-columns: 1fr;
    }
    .player-picker,
    .inventory-header,
    .card-heading,
    .profile-top {
        flex-direction: column;
        align-items: stretch;
    }
}

.save-reader-status {
    margin: 0.75rem 0 1rem;
    padding: 0.75rem 0.9rem;
    border: 1px solid rgba(255, 183, 3, 0.32);
    border-radius: 9px;
    background: rgba(255, 183, 3, 0.08);
    color: #ffd36a;
    font-size: 0.78rem;
    overflow-wrap: anywhere;
}

@media (max-width: 600px) {
    .logo-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
    }
    .logo-text .brand-title {
        font-size: 0.95rem;
    }
    .api-badge {
        font-size: 0.6rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Les longues collections hors écran ne sont peintes qu'à l'approche du viewport. */
.admin-account-row,
.admin-loyalty-row,
.admin-ban-row,
.admin-reward-template,
.reward-history-row,
.user-reward-card,
.technology-card,
.inventory-slot,
.lottery-history-row {
    content-visibility: auto;
    contain-intrinsic-size: auto 92px;
}
/* Branded access-denied page */
.access-page {
    min-height: 100vh;
    overflow-x: hidden;
}

.access-page-layout {
    position: relative;
    z-index: 2;
    display: grid;
    min-height: 100vh;
    place-items: center;
    padding: 2rem;
}

.access-card {
    width: min(620px, 100%);
    padding: clamp(2rem, 6vw, 4rem);
    border: 1px solid rgba(44, 224, 255, 0.25);
    border-radius: 24px;
    background: linear-gradient(145deg, rgba(13, 36, 45, 0.96), rgba(5, 18, 25, 0.96));
    box-shadow:
        0 28px 90px rgba(0, 0, 0, 0.45),
        inset 0 1px rgba(255, 255, 255, 0.04);
    text-align: center;
}

.access-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    margin-bottom: 2.5rem;
    color: var(--text-primary);
    font-family: 'Outfit', sans-serif;
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.access-brand strong,
.access-kicker {
    color: var(--accent-cyan);
}

.access-brand-icon,
.access-lock {
    display: grid;
    place-items: center;
    border: 1px solid rgba(44, 224, 255, 0.3);
    background: rgba(44, 224, 255, 0.1);
    color: var(--accent-cyan);
}

.access-brand-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
}

.access-lock {
    width: 78px;
    height: 78px;
    margin: 0 auto 1.4rem;
    border-radius: 50%;
    font-size: 2.4rem;
}

.access-kicker {
    margin: 0 0 0.65rem;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.2em;
}

.access-card h1 {
    margin: 0 0 1rem;
    font-family: 'Outfit', sans-serif;
    font-size: clamp(2rem, 7vw, 3.2rem);
}

.access-message,
.access-help {
    color: var(--text-muted);
    line-height: 1.7;
}

.access-help {
    margin-top: 1.25rem;
    font-size: 0.9rem;
}

.access-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 2rem;
}

.access-actions a {
    text-decoration: none;
}

[hidden] {
    display: none !important;
}

.technology-shell {
    padding: 1rem;
    background: linear-gradient(145deg, rgba(7, 30, 36, 0.98), rgba(5, 18, 24, 0.98));
}

.technology-toolbar {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto minmax(240px, auto);
    gap: 1rem;
    align-items: end;
    padding: 1rem;
    border: 1px solid rgba(104, 226, 240, 0.2);
    background: rgba(9, 40, 44, 0.7);
}

.technology-toolbar h3 {
    margin: 0.25rem 0 0;
}
.technology-search {
    grid-column: 1 / -1;
}
.technology-points {
    display: flex;
    gap: 0.55rem;
}
.technology-points span {
    padding: 0.55rem 0.75rem;
    border: 1px solid rgba(79, 217, 236, 0.3);
    color: #9deff8;
}
.technology-points .ancient {
    border-color: rgba(215, 91, 255, 0.45);
    color: #e79bff;
}
.technology-mode {
    display: grid;
    gap: 0.35rem;
    color: var(--text-muted);
    font-size: 0.8rem;
}
.technology-click-hint {
    max-width: 310px;
    margin: 0;
    color: var(--text-muted);
    font-size: 0.82rem;
    line-height: 1.45;
}
.technology-global-actions {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.technology-levels {
    display: grid;
    gap: 0.7rem;
    margin-top: 1rem;
}
.technology-level {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr);
    border-bottom: 1px solid rgba(134, 220, 230, 0.16);
    background: rgba(14, 35, 40, 0.55);
}
.technology-level-number {
    display: grid;
    place-content: center;
    text-align: center;
    border-right: 2px solid #70e9f5;
    color: #a7f5fb;
}
.technology-level-number span {
    font-size: 0.62rem;
    letter-spacing: 0.12em;
}
.technology-level-number strong {
    font-size: 1.7rem;
}
.technology-row {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(245px, 1fr));
    gap: 0.55rem;
    padding: 0.7rem;
}
.technology-card {
    position: relative;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: center;
    min-height: 82px;
    padding: 0.55rem;
    border: 1px solid rgba(122, 211, 222, 0.2);
    background: linear-gradient(135deg, rgba(19, 49, 54, 0.95), rgba(9, 25, 31, 0.95));
    cursor: pointer;
    transition:
        border-color 0.15s ease,
        transform 0.15s ease,
        background 0.15s ease;
}
.technology-card:hover {
    z-index: 1;
    transform: translateY(-2px);
    border-color: rgba(112, 233, 245, 0.7);
    background: linear-gradient(135deg, rgba(25, 66, 72, 0.98), rgba(10, 31, 38, 0.98));
}
.technology-card.learned {
    border-color: rgba(83, 237, 173, 0.55);
    box-shadow: inset 3px 0 #43e8a2;
}
.technology-card.locked {
    filter: saturate(0.65);
}
.technology-card.ancient {
    box-shadow: inset 3px 0 #c052ee;
}
.technology-icon {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.3);
}
.technology-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.technology-copy {
    display: grid;
    min-width: 0;
    gap: 0.15rem;
}
.technology-copy strong {
    color: #d9fbff;
}
.technology-copy small,
.technology-copy code {
    overflow: hidden;
    color: var(--text-muted);
    text-overflow: ellipsis;
}
.technology-cost {
    position: absolute;
    top: 0.3rem;
    right: 0.35rem;
    color: #f4dc76;
    font-size: 0.72rem;
}
.technology-card button {
    grid-column: 2 / -1;
    justify-self: start;
}

.technology-action-overlay {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgba(1, 9, 13, 0.78);
    backdrop-filter: blur(5px);
}
.technology-action-popup {
    position: relative;
    width: min(560px, 100%);
    padding: 1.35rem;
    border: 1px solid rgba(112, 233, 245, 0.5);
    border-radius: 12px;
    background: linear-gradient(145deg, #102c33, #07171d);
    box-shadow: 0 30px 90px rgba(0, 0, 0, 0.65);
}
.technology-popup-close {
    position: absolute;
    top: 0.65rem;
    right: 0.75rem;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.25);
    color: white;
    cursor: pointer;
    font-size: 1.3rem;
}
.technology-popup-heading {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding-right: 2rem;
}
.technology-popup-heading h3 {
    margin: 0.2rem 0;
    color: #dcfbff;
}
.technology-popup-heading small {
    color: var(--text-muted);
}
.technology-popup-icon {
    display: grid;
    flex: 0 0 78px;
    width: 78px;
    height: 78px;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(112, 233, 245, 0.25);
    background: rgba(0, 0, 0, 0.28);
}
.technology-popup-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.technology-action-popup > p {
    margin: 1.25rem 0 0.65rem;
    color: #c9e8eb;
}
.technology-popup-actions {
    display: grid;
    gap: 0.65rem;
}
.technology-popup-actions button {
    display: grid;
    gap: 0.2rem;
    width: 100%;
    padding: 0.85rem 1rem;
    text-align: left;
}
.technology-popup-actions button span {
    opacity: 0.7;
    font-size: 0.78rem;
    font-weight: 400;
}
.technology-action-popup label {
    display: grid;
    gap: 0.35rem;
    margin-top: 0.8rem;
    color: var(--text-muted);
    font-size: 0.82rem;
}
.technology-balance-preview {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65rem;
    margin: 1rem 0;
}
.technology-balance-preview span {
    display: flex;
    justify-content: space-between;
    padding: 0.75rem;
    border: 1px solid rgba(112, 233, 245, 0.25);
    color: #bfeef2;
}
.technology-point-buttons {
    margin-top: 1rem;
}

.inventory-delete-popup {
    border-color: rgba(255, 105, 120, 0.55);
}
.inventory-delete-popup .technology-popup-icon {
    border-color: rgba(255, 105, 120, 0.32);
}
.inventory-delete-summary,
.inventory-clear-stats {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin: 0.75rem 0 1rem;
    padding: 0.75rem;
    border: 1px solid rgba(255, 105, 120, 0.22);
    background: rgba(255, 80, 100, 0.06);
    color: #c9e8eb;
}
.inventory-delete-all {
    border-color: rgba(255, 105, 120, 0.72);
    background: rgba(132, 24, 40, 0.72);
}
.inventory-danger-icon {
    display: grid;
    width: 54px;
    height: 54px;
    margin-bottom: 0.85rem;
    place-items: center;
    border: 1px solid rgba(255, 105, 120, 0.65);
    border-radius: 50%;
    color: #ff8591;
    background: rgba(255, 70, 90, 0.1);
    font-size: 1.65rem;
    font-weight: 800;
}
.inventory-clear-popup h3 {
    margin-top: 0.25rem;
    color: #ffe8ea;
}
.inventory-clear-stats span {
    display: grid;
    gap: 0.2rem;
    color: var(--text-muted);
    font-size: 0.8rem;
}
.inventory-clear-stats strong {
    color: #fff;
    font-size: 1rem;
}
.inventory-confirm-check {
    grid-template-columns: auto 1fr !important;
    align-items: center;
    margin: 1rem 0 !important;
    cursor: pointer;
}
.inventory-confirm-check input {
    width: 18px;
    height: 18px;
    accent-color: #f04f62;
}

/* Contrastes complémentaires du thème clair */
html[data-theme='light']
    :is(
        .role-identity strong,
        .admin-pal-hero #adminGivePalChoice strong,
        .admin-pal-level input,
        .admin-pal-gender-lock > span,
        .pw-player-facts strong,
        .pw-pal-info strong,
        .pw-panel-title,
        .pw-section-title,
        .pw-slot-name,
        .pw-storage-name,
        .technology-copy strong,
        .technology-popup-heading h3,
        .technology-action-popup > p,
        .inventory-clear-popup h3,
        .inventory-clear-stats strong
    ) {
    color: var(--text-primary);
}

html[data-theme='light']
    :is(
        .admin-pal-boss-stats-note,
        .admin-permissions-warning,
        .save-reader-status,
        .maintenance-history-entry div span,
        .reward-progress-badge,
        .quest-file-button,
        .quest-submission-state.waiting,
        .reward-account-selection,
        .reward-picker-result b,
        .quest-challenge-list b,
        .crown-orb strong,
        .user-crown-balance
    ) {
    color: #765500;
}

html[data-theme='light']
    :is(
        .history-status.failed,
        .admin-whitelist-error,
        .admin-ban-error,
        .pal-boss-row .boss-error,
        .restart-status-grid strong.offline,
        .restart-status-grid em
    ) {
    color: #b42332 !important;
}

html[data-theme='light']
    :is(
        .reward-account-list,
        .quest-challenge-list section,
        .admin-pal-passive-menu,
        .admin-pal-passive-menu input,
        .restart-manual input,
        .maintenance-password-row input,
        .maintenance-palworld-schedule input,
        .admin-pal-capture-select select
    ) {
    background: #f7f9fc;
    color: var(--text-primary);
    border-color: var(--border-color);
}

html[data-theme='light']
    :is(
        .pw-player-card,
        .pw-storage-card,
        .pw-slot,
        .pw-inventory-section,
        .storage-item,
        .technology-card,
        .technology-detail,
        .raw-save-details,
        .mini-metadata-card
    ) {
    background-color: #f7f9fc;
    color: var(--text-primary);
    border-color: var(--border-color);
}

html[data-theme='light']
    :is(.pw-player-facts span, .pw-pal-info small, .technology-action-popup small, .technology-copy span) {
    color: var(--text-secondary);
}
html[data-theme='light'] select option {
    background: #fff;
    color: #172033;
}
html[data-theme='light'] ::placeholder {
    color: #7b899b;
    opacity: 1;
}
html[data-theme='light'] .admin-pal-passive-trigger:not([data-rank]),
html[data-theme='light'] .admin-pal-passive-option:not([data-rank]) {
    color: #edf7f8;
}

html[data-theme='light']
    :is(
        .admin-whitelist-toolbar,
        .admin-whitelist-row,
        .admin-account-row,
        .admin-ban-mode-card,
        .admin-ban-history-row,
        .admin-discord-publisher-form > label,
        .admin-role-policy summary,
        .admin-server-overview-card,
        .admin-server-rate,
        .lottery-stat,
        .lottery-history-row,
        .reward-kind-tabs,
        .user-reward-card,
        .admin-reward-nav,
        .reward-item-builder,
        .reward-picker-result,
        .admin-reward-template,
        .reward-history-row,
        .lottery-ranking-row,
        .season-category,
        .admin-loyalty-checkbox,
        .admin-loyalty-group-heading,
        .admin-loyalty-row,
        .admin-loyalty-history-row,
        .admin-history-subnav,
        .restart-status-grid > div,
        .maintenance-switch,
        .admin-give-result,
        .admin-player-check
    ) {
    background: #fff;
    color: var(--text-primary);
    border-color: var(--border-color);
}

html[data-theme='light']
    :is(
        .admin-whitelist-toolbar strong,
        .admin-whitelist-row strong,
        .admin-account-row strong,
        .admin-server-overview-card strong,
        .admin-server-rate strong,
        .lottery-stat strong,
        .lottery-history-row strong,
        .admin-loyalty-row strong,
        .admin-loyalty-history-row strong,
        .season-category strong
    ) {
    color: #172033;
}

html[data-theme='light']
    :is(
        .admin-whitelist-toolbar span,
        .admin-whitelist-toolbar label,
        .admin-whitelist-row small,
        .admin-account-row small,
        .admin-server-overview-card span,
        .admin-server-rate span,
        .lottery-history-row small,
        .admin-loyalty-row small,
        .admin-loyalty-history-row small,
        .season-category small
    ) {
    color: #52647a;
}

html[data-theme='light'] :is(.admin-discord-results, .reward-account-results, .loyalty-multiselect-menu) {
    background: #fff;
    color: var(--text-primary);
    border-color: var(--border-color);
    box-shadow: var(--shadow-card);
}

@media (max-width: 900px) {
    .technology-toolbar {
        grid-template-columns: 1fr;
    }
    .technology-search {
        grid-column: auto;
    }
    .technology-level {
        grid-template-columns: 52px minmax(0, 1fr);
    }
    .technology-row {
        grid-template-columns: 1fr;
    }
}
/* Tournament form overrides live after the legacy responsive bundle. */
.tournament-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-top: 0.35rem;
}
.tournament-form input,
.tournament-form select,
.tournament-form textarea {
    width: 100%;
    min-height: 42px;
    padding: 0.65rem 0.75rem;
    border: 1px solid rgba(132, 162, 181, 0.24);
    border-radius: 8px;
    background: rgba(4, 16, 22, 0.88);
    color: var(--text-primary);
    font: inherit;
    outline: none;
}
.tournament-form input:focus,
.tournament-form select:focus,
.tournament-form textarea:focus {
    border-color: var(--accent-cyan);
    box-shadow: 0 0 0 3px rgba(0, 242, 254, 0.1);
}
.tournament-player-results:empty {
    display: none;
}
.tournament-prize-row {
    grid-template-columns: minmax(220px, 0.7fr) 140px minmax(320px, 1.3fr) auto;
    background: rgba(4, 18, 24, 0.5);
}
@media (max-width: 900px) {
    .tournament-form,
    .tournament-prize-row {
        grid-template-columns: 1fr;
    }
    .tournament-form .wide {
        grid-column: auto;
    }
}
.reward-selected-item:has(.reward-pal-configure-button) {
    grid-template-columns: 42px minmax(150px, 1fr) minmax(210px, auto) 110px 32px;
}
.reward-selected-item .reward-pal-configure-button {
    width: auto;
    height: auto;
    min-height: 52px;
    padding: 0.6rem 0.8rem;
    border: 1px solid #e99b43;
    border-radius: 9px;
    color: #fff;
    background: linear-gradient(135deg, #a95a13, #71380d);
}
.reward-selected-item .reward-pal-configure-button:hover {
    translate: 0 -1px;
    filter: brightness(1.16);
    border-color: #ffc06f;
}
.reward-pal-customizer {
    display: grid;
    gap: 1rem;
    width: min(1040px, calc(100vw - 2rem));
    padding: 1rem;
    background: linear-gradient(160deg, #101d28, #071319);
}
.reward-pal-customizer > h3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 0;
    padding: 1rem;
    border: 1px solid rgba(107, 225, 235, 0.28);
    border-radius: 11px;
    background: linear-gradient(135deg, rgba(21, 47, 43, 0.82), rgba(5, 20, 27, 0.94));
}
.reward-pal-customizer > h3::after {
    content: 'DON UNIQUEMENT · AUCUN SPAWN';
    padding: 0.35rem 0.55rem;
    border: 1px solid rgba(112, 239, 177, 0.35);
    border-radius: 99px;
    color: #70efb1;
    font-size: 0.66rem;
    letter-spacing: 0.08em;
}
.reward-pal-customizer > .reward-pal-grid {
    padding: 0.9rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.025);
}
.reward-pal-customizer fieldset {
    padding: 0.9rem;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: rgba(3, 15, 20, 0.42);
}
.reward-pal-customizer legend {
    padding: 0 0.45rem;
    color: var(--accent-cyan);
    font-weight: 700;
}
.reward-pal-customizer .reward-pal-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.reward-pal-customizer > .btn-primary {
    width: 100%;
    min-height: 48px;
}
.technology-action-popup.reward-pal-customizer label {
    margin-top: 0;
}
.reward-pal-customizer > .reward-pal-grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    align-items: end;
}
.reward-pal-customizer > .reward-pal-grid > label:nth-child(1) {
    grid-column: span 3;
}
.reward-pal-customizer > .reward-pal-grid > label:nth-child(2) {
    grid-column: span 3;
}
.reward-pal-customizer > .reward-pal-grid > label:nth-child(3) {
    grid-column: span 6;
}
.reward-pal-customizer > .reward-pal-grid > label:nth-child(4) {
    grid-column: span 6;
}
.reward-pal-customizer > .reward-pal-grid > label:nth-child(5),
.reward-pal-customizer > .reward-pal-grid > label:nth-child(6) {
    grid-column: span 3;
}
.reward-pal-customizer .admin-pal-gender-select {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 0.35rem;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
}
.reward-pal-customizer .reward-pal-variant-picker {
    width: 100%;
    margin-top: 0.35rem;
}
.reward-pal-customizer .reward-pal-variant-picker .admin-pal-variant {
    display: flex;
    min-width: 0;
    margin: 0;
}
.reward-pal-customizer .reward-pal-variant-picker .admin-pal-variant input {
    position: absolute;
}
@media (max-width: 900px) {
    .reward-selected-item:has(.reward-pal-configure-button) {
        grid-template-columns: 42px 1fr 110px 32px;
    }
    .reward-selected-item .reward-pal-configure-button {
        grid-column: 2/-1;
    }
    .reward-pal-customizer .reward-pal-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 600px) {
    .reward-pal-customizer .reward-pal-grid {
        grid-template-columns: 1fr;
    }
    .reward-pal-customizer > h3 {
        align-items: flex-start;
        flex-direction: column;
    }
}
@media (max-width: 900px) {
    .reward-pal-customizer > .reward-pal-grid > label {
        grid-column: auto !important;
    }
    .reward-pal-customizer > .reward-pal-grid > label:nth-child(3),
    .reward-pal-customizer > .reward-pal-grid > label:nth-child(4) {
        grid-column: 1/-1 !important;
    }
}
@media (max-width: 600px) {
    .reward-pal-customizer > .reward-pal-grid > label {
        grid-column: auto !important;
    }
}
.tournament-prize-list {
    display: grid;
    gap: 0.65rem;
    margin: 0.7rem 0;
}
.tournament-prize-row {
    grid-template-columns: minmax(180px, 0.7fr) 130px minmax(280px, 1.3fr);
    align-items: start;
    margin: 0;
    padding: 0.85rem;
}
.tournament-prize-heading {
    grid-column: 1/-1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid var(--border-color);
}
.tournament-prize-heading strong {
    color: #ffe083;
}
.tournament-place-options label.used {
    opacity: 0.42;
}
.tournament-prize-picker {
    position: relative;
}
.tournament-prize-selected {
    display: grid;
    grid-template-columns: 1fr;
}
.tournament-prize-selected > span {
    justify-content: flex-start;
}
.tournament-prize-selected > span > button:last-child {
    margin-left: auto;
}
.tournament-admin-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.4rem;
}
@media (max-width: 900px) {
    .tournament-prize-row {
        grid-template-columns: 1fr;
    }
    .tournament-prize-heading {
        grid-column: auto;
    }
    .tournament-admin-actions {
        justify-content: flex-start;
    }
}
.tournament-prize-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}
.tournament-prize-position {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.45rem;
}
.tournament-prize-position > label:first-child {
    grid-column: 1/-1;
}
.tournament-prize-position label {
    display: grid;
    gap: 0.3rem;
}
.tournament-prize-position [hidden] {
    display: none !important;
}
@media (max-width: 600px) {
    .tournament-prize-position {
        grid-template-columns: 1fr;
    }
    .tournament-prize-position > label:first-child {
        grid-column: auto;
    }
}
.tournament-history-panel {
    margin-top: 1rem;
}
.tournament-history-wrap {
    overflow-x: auto;
    border: 1px solid var(--border-color);
    border-radius: 10px;
}
.tournament-history {
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
}
.tournament-history th,
.tournament-history td {
    padding: 0.8rem;
    text-align: left;
    vertical-align: middle;
}
.tournament-history th {
    color: var(--text-muted);
    background: rgba(8, 26, 32, 0.9);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.tournament-history td {
    border-top: 1px solid var(--border-color);
}
.tournament-history td > strong,
.tournament-history td > small {
    display: block;
}
.tournament-history td > small {
    margin-top: 0.2rem;
    color: #70efb1;
}
.tournament-history-podium {
    display: grid;
    gap: 0.25rem;
    min-width: 180px;
}
.tournament-history-podium span {
    display: flex;
    justify-content: space-between;
    gap: 0.7rem;
}
.tournament-history-podium small {
    color: var(--text-muted);
    white-space: nowrap;
}
.tournament-upcoming-panel {
    margin-bottom: 1rem;
}
.tournament-upcoming-list {
    display: grid;
    gap: 0.55rem;
}
.tournament-upcoming-list article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    padding: 0.8rem;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(88, 101, 242, 0.07);
}
.tournament-upcoming-list article > span {
    font-size: 1.35rem;
}
.tournament-upcoming-list article > div {
    display: grid;
    gap: 0.2rem;
}
.tournament-upcoming-list small {
    color: var(--text-muted);
}
.tournament-upcoming-list b {
    padding: 0.3rem 0.55rem;
    border-radius: 99px;
    color: #70efb1;
    background: rgba(52, 211, 153, 0.12);
    font-size: 0.72rem;
}
.tournament-rules {
    margin: 0.2rem 0;
    padding: 0.85rem;
    border: 1px solid rgba(255, 224, 131, 0.22);
    border-radius: 9px;
    background: rgba(255, 224, 131, 0.05);
}
.tournament-rules h4 {
    margin: 0 0 0.45rem;
    color: #ffe083;
}
.tournament-rules p {
    margin: 0;
    white-space: pre-wrap;
    color: var(--text-secondary);
}
@media (max-width: 600px) {
    .tournament-upcoming-list article {
        grid-template-columns: auto 1fr;
    }
    .tournament-upcoming-list article > b {
        grid-column: 2;
        justify-self: start;
    }
}
#tournamentSubmitButton {
    min-height: 48px;
    color: #fff !important;
    opacity: 1;
    box-shadow: 0 7px 20px rgba(88, 101, 242, 0.28);
    transition:
        filter 0.16s ease,
        transform 0.16s ease;
}
#tournamentSubmitButton:hover:not(:disabled) {
    filter: brightness(1.14);
    transform: translateY(-1px);
}
#tournamentSubmitButton:disabled {
    opacity: 0.62;
    cursor: wait;
    box-shadow: none;
}
.tournament-bracket {
    align-items: stretch;
    gap: 1.15rem;
}
.tournament-round {
    justify-content: center;
    gap: 1rem;
}
.tournament-round h5 {
    flex: 0 0 auto;
    margin: 0 0 0.25rem;
}
.tournament-match {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
}
.tournament-match > div {
    align-items: center;
    min-height: 38px;
}
.tournament-match > div span {
    min-width: 0;
    overflow-wrap: anywhere;
}
.tournament-match footer {
    grid-template-columns: minmax(58px, 72px) auto minmax(58px, 72px) minmax(96px, auto);
    align-items: center;
}
.tournament-match footer input {
    width: 100%;
    min-width: 58px;
    min-height: 38px;
    padding: 0.4rem 0.45rem;
    border: 1px solid rgba(132, 162, 181, 0.3);
    border-radius: 6px;
    color: var(--text-primary);
    background: rgba(4, 16, 22, 0.92);
    color-scheme: dark;
}
.tournament-match footer .btn-secondary {
    min-height: 38px;
    padding: 0.4rem 0.65rem;
}
@media (max-width: 600px) {
    .tournament-match footer {
        grid-template-columns: 1fr auto 1fr;
    }
    .tournament-match footer .btn-secondary {
        grid-column: 1/-1;
        width: 100%;
    }
}
.tournament-bracket {
    --connector: rgba(255, 224, 131, 0.48);
    min-height: 420px;
    align-items: stretch;
    gap: 38px;
}
.tournament-round {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    gap: 0.35rem;
}
.tournament-round h5 {
    height: 24px;
    margin: 0;
    text-align: center;
}
.tournament-match-list {
    position: relative;
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: space-around;
    gap: 1rem;
    padding-block: calc((var(--round) - 1) * 13px);
}
.tournament-match {
    position: relative;
    z-index: 1;
    background: rgba(3, 15, 20, 0.96);
}
.tournament-round:not(:last-child) .tournament-match::after {
    position: absolute;
    top: 50%;
    right: -20px;
    width: 20px;
    height: 1px;
    background: var(--connector);
    content: '';
}
.tournament-round:not(:first-child) .tournament-match::before {
    position: absolute;
    top: 50%;
    left: -19px;
    width: 19px;
    height: 1px;
    background: var(--connector);
    content: '';
}
.tournament-round:not(:first-child) .tournament-match-list::before {
    position: absolute;
    top: 25%;
    bottom: 25%;
    left: -19px;
    width: 1px;
    background: var(--connector);
    content: '';
}
.tournament-round:last-child .tournament-match-list::before {
    top: 50%;
    bottom: 50%;
}
@media (max-width: 700px) {
    .tournament-bracket {
        min-height: 360px;
        gap: 32px;
    }
    .tournament-round:not(:last-child) .tournament-match::after {
        right: -17px;
        width: 17px;
    }
    .tournament-round:not(:first-child) .tournament-match::before {
        left: -16px;
        width: 16px;
    }
    .tournament-round:not(:first-child) .tournament-match-list::before {
        left: -16px;
    }
}
.community-map-page {
    display: grid;
    gap: 1rem;
}
.community-map-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.community-map-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 1rem;
}
.community-map-stage,
.community-zone-preview {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: #06141b;
    touch-action: none;
}
.community-map-plane {
    position: absolute;
    inset: 0;
    transform-origin: 0 0;
}
.community-map-plane > img,
.community-zone-preview > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    user-select: none;
    pointer-events: none;
}
.community-map-layer,
.community-zone-preview > div {
    position: absolute;
    inset: 0;
}
.community-zone-shape {
    position: absolute;
    transform: translate(-50%, -50%);
    border: 2px solid;
    box-shadow: 0 0 18px color-mix(in srgb, currentColor 35%, transparent);
    pointer-events: auto;
}
.community-zone-shape > span {
    position: absolute;
    left: 50%;
    top: 50%;
    display: grid;
    min-width: max-content;
    max-width: 220px;
    transform: translate(-50%, -50%) scale(var(--community-marker-scale, 1));
    transform-origin: center;
    padding: 0.3rem 0.5rem;
    border-radius: 6px;
    color: #fff;
    background: rgba(2, 12, 17, 0.82);
    text-align: center;
    text-shadow: 0 1px 2px #000;
}
.community-zone-shape small {
    font-size: 0.65rem;
    color: var(--text-muted);
}
.community-spawn-marker {
    position: absolute;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 0.05rem 0.35rem;
    transform: translate(-50%, -50%) scale(var(--community-marker-scale, 1));
    transform-origin: center;
    padding: 0.38rem 0.5rem;
    border: 1px solid rgba(255, 255, 255, 0.32);
    border-radius: 9px;
    color: #fff;
    background: rgba(6, 18, 25, 0.94);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
    cursor: pointer;
    text-align: left;
    white-space: nowrap;
}
.community-spawn-marker > span {
    grid-row: 1/3;
    font-size: 1.2rem;
}
.community-spawn-marker > b {
    font-size: 0.72rem;
}
.community-spawn-marker > small {
    color: #70efb1;
    font-size: 0.62rem;
}
.community-spawn-marker.boss {
    border-color: rgba(255, 202, 70, 0.7);
}
.community-spawn-marker.free {
    border-color: rgba(112, 239, 177, 0.7);
}
.community-map-events {
    align-self: start;
    max-height: calc(min(75vw, 760px));
    overflow: auto;
}
.community-map-events > div {
    display: grid;
    gap: 0.55rem;
}
.community-map-events article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.15rem 0.55rem;
    padding: 0.65rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
}
.community-map-events article > span {
    grid-row: 1/3;
    font-size: 1.3rem;
}
.community-map-events article > div {
    display: grid;
}
.community-map-events article > b {
    grid-column: 2;
    color: #70efb1;
    font-size: 0.72rem;
}
.community-zone-editor {
    margin-top: 1rem;
}
.community-zone-admin-grid {
    display: grid;
    grid-template-columns: minmax(300px, 1fr) minmax(260px, 0.55fr);
    gap: 1rem;
}
.community-zone-preview {
    cursor: crosshair;
}
.community-zone-preview #communityZoneCursor {
    position: absolute;
    width: 12px;
    height: 12px;
    transform: translate(-50%, -50%);
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 2px #000;
}
.community-zone-editor form {
    display: grid;
    gap: 0.6rem;
}
.community-zone-editor form label {
    display: grid;
    gap: 0.3rem;
}
.community-zone-editor input,
.community-zone-editor select,
.community-zone-editor textarea {
    width: 100%;
    min-height: 42px;
    padding: 0.6rem;
    border: 1px solid var(--border-color);
    border-radius: 7px;
    color: var(--text-primary);
    background: rgba(4, 16, 22, 0.92);
}
.community-zone-size {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
}
.community-zone-list {
    display: grid;
    gap: 0.45rem;
    margin-top: 1rem;
}
.community-zone-list article {
    display: grid;
    grid-template-columns: 14px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.55rem;
    padding: 0.55rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
}
.community-zone-list article i {
    width: 12px;
    height: 32px;
    border-radius: 4px;
}
.community-zone-list article > div {
    display: grid;
}
@media (max-width: 950px) {
    .community-map-layout,
    .community-zone-admin-grid {
        grid-template-columns: 1fr;
    }
    .community-map-events {
        max-height: none;
    }
}
@media (max-width: 600px) {
    .community-map-hero {
        align-items: flex-start;
        flex-direction: column;
    }
    .community-zone-list article {
        grid-template-columns: 12px 1fr;
    }
    .community-zone-list article button {
        grid-column: 2;
    }
    .community-zone-size {
        grid-template-columns: 1fr;
    }
}
.community-map-layout {
    grid-template-columns: minmax(0, 760px) minmax(280px, 340px);
    justify-content: center;
    align-items: start;
}
.community-map-stage {
    width: 100%;
    max-width: 760px;
    justify-self: center;
}
.community-map-stage > .map-controls {
    top: 0.75rem;
    right: 0.75rem;
}
.community-map-events {
    max-height: 760px;
}
@media (max-width: 1150px) {
    .community-map-layout {
        grid-template-columns: minmax(0, 760px);
    }
    .community-map-events {
        width: 100%;
        max-width: 760px;
        max-height: none;
        justify-self: center;
    }
}
@media (max-width: 800px) {
    .community-map-stage {
        max-width: calc(100vw - 2rem);
    }
    .community-map-layout {
        grid-template-columns: minmax(0, 1fr);
    }
}
.community-color-picker {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 0.5rem;
    align-items: center;
}
.community-color-picker > span {
    width: 42px;
    height: 42px;
    border: 3px solid rgba(255, 255, 255, 0.78);
    border-radius: 50%;
    box-shadow:
        0 0 0 1px rgba(0, 0, 0, 0.75),
        0 0 16px rgba(0, 229, 255, 0.18);
}
.community-color-picker > input {
    min-height: 42px !important;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    text-transform: uppercase;
}
.community-color-swatches {
    grid-column: 1/-1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    padding: 0.45rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: rgba(4, 16, 22, 0.55);
}
.community-color-swatches button {
    width: 30px;
    height: 30px;
    padding: 0;
    border: 2px solid rgba(255, 255, 255, 0.48);
    border-radius: 50%;
    background: var(--swatch);
    box-shadow: 0 2px 7px rgba(0, 0, 0, 0.35);
    cursor: pointer;
    transition:
        transform 0.14s ease,
        border-color 0.14s ease;
}
.community-color-swatches button:hover {
    transform: scale(1.12);
    border-color: #fff;
}
.community-zone-preview-layer {
    touch-action: none;
}
.community-zone-preview .community-zone-shape {
    cursor: pointer;
}
.community-zone-preview .community-zone-shape.configured {
    opacity: 0.64;
}
.community-zone-preview .community-zone-shape.configured:hover {
    opacity: 1;
    filter: brightness(1.2);
}
.community-zone-preview .community-zone-shape.editing {
    z-index: 3;
    cursor: grab;
    border-width: 3px;
    box-shadow:
        0 0 0 2px rgba(255, 255, 255, 0.72),
        0 0 22px rgba(0, 0, 0, 0.55);
}
.community-zone-preview .community-zone-shape.editing:active {
    cursor: grabbing;
}
.community-zone-preview .community-zone-shape.editing > span small {
    color: #70efb1;
}
.community-spawn-dot {
    position: absolute;
    z-index: 5;
    width: 11px;
    height: 11px;
    transform: translate(-50%, -50%) scale(var(--community-marker-scale, 1));
    border: 2px solid #fff;
    border-radius: 50%;
    background: #ff304f;
    box-shadow:
        0 0 0 3px rgba(255, 48, 79, 0.28),
        0 0 12px #ff304f;
    pointer-events: none;
}
.community-spawn-marker {
    z-index: 4;
    transform: translate(10px, -50%) scale(var(--community-marker-scale, 1));
    transform-origin: left center;
}
.community-map-events .community-map-event-row {
    display: grid;
    width: 100%;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.15rem 0.55rem;
    padding: 0.65rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: var(--text-primary);
    background: rgba(3, 15, 20, 0.45);
    cursor: pointer;
    text-align: left;
}
.community-map-events .community-map-event-row:hover {
    border-color: var(--accent-cyan);
    background: rgba(0, 229, 255, 0.07);
}
.community-map-event-row > span {
    grid-row: 1/4;
    font-size: 1.3rem;
}
.community-map-event-row > div {
    display: grid;
}
.community-map-event-row > b {
    grid-column: 2;
    color: #70efb1;
    font-size: 0.72rem;
}
.community-map-event-row > em {
    grid-column: 2;
    color: var(--accent-cyan);
    font-size: 0.68rem;
    font-style: normal;
}
.admin-pal-map-canvas {
    cursor: crosshair;
}
.admin-pal-map-canvas.dragging {
    cursor: grabbing;
}
.admin-pal-map-canvas span {
    width: 13px;
    height: 13px;
    border-width: 3px;
    box-shadow:
        0 0 0 3px rgba(255, 64, 93, 0.25),
        0 0 10px #ff405d;
}

/* Public community map: compact numbered zones keep labels off the artwork. */
.community-zone-shape.public {
    pointer-events: none;
    box-shadow:
        inset 0 0 20px rgba(0, 0, 0, 0.12),
        0 0 12px color-mix(in srgb, currentColor 24%, transparent);
}
.community-zone-marker {
    position: absolute;
    z-index: 3;
    left: 50%;
    top: 50%;
    width: 30px;
    height: 30px;
    padding: 0;
    transform: translate(-50%, -50%) scale(var(--community-marker-scale, 1));
    transform-origin: center;
    border: 2px solid #fff;
    border-radius: 50%;
    color: inherit;
    background: currentColor;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.7);
    cursor: pointer;
    pointer-events: auto;
}
.community-zone-marker > b {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    border-radius: inherit;
    color: #061016;
    background: transparent;
    font-size: 0.72rem;
    line-height: 1;
}
.community-zone-marker > span {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 9px);
    display: none;
    width: max-content;
    min-width: 150px;
    max-width: 240px;
    padding: 0.5rem 0.6rem;
    transform: translateX(-50%);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 8px;
    color: #fff;
    background: rgba(2, 12, 17, 0.96);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.55);
    text-align: center;
    text-shadow: none;
}
.community-zone-marker > span::after {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: rgba(2, 12, 17, 0.96);
    content: '';
}
.community-zone-marker > span strong,
.community-zone-marker > span small {
    display: block;
}
.community-zone-marker > span small {
    margin-top: 0.2rem;
    color: var(--text-muted);
    font-size: 0.67rem;
    line-height: 1.35;
    white-space: normal;
}
.community-zone-marker:hover,
.community-zone-marker:focus-visible {
    z-index: 10;
    outline: 3px solid rgba(255, 255, 255, 0.32);
    outline-offset: 3px;
}
.community-zone-marker:hover > span,
.community-zone-marker:focus-visible > span {
    display: block;
}
.community-map-events {
    display: grid;
    gap: 1rem;
}
.community-map-side-section {
    display: grid;
    gap: 0.7rem;
}
.community-map-side-section + .community-map-side-section {
    padding-top: 1rem;
    border-top: 1px solid var(--border-color);
}
.community-map-zone-list {
    display: grid;
    gap: 0.45rem;
}
.community-map-zone-row {
    display: grid;
    width: 100%;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.55rem;
    padding: 0.6rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: var(--text-primary);
    background: rgba(3, 15, 20, 0.45);
    cursor: pointer;
    text-align: left;
}
.community-map-zone-row:hover,
.community-map-zone-row:focus-visible {
    border-color: var(--zone-color);
    background: color-mix(in srgb, var(--zone-color) 8%, transparent);
    outline: none;
}
.community-map-zone-row > b {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border: 2px solid rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    color: #061016;
    background: var(--zone-color);
    font-size: 0.7rem;
}
.community-map-zone-row > span {
    display: grid;
    min-width: 0;
    gap: 0.12rem;
}
.community-map-zone-row strong,
.community-map-zone-row small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.community-map-zone-row small {
    color: var(--text-muted);
    font-size: 0.68rem;
}
.community-map-zone-row em {
    color: var(--accent-cyan);
    font-size: 0.66rem;
    font-style: normal;
}
@media (max-width: 600px) {
    .community-zone-marker {
        width: 26px;
        height: 26px;
    }
    .community-zone-marker > span {
        max-width: min(220px, 70vw);
    }
    .community-map-zone-row {
        grid-template-columns: 28px minmax(0, 1fr);
    }
    .community-map-zone-row em {
        display: none;
    }
}
.starter-pack-page > .card-heading {
    align-items: flex-start;
}
.starter-pack-page #starterPackStatus {
    flex: 0 0 auto;
    align-self: flex-start;
    min-height: 0;
    padding: 0.35rem 0.65rem;
    line-height: 1.2;
    white-space: nowrap;
}
.starter-pal-choice.not-selected {
    opacity: 0.55;
}
.starter-pal-choice.not-selected:hover {
    opacity: 0.78;
}
.starter-pack-page {
    display: grid;
    gap: 1rem;
}
.starter-pack-content {
    display: grid;
    gap: 1.2rem;
}
.starter-pack-content > section {
    padding: 1rem;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: rgba(5, 20, 24, 0.58);
}
.starter-pack-content h4 {
    margin-bottom: 0.75rem;
    color: var(--accent-cyan);
}
.starter-pack-grid,
.starter-pal-choices {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    gap: 0.75rem;
}
.starter-pack-grid article,
.starter-pal-choice {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    align-items: center;
    gap: 0.85rem;
    min-width: 0;
    min-height: 98px;
    padding: 0.75rem;
    border: 1px solid rgba(173, 218, 223, 0.2);
    border-radius: 10px;
    background: rgba(8, 25, 28, 0.92);
}
.starter-card-visual {
    display: grid !important;
    width: 72px;
    height: 72px;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(173, 218, 223, 0.12);
    border-radius: 9px;
    background: rgba(0, 0, 0, 0.16);
}
.starter-card-visual img {
    display: block;
    width: 66px;
    height: 66px;
    object-fit: contain;
}
.starter-card-fallback {
    color: var(--accent-cyan);
    font-size: 1.65rem;
}
.starter-pack-grid article > span:last-child,
.starter-pal-choice > span:last-child {
    display: grid;
    min-width: 0;
    gap: 0.2rem;
}
.starter-pack-grid strong,
.starter-pal-choice strong {
    line-height: 1.35;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
}
.starter-pack-grid strong b {
    color: var(--accent-cyan);
    white-space: nowrap;
}
.starter-pack-grid small,
.starter-pal-choice small {
    min-width: 0;
    overflow: hidden;
    color: var(--text-muted);
    font-size: 0.75rem;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.starter-pal-choice {
    position: relative;
    padding-right: 2.25rem;
    cursor: pointer;
}
.starter-pal-choice input {
    position: absolute;
    top: 0.65rem;
    right: 0.65rem;
    accent-color: var(--accent-cyan);
}
.starter-pal-choice:has(input:checked) {
    border-color: var(--accent-cyan);
    box-shadow: 0 0 0 2px rgba(0, 242, 254, 0.12);
}
.starter-pack-claim {
    min-height: 50px;
}
.starter-pack-claimed {
    display: grid;
    gap: 0.25rem;
    padding: 1rem;
    border: 1px solid rgba(46, 220, 140, 0.4);
    border-radius: 10px;
    color: #70efb1;
    background: rgba(46, 220, 140, 0.08);
}
.starter-pack-admin {
    margin-bottom: 1rem;
}
@media (max-width: 600px) {
    .starter-pack-content > section {
        padding: 0.75rem;
    }
    .starter-pack-grid,
    .starter-pal-choices {
        grid-template-columns: 1fr;
    }
    .starter-pack-grid article,
    .starter-pal-choice {
        grid-template-columns: 62px minmax(0, 1fr);
        min-height: 84px;
    }
    .starter-card-visual {
        width: 62px;
        height: 62px;
    }
    .starter-card-visual img {
        width: 56px;
        height: 56px;
    }
}

/* Keyboard navigation and route headings. */
.skip-link {
    position: fixed;
    top: -100px;
    left: 1rem;
    z-index: 10000;
    padding: 0.75rem 1rem;
    color: var(--text-primary);
    background: var(--bg-primary);
    border: 2px solid var(--accent-cyan);
    border-radius: 0.5rem;
}
.skip-link:focus {
    top: 1rem;
}
:focus-visible {
    outline: 2px solid var(--accent-cyan);
    outline-offset: 3px;
}
.page-intro {
    grid-column: 1 / -1;
    margin-bottom: 1rem;
}
.page-intro h1 {
    font-size: clamp(1.2rem, 2.5vw, 1.8rem);
    margin: 0 0 0.4rem;
}
.page-intro p {
    color: var(--text-secondary);
    margin: 0;
    max-width: 80ch;
}
.logo-text .brand-title {
    display: block;
}
.site-footer-bottom {
    color: var(--text-secondary);
}
html[data-theme='light'] .stat-label,
html[data-theme='light'] .site-footer-links a {
    color: var(--text-secondary);
}