:root{color-scheme:light;--ink:#24170e;--gold:#be7c16;--gold-light:#ffe198;--site:1080px}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:#f9f7f3}body{margin:0;color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Noto Sans CJK TC","Microsoft JhengHei",sans-serif;-webkit-text-size-adjust:100%;background:#f9f7f3 url('assets/marble-reference-r2.webp') center top/1024px auto repeat}
button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{cursor:pointer}a{color:inherit}[hidden]{display:none!important}
.site{width:100%;max-width:var(--site);margin:0 auto;min-height:100svh;isolation:isolate;overflow:hidden;background-image:url('assets/gold-edge-r2.svg'),url('assets/marble-reference-r2.webp');background-size:100% auto,100% auto;background-position:center top;background-repeat:repeat-y;box-shadow:0 0 65px #9d702015}
.brand-hero{position:relative;line-height:0}.hero-art{display:block;width:100%;height:auto;aspect-ratio:1024/515}
#catalog{position:relative;padding:0 0 20px;scroll-margin-top:12px;background:transparent}
.catalog-heading{display:flex;align-items:center;justify-content:center;gap:15px;padding:9px 12px 8px;text-align:center}
.catalog-heading h2{margin:0;font-family:"Noto Serif CJK TC","Songti TC","Noto Serif TC",serif;font-size:clamp(29px,5vw,54px);font-weight:900;color:#71400f;letter-spacing:.1em;text-shadow:0 1px 0 #fff,0 2px 8px #f6d997}
.laurel{width:clamp(32px,7vw,66px);height:clamp(38px,8vw,72px);color:#c18b2c;flex:none}.laurel.right{transform:scaleX(-1)}
.catalog-note{margin:0 10px 15px;text-align:center;font-size:clamp(11px,1.9vw,18px);font-weight:600;color:#463320}
.catalog-controls{margin:0 4.5%}
.search-box{display:flex;align-items:center;gap:12px;border:2px solid transparent;border-radius:60px;background:linear-gradient(135deg,#ffffffd9,#ffffffb8) padding-box,linear-gradient(155deg,#ae6a0c 0%,#ffe6a5 16%,#cf9325 33%,#fff9dd 48%,#b27414 68%,#ffdc86 82%,#98580b) border-box;box-shadow:inset 0 0 0 2px #fff9,0 3px 5px #85572445,0 0 7px #ffce7030;min-height:45px;padding:11px 18px}
.search-box svg{flex:none;width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round}
.search-box input{flex:1;width:100%;min-width:0;min-height:24px;color:#29221a;background:transparent;border:0;outline:0;font-size:clamp(16px,2.9vw,27px)}.search-box input::placeholder{color:#77716a;opacity:1}.search-box:focus-within{outline:2px solid #ba8627;outline-offset:3px}
.filters{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(5px,1.8vw,18px);margin:17px 0 25px}
.filters button{min-width:0;min-height:40px;border:1.5px solid transparent;border-radius:999px;font-weight:800;font-size:clamp(12px,2.7vw,25px);color:#17110d;padding:8px 0;background:linear-gradient(140deg,#fffcf5f5,#ffffffb8) padding-box,linear-gradient(125deg,#ba7d19,#fff1c0 24%,#c49034 48%,#fbe6ae 75%,#ab6a0a) border-box;box-shadow:inset 0 0 0 1px #fff,0 3px 4px #88632940}
.filters button[aria-pressed=true]{background:linear-gradient(140deg,#fffbe0,#ffe074 47%,#ffc221) padding-box,linear-gradient(135deg,#b8770d,#fff4be 38%,#b87814) border-box;box-shadow:inset 0 0 0 1px #fff0a4,0 0 13px #ffc23270,0 3px 6px #7e511b40}
.catalog-status{text-align:center;color:#6f4826;font-size:14px;line-height:1.7;padding:12px 18px;margin:0}.catalog-status:empty{display:none}.retry{display:block;margin:4px auto 20px;border:1px solid #bc801e;border-radius:28px;min-height:44px;padding:9px 22px;background:#fff8e4;color:#56320e;font-weight:700}
.products{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2.8vw,30px);align-items:start;padding:0 2.5% 22px}
.product-card{position:relative;min-width:0;isolation:isolate;container-type:inline-size;border:3px solid transparent;border-radius:clamp(19px,3.2vw,34px);background:linear-gradient(transparent,transparent) padding-box,linear-gradient(145deg,#a5680d,#ffe6a3 8%,#d9931b 18%,#fff4bc 31%,#b3730d 49%,#ffe8a7 61%,#d29322 77%,#fff6ce 86%,#b9770b) border-box;box-shadow:0 0 0 1px #fff8ce,0 4px 9px #80541c52,0 0 14px #ffd56d60;overflow:hidden}
/* One stone surface under the WHOLE card. No separate photo price frames or black masks. */
.product-card::before{content:"";position:absolute;inset:0;border-radius:inherit;background:url('assets/marble-reference-r2.webp') 37% 22%/245% auto;z-index:-1}
.product-card::after{content:"";position:absolute;inset:4px;border:1px solid #d5a24c;border-radius:calc(clamp(19px,3.2vw,34px) - 5px);box-shadow:inset 0 0 0 1px #fff8;pointer-events:none}
.card-stack{position:relative;z-index:1;padding:clamp(11px,3.5cqw,20px) clamp(7px,3.6cqw,20px) clamp(10px,3cqw,18px)}
.photo-zone{position:relative;display:flex;justify-content:center;min-width:0}.product-photo{width:84%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;min-width:0}.product-photo img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 3px #4d301b30)}
.image-fallback{display:block;max-width:100%;font-size:12px;text-align:center;color:#80633c;padding:12px}.image-error{background:#fff7;border:1px dashed #c49d61;border-radius:10px}
.flags{position:absolute;z-index:2;top:-2px;left:-2px;right:-2px;display:flex;justify-content:flex-start;gap:4px;pointer-events:none}.flags:has(.flag:only-child){justify-content:center}.flags:has(.flag:nth-child(2)){justify-content:space-between}
.flag{display:inline-block;color:white;border:1px solid #ffe9af;padding:4px 10px;font-size:clamp(10px,5.7cqw,25px);font-weight:850;background:linear-gradient(125deg,#e91a0b,#ff4d24 32%,#ae0000 67%,#e11b00);border-radius:4px 10px 4px 9px;box-shadow:0 3px 5px #6b221950;text-shadow:0 1px 1px #6c1f08}.flag.is-new{background:linear-gradient(125deg,#2041ae,#2485ef 40%,#182e99)}
.product-name{margin:clamp(7px,2.5cqw,14px) 0 clamp(9px,3cqw,16px);text-align:center;font-family:"Noto Serif CJK TC","Songti TC",serif;font-size:clamp(16px,7.7cqw,38px);font-weight:900;line-height:1.3;overflow-wrap:anywhere;color:#17120e}
.specs{display:flex;align-items:stretch;justify-content:center;gap:clamp(4px,2.4cqw,12px)}
.spec{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:2px solid transparent;border-radius:clamp(9px,3cqw,16px);padding:clamp(6px,2.2cqw,12px) 1px;color:#1b160f;background:linear-gradient(135deg,#fffdf1bb,#fffef5a0) padding-box,linear-gradient(135deg,#a96b12,#ffe3a0 22%,#ce9028 43%,#fff0be 60%,#b97e19 85%,#ffd996) border-box;box-shadow:inset 0 0 0 1px #fff,0 2px 4px #8d5a2240;text-align:center}
.spec:only-child{flex:0 1 calc(50% - 4px)}.spec.inquiry{flex-basis:80%;font-size:clamp(11px,5cqw,21px);min-height:42px}
.spec[aria-pressed=true]{outline:1px solid #c88d29;outline-offset:1px;box-shadow:inset 0 0 0 1px #fff,0 0 7px #e9aa4855}
.spec-caption{display:flex;align-items:center;justify-content:center;gap:4px;max-width:100%}.spec-label{font-size:clamp(11px,5.8cqw,26px);font-weight:850;white-space:nowrap;line-height:1.2}.spec-icon{width:clamp(15px,8cqw,34px);height:clamp(15px,8cqw,34px);fill:#ffe4a1;stroke:#a86a13;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}
.spec-price{font-size:clamp(11px,6.1cqw,28px);white-space:nowrap;font-weight:850;line-height:1.2;font-variant-numeric:tabular-nums}.spec.is-long-price .spec-price{font-size:clamp(9px,4.9cqw,23px)}
.product-tags{display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:clamp(3px,1cqw,5px);margin:clamp(10px,3.3cqw,16px) 0;min-height:0}.product-tags:empty{display:none}
.product-tag{display:flex;align-items:center;justify-content:center;gap:2px;flex:0 1 calc((100% - 10px)/3);min-width:0;max-width:100%;border:1px solid transparent;border-radius:999px;padding:clamp(3px,1.15cqw,6px) 2px;background:linear-gradient(120deg,#fffaf0dc,#ffffffb8) padding-box,linear-gradient(140deg,#a36813,#fff2bb 22%,#b47d24 53%,#ffd684 75%,#a36813) border-box;box-shadow:inset 0 0 0 1px #fff7,0 2px 3px #8b5c2040;color:#251c12;font-size:clamp(7px,3.8cqw,17px);font-weight:750;white-space:nowrap}
.tag-icon{width:1.1em;height:1.1em;flex:none;fill:none;stroke:#a56e13;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.card-actions{position:relative;display:flex;align-items:center;gap:3%;justify-content:center;min-height:42px;margin-top:clamp(10px,3.8cqw,19px)}
.order-link{display:flex;align-items:center;justify-content:center;gap:clamp(4px,1.6cqw,9px);flex:1;min-width:0;min-height:40px;padding:clamp(6px,2.5cqw,13px) 2px;color:#fff;text-decoration:none;border:2px solid #e5ffcf;border-radius:999px;background:linear-gradient(135deg,#6dff53 0%,#12da12 26%,#02ad04 56%,#008b01 70%,#21d211 95%);box-shadow:inset 0 2px 3px #fff9,0 2px 5px #3e6e224a,0 0 6px #a7ff6f;font-size:clamp(11px,6cqw,27px);font-weight:900;line-height:1.2;white-space:nowrap}
.line-mark{position:relative;flex:none;display:flex;align-items:center;justify-content:center;background:white;color:#08ab0d;border-radius:50%;font-family:Arial,sans-serif;font-size:clamp(7px,3.5cqw,16px);font-weight:900;width:clamp(20px,11cqw,48px);height:clamp(18px,10cqw,44px)}.line-mark:after{content:"";position:absolute;bottom:-2px;left:43%;border-top:5px solid #fff;border-right:5px solid transparent;transform:rotate(-8deg)}
.corner-ball{display:block;flex:0 0 18%;width:18%;height:auto;max-width:90px;filter:drop-shadow(0 1px 4px #9d751f55)}
footer{position:relative;padding:clamp(24px,5vw,48px) 8px clamp(30px,5vw,50px);text-align:center;color:#3a2719;background:url('assets/gold-divider-r2.webp') center top/100% auto no-repeat;font-size:clamp(12px,2.6vw,23px)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
:focus-visible{outline:2px solid #78510b;outline-offset:3px}
@media(min-width:800px){.search-box{min-height:60px}.filters button{min-height:52px}.catalog-heading{padding-top:16px}.card-stack{padding:20px 18px}}
@media(max-width:370px){.catalog-controls{margin:0 4%}.filters{gap:4px}.product-tag{font-size:7px;padding:3px 1px;gap:1px}.order-link{font-size:10px}.spec-caption{gap:2px}.spec-label{letter-spacing:0}.product-name{font-size:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* The stone stays visible inside price/tag frames; metallic decoration is edge-only. */
.search-box{background:linear-gradient(135deg,#fff,#faf8f4) padding-box,linear-gradient(155deg,#ae6a0c 0%,#ffe6a5 16%,#cf9325 33%,#fff9dd 48%,#b27414 68%,#ffdc86 82%,#98580b) border-box}
.spec{background:rgba(255,253,245,.42);border:1.5px solid #d2962c;box-shadow:inset 0 0 0 1px #fff,0 0 0 1px #f7dfa3,0 2px 5px #8d5a223d}
.spec[aria-pressed=true]{background:rgba(255,245,212,.5);outline:none;box-shadow:inset 0 0 0 1px #fff,0 0 0 1px #d5a043,0 0 6px #f4bf5b70}
.product-tag{background:rgba(255,252,240,.68);border:1px solid #c39337;box-shadow:inset 0 0 0 1px #fff9,0 1px 4px #94631930}
.order-link{background:linear-gradient(135deg,#a4ff6a 0%,#33f51a 13%,#08d409 38%,#00a502 62%,#087a01 78%,#22c608 100%);box-shadow:inset 0 2px 4px #ffff,0 2px 5px #3e6e2255,0 0 5px #a7ff6f}

/* 7:48 reference: compact centered listing title with small floral ornaments.
   Only restore the catalog controls — retain marble artwork and product cards. */
.catalog-heading{display:block;text-align:center;padding:0;margin:-3px 0 12px;line-height:1.18}
.catalog-heading h2{margin:0;font-size:clamp(26px,4.5vw,49px);font-weight:900;letter-spacing:0;color:#76400c;text-shadow:0 1px 0 #fff,0 2px 8px #e6bd68}
.catalog-heading h2::before,.catalog-heading h2::after{content:'❧';display:inline-block;color:#bf8b2e;font-family:Georgia,serif;font-size:.54em;margin:0 14px;vertical-align:middle;transform:translateY(-1px)}
.catalog-controls{margin:0;padding:0 3.4%}
.search-box{border:2px solid #c88b2b;border-radius:35px;background:rgba(255,255,255,.92);box-shadow:0 2px 6px #9e631c77,inset 0 0 0 2px #fff;padding:9px 16px;min-height:45px}
.search-box svg{width:26px;height:26px;stroke:#1d1815}
.search-box input{font-size:clamp(15px,2.5vw,23px)}
.filters{gap:10px;margin:15px 0 20px}
.filters button{padding:10px 1px;border-radius:35px;border:1.5px solid #c99535;background:linear-gradient(#fff,#faf5ec);box-shadow:0 2px 5px #9d7a4380;font-size:clamp(12px,2.1vw,20px)}
.filters button[aria-pressed=true]{background:linear-gradient(#fff8bd,#ffbf1d);box-shadow:0 0 12px #ffce57;border-color:#e6a72c}
@media(max-width:540px){.catalog-controls{padding:0 3.4%}.filters{gap:5px;margin:12px 0 18px}.filters button{padding:9px 0}.search-box{padding:8px 13px}}

/* ONE PIECE page art — the logo, complete badges and catalog heading share one physical bitmap. */
html,body{background:#f8f6f2}
body{background:#f8f6f2}
.site{max-width:1024px;overflow:hidden;background:#f8f6f2 url('assets/continuous-whitegold.webp') center top / 100% auto repeat-y;box-shadow:0 0 40px #92672225}
.brand-hero{display:block;position:relative;aspect-ratio:1024/608;width:100%;background:transparent}
#catalog{background:transparent;padding:0 0 28px}
.catalog-heading{display:none!important}
.catalog-controls{margin:0;padding:0 3.4%}
.search-box{min-height:45px;background:rgba(255,255,255,.92);border:2px solid #be8529;box-shadow:0 2px 7px #a16b3550,inset 0 0 0 1px #fff}
.filters{margin:14px 0 22px;gap:clamp(4px,1.5vw,15px)}
.filters button{background:linear-gradient(#fffefaed,#f8f2e9cb);border:1.5px solid #c3913d}
.filters button[aria-pressed=true]{background:linear-gradient(#fff5bd,#ffd64f 65%,#efad1e)}
.product-card{background:linear-gradient(0deg,#fffefd55,#fffdf944) padding-box,linear-gradient(145deg,#9b6207,#ffe6a6 8%,#be8629 18%,#fff1bd 31%,#b17409 49%,#ffe4a0 61%,#cb8b1c 77%,#fff1c2 86%,#b07a12) border-box}
.product-card::before{background:linear-gradient(165deg,#fffdf548,#fff9e824);inset:0}
.product-card::after{pointer-events:none}
footer{background:rgba(255,249,239,.20);border-top:1px solid #d8ae67;padding:26px 8px 34px}
@media(max-width:540px){.filters{gap:5px}.filters button{min-height:40px}.catalog-controls{padding:0 3.4%}.brand-hero{aspect-ratio:1024/608}}
