*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
html, body { height: 100%; background: #1a1a1a; }
body { -webkit-font-smoothing: antialiased; overflow-x: hidden; font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Helvetica Neue', sans-serif; }
@keyframes fadeUp   { from { opacity:0; transform:translateY(12px) } to { opacity:1; transform:translateY(0) } }
@keyframes slideUp  { from { opacity:0; transform:translateY(40px) } to { opacity:1; transform:translateY(0) } }
@keyframes scaleIn  { from { opacity:0; transform:scale(0.94) }      to { opacity:1; transform:scale(1)    } }
@keyframes fadeIn   { from { opacity:0 } to { opacity:1 } }
@keyframes scanLine { 0% { top:8% } 100% { top:88% } }
@keyframes spin     { from { transform:rotate(0deg) } to { transform:rotate(360deg) } }
@keyframes pulse    { 0%,100% { opacity:1 } 50% { opacity:0.4 } }
@keyframes shimmer  { 0% { background-position:200% center } 100% { background-position:0% center } }
.fade-up  { animation: fadeUp  0.4s  ease forwards; }
.slide-up { animation: slideUp 0.35s cubic-bezier(.22,.68,0,1.1) forwards; }
.scale-in { animation: scaleIn 0.25s ease forwards; }
.fade-in  { animation: fadeIn  0.35s ease forwards; }
.nav-item        { transition: all 0.2s ease; cursor: pointer; user-select: none; }
.nav-item:hover  { opacity: 0.7; }
.nav-item:active { opacity: 0.5; transform: scale(0.93); }
.fab             { transition: all 0.2s ease; cursor: pointer; outline: none; }
.fab:hover       { transform: scale(1.06) !important; }
.fab:active      { transform: scale(0.94) !important; }
.row-hover       { transition: background 0.2s ease; cursor: pointer; }
.pressable       { transition: opacity 0.2s ease; cursor: pointer; }
.pressable:hover { opacity: 0.7; }
.pressable:active { opacity: 0.5; }
.pill-btn        { transition: all 0.2s ease; cursor: pointer; outline: none; }
.pill-btn:hover  { opacity: 0.85; }
.pill-btn:active { transform: scale(0.97); opacity: 0.75; }
::-webkit-scrollbar { width: 0; height: 0; }
.spinner { animation: spin 0.8s linear infinite; display:inline-block; width:20px; height:20px; border-radius:50%; border:2px solid transparent; border-top-color:currentColor; }
.pulsing { animation: pulse 1.5s ease-in-out infinite; }
input:-webkit-autofill { -webkit-box-shadow: 0 0 0 100px transparent inset !important; -webkit-text-fill-color: inherit !important; }
input:focus { outline: 2px solid #5e6d54; outline-offset: 1px; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid #7a8b6f;
  outline-offset: 2px;
}
.logo-hidden { clip-path: inset(100% 0 0 0); }
.brand-shimmer { background: linear-gradient(90deg,#c9a84c 0%,#fff 40%,#c9a84c 100%); background-size:200% auto; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; animation:shimmer 1.4s linear forwards; }
.screen-bottom-safe { height: calc(100px + env(safe-area-inset-bottom)); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; } }
/* ── Glass UI (Apple-subtle, warm palette) ─────────────────────── */
@keyframes glassFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-5px)} }
@keyframes bubblePop { 0%{transform:scale(0.88);opacity:0} 55%{transform:scale(1.05)} 100%{transform:scale(1);opacity:1} }
@keyframes bubbleModalIn { 0%{transform:scale(0.4) translateY(30px);opacity:0} 65%{transform:scale(1.04) translateY(-6px);opacity:1} 100%{transform:scale(1) translateY(0);opacity:1} }
@keyframes overlayFadeIn { from{opacity:0} to{opacity:1} }
/* ── Glass Bubble — Apple-subtle ── */
.glass-bubble {
  transition: all 0.32s cubic-bezier(0.34,1.3,0.64,1); cursor:pointer; user-select:none;
  animation: glassFloat 4.5s ease-in-out infinite;
  position: relative;
  overflow: hidden;
  background: rgba(255,255,255,0.65) !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}
.glass-bubble::before { display: none; }
.glass-bubble::after { display: none; }
.glass-bubble > * { position: relative; z-index: 2; }
.glass-bubble:nth-child(2) { animation-delay: 1.1s; }
.glass-bubble:nth-child(3) { animation-delay: 2.2s; }
.glass-bubble:nth-child(4) { animation-delay: 3.3s; }
.glass-bubble:hover { transform: scale(1.08) translateY(-3px) !important; }
.glass-bubble:active { opacity:0.82; transform:scale(0.93) !important; }
/* bubble-modal-content animation removed — it used transform which breaks overflow scroll */
@keyframes bubbleSwipeDown { from{transform:translateY(0);opacity:1} to{transform:translateY(100%);opacity:0} }
/* Nav bar — Apple-subtle */
.glass-nav {
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-bottom: none !important;
  box-shadow: none !important;
}
.cam-pill { transition:all 0.2s cubic-bezier(0.34,1.56,0.64,1); cursor:pointer; outline:none; }
.cam-pill:hover { transform:scale(1.08) translateY(-2px) !important; }
.cam-pill:active { transform:scale(0.9) translateY(0px) !important; }
/* Card surfaces — clean, minimal */
.glass-card {
  background: rgba(255,255,255,0.72);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 20px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}
