:root{color-scheme:light;--red:#c8102e;--ink:#0e0e0e;--muted:rgba(255,255,255,.7);--hairline:rgba(255,255,255,.26);--panel:rgba(0,0,0,.15);--display:'Archivo',system-ui,sans-serif;--body:'Inter',system-ui,sans-serif;}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:#c8102e}
body{font-family:var(--body);color:#fff;-webkit-font-smoothing:antialiased;line-height:1.6}
.wrap{max-width:560px;margin:0 auto;padding:18px 22px 64px}
.top{display:flex;align-items:center;justify-content:space-between;padding:6px 0 22px}
.back{font-family:var(--display);font-size:11px;letter-spacing:.22em;color:var(--muted);text-decoration:none}
.back:hover{color:#fff}
.top img.logo{height:26px;width:auto}
.eyebrow{font-family:var(--display);font-weight:500;font-size:11px;letter-spacing:.42em;color:var(--muted);display:flex;align-items:center;gap:9px}
.eyebrow .dot{width:5px;height:5px;border-radius:50%;background:var(--ink)}
.gallery{margin-top:14px}
.track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;border-radius:12px}
.track::-webkit-scrollbar{display:none}
.slide{flex:0 0 100%;scroll-snap-align:center}
.simg{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:12px;display:block;cursor:zoom-in;border:1px solid rgba(255,255,255,.3)}
.dots{display:flex;justify-content:center;gap:9px;margin-top:14px}
.dots .dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.38);cursor:pointer;border:none;padding:0;transition:background .2s,transform .2s}
.dots .dot.active{background:#fff;transform:scale(1.15)}
.head{margin-top:30px}
h1{font-family:var(--display);font-weight:500;font-size:26px;letter-spacing:.01em;margin-bottom:6px;color:#fff}
.sub{color:var(--muted);font-size:14px}
.price{font-family:var(--display);font-size:22px;margin-top:14px;color:#fff}
.rulered{height:1px;background:var(--hairline);margin:26px 0;position:relative}
.rulered::before{content:"";position:absolute;left:0;top:0;width:34px;height:1px;background:var(--ink)}
.sizehead{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.sizehead .lbl{font-family:var(--display);font-size:12px;letter-spacing:.2em;color:#fff}
.chartlink{background:none;border:none;font-family:var(--body);font-size:12px;color:var(--muted);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.chartlink:hover{color:#fff}
.sizes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.size{font-family:var(--display);font-size:13px;letter-spacing:.06em;padding:12px 0;background:transparent;border:1px solid rgba(255,255,255,.4);border-radius:8px;cursor:pointer;color:#fff;transition:all .15s}
.size:hover{border-color:#fff}
.size.sel{background:var(--ink);border-color:var(--ink);color:#fff}
.chart{display:none;margin-top:14px;border:1px solid var(--hairline);border-radius:10px;overflow:hidden}
.chart.open{display:block}
table{width:100%;border-collapse:collapse;font-size:13px}
th,td{text-align:left;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.2)}
th{font-family:var(--display);font-weight:500;font-size:11px;letter-spacing:.14em;color:var(--muted)}
td{color:#fff}
tr:last-child td{border-bottom:none}
.chartnote{font-size:11px;color:var(--muted);padding:10px 14px;background:var(--panel)}
.addrow{display:flex;gap:10px;margin-top:14px}
.qty{width:66px;padding:12px;border:2px solid transparent;border-radius:8px;text-align:center;font-family:var(--body);font-size:15px;color:var(--ink);background:#fff}
.qty:focus-visible{border-color:var(--ink);outline:none}
.addbtn{flex:1;padding:12px;background:transparent;border:1px solid #fff;border-radius:8px;font-family:var(--display);font-size:12px;letter-spacing:.12em;color:#fff;cursor:pointer;transition:background .15s}
.addbtn:hover{background:rgba(255,255,255,.12)}
.cart{display:none;flex-direction:column;gap:8px;margin-top:16px}
.cart.show{display:flex}
.cartitem{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;border:1px solid var(--hairline);border-radius:8px;font-size:14px}
.cartitem .s{font-family:var(--display);letter-spacing:.06em}
.cartitem .s b{font-weight:500}
.cartitem .x{background:none;border:none;color:var(--muted);cursor:pointer;font-size:18px;line-height:1;padding:0 4px}
.cartitem .x:hover{color:var(--ink)}
.carttotal{font-family:var(--display);font-size:11px;letter-spacing:.18em;color:var(--muted);text-align:right;margin-top:2px}
.desc{font-size:15px;color:rgba(255,255,255,.88);margin-top:4px}
.kodawari{margin-top:30px;padding:22px;background:var(--panel);border-radius:12px}
.kodawari .k{font-family:var(--display);font-size:11px;letter-spacing:.4em;color:var(--muted);margin-bottom:12px}
.kodawari p{font-size:14.5px;color:rgba(255,255,255,.88);line-height:1.8}
details{border-top:1px solid rgba(255,255,255,.2)}
details:last-of-type{border-bottom:1px solid rgba(255,255,255,.2)}
summary{list-style:none;cursor:pointer;padding:15px 2px;font-family:var(--display);font-size:13px;letter-spacing:.08em;display:flex;justify-content:space-between;align-items:center;color:#fff}
summary::-webkit-details-marker{display:none}
summary .ic{color:var(--muted);transition:transform .2s}
details[open] summary .ic{transform:rotate(45deg)}
details .body{padding:0 2px 16px;font-size:14px;color:rgba(255,255,255,.82)}
.details-wrap{margin-top:30px}
.limited{display:inline-flex;align-items:center;gap:8px;font-family:var(--display);font-size:11px;letter-spacing:.26em;color:var(--muted);margin-top:26px}
.limited .dot{width:5px;height:5px;border-radius:50%;background:var(--ink)}
.cta{margin-top:28px}
.btn{width:100%;padding:16px;background:var(--ink);color:#fff;border:none;border-radius:10px;font-family:var(--display);font-size:13px;letter-spacing:.14em;cursor:pointer;transition:opacity .2s}
.btn:hover{opacity:.85}
.hint{text-align:center;font-size:12px;color:#fff;font-weight:600;margin-top:12px;min-height:16px}
.form{display:none;margin-top:30px}
.form.show{display:block}
.form .fhead{font-family:var(--display);font-size:12px;letter-spacing:.2em;color:#fff;display:flex;align-items:center;gap:9px;margin-bottom:18px}
.form .fhead .dot{width:5px;height:5px;border-radius:50%;background:var(--ink)}
.field{margin-bottom:16px}
.field label{display:block;font-family:var(--display);font-size:11px;letter-spacing:.14em;color:var(--muted);margin-bottom:7px}
.field input,.field textarea{width:100%;font-family:var(--body);font-size:15px;color:var(--ink);background:#fff;border:1px solid transparent;border-radius:8px;padding:12px 13px;outline:none}
.field input:focus,.field textarea:focus{border-color:var(--ink)}
.field textarea{resize:vertical;min-height:64px}
.paynote{text-align:center;font-size:12px;color:var(--muted);margin-top:12px;line-height:1.6}
.lb{display:none;position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:999;align-items:center;justify-content:center;cursor:zoom-out}
.lb.open{display:flex}
.lb img{max-width:96vw;max-height:92vh;object-fit:contain;border-radius:8px}
.lb .close{position:absolute;top:16px;right:20px;color:#fff;font-size:32px;line-height:1;cursor:pointer;background:none;border:none;opacity:.7}
.lb .close:hover{opacity:1}