/* ================================================================
   base.css — Shared reset, typography, and orb background.
   All pages include this. Page-specific overrides go in <style>.
   Dynamic values come from CSS custom properties set in :root
   by the PHP shell (e.g. --sm-bg, --sm-orb-opacity).
   ================================================================ */

/* ---- Reset ---- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
    width: 100%; height: 100%; overflow: hidden;
    background: var(--sm-bg, #0d0d0d);
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    color: #f0f0f0;
    -webkit-text-size-adjust: 100%;
}

/* Remove tap highlight and 300ms tap delay without disabling pinch-zoom. */
a, button, [role="button"], input, select, textarea, label {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

/* ---- Background orbs ---- */
.orb {
    position: fixed;
    border-radius: 50%;
    filter: blur(80px);
    opacity: var(--sm-orb-opacity, 0.55);
    pointer-events: none;
    will-change: transform;
}
.orb-1 { width: 420px; height: 420px; background: #6366f1; top: -80px; left: -80px; }
.orb-2 { width: 320px; height: 320px; background: #38bdf8; bottom: 60px; right: -60px; }
.orb-3 { width: 200px; height: 200px; background: #a78bfa; top: 50%; left: 55%; }
