@font-face {
    font-family: "Scavland";
    src: url("/3_Fonts/Type_Font_1.5b38c246e255.ttf") format("truetype");
    font-weight: 400;
    font-display: swap;
}

/* Kopīgie logu izmēri un novietojums visām trim sadaļām. */
:root {
    --panel-max-width: min(75vw, calc(97vw - 240px));
    --panel-width: min(58vw, var(--panel-max-width));
    --panel-height: min(78svh, calc((var(--panel-max-width) - var(--panel-gap)) / 1.908));
    --panel-left: clamp(180px, 13.2vw, 260px);
    --panel-gap: 18px;
}

body {
    margin: 0;
    min-height: 100svh;
    background: #000 url("/2_Images/scavland-armory-background-clean.fec59b051946.webp") center / cover no-repeat;
}

.site-logo {
    position: fixed;
    top: clamp(12px, 3svh, 30px);
    left: clamp(12px, 2vw, 36px);
    width: clamp(150px, 14vw, 220px);
    height: auto;
    z-index: 1;
    pointer-events: none;
}
/* Keep the navigation in the same position before and after opening a section. */
.main-menu {
    position: fixed;
    left: var(--panel-left);
    bottom: calc(50% + var(--panel-height) / 2 + 12px);
    width: calc(var(--panel-height) * 1.908 + var(--panel-gap));
    z-index: 2;
    pointer-events: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: clamp(10px, 1.6vw, 32px);
    padding: 0;
}

.main-menu :is(button, a) {
    display: inline-flex;
    align-items: center;
    gap: 0.15em;
    white-space: nowrap;
    pointer-events: auto;
    padding: 0;
    border: 0;
    background: transparent;
    color: #b8ab95;
    font: 400 clamp(24px, 2.4vw, 42px) / 1.15 "Scavland", "Arial Narrow", sans-serif;
    text-align: left;
    text-transform: uppercase;
    text-shadow: 1px 2px 2px #000;
    cursor: pointer;
}

.main-menu .menu-lock {
    display: block;
    width: 1em;
    height: 1em;
    flex: 0 0 auto;
    object-fit: contain;
}
.main-menu :is(button, a):hover,
.main-menu :is(button, a):focus-visible,
.main-menu :is(button, a)[aria-expanded="true"] { color: #d4be78; }

.main-menu :is(button, a):focus-visible {
    outline: 2px solid #d4be78;
    outline-offset: 5px;
}

.content-panel {
    position: fixed;
    top: 50%;
    left: var(--panel-left);
    width: var(--panel-width);
    height: var(--panel-height);
    transform: translateY(-50%);
    display: grid;
    grid-template-columns: 0.92fr 1fr;
    gap: var(--panel-gap);
}

.content-panel[hidden] { display: none; }

/* Weapons un Armor logu sākotnējās proporcijas: 966/768 un 501/771. */
.content-panel[data-view="weapons"],
.content-panel[data-view="armor"] {
    --panel-width: calc(var(--panel-height) * 1.908 + var(--panel-gap));
    grid-template-columns: 1.936fr 1fr;
}

.window { min-width: 0; background-repeat: no-repeat; }
.window-left { position: relative; z-index: 1; }

.weapon-menu {
    position: absolute;
    top: 0.6%;
    left: 2%;
    right: 2%;
    height: 10.8%;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    align-items: center;
    gap: 12px;
}
.weapon-menu[hidden], .armor-menu[hidden], .weapon-options[hidden] { display: none; }
.weapon-category { position: relative; min-width: 0; }
.weapon-category:has(button[aria-expanded="true"]) { z-index: 1; }
.weapon-category > button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    width: 100%;
    aspect-ratio: 142 / 47;
    min-height: 28px;
    padding: 0 clamp(4px, 0.4vw, 8px) 2px;
    border: 0;
    background: url("/4_Buttons/tab-normal.fc5496c46522.png") center / 100% 100% no-repeat;
    color: #20190c;
    font: 400 clamp(11px, 0.95vw, 16px) / 1 "Scavland", "Arial Narrow", sans-serif;
    text-align: left;
    text-transform: uppercase;
    image-rendering: pixelated;
    cursor: pointer;
}
.weapon-category > button::after {
    content: "";
    width: 5px;
    height: 5px;
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    transform: rotate(45deg);
}
.weapon-category:hover > button,
.weapon-category > button:focus-visible {
    background-image: url("/4_Buttons/tab-hover.689acc9e7716.png");
}
.weapon-category > button:active,
.weapon-category > button[aria-pressed="true"] {
    background-image: url("/4_Buttons/tab-pressed.90a9e5c59d1b.png");
}
.weapon-category > button:focus-visible {
    outline: 2px solid #d4be78;
    outline-offset: 3px;
}
.weapon-options {
    position: absolute;
    top: 100%;
    left: 0;
    box-sizing: border-box;
    width: clamp(210px, 20vw, 280px);
    max-width: calc(100vw - 24px);
    min-height: 47px;
    max-height: min(48svh, 420px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: #8c6c38 #25271f;
    scrollbar-width: thin;
    margin: 0;
    padding: 8px;
    border: 2px solid #8c6c38;
    background: #25271f;
    box-shadow: 2px 3px 0 #11170d;
    list-style: none;
}
.weapon-category:nth-last-child(-n+3) .weapon-options { left: auto; right: 0; }
.weapon-options li + li { border-top: 1px solid #8c6c383d; }
.weapon-options a {
    display: block;
    width: 100%;
    min-height: 36px;
    padding: 8px 9px;
    border: 0;
    background: transparent;
    color: #c9bda7;
    font: 400 18px / 1.2 "Scavland", "Arial Narrow", sans-serif;
    text-align: left;
    overflow-wrap: anywhere;
    cursor: pointer;
}
.weapon-options a:hover,
.weapon-options a:focus-visible {
    background: #3b3d2e;
    color: #ecd799;
}
.weapon-options a:focus-visible {
    outline: 1px solid #d4be78;
    outline-offset: -1px;
}
.weapon-options a[aria-current="true"] {
    background: #504830;
    color: #f0d894;
    box-shadow: inset 3px 0 #d4be78;
}

/* Fona pozīcijas izdala tikai vajadzīgo logu no esošā PNG. */
[data-view="armory"] .window {
    background-image: url("/2_Images/armory-without-grid.b87f9c18b666.webp");
}
[data-view="armory"] .window-left {
    background-size: 298.0392% 112.6946%;
    background-position: 38.4338% 53.7736%;
}
[data-view="armory"] .window-right {
    background-size: 275% 112.6946%;
    background-position: 94.8308% 53.7736%;
}

[data-view="weapons"] .window {
    background-image: url("/2_Images/mod-window-transparent-v2.af10e1949366.webp");
}
[data-view="armor"] .window {
    background-image: url("/2_Images/mod-window-transparent-v3.ca4522cf66e3.webp");
}
[data-view="weapons"] .window-left,
[data-view="armor"] .window-left {
    background-size: 172.9814% 122.526%;
    background-position: 12.3404% 49.711%;
}
[data-view="weapons"] .window-right,
[data-view="armor"] .window-right {
    background-size: 333.5329% 122.0493%;
    background-position: 92.735% 50%;
    border-radius: 8px 8px 0 0;
    clip-path: polygon(0 0, 100% 0, 100% 96%, 95% 100%, 0 100%);
}

.main-menu a { text-decoration: none; }
/* Transparent hit areas over the slots already drawn in mod-window-transparent-v3. */
.armor-menu {
    position: absolute;
    inset: 0;
}
[data-view]:not([data-view="armor"]) .armor-menu { display: none; }
.armor-slot {
    position: absolute;
    left: 22.98%;
    top: 8.72%;
    width: 15.53%;
    height: 14.06%;
    color: #baad7c;
    text-decoration: none;
    text-align: center;
    font: 400 clamp(8px, 1.35cqw, 14px)/1.1 "Scavland", sans-serif;
    text-transform: uppercase;
    cursor: pointer;
    border-radius: 2px;
}
.armor-slot[data-armor-category="mask"] { left: 5.38%; width: 15.73%; }
.armor-slot[data-armor-category="body"] { top: 25.39%; height: 19.53%; }
.armor-slot[data-armor-category="legs"] { top: 45.7%; height: 20.31%; }
/* Cover only the original silhouette when an item is fitted; preserve the painted frame. */
.armor-slot[data-filled="true"] { background: #323024; }
.armor-slot-icon {
    position: absolute;
    top: 5%;
    left: 14%;
    display: block;
    width: 72%;
    height: 72%;
    object-fit: contain;
    image-rendering: pixelated;
    visibility: hidden;
}
.armor-slot[data-filled="true"] .armor-slot-icon { visibility: visible; }
.armor-slot-label { position: absolute; bottom: 3%; left: 0; right: 0; text-shadow: 1px 1px #000; }
.armor-slot:hover { box-shadow: inset 0 0 0 2px #a8955e; color: #ead498; }
.armor-slot[aria-current="true"] { box-shadow: inset 0 0 0 2px #e88900; color: #ead498; }
.armor-slot:focus-visible { outline: 2px solid #f7bd62; outline-offset: 2px; }
.armor-heading {
    position: absolute;
    top: 1.5%;
    left: 5%;
    right: 5%;
    height: 11%;
    display: flex;
    align-items: center;
    margin: 0;
    color: #bead70;
    font: 400 clamp(11px, 4cqw, 22px)/1 "Scavland", sans-serif;
}
.armor-heading[hidden], [data-view]:not([data-view="armor"]) .armor-heading { display: none; }

/* Keep the Attributes control at the left of the right-panel header. */
.window-right { position: relative; container-type: inline-size; }
.weapon-detail-tabs {
    position: absolute;
    z-index: 2;
    top: 1.5%;
    left: 5%;
    right: 5%;
    height: 11%;
    display: none;
    grid-template-columns: 36%;
    align-items: center;
}
[data-view="weapons"] .weapon-detail-tabs { display: grid; }
.attributes-button {
    box-sizing: border-box;
    width: 100%;
    aspect-ratio: 142 / 47;
    padding: 0 clamp(3px, 1.5cqw, 8px) 1px;
    border: 0;
    background: url("/4_Buttons/tab-normal.fc5496c46522.png") center / 100% 100% no-repeat;
    color: #20190c;
    font: 400 clamp(8px, 3.4cqw, 18px) / 1 "Scavland", "Arial Narrow", sans-serif;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
    image-rendering: pixelated;
    cursor: pointer;
}
.attributes-button:hover,
.attributes-button:focus-visible { background-image: url("/4_Buttons/tab-hover.689acc9e7716.png"); }
.attributes-button:active { background-image: url("/4_Buttons/tab-pressed.90a9e5c59d1b.png"); }
.attributes-button:focus-visible { outline: 2px solid #d4be78; outline-offset: 2px; }

.attributes-dropdown { position: relative; min-width: 0; }
.attributes-button { display: flex; align-items: center; justify-content: space-between; gap: 0.45em; }
.attributes-arrow {
    width: 0.3em;
    height: 0.3em;
    flex-shrink: 0;
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    transform: translateY(-1px) rotate(45deg);
}
.attributes-button[aria-expanded="true"] { background-image: url("/4_Buttons/tab-pressed.90a9e5c59d1b.png"); }
.attributes-button:disabled { opacity: 0.6; cursor: default; background-image: url("/4_Buttons/tab-normal.fc5496c46522.png"); }
.attribute-options {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 3;
    box-sizing: border-box;
    width: min(270px, 90cqw);
    max-height: min(60svh, calc(var(--panel-height) * 0.78));
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #8c6c38 #25271f;
    margin: 0;
    padding: clamp(3px, 1.2cqw, 6px);
    list-style: none;
    border: 2px solid #8c6c38;
    background: #25271f;
    box-shadow: 2px 3px 0 #11170d;
}
.attribute-options[hidden] { display: none; }
.attribute-options li + li { border-top: 1px solid #8c6c383d; }
.attribute-options button {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-height: 32px;
    padding: 7px clamp(4px, 1.6cqw, 9px);
    border: 0;
    background: transparent;
    color: #c9bda7;
    font: 400 clamp(12px, 3.8cqw, 18px)/1.2 "Scavland", "Arial Narrow", sans-serif;
    text-align: left;
    cursor: pointer;
}
.attribute-options small { display: block; margin-top: 4px; color: #b8ab95; font: 400 11px/1.3 sans-serif; }
.attribute-options button:hover,
.attribute-options button:focus-visible { background: #3b3d2e; color: #ecd799; }
.attribute-options button:focus-visible { outline: 1px solid #d4be78; outline-offset: -1px; }
.attribute-options button[aria-pressed="true"] { background: #504830; color: #f0d894; box-shadow: inset 3px 0 #d4be78; }
.attributes-message {
    position: absolute;
    top: 15%;
    left: 5%;
    right: 5%;
    margin: 0;
    color: #bead70;
    font: 400 clamp(10px, 3cqw, 16px)/1.3 "Scavland", sans-serif;
}
[data-view]:not([data-view="weapons"]) .attributes-message { display: none; }

:root { --stat-base: #bead70; --stat-good: #6dd13c; --stat-bad: #cf1a1a; --stat-empty: #26211c; }
.window-left { container-type: inline-size; }
.weapon-menu { z-index: 2; }
.weapon-stats { position: absolute; left: 1.8%; right: 39.3%; bottom: 1%; color: var(--stat-base); font: 400 max(10px, 1.63cqw)/1 "Scavland", sans-serif; }
.weapon-stat-columns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.5cqw; }
.weapon-stat-columns dl { margin: 0; }
/* Keep the original bar width (93.4% × 94% / 2 × 33% of the window).
   Recover space from unused label padding and column gutters instead. */
.weapon-stats .stat-row { grid-template-columns: 10.5cqw 14.49cqw minmax(0, 1fr); column-gap: 0.2cqw; min-height: max(26px, 4.4cqw); }
.weapon-stats .stat-row dt { white-space: normal; }
.weapon-stats .stat-bar { height: max(20px, 3.5cqw); }
.stat-row { display: grid; grid-template-columns: 35% 33% 1fr; align-items: center; gap: 2%; min-height: max(17px, 3.44cqw); }
.stat-row dt { text-transform: uppercase; }
.stat-row dd { margin: 0; white-space: nowrap; }
.stat-bar { height: max(12px, 2.54cqw); background: linear-gradient(90deg, var(--stat-base) var(--base, 0%), var(--change, var(--stat-base)) 0 var(--total, 0%), var(--stat-empty) 0); mask: repeating-linear-gradient(90deg, #000 0 2.5%, transparent 2.5% 5%); }
.stat-row[data-change="better"] { --change: var(--stat-good); }
.stat-row[data-change="worse"] { --change: var(--stat-bad); }
.stat-value b { color: var(--change); font-weight: 400; }
[data-view]:not([data-view="weapons"]) .weapon-stats { display: none; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.weapon-options a { box-sizing: border-box; text-decoration: none; }
@container (max-width: 600px) {
    .weapon-stats .weapon-stat-columns { grid-template-columns: 1fr; gap: 0; }
    .weapon-stats .stat-row { grid-template-columns: minmax(0, 1fr) 14.49cqw minmax(28px, 6cqw); column-gap: 1cqw; }
    .weapon-stats { max-height: 38%; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--stat-base) var(--stat-empty); }
}
@container (max-width: 450px) {
    .stat-row { grid-template-columns: 44% 32% 1fr; }
    .stat-row dt { white-space: nowrap; }
}
@media (max-width: 700px) {
    .weapon-stats { max-height: 68%; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--stat-base) var(--stat-empty); font-size: 10px; }
    .weapon-stat-columns { grid-template-columns: 1fr; gap: 4px; }
    .stat-row { min-height: 17px; grid-template-columns: 46% 30% 1fr; }
    .stat-bar { height: 12px; }
}

/* Centre the visible weapon pixels on the supplied reference point. */
.weapon-preview {
    position: absolute;
    left: 50.6%;
    top: 41.8%;
    width: 84%;
    height: 54%;
    transform: translate(-50%, -50%);
    display: grid;
    place-items: center;
    pointer-events: none;
}
.weapon-preview[hidden],
[data-view]:not([data-view="weapons"]) .weapon-preview { display: none; }
.weapon-image {
    display: block;
    width: calc(var(--weapon-pixels) * 1.25cqw);
    height: auto;
    max-width: 100%;
    max-height: 100%;
    filter: drop-shadow(0 2px 2px #0008);
}
.weapon-image image { image-rendering: pixelated; }
@media (max-width: 700px) {
    /* Keep the existing scrollable stats below the weapon preview. */
    .weapon-stats { max-height: 25%; }
}

.stat-row .stat-value { white-space: normal; }
.stat-value b { display: inline-block; }

/* Reserve a second line for attachment changes, keeping base values aligned. */
.weapon-stats .stat-value {
    display: grid;
    grid-template-rows: repeat(2, 1em);
    row-gap: 0.15em;
    white-space: nowrap;
}
.weapon-stats .stat-value b { display: block; }

.attribute-content, .armor-content {
    position: absolute;
    inset: 14% 5% 5%;
    display: flex;
    flex-direction: column;
    gap: max(5px, 1.4cqw);
}
.attribute-content .attributes-message { position: static; flex: 0 0 auto; }
[data-view]:not([data-view="weapons"]) .attribute-content { display: none; }
.armor-content[hidden], [data-view]:not([data-view="armor"]) .armor-content { display: none; }
.armor-message { margin: 0; color: #bead70; font: 400 clamp(10px, 3cqw, 16px)/1.3 "Scavland", sans-serif; }
.attachment-results, .armor-results {
    min-height: 0;
    flex: 1;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #8c6c38 #25231c;
}
.attachment-results[hidden], .armor-results[hidden], .attachment-group[hidden],
[data-view]:not([data-view="weapons"]) .attachment-results { display: none; }
.attachment-group { list-style: none; margin: 0; padding: 0; }
.attachment-group li + li { margin-top: max(6px, 2cqw); }
.attachment-card {
    display: grid;
    grid-template-columns: 19% minmax(0, 1fr) auto max(5px, 3.2cqw);
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: max(4px, 1.4cqw);
    row-gap: max(3px, 1cqw);
    box-sizing: border-box;
    width: 100%;
    min-height: max(58px, 14.4cqw);
    padding: max(4px, 1.2cqw);
    border: 2px solid #343024;
    background: #17160feF;
    color: #bead70;
    font: 400 clamp(11px, 3.2cqw, 18px)/1.2 "Scavland", "Arial Narrow", sans-serif;
    text-align: left;
    cursor: pointer;
    text-decoration: none;
}
.attachment-card:hover { background: #201e15; border-color: #76603a; }
.attachment-card[aria-pressed="true"] { border-color: #e88900; background: #19170f; }
.attachment-card:focus-visible { outline: 2px solid #f7bd62; outline-offset: -4px; }
.attachment-icon { grid-column: 1; grid-row: 1 / 3; display: grid; place-items: center; min-width: 0; }
.attachment-icon img { display: block; width: 100%; max-height: 13cqw; object-fit: contain; image-rendering: pixelated; }
.attachment-name { grid-column: 2; grid-row: 1; min-width: 0; overflow-wrap: anywhere; }
.attachment-price { grid-column: 3; grid-row: 1; color: #d1cbb4; white-space: nowrap; }
.attachment-rarity { grid-column: 4; grid-row: 1 / 3; align-self: stretch; background: #b9b9b1; min-height: 28px; }
.attachment-rarity[data-rarity="Uncommon"] { background: #79d300; }
.attachment-rarity[data-rarity="Rare"] { background: #4399f5; }
.attachment-rarity[data-rarity="Very Rare"] { background: #fff000; }
.attachment-rarity[data-rarity="Ultra Rare"] { background: #d45bff; }
.attachment-stats { grid-column: 2 / 4; grid-row: 2; display: flex; flex-wrap: wrap; gap: 3px; }
.attachment-stat { padding: 3px 4px; border: 1px solid #494728; background: #1d2012; color: #cfc8a9; font-size: clamp(10px, 2.6cqw, 15px); white-space: nowrap; }
.attachment-stat-value { color: #79d300; }
.attachment-stat[data-direction="down"] .attachment-stat-value { color: #ec6650; }
.attachment-stat[data-direction="none"] .attachment-stat-value { color: #cfc8a9; }
.attachment-stat-value > [aria-hidden] { margin-right: 2px; font: 0.65em sans-serif; }
.armor-card .attachment-name { margin: 0; font: inherit; }
.armor-card .attachment-icon { grid-row: 1; }
.armor-card .attachment-stats { grid-column: 1 / -2; }
.armor-card .attachment-stat { white-space: normal; }
@container (max-width: 240px) {
    .attachment-card { grid-template-columns: 22% minmax(0, 1fr) 5px; }
    .attachment-name { grid-column: 2; }
    .attachment-price { grid-column: 2; grid-row: 2; justify-self: end; }
    .attachment-rarity { grid-column: 3; grid-row: 1 / 4; }
    .attachment-stats { grid-column: 1 / 3; grid-row: 3; }
    .attachment-icon img { max-height: 32px; }
}

/* Keep ammunition above the matching lower panels, without moving the weapon. */
.ammo-buttons {
    position: absolute;
    z-index: 1;
    right: 1.8%;
    bottom: max(calc(29% + 0.7cqw), calc(2.5% + var(--weapon-repair-height, 24%) + 2cqw));
    width: 36.1%;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: minmax(0, 1fr);
}
.ammo-buttons, .ammo-details {
    box-sizing: border-box;
    height: clamp(42px, 11.2cqw, 124px);
    border: 1px solid #bead7066;
    background: #15140f88;
}
.ammo-buttons:has(.ammo-button:nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ammo-buttons[hidden], .ammo-details[hidden], .ammo-empty-overlay[hidden],
[data-view]:not([data-view="weapons"]) .ammo-buttons,
[data-view]:not([data-view="weapons"]) .ammo-details { display: none; }
.ammo-button {
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    align-items: center;
    justify-items: center;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    padding: 0;
    border: 0;
    background: none;
    color: #bead70;
    cursor: pointer;
}
.ammo-button + .ammo-button { border-left: 1px solid #bead7066; }
.ammo-button-icons {
    display: grid;
    place-items: center;
    height: 100%;
    width: auto;
    aspect-ratio: 4 / 5;
    max-width: min(78%, 6.6cqw, 72px);
    min-height: 0;
}
.ammo-icon {
    grid-area: 1 / 1;
    display: block;
    width: 125%;
    height: auto;
    /* Native artwork includes the gold outline; apply its 3% scale only once. */
    transform: rotate(-90deg) scale(var(--ammo-scale, 1));
    transform-origin: center;
    image-rendering: pixelated;
    pointer-events: none;
}
.ammo-button[aria-pressed="true"] { --ammo-scale: 1.03; }
.ammo-button[aria-pressed="true"] .ammo-label { color: #d8b24a; }
.ammo-button:focus-visible { outline: 2px solid #d8b24a; outline-offset: 2px; }
.ammo-button[data-caliber="Special"] .ammo-icon { width: 100%; transform: scale(var(--ammo-scale, 1)); }
.ammo-label {
    box-sizing: border-box;
    width: 100%;
    padding: max(2px, 0.4cqw) 0;
    border-top: 1px solid #bead7040;
    text-align: center;
    font: 400 max(9px, 1.2cqw)/1 "Scavland", "Arial Narrow", sans-serif;
}
.ammo-details {
    position: absolute;
    z-index: 1;
    left: 1.8%;
    bottom: calc(1% + var(--weapon-stat-height, 27.7%) + 0.9cqw);
    width: 26.5%;
    color: #bead70;
    font: 400 var(--weapon-info-font-size, max(10px, 1.63cqw))/1.2 "Scavland", "Arial Narrow", sans-serif;
}
.ammo-properties { margin: 0; display: grid; height: 100%; grid-template-rows: repeat(4, minmax(0, 1fr)); }
.ammo-property { display: flex; align-items: center; justify-content: space-between; gap: 1cqw; padding: 0 0.6cqw; }
.ammo-property + .ammo-property { border-top: 1px solid #bead7040; }
.ammo-property dd { margin: 0; color: #d1cbb4; white-space: nowrap; text-align: right; }
.ammo-property:is([data-stat="damage"], [data-stat="penetration"], [data-stat="speed"]) dd { color: var(--stat-good); }
.ammo-property[data-negative="true"] dd { color: var(--stat-bad); }
@container (max-width: 600px) {
    .ammo-buttons { height: 42px; bottom: calc(2.5% + var(--weapon-repair-height, 38%) + 2px); }
    .ammo-details { width: 58.9%; height: 42px; }
    .ammo-properties { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); }
    .ammo-property:nth-child(2) { border-top: 0; }
    .ammo-property:nth-child(even) { border-left: 1px solid #bead7040; }
    .ammo-label { padding: 2px 0; }
}

@media (max-width: 650px) and (max-height: 600px) and (orientation: landscape) {
    .ammo-buttons, .ammo-details { height: 36px; }
}

/* Price follows the title; the information table stays anchored at the right. */
.weapon-header {
    position: absolute;
    top: 11.5%;
    left: 1.8%;
    width: 38%;
    min-height: 13.2%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: .4cqw;
    color: var(--stat-base);
    font: 700 clamp(10px, 3.2cqw, 34px)/1.1 "Scavland", sans-serif;
}
.weapon-name { margin: 0; min-width: 0; font: inherit; overflow-wrap: anywhere; }
.weapon-info {
    position: absolute;
    top: 11.5%;
    right: 1.8%;
    width: 56%;
    height: 13.2%;
    box-sizing: border-box;
    border: 1px solid #bead7066;
    background: #15140f88;
    color: var(--stat-base);
    font: 400 clamp(10px, 1.75cqw, 18px)/1.1 "Scavland", "Arial Narrow", sans-serif;
}
.weapon-info-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
    height: 100%;
    margin: 0;
}
.weapon-info-cell {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .4cqw;
    min-width: 0;
    min-height: 0;
    padding: .35cqw;
}
.weapon-info-cell:not(:nth-child(4n + 1)) { border-left: 1px solid #bead7040; }
.weapon-info-cell:nth-child(n + 5) { border-top: 1px solid #bead7040; }
.weapon-info-cell dt { min-width: 0; white-space: nowrap; text-align: left; }
.weapon-info-cell dd { min-width: 0; margin: 0; color: #d1cbb4; white-space: nowrap; text-align: right; font-size: 1.08em; }
.weapon-info-cell[data-numeric="true"] dd { color: var(--stat-good); }
.weapon-price {
    margin: 0;
    color: var(--stat-base);
    font: inherit;
    white-space: nowrap;
    text-align: left;
}
.weapon-header[hidden], .weapon-price[hidden],
[data-view]:not([data-view="weapons"]) .weapon-header,
[data-view]:not([data-view="weapons"]) .weapon-info,
[data-view]:not([data-view="weapons"]) .weapon-price { display: none; }
@media (max-width: 1000px) and (max-height: 600px) and (orientation: landscape) {
    .weapon-header { top: max(11.5%, 36px); }
    /* Use the free strip below navigation to keep all eight fields visible. */
    .weapon-info {
        top: -40px;
        left: 2%;
        right: auto;
        width: 96%;
        height: 32px;
        font-size: clamp(9px, 2.6cqw, 11px);
        line-height: 1;
    }
    .weapon-info-cell { padding: 0 3px; gap: 3px; }
    .weapon-info-cell dd { font-size: 1em; }
}

/* Keep the supplied equipment frame and the shared window geometry intact. */
.armor-details {
    position: absolute;
    inset: 72% 42% 3% 4%;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #8c6c38 #25231c;
    color: #cfc8a9;
    font: 400 clamp(10px, 1.8cqw, 20px)/1.35 "Scavland", sans-serif;
}
.armor-item-header {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.3em 0.7em;
    padding-bottom: 0.3em;
    border-bottom: 1px solid #bead7040;
    font-size: clamp(12px, 2.5cqw, 26px);
    line-height: 1.15;
}
.armor-item-header h2, .armor-price { margin: 0; font: inherit; }
.armor-item-header h2 { color: #e88900; overflow-wrap: anywhere; }
.armor-price { margin-left: auto; white-space: nowrap; }
.armor-description { margin: 0.5em 0; white-space: pre-line; font-style: italic; }
.armor-repair {
    margin: 0 0 0.6em;
    color: var(--stat-base);
    font: inherit;
    font-size: 0.8em;
    text-transform: uppercase;
}
.armor-statistics {
    position: absolute;
    inset: 5% 3.5% 2.5% 62%;
    display: grid;
    grid-template-rows: repeat(3, minmax(0, 1fr));
    color: var(--stat-base);
    font: 400 max(9px, 2cqw)/1.1 "Scavland", sans-serif;
    -webkit-user-select: none;
    user-select: none;
}
.armor-stat-section, .armor-repair-section { min-height: 0; overflow: auto; scrollbar-width: thin; scrollbar-color: #8c6c38 #25231c; }
.armor-stat-section + .armor-stat-section, .armor-repair-section { border-top: 1px solid #bead7059; padding-top: 1.5cqw; }
.armor-repair-section { margin-inline: -0.8cqw; }
.armor-repair-section > :is(.armor-repair, .armor-repair-message) { margin-inline: 0.8cqw; }
.armor-repair-message { margin: 0; font-size: 0.8em; color: #d1cbb4; }
.armor-stat-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.3em 0.5em; margin-bottom: 1.5cqw; }
.armor-stat-heading h3 { margin: 0; color: #d1cbb4; font: inherit; text-transform: uppercase; }
.armor-stat-context { font-size: 0.85em; white-space: nowrap; }
.armor-stat-grid { margin: 0; }
.armor-statistics .stat-row { grid-template-columns: 42% 30% 24%; gap: 2%; min-height: max(15px, 4.6cqw); }
.armor-statistics .stat-row dt { white-space: normal; }
.armor-statistics .stat-bar {
    height: max(9px, 2.54cqw);
    background: linear-gradient(to right,
        var(--stat-good) 0 var(--overflow, 0%),
        var(--stat-base) var(--overflow, 0%) var(--base, 0%),
        var(--stat-empty) var(--base, 0%) 100%);
}
.armor-statistics .stat-value { text-align: right; white-space: nowrap; }
.armor-durability-control { position: relative; height: max(18px, 3cqw); }
.armor-durability-control .stat-bar { position: absolute; inset: 50% 0 auto; transform: translateY(-50%); pointer-events: none; }
#armor-durability {
    position: relative;
    z-index: 1;
    display: block;
    appearance: none;
    box-sizing: border-box;
    width: 100%;
    height: max(18px, 3cqw);
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    cursor: ew-resize;
    touch-action: none;
    -webkit-user-select: none;
    user-select: none;
}
#armor-durability::-webkit-slider-runnable-track { height: max(18px, 3cqw); background: transparent; }
#armor-durability::-moz-range-track { height: max(18px, 3cqw); background: transparent; }
#armor-durability::-webkit-slider-thumb {
    appearance: none;
    width: max(6px, 0.8cqw);
    height: max(18px, 3cqw);
    border: 1px solid #f7bd62;
    border-radius: 0;
    background: #e88900;
    box-shadow: 0 0 2px #000;
}
#armor-durability::-moz-range-thumb {
    width: max(6px, 0.8cqw);
    height: max(18px, 3cqw);
    border: 1px solid #f7bd62;
    border-radius: 0;
    background: #e88900;
    box-shadow: 0 0 2px #000;
}
#armor-durability:focus-visible { outline: 2px solid #f7bd62; outline-offset: 3px; }
#armor-durability:disabled { visibility: hidden; cursor: default; }
.armor-details[hidden], .armor-statistics[hidden],
[data-view]:not([data-view="armor"]) .armor-details,
[data-view]:not([data-view="armor"]) .armor-statistics { display: none; }
@container (max-width: 450px) {
    .armor-statistics .stat-row { grid-template-columns: 43% 28% 25%; }
    .armor-stat-heading { gap: 2px; }
}
@container (max-width: 340px) {
    .armor-statistics .stat-row { grid-template-columns: minmax(0, 1fr) auto; gap: 3px; padding-bottom: 6px; }
    .armor-statistics .stat-bar { grid-column: 1 / -1; grid-row: 2; }
    .armor-statistics .stat-value { grid-column: 2; grid-row: 1; }
    .armor-statistics .armor-durability-control { grid-column: 1 / -1; grid-row: 2; }
}

/* Both equipment views use the same rows, artwork sizing and repair colors. */
.repair-options {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0;
    padding: 0;
    list-style: none;
    border: 1px solid #bead7066;
    background: #15140f88;
}
.repair-option {
    min-width: 0;
    display: grid;
    grid-row: span 4;
    grid-template-rows: subgrid;
    text-align: center;
    font-size: max(10px, 0.8em);
    line-height: 1.15;
}
.repair-option + .repair-option { border-left: 1px solid #bead7066; }
.repair-option > span { display: flex; align-items: center; justify-content: center; min-width: 0; padding: 0.2em 0.3em; }
.repair-option > span + span { border-top: 1px solid #bead7040; }
.repair-option img { width: 7cqw; height: 7cqw; min-width: 32px; min-height: 32px; max-width: 100%; object-fit: contain; image-rendering: pixelated; }
.repair-name { min-height: 2.3em; color: #d1cbb4; overflow-wrap: anywhere; background: #bead700d; }
.repair-min { white-space: nowrap; }
.repair-gain { color: var(--stat-good); font-size: 1.2em; white-space: nowrap; background: #0c160f66; }
.repair-options[hidden], .repair-option[hidden] { display: none; }

/* Share the bottom information area with the compact weapon statistics. */
.weapon-repair-section {
    position: absolute;
    z-index: 1;
    inset: auto 1.8% 2.5% auto;
    /* Match armor's 34.5% statistics column plus its two 0.8cqw side margins. */
    width: 36.1%;
    max-height: 31%;
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: #8c6c38 #25231c;
    color: var(--stat-base);
    font: 400 max(9px, 2cqw)/1.1 "Scavland", sans-serif;
}
.weapon-repair-heading { margin: 0 0 0.6em; font: inherit; font-size: 0.8em; text-transform: uppercase; }
.weapon-repair-message { margin: 0; font-size: 0.8em; color: #d1cbb4; }
.weapon-repair-section[hidden], [data-view]:not([data-view="weapons"]) .weapon-repair-section { display: none; }
.weapon-repair-section .repair-option { font-size: max(9px, 0.75em); }
.weapon-repair-section .repair-option img { width: 6cqw; height: 6cqw; min-width: 28px; min-height: 28px; }
@container (max-width: 600px) {
    .weapon-repair-section .repair-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .weapon-repair-section { max-height: 38%; }
}
@container (max-width: 450px) {
    .repair-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.rotate-notice { display: none; }

/* On phones, portrait mode asks the visitor to rotate the screen. */
@media (max-width: 900px) and (orientation: portrait) {
    body { overflow: hidden; }
    .main-menu, .content-panel, .site-logo { display: none; }
    .rotate-notice {
        position: fixed;
        inset: 0;
        z-index: 10;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 20px;
        padding: 32px;
        background: #0a0b08e8;
        color: #d4be78;
        text-align: center;
    }
    .rotate-notice h2 { margin: 0; font: 400 34px/1.1 "Scavland", sans-serif; text-transform: uppercase; }
    .rotate-notice p { max-width: 28ch; margin: 0; font: 400 20px/1.35 "Scavland", sans-serif; }
    .rotate-phone-icon { position: relative; width: 72px; height: 42px; margin: 16px 0; border: 3px solid currentColor; border-radius: 8px; }
    .rotate-phone-icon::before { content: ""; position: absolute; right: 5px; top: 17px; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
    .rotate-phone-icon::after { content: "\21BB"; position: absolute; right: -24px; top: -32px; font: 36px/1 sans-serif; }
}

/* Landscape: a shared full-width navigation row above both windows. */
@media (max-width: 1000px) and (max-height: 600px) and (orientation: landscape) {
    :root {
        --panel-gap: 10px;
        --panel-max-width: calc(100vw - max(12px, env(safe-area-inset-left)) - max(12px, env(safe-area-inset-right)));
        --panel-top: max(86px, calc(env(safe-area-inset-top) + 80px));
        --panel-height: min(calc(100svh - var(--panel-top) - max(12px, env(safe-area-inset-bottom))), calc((var(--panel-max-width) - var(--panel-gap)) / 1.908));
        --panel-width: calc(var(--panel-height) * 1.908 + var(--panel-gap));
        --panel-right: calc((100vw - var(--panel-width)) / 2);
    }
    .main-menu {
        position: fixed;
        left: 50%;
        right: auto;
        bottom: auto;
        top: max(6px, env(safe-area-inset-top));
        width: var(--panel-width);
        flex-direction: row;
        justify-content: space-between;
        gap: 8px;
        padding: 0;
        transform: translateX(-50%);
    }
    .main-menu :is(button, a) { display: flex; align-items: center; min-height: 32px; font-size: clamp(16px, 5.5svh, 22px); }
    .content-panel { left: auto; right: var(--panel-right); top: var(--panel-top); transform: none; }
    .weapon-menu { gap: 6px; }
    .weapon-category > button { height: 32px; min-height: 32px; aspect-ratio: auto; font-size: clamp(9px, 1.7vw, 12px); padding-inline: 3px; }
    .weapon-category > button::after { width: 3px; height: 3px; flex-shrink: 0; }
    .weapon-options { max-height: min(50svh, 360px); }
    .weapon-options a { min-height: 44px; }
    .weapon-detail-tabs { height: max(11%, 32px); }
    .attribute-content { top: max(14%, 40px); }
    .attributes-button { min-height: 32px; font-size: max(11px, 3.4cqw); }
    .attribute-options button { min-height: 40px; }
    .weapon-stat-columns { grid-template-columns: 1fr 1fr; gap: 4%; }
    .weapon-stats { max-height: 38%; overflow-y: auto; font-size: 11px; scrollbar-width: thin; }
    .stat-row { min-height: 18px; grid-template-columns: 44% 30% 1fr; }
    .stat-bar { height: 12px; }
    .weapon-preview { top: 35%; height: 42%; }
}

@media (max-width: 650px) and (max-height: 600px) and (orientation: landscape) {
    .weapon-menu { gap: 3px; }
    .weapon-category > button { font-size: 9px; padding-inline: 2px; }
    .weapon-stats { font-size: 10px; }
    .weapon-stats .stat-row { grid-template-columns: 46% 28% 1fr; }
}

@media (max-width: 1000px) and (max-height: 600px) and (orientation: landscape) {
    .site-logo { top: 6px; left: 8px; width: clamp(48px, calc(var(--panel-right) - 16px), 110px); }
}

.content-panel[data-view="map"] { --panel-width: calc(var(--panel-height) * 1.908 + var(--panel-gap)); display: block; }
.content-panel[data-view="map"] > .window, .content-panel[data-view="map"][hidden], .map-content[hidden] { display: none; }
.map-content { height: 100%; min-width: 0; overflow: hidden; background: #25271f; border: 1px solid #8c6c38; box-sizing: border-box; }
.map-content #scavland-map-preview {
    --map-paper: #b6a896; --map-terrain: #8b7f70; --map-ink: #333333; --map-accent: #254861;
    display: grid; grid-template-columns: minmax(100px,1.2fr) minmax(0,6.5fr) minmax(180px,2.3fr);
    height: 100%; padding: 10px; gap: 10px; box-sizing: border-box;
    color: #e3d7bb; font: 400 16px/1.15 "Scavland", "Arial Narrow", sans-serif;
}
#scavland-map-preview .map-sidebar { display: flex; flex-direction: column; gap: 10px; min-width: 0; min-height: 0; overflow: hidden; padding-right: 3px; }
#scavland-map-preview .map-heading { display: grid; gap: 4px; }
#scavland-map-preview h2 { margin: 0; font: 400 22px/1.1 "Scavland", sans-serif; }
#scavland-map-preview h3 { margin: 0; font: 400 19px/1.15 "Scavland", sans-serif; }
#scavland-map-preview p { margin: 0; }
#scavland-map-preview .text-small { font-size: 13px; line-height: 1.3; }
#scavland-map-preview .text-muted { color: #b8ab95; }
#scavland-map-preview .tabular-nums { font-variant-numeric: tabular-nums; }
#scavland-map-preview .btn {
    display: inline-flex; align-items: center; justify-content: center; min-height: 28px; padding: 4px 10px; border: 0;
    background: url("/4_Buttons/tab-normal.fc5496c46522.png") center/100% 100% no-repeat;
    color: #20190c; font: 400 16px/1 "Scavland", sans-serif; cursor: pointer;
}
#scavland-map-preview .btn:hover { background-image: url("/4_Buttons/tab-hover.689acc9e7716.png"); }
#scavland-map-preview .btn[aria-pressed="true"] { background-image: url("/4_Buttons/tab-pressed.90a9e5c59d1b.png"); }
#scavland-map-preview :is(button,select):focus-visible { outline: 2px solid #f7bd62; outline-offset: 3px; }
#scavland-map-preview .layer-options { display: grid; gap: 5px; flex-shrink: 0; }
#scavland-map-preview .map-zoom { position: absolute; top: 10px; left: 10px; z-index: 10; display: grid; justify-items: stretch; gap: 4px; padding: 4px; border: 1px solid #8c6c38; border-radius: 3px; background: #25271fed; }
#scavland-map-preview .map-zoom .btn { width: 34px; min-height: 32px; padding: 0; font-size: 22px; }
#scavland-map-preview .zoom-value { text-align: center; font-size: 13px; }
#scavland-map-preview .form-check { display: inline-flex; align-items: center; gap: 5px; }
#scavland-map-preview .form-check-input { margin: 0; accent-color: #d4be78; }
#scavland-map-preview .map-layers { display: grid; align-content: start; gap: 10px; flex: 1 1 0; min-height: 70px; overflow-y: auto; padding-right: 3px; scrollbar-width: thin; scrollbar-color: #8b7f70 #25271f; }
#scavland-map-preview .map-layers h3 { margin-bottom: 5px; font-size: 17px; }
#scavland-map-preview .layer-buttons { display: grid; grid-template-columns: minmax(0,1fr); gap: 5px; }
#scavland-map-preview .map-layers .btn { justify-content: flex-start; gap: 4px; padding: 5px; min-height: 36px; font-size: 14px; text-align: left; }
#scavland-map-preview .map-layers .btn[aria-pressed="false"] { opacity: .45; }
#scavland-map-preview .layer-label { flex: 1; min-width: 0; overflow-wrap: anywhere; }
#scavland-map-preview .layer-count { font-size: 11px; }
#scavland-map-preview .layer-help { padding-top: 5px; font-size: 12px; }
#scavland-map-preview .map-layers, #scavland-map-preview .map-layers > *, #scavland-map-preview .map-layers .btn { min-width: 0; }
#scavland-map-preview .layer-icon { display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; flex-shrink: 0; border-radius: 50%; background: #25271f; border: 1px solid var(--category); overflow: hidden; }
#scavland-map-preview .layer-icon :is(img,svg) { width: 17px; height: 17px; }
#scavland-map-preview .map-stage { position: relative; height: 100%; min-width: 0; min-height: 0; overflow: clip; background: var(--map-paper); touch-action: none; cursor: grab; }
#scavland-map-preview .map-stage.is-dragging { cursor: grabbing; }
#scavland-map-preview .map-terrain { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
#scavland-map-preview .map-drawing { position: relative; display: block; width: 100%; height: 100%; }
#scavland-map-preview .world-zones { pointer-events: none; }
#scavland-map-preview .map-route { pointer-events: none; }
#scavland-map-preview .map-route path { fill: none; stroke-linecap: round; stroke-linejoin: round; }
#scavland-map-preview .map-route-outline { stroke: #24251d; stroke-width: 7; opacity: .9; }
#scavland-map-preview .map-route-line { stroke: #f7bd62; stroke-width: 3; }
#scavland-map-preview .map-route-endpoint { fill: none; stroke: #f7bd62; stroke-width: 3; }
#scavland-map-preview .zone { stroke: var(--category); stroke-opacity: .8; stroke-width: 1.25; }
#scavland-map-preview .zone.is-selected { stroke-width: 3; }
#scavland-map-preview .map-selection { pointer-events: none; }
#scavland-map-preview .selected-ring { fill: none; stroke-width: 2; }
#scavland-map-preview .spawn-candidate { fill: var(--map-accent); stroke: var(--map-paper); stroke-width: .6; }
#scavland-map-preview .map-markers { position: absolute; inset: 0; pointer-events: none; }
#scavland-map-preview .map-mark {
    position: absolute; transform: translate(-50%,-50%) scale(var(--marker-scale,1)); pointer-events: auto; cursor: pointer;
    display: flex; align-items: center; justify-content: center; box-sizing: border-box;
    width: var(--marker-size); height: var(--marker-size); padding: 6px;
    border: 2px solid var(--category); border-radius: 50%; background: #20231eed;
    box-shadow: 0 1px 5px #0009, 0 0 6px color-mix(in srgb,var(--category) 40%,transparent);
    color: var(--category); font: inherit; z-index: 1;
}
#scavland-map-preview .map-mark:hover, #scavland-map-preview .map-mark[aria-pressed="true"] { background: #3a3d32; box-shadow: 0 0 0 2px var(--category), 0 2px 6px #0009; }
#scavland-map-preview .map-mark.is-landmark { --marker-scale: 1; z-index: 5; padding: 3px; border-width: 1px; }
#scavland-map-preview .map-mark[data-category="transport"] { z-index: 4; }
#scavland-map-preview .map-mark:focus-visible { z-index: 6; }
#scavland-map-preview .marker-content { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
#scavland-map-preview .map-symbol, #scavland-map-preview .map-portrait { display: block; object-fit: contain; }
#scavland-map-preview .map-mark :is(img,svg) { width: 100%; height: 100%; }
#scavland-map-preview .map-portrait { border-radius: 50%; filter: brightness(1.35) saturate(1.2); }
#scavland-map-preview .place-name {
    position: absolute; top: calc(100% + 4px); left: 50%; transform: translateX(-50%); pointer-events: none;
    width: max-content; max-width: 260px; text-align: center; color: #363330; font: 400 28px/1.05 "Scavland", "Arial Narrow", sans-serif;
    text-shadow: -1px -1px 0 #d8cbbb, 1px -1px 0 #d8cbbb, -1px 1px 0 #d8cbbb, 1px 1px 0 #d8cbbb, 0 2px 3px #d8cbbb;
}
#scavland-map-preview .loot-dot { display: inline-block; width: 12px; height: 12px; flex-shrink: 0; border-radius: 50%; background: var(--category); box-shadow: 0 0 3px #172019; }
#scavland-map-preview .map-mark.is-loot { padding: 0; border: 0; background: transparent; box-shadow: none; z-index: 0; }
#scavland-map-preview .map-mark.is-loot[data-category^="bunkers_"] { z-index: 2; }
#scavland-map-preview .map-mark.is-loot:hover .loot-dot { outline: 2px solid #fff; }
#scavland-map-preview .cluster-count { position: absolute; left: calc(100% - 2px); top: -5px; min-width: 14px; padding: 1px 3px; border-radius: 9px; background: #20231ef2; color: var(--category); font-size: 12px; line-height: 14px; text-align: center; }
#scavland-map-preview .quest-symbol { position: absolute; right: -7px; top: -8px; padding: 2px 4px; border-radius: 50%; background: #20231e; color: var(--category); }
#scavland-map-preview .map-info { display: flex; flex-direction: column; min-width: 0; min-height: 0; gap: 14px; border-left: 1px solid #8c6c3880; padding-left: 12px; }
#scavland-map-preview .selected-location { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; flex: 1; min-height: 0; overflow-y: auto; padding-right: 3px; scrollbar-width: thin; scrollbar-color: #8b7f70 #25271f; }
#scavland-map-preview .selection-picture { flex-shrink: 0; padding: 5px; border: 1px solid var(--category); border-radius: 50%; background: #20231e; }
#scavland-map-preview .selection-picture:empty { display: none; }
#scavland-map-preview .selection-picture :is(img,svg) { width: 56px; height: 56px; }
#scavland-map-preview .selection-copy { min-width: 0; width: 100%; }
#scavland-map-preview .selection-detail { margin-top: 6px; color: #c9bda7; font-size: 14px; line-height: 1.35; }
#scavland-map-preview .selection-choice { width: 100%; max-width: 100%; margin-top: 6px; padding: 4px; border: 1px solid #8b7f70; color: #e3d7bb; background: #25271f; font: 400 14px/1.2 "Scavland", sans-serif; }
#scavland-map-preview .scale-readout { position: absolute; left: 8px; bottom: 6px; padding: 2px 5px; color: var(--map-ink); background: var(--map-paper); font-size: 11px; pointer-events: none; }
#scavland-map-preview .map-load-status { position: absolute; right: 8px; bottom: 6px; padding: 3px 6px; font-size: 12px; color: var(--map-ink); background: var(--map-paper); }
.map-location-list { height: 100%; overflow: auto; color: #e3d7bb; padding: 12px; box-sizing: border-box; }
#scavland-map-preview .selection-extra { width: 100%; min-width: 0; display: grid; gap: 10px; }
#scavland-map-preview .selection-extra:empty { display: none; }
#scavland-map-preview .selection-extra h4 { margin: 4px 0; font: 400 18px/1.2 "Scavland",sans-serif; }
#scavland-map-preview .selection-extra a { color: #e9ce91; text-underline-offset: 3px; }
#scavland-map-preview .map-detail-link { font-size: 12px; }
#scavland-map-preview .map-search-label { display: grid; gap: 4px; font-size: 14px; }
#scavland-map-preview .selection-extra :is(select,input) { box-sizing: border-box; width: 100%; min-width: 0; border: 1px solid #8b7f70; background: #20231e; color: #e3d7bb; padding: 6px; font: 400 14px/1.2 "Scavland",sans-serif; }
#scavland-map-preview .selection-extra :is(input,summary,a):focus-visible { outline: 2px solid #f7bd62; outline-offset: 2px; }
#scavland-map-preview .map-info-note { color: #b8ab95; font-size: 12px; line-height: 1.35; }
#scavland-map-preview .map-item-group { border-top: 1px solid #8c6c3870; padding-top: 5px; }
#scavland-map-preview .map-item-group summary { cursor: pointer; font-size: 16px; padding: 4px 0; }
#scavland-map-preview .map-group-count { font-size: 12px; color: #b8ab95; }
#scavland-map-preview .map-info-table { width: 100%; border-collapse: collapse; font-size: 14px; table-layout: fixed; }
#scavland-map-preview .map-info-table :is(td,th) { padding: 6px 2px; border-bottom: 1px solid #8c6c3838; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
#scavland-map-preview .map-info-table :is(td,th):last-child { width: 54px; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
#scavland-map-preview .map-route-button { width: 100%; box-sizing: border-box; padding: 6px 8px; border: 1px solid #79785d; border-radius: 2px; background: #35392f; color: #e9ce91; font: inherit; text-align: left; cursor: pointer; }
#scavland-map-preview .map-route-button:hover { background: #454a3b; border-color: #c9b783; }
#scavland-map-preview .map-route-button[aria-pressed="true"] { color: #fff0b9; background: #555337; border-color: #f7bd62; box-shadow: inset 3px 0 #f7bd62; }
#scavland-map-preview .map-route-status { color: #f7bd62; font-size: 13px; }
#scavland-map-preview .map-item-name { display: flex; align-items: center; gap: 5px; min-width: 0; }
#scavland-map-preview .map-item-name img { object-fit: contain; flex: 0 0 28px; }
#scavland-map-preview .map-item-name .map-item-sprite { flex: 0 0 28px; width: 28px; height: 28px; }
#scavland-map-preview .map-item-name span { overflow-wrap: anywhere; }
#scavland-map-preview .selection-extra small { display: block; font-size: 11px; line-height: 1.3; margin-top: 3px; color: #b8ab95; }
#scavland-map-preview tr.is-rank-locked { opacity: .55; }
#scavland-map-preview tr:not(.is-rank-locked) .map-rank-lock { display: none; }
#scavland-map-preview .map-loot-items { list-style: none; margin: 0; padding: 0; }
#scavland-map-preview .map-loot-items li { padding: 6px 0; border-bottom: 1px solid #8c6c3838; }
#scavland-map-preview .selection-extra [hidden] { display: none !important; }
#scavland-map-preview .selected-location { display: grid; grid-template-columns: 40px minmax(0,1fr); align-content: start; align-items: start; gap: 8px; }
#scavland-map-preview .selection-picture { padding: 3px; }
#scavland-map-preview .selection-picture :is(img,svg) { width: 32px; height: 32px; }
#scavland-map-preview .selection-picture:empty + .selection-copy { grid-column: 1 / -1; }
#scavland-map-preview .selection-extra { grid-column: 1 / -1; }
#scavland-map-preview .map-global-controls { flex-shrink: 0; padding: 0 2px; }
#scavland-map-preview .map-gray-select { position: relative; display: grid; align-content: center; gap: 3px; min-width: 0; max-width: 100%; min-height: 44px; box-sizing: border-box; padding: 6px; border: 1px solid #95988f; border-radius: 2px; background: linear-gradient(#747870,#454941); color: #f0eee5; box-shadow: inset 0 1px #ffffff30, inset 0 -1px #242821, 0 1px 2px #0008; text-align: center; }
#scavland-map-preview .map-gray-select:hover { border-color: #c0c2b7; background: linear-gradient(#81857b,#53584e); }
#scavland-map-preview .map-gray-select > span { font-size: 11px; line-height: 1.1; white-space: nowrap; pointer-events: none; }
#scavland-map-preview .map-gray-select::after { content: ''; position: absolute; right: 9px; top: 66%; width: 5px; height: 5px; border-right: 2px solid #eee; border-bottom: 2px solid #eee; transform: translateY(-50%) rotate(45deg); pointer-events: none; }
#scavland-map-preview .map-gray-select select { appearance: none; box-sizing: border-box; min-width: 0; width: 100%; padding: 0 12px; border: 0; border-radius: 0; background: transparent; color: inherit; font: 400 16px/1.15 "Scavland",sans-serif; text-align: center; text-align-last: center; cursor: pointer; }
#scavland-map-preview .map-gray-select select option { color: #f0eee5; background: #555852; }
#scavland-map-preview .map-gray-select:focus-within { outline: 2px solid #f7bd62; outline-offset: 2px; }
#scavland-map-preview .map-gray-select select:focus-visible { outline: none; }
#scavland-map-preview .map-info-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-shrink: 0; padding-right: 5px; }
#scavland-map-preview .map-info-heading h2 { flex: 1; min-width: 0; font-size: clamp(18px,1.4vw,22px); text-align: center; }
#scavland-map-preview .map-reputation { flex: 0 1 104px; min-width: 88px; }
#scavland-map-preview [hidden] { display: none !important; }
#scavland-map-preview[data-info-panel="npc"] .selection-detail { display: none; }
#scavland-map-preview[data-info-panel="npc"] .selection-copy { align-self: center; }
#scavland-map-preview[data-info-panel="npc"] .map-info { gap: 8px; }
#scavland-map-preview .map-trader-panel { display: grid; gap: 12px; min-width: 0; }
#scavland-map-preview .map-trader-panel .map-item-search { padding: 4px 6px; font-size: 12px; }
#scavland-map-preview .map-trade-section { min-width: 0; container-type: inline-size; }
#scavland-map-preview .map-trade-heading { display: grid; grid-template-columns: minmax(35px,.85fr) minmax(0,3fr); align-items: center; gap: 8px; margin: 0 0 5px; }
#scavland-map-preview .map-trade-title { text-align: center; }
#scavland-map-preview .map-trade-heading h4 { color: #f5f1e8; font-size: 30px; line-height: 1; margin: 0; }
#scavland-map-preview .map-trade-count { display: block; margin-top: 3px; color: #b8ab95; font-size: 11px; }
#scavland-map-preview .map-trade-prices { width: 100%; table-layout: fixed; border-collapse: collapse; text-align: center; font-size: clamp(11px,5.5cqw,14px); font-variant-numeric: tabular-nums; }
#scavland-map-preview .map-trade-prices caption { padding-bottom: 3px; color: #c9bda7; font-size: 11px; }
#scavland-map-preview .map-trade-prices :is(th,td) { border: 1px solid #79785d65; padding: 3px 1px; font-weight: 400; white-space: nowrap; }
#scavland-map-preview .map-trade-prices th { background: #33362e; }
#scavland-map-preview .map-trade-prices td { background: #1e211a; color: #f3e7ca; }
#scavland-map-preview .map-trade-prices abbr { text-decoration: none; }
#scavland-map-preview .map-mode-bonus { display: block; color: var(--stat-good, #6dd13c); font-size: 10px; line-height: 1.2; }
#scavland-map-preview .map-trade-prices .is-current-mode { background: #4d513b; color: #fff0b9; }
#scavland-map-preview .map-trade-selection { display: grid; gap: 2px; margin: 0 0 7px; font-size: 12px; line-height: 1.25; overflow-wrap: anywhere; }
#scavland-map-preview .map-trade-selected-name { font-weight: 400; color: #ecdfc3; }
#scavland-map-preview .map-trade-selected-info, #scavland-map-preview .map-trade-reputation { color: #abae9b; font-size: 10px; }
#scavland-map-preview .map-trade-reputation { color: var(--stat-good, #6dd13c); }
#scavland-map-preview :is(.map-trade-grid-wrap,.map-loot-grid-wrap) { container-type: inline-size; }
/* Crop the supplied PNG to its first 10 columns (487px); retain its 14-row vertical repeat. */
#scavland-map-preview :is(.map-trade-grid,.map-loot-grid) { display: grid; grid-template-columns: repeat(10,minmax(0,1fr)); grid-auto-flow: row dense; grid-auto-rows: calc(100cqw * 661 / 487 / 14); align-content: start; background: url("/2_Images/info-grid.0ac04fbf34c3.webp") left top / calc(100% * 538 / 487) auto repeat-y; }
#scavland-map-preview :is(.map-trade-item,.map-loot-item) { position: relative; display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 0; margin: 0; padding: 2px; border: 1px solid #ab987a20; border-radius: 0; background: #84816a15; color: #e3d7bb; cursor: pointer; }
#scavland-map-preview :is(.map-trade-item,.map-loot-item) :is(img,.map-item-sprite) { width: 100%; height: 100%; object-fit: contain; image-rendering: pixelated; pointer-events: none; filter: drop-shadow(0 1px 1px #000); }
#scavland-map-preview .map-item-sprite { display: block; overflow: hidden; image-rendering: pixelated; }
#scavland-map-preview :is(.map-trade-item,.map-loot-item):is(:hover,[aria-pressed="true"]) { background: #c7b78435; border-color: #cfbd8c; z-index: 1; }
#scavland-map-preview :is(.map-trade-item,.map-loot-item):focus-visible { outline-offset: -2px; z-index: 2; }
#scavland-map-preview .map-trade-item.is-rank-locked { opacity: .35; }
#scavland-map-preview .map-trade-item .map-rank-lock { position: absolute; bottom: 0; right: 1px; color: #ffe7aa; background: #151610d9; font-size: 10px; line-height: 1; }
#scavland-map-preview .map-trade-item:not(.is-rank-locked) .map-rank-lock { display: none; }
#scavland-map-preview .map-trade-fallback { font: 400 9px/1 "Scavland",sans-serif; overflow-wrap: anywhere; }
/* Forward placement preserves rarity order; dense placement could backfill a common item before a rare one. */
#scavland-map-preview .map-loot-grid { grid-auto-flow: row; }
#scavland-map-preview .map-drop-group summary { margin-bottom: 6px; }
#scavland-map-preview .map-loot-selection { display: grid; gap: 3px; margin-bottom: 7px; font-size: 12px; line-height: 1.25; overflow-wrap: anywhere; }
#scavland-map-preview .map-loot-selected-name { color: #ecdfc3; font-weight: 400; }
#scavland-map-preview .map-loot-selected-info { color: #abae9b; font-size: 11px; }
#scavland-map-preview .map-loot-toolbar { display: grid; grid-template-columns: minmax(0,1fr) minmax(105px,1.5fr); align-items: center; gap: 8px; }
#scavland-map-preview .map-drop-notes { margin-top: 10px; font-size: 12px; }
#scavland-map-preview .map-drop-notes summary { cursor: pointer; color: #c9bda7; }
#scavland-map-preview .map-drop-notes .map-info-note { margin-top: 5px; }
#scavland-map-preview .map-loot-sort { display: grid; gap: 3px; width: 100%; box-sizing: border-box; padding: 6px 8px; border: 1px solid #95988f; border-radius: 2px; background: linear-gradient(#747870,#454941); color: #f0eee5; font: 400 11px/1.15 "Scavland",sans-serif; text-align: center; cursor: pointer; }
#scavland-map-preview .map-loot-sort:hover { border-color: #c0c2b7; background: linear-gradient(#81857b,#53584e); }
#scavland-map-preview .map-loot-sort-order { font-size: 15px; }
@media (max-width: 900px) and (orientation: portrait) { .content-panel[data-view="map"] { display: none; } }
@media (max-height: 600px) and (orientation: landscape) {
    .map-content #scavland-map-preview { padding: 6px; gap: 7px; }
    #scavland-map-preview .map-sidebar { gap: 6px; }
    #scavland-map-preview .map-zoom { top: 6px; left: 6px; }
    #scavland-map-preview .map-info { gap: 10px; padding-left: 8px; }
}

/* Text stays sharp at every scale and uses the supplied game font. */
.site-brand {
    margin: 0;
    color: #d4be78;
    font: 400 clamp(12px, 1.4vw, 20px)/1.1 "Scavland", "Arial Narrow", sans-serif;
    white-space: nowrap;
    text-shadow: 0 1px 2px #000, 0 0 5px #000b;
    pointer-events: none;
}
.home-brand {
    position: fixed;
    right: max(16px, env(safe-area-inset-right));
    bottom: max(12px, env(safe-area-inset-bottom));
    z-index: 11;
}
body:has(.content-panel:not([hidden])) .home-brand { display: none; }
.panel-brand {
    position: absolute;
    top: calc(100% + 3px);
    right: 0;
}
.content-panel[data-view="map"] > .panel-brand { display: none; }

/* Anchor to the map viewport so panning and zooming never move the watermark. */
#scavland-map-preview .map-brand {
    position: absolute;
    right: 10px;
    bottom: 7px;
    z-index: 8;
    padding: 3px 6px;
    border-radius: 2px;
    background: #25271fb8;
    color: #e3d7bb;
    opacity: .85;
    font-size: clamp(11px, 1.3vw, 18px);
}
#scavland-map-preview .map-load-status { bottom: 36px; }
#scavland-map-preview .scale-readout { max-width: calc(100% - 195px); }

@media (max-width: 1000px) and (max-height: 600px) and (orientation: landscape) {
    .panel-brand { top: calc(100% + 1px); font-size: 10px; line-height: 1; }
    #scavland-map-preview .map-brand { right: 5px; bottom: 5px; padding: 2px 4px; }
    #scavland-map-preview .scale-readout { max-width: calc(100% - 140px); }
}
@media (max-width: 900px) and (orientation: portrait) {
    body:has(.content-panel:not([hidden])) .home-brand { display: block; }
}