:root{--ink:#16324f;--snow:#f4f9ff;--accent:#d8342c;--card:#fff}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;font-family:system-ui,"Pretendard","Malgun Gothic",sans-serif;color:var(--ink);background:linear-gradient(180deg,#bfe0f7 0%,#eaf5ff 55%,#fff 100%);background-attachment:fixed}
.selection{max-width:1100px;margin:0 auto;padding:clamp(24px,5vw,64px) 20px}
header{text-align:center;margin-bottom:clamp(24px,4vw,48px)}
.eyebrow{margin:0 0 8px;letter-spacing:.3em;font-weight:800;color:var(--accent);font-size:.85rem}
h1{margin:0;font-size:clamp(1.8rem,5vw,3rem)}
.subtitle{margin:12px 0 0;opacity:.75}
.map-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),360px));gap:24px;justify-content:center}
.map-card{display:flex;flex-direction:column;overflow:hidden;border-radius:20px;background:var(--card);color:inherit;text-decoration:none;box-shadow:0 10px 30px #16324f26;animation:float 4s ease-in-out infinite;transition:transform .2s,box-shadow .2s}
.map-card:hover,.map-card:focus-visible{transform:translateY(-6px) scale(1.02);box-shadow:0 18px 40px #16324f40;animation-play-state:paused;outline:none}
.card-art{position:relative;aspect-ratio:16/9;background:#cfe6f8;overflow:hidden}
.card-art img{width:100%;height:100%;object-fit:cover;display:block}
.badge{position:absolute;right:10px;top:10px;padding:4px 10px;border-radius:99px;background:#16324fcc;color:#fff;font-size:.8rem;font-weight:700}
.card-copy{padding:16px 18px 18px}
.tag{font-size:.72rem;font-weight:800;letter-spacing:.2em;color:var(--accent)}
h2{margin:6px 0 4px;font-size:1.3rem}
.card-copy p{margin:0 0 12px;opacity:.75;font-size:.95rem}
.enter{font-weight:800;color:var(--accent)}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -5px}}
