@import '_content/Blazor.Bootstrap/Blazor.Bootstrap.olwso25aue.bundle.scp.css';

/* /Components/3DMap/MapView.razor.rz.scp.css */
.map-view[b-ceprvd6y7g] {
    position: relative;
    flex: 1;
    width: 100%;
    height: 100%;
    min-height: 300px;
    user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

.map-canvas[b-ceprvd6y7g] {
    position: absolute;
    inset: 0;
}

/* One-handed use on a phone, a pinch needs two fingers */
.map-controls[b-ceprvd6y7g] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.map-control[b-ceprvd6y7g] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--pow-touch-target);
    height: var(--pow-touch-target);
    padding: 0;
    background: rgba(0, 0, 0, 0.7);
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 8px;
    color: white;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
    transition: all 0.3s ease;
}

@media (hover: hover) {
    .map-control:hover[b-ceprvd6y7g] {
        border-color: rgba(100, 150, 255, 0.8);
        box-shadow: 0 0 12px rgba(100, 150, 255, 0.5);
    }
}
/* /Components/3DMap/PlanetPopup.razor.rz.scp.css */
.planet-popup[b-tfo0vvcawv] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 12px;
    text-shadow: 2px 2px 5px black;
}

/* The close button stays free on the right. Rows and the button of one state belong together. */
.planet-name[b-tfo0vvcawv] {
    margin: 0;
    padding: 8px 40px 0;
    color: #ffd700;
    font-size: 1.25rem;
    text-align: center;
    overflow-wrap: anywhere;
}

.planet-rows[b-tfo0vvcawv] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.planet-row[b-tfo0vvcawv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    min-height: var(--pow-touch-target);
    padding-inline: 12px;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 3px;
}

.planet-label[b-tfo0vvcawv] {
    flex-shrink: 0;
    color: lightgray;
    font-size: 14px;
    font-weight: 600;
}

.planet-value[b-tfo0vvcawv] {
    min-width: 0;
    color: white;
    font-size: 14px;
    text-align: right;
    overflow-wrap: anywhere;
}

.planet-score[b-tfo0vvcawv] {
    color: #ffd700;
    font-weight: 600;
}

/* A short name is still easy to tap */
.planet-alliance[b-tfo0vvcawv] {
    display: inline-flex;
    justify-content: flex-end;
    align-items: center;
    min-width: var(--pow-touch-target);
    min-height: var(--pow-touch-target);
    color: #87ceeb;
}

.planet-detail-link + .planet-name[b-tfo0vvcawv] {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.planet-detail-link[b-tfo0vvcawv] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: var(--pow-touch-target);
    background: linear-gradient(135deg, #3d5af1 0%, #7439d4 100%);
    border-radius: 8px;
    color: white;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
}

@media (hover: hover) {
    .planet-detail-link:hover[b-tfo0vvcawv] {
        box-shadow: 0 4px 12px rgba(100, 150, 255, 0.4);
        color: white;
    }
}

@media (min-width: 768px) {
    .planet-popup[b-tfo0vvcawv] {
        padding: 20px;
    }
}
/* /Components/Alliances/AllianceCard.razor.rz.scp.css */
.alliance-card[b-uy8rf7njzl] {
    margin-bottom: 1rem;
    background: rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 6px;
    overflow: hidden;
}

.alliance-card-header[b-uy8rf7njzl] {
    display: flex;
    align-items: center;
    padding: 0.75rem;
    background: rgba(32, 178, 170, 0.2);
    border-bottom: 1px solid rgba(32, 178, 170, 0.4);
    color: white;
    font-size: 1rem;
    font-weight: 600;
    text-shadow: 2px 2px 5px black;
}

.alliance-card-content[b-uy8rf7njzl] {
    padding: 12px;
}

@media (min-width: 768px) {
    .alliance-card-header[b-uy8rf7njzl] {
        padding: 0.75rem 1rem;
    }

    .alliance-card-content[b-uy8rf7njzl] {
        padding: 1rem;
    }
}
/* /Components/Alliances/AllianceDeputyCard.razor.rz.scp.css */
.deputy-note[b-rr5824hrwn] {
    margin: 0 0 0.75rem 0;
    color: #b0b0b0;
    font-size: 0.9rem;
}

/* Phones: the name over the button */
.deputy-current[b-rr5824hrwn] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.deputy-name[b-rr5824hrwn] {
    color: white;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.deputy-action[b-rr5824hrwn] {
    display: flex;
    justify-content: flex-end;
    margin-top: 0.75rem;
}

.deputy-empty[b-rr5824hrwn] {
    color: #888;
    font-style: italic;
}

@media (min-width: 768px) {
    .deputy-current[b-rr5824hrwn] {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
    }
}
/* /Components/Alliances/AllianceIcon.razor.rz.scp.css */
.alliance-icon[b-vyiws4lwes] {
    flex-shrink: 0;
    margin-right: 6px;
}
/* /Components/Alliances/AllianceLeaveAction.razor.rz.scp.css */
.alliance-leave[b-3qx4mcrj5d] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.leave-note[b-3qx4mcrj5d] {
    margin: 0 0 0.75rem 0;
    color: #b0b0b0;
    font-size: 0.9rem;
}

.leave-note strong[b-3qx4mcrj5d] {
    color: white;
}

.leave-successor[b-3qx4mcrj5d] {
    margin-bottom: 0.75rem;
}

/* The button spans the row on phones (ActionExecuteButton), from 768px it stays on the right */
.leave-action[b-3qx4mcrj5d] {
    display: flex;
    justify-content: flex-end;
}

@media (min-width: 768px) {
    .leave-note[b-3qx4mcrj5d] {
        text-align: right;
    }

    .leave-successor[b-3qx4mcrj5d] {
        margin-left: auto;
        max-width: 360px;
    }
}
/* /Components/Alliances/AllianceMemberList.razor.rz.scp.css */
/* Phones: a card of three lines, the same layout as the scoreboard of states */
.alliance-members[b-gy0jm4a2uf] {
    --ranking-columns: 34px minmax(0, 1fr) 30px auto;
    --ranking-areas:
        "position name name score"
        "position system system area"
        "position ruler ruler ruler";
    margin-bottom: 8px;
}

.alliance-members--exhaustion[b-gy0jm4a2uf] {
    --ranking-areas:
        "position name name score"
        "position system system area"
        "position ruler exhaustion exhaustion";
}

.member-name[b-gy0jm4a2uf] {
    grid-area: name;
    min-width: 0;
    overflow-wrap: anywhere;
}

.member-name[b-gy0jm4a2uf],
.member-name-text[b-gy0jm4a2uf] {
    color: white;
    font-size: 14px;
    font-weight: 600;
}

.role-badge[b-gy0jm4a2uf] {
    margin-left: 6px;
    padding: 1px 6px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    white-space: nowrap;
}

.role-leader[b-gy0jm4a2uf] {
    background: rgba(255, 215, 0, 0.3);
    border: 1px solid gold;
    color: gold;
}

.role-deputy[b-gy0jm4a2uf] {
    background: rgba(192, 192, 192, 0.3);
    border: 1px solid silver;
    color: silver;
}

/* Only the dot on phones, the word would push most names to a second line */
.member-online[b-gy0jm4a2uf] {
    margin-left: 4px;
    color: #4caf50;
    font-size: 12px;
    font-weight: 400;
    text-shadow: 0 0 5px #4caf50;
    white-space: nowrap;
}

.member-online-label[b-gy0jm4a2uf] {
    display: none;
    color: inherit;
    text-shadow: inherit;
}

.member-system[b-gy0jm4a2uf] {
    grid-area: system;
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    color: white;
    font-size: 13px;
}

.member-exhaustion[b-gy0jm4a2uf] {
    grid-area: exhaustion;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    /* The ring is taller than a line of text and has room for it around the texts */
    margin-block: -4px;
}

.member-exhaustion[b-gy0jm4a2uf]::before {
    content: attr(data-label);
    color: #aaa;
    font-size: 12px;
    text-shadow: 2px 2px 5px black;
}

.member-exhaustion-header[b-gy0jm4a2uf] {
    grid-area: exhaustion;
    text-align: center;
}

.member-ruler[b-gy0jm4a2uf] {
    grid-area: ruler;
    min-width: 0;
    color: #87ceeb;
    font-size: 13px;
    overflow-wrap: anywhere;
}

.member-ruler[data-label][b-gy0jm4a2uf]::before {
    content: attr(data-label) ' ';
    color: #aaa;
    font-size: 12px;
}

.member-area[b-gy0jm4a2uf] {
    grid-area: area;
    color: #b0b0b0;
    font-size: 13px;
    text-align: right;
    white-space: nowrap;
}

.member-score[b-gy0jm4a2uf] {
    grid-area: score;
    color: #ffd700;
    font-size: 14px;
    font-weight: 600;
    text-align: right;
    white-space: nowrap;
}

/* Touch: the whole card opens the detail of the state */
@media (pointer: coarse) {
    .member-link[b-gy0jm4a2uf]::after {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 1;
    }
}

/* Tablets and PC: one line of the grid shared with the header */
@media (min-width: 768px) {
    .alliance-members[b-gy0jm4a2uf] {
        --ranking-columns: 48px minmax(0, 2.4fr) minmax(0, 1.5fr) minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 0.9fr);
        --ranking-areas: "position name system ruler area score";
        margin-bottom: 1rem;
    }

    .alliance-members--exhaustion[b-gy0jm4a2uf] {
        --ranking-columns: 48px minmax(0, 2.1fr) minmax(0, 1.5fr) 72px minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 0.9fr);
        --ranking-areas: "position name system exhaustion ruler area score";
    }

    .member-online-label[b-gy0jm4a2uf] {
        display: inline;
    }

    .member-exhaustion[b-gy0jm4a2uf] {
        justify-content: center;
        margin-block: 0;
    }

    .member-exhaustion[b-gy0jm4a2uf]::before {
        content: none;
    }

    .member-ruler[data-label][b-gy0jm4a2uf]::before {
        content: none;
    }

    .member-area[b-gy0jm4a2uf],
    .member-score[b-gy0jm4a2uf] {
        text-align: left;
    }
}
/* /Components/Alliances/AllianceMemberSelect.razor.rz.scp.css */
.member-select-label[b-xopijjt7jx] {
    display: block;
    margin-bottom: 0.5rem;
    color: lightgray;
    font-size: 0.9rem;
    text-shadow: 2px 2px 5px black;
}

.member-select[b-xopijjt7jx] {
    width: 100%;
    min-height: var(--pow-touch-target);
    padding: 0 0.5rem;
}

/* The list of a select is drawn by the browser and does not handle the translucent background of the field */
.member-select option[b-xopijjt7jx] {
    background-color: #1e1e28;
    color: white;
}
/* /Components/Base/ActionExecuteButton.razor.rz.scp.css */
/* Phones: across the full width of the parent; from 768px a compact inline button */
button[b-e3s6gs35dr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 8px;
    background:
        linear-gradient(to bottom,
            rgba(255, 255, 255, 0.28)  0%,
            rgba(255, 255, 255, 0.06) 45%,
            rgba(0,   0,   0,   0.06) 55%,
            rgba(0,   0,   0,   0.22) 100%),
        linear-gradient(135deg, #3d5af1 0%, #7439d4 100%);
    box-shadow:
        0 5px 18px rgba(40, 20, 160, 0.55),
        inset 0  1px 0 rgba(255, 255, 255, 0.45),
        inset 0 -1px 0 rgba(0,   0,   0,   0.30);
    width: 100%;
    height: 44px;
    padding: 0 16px;
    color: white;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.03em;
    text-shadow: 0 1px 5px rgba(0, 0, 0, 0.35);
    white-space: nowrap;
    cursor: pointer;
    transition: opacity 0.2s, background 0.15s;
}

@media (hover: hover) {
    button:hover:not(:disabled)[b-e3s6gs35dr] {
        background:
            linear-gradient(to bottom,
                rgba(255, 255, 255, 0.38)  0%,
                rgba(255, 255, 255, 0.12) 45%,
                rgba(0,   0,   0,   0.06) 55%,
                rgba(0,   0,   0,   0.22) 100%),
            linear-gradient(135deg, #3d5af1 0%, #7439d4 100%);
    }
}

button:active:not(:disabled)[b-e3s6gs35dr] {
    background:
        linear-gradient(to bottom,
            rgba(0,   0,   0,   0.06)  0%,
            rgba(0,   0,   0,   0.06) 45%,
            rgba(255, 255, 255, 0.06) 55%,
            rgba(255, 255, 255, 0.12) 100%),
        linear-gradient(135deg, #3d5af1 0%, #7439d4 100%);
}

button:disabled[b-e3s6gs35dr],
button.disabled[b-e3s6gs35dr] {
    opacity: 0.5;
    cursor: not-allowed;
}

@media (min-width: 768px) {
    button[b-e3s6gs35dr] {
        width: auto;
        min-width: 200px;
        max-width: 360px;
    }
}
/* /Components/Base/AlliancePickerSheet.razor.rz.scp.css */
.alliance-name-result[b-dzw4iny0cf] {
    font-weight: 600;
    overflow-wrap: anywhere;
    text-shadow: 2px 2px 5px black;
}
/* /Components/Base/AllianceSelector.razor.rz.scp.css */
.alliance-selector-wrapper[b-mv7l674n7i] {
    width: 100%;
}

/* Selected alliance display */
.selected-alliance-row[b-mv7l674n7i] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: rgba(32, 178, 170, 0.2);
    border: 1px solid rgba(32, 178, 170, 0.5);
    border-radius: 4px;
    padding: 0 0 0 12px;
}

.selected-alliance-name[b-mv7l674n7i] {
    font-size: 15px;
    font-weight: 600;
    color: white;
    text-shadow: 2px 2px 5px black;
}

.clear-btn[b-mv7l674n7i] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: var(--pow-touch-target);
    height: var(--pow-touch-target);
    border: none;
    background-color: transparent;
    padding: 0;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.2s;
}

@media (hover: hover) {
    .clear-btn:hover[b-mv7l674n7i] {
        opacity: 1;
    }
}
/* /Components/Base/CollapsibleSection.razor.rz.scp.css */
/* CollapsibleSection.razor.css — Design matches ContentTile and TabControl */

/* ── Container — same framing as ContentTile / TabControl ──────────────── */

.collapsible-section[b-2shzppgnt8] {
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 10px;
    background-color: rgba(10, 10, 10, 0.7);
    backdrop-filter: blur(3.5px);
    margin: 0 0 10px 0;
    overflow: hidden;
    transition: border-color 0.3s ease;
}

.collapsible-section.is-open[b-2shzppgnt8] {
    border-color: rgba(100, 150, 255, 0.45);
}

/* ── Header — same dark bar as ContentTile header-row / TabControl btn-group ── */

.collapsible-header[b-2shzppgnt8] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-height: var(--pow-touch-target);
    padding: 0.55rem 1rem;
    background: rgba(0, 0, 0, 0.4);
    cursor: pointer;
    user-select: none;
    transition: background 0.2s ease;
}

.collapsible-section.is-open .collapsible-header[b-2shzppgnt8] {
    border-bottom: 1px solid rgba(100, 150, 255, 0.3);
}

/* ── Icon ──────────────────────────────────────────────────────────────── */

.collapsible-icon[b-2shzppgnt8] {
    font-size: 1rem;
    width: 1.3rem;
    text-align: center;
    flex-shrink: 0;
}

/* ── Title — same typography as tab-button / header-text ───────────────── */

.collapsible-title[b-2shzppgnt8] {
    flex: 1;
    font-size: 0.95rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-shadow: 2px 2px 5px black;
    color: #aaa;
    transition: color 0.2s ease;
}

.collapsible-section.is-open .collapsible-title[b-2shzppgnt8] {
    color: #ffd700; /* matches tab-button-selected */
}

/* ── Chevron ───────────────────────────────────────────────────────────── */

.collapsible-chevron[b-2shzppgnt8] {
    color: rgba(100, 150, 255, 0.6);
    display: flex;
    align-items: center;
    transition: transform 0.25s ease, color 0.2s ease;
}

.collapsible-chevron.chevron-up[b-2shzppgnt8] {
    transform: rotate(180deg);
    color: #ffd700;
}

/* ── Content ───────────────────────────────────────────────────────────── */

.collapsible-content[b-2shzppgnt8] {
    padding: 12px;
}

@media (min-width: 768px) {
    .collapsible-content[b-2shzppgnt8] {
        padding: 1rem;
    }
}

/* ── Hover — mouse only, on touch it would stick after a tap ───────────── */

@media (hover: hover) {
    .collapsible-section:hover[b-2shzppgnt8] {
        border-color: rgba(100, 150, 255, 0.5);
    }

    .collapsible-header:hover[b-2shzppgnt8] {
        background: rgba(100, 150, 255, 0.15);
    }

    .collapsible-header:hover .collapsible-title[b-2shzppgnt8] {
        color: #fff;
    }

    .collapsible-header:hover .collapsible-chevron[b-2shzppgnt8] {
        color: rgba(100, 150, 255, 0.9);
    }
}
/* /Components/Base/ContentTile.razor.rz.scp.css */
.header-text[b-u7z30i71km] {
    font-size: 0.95rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-shadow: 2px 2px 5px black;
}

.header-row[b-u7z30i71km] {
    background: rgba(0, 0, 0, 0.4);
    border-bottom: 1px solid rgba(100, 150, 255, 0.3);
    padding: 5px 10px;
}

.main-container[b-u7z30i71km] {
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 10px;
    background-color: rgba(10, 10, 10, 0.7);
    backdrop-filter: blur(3.5px);
    margin: 0 0 15px 0;
    overflow: hidden;
    transition: all 0.3s ease;
}

@media (hover: hover) {
    .main-container:hover[b-u7z30i71km] {
        border-color: rgba(100, 150, 255, 0.5);
    }
}

/* When parent uses flex layout, allow content to fill available space */
.main-container.container-fluid[b-u7z30i71km] {
    display: flex;
    flex-direction: column;
}

/* One line: it takes the height of the tile, while a wrapping line grows with its content and a tile limited by the
   page could not scroll inside (chat) */
.main-container > .row:last-child[b-u7z30i71km] {
    flex: 1;
    flex-wrap: nowrap;
    min-height: 0;
}

/* Stretched by the row, not height: 100% - a percentage needs a definite height of all ancestors and a page that
   grows with its content does not have one (the map stayed at its minimum height) */
.main-container > .row:last-child > .col[b-u7z30i71km] {
    display: flex;
    flex-direction: column;
}

/* Remove Bootstrap padding for full-width content (like 3D map) */
.main-container.no-padding[b-u7z30i71km] {
    padding: 0;
}

.main-container.no-padding > .row[b-u7z30i71km] {
    margin: 0;
}

.main-container.no-padding > .row > .col[b-u7z30i71km] {
    padding: 0;
}
/* /Components/Base/CylinderPicker.razor.rz.scp.css */
.cylinder-picker[b-jk1jss2nwz] {
    display: inline-block;
    outline: none;
    user-select: none;
    -webkit-user-select: none;
}

.cylinder-viewport[b-jk1jss2nwz] {
    position: relative;
    width: 280px;
    height: 220px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 10px;
    background-color: rgba(10, 10, 10, 0.7);
    backdrop-filter: blur(7px);
    cursor: ns-resize;
    perspective: 500px;
    perspective-origin: 50% 50%;
}

/* Zero-height div centered vertically — acts as the cylinder axis */
.cylinder-track[b-jk1jss2nwz] {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 0;
    transform-style: preserve-3d;
}

.cylinder-track.transition-enabled[b-jk1jss2nwz] {
    transition: transform 0.07s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Each face is a surface element of the cylinder; centered on the axis */
.cylinder-face[b-jk1jss2nwz] {
    position: absolute;
    left: 0;
    right: 0;
    height: 36px;
    margin-top: -18px;
    display: flex;
    align-items: center;
    justify-content: center;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.face-text[b-jk1jss2nwz] {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.75);
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.8);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 85%;
    letter-spacing: 0.3px;
}

.cylinder-face.is-selected .face-text[b-jk1jss2nwz] {
    color: #5b9fff;
    font-weight: 600;
    font-size: 17px;
}

/* 2D overlay: highlights the selected slot */
.selection-band[b-jk1jss2nwz] {
    position: absolute;
    top: 50%;
    left: 10px;
    right: 10px;
    height: 36px;
    margin-top: -18px;
    border-top: 1px solid rgba(91, 159, 255, 0.6);
    border-bottom: 1px solid rgba(91, 159, 255, 0.6);
    background: rgba(91, 159, 255, 0.07);
    border-radius: 4px;
    pointer-events: none;
    z-index: 20;
}

/* Gradient fades mask the outer slots for a clean cylinder illusion */
.fade-top[b-jk1jss2nwz],
.fade-bottom[b-jk1jss2nwz] {
    position: absolute;
    left: 0;
    right: 0;
    height: 42%;
    pointer-events: none;
    z-index: 20;
}

.fade-top[b-jk1jss2nwz] {
    top: 0;
    background: linear-gradient(to bottom, rgba(5, 5, 5, 0.94) 0%, rgba(5, 5, 5, 0.0) 100%);
}

.fade-bottom[b-jk1jss2nwz] {
    bottom: 0;
    background: linear-gradient(to top, rgba(5, 5, 5, 0.94) 0%, rgba(5, 5, 5, 0.0) 100%);
}
/* /Components/Base/DiffComponent.razor.rz.scp.css */
.positive[b-6332dr5sqh] {
    color: rgb(0, 189, 101);
}

.negative[b-6332dr5sqh] {
    color:red;
}

.zero[b-6332dr5sqh] {
    color: orange;
}

.base[b-6332dr5sqh] {
}

/* /Components/Base/GameTooltip.razor.rz.scp.css */
.tooltip-wrapper[b-e1cy8g3g8c] {
    display: inline-flex;
    min-width: 0;
}

/* The trigger is a real button (tap, keyboard), visually transparent - the child content keeps its own look */
.tooltip-trigger[b-e1cy8g3g8c] {
    position: relative;
    display: inline-flex;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    padding: 0;
    border: none;
    background: none;
    color: inherit;
    font: inherit;
    line-height: inherit;
    text-align: inherit;
    text-shadow: inherit;
}

.tooltip-trigger:focus-visible[b-e1cy8g3g8c] {
    outline: 2px solid rgba(100, 150, 255, 0.8);
    outline-offset: 2px;
    border-radius: 4px;
}

/* Hover bubble (mouse) */
.tooltip-content[b-e1cy8g3g8c] {
    position: absolute;
    background-color: rgba(10, 10, 10, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 4px;
    padding: 0.4rem 0.8rem;
    color: white;
    font-size: 12px;
    white-space: nowrap;
    z-index: 1000;
    text-shadow: 2px 2px 5px black;
    box-shadow: 0 0 0.3rem rgba(0, 0, 0, 0.5),
                0 0 0.5rem rgba(51, 71, 255, 0.2);
    pointer-events: none;
}

/* A click opened the popover with the same text - do not show both */
.tooltip-wrapper:has(.tooltip-popover:popover-open) .tooltip-content[b-e1cy8g3g8c] {
    display: none;
}

.tooltip-top[b-e1cy8g3g8c] {
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 6px;
}

.tooltip-bottom[b-e1cy8g3g8c] {
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 6px;
}

.tooltip-left[b-e1cy8g3g8c] {
    right: 100%;
    top: 50%;
    transform: translateY(-50%);
    margin-right: 6px;
}

.tooltip-right[b-e1cy8g3g8c] {
    left: 100%;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 6px;
}

/* Tap / click popover. Without CSS anchor positioning (Firefox) it stays centered on the screen. */
.tooltip-popover[b-e1cy8g3g8c] {
    max-width: min(280px, calc(100vw - 24px));
    padding: 0.5rem 0.8rem;
    background-color: rgba(10, 10, 10, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 6px;
    color: white;
    font-size: 13px;
    line-height: 1.4;
    text-align: left;
    white-space: pre-line;
    text-shadow: 2px 2px 5px black;
    box-shadow: 0 0 0.3rem rgba(0, 0, 0, 0.5),
                0 0 0.5rem rgba(51, 71, 255, 0.2);
}

/* Anchored next to the trigger; flips to the other side when there is no room and stays inside the screen */
@supports (position-area: bottom) {
    .tooltip-popover[b-e1cy8g3g8c] {
        inset: auto;
        margin: 6px;
    }

    .tooltip-popover--top[b-e1cy8g3g8c] {
        position-area: top;
        position-try-fallbacks: flip-block;
    }

    .tooltip-popover--bottom[b-e1cy8g3g8c] {
        position-area: bottom;
        position-try-fallbacks: flip-block;
    }

    .tooltip-popover--left[b-e1cy8g3g8c] {
        position-area: left;
        position-try-fallbacks: flip-inline;
    }

    .tooltip-popover--right[b-e1cy8g3g8c] {
        position-area: right;
        position-try-fallbacks: flip-inline;
    }
}
/* /Components/Base/IllustratedDataRow.razor.rz.scp.css */
/* --illustrated-row-height is set inline from the Height parameter */

/* Phones: narrow cropped image, row height follows the content, TrailingContent wraps under both */
.illustrated-row[b-o3nfw0jbkx] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    min-height: var(--illustrated-row-height);
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 5px;
    overflow: hidden;
    background-color: rgba(0, 0, 0, 0.5);
}

.illustrated-row__image[b-o3nfw0jbkx] {
    flex: 0 0 96px;
    overflow: hidden;
    position: relative;
}

.illustrated-row__image img[b-o3nfw0jbkx] {
    /* Out of flow so the image never dictates the row height, only fills the strip */
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Phones: image as a full-width strip above the content */
.illustrated-row--image-above-on-phone[b-o3nfw0jbkx] {
    flex-direction: column;
}

.illustrated-row--image-above-on-phone .illustrated-row__image[b-o3nfw0jbkx] {
    flex: 0 0 160px;
}

.illustrated-row--image-above-on-phone .illustrated-row__content[b-o3nfw0jbkx] {
    padding: 12px;
}

.illustrated-row__image--clickable[b-o3nfw0jbkx] {
    cursor: pointer;
}

.illustrated-row__hover-overlay[b-o3nfw0jbkx] {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
}

.illustrated-row__open-label[b-o3nfw0jbkx] {
    color: white;
    font-size: 0.75rem;
    font-weight: bold;
    letter-spacing: 2px;
    opacity: 0;
    transition: opacity 0.2s ease;
    text-shadow: 0 1px 4px black;
}

/* The "OTEVŘÍT" label is a mouse affordance only; touch keeps the tap on the image */
@media (hover: hover) {
    .illustrated-row__image--clickable:hover .illustrated-row__hover-overlay[b-o3nfw0jbkx] {
        background: rgba(0, 0, 0, 0.55);
    }

    .illustrated-row__image--clickable:hover .illustrated-row__open-label[b-o3nfw0jbkx] {
        opacity: 1;
    }

    .illustrated-row__image--clickable:hover .illustrated-row__image-overlay[b-o3nfw0jbkx] {
        opacity: 0;
    }
}

.illustrated-row__image-overlay[b-o3nfw0jbkx] {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.illustrated-row__icon[b-o3nfw0jbkx] {
    flex: 0 0 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.55);
    border-right: 1px solid rgba(255, 255, 255, 0.15);
    font-size: 24px;
    line-height: 1;
}

.illustrated-row__content[b-o3nfw0jbkx] {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: center;
    padding: 8px 12px;
    color: white;
    text-shadow: 2px 2px 5px black;
}

.illustrated-row__trailing[b-o3nfw0jbkx] {
    flex: 1 0 100%;
    min-width: 0;
    padding: 8px 12px 12px;
    color: white;
    text-shadow: 2px 2px 5px black;
}

/* Tablets and PC: one row, the image beside the content in its natural aspect ratio at Height.
   Content that does not fit grows the row instead of being cut; the image then stays at the top. */
@media (min-width: 768px) {
    .illustrated-row[b-o3nfw0jbkx],
    .illustrated-row--image-above-on-phone[b-o3nfw0jbkx] {
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .illustrated-row__image[b-o3nfw0jbkx],
    .illustrated-row--image-above-on-phone .illustrated-row__image[b-o3nfw0jbkx] {
        flex: 0 0 auto;
    }

    .illustrated-row__image img[b-o3nfw0jbkx] {
        /* Width auto + fixed height lets the browser preserve the natural aspect ratio */
        position: static;
        width: auto;
        height: var(--illustrated-row-height);
        object-fit: fill;
    }

    .illustrated-row--image-above-on-phone .illustrated-row__content[b-o3nfw0jbkx] {
        padding: 8px 12px;
    }

    .illustrated-row__trailing[b-o3nfw0jbkx] {
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        padding: 8px 12px 8px 0;
    }

    .illustrated-row__icon[b-o3nfw0jbkx] {
        flex-basis: 72px;
        font-size: 28px;
    }
}
/* /Components/Base/IntegerInput.razor.rz.scp.css */
/* --integer-input-width is set inline from the Width parameter, touch devices raise the minimum */
.integer-input-container[b-x95g6fs4fz] {
    --integer-input-min-width: 0px;
    display: flex;
    width: max(var(--integer-input-width), var(--integer-input-min-width));
    max-width: 100%;
    border-radius: 6px;
    overflow: hidden;
    background: rgba(15, 15, 30, 0.9);
    border: 1px solid rgba(80, 120, 200, 0.4);
}

.integer-input-container:focus-within[b-x95g6fs4fz] {
    border-color: rgba(100, 150, 255, 0.7);
    box-shadow: 0 0 6px rgba(100, 150, 255, 0.3);
}

.integer-input-field[b-x95g6fs4fz] {
    flex: 1;
    min-width: 0;
    padding: 6px 10px;
    background: transparent;
    border: none;
    color: #fff;
    font-size: 1.25rem;
    font-weight: bold;
    font-family: Consolas, monospace;
    text-align: right;
    outline: none;
    -moz-appearance: textfield;
}

.integer-input-field[b-x95g6fs4fz]::-webkit-outer-spin-button,
.integer-input-field[b-x95g6fs4fz]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.integer-input-units[b-x95g6fs4fz] {
    display: flex;
    align-items: center;
    padding: 0 8px 0 0;
    color: rgba(180, 200, 255, 0.7);
    font-size: 0.9rem;
    white-space: nowrap;
    user-select: none;
}

.integer-input-buttons[b-x95g6fs4fz] {
    display: flex;
    flex-direction: column;
    border-left: 1px solid rgba(80, 120, 200, 0.3);
}

.integer-btn[b-x95g6fs4fz] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    flex: 1;
    padding: 0;
    background: rgba(40, 50, 80, 0.8);
    border: none;
    color: #aaa;
    cursor: pointer;
    transition: all 0.15s ease;
}

@media (hover: hover) {
    .integer-btn:hover:not(:disabled)[b-x95g6fs4fz] {
        background: rgba(60, 80, 120, 0.9);
        color: #fff;
    }
}

.integer-btn:active:not(:disabled)[b-x95g6fs4fz] {
    background: rgba(80, 100, 150, 0.9);
}

.integer-btn.increment[b-x95g6fs4fz] {
    border-bottom: 1px solid rgba(80, 120, 200, 0.2);
}

.integer-btn:disabled[b-x95g6fs4fz] {
    cursor: default;
    opacity: 1;
}

.btn-icon[b-x95g6fs4fz] {
    font-size: 0.55rem;
    line-height: 1;
}

.btn-icon--sign[b-x95g6fs4fz] {
    display: none;
}

/* Touch devices (any width): [−][ value ][+] with 44px buttons instead of tiny stacked arrows.
   The container query keeps the stacked arrows when a page squeezes the input below 140px. */
@media (pointer: coarse) {
    .integer-input-container[b-x95g6fs4fz] {
        container-type: inline-size;
        --integer-input-min-width: 168px;
        /* + 2px border, so the buttons inside are full 44px */
        min-height: calc(var(--pow-touch-target) + 2px);
    }

    /* The units take room from the digits, "GWh" would leave them under 40px */
    .integer-input-container:has(.integer-input-units)[b-x95g6fs4fz] {
        --integer-input-min-width: 208px;
    }

    @container (min-width: 140px) {
        /* Narrower field between the buttons: keep room for 7 digits (population, money) */
        .integer-input-field[b-x95g6fs4fz] {
            padding: 6px;
            font-size: 1.1rem;
        }

        .integer-input-buttons[b-x95g6fs4fz] {
            display: contents;
        }

        .integer-btn[b-x95g6fs4fz] {
            width: var(--pow-touch-target);
            flex: 0 0 auto;
        }

        .integer-btn.increment[b-x95g6fs4fz] {
            order: 1;
            border-bottom: none;
            border-left: 1px solid rgba(80, 120, 200, 0.3);
        }

        .integer-btn.decrement[b-x95g6fs4fz] {
            order: -1;
            border-right: 1px solid rgba(80, 120, 200, 0.3);
        }

        .btn-icon--arrow[b-x95g6fs4fz] {
            display: none;
        }

        .btn-icon--sign[b-x95g6fs4fz] {
            display: inline;
            font-size: 1.25rem;
            font-weight: bold;
        }
    }
}

/* FillWidthOnPhone: below 768px the input spans its container (controls in phone cards) */
.integer-input-container--fill-on-phone[b-x95g6fs4fz] {
    width: 100%;
}

@media (min-width: 768px) {
    .integer-input-container--fill-on-phone[b-x95g6fs4fz] {
        width: max(var(--integer-input-width), var(--integer-input-min-width));
    }
}
/* /Components/Base/IntegerSliderInput.razor.rz.scp.css */
/* --slider-input-width is set inline from the Width parameter; phones use the full width of the parent,
   but never less than Width - a narrow grid cell must not squeeze the slider into an unusable stub */
.slider-input-container[b-o71gdvj8g3] {
    display: flex;
    width: 100%;
    min-width: var(--slider-input-width);
    flex-direction: column;
    border-radius: 6px;
    overflow: hidden;
    background: rgba(15, 15, 30, 0.9);
    border: 1px solid rgba(80, 120, 200, 0.4);
}

.slider-input-container:focus-within[b-o71gdvj8g3] {
    border-color: rgba(100, 150, 255, 0.7);
    box-shadow: 0 0 6px rgba(100, 150, 255, 0.3);
}

.slider-input-field[b-o71gdvj8g3] {
    width: 100%;
    padding: 3px 10px;
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(80, 120, 200, 0.2);
    color: #fff;
    font-size: 1.25rem;
    font-weight: bold;
    font-family: Consolas, monospace;
    text-align: center;
    outline: none;
    -moz-appearance: textfield;
}

.slider-input-field[b-o71gdvj8g3]::-webkit-outer-spin-button,
.slider-input-field[b-o71gdvj8g3]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.slider-row[b-o71gdvj8g3] {
    display: flex;
    align-items: center;
    height: 12px;
}

.slider-btn[b-o71gdvj8g3] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 100%;
    padding: 0;
    background: rgba(40, 50, 80, 0.8);
    border: none;
    color: #aaa;
    cursor: pointer;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.slider-btn.decrement[b-o71gdvj8g3] {
    border-radius: 0 0 0 5px;
}

.slider-btn.increment[b-o71gdvj8g3] {
    border-radius: 0 0 5px 0;
}

@media (hover: hover) {
    .slider-btn:hover:not(:disabled)[b-o71gdvj8g3] {
        background: rgba(60, 80, 120, 0.9);
        color: #fff;
    }

    .slider-track[b-o71gdvj8g3]::-webkit-slider-thumb:hover {
        background: rgba(120, 170, 255, 0.9);
    }

    .slider-track[b-o71gdvj8g3]::-moz-range-thumb:hover {
        background: rgba(120, 170, 255, 0.9);
    }
}

.slider-btn:active:not(:disabled)[b-o71gdvj8g3] {
    background: rgba(80, 100, 150, 0.9);
}

.slider-btn:disabled[b-o71gdvj8g3] {
    cursor: default;
    opacity: 1;
}

.btn-icon[b-o71gdvj8g3] {
    font-size: 0.4rem;
    line-height: 1;
}

.slider-track[b-o71gdvj8g3] {
    flex: 1;
    min-width: 0;
    height: 100%;
    margin: 0;
    padding: 0;
    background: rgba(30, 35, 55, 0.9);
    border: none;
    border-left: 1px solid rgba(80, 120, 200, 0.2);
    border-right: 1px solid rgba(80, 120, 200, 0.2);
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}

.slider-track[b-o71gdvj8g3]::-webkit-slider-runnable-track {
    height: 100%;
    background: transparent;
}

.slider-track[b-o71gdvj8g3]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 12px;
    height: 100%;
    background: rgba(100, 150, 255, 0.7);
    border: none;
    cursor: grab;
    transition: background 0.15s ease;
}

.slider-track[b-o71gdvj8g3]::-webkit-slider-thumb:active {
    cursor: grabbing;
    background: rgba(140, 190, 255, 1);
}

.slider-track[b-o71gdvj8g3]::-moz-range-track {
    height: 100%;
    background: transparent;
    border: none;
}

.slider-track[b-o71gdvj8g3]::-moz-range-thumb {
    width: 12px;
    height: 100%;
    background: rgba(100, 150, 255, 0.7);
    border: none;
    border-radius: 0;
    cursor: grab;
    transition: background 0.15s ease;
}

.slider-track[b-o71gdvj8g3]::-moz-range-thumb:active {
    cursor: grabbing;
    background: rgba(140, 190, 255, 1);
}

@media (min-width: 768px) {
    .slider-input-container[b-o71gdvj8g3] {
        width: var(--slider-input-width);
        max-width: 100%;
    }
}

/* Touch devices (any width): 44px value field and slider row, a thin bar with a big thumb inside it */
@media (pointer: coarse) {
    .slider-input-field[b-o71gdvj8g3] {
        min-height: var(--pow-touch-target);
    }

    .slider-row[b-o71gdvj8g3] {
        height: var(--pow-touch-target);
    }

    .slider-btn[b-o71gdvj8g3] {
        width: var(--pow-touch-target);
    }

    .btn-icon[b-o71gdvj8g3] {
        font-size: 0.8rem;
    }

    .slider-track[b-o71gdvj8g3] {
        background: transparent;
        padding: 0 10px;
    }

    .slider-track[b-o71gdvj8g3]::-webkit-slider-runnable-track {
        height: 8px;
        border-radius: 4px;
        background: rgba(30, 35, 55, 0.9);
        box-shadow: inset 0 0 0 1px rgba(80, 120, 200, 0.3);
    }

    .slider-track[b-o71gdvj8g3]::-webkit-slider-thumb {
        width: 20px;
        height: 32px;
        margin-top: -12px;
        border-radius: 4px;
    }

    .slider-track[b-o71gdvj8g3]::-moz-range-track {
        height: 8px;
        border-radius: 4px;
        background: rgba(30, 35, 55, 0.9);
    }

    .slider-track[b-o71gdvj8g3]::-moz-range-thumb {
        width: 20px;
        height: 32px;
        border-radius: 4px;
    }
}

/* InlineValueOnPhone: below 768px one 44px row [◀][slider][value][▶] */
.slider-input-container--inline-on-phone[b-o71gdvj8g3] {
    flex-direction: row;
    align-items: stretch;
    height: var(--pow-touch-target);
}

.slider-input-container--inline-on-phone .slider-row[b-o71gdvj8g3] {
    display: contents;
}

.slider-input-container--inline-on-phone .slider-btn.decrement[b-o71gdvj8g3] {
    order: 1;
    height: auto;
    border-radius: 0;
}

.slider-input-container--inline-on-phone .slider-track[b-o71gdvj8g3] {
    order: 2;
    height: auto;
}

.slider-input-container--inline-on-phone .slider-input-field[b-o71gdvj8g3] {
    order: 3;
    flex: 0 0 80px;
    width: 80px;
    padding: 0 4px;
    border-bottom: none;
    font-size: 1.1rem;
}

.slider-input-container--inline-on-phone .slider-btn.increment[b-o71gdvj8g3] {
    order: 4;
    height: auto;
    border-left: 1px solid rgba(80, 120, 200, 0.2);
    border-radius: 0;
}

@media (min-width: 768px) {
    .slider-input-container--inline-on-phone[b-o71gdvj8g3] {
        flex-direction: column;
        height: auto;
    }

    .slider-input-container--inline-on-phone .slider-row[b-o71gdvj8g3] {
        display: flex;
    }

    .slider-input-container--inline-on-phone .slider-btn.decrement[b-o71gdvj8g3],
    .slider-input-container--inline-on-phone .slider-track[b-o71gdvj8g3],
    .slider-input-container--inline-on-phone .slider-input-field[b-o71gdvj8g3],
    .slider-input-container--inline-on-phone .slider-btn.increment[b-o71gdvj8g3] {
        order: 0;
        height: 100%;
    }

    .slider-input-container--inline-on-phone .slider-input-field[b-o71gdvj8g3] {
        flex: initial;
        width: 100%;
        height: auto;
        padding: 3px 10px;
        border-bottom: 1px solid rgba(80, 120, 200, 0.2);
        font-size: 1.25rem;
    }

    .slider-input-container--inline-on-phone .slider-btn.decrement[b-o71gdvj8g3] {
        border-radius: 0 0 0 5px;
    }

    .slider-input-container--inline-on-phone .slider-btn.increment[b-o71gdvj8g3] {
        border-left: none;
        border-radius: 0 0 5px 0;
    }
}
/* /Components/Base/ModalSheet.razor.rz.scp.css */
/* Display only for the open state, it would override how the browser hides a closed dialog */
.modal-sheet[b-lyfz3pt5r5] {
    inset: 0;
    width: 100%;
    max-width: none;
    height: 100%;
    max-height: none;
    margin: 0;
    padding: 0;
    border: none;
    background: rgba(0, 0, 0, 0.75);
    color: white;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.modal-sheet[open][b-lyfz3pt5r5] {
    display: flex;
}

/* The dialog itself covers the screen and dims the page */
.modal-sheet[b-lyfz3pt5r5]::backdrop {
    background: none;
}

.modal-sheet-panel[b-lyfz3pt5r5] {
    position: relative;
    width: 100%;
    min-height: 100%;
    padding: var(--pow-safe-area-top) var(--pow-safe-area-right) var(--pow-safe-area-bottom) var(--pow-safe-area-left);
    background: rgba(10, 10, 10, 0.95);
}

/* A newly open dialog focuses the panel: focusing the close button would ring it even after a tap */
.modal-sheet-panel:focus[b-lyfz3pt5r5] {
    outline: none;
}

.modal-sheet-close[b-lyfz3pt5r5] {
    position: absolute;
    top: var(--pow-safe-area-top);
    right: var(--pow-safe-area-right);
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--pow-touch-target);
    height: var(--pow-touch-target);
    padding: 0;
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.7);
    cursor: pointer;
    transition: color 0.2s ease;
    z-index: 1;
}

@media (hover: hover) {
    .modal-sheet-close:hover[b-lyfz3pt5r5] {
        color: white;
    }
}

/* Margin instead of centering by the container: a panel higher than the screen must stay scrollable to its top */
@media (min-width: 768px) {
    .modal-sheet[open][b-lyfz3pt5r5] {
        padding: 16px;
    }

    .modal-sheet-panel[b-lyfz3pt5r5] {
        width: min(500px, 90%);
        min-height: 0;
        margin: auto;
        padding: 0;
        border: 2px solid rgba(100, 150, 255, 0.3);
        border-radius: 10px;
    }
}
/* /Components/Base/SearchComponent.razor.rz.scp.css */
.search-input[b-btaqvnxpva] {
    display: block;
    width: 100%;
    min-height: var(--pow-touch-target);
    -webkit-appearance: none;
    appearance: none;
    padding: 0.5rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: white;
    background-color: rgba(30, 30, 40, 0.8);
    background-clip: padding-box;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 5px;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.search-input:focus[b-btaqvnxpva] {
    outline: none;
    border-color: rgba(32, 178, 170, 0.8);
    box-shadow: 0 0 0 2px rgba(32, 178, 170, 0.2);
}

/* Native clear button of type="search" is dark grey - make it visible on the dark field */
.search-input[b-btaqvnxpva]::-webkit-search-cancel-button {
    filter: invert(1);
    cursor: pointer;
}
/* /Components/Base/SearchPickerSheet.razor.rz.scp.css */
/* Search-field-like button that opens the sheet */
.picker-trigger[b-4oe4ms94q9] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: var(--pow-touch-target);
    padding: 0.5rem 0.75rem;
    background-color: rgba(30, 30, 40, 0.8);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 5px;
    color: #888;
    font-size: 1rem;
    text-align: left;
}

.picker-trigger-text[b-4oe4ms94q9] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Phones: full-screen sheet. The browser hides a closed popover - display is set only for the open state,
   otherwise it would override that and show the closed sheet in the page. */
.picker-sheet[b-4oe4ms94q9] {
    inset: 0;
    width: 100%;
    max-width: none;
    height: 100%;
    max-height: none;
    margin: 0;
    padding: var(--pow-safe-area-top) var(--pow-safe-area-right) var(--pow-safe-area-bottom) var(--pow-safe-area-left);
    border: none;
    background: rgba(10, 10, 20, 0.97);
    color: white;
    overflow: hidden;
}

.picker-sheet:popover-open[b-4oe4ms94q9] {
    display: flex;
    flex-direction: column;
}

/* Closed: invisible, but not display: none. A dismissed sheet keeps its results and planet icons share gradient ids:
   from a display: none subtree the gradients would stop painting the same icons on the page. */
.picker-sheet:not(:popover-open)[b-4oe4ms94q9] {
    display: block;
    visibility: hidden;
    height: 0;
    padding: 0;
    border: none;
}

.picker-sheet[b-4oe4ms94q9]::backdrop {
    background: rgba(0, 0, 0, 0.7);
}

/* Header - same dark bar as the ContentTile header */
.picker-header[b-4oe4ms94q9] {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    min-height: 56px;
    padding: 0 12px 0 4px;
    background: rgba(0, 0, 0, 0.4);
    border-bottom: 1px solid rgba(100, 150, 255, 0.3);
}

.picker-close[b-4oe4ms94q9] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: var(--pow-touch-target);
    height: var(--pow-touch-target);
    padding: 0;
    background: none;
    border: none;
    border-radius: 8px;
    color: #aaa;
    font-size: 1.25rem;
}

.picker-title[b-4oe4ms94q9] {
    font-size: 0.95rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-shadow: 2px 2px 5px black;
}

.picker-search[b-4oe4ms94q9] {
    flex-shrink: 0;
    padding: 12px;
}

.picker-results[b-4oe4ms94q9] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.picker-result[b-4oe4ms94q9] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 52px;
    padding: 8px 12px;
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    color: white;
    text-align: left;
    transition: background-color 0.15s;
}

.picker-result:focus-visible[b-4oe4ms94q9] {
    outline: 2px solid rgba(100, 150, 255, 0.8);
    outline-offset: -2px;
    background-color: rgba(32, 178, 170, 0.35);
}

.picker-message[b-4oe4ms94q9] {
    padding: 12px;
    color: #888;
    font-style: italic;
    text-align: center;
    text-shadow: 2px 2px 5px black;
}

@media (hover: hover) {
    .picker-close:hover[b-4oe4ms94q9] {
        color: #fff;
        background: rgba(100, 150, 255, 0.15);
    }

    .picker-result:hover[b-4oe4ms94q9] {
        background-color: rgba(32, 178, 170, 0.3);
    }
}

/* Tablets and PC: centered dialog over the dimmed page */
@media (min-width: 768px) {
    .picker-sheet[b-4oe4ms94q9] {
        width: min(500px, calc(100vw - 32px));
        height: fit-content;
        max-height: 80dvh;
        margin: auto;
        padding: 0;
        border: 2px solid rgba(100, 150, 255, 0.3);
        border-radius: 10px;
        background: rgba(10, 10, 10, 0.95);
        box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6);
    }
}
/* /Components/Base/SideTabControl.razor.rz.scp.css */
/* Phones and tablets: no frame of its own - the chip row and the content use the full width of the parent tile */
.side-tab-control-container[b-se7c8uo2hj] {
    display: flex;
    flex-direction: column;
    margin: 0 0 15px 0;
}

/* Phones and tablets: horizontally scrollable row of chips */
.side-tab-bar[b-se7c8uo2hj] {
    display: flex;
    flex-direction: row;
    gap: 8px;
    padding: 0 0 12px 0;
}

/* Content wider than the screen stays reachable by swiping instead of being cut off by the parent tile */
.side-tab-content[b-se7c8uo2hj] {
    min-width: 0;
    overflow-x: auto;
}

/* Tab buttons - phones and tablets: chips */
.side-tab-button[b-se7c8uo2hj] {
    flex: 0 0 auto;
    min-height: var(--pow-touch-target);
    background: rgba(0, 0, 0, 0.4);
    color: #aaa;
    font-size: 0.8rem;
    font-weight: 600;
    border: 1px solid rgba(100, 150, 255, 0.3);
    border-radius: 22px;
    padding: 0 14px;
    transition: all 0.3s ease;
    cursor: pointer;
    text-shadow: 2px 2px 5px black;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.side-tab-button-selected[b-se7c8uo2hj] {
    color: #ffd700;
    background: rgba(100, 150, 255, 0.1);
    border-color: #ffd700;
}

@media (hover: hover) {
    .side-tab-button:hover[b-se7c8uo2hj] {
        color: #fff;
        background: rgba(100, 150, 255, 0.15);
        border-color: rgba(100, 150, 255, 0.5);
    }

    .side-tab-button-selected:hover[b-se7c8uo2hj] {
        color: #ffd700;
        background: rgba(100, 150, 255, 0.2);
        border-color: #ffd700;
    }
}

/* PC (same breakpoint as the navigation): framed panel with a vertical tab bar on the left.
   Tablets keep the chips - a vertical bar with long labels leaves too little room for the content at 768 px. */
@media (min-width: 992px) {
    .side-tab-control-container[b-se7c8uo2hj] {
        background: rgba(20, 20, 40, 0.8);
        border: 2px solid rgba(100, 150, 255, 0.3);
        border-radius: 10px;
        overflow: hidden;
        transition: all 0.3s ease;
        flex-direction: row;
        min-height: 200px;
    }

    .side-tab-bar[b-se7c8uo2hj] {
        flex-direction: column;
        flex-shrink: 0;
        gap: 0;
        padding: 0;
        min-width: 140px;
        background: rgba(0, 0, 0, 0.4);
        border-right: 1px solid rgba(100, 150, 255, 0.3);
    }

    .side-tab-content[b-se7c8uo2hj] {
        padding: 1rem;
        flex: 1;
        overflow: auto;
    }

    .side-tab-button[b-se7c8uo2hj] {
        background: transparent;
        font-size: 0.9rem;
        border: none;
        border-left: 3px solid transparent;
        border-radius: 0;
        padding: 0.85rem 1rem;
        text-align: left;
    }

    .side-tab-button-selected[b-se7c8uo2hj] {
        background: rgba(100, 150, 255, 0.1);
        border-left-color: #ffd700;
    }
}

/* Button hover rules above already cover the left border (border-color), only the frame needs its own */
@media (min-width: 992px) and (hover: hover) {
    .side-tab-control-container:hover[b-se7c8uo2hj] {
        border-color: rgba(100, 150, 255, 0.5);
    }
}
/* /Components/Base/StatePickerSheet.razor.rz.scp.css */
.state-result[b-f920w4rsz9] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.state-result-name[b-f920w4rsz9] {
    font-weight: 600;
    overflow-wrap: anywhere;
    text-shadow: 2px 2px 5px black;
}

.state-result-alliance[b-f920w4rsz9] {
    color: #87ceeb;
    font-size: 12px;
    text-shadow: 1px 1px 3px black;
}

.state-result-online[b-f920w4rsz9] {
    margin-left: auto;
    color: #4caf50;
    font-size: 12px;
    text-shadow: 0 0 5px #4caf50;
    white-space: nowrap;
}
/* /Components/Base/StateReference.razor.rz.scp.css */
.state-reference[b-tic98itt1d] {
    color: #b0910c;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.2s;
}

@media (hover: hover) {
    .state-reference:hover[b-tic98itt1d] {
        color: #ffd700;
        text-decoration: underline;
    }
}

/* A link in a line of text: the larger tap area does not move the text, more would reach into the neighbouring lines */
@media (pointer: coarse) {
    .state-reference[b-tic98itt1d] {
        position: relative;
    }

    .state-reference[b-tic98itt1d]::after {
        content: '';
        position: absolute;
        inset: -10px 0;
    }
}
/* /Components/Base/StateSelector.razor.rz.scp.css */
.state-selector[b-m8j8ouailz] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
}

.state-planet[b-m8j8ouailz] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
}

/* Phones: only the search button before a state is picked. Hidden visually, not with display: none: planet icons share
   gradient ids and from a display: none subtree the gradients would stop painting the same icons on the page. */
.state-planet--empty[b-m8j8ouailz] {
    position: absolute;
    width: 1px;
    height: 1px;
    border: none;
    overflow: hidden;
    clip-path: inset(50%);
}

.state-info[b-m8j8ouailz] {
    flex: 1;
    min-width: 0;
    text-shadow: 2px 2px 5px black;
}

.state-header[b-m8j8ouailz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.state-label[b-m8j8ouailz] {
    color: #888;
    font-size: 12px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.clear-btn[b-m8j8ouailz] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--pow-touch-target);
    height: var(--pow-touch-target);
    padding: 0;
    background: rgba(255, 100, 100, 0.2);
    border: 1px solid rgba(255, 100, 100, 0.4);
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s;
}

.state-name[b-m8j8ouailz] {
    margin-bottom: 0.5rem;
    color: #ffd700;
    font-family: Consolas, monospace;
    font-size: 1.2rem;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.state-online[b-m8j8ouailz] {
    margin-left: 6px;
    color: #4caf50;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    text-shadow: 0 0 5px #4caf50;
    white-space: nowrap;
}

.state-details[b-m8j8ouailz] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 12px;
}

.state-detail[b-m8j8ouailz] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    color: #b0b0b0;
    font-size: 0.85rem;
}

@media (hover: hover) {
    .clear-btn:hover[b-m8j8ouailz] {
        background: rgba(255, 100, 100, 0.4);
        border-color: rgba(255, 100, 100, 0.6);
    }
}

@media (min-width: 768px) {
    .state-selector[b-m8j8ouailz] {
        gap: 1rem;
        padding: 1rem;
    }

    .state-planet[b-m8j8ouailz],
    .state-planet--empty[b-m8j8ouailz] {
        position: static;
        width: 80px;
        height: 80px;
        border: 1px solid rgba(255, 255, 255, 0.1);
        overflow: visible;
        clip-path: none;
    }

    .state-header[b-m8j8ouailz] {
        margin-bottom: 0.25rem;
    }

    .state-name[b-m8j8ouailz] {
        font-size: 1.4rem;
    }

    .state-details[b-m8j8ouailz] {
        gap: 1rem;
    }

    .state-detail[b-m8j8ouailz] {
        font-size: 0.9rem;
    }
}
/* /Components/Base/StateSystemIcon.razor.rz.scp.css */
.icon-wrapper[b-6gstfekbza] {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;   
}

.icon[b-6gstfekbza] {
    width: 100%;
    height: 100%;
}

.icon-text[b-6gstfekbza] {
    position: absolute;
    color: white;
    font-weight: bold;    
    background-color: rgba(0,0,0,0.7);
    padding: 1px;
    border-radius: 4px;
    border: 1px solid gray;
    text-align: center;
}
/* /Components/Base/TabControl.razor.rz.scp.css */
/* Main container - matches Research.razor card styling */
.tab-control-container[b-h31kb4zpo0] {
    background: rgba(10, 10, 10, 0.7);
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 10px;
    margin: 0 0 15px 0;
    /* clip, not hidden: rounds the corners without becoming a scroll container that would break sticky content */
    overflow: clip;
    transition: all 0.3s ease;
    backdrop-filter: blur(3.5px);
}

/* Tab header bar - phones: one row of equally wide tabs; scrolls only when they cannot fit */
.tab-bar[b-h31kb4zpo0] {
    display: flex;
    flex-wrap: nowrap;
    gap: 0;
    padding: 0;
    background: rgba(0, 0, 0, 0.4);
    border-bottom: 1px solid rgba(100, 150, 255, 0.3);
}

/* Tab content container */
.tab-content-container[b-h31kb4zpo0] {
    padding: 12px;
}

/* Tab buttons - phones: label may wrap to two lines to keep all tabs visible */
.tab-button[b-h31kb4zpo0] {
    flex: 1 1 0;
    min-width: 64px;
    min-height: var(--pow-touch-target);
    background: transparent;
    color: #aaa;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.2;
    border: none;
    border-bottom: 3px solid transparent;
    padding: 6px;
    transition: all 0.3s ease;
    cursor: pointer;
    position: relative;
    text-shadow: 2px 2px 5px black;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.tab-button-selected[b-h31kb4zpo0] {
    color: #ffd700;
    background: rgba(100, 150, 255, 0.1);
    border-bottom-color: #ffd700;
}

@media (hover: hover) {
    .tab-control-container:hover[b-h31kb4zpo0] {
        border-color: rgba(100, 150, 255, 0.5);
    }

    .tab-button:hover[b-h31kb4zpo0] {
        color: #fff;
        background: rgba(100, 150, 255, 0.15);
        border-bottom-color: rgba(100, 150, 255, 0.5);
    }

    .tab-button-selected:hover[b-h31kb4zpo0] {
        color: #ffd700;
        background: rgba(100, 150, 255, 0.2);
        border-bottom-color: #ffd700;
    }
}

/* Tablets and PC: tabs aligned left, sized by their label */
@media (min-width: 768px) {
    .tab-content-container[b-h31kb4zpo0] {
        padding: 1rem;
    }

    .tab-button[b-h31kb4zpo0] {
        flex: 0 0 auto;
        min-width: 0;
        padding: 0.5rem 1.5rem;
        font-size: 0.95rem;
        line-height: 1.5;
        white-space: nowrap;
    }
}
/* /Components/Buildings/BarracksProductionControl.razor.rz.scp.css */
[b-cw2hxx1vqr] .tile-header { flex: 1; }
[b-cw2hxx1vqr] .header-text { display: flex; width: 100%; }
/* /Components/Buildings/BuildingControlSubPage.razor.rz.scp.css */
.subpage-layout[b-cikezes7ow] {
    display: flex;
    align-items: stretch;
    gap: 8px;
    margin-bottom: 15px;
}

[b-cikezes7ow] .tile-header {
    flex: 1;
}

[b-cikezes7ow] .header-text {
    display: flex;
    width: 100%;
}

.subpage-back-btn[b-cikezes7ow] {
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: rgba(10, 10, 10, 0.7);
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 10px;
    color: white;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0 14px;
    cursor: pointer;
    backdrop-filter: blur(3.5px);
    transition: all 0.3s ease;
    text-shadow: 2px 2px 5px black;
    white-space: nowrap;
}

.subpage-back-btn:hover[b-cikezes7ow] {
    background: rgba(32, 178, 170, 0.5);
    border-color: lightseagreen;
}

.building-title[b-cikezes7ow] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
}

.building-icon[b-cikezes7ow] {
    font-size: 1.2rem;
}

.building-name[b-cikezes7ow] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #ffd700;
    text-shadow: 2px 2px 5px black;
}
/* /Components/Buildings/FactoryProductionControl.razor.rz.scp.css */
[b-yfxnn0po8q] .tile-header { flex: 1; }
[b-yfxnn0po8q] .header-text { display: flex; width: 100%; }
/* /Components/Buildings/ProductionAllocationTable.razor.rz.scp.css */
/* Phones: a card per product (ProductionAllocationRow) - name and owned count, the share bar, production and detail,
   the input across the card. From 768px a table: the header row and a row per product share the column widths. */

.production-table-container[b-cbwhd96vlp] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.production-header-row[b-cbwhd96vlp] {
    display: none;
}

[b-cbwhd96vlp] .production-data-row {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr) max-content;
    grid-template-areas:
        "label label owned"
        "current current current"
        "production diff detail"
        "input input input";
    align-items: center;
    gap: 6px 10px;
    padding: 10px 12px;
    background-color: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(100, 150, 255, 0.2);
    border-radius: 6px;
    text-shadow: 2px 2px 5px black;
}

/* Visible only in phone cards, the table has the column header */
[b-cbwhd96vlp] .production-cell-label {
    color: #999;
    font-size: 12px;
    font-weight: 400;
}

[b-cbwhd96vlp] .production-col-label {
    grid-area: label;
    min-width: 0;
    font-size: 15px;
    font-weight: 600;
}

[b-cbwhd96vlp] .production-col-owned,
[b-cbwhd96vlp] .production-col-detail,
[b-cbwhd96vlp] .production-col-production {
    display: flex;
    align-items: baseline;
    gap: 4px;
    font-weight: 500;
}

[b-cbwhd96vlp] .production-col-owned {
    grid-area: owned;
    justify-content: flex-end;
    color: rgba(200, 200, 200, 0.8);
}

[b-cbwhd96vlp] .production-col-detail {
    grid-area: detail;
    justify-content: flex-end;
    color: rgba(200, 200, 200, 0.7);
}

.production-table--highlight-detail[b-cbwhd96vlp]  .production-col-detail {
    color: #00ff7f;
    font-weight: 600;
}

[b-cbwhd96vlp] .production-col-current {
    grid-area: current;
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-cbwhd96vlp] .production-col-current-value {
    flex: 0 0 auto;
    min-width: 40px;
    color: #ffd700;
    font-weight: 500;
}

[b-cbwhd96vlp] .production-col-bar {
    flex: 1;
    height: 12px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    overflow: hidden;
    position: relative;
}

[b-cbwhd96vlp] .production-bar-fill {
    position: absolute; left: 0; top: 0; height: 100%;
    background: linear-gradient(90deg, rgba(65, 105, 225, 0.8), rgba(100, 149, 237, 1));
    border-radius: 6px; transition: width 0.3s ease;
    box-shadow: 0 0 8px rgba(65, 105, 225, 0.5);
}

[b-cbwhd96vlp] .production-bar-fill.has-change { border-radius: 6px 0 0 6px; }

[b-cbwhd96vlp] .production-bar-increase {
    position: absolute; top: 0; height: 100%;
    background: linear-gradient(90deg, rgba(50, 205, 50, 0.85), rgba(0, 255, 127, 1));
    border-radius: 0 6px 6px 0; transition: left 0.3s ease, width 0.3s ease;
    box-shadow: 0 0 6px rgba(50, 205, 50, 0.6);
}

[b-cbwhd96vlp] .production-bar-decrease {
    position: absolute; top: 0; height: 100%;
    background: linear-gradient(90deg, rgba(255, 140, 0, 0.85), rgba(255, 69, 0, 1));
    border-radius: 0 6px 6px 0; transition: left 0.3s ease, width 0.3s ease;
    box-shadow: 0 0 6px rgba(255, 140, 0, 0.6);
}

[b-cbwhd96vlp] .production-col-production {
    grid-area: production;
    color: rgba(100, 149, 237, 1);
    font-weight: 700;
}

[b-cbwhd96vlp] .production-col-diff {
    grid-area: diff;
    font-weight: 500;
    font-size: 0.9em;
}

[b-cbwhd96vlp] .production-col-input {
    grid-area: input;
}

[b-cbwhd96vlp] .production-diff-positive { color: #90EE90; }
[b-cbwhd96vlp] .production-diff-negative { color: #ffa500; }

.production-sum-row[b-cbwhd96vlp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: rgba(128, 128, 128, 0.15);
    border: 1px solid rgba(128, 128, 128, 0.3);
    padding: 0.5rem 12px;
    border-radius: 4px;
    font-weight: 500;
    text-shadow: 2px 2px 5px black;
}

.production-sum-row.warning[b-cbwhd96vlp] { background: rgba(255, 193, 7, 0.2); border-color: rgba(255, 193, 7, 0.4); }
.production-sum-value[b-cbwhd96vlp] { font-size: 1em; color: rgba(200, 200, 200, 0.8); }
.production-sum-row.warning .production-sum-value[b-cbwhd96vlp] { color: #ffc107; }

.production-button-row[b-cbwhd96vlp] {
    margin-top: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    display: flex;
    justify-content: flex-end;
}

/* Tablets and PC: table rows with fixed columns, the product name and the share bar take the rest */
@media (min-width: 768px) {
    .production-table-container[b-cbwhd96vlp] {
        gap: 2px;
    }

    .production-header-row[b-cbwhd96vlp] {
        display: flex;
        background: rgba(32, 178, 170, 0.3);
        border: 1px solid rgba(32, 178, 170, 0.5);
        margin: 0 0 0.5rem 0;
        padding: 0.75rem 0.5rem;
        font-weight: 600;
        font-size: 14px;
        border-radius: 4px;
        text-shadow: 2px 2px 5px black;
    }

    [b-cbwhd96vlp] .production-data-row {
        display: flex;
        gap: 0;
        padding: 0.5rem;
        border: none;
        border-radius: 3px;
        transition: background-color 0.2s;
    }

    [b-cbwhd96vlp] .production-cell-label {
        display: none;
    }

    [b-cbwhd96vlp] .production-col-label { flex: 0 0 140px; padding-right: 1rem; font-size: inherit; font-weight: 500; }
    [b-cbwhd96vlp] .production-col-owned { display: block; flex: 0 0 60px; text-align: right; padding-right: 1rem; }
    [b-cbwhd96vlp] .production-col-detail { display: block; flex: 0 0 60px; text-align: right; padding-right: 1rem; }
    .production-table--highlight-detail[b-cbwhd96vlp]  .production-col-detail { flex-basis: 70px; }
    [b-cbwhd96vlp] .production-col-current { flex: 1; gap: 0.75rem; padding-right: 1rem; }
    [b-cbwhd96vlp] .production-col-current-value { flex: 0 0 40px; min-width: 0; text-align: right; }
    [b-cbwhd96vlp] .production-col-bar { max-width: 120px; }
    [b-cbwhd96vlp] .production-col-production { display: block; flex: 0 0 60px; text-align: right; padding-right: 0.5rem; }
    [b-cbwhd96vlp] .production-col-diff { flex: 0 0 55px; text-align: right; padding-right: 1rem; }
    [b-cbwhd96vlp] .production-col-input { flex: 0 0 90px; display: flex; justify-content: flex-end; }

    .production-sum-row[b-cbwhd96vlp] {
        margin-top: 0.5rem;
        padding: 0.5rem;
    }

    .production-button-row[b-cbwhd96vlp] {
        margin-top: 1rem;
        padding: 1rem 0.5rem 0.5rem 0.5rem;
    }
}

@media (min-width: 1200px) {
    [b-cbwhd96vlp] .production-col-label { flex-basis: 180px; }
    [b-cbwhd96vlp] .production-col-owned { flex-basis: 80px; }
    [b-cbwhd96vlp] .production-col-detail { flex-basis: 80px; }
    .production-table--highlight-detail[b-cbwhd96vlp]  .production-col-detail { flex-basis: 70px; }
    [b-cbwhd96vlp] .production-col-current-value { flex-basis: 50px; }
    [b-cbwhd96vlp] .production-col-bar { max-width: 200px; }
    [b-cbwhd96vlp] .production-col-production { flex-basis: 80px; }
    [b-cbwhd96vlp] .production-col-diff { flex-basis: 70px; }
    [b-cbwhd96vlp] .production-col-input { flex-basis: 100px; }
}

@media (hover: hover) {
    [b-cbwhd96vlp] .production-data-row:hover { background-color: rgba(0, 0, 0, 0.7); }
}
/* /Components/Buildings/RocketBaseProductionControl.razor.rz.scp.css */
[b-nkj28802vp] .tile-header { flex: 1; }
[b-nkj28802vp] .header-text { display: flex; width: 100%; }

.rocket-tile-header[b-nkj28802vp] {
    display: flex;
    align-items: center;
    width: 100%;
}

/* === Rocket table ===
   Phones: a card per rocket - placeholder image, name with description and owned count, progress of the next
   rocket, the production button across the card (parts per rocket are in the progress label).
   From 768px: table rows under the column header. */

.rocket-table-container[b-nkj28802vp] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0.75rem 0 0 0;
}

.rocket-header-row[b-nkj28802vp] {
    display: none;
}

.rocket-data-row[b-nkj28802vp] {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr) auto;
    grid-template-areas:
        "image label owned"
        "progress progress progress"
        "action action action";
    align-items: start;
    gap: 10px 12px;
    background-color: rgba(0, 0, 0, 0.5);
    margin: 0;
    padding: 12px;
    border-radius: 4px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    transition: background-color 0.2s;
    text-shadow: 2px 2px 5px black;
}

@media (hover: hover) {
    .rocket-data-row:hover[b-nkj28802vp] { background-color: rgba(0, 0, 0, 0.7); }
}

/* Image column */

.rocket-col-image[b-nkj28802vp] {
    grid-area: image;
}

.rocket-image-placeholder[b-nkj28802vp] {
    width: 56px;
    height: 56px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.4);
    border: 1px dashed rgba(255, 255, 255, 0.25);
    border-radius: 4px;
    gap: 4px;
}

.rocket-placeholder-icon[b-nkj28802vp] {
    font-size: 1.5rem;
    opacity: 0.7;
}

/* Hint for the future illustration - too small to read in the phone placeholder */
.rocket-placeholder-label[b-nkj28802vp] {
    display: none;
    font-size: 9px;
    color: rgba(255, 255, 255, 0.35);
    text-align: center;
    padding: 0 3px;
    font-style: italic;
    text-shadow: none;
    line-height: 1.2;
}

/* Label column with name + description */

.rocket-col-label[b-nkj28802vp] {
    grid-area: label;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.rocket-name[b-nkj28802vp] {
    font-weight: 600;
    font-size: 15px;
}

.rocket-desc[b-nkj28802vp] {
    font-size: 12px;
    color: rgba(180, 180, 180, 0.7);
    font-style: italic;
    line-height: 1.3;
}

/* Owned count - prominent */

.rocket-col-owned[b-nkj28802vp] {
    grid-area: owned;
    text-align: right;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
}

.owned-count[b-nkj28802vp] {
    font-size: 22px;
    font-weight: 700;
    color: #ffd700;
    line-height: 1;
    text-shadow: 0 0 8px rgba(255, 215, 0, 0.4), 2px 2px 5px black;
}

.owned-unit[b-nkj28802vp] {
    font-size: 12px;
    color: rgba(255, 215, 0, 0.6);
}

.rocket-col-complexity[b-nkj28802vp] {
    display: none;
    text-align: right;
    color: rgba(200, 200, 200, 0.7);
    font-size: 0.9em;
}

.rocket-col-progress[b-nkj28802vp] {
    grid-area: progress;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.rocket-parts-label[b-nkj28802vp] {
    font-size: 12px;
    color: rgba(200, 200, 200, 0.7);
}

.rocket-progress-row[b-nkj28802vp] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.rocket-progress-bar[b-nkj28802vp] {
    flex: 1;
    height: 12px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    overflow: hidden;
    position: relative;
}

.rocket-progress-fill[b-nkj28802vp] {
    height: 100%;
    background: linear-gradient(90deg, rgba(255, 140, 0, 0.8), rgba(255, 215, 0, 1));
    border-radius: 6px;
    transition: width 0.3s ease;
    box-shadow: 0 0 8px rgba(255, 165, 0, 0.5);
}

.rocket-progress-label[b-nkj28802vp] {
    flex: 0 0 40px;
    text-align: right;
    color: #ffd700;
    font-weight: 500;
    font-size: 0.85em;
}

.rocket-col-action[b-nkj28802vp] {
    grid-area: action;
    display: flex;
    justify-content: flex-end;
}

.rocket-missing-tech[b-nkj28802vp] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 8px;
    background: rgba(255, 165, 0, 0.08);
    border: 1px solid rgba(255, 165, 0, 0.3);
    border-radius: 4px;
    text-align: center;
}

.rocket-missing-tech-icon[b-nkj28802vp] {
    font-size: 1.1rem;
    opacity: 0.8;
}

.rocket-missing-tech-text[b-nkj28802vp] {
    font-size: 12px;
    color: rgba(255, 165, 0, 0.75);
    font-style: italic;
    line-height: 1.3;
    text-shadow: none;
}

/* Tablets and PC: table rows, the action column is as wide as the production button */
@media (min-width: 768px) {
    .rocket-header-row[b-nkj28802vp] {
        display: flex;
        align-items: center;
        background: rgba(32, 178, 170, 0.3);
        border: 1px solid rgba(32, 178, 170, 0.5);
        margin: 0 0 0.25rem 0;
        padding: 0.75rem 0.5rem;
        font-weight: 600;
        font-size: 14px;
        border-radius: 4px;
        text-shadow: 2px 2px 5px black;
    }

    .rocket-data-row[b-nkj28802vp] {
        display: flex;
        align-items: center;
        gap: 0;
        padding: 0.75rem 0.5rem;
    }

    .rocket-col-image[b-nkj28802vp] { flex: 0 0 70px; padding-right: 0.75rem; }
    .rocket-image-placeholder[b-nkj28802vp] { width: 58px; height: 58px; }
    .rocket-placeholder-icon[b-nkj28802vp] { font-size: 1.75rem; }
    .rocket-placeholder-label[b-nkj28802vp] { display: block; }
    .rocket-col-label[b-nkj28802vp] { flex: 0 0 140px; padding-right: 1rem; }
    .rocket-desc[b-nkj28802vp] { font-size: 11px; }
    .rocket-col-owned[b-nkj28802vp] { flex: 0 0 60px; padding-right: 1rem; }
    .owned-unit[b-nkj28802vp] { font-size: 10px; }
    .rocket-col-complexity[b-nkj28802vp] { display: block; flex: 0 0 50px; padding-right: 1rem; }
    .rocket-col-progress[b-nkj28802vp] { flex: 1; padding-right: 1rem; }
    .rocket-parts-label[b-nkj28802vp] { font-size: 11px; }
    .rocket-progress-bar[b-nkj28802vp] { max-width: 100px; }
    .rocket-col-action[b-nkj28802vp] { flex: 0 0 200px; }

    .rocket-missing-tech[b-nkj28802vp] {
        flex-direction: column;
        gap: 4px;
        width: auto;
        padding: 6px 8px;
    }

    .rocket-missing-tech-text[b-nkj28802vp] { font-size: 10px; }
}

@media (min-width: 1200px) {
    .rocket-col-image[b-nkj28802vp] { flex-basis: 95px; }
    .rocket-image-placeholder[b-nkj28802vp] { width: 75px; height: 75px; }
    .rocket-col-label[b-nkj28802vp] { flex-basis: 190px; }
    .rocket-col-owned[b-nkj28802vp] { flex-basis: 80px; }
    .rocket-col-complexity[b-nkj28802vp] { flex-basis: 60px; }
    .rocket-progress-bar[b-nkj28802vp] { max-width: 200px; }
}
/* /Components/Buildings/UniversityProductionControl.razor.rz.scp.css */
[b-3itv5ihsty] .tile-header { flex: 1; }
[b-3itv5ihsty] .header-text { display: flex; width: 100%; }
/* /Components/HexagonSectorPicker.razor.rz.scp.css */
.hexagon-sector-picker[b-3vgpam3sby] {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
}

.hex-grid[b-3vgpam3sby] {
    width: 100%;
    max-width: 600px;
    height: auto;
}

.hex-sector[b-3vgpam3sby] {
    cursor: pointer;
    transition: all 0.2s ease;
}

.hex-sector polygon[b-3vgpam3sby] {
    fill: rgba(70, 90, 110, 0.8);
    stroke: #5a7a9a;
    stroke-width: 4;
    transition: all 0.2s ease;
}

.hex-sector text[b-3vgpam3sby] {
    fill: #ecf0f1;
    font-size: 72px;
    font-weight: bold;
    pointer-events: none;
    user-select: none;
}

/* Mouse only - on touch the highlight would stay on the last tapped sector */
@media (hover: hover) {
    .hex-sector:hover polygon[b-3vgpam3sby] {
        fill: rgba(90, 120, 150, 0.9);
        stroke: #3498db;
        stroke-width: 5;
    }
}

.hex-sector.selected polygon[b-3vgpam3sby] {
    fill: #3498db;
    stroke: #2980b9;
    stroke-width: 6;
}

.hex-sector.selected text[b-3vgpam3sby] {
    fill: #ffffff;
}
/* /Components/History/HistoryEventList.razor.rz.scp.css */
.history-event-list[b-y0stn6un2m] {
    display: flex;
    flex-direction: column;
}
/* /Components/History/HistoryEventWrapper.razor.rz.scp.css */
.history-event-wrapper[b-nso5ky1c83] {
    display: flex;
    border-radius: 5px;
    margin-bottom: 6px;
    transition: all 0.2s ease;
    overflow: hidden;
}

/* Left border indicator */
.event-border-indicator[b-nso5ky1c83] {
    width: 4px;
    flex-shrink: 0;
}

.border-positive[b-nso5ky1c83] {
    background-color: rgb(0, 189, 101);
}

.border-negative[b-nso5ky1c83] {
    background-color: rgb(189, 0, 72);
}

.border-neutral[b-nso5ky1c83] {
    background-color: rgb(212, 175, 55);
}

/* Read/unread background states */
.event-unread[b-nso5ky1c83] {
    background: rgba(40, 80, 140, 0.35);
    border: 1px solid rgba(60, 120, 200, 0.3);
    border-left: none;
}

.event-read[b-nso5ky1c83] {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-left: none;
}

.event-body[b-nso5ky1c83] {
    display: flex;
    align-items: flex-start;
    flex: 1;
    padding: 8px 12px;
    min-width: 0;
}

.event-left[b-nso5ky1c83] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    flex-shrink: 0;
    min-width: 50px;
    padding-right: 10px;
    margin-right: 10px;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

/* Phones: the date above the hour leaves more room for the message */
.event-time[b-nso5ky1c83] {
    width: min-content;
    color: #888;
    font-size: 0.75rem;
    text-align: center;
}

.event-icon[b-nso5ky1c83] {
    font-size: 1.8rem;
    line-height: 1;
    text-align: center;
}

.event-content[b-nso5ky1c83] {
    flex: 1;
    min-width: 0;
    padding-top: 2px;
    overflow-wrap: anywhere;
}

/* Shared by the event components, their own markup fills the content */
.event-content[b-nso5ky1c83]  .event-message {
    font-size: 0.9rem;
    margin-bottom: 4px;
}

.event-content[b-nso5ky1c83]  .event-message strong {
    color: #b0910c;
    font-weight: 700;
}

.event-content[b-nso5ky1c83]  .victory-text {
    color: rgb(0, 255, 136);
}

.event-content[b-nso5ky1c83]  .defeat-text {
    color: rgb(255, 100, 150);
}

.event-content[b-nso5ky1c83]  .event-details {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.event-content[b-nso5ky1c83]  .detail-columns {
    display: inline-grid;
    grid-template-columns: auto auto;
    gap: 3px 10px;
}

.event-content[b-nso5ky1c83]  .detail-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 3px;
    font-size: 0.78rem;
}

.event-content[b-nso5ky1c83]  .detail-label {
    color: rgba(255, 255, 255, 0.75);
    margin-right: 2px;
    white-space: nowrap;
}

.event-content[b-nso5ky1c83]  .casualty-tag,
.event-content[b-nso5ky1c83]  .profit-tag,
.event-content[b-nso5ky1c83]  .neutral-tag {
    padding: 1px 5px;
    border-radius: 3px;
    font-size: 0.75rem;
    white-space: nowrap;
}

.event-content[b-nso5ky1c83]  .casualty-tag {
    background: rgba(189, 0, 72, 0.3);
    border: 1px solid rgba(189, 0, 72, 0.5);
    color: rgb(255, 150, 170);
}

.event-content[b-nso5ky1c83]  .profit-tag {
    background: rgba(0, 189, 101, 0.3);
    border: 1px solid rgba(0, 189, 101, 0.5);
    color: rgb(0, 255, 136);
}

.event-content[b-nso5ky1c83]  .neutral-tag {
    background: rgba(100, 130, 189, 0.3);
    border: 1px solid rgba(100, 130, 189, 0.5);
    color: rgb(150, 190, 255);
}

.event-content[b-nso5ky1c83]  .event-losses {
    font-size: 0.8rem;
    color: rgb(255, 150, 170);
    margin-top: 3px;
}

@media (hover: hover) {
    .event-unread:hover[b-nso5ky1c83] {
        background: rgba(40, 80, 140, 0.5);
    }

    .event-read:hover[b-nso5ky1c83] {
        background: rgba(255, 255, 255, 0.1);
    }
}

@media (min-width: 768px) {
    .event-time[b-nso5ky1c83] {
        width: auto;
        white-space: nowrap;
    }

    .event-content[b-nso5ky1c83]  .event-message {
        font-size: 1rem;
    }
}
/* /Components/History/UnknownHistoryEventComponent.razor.rz.scp.css */
.event-title[b-2jvcybsgut] {
    font-weight: 600;
    color: #b0910c;
    font-size: 1rem;
    margin-bottom: 4px;
}

.event-properties[b-2jvcybsgut] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.property-item[b-2jvcybsgut] {
    display: flex;
    flex-wrap: wrap;
    gap: 0 8px;
    font-size: 0.85rem;
}

.property-name[b-2jvcybsgut] {
    color: rgba(255, 255, 255, 0.7);
    font-weight: 500;
}

.property-value[b-2jvcybsgut] {
    min-width: 0;
    color: #fff;
}
/* /Components/Icons/BluePlanetIcon.razor.rz.scp.css */
svg[b-22560b2gck] {
    all: unset;
}
/* /Components/Messages/ChatWindow.razor.rz.scp.css */
/* One row [emoji][input][send] under the messages on all displays, the input grows with the text */
.chat-window[b-ee3bbrvi7f] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.messages-container[b-ee3bbrvi7f] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.load-more-container[b-ee3bbrvi7f] {
    display: flex;
    justify-content: center;
}

.no-messages[b-ee3bbrvi7f] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #aaa;
    font-size: 14px;
}

.no-messages p[b-ee3bbrvi7f] {
    margin: 0;
}

/* A line with the day in the middle, the same label as the levels of technologies */
.message-day[b-ee3bbrvi7f] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-block: 4px;
}

.message-day[b-ee3bbrvi7f]::before,
.message-day[b-ee3bbrvi7f]::after {
    content: '';
    flex: 1;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.message-day span[b-ee3bbrvi7f] {
    color: #aaa;
    font-size: 0.8rem;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.message-input-container[b-ee3bbrvi7f] {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    padding: 8px;
    background: rgba(0, 0, 0, 0.4);
    border-top: 1px solid rgba(100, 150, 255, 0.3);
}

.emoji-picker-wrapper[b-ee3bbrvi7f] {
    position: relative;
}

.emoji-toggle-btn[b-ee3bbrvi7f] {
    display: block;
    width: var(--pow-touch-target);
    height: var(--pow-touch-target);
    padding: 0;
    background: rgba(0, 0, 0, 0.7);
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 8px;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.emoji-picker-panel[b-ee3bbrvi7f] {
    position: absolute;
    bottom: calc(100% + 8px);
    left: 0;
    z-index: 100;
    display: grid;
    grid-template-columns: repeat(6, var(--pow-touch-target));
    gap: 2px;
    max-height: 40dvh;
    padding: 8px;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: rgba(20, 20, 40, 0.95);
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6);
}

.emoji-btn[b-ee3bbrvi7f] {
    width: var(--pow-touch-target);
    height: var(--pow-touch-target);
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 6px;
    font-size: 20px;
    text-align: center;
    cursor: pointer;
    transition: background 0.15s;
}

/* The dark look comes from the global inputs */
.message-input[b-ee3bbrvi7f] {
    flex: 1;
    min-width: 0;
    height: var(--pow-touch-target);
    max-height: 120px;
    padding: 10px 12px;
    font-family: inherit;
    line-height: 1.3;
    resize: none;
}

/* Grows with the text up to max-height where the browser can do it, otherwise it scrolls inside */
@supports (field-sizing: content) {
    .message-input[b-ee3bbrvi7f] {
        field-sizing: content;
        height: auto;
        min-height: var(--pow-touch-target);
    }
}

.message-input:focus[b-ee3bbrvi7f] {
    outline: none;
    border-color: lightseagreen;
}

.send-button[b-ee3bbrvi7f] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--pow-touch-target);
    height: var(--pow-touch-target);
    padding: 0;
    background: linear-gradient(135deg, #3d5af1 0%, #7439d4 100%);
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: opacity 0.3s ease, box-shadow 0.3s ease;
}

.send-button:disabled[b-ee3bbrvi7f] {
    opacity: 0.5;
    cursor: not-allowed;
}

@media (hover: hover) {
    .emoji-toggle-btn:hover[b-ee3bbrvi7f] {
        border-color: rgba(100, 150, 255, 0.8);
        box-shadow: 0 0 12px rgba(100, 150, 255, 0.5);
    }

    .emoji-btn:hover[b-ee3bbrvi7f] {
        background: rgba(32, 178, 170, 0.3);
    }

    .send-button:hover:not(:disabled)[b-ee3bbrvi7f] {
        box-shadow: 0 4px 12px rgba(100, 150, 255, 0.4);
    }
}

@media (min-width: 768px) {
    .messages-container[b-ee3bbrvi7f] {
        padding: 16px;
    }

    .message-input-container[b-ee3bbrvi7f] {
        padding: 12px;
    }
}

/* A mouse can hit smaller emoji, the panel is then more compact */
@media (min-width: 768px) and (pointer: fine) {
    .emoji-picker-panel[b-ee3bbrvi7f] {
        grid-template-columns: repeat(7, 36px);
        max-height: none;
    }

    .emoji-btn[b-ee3bbrvi7f] {
        width: 36px;
        height: 36px;
    }
}
/* /Components/Messages/ConversationList.razor.rz.scp.css */
.conversation-list[b-4aujb2jzak] {
    flex: 1;
    min-height: 0;
    padding: 4px 8px;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.no-conversations[b-4aujb2jzak] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 32px 8px;
    text-align: center;
}

.no-conversations p[b-4aujb2jzak] {
    margin: 0;
    color: #aaa;
    font-size: 14px;
}

.start-conversation-btn[b-4aujb2jzak] {
    width: min(280px, 100%);
    min-height: var(--pow-touch-target);
    padding: 0 16px;
    background: linear-gradient(135deg, #3d5af1 0%, #7439d4 100%);
    border: none;
    border-radius: 8px;
    color: white;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    transition: box-shadow 0.3s ease;
}

/* The same row as in the ranking: the left edge carries the state of the row */
.conversation-card[b-4aujb2jzak] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 60px;
    margin: 4px 0;
    padding: 6px 8px;
    background-color: rgba(0, 0, 0, 0.5);
    border: none;
    border-left: 4px solid transparent;
    border-radius: 3px;
    color: white;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.2s;
}

.conversation-card--unread[b-4aujb2jzak] {
    background-color: rgba(40, 80, 140, 0.35);
    border-left-color: rgba(60, 120, 200, 0.8);
}

.conversation-card--selected[b-4aujb2jzak] {
    background: linear-gradient(90deg, rgba(32, 178, 170, 0.3) 0%, rgba(0, 0, 0, 0.5) 100%);
    border-left-color: lightseagreen;
}

.conversation-summary[b-4aujb2jzak] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.conversation-line[b-4aujb2jzak] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 20px;
}

.state-name[b-4aujb2jzak] {
    min-width: 0;
    overflow: hidden;
    color: white;
    font-size: 14px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.online-dot[b-4aujb2jzak] {
    flex: 0 0 auto;
    color: #4caf50;
    font-size: 12px;
    text-shadow: 0 0 5px #4caf50;
}

.timestamp[b-4aujb2jzak] {
    flex: 0 0 auto;
    margin-left: auto;
    color: #aaa;
    font-size: 12px;
    white-space: nowrap;
}

.last-message[b-4aujb2jzak] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    color: #b0b0b0;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* The same badge as in the navigation */
.unread-badge[b-4aujb2jzak] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 0.35rem;
    background-color: #dc3545;
    border-radius: 50%;
    color: white;
    font-size: 0.75rem;
    font-weight: bold;
    line-height: 1;
    text-shadow: none;
}

@media (hover: hover) {
    .conversation-card:hover[b-4aujb2jzak] {
        background-color: rgba(0, 0, 0, 0.7);
    }

    .conversation-card--unread:hover[b-4aujb2jzak] {
        background-color: rgba(40, 80, 140, 0.5);
    }

    .conversation-card--selected:hover[b-4aujb2jzak] {
        background: linear-gradient(90deg, rgba(32, 178, 170, 0.3) 0%, rgba(0, 0, 0, 0.7) 100%);
    }

    .start-conversation-btn:hover[b-4aujb2jzak] {
        box-shadow: 0 4px 12px rgba(100, 150, 255, 0.4);
    }
}
/* /Components/Messages/MessageBubble.razor.rz.scp.css */
/* Mobile-first: a bubble may take most of a narrow chat. The corner with the small radius points to its side. */
.message-bubble[b-37hhrxswln] {
    position: relative;
    max-width: 85%;
    padding: 8px 12px;
    border: 1px solid;
    border-radius: 8px;
    color: white;
    text-shadow: 2px 2px 5px black;
}

.received-message[b-37hhrxswln] {
    align-self: flex-start;
    background: rgba(20, 20, 40, 0.85);
    border-color: rgba(100, 150, 255, 0.3);
    border-bottom-left-radius: 2px;
}

.own-message[b-37hhrxswln] {
    align-self: flex-end;
    background: rgba(32, 178, 170, 0.3);
    border-color: rgba(32, 178, 170, 0.5);
    border-bottom-right-radius: 2px;
}

/* Messages of one side in a row belong together */
.received-message + .received-message[b-37hhrxswln],
.own-message + .own-message[b-37hhrxswln] {
    margin-top: -4px;
}

.message-body[b-37hhrxswln] {
    font-size: 14px;
    line-height: 1.4;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
    text-shadow: inherit;
}

.message-time[b-37hhrxswln] {
    margin-top: 2px;
    color: #b0b0b0;
    font-size: 12px;
    text-align: right;
    text-shadow: inherit;
}

.unread-indicator[b-37hhrxswln] {
    position: absolute;
    top: 8px;
    right: -8px;
    width: 8px;
    height: 8px;
    background: #dc3545;
    border-radius: 50%;
}

@media (min-width: 768px) {
    .message-bubble[b-37hhrxswln] {
        max-width: 70%;
        padding: 10px 14px;
    }
}
/* /Components/Move/ActionResults/AirStrikeAttackActionResultComponent.razor.rz.scp.css */
/* Mobile-first: base rules are for phones, the block at the end adjusts them from 576px */
.attack-result[b-yr8d4zzmcs] {
    padding: 10px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-yr8d4zzmcs] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.result-header.victory[b-yr8d4zzmcs] {
    background: linear-gradient(135deg, rgba(0, 189, 101, 0.3), rgba(0, 120, 60, 0.2));
    border: 2px solid rgba(0, 189, 101, 0.6);
    box-shadow: 0 0 20px rgba(0, 189, 101, 0.3);
}

.result-header.defeat[b-yr8d4zzmcs] {
    background: linear-gradient(135deg, rgba(189, 0, 72, 0.3), rgba(120, 0, 45, 0.2));
    border: 2px solid rgba(189, 0, 72, 0.6);
    box-shadow: 0 0 20px rgba(189, 0, 72, 0.3);
}

.result-header.draw[b-yr8d4zzmcs] {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.3), rgba(180, 130, 0, 0.2));
    border: 2px solid rgba(255, 193, 7, 0.6);
    box-shadow: 0 0 20px rgba(255, 193, 7, 0.3);
}

.result-icon[b-yr8d4zzmcs] {
    font-size: 24px;
}

.result-title[b-yr8d4zzmcs] {
    margin: 0;
    font-size: 18px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.attack-type[b-yr8d4zzmcs] {
    margin-left: 0;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, 0.6);
    background: rgba(0, 0, 0, 0.3);
    padding: 4px 12px;
    border-radius: 4px;
    width: 100%;
    text-align: center;
    margin-top: 8px;
}

.battle-report[b-yr8d4zzmcs] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.side-section[b-yr8d4zzmcs] {
    background: rgba(20, 20, 40, 0.6);
    border-radius: 6px;
    padding: 12px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

.aggressor-section[b-yr8d4zzmcs] {
    border-left: 3px solid rgba(100, 150, 255, 0.6);
}

.defender-section[b-yr8d4zzmcs] {
    border-left: 3px solid rgba(255, 100, 100, 0.6);
}

.side-header[b-yr8d4zzmcs] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.side-icon[b-yr8d4zzmcs] {
    font-size: 18px;
}

.side-label[b-yr8d4zzmcs] {
    font-size: 14px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.stats-grid[b-yr8d4zzmcs] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    flex-direction: column;
}

.stat-group[b-yr8d4zzmcs] {
    flex: 1 1 auto;
    min-width: 100%;
}

.stat-group-header[b-yr8d4zzmcs] {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 6px;
}

.stat-item[b-yr8d4zzmcs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px;
    border-radius: 4px;
    margin-bottom: 2px;
    font-size: 13px;
}

.stat-item.positive[b-yr8d4zzmcs] {
    background: rgba(0, 189, 101, 0.15);
}

.stat-item.negative[b-yr8d4zzmcs] {
    background: rgba(189, 0, 72, 0.15);
}

.stat-name[b-yr8d4zzmcs] {
    color: rgba(255, 255, 255, 0.8);
}

.stat-value[b-yr8d4zzmcs] {
    font-weight: 600;
    font-family: monospace;
}

.stat-item.positive .stat-value[b-yr8d4zzmcs] {
    color: rgb(0, 220, 120);
}

.stat-item.negative .stat-value[b-yr8d4zzmcs] {
    color: rgb(255, 100, 100);
}

/* From 576px: roomier header, stat groups side by side */
@media (min-width: 576px) {
    .attack-result[b-yr8d4zzmcs] {
        padding: 16px;
    }

    .result-header[b-yr8d4zzmcs] {
        padding: 12px 16px;
    }

    .result-icon[b-yr8d4zzmcs] {
        font-size: 32px;
    }

    .result-title[b-yr8d4zzmcs] {
        font-size: 24px;
    }

    .attack-type[b-yr8d4zzmcs] {
        width: auto;
        text-align: inherit;
        margin-top: 0;
        margin-left: auto;
    }

    .stats-grid[b-yr8d4zzmcs] {
        flex-direction: row;
    }

    .stat-group[b-yr8d4zzmcs] {
        min-width: 120px;
    }

    .stat-group-header[b-yr8d4zzmcs] {
        font-size: 11px;
    }
}
/* /Components/Move/ActionResults/BuildingsBuiltActionResultComponent.razor.rz.scp.css */
.action-result[b-2su38k5dak] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-2su38k5dak] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-2su38k5dak] {
    background: linear-gradient(135deg, rgba(0, 132, 189, 0.3), rgba(0, 80, 120, 0.2));
    border: 2px solid rgba(0, 132, 189, 0.6);
    box-shadow: 0 0 20px rgba(0, 132, 189, 0.3);
}

.result-icon[b-2su38k5dak] {
    font-size: 32px;
}

.result-title[b-2su38k5dak] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-2su38k5dak] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-2su38k5dak] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(0, 132, 189, 0.4);
    border-left: 4px solid rgba(0, 132, 189, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-2su38k5dak] {
    font-size: 40px;
}

.highlight-info[b-2su38k5dak] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-2su38k5dak] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-2su38k5dak] {
    font-size: 28px;
    font-weight: bold;
    color: rgb(100, 200, 255);
    font-family: monospace;
    text-shadow: 0 0 10px rgba(100, 200, 255, 0.5);
}

.result-image[b-2su38k5dak] {
    display: flex;
    justify-content: center;
    padding: 8px;
}

.result-image img[b-2su38k5dak] {
    max-width: 280px;
    height: auto;
    border-radius: 8px;
    border: 2px solid rgba(100, 150, 255, 0.3);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

.result-description[b-2su38k5dak] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-2su38k5dak] {
        padding: 10px;
    }

    .result-header[b-2su38k5dak] {
        padding: 10px 12px;
    }

    .result-icon[b-2su38k5dak] {
        font-size: 24px;
    }

    .result-title[b-2su38k5dak] {
        font-size: 18px;
    }

    .highlight-box[b-2su38k5dak] {
        padding: 12px;
    }

    .highlight-icon[b-2su38k5dak] {
        font-size: 32px;
    }

    .highlight-value[b-2su38k5dak] {
        font-size: 22px;
    }

    .result-image img[b-2su38k5dak] {
        max-width: 200px;
    }
}
/* /Components/Move/ActionResults/ConquerAttackActionResultComponent.razor.rz.scp.css */
/* Mobile-first: base rules are for phones, the block at the end adjusts them from 576px */
.conquer-result[b-ptw1wm5sf5] {
    padding: 10px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-ptw1wm5sf5] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.victory[b-ptw1wm5sf5] {
    background: linear-gradient(135deg, rgba(0, 189, 101, 0.3), rgba(0, 120, 60, 0.2));
    border: 2px solid rgba(0, 189, 101, 0.6);
    box-shadow: 0 0 20px rgba(0, 189, 101, 0.3);
}

.result-header.defeat[b-ptw1wm5sf5] {
    background: linear-gradient(135deg, rgba(189, 0, 72, 0.3), rgba(120, 0, 45, 0.2));
    border: 2px solid rgba(189, 0, 72, 0.6);
    box-shadow: 0 0 20px rgba(189, 0, 72, 0.3);
}

.result-header.draw[b-ptw1wm5sf5] {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.3), rgba(180, 130, 0, 0.2));
    border: 2px solid rgba(255, 193, 7, 0.6);
    box-shadow: 0 0 20px rgba(255, 193, 7, 0.3);
}

.result-icon[b-ptw1wm5sf5] {
    font-size: 24px;
}

.result-title[b-ptw1wm5sf5] {
    margin: 0;
    font-size: 18px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.battle-report[b-ptw1wm5sf5] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.side-section[b-ptw1wm5sf5] {
    background: rgba(20, 20, 40, 0.6);
    border-radius: 6px;
    padding: 12px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

.aggressor-section[b-ptw1wm5sf5] {
    border-left: 3px solid rgba(100, 150, 255, 0.6);
}

.defender-section[b-ptw1wm5sf5] {
    border-left: 3px solid rgba(255, 100, 100, 0.6);
}

.side-header[b-ptw1wm5sf5] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.side-icon[b-ptw1wm5sf5] {
    font-size: 18px;
}

.side-label[b-ptw1wm5sf5] {
    font-size: 14px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.stats-grid[b-ptw1wm5sf5] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    flex-direction: column;
}

.stat-group[b-ptw1wm5sf5] {
    flex: 1 1 auto;
    min-width: 100%;
}

.stat-group-header[b-ptw1wm5sf5] {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 6px;
}

.stat-item[b-ptw1wm5sf5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px;
    border-radius: 4px;
    margin-bottom: 2px;
    font-size: 13px;
}

.stat-item.positive[b-ptw1wm5sf5] {
    background: rgba(0, 189, 101, 0.15);
}

.stat-item.negative[b-ptw1wm5sf5] {
    background: rgba(189, 0, 72, 0.15);
}

.stat-name[b-ptw1wm5sf5] {
    color: rgba(255, 255, 255, 0.8);
}

.stat-value[b-ptw1wm5sf5] {
    font-weight: 600;
    font-family: monospace;
}

.stat-item.positive .stat-value[b-ptw1wm5sf5] {
    color: rgb(0, 220, 120);
}

.stat-item.negative .stat-value[b-ptw1wm5sf5] {
    color: rgb(255, 100, 100);
}

.conquest-banner[b-ptw1wm5sf5] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px;
    background: linear-gradient(135deg, rgba(0, 189, 101, 0.2), rgba(0, 132, 189, 0.2));
    border: 2px solid rgba(0, 189, 101, 0.5);
    border-radius: 8px;
    margin-top: auto;
}

.conquest-icon[b-ptw1wm5sf5] {
    font-size: 28px;
}

.conquest-text[b-ptw1wm5sf5] {
    font-size: 14px;
    font-weight: bold;
    color: rgb(0, 220, 120);
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

/* From 576px: roomier header, stat groups side by side */
@media (min-width: 576px) {
    .conquer-result[b-ptw1wm5sf5] {
        padding: 16px;
    }

    .result-header[b-ptw1wm5sf5] {
        padding: 12px 16px;
    }

    .result-icon[b-ptw1wm5sf5] {
        font-size: 32px;
    }

    .result-title[b-ptw1wm5sf5] {
        font-size: 24px;
    }

    .stats-grid[b-ptw1wm5sf5] {
        flex-direction: row;
    }

    .stat-group[b-ptw1wm5sf5] {
        min-width: 120px;
    }

    .conquest-banner[b-ptw1wm5sf5] {
        padding: 16px;
    }

    .conquest-text[b-ptw1wm5sf5] {
        font-size: 18px;
    }

    .stat-group-header[b-ptw1wm5sf5] {
        font-size: 11px;
    }
}
/* /Components/Move/ActionResults/DemolishActionResultComponent.razor.rz.scp.css */
.action-result[b-5qt2fdipsm] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-5qt2fdipsm] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.demolish[b-5qt2fdipsm] {
    background: linear-gradient(135deg, rgba(255, 140, 0, 0.3), rgba(180, 90, 0, 0.2));
    border: 2px solid rgba(255, 140, 0, 0.6);
    box-shadow: 0 0 20px rgba(255, 140, 0, 0.3);
}

.result-icon[b-5qt2fdipsm] {
    font-size: 32px;
}

.result-title[b-5qt2fdipsm] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-5qt2fdipsm] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-5qt2fdipsm] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(255, 140, 0, 0.4);
    border-left: 4px solid rgba(255, 140, 0, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-5qt2fdipsm] {
    font-size: 40px;
}

.highlight-info[b-5qt2fdipsm] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-5qt2fdipsm] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-5qt2fdipsm] {
    font-size: 20px;
    font-weight: bold;
    color: rgb(255, 180, 100);
    text-shadow: 0 0 10px rgba(255, 180, 100, 0.5);
}

.result-description[b-5qt2fdipsm] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-5qt2fdipsm] {
        padding: 10px;
    }

    .result-header[b-5qt2fdipsm] {
        padding: 10px 12px;
    }

    .result-icon[b-5qt2fdipsm] {
        font-size: 24px;
    }

    .result-title[b-5qt2fdipsm] {
        font-size: 18px;
    }

    .highlight-box[b-5qt2fdipsm] {
        padding: 12px;
    }

    .highlight-icon[b-5qt2fdipsm] {
        font-size: 32px;
    }

    .highlight-value[b-5qt2fdipsm] {
        font-size: 16px;
    }
}
/* /Components/Move/ActionResults/EconomyInfiltrationActionResultComponent.razor.rz.scp.css */
.infiltration-result[b-bb7c5dh8b8] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
    overflow-y: auto;
    text-shadow: 2px 2px 5px black;
}

/* Result header */
.result-header[b-bb7c5dh8b8] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 18px;
    border-radius: 8px;
}

.result-header.success[b-bb7c5dh8b8] {
    background: rgba(0, 189, 101, 0.2);
    border: 2px solid rgba(0, 189, 101, 0.6);
    box-shadow: 0 0 20px rgba(0, 189, 101, 0.25);
}

.result-header.failure[b-bb7c5dh8b8] {
    background: rgba(189, 0, 72, 0.2);
    border: 2px solid rgba(189, 0, 72, 0.6);
    box-shadow: 0 0 20px rgba(189, 0, 72, 0.25);
}

.result-icon[b-bb7c5dh8b8] {
    font-size: 38px;
    flex-shrink: 0;
}

.result-title[b-bb7c5dh8b8] {
    margin: 0 0 2px 0;
    font-size: 1.35rem;
    font-weight: bold;
    color: white;
}

.result-subtitle[b-bb7c5dh8b8] {
    margin: 0;
    font-size: 0.85rem;
    color: #b0b0b0;
}

/* Intelligence report card */
.intel-card[b-bb7c5dh8b8] {
    background: rgba(20, 20, 40, 0.8);
    border: 1px solid rgba(100, 150, 255, 0.3);
    border-radius: 8px;
    overflow: hidden;
}

.intel-card-header[b-bb7c5dh8b8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 14px;
    background: rgba(32, 178, 170, 0.2);
    border-bottom: 1px solid rgba(32, 178, 170, 0.4);
    font-size: 0.82rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: rgba(255, 255, 255, 0.85);
}

.intel-score[b-bb7c5dh8b8] {
    font-weight: 400;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.6);
    text-transform: none;
    letter-spacing: 0;
}

.intel-score strong[b-bb7c5dh8b8] {
    color: #ffd700;
    font-weight: 700;
}

/* Unit rows */
.unit-list[b-bb7c5dh8b8] {
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.unit-item[b-bb7c5dh8b8] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: rgba(0, 0, 0, 0.35);
    border-radius: 5px;
    border-left: 3px solid rgba(100, 150, 255, 0.4);
    transition: background-color 0.15s;
}

.unit-item:hover[b-bb7c5dh8b8] {
    background: rgba(0, 0, 0, 0.5);
}

.unit-section-header[b-bb7c5dh8b8] {
    border-left: 3px solid rgba(32, 178, 170, 0.6);
    background: rgba(32, 178, 170, 0.08);
    margin-top: 6px;
}

.unit-section-header:first-child[b-bb7c5dh8b8] {
    margin-top: 0;
}

.unit-icon[b-bb7c5dh8b8] {
    font-size: 1.1rem;
    min-width: 24px;
    text-align: center;
}

.unit-label[b-bb7c5dh8b8] {
    color: #ccc;
    font-size: 0.9rem;
    flex: 1;
}

.unit-range[b-bb7c5dh8b8] {
    font-weight: 700;
    font-family: Consolas, monospace;
    color: #87ceeb;
    font-size: 0.95rem;
}
/* /Components/Move/ActionResults/FindNewAreaActionResultComponent.razor.rz.scp.css */
.action-result[b-kyzwqbshtc] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-kyzwqbshtc] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-kyzwqbshtc] {
    background: linear-gradient(135deg, rgba(0, 189, 101, 0.3), rgba(0, 120, 60, 0.2));
    border: 2px solid rgba(0, 189, 101, 0.6);
    box-shadow: 0 0 20px rgba(0, 189, 101, 0.3);
}

.result-icon[b-kyzwqbshtc] {
    font-size: 32px;
}

.result-title[b-kyzwqbshtc] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-kyzwqbshtc] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-kyzwqbshtc] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(0, 189, 101, 0.4);
    border-left: 4px solid rgba(0, 189, 101, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-kyzwqbshtc] {
    font-size: 40px;
}

.highlight-info[b-kyzwqbshtc] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-kyzwqbshtc] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-kyzwqbshtc] {
    font-size: 28px;
    font-weight: bold;
    color: rgb(0, 220, 120);
    font-family: monospace;
    text-shadow: 0 0 10px rgba(0, 220, 120, 0.5);
}

.result-description[b-kyzwqbshtc] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-kyzwqbshtc] {
        padding: 10px;
    }

    .result-header[b-kyzwqbshtc] {
        padding: 10px 12px;
    }

    .result-icon[b-kyzwqbshtc] {
        font-size: 24px;
    }

    .result-title[b-kyzwqbshtc] {
        font-size: 18px;
    }

    .highlight-box[b-kyzwqbshtc] {
        padding: 12px;
    }

    .highlight-icon[b-kyzwqbshtc] {
        font-size: 32px;
    }

    .highlight-value[b-kyzwqbshtc] {
        font-size: 22px;
    }
}
/* /Components/Move/ActionResults/GroundOperationAttackActionResultComponent.razor.rz.scp.css */
/* Mobile-first: base rules are for phones, the block at the end adjusts them from 576px */
.attack-result[b-11slxesplf] {
    padding: 10px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-11slxesplf] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.result-header.victory[b-11slxesplf] {
    background: linear-gradient(135deg, rgba(0, 189, 101, 0.3), rgba(0, 120, 60, 0.2));
    border: 2px solid rgba(0, 189, 101, 0.6);
    box-shadow: 0 0 20px rgba(0, 189, 101, 0.3);
}

.result-header.defeat[b-11slxesplf] {
    background: linear-gradient(135deg, rgba(189, 0, 72, 0.3), rgba(120, 0, 45, 0.2));
    border: 2px solid rgba(189, 0, 72, 0.6);
    box-shadow: 0 0 20px rgba(189, 0, 72, 0.3);
}

.result-header.draw[b-11slxesplf] {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.3), rgba(180, 130, 0, 0.2));
    border: 2px solid rgba(255, 193, 7, 0.6);
    box-shadow: 0 0 20px rgba(255, 193, 7, 0.3);
}

.result-icon[b-11slxesplf] {
    font-size: 24px;
}

.result-title[b-11slxesplf] {
    margin: 0;
    font-size: 18px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.attack-type[b-11slxesplf] {
    margin-left: 0;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, 0.6);
    background: rgba(0, 0, 0, 0.3);
    padding: 4px 12px;
    border-radius: 4px;
    width: 100%;
    text-align: center;
    margin-top: 8px;
}

.battle-report[b-11slxesplf] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.side-section[b-11slxesplf] {
    background: rgba(20, 20, 40, 0.6);
    border-radius: 6px;
    padding: 12px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

.aggressor-section[b-11slxesplf] {
    border-left: 3px solid rgba(100, 150, 255, 0.6);
}

.defender-section[b-11slxesplf] {
    border-left: 3px solid rgba(255, 100, 100, 0.6);
}

.side-header[b-11slxesplf] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.side-icon[b-11slxesplf] {
    font-size: 18px;
}

.side-label[b-11slxesplf] {
    font-size: 14px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.stats-grid[b-11slxesplf] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    flex-direction: column;
}

.stat-group[b-11slxesplf] {
    flex: 1 1 auto;
    min-width: 100%;
}

.stat-group-header[b-11slxesplf] {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 6px;
}

.stat-item[b-11slxesplf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px;
    border-radius: 4px;
    margin-bottom: 2px;
    font-size: 13px;
}

.stat-item.positive[b-11slxesplf] {
    background: rgba(0, 189, 101, 0.15);
}

.stat-item.negative[b-11slxesplf] {
    background: rgba(189, 0, 72, 0.15);
}

.stat-name[b-11slxesplf] {
    color: rgba(255, 255, 255, 0.8);
}

.stat-value[b-11slxesplf] {
    font-weight: 600;
    font-family: monospace;
}

.stat-item.positive .stat-value[b-11slxesplf] {
    color: rgb(0, 220, 120);
}

.stat-item.negative .stat-value[b-11slxesplf] {
    color: rgb(255, 100, 100);
}

/* From 576px: roomier header, stat groups side by side */
@media (min-width: 576px) {
    .attack-result[b-11slxesplf] {
        padding: 16px;
    }

    .result-header[b-11slxesplf] {
        padding: 12px 16px;
    }

    .result-icon[b-11slxesplf] {
        font-size: 32px;
    }

    .result-title[b-11slxesplf] {
        font-size: 24px;
    }

    .attack-type[b-11slxesplf] {
        width: auto;
        text-align: inherit;
        margin-top: 0;
        margin-left: auto;
    }

    .stats-grid[b-11slxesplf] {
        flex-direction: row;
    }

    .stat-group[b-11slxesplf] {
        min-width: 120px;
    }

    .stat-group-header[b-11slxesplf] {
        font-size: 11px;
    }
}
/* /Components/Move/ActionResults/ImposeTradeSanctionActionResultComponent.razor.rz.scp.css */
.action-result[b-oaduv3ycak] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-oaduv3ycak] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.3), rgba(160, 30, 40, 0.2));
    border: 2px solid rgba(220, 53, 69, 0.6);
    box-shadow: 0 0 20px rgba(220, 53, 69, 0.3);
}

.result-icon[b-oaduv3ycak] {
    font-size: 32px;
}

.result-title[b-oaduv3ycak] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-oaduv3ycak] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-oaduv3ycak] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(220, 53, 69, 0.4);
    border-left: 4px solid rgba(220, 53, 69, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-oaduv3ycak] {
    font-size: 40px;
}

.highlight-info[b-oaduv3ycak] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-oaduv3ycak] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-oaduv3ycak] {
    font-size: 20px;
    font-weight: bold;
    color: rgb(255, 120, 100);
    text-shadow: 0 0 10px rgba(255, 100, 80, 0.5);
}

.result-description[b-oaduv3ycak] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(220, 53, 69, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-oaduv3ycak] {
        padding: 10px;
    }

    .result-header[b-oaduv3ycak] {
        padding: 10px 12px;
    }

    .result-icon[b-oaduv3ycak] {
        font-size: 24px;
    }

    .result-title[b-oaduv3ycak] {
        font-size: 18px;
    }

    .highlight-box[b-oaduv3ycak] {
        padding: 12px;
    }

    .highlight-icon[b-oaduv3ycak] {
        font-size: 32px;
    }

    .highlight-value[b-oaduv3ycak] {
        font-size: 16px;
    }
}
/* /Components/Move/ActionResults/IncreaseMilitaryMoraleActionResultComponent.razor.rz.scp.css */
.action-result[b-pteztdn91w] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-pteztdn91w] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-pteztdn91w] {
    background: linear-gradient(135deg, rgba(60, 130, 255, 0.3), rgba(30, 60, 180, 0.2));
    border: 2px solid rgba(60, 130, 255, 0.6);
    box-shadow: 0 0 20px rgba(60, 130, 255, 0.3);
}

.result-icon[b-pteztdn91w] {
    font-size: 32px;
}

.result-title[b-pteztdn91w] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-pteztdn91w] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-pteztdn91w] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(60, 130, 255, 0.4);
    border-left: 4px solid rgba(60, 130, 255, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-pteztdn91w] {
    font-size: 40px;
}

.highlight-info[b-pteztdn91w] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-pteztdn91w] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-pteztdn91w] {
    font-size: 28px;
    font-weight: bold;
    color: rgb(100, 180, 255);
    font-family: monospace;
    text-shadow: 0 0 10px rgba(100, 180, 255, 0.5);
}

.result-description[b-pteztdn91w] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(60, 130, 255, 0.2);
}
/* /Components/Move/ActionResults/IncreasePreparednessActionResultComponent.razor.rz.scp.css */
.action-result[b-ckmzpq58ge] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-ckmzpq58ge] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-ckmzpq58ge] {
    background: linear-gradient(135deg, rgba(0, 180, 80, 0.3), rgba(0, 100, 40, 0.2));
    border: 2px solid rgba(0, 180, 80, 0.6);
    box-shadow: 0 0 20px rgba(0, 180, 80, 0.3);
}

.result-icon[b-ckmzpq58ge] {
    font-size: 32px;
}

.result-title[b-ckmzpq58ge] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-ckmzpq58ge] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-ckmzpq58ge] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(0, 180, 80, 0.4);
    border-left: 4px solid rgba(0, 180, 80, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-ckmzpq58ge] {
    font-size: 40px;
}

.highlight-info[b-ckmzpq58ge] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-ckmzpq58ge] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-ckmzpq58ge] {
    font-size: 28px;
    font-weight: bold;
    color: rgb(0, 220, 100);
    font-family: monospace;
    text-shadow: 0 0 10px rgba(0, 220, 100, 0.5);
}

.result-description[b-ckmzpq58ge] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(0, 180, 80, 0.2);
}
/* /Components/Move/ActionResults/OperationResultLayout.razor.rz.scp.css */
.operation-result[b-3thqwq08ul] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
    overflow-y: auto;
    text-shadow: 2px 2px 5px black;
}

.accent-gold[b-3thqwq08ul] {
    --result-accent: 255, 215, 0;
    --result-value: #ffd700;
}

.accent-green[b-3thqwq08ul] {
    --result-accent: 100, 220, 100;
    --result-value: #90ee90;
}

.accent-blue[b-3thqwq08ul] {
    --result-accent: 100, 180, 255;
    --result-value: #87ceeb;
}

.accent-purple[b-3thqwq08ul] {
    --result-accent: 180, 100, 255;
    --result-value: #cc99ff;
}

.accent-orange[b-3thqwq08ul] {
    --result-accent: 255, 140, 0;
    --result-value: #ffa040;
}

.accent-teal[b-3thqwq08ul] {
    --result-accent: 32, 178, 170;
    --result-value: #20b2aa;
}

.result-header[b-3thqwq08ul] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 18px;
    border-radius: 8px;
}

.result-header.success[b-3thqwq08ul] {
    background: rgba(0, 189, 101, 0.2);
    border: 2px solid rgba(0, 189, 101, 0.6);
    box-shadow: 0 0 20px rgba(0, 189, 101, 0.25);
}

.result-header.failure[b-3thqwq08ul] {
    background: rgba(189, 0, 72, 0.2);
    border: 2px solid rgba(189, 0, 72, 0.6);
    box-shadow: 0 0 20px rgba(189, 0, 72, 0.25);
}

.result-icon[b-3thqwq08ul] {
    font-size: 38px;
    flex-shrink: 0;
}

.result-title[b-3thqwq08ul] {
    margin: 0 0 2px 0;
    font-size: 1.35rem;
    font-weight: bold;
    color: white;
}

.result-subtitle[b-3thqwq08ul] {
    margin: 0;
    font-size: 0.85rem;
    color: #b0b0b0;
}

.result-card[b-3thqwq08ul] {
    background: rgba(20, 20, 40, 0.8);
    border: 1px solid rgba(var(--result-accent), 0.3);
    border-radius: 8px;
    overflow: hidden;
}

.result-card-header[b-3thqwq08ul] {
    padding: 10px 14px;
    background: rgba(var(--result-accent), 0.12);
    border-bottom: 1px solid rgba(var(--result-accent), 0.3);
    font-size: 0.82rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: rgba(255, 255, 255, 0.85);
}

.result-empty[b-3thqwq08ul] {
    padding: 12px 14px;
    color: #888;
    font-size: 0.9rem;
    font-style: italic;
}

.result-row[b-3thqwq08ul] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: rgba(0, 0, 0, 0.35);
}

.result-row + .result-row[b-3thqwq08ul] {
    border-top: 1px solid rgba(255, 255, 255, 0.04);
}

.result-row-icon[b-3thqwq08ul] {
    font-size: 1.2rem;
    min-width: 24px;
    text-align: center;
}

.result-row-label[b-3thqwq08ul] {
    flex: 1;
    color: #ccc;
    font-size: 0.9rem;
}

.result-row-value[b-3thqwq08ul] {
    font-weight: 700;
    font-family: Consolas, monospace;
    color: var(--result-value);
    font-size: 1rem;
}

.agent-losses[b-3thqwq08ul] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: rgba(189, 0, 72, 0.1);
    border: 1px solid rgba(189, 0, 72, 0.3);
    border-radius: 6px;
    font-size: 0.9rem;
    color: #ffaaaa;
}

.loss-icon[b-3thqwq08ul] {
    font-size: 1rem;
}
/* /Components/Move/ActionResults/RevolutionActionResultComponent.razor.rz.scp.css */
.action-result[b-xqmrh6fcg0] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-xqmrh6fcg0] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-xqmrh6fcg0] {
    background: linear-gradient(135deg, rgba(140, 80, 255, 0.3), rgba(80, 40, 180, 0.2));
    border: 2px solid rgba(140, 80, 255, 0.6);
    box-shadow: 0 0 20px rgba(140, 80, 255, 0.3);
}

.result-icon[b-xqmrh6fcg0] {
    font-size: 32px;
}

.result-title[b-xqmrh6fcg0] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-xqmrh6fcg0] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-xqmrh6fcg0] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(140, 80, 255, 0.4);
    border-left: 4px solid rgba(140, 80, 255, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-xqmrh6fcg0] {
    font-size: 40px;
}

.highlight-info[b-xqmrh6fcg0] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-xqmrh6fcg0] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-xqmrh6fcg0] {
    font-size: 28px;
    font-weight: bold;
    color: rgb(180, 140, 255);
    font-family: monospace;
    text-shadow: 0 0 10px rgba(180, 140, 255, 0.5);
}

.result-description[b-xqmrh6fcg0] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(140, 80, 255, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-xqmrh6fcg0] {
        padding: 10px;
    }

    .result-header[b-xqmrh6fcg0] {
        padding: 10px 12px;
    }

    .result-icon[b-xqmrh6fcg0] {
        font-size: 24px;
    }

    .result-title[b-xqmrh6fcg0] {
        font-size: 18px;
    }

    .highlight-box[b-xqmrh6fcg0] {
        padding: 12px;
    }

    .highlight-icon[b-xqmrh6fcg0] {
        font-size: 32px;
    }

    .highlight-value[b-xqmrh6fcg0] {
        font-size: 22px;
    }
}
/* /Components/Move/ActionResults/RocketAttackActionResultComponent.razor.rz.scp.css */
/* Mobile-first: base rules are for phones, the block at the end adjusts them from 576px */
.attack-result[b-eo4815x8k1] {
    padding: 10px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-eo4815x8k1] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.result-header.victory[b-eo4815x8k1] {
    background: linear-gradient(135deg, rgba(0, 189, 101, 0.3), rgba(0, 120, 60, 0.2));
    border: 2px solid rgba(0, 189, 101, 0.6);
    box-shadow: 0 0 20px rgba(0, 189, 101, 0.3);
}

.result-header.defeat[b-eo4815x8k1] {
    background: linear-gradient(135deg, rgba(189, 0, 72, 0.3), rgba(120, 0, 45, 0.2));
    border: 2px solid rgba(189, 0, 72, 0.6);
    box-shadow: 0 0 20px rgba(189, 0, 72, 0.3);
}

.result-icon[b-eo4815x8k1] {
    font-size: 24px;
}

.result-title[b-eo4815x8k1] {
    margin: 0;
    font-size: 18px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.attack-type[b-eo4815x8k1] {
    margin-left: 0;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, 0.6);
    background: rgba(0, 0, 0, 0.3);
    padding: 4px 12px;
    border-radius: 4px;
    width: 100%;
    text-align: center;
    margin-top: 8px;
}

.battle-report[b-eo4815x8k1] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.side-section[b-eo4815x8k1] {
    background: rgba(20, 20, 40, 0.6);
    border-radius: 6px;
    padding: 12px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

.defender-section[b-eo4815x8k1] {
    border-left: 3px solid rgba(255, 100, 100, 0.6);
}

.side-header[b-eo4815x8k1] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.side-icon[b-eo4815x8k1] {
    font-size: 18px;
}

.side-label[b-eo4815x8k1] {
    font-size: 14px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.stats-grid[b-eo4815x8k1] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    flex-direction: column;
}

.stat-group[b-eo4815x8k1] {
    flex: 1 1 auto;
    min-width: 100%;
}

.stat-group-header[b-eo4815x8k1] {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 6px;
}

.stat-item[b-eo4815x8k1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px;
    border-radius: 4px;
    margin-bottom: 2px;
    font-size: 13px;
}

.stat-item.neutral[b-eo4815x8k1] {
    background: rgba(255, 255, 255, 0.05);
}

.stat-item.positive[b-eo4815x8k1] {
    background: rgba(0, 189, 101, 0.15);
}

.stat-item.negative[b-eo4815x8k1] {
    background: rgba(189, 0, 72, 0.15);
}

.stat-name[b-eo4815x8k1] {
    color: rgba(255, 255, 255, 0.8);
}

.stat-value[b-eo4815x8k1] {
    font-weight: 600;
    font-family: monospace;
}

.stat-item.neutral .stat-value[b-eo4815x8k1] {
    color: rgba(255, 255, 255, 0.8);
}

.stat-item.positive .stat-value[b-eo4815x8k1] {
    color: rgb(0, 220, 120);
}

.stat-item.negative .stat-value[b-eo4815x8k1] {
    color: rgb(255, 100, 100);
}

/* From 576px: roomier header, stat groups side by side */
@media (min-width: 576px) {
    .attack-result[b-eo4815x8k1] {
        padding: 16px;
    }

    .result-header[b-eo4815x8k1] {
        padding: 12px 16px;
    }

    .result-icon[b-eo4815x8k1] {
        font-size: 32px;
    }

    .result-title[b-eo4815x8k1] {
        font-size: 24px;
    }

    .attack-type[b-eo4815x8k1] {
        width: auto;
        text-align: inherit;
        margin-top: 0;
        margin-left: auto;
    }

    .stats-grid[b-eo4815x8k1] {
        flex-direction: row;
    }

    .stat-group[b-eo4815x8k1] {
        min-width: 120px;
    }
}
/* /Components/Move/ActionResults/RocketConstructionActionResultComponent.razor.rz.scp.css */
.action-result[b-at6smtqame] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-at6smtqame] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-at6smtqame] {
    background: linear-gradient(135deg, rgba(0, 189, 101, 0.3), rgba(0, 120, 60, 0.2));
    border: 2px solid rgba(0, 189, 101, 0.6);
    box-shadow: 0 0 20px rgba(0, 189, 101, 0.3);
}

.result-icon[b-at6smtqame] {
    font-size: 32px;
}

.result-title[b-at6smtqame] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-at6smtqame] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-at6smtqame] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(0, 189, 101, 0.4);
    border-left: 4px solid rgba(0, 189, 101, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-at6smtqame] {
    font-size: 40px;
}

.highlight-info[b-at6smtqame] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-at6smtqame] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-at6smtqame] {
    font-size: 28px;
    font-weight: bold;
    color: rgb(0, 220, 120);
    font-family: monospace;
    text-shadow: 0 0 10px rgba(0, 220, 120, 0.5);
}

.result-description[b-at6smtqame] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}
/* /Components/Move/ActionResults/ScienceCenterInfiltrationActionResultComponent.razor.rz.scp.css */
.infiltration-result[b-e1f1w8vd9c] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
    overflow-y: auto;
    text-shadow: 2px 2px 5px black;
}

/* Result header */
.result-header[b-e1f1w8vd9c] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 18px;
    border-radius: 8px;
}

.result-header.success[b-e1f1w8vd9c] {
    background: rgba(0, 189, 101, 0.2);
    border: 2px solid rgba(0, 189, 101, 0.6);
    box-shadow: 0 0 20px rgba(0, 189, 101, 0.25);
}

.result-header.failure[b-e1f1w8vd9c] {
    background: rgba(189, 0, 72, 0.2);
    border: 2px solid rgba(189, 0, 72, 0.6);
    box-shadow: 0 0 20px rgba(189, 0, 72, 0.25);
}

.result-icon[b-e1f1w8vd9c] {
    font-size: 38px;
    flex-shrink: 0;
}

.result-title[b-e1f1w8vd9c] {
    margin: 0 0 2px 0;
    font-size: 1.35rem;
    font-weight: bold;
    color: white;
}

.result-subtitle[b-e1f1w8vd9c] {
    margin: 0;
    font-size: 0.85rem;
    color: #b0b0b0;
}

/* Intelligence report card */
.intel-card[b-e1f1w8vd9c] {
    background: rgba(20, 20, 40, 0.8);
    border: 1px solid rgba(100, 150, 255, 0.3);
    border-radius: 8px;
    overflow: hidden;
}

.intel-card-header[b-e1f1w8vd9c] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 14px;
    background: rgba(32, 178, 170, 0.2);
    border-bottom: 1px solid rgba(32, 178, 170, 0.4);
    font-size: 0.82rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: rgba(255, 255, 255, 0.85);
}

.intel-score[b-e1f1w8vd9c] {
    font-weight: 400;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.6);
    text-transform: none;
    letter-spacing: 0;
}

.intel-score strong[b-e1f1w8vd9c] {
    color: #ffd700;
    font-weight: 700;
}

/* Unit rows */
.unit-list[b-e1f1w8vd9c] {
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.unit-item[b-e1f1w8vd9c] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: rgba(0, 0, 0, 0.35);
    border-radius: 5px;
    border-left: 3px solid rgba(100, 150, 255, 0.4);
    transition: background-color 0.15s;
}

.unit-item:hover[b-e1f1w8vd9c] {
    background: rgba(0, 0, 0, 0.5);
}

.unit-icon[b-e1f1w8vd9c] {
    font-size: 1.1rem;
    min-width: 24px;
    text-align: center;
}

.unit-label[b-e1f1w8vd9c] {
    color: #ccc;
    font-size: 0.9rem;
    flex: 1;
}

.unit-range[b-e1f1w8vd9c] {
    font-weight: 700;
    font-family: Consolas, monospace;
    color: #87ceeb;
    font-size: 0.95rem;
}
/* /Components/Move/ActionResults/SecretServiceInfiltrationActionResultComponent.razor.rz.scp.css */
.infiltration-result[b-d1jmr2pnku] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
    overflow-y: auto;
    text-shadow: 2px 2px 5px black;
}

/* Result header */
.result-header[b-d1jmr2pnku] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 18px;
    border-radius: 8px;
}

.result-header.success[b-d1jmr2pnku] {
    background: rgba(0, 189, 101, 0.2);
    border: 2px solid rgba(0, 189, 101, 0.6);
    box-shadow: 0 0 20px rgba(0, 189, 101, 0.25);
}

.result-header.failure[b-d1jmr2pnku] {
    background: rgba(189, 0, 72, 0.2);
    border: 2px solid rgba(189, 0, 72, 0.6);
    box-shadow: 0 0 20px rgba(189, 0, 72, 0.25);
}

.result-icon[b-d1jmr2pnku] {
    font-size: 38px;
    flex-shrink: 0;
}

.result-title[b-d1jmr2pnku] {
    margin: 0 0 2px 0;
    font-size: 1.35rem;
    font-weight: bold;
    color: white;
}

.result-subtitle[b-d1jmr2pnku] {
    margin: 0;
    font-size: 0.85rem;
    color: #b0b0b0;
}

/* Intelligence report card */
.intel-card[b-d1jmr2pnku] {
    background: rgba(20, 20, 40, 0.8);
    border: 1px solid rgba(100, 150, 255, 0.3);
    border-radius: 8px;
    overflow: hidden;
}

.intel-card-header[b-d1jmr2pnku] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 14px;
    background: rgba(32, 178, 170, 0.2);
    border-bottom: 1px solid rgba(32, 178, 170, 0.4);
    font-size: 0.82rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: rgba(255, 255, 255, 0.85);
}

.intel-score[b-d1jmr2pnku] {
    font-weight: 400;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.6);
    text-transform: none;
    letter-spacing: 0;
}

.intel-score strong[b-d1jmr2pnku] {
    color: #ffd700;
    font-weight: 700;
}

/* Unit rows */
.unit-list[b-d1jmr2pnku] {
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.unit-item[b-d1jmr2pnku] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: rgba(0, 0, 0, 0.35);
    border-radius: 5px;
    border-left: 3px solid rgba(100, 150, 255, 0.4);
    transition: background-color 0.15s;
}

.unit-item:hover[b-d1jmr2pnku] {
    background: rgba(0, 0, 0, 0.5);
}

.unit-icon[b-d1jmr2pnku] {
    font-size: 1.1rem;
    min-width: 24px;
    text-align: center;
}

.unit-label[b-d1jmr2pnku] {
    color: #ccc;
    font-size: 0.9rem;
    flex: 1;
}

.unit-range[b-d1jmr2pnku] {
    font-weight: 700;
    font-family: Consolas, monospace;
    color: #87ceeb;
    font-size: 0.95rem;
}
/* /Components/Move/ActionResults/SetBarracksActionResultComponent.razor.rz.scp.css */
.action-result[b-hqtnsbsite] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-hqtnsbsite] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-hqtnsbsite] {
    background: linear-gradient(135deg, rgba(200, 55, 55, 0.3), rgba(130, 20, 20, 0.2));
    border: 2px solid rgba(200, 55, 55, 0.6);
    box-shadow: 0 0 20px rgba(200, 55, 55, 0.3);
}

.result-icon[b-hqtnsbsite] {
    font-size: 32px;
}

.result-title[b-hqtnsbsite] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-hqtnsbsite] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-hqtnsbsite] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(200, 55, 55, 0.4);
    border-left: 4px solid rgba(200, 55, 55, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-hqtnsbsite] {
    font-size: 40px;
}

.highlight-info[b-hqtnsbsite] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-hqtnsbsite] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-hqtnsbsite] {
    font-size: 20px;
    font-weight: bold;
    color: rgb(255, 110, 100);
    text-shadow: 0 0 10px rgba(255, 110, 100, 0.5);
}

.result-description[b-hqtnsbsite] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-hqtnsbsite] {
        padding: 10px;
    }

    .result-header[b-hqtnsbsite] {
        padding: 10px 12px;
    }

    .result-icon[b-hqtnsbsite] {
        font-size: 24px;
    }

    .result-title[b-hqtnsbsite] {
        font-size: 18px;
    }

    .highlight-box[b-hqtnsbsite] {
        padding: 12px;
    }

    .highlight-icon[b-hqtnsbsite] {
        font-size: 32px;
    }

    .highlight-value[b-hqtnsbsite] {
        font-size: 16px;
    }
}
/* /Components/Move/ActionResults/SetFactoriesActionResultComponent.razor.rz.scp.css */
.action-result[b-gexjm5lq2z] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-gexjm5lq2z] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-gexjm5lq2z] {
    background: linear-gradient(135deg, rgba(0, 175, 160, 0.3), rgba(0, 110, 100, 0.2));
    border: 2px solid rgba(0, 175, 160, 0.6);
    box-shadow: 0 0 20px rgba(0, 175, 160, 0.3);
}

.result-icon[b-gexjm5lq2z] {
    font-size: 32px;
}

.result-title[b-gexjm5lq2z] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-gexjm5lq2z] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-gexjm5lq2z] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(0, 175, 160, 0.4);
    border-left: 4px solid rgba(0, 175, 160, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-gexjm5lq2z] {
    font-size: 40px;
}

.highlight-info[b-gexjm5lq2z] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-gexjm5lq2z] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-gexjm5lq2z] {
    font-size: 20px;
    font-weight: bold;
    color: rgb(0, 215, 195);
    text-shadow: 0 0 10px rgba(0, 215, 195, 0.5);
}

.result-description[b-gexjm5lq2z] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-gexjm5lq2z] {
        padding: 10px;
    }

    .result-header[b-gexjm5lq2z] {
        padding: 10px 12px;
    }

    .result-icon[b-gexjm5lq2z] {
        font-size: 24px;
    }

    .result-title[b-gexjm5lq2z] {
        font-size: 18px;
    }

    .highlight-box[b-gexjm5lq2z] {
        padding: 12px;
    }

    .highlight-icon[b-gexjm5lq2z] {
        font-size: 32px;
    }

    .highlight-value[b-gexjm5lq2z] {
        font-size: 16px;
    }
}
/* /Components/Move/ActionResults/SetUniversitiesActionResultComponent.razor.rz.scp.css */
.action-result[b-jol5tqwgl9] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-jol5tqwgl9] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-jol5tqwgl9] {
    background: linear-gradient(135deg, rgba(40, 110, 230, 0.3), rgba(20, 60, 160, 0.2));
    border: 2px solid rgba(40, 110, 230, 0.6);
    box-shadow: 0 0 20px rgba(40, 110, 230, 0.3);
}

.result-icon[b-jol5tqwgl9] {
    font-size: 32px;
}

.result-title[b-jol5tqwgl9] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-jol5tqwgl9] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-jol5tqwgl9] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(40, 110, 230, 0.4);
    border-left: 4px solid rgba(40, 110, 230, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-jol5tqwgl9] {
    font-size: 40px;
}

.highlight-info[b-jol5tqwgl9] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-jol5tqwgl9] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-jol5tqwgl9] {
    font-size: 20px;
    font-weight: bold;
    color: rgb(100, 170, 255);
    text-shadow: 0 0 10px rgba(100, 170, 255, 0.5);
}

.result-description[b-jol5tqwgl9] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-jol5tqwgl9] {
        padding: 10px;
    }

    .result-header[b-jol5tqwgl9] {
        padding: 10px 12px;
    }

    .result-icon[b-jol5tqwgl9] {
        font-size: 24px;
    }

    .result-title[b-jol5tqwgl9] {
        font-size: 18px;
    }

    .highlight-box[b-jol5tqwgl9] {
        padding: 12px;
    }

    .highlight-icon[b-jol5tqwgl9] {
        font-size: 32px;
    }

    .highlight-value[b-jol5tqwgl9] {
        font-size: 16px;
    }
}
/* /Components/Move/ActionResults/SubsidizeAetheriumRefineryActionResultComponent.razor.rz.scp.css */
.action-result[b-1oeajdimq1] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-1oeajdimq1] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-1oeajdimq1] {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.3), rgba(180, 130, 0, 0.2));
    border: 2px solid rgba(255, 193, 7, 0.6);
    box-shadow: 0 0 20px rgba(255, 193, 7, 0.3);
}

.result-icon[b-1oeajdimq1] {
    font-size: 32px;
}

.result-title[b-1oeajdimq1] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-1oeajdimq1] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-1oeajdimq1] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(255, 193, 7, 0.4);
    border-left: 4px solid rgba(255, 193, 7, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-1oeajdimq1] {
    font-size: 40px;
}

.highlight-info[b-1oeajdimq1] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-1oeajdimq1] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-1oeajdimq1] {
    font-size: 20px;
    font-weight: bold;
    color: rgb(255, 215, 100);
    text-shadow: 0 0 10px rgba(255, 215, 100, 0.5);
}

.result-description[b-1oeajdimq1] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-1oeajdimq1] {
        padding: 10px;
    }

    .result-header[b-1oeajdimq1] {
        padding: 10px 12px;
    }

    .result-icon[b-1oeajdimq1] {
        font-size: 24px;
    }

    .result-title[b-1oeajdimq1] {
        font-size: 18px;
    }

    .highlight-box[b-1oeajdimq1] {
        padding: 12px;
    }

    .highlight-icon[b-1oeajdimq1] {
        font-size: 32px;
    }

    .highlight-value[b-1oeajdimq1] {
        font-size: 16px;
    }
}
/* /Components/Move/ActionResults/SubsidizeBarracksActionResultComponent.razor.rz.scp.css */
.action-result[b-838mxm6ogh] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-838mxm6ogh] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-838mxm6ogh] {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.3), rgba(180, 130, 0, 0.2));
    border: 2px solid rgba(255, 193, 7, 0.6);
    box-shadow: 0 0 20px rgba(255, 193, 7, 0.3);
}

.result-icon[b-838mxm6ogh] {
    font-size: 32px;
}

.result-title[b-838mxm6ogh] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-838mxm6ogh] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-838mxm6ogh] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(255, 193, 7, 0.4);
    border-left: 4px solid rgba(255, 193, 7, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-838mxm6ogh] {
    font-size: 40px;
}

.highlight-info[b-838mxm6ogh] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-838mxm6ogh] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-838mxm6ogh] {
    font-size: 20px;
    font-weight: bold;
    color: rgb(255, 215, 100);
    text-shadow: 0 0 10px rgba(255, 215, 100, 0.5);
}

.result-description[b-838mxm6ogh] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-838mxm6ogh] {
        padding: 10px;
    }

    .result-header[b-838mxm6ogh] {
        padding: 10px 12px;
    }

    .result-icon[b-838mxm6ogh] {
        font-size: 24px;
    }

    .result-title[b-838mxm6ogh] {
        font-size: 18px;
    }

    .highlight-box[b-838mxm6ogh] {
        padding: 12px;
    }

    .highlight-icon[b-838mxm6ogh] {
        font-size: 32px;
    }

    .highlight-value[b-838mxm6ogh] {
        font-size: 16px;
    }
}
/* /Components/Move/ActionResults/SubsidizeFactoriesActionResultComponent.razor.rz.scp.css */
.action-result[b-vgv3casal3] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-vgv3casal3] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-vgv3casal3] {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.3), rgba(180, 130, 0, 0.2));
    border: 2px solid rgba(255, 193, 7, 0.6);
    box-shadow: 0 0 20px rgba(255, 193, 7, 0.3);
}

.result-icon[b-vgv3casal3] {
    font-size: 32px;
}

.result-title[b-vgv3casal3] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-vgv3casal3] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-vgv3casal3] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(255, 193, 7, 0.4);
    border-left: 4px solid rgba(255, 193, 7, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-vgv3casal3] {
    font-size: 40px;
}

.highlight-info[b-vgv3casal3] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-vgv3casal3] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-vgv3casal3] {
    font-size: 20px;
    font-weight: bold;
    color: rgb(255, 215, 100);
    text-shadow: 0 0 10px rgba(255, 215, 100, 0.5);
}

.result-description[b-vgv3casal3] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-vgv3casal3] {
        padding: 10px;
    }

    .result-header[b-vgv3casal3] {
        padding: 10px 12px;
    }

    .result-icon[b-vgv3casal3] {
        font-size: 24px;
    }

    .result-title[b-vgv3casal3] {
        font-size: 18px;
    }

    .highlight-box[b-vgv3casal3] {
        padding: 12px;
    }

    .highlight-icon[b-vgv3casal3] {
        font-size: 32px;
    }

    .highlight-value[b-vgv3casal3] {
        font-size: 16px;
    }
}
/* /Components/Move/ActionResults/SubsidizeFarmsActionResultComponent.razor.rz.scp.css */
.action-result[b-w4mtzwxrmp] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-w4mtzwxrmp] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-w4mtzwxrmp] {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.3), rgba(180, 130, 0, 0.2));
    border: 2px solid rgba(255, 193, 7, 0.6);
    box-shadow: 0 0 20px rgba(255, 193, 7, 0.3);
}

.result-icon[b-w4mtzwxrmp] {
    font-size: 32px;
}

.result-title[b-w4mtzwxrmp] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-w4mtzwxrmp] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-w4mtzwxrmp] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(255, 193, 7, 0.4);
    border-left: 4px solid rgba(255, 193, 7, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-w4mtzwxrmp] {
    font-size: 40px;
}

.highlight-info[b-w4mtzwxrmp] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-w4mtzwxrmp] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-w4mtzwxrmp] {
    font-size: 20px;
    font-weight: bold;
    color: rgb(255, 215, 100);
    text-shadow: 0 0 10px rgba(255, 215, 100, 0.5);
}

.result-description[b-w4mtzwxrmp] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-w4mtzwxrmp] {
        padding: 10px;
    }

    .result-header[b-w4mtzwxrmp] {
        padding: 10px 12px;
    }

    .result-icon[b-w4mtzwxrmp] {
        font-size: 24px;
    }

    .result-title[b-w4mtzwxrmp] {
        font-size: 18px;
    }

    .highlight-box[b-w4mtzwxrmp] {
        padding: 12px;
    }

    .highlight-icon[b-w4mtzwxrmp] {
        font-size: 32px;
    }

    .highlight-value[b-w4mtzwxrmp] {
        font-size: 16px;
    }
}
/* /Components/Move/ActionResults/SubsidizePowerPlantsActionResultComponent.razor.rz.scp.css */
.action-result[b-6qxcdyuhph] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-6qxcdyuhph] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-6qxcdyuhph] {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.3), rgba(180, 130, 0, 0.2));
    border: 2px solid rgba(255, 193, 7, 0.6);
    box-shadow: 0 0 20px rgba(255, 193, 7, 0.3);
}

.result-icon[b-6qxcdyuhph] {
    font-size: 32px;
}

.result-title[b-6qxcdyuhph] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-6qxcdyuhph] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-6qxcdyuhph] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(255, 193, 7, 0.4);
    border-left: 4px solid rgba(255, 193, 7, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-6qxcdyuhph] {
    font-size: 40px;
}

.highlight-info[b-6qxcdyuhph] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-6qxcdyuhph] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-6qxcdyuhph] {
    font-size: 20px;
    font-weight: bold;
    color: rgb(255, 215, 100);
    text-shadow: 0 0 10px rgba(255, 215, 100, 0.5);
}

.result-description[b-6qxcdyuhph] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-6qxcdyuhph] {
        padding: 10px;
    }

    .result-header[b-6qxcdyuhph] {
        padding: 10px 12px;
    }

    .result-icon[b-6qxcdyuhph] {
        font-size: 24px;
    }

    .result-title[b-6qxcdyuhph] {
        font-size: 18px;
    }

    .highlight-box[b-6qxcdyuhph] {
        padding: 12px;
    }

    .highlight-icon[b-6qxcdyuhph] {
        font-size: 32px;
    }

    .highlight-value[b-6qxcdyuhph] {
        font-size: 16px;
    }
}
/* /Components/Move/ActionResults/SubsidizeShoppingCentersActionResultComponent.razor.rz.scp.css */
.action-result[b-2yy2fwe0oe] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-2yy2fwe0oe] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-2yy2fwe0oe] {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.3), rgba(180, 130, 0, 0.2));
    border: 2px solid rgba(255, 193, 7, 0.6);
    box-shadow: 0 0 20px rgba(255, 193, 7, 0.3);
}

.result-icon[b-2yy2fwe0oe] {
    font-size: 32px;
}

.result-title[b-2yy2fwe0oe] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-2yy2fwe0oe] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-2yy2fwe0oe] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(255, 193, 7, 0.4);
    border-left: 4px solid rgba(255, 193, 7, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-2yy2fwe0oe] {
    font-size: 40px;
}

.highlight-info[b-2yy2fwe0oe] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-2yy2fwe0oe] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-2yy2fwe0oe] {
    font-size: 20px;
    font-weight: bold;
    color: rgb(255, 215, 100);
    text-shadow: 0 0 10px rgba(255, 215, 100, 0.5);
}

.result-description[b-2yy2fwe0oe] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

@media (max-width: 575px) {
    .action-result[b-2yy2fwe0oe] {
        padding: 10px;
    }

    .result-header[b-2yy2fwe0oe] {
        padding: 10px 12px;
    }

    .result-icon[b-2yy2fwe0oe] {
        font-size: 24px;
    }

    .result-title[b-2yy2fwe0oe] {
        font-size: 18px;
    }

    .highlight-box[b-2yy2fwe0oe] {
        padding: 12px;
    }

    .highlight-icon[b-2yy2fwe0oe] {
        font-size: 32px;
    }

    .highlight-value[b-2yy2fwe0oe] {
        font-size: 16px;
    }
}
/* /Components/Move/ActionResults/TankAttackActionResultComponent.razor.rz.scp.css */
/* Mobile-first: base rules are for phones, the block at the end adjusts them from 576px */
.attack-result[b-fj9wv3080y] {
    padding: 10px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-fj9wv3080y] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.result-header.victory[b-fj9wv3080y] {
    background: linear-gradient(135deg, rgba(0, 189, 101, 0.3), rgba(0, 120, 60, 0.2));
    border: 2px solid rgba(0, 189, 101, 0.6);
    box-shadow: 0 0 20px rgba(0, 189, 101, 0.3);
}

.result-header.defeat[b-fj9wv3080y] {
    background: linear-gradient(135deg, rgba(189, 0, 72, 0.3), rgba(120, 0, 45, 0.2));
    border: 2px solid rgba(189, 0, 72, 0.6);
    box-shadow: 0 0 20px rgba(189, 0, 72, 0.3);
}

.result-header.draw[b-fj9wv3080y] {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.3), rgba(180, 130, 0, 0.2));
    border: 2px solid rgba(255, 193, 7, 0.6);
    box-shadow: 0 0 20px rgba(255, 193, 7, 0.3);
}

.result-icon[b-fj9wv3080y] {
    font-size: 24px;
}

.result-title[b-fj9wv3080y] {
    margin: 0;
    font-size: 18px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.attack-type[b-fj9wv3080y] {
    margin-left: 0;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, 0.6);
    background: rgba(0, 0, 0, 0.3);
    padding: 4px 12px;
    border-radius: 4px;
    width: 100%;
    text-align: center;
    margin-top: 8px;
}

.battle-report[b-fj9wv3080y] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.side-section[b-fj9wv3080y] {
    background: rgba(20, 20, 40, 0.6);
    border-radius: 6px;
    padding: 12px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

.aggressor-section[b-fj9wv3080y] {
    border-left: 3px solid rgba(100, 150, 255, 0.6);
}

.defender-section[b-fj9wv3080y] {
    border-left: 3px solid rgba(255, 100, 100, 0.6);
}

.side-header[b-fj9wv3080y] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.side-icon[b-fj9wv3080y] {
    font-size: 18px;
}

.side-label[b-fj9wv3080y] {
    font-size: 14px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.stats-grid[b-fj9wv3080y] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    flex-direction: column;
}

.stat-group[b-fj9wv3080y] {
    flex: 1 1 auto;
    min-width: 100%;
}

.stat-group-header[b-fj9wv3080y] {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 6px;
}

.stat-item[b-fj9wv3080y] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px;
    border-radius: 4px;
    margin-bottom: 2px;
    font-size: 13px;
}

.stat-item.positive[b-fj9wv3080y] {
    background: rgba(0, 189, 101, 0.15);
}

.stat-item.negative[b-fj9wv3080y] {
    background: rgba(189, 0, 72, 0.15);
}

.stat-name[b-fj9wv3080y] {
    color: rgba(255, 255, 255, 0.8);
}

.stat-value[b-fj9wv3080y] {
    font-weight: 600;
    font-family: monospace;
}

.stat-item.positive .stat-value[b-fj9wv3080y] {
    color: rgb(0, 220, 120);
}

.stat-item.negative .stat-value[b-fj9wv3080y] {
    color: rgb(255, 100, 100);
}

/* From 576px: roomier header, stat groups side by side */
@media (min-width: 576px) {
    .attack-result[b-fj9wv3080y] {
        padding: 16px;
    }

    .result-header[b-fj9wv3080y] {
        padding: 12px 16px;
    }

    .result-icon[b-fj9wv3080y] {
        font-size: 32px;
    }

    .result-title[b-fj9wv3080y] {
        font-size: 24px;
    }

    .attack-type[b-fj9wv3080y] {
        width: auto;
        text-align: inherit;
        margin-top: 0;
        margin-left: auto;
    }

    .stats-grid[b-fj9wv3080y] {
        flex-direction: row;
    }

    .stat-group[b-fj9wv3080y] {
        min-width: 120px;
    }

    .stat-group-header[b-fj9wv3080y] {
        font-size: 11px;
    }
}
/* /Components/Move/ActionResults/TrainAgentsActionResultComponent.razor.rz.scp.css */
.action-result[b-g1vxyequcp] {
    padding: 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.result-header[b-g1vxyequcp] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.result-header.success[b-g1vxyequcp] {
    background: linear-gradient(135deg, rgba(0, 189, 101, 0.3), rgba(0, 120, 60, 0.2));
    border: 2px solid rgba(0, 189, 101, 0.6);
    box-shadow: 0 0 20px rgba(0, 189, 101, 0.3);
}

.result-icon[b-g1vxyequcp] {
    font-size: 32px;
}

.result-title[b-g1vxyequcp] {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.result-content[b-g1vxyequcp] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.highlight-box[b-g1vxyequcp] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(0, 189, 101, 0.4);
    border-left: 4px solid rgba(0, 189, 101, 0.8);
    border-radius: 8px;
    padding: 16px 20px;
}

.highlight-icon[b-g1vxyequcp] {
    font-size: 40px;
}

.highlight-info[b-g1vxyequcp] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.highlight-label[b-g1vxyequcp] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.6);
}

.highlight-value[b-g1vxyequcp] {
    font-size: 28px;
    font-weight: bold;
    color: rgb(0, 220, 120);
    font-family: monospace;
    text-shadow: 0 0 10px rgba(0, 220, 120, 0.5);
}

.result-description[b-g1vxyequcp] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 12px;
    background: rgba(20, 20, 40, 0.4);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}
/* /Components/Move/Events/AgentsPayedComponent.razor.rz.scp.css */
.main-border[b-o5wmn0vvx9] {
    background-color: rgb(0, 132, 189);
    border-radius:4px;
    margin: 10px;
}
/* /Components/Move/Events/BuildingsBuiltComponent.razor.rz.scp.css */
.main-border[b-u3ip8k2wyu] {
    background-color: rgb(0, 132, 189);
    border-radius:4px;
    margin: 10px;
}
/* /Components/Move/Events/BuildingsPayedComponent.razor.rz.scp.css */
.main-border[b-7i63j0pvcw] {
    background-color: rgb(0, 132, 189);
    border-radius:4px;
    margin: 10px;
}
/* /Components/Move/Events/EventComponentBorder.razor.rz.scp.css */
.main-border[b-qoh1vy66gl] {
    border-radius: 4px;
    padding:1px 12px;
}

.positive-event[b-qoh1vy66gl] {
    background-color: rgb(0, 189, 101);
}

.negative-event[b-qoh1vy66gl] {
    background-color: rgb(189, 0, 72);
}

.action-event[b-qoh1vy66gl] {
    background-color: rgb(0, 132, 189);
}

.action-event[b-qoh1vy66gl] {
    background-color: rgb(99, 99, 99);
    padding: 0px 6px;
}
/* /Components/Move/Events/EventList.razor.rz.scp.css */
.item-row[b-5mzx5w7f9z] {
    padding: 3px 5px;
}
/* /Components/Move/Events/HighBirthRateEventComponent.razor.rz.scp.css */
.main-border[b-l0drbxtn83] {
    background-color: rgb(0, 189, 101);
    margin: 10px;
    border-radius:4px;
}
/* /Components/Move/Events/IncreasedCrimeRateEventComponent.razor.rz.scp.css */
.main-border[b-nrqqgsu2fe] {
    background-color: rgb(189, 0, 72);
    
    margin: 10px;
}
/* /Components/Move/Events/NewAreaFoundComponent.razor.rz.scp.css */
.main-border[b-14qh06ysoa]{
    background-color: forestgreen;
    margin: 10px;
}

.text[b-14qh06ysoa] {

}
/* /Components/Move/Events/RocketPartsProducedEventComponent.razor.rz.scp.css */
.main-border[b-zw91836h9v] {
    background-color: rgb(0, 132, 189);
    border-radius:4px;
    margin: 10px;
}
/* /Components/Move/MoveActionButton.razor.rz.scp.css */
/* Phones: across the full width of the tile; from 768px a compact inline button */
.action-container[b-kbg5i09ogh] {
    display: flex;
    width: 100%;
    flex-direction: row;
    align-items: stretch;
    border-radius: 8px;
    /* Convex 3D effect: light-overlay gradient stacked over base color gradient.
       Top half lighter (reflected light), bottom half darker (shadow side). */
    background:
        linear-gradient(to bottom,
            rgba(255, 255, 255, 0.28)  0%,
            rgba(255, 255, 255, 0.06) 45%,
            rgba(0,   0,   0,   0.06) 55%,
            rgba(0,   0,   0,   0.22) 100%),
        linear-gradient(135deg, #3d5af1 0%, #7439d4 100%);
    overflow: hidden;
    height: 44px;
    transition: opacity 0.2s;
    /* Outer drop-shadow anchors the button + inset specular lines on top/bottom edges */
    box-shadow:
        0 5px 18px rgba(40, 20, 160, 0.55),
        inset 0  1px 0 rgba(255, 255, 255, 0.45),
        inset 0 -1px 0 rgba(0,   0,   0,   0.30);
}

.action-container.disabled[b-kbg5i09ogh] {
    opacity: 0.5;
}

.arrow-col[b-kbg5i09ogh] {
    display: flex;
    flex-direction: column;
    width: 28px;
    flex-shrink: 0;
    border-right: 1px solid rgba(255, 255, 255, 0.18);
}

.arrow-btn[b-kbg5i09ogh] {
    flex: 1;
    border: none;
    background: transparent;
    color: rgba(255, 255, 255, 0.9);
    font-size: 9px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
    padding: 0;
    line-height: 1;
}

    .arrow-btn:first-child[b-kbg5i09ogh] {
        border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    }

    @media (hover: hover) {
        .arrow-btn:hover:not(:disabled)[b-kbg5i09ogh] {
            background: rgba(255, 255, 255, 0.15);
        }
    }

    .arrow-btn:disabled[b-kbg5i09ogh] {
        opacity: 0.3;
        cursor: not-allowed;
    }

.turn-input[b-kbg5i09ogh] {
    width: 52px;
    flex-shrink: 0;
    background: transparent;
    border: none;
    color: white;
    text-align: center;
    font-size: 15px;
    font-weight: 700;
    text-shadow: 0 1px 5px rgba(0, 0, 0, 0.35);
    padding: 0 4px;
    height: 100%;
}

    .turn-input:focus[b-kbg5i09ogh] {
        outline: none;
        background: rgba(255, 255, 255, 0.1);
    }

    /* Remove native number input spinners */
    .turn-input[b-kbg5i09ogh]::-webkit-outer-spin-button,
    .turn-input[b-kbg5i09ogh]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    .turn-input[type=number][b-kbg5i09ogh] {
        -moz-appearance: textfield;
    }

.turn-display[b-kbg5i09ogh] {
    width: 52px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 16px;
    font-weight: 700;
    text-shadow: 0 1px 5px rgba(0, 0, 0, 0.35);
}

.section-divider[b-kbg5i09ogh] {
    width: 1px;
    background: rgba(255, 255, 255, 0.18);
    align-self: stretch;
    flex-shrink: 0;
}

.execute-btn[b-kbg5i09ogh] {
    flex: 1;
    border: none;
    background: transparent;
    color: white;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.03em;
    cursor: pointer;
    transition: background 0.15s;
    text-shadow: 0 1px 5px rgba(0, 0, 0, 0.35);
    padding: 0 16px;
    /* Phones: a long action name wraps to two lines next to the turn controls instead of being cut */
    line-height: 1.15;
}

    @media (hover: hover) {
        .execute-btn:hover:not(:disabled)[b-kbg5i09ogh] {
            background: rgba(255, 255, 255, 0.12);
        }
    }

    /* Simulate press: darken top, slightly lighten bottom — inverts convex illusion */
    .execute-btn:active:not(:disabled)[b-kbg5i09ogh] {
        background: rgba(0, 0, 0, 0.12);
    }

    .execute-btn:disabled[b-kbg5i09ogh] {
        opacity: 0.4;
        cursor: not-allowed;
    }

.sign-icon[b-kbg5i09ogh] {
    display: none;
}

@media (min-width: 768px) {
    .action-container[b-kbg5i09ogh] {
        display: inline-flex;
        width: auto;
        min-width: 200px;
        max-width: 360px;
    }

    .execute-btn[b-kbg5i09ogh] {
        white-space: nowrap;
    }
}

/* Touch devices (any width): [−][ 3 ][+] with 44px buttons instead of tiny stacked arrows. They take more room, a long
   action name wraps also on tablets. */
@media (pointer: coarse) {
    .action-container[b-kbg5i09ogh] {
        max-width: 100%;
    }

    .execute-btn[b-kbg5i09ogh] {
        min-width: 0;
        padding: 0 8px;
        white-space: normal;
    }

    .arrow-col[b-kbg5i09ogh] {
        display: contents;
    }

    .arrow-btn[b-kbg5i09ogh] {
        flex: 0 0 var(--pow-touch-target);
        font-size: 1.25rem;
        font-weight: bold;
    }

    .arrow-btn:first-child[b-kbg5i09ogh] {
        border-bottom: none;
    }

    .arrow-btn--decrement[b-kbg5i09ogh] {
        order: -2;
        border-right: 1px solid rgba(255, 255, 255, 0.18);
    }

    .turn-input[b-kbg5i09ogh] {
        order: -1;
    }

    .arrow-btn--increment[b-kbg5i09ogh] {
        order: 0;
        border-right: 1px solid rgba(255, 255, 255, 0.18);
    }

    .section-divider[b-kbg5i09ogh] {
        display: none;
    }

    .arrow-icon[b-kbg5i09ogh] {
        display: none;
    }

    .sign-icon[b-kbg5i09ogh] {
        display: inline;
    }
}
/* /Components/Move/MoveActionResultsView.razor.rz.scp.css */
/* Custom scrollbar styling - WebKit (Chrome, Safari, Edge) */
.moves-list[b-kn6e5m9cbx]::-webkit-scrollbar {
    width: 8px;
}

.moves-list[b-kn6e5m9cbx]::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.3);
    border-radius: 4px;
}

.moves-list[b-kn6e5m9cbx]::-webkit-scrollbar-thumb {
    background: rgba(100, 150, 255, 0.4);
    border-radius: 4px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

.moves-list[b-kn6e5m9cbx]::-webkit-scrollbar-thumb:hover {
    background: rgba(100, 150, 255, 0.6);
}

/* Firefox scrollbar */
.moves-list[b-kn6e5m9cbx] {
    scrollbar-width: thin;
    scrollbar-color: rgba(100, 150, 255, 0.4) rgba(0, 0, 0, 0.3);
}

/* Modal overlay - always fills screen */
.modal[b-kn6e5m9cbx] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    overflow-y: auto;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* Content wrapper */
.modal-content-wrapper[b-kn6e5m9cbx] {
    width: 100%;
    box-sizing: border-box;
}

.action-result-content[b-kn6e5m9cbx] {
    margin: 8px;
    overflow: hidden;
}

.summary-statistics-content[b-kn6e5m9cbx] {
    margin: 8px;
    overflow: hidden;
}

.moves-list[b-kn6e5m9cbx] {
    margin: 8px;
    overflow: hidden;
}

.columns-row[b-kn6e5m9cbx] {
    padding-bottom: 52px;
}

.tile-button-wrapper[b-kn6e5m9cbx] {
    position: relative;
    width: 100%;
}

/* Phones and tablets: the whole window scrolls - the button sticks to the bottom so it can be closed any time.
   At the end of the content it settles half over the tile border as on PC. */
.close-button-row[b-kn6e5m9cbx] {
    margin-top: -22px;
    position: sticky;
    bottom: calc(8px + var(--pow-safe-area-bottom));
    z-index: 10;
}

.close[b-kn6e5m9cbx] {
    background-color: rgb(10, 10, 30);
    border: solid white 1px;
    box-shadow: 0 0 .2rem #fff, 0 0 .2rem #fff, 0 0 2rem #3347ff, 0 0 0.6rem #3347ff, inset 0 0 0.5rem #3347ff;
    color: white;
    border-radius: 10px;
    padding: 10px 60px;
    font-size: 18px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-shadow: 2px 2px 5px black;
}

@media (hover: hover) {
    .close:hover[b-kn6e5m9cbx] {
        background: rgb(20, 25, 80);
        box-shadow: 0 0 .4rem #fff, 0 0 .4rem #fff, 0 0 3rem #3347ff, 0 0 1rem #3347ff, inset 0 0 1rem #3347ff;
    }

    .segment:hover[b-kn6e5m9cbx] {
        border-color: rgba(100, 150, 255, 0.5);
        box-shadow: 0 0 15px rgba(100, 150, 255, 0.2);
    }
}

.segment[b-kn6e5m9cbx] {
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 6px;
    background-color: rgba(20, 20, 40, 0.8);
    transition: all 0.3s ease;
}

/* Mobile - full width, whole modal scrolls; keep clear of the notch and the home indicator */
.modal-padding[b-kn6e5m9cbx] {
    padding: calc(8px + var(--pow-safe-area-top)) calc(8px + var(--pow-safe-area-right))
             calc(8px + var(--pow-safe-area-bottom)) calc(8px + var(--pow-safe-area-left));
}

/* Tablets */
@media (min-width: 768px) {
    .modal-padding[b-kn6e5m9cbx] {
        padding: 16px;
    }
}

/* Large screens (two columns) - fixed height modal */
@media (min-width: 992px) {
    .modal[b-kn6e5m9cbx] {
        align-items: center;
        overflow: hidden;
    }

    .close-button-row[b-kn6e5m9cbx] {
        position: relative;
        bottom: auto;
    }

    .modal-padding[b-kn6e5m9cbx] {
        padding: 24px;
    }

    .modal-content-wrapper[b-kn6e5m9cbx] {
        height: calc(100vh - 48px);
        height: calc(100dvh - 48px);
    }

    /* Explicit height for columns row - account for button half-height (22px) overlapping the bottom border */
    .columns-row[b-kn6e5m9cbx] {
        height: calc(100vh - 48px - 22px);
        height: calc(100dvh - 48px - 22px);
    }

    .left-column[b-kn6e5m9cbx] {
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .right-column[b-kn6e5m9cbx] {
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .action-result-content[b-kn6e5m9cbx] {
        flex: 2 1 0%;
        margin: 12px 6px 6px 12px;
        min-height: 0;
        overflow-y: auto;
        display: flex;
        flex-direction: column;
    }

    .action-result-content > *[b-kn6e5m9cbx] {
        height: 100%;
    }

    .summary-statistics-content[b-kn6e5m9cbx] {
        flex: 1 1 0%;
        margin: 6px 6px 12px 12px;
        min-height: 0;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }

    .summary-statistics-content > *[b-kn6e5m9cbx] {
        height: 100%;
        flex: 1;
    }

    .moves-list[b-kn6e5m9cbx] {
        flex: 1;
        margin: 12px 12px 12px 6px;
        overflow-y: auto;
        min-height: 0;
    }
}

/* Extra large screens */
@media (min-width: 1400px) {
    .modal-padding[b-kn6e5m9cbx] {
        padding: 40px;
    }

    .modal-content-wrapper[b-kn6e5m9cbx] {
        max-width: 1400px;
        height: calc(100vh - 80px);
        height: calc(100dvh - 80px);
    }

    .columns-row[b-kn6e5m9cbx] {
        height: calc(100vh - 80px - 22px);
        height: calc(100dvh - 80px - 22px);
    }
}

/* Very large screens */
@media (min-width: 1920px) {
    .modal-padding[b-kn6e5m9cbx] {
        padding: 60px;
    }

    .modal-content-wrapper[b-kn6e5m9cbx] {
        max-width: 1600px;
        height: calc(100vh - 120px);
        height: calc(100dvh - 120px);
    }

    .columns-row[b-kn6e5m9cbx] {
        height: calc(100vh - 120px - 22px);
        height: calc(100dvh - 120px - 22px);
    }
}
/* /Components/Move/MoveResult.razor.rz.scp.css */
.main-border[b-4utfqwurrj] {
    background-color: rgb(30, 30, 30);
    border: solid 1px white;
    border-radius: 4px;
    overflow: hidden;
}

.move[b-4utfqwurrj] {
    color: dimgray;
    white-space: nowrap;
}

.score[b-4utfqwurrj] {
    color: darkgoldenrod;
    font-weight: 600;
    white-space: nowrap;
}

.top-row[b-4utfqwurrj] {
    border-bottom: solid dimgray 1px;
}

/* Stats grid - always vertical sections */
.stats-grid[b-4utfqwurrj] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.stats-section[b-4utfqwurrj] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.section-label[b-4utfqwurrj] {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.4);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding-left: 2px;
}

/* Phones and tablets: a grid of readable values, as many per row as fit (3 on a 360px phone) */
.stats-row[b-4utfqwurrj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
    gap: 3px;
    min-width: 0;
}

.stats-row[b-4utfqwurrj]  > * {
    min-width: 0;
    padding: 4px 6px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 2px;
    overflow: hidden;
}

/* PC: dense two-column card - left column sizes to content, right fills the rest */
@media (min-width: 992px) {
    .section-label[b-4utfqwurrj] {
        font-size: 9px;
    }

    .stats-grid[b-4utfqwurrj] {
        display: flex;
        flex-direction: row;
        gap: 8px;
        align-items: flex-start;
    }

    .stats-column[b-4utfqwurrj] {
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    .stats-column:first-child[b-4utfqwurrj] {
        flex: 0 0 auto;
    }

    .stats-column:last-child[b-4utfqwurrj] {
        flex: 1 1 0;
        min-width: 0;
    }

    .stats-row[b-4utfqwurrj] {
        display: flex;
        flex-wrap: wrap;
    }

    .stats-row[b-4utfqwurrj]  > * {
        flex: 0 1 auto;
        min-width: 50px;
        max-width: 70px;
        padding: 2px 4px;
    }
}

/* Extra large screens */
@media (min-width: 1400px) {
    .stats-row[b-4utfqwurrj]  > * {
        min-width: 55px;
        max-width: 75px;
    }
}
/* /Components/Move/MoveResultsList.razor.rz.scp.css */
/* Ensure list items don't overflow horizontally */
.p-2[b-q4w2thf99s] {
    overflow: hidden;
}
/* /Components/Move/MovesActionControl.razor.rz.scp.css */
.move-btn[b-r8xce7lmk1] {
    border: none;
    padding:10px;
}

.execute-btn[b-r8xce7lmk1] {
    margin-left:20px;
    background: rgb(0,0,0);
    color: white;
    border: white;
    border-radius: 6px;
    padding:10px 20px;
}

.minus[b-r8xce7lmk1] {
    border-radius: 6px 0px 0px 6px;
}

.plus[b-r8xce7lmk1] {
    border-radius: 0px 6px 6px 0px;
}

.main-border[b-r8xce7lmk1] {
}
/* /Components/Move/MovesSummaryStatistics.razor.rz.scp.css */
.main-border[b-hd4sk3do7e] {
    padding: 12px;
    height: 100%;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.chart-header[b-hd4sk3do7e] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    margin-bottom: 8px;
    flex-shrink: 0;
}

.commodities[b-hd4sk3do7e] {
    background-color: black;
    border-radius: 4px;
    padding: 8px;
    width: 100%;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* Chart container fills available space */
.chart-container[b-hd4sk3do7e] {
    position: relative;
    width: 100%;
    flex: 1;
    min-height: 150px;
}

@media (max-width: 575px) {
    .main-border[b-hd4sk3do7e] {
        padding: 8px;
    }

    .commodities[b-hd4sk3do7e] {
        padding: 4px;
    }

    .chart-container[b-hd4sk3do7e] {
        min-height: 180px;
    }
}

/* On large screens, height is controlled by parent flex container */
@media (min-width: 992px) {
    .chart-container[b-hd4sk3do7e] {
        min-height: 200px;
    }
}
/* /Components/Move/StatePropertyChangeColumn.razor.rz.scp.css */
.stat-item[b-jyd3j7voqi] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    line-height: 1.2;
}

/* Phones and tablets: minimum 12px text, a long name wraps; PC keeps the dense one-line desktop look */
.name[b-jyd3j7voqi] {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.6);
}

.total[b-jyd3j7voqi] {
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
}

.stat-item[b-jyd3j7voqi]  .base {
    font-size: 12px;
}

@media (min-width: 992px) {
    .name[b-jyd3j7voqi] {
        font-size: 10px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .total[b-jyd3j7voqi] {
        font-size: 12px;
    }

    .stat-item[b-jyd3j7voqi]  .base {
        font-size: 11px;
    }
}
/* /Components/MoveStackDisplay.razor.rz.scp.css */
/* Below 992px (mobile top bar): one row - icon, primary/secondary moves, progress with time below it */
.move-stack-inline[b-b3exjffecx] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
}

.stack-top[b-b3exjffecx] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.stack-icon[b-b3exjffecx] {
    color: white;
    display: flex;
    align-items: center;
}

.stack-values[b-b3exjffecx] {
    display: flex;
    align-items: baseline;
    gap: 2px;
}

.primary-moves[b-b3exjffecx] {
    font-size: 15px;
    font-weight: 700;
    font-family: Consolas, monospace;
    color: white;
    text-shadow: 2px 2px 3px black;
}

.separator[b-b3exjffecx] {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
    text-shadow: 1px 1px 2px black;
}

.secondary-moves[b-b3exjffecx] {
    font-size: 12px;
    font-weight: 500;
    font-family: Consolas, monospace;
    color: rgba(255, 255, 255, 0.7);
    text-shadow: 1px 1px 2px black;
}

.progress-section[b-b3exjffecx] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    width: 46px;
}

.progress-bar-container[b-b3exjffecx] {
    flex: 1;
    height: 4px;
    min-height: 4px;
    background-color: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(176, 145, 12, 0.3);
    border-radius: 2px;
    overflow: hidden;
    box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.5);
}

.progress-bar[b-b3exjffecx] {
    height: 100%;
    background: linear-gradient(90deg,
        rgba(176, 145, 12, 0.8) 0%,
        rgba(176, 145, 12, 1) 50%,
        rgba(176, 145, 12, 0.8) 100%);
    box-shadow: 0 0 4px rgba(176, 145, 12, 0.6);
    transition: width 0.3s ease-out;
    border-radius: 1px;
}

.next-move-time[b-b3exjffecx] {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.7);
    font-family: Consolas, monospace;
    text-shadow: 1px 1px 2px black;
    white-space: nowrap;
    text-align: center;
}

/* Narrow desktop top bar: values above the bar, no icon and time */
@media (min-width: 992px) {
    .move-stack-inline[b-b3exjffecx] {
        flex-direction: column;
        align-items: stretch;
        justify-content: center;
        height: 100%;
        max-width: 70px;
        gap: 0;
    }

    .stack-icon[b-b3exjffecx] {
        display: none;
    }

    .next-move-time[b-b3exjffecx] {
        display: none;
    }

    .primary-moves[b-b3exjffecx] {
        font-size: 12px;
    }

    .stack-values[b-b3exjffecx] {
        gap: 1px;
    }

    .progress-section[b-b3exjffecx] {
        flex-direction: row;
        align-items: center;
        width: auto;
        gap: 5px;
    }

    .progress-bar-container[b-b3exjffecx] {
        height: 3px;
        min-height: 3px;
    }
}

/* Wide desktop: icon, larger values and time until the next move */
@media (min-width: 1200px) {
    .move-stack-inline[b-b3exjffecx] {
        max-width: 100px;
    }

    .stack-top[b-b3exjffecx] {
        gap: 8px;
    }

    .stack-icon[b-b3exjffecx] {
        display: flex;
    }

    .next-move-time[b-b3exjffecx] {
        display: block;
    }

    .primary-moves[b-b3exjffecx] {
        font-size: 20px;
    }

    .separator[b-b3exjffecx] {
        font-size: 16px;
    }

    .secondary-moves[b-b3exjffecx] {
        font-size: 16px;
    }

    .stack-values[b-b3exjffecx] {
        gap: 4px;
    }

    .progress-bar-container[b-b3exjffecx] {
        height: 4px;
        min-height: 4px;
    }
}
/* /Components/Operations/OperationAction.razor.rz.scp.css */
/* The button spans the card on phones (MoveActionButton), from 768px it stays on the right */
.operation-action[b-tivuaxft5a] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.action-blocked-reason[b-tivuaxft5a] {
    width: 100%;
    padding: 6px 10px;
    background: rgba(244, 167, 50, 0.1);
    border: 1px solid rgba(244, 167, 50, 0.3);
    border-radius: 4px;
    color: #f4a732;
    font-size: 0.82rem;
    text-shadow: 2px 2px 5px black;
}

@media (min-width: 768px) {
    .operation-action[b-tivuaxft5a] {
        margin-top: 0.5rem;
        padding-top: 1rem;
    }

    .action-blocked-reason[b-tivuaxft5a] {
        text-align: right;
    }
}

/* An operation without a form: the line under the header already separates the button */
.operation-header + .operation-action[b-tivuaxft5a] {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}
/* /Components/Operations/OperationHeader.razor.rz.scp.css */
.operation-header[b-6qaq4j1js3] {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    grid-template-areas:
        "image title"
        "text text";
    align-items: center;
    gap: 8px 12px;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    text-shadow: 2px 2px 5px black;
}

.operation-image[b-6qaq4j1js3] {
    grid-area: image;
    width: 96px;
    height: 64px;
    background: linear-gradient(135deg, rgba(40, 60, 80, 0.6) 0%, rgba(20, 40, 60, 0.8) 100%);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.operation-image img[b-6qaq4j1js3] {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* The title and the text take their own places in the grid on phones */
.operation-description[b-6qaq4j1js3] {
    display: contents;
}

.operation-description h3[b-6qaq4j1js3] {
    grid-area: title;
    margin: 0;
    color: #ffd700;
    font-family: Consolas, monospace;
    font-size: 1.1rem;
}

.operation-text[b-6qaq4j1js3] {
    grid-area: text;
}

.operation-text p[b-6qaq4j1js3],
.operation-text[b-6qaq4j1js3]  p {
    margin: 0;
    color: #b0b0b0;
    font-size: 0.85rem;
    line-height: 1.5;
}

@media (min-width: 768px) {
    .operation-header[b-6qaq4j1js3] {
        display: flex;
        align-items: flex-start;
        gap: 1.25rem;
        margin-bottom: 1.5rem;
        padding-bottom: 1rem;
    }

    .operation-image[b-6qaq4j1js3] {
        flex-shrink: 0;
        width: 235px;
        height: 132px;
    }

    .operation-description[b-6qaq4j1js3] {
        display: block;
        flex: 1;
        min-width: 0;
    }

    .operation-description h3[b-6qaq4j1js3] {
        margin-bottom: 0.5rem;
        font-size: 1.25rem;
    }

    .operation-text p[b-6qaq4j1js3],
    .operation-text[b-6qaq4j1js3]  p {
        margin-bottom: 0.5rem;
        font-size: 0.9rem;
    }
}
/* /Components/Ranking/AllianceRankingList.razor.rz.scp.css */
/* Phones: a card of two lines */
.alliance-ranking[b-v5xxumicrl] {
    --ranking-columns: 34px minmax(0, 1fr) auto;
    --ranking-areas:
        "position name score"
        "position states states";
    margin-bottom: 8px;
}

.alliance-name[b-v5xxumicrl] {
    grid-area: name;
    min-width: 0;
    overflow-wrap: anywhere;
}

.alliance-name[b-v5xxumicrl],
.alliance-name-text[b-v5xxumicrl] {
    color: white;
    font-size: 14px;
    font-weight: 600;
}

.alliance-states[b-v5xxumicrl] {
    grid-area: states;
    color: white;
    font-size: 13px;
}

.alliance-states[data-label][b-v5xxumicrl]::before {
    content: attr(data-label) ' ';
    color: #aaa;
    font-size: 12px;
}

.alliance-score[b-v5xxumicrl] {
    grid-area: score;
    color: #ffd700;
    font-size: 14px;
    font-weight: 600;
    text-align: right;
    white-space: nowrap;
}

/* Touch: the whole card opens the detail of the alliance */
@media (pointer: coarse) {
    .alliance-link[b-v5xxumicrl]::after {
        content: '';
        position: absolute;
        inset: 0;
    }
}

/* Tablets and PC: one line of the grid shared with the header */
@media (min-width: 768px) {
    .alliance-ranking[b-v5xxumicrl] {
        --ranking-columns: minmax(48px, 2fr) minmax(0, 4fr) minmax(0, 3fr) minmax(0, 3fr);
        --ranking-areas: "position name states score";
        margin-bottom: 1rem;
    }

    .alliance-states[b-v5xxumicrl] {
        font-size: 14px;
    }

    .alliance-states[data-label][b-v5xxumicrl]::before {
        content: none;
    }

    .alliance-score[b-v5xxumicrl] {
        text-align: left;
    }
}
/* /Components/Ranking/RankingHeader.razor.rz.scp.css */
/* Phones: hidden visually, not with display: none. Planet icons share gradient ids and the first one in the document
   is the planet in this header: from a display: none subtree its gradients would not paint the icons in the rows. */
.ranking-header[b-b7ckfqxscm] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
}

@media (min-width: 768px) {
    .ranking-header[b-b7ckfqxscm] {
        position: static;
        display: grid;
        width: auto;
        height: auto;
        overflow: visible;
        clip-path: none;
        grid-template-columns: var(--ranking-columns);
        grid-template-areas: var(--ranking-areas);
        gap: 8px;
        align-items: center;
        margin-bottom: 0.5rem;
        /* Columns aligned with the rows: they have a 4px rank border on the left and none on the right, this header 1px on both sides */
        padding: 0.75rem calc(0.5rem - 1px) 0.75rem calc(0.5rem + 3px);
        background: rgba(32, 178, 170, 0.3);
        border: 1px solid rgba(32, 178, 170, 0.5);
        border-radius: 4px;
        font-size: 14px;
        font-weight: 600;
    }

    .ranking-header-position[b-b7ckfqxscm] {
        grid-area: position;
        font-weight: 500;
    }
}
/* /Components/Ranking/RankingPager.razor.rz.scp.css */
.ranking-pager[b-bsgjwqhovj] {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.ranking-pager-button[b-bsgjwqhovj] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: var(--pow-touch-target);
    height: var(--pow-touch-target);
    padding: 0;
    background: rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 4px;
    transition: background-color 0.2s, border-color 0.2s;
}

.ranking-pager-button:disabled[b-bsgjwqhovj] {
    opacity: 0.4;
    cursor: not-allowed;
}

.ranking-pager-info[b-bsgjwqhovj] {
    color: white;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
}

/* Does not fit beside the find button on phones, the numbers speak for themselves in a scoreboard */
.ranking-pager-label[b-bsgjwqhovj] {
    display: none;
}

@media (hover: hover) {
    .ranking-pager-button:hover:not(:disabled)[b-bsgjwqhovj] {
        background: rgba(32, 178, 170, 0.5);
        border-color: lightseagreen;
    }
}

@media (min-width: 576px) {
    .ranking-pager-label[b-bsgjwqhovj] {
        display: inline;
    }
}

@media (min-width: 768px) {
    .ranking-pager[b-bsgjwqhovj] {
        gap: 1rem;
    }

    .ranking-pager-info[b-bsgjwqhovj] {
        font-size: 1rem;
    }
}
/* /Components/Ranking/RankingRow.razor.rz.scp.css */
.ranking-row[b-1dhwcstymu] {
    /* Containing block of the link stretched over the row on touch screens */
    position: relative;
    display: grid;
    grid-template-columns: var(--ranking-columns);
    grid-template-areas: var(--ranking-areas);
    gap: 2px 8px;
    align-items: center;
    margin: 4px 0;
    padding: 6px 8px;
    background-color: rgba(0, 0, 0, 0.5);
    border-left: 4px solid transparent;
    border-radius: 3px;
    transition: background-color 0.2s;
}

.ranking-position[b-1dhwcstymu] {
    grid-area: position;
    align-self: start;
}

.ranking-medal[b-1dhwcstymu] {
    font-size: 1rem;
}

.ranking-rank[b-1dhwcstymu] {
    color: white;
    font-size: 14px;
    font-weight: 500;
}

.ranking-row--rank-1[b-1dhwcstymu] {
    background: linear-gradient(90deg, rgba(255, 215, 0, 0.3) 0%, rgba(0, 0, 0, 0.5) 100%);
    border-left-color: gold;
}

.ranking-row--rank-2[b-1dhwcstymu] {
    background: linear-gradient(90deg, rgba(192, 192, 192, 0.3) 0%, rgba(0, 0, 0, 0.5) 100%);
    border-left-color: silver;
}

.ranking-row--rank-3[b-1dhwcstymu] {
    background: linear-gradient(90deg, rgba(205, 127, 50, 0.3) 0%, rgba(0, 0, 0, 0.5) 100%);
    border-left-color: #cd7f32;
}

.ranking-row--top[b-1dhwcstymu] {
    background: linear-gradient(90deg, rgba(32, 178, 170, 0.2) 0%, rgba(0, 0, 0, 0.5) 100%);
    border-left-color: rgba(32, 178, 170, 0.6);
}

/* Outline, not a border: the cells stay aligned with the other rows and with the header */
.ranking-row--current[b-1dhwcstymu] {
    background-color: rgba(0, 255, 33, 0.3);
    border-left-color: transparent;
    outline: 2px solid rgb(0, 255, 144);
    outline-offset: -2px;
}

.ranking-row--searched[b-1dhwcstymu] {
    background-color: rgba(255, 255, 0, 0.3);
    border-left-color: transparent;
    outline: 2px solid rgba(255, 255, 100, 0.8);
    outline-offset: -2px;
}

@media (hover: hover) {
    .ranking-row:hover[b-1dhwcstymu] {
        background-color: rgba(0, 0, 0, 0.7);
    }

    .ranking-row--current:hover[b-1dhwcstymu] {
        background-color: rgba(0, 255, 33, 0.3);
    }

    .ranking-row--searched:hover[b-1dhwcstymu] {
        background-color: rgba(255, 255, 0, 0.3);
    }
}

/* Tablets and PC: a line of the grid */
@media (min-width: 768px) {
    .ranking-row[b-1dhwcstymu] {
        gap: 8px;
        margin: 2px 0;
        min-height: var(--pow-touch-target);
        padding: 0.5rem;
    }

    .ranking-position[b-1dhwcstymu] {
        align-self: center;
    }

    .ranking-medal[b-1dhwcstymu] {
        font-size: 1.2rem;
    }
}
/* /Components/Ranking/StateRankingList.razor.rz.scp.css */
/* Phones: a card of three lines. The name and the alliance get what is left beside the numbers;
   the exhaustion spans two tracks, so its label does not narrow the name above it. */
.state-ranking[b-1w9ks6rdtw] {
    --ranking-columns: 34px minmax(0, 1fr) 30px auto;
    --ranking-areas:
        "position name name score"
        "position system system area"
        "position alliance exhaustion exhaustion";
    margin-bottom: 8px;
}

.state-ranking--archived[b-1w9ks6rdtw] {
    --ranking-areas:
        "position name name score"
        "position system system area"
        "position alliance alliance alliance";
}

.state-name[b-1w9ks6rdtw] {
    grid-area: name;
    min-width: 0;
    overflow-wrap: anywhere;
}

.state-name[b-1w9ks6rdtw],
.state-name-text[b-1w9ks6rdtw] {
    color: white;
    font-size: 14px;
    font-weight: 600;
}

.state-protection[b-1w9ks6rdtw] {
    margin-left: 4px;
    font-size: 13px;
    font-weight: 400;
}

/* Only the dot on phones, the word would push most names to a second line */
.state-online[b-1w9ks6rdtw] {
    margin-left: 4px;
    color: #4caf50;
    font-size: 12px;
    font-weight: 400;
    text-shadow: 0 0 5px #4caf50;
    white-space: nowrap;
}

.state-online-label[b-1w9ks6rdtw] {
    display: none;
    color: inherit;
    text-shadow: inherit;
}

.state-system[b-1w9ks6rdtw] {
    grid-area: system;
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    color: white;
    font-size: 13px;
}

.state-exhaustion[b-1w9ks6rdtw] {
    grid-area: exhaustion;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    /* The ring is taller than a line of text and has room for it around the texts */
    margin-block: -4px;
}

.state-exhaustion[b-1w9ks6rdtw]::before {
    content: attr(data-label);
    color: #aaa;
    font-size: 12px;
    text-shadow: 2px 2px 5px black;
}

.state-exhaustion-header[b-1w9ks6rdtw] {
    grid-area: exhaustion;
    text-align: center;
}

.state-alliance[b-1w9ks6rdtw] {
    grid-area: alliance;
    min-width: 0;
    overflow-wrap: anywhere;
}

.state-alliance[b-1w9ks6rdtw],
.state-alliance-text[b-1w9ks6rdtw] {
    color: #87ceeb;
    font-size: 13px;
}

.state-area[b-1w9ks6rdtw] {
    grid-area: area;
    color: #b0b0b0;
    font-size: 13px;
    text-align: right;
    white-space: nowrap;
}

.state-score[b-1w9ks6rdtw] {
    grid-area: score;
    color: #ffd700;
    font-size: 14px;
    font-weight: 600;
    text-align: right;
    white-space: nowrap;
}

/* Touch: the whole card opens the detail of the state; the alliance and the tooltip stay separate targets above it */
@media (pointer: coarse) {
    .state-link[b-1w9ks6rdtw]::after {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 1;
    }

    .state-alliance-link[b-1w9ks6rdtw],
    .state-protection[b-1w9ks6rdtw]  .tooltip-trigger {
        position: relative;
        z-index: 2;
    }

    /* The larger touch area stays mostly below the alliance, the line above it belongs to the state */
    .state-alliance-link[b-1w9ks6rdtw]::before {
        content: '';
        position: absolute;
        inset: -8px -8px -14px;
        min-width: var(--pow-touch-target);
    }

    .state-protection[b-1w9ks6rdtw]  .tooltip-trigger::before {
        content: '';
        position: absolute;
        inset: -12px -8px;
    }
}

/* Tablets and PC: one line of the grid shared with the header */
@media (min-width: 768px) {
    .state-ranking[b-1w9ks6rdtw] {
        --ranking-columns: 48px minmax(0, 2.1fr) minmax(0, 1.5fr) 72px minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 0.9fr);
        --ranking-areas: "position name system exhaustion alliance area score";
        margin-bottom: 1rem;
    }

    .state-ranking--archived[b-1w9ks6rdtw] {
        --ranking-columns: 48px minmax(0, 2.1fr) minmax(0, 1.5fr) minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 0.9fr);
        --ranking-areas: "position name system alliance area score";
    }

    .state-online-label[b-1w9ks6rdtw] {
        display: inline;
    }

    .state-exhaustion[b-1w9ks6rdtw] {
        justify-content: center;
        margin-block: 0;
    }

    .state-exhaustion[b-1w9ks6rdtw]::before {
        content: none;
    }

    .state-area[b-1w9ks6rdtw],
    .state-score[b-1w9ks6rdtw] {
        text-align: left;
    }
}
/* /Components/Research/TechnologyDetail.razor.rz.scp.css */
.tech-detail-content[b-jofwtnknbz] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 12px;
}

.tech-detail-image-placeholder[b-jofwtnknbz] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 96px;
    background: rgba(0, 0, 0, 0.5);
    border: 1px dashed rgba(255, 255, 255, 0.3);
    border-radius: 6px;
}

.placeholder-text[b-jofwtnknbz] {
    color: rgba(255, 255, 255, 0.4);
    font-size: 0.9rem;
    font-style: italic;
}

.tech-detail-title[b-jofwtnknbz] {
    margin: 0;
    color: #ffd700;
    font-size: 1.25rem;
    text-align: center;
    text-shadow: 2px 2px 5px black;
}

.tech-detail-description[b-jofwtnknbz] {
    margin: 0;
    color: #ccc;
    font-size: 0.9rem;
    line-height: 1.5;
    text-align: center;
}

.tech-detail-section-title[b-jofwtnknbz] {
    margin: 0 0 8px 0;
    padding-bottom: 4px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    color: #aaa;
    font-size: 0.8rem;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.tech-detail-rows[b-jofwtnknbz] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.tech-detail-row[b-jofwtnknbz] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 5px;
}

.bonus-row[b-jofwtnknbz] {
    border-left: 3px solid #4caf50;
}

.row-icon[b-jofwtnknbz] {
    min-width: 22px;
    font-size: 1.1rem;
    text-align: center;
}

.row-label[b-jofwtnknbz] {
    flex: 1;
    min-width: 0;
    color: #ccc;
    font-size: 0.85rem;
}

.row-owned[b-jofwtnknbz] {
    display: block;
    color: #ff6b6b;
    font-size: 0.75rem;
}

.row-value[b-jofwtnknbz] {
    color: #fff;
    font-size: 0.95rem;
    font-weight: bold;
}

.bonus-row .row-value[b-jofwtnknbz] {
    color: #4caf50;
}

.not-covered .row-value[b-jofwtnknbz] {
    color: #ff6b6b;
}

.tech-discovered-indicator[b-jofwtnknbz] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 10px;
    background: rgba(76, 175, 80, 0.25);
    border: 2px solid rgba(76, 175, 80, 0.7);
    border-radius: 8px;
    color: #4caf50;
    font-size: 1rem;
    font-weight: bold;
    text-shadow: 0 0 8px rgba(76, 175, 80, 0.5);
}

@media (min-width: 768px) {
    .tech-detail-content[b-jofwtnknbz] {
        gap: 16px;
        padding: 30px;
    }

    .tech-detail-image-placeholder[b-jofwtnknbz] {
        height: 200px;
    }

    .tech-detail-title[b-jofwtnknbz] {
        font-size: 1.4rem;
    }
}
/* /Components/Research/TechnologyLevelList.razor.rz.scp.css */
.technology-levels[b-32fxly1u04] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.technology-level-title[b-32fxly1u04] {
    margin: 0 0 8px;
    padding-bottom: 4px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    color: #aaa;
    font-size: 0.8rem;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.technology-cards[b-32fxly1u04] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
    gap: 8px;
}

/* The status is also written out, the colour of the border only repeats it */
.technology-card[b-32fxly1u04] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
    min-height: var(--pow-touch-target);
    padding: 10px 12px;
    background: rgba(20, 20, 40, 0.95);
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 8px;
    color: white;
    text-align: left;
    text-shadow: 2px 2px 5px black;
    cursor: pointer;
    transition: all 0.3s ease;
}

.technology-card.discovered[b-32fxly1u04] {
    background: rgba(20, 40, 20, 0.95);
    border-color: rgba(76, 175, 80, 0.8);
}

.technology-card.available[b-32fxly1u04] {
    border-color: rgba(0, 255, 180, 0.7);
    box-shadow: 0 0 12px rgba(0, 255, 180, 0.4);
}

.technology-card.missing-resources[b-32fxly1u04] {
    border-color: rgba(255, 215, 0, 0.6);
}

.technology-card-header[b-32fxly1u04] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.technology-name[b-32fxly1u04] {
    min-width: 0;
    color: #ffd700;
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.2;
}

.technology-status[b-32fxly1u04] {
    flex-shrink: 0;
    color: #aaa;
    font-size: 0.75rem;
}

.discovered .technology-status[b-32fxly1u04] {
    color: #4caf50;
}

.available .technology-status[b-32fxly1u04] {
    color: rgb(0, 255, 180);
}

.missing-resources .technology-status[b-32fxly1u04] {
    color: #ffd700;
}

.technology-description[b-32fxly1u04] {
    color: #ccc;
    font-size: 0.8125rem;
    line-height: 1.3;
}

.technology-missing[b-32fxly1u04] {
    color: #aaa;
    font-size: 0.75rem;
}

.technology-costs[b-32fxly1u04] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.technology-cost[b-32fxly1u04] {
    padding: 3px 6px;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 4px;
    font-size: 0.8rem;
    font-weight: bold;
}

.technology-cost.not-covered[b-32fxly1u04] {
    color: #ff6b6b;
}

@media (hover: hover) {
    .technology-card:hover[b-32fxly1u04] {
        border-color: rgba(100, 150, 255, 0.8);
        box-shadow: 0 0 25px rgba(100, 150, 255, 0.5);
    }

    .technology-card.discovered:hover[b-32fxly1u04] {
        border-color: rgba(76, 175, 80, 1);
        box-shadow: 0 0 20px rgba(76, 175, 80, 0.3);
    }

    .technology-card.available:hover[b-32fxly1u04] {
        border-color: rgba(0, 255, 180, 1);
        box-shadow: 0 0 18px rgba(0, 255, 180, 0.7);
    }

    .technology-card.missing-resources:hover[b-32fxly1u04] {
        border-color: rgba(255, 215, 0, 1);
        box-shadow: 0 0 18px rgba(255, 215, 0, 0.65);
    }
}

@media (min-width: 992px) {
    .technology-levels[b-32fxly1u04] {
        display: none;
    }
}
/* /Components/Research/TechnologyTree.razor.rz.scp.css */
/* Phones and tablets have TechnologyLevelList */
.research-tree-container[b-znse5s9tub] {
    display: none;
    position: relative;
    overflow-x: auto;
    overflow-y: visible;
    padding: 0 0 20px;
}

.research-tree-svg[b-znse5s9tub] {
    position: absolute;
    top: 0;
    left: 0;
    width: var(--research-tree-width, 1400px);
    height: var(--research-tree-height, 3400px);
    pointer-events: none;
    z-index: 1;
}

.connection-line[b-znse5s9tub] {
    fill: none;
    stroke: rgba(100, 150, 255, 0.4);
    stroke-width: 3;
    transition: all 0.3s ease;
}

.connection-line.discovered[b-znse5s9tub] {
    stroke: #4caf50;
    stroke-width: 4;
}

.research-tree[b-znse5s9tub] {
    position: relative;
    width: var(--research-tree-width, 1400px);
    min-width: var(--research-tree-width, 1400px);
    min-height: var(--research-tree-height, 3400px);
    z-index: 2;
}

.research-node[b-znse5s9tub] {
    position: absolute;
    width: 220px;
    transition: all 0.3s ease;
}

.research-card[b-znse5s9tub] {
    background: rgba(20, 20, 40, 0.95);
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 8px;
    padding: 15px;
    transition: all 0.3s ease;
    height: 200px;
    display: flex;
    flex-direction: column;
}

.research-node.discovered .research-card[b-znse5s9tub] {
    border-color: rgba(76, 175, 80, 0.8);
    background: rgba(20, 40, 20, 0.95);
    box-shadow: 0 0 20px rgba(76, 175, 80, 0.3);
}

.research-node.available .research-card[b-znse5s9tub] {
    border-color: rgba(0, 255, 180, 0.7);
    box-shadow: 0 0 12px rgba(0, 255, 180, 0.4), 0 0 24px rgba(0, 255, 180, 0.15);
}

.research-node.missing-resources .research-card[b-znse5s9tub] {
    border-color: rgba(255, 215, 0, 0.6);
    box-shadow: 0 0 12px rgba(255, 215, 0, 0.35), 0 0 24px rgba(255, 215, 0, 0.12);
}

.research-card h4[b-znse5s9tub] {
    color: #ffd700;
    font-size: 0.95rem;
    margin: 0 0 8px 0;
    text-align: center;
    line-height: 1.2;
}

.research-description[b-znse5s9tub] {
    color: #ccc;
    font-size: 0.8rem;
    line-height: 1.3;
    margin: 0 0 10px 0;
    flex: 1;
}

.research-cost[b-znse5s9tub] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
}

.cost-item[b-znse5s9tub] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 3px 6px;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 4px;
    font-size: 0.8rem;
}

.cost-icon[b-znse5s9tub] {
    font-size: 0.9rem;
}

.cost-value[b-znse5s9tub] {
    color: #fff;
    font-weight: bold;
}

.research-btn[b-znse5s9tub] {
    width: 100%;
    padding: 6px;
    background: linear-gradient(135deg, #4caf50 0%, #45a049 100%);
    border: none;
    border-radius: 5px;
    color: white;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 0.85rem;
    margin-top: auto;
}

.research-btn.locked[b-znse5s9tub] {
    background: linear-gradient(135deg, #2a4a7a 0%, #1e3a6a 100%);
    color: rgba(255, 255, 255, 0.6);
}

/* Tablets in landscape have the tree too */
@media (pointer: coarse) {
    .research-btn[b-znse5s9tub] {
        min-height: var(--pow-touch-target);
    }
}

@media (hover: hover) {
    .research-node:hover .research-card[b-znse5s9tub] {
        border-color: rgba(100, 150, 255, 0.8);
        box-shadow: 0 0 25px rgba(100, 150, 255, 0.5);
        transform: scale(1.02);
    }

    .research-node.available:hover .research-card[b-znse5s9tub] {
        border-color: rgba(0, 255, 180, 1);
        box-shadow: 0 0 18px rgba(0, 255, 180, 0.7), 0 0 36px rgba(0, 255, 180, 0.3);
    }

    .research-node.missing-resources:hover .research-card[b-znse5s9tub] {
        border-color: rgba(255, 215, 0, 1);
        box-shadow: 0 0 18px rgba(255, 215, 0, 0.65), 0 0 36px rgba(255, 215, 0, 0.25);
    }

    .research-btn:hover[b-znse5s9tub] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(76, 175, 80, 0.4);
    }

    .research-btn.locked:hover[b-znse5s9tub] {
        box-shadow: 0 4px 12px rgba(100, 150, 255, 0.3);
    }
}

@media (min-width: 992px) {
    .research-tree-container[b-znse5s9tub] {
        display: block;
    }
}
/* /Components/SecretServiceReportsTable.razor.rz.scp.css */
.reports-section[b-q3ju8035lb] {
    margin-top: 0.5rem;
    text-shadow: 2px 2px 5px black;
}

/* Phones: cards of two lines, no column names */
.reports-list-header[b-q3ju8035lb] {
    display: none;
}

.reports-loading[b-q3ju8035lb],
.reports-empty[b-q3ju8035lb] {
    color: #888;
    padding: 1rem;
    text-align: center;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 4px;
    font-size: 0.9rem;
}

.col-target[b-q3ju8035lb] {
    grid-area: target;
    min-width: 0;
    overflow-wrap: anywhere;
    color: white;
    font-weight: 600;
}

.col-report-type[b-q3ju8035lb] {
    grid-area: type;
}

.col-score[b-q3ju8035lb] {
    grid-area: score;
    text-align: right;
    color: #ffd700;
    font-weight: 700;
    font-family: Consolas, monospace;
    white-space: nowrap;
}

.col-time[b-q3ju8035lb] {
    grid-area: time;
    text-align: right;
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.82rem;
    white-space: nowrap;
}

.col-expand[b-q3ju8035lb] {
    grid-area: expand;
    text-align: right;
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.35);
}

/* Report item card */
.report-item[b-q3ju8035lb] {
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 3px;
    margin-bottom: 4px;
    cursor: pointer;
    transition: background-color 0.2s;
    overflow: hidden;
}

.report-item.expanded[b-q3ju8035lb] {
    background-color: rgba(20, 20, 50, 0.7);
    border: 1px solid rgba(100, 150, 255, 0.25);
}

.report-row-main[b-q3ju8035lb] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 16px;
    grid-template-areas:
        "target score expand"
        "type time expand";
    align-items: center;
    gap: 2px 8px;
    min-height: var(--pow-touch-target);
    padding: 6px 8px;
    font-size: 0.88rem;
    color: #c8c8c8;
}

/* Expanded detail panel */
.report-detail-panel[b-q3ju8035lb] {
    border-top: 1px solid rgba(100, 150, 255, 0.2);
    background: rgba(20, 20, 40, 0.8);
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.detail-score-badge[b-q3ju8035lb] {
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.55);
}

.detail-score-badge strong[b-q3ju8035lb] {
    color: #ffd700;
    font-weight: 700;
}

.detail-loading[b-q3ju8035lb] {
    color: #888;
    font-size: 0.85rem;
    padding: 4px 0;
}

.detail-unit-grid[b-q3ju8035lb] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.detail-unit-item[b-q3ju8035lb] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 12px;
    background: rgba(0, 0, 0, 0.35);
    border-radius: 5px;
    border-left: 3px solid rgba(100, 150, 255, 0.4);
    font-size: 0.88rem;
}

.detail-unit-icon[b-q3ju8035lb] {
    font-size: 1rem;
    min-width: 22px;
    text-align: center;
}

.detail-unit-name[b-q3ju8035lb] {
    color: #ccc;
    flex: 1;
    min-width: 0;
}

.detail-unit-range[b-q3ju8035lb] {
    color: #87ceeb;
    font-weight: 700;
    font-family: Consolas, monospace;
    text-align: right;
}

.detail-section-label[b-q3ju8035lb] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: rgba(255, 255, 255, 0.5);
    margin-top: 4px;
}

@media (hover: hover) {
    .report-item:hover[b-q3ju8035lb] {
        background-color: rgba(32, 178, 170, 0.12);
    }
}

/* Tablets and PC: a table, the header shares its grid with the rows */
@media (min-width: 768px) {
    .reports-list-header[b-q3ju8035lb],
    .report-row-main[b-q3ju8035lb] {
        grid-template-columns: minmax(0, 2fr) 90px 130px minmax(0, 1.5fr) 20px;
        grid-template-areas: "target type score time expand";
        gap: 8px;
        padding-inline: 0.75rem;
    }

    .reports-list-header[b-q3ju8035lb] {
        display: grid;
        align-items: center;
        padding-block: 0.6rem;
        margin-bottom: 4px;
        background: rgba(32, 178, 170, 0.25);
        border: 1px solid rgba(32, 178, 170, 0.45);
        border-radius: 4px;
        font-size: 0.75rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: rgba(255, 255, 255, 0.7);
    }

    .report-item[b-q3ju8035lb] {
        margin-bottom: 2px;
    }

    .report-detail-panel[b-q3ju8035lb] {
        padding: 12px 14px;
    }
}
/* /Components/SecretServices/AgentOperationPanel.razor.rz.scp.css */
/* Phones: the name and available count over a slider across the row */
.agents-row[b-zjfsdgst4h] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.6rem 0.75rem;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 6px;
    text-shadow: 2px 2px 5px black;
}

.agents-info[b-zjfsdgst4h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.15rem 0.5rem;
    min-width: 0;
}

.agents-name[b-zjfsdgst4h] {
    color: white;
    font-size: 0.95rem;
    font-weight: 600;
}

.agents-count[b-zjfsdgst4h] {
    color: #888;
    font-size: 0.8rem;
}

.agents-count strong[b-zjfsdgst4h] {
    color: #ffd700;
}

@media (min-width: 768px) {
    .agents-row[b-zjfsdgst4h] {
        flex-direction: row;
        align-items: center;
        gap: 0;
    }

    .agents-info[b-zjfsdgst4h] {
        flex: 1;
        flex-direction: column;
        align-items: flex-start;
    }

    .agents-input[b-zjfsdgst4h] {
        flex: 0 0 200px;
    }
}
/* /Components/StateSystemPicker.razor.rz.scp.css */
.state-system-picker[b-9a7zsuh7ag] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 0;
    justify-content: center;
}

.system-card[b-9a7zsuh7ag] {
    background-color: rgba(44, 62, 80, 0.8);
    border: 2px solid #34495e;
    border-radius: 8px;
    padding: 8px 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: center;
    min-height: 40px;
    flex: 0 0 auto;
    width: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.system-card:hover[b-9a7zsuh7ag] {
    background-color: rgba(52, 73, 94, 0.9);
    border-color: #3498db;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

.system-card.selected[b-9a7zsuh7ag] {
    background-color: #3498db;
    border-color: #2980b9;
    border-width: 3px;
    box-shadow: 0 4px 12px rgba(52, 152, 219, 0.5);
}

.system-name[b-9a7zsuh7ag] {
    color: #ecf0f1;
    font-size: 13px;
    font-weight: 600;
    user-select: none;
}

.system-card.selected .system-name[b-9a7zsuh7ag] {
    color: #ffffff;
    font-weight: bold;
}
/* /Components/TurnActionButton.razor.rz.scp.css */
.turn-action-container[b-kfvhadbnpg] {
    display: inline-flex;
    flex-direction: column;
    border: 1px solid lightseagreen;
    border-radius: 5px;
    background-color: rgba(32, 178, 170, 0.15);
    overflow: hidden;
    min-width: 250px;
    max-width: 350px;
}

.main-content[b-kfvhadbnpg] {
    display: flex;
    align-items: stretch;
}

.turn-control[b-kfvhadbnpg] {
    display: flex;
    flex-direction: column;
    border-right: 1px solid rgba(255, 255, 255, 0.3);
}

.arrow-btn[b-kfvhadbnpg] {
    width: 50px;
    height: 16px;
    border: none;
    background-color: transparent;
    color: white;
    font-size: 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    text-shadow: 2px 2px 5px black;
}

    .arrow-btn:hover:not(:disabled)[b-kfvhadbnpg] {
        background: rgba(32, 178, 170, 0.3);
    }

    .arrow-btn:disabled[b-kfvhadbnpg] {
        opacity: 0.3;
        cursor: not-allowed;
    }

    .arrow-btn.up[b-kfvhadbnpg] {
        border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    }

    .arrow-btn.down[b-kfvhadbnpg] {
        border-top: 1px solid rgba(255, 255, 255, 0.3);
    }

.turn-input[b-kfvhadbnpg] {
    width: 50px;
    height: 18px;
    background-color: transparent;
    border: none;
    color: white;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    text-shadow: 2px 2px 5px black;
}

    .turn-input:focus[b-kfvhadbnpg] {
        outline: none;
        background: rgba(32, 178, 170, 0.2);
    }

    /* Remove number input arrows */
    .turn-input[b-kfvhadbnpg]::-webkit-outer-spin-button,
    .turn-input[b-kfvhadbnpg]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    .turn-input[type=number][b-kfvhadbnpg] {
        -moz-appearance: textfield;
    }

.turn-display[b-kfvhadbnpg] {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 18px;
    font-weight: bold;
    text-shadow: 2px 2px 5px black;
    border-right: 1px solid rgba(255, 255, 255, 0.3);
}

.execute-btn[b-kfvhadbnpg] {
    flex: 1;
    border: none;
    background-color: transparent;
    color: white;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    text-shadow: 2px 2px 5px black;
    padding: 0 15px;
}

    .execute-btn:hover[b-kfvhadbnpg] {
        background: rgba(32, 178, 170, 0.3);
    }

.progress-bar[b-kfvhadbnpg] {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 6px;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    gap: 2px;
}

.progress-segment[b-kfvhadbnpg] {
    flex: 1;
    background-color: rgba(255, 255, 255, 0.1);
    transition: background-color 0.3s;
}

    .progress-segment.active[b-kfvhadbnpg] {
        background-color: rgba(180, 0, 0, 0.8);
    }
/* /Components/UserMenu.razor.rz.scp.css */
.logout-btn[b-hg2gpnugui] {
    background-color: rgba(78, 78, 78, 0.7);
    border-radius: 5px;
    padding: 3px 10px;
    border-width: 0px;
    margin-left: 1rem;
}

.btn-text[b-hg2gpnugui] {
    margin-left: 5px;
    font-size:12px;
}

.btn-icon[b-hg2gpnugui] {
    color:white;
}
/* /Components/War/AttackStrengthPanel.razor.rz.scp.css */
/* Phones: a 44px header with the title and the total, a tap expands the breakdown below it.
   From 768px the full panel: small title, breakdown always visible, the total pushed to the bottom. */

.strength-panel[b-e5nk3yalx4] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
    padding: 0 12px;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    text-shadow: 2px 2px 5px black;
}

.strength-panel--defense[b-e5nk3yalx4] {
    background: rgba(0, 0, 50, 0.3);
    border-color: rgba(100, 160, 255, 0.2);
}

.strength-header[b-e5nk3yalx4] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: var(--pow-touch-target);
    padding: 0;
    background: none;
    border: none;
    color: #ccc;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1px;
    text-align: left;
    text-transform: uppercase;
}

.strength-header-chevron[b-e5nk3yalx4] {
    color: rgba(100, 150, 255, 0.6);
    transition: transform 0.2s ease;
}

.strength-panel.is-expanded .strength-header-chevron[b-e5nk3yalx4] {
    transform: rotate(90deg);
}

.strength-header-title[b-e5nk3yalx4] {
    flex: 1;
}

.strength-header-total[b-e5nk3yalx4] {
    color: #ffd700;
    font-family: Consolas, monospace;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0;
}

.strength-panel--defense .strength-header-total[b-e5nk3yalx4] {
    color: #90c8ff;
}

.strength-breakdown[b-e5nk3yalx4] {
    display: none;
    flex-direction: column;
    gap: 0.2rem;
    padding-bottom: 12px;
}

.strength-panel.is-expanded .strength-breakdown[b-e5nk3yalx4] {
    display: flex;
}

.strength-section-label[b-e5nk3yalx4] {
    font-size: 12px;
    color: #777;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 0.1rem;
}

.strength-row[b-e5nk3yalx4] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.4rem;
    padding: 0.1rem 0;
}

.strength-label[b-e5nk3yalx4] {
    font-size: 0.78rem;
    color: #a0a0a0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-shrink: 1;
    min-width: 0;
}

.strength-value[b-e5nk3yalx4] {
    font-size: 0.82rem;
    color: #e0e0e0;
    font-family: Consolas, monospace;
    flex-shrink: 0;
    white-space: nowrap;
}

.strength-divider[b-e5nk3yalx4] {
    height: 1px;
    background: rgba(255, 255, 255, 0.08);
    margin: 0.3rem 0;
}

.strength-row.positive .strength-value[b-e5nk3yalx4] {
    color: #66bb6a;
}

.strength-row.negative .strength-value[b-e5nk3yalx4] {
    color: #ef5350;
}

.strength-row.zero .strength-value[b-e5nk3yalx4] {
    color: #555;
}

.strength-subtotal .strength-label[b-e5nk3yalx4],
.strength-subtotal .strength-value[b-e5nk3yalx4] {
    color: #cccccc;
    font-weight: 600;
}

.strength-multiplier-total .strength-label[b-e5nk3yalx4],
.strength-multiplier-total .strength-value[b-e5nk3yalx4] {
    font-weight: 600;
}

/* Default color when neutral; overridden by .positive/.negative when colored */
.strength-multiplier-total.zero .strength-label[b-e5nk3yalx4],
.strength-multiplier-total.zero .strength-value[b-e5nk3yalx4] {
    color: #90caf9;
}

/* Phones have the total in the header */
.strength-total-row[b-e5nk3yalx4] {
    display: none;
    justify-content: space-between;
    align-items: center;
    padding: 0.45rem 0.6rem;
    background: rgba(255, 215, 0, 0.1);
    border: 1px solid rgba(255, 215, 0, 0.3);
    border-radius: 4px;
    margin-top: auto;
    flex-shrink: 0;
}

.strength-total-row .strength-label[b-e5nk3yalx4] {
    font-size: 0.7rem;
    color: #ffd700;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.strength-total-row .strength-value[b-e5nk3yalx4] {
    font-size: 1.05rem;
    color: #ffd700;
    font-weight: 700;
    font-family: Consolas, monospace;
}

.strength-panel--defense .strength-total-row[b-e5nk3yalx4] {
    background: rgba(60, 120, 255, 0.1);
    border-color: rgba(100, 160, 255, 0.35);
}

.strength-panel--defense .strength-total-row .strength-label[b-e5nk3yalx4],
.strength-panel--defense .strength-total-row .strength-value[b-e5nk3yalx4] {
    color: #90c8ff;
}

/* Tablets and PC: the header is only a small title, breakdown and total always visible */
@media (min-width: 768px) {
    .strength-panel[b-e5nk3yalx4] {
        padding: 0.75rem;
    }

    .strength-header[b-e5nk3yalx4] {
        min-height: 0;
        margin-bottom: 0.25rem;
        color: #888;
        font-size: 0.65rem;
        font-weight: 400;
        letter-spacing: 1.5px;
        pointer-events: none;
    }

    .strength-header-chevron[b-e5nk3yalx4],
    .strength-header-total[b-e5nk3yalx4] {
        display: none;
    }

    .strength-breakdown[b-e5nk3yalx4] {
        display: flex;
        padding-bottom: 0;
    }

    .strength-section-label[b-e5nk3yalx4] {
        font-size: 0.6rem;
        color: #555;
    }

    .strength-total-row[b-e5nk3yalx4] {
        display: flex;
    }
}
/* /Components/War/AttackUnitRow.razor.rz.scp.css */
.unit-info[b-82e9ox532t] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.unit-name[b-82e9ox532t] {
    font-weight: 600;
    color: white;
    font-size: 0.95rem;
}

.unit-available[b-82e9ox532t] {
    font-size: 0.8rem;
    color: #888;
}

.unit-available strong[b-82e9ox532t] {
    color: #ffd700;
}
/* /Layout/EmptyLayout.razor.rz.scp.css */
.page[b-ajtkro9byj] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
}
/* /Layout/FullScreenPageContent.razor.rz.scp.css */
.fullscreen-page-container[b-ubozs33le5] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Size containment hides the content from the sizing of the ancestors: the page stays one screen tall
   and the container gets exactly its free space */
.fullscreen-page-container.fit-viewport[b-ubozs33le5] {
    contain: size;
}

/* Stretch direct children to fill available space */
.fullscreen-page-container[b-ubozs33le5]  > * {
    flex: 1;
}
/* /Layout/MainInfoBar.razor.rz.scp.css */
/* Below 992px: grid "state | moves | score" over a strip of four commodities with compact numbers */
.info-bar[b-spu6drf7bj] {
    flex: 1;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    grid-template-areas:
        "name moves score"
        "resources resources resources";
    align-items: center;
    column-gap: 12px;
    row-gap: 4px;
    padding: 6px 10px;
}

.info-state-name[b-spu6drf7bj] {
    grid-area: name;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: Consolas, monospace;
    font-weight: 800;
    font-size: 16px;
    color: #b0910c;
    text-shadow: 2px 2px 3px black;
}

.info-resources[b-spu6drf7bj] {
    grid-area: resources;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
}

    .info-resources[b-spu6drf7bj]  .tooltip-wrapper {
        min-width: 0;
    }

    /* A commodity is 33px tall - its tap area reaches into the row gap and the bar padding (44px in total)
       without making the sticky bar taller */
    .info-resources[b-spu6drf7bj]  .tooltip-trigger::before {
        content: '';
        position: absolute;
        inset: -5px 0 -6px;
    }

.info-moves[b-spu6drf7bj] {
    grid-area: moves;
}

.info-score[b-spu6drf7bj] {
    grid-area: score;
}

.resource-item[b-spu6drf7bj] {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
    text-shadow: 2px 2px 5px black;
    background-color: rgba(255, 255, 255, 0.05);
    padding: 3px 5px;
    border-radius: 4px;
}

.info-score .resource-item[b-spu6drf7bj] {
    background-color: transparent;
    padding: 0;
}

.icon[b-spu6drf7bj] {
    font-size: 15px;
    line-height: 1;
}

.resource-values[b-spu6drf7bj] {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-width: 0;
}

.resource-item svg[b-spu6drf7bj] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
}

.value[b-spu6drf7bj] {
    color: white;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

.diff-value[b-spu6drf7bj] {
    font-size: 12px;
    line-height: 1.1;
    white-space: nowrap;
}

    /* Nested spans would otherwise get the global white span color */
    .diff-value > span[b-spu6drf7bj] {
        color: inherit;
    }

.value-exact[b-spu6drf7bj] {
    display: none;
}

.diff-positive[b-spu6drf7bj] {
    color: rgb(0, 189, 101);
}

.diff-negative[b-spu6drf7bj] {
    color: red;
}

.diff-zero[b-spu6drf7bj] {
    color: orange;
}

.score[b-spu6drf7bj] {
    font-size: 16px;
    font-weight: 800;
    color: #ffd700;
    font-family: Consolas;
    text-shadow: 2px 2px 5px black;
}

/* Desktop: one row with exact values and units */
@media (min-width: 992px) {
    .info-bar[b-spu6drf7bj] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        height: 100%;
        padding: 0 0.5rem;
    }

    .info-resources[b-spu6drf7bj]  .tooltip-trigger::before {
        content: none;
    }

    .info-state-name[b-spu6drf7bj] {
        display: none;
    }

    .info-resources[b-spu6drf7bj] {
        display: flex;
        gap: 0.5rem;
    }

    .info-moves[b-spu6drf7bj] {
        margin-left: auto;
    }

    .info-score[b-spu6drf7bj] {
        margin-left: 1rem;
    }

    .resource-item[b-spu6drf7bj],
    .info-score .resource-item[b-spu6drf7bj] {
        padding: 0.2rem 0.4rem;
        gap: 0.3rem;
        background-color: rgba(255, 255, 255, 0.05);
    }

    .icon[b-spu6drf7bj] {
        font-size: 16px;
    }

    .value[b-spu6drf7bj] {
        font-size: 12px;
    }

    .diff-value[b-spu6drf7bj] {
        line-height: 1;
    }

    .score[b-spu6drf7bj] {
        font-size: 15px;
    }

    .resource-item svg[b-spu6drf7bj] {
        width: 20px;
        height: 20px;
    }

    .value-exact[b-spu6drf7bj] {
        display: inline;
    }

    .value-compact[b-spu6drf7bj] {
        display: none;
    }
}

@media (min-width: 1400px) {
    .info-bar[b-spu6drf7bj] {
        gap: 0.75rem;
        padding: 0 1rem;
    }

    .resource-item[b-spu6drf7bj],
    .info-score .resource-item[b-spu6drf7bj] {
        padding: 0.3rem 0.6rem;
        gap: 0.5rem;
    }

    .icon[b-spu6drf7bj] {
        font-size: 28px;
    }

    .value[b-spu6drf7bj] {
        font-size: 16px;
    }

    .score[b-spu6drf7bj] {
        font-size: 22px;
    }

    .info-score[b-spu6drf7bj] {
        margin-left: 2rem;
    }

    .resource-item svg[b-spu6drf7bj] {
        width: 24px;
        height: 24px;
    }
}
/* /Layout/MainLayout.razor.rz.scp.css */
/* Global scrollbar styling */
*[b-7rbr3u7zp9] {
    scrollbar-width: thin;
    scrollbar-color: rgba(125,125,125, 0.3) rgba(0,0,0, 0.3);
}

*[b-7rbr3u7zp9]::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

*[b-7rbr3u7zp9]::-webkit-scrollbar-track {
    background: gray;
    border-radius: 4px;
}

*[b-7rbr3u7zp9]::-webkit-scrollbar-thumb {
    background: green;
    border-radius: 4px;
}

*[b-7rbr3u7zp9]::-webkit-scrollbar-thumb:hover {
    background: blue;
}

/* Mobile-first shell: below 992px a sticky top bar and the fixed bottom navigation (MobileNavigation),
   from 992px the sidebar (icons only, from 1200px with labels) and the classic top bar. */

.page[b-7rbr3u7zp9] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
}

main[b-7rbr3u7zp9] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    padding: 0;
    margin: 0;
    /* blazor.bootstrap.css sets height: 100vh, which keeps main and .page one screen tall from 992px - the top bar
       and the sidebar would stick only within the first screen */
    height: auto;
    /* blazor.bootstrap.css sets overflow-x: hidden, which turns main into a scroll container and breaks
       the sticky top bar; clip still cuts horizontal overflow but keeps the page as the scroll container */
    overflow-x: hidden;
    overflow-x: clip;
}

/* Keeps the end of the page above the fixed bottom navigation */
.page-game main[b-7rbr3u7zp9] {
    padding-bottom: calc(var(--pow-mobile-bottom-nav-height) + var(--pow-safe-area-bottom));
}

/* Not a scroll container either (the page scrolls), so sticky elements inside pages stick to the viewport */
main .content[b-7rbr3u7zp9] {
    flex: 1;
    min-height: 0;
    overflow-x: hidden;
    overflow-x: clip;
    display: flex;
    flex-direction: column;
    padding: 0;
    margin: 0 !important;
}

.content-body[b-7rbr3u7zp9] {
    flex: 1;
    display: flex;
    flex-direction: column;
    max-width: 1500px;
    width: 100%;
    margin: 0 auto;
    margin-top: 10px;
    animation: page-enter-b-7rbr3u7zp9 0.12s ease-out both;
}

@keyframes page-enter-b-7rbr3u7zp9 {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.sidebar[b-7rbr3u7zp9] {
    display: none;
    background-color: rgba(0,0,0, 0.7);
}

.top-row[b-7rbr3u7zp9] {
    position: sticky;
    top: 0;
    z-index: 1020;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: var(--pow-safe-area-top) var(--pow-safe-area-right) 0 var(--pow-safe-area-left);
    background-color: rgba(0,0,0, 0.75);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-bottom: 1px solid rgba(100, 150, 255, 0.3);
}

    /* Logout is in the "More" sheet below 992px */
    .top-row[b-7rbr3u7zp9]  .logout-btn {
        display: none;
    }

@media (min-width: 992px) {
    .page[b-7rbr3u7zp9] {
        flex-direction: row;
    }

    .page-game main[b-7rbr3u7zp9] {
        padding-bottom: 0;
    }

    .content-body[b-7rbr3u7zp9] {
        margin-top: 25px;
    }

    .sidebar[b-7rbr3u7zp9] {
        display: block;
        flex-shrink: 0;
        width: 55px;
        height: 100vh;
        height: 100dvh;
        position: sticky;
        top: 0;
        transition: width 0.2s ease;
    }

    .top-row[b-7rbr3u7zp9] {
        height: var(--pow-desktop-top-bar-height);
        padding: 0 1.5rem;
    }

        .top-row[b-7rbr3u7zp9]  .logout-btn {
            display: inline-block;
        }
}

@media (min-width: 1200px) {
    .sidebar[b-7rbr3u7zp9] {
        width: 250px;
    }

    .top-row[b-7rbr3u7zp9] {
        padding-left: 2rem;
        padding-right: 1.5rem;
    }
}
/* /Layout/Navigation/MobileMoreSheet.razor.rz.scp.css */
.more-sheet-backdrop[b-mwaxusgbyt] {
    position: fixed;
    inset: 0;
    z-index: 1028;
    background-color: rgba(0, 0, 0, 0.6);
    animation: backdrop-enter-b-mwaxusgbyt 0.2s ease-out both;
}

.more-sheet[b-mwaxusgbyt] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: calc(var(--pow-mobile-bottom-nav-height) + var(--pow-safe-area-bottom));
    z-index: 1029;
    max-height: calc(85vh - var(--pow-mobile-bottom-nav-height));
    max-height: calc(85dvh - var(--pow-mobile-bottom-nav-height));
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 6px calc(12px + var(--pow-safe-area-right)) 16px calc(12px + var(--pow-safe-area-left));
    background-color: rgba(10, 10, 10, 0.92);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-top: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 10px 10px 0 0;
    animation: sheet-enter-b-mwaxusgbyt 0.2s ease-out both;
}

.more-sheet-handle[b-mwaxusgbyt] {
    width: 40px;
    height: 4px;
    margin: 0 auto 6px;
    border-radius: 2px;
    background-color: rgba(255, 255, 255, 0.3);
}

.more-sheet-group-title[b-mwaxusgbyt] {
    margin: 10px 2px 6px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #b0b0b0;
    text-shadow: 2px 2px 5px black;
}

.more-sheet-grid[b-mwaxusgbyt] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

/* Tiles are rendered by NavLink and UserMenu, hence ::deep */
.more-sheet-grid[b-mwaxusgbyt]  .more-sheet-tile {
    position: relative;
    min-height: 72px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 0;
    padding: 8px 4px;
    color: #d7d7d7;
    text-decoration: none;
    background-color: rgba(20, 20, 40, 0.8);
    border: 1px solid rgba(100, 150, 255, 0.3);
    border-radius: 8px;
    transition: all 0.2s ease;
}

    .more-sheet-grid[b-mwaxusgbyt]  .more-sheet-tile.active {
        color: #ffd700;
        border-color: rgba(255, 215, 0, 0.6);
    }

    .more-sheet-grid[b-mwaxusgbyt]  .more-sheet-badge {
        position: absolute;
        top: 6px;
        right: 6px;
        margin-left: 0;
    }

.more-sheet-label[b-mwaxusgbyt] {
    max-width: 100%;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    overflow-wrap: anywhere;
    color: inherit;
}

@media (hover: hover) {
    .more-sheet-grid[b-mwaxusgbyt]  .more-sheet-tile:hover {
        color: white;
        border-color: rgba(100, 150, 255, 0.6);
    }
}

@keyframes sheet-enter-b-mwaxusgbyt {
    from {
        transform: translateY(100%);
    }
    to {
        transform: translateY(0);
    }
}

@keyframes backdrop-enter-b-mwaxusgbyt {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    .more-sheet[b-mwaxusgbyt], .more-sheet-backdrop[b-mwaxusgbyt] {
        animation: none;
    }
}

@media (min-width: 992px) {
    .more-sheet[b-mwaxusgbyt], .more-sheet-backdrop[b-mwaxusgbyt] {
        display: none;
    }
}
/* /Layout/Navigation/MobileNavigation.razor.rz.scp.css */
.mobile-bottom-nav[b-60qj28y1h8] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1030;
    display: flex;
    height: calc(var(--pow-mobile-bottom-nav-height) + var(--pow-safe-area-bottom));
    padding: 0 var(--pow-safe-area-right) var(--pow-safe-area-bottom) var(--pow-safe-area-left);
    background-color: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-top: 1px solid rgba(100, 150, 255, 0.3);
}

/* Shared by the NavLink items (::deep, rendered by NavLink) and the "More" button */
.mobile-bottom-nav[b-60qj28y1h8]  .bottom-nav-item,
.bottom-nav-item[b-60qj28y1h8] {
    flex: 1 1 0;
    min-width: 0;
    min-height: var(--pow-touch-target);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 4px 2px 0;
    border: none;
    border-top: 3px solid transparent;
    background: transparent;
    color: #d7d7d7;
    text-decoration: none;
    transition: color 0.2s ease, border-color 0.2s ease;
}

    .mobile-bottom-nav[b-60qj28y1h8]  .bottom-nav-item.active,
    .bottom-nav-item.active[b-60qj28y1h8] {
        color: white;
        border-top-color: darkred;
    }

.bottom-nav-icon[b-60qj28y1h8] {
    position: relative;
    display: flex;
}

    .bottom-nav-icon[b-60qj28y1h8]  .bottom-nav-badge {
        position: absolute;
        top: -6px;
        right: -12px;
        margin-left: 0;
        min-width: 1.1rem;
        height: 1.1rem;
        font-size: 0.7rem;
    }

.bottom-nav-label[b-60qj28y1h8] {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
    font-weight: 600;
    color: inherit;
}

@media (hover: hover) {
    .mobile-bottom-nav[b-60qj28y1h8]  .bottom-nav-item:hover,
    .bottom-nav-item:hover[b-60qj28y1h8] {
        color: white;
    }
}

@media (min-width: 992px) {
    .mobile-bottom-nav[b-60qj28y1h8] {
        display: none;
    }
}
/* /Layout/Navigation/NavigationBadgeCount.razor.rz.scp.css */
.unread-badge[b-kwklzvlyt7] {
    background-color: #dc3545;
    color: white;
    border-radius: 50%;
    min-width: 1.25rem;
    height: 1.25rem;
    font-size: 0.75rem;
    font-weight: bold;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 0.5rem;
    padding: 0 0.35rem;
    text-shadow: none;
}
/* /Layout/NavMenu.razor.rz.scp.css */
/* Rendered only inside the desktop sidebar (from 992px).
   Base = narrow sidebar with icons only (992-1199px), from 1200px full sidebar with logo and labels. */

.top-row[b-eguibxrbv8] {
    height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.nav-logo[b-eguibxrbv8] {
    display: none;
}

.nav-scrollable[b-eguibxrbv8] {
    /* Allow sidebar to scroll for tall menus */
    height: calc(100vh - 3.5rem);
    height: calc(100dvh - 3.5rem);
    overflow-y: auto;
}

.nav-item[b-eguibxrbv8] {
    font-size: 0.9rem;
    padding: 0 0 0.25rem;
}

    .nav-item:first-of-type[b-eguibxrbv8] {
        padding-top: 0.5rem;
    }

    .nav-item:last-of-type[b-eguibxrbv8] {
        padding-bottom: 0.5rem;
    }

    .nav-item[b-eguibxrbv8]  a {
        position: relative;
        color: #d7d7d7;
        border-left: 3px solid transparent;
        height: 2.4rem;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 2.4rem;
        background-color: rgba(255,255,255,0.1);
        transition: all 0.2s ease;
    }

        .nav-item[b-eguibxrbv8]  a.active {
            border-left-color: darkred;
            color: white;
        }

    .nav-item[b-eguibxrbv8]  svg {
        position: relative;
        top: -1px;
        width: 1.25rem;
        height: 1.25rem;
        flex-shrink: 0;
    }

    /* Narrow sidebar: counter sits on the icon */
    .nav-item[b-eguibxrbv8]  .unread-badge {
        position: absolute;
        top: 2px;
        right: 2px;
        margin-left: 0;
    }

.nav-label[b-eguibxrbv8] {
    display: none;
}

.nav-label-muted[b-eguibxrbv8] {
    color: grey;
}

@media (hover: hover) {
    .nav-item[b-eguibxrbv8]  a:hover {
        background-color: rgba(255,255,255,0.2);
        color: white;
        box-shadow: 0 0 0.15rem rgba(255, 255, 255, 0.4),
                    0 0 0.5rem rgba(51, 71, 255, 0.3),
                    inset 0 0 0.3rem rgba(51, 71, 255, 0.1);
    }
}

/* Full sidebar: logo, labels and the angled link shape */
@media (min-width: 1200px) {
    .nav-logo[b-eguibxrbv8] {
        display: inline;
    }

    .nav-label[b-eguibxrbv8] {
        display: inline;
    }

    .nav-item[b-eguibxrbv8] {
        padding-left: 1rem;
        padding-right: 1rem;
    }

        .nav-item[b-eguibxrbv8]  a {
            justify-content: flex-start;
            border-left: 1px solid rgba(255, 255, 255, 0.3);
            clip-path: polygon(0 0, 100% 0, 100% 50%, calc(100% - 1.2rem) 100%, 0 100%);
        }

            .nav-item[b-eguibxrbv8]  a.active {
                border-left: 5px solid darkred;
            }

        .nav-item[b-eguibxrbv8]  svg {
            margin-right: 0.75rem;
        }

        .nav-item[b-eguibxrbv8]  .unread-badge {
            position: static;
            margin-left: 0.5rem;
        }
}
/* /Layout/ScrollablePageContent.razor.rz.scp.css */
.page-scroll-container[b-0f1sqwaqma] {
}
/* /Pages/AllianceDetail.razor.rz.scp.css */
/* Phones: the cards use the whole width of the tile */
.alliance-detail-page[b-aay3lbwwjx] {
    padding-inline: 0;
}

.alliance-detail-content[b-aay3lbwwjx] {
    padding-block: 8px;
}

.alliance-description[b-aay3lbwwjx] {
    margin-bottom: 12px;
    padding: 0.75rem;
    background: rgba(32, 178, 170, 0.08);
    border-left: 3px solid rgba(32, 178, 170, 0.6);
    border-radius: 0 4px 4px 0;
    color: #d0d0d0;
    font-size: 14px;
    line-height: 1.5;
    white-space: pre-wrap;
}

@media (min-width: 768px) {
    .alliance-detail-page[b-aay3lbwwjx] {
        padding-inline: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
    }

    .alliance-detail-content[b-aay3lbwwjx] {
        padding: 0.5rem;
    }

    .alliance-description[b-aay3lbwwjx] {
        margin-bottom: 1rem;
        padding: 0.75rem 1rem;
    }
}
/* /Pages/AlliancePage.razor.rz.scp.css */
/* Phones: everything in one column with actions across the width. From 768px the alliance header and request rows
   in one line, from 992px two columns of cards (Bootstrap col-lg-6 in the markup). */

.alliance-header[b-pruzljilby] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 12px;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(100, 150, 255, 0.3);
}

.alliance-title[b-pruzljilby] {
    margin: 0;
    color: #ffd700;
    font-size: 1.25rem;
    font-weight: 700;
    overflow-wrap: anywhere;
    text-shadow: 2px 2px 5px black;
}

.alliance-stats[b-pruzljilby] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1rem;
}

.stat-item[b-pruzljilby] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.stat-label[b-pruzljilby] {
    color: lightgray;
    font-size: 0.9rem;
}

.stat-value[b-pruzljilby] {
    color: white;
    font-size: 0.95rem;
    font-weight: 600;
}

.stat-value.score[b-pruzljilby] {
    color: #ffd700;
}

.form-group[b-pruzljilby] {
    margin-bottom: 1rem;
}

.form-group label[b-pruzljilby] {
    display: block;
    margin-bottom: 0.5rem;
    color: lightgray;
    font-size: 0.9rem;
}

.form-group[b-pruzljilby]  input,
.form-group[b-pruzljilby]  textarea {
    width: 100%;
    min-height: var(--pow-touch-target);
}

.form-action-right[b-pruzljilby] {
    display: flex;
    justify-content: flex-end;
}

.requests-list[b-pruzljilby] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Phones: the name over the buttons */
.request-row[b-pruzljilby] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 0.75rem;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 4px;
}

.request-name[b-pruzljilby] {
    color: white;
    font-weight: 500;
    overflow-wrap: anywhere;
}

.invitation-info[b-pruzljilby] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.invitation-message[b-pruzljilby] {
    color: #aaa;
    font-size: 0.85rem;
    overflow-wrap: anywhere;
}

.request-actions[b-pruzljilby] {
    display: flex;
    gap: 8px;
}

.request-actions[b-pruzljilby]  button {
    flex: 1 1 0;
    min-width: 0;
}

.no-data[b-pruzljilby] {
    color: #888;
    font-style: italic;
}

.no-alliance-message[b-pruzljilby] {
    margin-bottom: 12px;
    padding: 1rem;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    text-align: center;
}

.no-alliance-message h3[b-pruzljilby] {
    margin: 0 0 0.5rem 0;
    color: white;
    font-size: 1.25rem;
}

.no-alliance-message p[b-pruzljilby] {
    margin: 0;
    color: lightgray;
    font-size: 0.95rem;
}

/* Tablets and PC */
@media (min-width: 768px) {
    .alliance-header[b-pruzljilby] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 1rem;
    }

    .alliance-title[b-pruzljilby] {
        font-size: 1.5rem;
    }

    .alliance-stats[b-pruzljilby] {
        gap: 1.5rem;
    }

    /* A long name wraps beside the buttons. Only a narrow card (half of the page) moves them under it,
       the name then takes the whole line and they stay on the right. */
    .request-row[b-pruzljilby] {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-end;
        gap: 8px 16px;
        padding: 0.75rem 1rem;
    }

    .request-row > .request-name[b-pruzljilby],
    .request-row > .invitation-info[b-pruzljilby] {
        flex: 1 1 140px;
    }

    .request-row[b-pruzljilby]  button {
        min-width: 120px;
    }

    .request-actions[b-pruzljilby]  button {
        flex: 0 0 auto;
    }

    .no-alliance-message[b-pruzljilby] {
        margin-bottom: 2rem;
        padding: 1.5rem;
    }
}

/* Two columns of cards */
@media (min-width: 992px) {
    .alliance-cards-row[b-pruzljilby] {
        margin-top: 16px;
    }
}
/* /Pages/ArchivedRanking.razor.rz.scp.css */
/* Page wrapper - centers and limits width */
.archive-page-wrapper[b-59jkmaqvvv] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 8px;
}

/* Archive header - phones: the title under the back button */
.archive-header[b-59jkmaqvvv] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 1.5rem;
    padding: 1rem 0;
    border-bottom: 1px solid rgba(32, 178, 170, 0.3);
    margin-bottom: 0.75rem;
}

.back-btn[b-59jkmaqvvv] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: var(--pow-touch-target);
    padding: 7px 16px;
    background: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(32, 178, 170, 0.4);
    border-radius: 8px;
    color: lightseagreen;
    font-size: 13px;
    text-decoration: none;
    white-space: nowrap;
    transition: all 0.2s;
    text-shadow: 1px 1px 3px black;
}

.archive-title[b-59jkmaqvvv] {
    color: #ffd700;
    font-family: Consolas, monospace;
    font-size: 1.1rem;
    font-weight: 700;
    text-shadow: 2px 2px 5px black;
    letter-spacing: 0.5px;
}

.archive-top-pager[b-59jkmaqvvv] {
    display: flex;
    margin-bottom: 8px;
}

@media (hover: hover) {
    .back-btn:hover[b-59jkmaqvvv] {
        background: rgba(32, 178, 170, 0.2);
        border-color: lightseagreen;
        color: white;
        box-shadow: 0 0 8px rgba(32, 178, 170, 0.25);
    }
}

@media (min-width: 768px) {
    .archive-page-wrapper[b-59jkmaqvvv] {
        padding: 0 1.5rem;
    }

    .archive-top-pager[b-59jkmaqvvv] {
        margin-bottom: 1rem;
    }
}
/* /Pages/BugReportPage.razor.rz.scp.css */
.bug-form[b-spcrv7v5x5] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 12px 4px;
}

.bug-submit-success[b-spcrv7v5x5] {
    padding: 8px 12px;
    background: rgba(76, 175, 80, 0.25);
    border: 1px solid rgba(76, 175, 80, 0.7);
    border-radius: 6px;
    color: #4caf50;
    font-size: 14px;
    font-weight: 600;
}

.bug-field[b-spcrv7v5x5] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
}

.bug-field-label[b-spcrv7v5x5] {
    font-weight: 700;
}

.bug-input[b-spcrv7v5x5] {
    width: 100%;
    min-height: var(--pow-touch-target);
    padding: 8px 12px;
    font-size: 1rem;
}

.bug-input[b-spcrv7v5x5]::placeholder {
    color: rgba(255, 255, 255, 0.45);
}

.bug-message[b-spcrv7v5x5] {
    padding: 12px;
    color: #888;
    font-style: italic;
    text-shadow: 2px 2px 5px black;
}

.bug-list[b-spcrv7v5x5] {
    padding: 8px 0;
}

/* Phones: the number beside the title, the reporter and the date under it. The column layout is set once for the
   header and the rows, from 768px it is one line of the same widths. */
.bug-header[b-spcrv7v5x5],
.bug-row[b-spcrv7v5x5] {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    grid-template-areas:
        "index title title"
        "index reporter date";
    align-items: center;
    gap: 2px 8px;
    width: 100%;
    padding: 8px;
    border-radius: 3px;
    text-align: left;
    text-shadow: 2px 2px 5px black;
}

/* The header only names the columns of the one-line layout */
.bug-header[b-spcrv7v5x5] {
    display: none;
    margin-bottom: 2px;
    background: rgba(32, 178, 170, 0.3);
    border: 1px solid rgba(32, 178, 170, 0.5);
    border-radius: 4px;
    color: white;
    font-size: 13px;
    font-weight: 600;
}

.bug-row[b-spcrv7v5x5] {
    min-height: var(--pow-touch-target);
    margin-top: 2px;
    background-color: rgba(0, 0, 0, 0.5);
    border: 1px solid transparent;
    color: white;
    cursor: pointer;
    transition: background-color 0.15s, border-color 0.15s;
}

.bug-row.selected[b-spcrv7v5x5] {
    background-color: rgba(32, 178, 170, 0.25);
    border-color: rgba(32, 178, 170, 0.6);
}

.bug-index[b-spcrv7v5x5] {
    grid-area: index;
    text-align: center;
}

.bug-row .bug-index[b-spcrv7v5x5] {
    color: #888;
    font-size: 12px;
    font-weight: 500;
}

.bug-title[b-spcrv7v5x5] {
    grid-area: title;
    min-width: 0;
}

.bug-row .bug-title[b-spcrv7v5x5] {
    color: white;
    font-size: 14px;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.bug-reporter[b-spcrv7v5x5] {
    grid-area: reporter;
    min-width: 0;
}

.bug-row .bug-reporter[b-spcrv7v5x5] {
    color: #87ceeb;
    font-size: 13px;
    overflow-wrap: anywhere;
}

.bug-date[b-spcrv7v5x5] {
    grid-area: date;
}

.bug-row .bug-date[b-spcrv7v5x5] {
    color: #888;
    font-size: 12px;
}

.bug-detail-description[b-spcrv7v5x5] {
    margin: 2px 0 8px;
    padding: 8px 12px;
    background: rgba(0, 0, 0, 0.6);
    border: 1px solid rgba(32, 178, 170, 0.5);
    border-radius: 6px;
    color: #d0d0d0;
    font-size: 14px;
    line-height: 1.6;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    text-shadow: 2px 2px 5px black;
}

@media (hover: hover) {
    .bug-row:hover[b-spcrv7v5x5] {
        background-color: rgba(32, 178, 170, 0.15);
        border-color: rgba(32, 178, 170, 0.3);
    }

    .bug-row.selected:hover[b-spcrv7v5x5] {
        background-color: rgba(32, 178, 170, 0.25);
        border-color: rgba(32, 178, 170, 0.6);
    }
}

@media (min-width: 768px) {
    .bug-form[b-spcrv7v5x5] {
        padding: 16px 4px;
    }

    .bug-submit[b-spcrv7v5x5] {
        align-self: flex-start;
    }

    .bug-header[b-spcrv7v5x5] {
        display: grid;
    }

    .bug-header[b-spcrv7v5x5],
    .bug-row[b-spcrv7v5x5] {
        grid-template-columns: 48px minmax(0, 5fr) minmax(0, 3fr) minmax(0, 3fr);
        grid-template-areas: "index title reporter date";
        padding: 0.6rem 0.5rem;
    }
}
/* /Pages/Buildings.razor.rz.scp.css */
/* Phones: a card per building (image beside name, cost and effect; built count and input under them across the card),
   while something is selected the summary with the action button sticks above the bottom navigation.
   From 768px: rows with the column grid, two buildings side by side only where the names fit (container query). */

.buildings-section[b-u49vuaqx46] {
    container-type: inline-size;
}

/* Land info bar */
.land-info[b-u49vuaqx46] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 4px 8px;
    padding: 10px 15px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 6px;
    border-left: 3px solid #4caf50;
    margin-bottom: 12px;
}

.land-icon[b-u49vuaqx46] {
    font-size: 1.1rem;
}

.land-label[b-u49vuaqx46] {
    color: #aaa;
    font-size: 0.85rem;
}

.land-value[b-u49vuaqx46] {
    color: #4caf50;
    font-weight: bold;
    font-size: 0.95rem;
    text-shadow: 0 0 8px rgba(76, 175, 80, 0.4);
}

/* Phones: free and total land wrap onto separate lines, the separator would start the second one */
.land-separator[b-u49vuaqx46] {
    display: none;
    color: #555;
    margin: 0 5px;
}

.land-info .land-total[b-u49vuaqx46] {
    color: #ffd700;
    font-weight: bold;
    font-size: 0.9rem;
}

.buildings-grid[b-u49vuaqx46] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    margin-bottom: 12px;
}

/* Column labels - phones have the labels inside the cards */
.building-header[b-u49vuaqx46] {
    display: none;
}

.header-cell[b-u49vuaqx46] {
    color: #888;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 500;
    text-align: left;
    align-self: end;
}

/* IllustratedDataRow as building card root */
.buildings-grid[b-u49vuaqx46]  .illustrated-row {
    border-color: rgba(100, 150, 255, 0.3);
    background: rgba(20, 20, 40, 0.8);
    border-radius: 6px;
    transition: all 0.2s ease;
}

.buildings-grid--demolish[b-u49vuaqx46]  .illustrated-row {
    border-color: rgba(255, 100, 100, 0.3);
    background: rgba(20, 20, 40, 0.8);
}

@media (hover: hover) {
    .buildings-grid[b-u49vuaqx46]  .illustrated-row:hover {
        border-color: rgba(100, 150, 255, 0.6);
        background: rgba(30, 30, 60, 0.9);
    }

    .buildings-grid--demolish[b-u49vuaqx46]  .illustrated-row:hover {
        border-color: rgba(255, 100, 100, 0.6);
        background: rgba(40, 20, 20, 0.9);
    }
}

/* Enter icon shown top-right over the building image */
.building-enter-icon[b-u49vuaqx46] {
    position: absolute;
    top: 0;
    right: 0;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.85rem;
    line-height: 1;
    background: rgba(0, 0, 0, 0.65);
    border-radius: 0 0 0 5px;
    padding: 2px 4px;
}

/* Card head beside the image: name, cost, effect */
.building-card-content[b-u49vuaqx46] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
}

.building-info[b-u49vuaqx46] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.building-name[b-u49vuaqx46] {
    color: #ffd700;
    font-size: 1rem;
    font-weight: 700;
    text-shadow: 1px 1px 3px black;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.building-price[b-u49vuaqx46] {
    color: #999;
    font-size: 0.75rem;
}

.building-stats[b-u49vuaqx46] {
    display: flex;
    align-items: center;
    min-width: 0;
}

.building-effect[b-u49vuaqx46] {
    color: #4caf50;
    font-size: 0.8125rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Card controls under the image: built count on one line, the input across the card */
.building-controls[b-u49vuaqx46] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.building-built[b-u49vuaqx46] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    background: rgba(0, 0, 0, 0.45);
    border: 1px solid rgba(29, 143, 212, 0.35);
    border-radius: 6px;
    padding: 4px 10px;
}

.building-built-label[b-u49vuaqx46] {
    color: #aaa;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Building count - prominent */
.building-count[b-u49vuaqx46] {
    color: #1d8fd4;
    font-weight: bold;
    font-size: 1.3rem;
    line-height: 1.2;
    text-shadow: 0 0 6px #1d8fd4, 0 0 16px #1565c0, 0 0 30px rgba(21, 101, 192, 0.7);
    font-family: Consolas, monospace;
}

.building-land[b-u49vuaqx46] {
    display: flex;
    gap: 4px;
    align-items: baseline;
    margin-left: auto;
}

.building-land .land-total[b-u49vuaqx46] {
    color: #8bc34a;
    font-size: 0.75rem;
    font-weight: 500;
}

.building-land .land-percent[b-u49vuaqx46] {
    color: #888;
    font-size: 0.75rem;
}

/* Action area with summary and MoveActionButton */
.action-area[b-u49vuaqx46] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 12px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    border: 1px solid rgba(100, 150, 255, 0.2);
}

.action-area.demolish[b-u49vuaqx46] {
    border-color: rgba(255, 100, 100, 0.2);
}

/* Below 992px (with the bottom navigation): while something is selected the summary and the button stick above
   the navigation, otherwise they would be under all 13 buildings */
.action-area--pending[b-u49vuaqx46] {
    position: sticky;
    bottom: calc(var(--pow-mobile-bottom-nav-height) + var(--pow-safe-area-bottom) + 8px);
    z-index: 2;
    gap: 8px;
    padding: 10px 12px;
    background: rgba(12, 14, 32, 0.92);
    border-color: rgba(100, 150, 255, 0.5);
    box-shadow: 0 -6px 18px rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.action-area--pending.demolish[b-u49vuaqx46] {
    border-color: rgba(255, 100, 100, 0.5);
}

.action-area--pending .turns-info[b-u49vuaqx46] {
    display: none;
}

.action-area--pending .action-summary[b-u49vuaqx46] {
    gap: 2px 10px;
}

.action-area--pending .summary-label[b-u49vuaqx46] {
    font-size: 0.75rem;
}

.action-area--pending .summary-value[b-u49vuaqx46] {
    font-size: 0.9rem;
}

.action-summary[b-u49vuaqx46] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px 14px;
}

.summary-item[b-u49vuaqx46] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.summary-label[b-u49vuaqx46] {
    color: #888;
    font-size: 0.85rem;
}

.summary-value[b-u49vuaqx46] {
    color: white;
    font-weight: bold;
    font-size: 1rem;
}

.summary-value.cost[b-u49vuaqx46] {
    color: #ffd700;
}

.summary-value.land[b-u49vuaqx46] {
    color: #4caf50;
}

.turns-info[b-u49vuaqx46] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.turns-formula[b-u49vuaqx46] {
    color: #666;
    font-size: 0.75rem;
    font-style: italic;
}

/* Exploration section */
.exploration-section[b-u49vuaqx46] {
    padding: 20px;
}

.exploration-content[b-u49vuaqx46] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    padding: 20px;
    text-align: center;
    background: rgba(20, 20, 40, 0.6);
    border: 1px solid rgba(100, 150, 255, 0.2);
    border-radius: 8px;
}

.exploration-image[b-u49vuaqx46] {
    flex-shrink: 0;
}

.exploration-info[b-u49vuaqx46] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.exploration-description[b-u49vuaqx46] {
    color: #ccc;
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0;
}

.colonization-image[b-u49vuaqx46] {
    width: 100%;
    max-width: 200px;
    height: auto;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

/* Tablets and PC: a row per building with the column grid (info | effect | built | input) */
@media (min-width: 768px) {
    .buildings-section[b-u49vuaqx46] {
        padding: 15px;
    }

    .land-info[b-u49vuaqx46] {
        flex-wrap: nowrap;
        justify-content: flex-start;
        gap: 8px;
        margin-bottom: 15px;
    }

    .land-separator[b-u49vuaqx46] {
        display: inline;
    }

    .buildings-grid[b-u49vuaqx46] {
        gap: 6px;
        margin-bottom: 15px;
    }

    .building-header[b-u49vuaqx46] {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: minmax(0, 1fr) 100px 90px 100px;
        gap: 10px;
        padding: 6px 10px;
        background: rgba(0, 0, 0, 0.4);
        border-radius: 4px;
    }

    .building-header.demolish-mode[b-u49vuaqx46] {
        background: rgba(40, 0, 0, 0.4);
    }

    .building-header .header-cell:nth-child(n + 5)[b-u49vuaqx46] {
        display: none;
    }

    .building-card-content[b-u49vuaqx46] {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 100px;
        align-items: center;
        gap: 10px;
    }

    .building-name[b-u49vuaqx46] {
        font-size: 0.9rem;
    }

    .building-price[b-u49vuaqx46] {
        color: #888;
        font-size: 0.7rem;
    }

    .building-effect[b-u49vuaqx46] {
        font-size: 0.75rem;
        overflow: visible;
    }

    .building-controls[b-u49vuaqx46] {
        display: grid;
        grid-template-columns: 90px 100px;
        align-items: center;
        gap: 10px;
    }

    .building-built[b-u49vuaqx46] {
        flex-direction: column;
        align-items: center;
        gap: 2px;
        width: 100%;
        padding: 4px 6px;
    }

    .building-built-label[b-u49vuaqx46] {
        display: none;
    }

    .building-count[b-u49vuaqx46] {
        font-size: 1.4rem;
        line-height: normal;
    }

    .building-land[b-u49vuaqx46] {
        margin-left: 0;
    }

    .building-land .land-total[b-u49vuaqx46] {
        font-size: 0.7rem;
    }

    .building-land .land-percent[b-u49vuaqx46] {
        color: #666;
        font-size: 0.6rem;
    }

    .building-input[b-u49vuaqx46] {
        display: flex;
        justify-content: flex-end;
        padding-left: 16px;
    }

    .action-area[b-u49vuaqx46] {
        gap: 10px;
        padding: 15px;
    }

    .action-area--pending[b-u49vuaqx46] {
        padding: 10px 15px;
    }

    .action-summary[b-u49vuaqx46],
    .action-area--pending .action-summary[b-u49vuaqx46] {
        flex-wrap: nowrap;
        gap: 20px;
        margin-bottom: 5px;
    }

    .action-area--pending .summary-label[b-u49vuaqx46] {
        font-size: 0.85rem;
    }

    .action-area--pending .summary-value[b-u49vuaqx46] {
        font-size: 1rem;
    }

    .exploration-content[b-u49vuaqx46] {
        flex-direction: row;
        gap: 30px;
        padding: 25px;
        text-align: left;
    }

    .exploration-info[b-u49vuaqx46] {
        align-items: stretch;
    }

    .colonization-image[b-u49vuaqx46] {
        max-width: 300px;
    }
}

/* From 992px there is no bottom navigation, the summary stays at the end of the list */
@media (min-width: 992px) {
    .action-area--pending[b-u49vuaqx46] {
        position: static;
        padding: 15px;
        background: rgba(0, 0, 0, 0.2);
        border-color: rgba(100, 150, 255, 0.2);
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .action-area--pending.demolish[b-u49vuaqx46] {
        border-color: rgba(255, 100, 100, 0.2);
    }

    .action-area--pending .turns-info[b-u49vuaqx46] {
        display: flex;
    }
}

@media (min-width: 1200px) {
    .building-name[b-u49vuaqx46] {
        font-size: 1rem;
    }

    .building-count[b-u49vuaqx46] {
        font-size: 1.6rem;
    }
}

/* Two buildings side by side once each row keeps ~150px for the name next to the image and the fixed columns */
@container (min-width: 1272px) {
    .buildings-grid[b-u49vuaqx46] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .building-header[b-u49vuaqx46] {
        grid-template-columns: minmax(0, 1fr) 100px 90px 100px minmax(0, 1fr) 100px 90px 100px;
    }

    .building-header .header-cell:nth-child(n + 5)[b-u49vuaqx46] {
        display: block;
    }
}

/* Touch from 768px: the input needs 168px for [−][value][+] with 44px buttons, the effect moves under the name */
@media (min-width: 768px) and (pointer: coarse) {
    .building-header[b-u49vuaqx46] {
        grid-template-columns: minmax(0, 1fr) 90px 168px;
    }

    .building-header .header-cell:nth-child(2)[b-u49vuaqx46] {
        display: none;
    }

    .building-card-content[b-u49vuaqx46] {
        grid-template-columns: minmax(0, 1fr);
        gap: 2px;
    }

    .building-controls[b-u49vuaqx46] {
        grid-template-columns: 90px 168px;
    }

    .building-input[b-u49vuaqx46] {
        padding-left: 0;
    }
}

/* From 992px there is room for the effect column again */
@media (min-width: 992px) and (pointer: coarse) {
    .building-header[b-u49vuaqx46] {
        grid-template-columns: minmax(0, 1fr) 100px 90px 168px;
    }

    .building-header .header-cell:nth-child(2)[b-u49vuaqx46] {
        display: block;
    }

    .building-card-content[b-u49vuaqx46] {
        grid-template-columns: minmax(0, 1fr) 100px;
        gap: 10px;
    }
}

@media (pointer: coarse) {
    @container (min-width: 1272px) {
        .building-header[b-u49vuaqx46] {
            grid-template-columns: minmax(0, 1fr) 100px 90px 168px minmax(0, 1fr) 100px 90px 168px;
        }

        .building-header .header-cell:nth-child(6)[b-u49vuaqx46] {
            display: block;
        }
    }
}
/* /Pages/CreateState.razor.rz.scp.css */
.create-btn[b-mhhmkyezxq] {
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 10px;
    color: white;
    font-size: 18px;
    padding: 10px;
    border-width: 2px;
    border-color: gray;
    margin-top: 20px;
    border-style: solid;
}

.form-container[b-mhhmkyezxq] {
    max-width: 1200px;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    padding: 30px 40px;
    border-radius: 14px;
    margin: 0 auto;
}

.label[b-mhhmkyezxq] {
    color: white;
}

[b-mhhmkyezxq] .content {
    overflow: auto !important;
}

.system-bonuses[b-mhhmkyezxq] {
    margin-top: 8px;
    padding: 10px 14px;
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.bonuses-columns[b-mhhmkyezxq] {
    display: flex;
    gap: 20px;
}

.bonuses-col[b-mhhmkyezxq] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.bonus-row[b-mhhmkyezxq] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    padding: 2px 4px;
    border-radius: 4px;
}

.bonus-icon[b-mhhmkyezxq] {
    width: 18px;
    text-align: center;
}

.bonus-label[b-mhhmkyezxq] {
    flex: 1;
    color: #bdc3c7;
}

.bonus-value[b-mhhmkyezxq] {
    font-weight: 600;
    min-width: 40px;
    text-align: right;
}

.bonus-positive .bonus-value[b-mhhmkyezxq] {
    color: #2ecc71;
}

.bonus-negative .bonus-value[b-mhhmkyezxq] {
    color: #e74c3c;
}

.bonus-neutral .bonus-value[b-mhhmkyezxq] {
    color: #95a5a6;
}
/* /Pages/EconomicInfluence.razor.rz.scp.css */
/* Phones: the tile uses the whole width, the content its own 12px padding */
.economic-influence-content[b-bo86ejtb8o] {
    padding-block: 8px;
}

.target-selector-section[b-bo86ejtb8o] {
    margin-bottom: 12px;
}

.sanction-symbol[b-bo86ejtb8o] {
    width: 40px;
    height: 40px;
    opacity: 0.5;
}

@media (min-width: 768px) {
    .economic-influence-content[b-bo86ejtb8o] {
        padding: 1rem;
    }

    .target-selector-section[b-bo86ejtb8o] {
        margin-bottom: 1rem;
    }

    .sanction-symbol[b-bo86ejtb8o] {
        width: 64px;
        height: 64px;
    }
}
/* /Pages/GameInfo.razor.rz.scp.css */
.game-info[b-n2abe61yzi] {
    padding: 12px 4px;
}

.game-progress-section[b-n2abe61yzi] {
    background: rgba(0, 0, 0, 0.5);
    border-radius: 5px;
    padding: 12px;
    margin-bottom: 10px;
    text-shadow: 2px 2px 5px black;
}

.progress-label[b-n2abe61yzi] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
    font-size: 14px;
}

.progress-percentage[b-n2abe61yzi] {
    color: #ffd700;
    font-weight: bold;
}

.progress-bar-container[b-n2abe61yzi] {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 2px;
    height: 3px;
    overflow: visible;
    position: relative;
}

.progress-bar-fill[b-n2abe61yzi] {
    background: #00bfff;
    height: 100%;
    border-radius: 2px;
    transition: width 0.3s ease;
    box-shadow: 0 0 6px 1px #00bfff, 0 0 14px 3px rgba(0, 191, 255, 0.4);
    position: relative;
}

.progress-bar-fill[b-n2abe61yzi]::after {
    content: '';
    position: absolute;
    right: -1px;
    top: 50%;
    transform: translateY(-50%);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #00bfff;
    box-shadow: 0 0 8px 3px #00bfff, 0 0 20px 6px rgba(0, 191, 255, 0.5);
}

.progress-dates[b-n2abe61yzi] {
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
    font-size: 12px;
    color: #888;
}

/* The tiles of one page, on phones one column of them and no double gutter */
.game-info-columns[b-n2abe61yzi] {
    margin-top: 16px;
}

.game-info-rows[b-n2abe61yzi] {
    padding: 4px;
}

.info-row[b-n2abe61yzi] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    text-shadow: 2px 2px 5px black;
}

.info-row:last-child[b-n2abe61yzi] {
    border-bottom: none;
}

.info-label[b-n2abe61yzi] {
    color: lightgray;
    font-size: 13px;
}

.info-value[b-n2abe61yzi] {
    min-width: 0;
    color: white;
    font-size: 13px;
    text-align: right;
    overflow-wrap: anywhere;
}

.info-value.highlight[b-n2abe61yzi] {
    color: #ffd700;
    font-weight: bold;
}

.info-value.dimmed[b-n2abe61yzi] {
    color: #888;
    font-size: 12px;
    font-family: monospace;
}

.no-data[b-n2abe61yzi] {
    text-align: center;
    padding: 40px;
    color: #888;
    font-style: italic;
}

@media (min-width: 768px) {
    .game-info[b-n2abe61yzi] {
        padding: 1rem;
    }

    .game-progress-section[b-n2abe61yzi] {
        padding: 15px;
    }

    .game-info-columns[b-n2abe61yzi] {
        margin-top: 1.5rem;
    }

    .game-info-rows[b-n2abe61yzi] {
        padding: 1rem;
    }
}
/* /Pages/Government.razor.rz.scp.css */
/* Mobile-first: base rules are for phones, the block at the end restores the two-column layout and the table from 768px */
.government-satisfaction-row[b-487fkeusy8] {
    margin-bottom: 15px;
}

.government-satisfaction-content[b-487fkeusy8] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px 0;
    text-align: center;
}

.government-satisfaction-content[b-487fkeusy8]  .action-container {
    margin: 0;
}

.current-government[b-487fkeusy8] {
    margin-bottom: 20px;
}

.current-government h2[b-487fkeusy8],
.available-governments h2[b-487fkeusy8],
.production-overview h2[b-487fkeusy8] {
    color: #fff;
    font-size: 1rem;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.government-tab-content[b-487fkeusy8] {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.revolution-section[b-487fkeusy8] {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.revolution-cooldown-info[b-487fkeusy8] {
    font-size: 0.85rem;
    text-align: center;
}

.revolution-cooldown-info .cooldown-text.on-cooldown[b-487fkeusy8] {
    color: #ff9800;
}

.revolution-cooldown-info .cooldown-text.current-system[b-487fkeusy8] {
    color: #888;
}

.government-card[b-487fkeusy8] {
    background: rgba(20, 20, 40, 0.8);
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 10px;
    padding: 12px 10px;
    transition: all 0.3s ease;
}

.government-card.current[b-487fkeusy8] {
    border-color: rgba(255, 215, 0, 0.8);
    box-shadow: 0 0 30px rgba(255, 215, 0, 0.4);
    background: rgba(30, 30, 50, 0.9);
}

.government-card h3[b-487fkeusy8] {
    color: #ffd700;
    font-size: 1.3rem;
    margin-bottom: 8px;
    text-align: center;
}

/* One list on phones, two columns from 768px */
.government-bonuses-grid[b-487fkeusy8] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.bonuses-columns[b-487fkeusy8] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.bonuses-column[b-487fkeusy8] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.bonuses-header[b-487fkeusy8] {
    display: flex;
    padding: 4px 8px 6px;
    border-bottom: 1px solid rgba(255, 215, 0, 0.3);
    gap: 8px;
}

/* The second column continues the list of the first one */
.bonuses-column + .bonuses-column .bonuses-header[b-487fkeusy8] {
    display: none;
}

.bonuses-header .header-stat[b-487fkeusy8] {
    flex: 1;
    color: #ffd700;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.bonuses-header .header-gov[b-487fkeusy8] {
    min-width: 55px;
    text-align: right;
    color: #aaa;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.bonuses-header .header-total[b-487fkeusy8] {
    min-width: 55px;
    text-align: right;
    color: #ffd700;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: bold;
}

.bonus-row[b-487fkeusy8] {
    display: flex;
    align-items: center;
    padding: 6px 8px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 5px;
    gap: 8px;
}

.bonus-row .bonus-stat[b-487fkeusy8] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.bonus-row .bonus-icon[b-487fkeusy8] {
    font-size: 1.1rem;
    min-width: 22px;
}

.bonus-row .bonus-label[b-487fkeusy8] {
    color: #ccc;
    font-size: 0.85rem;
}

.bonus-row .bonus-gov[b-487fkeusy8] {
    min-width: 55px;
    text-align: right;
    font-size: 0.85rem;
    color: #888;
}

.bonus-row .bonus-total[b-487fkeusy8] {
    min-width: 55px;
    text-align: right;
    font-weight: bold;
    font-size: 0.95rem;
}

.bonus-row .bonus-gov.bonus-positive[b-487fkeusy8] {
    color: #6b9b6e;
}

.bonus-row .bonus-gov.bonus-neutral[b-487fkeusy8] {
    color: #b08030;
}

.bonus-row .bonus-gov.bonus-negative[b-487fkeusy8] {
    color: #b05050;
}

.bonus-row .bonus-total.bonus-positive[b-487fkeusy8] {
    color: #4caf50;
    text-shadow: 0 0 8px rgba(76, 175, 80, 0.5);
}

.bonus-row .bonus-total.bonus-neutral[b-487fkeusy8] {
    color: #ff9800;
    text-shadow: 0 0 8px rgba(255, 152, 0, 0.5);
}

.bonus-row .bonus-total.bonus-negative[b-487fkeusy8] {
    color: #f44336;
    text-shadow: 0 0 8px rgba(244, 67, 54, 0.5);
}

.bonus-item[b-487fkeusy8] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 5px;
    border-left: 3px solid #555;
}

.bonus-item.bonus-positive .bonus-value[b-487fkeusy8] {
    color: #4caf50;
}

.bonus-item.bonus-neutral .bonus-value[b-487fkeusy8] {
    color: #888;
}

.bonus-item.bonus-negative .bonus-value[b-487fkeusy8] {
    color: #f44336;
}

.bonus-icon[b-487fkeusy8] {
    font-size: 1.2rem;
    min-width: 25px;
}

.bonus-label[b-487fkeusy8] {
    color: #aaa;
    font-size: 0.9rem;
    flex: 1;
}

.bonus-value[b-487fkeusy8] {
    font-weight: bold;
    font-size: 0.95rem;
}

/* Production overview: on phones every row of the table is a two-line record - the commodity with the difference
   and below them the production and consumption with labels */
.production-table[b-487fkeusy8] {
    display: block;
    width: 100%;
    border-collapse: collapse;
    background: rgba(20, 20, 40, 0.8);
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 10px;
    overflow: hidden;
}

.production-table thead[b-487fkeusy8] {
    display: none;
}

.production-table tbody[b-487fkeusy8] {
    display: block;
}

.production-table tbody tr[b-487fkeusy8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px 12px;
    padding: 8px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    transition: background 0.15s ease;
}

.production-table tbody tr:last-child[b-487fkeusy8] {
    border-bottom: none;
}

.production-table td[b-487fkeusy8] {
    display: block;
    padding: 0;
    color: #ccc;
    font-size: 0.9rem;
}

.prod-num[b-487fkeusy8] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 500;
}

.production-table td.prod-difference[b-487fkeusy8] {
    grid-column: 2;
    grid-row: 1;
}

.production-table td.prod-amount[b-487fkeusy8] {
    font-size: 0.8125rem;
}

.production-table td.prod-commodity + .prod-amount[b-487fkeusy8] {
    text-align: left;
}

.prod-amount[b-487fkeusy8]::before {
    content: attr(data-label) ' ';
    color: #888;
    font-size: 0.75rem;
    font-weight: 400;
}

.production-table td.prod-positive[b-487fkeusy8] {
    color: #4caf50;
    font-weight: 700;
    text-shadow: 0 0 6px rgba(76, 175, 80, 0.4);
}

.production-table td.prod-negative[b-487fkeusy8] {
    color: #f44336;
    font-weight: 700;
    text-shadow: 0 0 6px rgba(244, 67, 54, 0.4);
}

@media (hover: hover) {
    .government-card:hover[b-487fkeusy8] {
        border-color: rgba(100, 150, 255, 0.6);
        box-shadow: 0 0 20px rgba(100, 150, 255, 0.3);
        transform: translateY(-2px);
    }

    .production-table tbody tr:hover[b-487fkeusy8] {
        background: rgba(100, 150, 255, 0.08);
    }
}

/* Tablets and PC: two columns of bonuses and a regular table */
@media (min-width: 768px) {
    .government-satisfaction-content[b-487fkeusy8] {
        gap: 20px;
        padding: 16px 20px;
        min-height: 122px;
    }

    .government-section[b-487fkeusy8] {
        padding: 20px;
    }

    .current-government[b-487fkeusy8] {
        margin-bottom: 40px;
    }

    .current-government h2[b-487fkeusy8],
    .available-governments h2[b-487fkeusy8],
    .production-overview h2[b-487fkeusy8] {
        font-size: 1.5rem;
        margin-bottom: 20px;
    }

    .revolution-section[b-487fkeusy8] {
        margin-top: 15px;
        margin-left: auto;
        max-width: 400px;
    }

    .revolution-action[b-487fkeusy8] {
        display: flex;
        justify-content: flex-end;
    }

    .revolution-cooldown-info[b-487fkeusy8] {
        min-height: 1.5em;
        text-align: right;
    }

    .government-card[b-487fkeusy8] {
        padding: 20px;
    }

    .government-card h3[b-487fkeusy8] {
        margin-bottom: 15px;
    }

    .government-bonuses-grid[b-487fkeusy8] {
        flex-direction: row;
        gap: 15px;
        margin-bottom: 15px;
    }

    .government-bonuses-table[b-487fkeusy8] {
        margin-bottom: 15px;
    }

    .bonuses-columns[b-487fkeusy8] {
        flex-direction: row;
        gap: 30px;
    }

    .bonuses-column[b-487fkeusy8] {
        gap: 8px;
    }

    .bonuses-header[b-487fkeusy8] {
        padding: 8px 12px;
        margin-bottom: 8px;
        gap: 10px;
    }

    .bonuses-column + .bonuses-column .bonuses-header[b-487fkeusy8] {
        display: flex;
    }

    .bonus-row[b-487fkeusy8] {
        padding: 8px 12px;
        gap: 10px;
    }

    .bonus-item[b-487fkeusy8] {
        gap: 10px;
        padding: 8px 12px;
    }

    .production-overview[b-487fkeusy8] {
        margin-top: 30px;
    }

    .production-table[b-487fkeusy8] {
        display: table;
    }

    .production-table thead[b-487fkeusy8] {
        display: table-header-group;
    }

    .production-table thead tr[b-487fkeusy8] {
        background: rgba(100, 150, 255, 0.1);
        border-bottom: 2px solid rgba(100, 150, 255, 0.3);
    }

    .production-table th[b-487fkeusy8] {
        padding: 12px 16px;
        color: #ffd700;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.8px;
        text-align: left;
        font-weight: 600;
    }

    .production-table th:not(:first-child)[b-487fkeusy8] {
        text-align: right;
    }

    .production-table tbody[b-487fkeusy8] {
        display: table-row-group;
    }

    .production-table tbody tr[b-487fkeusy8] {
        display: table-row;
    }

    .production-table td[b-487fkeusy8] {
        display: table-cell;
        padding: 11px 16px;
    }

    .production-table td.prod-amount[b-487fkeusy8] {
        font-size: 0.9rem;
    }

    .production-table td.prod-commodity + .prod-amount[b-487fkeusy8] {
        text-align: right;
    }

    .prod-amount[b-487fkeusy8]::before {
        content: none;
    }
}
/* /Pages/History.razor.rz.scp.css */
.history-page[b-qfq1ohxi3q] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.loading-container[b-qfq1ohxi3q],
.no-events[b-qfq1ohxi3q] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: #aaa;
}

.events-list[b-qfq1ohxi3q] {
    flex: 1;
    padding: 8px 0;
}

.load-more-container[b-qfq1ohxi3q] {
    display: flex;
    justify-content: center;
    padding: 8px 0 12px;
}

@media (min-width: 768px) {
    .events-list[b-qfq1ohxi3q] {
        padding: 10px 0;
    }

    .load-more-container[b-qfq1ohxi3q] {
        padding: 20px 0;
    }
}
/* /Pages/Login.razor.rz.scp.css */
.main[b-ab6te1wtqp] {
    height: 100vh;
    width: 100vw;
}

.input-border[b-ab6te1wtqp] {
    padding: 5px;
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 10px;
    margin-bottom: 12px;
}

.login-btn[b-ab6te1wtqp] {
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 10px;
    color: white;
    font-size: 18px;
    padding: 10px;
    border-width: 2px;
    border-color: gray;
    border-style: solid;
}

.register-btn[b-ab6te1wtqp] {
    background-color: rgba(40, 40, 40, 0.7);
    border-radius: 10px;
    color: white;
    font-size: 18px;
    padding: 10px;
    border-width: 2px;
    border-color: gray;
    border-style: solid;
}

.text[b-ab6te1wtqp] {
    color: white;
    font-size: 18px;
}

.form-container[b-ab6te1wtqp] {
    max-width: 340px;
    background-color: rgba(0, 0, 0, 0.7);
    padding: 30px 40px;
    border-radius: 14px;
}

.margin-top[b-ab6te1wtqp] {
    margin-top: 35px;
}

.label[b-ab6te1wtqp]{
    color:white;
}

/* No active game layout */
.no-game-container[b-ab6te1wtqp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    margin-top: 10px;
}

.game-status-card[b-ab6te1wtqp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 28px 48px;
    background: rgb(10, 10, 30);
    border: solid white 1px;
    border-radius: 12px;
    text-align: center;
    width: min(320px, 100%);
    box-sizing: border-box;
    box-shadow: 0 0 .2rem #fff, 0 0 .2rem #fff, 0 0 2rem #3347ff, 0 0 0.6rem #3347ff, inset 0 0 0.5rem #3347ff;
}

.status-icon[b-ab6te1wtqp] {
    font-size: 2.8rem;
    line-height: 1;
    margin-bottom: 4px;
    filter: drop-shadow(0 0 8px rgba(255, 200, 50, 0.6));
}

.status-title[b-ab6te1wtqp] {
    color: #ffd700;
    font-family: Consolas, monospace;
    font-size: 1.6rem;
    font-weight: 800;
    margin: 0;
    text-shadow: 2px 2px 5px black, 0 0 12px rgba(255, 200, 0, 0.3);
    letter-spacing: 1px;
}

.status-subtitle[b-ab6te1wtqp] {
    color: #b0b0b0;
    font-size: 0.95rem;
    margin: 0;
    text-shadow: 1px 1px 3px black;
    font-style: italic;
}

.next-game-card[b-ab6te1wtqp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 20px 48px;
    background: rgb(10, 10, 30);
    border: solid white 1px;
    border-radius: 10px;
    width: min(320px, 100%);
    box-sizing: border-box;
    text-align: center;
    box-shadow: 0 0 .2rem #fff, 0 0 .2rem #fff, 0 0 2rem #3347ff, 0 0 0.6rem #3347ff, inset 0 0 0.5rem #3347ff;
}

.next-game-unknown[b-ab6te1wtqp] {
    background: rgb(10, 10, 30);
    box-shadow: 0 0 .2rem #fff, 0 0 .2rem #fff, 0 0 2rem #3347ff, 0 0 0.6rem #3347ff, inset 0 0 0.5rem #3347ff;
}

.next-game-label[b-ab6te1wtqp] {
    color: lightseagreen;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    text-shadow: 1px 1px 3px black;
}

.next-game-date[b-ab6te1wtqp] {
    color: white;
    font-size: 1.5rem;
    font-weight: 700;
    font-family: Consolas, monospace;
    text-shadow: 2px 2px 5px black;
}

.next-game-time[b-ab6te1wtqp] {
    color: #ffd700;
    font-size: 2rem;
    font-weight: 800;
    font-family: Consolas, monospace;
    text-shadow: 2px 2px 5px black, 0 0 10px rgba(255, 200, 0, 0.2);
    line-height: 1;
}

.leaderboard-btn[b-ab6te1wtqp] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb(10, 10, 30);
    border: solid white 1px;
    border-radius: 10px;
    color: white;
    font-size: 15px;
    padding: 12px 28px;
    cursor: pointer;
    transition: all 0.25s;
    text-shadow: 1px 1px 3px black;
    letter-spacing: 0.5px;
    width: min(320px, 100%);
    box-sizing: border-box;
    box-shadow: 0 0 .2rem #fff, 0 0 .2rem #fff, 0 0 2rem #3347ff, 0 0 0.6rem #3347ff, inset 0 0 0.5rem #3347ff;
}

.leaderboard-btn:hover[b-ab6te1wtqp] {
    box-shadow: 0 0 .4rem #fff, 0 0 .4rem #fff, 0 0 3rem #3347ff, 0 0 1rem #3347ff, inset 0 0 1rem #3347ff;
}
/* /Pages/Manual.razor.rz.scp.css */
/* Manual.razor.css — Layout and content styles for the manual page */
/* Section chrome (header, border, toggle) lives in CollapsibleSection.razor.css */
/* Phones first, wider grids from 576px */

.manual-page[b-hnpc6km2bc] {
    max-width: 1000px;
    margin: 0 auto;
    padding: 8px 4px 2rem;
}

/* ── Page header ─────────────────────────────────────────────────── */

.manual-header[b-hnpc6km2bc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    text-align: center;
    padding: 0.5rem 0.5rem 1.25rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid rgba(100, 150, 255, 0.2);
}

.manual-logo[b-hnpc6km2bc] {
    width: 100px;
    flex-shrink: 0;
    opacity: 0.9;
}

/* A flex item would grow with the longest result in the search dropdown */
.manual-header-text[b-hnpc6km2bc] {
    width: 100%;
    min-width: 0;
}

.manual-header-text h1[b-hnpc6km2bc] {
    font-size: 1.7rem;
    margin: 0 0 0.4rem 0;
    letter-spacing: 0.03em;
}

.manual-header-text p[b-hnpc6km2bc] {
    color: rgba(255, 255, 255, 0.75);
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.55;
}

/* ── Section content text helpers ────────────────────────────────── */

.manual-text h3[b-hnpc6km2bc] {
    font-size: 0.8rem;
    font-weight: 700;
    color: rgba(130, 195, 255, 0.9);
    margin: 1.1rem 0 0.35rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
}

.manual-text h3:first-child[b-hnpc6km2bc] {
    margin-top: 0;
}

.manual-text p[b-hnpc6km2bc] {
    font-size: 0.86rem;
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.6;
    margin: 0 0 0.7rem;
}

.manual-text p em[b-hnpc6km2bc] {
    color: rgba(255, 255, 255, 0.55);
    font-style: italic;
}

.section-image[b-hnpc6km2bc] {
    display: block;
    width: 90px;
    margin: 0 auto 0.75rem;
    border-radius: 4px;
    opacity: 0.8;
}

/* ── Tables ──────────────────────────────────────────────────────── */

.manual-table[b-hnpc6km2bc] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
    margin-bottom: 0.9rem;
}

.manual-table th[b-hnpc6km2bc] {
    background: rgba(100, 150, 255, 0.1);
    color: rgba(140, 200, 255, 0.95);
    padding: 0.45rem 0.7rem;
    text-align: left;
    font-weight: 600;
    border-bottom: 1px solid rgba(100, 150, 255, 0.25);
    white-space: nowrap;
}

.manual-table td[b-hnpc6km2bc] {
    padding: 0.4rem 0.7rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    color: rgba(255, 255, 255, 0.82);
    vertical-align: middle;
}

.manual-table tr:last-child td[b-hnpc6km2bc] {
    border-bottom: none;
}

.gov-table td:first-child[b-hnpc6km2bc] {
    font-weight: 600;
    white-space: nowrap;
}

/* ── Stats grid ──────────────────────────────────────────────────── */

.stats-grid[b-hnpc6km2bc] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.65rem;
}

.stat-card[b-hnpc6km2bc] {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 6px;
    padding: 0.7rem 0.85rem;
}

.stat-header[b-hnpc6km2bc] {
    font-size: 0.83rem;
    font-weight: 700;
    color: rgba(140, 200, 255, 0.95);
    margin-bottom: 0.3rem;
}

.stat-body[b-hnpc6km2bc] {
    font-size: 0.79rem;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.5;
}

/* ── Buildings grid ──────────────────────────────────────────────── */

.buildings-grid[b-hnpc6km2bc] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.65rem;
    margin-bottom: 0.9rem;
}

.building-card[b-hnpc6km2bc] {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    align-items: stretch;
}

.building-card img[b-hnpc6km2bc] {
    width: 76px;
    height: 76px;
    object-fit: cover;
    flex-shrink: 0;
}

.building-info[b-hnpc6km2bc] {
    padding: 0.5rem 0.7rem;
    flex: 1;
}

.building-name[b-hnpc6km2bc] {
    font-size: 0.83rem;
    font-weight: 700;
    color: rgba(140, 200, 255, 0.95);
    margin-bottom: 0.2rem;
}

.building-stat[b-hnpc6km2bc] {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 0.2rem;
}

.building-desc[b-hnpc6km2bc] {
    font-size: 0.77rem;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.4;
}

/* ── Attack cards ────────────────────────────────────────────────── */

.attack-grid[b-hnpc6km2bc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
    margin-bottom: 0.9rem;
}

.attack-card[b-hnpc6km2bc] {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 6px;
    overflow: hidden;
    text-align: center;
}

.attack-card img.attack-image[b-hnpc6km2bc] {
    width: 100%;
    height: 90px;
    object-fit: cover;
}

.attack-icon-block[b-hnpc6km2bc] {
    font-size: 2.2rem;
    padding: 0.8rem 0 0.2rem;
}

.attack-name[b-hnpc6km2bc] {
    font-size: 0.83rem;
    font-weight: 700;
    color: rgba(140, 200, 255, 0.95);
    padding: 0.25rem 0.6rem;
}

.attack-desc[b-hnpc6km2bc] {
    font-size: 0.77rem;
    color: rgba(255, 255, 255, 0.78);
    padding: 0.2rem 0.6rem 0.7rem;
    line-height: 1.45;
}

/* ── Formula box ─────────────────────────────────────────────────── */

.formula-box[b-hnpc6km2bc] {
    background: rgba(60, 100, 200, 0.1);
    border: 1px solid rgba(80, 130, 255, 0.25);
    border-radius: 6px;
    padding: 0.7rem 1rem;
    font-family: 'Courier New', monospace;
    font-size: 0.81rem;
    color: rgba(170, 210, 255, 0.92);
    margin: 0.4rem 0 0.75rem;
    line-height: 1.65;
}

.formula-box ul[b-hnpc6km2bc] {
    margin: 0.45rem 0 0;
    padding-left: 1.4rem;
}

.formula-box li[b-hnpc6km2bc] {
    font-family: inherit;
    font-size: 0.81rem;
    color: rgba(170, 210, 255, 0.9);
    line-height: 1.55;
}

.formula-box em[b-hnpc6km2bc] {
    color: rgba(170, 210, 255, 0.65);
    font-style: italic;
}

/* ── Info box ────────────────────────────────────────────────────── */

.info-box[b-hnpc6km2bc] {
    background: rgba(255, 195, 40, 0.06);
    border-left: 3px solid rgba(255, 195, 40, 0.5);
    padding: 0.55rem 0.9rem;
    font-size: 0.81rem;
    color: rgba(255, 255, 255, 0.84);
    margin: 0.65rem 0;
    border-radius: 0 4px 4px 0;
    line-height: 1.55;
}

/* ── Unit icons in tables ────────────────────────────────────────── */

.unit-icon[b-hnpc6km2bc] {
    width: 30px;
    height: 30px;
    object-fit: cover;
    border-radius: 3px;
    vertical-align: middle;
    margin-right: 0.35rem;
}

/* ── Operations grid ─────────────────────────────────────────────── */

.operations-grid[b-hnpc6km2bc] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.6rem;
    margin-bottom: 0.75rem;
}

.operation-card[b-hnpc6km2bc] {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 6px;
    overflow: hidden;
    text-align: center;
}

.operation-card img[b-hnpc6km2bc] {
    width: 100%;
    height: 70px;
    object-fit: cover;
}

.op-name[b-hnpc6km2bc] {
    font-size: 0.8rem;
    font-weight: 700;
    color: rgba(140, 200, 255, 0.95);
    padding: 0.3rem 0.4rem 0.1rem;
    line-height: 1.3;
}

.op-desc[b-hnpc6km2bc] {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.65);
    padding: 0 0.4rem 0.5rem;
    line-height: 1.3;
}

/* ── Scoring two-column layout ───────────────────────────────────── */

.scoring-two-col[b-hnpc6km2bc] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    margin-bottom: 0.75rem;
}

/* ── CollapsibleSection overrides — subtle styling inside ContentTile ─── */

.manual-page[b-hnpc6km2bc]  .collapsible-section {
    border: 1px solid rgba(100, 150, 255, 0.15);
    background-color: rgba(255, 255, 255, 0.02);
    backdrop-filter: none;
    margin: 0 0 6px 0;
}

.manual-page[b-hnpc6km2bc]  .collapsible-section.is-open {
    border-color: rgba(100, 150, 255, 0.25);
}

.manual-page[b-hnpc6km2bc]  .collapsible-header {
    background: rgba(0, 0, 0, 0.2);
    padding: 0.45rem 0.85rem;
}

.manual-page[b-hnpc6km2bc]  .collapsible-section.is-open .collapsible-header {
    border-bottom: 1px solid rgba(100, 150, 255, 0.15);
}

/* ── Manual search (inline in header) ────────────────────────────── */

.manual-anchor[b-hnpc6km2bc] {
    display: block;
    height: 0;
    pointer-events: none;
    position: relative;
    top: -80px;
}

.manual-search-wrap[b-hnpc6km2bc] {
    position: relative;
    margin-top: 0.75rem;
    text-align: left;
}

.manual-search-bar[b-hnpc6km2bc] {
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(100, 150, 255, 0.25);
    border-radius: 6px;
    padding: 0 0.55rem;
    transition: border-color 0.15s, background 0.15s;
}

.manual-search-bar:focus-within[b-hnpc6km2bc] {
    border-color: rgba(100, 150, 255, 0.55);
    background: rgba(255, 255, 255, 0.09);
}

.manual-search-icon[b-hnpc6km2bc] {
    font-size: 0.8rem;
    opacity: 0.5;
    flex-shrink: 0;
    margin-right: 0.35rem;
}

.manual-search-input[b-hnpc6km2bc] {
    flex: 1;
    min-width: 0;
    min-height: var(--pow-touch-target);
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.83rem;
    padding: 0;
    outline: none;
}

/* The page has its own clear button */
.manual-search-input[b-hnpc6km2bc]::-webkit-search-cancel-button {
    display: none;
}

.manual-search-input[b-hnpc6km2bc]::placeholder {
    color: rgba(255, 255, 255, 0.28);
}

.manual-search-clear[b-hnpc6km2bc] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--pow-touch-target);
    height: var(--pow-touch-target);
    margin-right: -0.55rem;
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    font-size: 0.75rem;
    padding: 0;
    line-height: 1;
    flex-shrink: 0;
}

.manual-search-dropdown[b-hnpc6km2bc] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: rgba(8, 12, 28, 0.98);
    border: 1px solid rgba(100, 150, 255, 0.3);
    border-radius: 7px;
    box-shadow: 0 6px 28px rgba(0, 0, 0, 0.7);
    z-index: 500;
    max-height: 340px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(100, 150, 255, 0.3) transparent;
}

.search-no-results[b-hnpc6km2bc] {
    padding: 0.9rem 1rem;
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.38);
    text-align: center;
}

.search-result-item[b-hnpc6km2bc] {
    padding: 0.55rem 0.85rem;
    cursor: pointer;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    transition: background 0.1s;
}

.search-result-item:last-child[b-hnpc6km2bc] {
    border-bottom: none;
}

.search-result-section[b-hnpc6km2bc] {
    font-size: 0.75rem;
    font-weight: 700;
    color: rgba(100, 170, 255, 0.75);
    text-transform: uppercase;
    letter-spacing: 0.07em;
    margin-bottom: 0.18rem;
}

.search-result-preview[b-hnpc6km2bc] {
    font-size: 0.79rem;
    color: rgba(255, 255, 255, 0.72);
    line-height: 1.45;
}

.search-result-preview[b-hnpc6km2bc]  mark {
    background: rgba(255, 215, 50, 0.22);
    color: rgba(255, 230, 120, 0.95);
    border-radius: 2px;
    padding: 0 2px;
}

.manual-text code[b-hnpc6km2bc] {
    font-size: max(12px, 0.875em);
}

@media (hover: hover) {
    .manual-table tr:hover td[b-hnpc6km2bc] {
        background: rgba(255, 255, 255, 0.03);
    }

    .manual-page[b-hnpc6km2bc]  .collapsible-section:hover {
        border-color: rgba(100, 150, 255, 0.3);
    }

    .manual-page[b-hnpc6km2bc]  .collapsible-header:hover {
        background: rgba(100, 150, 255, 0.08);
    }

    .manual-search-clear:hover[b-hnpc6km2bc] {
        color: rgba(255, 255, 255, 0.7);
    }

    .search-result-item:hover[b-hnpc6km2bc] {
        background: rgba(100, 150, 255, 0.1);
    }
}

/* ── Wider screens ───────────────────────────────────────────────── */

@media (min-width: 576px) {
    .manual-page[b-hnpc6km2bc] {
        padding: 1rem 1rem 3rem;
    }

    .manual-header[b-hnpc6km2bc] {
        flex-direction: row;
        gap: 1.5rem;
        text-align: left;
        padding-top: 1rem;
    }

    .manual-logo[b-hnpc6km2bc] {
        width: 130px;
    }

    .manual-header-text[b-hnpc6km2bc] {
        flex: 1;
        width: auto;
    }

    .section-image[b-hnpc6km2bc] {
        float: right;
        width: 110px;
        margin: 0 0 0.75rem 1rem;
    }

    .stats-grid[b-hnpc6km2bc] {
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    }

    .buildings-grid[b-hnpc6km2bc] {
        grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
    }

    .attack-grid[b-hnpc6km2bc] {
        grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    }

    .operations-grid[b-hnpc6km2bc] {
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    }

    .scoring-two-col[b-hnpc6km2bc] {
        grid-template-columns: 1fr 1fr;
    }

    .manual-search-wrap[b-hnpc6km2bc] {
        max-width: 420px;
    }
}
/* /Pages/Map.razor.rz.scp.css */
.map-loader[b-w0z56inxzw] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    width: 100%;
}

.map-load-error[b-w0z56inxzw] {
    margin: 0;
    padding: 24px 16px;
    color: lightgray;
    text-align: center;
}

.loader-dots[b-w0z56inxzw] {
    display: flex;
    gap: 8px;
}

.loader-dots .dot[b-w0z56inxzw] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: linear-gradient(135deg, #3B8686, #79BD9A);
    animation: wave-b-w0z56inxzw 1.4s ease-in-out infinite;
}

.loader-dots .dot:nth-child(1)[b-w0z56inxzw] { animation-delay: 0s; }
.loader-dots .dot:nth-child(2)[b-w0z56inxzw] { animation-delay: 0.1s; }
.loader-dots .dot:nth-child(3)[b-w0z56inxzw] { animation-delay: 0.2s; }
.loader-dots .dot:nth-child(4)[b-w0z56inxzw] { animation-delay: 0.3s; }
.loader-dots .dot:nth-child(5)[b-w0z56inxzw] { animation-delay: 0.4s; }

@keyframes wave-b-w0z56inxzw {
    0%, 60%, 100% {
        transform: translateY(0);
        opacity: 0.4;
    }
    30% {
        transform: translateY(-18px);
        opacity: 1;
    }
}
/* /Pages/Messages.razor.rz.scp.css */
/* Mobile-first: on phones one panel at a time - the list, or the chat once a conversation is open. From 768px both
   side by side. The other panel is hidden by visibility, not display: none: the planets share gradient ids and from
   a display: none list they would stop painting the planet in the header of the chat. */
.messages-layout[b-hbc2ttlelf] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
    min-height: 0;
}

.conversations-panel[b-hbc2ttlelf],
.chat-panel[b-hbc2ttlelf] {
    grid-area: 1 / 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.chat-panel[b-hbc2ttlelf],
.messages-layout--chat-open .conversations-panel[b-hbc2ttlelf] {
    visibility: hidden;
}

.messages-layout--chat-open .chat-panel[b-hbc2ttlelf] {
    visibility: visible;
}

/* The tiles fill their panels, a phone has the navigation right below them. Transitions name their properties here:
   "all" would animate the visibility too and the hidden panel would shine through the other one for a moment. */
.messages-layout[b-hbc2ttlelf]  .main-container {
    flex: 1;
    min-height: 0;
    margin-bottom: 0;
    transition-property: border-color;
}

/* A header row of a control and a name: the same bar as elsewhere, only as high as the touch target needs */
.messages-layout[b-hbc2ttlelf]  .header-row {
    padding-block: 2px;
}

.messages-layout[b-hbc2ttlelf]  .tile-header {
    flex: 1;
    min-width: 0;
}

.messages-layout[b-hbc2ttlelf]  .header-text {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: var(--pow-touch-target);
}

.messages-layout[b-hbc2ttlelf]  .state-reference {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.new-conversation-btn[b-hbc2ttlelf] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--pow-touch-target);
    height: var(--pow-touch-target);
    margin-left: auto;
    padding: 0;
    background: rgba(0, 0, 0, 0.7);
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 8px;
    color: white;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.chat-back-btn[b-hbc2ttlelf] {
    flex: 0 0 auto;
    width: var(--pow-touch-target);
    height: var(--pow-touch-target);
    margin-left: -8px;
    padding: 0;
    background: transparent;
    border: none;
    color: white;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
}

/* Only the dot on phones, the word would take the room of a long name */
.chat-online[b-hbc2ttlelf] {
    flex: 0 0 auto;
    color: #4caf50;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: normal;
    text-shadow: 0 0 5px #4caf50;
    text-transform: none;
}

.chat-online-label[b-hbc2ttlelf] {
    display: none;
    color: inherit;
    text-shadow: inherit;
}

.no-conversation-selected[b-hbc2ttlelf] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 16px;
    color: rgba(255, 255, 255, 0.4);
    text-align: center;
}

.no-conversation-selected p[b-hbc2ttlelf] {
    margin: 0;
    color: #aaa;
    font-size: 14px;
}

@media (hover: hover) {
    .new-conversation-btn:hover[b-hbc2ttlelf] {
        border-color: rgba(100, 150, 255, 0.8);
        box-shadow: 0 0 12px rgba(100, 150, 255, 0.5);
    }
}

/* Tablets: list and chat side by side, the list narrower so the chat keeps its room */
@media (min-width: 768px) {
    .messages-layout[b-hbc2ttlelf] {
        grid-template-columns: 280px minmax(0, 1fr);
        gap: 15px;
    }

    .messages-layout--chat-open .conversations-panel[b-hbc2ttlelf],
    .chat-panel[b-hbc2ttlelf] {
        visibility: visible;
    }

    .chat-panel[b-hbc2ttlelf] {
        grid-area: 1 / 2;
    }

    .chat-back-btn[b-hbc2ttlelf] {
        display: none;
    }

    .chat-online-label[b-hbc2ttlelf] {
        display: inline;
    }
}

/* PC: no navigation under the tiles */
@media (min-width: 992px) {
    .messages-layout[b-hbc2ttlelf] {
        grid-template-columns: 350px minmax(0, 1fr);
    }

    .messages-layout[b-hbc2ttlelf]  .main-container {
        margin-bottom: 15px;
    }
}
/* /Pages/Overview.razor.rz.scp.css */
/* State name header */
.overview-title-wrapper[b-u3chcc5ub3] {
    padding: 12px;
}

.overview-title[b-u3chcc5ub3] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 4px 12px;
    padding: 5px 15px;
}

.overview-title h1[b-u3chcc5ub3] {
    margin: 0;
}

.overview-position[b-u3chcc5ub3] {
    font-size: 0.9em;
    color: #888;
}

.overview-tile-body[b-u3chcc5ub3] {
    padding: 1rem;
}

/* Phones: the illustration is a cropped strip beside the rows (as tall as they are), the footer spans the tile */
.overview-section[b-u3chcc5ub3] {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    grid-template-areas:
        "illustration properties"
        "footer footer";
    column-gap: 12px;
    padding: 1rem;
}

.overview-illustration[b-u3chcc5ub3] {
    grid-area: illustration;
    position: relative;
    min-height: 72px;
}

.overview-illustration img[b-u3chcc5ub3] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 3px;
    box-shadow: 0 0 5px white;
}

.overview-properties[b-u3chcc5ub3] {
    grid-area: properties;
    min-width: 0;
}

.overview-section-footer[b-u3chcc5ub3] {
    grid-area: footer;
    min-width: 0;
    container-type: inline-size;
}

.overview-property[b-u3chcc5ub3] {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding: 3px 6px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 3px;
    margin-bottom: 3px;
    font-size: 13px;
    text-shadow: 2px 2px 5px black;
}

.overview-property-label[b-u3chcc5ub3] {
    color: lightgray;
}

/* Four indicators in a row only where their labels fit ("Bojeschopnost" is ~80px at 12px), otherwise 2 × 2 */
.overview-indicators[b-u3chcc5ub3] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3px;
    margin-top: 3px;
}

@container (min-width: 344px) {
    .overview-indicators[b-u3chcc5ub3] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.overview-indicator[b-u3chcc5ub3] {
    display: flex;
    justify-content: center;
    padding: 3px 2px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 3px;
}

/* Score - total in the tile header */
.score-tile[b-u3chcc5ub3]  .tile-header {
    flex: 1;
}

.score-tile[b-u3chcc5ub3]  .header-text {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.score-header-total[b-u3chcc5ub3] {
    color: #ffd700;
}

/* Score rows: name | count | score per unit | score */
.score-row[b-u3chcc5ub3] {
    display: grid;
    grid-template-columns: minmax(0, 4fr) minmax(0, 3fr) minmax(0, 2fr) minmax(0, 3fr);
    column-gap: 8px;
    padding: 0.4rem 0.5rem;
    font-size: 13px;
}

.score-row > :not(:first-child)[b-u3chcc5ub3] {
    text-align: right;
}

.score-columns-header[b-u3chcc5ub3] {
    background: rgba(32, 178, 170, 0.3);
    border: 1px solid rgba(32, 178, 170, 0.5);
    border-radius: 4px;
    margin-bottom: 0.5rem;
    padding: 0.75rem 0.5rem;
    font-size: 14px;
    font-weight: 600;
}

.score-item[b-u3chcc5ub3] {
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 3px;
    margin: 2px 0;
}

.score-item-name[b-u3chcc5ub3] {
    color: lightgray;
}

.score-item-per-unit[b-u3chcc5ub3] {
    color: #b0b0b0;
}

.score-item-score[b-u3chcc5ub3] {
    color: #ffd700;
}

/* Phones and tablets: a category is a 44px toggle with its subtotal, items are hidden until expanded */
.score-category-header[b-u3chcc5ub3] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: var(--pow-touch-target);
    margin-top: 0.4rem;
    padding: 0 0.5rem;
    background: rgba(255, 255, 255, 0.05);
    border: none;
    border-radius: 3px;
    color: lightgray;
    font-size: 13px;
    font-weight: 600;
    text-align: left;
}

.score-category-chevron[b-u3chcc5ub3] {
    color: rgba(100, 150, 255, 0.6);
    transition: transform 0.2s ease;
}

.score-category.is-expanded .score-category-chevron[b-u3chcc5ub3] {
    transform: rotate(90deg);
}

.score-category-name[b-u3chcc5ub3] {
    flex: 1;
}

.score-category-subtotal[b-u3chcc5ub3] {
    color: darkgoldenrod;
}

.score-category-items[b-u3chcc5ub3],
.score-subtotal-row[b-u3chcc5ub3] {
    display: none;
}

.score-category.is-expanded .score-category-items[b-u3chcc5ub3] {
    display: block;
}

.score-total-row[b-u3chcc5ub3],
.score-subtotal-row[b-u3chcc5ub3] {
    grid-template-columns: minmax(0, 9fr) minmax(0, 3fr);
    column-gap: 8px;
    text-align: right;
}

.score-total-row[b-u3chcc5ub3] {
    display: grid;
    background: rgba(32, 178, 170, 0.15);
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 3px;
    margin-top: 0.5rem;
    padding: 0.6rem 0.5rem;
    font-size: 15px;
    font-weight: 700;
}

.score-total-value[b-u3chcc5ub3] {
    color: #ffd700;
}

/* From 768px: illustration in its natural ratio in a third of the tile, the footer under the rows */
@media (min-width: 768px) {
    .overview-section[b-u3chcc5ub3] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
        grid-template-areas:
            "illustration properties"
            "illustration footer";
        column-gap: 24px;
        align-items: start;
    }

    .overview-illustration[b-u3chcc5ub3] {
        min-height: 0;
    }

    .overview-illustration img[b-u3chcc5ub3] {
        position: static;
        height: auto;
        object-fit: fill;
        border-radius: 0;
    }
}

/* PC: the full score table - category rows are plain labels, items and subtotals always visible */
@media (min-width: 992px) {
    .score-category-header[b-u3chcc5ub3] {
        min-height: 0;
        margin-bottom: 2px;
        padding: 0.4rem 0.5rem;
        pointer-events: none;
    }

    .score-category-chevron[b-u3chcc5ub3],
    .score-category-subtotal[b-u3chcc5ub3] {
        display: none;
    }

    .score-category-items[b-u3chcc5ub3] {
        display: block;
    }

    .score-subtotal-row[b-u3chcc5ub3] {
        display: grid;
        background-color: rgba(0, 0, 0, 0.3);
        border-radius: 3px;
        padding: 0.3rem 0.5rem;
        font-size: 13px;
    }

    .score-subtotal-label[b-u3chcc5ub3] {
        color: dimgray;
    }

    .score-subtotal-value[b-u3chcc5ub3] {
        color: darkgoldenrod;
        font-weight: 600;
    }
}
/* /Pages/Ranking.razor.rz.scp.css */
/* Phones: search on its own line, under it finding the own entry and the pager */
.ranking-toolbar[b-48ea97410u] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.ranking-search[b-48ea97410u] {
    order: -1;
    flex: 1 0 100%;
}

.ranking-find-button[b-48ea97410u] {
    min-height: var(--pow-touch-target);
    padding: 0 12px;
    background: rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 4px;
    color: white;
    font-size: 13px;
    white-space: nowrap;
    transition: background-color 0.2s, border-color 0.2s;
}

@media (hover: hover) {
    .ranking-find-button:hover[b-48ea97410u] {
        background: rgba(32, 178, 170, 0.5);
        border-color: lightseagreen;
    }
}

/* Tablets and PC: everything in one line above the table */
@media (min-width: 768px) {
    .ranking-toolbar[b-48ea97410u] {
        flex-wrap: nowrap;
        margin-bottom: 1rem;
    }

    .ranking-search[b-48ea97410u] {
        order: 0;
        flex: 0 0 240px;
    }
}
/* /Pages/Registration.razor.rz.scp.css */
.main[b-xt4iu8b9o3] {
    height: 100vh;
    width: 100vw;
}

.btn[b-xt4iu8b9o3] {
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 10px;
    color: white;
    font-size: 18px;
    padding: 10px;
    border-width: 2px;
    border-color: gray;
    margin-top:20px;
}

.form-container[b-xt4iu8b9o3] {
    max-width: 340px;
    background-color: rgba(0, 0, 0, 0.7);
    padding:30px 40px;
    border-radius:14px;
}

.margin-top[b-xt4iu8b9o3] {
    margin-top: 35px;
}

.label[b-xt4iu8b9o3] {
    color: white;
}

.err-label[b-xt4iu8b9o3] {
    color: orangered;
}
/* /Pages/Research.razor.rz.scp.css */
.research-section[b-ex9q3jyzxg] {
    padding: 4px 0 12px;
}

.research-info[b-ex9q3jyzxg] {
    margin-bottom: 16px;
    padding: 12px;
    background: rgba(20, 20, 40, 0.6);
    border-left: 4px solid #667eea;
    border-radius: 5px;
}

.research-info h2[b-ex9q3jyzxg] {
    color: #fff;
    font-size: 1.25rem;
    margin-bottom: 8px;
}

.research-info p[b-ex9q3jyzxg] {
    color: #aaa;
    font-size: 0.875rem;
    margin: 0;
}

.research-info .research-progress[b-ex9q3jyzxg] {
    margin-top: 8px;
}

.research-progress strong[b-ex9q3jyzxg] {
    color: #4caf50;
}

@media (min-width: 768px) {
    .research-section[b-ex9q3jyzxg] {
        padding: 20px;
    }

    .research-info[b-ex9q3jyzxg] {
        margin-bottom: 30px;
        padding: 20px;
    }

    .research-info h2[b-ex9q3jyzxg] {
        font-size: 1.5rem;
        margin-bottom: 10px;
    }

    .research-info p[b-ex9q3jyzxg] {
        font-size: 1rem;
    }
}
/* /Pages/SecretService.razor.rz.scp.css */
/* Phones: the tile uses the whole width, inputs and actions span it. From 768px the original padding and inline inputs. */

.target-selector-section[b-de64biav33] {
    margin-bottom: 12px;
}

.operation-tabs-section[b-de64biav33] {
    margin-bottom: 12px;
}

/* Operation without an illustration yet */
.operation-symbol[b-de64biav33] {
    font-size: 2rem;
    line-height: 1;
    opacity: 0.7;
}

.train-agents-section[b-de64biav33] {
    display: flex;
    flex-direction: column;
    padding: 12px;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
}

.current-agents[b-de64biav33] {
    color: #ffd700;
}

/* Train agents inputs */
.train-inputs-row[b-de64biav33] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.train-input-group[b-de64biav33] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.train-input-label[b-de64biav33] {
    color: #b0b0b0;
    font-size: 0.85rem;
    text-shadow: 2px 2px 5px black;
    white-space: nowrap;
}

.train-cost-info[b-de64biav33] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.train-cost-line[b-de64biav33] {
    color: #b0b0b0;
    font-size: 0.88rem;
}

.train-cost-line strong[b-de64biav33] {
    color: #ffd700;
}

.train-cost-secondary[b-de64biav33] {
    color: #888;
    font-size: 0.78rem;
}

.train-cost-insufficient strong[b-de64biav33] {
    color: #ff6b6b;
}

.train-cost-warning[b-de64biav33] {
    color: #ff6b6b;
    font-size: 0.82rem;
    font-weight: 600;
}

@media (min-width: 768px) {
    .secret-service-page[b-de64biav33] {
        padding: 0 15px;
    }

    .secret-service-content[b-de64biav33] {
        padding: 1rem;
    }

    .target-selector-section[b-de64biav33] {
        margin-bottom: 1rem;
    }

    .operation-tabs-section[b-de64biav33] {
        margin-bottom: 1.5rem;
    }

    .operation-symbol[b-de64biav33] {
        font-size: 4rem;
    }

    .train-agents-section[b-de64biav33] {
        padding: 1rem;
    }

    .train-inputs-row[b-de64biav33] {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 1.5rem;
        margin-bottom: 0.5rem;
    }

    .train-input-group[b-de64biav33] {
        flex-direction: row;
        align-items: center;
        gap: 0.6rem;
    }
}
/* /Pages/Simulator.razor.rz.scp.css */
/* Phones: the tiles use the whole width of the page */
.simulator-page[b-phct767o98],
.simulator-page > .row > [class*="col-"][b-phct767o98] {
    padding-inline: 0;
}

.simulator-page > .row[b-phct767o98] {
    margin-inline: 0;
}

.sim-heading[b-phct767o98] {
    padding: 8px 4px;
}

.sim-heading h2[b-phct767o98] {
    margin: 0;
    font-size: 1.5rem;
}

.sim-heading small[b-phct767o98] {
    color: #aaa;
}

/* Two-column label/input grid used inside each section tile */
.sim-grid[b-phct767o98] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px 12px;
    padding: 10px 4px;
}

.sim-grid label[b-phct767o98] {
    font-size: 13px;
    color: lightgray;
}

.sim-select[b-phct767o98] {
    background: rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 4px;
    color: white;
    width: 168px;
    min-height: var(--pow-touch-target);
    padding: 4px 8px;
    font-size: 13px;
    text-align: left;
    cursor: pointer;
}

.sim-select:focus[b-phct767o98] {
    outline: none;
    border-color: rgba(255, 255, 255, 0.4);
}

.sim-select option[b-phct767o98] {
    background: #222;
}

/* The change per move above the bottom navigation while the inputs are being edited */
.sim-live-summary[b-phct767o98] {
    position: sticky;
    bottom: calc(var(--pow-mobile-bottom-nav-height) + var(--pow-safe-area-bottom) + 8px);
    z-index: 1;
    margin-bottom: 12px;
    padding: 6px 10px;
    background: rgba(10, 10, 10, 0.92);
    border: 2px solid rgba(100, 150, 255, 0.3);
    border-radius: 8px;
    text-shadow: 2px 2px 5px black;
}

.sim-live-summary-title[b-phct767o98] {
    display: block;
    color: #aaa;
    font-size: 12px;
}

.sim-live-summary-values[b-phct767o98] {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

.sim-live-summary-item[b-phct767o98] {
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}

.sim-live-summary-item.positive[b-phct767o98] {
    color: #4caf50;
}

.sim-live-summary-item.negative[b-phct767o98] {
    color: #f44336;
}

/* Results table */
.sim-table[b-phct767o98] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    padding: 6px 10px;
}

.sim-table th[b-phct767o98] {
    color: #aaa;
    font-weight: 500;
    padding: 6px 10px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    text-align: left;
}

.sim-table th:not(:first-child)[b-phct767o98],
.sim-table td.sim-num[b-phct767o98] {
    text-align: right;
}

.sim-table td[b-phct767o98] {
    padding: 5px 10px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

/* Phones: a commodity is a two-line record - its name with the difference and under them the production and consumption */
.sim-commodity-table[b-phct767o98],
.sim-commodity-table tbody[b-phct767o98] {
    display: block;
}

.sim-commodity-table thead[b-phct767o98] {
    display: none;
}

.sim-commodity-table tbody tr[b-phct767o98] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px 12px;
    padding: 8px 4px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.sim-commodity-table td[b-phct767o98] {
    display: block;
    padding: 0;
    border-bottom: none;
}

.sim-commodity-table td.sim-difference[b-phct767o98] {
    grid-column: 2;
    grid-row: 1;
}

.sim-commodity-table td.sim-amount:nth-child(2)[b-phct767o98] {
    text-align: left;
}

.sim-amount[b-phct767o98]::before {
    content: attr(data-label) ' ';
    color: #888;
    font-size: 12px;
}

@media (hover: hover) {
    .sim-table tbody tr:hover[b-phct767o98] {
        background: rgba(255,255,255,0.04);
    }
}

@media (min-width: 768px) {
    .simulator-page[b-phct767o98],
    .simulator-page > .row > [class*="col-"][b-phct767o98] {
        padding-inline: 12px;
    }

    .simulator-page > .row[b-phct767o98] {
        margin-inline: -12px;
    }

    .sim-heading[b-phct767o98] {
        padding: 8px 15px;
    }

    .sim-heading h2[b-phct767o98] {
        font-size: 2rem;
    }

    .sim-grid[b-phct767o98] {
        padding: 10px 14px;
    }

    .sim-select[b-phct767o98] {
        width: 160px;
    }

    .sim-commodity-table[b-phct767o98] {
        display: table;
    }

    .sim-commodity-table thead[b-phct767o98] {
        display: table-header-group;
    }

    .sim-commodity-table tbody[b-phct767o98] {
        display: table-row-group;
    }

    .sim-commodity-table tbody tr[b-phct767o98] {
        display: table-row;
        padding: 0;
    }

    .sim-commodity-table td[b-phct767o98] {
        display: table-cell;
        padding: 5px 10px;
        border-bottom: 1px solid rgba(255,255,255,0.05);
    }

    .sim-commodity-table td.sim-amount:nth-child(2)[b-phct767o98] {
        text-align: right;
    }

    .sim-amount[b-phct767o98]::before {
        content: none;
    }
}

@media (min-width: 768px) and (pointer: fine) {
    .sim-select[b-phct767o98] {
        min-height: 0;
    }
}

/* Sticky results panel on large screens, below the top bar that stays on screen too. The summary is not needed there,
   the results are beside the inputs. */
@media (min-width: 992px) {
    .sim-sticky-results[b-phct767o98] {
        position: sticky;
        top: calc(var(--pow-desktop-top-bar-height) + 12px);
    }

    .sim-live-summary[b-phct767o98] {
        display: none;
    }
}
/* /Pages/StateDetail.razor.rz.scp.css */
/* Phones: the rows and buttons use the whole width of the tile */
.state-detail-page[b-8t4b0j5y7g] {
    padding-inline: 0;
}

.state-detail-content[b-8t4b0j5y7g] {
    padding-block: 8px;
}

.detail-table-container[b-8t4b0j5y7g] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 12px;
}

/* Phones: the label on the left, the value on the right */
.detail-data-row[b-8t4b0j5y7g] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    min-height: var(--pow-touch-target);
    padding-inline: 12px;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 3px;
    transition: background-color 0.2s;
    text-shadow: 2px 2px 5px black;
}

.detail-col-label[b-8t4b0j5y7g] {
    flex-shrink: 0;
    font-weight: 600;
    color: lightgray;
    font-size: 14px;
}

.detail-col-value[b-8t4b0j5y7g] {
    min-width: 0;
    overflow-wrap: anywhere;
    text-align: right;
    color: white;
    font-size: 14px;
}

.detail-score[b-8t4b0j5y7g] {
    color: #ffd700;
    font-weight: 600;
}

.detail-alliance[b-8t4b0j5y7g] {
    color: #87ceeb;
}

/* A short name is still easy to tap */
.detail-alliance a[b-8t4b0j5y7g] {
    display: inline-flex;
    justify-content: flex-end;
    align-items: center;
    min-width: var(--pow-touch-target);
    min-height: var(--pow-touch-target);
    color: inherit;
}

.detail-actions-container[b-8t4b0j5y7g] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.detail-action-btn[b-8t4b0j5y7g] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: var(--pow-touch-target);
    padding: 10px;
    background-color: rgba(0, 0, 0, 0.7);
    border: 2px solid gray;
    border-radius: 10px;
    color: white;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.2s;
    text-shadow: 2px 2px 5px black;
}

.detail-action-btn svg[b-8t4b0j5y7g] {
    flex-shrink: 0;
}

@media (hover: hover) {
    .detail-data-row:hover[b-8t4b0j5y7g] {
        background-color: rgba(0, 0, 0, 0.7);
    }

    .detail-action-btn:hover[b-8t4b0j5y7g] {
        background: rgba(32, 178, 170, 0.5);
        border-color: lightseagreen;
    }
}

@media (min-width: 768px) {
    .state-detail-page[b-8t4b0j5y7g] {
        padding-inline: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
    }

    .state-detail-content[b-8t4b0j5y7g] {
        padding: 1rem;
    }

    .detail-table-container[b-8t4b0j5y7g] {
        margin-bottom: 1.5rem;
    }

    .detail-data-row[b-8t4b0j5y7g] {
        justify-content: flex-start;
        gap: 0;
        padding-inline: 1rem;
    }

    .detail-col-label[b-8t4b0j5y7g] {
        flex: 0 0 200px;
        padding-right: 2rem;
    }

    .detail-col-value[b-8t4b0j5y7g] {
        flex: 1;
        text-align: left;
        font-size: 15px;
    }

    .detail-alliance a[b-8t4b0j5y7g] {
        justify-content: flex-start;
    }

    .detail-actions-container[b-8t4b0j5y7g] {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 1rem;
    }

    .detail-action-btn[b-8t4b0j5y7g] {
        width: auto;
        font-size: 18px;
    }
}
/* /Pages/Trade.razor.rz.scp.css */
/* Mobile-first: on phones a card per goods with the controls under it and offers as cards with labels.
   From 768px rows and a table of offers, the width of the list decides the rest (container queries at the end). */

/* Goods list */
.trade-ill-list[b-eybag35s8q] {
    container-type: inline-size;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Name and values next to the image */
.trade-ill-row[b-eybag35s8q] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

.trade-ill-name[b-eybag35s8q] {
    font-weight: 600;
    color: #ffd700;
    text-shadow: 2px 2px 5px black;
    font-size: 14px;
}

.trade-ill-meta[b-eybag35s8q] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.trade-meta-item[b-eybag35s8q] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.trade-meta-label[b-eybag35s8q] {
    font-size: 12px;
    color: #aaa;
}

.trade-meta-value[b-eybag35s8q] {
    font-size: 13px;
    color: lightgray;
    white-space: nowrap;
}

.trade-meta-value.gold[b-eybag35s8q],
.trade-meta-value.total[b-eybag35s8q] {
    color: #ffd700;
}

.trade-meta-value.total[b-eybag35s8q] {
    font-weight: 600;
}

/* Controls: amount and button in one row */
.trade-ill-controls[b-eybag35s8q] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.trade-ill-controls[b-eybag35s8q]  > .integer-input-container {
    flex: 1 1 auto;
    min-width: 0;
}

.trade-ill-controls[b-eybag35s8q]  > button {
    flex: 0 0 auto;
    width: auto;
    min-width: 116px;
}

/* Selling: amount and price with labels, one under the other, the button across the card */
.trade-ill-controls--sell[b-eybag35s8q] {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
}

.trade-ill-controls--sell[b-eybag35s8q]  > button {
    grid-column: 1 / -1;
    width: 100%;
}

.trade-input-label[b-eybag35s8q] {
    font-size: 12px;
    color: #aaa;
}

/* Offers */
.trade-table-container[b-eybag35s8q] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.trade-header-row[b-eybag35s8q] {
    display: none;
}

.trade-data-row[b-eybag35s8q] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 3px;
    font-size: 14px;
    text-shadow: 2px 2px 5px black;
    transition: background-color 0.2s;
}

.trade-data-row [data-label][b-eybag35s8q] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.trade-data-row [data-label][b-eybag35s8q]::before {
    content: attr(data-label);
    font-size: 13px;
    color: #aaa;
    font-weight: 400;
}

.trade-col-commodity[b-eybag35s8q] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    font-size: 15px;
}

.trade-offer-icon[b-eybag35s8q] {
    font-size: 16px;
}

.trade-col-amount[b-eybag35s8q],
.trade-col-price[b-eybag35s8q],
.trade-col-tax[b-eybag35s8q] {
    color: lightgray;
}

.trade-col-total[b-eybag35s8q] {
    color: #ffd700;
}

.trade-col-profit[b-eybag35s8q] {
    color: #4ade80;
    font-weight: 700;
    text-shadow: 0 0 8px rgba(74, 222, 128, 0.5);
}

.trade-col-action[b-eybag35s8q] {
    margin-top: 4px;
}

.trade-note[b-eybag35s8q] {
    margin-top: 1rem;
    padding: 0.5rem 0.75rem;
    font-size: 12px;
    color: #aaa;
    font-style: italic;
    text-shadow: 2px 2px 5px black;
}

.trade-empty-state[b-eybag35s8q] {
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px dashed rgba(255, 255, 255, 0.3);
    border-radius: 4px;
    padding: 2rem;
    text-align: center;
    color: #888;
    text-shadow: 2px 2px 5px black;
}

@media (hover: hover) {
    .trade-data-row:hover[b-eybag35s8q] {
        background-color: rgba(0, 0, 0, 0.7);
    }
}

/* Tablets and PC: rows with the controls at the end and a table of offers */
@media (min-width: 768px) {
    .trade-ill-list[b-eybag35s8q] {
        gap: 6px;
    }

    .trade-ill-meta[b-eybag35s8q] {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 2px 12px;
    }

    .trade-meta-item[b-eybag35s8q] {
        justify-content: flex-start;
        gap: 4px;
    }

    .trade-ill-controls[b-eybag35s8q] {
        gap: 0.6rem;
    }

    .trade-ill-controls[b-eybag35s8q]  > .integer-input-container {
        flex: 0 0 auto;
    }

    .trade-ill-controls[b-eybag35s8q]  > button,
    .trade-ill-controls--sell[b-eybag35s8q]  > button {
        width: auto;
        min-width: 120px;
    }

    .trade-ill-controls--sell[b-eybag35s8q] {
        display: flex;
    }

    .trade-input-label[b-eybag35s8q] {
        display: none;
    }

    /* Two inputs and the button do not fit beside a narrow list, they go under the name and values */
    .trade-ill-list--sell[b-eybag35s8q]  .illustrated-row {
        flex-wrap: wrap;
    }

    .trade-ill-list--sell[b-eybag35s8q]  .illustrated-row__trailing {
        flex: 1 0 100%;
        justify-content: flex-end;
        padding: 0 12px 8px;
    }

    .trade-table-container[b-eybag35s8q] {
        gap: 2px;
    }

    .trade-header-row[b-eybag35s8q],
    .trade-data-row[b-eybag35s8q] {
        display: grid;
        grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.8fr) minmax(0, 0.9fr) minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1fr) 110px;
        gap: 8px;
        align-items: center;
        padding: 0.4rem 0.5rem;
        font-size: 12px;
    }

    .trade-header-row[b-eybag35s8q] {
        margin-bottom: 0.5rem;
        background: rgba(32, 178, 170, 0.3);
        border: 1px solid rgba(32, 178, 170, 0.5);
        border-radius: 4px;
        font-weight: 600;
        text-shadow: 2px 2px 5px black;
    }

    .trade-data-row [data-label][b-eybag35s8q] {
        display: block;
        text-align: right;
    }

    .trade-data-row [data-label][b-eybag35s8q]::before {
        content: none;
    }

    .trade-header-row .trade-col-amount[b-eybag35s8q],
    .trade-header-row .trade-col-price[b-eybag35s8q],
    .trade-header-row .trade-col-total[b-eybag35s8q],
    .trade-header-row .trade-col-tax[b-eybag35s8q],
    .trade-header-row .trade-col-profit[b-eybag35s8q] {
        text-align: right;
    }

    .trade-header-row .trade-col-action[b-eybag35s8q] {
        text-align: center;
    }

    .trade-col-commodity[b-eybag35s8q] {
        font-size: inherit;
        font-weight: 500;
    }

    .trade-col-action[b-eybag35s8q] {
        margin-top: 0;
    }

    .trade-col-action[b-eybag35s8q]  > button {
        width: 100%;
        min-width: 0;
        padding: 0 8px;
    }
}

@media (min-width: 1200px) {
    .trade-header-row[b-eybag35s8q],
    .trade-data-row[b-eybag35s8q] {
        font-size: 14px;
    }
}

/* A wide list keeps the inputs of selling beside the name and values */
@container (min-width: 800px) {
    .trade-ill-list--sell[b-eybag35s8q]  .illustrated-row {
        flex-wrap: nowrap;
    }

    .trade-ill-list--sell[b-eybag35s8q]  .illustrated-row__trailing {
        flex: 0 0 auto;
        padding: 8px 12px 8px 0;
    }
}

/* A very wide list: everything in one line */
@container (min-width: 1000px) {
    .trade-ill-row[b-eybag35s8q] {
        flex-direction: row;
        align-items: center;
        gap: 1rem;
    }

    .trade-ill-name[b-eybag35s8q] {
        flex: 0 0 160px;
    }

    .trade-ill-controls[b-eybag35s8q]  > button,
    .trade-ill-controls--sell[b-eybag35s8q]  > button {
        min-width: 200px;
    }
}
/* /Pages/WarAttack.razor.rz.scp.css */
/* Army page - phones: tiles under each other; an attack is units (cards with sliders), the strength panels collapsed
   to their totals and the action across the tile. Tablets and narrower PC: units over both panels side by side.
   Wide content (from 1000px of the attack panel): strength | defense | units in three columns. */

.war-attack-page[b-vqn2ezk6qn] {
    padding: 0 10px;
}

/* Preparedness and morale - on phones the button wraps under the circle (−/+ turns do not fit beside it) */
.military-stats-row[b-vqn2ezk6qn] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 10px;
}

.military-stats-row > *[b-vqn2ezk6qn] {
    flex: 1;
}

.military-stat-content[b-vqn2ezk6qn] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px 0;
}

.war-attack-content[b-vqn2ezk6qn] {
    padding: 0;
}

.target-selector-section[b-vqn2ezk6qn] {
    margin-bottom: 12px;
}

/* Attack Tabs Section */
.attack-tabs-section[b-vqn2ezk6qn] {
    min-height: 0;
}

.attack-tabs-section[b-vqn2ezk6qn]  .side-tab-control-container {
    margin-bottom: 0;
}

.attack-panel[b-vqn2ezk6qn] {
    container-type: inline-size;
    text-shadow: 2px 2px 5px black;
}

/* Attack header - phones: small image beside the title, the description under both */
.attack-header-section[b-vqn2ezk6qn] {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    grid-template-areas:
        "image title"
        "text text";
    align-items: center;
    gap: 8px 12px;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.attack-image-placeholder[b-vqn2ezk6qn] {
    grid-area: image;
    flex-shrink: 0;
    width: 96px;
    height: 64px;
    background: linear-gradient(135deg, rgba(60, 60, 80, 0.6) 0%, rgba(40, 40, 60, 0.8) 100%);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.attack-image-placeholder img[b-vqn2ezk6qn] {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.attack-image-placeholder.air-strike[b-vqn2ezk6qn] {
    background: linear-gradient(135deg, rgba(60, 80, 100, 0.6) 0%, rgba(40, 60, 80, 0.8) 100%);
}

.attack-image-placeholder.ground-ops[b-vqn2ezk6qn] {
    background: linear-gradient(135deg, rgba(80, 70, 60, 0.6) 0%, rgba(60, 50, 40, 0.8) 100%);
}

.attack-image-placeholder.rocket-attack[b-vqn2ezk6qn] {
    background: linear-gradient(135deg, rgba(80, 40, 100, 0.6) 0%, rgba(50, 20, 70, 0.8) 100%);
}

.image-placeholder-content[b-vqn2ezk6qn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    color: rgba(255, 255, 255, 0.4);
}

.image-placeholder-content svg[b-vqn2ezk6qn] {
    width: 40px;
    height: 40px;
    opacity: 0.5;
}

/* The title next to the placeholder already names the attack */
.image-placeholder-content span[b-vqn2ezk6qn] {
    display: none;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.attack-description[b-vqn2ezk6qn] {
    display: contents;
}

.attack-description h3[b-vqn2ezk6qn] {
    grid-area: title;
    margin: 0;
    font-size: 1.1rem;
    color: #ffd700;
    font-family: Consolas, monospace;
}

.attack-description p[b-vqn2ezk6qn] {
    grid-area: text;
    margin: 0;
    color: #b0b0b0;
    font-size: 0.85rem;
    line-height: 1.5;
}

/* Attack body - phones: units, attack strength, own defense, action */
.attack-main-body[b-vqn2ezk6qn] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
        "units"
        "attack"
        "defense"
        "action";
    gap: 8px;
}

.attack-main-body--rockets[b-vqn2ezk6qn] {
    grid-template-areas:
        "units"
        "stock"
        "action";
}

.attack-units-panel[b-vqn2ezk6qn] {
    grid-area: units;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
}

.attack-main-body[b-vqn2ezk6qn]  .strength-panel--attack {
    grid-area: attack;
}

.attack-main-body[b-vqn2ezk6qn]  .strength-panel--defense {
    grid-area: defense;
}

/* Rocket tab rows (weapon type, count) */
.unit-row[b-vqn2ezk6qn] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 6px;
    padding: 0.6rem 0.75rem;
    transition: background-color 0.2s;
}

@media (hover: hover) {
    .unit-row:hover[b-vqn2ezk6qn] {
        background: rgba(0, 0, 0, 0.55);
    }
}

.unit-info[b-vqn2ezk6qn] {
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.15rem 0.5rem;
    min-width: 0;
}

.unit-name[b-vqn2ezk6qn] {
    font-weight: 600;
    color: white;
    font-size: 0.95rem;
}

.unit-available[b-vqn2ezk6qn] {
    font-size: 0.8rem;
    color: #888;
}

.unit-available strong[b-vqn2ezk6qn] {
    color: #ffd700;
}

.unit-input[b-vqn2ezk6qn] {
    flex: 1 1 auto;
}

/* Rocket types - phones: 2 × 2 buttons of 44px */
.rocket-type-selector[b-vqn2ezk6qn] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.rocket-type-option[b-vqn2ezk6qn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    min-height: var(--pow-touch-target);
    padding: 0.35rem 0.6rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 4px;
    color: white;
    cursor: pointer;
    transition: all 0.2s;
    user-select: none;
}

@media (hover: hover) {
    .rocket-type-option:hover[b-vqn2ezk6qn] {
        background: rgba(255, 215, 0, 0.1);
        border-color: rgba(255, 215, 0, 0.3);
    }
}

.rocket-type-option.selected[b-vqn2ezk6qn] {
    background: rgba(255, 215, 0, 0.2);
    border-color: rgba(255, 215, 0, 0.6);
}

.rocket-type-name[b-vqn2ezk6qn] {
    font-size: 0.8rem;
    font-weight: 600;
    color: white;
}

.rocket-type-count[b-vqn2ezk6qn] {
    font-size: 0.75rem;
    color: #ffd700;
    font-family: Consolas, monospace;
}

/* Rocket stock - phones have the counts on the type buttons */
.rocket-stock-panel[b-vqn2ezk6qn] {
    grid-area: stock;
    display: none;
    flex-direction: column;
    gap: 0.2rem;
    padding: 0.75rem;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
}

.rocket-stock-title[b-vqn2ezk6qn] {
    font-size: 0.65rem;
    color: #888;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-bottom: 0.25rem;
}

.rocket-stock-row[b-vqn2ezk6qn] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.4rem;
    padding: 0.1rem 0;
}

.rocket-stock-name[b-vqn2ezk6qn] {
    font-size: 0.78rem;
    color: #a0a0a0;
}

.rocket-stock-count[b-vqn2ezk6qn] {
    font-size: 0.82rem;
    color: #e0e0e0;
    font-family: Consolas, monospace;
    white-space: nowrap;
}

/* Attack action - phones: reason and button across the tile */
.attack-action[b-vqn2ezk6qn] {
    grid-area: action;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.attack-blocked-reason[b-vqn2ezk6qn] {
    font-size: 0.82rem;
    color: #f4a732;
    background: rgba(244, 167, 50, 0.1);
    border: 1px solid rgba(244, 167, 50, 0.3);
    border-radius: 4px;
    padding: 6px 10px;
}

@media (min-width: 576px) {
    .war-attack-page[b-vqn2ezk6qn] {
        padding: 0 15px;
    }

    .attack-description h3[b-vqn2ezk6qn] {
        font-size: 1.25rem;
    }

    .attack-description p[b-vqn2ezk6qn] {
        font-size: 0.9rem;
    }

    .rocket-type-selector[b-vqn2ezk6qn] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

/* Tablets and PC: tiles side by side, the original attack header and rows */
@media (min-width: 768px) {
    .military-stats-row[b-vqn2ezk6qn] {
        flex-direction: row;
    }

    .military-stat-content[b-vqn2ezk6qn] {
        padding: 12px;
    }

    .war-attack-content[b-vqn2ezk6qn] {
        padding: 1rem;
    }

    .target-selector-section[b-vqn2ezk6qn] {
        margin-bottom: 1rem;
    }

    .attack-header-section[b-vqn2ezk6qn] {
        display: flex;
        gap: 1.25rem;
        margin-bottom: 1.5rem;
        padding-bottom: 1rem;
    }

    .attack-image-placeholder[b-vqn2ezk6qn] {
        width: 140px;
        height: 120px;
    }

    .image-placeholder-content svg[b-vqn2ezk6qn] {
        width: 64px;
        height: 64px;
    }

    .image-placeholder-content span[b-vqn2ezk6qn] {
        display: inline;
    }

    .attack-description[b-vqn2ezk6qn] {
        display: block;
        flex: 1;
    }

    .attack-description h3[b-vqn2ezk6qn] {
        margin-bottom: 0.5rem;
    }

    .unit-row[b-vqn2ezk6qn] {
        flex-direction: row;
        align-items: center;
    }

    .unit-info[b-vqn2ezk6qn] {
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
    }

    .unit-input[b-vqn2ezk6qn] {
        flex: 0 0 200px;
    }

    .rocket-type-selector[b-vqn2ezk6qn] {
        display: flex;
        flex-wrap: wrap;
        gap: 0.4rem;
    }

    .rocket-type-option[b-vqn2ezk6qn] {
        min-width: 70px;
        min-height: 0;
    }

    .rocket-type-name[b-vqn2ezk6qn] {
        font-size: 0.75rem;
    }

    .rocket-type-count[b-vqn2ezk6qn] {
        font-size: 0.7rem;
    }

    .rocket-stock-panel[b-vqn2ezk6qn] {
        display: flex;
    }

    .attack-action[b-vqn2ezk6qn] {
        align-items: flex-end;
        padding-top: 1rem;
    }

    .attack-blocked-reason[b-vqn2ezk6qn] {
        width: 100%;
        text-align: right;
    }
}

/* Units over both strength panels side by side */
@container (min-width: 520px) {
    .attack-main-body[b-vqn2ezk6qn] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-areas:
            "units units"
            "attack defense"
            "action action";
        gap: 1rem 1.25rem;
    }

    .attack-main-body--rockets[b-vqn2ezk6qn] {
        grid-template-areas:
            "units units"
            "stock stock"
            "action action";
    }
}

/* Wide content: the original three columns, the action under the units */
@container (min-width: 1000px) {
    .attack-main-body[b-vqn2ezk6qn] {
        grid-template-columns: 270px 270px minmax(0, 1fr);
        grid-template-rows: 1fr auto;
        grid-template-areas:
            "attack defense units"
            "attack defense action";
        gap: 0 1.25rem;
    }

    .attack-main-body--rockets[b-vqn2ezk6qn] {
        grid-template-columns: 270px minmax(0, 1fr);
        grid-template-areas:
            "stock units"
            "stock action";
    }
}

/* With a mouse the circle and the compact button fit side by side. The touch variant of the button is wider, there it
   wraps under the circle like on phones. */
@media (min-width: 768px) and (pointer: fine) {
    .military-stat-content[b-vqn2ezk6qn] {
        flex-wrap: nowrap;
    }
}