
/* Main menu redesign: self-contained command-deck skin. Gameplay screens are untouched. */
.start-overlay {
  background: radial-gradient(ellipse at 65% 3%, #27394a75, transparent 55%),
              linear-gradient(130deg, #03070df2, #08121ded 64%, #03070df5);
  backdrop-filter: blur(14px);
  padding: clamp(8px, 1.6vw, 24px);
}
.start-command {
  --menu-gold: #f0cb81;
  --menu-line: #ffffff22;
  --menu-muted: #a8b5c2;
  width: min(1420px, 100%);
  max-height: min(96dvh, 1100px);
  overflow-y: auto;
  padding: 0;
  background: #0b1420;
  border: 1px solid #8b795c75;
  border-radius: 9px;
  box-shadow: 0 35px 100px #000e, 0 0 0 1px #ffffff0b inset;
  color: #eef0ed;
  isolation: isolate;
}
.start-command:focus-visible { outline: 2px solid var(--menu-gold); }
.start-command .eyebrow,
.start-command .start-kicker { color: var(--menu-gold); letter-spacing: .16em; text-transform: uppercase; font-size: 11px; font-weight: 800; }
.start-header {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  padding: 28px clamp(20px, 3.2vw, 46px) 29px;
  overflow: hidden;
  border-bottom: 1px solid #bb995755;
  background:
    linear-gradient(90deg,#0a101bf7 0%,#0e1826e8 53%,#102236bb 100%),
    repeating-linear-gradient(110deg, transparent 0 42px, #e5c1861a 43px 44px);
}
.start-header:after {
  content: '';
  position: absolute;
  width: 340px;
  height: 340px;
  right: 5%; top: -170px;
  border: 1px solid #e7be7045;
  border-radius: 50%;
  box-shadow: 0 0 0 35px #e7be7007, 0 0 0 75px #e7be7008, 0 0 0 130px #e7be7007;
  pointer-events: none;
}
.start-brand { position: relative; z-index: 1; }
.start-brandline { display: flex; align-items: center; gap: 13px; color: #dac18e; font-size: 11px; font-weight: 800; letter-spacing: .27em; }
.start-brandmark { display: inline-grid; place-items: center; width: 35px; height: 35px; border: 1px solid #d9b36b; transform: rotate(45deg); font: 24px Georgia,serif; color: #f3d89e; }
.start-brandmark span { transform: rotate(-45deg); }
.start-header h1 { font: 700 clamp(34px, 4.3vw, 64px)/.95 Georgia, 'Times New Roman', serif; letter-spacing: -.045em; text-transform: uppercase; margin: 21px 0 8px; color: #f6f2e9; text-shadow: 0 6px 15px #0009; }
.start-header h1 em { font-style: normal; color: #e9bf72; }
.start-header p { margin: 0; color: #b8c3cc; font-size: 14px; line-height: 1.55; max-width: 560px; }
.start-signal { position: relative; z-index: 1; flex: 0 0 auto; text-align: right; font: 700 11px/1.8 'Courier New',monospace; letter-spacing: .08em; color: #b1b9b6; }
.start-signal strong { color: #dbc188; display: block; font-size: 14px; }
.start-signal span { display: block; }
.start-content { padding: 26px clamp(18px, 3.2vw, 46px) 22px; }
.start-layout { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(290px, 1fr); gap: 22px; align-items: stretch; }
.start-conquest-panel {
  position: relative;
  border: 1px solid #c1a36c50;
  background: linear-gradient(145deg,#172538, #0b1725 62%);
  padding: 24px;
  overflow: hidden;
  min-width: 0;
}
.start-conquest-panel:before {
  content: '';
  position: absolute;
  width: 280px; height: 280px;
  top: -140px; right: -95px;
  border: 1px solid #b8a17833;
  border-radius: 50%;
  box-shadow: 0 0 0 29px #c9ae7306, 0 0 0 65px #c9ae7307;
  pointer-events: none;
}
.start-panel-top, .start-section-heading { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.start-panel-index { font: 700 11px 'Courier New',monospace; letter-spacing: .18em; color: #debd80; }
.start-panel-top .start-chip { color: #d2dfdf; padding: 5px 10px; border: 1px solid #e4c18144; background: #dfb86912; font-size: 10px; letter-spacing: .1em; }
.start-command h2 { color: #f2eee5; }
.start-conquest-panel h2 { font: 700 clamp(31px, 3vw, 43px) Georgia,serif; margin: 17px 0 4px; }
.start-intro { font-size: 13px; color: #a9bbc5; line-height: 1.55; margin: 0 0 21px; }
.start-config-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 13px; margin-bottom: 20px; }
.start-config-grid label { display: block; color: #bcc9cf; font-size: 10px; letter-spacing: .15em; text-transform: uppercase; font-weight: 800; margin-bottom: 7px; }
.start-command .select { min-height: 44px; background: #091421; border: 1px solid #61717d; border-radius: 3px; font-size: 13px; color: #f4eee3; }
.start-command .select:focus-visible { outline: 2px solid #dfbc78; outline-offset: 2px; }
.start-section-heading { margin: 1px 0 10px; }
.start-section-heading span { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #e5c98e; font-weight: 800; }
.start-section-heading small { font-size: 11px; color: #98aabb; }
.start-factions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; margin: 0; }
.start-command .start-faction {
  min-width: 0;
  min-height: 140px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 11px 10px 11px 74px;
  text-align: left;
  background: linear-gradient(135deg,#101b2b,#192637);
  border: 1px solid #63748573;
  border-top: 2px solid var(--side-accent, #e7ca8a);
  border-radius: 4px;
  overflow: hidden;
}
.start-command .start-faction:hover:not(:disabled) { border-color: #e0c28c; background: #223244; }
.start-command .start-faction.active { border: 1px solid #f0ce89; border-top: 3px solid var(--side-accent, #e7ca8a); background: linear-gradient(140deg, #293f4c, #132738); box-shadow: inset 0 0 0 1px #f0ce8936; }
.start-command .start-faction:focus-visible { outline: 2px solid #f1d194; outline-offset: 2px; }
.start-command .start-faction .faction-portrait { position: absolute; left: -10px; bottom: 0; width: 88px; height: 140px; object-fit: contain; object-position: bottom left; opacity: .8; pointer-events: none; }
.start-command .start-faction.active .faction-portrait { opacity: 1; }
.start-command .start-faction .faction-banner { position: absolute; top: 9px; right: 8px; left: auto; width: 43px; height: 30px; opacity: .8; pointer-events:none; }
.start-command .start-faction .ufn-start-flag { position: absolute; top: 9px; right: 8px; left: auto; width: 42px; height: auto; margin: 0; }
.start-faction-title { position: relative; z-index: 1; font-size: 15px; font-weight: 800; line-height: 1.1; display: block; max-width: 100%; overflow-wrap: anywhere; color: #f0f0ec; text-shadow: 0 1px 4px #000; margin-bottom: 6px; }
.start-faction-meta { position: relative; z-index: 1; display: block; color: #c5d0d7; font-size: 10px; line-height: 1.4; }
.start-faction-choice { position: relative; z-index: 1; color: #e5c884; display: block; margin-top: 10px; font: 800 10px 'Courier New',monospace; text-transform: uppercase; letter-spacing: .04em; }
.start-command .start-faction.active .start-faction-choice { color: #e5f7e8; }
.start-era-brief { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; border-top: 1px solid #b2c3c62b; margin: 19px 0 16px; padding-top: 16px; font-size: 12px; line-height: 1.5; color: #c4cbd0; }
.start-era-brief strong { color: #f0d294; }
.start-era-name { font-size: 10px; background: #d4ba8240; color: #f8e0b0; border: 1px solid #b99d674d; text-transform: uppercase; padding: 5px 8px; letter-spacing: .08em; font-weight: 800; }
.start-command .start-launch { display: flex; flex-wrap: wrap; align-items: stretch; gap: 9px; }
.start-command .start-launch button { min-height: 48px; font-size: 13px; font-weight: 800; padding: 10px 15px; }
.start-command button.start-launch-main { background: #e3be74; color: #101823; border: 1px solid #f5dfaa; flex: 1 1 205px; text-transform: uppercase; letter-spacing: .07em; }
.start-command button.start-launch-main:hover { background: #f3d99e; border-color: #fff0ca; }
.start-command button.start-resume { flex: 1 1 145px; color: #f1e5cb; border: 1px solid #ae97705e; background: #182637; }
.start-command button.start-resume:hover { background: #26394a; border-color: #dabe86; }
.start-save-warning { color: #f8c39e; font-size: 11px; margin: 10px 0 0; line-height: 1.5; }
.start-reward { display: block; margin-top: 12px; color: #a5b9c9; font-size: 11px; }
.start-side { display: flex; flex-direction: column; min-width: 0; gap: 13px; }
.start-side-title { display: flex; justify-content: space-between; align-items: center; font-size: 11px; letter-spacing: .17em; text-transform: uppercase; color: #dec18a; font-weight: 800; padding: 0 0 1px; }
.start-mode { border: 1px solid #4d5e6d; border-left: 3px solid var(--mode-accent, #d1b37e); background: linear-gradient(105deg,#162333,#0e1a28); padding: 15px 16px 14px; position: relative; }
.start-mode:before { content: ''; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 50%, #ffffff05); pointer-events: none; }
.start-mode h3 { font: 700 20px Georgia,serif; margin: 6px 0; color: #f4ede1; }
.start-mode p { margin: 0 0 10px; font-size: 12px; line-height: 1.45; color: #aebfca; }
.start-mode .start-kicker { font-size: 10px; }
.start-mode-bottom { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.start-mode-info { font: 10px 'Courier New',monospace; color: #d1c0a2; }
.start-command .start-mode button { position: relative; z-index: 1; font-size: 12px; min-height: 33px; padding: 7px 11px; white-space: nowrap; border-color: #b59a6d80; color: #f1ddba; background: #29384a; }
.start-command .start-mode button:hover { background: #354c60; border-color: #e8c88f; }
.start-mode-resume { margin-top: 9px; }
.start-command .start-mode-resume button { width: 100%; white-space: normal; text-align: left; border-color: #568b86; color: #bee6d9; }
.start-hq { margin-top: auto; padding: 15px 16px; background: #0c1724; border: 1px solid #4b5f66; }
.start-hq-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.start-hq-top b { color: #f2cd83; font-size: 18px; white-space: nowrap; }
.start-hq p { margin: 6px 0 10px; font-size: 11px; color: #98aebc; }
.start-hq-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
.start-command .start-hq-actions button { font-size: 11px; padding: 10px 6px; min-width: 0; white-space: normal; line-height: 1.2; border-color: #59717a; color: #d2e4e4; background: #1a2b39; }
.start-command .start-hq-actions button:hover { border-color: #e5c58b; }
.start-foot { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 20px; padding-top: 16px; border-top: 1px solid #d1b78234; }
.start-foot-left { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.start-command .start-foot-left button { background: transparent; border-color: #73818a66; color: #cfd9d8; font-size: 11px; padding: 8px 10px; }
.start-command .start-foot-left button:hover { border-color: #e0c286; background: #1f3040; }
.start-foot small { max-width: 550px; font-size: 10px; line-height: 1.5; color: #7e8e9c; }
.start-foot small b { color: #bda780; }
@media (min-width: 1250px) and (min-height: 820px) {
  .start-conquest-panel { padding: 30px; }
  .start-mode { padding: 19px 20px; }
  .start-content { padding-top: 29px; }
}
@media (max-width: 1000px) {
  .start-layout { grid-template-columns: 1fr; }
  .start-side { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); align-items: start; }
  .start-side-title { grid-column: 1 / -1; }
  .start-mode { height: 100%; }
  .start-mode-bottom { align-items: flex-start; flex-direction: column; }
  .start-mode-bottom button { width: 100%; }
  .start-hq { grid-column: 1 / -1; }
  .start-hq-actions { max-width: 470px; }
  .start-command .start-faction { min-height: 133px; }
}
@media (max-width: 650px) {
  .start-header { padding: 22px 20px; align-items: flex-start; }
  .start-header h1 { font-size: clamp(32px, 9vw, 47px); margin-top: 17px; }
  .start-header p { font-size: 12px; }
  .start-signal { display: none; }
  .start-content { padding: 16px 12px 20px; }
  .start-conquest-panel { padding: 16px 12px; }
  .start-config-grid { grid-template-columns: 1fr; gap: 10px; }
  .start-factions { grid-template-columns: 1fr; }
  .start-command .start-faction { min-height: 88px; padding: 11px 12px 11px 100px; }
  .start-command .start-faction .faction-portrait { height: 115px; width: 104px; }
  .start-command .start-faction .faction-banner { top: 7px; right: 9px; width: 40px; }
  .start-faction-title { font-size: 18px; }
  .start-faction-choice { margin-top: 6px; }
  .start-command .start-launch { flex-direction: column; }
  .start-side { grid-template-columns: 1fr; }
  .start-side-title, .start-hq { grid-column: 1; }
  .start-mode { height: auto; }
  .start-mode-bottom { flex-direction: row; align-items: center; }
  .start-mode-bottom button { width: auto; }
  .start-foot { align-items: flex-start; flex-direction: column; gap: 12px; }
  .start-foot small { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .start-command *, .start-command *:before, .start-command *:after { transition: none !important; animation: none !important; }
}

.game-asset-status { position:fixed; bottom:24px; left:50%; transform:translateX(-50%); z-index:10000; padding:12px 20px; color:#f5ead4; background:#102d40; border:1px solid #ba9c5b; border-radius:8px; box-shadow:0 4px 24px #0008; }
