/* ═══════════════════════════════════════════
   NIZUMO — base.css
   Variables, Reset, Typography
═══════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Sora:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=optional');

:root {
  /* Colors */
  --pink:        #f062a4;
  --pink2:       #ff8cc8;
  --pink3:       #ffc2dc;
  --purple:      #9b5de5;
  --purple2:     #c084fc;
  --dark:        #0a0812;
  --dark1:       #0f0c1a;
  --dark2:       #13101f;
  --dark3:       #1a1628;
  --dark4:       #221e32;
  --dark5:       #2e293f;
  --border:      rgba(255,255,255,0.07);
  --border2:     rgba(240,98,164,0.2);
  --green:       #4ade80;
  --blue:        #60a5fa;
  --yellow:      #fbbf24;
  --red:         #f87171;

  /* Text */
  --t0:          #f4f0ff;
  --t1:          #c8c0e0;
  --t2:          #8878a8;
  --t3:          #4a4060;

  /* Fonts */
  --ui:          'Sora', system-ui, sans-serif;
  --mono:        'JetBrains Mono', monospace;

  /* Assets */
  --logo:        url('https://i.ibb.co/yn09DS14/file-00000000aacc71faad65fc29f0821fa4.png');
  --petal1:      url('https://i.ibb.co/jKqgPjN/file-0000000007cc71fa91263f9a6a2f490c.png');
  --petal2:      url('https://i.ibb.co/QVw0RRs/file-00000000ef1c71fa91bc188012b3ebae.png');
  --petal3:      url('https://i.ibb.co/Fq4zRZ7P/file-00000000c92071fabf15115ce88ce0a4.png');

  /* Shadows */
  --shadow-pink: 0 0 30px rgba(240,98,164,0.25);
  --shadow-card: 0 8px 32px rgba(0,0,0,0.4);
  --shadow-glow: 0 0 60px rgba(240,98,164,0.15);

  /* Radius */
  --r-sm:  8px;
  --r-md:  12px;
  --r-lg:  18px;
  --r-xl:  24px;
  --r-full: 9999px;

  /* Transitions */
  --t-fast:   0.15s ease;
  --t-normal: 0.25s ease;
  --t-slow:   0.4s ease;
}

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

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  background: var(--dark);
  color: var(--t0);
  font-family: var(--ui);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

img { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }
button { cursor: pointer; font-family: var(--ui); }
input, textarea, select { font-family: var(--ui); }

/* ── SCROLLBAR ── */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--dark5); border-radius: 2px; }
::-webkit-scrollbar-thumb:hover { background: var(--t3); }

/* ── SELECTION ── */
::selection {
  background: rgba(240,98,164,0.3);
  color: var(--t0);
}