:root {
    --primary-color: #2d2d2d;
    --primary-highlight: #444;

    --reckless-highlight: #0edf18;
    --sah-orange: #f39720;
    --sah-bg: #111315;
    --sah-panel: #191c1f;
    --sah-line: #303438;
    --sah-muted: #899096;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;

    
}

body {
    display: flex;
    justify-content: center;

    background-image: url('img/bg_reckless.png');
    background-size: cover;
    padding: 5px;
    font-family: Arial, sans-serif;
    color:black;
}

.page-shell {
    width: clamp(1300px, 90vw, 1900px);
    min-height: 800px;

    /* background: white; */
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 20px 20px rgba(73, 245, 5, 0.719);

    display: flex;
    flex-direction: column;
}

/* Oberer Balken */
.topbar {
    height: 30px;
    background: linear-gradient(80deg, #139907d2, #2d2d2d);
    /* color: white; */

    color:white;
    font-weight: bold;

    display: flex;
    align-items: center;
    padding: 0 25px;

    border-bottom: 1px solid #444;
}

/* Bereich unter der Topbar */
.content {
    flex: 1;

    display: flex;
}

/* Hauptinhalt */
.main-content {
    background-image: url('img/bg_reckless.png');
    background-size: cover;
    flex: 1;
    padding: 10px;
    position: relative;
    overflow: hidden;
}

.tab-panel {
    width: 100%;
    height: 100%;
    overflow: hidden;

    background-image: url('img/bg_reckless.png');
    background-size: cover;
}


.iframe-container {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.iframe-container iframe {
    width: 100%;
    height: 100%;
    border: 0;

    transform: scale(1);
    transform-origin: center center;
    margin-bottom: -100px;
}

.map-viewer {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
    border-radius: 8px;
    background: #1c1c1c;
    cursor: grab;
    touch-action: none;
    user-select: none;
}

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

.map-viewer img {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: none;
    transform: translate(-50%, -50%);
    transform-origin: center center;
    pointer-events: none;
}

.map-controls {
    position: absolute;
    top: 40px;
    right: 40px;

    display: flex;
    flex-direction: column;
    gap: 6px;
}

.map-controls button {
    width: 36px;
    height: 36px;

    background: rgba(45,45,45,.85);
    color: white;
    border: 1px solid #555;
    border-radius: 6px;

    cursor: pointer;
    transition: .2s;
}

.map-controls button:hover {
    background: var(--reckless-highlight);
    color: #1c1c1c;
    border-color: var(--reckless-highlight);
}

.sidebar {
    width: 90px;
    background: #2b2b2b;
    border-left: 2px solid #1c1c1c;

    display: flex;
    flex-direction: column;
    align-items: center;

    overflow-y: auto;
}

.sidebar-btn {
    width: 100%;
    height: 70px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    gap: 4px;

    background: transparent;
    border: none;
    border-bottom: 1px solid #3b3b3b;

    color: #d6d6d6;
    cursor: pointer;

    transition: .2s;
}

.sidebar-btn i {
    font-size: 22px;
}

.sidebar-btn span {
    font-size: 10px;
    color: #b5b5b5;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.sidebar-btn:hover {
    background: #3a3a3a;
    box-shadow: inset 3px 0 0 var(--reckless-highlight);
}

.sidebar-btn:hover i,
.sidebar-btn:hover span {
    color: var(--reckless-highlight);
    font-weight: bold;
}

.sidebar-btn.active {
    background: #383838;
    border-left: 4px solid var(--reckless-highlight);
}

.sidebar-btn.active i,
.sidebar-btn.active span {
    color: var(--reckless-highlight);
    font-weight: bold;
}

.sidebar-btn.active span {
    font-size: 0.66rem;
}

.sidebar-btn.active:hover i,
.sidebar-btn.active:hover span {
    color: var(--reckless-highlight);
}

/* Items Container */
.items-container {
    width: 100%;
    height: 100%;
    padding: 20px;
    background: white;
    overflow-y: auto;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 15px;
}

.item-card {
    background: #1c1c1c;
    border-radius: 8px;
    overflow: visible;
    box-shadow: 0 4px 12px rgba(0,0,0,.3);
    transition: transform 0.2s, box-shadow 0.2s;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    position: relative;
    aspect-ratio: 1;
}

.item-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 8px 20px rgba(14, 223, 24, 0.4);
}

.item-image {
    width: 100%;
    height: 70%;
    object-fit: cover;
    background: #2c2c2c;
}

.item-name {
    flex: 1;
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: bold;
    color: white;
    text-align: center;
    background: #222;
    word-break: break-word;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.item-info-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #ff8c00;
    color: white;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: 0.2s;
    box-shadow: 0 2px 8px rgba(0,0,0,.4);
    z-index: 10;
}

.item-info-btn:hover {
    transform: scale(1.15);
    background: #ffa500;
    box-shadow: 0 4px 12px rgba(255, 140, 0, 0.6);
}

/* Modal */
.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.7);
    animation: fadeIn 0.3s;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.modal.show {
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-content {
    background: white;
    border-radius: 12px;
    max-width: 900px;
    width: min(96vw, 900px);
    max-height: 88vh;
    height: auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0,0,0,.5);
    animation: slideIn 0.3s;
}

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

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 20px;
    background: #2d2d2d;
    color: white;
    position: relative;
    gap: 20px;
}

.modal-header-left {
    flex-shrink: 0;
}

.modal-image {
    width: 150px;
    height: 150px;
    object-fit: cover;
    border-radius: 8px;
    background: #1c1c1c;
    border: 2px solid var(--reckless-highlight);
}

.modal-header-right {
    flex: 1;
}

.modal-header-right h2 {
    margin: 0 0 10px 0;
    color: white;
    font-size: 24px;
}

.modal-description {
    color: #ccc;
    font-size: 14px;
    margin: 0 0 12px 0;
}

.modal-rarity {
    display: flex;
    gap: 8px;
}

.rarity-badge {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.rarity-common {
    background: #888;
    color: white;
}

.rarity-uncommon {
    background: #2ecc71;
    color: white;
}

.rarity-rare {
    background: #3498db;
    color: white;
}

.rarity-epic {
    background: #9b59b6;
    color: white;
}

.rarity-legendary {
    background: #f39c12;
    color: white;
}

.modal-close {
    position: absolute;
    top: 15px;
    right: 15px;
    background: none;
    border: none;
    font-size: 32px;
    cursor: pointer;
    color: white;
    transition: 0.2s;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-close:hover {
    color: var(--reckless-highlight);
    transform: scale(1.2);
}

.modal-body {
    color: #2d2d2d;
    line-height: 1.6;
    padding: 20px 24px;
    flex: 1 1 auto;
    overflow-y: auto;
}

.modal-details-text {
    font-size: 14px;
    color: #4a4a4a;
    margin: 0 0 18px 0;
    padding-bottom: 16px;
    border-bottom: 1px solid #ececec;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 10px;
}

.stat-item {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #f7f7f7;
    border: 1px solid #ececec;
    border-radius: 8px;
    padding: 10px 12px;
    transition: border-color .2s, background .2s;
}

.stat-item:hover {
    border-color: var(--reckless-highlight);
    background: #f2fdf2;
}

.stat-icon {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: rgba(14, 223, 24, 0.12);
    color: var(--reckless-highlight);
    font-size: 13px;
}

.stat-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.stat-label {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: #999;
}

.stat-value {
    font-size: 14px;
    font-weight: 700;
    color: #2d2d2d;
    overflow-wrap: break-word;
}

/* Modal Footer with Quantity Controls */
.modal-footer {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    border-top: 2px solid #e0e0e0;
    background: #f8f8f8;
    flex-shrink: 0;
}

.quantity-control {
    display: flex;
    align-items: center;
    gap: 10px;
}

.quantity-control input {
    width: 70px;
    padding: 8px;
    text-align: center;
    border: 2px solid var(--reckless-highlight);
    border-radius: 6px;
    font-size: 16px;
    font-weight: bold;
    color: #2d2d2d;
}

.quantity-control input:focus {
    outline: none;
    box-shadow: 0 0 8px rgba(14, 223, 24, 0.4);
}

.qty-btn {
    width: 36px;
    height: 36px;
    border: 2px solid var(--reckless-highlight);
    background: white;
    color: var(--reckless-highlight);
    border-radius: 6px;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    transition: 0.2s;
}

.qty-btn:hover {
    background: var(--reckless-highlight);
    color: white;
    transform: scale(1.1);
}

/* Inline Quantity Controls for ALLES category */
.item-quantity-inline {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    background: rgba(0,0,0,0.9);
    padding: 6px 4px;
    border-radius: 0 0 8px 8px;
}

.qty-btn-inline {
    width: 22px;
    height: 22px;
    border: 1px solid #ff8c00;
    background: transparent;
    color: #ff8c00;
    border-radius: 4px;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
    transition: 0.2s;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.qty-btn-inline:hover {
    background: #ff8c00;
    color: white;
    transform: scale(1.15);
}

.qty-display {
    color: white;
    font-weight: bold;
    font-size: 12px;
    min-width: 20px;
    text-align: center;
}

/* --- Extras Section --- */
.extras-section {
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 0;
    background: #fafafa;
    border: 1px solid #ececec;
    border-radius: 10px;
    overflow: hidden;
    max-height: 280px;
    display: flex;
    flex-direction: column;
}

.extras-section h3 {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #2d2d2d;
    font-size: 12px;
    font-weight: 700;
    margin: 0;
    padding: 10px 14px;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    background: #f0f0f0;
    border-bottom: 1px solid #e5e5e5;
}

.extras-section h3 i {
    color: var(--reckless-highlight);
    font-size: 12px;
}

#extrasList {
    display: flex;
    flex-direction: column;
    gap: 14px;
    overflow-y: auto;
    padding: 12px 14px;
}

.extras-category {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.extras-category + .extras-category {
    padding-top: 12px;
    border-top: 1px solid #ececec;
}

.extras-category-title {
    font-weight: 700;
    color: #666;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.extras-items-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
    gap: 10px;
}

.extra-item-card {
    background: white;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: border-color .2s, box-shadow .2s;
    cursor: default;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.extra-item-card:hover {
    border-color: var(--reckless-highlight);
    box-shadow: 0 2px 6px rgba(14, 223, 24, 0.15);
}

.extra-item-image {
    display: block;
    width: 100%;
    height: 64px;
    object-fit: contain;
    padding: 6px;
    background: radial-gradient(circle, rgba(42, 51, 45, .92), rgba(14, 18, 15, .98) 72%);
    filter: drop-shadow(0 5px 5px rgba(0,0,0,.35));
}

.extra-item-info {
    padding: 6px 6px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    flex: 1;
}

.extra-item-name {
    font-size: 10.5px;
    font-weight: 600;
    color: #2d2d2d;
    text-align: center;
    word-break: break-word;
    line-height: 1.25;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.extra-item-qty {
    display: flex;
    gap: 6px;
    align-items: center;
    justify-content: center;
    background: #f7f7f7;
    border-radius: 5px;
    padding: 3px 4px;
}

.extra-qty-btn {
    width: 18px;
    height: 18px;
    padding: 0;
    border: none;
    background: white;
    color: #666;
    font-weight: 700;
    cursor: pointer;
    font-size: 11px;
    transition: all 0.15s;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 2px rgba(0,0,0,.1);
}

.extra-qty-btn:hover {
    background: var(--reckless-highlight);
    color: white;
}

.extra-qty-display {
    min-width: 14px;
    text-align: center;
    font-size: 11px;
    font-weight: 700;
    color: #2d2d2d;
}

/* --- Updated Modal Footer --- */
#modalFooter {
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding: 20px;
    border-top: 2px solid #e0e0e0;
    background: #f8f8f8;
    width: 100%;
    box-sizing: border-box;
}

.footer-content {
    display: flex;
    flex-direction: column;
    gap: 15px;
    width: 100%;
}

/* SCUM Admin Helper inspired item workspace */
body { background: #090b0c url('img/bg_reckless.png') center/cover fixed; color: #eef0f1; padding: 0; }
.page-shell { width: 100vw; min-height: 100vh; border-radius: 0; box-shadow: none; background: var(--sah-bg); }
.topbar { height: 58px; background: #151719; border-bottom: 1px solid #303337; padding: 0 18px; gap: 12px; }
.brand-mark { width: 34px; height: 34px; display: grid; place-items: center; color: #101214; background: var(--sah-orange); clip-path: polygon(9% 0,100% 0,91% 100%,0 100%); font: 900 20px/1 Arial; }
.brand-mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
.brand-copy { display: flex; flex-direction: column; line-height: 1; }
.brand-copy p { font-size: 13px; letter-spacing: 1.6px; }
.brand-copy span { margin-top: 5px; color: var(--sah-orange); font-size: 8px; letter-spacing: 2px; font-weight: 800; }
.topbar-status { margin-left: auto; color: #737a80; font-size: 9px; letter-spacing: 1.4px; font-weight: 700; }
.topbar-status i { color: #55bd69; font-size: 6px; margin-right: 6px; }
.content { min-height: calc(100vh - 58px); }
.main-content { order: 2; background: radial-gradient(circle at 70% 0%, #202428 0, #111315 45%); padding: 0; }
.sidebar { order: 1; width: 76px; background: #141618; border: 0; border-right: 1px solid #2a2e31; }
.sidebar-btn { height: 66px; border-bottom: 1px solid #222629; color: #778087; position: relative; }
.sidebar-btn i { font-size: 18px; }
.sidebar-btn span { font-size: 8px; letter-spacing: .8px; color: inherit; }
.sidebar-btn:hover { background: #1d2023; box-shadow: none; }
.sidebar-btn.active { background: linear-gradient(90deg, rgba(243,151,32,.15), transparent); border-left: 0; }
.sidebar-btn.active::before { content: ''; position: absolute; left: 0; top: 13px; bottom: 13px; width: 3px; background: var(--sah-orange); }
.sidebar-btn:hover i, .sidebar-btn:hover span, .sidebar-btn.active i, .sidebar-btn.active span { color: var(--sah-orange); }
.tab-panel { background: transparent; }
.tab-panel[hidden] { display: none !important; }
.tab-panel:not([data-panel="map"]):not([data-panel="settings"]):not([data-panel="default"]) { display: flex; flex-direction: column; height: calc(100vh - 58px); }
.items-toolbar { min-height: 102px; padding: 21px 28px 17px; display: grid; grid-template-columns: minmax(180px, 1fr) minmax(280px, 520px) 1fr; align-items: center; gap: 24px; border-bottom: 1px solid var(--sah-line); background: rgba(18,20,22,.94); }
.items-heading h1 { margin-top: 4px; font-size: 24px; line-height: 1; text-transform: uppercase; letter-spacing: 1.2px; }
.items-kicker { color: var(--sah-orange); font-size: 8px; font-weight: 800; letter-spacing: 1.7px; }
.search-box { height: 42px; display: flex; align-items: center; gap: 10px; padding: 0 12px; border: 1px solid #3a3e42; background: #101214; color: #737b81; }
.search-box:focus-within { border-color: var(--sah-orange); box-shadow: 0 0 0 2px rgba(243,151,32,.1); }
.search-box input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: #f1f1f1; font-size: 12px; }
.search-box kbd { color: #62696f; border: 1px solid #34383c; padding: 3px 6px; font: 8px Arial; }
.toolbar-actions { justify-self: end; display: flex; gap: 7px; }
.view-btn, .toolbar-actions select { height: 34px; border: 1px solid #363a3e; background: #1b1e21; color: #989fa4; padding: 0 10px; font-size: 10px; }
.view-btn.active { color: var(--sah-orange); border-color: #6a4a26; }
.items-container { flex: 1; width: 100%; height: auto; padding: 24px 28px 100px; background: transparent; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); align-content: start; gap: 14px; scrollbar-color: #4a4e51 #17191b; }
.item-card { min-height: 250px; aspect-ratio: auto; background: #1a1d20; border: 1px solid #303438; border-radius: 2px; box-shadow: 0 5px 14px rgba(0,0,0,.24); overflow: hidden; cursor: default; transition: transform .16s, border-color .16s, box-shadow .16s; }
.item-card:hover { transform: translateY(-3px); border-color: #69502f; box-shadow: 0 10px 24px rgba(0,0,0,.42); }
.item-image-wrap { position: relative; display: block; width: 100%; height: 135px; padding: 0; overflow: hidden; border: 0; border-bottom: 1px solid #292d30; background: radial-gradient(circle, #33383d, #202326 70%); cursor: pointer; }
.item-image { width: 100%; height: 100%; object-fit: contain; padding: 12px; background: transparent; filter: drop-shadow(0 8px 8px rgba(0,0,0,.4)); transition: transform .2s; }
.item-card:hover .item-image { transform: scale(1.05); }
.rarity-line { position: absolute; z-index: 2; inset: 0 auto 0 0; width: 3px; background: #777; }
.item-card[data-rarity="uncommon"] .rarity-line { background: #4cae65; }.item-card[data-rarity="rare"] .rarity-line { background: #3d87c6; }.item-card[data-rarity="epic"] .rarity-line { background: #9c5bb5; }.item-card[data-rarity="legendary"] .rarity-line { background: var(--sah-orange); }
.item-inspect { position: absolute; right: 8px; bottom: 8px; width: 25px; height: 25px; display: grid; place-items: center; background: rgba(10,12,13,.82); color: #aaa; font-size: 9px; opacity: 0; transition: opacity .2s; }
.item-card:hover .item-inspect { opacity: 1; }
.item-meta { flex: 1; padding: 11px 12px 8px; min-width: 0; }
.item-type { color: var(--sah-orange); text-transform: uppercase; font-size: 7px; letter-spacing: 1.2px; font-weight: 800; }
.item-name { display: block; padding: 4px 0 2px; background: transparent; text-align: left; color: #eef0f1; font-size: 12px; line-height: 1.3; }
.item-meta code { display: block; overflow: hidden; text-overflow: ellipsis; color: #626a70; font-size: 8px; white-space: nowrap; }
.item-quantity-inline { position: static; height: 38px; border-radius: 0; border-top: 1px solid #2b2f32; padding: 6px 9px; justify-content: space-between; background: #16181a; }
.qty-btn-inline { width: 25px; height: 24px; border-radius: 1px; border-color: #42474b; color: #aeb3b7; background: #222528; }
.qty-btn-inline:hover { background: var(--sah-orange); border-color: var(--sah-orange); color: #111; transform: none; }
.qty-display { font-size: 11px; }
.empty-state { grid-column: 1/-1; min-height: 300px; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #656c71; gap: 8px; }
.empty-state i { color: var(--sah-orange); font-size: 24px; margin-bottom: 8px; }.empty-state strong { color: #c6c9cb; font-size: 13px; }.empty-state span { font-size: 10px; }
.selection-dock { position: fixed; z-index: 50; left: calc(50% + 38px); bottom: 18px; transform: translate(-50%, 90px); width: min(520px, calc(100vw - 120px)); height: 56px; display: flex; align-items: center; padding: 7px 8px 7px 16px; background: rgba(27,30,32,.98); border: 1px solid #41464a; box-shadow: 0 12px 35px rgba(0,0,0,.5); opacity: 0; pointer-events: none; transition: .25s; }
.selection-dock.show { transform: translate(-50%, 0); opacity: 1; pointer-events: auto; }
.selection-summary { display: flex; flex-direction: column; gap: 3px; }.selection-label { color: #727a80; font-size: 7px; letter-spacing: 1.5px; }.selection-summary strong { font-size: 12px; }
.selection-clear { margin-left: auto; width: 38px; height: 38px; border: 0; background: transparent; color: #737a80; cursor: pointer; }.selection-clear:hover { color: #e45b52; }
.spawn-btn { height: 40px; padding: 0 20px; border: 0; background: var(--sah-orange); color: #17191a; font-size: 10px; font-weight: 900; letter-spacing: .8px; cursor: pointer; }.spawn-btn:hover { background: #ffad3f; }
.modal { background: rgba(5,7,8,.86); backdrop-filter: blur(5px); }.modal-content { background: #171a1c; border: 1px solid #454a4e; border-radius: 2px; color: #eee; }.modal-header { background: linear-gradient(110deg, #24282b, #191b1d); border-bottom: 1px solid #363a3d; }.modal-image { object-fit: contain; border-radius: 1px; border-color: #4b5054; background: radial-gradient(circle, #34393d, #202326); }.modal-body { color: #c4c8ca; background: #171a1c; }.modal-details-text { color: #9da3a7; border-color: #34383b; }.stat-item { background: #202326; border-color: #34383b; border-radius: 2px; }.stat-item:hover { background: #25282b; border-color: var(--sah-orange); }.stat-icon { border-radius: 1px; background: rgba(243,151,32,.12); color: var(--sah-orange); }.stat-label { color: #747b80; }.stat-value { color: #e8e9ea; }.rarity-badge { border-radius: 1px; }.modal-footer, #modalFooter { background: #121416; border-color: #34383b; }.extras-section { background: #191c1e; border-color: #363a3d; border-radius: 2px; }.extras-section h3 { background: #202326; color: #ddd; border-color: #363a3d; }.extras-section h3 i { color: var(--sah-orange); }.extra-item-card { background: #212427; border-color: #383c40; border-radius: 2px; }.extra-item-name, .extra-qty-display { color: #e1e3e4; }.extra-item-qty { background: #17191b; }.quantity-control input { color: #eee; background: #1b1e20; border-color: var(--sah-orange); }.qty-btn { border-radius: 1px; border-color: var(--sah-orange); color: var(--sah-orange); background: #1b1e20; }
body:has(.modal.show), body.modal-open { overflow: hidden !important; height: 100vh; }
@media (max-width: 850px) { .sidebar { width: 62px; }.items-toolbar { grid-template-columns: 1fr; gap: 12px; padding: 16px; }.toolbar-actions { display: none; }.items-container { padding: 16px 16px 90px; grid-template-columns: repeat(auto-fill,minmax(145px,1fr)); }.selection-dock { left: calc(50% + 31px); }.topbar-status { display: none; } }

/* Reckless RP visual language + compact sizing */
:root {
    --sah-orange: #18f43b;
    --sah-bg: #050806;
    --sah-panel: #0e120f;
    --sah-line: rgba(24, 244, 59, .22);
    --sah-muted: #8c948e;
}
body { font-family: "Segoe UI", Roboto, Arial, sans-serif; background-color: #020403; color: #e8e8e8; }
.page-shell { background: linear-gradient(rgba(2,5,3,.93), rgba(2,5,3,.97)), url('img/bg_reckless.png') center/cover fixed; }
.topbar { height: 52px; padding: 0 16px; background: rgba(3,6,4,.94); border-bottom-color: rgba(24,244,59,.18); }
.brand-mark { width: 38px; height: 38px; padding: 2px; color: #051008; background: rgba(8,18,10,.9); border: 1px solid rgba(24,244,59,.28); border-radius: 10px; clip-path: none; box-shadow: 0 0 22px rgba(24,244,59,.18); }
.brand-copy p { color: #f4f4f4; font-size: 12px; }.brand-copy span, .items-kicker { color: #18f43b; }
.topbar-status i { color: #18f43b; }.content { min-height: calc(100vh - 52px); }
.main-content { background: radial-gradient(circle at 65% -10%, rgba(20,80,31,.18), transparent 42%), rgba(3,6,4,.86); }
.sidebar { width: 96px; background: rgba(4,8,5,.96); border-right-color: rgba(24,244,59,.15); }
.sidebar-btn { height: 58px; padding: 4px 3px; gap: 3px; border-bottom-color: rgba(255,255,255,.055); }
.sidebar-btn i { font-size: 16px; }.sidebar-btn span, .sidebar-btn.active span { width: 100%; font-size: 9px; letter-spacing: .45px; line-height: 1.1; white-space: nowrap; }
.sidebar-btn.active { background: linear-gradient(90deg, rgba(24,244,59,.15), rgba(24,244,59,.025)); }
.sidebar-btn.active::before { top: 10px; bottom: 10px; background: #18f43b; border-radius: 0 3px 3px 0; box-shadow: 0 0 12px rgba(24,244,59,.45); }
.sidebar-btn:hover i, .sidebar-btn:hover span, .sidebar-btn.active i, .sidebar-btn.active span { color: #18f43b; }
.tab-panel:not([data-panel="map"]):not([data-panel="settings"]):not([data-panel="default"]) { height: calc(100vh - 52px); }
.items-toolbar { min-height: 78px; padding: 13px 20px; grid-template-columns: minmax(150px,.8fr) minmax(240px,440px) 1fr; gap: 18px; background: rgba(5,9,6,.86); border-bottom-color: rgba(24,244,59,.15); }
.items-heading h1 { margin-top: 3px; font-size: 20px; }.items-kicker { font-size: 7px; }
.search-box { height: 36px; border-color: rgba(24,244,59,.2); background: rgba(0,0,0,.42); border-radius: 18px; padding: 0 13px; }
.search-box:focus-within { border-color: #18f43b; box-shadow: 0 0 0 2px rgba(24,244,59,.08), 0 0 18px rgba(24,244,59,.08); }
.search-box input { font-size: 11px; }.search-box kbd { border-color: rgba(24,244,59,.16); border-radius: 4px; }
.view-btn, .toolbar-actions select { height: 36px; border: 1px solid rgba(24,244,59,.24); background-color: rgba(8,15,10,.96); border-radius: 11px; box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 6px 20px rgba(0,0,0,.16); }
.toolbar-actions { position: relative; padding-right: 0; }
.toolbar-actions select { min-width: 116px; padding: 0 36px 0 13px; appearance: none; -webkit-appearance: none; color: #dce2dd; font-size: 9px; font-weight: 700; letter-spacing: .65px; text-transform: uppercase; cursor: pointer; outline: none; transition: border-color .18s, background-color .18s, box-shadow .18s; }
.toolbar-actions::after { content: '\f078'; position: absolute; right: 13px; top: 50%; transform: translateY(-50%); color: #18f43b; font: 900 9px/1 "Font Awesome 6 Free"; pointer-events: none; }
.toolbar-actions select:hover { border-color: rgba(24,244,59,.55); background-color: rgba(14,27,17,.98); }
.toolbar-actions select:focus { border-color: #18f43b; box-shadow: 0 0 0 3px rgba(24,244,59,.09), 0 8px 24px rgba(0,0,0,.25); }
.toolbar-actions select option { color: #e8ece9; background: #0b110d; font-weight: 600; }
.view-btn.active { color: #18f43b; border-color: rgba(24,244,59,.55); }
.items-container { padding: 16px 20px 80px; grid-template-columns: repeat(auto-fill, minmax(138px, 1fr)); gap: 10px; scrollbar-color: rgba(24,244,59,.5) rgba(8,12,9,.8); }
.item-card { min-height: 205px; border-color: rgba(24,244,59,.15); border-radius: 12px; background: rgba(15,19,16,.94); box-shadow: 0 8px 24px rgba(0,0,0,.22); }
.item-card:hover { transform: translateY(-2px); border-color: rgba(24,244,59,.55); box-shadow: 0 10px 28px rgba(0,0,0,.4), 0 0 18px rgba(24,244,59,.08); }
.item-image-wrap { height: 103px; border-bottom-color: rgba(24,244,59,.11); border-radius: 11px 11px 0 0; background: radial-gradient(circle, rgba(36,55,40,.9), rgba(12,17,13,.95) 72%); }
.item-image { padding: 9px; }.rarity-line { width: 2px; background: #18f43b; }.item-card[data-rarity="legendary"] .rarity-line { background: #18f43b; }
.item-meta { padding: 8px 10px 6px; }.item-type { color: #18f43b; font-size: 6.5px; }.item-name { padding: 3px 0 1px; font-size: 11px; }.item-meta code { font-size: 7.5px; }
.item-quantity-inline { height: 32px; padding: 4px 7px; border-top-color: rgba(24,244,59,.1); background: rgba(3,6,4,.52); }
.qty-btn-inline { width: 23px; height: 22px; border-color: rgba(24,244,59,.2); background: rgba(17,25,18,.9); border-radius: 6px; }.qty-btn-inline:hover { background: #18f43b; border-color: #18f43b; }
.selection-dock { left: calc(50% + 48px); height: 52px; bottom: 14px; background: rgba(5,10,6,.96); border-color: rgba(24,244,59,.35); border-radius: 14px; }
.spawn-btn { height: 36px; background: linear-gradient(135deg,#0b8c25,#18f43b); color: #021005; border-radius: 10px; }.spawn-btn:hover { background: #18f43b; }
.modal-content { width: min(92vw, 780px); height: min(88vh, 700px); max-height: 88vh; background: #090d0a; border-color: rgba(24,244,59,.32); border-radius: 16px; box-shadow: 0 24px 80px rgba(0,0,0,.7), 0 0 30px rgba(24,244,59,.07); }
.modal-header { padding: 14px 18px; gap: 14px; background: linear-gradient(120deg,rgba(19,35,22,.98),rgba(6,10,7,.98)); border-bottom-color: rgba(24,244,59,.18); }
.modal-image { width: 112px; height: 112px; border-color: rgba(24,244,59,.35); border-radius: 12px; }.modal-header-right h2 { font-size: 20px; }.modal-description { font-size: 12px; }
.modal-body { flex: 0 0 auto; min-height: 0; max-height: none; padding: 12px 18px; overflow: hidden; }.modal-details-text { font-size: 11px; line-height: 1.45; margin-bottom: 9px; padding-bottom: 8px; }.stats-grid { grid-template-columns: repeat(auto-fit,minmax(140px,1fr)); gap: 6px; }.stat-item { min-height: 42px; padding: 6px 8px; border-color: rgba(24,244,59,.12); border-radius: 9px; }.stat-icon { width: 24px; height: 24px; background: rgba(24,244,59,.1); color: #18f43b; border-radius: 7px; }.stat-label { font-size: 8px; }.stat-value { font-size: 11px; }
#modalFooter { flex: 1 1 0; min-height: 0; max-height: none; padding: 9px 12px 10px; gap: 8px; overflow: hidden; background: #060907; border-top-color: rgba(24,244,59,.15); }
#modalFooter:not(.has-extras) { flex: 0 0 auto; min-height: 66px; padding: 11px 16px; }
#modalFooter:not(.has-extras) .footer-content { height: auto; min-height: 0; align-items: center; justify-content: center; }
.quantity-control { min-height: 38px; padding: 4px 6px; gap: 7px; border: 1px solid rgba(24,244,59,.15); border-radius: 12px; background: rgba(13,20,15,.9); }
.quantity-label { margin: 0 5px 0 3px; color: #7f8981; font-size: 8px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; }
.quantity-control input { width: 62px; height: 30px; padding: 4px; border-width: 1px; border-radius: 7px; font-size: 13px; background: #080d09; }
.quantity-control input::-webkit-inner-spin-button, .quantity-control input::-webkit-outer-spin-button { appearance: none; margin: 0; }
.qty-btn { width: 30px; height: 30px; border-width: 1px; border-radius: 7px; font-size: 15px; }
.stat-icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 auto; padding: 0 !important; text-align: center; line-height: 1 !important; }
.stat-icon::before { display: block; width: 1em; line-height: 1; text-align: center; }
.footer-content { min-height: 0; height: 100%; gap: 9px; }
.extras-section { flex: 1 1 auto; min-height: 100px; max-height: none; overflow: hidden; border-color: rgba(24,244,59,.17); border-radius: 11px; background: rgba(10,15,11,.9); }
.extras-section h3 { flex: 0 0 auto; padding: 8px 11px; background: rgba(18,29,20,.96); border-bottom-color: rgba(24,244,59,.14); }.extras-section h3 i { color: #18f43b; }
#extrasList { flex: 1 1 auto; min-height: 0; max-height: 100%; padding: 9px 10px 14px; gap: 10px; overflow-y: auto !important; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #18f43b #111712; }
#extrasList::-webkit-scrollbar { width: 8px; } #extrasList::-webkit-scrollbar-track { background: #111712; border-radius: 8px; } #extrasList::-webkit-scrollbar-thumb { background: #18f43b; border-radius: 8px; border: 2px solid #111712; }
.extras-items-container { grid-template-columns: repeat(auto-fill,minmax(82px,1fr)); gap: 7px; }.extra-item-card { border-color: rgba(24,244,59,.12); border-radius: 9px; background: #111713; }.extra-item-image { height: 52px; }.extra-item-info { padding: 5px; }.extra-item-name { font-size: 9px; }
.quantity-control { flex: 0 0 auto; }.quantity-control input { height: 32px; padding: 5px; border-color: #18f43b; border-radius: 8px; }.qty-btn { width: 32px; height: 32px; border-color: #18f43b; color: #18f43b; border-radius: 8px; }
@media (max-width: 850px) { .sidebar { width: 82px; }.sidebar-btn span,.sidebar-btn.active span { font-size: 8px; }.items-toolbar { padding: 11px 14px; }.items-container { padding: 12px 14px 76px; grid-template-columns: repeat(auto-fill,minmax(128px,1fr)); }.selection-dock { left: calc(50% + 41px); } }

/* Small-window behavior: only the extras list scrolls */
@media (max-width: 680px) {
    .topbar { height: 46px; padding: 0 10px; }.brand-mark { width: 28px; height: 28px; font-size: 17px; }.brand-copy p { font-size: 10px; }.brand-copy span { font-size: 6px; }
    .content { min-height: calc(100vh - 46px); }.sidebar { width: 72px; }.sidebar-btn { height: 52px; }.sidebar-btn i { font-size: 14px; }.sidebar-btn span,.sidebar-btn.active span { font-size: 7px; letter-spacing: .2px; }
    .tab-panel:not([data-panel="map"]):not([data-panel="settings"]):not([data-panel="default"]) { height: calc(100vh - 46px); }
    .items-toolbar { min-height: 66px; grid-template-columns: 110px minmax(140px,1fr); gap: 9px; padding: 9px 10px; }.items-heading h1 { font-size: 15px; }.items-kicker { font-size: 5.5px; letter-spacing: 1px; }.search-box { height: 32px; }.search-box kbd { display: none; }
    .items-container { padding: 9px 10px 70px; grid-template-columns: repeat(auto-fill,minmax(112px,1fr)); gap: 7px; }.item-card { min-height: 178px; }.item-image-wrap { height: 84px; }.item-meta { padding: 6px 8px 4px; }.item-name { font-size: 10px; }.item-quantity-inline { height: 30px; }
    .selection-dock { left: calc(50% + 36px); width: calc(100vw - 88px); }.spawn-btn { padding: 0 12px; font-size: 8px; }
    .modal { padding: 6px; }.modal-content { width: 100%; height: calc(100vh - 12px); max-height: calc(100vh - 12px); border-radius: 12px; }.modal-header { padding: 9px 12px; gap: 10px; }.modal-image { width: 76px; height: 76px; }.modal-header-right h2 { margin-bottom: 5px; font-size: 16px; }.modal-description { margin-bottom: 6px; font-size: 10px; line-height: 1.3; }.rarity-badge { padding: 3px 8px; font-size: 8px; }.modal-close { top: 7px; right: 7px; width: 30px; height: 30px; font-size: 24px; }
    .modal-body { padding: 8px 12px; }.modal-details-text { font-size: 9px; margin-bottom: 6px; padding-bottom: 5px; }.stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px; }.stat-item { min-height: 34px; padding: 4px 6px; gap: 6px; }.stat-icon { width: 21px; height: 21px; font-size: 10px; }.stat-label { font-size: 6.5px; }.stat-value { font-size: 9px; }
    #modalFooter { padding: 7px 9px 8px; }.extras-section { min-height: 70px; }.extras-section h3 { padding: 6px 9px; font-size: 9px; }.extras-items-container { grid-template-columns: repeat(auto-fill,minmax(72px,1fr)); gap: 5px; }.extra-item-image { height: 44px; }.quantity-control { gap: 6px; }.quantity-control input { width: 58px; height: 28px; }.qty-btn { width: 28px; height: 28px; }
}

@media (max-height: 700px) {
    .modal-content { height: 94vh; max-height: 94vh; }.modal-header { padding-top: 8px; padding-bottom: 8px; }.modal-image { width: 78px; height: 78px; }.modal-header-right h2 { font-size: 17px; margin-bottom: 5px; }.modal-description { margin-bottom: 5px; font-size: 10px; }.modal-body { padding-top: 7px; padding-bottom: 7px; }.modal-details-text { display: none; }.stat-item { min-height: 32px; padding: 3px 6px; }.stat-icon { width: 21px; height: 21px; }.stat-value { font-size: 9px; } #modalFooter { padding-top: 6px; padding-bottom: 7px; }
}

@media (max-height: 520px) {
    .modal-content { height: 98vh; max-height: 98vh; }.modal-header { min-height: 54px; }.modal-image { width: 50px; height: 50px; }.modal-description { display: none; }.modal-body { padding: 4px 9px; }.stats-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }.stat-item { min-height: 27px; }.stat-icon { display: none; }.quantity-control input,.qty-btn { height: 25px; }.qty-btn { width: 26px; }
}

/* Queue viewer */
.selection-summary { padding:0; border:0; background:transparent; color:inherit; text-align:left; }
.selection-view { height:34px; display:flex; align-items:center; gap:7px; margin-left:18px; padding:0 11px; border:1px solid rgba(24,244,59,.2); border-radius:9px; background:rgba(24,244,59,.06); color:#aeb7b0; font-size:8px; font-weight:800; letter-spacing:.45px; text-transform:uppercase; cursor:pointer; transition:.16s; }.selection-view > i:first-child { color:#18f43b; }.selection-view > i:last-child { margin-left:2px; color:#657068; font-size:7px; transition:transform .16s; }.selection-view:hover { border-color:#18f43b; background:rgba(24,244,59,.13); color:#fff; box-shadow:0 0 16px rgba(24,244,59,.08); }.selection-view:hover > i:last-child { color:#18f43b; transform:translateY(-2px); }
.queue-modal-content { position: relative; width: min(92vw,680px); height: min(82vh,660px); display: flex; flex-direction: column; overflow: hidden; border: 1px solid rgba(24,244,59,.32); border-radius: 16px; background: #080c09; box-shadow: 0 24px 80px rgba(0,0,0,.75),0 0 28px rgba(24,244,59,.08); }
.queue-header { flex: 0 0 auto; min-height: 76px; display: flex; align-items: center; padding: 16px 20px; border-bottom: 1px solid rgba(24,244,59,.16); background: linear-gradient(120deg,rgba(18,35,21,.98),rgba(5,9,6,.98)); }.queue-header h2 { margin-top: 3px; font-size: 22px; }.queue-header .modal-close { top: 10px; right: 12px; }
.queue-list { flex: 1 1 auto; min-height: 0; padding: 12px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #18f43b #101611; }
.queue-entry { min-height: 68px; display: grid; grid-template-columns: 52px minmax(0,1fr) auto 30px; align-items: center; gap: 11px; margin-bottom: 8px; padding: 7px 9px; border: 1px solid rgba(24,244,59,.14); border-radius: 11px; background: rgba(15,22,16,.92); }.queue-entry img { width: 52px; height: 52px; object-fit: contain; border-radius: 8px; background: radial-gradient(circle,#29372b,#111612); }.queue-entry-copy { min-width: 0; display: flex; flex-direction: column; gap: 3px; }.queue-entry-copy strong { overflow: hidden; color: #eee; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }.queue-entry-copy span { overflow: hidden; color: #778078; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.ammo-options { grid-column: 1 / -1; display: flex; align-items: center; gap: 18px; padding: 8px 6px 3px; border-top: 1px solid rgba(24,244,59,.1); }.ammo-max { display: flex; align-items: center; gap: 7px; color: #bac1bb; font-size: 9px; cursor: pointer; }.ammo-max input { position: absolute; opacity: 0; }.ammo-max span { width: 30px; height: 17px; position: relative; border: 1px solid rgba(24,244,59,.28); border-radius: 10px; background: #101712; }.ammo-max span::after { content: ''; position: absolute; width: 11px; height: 11px; left: 2px; top: 2px; border-radius: 50%; background: #697069; transition: .18s; }.ammo-max input:checked + span { background: rgba(24,244,59,.2); border-color: #18f43b; }.ammo-max input:checked + span::after { left: 15px; background: #18f43b; box-shadow: 0 0 8px rgba(24,244,59,.5); }.ammo-slider { flex: 1; display: flex; align-items: center; gap: 9px; }.ammo-slider.disabled { display: none; }.ammo-slider input { flex: 1; accent-color: #18f43b; }.ammo-slider output { min-width: 58px; color: #18f43b; font-size: 9px; font-weight: 700; }
.spawn-btn:disabled { opacity: .65; cursor: wait; }.spawn-notice { position: fixed; z-index: 3000; left: 50%; top: 18px; transform: translate(-50%,-80px); max-width: min(90vw,520px); padding: 11px 16px; border: 1px solid rgba(24,244,59,.3); border-radius: 10px; background: #0b120d; color: #e8ece9; box-shadow: 0 12px 36px rgba(0,0,0,.45); font-size: 11px; opacity: 0; transition: .22s; }.spawn-notice.show { transform: translate(-50%,0); opacity: 1; }.spawn-notice.error { border-color: rgba(255,82,82,.5); color: #ffaaaa; }.spawn-notice.success { border-color: #18f43b; }
.queue-entry-qty { display: flex; align-items: center; gap: 7px; }.queue-entry-qty button,.queue-remove { width: 27px; height: 27px; border: 1px solid rgba(24,244,59,.25); border-radius: 7px; background: #111912; color: #cbd0cc; cursor: pointer; }.queue-entry-qty button:hover { background: #18f43b; color: #041006; }.queue-entry-qty b { min-width: 20px; text-align: center; font-size: 11px; }.queue-remove { border: 0; background: transparent; color: #7a817b; }.queue-remove:hover { color: #ff5c5c; }
.queue-empty { height: 100%; min-height: 220px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; color: #6e766f; }.queue-empty i { margin-bottom: 8px; color: #18f43b; font-size: 28px; }.queue-empty strong { color: #dfe2df; }.queue-empty span { font-size: 10px; }
.queue-footer { flex: 0 0 auto; min-height: 60px; display: flex; justify-content: flex-end; align-items: center; gap: 9px; padding: 10px 12px; border-top: 1px solid rgba(24,244,59,.15); background: #060907; }.queue-clear-btn { height: 36px; padding: 0 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 9px; background: transparent; color: #9ba19c; font-size: 9px; cursor: pointer; }.queue-clear-btn:hover { border-color: #ff5c5c; color: #ff7474; }

/* Comfortable scale on large desktop and fullscreen viewports */
@media (min-width: 1400px) and (min-height: 700px) {
    .topbar { height: 62px; padding: 0 22px; }.brand-mark { width: 38px; height: 38px; font-size: 22px; }.brand-copy p { font-size: 14px; }.brand-copy span { font-size: 8px; }
    .content { min-height: calc(100vh - 62px); }.sidebar { width: 110px; }.sidebar-btn { height: 68px; gap: 5px; }.sidebar-btn i { font-size: 19px; }.sidebar-btn span,.sidebar-btn.active span { font-size: 10px; }
    .tab-panel:not([data-panel="map"]):not([data-panel="settings"]):not([data-panel="default"]) { height: calc(100vh - 62px); }
    .items-toolbar { min-height: 96px; padding: 17px 30px; grid-template-columns: minmax(190px,.8fr) minmax(360px,560px) 1fr; }.items-heading h1 { font-size: 25px; }.items-kicker { font-size: 8px; }.search-box { height: 42px; }.search-box input { font-size: 12px; }
    .items-container { padding: 22px 30px 94px; grid-template-columns: repeat(auto-fill,minmax(174px,1fr)); gap: 14px; }.item-card { min-height: 250px; }.item-image-wrap { height: 132px; }.item-meta { padding: 10px 12px 8px; }.item-name { font-size: 13px; }.item-meta code { font-size: 8px; }.item-quantity-inline { height: 38px; }.qty-btn-inline { width: 27px; height: 25px; }
    .selection-dock { left: calc(50% + 55px); width: min(600px,calc(100vw - 150px)); height: 60px; }.selection-summary strong { font-size: 14px; }.spawn-btn { height: 42px; padding: 0 24px; font-size: 11px; }
    .modal-content { width: min(88vw,920px); height: min(88vh,780px); }.modal-header { padding: 18px 22px; }.modal-image { width: 130px; height: 130px; }.modal-header-right h2 { font-size: 24px; }.modal-description { font-size: 13px; }.modal-body { padding: 15px 22px; }.modal-details-text { font-size: 12px; }.stats-grid { grid-template-columns: repeat(auto-fit,minmax(170px,1fr)); }.stat-item { min-height: 48px; }.stat-value { font-size: 12px; }.extras-items-container { grid-template-columns: repeat(auto-fill,minmax(96px,1fr)); }.extra-item-image { height: 62px; }.extra-item-name { font-size: 10px; }
    .queue-modal-content { width: min(86vw,760px); height: min(80vh,720px); }.queue-entry { min-height: 78px; grid-template-columns: 60px minmax(0,1fr) auto 34px; }.queue-entry img { width: 60px; height: 60px; }.queue-entry-copy strong { font-size: 14px; }
}

@media (max-width: 560px) {
    .queue-modal-content { width: calc(100vw - 12px); height: calc(100vh - 12px); }.queue-header { min-height: 62px; padding: 11px 14px; }.queue-header h2 { font-size: 17px; }.queue-entry { grid-template-columns: 42px minmax(0,1fr) auto 25px; gap: 6px; padding: 6px; }.queue-entry img { width: 42px; height: 42px; }.queue-entry-qty { gap: 3px; }.queue-entry-qty button { width: 23px; height: 23px; }.queue-footer { min-height: 52px; }.queue-clear-btn { padding: 0 9px; }
}

/* Detail dialogs without extras should wrap their content instead of reserving an empty scroll area. */
.modal-content:not(:has(#modalFooter.has-extras)) { height: auto; max-height: calc(100vh - 16px); }

/* Custom sort dropdown */
.toolbar-actions::after { content: none; }
.sort-dropdown { position: relative; min-width: 148px; }
.sort-trigger { width: 100%; height: 38px; display: grid; grid-template-columns: 18px 1fr 14px; align-items: center; gap: 8px; padding: 0 11px; border: 1px solid rgba(24,244,59,.38); border-radius: 12px; background: linear-gradient(180deg,rgba(15,25,17,.98),rgba(7,13,9,.98)); color: #edf1ee; box-shadow: inset 0 1px 0 rgba(255,255,255,.04),0 8px 24px rgba(0,0,0,.22); font-size: 9px; font-weight: 800; letter-spacing: .65px; text-align: left; text-transform: uppercase; cursor: pointer; transition: .18s ease; }
.sort-trigger > i:first-child { color: #18f43b; font-size: 11px; text-align: center; }.sort-trigger .sort-chevron { color: #18f43b; font-size: 8px; text-align: center; transition: transform .18s ease; }
.sort-trigger:hover,.sort-dropdown.open .sort-trigger { border-color: #18f43b; background: linear-gradient(180deg,rgba(20,38,24,.99),rgba(8,17,11,.99)); box-shadow: 0 0 0 3px rgba(24,244,59,.07),0 10px 28px rgba(0,0,0,.28); }.sort-dropdown.open .sort-chevron { transform: rotate(180deg); }
.sort-menu { position: absolute; z-index: 80; top: calc(100% + 7px); right: 0; width: 100%; padding: 5px; border: 1px solid rgba(24,244,59,.28); border-radius: 12px; background: rgba(7,13,9,.99); box-shadow: 0 18px 42px rgba(0,0,0,.62),0 0 20px rgba(24,244,59,.06); backdrop-filter: blur(12px); animation: sortMenuIn .14s ease-out; }
.sort-menu[hidden] { display: none; }
@keyframes sortMenuIn { from { opacity: 0; transform: translateY(-5px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
.sort-menu button { width: 100%; min-height: 34px; display: flex; align-items: center; justify-content: space-between; padding: 0 9px; border: 0; border-radius: 8px; background: transparent; color: #aeb6b0; font-size: 9px; font-weight: 700; letter-spacing: .45px; text-transform: uppercase; cursor: pointer; transition: .14s ease; }
.sort-menu button span { display: flex; align-items: center; gap: 9px; }.sort-menu button span i { width: 13px; color: #69726b; text-align: center; }.sort-menu button > i { color: #18f43b; font-size: 8px; opacity: 0; }
.sort-menu button:hover { background: rgba(24,244,59,.09); color: #f3f5f3; }.sort-menu button:hover span i,.sort-menu button.selected span i { color: #18f43b; }.sort-menu button.selected { background: linear-gradient(90deg,rgba(24,244,59,.14),rgba(24,244,59,.04)); color: #fff; }.sort-menu button.selected > i { opacity: 1; }
@media (max-width: 850px) { .toolbar-actions { display: flex; }.sort-dropdown { min-width: 126px; }.sort-trigger { height: 34px; font-size: 8px; } }
@media (max-width: 520px) { .items-toolbar { grid-template-columns: 1fr; }.toolbar-actions { justify-self: stretch; }.sort-dropdown { width: 100%; }.sort-menu { position: static; margin-top: 6px; } }

/* Bundles and saved presets */
.collection-page { height: 100%; display: flex; flex-direction: column; overflow: hidden; }.collection-header { min-height: 90px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 28px; border-bottom: 1px solid rgba(24,244,59,.15); background: rgba(5,9,6,.86); }.collection-header h1 { margin-top: 4px; font-size: 24px; letter-spacing: 1px; }.collection-create { height: 38px; padding: 0 15px; border: 1px solid rgba(24,244,59,.35); border-radius: 10px; background: rgba(24,244,59,.1); color: #18f43b; font-size: 9px; font-weight: 800; text-transform: uppercase; cursor: pointer; }.collection-create:hover { background: #18f43b; color: #061008; }
.collection-grid { flex: 1; min-height: 0; display: grid; grid-template-columns: repeat(auto-fill,minmax(280px,1fr)); align-content: start; gap: 14px; padding: 22px 28px 90px; overflow-y: auto; }.collection-card { position: relative; min-height: 230px; display: flex; flex-direction: column; padding: 18px; overflow: hidden; border: 1px solid color-mix(in srgb,var(--collection-color) 38%,transparent); border-radius: 15px; background: linear-gradient(145deg,color-mix(in srgb,var(--collection-color) 8%,#111713),#0b100c 65%); box-shadow: 0 12px 34px rgba(0,0,0,.24); }.collection-card::before { content:''; position:absolute; inset:0 0 auto; height:2px; background:var(--collection-color); box-shadow:0 0 18px var(--collection-color); }.collection-card-top { display:flex; align-items:center; gap:12px; }.collection-icon { width:48px; height:48px; display:grid; place-items:center; border:1px solid color-mix(in srgb,var(--collection-color) 45%,transparent); border-radius:13px; background:color-mix(in srgb,var(--collection-color) 12%,transparent); color:var(--collection-color); font-size:19px; }.collection-card-top span { color:var(--collection-color); font-size:7px; font-weight:900; letter-spacing:1.2px; }.collection-card h2 { margin-top:3px; font-size:19px; }.collection-card > p { flex:1; margin:15px 0 10px; color:#89918a; font-size:11px; line-height:1.55; }.collection-meta { color:#737b74; font-size:9px; }.collection-meta i { margin-right:6px; color:var(--collection-color); }.collection-actions { display:flex; justify-content:flex-end; gap:6px; margin-top:14px; padding-top:12px; border-top:1px solid rgba(255,255,255,.07); }.collection-actions button { height:32px; padding:0 10px; border:1px solid rgba(255,255,255,.12); border-radius:8px; background:#101611; color:#aeb5af; font-size:8px; font-weight:700; cursor:pointer; }.collection-actions button:hover { border-color:var(--collection-color); color:var(--collection-color); }.collection-actions button.primary { margin-left:auto; border-color:var(--collection-color); background:var(--collection-color); color:#041006; }.collection-empty { grid-column:1/-1; min-height:320px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:#6f7770; }.collection-empty i { margin-bottom:8px; color:#18f43b; font-size:28px; }.collection-empty strong { color:#e1e5e2; }.collection-empty span { font-size:10px; }
.preset-editor { position:relative; width:min(92vw,560px); overflow:hidden; border:1px solid rgba(24,244,59,.3); border-radius:16px; background:#090e0a; box-shadow:0 24px 80px rgba(0,0,0,.75); }.preset-form { display:grid; grid-template-columns:1fr 90px; gap:15px; padding:18px; }.preset-form > label { display:flex; flex-direction:column; gap:7px; color:#7f8881; font-size:8px; font-weight:800; letter-spacing:.8px; text-transform:uppercase; }.preset-form input[type="text"],#presetName { height:38px; padding:0 11px; border:1px solid rgba(24,244,59,.2); border-radius:9px; outline:0; background:#070b08; color:#eee; }.preset-form input[type="color"] { width:100%; height:38px; padding:3px; border:1px solid rgba(24,244,59,.2); border-radius:9px; background:#070b08; cursor:pointer; }.preset-form fieldset { grid-column:1/-1; padding:0; border:0; }.preset-form legend { margin-bottom:8px; color:#7f8881; font-size:8px; font-weight:800; letter-spacing:.8px; text-transform:uppercase; }.icon-picker { display:grid; grid-template-columns:repeat(10,1fr); gap:5px; }.icon-picker input { position:absolute; opacity:0; }.icon-picker span { height:38px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.1); border-radius:8px; color:#747c76; cursor:pointer; }.icon-picker input:checked + span { border-color:#18f43b; background:rgba(24,244,59,.12); color:#18f43b; }.preset-queue-option { grid-column:1/-1; flex-direction:row !important; align-items:center; text-transform:none !important; cursor:pointer; }.preset-queue-option input { accent-color:#18f43b; }
@media (max-width:680px) { .collection-header { min-height:70px; padding:12px 14px; }.collection-header h1 { font-size:18px; }.collection-grid { grid-template-columns:1fr; padding:14px 14px 80px; }.preset-form { grid-template-columns:1fr 72px; padding:13px; }.icon-picker { grid-template-columns:repeat(5,1fr); } }

.bundle-multiplier { display:inline-flex; align-items:center; gap:5px; margin-left:14px; padding:3px 5px 3px 8px; border:1px solid color-mix(in srgb,var(--collection-color) 25%,transparent); border-radius:9px; background:rgba(0,0,0,.2); }.bundle-multiplier span { margin-right:2px; color:#7d857e; font-size:7px; font-weight:800; letter-spacing:.7px; text-transform:uppercase; }.bundle-multiplier button { width:22px; height:22px; padding:0; border:1px solid color-mix(in srgb,var(--collection-color) 28%,transparent); border-radius:6px; background:rgba(12,20,14,.9); color:var(--collection-color); cursor:pointer; }.bundle-multiplier button:hover { background:var(--collection-color); color:#041006; }.bundle-multiplier b { min-width:28px; color:#eef1ee; font-size:10px; text-align:center; }
.preset-color-field { min-width:0; }.color-picker-modern { position:relative; height:38px; display:grid; grid-template-columns:34px 1fr 22px; align-items:center; gap:8px; padding:3px 8px 3px 3px; overflow:hidden; border:1px solid rgba(24,244,59,.2); border-radius:10px; background:linear-gradient(180deg,#0d140f,#070b08); cursor:pointer; transition:.18s; }.color-picker-modern:hover { border-color:#18f43b; box-shadow:0 0 0 3px rgba(24,244,59,.07); }.color-picker-modern input[type="color"] { width:34px; height:30px; padding:0; border:0; border-radius:7px; overflow:hidden; background:transparent; }.color-picker-modern input::-webkit-color-swatch-wrapper { padding:0; }.color-picker-modern input::-webkit-color-swatch { border:0; border-radius:6px; }.color-picker-modern span { color:#dce1dd; font:700 9px/1 monospace; letter-spacing:.3px; }.color-picker-modern i { color:#18f43b; font-size:10px; text-align:center; }

@media (max-width:850px), (max-height:700px) { .sidebar { width:66px; }.sidebar-btn { height:47px; min-height:47px; padding:3px 2px; gap:2px; }.sidebar-btn i { font-size:13px; }.sidebar-btn span,.sidebar-btn.active span { font-size:6.5px; line-height:1; letter-spacing:.15px; }.selection-dock { left:calc(50% + 33px); } }
@media (max-width:520px), (max-height:540px) { .sidebar { width:56px; }.sidebar-btn { height:41px; min-height:41px; }.sidebar-btn i { font-size:12px; }.sidebar-btn span,.sidebar-btn.active span { font-size:5.5px; }.selection-dock { left:calc(50% + 28px); width:calc(100vw - 68px); } }

/* Queue item modifiers */
.item-modifiers { grid-column:1/-1; display:flex; flex-direction:column; gap:8px; padding:8px 6px 3px; border-top:1px solid rgba(24,244,59,.1); }.item-modifiers .ammo-options { grid-column:auto; padding:0; border-top:0; }.health-slider { display:flex; align-items:center; gap:10px; }.health-slider > span { min-width:105px; color:#aab2ac; font-size:9px; }.health-slider > span i { width:14px; margin-right:5px; color:#18f43b; text-align:center; }.health-slider input { flex:1; accent-color:#18f43b; cursor:pointer; }.health-slider output { min-width:38px; color:#18f43b; font-size:9px; font-weight:800; text-align:right; }

/* More compact bundle cards */
.collection-grid { grid-template-columns:repeat(auto-fill,minmax(245px,1fr)); gap:10px; padding-top:16px; }.collection-card { min-height:185px; padding:13px; border-radius:13px; }.collection-icon { width:40px; height:40px; border-radius:11px; font-size:16px; }.collection-card h2 { font-size:16px; }.collection-card > p { margin:10px 0 7px; font-size:10px; line-height:1.4; }.collection-actions { margin-top:9px; padding-top:9px; }.collection-actions button { height:29px; padding:0 8px; }.bundle-multiplier { margin-left:9px; }

/* Neutral, non-highlighted modifier sliders */
.ammo-slider input,.health-slider input { height:16px; appearance:none; -webkit-appearance:none; outline:none !important; border:0; border-radius:8px; background:#303632; box-shadow:none !important; accent-color:#858d87; cursor:pointer; }.ammo-slider input:focus,.ammo-slider input:active,.health-slider input:focus,.health-slider input:active { outline:none !important; box-shadow:none !important; }.ammo-slider input::-webkit-slider-runnable-track,.health-slider input::-webkit-slider-runnable-track { height:4px; border-radius:4px; background:#303632; }.ammo-slider input::-webkit-slider-thumb,.health-slider input::-webkit-slider-thumb { width:14px; height:14px; margin-top:-5px; appearance:none; -webkit-appearance:none; border:2px solid #59615b; border-radius:50%; background:#b7bdb8; box-shadow:none; }.ammo-slider input::-moz-range-track,.health-slider input::-moz-range-track { height:4px; border:0; border-radius:4px; background:#303632; }.ammo-slider input::-moz-range-progress,.health-slider input::-moz-range-progress { background:#303632; }.ammo-slider input::-moz-range-thumb,.health-slider input::-moz-range-thumb { width:12px; height:12px; border:2px solid #59615b; border-radius:50%; background:#b7bdb8; box-shadow:none; }

/* Queue overview and collection preview */
.queue-overview { position:sticky; z-index:3; top:0; display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-bottom:10px; padding-bottom:10px; background:#080c09; }.queue-overview > div { display:flex; flex-direction:column; gap:3px; padding:8px 10px; border:1px solid rgba(255,255,255,.08); border-radius:9px; background:#111713; }.queue-overview span { color:#6f7771; font-size:6.5px; font-weight:900; letter-spacing:.8px; }.queue-overview strong { color:#e9ecea; font-size:13px; }
.collection-preview-content { width:min(92vw,620px); height:min(78vh,620px); }.preview-list { flex:1; min-height:0; padding:12px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:#4f5851 #0b100c; }.preview-entry { min-height:62px; display:grid; grid-template-columns:48px 1fr auto; align-items:center; gap:11px; margin-bottom:7px; padding:7px 10px; border:1px solid rgba(24,244,59,.12); border-radius:10px; background:#101612; }.preview-entry img { width:48px; height:48px; object-fit:contain; border-radius:7px; background:#202722; }.preview-entry > div { min-width:0; display:flex; flex-direction:column; gap:3px; }.preview-entry strong { overflow:hidden; color:#e6e9e7; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }.preview-entry span { overflow:hidden; color:#747d76; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }.preview-entry > b { min-width:42px; color:#18f43b; font-size:12px; text-align:right; }

.ammo-slider input,.health-slider input { background:linear-gradient(to right,var(--slider-color) 0,var(--slider-color) var(--slider-value),#303632 var(--slider-value),#303632 100%); }.ammo-slider input::-webkit-slider-runnable-track,.health-slider input::-webkit-slider-runnable-track { background:transparent; }.ammo-slider input::-webkit-slider-thumb,.health-slider input::-webkit-slider-thumb { border-color:var(--slider-color); background:var(--slider-color); }.ammo-slider input:hover::-webkit-slider-thumb,.health-slider input:hover::-webkit-slider-thumb,.ammo-slider input:active::-webkit-slider-thumb,.health-slider input:active::-webkit-slider-thumb { border-color:var(--slider-color); background:var(--slider-color); box-shadow:0 0 0 4px color-mix(in srgb,var(--slider-color) 14%,transparent); }.ammo-slider input::-moz-range-progress,.health-slider input::-moz-range-progress { background:var(--slider-color); }.ammo-slider input::-moz-range-thumb,.health-slider input::-moz-range-thumb { border-color:var(--slider-color); background:var(--slider-color); }.ammo-slider input:hover::-moz-range-thumb,.health-slider input:hover::-moz-range-thumb { background:var(--slider-color); }

/* Neutral slider handle; only the progress track represents the percentage color. */
.ammo-slider input::-webkit-slider-thumb,.health-slider input::-webkit-slider-thumb { border-color:#59615b; background:#d4dad5; box-shadow:0 1px 4px rgba(0,0,0,.55); }.ammo-slider input:hover::-webkit-slider-thumb,.health-slider input:hover::-webkit-slider-thumb,.ammo-slider input:active::-webkit-slider-thumb,.health-slider input:active::-webkit-slider-thumb { border-color:#737c75; background:#d4dad5; box-shadow:0 0 0 3px rgba(212,218,213,.12),0 1px 4px rgba(0,0,0,.55); }.ammo-slider input::-moz-range-thumb,.health-slider input::-moz-range-thumb { border-color:#59615b; background:#d4dad5; box-shadow:0 1px 4px rgba(0,0,0,.55); }.ammo-slider input:hover::-moz-range-thumb,.health-slider input:hover::-moz-range-thumb { border-color:#737c75; background:#d4dad5; }

.ammo-slider input,.health-slider input { border-radius:999px; background:transparent; }
.ammo-slider input::-webkit-slider-runnable-track,.health-slider input::-webkit-slider-runnable-track { height:6px; border-radius:999px; background:linear-gradient(to right,var(--slider-color) 0,var(--slider-color) var(--slider-value),#303632 var(--slider-value),#303632 100%); }
.ammo-slider input::-webkit-slider-thumb,.health-slider input::-webkit-slider-thumb { margin-top:-4px; }
.ammo-slider input::-moz-range-track,.health-slider input::-moz-range-track { height:6px; border-radius:999px; background:#303632; }
.ammo-slider input::-moz-range-progress,.health-slider input::-moz-range-progress { height:6px; border-radius:999px 0 0 999px; background:var(--slider-color); }

/* Compact grouped settings */
.settings-page { height:100%; display:flex; flex-direction:column; overflow:hidden; }.settings-groups { flex:1; min-height:0; display:grid; grid-template-columns:repeat(2,minmax(280px,1fr)); align-content:start; gap:10px; padding:14px 18px 70px; overflow-y:auto; }.settings-group { padding:12px; border:1px solid rgba(24,244,59,.14); border-radius:12px; background:rgba(12,18,13,.92); }.settings-group-wide { grid-column:1/-1; }.settings-group-title { display:flex; align-items:center; gap:9px; margin-bottom:10px; padding-bottom:9px; border-bottom:1px solid rgba(255,255,255,.07); }.settings-group-title > i { width:31px; height:31px; display:grid; place-items:center; border-radius:8px; background:rgba(24,244,59,.1); color:#18f43b; font-size:12px; }.settings-group-title h2 { font-size:13px; }.settings-group-title span { color:#707971; font-size:8px; }.command-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:7px; margin-top:7px; }.command-row-wide { grid-template-columns:130px 110px minmax(150px,1fr) auto; }.command-row label { min-width:0; display:flex; flex-direction:column; gap:4px; color:#778078; font-size:7px; font-weight:800; letter-spacing:.55px; text-transform:uppercase; }.command-row input,.command-row select { width:100%; height:32px; padding:0 9px; border:1px solid rgba(24,244,59,.16); border-radius:8px; outline:0; background:#070b08; color:#e4e8e5; font-size:9px; }.command-row input:focus,.command-row select:focus { border-color:#18f43b; }.command-row select { appearance:none; cursor:pointer; }.command-row button { height:32px; padding:0 11px; border:1px solid rgba(24,244,59,.32); border-radius:8px; background:rgba(24,244,59,.09); color:#18f43b; font-size:8px; font-weight:800; text-transform:uppercase; cursor:pointer; }.command-row button:hover { background:#18f43b; color:#041006; }.command-row button i { margin-right:5px; }
@media (max-width:850px) { .settings-groups { grid-template-columns:1fr; padding:10px 12px 60px; }.settings-group-wide { grid-column:auto; }.command-row-wide { grid-template-columns:repeat(2,minmax(0,1fr)); }.command-row-wide button { grid-column:2; } }
@media (max-width:540px) { .command-row,.command-row-wide { grid-template-columns:1fr; }.command-row button,.command-row-wide button { grid-column:auto; width:100%; } }
.command-button-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; margin-top:7px; }
.command-button-grid-two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.misc-cutout { margin-top:8px; padding:9px; border:1px solid rgba(24,244,59,.16); border-radius:10px; background:rgba(3,9,5,.5); }
.misc-cutout-title { display:flex; align-items:center; gap:7px; margin-bottom:7px; color:#98a099; font-size:8px; font-weight:900; letter-spacing:.65px; text-transform:uppercase; }
.misc-cutout-title i { color:#18f43b; font-size:9px; }
.misc-cutout > .command-row:first-of-type { margin-top:0; }
.fame-command-grid { display:grid; gap:7px; }
.fame-fields { display:grid; grid-template-columns:120px minmax(180px,1fr); gap:7px; }
.fame-fields label { min-width:0; display:flex; flex-direction:column; gap:4px; color:#778078; font-size:7px; font-weight:800; letter-spacing:.55px; text-transform:uppercase; }
.fame-fields input { width:100%; height:32px; padding:0 9px; border:1px solid rgba(24,244,59,.16); border-radius:8px; outline:0; background:#070b08; color:#e4e8e5; font-size:9px; }
.fame-fields input:focus { border-color:#18f43b; }
.fame-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.fame-actions button { height:32px; border:1px solid rgba(24,244,59,.32); border-radius:8px; background:rgba(24,244,59,.09); color:#18f43b; font-size:8px; font-weight:800; text-transform:uppercase; cursor:pointer; }
.fame-actions button:hover { background:#18f43b; color:#041006; }
.fame-actions button i { margin-right:5px; }
.misc-weather-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.misc-weather-grid .command-row,.misc-cutout .command-button-grid { margin-top:0; }
.misc-info-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.misc-toggle-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
.cleanup-command-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.cleanup-command-grid .command-row { margin-top:0; }
.cleanup-shared-form { display:grid; grid-template-columns:180px minmax(0,1fr); align-items:end; gap:8px; }
.cleanup-main-input { display:flex; flex-direction:column; gap:4px; color:#778078; font-size:7px; font-weight:800; letter-spacing:.55px; text-transform:uppercase; }
.cleanup-main-input input { width:100%; height:34px; padding:0 10px; border:1px solid rgba(24,244,59,.2); border-radius:8px; outline:0; background:#070b08; color:#e4e8e5; font-size:9px; }
.cleanup-main-input input:focus { border-color:#18f43b; }
.cleanup-hint { grid-column:1; align-self:start; color:#59625b; font-size:7px; line-height:1.4; }
.cleanup-actions { grid-column:2; grid-row:1/3; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
.cleanup-actions button,.cleanup-encounter-cutout form button { min-height:38px; display:flex; align-items:center; justify-content:center; gap:6px; padding:6px 8px; border:1px solid rgba(24,244,59,.22); border-radius:8px; background:rgba(24,244,59,.07); color:#aeb7b0; font-size:7px; font-weight:800; text-transform:uppercase; cursor:pointer; }
.cleanup-actions button i,.cleanup-encounter-cutout form button i { color:#18f43b; }
.cleanup-actions button:hover,.cleanup-encounter-cutout form button:hover { background:#18f43b; color:#041006; }.cleanup-actions button:hover i,.cleanup-encounter-cutout form button:hover i { color:#041006; }
.cleanup-flag-form { grid-template-columns:180px minmax(0,1fr); }
.cleanup-actions-two { grid-row:1; grid-template-columns:repeat(2,minmax(0,1fr)); }
.cleanup-encounter-cutout { display:flex; align-items:center; justify-content:space-between; gap:12px; }.cleanup-encounter-cutout .misc-cutout-title { margin-bottom:3px; }.cleanup-encounter-cutout p { color:#59625b; font-size:7px; }.cleanup-encounter-cutout form button { min-width:180px; }
.command-button-grid form button { width:100%; height:32px; padding:0 8px; border:1px solid rgba(24,244,59,.32); border-radius:8px; background:rgba(24,244,59,.09); color:#18f43b; font-size:8px; font-weight:800; text-transform:uppercase; cursor:pointer; }
.command-button-grid form button:hover { background:#18f43b; color:#041006; }
.command-button-grid form button i { margin-right:5px; }
.command-row-attributes { grid-template-columns:repeat(4,minmax(80px,1fr)) auto; }
.command-row-skill { grid-template-columns:minmax(150px,1fr) 110px auto; }
@media (max-width:760px) { .command-button-grid { grid-template-columns:1fr; }.misc-info-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.misc-toggle-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.command-row-attributes { grid-template-columns:repeat(2,minmax(0,1fr)); }.command-row-attributes button { grid-column:1/-1; }.command-row-skill { grid-template-columns:1fr 1fr; }.command-row-skill button { grid-column:1/-1; } }
@media (max-width:620px) { .misc-weather-grid { grid-template-columns:1fr; }.misc-info-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:620px) { .cleanup-command-grid { grid-template-columns:1fr; } }
@media (max-width:700px) { .cleanup-shared-form,.cleanup-flag-form { grid-template-columns:1fr; }.cleanup-hint { grid-column:1; }.cleanup-actions,.cleanup-actions-two { grid-column:1; grid-row:auto; grid-template-columns:repeat(2,minmax(0,1fr)); }.cleanup-encounter-cutout { align-items:stretch; flex-direction:column; }.cleanup-encounter-cutout form button { width:100%; } }
@media (max-width:540px) { .fame-fields,.fame-actions { grid-template-columns:1fr; } }
@media (max-width:540px) { .command-row-attributes,.command-row-skill { grid-template-columns:1fr; }.command-row-attributes button,.command-row-skill button { grid-column:auto; } }

.settings-header { align-items:center; }.settings-category-nav { display:flex; align-items:center; gap:5px; padding:4px; border:1px solid rgba(24,244,59,.13); border-radius:11px; background:rgba(4,9,6,.65); }.settings-category-nav button { height:33px; display:flex; align-items:center; gap:6px; padding:0 11px; border:0; border-radius:8px; background:transparent; color:#7f8981; font-size:8px; font-weight:800; letter-spacing:.35px; text-transform:uppercase; cursor:pointer; }.settings-category-nav button i { font-size:9px; }.settings-category-nav button:hover { color:#dce2dd; background:rgba(24,244,59,.06); }.settings-category-nav button.active { background:rgba(24,244,59,.14); color:#18f43b; box-shadow:inset 0 0 0 1px rgba(24,244,59,.23); }.settings-groups { display:block; }.settings-group { width:min(100%,900px); margin:0 auto; }.settings-group[hidden] { display:none !important; }
@media (max-width:760px) { .settings-header { align-items:flex-start; flex-direction:column; }.settings-category-nav { width:100%; overflow-x:auto; }.settings-category-nav button { flex:1 0 auto; justify-content:center; padding:0 8px; } }

/* Settings dropdowns matching the item-sort control */
.native-select-hidden { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; opacity:0 !important; pointer-events:none !important; }
.settings-select-dropdown { position:relative; width:100%; }.settings-select-trigger { width:100%; height:32px; display:grid; grid-template-columns:1fr 12px; align-items:center; gap:7px; padding:0 10px; border:1px solid rgba(24,244,59,.2); border-radius:8px; background:linear-gradient(180deg,rgba(15,25,17,.98),rgba(7,13,9,.98)); color:#e4e8e5; font-size:9px; text-align:left; cursor:pointer; transition:.16s; }.settings-select-trigger i { color:#18f43b; font-size:7px; text-align:center; transition:transform .16s; }.settings-select-dropdown.open .settings-select-trigger { border-color:#18f43b; box-shadow:0 0 0 3px rgba(24,244,59,.07); }.settings-select-dropdown.open .settings-select-trigger i { transform:rotate(180deg); }
.settings-select-menu { position:absolute; z-index:100; top:calc(100% + 5px); left:0; width:100%; min-width:130px; padding:5px; border:1px solid rgba(24,244,59,.28); border-radius:10px; background:rgba(7,13,9,.99); box-shadow:0 16px 38px rgba(0,0,0,.6),0 0 18px rgba(24,244,59,.05); backdrop-filter:blur(10px); animation:sortMenuIn .14s ease-out; }.settings-select-menu[hidden] { display:none; }.settings-select-menu button { width:100%; height:31px; display:flex; align-items:center; justify-content:space-between; padding:0 8px; border:0; border-radius:7px; background:transparent; color:#aeb6b0; font-size:8px; font-weight:700; text-align:left; cursor:pointer; }.settings-select-menu button > i { color:#18f43b; font-size:7px; opacity:0; }.settings-select-menu button:hover { background:rgba(24,244,59,.08); color:#fff; }.settings-select-menu button.selected { background:linear-gradient(90deg,rgba(24,244,59,.14),rgba(24,244,59,.04)); color:#fff; }.settings-select-menu button.selected > i { opacity:1; }

/* Keep the browser document fixed; only app panels may scroll. */
html, body { width:100%; height:100%; min-height:0; overflow:hidden !important; }
.page-shell { width:100vw; height:100vh; min-height:0; overflow:hidden; }
.content { flex:1 1 auto; height:calc(100vh - 52px); min-height:0; overflow:hidden; }
.main-content { min-width:0; min-height:0; overflow:hidden; }
.sidebar { height:100%; min-height:0; overflow-x:hidden; overflow-y:auto; }
@media (min-width:1100px) and (min-height:700px) { .content { height:calc(100vh - 62px); } }
@media (max-width:680px) { .content { height:calc(100vh - 46px); } }
.settings-group-title > div { min-width:0; }.settings-clear { width:30px; height:30px; display:grid; place-items:center; margin-left:auto; padding:0; border:1px solid rgba(255,94,94,.16); border-radius:8px; background:rgba(255,94,94,.045); color:#777f79; cursor:pointer; transition:.16s; }.settings-clear i { font-size:10px; }.settings-clear:hover { border-color:rgba(255,94,94,.55); background:rgba(255,94,94,.1); color:#ff7373; }
.settings-page input[type="number"] { appearance:textfield; -moz-appearance:textfield; }
.settings-page input[type="number"]::-webkit-inner-spin-button,.settings-page input[type="number"]::-webkit-outer-spin-button { margin:0; appearance:none; -webkit-appearance:none; }
.settings-select-dropdown.limited-options .settings-select-menu { max-height:134px; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#18f43b #111712; }
.settings-select-dropdown.limited-options .settings-select-menu::-webkit-scrollbar { width:6px; }.settings-select-dropdown.limited-options .settings-select-menu::-webkit-scrollbar-track { background:#111712; border-radius:6px; }.settings-select-dropdown.limited-options .settings-select-menu::-webkit-scrollbar-thumb { background:#18f43b; border-radius:6px; }

/* Größerer und besser lesbarer Einstellungsbereich */
.settings-group { width:min(100%,1120px); padding:16px; }
.settings-group-title { margin-bottom:13px; padding-bottom:12px; }
.settings-group-title > i { width:38px; height:38px; font-size:14px; }
.settings-group-title h2 { font-size:16px; }
.settings-group-title span { font-size:10px; }
.settings-category-nav button { height:38px; padding:0 14px; font-size:10px; }
.settings-category-nav button i { font-size:11px; }
.misc-cutout { margin-top:11px; padding:13px; border-radius:12px; }
.misc-cutout-title { margin-bottom:10px; font-size:10px; }
.misc-cutout-title i { font-size:11px; }
.command-row { gap:9px; margin-top:9px; }
.command-row label,.fame-fields label,.cleanup-main-input { gap:5px; font-size:9px; }
.command-row input,.command-row select,.fame-fields input,.cleanup-main-input input { height:38px; padding:0 11px; font-size:11px; }
.settings-select-trigger { height:38px; padding:0 11px; font-size:11px; }
.settings-select-trigger i { font-size:9px; }
.settings-select-menu button { height:36px; padding:0 10px; font-size:10px; }
.settings-select-dropdown.limited-options .settings-select-menu { max-height:154px; }
.command-row button,.fame-actions button,.command-button-grid form button { height:38px; padding:0 13px; font-size:10px; }
.cleanup-actions button,.cleanup-encounter-cutout form button { min-height:44px; font-size:9px; }
.cleanup-hint,.cleanup-encounter-cutout p { font-size:9px; }
@media (max-height:720px), (max-width:700px) {
  .settings-group { padding:11px; }
  .misc-cutout { margin-top:8px; padding:10px; }
  .settings-group-title > i { width:34px; height:34px; }
  .settings-group-title h2 { font-size:14px; }
  .command-row input,.command-row select,.fame-fields input,.cleanup-main-input input,.command-row button,.fame-actions button,.command-button-grid form button { height:35px; }
}

/* Spieler enthält mehr Formulare und bleibt deshalb etwas kompakter. */
.settings-group[data-settings-group="players"] { width:min(100%,1020px); padding:13px; }
.settings-group[data-settings-group="players"] .settings-group-title { margin-bottom:9px; padding-bottom:9px; }
.settings-group[data-settings-group="players"] .misc-cutout { margin-top:8px; padding:10px; }
.settings-group[data-settings-group="players"] .misc-cutout-title { margin-bottom:7px; }
.settings-group[data-settings-group="players"] .command-row { gap:7px; margin-top:7px; }
.settings-group[data-settings-group="players"] .command-row input,
.settings-group[data-settings-group="players"] .fame-fields input,
.settings-group[data-settings-group="players"] .settings-select-trigger,
.settings-group[data-settings-group="players"] .command-row button,
.settings-group[data-settings-group="players"] .fame-actions button { height:35px; }

/* Ruhiger Reckless-Look: Grün als Akzent statt als flächige Standardfarbe. */
:root {
  --rx-accent:#20cf55;
  --rx-accent-soft:rgba(32,207,85,.11);
  --rx-bg:#070a08;
  --rx-surface:#101412;
  --rx-surface-2:#151a17;
  --rx-line:#29312c;
  --rx-line-strong:#3a4540;
  --rx-text:#e4e8e5;
  --rx-muted:#818a84;
}
.page-shell { box-shadow:0 18px 55px rgba(0,0,0,.62),0 0 0 1px rgba(255,255,255,.035); }
.topbar { background:linear-gradient(90deg,#111713,#171a18); border-bottom-color:var(--rx-line); }
.sidebar { background:#080c0a; border-color:var(--rx-line); }
.sidebar-btn { border-color:rgba(255,255,255,.055); color:#829089; }
.sidebar-btn:hover { background:#111713; color:#d8ded9; }
.sidebar-btn.active { background:linear-gradient(90deg,rgba(32,207,85,.15),rgba(18,24,20,.94)); color:var(--rx-accent); }
.sidebar-btn.active::before { background:var(--rx-accent); box-shadow:none; }
.items-toolbar,.collection-header,.settings-header { border-color:var(--rx-line); background:rgba(8,12,10,.9); }
.search-box,.sort-trigger,.settings-category-nav { border-color:var(--rx-line-strong); background:var(--rx-surface); box-shadow:none; }
.search-box:focus-within,.sort-dropdown.open .sort-trigger { border-color:rgba(32,207,85,.55); box-shadow:0 0 0 3px rgba(32,207,85,.06); }
.sort-menu,.settings-select-menu { border-color:var(--rx-line-strong); background:#111613; box-shadow:0 14px 34px rgba(0,0,0,.55); }
.sort-menu button:hover,.settings-select-menu button:hover { background:rgba(255,255,255,.055); }
.sort-menu button.selected,.settings-select-menu button.selected { background:#1a211d; color:var(--rx-text); }
.item-card { border-color:var(--rx-line); background:linear-gradient(180deg,#121714,#0d110f); box-shadow:none; }
.item-card:hover { border-color:#4a5750; background:linear-gradient(180deg,#171d19,#101512); box-shadow:0 12px 25px rgba(0,0,0,.3); }
.item-card::before { background:var(--rx-accent); opacity:.72; }
.item-image-wrap { background:#171c19; border-color:rgba(255,255,255,.045); }
.qty-btn,.qty-btn-inline,.extra-qty-btn { border-color:var(--rx-line-strong); background:#141a16; color:#c9d0cb; }
.qty-btn:hover,.qty-btn-inline:hover,.extra-qty-btn:hover { border-color:var(--rx-accent); background:var(--rx-accent-soft); color:var(--rx-accent); }
.modal { background:rgba(0,0,0,.76); }
.modal-content,.queue-modal-content { border-color:var(--rx-line-strong); background:#0d120f; box-shadow:0 25px 80px rgba(0,0,0,.72); }
.modal-header,.modal-footer,.queue-header,.queue-footer { border-color:var(--rx-line); background:#111613; }
.stat-item,.extra-item,.queue-entry,.queue-overview > div,.preview-entry { border-color:var(--rx-line); background:var(--rx-surface); }
.extras-category { border-color:var(--rx-line); background:#0d120f; }
.extra-item:hover,.queue-entry:hover { border-color:#455149; background:#151b17; }
.selection-dock { border-color:var(--rx-line-strong); background:rgba(13,18,15,.97); box-shadow:0 12px 35px rgba(0,0,0,.45); }
.selection-clear,.queue-clear-btn { border-color:var(--rx-line-strong); background:#121714; color:#aab2ac; }
.selection-dock .selection-clear { border-color: transparent !important; background: transparent !important; box-shadow: none !important; }
.spawn-btn,.collection-create,.collection-actions .primary { background:var(--rx-accent); border-color:var(--rx-accent); color:#061008; box-shadow:none; }
.spawn-btn:hover,.collection-create:hover,.collection-actions .primary:hover { background:#35dc68; box-shadow:0 8px 22px rgba(32,207,85,.16); }
.collection-card { border-color:var(--rx-line); background:linear-gradient(180deg,#121714,#0d110f); box-shadow:none; }
.collection-card:hover { border-color:#47534c; box-shadow:0 12px 26px rgba(0,0,0,.34); }
.collection-icon { background:#191f1b; border-color:var(--rx-line-strong); }
.settings-group { border-color:var(--rx-line); background:rgba(12,16,14,.95); }
.settings-category-nav button:hover { background:rgba(255,255,255,.05); }
.settings-category-nav button.active { background:#1b241e; color:var(--rx-accent); box-shadow:inset 0 0 0 1px #344139; }
.misc-cutout { border-color:var(--rx-line); background:#0d120f; }
.command-row input,.command-row select,.fame-fields input,.cleanup-main-input input,.settings-select-trigger { border-color:var(--rx-line-strong); background:#111613; }
.command-row input:focus,.command-row select:focus,.fame-fields input:focus,.cleanup-main-input input:focus { border-color:var(--rx-accent); box-shadow:0 0 0 3px rgba(32,207,85,.055); }
.command-row button,.fame-actions button,.command-button-grid form button,.cleanup-actions button,.cleanup-encounter-cutout form button { border-color:var(--rx-line-strong); background:#171d19; color:#c3cbc5; }
.command-row button:hover,.fame-actions button:hover,.command-button-grid form button:hover,.cleanup-actions button:hover,.cleanup-encounter-cutout form button:hover { border-color:var(--rx-accent); background:var(--rx-accent-soft); color:var(--rx-accent); }
.command-row button:hover i,.fame-actions button:hover i,.command-button-grid form button:hover i,.cleanup-actions button:hover i,.cleanup-encounter-cutout form button:hover i { color:var(--rx-accent); }
.settings-clear { border-color:var(--rx-line-strong); background:#151a17; color:#8f9992; }
.settings-clear:hover { border-color:#a84d4d; background:rgba(168,77,77,.1); color:#e47777; }
.items-kicker,.misc-cutout-title i,.settings-group-title > i,.queue-entry i,.topbar-status i { color:var(--rx-accent); }

/* Lokale taktische SCUM-Karte */
.map-shell { height:100%; min-height:0; display:flex; flex-direction:column; background:#080c0a; }
.map-toolbar { min-height:60px; display:grid; grid-template-columns:auto auto 1fr auto; align-items:center; gap:22px; padding:9px 16px; border-bottom:1px solid var(--rx-line); background:#101412; color:var(--rx-text); }
.map-toolbar > div:first-child { display:flex; flex-direction:column; gap:2px; }.map-toolbar strong { font-size:15px; letter-spacing:.5px; }.map-live-coordinates { min-width:250px; display:flex; flex-direction:column; gap:2px; padding-left:15px; border-left:1px solid var(--rx-line); }.map-live-coordinates span { color:var(--rx-accent); font-size:9px; font-weight:900; letter-spacing:1px; }.map-live-coordinates b { color:#c7cec9; font-size:10px; }.map-help { justify-self:end; color:#737d76; font-size:9px; }.map-help i { margin-right:6px; color:#9aa39d; }
.map-viewer { flex:1 1 0; width:100%; height:auto; min-height:0; border-radius:0; background-color:#090d0b; background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),radial-gradient(circle at center,#172019,#080b09 74%); background-size:48px 48px,48px 48px,auto; cursor:grab; }
.map-viewer.dragging { cursor:grabbing; }
.map-canvas { position:absolute; top:50%; left:50%; overflow:hidden; border:1px solid #3a4540; border-radius:5px; transform-origin:center; will-change:transform; pointer-events:none; box-shadow:0 24px 70px rgba(0,0,0,.72),0 0 0 6px rgba(255,255,255,.018); }
.map-full-image { position:absolute; inset:0; width:100%; height:100%; display:block; object-fit:fill; pointer-events:none; filter:saturate(.82) brightness(.86) contrast(1.06); }
.map-detail-layer { position:absolute; inset:0; z-index:1; overflow:hidden; pointer-events:none; }
.map-detail-tile { position:absolute; display:block; object-fit:fill; opacity:0; filter:saturate(.82) brightness(.86) contrast(1.06); transition:opacity .18s ease-out; }
.map-detail-tile.loaded { opacity:1; }
.scum-sector-grid { position:absolute; inset:0; z-index:2; display:grid; grid-template-columns:repeat(5,1fr); grid-template-rows:repeat(5,1fr); pointer-events:none; }
.scum-sector-grid > div { position:relative; border-right:calc(1px * var(--map-ui-scale,1)) solid rgba(220,230,223,.28); border-bottom:calc(1px * var(--map-ui-scale,1)) solid rgba(220,230,223,.28); }.scum-sector-grid > div > span { position:absolute; top:calc(7px * var(--map-ui-scale,1)); left:calc(8px * var(--map-ui-scale,1)); padding:3px 6px; border:1px solid rgba(255,255,255,.18); border-radius:5px; background:rgba(7,10,8,.78); color:#f1f4f2; font-size:11px; font-weight:900; text-shadow:0 1px 3px #000; transform:scale(var(--map-ui-scale,1)); transform-origin:top left; }
.sector-keypad { position:absolute; inset:0; display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(3,1fr); opacity:0; transition:opacity .18s; }.map-canvas:hover .sector-keypad { opacity:1; }.sector-keypad i { display:flex; align-items:center; justify-content:center; border-right:calc(1px * var(--map-ui-scale,1)) dashed rgba(255,255,255,.13); border-bottom:calc(1px * var(--map-ui-scale,1)) dashed rgba(255,255,255,.13); color:rgba(255,255,255,.58); font-size:calc(7px * var(--map-ui-scale,1)); font-style:normal; text-shadow:0 1px 2px #000; }
.map-controls { z-index:8; top:18px; right:24px; gap:6px; }.map-controls button { width:38px; height:38px; border-color:var(--rx-line-strong); border-radius:9px; background:rgba(16,20,18,.94); color:#c5ccc7; box-shadow:0 5px 15px rgba(0,0,0,.25); }.map-controls button:hover { border-color:var(--rx-accent); background:var(--rx-accent-soft); color:var(--rx-accent); }
.map-crosshair { position:absolute; z-index:6; display:none; width:0; height:0; pointer-events:none; color:#f1f3f1; filter:drop-shadow(0 2px 3px #000); }.map-crosshair.show { display:block; }.map-crosshair i { position:absolute; left:-7px; top:-7px; font-size:14px; }
.map-context-menu { position:absolute; z-index:20; width:250px; padding:11px; border:1px solid var(--rx-line-strong); border-radius:12px; background:rgba(14,19,16,.98); box-shadow:0 18px 50px rgba(0,0,0,.7); color:var(--rx-text); }.map-context-menu[hidden] { display:none; }.map-context-menu.show { animation:sortMenuIn .14s ease-out; }.map-context-head { display:flex; align-items:center; gap:9px; padding-bottom:9px; margin-bottom:9px; border-bottom:1px solid var(--rx-line); }.map-context-head > i { width:31px; height:31px; display:grid; place-items:center; border-radius:8px; background:var(--rx-accent-soft); color:var(--rx-accent); }.map-context-head div { display:flex; flex-direction:column; gap:2px; }.map-context-head span { color:var(--rx-accent); font-size:8px; font-weight:900; letter-spacing:.7px; }.map-context-head strong { font-size:10px; }.map-context-menu label { display:flex; flex-direction:column; gap:4px; color:var(--rx-muted); font-size:8px; font-weight:800; text-transform:uppercase; }.map-context-menu input { height:34px; padding:0 9px; border:1px solid var(--rx-line-strong); border-radius:8px; outline:0; background:#0a0e0c; color:var(--rx-text); }.map-context-menu input:focus { border-color:var(--rx-accent); }.map-context-menu button { width:100%; height:36px; margin-top:8px; border:0; border-radius:8px; background:var(--rx-accent); color:#061008; font-size:9px; font-weight:900; text-transform:uppercase; cursor:pointer; }.map-context-menu button:hover { background:#35dc68; }
@media (max-width:1150px) { .map-toolbar { grid-template-columns:1fr auto auto; }.map-help { display:none; } }
@media (max-width:760px) { .map-toolbar { grid-template-columns:1fr auto auto; gap:10px; padding:8px 11px; }.map-live-coordinates { min-width:150px; }.map-controls { right:14px; }.scum-sector-grid > div > span { top:3px; left:3px; padding:2px 4px; font-size:8px; } }

/* Native Kartenkacheln und bedienbares Teleport-Menü */
.map-full-image,.map-detail-tile { image-rendering:auto; }
.map-context-menu { cursor:default; pointer-events:auto; user-select:none; }
.map-context-menu input { pointer-events:auto; user-select:text; }
.map-context-menu button { pointer-events:auto; }

/* Echte SCUM-Tilemap statt skalierter Gesamtgrafik */
.map-viewer.leaflet-ready { overflow:hidden; background:#090d0b; }
.map-viewer.leaflet-ready > .map-canvas,.map-viewer.leaflet-ready > .map-crosshair { display:none; }
.map-viewer.leaflet-ready .leaflet-pane,.map-viewer.leaflet-ready .leaflet-control { z-index:3; }
.map-viewer.leaflet-ready .leaflet-tile-pane { z-index:2; }
.map-viewer.leaflet-ready .leaflet-tile { filter:saturate(.82) brightness(.86) contrast(1.06); image-rendering:auto; backface-visibility:hidden; }
.map-viewer.leaflet-ready .map-controls { z-index:800; }
.map-viewer.leaflet-ready .map-context-menu { z-index:1000; }
.scum-leaflet-sector-label { border:0!important; background:transparent!important; }
.scum-leaflet-sector-label span { display:inline-flex; align-items:center; justify-content:center; min-width:27px; height:18px; padding:0 5px; border:1px solid rgba(255,255,255,.16); border-radius:5px; background:rgba(7,10,8,.78); box-shadow:0 2px 5px rgba(0,0,0,.35); color:#f1f4f2; font-size:9px; font-weight:900; line-height:1; text-shadow:0 1px 2px #000; }
.scum-city-label,.scum-major-poi-label { border:0!important; background:transparent!important; text-align:center; }.scum-city-label span,.scum-major-poi-label span { display:inline-flex; align-items:center; justify-content:center; gap:5px; padding:3px 7px; border:1px solid rgba(255,255,255,.12); border-radius:5px; background:rgba(8,11,9,.82); box-shadow:0 2px 7px rgba(0,0,0,.5); color:#e5e9e6; font-size:8px; font-weight:900; letter-spacing:.5px; text-transform:uppercase; text-shadow:0 1px 3px #000; white-space:nowrap; cursor:pointer; transition:.15s; }.scum-city-label span:hover { border-color:#668174; background:#151c18; }.scum-city-label i { color:#87948c; font-size:7px; }.scum-major-poi-label span { border-color:rgba(240,120,24,.35); background:rgba(25,18,13,.9); color:#ffd9bc; }.scum-major-poi-label span:hover { border-color:#f07818; background:#2b1c12; }.scum-major-poi-label i { color:#f07818; }
.map-style-switch { justify-self:end; display:flex; align-items:center; gap:3px; padding:3px; border:1px solid var(--rx-line-strong); border-radius:10px; background:#090d0b; }
.map-style-switch button { height:30px; padding:0 11px; display:flex; align-items:center; gap:6px; border:0; border-radius:7px; background:transparent; color:#7d8781; font-size:8px; font-weight:900; letter-spacing:.35px; text-transform:uppercase; cursor:pointer; transition:background .15s,color .15s,box-shadow .15s; }
.map-style-switch button i { font-size:9px; }.map-style-switch button:hover { color:#d8ded9; background:rgba(255,255,255,.045); }.map-style-switch button.active { color:#e5eae6; background:#222a25; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 2px 7px rgba(0,0,0,.28); }.map-style-switch button.active i { color:var(--rx-accent); }
@media (max-width:900px) { .map-style-switch button { width:32px; padding:0; justify-content:center; font-size:0; }.map-style-switch button i { font-size:10px; } }

/* Karten-Werkzeugmenü */
.map-context-menu.map-tools-menu { width:278px; max-height:calc(100% - 20px); padding:8px; overflow-y:auto; border-color:#39423d; border-radius:9px; background:rgba(24,28,26,.985); scrollbar-width:thin; scrollbar-color:#59615c #171b18; }
.map-tools-menu .map-context-head { padding:4px 5px 9px; margin-bottom:4px; }
.map-tool-list,.map-tool-panel { display:flex; flex-direction:column; gap:1px; }.map-tool-panel[hidden] { display:none; }
.map-tools-menu button { width:100%; height:34px; margin:0; padding:0 10px; display:flex; align-items:center; gap:11px; border:0; border-radius:5px; background:transparent; color:#d9ddda; font-size:11px; font-weight:600; text-align:left; text-transform:none; cursor:pointer; }
.map-tools-menu button:hover { background:#303632; color:#fff; }.map-tools-menu button > i:first-child { width:17px; color:#f07818; text-align:center; }.map-tools-menu button > span { flex:1; }.map-tool-arrow { margin-left:auto; color:#737c76!important; font-size:8px; }
.map-tool-divider { height:1px; margin:5px -8px; background:#4b514e; }
.map-tool-panel .map-tool-back { margin-bottom:6px; border-bottom:1px solid #454c48; border-radius:0; color:#f2f4f2; font-weight:800; }.map-tool-panel .map-tool-back i { color:#9da59f!important; }
.map-tool-panel label { margin:4px 3px; font-size:8px; letter-spacing:.5px; }.map-tool-panel input,.map-tool-panel textarea { width:100%; box-sizing:border-box; }.map-tool-panel textarea { min-height:82px; padding:8px; resize:vertical; border:1px solid var(--rx-line-strong); border-radius:8px; outline:0; background:#0a0e0c; color:var(--rx-text); font:10px inherit; }
.map-tools-menu .map-tool-primary { margin-top:7px; justify-content:center; background:#263d2c; color:#e6f5e9; font-size:9px; font-weight:900; text-transform:uppercase; }.map-tools-menu .map-tool-primary:hover { background:#315139; }
.map-tools-menu .map-tool-danger { margin-top:7px; justify-content:center; border:1px solid rgba(225,82,72,.25); color:#db8b84; font-size:8px; font-weight:900; text-transform:uppercase; }.map-tools-menu .map-tool-danger i { color:#db6258!important; }
.map-tool-toggle { min-height:34px; padding:0 8px; display:flex!important; flex-direction:row!important; align-items:center; justify-content:space-between; border-radius:6px; background:#111613; color:#c9ceca!important; text-transform:none!important; }.map-tool-toggle input { width:30px; height:16px; accent-color:#f07818; }
.map-marker-list { max-height:180px; overflow:auto; }.map-marker-list > p { padding:16px 8px; color:#7c857f; font-size:9px; text-align:center; }.map-marker-list > div { display:grid; grid-template-columns:1fr 30px; gap:3px; border-bottom:1px solid rgba(255,255,255,.05); }.map-marker-list > div > button:last-child { padding:0; justify-content:center; }.map-marker-list small { display:block; margin-top:2px; color:#77817a; font-size:7px; }.map-tool-label { display:block; margin:5px 4px; color:#7f8982; font-size:8px; font-weight:900; text-transform:uppercase; }.map-tool-style { display:grid; grid-template-columns:1fr 1fr; gap:5px; margin-bottom:7px; }.map-tool-style button { justify-content:center; border:1px solid #363d39; }
.scum-user-marker { color:#ff7a1a; font-size:27px; filter:drop-shadow(0 2px 3px #000); }.map-measure-label { display:flex!important; align-items:center; justify-content:center; border:0!important; background:transparent!important; }.map-measure-label span { display:block; padding:3px 7px; border:1px solid rgba(255,122,26,.52); border-radius:999px; background:rgba(19,23,21,.96); box-shadow:0 3px 9px rgba(0,0,0,.42); color:#ff9a4a; font-size:8px; font-weight:900; line-height:1; text-align:center; white-space:nowrap; }.leaflet-container.measuring { cursor:crosshair!important; }
.map-tool-panel textarea { font:inherit; font-size:10px; }
.map-tool-hint { margin:5px 4px 8px; padding:8px; border:1px solid rgba(255,255,255,.07); border-radius:7px; background:#111613; color:#939c96; font-size:8px; line-height:1.55; }.map-tool-hint strong { color:#e8ece9; }
.map-marker-color { height:34px; display:flex; align-items:center; gap:9px; padding:0 8px; border:1px solid var(--rx-line-strong); border-radius:8px; background:#0a0e0c; }.map-marker-color input { width:24px; height:24px; padding:0; border:0; border-radius:6px; overflow:hidden; cursor:pointer; }.map-marker-color span { color:#bfc6c1; font-size:9px; font-weight:800; }
.map-marker-icons { display:grid; grid-template-columns:repeat(6,1fr); gap:4px; margin:0 3px 8px; }.map-marker-icons button { height:32px; padding:0; justify-content:center; border:1px solid #343b37; }.map-marker-icons button i { width:auto!important; color:#9ea6a1!important; }.map-marker-icons button.active { border-color:#f07818; background:rgba(240,120,24,.13); }.map-marker-icons button.active i { color:#ff9138!important; }
.map-measure-list { max-height:150px; margin-top:7px; overflow:auto; }.map-measure-list > p { padding:13px 7px; color:#747d77; font-size:8px; text-align:center; }.map-measure-list > div { min-height:39px; display:grid; grid-template-columns:1fr 30px; align-items:center; border-bottom:1px solid rgba(255,255,255,.06); }.map-measure-list > div > span { display:grid; grid-template-columns:18px 1fr; padding:0 7px; color:#ccd2ce; font-size:9px; }.map-measure-list small { grid-column:2; color:#ff9742; font-size:8px; }.map-measure-list button { padding:0; justify-content:center; }
.map-tool-toggle span > i { width:16px; margin-right:5px; color:#f07818; text-align:center; }.map-poi-status { margin:7px 4px 2px; color:#737c76; font-size:7px; line-height:1.4; }.scum-poi-marker span { width:22px; height:22px; display:grid; place-items:center; border:2px solid rgba(255,255,255,.72); border-radius:50%; background:var(--poi-color); box-shadow:0 2px 7px rgba(0,0,0,.65); color:#fff; font-size:9px; }
.map-tool-flyout,.map-filter-drawer { position:absolute; z-index:1100; box-sizing:border-box; border:1px solid #3c4540; background:rgba(20,24,22,.985); box-shadow:0 18px 55px rgba(0,0,0,.72); color:var(--rx-text); pointer-events:auto; }
.map-tool-flyout[hidden],.map-filter-drawer[hidden] { display:none; }
.map-tool-flyout { top:50%; left:50%; width:310px; max-height:calc(100% - 28px); padding:10px; overflow-y:auto; border-radius:12px; transform:translate(-50%,-50%); scrollbar-width:thin; scrollbar-color:#59615c #171b18; }
.map-filter-drawer { top:12px; right:12px; bottom:12px; width:300px; padding:10px; overflow-y:auto; border-radius:12px; scrollbar-width:thin; scrollbar-color:#59615c #171b18; }
.map-filter-drawer .map-tool-back { position:sticky; top:-10px; z-index:5; flex:0 0 38px; margin:-10px -10px 4px; padding:0 13px; border-width:0 0 1px; border-radius:11px 11px 0 0; background:rgba(24,28,26,.99); box-shadow:0 7px 14px rgba(0,0,0,.24); backdrop-filter:blur(8px); }
.map-viewer.leaflet-ready .map-tool-flyout,.map-viewer.leaflet-ready .map-filter-drawer { z-index:1100; }
@media (max-width:650px) { .map-tool-flyout { width:min(310px,calc(100% - 24px)); }.map-filter-drawer { left:8px; right:8px; top:8px; bottom:8px; width:auto; } }

/* Kompakte Kartenfilter, Cluster und Mess-Steuerung */
.map-filter-drawer .map-tool-toggle { min-height:32px; padding:0 8px; border:1px solid rgba(255,255,255,.045); border-radius:7px; background:#111613; cursor:pointer; }.map-filter-drawer .map-tool-toggle:hover { border-color:#3c4540; background:#151b17; }
.map-filter-drawer .map-tool-toggle input { position:relative; width:34px!important; height:18px!important; flex:0 0 34px; appearance:none; border:1px solid #4a534d!important; border-radius:12px!important; background:#252b27!important; cursor:pointer; transition:.15s; }.map-filter-drawer .map-tool-toggle input::before { content:''; position:absolute; top:2px; left:2px; width:12px; height:12px; border-radius:50%; background:#8a938d; transition:.15s; }.map-filter-drawer .map-tool-toggle input:checked { border-color:#d66c18!important; background:rgba(240,120,24,.24)!important; }.map-filter-drawer .map-tool-toggle input:checked::before { left:18px; background:#ff8425; box-shadow:0 0 7px rgba(255,122,26,.4); }
.map-marker-list > div { grid-template-columns:1fr 30px 30px; }.map-marker-list > div > button:not(:first-child) { padding:0; justify-content:center; }
.map-measure-controls { position:absolute; z-index:900; right:24px; top:142px; display:flex; flex-direction:column; gap:6px; }.map-measure-controls[hidden] { display:none; }.map-measure-controls button { width:38px; height:38px; display:grid; place-items:center; border:1px solid var(--rx-line-strong); border-radius:9px; background:rgba(16,20,18,.96); color:#d1d7d3; cursor:pointer; box-shadow:0 5px 15px rgba(0,0,0,.3); }.map-measure-controls button:hover { border-color:#f07818; color:#f07818; }
.scum-live-marker span { width:24px; height:24px; display:grid; place-items:center; border:2px solid rgba(255,255,255,.75); border-radius:50%; background:var(--live-color); box-shadow:0 2px 8px rgba(0,0,0,.7); color:#fff; font-size:10px; }.marker-cluster-small,.marker-cluster-medium,.marker-cluster-large { background:rgba(240,120,24,.24)!important; }.marker-cluster div { background:#2b332e!important; color:#fff!important; font-weight:900; box-shadow:inset 0 0 0 2px #f07818; }
.cleanup-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.cleanup-grid .command-row { margin:0; }.cleanup-static { height:32px; display:flex; align-items:center; padding:0 10px; border:1px solid var(--rx-line-strong); border-radius:8px; background:#111613; color:#8f9992; font-size:9px; }.leaflet-container { width:100%; height:100%; background:#090d0b; font-family:inherit; }.map-controls button,.map-measure-controls button { padding:0; }
.map-tool-flyout.map-tool-panel,.map-filter-drawer.map-tool-panel { display:flex; flex-direction:column; gap:7px; }.map-tool-flyout.map-tool-panel[hidden],.map-filter-drawer.map-tool-panel[hidden] { display:none; }.map-tool-flyout .map-tool-back,.map-filter-drawer .map-tool-back { flex:0 0 34px; }.map-tool-flyout label { display:flex; flex-direction:column; gap:5px; margin:2px 3px; color:var(--rx-muted); font-size:8px; font-weight:800; letter-spacing:.45px; }.map-tool-flyout input,.map-tool-flyout textarea { width:100%; box-sizing:border-box; border:1px solid var(--rx-line-strong); border-radius:8px; outline:0; background:#0a0e0c; color:var(--rx-text); }.map-tool-flyout input { height:35px; padding:0 9px; }.map-tool-flyout textarea { min-height:86px; padding:9px; resize:vertical; }.map-tool-flyout input:focus,.map-tool-flyout textarea:focus { border-color:#f07818; }.map-tool-flyout button,.map-filter-drawer button { min-height:34px; display:flex; align-items:center; gap:9px; padding:0 10px; border:1px solid #39413d; border-radius:7px; background:#171c19; color:#d7dcd8; font:700 9px inherit; cursor:pointer; }.map-tool-flyout button:hover,.map-filter-drawer button:hover { border-color:#f07818; color:#fff; }.map-tool-flyout .map-tool-primary { justify-content:center; border-color:#3d6947; background:#263d2c; color:#e8f5ea; text-transform:uppercase; }.map-tool-flyout .map-tool-danger { justify-content:center; border-color:rgba(225,82,72,.28); color:#df8580; }
@media (max-width:760px) { .cleanup-grid { grid-template-columns:1fr; } }
.map-marker-popup { min-width:195px; max-width:215px; }.map-popup-title { display:flex; align-items:center; gap:8px; padding:2px 2px 8px; border-bottom:1px solid rgba(255,255,255,.08); }.map-popup-title > i { width:27px; height:27px; display:grid; place-items:center; flex:0 0 27px; border:1px solid rgba(240,120,24,.3); border-radius:8px; background:rgba(240,120,24,.1); color:#f07818; font-size:9px; }.map-popup-title > span { min-width:0; display:flex; flex-direction:column; }.map-popup-title small { color:#f07818; font-size:5px; font-weight:900; letter-spacing:.9px; }.map-popup-title strong { overflow:hidden; color:#edf0ee; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }.map-popup-title em { margin-top:1px; color:#778079; font-size:6px; font-style:normal; }.map-popup-actions { display:grid; grid-template-columns:repeat(3,1fr); gap:4px; margin-top:6px; }.map-popup-actions-four { grid-template-columns:repeat(4,1fr); }.map-popup-actions button { min-width:0; height:35px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; padding:0 2px; border:1px solid #3b443f; border-radius:6px; background:#121714; color:#cbd1cd; cursor:pointer; }.map-popup-actions button i { color:#f07818; font-size:8px; }.map-popup-actions button span { font-size:5px; font-weight:800; text-transform:uppercase; }.map-popup-actions button:hover { border-color:#f07818; background:#252d28; color:#fff; }.map-popup-actions button.danger:hover { border-color:#bd5550; }.map-popup-actions button.danger i { color:#df6963; }.leaflet-popup-content-wrapper,.leaflet-popup-tip { background:#171c19; color:#e6e9e7; }.leaflet-popup-content { margin:8px; }
.map-filter-section { margin:5px 3px 0; color:#707a73; font-size:7px; font-weight:900; letter-spacing:1px; }
.map-poi-status.error { padding:7px 8px; border:1px solid rgba(220,75,67,.24); border-radius:7px; background:rgba(220,75,67,.07); color:#df827c; }.marker-cluster { border-radius:50%; filter:drop-shadow(0 3px 7px rgba(0,0,0,.58)); }.marker-cluster div { display:flex!important; align-items:center; justify-content:center; margin:5px!important; }.marker-cluster span { font-size:10px; line-height:1; }
.map-center-marker { display:flex; flex-direction:column; align-items:center; padding:8px 8px 13px; border-bottom:1px solid rgba(255,255,255,.07); text-align:center; }.map-center-marker-icon { width:48px; height:48px; display:grid; place-items:center; margin-bottom:9px; border:1px solid color-mix(in srgb,var(--marker-color) 45%,transparent); border-radius:14px; background:color-mix(in srgb,var(--marker-color) 12%,#111613); box-shadow:0 7px 20px rgba(0,0,0,.25); color:var(--marker-color); font-size:18px; }.map-center-marker > span { color:var(--marker-color,#f07818); font-size:6px; font-weight:900; letter-spacing:1.2px; }.map-center-marker h3 { max-width:100%; margin:3px 0 2px; overflow:hidden; color:#edf1ee; font-size:15px; text-overflow:ellipsis; white-space:nowrap; }.map-center-marker small { color:#7f8982; font-size:7px; }.map-center-actions { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; padding-top:3px; }.map-center-actions.four { grid-template-columns:repeat(4,1fr); }.map-center-actions button { min-width:0; height:48px!important; flex-direction:column; justify-content:center; gap:4px!important; padding:0 3px!important; }.map-center-actions button i { color:#f07818; font-size:11px; }.map-center-actions button span { font-size:6px; font-weight:900; letter-spacing:.25px; text-transform:uppercase; }.map-center-actions button.danger i { color:#df6963; }.map-center-actions button.danger:hover { border-color:#bd5550!important; }
@media (max-width:420px) { .map-center-actions.four { grid-template-columns:repeat(2,1fr); } }
.map-ui-notice { position:fixed; z-index:4000; top:16px; left:50%; width:min(420px,calc(100vw - 30px)); min-height:48px; display:flex; align-items:center; gap:11px; padding:10px 13px; box-sizing:border-box; border:1px solid #3d5745; border-radius:11px; background:rgba(14,20,16,.98); box-shadow:0 14px 40px rgba(0,0,0,.55); opacity:0; pointer-events:none; transform:translate(-50%,-75px); transition:.22s; }.map-ui-notice.show { opacity:1; transform:translate(-50%,0); }.map-ui-notice > i { width:29px; height:29px; display:grid; place-items:center; border-radius:8px; background:rgba(32,207,85,.11); color:#38d76a; }.map-ui-notice > div { min-width:0; display:flex; flex-direction:column; gap:2px; }.map-ui-notice strong { color:#edf1ee; font-size:10px; }.map-ui-notice span { color:#98a29b; font-size:8px; line-height:1.4; }.map-ui-notice.error { border-color:#74433f; }.map-ui-notice.error > i { background:rgba(220,75,67,.12); color:#e06d66; }.map-ui-notice.error strong { color:#ffb5b1; }
.map-viewer.leaflet-ready .leaflet-tile-pane { z-index:200!important; }.map-viewer.leaflet-ready .leaflet-pane.leaflet-sector-pane { z-index:350!important; }.map-viewer.leaflet-ready .leaflet-pane.leaflet-city-pane { z-index:360!important; }.map-viewer.leaflet-ready .leaflet-overlay-pane { z-index:400!important; }.map-viewer.leaflet-ready .leaflet-shadow-pane { z-index:500!important; }.map-viewer.leaflet-ready .leaflet-marker-pane { z-index:600!important; }.map-viewer.leaflet-ready .leaflet-tooltip-pane { z-index:650!important; }.map-viewer.leaflet-ready .leaflet-popup-pane { z-index:700!important; }
.map-viewer.leaflet-ready .leaflet-pane.leaflet-measure-pane { z-index:340!important; }
.map-marker-popup { min-width:165px; max-width:185px; }.map-viewer .leaflet-popup-content-wrapper,.map-viewer .leaflet-popup-tip { background:#171c19!important; color:#e6e9e7!important; }.map-viewer .leaflet-popup-content-wrapper { border:1px solid #424b46!important; border-radius:10px!important; box-shadow:0 12px 35px rgba(0,0,0,.65)!important; }.map-viewer .leaflet-popup-content { margin:8px!important; }.map-viewer .leaflet-popup-close-button { top:3px!important; right:3px!important; width:19px!important; height:19px!important; color:#89928c!important; font-size:16px!important; }.map-viewer .leaflet-popup-close-button:hover { color:#f07818!important; }
.map-filter-drawer.map-tool-panel { gap:3px; }
.map-flyout-header { min-height:43px; display:flex; align-items:center; justify-content:space-between; gap:12px; margin:-10px -10px 2px; padding:7px 9px 7px 13px; border-bottom:1px solid rgba(255,255,255,.075); border-radius:11px 11px 0 0; background:linear-gradient(180deg,#1a201c,#151a17); }.map-flyout-header > div { min-width:0; display:flex; flex-direction:column; gap:1px; }.map-flyout-header small { color:#69736c; font-size:5px; font-weight:900; letter-spacing:1.1px; }.map-flyout-header strong { overflow:hidden; color:#e8ece9; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }.map-tool-flyout .map-flyout-header .map-tool-back { width:28px; min-width:28px; height:28px; min-height:28px; flex:0 0 28px; justify-content:center; padding:0; border:1px solid rgba(255,255,255,.08); border-radius:8px; background:#111613; color:#858f88; }.map-tool-flyout .map-flyout-header .map-tool-back:hover { border-color:#59645d; background:#202722; color:#fff; }.map-tool-flyout .map-flyout-header .map-tool-back i { font-size:9px; }
.map-center-marker { margin:0 -2px; padding:13px 10px 14px; border:1px solid rgba(255,255,255,.055); border-radius:10px; background:radial-gradient(circle at 50% 25%,rgba(255,255,255,.035),transparent 58%),#111613; }.map-center-marker-icon { width:43px; height:43px; margin-bottom:8px; border-radius:12px; font-size:16px; }.map-center-marker h3 { display:-webkit-box; max-width:250px; margin:4px 0 5px; overflow:hidden; font-size:13px; line-height:1.25; text-overflow:ellipsis; white-space:normal; -webkit-box-orient:vertical; -webkit-line-clamp:2; }.map-center-marker small { display:flex; align-items:center; gap:6px; padding:5px 8px; border:1px solid rgba(255,255,255,.06); border-radius:999px; background:#0c100e; color:#858f88; font-size:6px; }.map-center-marker small i { color:var(--marker-color,#f07818); }.map-center-marker small b { padding-left:6px; border-left:1px solid rgba(255,255,255,.08); color:#858f88; font-weight:700; }.map-center-actions { gap:5px; padding-top:5px; }.map-center-actions button { height:42px!important; border-radius:8px!important; background:#121714!important; }.map-center-actions button:hover { background:#1b231e!important; }
.map-center-marker { flex-direction:row; align-items:flex-start; gap:12px; padding:13px; text-align:left; background:linear-gradient(135deg,rgba(255,255,255,.025),transparent 55%),#111613; }.map-center-marker .map-center-marker-icon { width:42px; height:42px; flex:0 0 42px; margin:0; }.map-center-marker-copy { min-width:0; flex:1; display:flex; flex-direction:column; align-items:flex-start; padding-top:1px; }.map-center-marker-copy > span { color:var(--marker-color,#f07818); font-size:6px; font-weight:900; letter-spacing:1.1px; }.map-center-marker-copy h3 { width:100%; max-width:none; margin:3px 0 7px; text-align:left; }.map-center-marker-copy small { max-width:100%; box-sizing:border-box; }.map-center-marker-copy small > span { white-space:nowrap; }
.map-marker-data { display:flex; flex-direction:column; gap:6px; width:100%; padding-top:7px; }
.map-marker-data > div { min-height:42px; display:grid; grid-template-columns:minmax(0,1fr) 30px; grid-template-rows:auto auto; align-items:center; column-gap:9px; padding:7px 8px 7px 10px; box-sizing:border-box; border:1px solid rgba(255,255,255,.075); border-radius:9px; background:#0d120f; }
.map-marker-data span { color:#89938c; font-size:6px; font-weight:900; letter-spacing:.8px; }
.map-marker-data strong { grid-column:1; min-width:0; overflow-wrap:anywhere; color:#edf1ee; font:700 10px/1.35 monospace; letter-spacing:.1px; }
.map-marker-data button { grid-column:2; grid-row:1/3; width:30px; min-width:30px; height:30px; min-height:30px; display:grid; place-items:center; padding:0; border:1px solid #3b4640; border-radius:8px; background:#171d19; color:#f07818; }
.map-marker-data button:hover { border-color:#f07818; background:#222a25; color:#ff8b2d; }
.map-marker-data button i { font-size:10px; }
.map-measure-start-label { background:transparent!important; border:0!important; }
.map-measure-start-label span { display:block; padding:3px 6px; border:1px solid rgba(240,120,24,.65); border-radius:6px; background:rgba(15,19,16,.94); box-shadow:0 4px 14px rgba(0,0,0,.45); color:#ff9a48; font-size:6px; font-weight:900; letter-spacing:.8px; text-align:center; }
.map-context-menu .map-context-danger,.map-context-menu .map-context-danger i,.map-context-menu .map-context-danger span { color:#e0615b!important; }
.map-context-menu .map-context-danger:hover { border-color:rgba(224,97,91,.5)!important; background:rgba(224,97,91,.09)!important; color:#ff817a!important; }
.map-context-menu .map-context-danger:hover i,.map-context-menu .map-context-danger:hover span { color:#ff817a!important; }