/* The captain's desk: timber housings, parchment records and worn brass.
   Surface-only layer: existing geometry, typography and touch targets stay intact. */
:root {
  --period-wood: url('/art/interface/wood.webp');
  --period-parchment: url('/art/interface/parchment.webp');
  --period-brass: #bd914e;
  --period-ink: #452812;
  --period-cream: #f5e4bf;
}

/* Structural woodwork, with the grain visible through the warm stain. */
.topbar,
.helm {
  background: linear-gradient(90deg, #24130b55, #4d2c1630 48%, #160c085c), var(--period-wood) center / 520px;
  border-color: #79512d;
  box-shadow: inset 0 1px #e8c17c44, inset 0 -2px #140b08aa, 0 3px 9px #150d0899;
}
.sidebar {
  background: linear-gradient(90deg, #160c0866, #56351b22 55%, #1d100b66), var(--period-wood) center / 420px;
  border-color: #3d2518;
  box-shadow: inset -1px 0 #e4b96866, 2px 0 #b78b49, 7px 0 15px #160e0977;
}
.world-label,
.sidebar-section {
  border-color: #b18a5044;
  color: #e4c691;
}
.sidebar #navigation .nav-item {
  background: linear-gradient(100deg, #58351a66, #21120d99), var(--period-wood) center / 340px;
  border-color: #bc95523d;
  border-radius: 1px;
  box-shadow: inset 0 1px #eac88c26, inset 0 -1px #0c0708aa, 0 2px 3px #120a0877;
  color: #f1dfb8;
}
.sidebar #navigation .nav-item:hover {
  background: linear-gradient(100deg, #8b5a2a55, #3f241399), var(--period-wood) center / 340px;
  border-color: #cba263;
}
.sidebar #navigation .nav-item.active {
  background: linear-gradient(100deg, #f9e7b522, #b17a3922), var(--period-parchment) center / 520px;
  color: #442811;
  border-color: #d7b06b;
  box-shadow: inset 0 0 0 2px #67411d55, inset 0 1px #fff3cebb, 0 2px 4px #11090799;
  text-shadow: 0 1px #fff0c67a;
}
.sidebar #navigation .nav-item.active:after { color: #734b20; }
.sidebar #navigation .nav-item.active:before { background: #d3a35b; box-shadow: 1px 1px #3e2515; }

/* A fixed row of wooden nameplates on the small captain's desk. */
#mobile-dock {
  background: linear-gradient(#23140a44, #160c0899), var(--period-wood) center / 480px;
  border-color: #c79c56;
  box-shadow: inset 0 1px #f0ce8b77, 0 -3px 10px #160c0999;
}
#mobile-dock button {
  background: linear-gradient(#65401e22, #160c0844), var(--period-wood) center / 320px;
  border-color: #c29a5540;
  border-radius: 1px;
  color: #f0dbaf;
  box-shadow: inset 0 1px #e3bd7526, inset 0 -1px #100907aa;
}
#mobile-dock button.active {
  background: linear-gradient(#fff0c522, #a46e2922), var(--period-parchment) center / 400px !important;
  border-color: #d9b56c !important;
  color: #482d17 !important;
  box-shadow: inset 0 0 0 1px #7d542d88, inset 0 1px #fff3cfaa, 0 1px 3px #0d0807aa;
}
.sidebar-backdrop { background: #160f0ad9; backdrop-filter: none; }

/* Cargo inventories are paper ledgers, rather than luminous status cards. */
.topbar .resource {
  background: linear-gradient(100deg, #f8e6b31c, #b87c3426), var(--period-parchment) center / 500px;
  border-color: #bf934e;
  color: var(--period-ink);
  box-shadow: inset 0 0 0 1px #fbe9b65c, inset 0 0 9px #81502a3b, 0 2px 3px #170e0888;
  border-radius: 1px;
}
#harbor-summary {
  background: linear-gradient(#21130b44, #160d0888), var(--period-wood) center / 400px;
  border-color: #b88c4d;
  box-shadow: inset 0 0 0 2px #23150c, 0 2px 4px #170e0899;
}
#workspace .header-ship {
  background: linear-gradient(#f9e7b51a, #ac77312b), var(--period-parchment) center / 420px !important;
  border-color: #9c763e88 !important;
  color: var(--period-ink);
  box-shadow: inset 0 1px #fff3ce77, inset 0 -1px #77481e44;
  border-radius: 1px !important;
}
#workspace .header-ship:hover {
  background: linear-gradient(#fce9b854, #c39b462b), var(--period-parchment) center / 420px !important;
}
#workspace .header-ship :is(strong, small),
#workspace .header-army :is(small, .troop-tokens, .troop-tokens span) { color: var(--period-ink); }
#workspace .header-army {
  background: linear-gradient(#e8ca9533, #b17a2e22), var(--period-parchment) center / 440px;
  border-color: #9c763e88;
  color: var(--period-ink);
  border-radius: 1px;
  box-shadow: inset 0 1px #fff2c766, inset 0 -1px #77481e44;
}
#header-status {
  background: linear-gradient(#20120977, #110b08bb), var(--period-wood) center / 380px;
  border-color: #c9a26288;
  box-shadow: inset 0 0 0 2px #150b0877, inset 0 1px #ecc68133;
  color: var(--period-cream);
}
.header-world-badge {
  background: linear-gradient(#39241466, #190f0999), var(--period-wood) center / 350px;
  border-color: #c69a5355;
  box-shadow: inset 0 1px #edce8726;
}

/* The captain's small chest and the dialog frame keep their existing sizes. */
.player-menu {
  background: linear-gradient(#34201255, #160c0899), var(--period-wood) center / 450px;
  border-color: #a47739;
  box-shadow: inset 0 0 0 1px #edc77b66, 0 0 0 1px #2c1a10, 0 8px 24px #160e0bd9;
}
.player-menu-header {
  background: linear-gradient(#3c251333, #1a100b66), var(--period-wood) center / 350px;
  border-color: #c5a06488;
  box-shadow: inset 0 1px #e3bd6f22;
}
#modal {
  background: linear-gradient(#3b241366, #1b100ac4), var(--period-wood) center / 500px;
  border-color: #95682f;
  border-radius: 1px;
  box-shadow: inset 0 0 0 1px #f0cd8380, 0 0 0 1px #3e2514, 0 18px 60px #130c09d9;
  color: var(--period-cream);
}
#modal::backdrop { background: #160f0bd9; backdrop-filter: none; }
#modal .modal-top { box-shadow: 0 1px #b9904e55; }
.avatar-choice {
  background: linear-gradient(#4c2e1633, #1e110bbb), var(--period-wood) center / 340px;
  border-color: #b28a465e;
  border-radius: 1px;
  box-shadow: inset 0 1px #e9c78533;
}
.avatar-choice span {
  background: var(--period-parchment) center / 420px;
  color: #56351c;
  text-shadow: 0 1px #fff0c54d;
}
.avatar-choice.selected { border-color: #e4b85f; box-shadow: 0 0 0 1px #e6c27655; }
.avatar-choice.selected span { background: linear-gradient(#e6ba5d33, #a8732d33), var(--period-parchment) center / 420px; color: #42270f; }
.avatar-choice.selected:after { content: ''; background: url('/art/interface/wax-seal-small.svg') center / contain no-repeat; border-radius: 0; box-shadow: none; }
.account-seal { border-color: #dab873; background: var(--period-wood) center / 350px; }
.mission-estimate,
.stock-detail-row {
  background: linear-gradient(#fff0c526, #c08a3c1a), var(--period-parchment) center / 600px;
  border-color: #ad8246;
  color: var(--period-ink);
  box-shadow: inset 0 1px #fff3ca66, 0 1px 3px #1c110d33;
}
.stock-detail-row :is(strong, small), .mission-estimate strong { color: #503118; }

/* Notices, standings and progress are written records and brass measures. */
.queue {
  background: linear-gradient(#f5dfa91a, #ac763326), var(--period-parchment) center / 650px;
  color: #4e2e16;
  border-color: #ad7c38;
  box-shadow: inset 0 1px #fff0c599, inset 0 -1px #9b6b3433, 0 2px 4px #1d110b55;
}
.queue :is(strong, time), .harbor-build-plan .queue { color: #4e2e16; }
.activity-bar {
  background: linear-gradient(#2b190e66, #160d0999), var(--period-wood) center / 500px;
  color: var(--period-cream);
  border-color: #8a5f2e;
  box-shadow: inset 0 0 0 1px #c69a5655, 0 2px 5px #150c0888;
}
.fleet-overview-card,
.captain-standing,
.captain-stats > div {
  background: linear-gradient(#f7e4b11a, #a9763726), var(--period-parchment) center / 650px;
  color: var(--period-ink);
  border-color: #9c6d34;
  box-shadow: inset 0 1px #fff1cb88, 0 0 0 1px #2b1b1233, 0 2px 5px #170e0955;
}
.fleet-overview-card :is(strong, span, small),
.captain-standing :is(h3, p, small, strong, .eyebrow),
.captain-stats :is(strong, small) { color: #543319; }
.standing-position, .standing-score, .standing-summary { border-color: #9b713e66; }
.fleet-overview-card.has-threats,
.activity-bar.under-attack,
.incoming-warning,
.connection {
  background: linear-gradient(#6e342399, #33180fc4), var(--period-wood) center / 500px !important;
  border-color: #bb7b45 !important;
  color: #ffebc9 !important;
}
.fleet-overview-card.has-threats :is(strong, span, small) { color: #ffebc9; }
.progress,
.voyage-progress,
.ranking-scorebar {
  background: linear-gradient(#3f281555, #20140d55), var(--period-wood) center / 300px;
  border-color: #a1783f;
  box-shadow: inset 0 1px 2px #170d0966;
}
.progress > span,
.voyage-progress > span,
.ranking-scorebar > span {
  background: linear-gradient(#edcf88, #b98a45 45%, #795025 70%, #d7b367);
  box-shadow: inset 0 1px #fff0c055;
}
.live-dot { box-shadow: inset 0 1px #f3deb14d, 0 1px #160e0977; }
.map-legend,
.chart-overview-wrap,
.search-box {
  background: linear-gradient(#2d1a0d88, #1d110ac4), var(--period-wood) center / 420px;
  border-color: #b58b4f;
  border-radius: 1px;
  box-shadow: inset 0 1px #e9c47e44, 0 2px 5px #170e0a88;
}
.map-legend .legend-label { color: #f4e4bd; }

/* Shared records and crew notices use the same woodwork as the captain's desk. */
.painted-ranking-table th,
.brotherhood-page .crew-contract-header,
.brotherhood-page .community-controls,
.brotherhood-page .brotherhood-rules,
.brotherhood-page .crew-banner,
.brotherhood-page .crew-allied .crew-banner,
.account-page .account-help {
  background: linear-gradient(#34201355, #1b100b99), var(--period-wood) center / 500px;
  border-color: #bb914d;
  color: var(--period-cream);
  box-shadow: inset 0 1px #e7c47d33, inset 0 -1px #1a0e0acc;
}
.painted-ranking-table tr.me { background: linear-gradient(#d7b16b22, #ab733b1c), var(--period-parchment) center / 650px; }
.account-page .account-current-tag,
.account-email-badge.is-verified,
.plan-building-level {
  background: linear-gradient(#4a2c1655, #21130bcc), var(--period-wood) center / 350px;
  border-color: #c39a54;
  color: var(--period-cream);
}
.fleet-mission-ribbon { background: linear-gradient(#4b2a1399, #24130bc4), var(--period-wood) center / 350px; }
.hostile-fleet .fleet-mission-ribbon { background: linear-gradient(#793823aa, #3b1b10cc), var(--period-wood) center / 350px; }
.ranking-portrait, .standing-portrait { background-color: #46301c; }

@media (max-width: 950px) {
  #harbor-summary { background: none; box-shadow: none; }
}