/* Utilities used by the PHP templates that the scraped Tailwind build does not ship.
   Keep the same class names so the markup stays interchangeable with index.html. */

:root { --mitamers-electric: #0cb4d6; }

/* --- opacity variants of white text --- */
.text-white\/38 { color: rgb(255 255 255 / .38); }
.text-white\/42 { color: rgb(255 255 255 / .42); }
.text-white\/48 { color: rgb(255 255 255 / .48); }
.text-white\/58 { color: rgb(255 255 255 / .58); }
.text-white\/62 { color: rgb(255 255 255 / .62); }
.text-white\/68 { color: rgb(255 255 255 / .68); }
.text-white\/72 { color: rgb(255 255 255 / .72); }
.text-white\/88 { color: rgb(255 255 255 / .88); }
.text-\[\#f5c451\] { color: #f5c451; }

/* --- accent surfaces (buttons) --- */
.bg-mitamers-electric\/12 { background-color: rgb(12 180 214 / .12); }
.hover\:bg-mitamers-electric\/18:hover { background-color: rgb(12 180 214 / .18); }
.bg-mitamers-electric\/\[0\.05\] { background-color: rgb(12 180 214 / .05); }
.border-white\/\[0\.10\] { border-color: rgb(255 255 255 / .10); }
.hover\:border-white\/20:hover { border-color: rgb(255 255 255 / .20); }

/* --- status colours --- */
.bg-emerald-400\/\[0\.07\] { background-color: rgb(52 211 153 / .07); }
.shadow-\[0_0_10px_rgba\(52\,211\,153\,0\.7\)\] { box-shadow: 0 0 10px rgb(52 211 153 / .7); }
.shadow-\[0_0_10px_rgba\(251\,191\,36\,0\.7\)\]  { box-shadow: 0 0 10px rgb(251 191 36 / .7); }
.shadow-\[0_0_10px_rgba\(244\,63\,94\,0\.7\)\]   { box-shadow: 0 0 10px rgb(244 63 94 / .7); }

/* --- layout / misc --- */
.aspect-\[10\/13\] { aspect-ratio: 10 / 13; }
.aspect-\[10\/14\] { aspect-ratio: 10 / 14; }
.items-baseline   { align-items: baseline; }
.right-5 { right: 1.25rem; }
.top-5   { top: 1.25rem; }
.ring-white\/\[0\.07\] { --tw-ring-color: rgb(255 255 255 / .07); }
.shadow-\[0_18px_50px_rgba\(0\,0\,0\,0\.42\)\] { box-shadow: 0 18px 50px rgb(0 0 0 / .42); }
.divide-white\/\[0\.06\] > * + * { border-color: rgb(255 255 255 / .06); }

/* --- gradients used by the page shells --- */
.from-\[\#0a0b1e\]\/70 { --tw-gradient-from: rgb(10 11 30 / .70); }
.from-\[\#0a0b1e\]\/88 { --tw-gradient-from: rgb(10 11 30 / .88); }
.via-\[\#0f1028\]\/74  { --tw-gradient-via: rgb(15 16 40 / .74); }
.to-\[\#0a0b1e\]\/96   { --tw-gradient-to: rgb(10 11 30 / .96); }

/* --- type scale --- */
.sm\:py-18 { }
@media (min-width: 640px) {
  .sm\:py-18   { padding-top: 4.5rem; padding-bottom: 4.5rem; }
  .sm\:py-22   { padding-top: 5.5rem; padding-bottom: 5.5rem; }
  .sm\:text-\[1\.9rem\] { font-size: 1.9rem; }
}
@media (min-width: 1024px) {
  .lg\:text-\[2\.1rem\]  { font-size: 2.1rem; }
  .lg\:text-\[2\.75rem\] { font-size: 2.75rem; }
  .lg\:grid-cols-\[minmax\(0\,0\.9fr\)_minmax\(0\,1\.1fr\)\] {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  }
}

/* --- long-form copy (terms, about, reseller, game description) --- */
.prose-mitamers a  { color: var(--mitamers-electric); }
.prose-mitamers h2 { margin-top: 2rem; margin-bottom: .75rem; font-size: 1.25rem; font-weight: 600; color: #fff; }
.prose-mitamers h3 { margin-top: 1.5rem; margin-bottom: .5rem; font-weight: 600; color: #fff; }
.prose-mitamers p  { margin-bottom: 1rem; }
.prose-mitamers ul { margin-bottom: 1rem; padding-left: 1.25rem; list-style: disc; }
.prose-mitamers li { margin-bottom: .375rem; }