/* Game-inspired window chrome, built from original lightweight vector ornaments.
   Artwork and controls stay separate: decorations never intercept input. */
:root {
  --game-rim: #b9914e;
  --game-wood: #35231c;
  --game-green: #214c32;
  --game-gold: #f2d597;
  --game-woodgrain: repeating-linear-gradient(94deg, #d89e5e04 0 1px, transparent 1px 9px), linear-gradient(100deg,#452b20,#2c201c 55%,#40291f);
}
.profile-time-settings { margin: 20px 0 17px; padding: 15px 0; border-top: 1px solid #6e54384d; border-bottom: 1px solid #6e54384d; }
#profile-form .profile-time-settings > label { margin: 0 0 6px; color: #e5c78f; }
#profile-time-zone { display: block; width: 100%; min-height: 42px; padding: 8px 11px; border: 1px solid #80633e; border-radius: 4px; background: #191a20; color: #f0e1c8; font-size: 14px; }
.profile-time-preview { margin: 9px 0 4px; color: #e7cb95; font-size: 13px; font-variant-numeric: tabular-nums; }
.profile-time-settings > small { display: block; color: #b9aa93; font-size: 12px; line-height: 1.55; }
#profile-data-checked { display: block; color: #bbaa8d; font-size: 10px; }
#account-timers { position: sticky; top: 0; z-index: 25; padding: 1px 0; background: #131219ee; backdrop-filter: blur(9px); border-radius: 0 0 5px 5px; }
#sk6-page, #captain-roster-page, #hall-of-fame-page, #badges-page, #calendar-page { scroll-margin-top: 90px; }
.collection-checked { color: #d4b97f; }
.collection-snapshot-help { max-width: 720px; }

.capacity-panel, .commander-overview, .result-group, .collection-hall,
.collection-badges, .info-panel, .advanced-panel, .calendar-week-board {
  border-color: #8e6d3f;
  border-radius: 6px;
  box-shadow: inset 0 0 0 1px #ead09b12, 0 6px 22px #0003;
}
.capacity-panel, .commander-overview, .collection-badges {
  background-color: #1c1c21;
  background-image: radial-gradient(ellipse at top,#50452e20,transparent 65%);
}

/* The emerald plate is the visual anchor of every main window. */
.panel-heading h2, .commander-overview-heading h2,
.collection-section-heading h2, .captain-collection-heading h2,
.calendar-page-heading h1, .dialog-heading h2,
.info-panel > h2, .advanced-header h2,
.result-group-heading h2, .xp-editor-heading h2 {
  display: block;
  width: fit-content;
  max-width: 100%;
  min-height: 43px;
  margin: 0;
  padding: 10px 34px;
  background: url('/game-ui/emerald-title.svg') center / 100% 100% no-repeat;
  color: #fff0c7;
  font: 650 19px/1.35 var(--sans);
  letter-spacing: .01em;
  text-align: center;
  text-shadow: 0 2px 2px #06190f;
  filter: drop-shadow(0 3px 3px #0005);
}
.panel-heading, .commander-overview-heading,
.collection-section-heading, .captain-collection-heading,
.calendar-page-heading, .dialog-heading, .result-group-heading {
  position: relative;
  background: var(--game-woodgrain);
  border-bottom: 1px solid #b18b4b;
}
.capacity-panel .panel-heading {
  margin: -18px -18px 16px;
  padding: 9px 15px 12px;
  border-radius: 5px 5px 0 0;
}
.capacity-panel .panel-heading h2 {
  width: 100%;
  margin: 0 0 6px;
  min-height: 43px;
  padding: 10px 24px;
  font-size: 18px;
}
.capacity-panel .panel-heading p { color: #d1b992; font-size: 12px; text-align: center; }
.capacity-panel::before { display: none; }
.commander-overview-heading { padding: 10px 17px 12px; border-radius: 5px 5px 0 0; gap: 10px; }
.commander-overview-heading h2 { font-size: 18px; }
.commander-overview-heading p { margin: 5px 0 0; color: #ceb994; }
.collection-section-heading {
  margin: -24px -24px 21px;
  padding: 10px 20px 12px;
  border-radius: 5px 5px 0 0;
}
.collection-section-heading h2 { margin: 0 auto; min-width: 230px; }
.collection-section-heading p { margin: 6px 0 0; text-align: center; color: #d3bb94; }
.collection-hall > .collection-section-heading { padding-top: 9px; padding-bottom: 10px; background: var(--game-woodgrain); }
.collection-hall > .collection-section-heading h2 { margin: 0 auto; font: 650 20px/1.35 var(--sans); }
.collection-hall > .collection-section-heading p { margin: 5px 0 0; }
.captain-collection-heading {
  justify-content: center;
  margin: 25px 0 18px;
  padding: 10px 18px 12px;
  border: 1px solid #8e6d3f;
  border-radius: 6px;
}
.captain-collection-heading > div { width: 100%; }
.captain-collection-heading h2 { margin: 0 auto; min-width: 260px; }
.captain-collection-heading p { max-width: none; text-align: center; margin-top: 6px; color: #cdb791; }
.calendar-page-heading { padding: 10px 17px 12px; border: 1px solid #8e6d3f; border-radius: 6px; }
.calendar-page-heading h1 { font-size: 22px; }
.calendar-page-heading p { margin-top: 6px; color: #cdb791; font-size: 12px; }
.result-group { overflow: visible; }
.result-group-heading { min-height: 76px; padding: 12px 17px; border-radius: 5px 5px 0 0; }
.result-group-heading h2 { padding: 8px 30px; min-height: 37px; font-size: 17px; }
.result-group-heading .eyebrow { color: #d0b583; font-size: 10px; }
.result-group-heading .group-resource-icon { width: 35px; height: 38px; object-fit: contain; filter: drop-shadow(0 2px 2px #0007); }
.result-group-heading .group-total { color: #f1d7a6; font-size: 20px; }
.results-heading h2 { color: #eed7a8; font-size: 25px; }
.results-heading .step-label { color: #b49a6b; }
.info-panel > h2 { margin: -9px auto 18px; font-size: 20px; }
.advanced-header h2 { font-size: 20px; }

/* Gold corner flourishes keep the frame recognisable without adding controls. */
.capacity-panel .panel-heading::before, .collection-section-heading::before,
.captain-collection-heading::before, .calendar-page-heading::before,
.dialog-heading::before {
  position: absolute;
  top: -4px; left: -5px;
  width: 33px; height: 33px;
  background: url('/game-ui/gold-corner.svg') center / contain no-repeat;
  content: '';
  pointer-events: none;
}
.capacity-panel .panel-heading::after, .collection-section-heading::after,
.captain-collection-heading::after, .calendar-page-heading::after,
.dialog-heading::after {
  position: absolute;
  top: -4px; right: -5px;
  width: 33px; height: 33px;
  background: url('/game-ui/gold-corner.svg') center / contain no-repeat;
  transform: scaleX(-1);
  content: '';
  pointer-events: none;
}

/* A green confirmation button, with gold edges like the game's march action. */
.capacity-panel #run-button, .button-primary, .captain-inline-save {
  border: 1px solid #d1a75e;
  border-radius: 4px;
  background: linear-gradient(180deg,#48724a 0%,#254c31 45%,#1b3828 100%);
  box-shadow: inset 0 0 0 2px #13291d, inset 0 3px 0 3px #c9dd9e26, 0 2px 5px #0005;
  color: #fff1c6;
  font-weight: 650;
  text-shadow: 0 1px 2px #061c10;
}
.capacity-panel #run-button:hover, .button-primary:hover, .captain-inline-save:hover {
  border-color: #ffe0a0;
  background: linear-gradient(180deg,#5b8a56,#34633f 48%,#254c32);
}
.button-outline, .calendar-refresh, .calendar-week-navigation button {
  border-color: #9e7d49;
  background: linear-gradient(180deg,#49372a,#2c241f);
  box-shadow: inset 0 0 0 1px #e4c88b12;
  color: #ecd4a1;
  border-radius: 4px;
}
.button-outline:hover, .calendar-refresh:hover, .calendar-week-navigation button:hover {
  border-color: #dfb96e;
  background: linear-gradient(180deg,#5b4430,#3b2d23);
}
.dialog-heading { padding: 14px 20px; gap: 12px; }
.dialog-heading h2 { flex: 1 1 auto; min-width: 0; font-size: 21px; }
.dialog-heading .eyebrow { margin: 0 0 6px; color: #d2b17a; }
.dialog-heading .dialog-close, .dialog-heading .icon-button, #close-profile-dialog {
  flex: none;
  width: 33px; min-height: 33px; height: 33px;
  padding: 0;
  border: 1px solid #f0c16e;
  border-radius: 3px;
  background: linear-gradient(#aa3d2c,#6c1c18);
  color: #fff0b9;
  font: 600 25px/1 var(--sans);
  box-shadow: inset 0 0 0 2px #481a13, 0 2px 5px #0006;
}
.dialog-close:hover, #close-profile-dialog:hover { filter: brightness(1.2); }

/* Small, consistent symbols help scan the navigation and common actions. */
.section-navigation > a { display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.section-navigation .nav-short { display: none; }
.section-navigation > a::before {
  display: inline-block;
  flex: none;
  width: 18px; height: 20px;
  color: #d1af6c;
  font: 500 18px/20px Georgia,serif;
  text-align: center;
  text-shadow: 0 2px 2px #0009;
}
.section-navigation > a[data-page='calculator']::before { content: '⚔'; }
.section-navigation > a[data-page='progress']::before { content: '♜'; }
.section-navigation > a[data-page='calendar']::before { content: '▦'; }
.section-navigation > a[data-page='info']::before { content: 'i'; border: 1px solid #af8e56; border-radius: 50%; font-size: 15px; line-height: 17px; height: 18px; }
.section-navigation > a[data-page='advanced']::before { content: '⚙'; }
.section-navigation > a[data-page='sk6']::before { content: '✦'; }
.site-header .section-navigation > a[aria-current='page'] {
  border-color: #b79652;
  border-radius: 4px 4px 0 0;
  background: linear-gradient(#36563888,#23433366);
  color: #f5dfa9;
}
#reorder-results::before { content: '↕'; font-size: 17px; color: #dbbb78; }
.captain-inline-save::before { content: '✓'; margin-right: 6px; }
#open-mercs::before { content: ''; display: block; width: 23px; height: 27px; background: url('/game-icons/authority.png') center / contain no-repeat; }
.captain-faction-heading { border-bottom-color: #927144; }
.captain-faction-heading h3 { color: #efdaa9; }
.captain-faction-heading::after { content: '◆'; margin-left: 5px; color: #b3945f; font-size: 10px; }

@media (max-width: 760px) {
  .site-header .section-navigation > a { gap: 4px; }
  .section-navigation > a::before { width: 15px; font-size: 15px; }
  .section-navigation > a[data-page='info']::before { width: 16px; height: 16px; font-size: 13px; line-height: 15px; }
  .collection-section-heading { margin: -18px -14px 18px; padding: 10px 15px 12px; }
  .calendar-page-heading { align-items: center; gap: 10px; }
  .calendar-page-heading h1 { padding: 10px 27px; font-size: 18px; }
  .calendar-page-heading p { font-size: 12px; }
  .calendar-refresh { min-height: 38px; }
  .dialog-heading h2 { font-size: 18px; padding: 10px 27px; }
}
@media (max-width: 480px) {
  .site-header > .section-navigation { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 3px; }
  .section-navigation .nav-full { display: none; }
  .section-navigation .nav-short { display: block; }
  .site-header .section-navigation > a, .site-header .section-navigation > a[data-page='advanced'] { flex-direction: column; gap: 2px; min-height: 64px; padding: 6px 3px; font-size: 10px; line-height: 1.3; overflow-wrap: anywhere; }
  .calendar-page-heading { flex-wrap: wrap; padding: 10px 12px; }
  .calendar-page-heading > div { width: 100%; }
  .calendar-page-heading h1 { margin: 0 auto; }
  .calendar-page-heading p { text-align: center; }
  .calendar-page-heading .calendar-refresh { margin: 0 auto; }
  .commander-overview-heading h2 { padding: 10px 23px; font-size: 16px; }
  .result-group-heading { padding: 10px; gap: 10px; }
  .result-group-heading h2 { min-height: 35px; padding: 8px 20px; font-size: 15px; }
  .result-group-heading .group-total { font-size: 17px; }
  .captain-collection-heading h2 { min-width: 0; font-size: 19px; }
  .info-panel > h2 { padding: 12px 27px; font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .game-title { transition: none; }
}