:root {
  --background: 42 55% 94%;
  --foreground: 342 44% 14%;
  --primary: 342 70% 25%;
  --primary-foreground: 42 70% 96%;
  --secondary: 42 72% 58%;
  --secondary-foreground: 342 50% 15%;
  --muted: 39 34% 84%;
  --muted-foreground: 342 15% 38%;
  --destructive: 0 72% 45%;
  --destructive-foreground: 42 70% 96%;
  --border: 37 32% 75%;
  --card: 42 65% 98%;
  --shadow-sm: 0 6px 16px rgba(64, 14, 31, 0.08);
  --shadow-md: 0 18px 42px rgba(64, 14, 31, 0.13);
  --shadow-lg: 0 28px 80px rgba(64, 14, 31, 0.22);
  --transition-fast: 160ms ease;
  --transition-smooth: 320ms cubic-bezier(.2,.8,.2,1);
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 32px;
}
.dark {
  --background: 342 34% 10%;
  --foreground: 42 70% 93%;
  --primary: 42 72% 58%;
  --primary-foreground: 342 42% 12%;
  --secondary: 342 55% 28%;
  --secondary-foreground: 42 70% 96%;
  --muted: 342 25% 18%;
  --muted-foreground: 42 22% 74%;
  --destructive: 0 72% 55%;
  --destructive-foreground: 42 70% 96%;
  --border: 342 22% 28%;
  --card: 342 32% 14%;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; background: hsl(var(--background)); color: hsl(var(--foreground)); font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif; }
button, input, textarea, select { font: inherit; }
input, textarea, select { font-size: max(16px, 1rem); }
button, a { -webkit-tap-highlight-color: transparent; }
.glass { background: color-mix(in srgb, hsl(var(--card)) 82%, transparent); backdrop-filter: blur(18px); }
.luxury-gradient { background: radial-gradient(circle at top left, rgba(207,162,65,.26), transparent 34%), linear-gradient(135deg, hsl(var(--primary)), #6f1730 55%, #2b0712); }
.gold-text { background: linear-gradient(135deg, #8e6218, #d7ad4c, #fff0a6); -webkit-background-clip: text; background-clip: text; color: transparent; }
.card-hover { transition: transform var(--transition-smooth), box-shadow var(--transition-smooth); }
.card-hover:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); }
.masonry { column-count: 1; column-gap: 1rem; }
@media (min-width: 640px) { .masonry { column-count: 2; } }
@media (min-width: 1024px) { .masonry { column-count: 3; } }
.masonry-item { break-inside: avoid; margin-bottom: 1rem; }
.safe-bottom { padding-bottom: calc(0.75rem + env(safe-area-inset-bottom)); }