/* ── SHARED THEME (dipakai index.html & login.html) ──
   Brand Tanya Ners: ungu #B964C8 (utama), aksen oranye/teal, font Nunito+Mulish.
   Satu tone biar kerasa kayak buka aplikasi. */
:root{
  --purple:#B964C8; --purpleD:#9F4FAE; --purpleL:#D194DD; --purpleXL:#E5BFEC; --ghost:#F6ECF9;
  --orange:#FFA466; --orangeD:#F4875A; --teal:#4EC9C0;
  --bg:#FAF7FE; --ink:#2a1230; --sub:#8E5E97; --mute:#C6ABCF; --border:#F0E2F3;
  --grad:linear-gradient(135deg,#C97BD6,#9F4FAE);
  --gradOrange:linear-gradient(135deg,#FFB683,#F4875A);
  --shadow:0 10px 30px rgba(155,79,174,.12);
  --shadowSoft:0 6px 16px rgba(155,79,174,.08);
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:'Mulish',sans-serif;
  background:var(--bg);min-height:100vh;min-height:100dvh;overflow-x:hidden;color:var(--ink);
  -webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;
  text-size-adjust:100%;-webkit-text-size-adjust:100%;
}
h1,h2,h3,h4{font-family:'Nunito',sans-serif}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@keyframes logoBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes playPulse{0%{transform:scale(1);opacity:.5}100%{transform:scale(1.6);opacity:0}}

/* ── INPUT/SELECT dasar (identik di kedua halaman) ──
   font-size 16px: di iOS, input < 16px bikin halaman auto-zoom pas di-tap */
input,select{
  width:100%;font-family:'Mulish',sans-serif;font-size:16px;font-weight:600;color:var(--ink);
  background:#fff;border:1.5px solid var(--border);border-radius:16px;padding:14px 16px;outline:none;
  transition:border-color .2s,background .2s,box-shadow .2s;
}
input::placeholder{color:var(--mute);font-weight:500}
input:focus,select:focus{border-color:var(--purple);background:var(--ghost);box-shadow:0 6px 18px rgba(185,100,200,.16)}

.foot{text-align:center;font-family:'Nunito',sans-serif;font-size:12px;font-weight:700;color:var(--mute);margin-top:1.25rem}