/* Mini Tycoon 26.2: one palette for React and the account/multiplayer add-ons.
   The six original palettes remain in the game bundle. These semantic aliases
   inherit them, so an already-open panel updates without being rebuilt. */
:root {
  --mt-bg: hsl(var(--background));
  --mt-text: hsl(var(--foreground));
  --mt-panel: hsl(var(--popover));
  --mt-card: hsl(var(--card));
  --mt-muted: hsl(var(--muted));
  --mt-soft: hsl(var(--muted-foreground));
  --mt-border: hsl(var(--border));
  --mt-action: hsl(var(--primary));
  --mt-action-text: hsl(var(--primary));
  --mt-action-fg: hsl(var(--primary-foreground));
  --mt-secondary: hsl(var(--secondary));
  --mt-secondary-fg: hsl(var(--secondary-foreground));
  --mt-hover: hsl(var(--accent));
  --mt-hover-fg: hsl(var(--accent-foreground));
  --mt-overlay: hsl(var(--background) / .92);
  --mt-shadow: hsl(var(--background) / .65);
  --mt-pixel-border: hsl(var(--foreground) / .28);
  --mt-success: #86e9b0;
  --mt-warning: #ffda85;
  --mt-danger: #ffabb3;
  --mt-danger-bg: #9e263d;
  --mt-danger-fg: #fff;
  --mt-award: #ffda85;
  --mt-award-fg: #241b08;
  color-scheme: dark;
}
:root[data-theme="mint"], :root[data-theme="blueprint"] {
  --mt-overlay: hsl(var(--background) / .92);
  --mt-shadow: hsl(var(--foreground) / .2);
  --mt-success: #146b42;
  --mt-warning: #805108;
  --mt-danger: #a51d37;
  --mt-danger-bg: #a51d37;
  --mt-award: #f3cd65;
  color-scheme: light;
}
/* Derived accessible action shades; the original palette definitions and
   factory world colours are unchanged. White on the original mint green is
   below 4.5:1, so small labels/buttons use a darker shade of the same hue. */
:root[data-theme="mint"] {
  --mt-action: hsl(156 62% 29%);
  --mt-action-text: hsl(156 62% 29%);
  --mt-secondary: hsl(203 74% 37%);
}
:root[data-theme="blueprint"] { --mt-secondary: hsl(199 72% 34%); }

html, body, #root { background-color: var(--mt-bg) !important; color: var(--mt-text); }
body { accent-color: var(--mt-action); }
::selection { background: var(--mt-action); color: var(--mt-action-fg); }
input, select, textarea { color-scheme: inherit; }
input::placeholder, textarea::placeholder { color: var(--mt-soft) !important; opacity: 1; }
button:focus-visible, a:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid var(--mt-action) !important; outline-offset: 3px;
}
button:disabled { cursor: default; }
.text-primary { color: var(--mt-action-text) !important; }
.bg-primary { background-color: var(--mt-action) !important; }
.bg-secondary { background-color: var(--mt-secondary) !important; }
.bg-destructive { background-color: var(--mt-danger-bg) !important; color: var(--mt-danger-fg) !important; }
.text-destructive { color: var(--mt-danger) !important; }
.text-chart-3 { color: var(--mt-warning) !important; }
.bg-chart-3 { background-color: var(--mt-award) !important; color: var(--mt-award-fg) !important; }
.bg-chart-5 { background-color: var(--mt-secondary) !important; color: var(--mt-secondary-fg) !important; }
[class~="border-black/20"], [class~="border-black/30"],
[class~="border-black/40"], [class~="border-black/50"],
[class~="border-black/60"], [class~="border-black/70"],
[class~="border-white/15"], [class~="border-white/25"], [class~="border-white/40"] {
  border-color: var(--mt-pixel-border) !important;
}
[class~="bg-black/60"], [class~="bg-black/70"] { background-color: var(--mt-overlay) !important; }
[class~="bg-black/60"][class~="text-white"] { color: var(--mt-text) !important; }
[class~="bg-black/25"] { background-color: hsl(var(--muted) / .8) !important; }
[class~="bg-white/45"] { background-color: hsl(var(--primary) / .75) !important; }

/* Fixed-position add-ons used to have independent blue-only palettes. */
#mt-auth-modal, #mt-cloud-modal, #mt-staff-overlay, #mt-ban-overlay,
#part-shell, #mt-arcade, #mt-dialog-overlay {
  background: var(--mt-overlay) !important; color: var(--mt-text) !important;
}
#mt-auth-panel, #mt-cloud-panel, #mt-staff-panel, #mt-ban-panel,
#part-dialog, #mt-arcade .mt-a-panel, #mt-dialog-panel {
  background: var(--mt-panel) !important; color: var(--mt-text) !important;
  border-color: var(--mt-border) !important;
  box-shadow: 4px 4px 0 var(--mt-pixel-border), 0 16px 50px var(--mt-shadow) !important;
  font-family: var(--font-body) !important;
}
#mt-auth-panel h2, #mt-cloud-panel h2, #mt-staff-panel h2, #mt-ban-panel h2,
#part-dialog h2, #part-dialog h3, #mt-arcade h2, #mt-arcade h3 {
  color: var(--mt-text) !important; font-family: var(--font-heading) !important;
}
#mt-auth-panel p, #mt-cloud-panel p, #mt-staff-panel p, #mt-ban-panel p,
#part-dialog .part-soft, #mt-arcade p, #mt-arcade .mt-a-card small,
#mt-staff-panel .mt-uid { color: var(--mt-soft) !important; }
#mt-staff-panel .mt-card, #part-dialog .part-box, #mt-arcade .mt-a-card {
  background: var(--mt-card) !important; color: var(--mt-text) !important;
  border-color: var(--mt-border) !important;
}
#part-dialog .part-players span, #mt-arcade .mt-a-memory button,
#mt-arcade .mt-a-package { background: var(--mt-hover) !important; color: var(--mt-hover-fg) !important; }
#mt-auth-launch, #mt-auth-settings-entry, #mt-cloud-open, #mt-staff-open,
#mt-arcade-open, #mt-arcade-settings,
#mt-auth-panel button, #mt-cloud-panel button,
#mt-staff-panel button, #mt-ban-panel button, #part-dialog .part-btn,
#mt-arcade button, #mt-dialog-panel button {
  background: var(--mt-action) !important; color: var(--mt-action-fg) !important;
  border: 1px solid var(--mt-border) !important;
  font-family: var(--font-heading) !important;
  min-height: 42px;
}
#mt-auth-panel button.link, #part-dialog .part-btn.secondary,
#mt-arcade button.mt-a-ghost, #mt-dialog-panel button.secondary {
  background: var(--mt-muted) !important; color: var(--mt-text) !important;
}
#mt-cloud-panel button.danger, #part-dialog .part-btn.danger,
#mt-dialog-panel button.danger {
  background: var(--mt-danger-bg) !important; color: var(--mt-danger-fg) !important;
}
#mt-auth-panel input, #mt-cloud-panel input,
#mt-staff-panel input, #mt-staff-panel select,
#part-dialog input, #part-dialog select, #part-dialog textarea,
#mt-arcade input, #mt-dialog-panel input {
  background: var(--mt-bg) !important; color: var(--mt-text) !important;
  border: 1px solid var(--mt-border) !important;
  caret-color: var(--mt-action);
}
#part-dialog select, #part-dialog textarea {
  padding: 11px; border-radius: 10px; font-size: 16px; min-width: 0;
  touch-action: manipulation;
}
#mt-cloud-panel .mt-slot-row { border-color: var(--mt-border) !important; }
#mt-auth-panel #mt-auth-msg, #part-dialog #part-status,
#mt-arcade .mt-a-output, #mt-staff-panel #mt-staff-status {
  color: var(--mt-warning) !important;
}
#mt-auth-panel #mt-auth-msg.good, #part-dialog #part-status[data-state="success"],
#part-dialog #part-status.part-success,
#part-dialog .part-online { color: var(--mt-success) !important; }
#part-dialog #part-status[data-state="error"], #part-dialog #part-status.part-error,
#part-dialog .part-error {
  color: var(--mt-danger) !important;
}
#part-dialog canvas { border-color: var(--mt-border) !important; }
#part-dialog .part-ink { border-color: var(--mt-border) !important; }
#part-dialog .part-ink.current { outline-color: var(--mt-action) !important; }
#mt-arcade .mt-a-conveyor {
  background: repeating-linear-gradient(0deg,var(--mt-muted),var(--mt-muted) 47px,var(--mt-hover) 48px,var(--mt-hover) 50px) !important;
  border-color: var(--mt-border) !important;
}
#mt-arcade .mt-a-canvas { border-color: var(--mt-border) !important; }
/* Doodle paper and ink are artwork; retain their paper/pen colours. */
@media (hover:hover) {
  #mt-auth-launch:hover, #mt-auth-settings-entry:hover, #mt-cloud-open:hover,
  #mt-staff-open:hover, #mt-arcade-open:hover, #mt-arcade-settings:hover,
  #mt-auth-panel button:hover:enabled, #mt-cloud-panel button:hover:enabled,
  #mt-staff-panel button:hover:enabled, #mt-ban-panel button:hover:enabled,
  #part-dialog .part-btn:hover:enabled, #mt-arcade button:hover:enabled,
  #mt-dialog-panel button:hover:enabled {
    filter: none !important; box-shadow: inset 0 0 0 2px var(--mt-pixel-border);
  }
  #mt-arcade .mt-a-card:hover:enabled { background: var(--mt-hover) !important; }
}
#part-dialog [aria-selected="true"], #mt-arcade [aria-selected="true"],
#part-dialog [aria-pressed="true"], #mt-arcade [aria-pressed="true"] {
  outline: 2px solid var(--mt-action); outline-offset: 2px;
}
[aria-busy="true"] { cursor: progress; }
[role="progressbar"] { accent-color: var(--mt-action); }
.animate-spin { color: var(--mt-action-text); }

/* Non-blocking, theme-aware replacements for browser-native popups. */
#mt-dialog-overlay {
  position: fixed; inset: 0; z-index: 2147483600; display: flex;
  align-items: center; justify-content: center; padding: 18px;
  box-sizing: border-box; touch-action: pan-y;
}
#mt-dialog-panel {
  width: min(440px,100%); max-height: 90dvh; overflow: auto;
  padding: 22px; border: 2px solid; border-radius: 12px;
}
#mt-dialog-panel h2 { font-weight: 900; margin: 0 0 12px; font-size: 20px; }
#mt-dialog-message { white-space: pre-wrap; line-height: 1.5; margin: 0 0 16px; overflow-wrap: anywhere; }
#mt-dialog-panel input { width: 100%; padding: 12px; font-size: 16px; margin-bottom: 14px; border-radius: 7px; }
#mt-dialog-panel .mt-dialog-actions { display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
#mt-dialog-panel button { padding: 10px 16px; border-radius: 7px; font-weight: 800; }
@media (prefers-reduced-motion:reduce) { #mt-dialog-overlay * { transition: none !important; } }

/* Device downloads share the selected palette and stay below modal overlays. */
#mt-download-launch, #mt-dialog-panel .mt-download-link {
  background: var(--mt-action); color: var(--mt-action-fg);
  border: 2px solid var(--mt-border); border-radius: 9px;
  font-family: var(--font-heading); font-weight: 800;
  padding: 12px 16px; min-height: 44px; cursor: pointer;
  box-sizing: border-box; touch-action: manipulation;
}
#mt-download-launch {
  position: fixed; right: max(12px, env(safe-area-inset-right));
  bottom: max(12px, env(safe-area-inset-bottom)); z-index: 60;
  font-size: 12px; max-width: calc(100vw - 24px);
  box-shadow: 3px 3px 0 var(--mt-pixel-border);
}
#mt-dialog-panel .mt-download-links { display: grid; gap: 12px; margin-bottom: 18px; }
#mt-dialog-panel .mt-download-link { display: flex; align-items: center; justify-content: center; text-align: center; text-decoration: none; font-size: 14px; }
#mt-download-launch:hover:enabled, #mt-dialog-panel .mt-download-link:hover {
  box-shadow: inset 0 0 0 2px var(--mt-pixel-border);
}