/* Shared interface contract, loaded after component styles.
   Regional paintings style content; navigation and controls stay black/orange/white.
   Artwork, weather, rarity colours and game boards retain their own styling. */
/* Keep Lore above the visible map corner, outside its mobile scrolling area.
   Native popovers use the top layer and work without JavaScript or a fetch. */
.region-map-frame { position: relative; margin: 1.5rem 0; }
.region-map-frame > .route-map { margin: 0; }
#content .region-lore-button { position: absolute; top: .8rem; right: .8rem; z-index: 2; min-height: 44px; margin: 0; padding: .6rem .9rem; }
#content .region-lore-panel {
  box-sizing: border-box; width: min(46rem, calc(100vw - 1rem));
  max-height: calc(100dvh - 2rem); margin: auto; padding: 0;
  overflow: auto; overscroll-behavior: contain; border: 2px solid #f09a24;
  border-radius: 0; color: #171717; background: #fff;
  box-shadow: 0 10px 40px #0006; font-family: Arial, Helvetica, sans-serif;
}
.region-lore-panel::backdrop { background: #0008; }
#content .region-lore-heading { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .7rem 1rem; background: #111; color: #fff; border-bottom: 3px solid #f09a24; }
#content .region-lore-heading h2 { margin: 0; color: inherit; font-size: 1.2rem; line-height: 1.3; }
#content .region-lore-heading button { flex-shrink: 0; margin: 0; }
#content .region-lore-body { padding: .25rem 1rem 1rem; overflow-wrap: anywhere; line-height: 1.6; }
#content .region-lore-body section { margin: 0; padding: 1rem 0; border-bottom: 1px solid #ccc; background: transparent; }
#content .region-lore-body section:last-child { border-bottom: 0; padding-bottom: 0; }
#content .region-lore-body h3 { margin: 0 0 .75rem; font-size: 1.15rem; color: #171717; }
#content .region-lore-body h4 { margin: 1.15rem 0 .25rem; font-size: 1rem; color: #171717; }
#content .region-lore-body p { margin: .5rem 0; }
#content .region-lore-body a { color: #8c4300; text-decoration: underline; text-underline-offset: .15em; }
#content .region-lore-body a:hover { color: #111; }
#content .region-lore-body a.thing-link { color: var(--rarity-link-color, #8c4300); }
#content .region-lore-body .region-lore-habitat { margin-top: 0; font-size: .8rem; font-weight: 700; color: #555; }
@media (max-width: 480px) {
  #content .region-lore-heading { padding: .6rem .75rem; }
  #content .region-lore-body { padding-inline: .75rem; }
}
/* Future-find preferences, separate from recycling stored Things. */
.world-welcome .welcome-progression { padding: clamp(2rem, 4.5vw, 4rem); border-top: 4px solid var(--welcome-gold); background: #f5efdf; scroll-margin-top: 1rem; }
.welcome-progression-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; list-style: none; margin: 0; padding: 0; }
.welcome-progression-grid > li { display: flex; min-width: 0; flex-direction: column; align-items: start; gap: .8rem; padding: 1.3rem; border: 1px solid #c7b999; background: #fffbf2; }
.world-welcome .welcome-progression-number { color: #855318; font: 900 .75rem/1.4 Arial, Helvetica, sans-serif; letter-spacing: .12em; }
.world-welcome .welcome-progression-grid h3 { font-size: 1.25rem; }
.world-welcome .welcome-progression-grid p { margin: 0; font-size: .9rem; line-height: 1.65; }
.welcome-progression-grid a { display: inline-flex; align-items: center; min-height: 44px; margin-top: auto; color: #70430e; font-size: .8rem; font-weight: 700; text-underline-offset: .2em; }
.world-welcome .welcome-fleet-colours { display: flex; flex-wrap: wrap; gap: .25rem; }
.welcome-fleet-colours > strong { flex-basis: 100%; font-size: .75rem; }
.welcome-fleet-colours > span { padding: .15rem .4rem; color: #111; border: 1px solid #0003; font-size: .75rem; font-weight: 700; }
.welcome-tier-yellow { background: #d7d23a; }.welcome-tier-green { background: #91c54b; }.welcome-tier-blue { background: #73a9c7; }
.welcome-tier-red { background: #d45a45; }.welcome-tier-purple { background: #a868aa; }.welcome-tier-orange { background: #f2a249; }
.world-welcome .welcome-progression-pace { margin-top: 1.4rem; max-width: 75ch; font-size: .9rem; }
@media (max-width: 1100px) { .welcome-progression-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 650px) { .world-welcome .welcome-progression { padding: 2.3rem 1.25rem; }.welcome-progression-grid { grid-template-columns: minmax(0, 1fr); } }
.convoy-market-card, .convoy-market-member { min-width: 0; padding: 1rem; border: 1px solid var(--line, #ccc); background: var(--paper, #fff); color: #161616; overflow-wrap: anywhere; }
.convoy-market-card > header, .convoy-market-member > header { display: flex; gap: .75rem; align-items: center; }
.convoy-market-card > header > div, .convoy-market-member > header > div { min-width: 0; }
.convoy-market-card > header img, .convoy-market-member > header img { flex: 0 0 64px; width: 64px; height: 64px; object-fit: contain; }
.convoy-market-card h3, .convoy-market-member h2 { margin: .25rem 0; }
.convoy-market-card form, .convoy-market-offer form { margin-block: .65rem 0; }
.convoy-market-members { display: grid; gap: 1rem; }
.convoy-market-contents { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: .75rem; }
.convoy-market-contents ul { margin: 0; padding-inline-start: 1.25rem; }
.convoy-market-contents h3 { margin-block: .4rem; }
.convoy-settings :is(input, select) { min-width: 0; max-width: 100%; box-sizing: border-box; }
.convoy-market-offer :is(button, .button), .convoy-market-card :is(button, .button) { white-space: normal; max-width: 100%; }
.inventory-settings-actions { margin-block: -.25rem 1rem; }
.recycling-settings-page section { margin-block-end: 1.5rem; }
.recycling-settings-filter, .recycling-rule-actions { display: flex; flex-wrap: wrap; align-items: end; gap: .65rem; margin-block: 1rem; }
.recycling-settings-filter label { display: flex; flex: 1 1 14rem; flex-direction: column; gap: .35rem; min-width: 0; font-weight: 700; }
.recycling-settings-filter :is(input, select) { width: 100%; min-width: 0; box-sizing: border-box; }
.recycling-settings-filter > .text-link { display: inline-flex; align-items: center; min-height: 44px; }
.recycling-rule-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); gap: .75rem; }
.recycling-settings-page .recycle-setting-item { min-width: 0; margin: 0; }
.recycling-settings-page .recycling-rule-list > .item-card { grid-template-columns: minmax(0, 1fr); align-content: start; }
.recycling-settings-page .recycling-rule-list .item-card-actions { display: block; min-width: 0; }
.recycle-item-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
#content .recycling-settings-page .checkbox-line { display: flex; align-items: center; gap: .65rem; min-height: 44px; margin: 0; font-weight: 700; cursor: pointer; }
#content .recycling-settings-page input[type="checkbox"] { flex: 0 0 auto; width: 20px; min-height: 20px; margin: 0; }

#content .creature-record > .battle-countermeasures { padding: 0 clamp(1.1rem, 3vw, 2rem) 1rem; }
#content .creature-record > .battle-countermeasures ul { margin: .65rem 0; padding-inline-start: 1.25rem; }
#content .creature-record > .battle-countermeasures li > p { margin: .25rem 0 .65rem; }
#content .battle-countermeasures h2 { font-family: Arial, Helvetica, sans-serif; }
#content .creature-record > .battle-countermeasures > :last-child { margin-bottom: 0; }

/* Living-threat illustrations share the Things shimmer and retain their colours. */
.creature-inspection { --creature-glow: #b64a3e; }
.creature-inspection.rarity-1 { --creature-glow: #d7d23a; }
.creature-inspection.rarity-2 { --creature-glow: #91c54b; }
.creature-inspection.rarity-3 { --creature-glow: #73a9c7; }
.creature-inspection.rarity-4 { --creature-glow: #d45a45; }
.creature-inspection.rarity-5 { --creature-glow: #a868aa; }
.creature-inspection.rarity-6 { --creature-glow: #f2a249; }
#content .creature-inspection .inspection-heading { flex-wrap: wrap; gap: 1.25rem; }
#content .creature-inspection .inspection-heading > div { flex: 1 1 12rem; }
#content .creature-portrait {
  position: relative; isolation: isolate; display: grid; place-items: center;
  flex: 0 1 300px; width: 300px; max-width: 100%; aspect-ratio: 3 / 2;
  box-sizing: border-box; overflow: hidden; padding: 14px;
  background: radial-gradient(ellipse at 50% 45%, color-mix(in srgb, var(--creature-glow) 28%, #18232a), #111c23 78%);
  border: 1px solid color-mix(in srgb, var(--creature-glow) 65%, #283237);
  box-shadow: inset 0 0 0 3px #ffffff08, 0 3px 12px #14201b33;
  --item-shimmer-delay: -4.6s;
}
#content .creature-portrait > img {
  display: block; width: 100%; height: 100%; min-height: 0; object-fit: contain;
  filter: drop-shadow(0 0 9px color-mix(in srgb, var(--creature-glow) 60%, transparent));
}
#content .creature-portrait .item-lustre { inset: 14px; }
@media (max-width: 760px) {
  #content .creature-inspection .inspection-heading { flex-direction: column; align-items: stretch; }
  #content .creature-inspection .inspection-heading > div { flex: none; }
  #content .creature-portrait { flex: none; align-self: center; }
}

:root {
  --ui-ink: #203b3d; --ui-muted: #586663; --ui-paper: #fffaf0;
  --ui-soft: #f0ebdc; --ui-line: #b4a079; --ui-dark: #171a18;
  --ui-orange: #f09a24; --ui-danger: #963e36;
  --ui-brass: #9b733a; --ui-heading: Arial, Helvetica, sans-serif;
  --ui-scene: url('/node/maps/scene-map-background.webp');
  --ui-paper-wash: radial-gradient(ellipse at top left, #fffef7 0, #fffaf0 48%, #f4ecd9 100%);
  --ui-frame-shadow: inset 0 0 0 3px #fff9e867, 0 3px 9px #17353a12;
}

/* Persistent inbox access beside the miner name on phones. */
.mobile-header-messages { display: none; }
@keyframes mobile-message-shake {
  0%, 18%, 100% { transform: rotate(0); }
  3%, 9% { transform: rotate(-14deg); }
  6%, 12% { transform: rotate(14deg); }
  15% { transform: rotate(-7deg); }
}
@media (max-width: 900px) {
  .authenticated-shell .game-header { grid-template-columns: auto minmax(0, 1fr) 44px auto; column-gap: .25rem; }
  .mobile-header-chat { grid-column: 4; }
  .mobile-header-messages {
    position: relative; grid-column: 3; grid-row: 1; display: inline-flex;
    align-items: center; justify-content: center; width: 44px; min-height: 44px;
    padding: .4rem; border: 1px solid #666b60; border-radius: 0;
    color: #d6d4cd; background: #171a18; text-decoration: none;
  }
  .mobile-header-messages svg { width: 24px; height: 24px; transform-origin: center; }
  .mobile-header-messages:is(:hover, [aria-current="page"], .has-unread) { color: #ffc16c; background: #302a1d; border-color: #ab7e3c; }
  .mobile-header-messages:focus-visible { outline: 2px solid #fff1ad; outline-offset: 2px; }
  .mobile-header-messages.has-unread svg { animation: mobile-message-shake 3.5s ease-in-out infinite; }
  .mobile-message-unread { position: absolute; top: 4px; right: 4px; width: 6px; height: 6px; border-radius: 50%; background: var(--ui-orange); }
}
@media (max-width: 420px) {
  .authenticated-shell .site-wordmark { gap: .35rem; }
  .authenticated-shell .site-mark { display: none; }
  .authenticated-shell .site-wordmark strong { max-width: 4.5rem; font-size: .92rem; line-height: 1.05; white-space: normal; }
}
@media (prefers-reduced-motion: reduce) {
  .mobile-header-messages.has-unread svg { animation: none; }
}
.game-shell #content { padding: 1.25rem clamp(.75rem, 2vw, 1.75rem) 2rem; font-family: Arial, Helvetica, sans-serif; font-size: .9rem; line-height: 1.45; }
#content :where(section, article, header, footer, div, form, fieldset, details, label, nav, dl) { min-width: 0; }
#content :where(p, h1, h2, h3, h4, dd, label) { overflow-wrap: break-word; }
#content :where(p) { line-height: 1.45; }
#content .page-title {
  --link: #ffe2a0;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: .65rem 1rem; margin: 0 0 1rem; padding: .85rem 1rem; min-height: 0;
  color: #fff7e6; background: linear-gradient(90deg, #102e35f5 0%, #173a40dc 38%, #172d32bd 100%), var(--ui-scene) center 44% / cover;
  border: 1px solid #ad8950; border-top: 1px solid #e5c88a;
  border-radius: 8px 8px 4px 4px; box-shadow: inset 0 0 0 4px #e8d29b24, 0 5px 14px #18343720;
}
#content .page-title > div { flex: 1 1 24rem; width: auto; }
#content .page-title > div:not(:first-child) { flex: 0 1 auto; }
#content .page-title h1 { margin: 0; color: #fff8ea; font: 700 clamp(1.65rem, 2.6vw, 2.25rem)/1.12 var(--ui-heading); text-align: left; text-transform: none; letter-spacing: -.02em; text-wrap: pretty; text-shadow: 0 2px 3px #061b21; }
#content .page-title :is(p, .commerce-lede) { margin: .4rem 0 0; max-width: 48rem; color: #d4d1c7; font: .84rem/1.45 Arial, sans-serif; }
#content .page-title .eyebrow { margin: 0 0 .35rem; color: #f4b75e; font: 800 .65rem/1.3 Arial, sans-serif; letter-spacing: .1em; }
#content .page-title > p { flex: 1 1 20rem; }
#content .page-title > a:not(.button) { display: inline-flex; align-items: center; min-height: 44px; margin: 0; padding: .4rem 0; color: #ffd08c; border: 0; font-size: .8rem; }
#content .page-title > form { width: auto; max-width: 100%; }
#wrapper #content :is(h2, h3, h4):not(:where(.city-plan *, .casino-hall *, .casino-machine *, .home-dream *, .world-welcome *)) { font-family: var(--ui-heading); line-height: 1.3; letter-spacing: 0; }
#wrapper #content h2:not(:where(.city-plan *, .casino-hall *, .casino-machine *, .home-dream *, .world-welcome *)) { font-size: 1.2rem; font-weight: 700; text-transform: none; letter-spacing: -.01em; }
#wrapper #content h3:not(:where(.city-plan *, .casino-hall *, .casino-machine *, .home-dream *, .world-welcome *)) { font-size: 1.1rem; font-weight: 700; }
#content > section:not(.page-title) { margin-bottom: 1.25rem; }
#content :is(.commerce-section-heading, .industry-section-heading, .city-place-section-head) { margin-bottom: .6rem; }
#content :is(.commerce-section-heading, .industry-section-heading, .city-place-section-head) h2 { margin: 0; }
#content .eyebrow { letter-spacing: .1em; }
/* NPC lists use the established tier colour instead of repeating its name. */
#content .threat-card :is(h3, h4) .threat-record-link:any-link {
  color: color-mix(in srgb, var(--threat-accent) 82%, white);
  text-decoration: none;
}
#content .threat-card .threat-record-link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

/* Box selection uses native radios so the whole illustrated choice is clickable. */
.packing-page { max-width: 60rem; padding: 1rem; border: 1px solid var(--ui-line); background: var(--ui-paper); }
.packing-subject { display: flex; align-items: center; gap: .8rem; margin-bottom: 1rem; }
.packing-subject > div, .packing-choice-copy { min-width: 0; }
.packing-subject h2 { margin: 0; font-size: 1.2rem; overflow-wrap: anywhere; }
.packing-subject p { margin: .35rem 0 0; }
.packing-picker { margin: 0 0 1rem; padding: 0; border: 0; }
.packing-picker legend { padding: 0 0 .5rem; font-weight: 700; }
.packing-choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: .5rem; }
#content label.packing-choice { display: grid; grid-template-columns: 20px 48px minmax(0, 1fr); align-items: center; gap: .6rem; min-height: 88px; margin: 0; padding: .65rem; color: var(--ui-ink); background: #fffdf7; border: 1px solid var(--ui-line); cursor: pointer; font-size: .85rem; font-weight: 400; }
#content label.packing-choice:has(:checked) { border-color: #8c4b00; background: #fff0d7; box-shadow: inset 0 0 0 1px #8c4b00; }
#content label.packing-choice:has(:focus-visible) { outline: 3px solid #176a83; outline-offset: 2px; }
#content .packing-choice input[type="radio"] { width: 20px; height: 20px; min-height: 20px; margin: 0; }
.packing-choice-art { display: grid; flex: 0 0 48px; width: 48px; height: 52px; place-items: center; }
.packing-choice-art img { width: 48px; height: 48px; object-fit: contain; }
#content .packing-choice span { opacity: 1; }
.packing-choice-copy :is(strong, span, small) { display: block; }
.packing-choice-copy strong { color: var(--rarity-link-color, var(--ui-ink)); overflow-wrap: anywhere; }
.packing-choice-copy span { margin-top: .2rem; }
.packing-choice-copy small { margin-top: .2rem; color: var(--ui-muted); font-size: .75rem; }
.packing-quantity { display: flex; flex-wrap: wrap; align-items: end; gap: .5rem; }
.packing-quantity label { flex: 1 1 10rem; max-width: 16rem; }
.packing-quantity input { display: block; width: 100%; box-sizing: border-box; }
.packing-preview { display: block; margin: .7rem 0; padding: .65rem; color: var(--ui-ink); background: var(--ui-soft); border-left: 3px solid var(--ui-orange); font-size: .85rem; }
.packing-preview[hidden] { display: none; }
.storage-choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 25rem), 1fr)); gap: .65rem; }
.storage-choice { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .6rem; padding: .85rem; background: var(--ui-paper); border: 1px solid var(--ui-line); }
.storage-choice > div { min-width: 0; }
.storage-choice h2 { margin: 0; font-size: 1.05rem; }
.storage-choice p { margin: .25rem 0 0; font-size: .85rem; }
.storage-choice form { margin: 0; }
.storage-choice > .field-help { grid-column: 1 / -1; }

/* Standard actions. Structured game controls retain their artwork and layout. */
#content :is(button, .button):not(:where(.google-pay-button *)) { min-width: 44px; min-height: 44px; overflow-wrap: normal; word-break: normal; max-width: 100%; border-radius: 0; font-family: Arial, Helvetica, sans-serif; font-size: .75rem; font-weight: 800; line-height: 1.3; letter-spacing: .035em; white-space: normal; text-align: center; }
#content :is(button, .button):not(:where(.google-pay-button *)):not(:where(.casino-pull, .detonator-option, .vehicle-comparison-sort, .oil-field *, .item-picker-option, .avatar-choice)) { padding: .6rem .8rem; color: #21180c; background: var(--ui-orange); border: 1px solid #b97012; box-shadow: none; text-transform: uppercase; text-decoration: none; }
#content :is(button, .button):not(:where(.google-pay-button *)):is(.secondary, .commerce-rental-term) { color: #fff; background: var(--ui-dark); border-color: #3d423e; }
#content .page-title :is(button, .button).secondary { color: #fff; background: #303530; border-color: #697065; }
#content :is(button, .button):not(:where(.google-pay-button *)):is(.link, .link-button) { padding: .5rem .35rem; color: var(--link); background: transparent; border: 0; font-size: .8rem; letter-spacing: 0; text-transform: none; text-decoration: underline; text-underline-offset: .2em; }
#content :is(button, .button):not(:where(.google-pay-button *)).danger { color: #fff; background: var(--ui-danger); border-color: #793023; }
#content :is(button, .button):not(:where(.google-pay-button *)):disabled { opacity: 1; color: #625e55; background: #e2dccf; border-color: #bfb5a3; cursor: not-allowed; filter: none; }
#content :is(button, .button):not(:where(.google-pay-button *)):hover:not(:disabled) { filter: brightness(1.08); }
#content :is(a, button, summary, input, select, textarea, [tabindex]):focus-visible { outline: 3px solid #176a83; outline-offset: 3px; }
#content .page-title :is(a, button, input, select):focus-visible { outline-color: #ffd08c; }
#content .button-row { display: flex; flex-wrap: wrap; gap: .5rem; }
#content .button-row > :is(a, button, form) { max-width: 100%; }
#content .button-row > form { margin: 0; }
#content :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not([type="hidden"]) { min-height: 44px; min-width: 0; max-width: 100%; margin-top: .3rem; padding: .6rem .65rem; color: var(--ui-ink); background: #fffdf7; border: 1px solid #948772; border-radius: 0; font: 1rem/1.3 Arial, Helvetica, sans-serif; box-shadow: none; }
#content :is(input[type="checkbox"], input[type="radio"]) { accent-color: #a65b00; flex: 0 0 auto; }
#content label { color: inherit; font-family: Arial, Helvetica, sans-serif; line-height: 1.4; }
#content label:has(> :is(input[type="checkbox"], input[type="radio"])) { min-height: 44px; align-content: center; }
#content summary { min-height: 44px; align-content: center; cursor: pointer; font-family: Arial, Helvetica, sans-serif; line-height: 1.4; }
#content fieldset { min-inline-size: 0; }
#content .ui-help { margin: .65rem 0; padding: 0 .75rem; background: var(--ui-soft); border: 1px solid var(--ui-line); }
#content .ui-help > summary { padding: .6rem 0; font-size: .8rem; font-weight: 700; }
#content .ui-help > :not(summary) { font-size: .84rem; }
#content .ui-help[open] > summary { margin-bottom: .6rem; border-bottom: 1px solid var(--ui-line); }

#content .transport-find-destination { clear: both; }

/* Paper surfaces. Existing rarity edges and working/error states remain distinct. */
#content :is(.shop-card, .mine, .detail, .trade-forms > form, .account-grid > form, .vehicle-card, .vehicle-hero, .vehicle-loadout, .loadout-preview, .capacity-budget, .factory-card, .credit-bundle, .message-row, .message-detail, .message-bubble, .guild-panel, .guild-membership, .guild-create, .guild-directory, .guild-bank-panel, .market-controls, .recycling-bank, .container-card, .admin-region-card, .mine-roster-row, .mine-shift-card, .industry-build, .commerce-empty, .industry-empty, .commerce-rules, .industry-disclosure, .industry-action-note, .industry-repair-picker, .passenger-ticket, .keys-drydock-tier) { color: var(--ui-ink); background-color: var(--ui-paper); border-color: var(--ui-line); border-radius: 0; box-shadow: none; }
#content :is(.trade-forms > form, .account-grid > form, .vehicle-card, .vehicle-hero, .vehicle-loadout, .loadout-preview, .capacity-budget, .credit-bundle, .message-detail) { padding: .85rem; }
#content :is(.trade-forms, .account-layout, .factory-list, .vehicle-grid, .stats-grid, .credit-grid) { gap: .75rem; }
#content :is(.account-grid > form, .trade-forms > form) > h2:first-child { margin: 0 0 .75rem; }
#content :is(.city-venue, .city-industry, .commerce-page) {
  --venue-ink: var(--ui-ink); --venue-paper: var(--ui-paper); --venue-line: var(--ui-line);
  --industry-ink: var(--ui-ink); --industry-paper: var(--ui-paper); --industry-line: var(--ui-line);
  --commerce-ink: var(--ui-ink); --commerce-paper: var(--ui-paper); --commerce-line: var(--ui-line);
}
#content .city-return { background: var(--ui-dark); border-top-color: var(--ui-orange); border-radius: 0; }
#content .city-return :is(a, span) { font-family: Arial, Helvetica, sans-serif; }
#content .city-venue-interests { background: var(--ui-soft); border-color: var(--ui-line); }
#content .city-venue-body { padding-top: .65rem; }
#content :is(.commerce-ledger, .industry-metrics, .admin-metrics) { gap: 1px; margin: 0 0 .85rem; border: 1px solid var(--ui-line); background: var(--ui-line); }
#content :is(.commerce-ledger, .industry-metrics, .admin-metrics) > div { color: var(--ui-ink); background: var(--ui-soft); padding: .65rem .75rem; border: 0; }
#content :is(.commerce-ledger, .industry-metrics, .admin-metrics) dt { color: var(--ui-muted); font: 700 .65rem/1.35 Arial, sans-serif; letter-spacing: .035em; text-transform: uppercase; }
#content :is(.commerce-ledger, .industry-metrics, .admin-metrics) dd { color: var(--ui-ink); font: 800 1.1rem/1.3 Arial, sans-serif; margin: .2rem 0 0; font-variant-numeric: tabular-nums; }
#content :is(.commerce-card-facts dd, .commerce-balance strong, .commerce-capacity) { font-family: Arial, Helvetica, sans-serif; }
#content .commerce-balance { background: #303530; }
#content .commerce-rental-term :is(.commerce-saving, .commerce-term-note) { color: #e5d8bd; }
#content :is(.industry-mine-portrait, .industry-loadout-portrait, .factory-queue, .factory-action, .factory-bot-market) { background: var(--ui-soft); border-color: var(--ui-line); }

/* Section navigation follows the main menu. */
#content :is(.rating-tabs, .world-map-tabs, .article-index, .guild-subnav, .commerce-jumps, .vehicle-tabs, .message-tabs, .admin-tabs, .loadout-navigation, .message-filters, .commerce-subnav, .city-place-tabs, .profile-jumps, .editorial-switcher) { display: flex; flex-wrap: wrap; gap: 0; padding: 0; margin: .75rem 0; background: var(--ui-dark); border: 1px solid #414741; border-radius: 0; }
#content :is(.rating-tabs, .world-map-tabs, .article-index, .guild-subnav, .commerce-jumps, .vehicle-tabs, .message-tabs, .admin-tabs, .loadout-navigation, .message-filters, .commerce-subnav, .city-place-tabs, .profile-jumps, .editorial-switcher) a { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-height: 44px; max-width: 100%; padding: .6rem .75rem; color: #eee7d8; background: transparent; border: 0; border-right: 1px solid #414741; border-radius: 0; font: 800 .7rem/1.3 Arial, sans-serif; letter-spacing: .035em; text-transform: uppercase; white-space: normal; text-align: center; text-decoration: none; }
#content :is(.rating-tabs, .world-map-tabs, .article-index, .guild-subnav, .commerce-jumps, .vehicle-tabs, .message-tabs, .admin-tabs, .loadout-navigation, .message-filters, .commerce-subnav, .city-place-tabs, .profile-jumps, .editorial-switcher) a:is([aria-current="page"], .active, .current-world) { color: #21180c; background: var(--ui-orange); box-shadow: none; }
#content .commerce-jumps a strong { color: inherit; }
#content :is(.rating-tabs, .world-map-tabs, .article-index, .guild-subnav, .commerce-jumps, .vehicle-tabs, .message-tabs, .admin-tabs, .loadout-navigation, .message-filters, .commerce-subnav, .city-place-tabs, .profile-jumps, .editorial-switcher) a:hover { color: #fff; background: #343a34; }
#content .table-scroll { max-width: 100%; overflow-x: auto; }
#content table { font-size: .82rem; }
#content :is(th, td) { padding: .6rem .65rem; }
#content th { font: 800 .65rem/1.4 Arial, sans-serif; letter-spacing: .045em; }
#content .loadout-comparison { table-layout: auto; font-size: .76rem; }
#content .loadout-comparison :is(th, td) { padding: .45rem .3rem; font-size: inherit; letter-spacing: 0; }
#content .loadout-comparison :is(th, td):not(:first-child) { white-space: nowrap; overflow-wrap: normal; word-break: normal; }
#content :is(.empty, .empty-state, .guild-empty) { color: var(--ui-muted); font-size: .85rem; }
#content .vehicle-shuttle-categories { grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)); gap: .15rem .5rem; }
#content .vehicle-shuttle-categories label { margin: 0; }

@media (max-width: 700px) {
  .game-shell #content { padding: .75rem .75rem 1.5rem; font-size: .88rem; }
  #content .page-title { padding: .75rem; gap: .5rem; margin-bottom: .75rem; }
  #content .page-title > :is(div, p) { flex-basis: 100%; }
  #content .page-title > :is(a, form) { justify-self: start; }
  #content .page-title > a.button { flex: 0 1 auto; }
  #content .page-title h1 { font-size: 1.4rem; }
  #content :is(.auth-grid, .account-layout, .admin-backup-controls, .trade-forms) { grid-template-columns: minmax(0, 1fr); }
  #content :is(.shop-card, .mine, .factory-card, .vehicle-hero, .vehicle-loadout, .capacity-budget, .loadout-preview) { padding: .75rem; }
  #content :is(.market-controls, .market-search, .maintenance-control, .maintenance-control-form) { grid-template-columns: minmax(0, 1fr); }
  #content .market-controls { gap: .5rem; }
  #content .market-controls label { margin: 0; }
  #content :is(.industry-metrics, .admin-metrics) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #content .commerce-ledger { grid-template-columns: repeat(auto-fit, minmax(6rem, 1fr)); }
  #content .vehicle-shuttle-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #content .button-row { align-items: stretch; }
  #content .button-row > :is(a, button) { flex: 1 1 auto; }
  #content :is(.industry-disclosure, .commerce-rules, .ui-help) { margin-block: .65rem; }
}
@media (prefers-reduced-motion: reduce) {
  #content :is(button, .button, summary) { scroll-behavior: auto; transition: none; }
}

#content section.account-grid { padding: 0; background: none; border: 0; box-shadow: none; }
#content .shuttle-category-picker { grid-column: 1 / -1; }
#content .shuttle-category-picker fieldset { padding: 0; border: 0; }
#content [data-shuttle-category-count] { float: right; margin-left: .5rem; color: var(--ui-muted); font-weight: 400; }
#content .gadget-effect > summary { font-size: .8rem; color: var(--link); }
#content .gadget-card { padding: .85rem; gap: .6rem; background: var(--ui-paper); }

@media (max-width: 600px) {
  #content .ui-record-table { display: block; width: 100%; min-width: 0; background: none; border: 0; }
  #content .ui-record-table > thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  #content .ui-record-table > tbody { display: grid; gap: .65rem; }
  #content .ui-record-table > tbody > tr { display: grid; grid-template-columns: minmax(0, 1fr); padding: .65rem; background: var(--ui-paper); border: 1px solid var(--ui-line); }
  #content .ui-record-table td { display: block; min-width: 0; padding: .4rem 0; border: 0; overflow-wrap: anywhere; }
  #content .ui-record-table td[data-label]:not([data-label=""])::before { content: attr(data-label); display: block; margin-bottom: .25rem; color: var(--ui-muted); font: 700 .65rem/1.3 Arial, sans-serif; letter-spacing: .035em; text-transform: uppercase; }
  #content .ui-record-table .item { margin: 0; }
  #content .ui-record-table form { min-width: 0; max-width: 100%; flex-wrap: wrap; }
  #content .ui-record-table label { margin: 0 0 .4rem; }
}

/* Detail pages and utility panels use the same compact spacing. */
#content :is(.panel, .profession-card, .gadget-card, .guild-draft-panel, .guild-draft-card, .recycle-settings, .verification-card, .account-auth-card) { background: var(--ui-paper); border: 1px solid var(--ui-line); border-radius: 0; box-shadow: none; padding: .85rem; }
#content :is(.panel, .profession-card, .gadget-card, .guild-draft-panel, .recycle-settings, .verification-card) > h2:first-child { margin: 0 0 .7rem; }
#content .item { border-radius: 0; box-shadow: none; }
#content .detail { grid-template-columns: minmax(0, 298px) minmax(0, 1fr); margin: 1rem auto; gap: 1rem; padding: .85rem; }
#content .detail-art { width: min(100%, 298px); height: auto; aspect-ratio: 1.25; }
#content .detail h1, #content .city-heading h1 { font: 900 clamp(1.4rem, 2.4vw, 1.9rem)/1.15 Arial, sans-serif; letter-spacing: -.025em; }
#content .item-stat-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 8rem), 1fr)); }
.flash-notice { border-radius: 0; background: var(--ui-dark); border-color: #655b45; border-left-color: var(--ui-orange); }
.flash-notice button { min-width: 44px; min-height: 44px; }
@media (max-width: 760px) {
  #content .detail { grid-template-columns: minmax(0, 1fr); margin: .75rem 0; }
  #content .detail-art { justify-self: center; }
  #content .page-title .commerce-balance { flex: 0 1 auto; min-width: 8rem; }
}

#content .commerce-range .button { white-space: nowrap; }

#wrapper #content h2:not(:where(.city-plan *, .casino-hall *, .casino-machine *, .home-dream *, .world-welcome *)) { margin-block: 1.1rem .65rem; }
#wrapper #content h2:first-child:not(:where(.city-plan *, .casino-hall *, .casino-machine *, .home-dream *, .world-welcome *)), #wrapper #content .eyebrow + h2 { margin-top: 0; }
#content .profession-card > form { flex-shrink: 0; }
#content .profession-card > div { flex: 1; min-width: 0; }
#content .profession-card > .active-state { flex-shrink: 0; white-space: nowrap; }
#content .profession-card button { min-width: 5.5rem; }
#content .page-title .text-link { color: #ffd08c; }
#content .page-title .passenger-balance { color: var(--ui-ink); background: var(--ui-soft); }
#content .passenger-balance > strong { font: 800 1rem/1.3 Arial, sans-serif; }
#content .passenger-service-strip { padding: .6rem .75rem; border-radius: 0; background: var(--ui-dark); border-top-color: var(--ui-orange); }
#content .passenger-service-strip strong { font: 700 .9rem/1.3 Arial, sans-serif; }
#content .passenger-network li > form { grid-column: 1 / -1; }
#content .passenger-network li strong { font-family: Arial, sans-serif; overflow-wrap: normal; }
#content .inspection-equipment small { font-size: .75rem; line-height: 1.45; }
#content :is(.commerce-ledger, .industry-metrics, .admin-metrics) small { color: var(--ui-muted); }
#content .vehicle-comparison-table .vehicle-comparison-sort { color: #f5eedf; background: var(--ui-dark); border-color: #697065; }
#content :is(.gadget-automation-state, .gadget-automation-queue, .gadget-automation-config) { margin: .65rem 0; padding: .85rem; background: var(--ui-paper); border-color: var(--ui-line); }
#content :is(.gadget-automation-state:not(:has(dl)), .gadget-automation-queue:not(:has(ol))) { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .75rem; padding: .6rem .75rem; }
#wrapper #content :is(.gadget-automation-state, .gadget-automation-queue, .gadget-automation-config) :is(h2, .eyebrow) { margin: 0; }
#content .gadget-automation-config form { gap: .5rem .75rem; }
#content tbody th { color: var(--ui-ink); font-size: .78rem; letter-spacing: 0; }
#content .ratings-list > .empty { display: block; }
#content .miners-hero.page-title { border-bottom: 1px solid var(--ui-line); }
#content .miners-hero::before { content: none; }
#content .miners-hero-collection { display: flex; align-items: center; gap: .65rem; padding: .35rem .65rem; box-shadow: none; }
#content .miners-hero-collection > strong { margin: 0; font: 800 1.3rem/1.3 Arial, sans-serif; }
#content .miners-hero-collection > a { margin: 0 0 0 auto; border: 0; }
#content .miners-roster { padding: .85rem; }
.game-shell #content:has(> .miners-directory) { padding: 1.25rem clamp(.75rem, 2vw, 1.75rem) 2rem; }
#content .item-card-copy strong { font-family: Arial, Helvetica, sans-serif; }

/* Shared facts: one icon, a strong value and a short, always-visible label. */
#content .game-facts {
  display: flex; flex-wrap: wrap; align-items: flex-start; gap: .6rem 1.15rem;
  margin: .65rem 0; padding: 0; color: var(--ui-ink); text-align: left;
}
#content .game-facts > .game-fact {
  position: relative; display: flex; flex-direction: column-reverse; flex: 0 1 auto;
  max-width: 100%; min-width: 0; gap: .08rem; margin: 0; padding: 0;
  border: 0; background: none; box-shadow: none;
}
#content .game-facts > .game-fact.has-icon { padding-left: 1.5rem; }
#content .game-fact dt {
  display: block; margin: 0; padding: 0; color: var(--ui-muted);
  font: 600 .68rem/1.3 Arial, sans-serif; letter-spacing: .015em; text-transform: none;
}
#content .game-fact dd {
  margin: 0; padding: 0; color: var(--ui-ink); font: 800 1.05rem/1.2 Arial, sans-serif;
  font-variant-numeric: tabular-nums; letter-spacing: -.015em; overflow-wrap: normal;
}
#content .game-fact .fact-icon { position: absolute; left: 0; top: .2rem; color: #966016; }
.fact-icon { display: inline-block; width: 18px; height: 18px; flex: 0 0 18px; vertical-align: middle; }
#content .game-fact :is(.fact-total, .fact-unit) { font-size: .78em; font-weight: 500; color: #5c615a; white-space: nowrap; }
#content .game-facts-compact { gap: .4rem .85rem; margin: .4rem 0 0; }
#content .game-facts-compact dd { font-size: .92rem; }
#content .game-facts-compact dt { font-size: .64rem; }
#content .game-facts-compact > .game-fact.has-icon { padding-left: 1.3rem; }
#content .game-facts-compact .fact-icon { width: 15px; height: 15px; top: .1rem; }
#content .item-card-tags { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .6rem; margin-top: .2rem; font: 700 .65rem/1.3 Arial, sans-serif; }
#content .item-rarity { display: inline-flex; align-items: center; gap: .3rem; }
#content .item-rarity::before { content: ''; width: .4rem; height: .4rem; background: currentColor; transform: rotate(45deg); }
#content .item-type { color: var(--ui-muted); font-weight: 500; }
#content .item-card-copy .item-card-notes { display: flex; flex-wrap: wrap; gap: .2rem .7rem; margin: .35rem 0 0; font-size: .72rem; line-height: 1.35; }
#content .item-card-copy .item-card-name { overflow-wrap: break-word; }
#content .game-status { display: inline-flex; align-items: center; gap: .3rem; max-width: 100%; padding: .25rem .45rem; border: 1px solid #c7c5b9; color: #454c43; background: #eeeee5; font: 700 .7rem/1.25 Arial, sans-serif; }
#content .game-status .fact-icon { width: 14px; height: 14px; flex-basis: 14px; }
#content .game-status-good { color: #285537; background: #e7efdf; border-color: #a0b49a; }
#content .game-status-warning { color: #794b0b; background: #fff0cf; border-color: #d4b578; }
#content .game-status-danger { color: #872f22; background: #f8e2d8; border-color: #d4a092; }
#content .fact-status-line { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .6rem; margin: .4rem 0; font-size: .78rem; }
#content .fact-location { display: inline-flex; align-items: center; gap: .3rem; min-height: 28px; }
#content .fact-status-note { color: var(--ui-muted); font-size: .76rem; }
#content .gadget-card .game-facts { margin-bottom: .5rem; }
#content .gadget-card .gadget-effect { margin-top: .35rem; }
#content .gadget-card:not(:has(.gadget-activators)) { grid-template-columns: minmax(0, 1fr); }
#content .vehicle-hero .item-card-featured { min-height: 0; }
#content .vehicle-hero .item-card-featured .item-card-art { width: 76px; height: 76px; }
#content .guild-directory-card .game-facts { margin-bottom: 0; }
#content .guild-bio { white-space: pre-wrap; overflow-wrap: anywhere; margin: .65rem 0; color: var(--ui-ink); font-size: .9rem; }
.guild-bio-control { margin-block: .75rem; }
.guild-bio-control label { display: block; font-weight: 800; }
.guild-bio-control textarea { display: block; width: 100%; resize: vertical; }
.guild-bio-control small { display: block; margin-top: .35rem; color: var(--ui-muted); line-height: 1.4; }
.guild-bio-editor form { margin-block: 0 .75rem; }
#content .page-title .game-fact dd { color: #fff5df; }
#content .page-title .game-fact dt, #content .page-title .game-fact :is(.fact-total, .fact-unit) { color: #d4d1c7; }
#content .page-title .game-fact .fact-icon { color: #f4b75e; }
#content .table-scroll:has(table:not(.ui-record-table)) th { overflow-wrap: normal; word-break: normal; }
@media (max-width: 700px) {
  .game-shell #content:has(> .miners-directory) { padding: .75rem .75rem 1.5rem; }
  #content .admin-tabs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: .25rem; scrollbar-width: thin; scrollbar-color: #eaa443 #303530; }
  #content .admin-tabs a { flex: 0 0 auto; max-width: 12rem; }
  #content .miners-hero-collection { width: 100%; }
  #content .city-venue { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
  #content .city-return { grid-column: 1; min-height: 48px; }
  #content .city-return > a { max-width: 100%; }
  #content .city-return > :is(span, small) { display: none; }
  #content .city-venue:not(:has(> .city-venue-interests)) > .city-return { grid-column: 1 / -1; }
  #content .city-venue-interests { grid-column: 2; border-top: 3px solid var(--ui-orange); }
  #content .city-venue-interests summary small { display: none; }
  #content .city-venue-interests[open] { grid-column: 1 / -1; }
  #content .city-venue-body { grid-column: 1 / -1; width: 100%; }
  #content :is(.commerce-ledger, .industry-metrics) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #content :is(.commerce-ledger, .industry-metrics) > div:last-child:nth-child(odd) { grid-column: 1 / -1; }
  #content .market-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #content .market-controls > label:first-child { grid-column: 1 / -1; }
}

/* Fleet actions wrap as complete controls; flight requirements belong to the summary. */
#content .fleet-convoy-card { color: var(--ui-ink); background: var(--ui-paper); border-color: var(--ui-line); border-radius: 4px; }
#content .fleet-convoy-card .fact-status-note { margin: .45rem 0 0; }
#content .convoy-cargo { min-width: 0; margin: .75rem 0; }
#content .convoy-cargo h3 { margin: 0 0 .4rem; font-size: .9rem; }
#content .convoy-cargo p { margin: 0; }
#content .convoy-cargo ul { display: grid; gap: .35rem; margin: 0; padding: 0; list-style: none; }
#content .convoy-cargo li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .5rem; }
#content .convoy-cargo .thing-link { display: flex; align-items: center; gap: .4rem; min-width: 0; min-height: 44px; overflow-wrap: anywhere; }
#content .convoy-cargo .thing-link > span:last-child { min-width: 0; }
#content .convoy-cargo img { width: 28px; height: 28px; object-fit: contain; flex: 0 0 28px; }
#content .convoy-cargo li > strong { white-space: nowrap; }
#content .idle-vehicle-card { grid-template-columns: minmax(14rem, 1fr) minmax(0, 2.5fr); align-items: center; }
#content .idle-vehicle-card > .item-card-actions { flex-direction: row; flex-wrap: wrap; align-items: end; justify-content: flex-end; gap: .5rem; }
#content .idle-vehicle-card > .item-card-actions > :is(.button, .vehicle-deactivate-form) { flex: 0 0 auto; }
#content .vehicle-deactivate-control { flex: 0 0 auto; min-width: max-content; }
#content .vehicle-deactivate-control > button, #content .vehicle-deactivate-all { flex: 0 0 auto; white-space: nowrap; }
#content .idle-vehicle-send { display: grid; grid-template-columns: minmax(0, 1fr) auto; flex: 1 1 18rem; align-items: end; gap: .5rem; }
#content .idle-vehicle-send label, #content .idle-vehicle-send select { width: 100%; }
#content .aircraft-flight-allowance { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .65rem; margin: .2rem 0 0; color: var(--ui-muted); font-size: .8rem; }
#content .aircraft-flight-allowance > span::before { content: "·"; margin-right: .65rem; }
@media (max-width: 1180px) {
  #content .idle-vehicle-card { grid-template-columns: minmax(0, 1fr); }
  #content .idle-vehicle-card > .item-card-actions { justify-content: flex-start; }
}
@media (max-width: 760px) {
  #content .idle-vehicle-send { flex-basis: 100%; }
  #content .idle-vehicle-card > .item-card-actions > .button,
  #content .idle-vehicle-card .vehicle-deactivate-control > button { padding-inline: .6rem; }
}

/* Payment providers own their button branding. Keep only the shared touch target. */
#content .google-pay-button { min-width: 0; width: 100%; min-height: 44px; }
#content .google-pay-button button { min-height: 44px; }
#content .checkout-status { margin: 0; font-size: .8rem; }
/* Road supplies use the same compact, disclosure-based fleet controls. */
.vehicle-countermeasures { margin-block: 1rem; border: 1px solid var(--line, #b8aa8b); padding: .8rem; }
.vehicle-countermeasures > summary { font-weight: 700; cursor: pointer; min-height: 44px; align-content: center; }
.vehicle-countermeasures > summary span { font-weight: 400; margin-inline-start: .6rem; }
.vehicle-countermeasures fieldset { border: 0; margin: .5rem 0; padding: 0; min-width: 0; }
.countermeasure-controls { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); gap: .75rem; }
.countermeasure-controls label { display: grid; gap: .3rem; min-width: 0; }
.countermeasure-controls select { width: 100%; min-width: 0; min-height: 44px; }
.countermeasure-selection { list-style: none; padding: 0; }
.countermeasure-selection li { display: flex; gap: .7rem; align-items: flex-start; margin-block: .8rem; }
.countermeasure-selection img { flex: 0 0 48px; }
.countermeasure-selection p { margin: .3rem 0; }
.countermeasure-guide li { margin-block: .7rem; }
/* Kiln: shared paper panels, native controls and compact phone queues. */
.kiln-workbench { display: flex; align-items: start; gap: 1.25rem; }
.kiln-workbench > div { min-width: 0; flex: 1; }
.kiln-amphora { width: 128px; height: 128px; flex: none; }
.kiln-queue-form { display: flex; align-items: end; flex-wrap: wrap; gap: .75rem; }
.kiln-queue-form label { display: grid; gap: .35rem; margin: 0; }
.kiln-queue-form input { width: 7rem; }
#content .refinery-page > .industry-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); }
.refinery-order, .refinery-batch { padding: 1rem; border: 1px solid var(--ui-line); background: var(--ui-paper); color: var(--ui-ink); }
.refinery-order form { display: grid; gap: .75rem; }
.refinery-order form p { margin: 0; }
.refinery-order label { display: grid; gap: .35rem; justify-self: start; }
.refinery-order input { width: min(100%, 10rem); }
.refinery-order button { justify-self: start; }
.refinery-batches { display: grid; gap: .75rem; padding: 0; list-style: none; }
.refinery-batch > div { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .5rem; }
.refinery-batch progress { width: 100%; margin-top: .75rem; accent-color: var(--ui-accent); }
.refinery-stock { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: .75rem; }
.refinery-stock > div { display: flex; justify-content: space-between; gap: .5rem; }
.refinery-stock dd { margin: 0; }
.kiln-jobs { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 1rem; }
.kiln-job { padding: 1rem; background: var(--paper, #fff9ed); border: 1px solid #b9aa8c; }
.kiln-job > div:first-child { display: flex; justify-content: space-between; gap: .5rem; margin-bottom: .75rem; }
.kiln-job .factory-progress { height: 8px; }
.kiln-clay-stock { padding: 0; list-style: none; }
.kiln-clay-stock li { display: flex; justify-content: space-between; gap: 1rem; }
@media (max-width: 600px) {
  .kiln-workbench { flex-direction: column; }
  .kiln-amphora { width: 88px; height: 88px; align-self: center; }
  .kiln-queue-form { align-items: end; }
}

/* Keep the shared PM preference aligned in Account and the profile editor. */
#private-message-settings-form .checkbox-line { display:flex; align-items:center; gap:.6rem; min-height:44px; font-size:.85rem; font-weight:400; line-height:1.4; }
#private-message-settings-form .checkbox-line input { flex:0 0 auto; margin:0; }
#private-message-settings-form p { margin:.75rem 0; }

/* Keep NPC market identities explicit on cards, order books and trading history. */
.market-npc-label {
  display: inline-block; white-space: nowrap; vertical-align: baseline;
  padding: .08em .35em; border: 1px solid var(--ui-orange); border-radius: .2rem;
  background: var(--ui-soft); color: var(--ui-ink); font-size: .85em; font-weight: 800;
}
.market-participant { margin: .25rem 0; overflow-wrap: anywhere; }

/* Map materials: sea-green frames, ivory paper, engraved brass and painted skies.
   Keep this layer after page styles so new management pages inherit it too. */
body.game-body:not(.grog-old-page-background) {
  --ink: var(--ui-ink); --muted: var(--ui-muted); --line: var(--ui-line);
  --surface: var(--ui-paper); --surface-soft: var(--ui-soft); --link: #80501a;
  background: radial-gradient(ellipse at 20% 0, #385753, #152f36 55%, #0c2028);
}
body.game-body:not(.grog-old-page-background)::before {
  opacity: .055; background-size: 150px 150px; mask-image: none;
}
#wrapper.node-wrapper.game-shell { border-color: #8f7b53; border-radius: 8px; }
.game-shell #divwrapper {
  background: radial-gradient(ellipse at 85% 0, #d9e4db70, transparent 35rem),
    repeating-linear-gradient(0deg, #ffffff16 0 1px, transparent 1px 4px), #ede8d8;
}
.game-shell .game-header { background: linear-gradient(115deg, #10272f, #203d41); border-color: #84734f; }
.game-shell #left { background: linear-gradient(110deg, #203e43, #122d35); }
#wrapper.game-shell #navcontainer { background: #153139; border-color: #8b794f; }
.game-shell #nav li { border-color: #496062; }
.game-shell #nav li a { color: #f3ecda; }
.game-shell #nav li a > span { color: #b5c2b8; }
.game-shell #nav li a[aria-current="page"] { background: linear-gradient(#35595c, #22434a); }
.game-shell #nav li a[aria-current="page"]::after { height: 3px; background: #e6c47e; }
.game-shell #nav li a:hover { background: #36595b; }
.game-shell .sidebar-context {
  color: #fff1cc; background: radial-gradient(ellipse at top right, #48665b, transparent 85%), #193e45;
  border-bottom: 3px double #b39a68; box-shadow: inset 0 0 0 5px #e8d29b18;
}
.game-shell :is(.sidebar-location-value > a, .sidebar-map-link) { color: #fff1cc; }
.game-shell .sidebar-location-value > a { font-family: var(--ui-heading); text-transform: none; font-size: 1.1rem; letter-spacing: 0; }
.game-shell .sidebar-map-link { border-color: #a891605e; }
.game-shell .side-nav-group h2 { color: #b5c2b8; }
.game-shell #navlist a { color: #f1ead8; letter-spacing: .01em; text-transform: none; font-weight: 600; }
.game-shell #navlist a::before { background: #c6ab71; }
.game-shell #navlist a:hover { background: #36595b; }
.game-shell #navlist li.current a { color: #fff5db; background: linear-gradient(90deg, #49675c, #25464b); box-shadow: inset 3px 0 #e7c67f; }
.game-shell #navlist li.current a::before { background: #efd58e; }
.game-shell :is(.player-vitals, .player-vitals div) { border-color: #6b817762; }
.game-shell .site-footer { background: #142d34; border-color: #8b794f; }
.game-shell :is(.mobile-header-chat, .mobile-header-messages, .sidebar-toggle) { background: #22434a; border-color: #938568; color: #ffedc7; }

#content .page-title { min-height: 112px; padding: 1.2rem 1.3rem; }
#content .page-title .eyebrow { color: #f4d391; }
#content .page-title :is(p, .commerce-lede) { color: #e7ecdd; }
#content :is(.detail h1, .city-heading h1) { font-family: var(--ui-heading); text-transform: none; }
#wrapper #content :is(.page-title, .home-masthead, .production-hero) {
  background: linear-gradient(90deg, #102e35f5 0%, #173a40dc 38%, #172d32bd 100%), var(--ui-scene) center 44% / cover;
  border: 1px solid #ad8950; border-top-color: #e5c88a; border-radius: 8px 8px 4px 4px;
  box-shadow: inset 0 0 0 4px #e8d29b24, 0 5px 14px #18343720;
}
#content :is(.home-masthead, .production-hero)::after { content: none; }
#content :is(.home-masthead, .production-hero) .eyebrow { color: #f4d391; }
#wrapper #content .production-hero h1 { text-transform: none; }

/* Inlaid paper panels, including the management screens that had local palettes. */
#content :is(.shop-card, .mine, .detail, .trade-forms > form, .account-grid > form,
  .vehicle-card, .vehicle-hero, .vehicle-loadout, .loadout-preview, .capacity-budget,
  .factory-card, .credit-bundle, .message-row, .message-detail, .message-bubble,
  .guild-panel, .guild-membership, .guild-create, .guild-directory, .guild-bank-panel,
  .market-controls, .recycling-bank, .container-card, .admin-region-card,
  .mine-roster-row, .mine-shift-card, .industry-build, .commerce-empty, .industry-empty,
  .industry-repair-picker, .passenger-ticket, .keys-drydock-tier, .panel,
  .profession-card, .gadget-card, .guild-draft-panel, .guild-draft-card, .recycle-settings,
  .verification-card, .account-auth-card, .convoy-group-card, .convoy-settings,
  .kiln-job, .production-materials, .production-workbench, .production-catalogue,
  .home-room-upgrade, .home-ledger-card, .home-fleet-card, .stone-card,
  .induction-invitation, .council-induction, .profile-council) {
  color: var(--ui-ink); background: var(--ui-paper-wash);
  border-color: var(--ui-line); border-radius: 6px; box-shadow: var(--ui-frame-shadow);
}
#content :is(.shop-card, .vehicle-card, .mine-roster-row, .gadget-card, .credit-bundle) { border-top: 3px solid #708d7e; }
#content :is(.industry-disclosure, .commerce-rules, .ui-help, .industry-action-note,
  .vehicle-countermeasures, .gadget-automation-state, .gadget-automation-queue,
  .gadget-automation-config) { background: #f9f5e9; border-color: #b4ac91; border-radius: 5px; }
#content :is(.industry-metrics, .admin-metrics, .commerce-ledger, .production-output) {
  color: var(--ui-ink); background: linear-gradient(120deg, #e1eade, #f8f1dc);
  border-color: #a9b49c; border-radius: 5px; box-shadow: inset 0 0 0 3px #fffdf13b;
}
#content :is(.industry-metrics, .admin-metrics, .commerce-ledger) > div { border-color: #afb89f; }
#content :is(.industry-mine-portrait, .industry-loadout-portrait) { background: radial-gradient(ellipse, #f9edc7, #c5d2b9); border-radius: 4px; }
#content .item-card { border-radius: 4px; }
#content .item-card-copy .item-card-name { font-family: var(--ui-heading); font-size: 1rem; line-height: 1.25; }
#content .item-card-art { background: radial-gradient(ellipse, #fffaf100, #e8dfc42e); border-radius: 4px; }
#content .game-fact .fact-icon { color: #8c6225; }
#content .game-status { border-radius: 4px; }
#content :is(.city-return, .city-venue .city-return, .passenger-service-strip) {
  color: #fff2d6; background: linear-gradient(100deg, #24474d, #15343c);
  border: 1px solid #9c8558; border-radius: 5px; box-shadow: inset 0 0 0 3px #eddaab18;
}
#content :is(.city-return, .city-venue .city-return) a { color: #fff2d6; }
#content :is(.city-return, .city-venue .city-return) > :is(span, small) { color: #d6ded1; }
#content .place-heraldry { background: linear-gradient(100deg, #284b4e, #17363e); border-radius: 5px; }
#content .page-title .passenger-balance > strong { color: var(--ui-ink); }
#content :is(.rating-tabs, .world-map-tabs, .article-index, .guild-subnav, .commerce-jumps,
  .vehicle-tabs, .message-tabs, .admin-tabs, .loadout-navigation, .message-filters,
  .commerce-subnav, .city-place-tabs, .profile-jumps, .editorial-switcher) {
  background: linear-gradient(100deg, #25474c, #16363e); border-color: #a18a5d;
  border-radius: 5px; box-shadow: inset 0 0 0 3px #f3e0b31a;
}
#content :is(.rating-tabs, .world-map-tabs, .article-index, .guild-subnav, .commerce-jumps,
  .vehicle-tabs, .message-tabs, .admin-tabs, .loadout-navigation, .message-filters,
  .commerce-subnav, .city-place-tabs, .profile-jumps, .editorial-switcher) a { border-color: #647975; text-transform: none; font-size: .8rem; letter-spacing: 0; }
#content :is(.rating-tabs, .world-map-tabs, .article-index, .guild-subnav, .commerce-jumps,
  .vehicle-tabs, .message-tabs, .admin-tabs, .loadout-navigation, .message-filters,
  .commerce-subnav, .city-place-tabs, .profile-jumps, .editorial-switcher) a:is([aria-current="page"], .active, .current-world) { background: linear-gradient(#f5d797, #deb569); }
#content :is(.rating-tabs, .world-map-tabs, .article-index, .guild-subnav, .commerce-jumps,
  .vehicle-tabs, .message-tabs, .admin-tabs, .loadout-navigation, .message-filters,
  .commerce-subnav, .city-place-tabs, .profile-jumps, .editorial-switcher) a:hover { background: #385d60; color: #fff5dc; }
#content thead th { background: #24474c; color: #fff4d9; border-color: #9c8b66; }
#content tbody tr:nth-child(even) { background-color: #f2eddf; }
#content .ui-record-table > tbody > tr { border-radius: 5px; }

/* Council orders use the same expedition-board materials, not office khaki. */
#content .council-overview { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 1rem; margin: 1rem 0; }
#content .council-standing {
  color: #eef3e5; background: radial-gradient(ellipse at top right, #416c64, transparent 75%), #1f434a;
  border: 1px solid #b2975d; border-radius: 7px; box-shadow: inset 0 0 0 4px #f1d39624, 0 4px 10px #183c4018;
}
#content .council-standing :is(h2, .eyebrow) { color: #ffe6ae; }
#content .council-standing p { font-size: .85rem; }
#content .council-overview > .induction-invitation { padding: 1rem; border: 1px solid var(--ui-line); }
#content .council-overview > .induction-invitation h2 { margin-top: 0; }
#content .council-overview > .induction-invitation p { font-size: .83rem; }
#content .council-overview:has(> :only-child) { grid-template-columns: minmax(0, 1fr); }
#content .council-learning-intro { padding: .65rem .85rem; color: #37524e; background: #dde8dc; border-left-color: #688f7e; border-radius: 0 5px 5px 0; font-size: .82rem; }
#content .council-mission-card {
  --order-accent: #527f75; background: var(--ui-paper-wash); border: 1px solid #ae9971;
  border-top: 3px solid var(--order-accent); border-radius: 6px;
  box-shadow: var(--ui-frame-shadow); padding: 1rem;
}
#content .council-mission-serious { --order-accent: #327080; }
#content .council-mission-hazard { --order-accent: #a55342; }
#content .council-mission-directive { --order-accent: #785380; }
#content .council-mission-card > header { gap: .55rem; flex-wrap: wrap; }
#content .council-mission-card > header > div { flex: 1 1 12rem; }
#content .council-mission-card h3 { color: #214c50; }
#content .council-mission-card > p { font-size: .85rem; }
#content .council-difficulty { color: #fffaf0; background: var(--order-accent); border-radius: 3px; transform: none; padding: .35rem .5rem; }
#content .council-mission-advice { color: var(--ui-ink); background: #f1f2e7; border-color: #bcc6b4; border-radius: 4px; }
#content .council-mission-card .game-facts { border-top: 1px solid #d6caaa; padding-top: .75rem; }
#content .council-mission-card > footer { border-top: 0; padding-top: .4rem; }
#content .council-mission-card > footer small { color: var(--ui-muted); }
#content :is(.council-rank-progress, .council-progress) { background: #142e34; border: 1px solid #789488; border-radius: 4px; height: .65rem; }
#content :is(.council-rank-progress, .council-progress) span { background: linear-gradient(90deg, #ddb864, #ffe5a2); }
#content .council-history-grid .council-mission-card { opacity: 1; }
#content .profile-council h2 { color: var(--ui-ink); }
#content .council-badge-ribbon { background: repeating-linear-gradient(90deg, #275467 0 9px, #bc9a50 9px 16px); border-color: #224655; }
#content .council-badge-face { border-radius: 50%; }
#content .council-induction { border-top-color: #4a7b76; }
#content .council-induction .induction-current { background: #e8eddf; border-color: #a1b59d; }
#content :is(.workshop-station, .workshop-expand, .workshop-reference) { background: var(--ui-paper-wash); border-color: var(--ui-line); border-radius: 6px; box-shadow: var(--ui-frame-shadow); }
#content :is(.workshop-metrics > div, .workshop-station-heading, .workshop-composer) { background: #e9efdf; border-color: #a9b49c; }
#content .workshop-current { background: linear-gradient(120deg, #315950, #1b3f49); border-color: #a09167; border-radius: 5px; }

@media (max-width: 760px) {
  #content .page-title { min-height: 100px; padding: 1rem; }
  #content .page-title h1 { font-size: 1.7rem; }
  #content .council-overview { grid-template-columns: minmax(0, 1fr); gap: .75rem; }
}
@media (max-width: 900px) {
  #wrapper.node-wrapper.game-shell { border-radius: 0; }
  #mobile-nav { color: #f1ecd8; background: linear-gradient(#21424a, #142f37); border-color: #b29a65; }
  #mobile-nav a { color: #e6ebdf; }
  #mobile-nav a:is([aria-current="page"], .current-section, [aria-expanded="true"]) { color: #ffe0a0; background: #36534c; }
  #mobile-nav a:is([aria-current="page"], .current-section)::before { background: #e7c67f; }
  .navigation-ready #player-nav-panel { background: #17373e; border-color: #a59268; }
  .navigation-ready .mobile-menu-heading { background: #22444a; border-color: #a59268; }
}

/* Navigation keeps the original black/orange/white identity. Map materials above
   apply to the content, not the controls. Keep this contract last. */
body.game-body:not(.grog-old-page-background) { background: radial-gradient(circle at 18% -5%, #31352f 0, #171a18 28rem, #090b0a 72rem); }
#wrapper.node-wrapper.game-shell { border-color: #3b403b; border-radius: 0; }
.game-shell .game-header { background: var(--brand-dark); border-color: var(--line-dark); }
.game-shell #left { background: var(--brand-charcoal); }
#wrapper.game-shell #navcontainer { background: #151815; border-color: #3b403b; }
.game-shell #nav li { border-color: #303530; }
.game-shell #nav li a { color: #fff; }
.game-shell #nav li a > span { color: #777d76; }
.game-shell #nav li a:hover { background: #242824; }
.game-shell #nav li a[aria-current="page"] { background: linear-gradient(180deg, #242824, #1c201c); }
.game-shell #nav li a[aria-current="page"] > span { color: var(--brand-orange); }
.game-shell #nav li a[aria-current="page"]::after { height: 4px; background: var(--brand-orange); }
.game-shell .sidebar-context { color: #17120b; background: var(--brand-orange); border-bottom: 3px solid #17120b; box-shadow: none; }
.game-shell :is(.sidebar-location-value > a, .sidebar-map-link) { color: #17120b; }
.game-shell .sidebar-location-value > a { font: 900 1.05rem/1 "Arial Narrow", Impact, Arial, sans-serif; letter-spacing: .035em; text-transform: uppercase; }
.game-shell .sidebar-location-value > a:hover, .game-shell .sidebar-map-link:hover { color: #fff; }
.game-shell .sidebar-map-link { border-color: #17120b59; }
.game-shell .side-nav-group h2 { color: #747a73; }
.game-shell #navlist a { color: #fff; font-weight: 800; letter-spacing: .055em; text-transform: uppercase; }
.game-shell #navlist a::before { background: #626861; }
.game-shell #navlist a:hover { background: #242824; }
.game-shell #navlist li.current a { color: #17120b; background: var(--brand-orange); box-shadow: none; }
.game-shell #navlist li.current a::before { background: #17120b; }
.game-shell :is(.player-vitals, .player-vitals div) { border-color: #333833; }
.game-shell .site-footer { background: var(--brand-dark); border-color: #343934; }
.game-shell :is(.mobile-header-chat, .mobile-header-messages, .sidebar-toggle) { background: #171a18; border-color: #666b60; color: #fff; border-radius: 0; box-shadow: none; }
.game-shell .mobile-header-messages:is(:hover, [aria-current="page"], .has-unread) { color: #ffc16c; background: #302a1d; border-color: #ab7e3c; }
.game-shell :is(.logout-button, .mobile-menu-heading button) { border-radius: 0; box-shadow: none; }
#content :is(.city-return, .city-venue .city-return, .passenger-service-strip) { color: #fff; background: var(--ui-dark); border: 1px solid #414741; border-top: 3px solid var(--ui-orange); border-radius: 0; box-shadow: none; }
#content :is(.city-return, .city-venue .city-return) a { color: #fff; }
#content :is(.city-return, .city-venue .city-return) > :is(span, small) { color: #d4d1c7; }
#content :is(.rating-tabs, .world-map-tabs, .article-index, .guild-subnav, .commerce-jumps,
  .vehicle-tabs, .message-tabs, .admin-tabs, .loadout-navigation, .message-filters,
  .commerce-subnav, .city-place-tabs, .profile-jumps, .editorial-switcher) {
  background: var(--ui-dark); border-color: #414741; border-radius: 0; box-shadow: none;
}
#content :is(.rating-tabs, .world-map-tabs, .article-index, .guild-subnav, .commerce-jumps,
  .vehicle-tabs, .message-tabs, .admin-tabs, .loadout-navigation, .message-filters,
  .commerce-subnav, .city-place-tabs, .profile-jumps, .editorial-switcher) a { color: #fff; border-color: #414741; text-transform: uppercase; font-size: .7rem; letter-spacing: .035em; }
#content :is(.rating-tabs, .world-map-tabs, .article-index, .guild-subnav, .commerce-jumps,
  .vehicle-tabs, .message-tabs, .admin-tabs, .loadout-navigation, .message-filters,
  .commerce-subnav, .city-place-tabs, .profile-jumps, .editorial-switcher) a:is([aria-current="page"], .active, .current-world) { color: #21180c; background: var(--ui-orange); }
#content :is(.rating-tabs, .world-map-tabs, .article-index, .guild-subnav, .commerce-jumps,
  .vehicle-tabs, .message-tabs, .admin-tabs, .loadout-navigation, .message-filters,
  .commerce-subnav, .city-place-tabs, .profile-jumps, .editorial-switcher) a:hover { color: #fff; background: #343a34; }
@media (max-width: 900px) {
  #mobile-nav { color: #fff; background: #131713; border-color: #4a5047; }
  #mobile-nav a { color: #fff; }
  #mobile-nav a:is([aria-current="page"], .current-section, [aria-expanded="true"]) { color: #ffc16c; background: #25291f; }
  #mobile-nav a:is([aria-current="page"], .current-section)::before { background: var(--brand-orange); }
  .navigation-ready #player-nav-panel, .navigation-ready .mobile-menu-heading { background: #171a18; border-color: #666b60; }
  .authenticated-shell .sidebar-location-value > a { font-size: .95rem; }
}
/* Council equipment exchange: shared square controls and phone-safe forms. */
.chat-emoji { font-size: 1.5em; line-height: 1; vertical-align: -.1em; }
.emoji-picker { grid-column: 1 / -1; min-width: 0; width: 100%; }
#content .emoji-toggle { min-height: 44px; margin: 0; }
.emoji-panel { width: min(100%, 22rem); box-sizing: border-box; margin-top: .5rem; padding: .5rem; color: #fff; background: #171a18; border: 1px solid #666b60; }
.emoji-panel[hidden] { display: none; }
.emoji-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(44px, 1fr)); gap: 4px; max-height: min(22rem, 50vh); overflow-y: auto; }
#content .emoji-grid button { min-width: 44px; min-height: 44px; padding: .35rem; margin: 0; color: #fff; background: #252a25; border: 1px solid #666b60; border-radius: 0; font: 1.4rem/1 Arial, Helvetica, sans-serif; box-shadow: none; }
#content .emoji-grid button:is(:hover, :focus-visible) { background: #504027; border-color: #f09a24; }
.emoji-panel [data-emoji-status] { margin: .5rem 0 0; color: #ffc16c; font-size: .85rem; }

/* Keep React with metadata; only populated counts take another line. */
.chat-page .chat-row, .guild-chat-page .chat-row { grid-template-columns: clamp(8rem, 16%, 11rem) minmax(0, 1fr) auto; min-height: 48px; padding-block: .4rem; gap: .45rem .7rem; }
.chat-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .2rem .4rem; min-width: 0; }
.chat-page .chat-meta time { display: inline-flex; align-items: baseline; gap: .3rem; white-space: nowrap; }
.chat-page .chat-meta time span { display: inline; }
#content .chat-meta > form { display: inline-flex; margin: 0; padding: 0; border: 0; background: none; }
#content .chat-meta > form button { min-height: 24px; padding: .15rem .25rem; }
.chat-reactions { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 3px; min-width: 0; margin: 0; }
.chat-row > .chat-meta { grid-column: 3; grid-row: 1; padding-right: 3.5rem; }
.chat-row > .chat-reactions, .bar-message > .chat-reactions, .message-bubble > .chat-reactions { display: contents; }
.chat-row > .chat-reactions > .chat-reaction-picker { grid-column: 3; grid-row: 1; justify-self: end; }
.chat-reaction-counts { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 3px; min-width: 0; }
.chat-reaction-counts[hidden] { display: none; }
.chat-row .chat-reaction-counts, .chat-row [data-reaction-status] { grid-column: 2 / -1; grid-row: 2; }
.bar-message > .chat-meta { grid-column: 3; grid-row: 1; padding-right: 3.5rem; }
.bar-message > .chat-reactions > .chat-reaction-picker { grid-column: 3; grid-row: 1; justify-self: end; }
.bar-message .chat-reaction-counts, .bar-message [data-reaction-status] { grid-column: 1 / -1; grid-row: 2; }
.message-bubble:has(> .chat-reactions) { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
.message-bubble:has(> .chat-reactions) > header { grid-column: 1 / -1; grid-row: 1; padding-right: 3.5rem; }
.message-bubble:has(> .chat-reactions) > p { grid-column: 1 / -1; grid-row: 2; }
.message-bubble > .chat-reactions > .chat-reaction-picker { grid-column: 2; grid-row: 1; justify-self: end; }
.message-bubble .chat-reaction-counts, .message-bubble [data-reaction-status] { grid-column: 1 / -1; grid-row: 3; }
.message-bubble .chat-reaction-counts:not([hidden]) { margin-top: .35rem; }
#content .chat-reactions form { display: inline-flex; margin: 0; padding: 0; border: 0; background: none; }
#content .chat-reactions button, #content .chat-reaction-picker > summary { display: inline-flex; align-items: center; justify-content: center; gap: .2rem; min-width: 28px; min-height: 24px; box-sizing: border-box; margin: 0; padding: .15rem .3rem; border: 1px solid #666b60; border-radius: 0; color: #fff; background: #252a25; font: 700 .75rem/1.2 Arial, Helvetica, sans-serif; cursor: pointer; box-shadow: none; }
#content .chat-reaction-picker > summary { min-width: 0; padding-inline: .15rem; border-color: transparent; color: #805000; background: transparent; text-transform: uppercase; text-decoration: underline; text-underline-offset: .15em; }
#content .bar-message .chat-reaction-picker > summary { color: #ffc16c; }
#content .chat-reaction-picker > summary::marker { content: ''; }
#content .chat-reaction-picker > summary::-webkit-details-marker { display: none; }
#content .chat-reactions button > span:first-child { font-size: 1rem; }
#content .chat-reactions button[aria-pressed="true"] { color: #fff; border-color: #f09a24; background: #504027; box-shadow: inset 0 -3px #f09a24; }
#content .chat-reactions button:is(:hover, :focus-visible), #content .chat-reaction-picker > summary:is(:hover, :focus-visible) { border-color: #f09a24; background: #504027; }
#content .chat-reaction-picker > summary:is(:hover, :focus-visible) { color: #fff; }
#content .chat-reaction-picker { min-width: 0; max-width: 100%; margin: 0; padding: 0; border: 0; background: none; }
#content .chat-reaction-picker[hidden] { display: none; }
.chat-reaction-choices { display: grid; grid-template-columns: repeat(5, 44px); gap: 4px; width: max-content; max-width: calc(100vw - 16px); max-height: min(22rem, calc(100dvh - 16px)); overflow-y: auto; box-sizing: border-box; margin: 4px 0 0; padding: 6px; color: #fff; border: 1px solid #666b60; background: #171a18; box-shadow: 0 4px 16px #0008; }
#content .chat-reaction-choices button { width: 44px; height: 44px; padding: .35rem; }
#content .chat-reaction-choices button > span:first-child { font-size: 1.35rem; }
.chat-reaction-choices noscript { grid-column: 1 / -1; }
#content .chat-reaction-choices noscript form { display: flex; flex-direction: column; gap: .5rem; }
#content .chat-reaction-choices noscript input { display: block; width: 100%; box-sizing: border-box; }
#content .chat-reaction-choices noscript button { width: auto; height: auto; min-height: 44px; }
.chat-reactions-enhanced .chat-reaction-choices { position: fixed; inset: auto; z-index: 10000; margin: 0; }
.chat-reaction-choices[popover]:not(:popover-open) { display: none; }
.chat-reaction-tooltip { position: fixed; inset: auto; z-index: 10001; width: max-content; max-width: min(22rem, calc(100vw - 16px)); max-height: min(18rem, 50dvh); box-sizing: border-box; margin: 0; padding: .5rem .65rem; overflow: auto; overflow-wrap: anywhere; color: #fff; background: #171a18; border: 1px solid #f09a24; border-radius: 0; box-shadow: 0 3px 12px #0008; font: .8rem/1.4 Arial, Helvetica, sans-serif; }
.chat-reaction-tooltip[hidden], .chat-reaction-tooltip[popover]:not(:popover-open) { display: none; }
.chat-reactions [data-reaction-status] { flex-basis: 100%; color: #a12713; overflow-wrap: anywhere; }
.bar-message .chat-reactions [data-reaction-status] { color: #ffc16c; }
@media (max-width: 720px) {
  .chat-page .chat-row, .guild-chat-page .chat-row { grid-template-columns: minmax(0, 1fr); gap: .25rem; padding: .45rem .6rem; }
  .chat-page .chat-row > .chat-identity { grid-column: 1; grid-row: 1; }
  .chat-page .chat-row > :nth-child(2) { grid-column: 1; grid-row: 2; }
  .chat-page .chat-row > .chat-meta { grid-column: 1; grid-row: 3; }
  .chat-page .chat-row > .chat-reactions > .chat-reaction-picker { grid-column: 1; grid-row: 3; }
  .chat-page .chat-row .chat-reaction-counts, .chat-page .chat-row [data-reaction-status] { grid-column: 1; grid-row: 4; }
  .city-venue-body .bar-message > .chat-meta { grid-column: 2; grid-row: 1; }
  .city-venue-body .bar-message > .chat-reactions > .chat-reaction-picker { grid-column: 2; grid-row: 1; }
  .city-venue-body .bar-message > p { grid-row: 2; }
  .city-venue-body .bar-message .chat-reaction-counts, .city-venue-body .bar-message [data-reaction-status] { grid-row: 3; }
}
@media (max-width: 360px) {
  .chat-reaction-choices { grid-template-columns: repeat(4, 44px); }
}

.council-equipment-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.council-equipment-fields label { display: flex; flex-direction: column; gap: .4rem; min-width: 0; font-weight: 700; }
.council-equipment-fields select, .council-equipment-fields input { width: 100%; min-width: 0; box-sizing: border-box; }
.council-equipment-summary { margin-block: 1.5rem; }
.council-equipment-page .industry-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.council-equipment-page .industry-metrics dd { margin: .25rem 0 0; }
@media (max-width: 600px) {
  .council-equipment-fields { grid-template-columns: minmax(0, 1fr); }
  .council-equipment-page .industry-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Keep the main collection goal visible above the CAB broadcast. */
.advice-meld-introduction { margin-block: 0 1.25rem; }
.advice-meld-introduction nav { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1rem; }
.advice-meld-introduction nav a { display: inline-flex; align-items: center; min-height: 44px; }
/* Preserve the exact wording and line breaks of anonymous public whispers. */
.chat-row-whisper .chat-world-message { white-space: pre-wrap; }
#content .chat-filter-card label:has(input:checked) { color: #fff; }
/* Free Dwarrows: ordinary trade controls and compact, readable supply cards. */
.dwarrow-page { display: grid; gap: 1.5rem; min-width: 0; }
.dwarrow-page section { min-width: 0; }
.dwarrow-introduction { border-left: 5px solid #ff8500; padding: 1rem; background: #171b19; color: #fff; }
.dwarrow-introduction h2, .dwarrow-introduction a { color: #ffb452; }
.dwarrow-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr)); gap: .8rem; }
.dwarrow-card { padding: 1rem; border: 1px solid #a89879; background: #fffaf0; color: #171b19; overflow-wrap: anywhere; }
.dwarrow-card h3 { margin-top: 0; }
.dwarrow-card p:last-child { margin-bottom: 0; }
.dwarrow-counters { display: flex; flex-wrap: wrap; gap: 1rem 2rem; }
.dwarrow-counters dt { font-weight: bold; }
.dwarrow-counters dd { margin: .3rem 0; font-size: 1.5rem; }
.dwarrow-status { font-weight: bold; }
.dwarrow-page details { margin-top: 1rem; }

#content .dwarrow-page .dwarrow-introduction a.text-link,
#content .dwarrow-page .dwarrow-introduction .eyebrow { color: #ffb452; }
#content .dwarrow-page .dwarrow-introduction a.text-link:hover { color: #fff; }
/* Haven uses the shared plain management controls and compact stock rows. */
#content .haven-page { max-width: 1200px; margin-inline: auto; }
#content .haven-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,290px),1fr)); gap: 16px; margin-block: 20px; }
#content .haven-grid article, #content .haven-purchase, #content .haven-stock-row, #content .haven-airship { border: 1px solid #7a8985; padding: 18px; background: #f8f4e9; color: #18272b; }
#content .haven-grid h2, #content .haven-grid h3 { margin-top: 0; }
#content .haven-grid .text-link, #content .haven-stock-row .text-link, #content .haven-airship .text-link { color: #784500; }
#content .haven-capacity { padding: 14px 0; border-block: 2px solid #ef8c17; }
#content .haven-stock-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-block: 10px; }
#content .haven-stock-row > div { flex: 1 1 260px; min-width: 0; overflow-wrap: anywhere; }
#content .haven-stock-row p { margin-bottom: 0; }
#content .haven-stock-row form { display: flex; align-items: end; flex-wrap: wrap; gap: 10px; }
#content .haven-stock-row label { display: grid; gap: 4px; font-weight: 700; }
#content .haven-stock-row input[type=number] { width: 96px; min-height: 44px; }
#content .haven-airship { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 24px; }
#content .haven-airship > img { width: 100%; align-self: start; }
#content .haven-page details { margin-block: 20px; }
#content .haven-page .button, #content .haven-page button { white-space: normal; }
@media(max-width: 650px) { #content .haven-airship { grid-template-columns: 1fr; } }

/* Stones are a trophy collection. Keep the shared navigation and controls plain. */
.stones-page { min-width: 0; font-family: Arial, Helvetica, sans-serif; }
#content .stones-page :is(h1, h2, h3, p, dt, dd, summary, label, input, select, button) { font-family: Arial, Helvetica, sans-serif; }
#content .stones-hero {
  position: relative; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 1.5rem 1rem; padding: clamp(1.25rem, 3vw, 2.75rem); overflow: hidden;
  color: #f8f4e9; border: 1px solid #6c5a3c; border-top: 4px solid #f3b456;
  background: radial-gradient(ellipse at 90% 20%, #57442655, transparent 60%), #171c1d;
}
#content .stones-hero .eyebrow { color: #f3bf70; margin: 0 0 .8rem; letter-spacing: .16em; }
#content .stones-hero h1 { margin: 0; color: #fff; font: 900 clamp(2.8rem, 5vw, 4.8rem)/1 Arial, Helvetica, sans-serif; letter-spacing: -.055em; text-transform: none; }
#content .stones-hero-line { margin: 1rem 0 .8rem; color: #f9e5bf; font-size: clamp(1.15rem, 2vw, 1.65rem); font-weight: 700; line-height: 1.3; }
.stones-hero-copy > p:not([class]) { max-width: 39ch; color: #d0d2cb; font-size: .9rem; line-height: 1.7; margin: 0 0 1.4rem; }
#content .stones-hero-copy .button { display: inline-flex; gap: 1rem; align-items: center; white-space: normal; }
.stones-hero-art { position: relative; width: min(100%, 360px); min-height: 260px; align-self: center; justify-self: center; isolation: isolate; }
.stones-hero-art::before { content: ''; position: absolute; inset: 12% 0 8%; background: radial-gradient(ellipse, #f8b13e22, transparent 65%); }
.stones-orbit { position: absolute; width: 76%; aspect-ratio: 1; top: 45%; left: 50%; transform: translate(-50%, -50%); border: 1px solid #ebc28120; border-radius: 50%; box-shadow: 0 0 0 24px #ebc28108, 0 0 0 50px #ebc28104; }
.stones-hero-art img { position: absolute; object-fit: contain; filter: drop-shadow(0 8px 15px #0009); }
.stones-hero-left { width: 28%; height: auto; left: 6%; top: 33%; transform: rotate(-16deg); }
.stones-hero-right { width: 28%; height: auto; right: 3%; top: 24%; transform: rotate(14deg); }
.stones-hero-art .stones-hero-centre { width: 46%; height: auto; left: 28%; top: 23%; filter: drop-shadow(0 0 20px #e9a03e50) drop-shadow(0 10px 10px #0009); }
.stones-art-caption { position: absolute; inset: auto 0 0; text-align: center; color: #cdbb9d; font-size: .65rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.stones-totals { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1.4fr 1fr; gap: 1rem; margin: .25rem 0 0; padding-top: 1.5rem; border-top: 1px solid #76624470; }
.stones-totals > div { min-width: 0; }
.stones-totals dt { color: #d1c8b7; font-size: .72rem; font-weight: 700; }
.stones-totals dd { margin: .4rem 0 0; color: #fff3d8; font-size: clamp(1.7rem, 3vw, 2.6rem); font-weight: 800; line-height: 1.2; overflow-wrap: anywhere; }
.stones-totals dd span { display: block; color: #d1c8b7; font-size: .7rem; font-weight: 400; margin-top: .2rem; }
.stones-progress { grid-column: 1 / -1; }
.stones-progress > div { display: flex; justify-content: space-between; gap: 1rem; font-size: .75rem; line-height: 1.5; color: #ded2be; }
.stones-progress progress { display: block; appearance: none; width: 100%; height: 6px; margin: .6rem 0; border: 0; border-radius: 0; background: #3d423e; accent-color: #f3b456; }
.stones-progress progress::-webkit-progress-bar { background: #3d423e; }
.stones-progress progress::-webkit-progress-value { background: linear-gradient(90deg, #c8862f, #f8d396); }
.stones-progress progress::-moz-progress-bar { background: #f3b456; }
.stones-progress p { margin: .75rem 0 0; font-size: .8rem; line-height: 1.6; color: #d0d2cb; }
.stones-help { margin: 0 0 2rem; border-bottom: 1px solid #b5aa95; }
#content .stones-help > summary, #content .legacy-stones > summary { min-height: 44px; box-sizing: border-box; padding: .85rem 0; cursor: pointer; font-weight: 700; }
.stones-help p { max-width: 80ch; line-height: 1.65; }
.stones-help a { display: inline-flex; align-items: center; min-height: 44px; margin-bottom: .5rem; }
.stones-collection { scroll-margin-top: 1rem; }
.stones-section-heading { display: flex; align-items: end; justify-content: space-between; gap: .5rem 1rem; flex-wrap: wrap; margin: 0 0 1rem; }
#content .stones-section-heading h2 { margin: 0; font-size: 1.4rem; letter-spacing: -.025em; }
.stones-section-heading .eyebrow { margin: 0 0 .4rem; }
.stones-section-heading > span, .stones-section-heading p { font-size: .8rem; color: #595344; margin: 0; }
.stones-section-heading h2 > span { display: inline-block; margin-left: .3rem; font-size: .85rem; color: #675b45; }
.stones-filter { display: flex; gap: .75rem; flex-wrap: wrap; align-items: end; padding: 1rem; margin: 0 0 1.8rem; background: #fffcf5; border: 1px solid #cfc4af; }
.stones-filter label { display: grid; gap: .4rem; min-width: 0; margin: 0; font-size: .8rem; font-weight: 700; }
.stones-filter label:first-child { flex: 1 1 14rem; }
.stones-filter label:nth-child(2) { flex: 0 1 10rem; }
#content .stones-filter input, #content .stones-filter select { width: 100%; min-width: 0; box-sizing: border-box; }
.stones-filter > a { display: inline-flex; align-items: center; min-height: 44px; font-size: .8rem; }
.stones-earned, .stones-next, .legacy-stones { margin: 0 0 2rem; }
#content .stones-page .stone-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 1rem; }
.stones-page .stone-tier-1 { --stone-accent: #d7d23a; --stone-ink: #666200; }
.stones-page .stone-tier-2 { --stone-accent: #91c54b; --stone-ink: #3f6c13; }
.stones-page .stone-tier-3 { --stone-accent: #73a9c7; --stone-ink: #2e6281; }
.stones-page .stone-tier-4 { --stone-accent: #d45a45; --stone-ink: #a03624; }
.stones-page .stone-tier-5 { --stone-accent: #a868aa; --stone-ink: #7f3881; }
.stones-page .stone-tier-6 { --stone-accent: #f2a249; --stone-ink: #94560e; }
#content .stones-page .stone-card {
  display: grid; grid-template-columns: 88px minmax(0, 1fr); align-items: start; gap: 1rem;
  min-width: 0; padding: 1.2rem 1.1rem .8rem; opacity: 1; border-radius: 0;
  color: #242821; background: #fffcf5; border: 1px solid #c9bfae; border-top: 3px solid var(--stone-accent);
  box-shadow: 0 3px 0 #ddd2bd60;
}
.stone-card-art { position: relative; display: grid; place-items: center; min-height: 100px; background: radial-gradient(ellipse, #e5ddcb, transparent 70%); }
.stone-card-art::after { content: ''; position: absolute; bottom: 0; width: 70%; height: 4px; background: #9f948041; border-radius: 50%; }
#content .stones-page .stone-card img { display: block; width: 76px; height: 76px; object-fit: contain; opacity: .7; filter: saturate(.55); }
.stone-card-copy { min-width: 0; }
.stone-rarity { color: var(--stone-ink); font-size: .63rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
#content .stones-page .stone-card h3 { margin: .4rem 0 .65rem; color: inherit; font-size: 1.1rem; line-height: 1.22; overflow-wrap: anywhere; }
#content .stones-page .stone-card p { color: #575448; font-size: .82rem; line-height: 1.6; }
.stone-card footer { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .4rem 1rem; border-top: 1px solid #d8cebc; padding-top: .8rem; font-size: .73rem; font-weight: 700; }
.stone-earned-status { color: #696151; }
.stone-reward { color: #4a483f; white-space: nowrap; }
.stone-reward abbr { text-decoration: none; }
#content .stones-page .stone-card.earned { border-color: #665f4d; border-top-color: var(--stone-accent); background: radial-gradient(ellipse at 0 0, #d0a35215, transparent 70%), #202727; color: #fff7e7; box-shadow: inset 0 0 0 3px #fff7dd06, 0 3px 0 #62563e30; }
.stones-page .earned .stone-card-art { background: radial-gradient(ellipse, color-mix(in srgb, var(--stone-accent) 25%, transparent), transparent 70%); }
.stones-page .earned .stone-card-art::after { background: var(--stone-accent); box-shadow: 0 0 14px var(--stone-accent); opacity: .65; }
#content .stones-page .earned img { width: 88px; height: 88px; opacity: 1; filter: drop-shadow(0 0 9px color-mix(in srgb, var(--stone-accent) 30%, transparent)); }
#content .stones-page .earned p { color: #d1d2c9; }
.stones-page .earned .stone-rarity { color: color-mix(in srgb, var(--stone-accent) 80%, #fff); }
.stones-page .earned footer { border-color: #ffffff20; }
.stones-page .earned .stone-earned-status { color: #c1e1aa; }
.stones-page .earned .stone-reward { color: #f4d59d; }
.stones-empty { padding: 2rem; border: 1px dashed #b4a17e; background: #fff9ea; }
.stones-empty p { line-height: 1.6; }
@media (prefers-reduced-motion: no-preference) {
  .stones-page .earned .stone-card-art::before { content: ''; position: absolute; top: 14%; left: 16%; width: 4px; height: 4px; background: #fff7dd; box-shadow: 0 0 9px 2px #fff2cb80; transform: rotate(45deg); animation: stone-glint 7s ease-in-out infinite; }
  .stones-page .earned:nth-child(3n + 2) .stone-card-art::before { animation-delay: -2.5s; }
  .stones-page .earned:nth-child(3n) .stone-card-art::before { animation-delay: -5s; }
  @keyframes stone-glint { 0%, 65%, 100% { opacity: 0; } 80% { opacity: .8; } }
}
@media (max-width: 650px) {
  #content .stones-hero { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
  .stones-hero-art { width: min(100%, 270px); min-height: 210px; justify-self: center; }
  .stones-totals { grid-template-columns: 1fr 1.5fr; gap: 1.25rem .75rem; }
  .stones-totals > div:last-child { grid-column: 1 / -1; display: flex; align-items: baseline; justify-content: space-between; border-top: 1px solid #76624470; padding-top: .6rem; }
  .stones-totals > div:last-child dd { font-size: 1.25rem; }
  .stones-progress > div { font-size: .7rem; }
  .stones-filter { padding: .8rem; }
  .stones-filter label:first-child { flex-basis: 100%; }
  .stones-filter label:nth-child(2) { flex: 1 1 6rem; }
  #content .stones-page .stone-card { grid-template-columns: 66px minmax(0, 1fr); gap: .8rem; padding: 1rem .85rem .8rem; }
  #content .stones-page .stone-card img { width: 64px; height: 64px; }
  #content .stones-page .earned img { width: 70px; height: 70px; }
  .stone-card-art { min-height: 80px; }
}
/* Haven's cabinet: enamel, ivory reels and restrained brass. Controls retain
   the shared black/orange/white contract. These rules belong to its content. */
.casino-theme-high-roller { --casino-gold: #d8bf83; --bonus-color: #b9a06a; }
.casino-theme-high-roller .casino-machine {
  padding: 10px; border: 1px solid #d8bf83; border-radius: 3px;
  background: linear-gradient(115deg, #826738, #e4d5ae 18%, #ac8c4f 38%, #eee2bf 65%, #785f34);
  box-shadow: 0 0 0 4px #101d2e, 0 12px 32px #0007;
}
.casino-theme-high-roller .casino-marquee {
  display: block; padding: 1.5rem 1rem 1.25rem; border: 1px solid #baa16b; border-radius: 0;
  background: repeating-linear-gradient(90deg, transparent 0 25px, #dbc58e08 25px 26px), #10243b;
  color: #f7edd6; text-align: center; box-shadow: inset 0 0 0 5px #10243b, inset 0 0 0 6px #baa16b;
}
.casino-theme-high-roller .casino-marquee::before { display: none; }
.casino-theme-high-roller .casino-marquee p {
  display: grid; gap: .8rem; font: 700 clamp(1.5rem, 4vw, 2.7rem)/1.15 Arial, Helvetica, sans-serif;
  letter-spacing: .17em; text-shadow: 0 1px #000;
}
.casino-theme-high-roller .casino-marquee p small { font: 700 .62rem/1.3 Arial, Helvetica, sans-serif; letter-spacing: .3em; color: #d8bf83; }
.casino-theme-high-roller .casino-marquee > strong { display: block; margin-top: .8rem; padding: 0; background: transparent; color: #e0d5bc; transform: none; font-size: .62rem; letter-spacing: .19em; }
.casino-theme-high-roller .casino-machine-body { background: #101e30; border-color: #10243b; border-radius: 0; padding: 1rem; }
.casino-theme-high-roller .casino-screen-frame { border: 1px solid #b9a06a; border-radius: 0; padding: .4rem; background: #060f1b; box-shadow: inset 0 0 0 2px #2a3b50; }
.high-roller-reels { position: relative; }
.casino-theme-high-roller .casino-reel-grid { border-radius: 0; border: 1px solid #a68b56; gap: 3px; background: #a68b56; }
.casino-theme-high-roller .casino-reel-cell { min-height: 120px; gap: .4rem; background: linear-gradient(#d7d1c4, #fffdf3 22%, #fffdf3 74%, #d7d1c4); box-shadow: none; }
.casino-theme-high-roller .casino-reel-cell::before,
.casino-theme-high-roller .casino-reel-cell::after,
.casino-theme-high-roller .casino-symbol-halo { display: none; }
.casino-theme-high-roller .casino-reel-cell img { width: 84px; height: 74px; max-width: 95%; filter: drop-shadow(0 3px 2px #17243833); }
.casino-theme-high-roller .casino-reel-cell strong { font-size: .65rem; line-height: 1.25; white-space: normal; color: #172438; letter-spacing: .02em; }
.casino-theme-high-roller .casino-reel-cell small { display: none; }
.high-roller-paths { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; pointer-events: none; overflow: hidden; }
.high-roller-paths path { fill: none; stroke: #947235; stroke-width: .55; opacity: .48; }
.high-roller-paths path:first-child { stroke-width: .8; opacity: .6; }
.casino-theme-high-roller .high-roller-line-bank { display: flex; flex-wrap: wrap; justify-content: space-around; gap: .4rem; padding: .65rem .1rem .2rem; color: #ead9af; background: none; }
.casino-theme-high-roller .high-roller-line-bank span { font-size: .65rem; background: none; border: 0; color: #ead9af; }
.casino-theme-high-roller .casino-controls { background: #0c1624; border: 1px solid #647287; box-shadow: none; border-radius: 0; }
.casino-theme-high-roller .casino-controls label > span,
.casino-theme-high-roller .casino-controls label small,
.casino-theme-high-roller .casino-ready { color: #e6e1d5; }
.casino-theme-high-roller .casino-controls label > span { font-size: .75rem; }
.casino-theme-high-roller .casino-controls label small { font-size: .75rem; line-height: 1.4; }
.casino-theme-high-roller .casino-ready { font-size: .75rem; letter-spacing: .03em; line-height: 1.6; }
.casino-theme-high-roller .casino-bonus-glyph { color: #f7ecd1; background: #152b46; border-color: #c4aa71; box-shadow: inset 0 0 0 3px #152b46, inset 0 0 0 4px #867044; text-shadow: none; }
.casino-theme-high-roller .casino-bonus-cell { background: radial-gradient(ellipse, #41618a, #12253d 80%); border-color: #c4aa71; }
.casino-theme-high-roller .casino-bonus-cell strong { color: #fff1d2; }
.casino-theme-high-roller .casino-reel-cell.is-winning { background: linear-gradient(#e7ce8d, #fff9dd, #ead59d); box-shadow: inset 0 0 0 2px #b78e40; animation: none; }
.casino-theme-high-roller .casino-result { background: #0a1727; border-color: #8b794e; color: #e6e1d5; }
.casino-theme-high-roller .casino-machine > footer { color: #efdfb7; background: #10243b; border-radius: 0; }
.casino-theme-high-roller .casino-machine > footer strong { color: #efdfb7; }
.casino-theme-high-roller .casino-pull { background: #ff8a00; color: #111; border: 2px solid #111; border-radius: 0; box-shadow: none; }
.casino-theme-high-roller .casino-floor-card,
.casino-theme-high-roller .casino-stats { background: #10243b; border-color: #748092; }
.casino-theme-high-roller .casino-floor-card span,
.casino-theme-high-roller .casino-floor-card small,
.casino-theme-high-roller .casino-stats dt { color: #d0d9e3; }
.casino-theme-high-roller .casino-bonus-rules,
.casino-theme-high-roller .casino-rules > div,
.casino-theme-high-roller .casino-rules > aside,
.casino-theme-high-roller .casino-history { background: #10243b; border: 1px solid #a58c5b; box-shadow: none; }
.casino-theme-high-roller .casino-bonus-rules p:not(.eyebrow),
.casino-theme-high-roller .casino-rules p:not(.eyebrow) { color: #e0e5eb; font-size: .85rem; line-height: 1.6; }
.casino-theme-high-roller .casino-bonus-rules > ul { grid-template-columns: repeat(2, minmax(0,1fr)); }
.casino-theme-high-roller .casino-bonus-rules > ul > li { background: #0a192b; border-color: #7e6e4c; --bonus-color: #b9a06a; }
.casino-theme-high-roller .casino-bonus-rules li strong { font-size: .75rem; }
.casino-theme-high-roller .casino-bonus-rules li small { color: #d2dce7; font-size: .75rem; line-height: 1.5; }
.casino-theme-high-roller .casino-paytable li,
.casino-theme-high-roller .casino-paylines li { background: #09182a; border-color: #baa16b; }
.casino-theme-high-roller .casino-paytable li.is-top-symbol { background: #233b55; box-shadow: none; }
.casino-theme-high-roller .casino-jackpot-odds { background: #0a192b; border-color: #b9a06a; }
.casino-theme-high-roller .casino-jackpot-odds strong { color: #efdfb7; text-shadow: none; }
.casino-theme-high-roller .casino-jackpot-odds small,
.casino-theme-high-roller .casino-paytable small { color: #d2dce7; }
@media (max-width: 600px) {
  .casino-theme-high-roller .casino-bonus-rules > ul { grid-template-columns: minmax(0,1fr); }
  .casino-theme-high-roller .casino-machine { padding: 5px; }
  .casino-theme-high-roller .casino-machine-body { padding: .5rem; }
  .casino-theme-high-roller .casino-marquee { padding: 1.25rem .5rem; }
  .casino-theme-high-roller .casino-marquee p { letter-spacing: .08em; font-size: 1.45rem; }
  .casino-theme-high-roller .casino-reel-cell { min-height: 90px; gap: .2rem; }
  .casino-theme-high-roller .casino-reel-cell img { width: 60px; height: 54px; }
  .casino-theme-high-roller .casino-reel-cell strong { font-size: .55rem; }
  .casino-theme-high-roller .high-roller-line-bank span { font-size: .55rem; }
}