body { background:#f6f7fb; color:#17202a; min-height:100vh; }
strong { font-weight: 900;}
.eyebrow { font-size:.75rem; font-weight:800; letter-spacing:.16em; color:#6c757d; margin-bottom:.65rem; }
.image-card { position:relative; padding:0; border:0; border-radius:18px; background:#fff; overflow:hidden; box-shadow:0 8px 30px rgba(0,0,0,.08); cursor:pointer; animation:rise .5s ease both; animation-delay:var(--delay); transition:transform .2s ease,opacity .25s ease,filter .25s ease,box-shadow .2s ease; }
.image-card:hover:not(:disabled) { transform:translateY(-7px) scale(1.01); box-shadow:0 15px 35px rgba(0,0,0,.13); }
.image-wrap { aspect-ratio:4/3; background:#e9ecef; }
.image-wrap img { width:100%; height:100%; object-fit:cover; display:block; }
.select-hint { display:block; padding:13px 15px; font-size:.9rem; font-weight:600; color:#495057; background:#fff; }
.disabled-choice { opacity:.32; filter:grayscale(1) blur(1px); transform:scale(.98); cursor:not-allowed; }
.second-step { animation:pulse-border .9s ease-in-out infinite alternate; }
.thanks-icon { width:62px; height:62px; margin:0 auto 18px; border-radius:50%; display:grid; place-items:center; background:#198754; color:#fff; font-size:2rem; animation:pop .4s ease; }
.fade-out { animation:fadeOut .3s ease forwards; }
@keyframes rise { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }
@keyframes pulse-border { from{box-shadow:0 8px 30px rgba(0,0,0,.08)} to{box-shadow:0 8px 30px rgba(13,110,253,.22)} }
@keyframes pop { from{transform:scale(.5);opacity:0} to{transform:scale(1);opacity:1} }
@keyframes fadeOut { to{opacity:0;transform:translateY(-8px)} }