/* Film grain overlay */
.film-grain{position:fixed;inset:0;pointer-events:none;z-index:9000;opacity:0.04;mix-blend-mode:overlay;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E")}

/* Background grid */
.bg-grid::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,0.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.04) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse 70% 60% at 50% 50%,black 20%,transparent 70%);-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 50%,black 20%,transparent 70%);z-index:0}

/* Silver text gradient */
.text-silver{background:linear-gradient(180deg,#ffffff 0%,rgba(255,255,255,0.5) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;transform:translateZ(0);filter:drop-shadow(0 2px 4px rgba(0,0,0,0.4))}

/* Matte 3D text */
.text-3d-matte{color:#ffffff;text-shadow:0 1px 2px rgba(0,0,0,0.5),0 2px 4px rgba(0,0,0,0.3),0 4px 8px rgba(0,0,0,0.2)}

/* Premium card */
.premium-card{background:linear-gradient(145deg,var(--bg-card-top) 0%,var(--bg-card-bottom) 100%);box-shadow:var(--shadow-card);border:1px solid rgba(255,255,255,0.04);position:relative;overflow:hidden}
.premium-card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(800px circle at var(--mouse-x,50%) var(--mouse-y,50%),rgba(255,255,255,0.06) 0%,transparent 40%);mix-blend-mode:screen;transition:opacity 0.3s ease;z-index:1}

/* Light tactile button */
.btn-tactile-light{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#ffffff 0%,#f1f5f9 100%);color:#0f172a;box-shadow:var(--shadow-btn-light);padding:var(--space-4) var(--space-6);border-radius:var(--radius-md);font-family:var(--font-body);font-size:15px;font-weight:700;letter-spacing:-0.01em;transition:all 0.4s var(--ease-out);cursor:pointer;border:none;text-decoration:none}
.btn-tactile-light:hover{transform:translateY(-3px);box-shadow:0 0 0 1px rgba(0,0,0,0.05),0 4px 8px rgba(0,0,0,0.15),0 20px 40px -4px rgba(0,0,0,0.4),inset 0 1px 1px rgba(255,255,255,1),inset 0 -3px 6px rgba(0,0,0,0.06)}
.btn-tactile-light:active{transform:translateY(1px);background:linear-gradient(180deg,#f1f5f9 0%,#e2e8f0 100%);box-shadow:0 0 0 1px rgba(0,0,0,0.05),0 1px 2px rgba(0,0,0,0.1),inset 0 1px 1px rgba(255,255,255,0.8),inset 0 -1px 2px rgba(0,0,0,0.06)}

/* Dark tactile button */
.btn-tactile-dark{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#27272a 0%,#18181b 100%);color:#ffffff;box-shadow:var(--shadow-btn-dark);padding:var(--space-4) var(--space-6);border-radius:var(--radius-md);font-family:var(--font-body);font-size:15px;font-weight:600;letter-spacing:-0.01em;transition:all 0.4s var(--ease-out);cursor:pointer;border:none;text-decoration:none}
.btn-tactile-dark:hover{transform:translateY(-3px);box-shadow:0 0 0 1px rgba(255,255,255,0.15),0 4px 8px rgba(0,0,0,0.7),0 20px 40px -4px rgba(0,0,0,1),inset 0 1px 1px rgba(255,255,255,0.2),inset 0 -3px 6px rgba(0,0,0,0.8)}
.btn-tactile-dark:active{transform:translateY(1px);background:linear-gradient(180deg,#18181b 0%,#09090b 100%);box-shadow:0 0 0 1px rgba(255,255,255,0.08),0 1px 2px rgba(0,0,0,0.6),inset 0 1px 1px rgba(255,255,255,0.1),inset 0 -1px 2px rgba(0,0,0,0.8)}

/* Widget depth */
.widget-depth{background:linear-gradient(180deg,rgba(255,255,255,0.04) 0%,rgba(255,255,255,0.01) 100%);box-shadow:0 10px 20px rgba(0,0,0,0.3),inset 0 1px 1px rgba(255,255,255,0.05),inset 0 -1px 1px rgba(0,0,0,0.5);border:1px solid rgba(255,255,255,0.03);border-radius:var(--radius-md)}

/* Focus state */
:focus-visible{outline:2px solid var(--accent-ice);outline-offset:2px}
