:root{--red:#bd0611;--cream:#fcf2e3;--yellow:#ffc400;--display:"Arial Rounded MT Bold","Trebuchet MS",system-ui,sans-serif}
@font-face{font-family:"Dunggeunmiso";src:url("dunggeunmiso-bold.otf") format("opentype");font-weight:700;font-display:swap}
*{box-sizing:border-box}
body{margin:0;background:var(--cream);color:var(--red);font:1rem/1.35 system-ui,sans-serif}
[hidden]{display:none!important}
.shell{width:min(1120px,100%);margin-inline:auto}
.masthead{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:10px clamp(18px,4vw,45px);font-size:.8rem;letter-spacing:.06em}
.logo{font:700 clamp(1.3rem,3vw,2rem)/1 "Dunggeunmiso",var(--display);color:inherit;text-decoration:none}
.hero{background:#ca0009;color:var(--cream);overflow:hidden}
.hero-layout{--hero-art-ratio:1174 / 1339;--hero-pad:clamp(20px,4vw,50px);display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(16px,4vw,56px);padding:clamp(24px,3vw,38px) var(--hero-pad)}
.hero-art{position:relative}
.hero-art::before{
  content:"";position:absolute;inset:0 0 0 calc(-1 * (var(--hero-pad) + max(0px,(100vw - 1120px)/2)));
  background:url("hero-ribbon.svg?v=bag-cover") right center / auto 100% no-repeat;
}
.hero-product{aspect-ratio:var(--hero-art-ratio);position:relative;display:block;width:100%;height:auto;max-height:410px;object-fit:contain;filter:url(#bag-cutout)}
.photo{background-image:url("reference.png");background-repeat:no-repeat}
h1,h2,h3,.timer-digits,.cta{font-family:var(--display);font-weight:1000;letter-spacing:-.045em}
.hero-copy{container-type:inline-size}
h1{font-size:clamp(1.2rem,10cqw,4.2rem);margin:0;line-height:.98;white-space:nowrap}
.hero-copy .bag-specs{margin-top:clamp(10px,1.5vw,19px);text-align:left}
.hero-copy .bag-specs li{padding-block:10px}
.order-strip{position:sticky;top:0;z-index:10;--order-number-size:clamp(1.35rem,2.6vw,1.9rem);background:#fbd102;border-bottom:2px solid var(--red);padding:10px 0}
.order-controls{
  --timer-height:calc(.72rem + 4px + 34px + 20px);--order-panel-height:54px;
  min-height:var(--timer-height);width:min(1120px,calc(100% - 2 * clamp(16px,4vw,48px)));
  margin-inline:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));place-items:center;gap:clamp(10px,2vw,24px)
}
.order-inventory,.order-actions{
  width:min(100%,232px);min-height:var(--order-panel-height);display:flex;align-items:center;
  background:var(--cream);border:1px solid var(--red);border-radius:11px;
}
.timer-unit{
  display:grid;grid-template-rows:34px 20px;place-items:center;line-height:1;
}
.order-inventory{justify-self:start}
.inventory-count{flex:1;display:flex;justify-content:center;align-items:center;gap:6px;min-width:0}
.inventory-count + .inventory-count{position:relative}
.inventory-count + .inventory-count::before{
  content:"";position:absolute;left:-1px;top:50%;transform:translateY(-50%);
  height:1.25rem;border-left:2px solid var(--red);
}
.inventory-count strong,.order-price,.timer-digits,.timer-colon{font:900 var(--order-number-size)/1 var(--display);font-variant-numeric:tabular-nums}
.inventory-count span,.order-limit,.timer-unit{font-size:.82rem;font-weight:700}
.deal-timer{display:grid;justify-items:center;gap:4px;color:#241e1e}
.deal-timer b{font-size:.72rem;line-height:1;letter-spacing:.07em;white-space:nowrap}
.timer{display:flex;align-items:flex-start;gap:clamp(4px,.8vw,9px);font-variant-numeric:tabular-nums}
.timer-digits{
  display:grid;place-items:center;align-self:stretch;min-width:1.7em;padding:0 .19em;
  border-radius:6px;background:linear-gradient(#282323 49%,#100d0d 49%,#100d0d 51%,#1e1919 51%);
  color:#fffaf3;
}
.timer-colon{display:grid;place-items:center;height:34px}
.order-actions{justify-self:end;justify-content:space-between;gap:8px;padding:4px 5px 4px 10px}
.order-buy{display:flex;align-items:center;gap:7px}
.order-limit{font-size:.67rem;line-height:1.1;white-space:nowrap}
.order-price{white-space:nowrap}
.buy-link{
  min-height:44px;background:var(--red);color:var(--cream);border:0;border-radius:7px;
  padding:0 10px;font-size:.81rem;font-weight:850;white-space:nowrap;
}
.buy-link:hover{background:#99050e}
button{cursor:pointer;font:inherit}
button:disabled{cursor:default;opacity:.45}
.cta{border:0;border-radius:999px;background:var(--yellow);color:#a60009;padding:.52em 1em;font-size:clamp(1rem,2.4vw,2rem);line-height:1.2}
.cta:hover{background:#ffdb56}
.deal-cards{
  width:min(1120px,calc(100% - 2 * clamp(16px,4vw,48px)));
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(8px,2vw,24px);margin:24px auto;
}
.deal-card{
  display:flex;align-items:center;gap:clamp(6px,1.5vw,16px);
  min-height:max(76px,calc(24px + 3.105em + 3px));padding:10px clamp(8px,2vw,20px);
  border:2px solid var(--red);border-radius:16px;background:var(--cream);
  color:var(--red);font-size:clamp(.82rem,1.9vw,1.25rem);line-height:1.15;
}
.deal-card svg{width:clamp(19px,3vw,28px);flex:none;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.deal-card small{display:block;margin-top:3px;font-size:.7em}
.deal-previous{text-decoration:none}
.deal-previous:hover{background:#fae8d1}
.deal-next svg{margin-left:auto}
.bottle{flex:0 0 50px;aspect-ratio:74/74;background-size:1037.84% 1560.81%;background-position:18.73% 36.22%;border-radius:8px}
h2{text-align:center;font-size:clamp(2rem,5vw,4rem);line-height:1;margin:38px 0 4px}
.intro{text-align:center;font-size:clamp(1rem,2.5vw,1.55rem);font-weight:700;margin:0 0 8px}
.details{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:clamp(12px,3vw,36px)}
.detail-photo{aspect-ratio:407/320;background-size:188.70% 360.94%;background-position:0 65.63%;border-radius:20px}
ul{list-style:none;padding:0;margin:0}
li{display:flex;align-items:center;gap:14px;padding:14px 0}
li+li{border-top:1px solid #e89892}
li svg{width:58px;flex:none;background:#f9e6cb;border-radius:17px;padding:10px;fill:none;stroke:currentColor;stroke-width:3.4;stroke-linecap:round}
h3{font-size:1.4rem;margin:0}
li p{margin:0}
.site-footer{margin-top:24px;background:#ca0009;color:var(--cream)}
.info-page{padding:clamp(24px,6vw,72px) clamp(18px,4vw,45px)}
.info-page h1{font-size:clamp(2rem,6vw,4rem);white-space:normal}
.info-page h2{text-align:left;font-size:1.35rem;margin:24px 0 0}
.info-page p{max-width:58ch}
.info-page a{color:inherit}
dialog{max-width:min(450px,calc(100% - 32px));background:var(--cream);color:var(--red);border:2px solid;border-radius:20px;padding:24px;text-align:center}
dialog h2{font-size:2rem;margin:0}
dialog::backdrop{background:#350007a8}
:focus-visible{outline:3px solid #2876bd;outline-offset:3px}
@media(max-width:570px){
  .hero-layout,.details{grid-template-columns:1fr}
  .hero-layout{text-align:center;gap:10px}
  .hero-product{max-width:300px;margin:auto}
  .detail-photo{width:min(100%,390px);margin:auto}
  .deal-next .bottle{display:none}
}
@media(max-width:760px){
  .order-controls{min-height:calc(var(--timer-height) + var(--order-panel-height) + clamp(10px,2vw,24px));grid-template-columns:repeat(2,minmax(0,1fr))}
  .deal-timer{grid-area:1/1/2/-1}
  .order-inventory{grid-area:2/1}
  .order-actions{grid-area:2/2}
}
@media(max-width:500px){
  .order-controls{min-height:calc(var(--timer-height) + 2 * var(--order-panel-height) + 2 * clamp(10px,2vw,24px));grid-template-columns:1fr}
  .order-inventory,.order-actions{grid-area:auto;justify-self:center}
}
.bag-showcase{
  width:min(1120px,calc(100% - 2 * clamp(16px,4vw,48px)));
  margin-inline:auto;
  border-radius:clamp(20px,3vw,36px);
  border:2px solid var(--red);
  overflow:hidden;
  background:var(--cream);
  color:var(--red);
}
.bag-layout{padding:clamp(22px,5vw,54px)}
.product-review{max-width:850px;margin:0 auto clamp(28px,5vw,56px)}
.product-review h3{margin:0 0 20px;text-align:center;font-size:clamp(1.5rem,3vw,2rem)}
.review-notes{display:grid;gap:16px;line-height:1.5}
.review-notes p{margin:0}
.review-notes strong{display:block;margin-bottom:2px;white-space:nowrap}
.review-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;padding:16px clamp(22px,5vw,54px);background:#ca0009;color:var(--cream)}
.review-header h2{display:flex;align-items:baseline;gap:.45em;margin:0;font-size:clamp(1.35rem,3vw,2.25rem)}
.review-header .logo{font-size:inherit}
.review-label{font-size:.6em}
.review-rating,.review-stars{display:flex;align-items:center;gap:8px}
.review-stars{gap:4px;color:#fbd102}
.review-stars svg{width:clamp(16px,2.2vw,23px);stroke:currentColor;stroke-width:2;stroke-linejoin:round;overflow:visible}
.review-rating strong{font-size:.9rem}
.review-photos{display:grid;gap:clamp(24px,5vw,56px)}
.review-photos figure{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:center;gap:clamp(20px,5vw,56px);margin:0}
.review-photos figure:nth-child(even){grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)}
.review-photos figure:nth-child(even) img{grid-column:2;grid-row:1}
.review-photos img{display:block;width:100%;max-height:480px;object-fit:contain}
.review-photos figcaption{display:grid;gap:6px;max-width:34ch;font-size:clamp(1rem,1.6vw,1.2rem)}
.review-photos figcaption strong{font-size:clamp(1.25rem,2.4vw,1.8rem)}
@media(max-width:650px){
  .review-photos figure,.review-photos figure:nth-child(even){grid-template-columns:1fr}
  .review-photos figure:nth-child(even) img{grid-column:1}
}

.bag-viewer{min-width:0;text-align:center}
.bag-stage{
  display:grid;place-items:center;
  cursor:grab;touch-action:none;user-select:none;position:relative;
}
.bag-stage:active{cursor:grabbing}
.bag-model{
  width:min(100%,420px);
  aspect-ratio:1;
  position:relative;
  filter:url(#bag-cutout);
  pointer-events:none;
}
.bag-frame{
  position:absolute;
  inset:0;
  background:url("bag-turntable.png") 0 0 / 400% 400% no-repeat;
}
.bag-motion{position:absolute;inset:0;width:100%;height:100%}
.bag-spin{
  position:absolute;top:57%;left:50%;transform:translate(-50%,-50%);
  display:grid;place-items:center;width:78px;height:78px;padding:6px;
  border:0;color:#fff;background:transparent;
  opacity:.52;
  filter:drop-shadow(0 1px 3px #39200070);
}
.bag-spin svg{width:100%;height:100%}
.bag-stage.is-rotating .bag-spin{opacity:0;pointer-events:none}
.bag-stage.is-rotating .bag-spin svg{visibility:hidden}
.bag-specs li+li{border-color:#fcf2e370}
.bag-specs svg{background:var(--cream);color:var(--red)}
.bag-specs p{max-width:36ch}
@media(max-width:650px){
  .bag-model{max-width:345px}
}

.site-footer .masthead{padding-block:16px}
.login-link,.run-deal-link{color:inherit;font-size:.78rem;letter-spacing:0}
.login-link{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:8px;background:var(--red);color:#fff;font-weight:700;text-decoration:none;white-space:nowrap}
.login-link:hover{background:#99050e}
.run-deal-link{text-decoration:underline;text-underline-offset:.18em}

.neon-deal{--cream:#fff8fc;--red:#30152c;--yellow:#ffed39}
.neon-deal .hero{background:var(--yellow);color:var(--red)}
.neon-deal .hero-art::before{background-image:url("hero-ribbon-blue.svg")}
.neon-deal .archive-photo{display:block;width:100%;height:auto;border-radius:24px}
.neon-deal .order-strip{background:#bcff36}
.neon-deal .archive-status{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px 24px}
.neon-deal .archive-status a{color:inherit}
.neon-deal .site-footer,.neon-deal .review-header,.neon-deal .login-link{background:#ff69be;color:var(--red)}

.neon-deal .archive-status .current-deal-button,.bring-back-card button{display:inline-grid;place-items:center;min-height:44px;padding:8px 16px;border:0;border-radius:8px;background:#79d9ff;color:inherit;font:inherit;font-weight:700;text-decoration:none}
.bring-back-card{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;align-content:center;justify-items:start;align-items:center;gap:2px 14px}
.bring-back-card button{grid-row:1 / 3;background:#ff69be;cursor:pointer}
.bring-back-card button:disabled{cursor:default}
.bring-back-note{grid-column:2;margin:0;font-size:.875rem;line-height:1.35}

@media(max-width:570px){
  .bring-back-card{column-gap:6px}
  .bring-back-card button{padding-inline:6px;font-size:.75rem}
  .bring-back-note{font-size:.7rem;line-height:1.15}
}