:root{color-scheme:dark;font-family:system-ui,-apple-system,'Malgun Gothic',sans-serif;color:#eaeaea;background:#111;font-synthesis:none}*{box-sizing:border-box}body{margin:0}main{max-width:1200px;margin:auto;padding:28px 32px 32px}button,input{font:inherit}button{cursor:pointer}button:focus-visible{outline:2px solid #b9a4ff;outline-offset:3px}.toolbar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}.filters{display:flex;flex-wrap:wrap;gap:10px}.filters button{height:44px;padding:0 16px;border:1px solid #363636;border-radius:9px;background:#1b1b1b;color:#aaa;font-weight:650;font-size:16px;white-space:nowrap}.filters button:hover{background:#252329;color:#eee}.filters button.active{border-color:#b8a3ff;box-shadow:inset 0 0 0 1px #b8a3ff;color:#f5f1ff;background:#232127}.search-wrap{display:flex;align-items:center;gap:12px;min-height:56px;padding:0 17px;border:1px solid #363636;border-radius:9px;background:#1c1c1c;color:#858585}.search-wrap:focus-within{border-color:#b8a3ff;box-shadow:0 0 0 1px #b8a3ff}input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#eee;font-size:18px}input::placeholder{color:#797979}button:disabled{opacity:.45;cursor:wait}.grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px 16px}.card{min-width:0}.thumbnail{position:relative;aspect-ratio:16/9;border:1px solid #444;border-radius:9px;overflow:hidden;background:#232125;isolation:isolate}.thumbnail img{display:block;width:100%;height:100%;object-fit:cover}.thumbnail.failed:before{content:'이미지를 불러올 수 없습니다';position:absolute;top:25%;left:0;width:100%;text-align:center;color:#aaa;font-size:11px}.price-cover{position:absolute;z-index:1;bottom:0;left:0;width:100%;height:40%;display:flex;align-items:center;justify-content:center;background:#201c29;border-top:1px solid #bca4ff55;color:#fff;font-size:clamp(24px,3vw,64px);font-weight:850;letter-spacing:-1px;line-height:1;font-variant-numeric:tabular-nums;text-shadow:0 2px 4px #0006}.badges{position:absolute;z-index:2;top:9px;left:9px;display:flex;gap:5px}.badge{padding:5px 8px;border-radius:8px;background:#ff626b;color:#fff;font-size:10px;font-weight:800;letter-spacing:.4px}.badge.group{background:#7361b7}.caption{display:flex;align-items:flex-start;gap:9px;margin-top:8px}.caption h2{margin:2px 0 0;font-size:16px;font-weight:550;line-height:1.55;overflow-wrap:anywhere}.message{grid-column:1/-1;text-align:center;padding:65px 15px;color:#aaa;font-size:14px}footer{display:flex;justify-content:space-between;gap:15px;margin-top:30px;border-top:1px solid #292929;padding-top:15px;color:#757575;font-size:11px;line-height:1.7}footer p{margin:0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}@media(min-width:1900px){.price-cover{font-size:60px}}@media(max-width:1200px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}.price-cover{font-size:clamp(24px,4vw,48px)}}@media(max-width:900px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.caption{gap:6px}.caption h2{font-size:14px}.price-cover{font-size:clamp(25px,5vw,45px)}}@media(max-width:600px){main{padding:12px}.toolbar,.filters{gap:7px}.filters button{height:36px;padding:0 11px;font-size:12px}.toolbar{margin-bottom:12px}.search-wrap{min-height:48px;padding:0 12px}input{font-size:14px}.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:17px 10px}.thumbnail{border-radius:7px}.price-cover{font-size:clamp(22px,7vw,40px)}.caption{flex-wrap:wrap;gap:4px}.caption h2{margin:0;width:100%;font-size:13px}.badges{top:6px;left:6px}.badge{font-size:8px;padding:4px 6px}footer{flex-direction:column;gap:7px;font-size:10px}}
.filters button{display:inline-flex;align-items:center;justify-content:center;gap:7px}.button-icon{display:block;flex:none;width:18px;height:18px}@media(max-width:600px){.button-icon{width:15px;height:15px}}
.caption{justify-content:center}.caption h2{width:100%;text-align:center;font-size:19px;font-weight:600}@media(max-width:900px){.caption h2{font-size:17px}}@media(max-width:600px){.caption h2{font-size:16px}}

.grid{margin-top:14px}
footer{justify-content:center;text-align:center;align-items:center}
.price-cover{background:transparent;border-top:0;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);color:#ff2424;-webkit-text-stroke:5px #fff;paint-order:stroke fill;text-shadow:-4px -4px 0 #000,0 -4px 0 #000,4px -4px 0 #000,-4px 0 0 #000,4px 0 0 #000,-4px 4px 0 #000,0 4px 0 #000,4px 4px 0 #000}@media(max-width:600px){.price-cover{-webkit-text-stroke:3px #fff;text-shadow:-3px -3px 0 #000,0 -3px 0 #000,3px -3px 0 #000,-3px 0 0 #000,3px 0 0 #000,-3px 3px 0 #000,0 3px 0 #000,3px 3px 0 #000}}
.price-cover{display:grid;place-items:center;-webkit-text-stroke:0;text-shadow:none}.price-layer{grid-area:1/1;display:block;white-space:nowrap;line-height:1.2;paint-order:stroke fill;text-shadow:none}.price-outer{color:#000;-webkit-text-stroke:10px #000}.price-inner{color:#fff;-webkit-text-stroke:6px #fff}.price-fill{color:#ff1515;-webkit-text-stroke:0}@media(max-width:600px){.price-cover{-webkit-text-stroke:0;text-shadow:none}.price-outer{-webkit-text-stroke:7px #000}.price-inner{-webkit-text-stroke:4px #fff}}
.price-cover{display:flex;align-items:center;justify-content:center}.price-graphic{display:block;width:100%;height:100%;overflow:visible;flex:none}.price-graphic text{-webkit-text-stroke:0;text-shadow:none;letter-spacing:0}
@font-face{font-family:'Jua';font-style:normal;font-weight:400;font-display:swap;src:url('./Jua-Regular.ttf') format('truetype')}.price-cover{backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.thumbnail.failed:before{content:attr(data-title);top:0;left:0;height:60%;padding:12px;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:600;color:#eee;line-height:1.4;overflow-wrap:anywhere}@media(max-width:600px){.thumbnail.failed:before{font-size:16px;padding:8px}}
.thumbnail.failed:before{content:'이미지 없음';text-align:center;font-size:14px;font-weight:400}
.thumbnail.failed:before{height:100%;z-index:2;pointer-events:none}.thumbnail.failed .price-cover{backdrop-filter:none;-webkit-backdrop-filter:none}
.thumbnail.failed::before{box-sizing:border-box;inset:0;width:auto;height:auto;padding:0;display:grid;place-items:center;text-align:center}
