:root{--bg-color:#0f172a;--card-bg:#1e293bb3;--text-primary:#f8fafc;--text-secondary:#94a3b8;--accent:#ef4444;--glass-border:#ffffff14}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-primary);background-image:radial-gradient(at 0 0,#1e293b 0,#0000 50%),radial-gradient(at 100% 100%,#0f172a 0,#0000 50%);background-attachment:fixed;flex-direction:column;min-height:100vh;font-family:Inter,sans-serif;line-height:1.5;display:flex}.container{width:100%;max-width:1400px;margin:0 auto;padding:0 2rem}.header{text-align:center;padding:4rem 0 3rem}.header h1{background:linear-gradient(135deg,#f8fafc 0%,#94a3b8 100%);-webkit-text-fill-color:transparent;letter-spacing:-.02em;-webkit-background-clip:text;margin-bottom:1rem;font-size:2.5rem;font-weight:700}.header p{color:var(--text-secondary);max-width:600px;margin:0 auto;font-size:1.125rem}main{flex:1;padding-bottom:4rem}.gallery-grid{grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:2rem;display:grid}.card{background:var(--card-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(12px);border-radius:16px;flex-direction:column;transition:transform .3s,box-shadow .3s;display:flex;overflow:hidden}.card:hover{border-color:#ffffff26;transform:translateY(-5px);box-shadow:0 20px 40px -10px #00000080}.image-wrapper{aspect-ratio:16/9;cursor:crosshair;background:#000;width:100%;position:relative;overflow:hidden}.base-img,.overlay-img{object-fit:contain;width:100%;height:100%;transition:opacity .4s;position:absolute;top:0;left:0}.overlay-img{opacity:0;z-index:2;mix-blend-mode:screen}.card:hover .overlay-img{opacity:1}.instruction-badge{color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:3;pointer-events:none;opacity:.8;background:#0009;border-radius:9999px;padding:.25rem .75rem;font-size:.75rem;font-weight:500;transition:opacity .3s;position:absolute;top:1rem;right:1rem}.card:hover .instruction-badge{opacity:0}.card-content{flex-direction:column;flex:1;padding:1.5rem;display:flex}.card-title{align-items:center;gap:.5rem;margin-bottom:.75rem;font-size:1.25rem;font-weight:600;display:flex}.card-title:before{content:"";background-color:var(--accent);border-radius:50%;width:8px;height:8px;display:inline-block}.card-description{color:var(--text-secondary);font-size:.95rem;line-height:1.6}.footer{text-align:center;color:var(--text-secondary);border-top:1px solid var(--glass-border);padding:2rem 0;font-size:.875rem}@media (width<=768px){.gallery-grid{grid-template-columns:1fr}.header h1{font-size:2rem}}