/* =========================================
   1. GLOBAL VARIABLES & THEME COLORS
   গ্লোবাল ভেরিয়েবল এবং থিম কালারসমূহ
   ========================================= */
:root {
  --gold: #d99c2e; /* Primary Gold Color / প্রধান গোল্ড বা সোনালী কালার */
  --ink: #090909; /* Very Dark Background / খুব গাঢ় ব্যাকগ্রাউন্ড কালার */
  --panel: #151411; /* Panel/Card Background / প্যানেল বা কার্ডের ব্যাকগ্রাউন্ড */
  --line: #3d321d; /* Border and Line Color / বর্ডার এবং লাইনের কালার */
  --text: #f6f4ef; /* Main Text Color / প্রধান টেক্সটের কালার */
  --muted: #a9a49c; /* Muted or Dim Text / হালকা বা অনুজ্জ্বল টেক্সটের কালার */
}

/* =========================================
   2. BASE STYLES & RESETS
   বেস স্টাইল এবং রিসেটসমূহ
   ========================================= */
* {
  /* Box sizing reset / এলিমেন্টের সাইজ ঠিক রাখার জন্য */
  box-sizing: border-box;
}

body {
  margin: 0;
  /* Dark gradient background / ডার্ক গ্রেডিয়েন্ট ব্যাকগ্রাউন্ড */
  background: linear-gradient(135deg, #070707, #17120a 55%, #090909);
  color: var(--text);
  font-family: Inter, Arial, sans-serif;
  font-synthesis: none;
  /* Text rendering optimization / টেক্সট সুন্দরভাবে রেন্ডার করার জন্য */
  text-rendering: optimizeLegibility;
}

/* Text wrapping for multiple elements
   বড় টেক্সট ভেঙে নিচের লাইনে আসার জন্য */
h1, h2, h3, p, li, label, button, a, span, small, strong {
  overflow-wrap: break-word;
}

/* Button resets
   বাটনের ডিফল্ট স্টাইল রিসেট */
button {
  font: inherit;
  cursor: pointer;
}