/* Self-hosted display fonts for the 4K homepage (Codevx_Tashin design).
   Google Fonts CDN is blocked by our CSP (font-src 'self'), so the woff2 files
   live in /fonts/ and are served same-origin. Only the weights the homepage
   uses: Cinzel 700/800 (VIP banner + footer), Hind Siliguri 400/700 (body). */
@font-face { font-family: 'Cinzel'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/cinzel-700.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Cinzel'; font-style: normal; font-weight: 800; font-display: swap; src: url('/fonts/cinzel-800.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Hind Siliguri'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/hind-400-bengali.woff2') format('woff2'); unicode-range: U+0951-0952, U+0964-0965, U+0980-09FE, U+1CD0, U+1CD2, U+1CD5-1CD6, U+1CD8, U+1CE1, U+1CEA, U+1CED, U+1CF2, U+1CF5-1CF7, U+200C-200D, U+20B9, U+25CC, U+A8F1; }
@font-face { font-family: 'Hind Siliguri'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/hind-400-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Hind Siliguri'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/hind-700-bengali.woff2') format('woff2'); unicode-range: U+0951-0952, U+0964-0965, U+0980-09FE, U+1CD0, U+1CD2, U+1CD5-1CD6, U+1CD8, U+1CE1, U+1CEA, U+1CED, U+1CF2, U+1CF5-1CF7, U+200C-200D, U+20B9, U+25CC, U+A8F1; }
@font-face { font-family: 'Hind Siliguri'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/hind-700-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Surprise Studio: shared tokens, reset, buttons, toast. (No inline styles anywhere: our CSP forbids them.) */
:root {
  --bg: #0d0616;
  --bg2: #1a0b2e;
  --ink: #fff;
  --mute: rgba(255, 255, 255, .66);
  --line: rgba(255, 255, 255, .14);
  --glass: rgba(255, 255, 255, .07);
  --glass2: rgba(255, 255, 255, .12);
  --accent: #ff5d8f;
  --accent2: #7c3aed;
  --good: #34d399;
  --warn: #fbbf24;
  --bad: #fb7185;
  --radius: 18px;
  /* Display fonts are the self-hosted Cinzel + Hind Siliguri above (CSP
     font-src 'self' blocks any webfont CDN). Playfair Display / Noto Serif
     were only names before — they never loaded, so serif now falls back to
     the fonts that actually ship. */
  --font: 'Hind Siliguri', 'Kalpurush', 'Nirmala UI', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --serif: 'Cinzel', 'Hind Siliguri', Georgia, 'Times New Roman', serif;
  --mono: ui-monospace, 'SFMono-Regular', Menlo, Consolas, 'Courier New', monospace;
  color-scheme: dark;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--font); color: var(--ink); background: var(--bg); line-height: 1.55; -webkit-font-smoothing: antialiased; }
img, svg, canvas, video { max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: inherit; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  border: 0; border-radius: 999px; padding: .78em 1.5em; font-weight: 700; font-size: 1rem; line-height: 1.1;
  text-decoration: none; color: #fff; background: var(--glass2); border: 1px solid var(--line);
  transition: transform .2s cubic-bezier(.2, .8, .2, 1), box-shadow .25s, background .25s, opacity .2s;
  -webkit-tap-highlight-color: transparent; user-select: none;
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0) scale(.97); }
.btn[disabled] { opacity: .5; pointer-events: none; }
.btn.pink { background: linear-gradient(135deg, var(--accent), var(--accent2)); border-color: transparent; box-shadow: 0 10px 30px -8px var(--accent); }
.btn.pink:hover { box-shadow: 0 16px 40px -8px var(--accent); }
.btn.soft { background: var(--glass2); }
.btn.ghost { background: transparent; }
.btn.danger { background: rgba(251, 113, 133, .16); border-color: rgba(251, 113, 133, .5); color: #ffd5db; }
.btn.small { font-size: .85rem; padding: .55em 1.1em; }
.btn.big { font-size: 1.15rem; padding: .9em 1.9em; }

/* ---------- toast ---------- */
.toast {
  position: fixed; left: 50%; bottom: 28px; transform: translate(-50%, 30px); opacity: 0; z-index: 9999;
  max-width: min(90vw, 460px); padding: .8em 1.3em; border-radius: 14px; background: rgba(20, 10, 36, .94);
  border: 1px solid var(--line); color: #fff; font-weight: 600; box-shadow: 0 14px 40px rgba(0, 0, 0, .5);
  transition: opacity .35s, transform .35s cubic-bezier(.2, .8, .2, 1); pointer-events: none;
}
.toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ---------- form controls ---------- */
.inp, .sel, .txt {
  width: 100%; padding: .8em 1em; border-radius: 12px; border: 1px solid var(--line); background: rgba(0, 0, 0, .28);
  color: #fff; transition: border-color .2s, box-shadow .2s, background .2s;
}
.txt { min-height: 7.5em; resize: vertical; line-height: 1.6; }
.inp:focus, .sel:focus, .txt:focus { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(255, 93, 143, .18); outline: none; background: rgba(0, 0, 0, .4); }
.sel option { background: #1a0b2e; color: #fff; }
.inp::placeholder, .txt::placeholder { color: rgba(255, 255, 255, .35); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}