:root {
  color-scheme: dark;
  --ink: #eaf5ff;
  --muted: #9db2c3;
  --panel: #101a25;
  --panel2: #172635;
  --accent: #55c9ff;
  --accent2: #ffd85a;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: #081019; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--ink); }
body { display: grid; place-items: center; padding: 16px; }
.game-shell { width: min(100%, 1000px); }
header, footer { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
header { margin-bottom: 10px; }
h1 { margin: 0; font-size: clamp(24px, 4vw, 40px); letter-spacing: 3px; color: var(--accent2); text-shadow: 3px 3px 0 #6f4b13; }
header p, footer { color: var(--muted); }
header p { margin: 4px 0 0; }
button { font: inherit; color: #07111a; background: var(--accent2); border: 0; border-radius: 8px; padding: 10px 14px; font-weight: 800; cursor: pointer; box-shadow: 0 4px 0 #9f7617; }
button:hover { transform: translateY(-1px); }
button:active { transform: translateY(2px); box-shadow: 0 2px 0 #9f7617; }
.audio-controls { display: flex; align-items: center; gap: 8px; }
.audio-btn { min-width: 46px; background: var(--accent); box-shadow: 0 4px 0 #19779f; }
.audio-btn.off { color: #9db2c3; background: #294052; box-shadow: 0 4px 0 #142735; filter: saturate(0.45); }
.audio-btn.off:hover { background: #35536a; }
.canvas-wrap { position: relative; border: 4px solid #28445b; border-radius: 10px; overflow: hidden; background: #13202d; box-shadow: 0 18px 60px #0009; }
canvas { display: block; width: 100%; height: auto; image-rendering: pixelated; background: #182735; }
.overlay { position: absolute; inset: 0; display: none; align-items: center; justify-content: center; background: #07111ad9; padding: 20px; }
.overlay.visible { display: flex; }
.panel { width: min(92%, 480px); padding: 24px; border: 3px solid #6b91aa; border-radius: 12px; background: linear-gradient(#172a3a, #0e1b27); text-align: center; box-shadow: 10px 10px 0 #0006; }
.panel.wide { width: min(94%, 680px); }
.panel h2 { margin-top: 0; color: var(--accent2); font-size: 28px; }
.panel p { color: #c7d7e3; }
.small { font-size: 13px; }
.build-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 16px 0; }
.build-buttons button.selected { outline: 3px solid white; background: var(--accent); box-shadow: 0 4px 0 #19779f; }
#dayStats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 12px 0; }
.stat-card { background: #0a1620; border: 1px solid #35546a; border-radius: 8px; padding: 10px; }
footer { font-size: 12px; margin-top: 10px; flex-wrap: wrap; }
@media (max-width: 650px) {
  body { padding: 6px; }
  header p, footer span:last-child { display: none; }
  .panel { padding: 16px; }
}

#dayOverlay { align-items: flex-start; justify-content: flex-end; background: transparent; pointer-events: none; padding: 10px; }
#dayOverlay .panel { position: absolute; top: 10px; right: 10px; width: min(430px, 56%); max-height: calc(100% - 20px); overflow: auto; padding: 14px; text-align: left; background: #0e1b27ee; pointer-events: auto; touch-action: pan-y; }
#dayOverlay .panel.dragging { opacity: 0.97; box-shadow: 12px 12px 0 #0009; }
.build-topline { touch-action: none; display: flex; justify-content: space-between; align-items: center; color: #8fdfff; font-size: 11px; font-weight: 800; letter-spacing: 1px; cursor: grab; user-select: none; padding: 2px 0 8px; margin-bottom: 6px; border-bottom: 1px dashed #2d536a; }
.build-topline:active { cursor: grabbing; }
.build-heading { display: flex; align-items: center; gap: 8px; }
#dayOverlay .panel h2 { font-size: 21px; margin-bottom: 6px; }
#dayOverlay #dayStats { grid-template-columns: 1fr 1fr; font-size: 12px; }
#dayOverlay .stat-card { padding: 6px; }
#dayOverlay .build-buttons { justify-content: flex-start; margin: 8px 0; }
#dayOverlay .build-buttons button, #dayOverlay #nextDayBtn { padding: 7px 9px; font-size: 12px; }
#dayOverlay .small, #dayOverlay #buildHint { margin: 7px 0; font-size: 11px; }
@media (max-width: 650px) { #dayOverlay .panel { width: 72%; } }

.start-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 16px; }
button.secondary { color: var(--ink); background: #294052; box-shadow: 0 4px 0 #142735; }
button.tiny { padding: 5px 8px; font-size: 11px; border-radius: 6px; box-shadow: 0 3px 0 #142735; }
.tutorial-card {
  position: absolute; left: 12px; top: 12px; width: min(360px, calc(100% - 24px)); z-index: 4;
  display: none; padding: 13px 15px; border: 2px solid #55c9ff; border-radius: 9px;
  background: #07131eef; box-shadow: 6px 6px 0 #0006; pointer-events: auto; touch-action: none;
}
.tutorial-card.visible { display: block; }
.tutorial-card.dragging { opacity: 0.96; box-shadow: 10px 10px 0 #0008; }
.tutorial-topline {
  display: flex; justify-content: space-between; align-items: center; gap: 8px; color: #8fdfff; font-size: 11px;
  font-weight: 800; letter-spacing: 1px; cursor: grab; user-select: none; padding-bottom: 6px; border-bottom: 1px dashed #2d536a;
}
.tutorial-topline:active { cursor: grabbing; }
.tutorial-heading { display: flex; align-items: center; gap: 8px; }
.drag-note {
  display: inline-block; color: #07111a; background: #8fdfff; padding: 2px 6px; border-radius: 999px; font-size: 9px; text-transform: uppercase;
}
.tutorial-card h3 { color: var(--accent2); margin: 7px 0 5px; font-size: 18px; }
.tutorial-card p { color: #d6e7f2; margin: 0; font-size: 13px; line-height: 1.45; }
@media (max-width: 650px) {
  .tutorial-card { width: min(310px, calc(100% - 16px)); left: 8px; top: 8px; padding: 10px 12px; }
  .tutorial-card h3 { font-size: 15px; }
  .tutorial-card p { font-size: 11px; }
}


.restroom-toggle {
  position: absolute; top: 12px; right: 12px; z-index: 6; display: none; align-items: center; gap: 8px;
  min-width: 176px; justify-content: center; padding: 9px 12px; border: 2px solid #ff7782;
  color: #fff4f5; background: #8b2732ee; box-shadow: 0 4px 0 #401019; letter-spacing: .4px;
  touch-action: manipulation;
}
.restroom-toggle.visible { display: flex; }
.restroom-toggle:hover { background: #a8323f; }
.restroom-toggle.closed { border-color: #65e39a; color: #eafff1; background: #17643bee; box-shadow: 0 4px 0 #0a321d; }
.restroom-toggle.closed:hover { background: #1d7a49; }
.restroom-status-dot { width: 10px; height: 10px; flex: 0 0 auto; border-radius: 50%; background: #ff6875; box-shadow: 0 0 0 3px #ff687533; }
.restroom-toggle.closed .restroom-status-dot { background: #62e595; box-shadow: 0 0 0 3px #62e59533; }
@media (max-width: 650px) {
  .restroom-toggle { top: 8px; right: 8px; min-width: 142px; padding: 7px 9px; font-size: 10px; }
}


/* In-game pause menu */
.game-menu-button {
  position: absolute; top: 12px; left: 12px; z-index: 7; display: none;
  min-width: 94px; justify-content: center; padding: 9px 12px;
  border: 2px solid #76d9ff; color: #eefaff; background: #176382ee;
  box-shadow: 0 4px 0 #0a3043; letter-spacing: .6px; touch-action: manipulation;
}
.game-menu-button.visible { display: inline-flex; }
.game-menu-button:hover { background: #1c789d; }
.pause-overlay { z-index: 20; background: #06101bea; backdrop-filter: blur(2px); }
.pause-panel { width: min(92%, 500px); padding: 22px; border-color: #55c9ff; }
.pause-kicker { color: #8fdfff; font-size: 11px; font-weight: 900; letter-spacing: 2px; }
.pause-panel h2 { margin: 5px 0 2px; }
.pause-status { margin: 0 0 14px; color: #a9c7d8 !important; }
.pause-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pause-actions button { width: 100%; }
.pause-actions button.off { opacity: .72; filter: saturate(.45); }
.pause-actions .menu-primary, .pause-actions .danger-button { grid-column: 1 / -1; }
.danger-button { color: #fff5f5; background: #8b2732; box-shadow: 0 4px 0 #401019; }
.danger-button:hover { background: #a8323f; }
.menu-controls { margin-top: 16px; padding: 12px; border: 1px solid #35546a; border-radius: 9px; background: #091722; text-align: left; }
.menu-controls h3 { margin: 0 0 9px; color: #ffd85a; font-size: 15px; text-align: center; }
.control-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.control-grid span { display: flex; flex-direction: column; gap: 2px; padding: 8px; border-radius: 7px; background: #102332; }
.control-grid b { color: #eaf5ff; font-size: 12px; }
.control-grid small { color: #9db2c3; font-size: 10px; }
.menu-note { margin: 12px 0 0 !important; }
@media (max-width: 650px) {
  .game-menu-button { top: 8px; left: 8px; min-width: 76px; padding: 7px 9px; font-size: 10px; }
  .pause-panel { padding: 16px; }
  .pause-actions { grid-template-columns: 1fr; }
  .pause-actions .menu-primary, .pause-actions .danger-button { grid-column: auto; }
  .control-grid { grid-template-columns: 1fr 1fr; }
}


/* V23 difficulty selection */
.difficulty-picker {
  margin: 0 0 14px; padding: 11px; border: 1px solid #35546a; border-radius: 9px;
  background: #07131ed9; text-align: left;
}
.difficulty-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.difficulty-heading span { color: #8fdfff; font-size: 9px; font-weight: 900; letter-spacing: 1.8px; }
.difficulty-heading strong { color: #ffd85a; font-size: 11px; letter-spacing: 1px; }
.difficulty-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.difficulty-option {
  min-width: 0; min-height: 54px; padding: 7px 6px; border: 2px solid #29485d;
  color: #cfe1ec; background: #102332; box-shadow: 0 3px 0 #06101a; text-align: center;
}
.difficulty-option span { display: block; font-size: 11px; font-weight: 900; line-height: 1.1; }
.difficulty-option small { display: block; margin-top: 4px; color: #86a2b4; font-size: 8px; line-height: 1.2; }
.difficulty-option:hover { border-color: #6ecff5; background: #163247; }
.difficulty-option.selected { border-color: #ffd85a; color: #fff4bd; background: #4d3c12; box-shadow: 0 3px 0 #201700, inset 0 0 0 1px #fff2a633; transform: translateY(-1px); }
.difficulty-option.selected small { color: #eadc9b; }
.difficulty-option[data-difficulty="relaxed"].selected { border-color: #65e39a; color: #eafff1; background: #17472e; box-shadow: 0 3px 0 #092518; }
.difficulty-option[data-difficulty="rush"].selected { border-color: #ff7782; color: #fff0f2; background: #62242d; box-shadow: 0 3px 0 #2d0d13; }
.difficulty-description { min-height: 25px; margin: 8px 2px 0 !important; color: #a9c1d0 !important; font-size: 10px; line-height: 1.25; }
@media (max-width: 650px) {
  .difficulty-options { grid-template-columns: 1fr; gap: 5px; }
  .difficulty-option { min-height: 40px; display: grid; grid-template-columns: 90px 1fr; align-items: center; text-align: left; }
  .difficulty-option small { margin-top: 0; }
}

/* Main start menu */
.start-overlay {
  z-index: 30;
  background:
    radial-gradient(circle at 50% 24%, #1e5060aa 0 12%, transparent 38%),
    linear-gradient(135deg, #06101bf2, #0b1d29f2 58%, #07111af5);
}
.start-menu-panel {
  width: min(92%, 560px);
  padding: 26px;
  border-color: #55c9ff;
  background: linear-gradient(180deg, #173348f4, #0a1723f8);
  box-shadow: 12px 12px 0 #0008, inset 0 0 0 1px #bcecff24;
}
.start-menu-kicker { color: #8fdfff; font-size: 10px; font-weight: 900; letter-spacing: 2.4px; }
.start-menu-panel h2 {
  margin: 5px 0 0;
  color: #ffd85a;
  font-size: clamp(34px, 6vw, 54px);
  line-height: 1;
  letter-spacing: 3px;
  text-shadow: 4px 4px 0 #6f4b13;
}
.start-tagline { margin: 10px 0 18px !important; color: #d6e8f3 !important; }
.start-menu-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.start-menu-actions .continue-button { grid-column: 1 / -1; background: #57d084; box-shadow: 0 4px 0 #1d7542; }
.start-menu-actions button { min-height: 46px; }
button:disabled { cursor: not-allowed; transform: none; opacity: .48; filter: saturate(.35); box-shadow: 0 3px 0 #142735; }
.save-info { min-height: 18px; margin: 10px 0 14px !important; color: #9fc1d2 !important; font-size: 12px; }
.start-menu-tools { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding-top: 13px; border-top: 1px solid #35546a; }
.start-menu-tools button { padding: 8px 6px; font-size: 11px; box-shadow: 0 3px 0 #142735; }
.start-menu-tools button.off { opacity: .68; filter: saturate(.45); }
.start-controls-panel { margin-top: 12px; padding: 11px; border: 1px solid #35546a; border-radius: 9px; background: #07131e; text-align: left; }
.start-controls-panel .small { margin: 9px 2px 0 !important; }
.start-menu-footer { display: flex; justify-content: space-between; gap: 10px; margin-top: 14px; color: #7895a7; font-size: 10px; }
@media (max-width: 650px) {
  .start-menu-panel { padding: 17px; }
  .start-menu-tools { grid-template-columns: 1fr 1fr; }
  .start-menu-panel h2 { font-size: 34px; }
  .start-menu-footer { flex-direction: column; gap: 3px; }
}

.supply-shop {
  margin: 12px 0 8px;
  padding: 10px;
  border: 2px solid #31546a;
  background: #102431e8;
  border-radius: 8px;
}
.supply-shop h3 { margin: 0 0 4px; color: #ffd85a; }
.supply-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.supply-buttons button { font-size: 12px; padding: 7px 8px; }
.supply-buttons button:disabled { opacity: .45; cursor: default; }


/* V20 special-event banner */
.event-banner {
  --event-color: #ffd85a;
  position: absolute;
  top: 62px;
  right: 12px;
  z-index: 8;
  width: min(350px, calc(100% - 24px));
  display: grid;
  grid-template-columns: 42px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px 11px;
  border: 2px solid var(--event-color);
  border-radius: 9px;
  background: #07131ef2;
  box-shadow: 6px 6px 0 #0008;
  opacity: 0;
  transform: translateY(-14px) scale(.98);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}
.event-banner.visible { opacity: 1; transform: translateY(0) scale(1); }
.event-banner.warning { animation: eventPulse 1s steps(2, end) infinite; }
.event-banner.paused { filter: saturate(.55); opacity: .82; }
.event-icon {
  width: 40px; height: 40px; display: grid; place-items: center;
  border-radius: 8px; color: #07111a; background: var(--event-color);
  font-size: 23px; box-shadow: inset 0 -3px 0 #0003;
}
.event-copy { min-width: 0; }
.event-eyebrow { color: var(--event-color); font-size: 9px; font-weight: 900; letter-spacing: 1.3px; }
.event-copy strong { display: block; margin-top: 2px; color: #f6fbff; font-size: 14px; line-height: 1.1; }
.event-copy p { margin: 3px 0 0; color: #bcd0dc; font-size: 10px; line-height: 1.25; }
.event-time {
  min-width: 43px; padding: 5px 6px; border: 1px solid var(--event-color);
  border-radius: 6px; color: var(--event-color); background: #102331; font-size: 10px; font-weight: 900; text-align: center;
}
@keyframes eventPulse { 50% { box-shadow: 6px 6px 0 #0008, 0 0 0 3px #ffffff18; } }
@media (max-width: 650px) {
  .event-banner { top: 48px; right: 8px; width: calc(100% - 16px); grid-template-columns: 34px 1fr auto; padding: 8px; }
  .event-icon { width: 32px; height: 32px; font-size: 18px; }
  .event-copy strong { font-size: 12px; }
  .event-copy p { font-size: 9px; }
  .event-time { min-width: 38px; font-size: 9px; }
}

/* V21 live supply shop */
.shop-button {
  position: absolute; top: 58px; right: 12px; z-index: 7; display: none;
  min-width: 132px; justify-content: center; padding: 8px 11px;
  border: 2px solid #ffd85a; color: #fff8d4; background: #705510ee;
  box-shadow: 0 4px 0 #352600; letter-spacing: .5px; touch-action: manipulation;
}
.shop-button.visible { display: inline-flex; }
.shop-button:hover { background: #8a6814; }
.shop-overlay { z-index: 19; background: #06101be8; backdrop-filter: blur(2px); }
.shop-panel { width: min(92%, 520px); border-color: #ffd85a; }
.shop-kicker { color: #ffd85a; font-size: 10px; font-weight: 900; letter-spacing: 1.7px; }
.shop-panel h2 { margin: 5px 0 8px; }
.shop-stock { margin: 0 0 5px !important; padding: 9px; border: 1px solid #35546a; border-radius: 7px; background: #091722; color: #eaf5ff !important; font-weight: 800; }
.shop-money { margin: 0 0 12px !important; color: #65e39a !important; font-weight: 900; }
.live-supply-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.live-supply-buttons button { display: flex; justify-content: space-between; gap: 8px; width: 100%; text-align: left; }
.live-supply-buttons button span { color: #4a3300; }
.live-supply-buttons button:disabled { opacity: .45; cursor: default; transform: none; }
.shop-hint { min-height: 38px; margin: 12px 0 !important; }
.shop-panel > .menu-primary { width: 100%; }
@media (max-width: 650px) {
  .shop-button { top: 47px; right: 8px; min-width: 112px; padding: 7px 9px; font-size: 10px; }
  .shop-panel { padding: 16px; }
  .live-supply-buttons { grid-template-columns: 1fr; }
}

/* V21 event notices can be dismissed and auto-hide after announcing. */
.event-banner { grid-template-columns: 42px 1fr auto 26px; pointer-events: auto; top: 104px; }
.event-dismiss {
  align-self: start; width: 24px; height: 24px; min-width: 24px; padding: 0;
  border: 1px solid #6f8795; border-radius: 6px; color: #dbeaf2; background: #152a38;
  box-shadow: none; font-size: 18px; line-height: 20px;
}
.event-dismiss:hover { transform: none; background: #263e4e; }
@media (max-width: 650px) {
  .event-banner { top: 86px; grid-template-columns: 34px 1fr auto 24px; }
  .event-dismiss { width: 22px; height: 22px; min-width: 22px; font-size: 16px; }
}
.event-banner { pointer-events: none; }
.event-banner.visible { pointer-events: auto; }


/* v27: permanent restroom upgrades and accessible-stall controls */
.restroom-upgrades {
  margin: 10px 0;
  padding: 10px;
  border: 1px solid #39718b;
  border-radius: 9px;
  background: linear-gradient(180deg, #102938, #0a1a25);
}
.restroom-upgrades h3 { margin: 0 0 4px; color: #72ccff; }
.restroom-upgrade-buttons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 7px;
}
.restroom-upgrade-buttons button {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-height: 43px;
  padding: 7px 9px;
  text-align: left;
}
.restroom-upgrade-buttons button span { font-weight: 800; }
.restroom-upgrade-buttons button small { opacity: 0.78; font-size: 10px; }
.restroom-upgrade-buttons button:disabled { opacity: 0.48; filter: grayscale(0.25); }
@media (max-width: 700px) { .restroom-upgrade-buttons { grid-template-columns: 1fr; } }


/* v28 achievements and milestones */
.achievement-toast{position:absolute;top:12px;left:50%;z-index:45;display:grid;grid-template-columns:42px 1fr;gap:10px;align-items:center;width:min(420px,calc(100% - 24px));padding:10px 13px;border:2px solid #ffd85a;border-radius:9px;color:#eefaff;background:linear-gradient(135deg,#20354cee,#15222fee);box-shadow:0 6px 0 #0008,0 0 24px #ffd85a35;opacity:0;transform:translate(-50%,-18px) scale(.96);pointer-events:none;transition:opacity .22s ease,transform .22s ease}.achievement-toast.visible{opacity:1;transform:translate(-50%,0) scale(1)}.achievement-toast-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:#ffd85a;color:#2b2100;font-size:23px;box-shadow:inset 0 -4px 0 #a97700}.achievement-toast small{display:block;color:#ffd85a;font-size:8px;letter-spacing:1.4px;font-weight:900}.achievement-toast strong{display:block;margin-top:2px;font-size:14px}.achievement-toast p{margin:2px 0 0;color:#bcd0dc;font-size:10px}
.achievements-overlay{z-index:40;background:#06101bf2;backdrop-filter:blur(3px)}.achievements-panel{width:min(94%,820px);max-height:88%;overflow:auto;border-color:#ffd85a;text-align:left}.achievements-topline{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.achievements-kicker{color:#ffd85a;font-size:9px;font-weight:900;letter-spacing:1.7px}.achievements-panel h2{margin:4px 0 5px}.achievement-close{min-width:34px;width:34px;height:34px;padding:0;font-size:22px;line-height:1;background:#263e4e;color:#eefaff;border-color:#6f8795;box-shadow:none}.achievement-summary{margin:0 0 12px!important;color:#9fc1d2!important}.achievement-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.achievement-card{display:grid;grid-template-columns:38px 1fr;gap:9px;min-height:76px;padding:10px;border:1px solid #35546a;border-radius:8px;background:#0a1924;opacity:.62}.achievement-card.unlocked{border-color:#d9a923;background:linear-gradient(145deg,#25354a,#15212d);opacity:1;box-shadow:inset 0 0 18px #ffd85a12}.achievement-card .icon{width:36px;height:36px;display:grid;place-items:center;border-radius:8px;background:#172b39;font-size:20px}.achievement-card.unlocked .icon{background:#ffd85a;color:#332600}.achievement-card strong{display:block;color:#f1f8ff;font-size:12px}.achievement-card p{margin:3px 0 5px;color:#9fb7c7;font-size:9px;line-height:1.25}.achievement-card .status{color:#ffd85a;font-size:9px;font-weight:900}.achievement-progress{height:5px;margin-top:4px;overflow:hidden;border-radius:5px;background:#07111a}.achievement-progress span{display:block;height:100%;background:linear-gradient(90deg,#55c9ff,#ffd85a)}.milestone-heading{display:flex;align-items:baseline;justify-content:space-between;margin-top:17px;border-top:1px solid #35546a;padding-top:12px}.milestone-heading h3{margin:0;color:#72ccff}.milestone-heading span{color:#7896a8;font-size:9px}.milestone-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:8px}.milestone-card{padding:9px;border:1px solid #2a4658;border-radius:7px;background:#091722;text-align:center}.milestone-card b{display:block;color:#ffd85a;font-size:18px}.milestone-card span{color:#9fb7c7;font-size:9px}@media(max-width:680px){.achievement-grid{grid-template-columns:1fr}.milestone-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.achievements-panel{padding:15px}.achievement-toast{top:7px}}


/* v29 employee hiring and roster */
.staff-office{margin:10px 0;padding:10px;border:1px solid #5b6f9a;border-radius:9px;background:linear-gradient(180deg,#18283d,#0b1927)}
.staff-office h3{margin:0 0 4px;color:#b9c9ff}.staff-hire-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:7px}.staff-hire-buttons button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:45px;padding:7px 8px;text-align:left}.staff-hire-buttons button span{font-weight:900}.staff-hire-buttons button small{font-size:9px;opacity:.78}.staff-roster{display:grid;gap:6px;margin-top:8px}.staff-roster>p{margin:2px!important;color:#8ea9ba!important}.staff-card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px;padding:7px 8px;border:1px solid #334e66;border-radius:7px;background:#081621}.staff-card strong{display:block;color:#eefaff;font-size:11px}.staff-card small{display:block;margin-top:2px;color:#91aabd;font-size:9px}.staff-card button{padding:5px 8px;font-size:9px;color:#fff0f1;background:#7e2630;box-shadow:0 3px 0 #3d1016}.staff-card .staff-ready{color:#65e39a}.staff-card .staff-next{color:#ffd85a}@media(max-width:760px){.staff-hire-buttons{grid-template-columns:1fr}.staff-hire-buttons button{min-height:38px}}