:root{--ink:#30263c;--muted:#756d7c;--green:#62447f;--bg:#faf8f2;--line:#e1dce6;--white:#fff;--pale:#efebf4;--serif:ui-sans-serif,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,'Noto Sans JP','Yu Gothic',sans-serif;font-size:16px;line-height:1.7}a{color:inherit;text-decoration:none}button,select,input{font:inherit}button,a,select,summary,input{touch-action:manipulation}button,select{cursor:pointer}button{color:inherit}button:disabled{cursor:default}a:focus-visible,button:focus-visible,select:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #725591;outline-offset:4px}button{border:0}.wrap{max-width:1160px;margin:auto;padding-left:30px;padding-right:30px}.skip{position:absolute;left:10px;top:-80px;background:white;padding:12px;z-index:20}.skip:focus{top:4px}.demo-band{background:#f0eccf;color:#514933;display:flex;justify-content:center;align-items:center;gap:12px;font-size:12px;padding:9px 20px}.demo-label{font-size:10px;letter-spacing:.08em;border:1px solid #b3a97a;padding:0 7px;border-radius:3px;white-space:nowrap}.site-header{display:flex;align-items:center;justify-content:space-between;min-height:106px;border-bottom:1px solid var(--line)}.wordmark{display:flex;gap:12px;align-items:center;font-weight:750;font-size:20px;letter-spacing:.03em}.wordmark small{display:block;font-size:9px;letter-spacing:.16em;font-weight:500;line-height:1.4;margin-top:2px}.logo{background:var(--ink);color:white;width:40px;height:44px;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:30px;border-radius:5px;position:relative}.logo span{font-size:17px;position:absolute;bottom:0;right:5px}.site-header nav{display:flex;gap:30px;font-size:13px}.site-header nav a{padding:12px 0}.hero{padding:48px 0 37px;display:flex;align-items:center;justify-content:space-between;gap:36px}.eyebrow{font-size:11px;font-weight:650;letter-spacing:.18em;color:var(--green);margin:0 0 16px}.hero h1{font-size:clamp(28px,3vw,38px);line-height:1.55;letter-spacing:.03em;margin:0 0 14px;font-weight:750}.hero p.description{color:var(--muted);font-size:14px;margin:0;line-height:1.9}.hero-note{width:250px;flex-shrink:0;padding:22px 24px;border-left:1px solid #c5b4d6;font-size:12px;color:var(--muted)}.hero-note strong{display:block;color:var(--ink);font-size:14px;margin-bottom:9px}.hero-note p{margin:0}.steps{display:flex;gap:26px;font-size:11px;color:var(--muted);padding:0 0 26px}.steps span{display:flex;gap:7px;align-items:center}.steps b{font-family:var(--serif);font-size:15px;color:var(--green);font-weight:400}.workspace{display:grid;grid-template-columns:223px minmax(0,1fr);gap:30px;align-items:start}.filters{background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px;position:sticky;top:18px}.filter-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.filter-heading strong{font-size:14px}.text-button{padding:8px 0;background:none;font-size:11px;text-decoration:underline;text-underline-offset:3px;color:var(--muted)}.field{display:block;margin:18px 0}.field>span,.field>label{display:block;font-size:12px;font-weight:650;margin-bottom:8px}.field select{width:100%;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:5px;padding:10px 8px;min-height:44px;font-size:13px}.quantity{display:flex;gap:4px;background:#efebf3;padding:4px;border-radius:6px}.quantity button{flex:1;background:none;min-height:40px;border-radius:4px;font-size:12px}.quantity button.active{background:white;box-shadow:0 1px 4px #30263c17;font-weight:700}.check{display:flex;gap:9px;align-items:flex-start;font-size:12px;margin:20px 0 12px;cursor:pointer}.check input{accent-color:var(--green);width:17px;height:17px;margin:2px 0}.filter-fine{font-size:11px;line-height:1.8;color:var(--muted);margin:0}.region{display:flex;align-items:center;gap:8px;margin-top:18px;border-top:1px solid var(--line);padding-top:15px;font-size:11px;color:var(--muted)}.region svg{width:16px;height:16px;flex-shrink:0}.conditions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:11px;color:var(--muted);margin:0 0 17px}.conditions span{padding:3px 9px;background:#efebf4;border-radius:4px;color:#62447f}.result-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.result-toolbar h2{font-size:15px;font-weight:600;margin:0}.result-toolbar h2 b{font-size:22px;font-family:var(--serif);font-weight:400;margin-right:5px}.result-toolbar select{font-size:12px;border:0;border-bottom:1px solid #9aaea0;color:var(--ink);background:transparent;padding:8px 20px 8px 3px;min-height:44px;max-width:60%}.cards{display:grid;gap:14px}.product{background:white;border:1px solid var(--line);border-radius:10px;overflow:hidden;position:relative}.product.first{border-color:#a98dbd}.product-content{padding:23px 24px}.product-top{display:flex;align-items:center;gap:18px}.pack{position:relative;width:67px;height:82px;flex-shrink:0;background:var(--pack);border:1px solid #0000000d;border-radius:7px 7px 10px 10px;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:36px;color:var(--pack-ink);box-shadow:inset 2px 0 8px #ffffff77}.pack:before{content:'';position:absolute;left:5px;right:5px;top:7px;height:3px;border-top:1px solid #00000014;border-bottom:1px solid #0000000b}.pack:after{content:'WHEY';position:absolute;font:7px sans-serif;letter-spacing:2px;bottom:10px}.sage{--pack:#e0e8d7;--pack-ink:#436343}.cacao{--pack:#e7dfd4;--pack-ink:#7c5d42}.berry{--pack:#e9dce2;--pack-ink:#806070}.sand{--pack:#e3e4d3;--pack-ink:#62663d}.cream{--pack:#efe8d6;--pack-ink:#83704b}.identity{flex:1;min-width:0}.brand{font-size:9px;letter-spacing:.12em;font-weight:700;color:var(--muted);margin:0 0 4px}.identity h3{font-size:16px;line-height:1.6;margin:0 0 6px;overflow-wrap:anywhere}.meta{color:var(--muted);font-size:12px;margin:0}.meta .tag{display:inline-block;border:1px solid var(--line);padding:0 5px;border-radius:3px;font-size:10px;margin-left:5px}.rank{margin-left:auto;align-self:flex-start;white-space:nowrap;font-size:10px;color:var(--muted);border:1px solid var(--line);padding:3px 8px;border-radius:4px}.first .rank{background:var(--pale);border-color:transparent;color:var(--green)}.pricing{display:grid;grid-template-columns:1.15fr 1fr;gap:15px;margin-top:21px;padding-top:17px;border-top:1px solid #ece7f0}.metric-label{font-size:11px;color:var(--muted);display:block}.price-number{font-family:var(--serif);font-size:35px;font-weight:400;letter-spacing:-.025em;line-height:1.3}.price-number span{font-family:inherit;font-size:15px;letter-spacing:0;margin-left:4px}.total-number{font-family:var(--serif);font-size:29px;line-height:1.5}.total-number span{font-size:14px;margin-left:4px}.metric-sub{font-size:10px;color:var(--muted);margin-top:4px}.coupon-line{font-size:11px;color:#654e78;margin:16px 0 0;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.coupon-line code{font:11px monospace;border:1px solid var(--line);padding:1px 6px;border-radius:3px;background:#f7f4fa}.card-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:17px}.detail-link{font-size:12px;text-decoration:underline;text-underline-offset:4px;padding:8px 0}.sample-cta{border:1px solid var(--line);color:var(--muted);background:#f4f0f6;font-size:11px;border-radius:5px;padding:9px 12px;min-height:40px}.breakdown{border-top:1px solid #ece7f0}.breakdown summary{list-style:none;padding:12px 24px;display:flex;justify-content:space-between;font-size:11px;cursor:pointer;color:var(--muted)}.breakdown summary::-webkit-details-marker{display:none}.breakdown summary:after{content:'＋';font-size:14px}.breakdown[open] summary:after{content:'−'}.breakdown-body{padding:3px 24px 20px;background:#fbf9fc}.breakdown dl{margin:0;font-size:12px}.breakdown dl div{display:flex;justify-content:space-between;gap:15px;margin:7px 0}.breakdown dd{margin:0;font-variant-numeric:tabular-nums}.breakdown .sum{border-top:1px solid var(--line);padding-top:9px;font-weight:700}.small-note{font-size:10px;color:var(--muted);margin:11px 0 0;line-height:1.9}.pending{margin-top:27px}.pending h2{font-size:13px;font-weight:650;margin-bottom:4px}.pending>p{font-size:11px;color:var(--muted);margin:0 0 12px}.pending-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:16px 18px;border:1px solid var(--line);border-radius:7px;margin-bottom:8px}.pending-row strong{font-size:12px;display:block}.pending-row small{font-size:11px;color:var(--muted)}.status-tag{font-size:10px;white-space:nowrap;border:1px solid #d9d8c2;border-radius:4px;background:#f1f0e5;color:#6f6845;padding:3px 8px}.bottom-note{margin:26px 0 0;font-size:11px;color:var(--muted)}.empty{text-align:center;border:1px dashed #b9a4cb;background:#fff;padding:40px 18px;border-radius:10px}.empty h3{font-size:16px}.empty p{font-size:13px;color:var(--muted)}.primary{background:var(--green);color:white;padding:12px 22px;min-height:44px;border-radius:5px;font-size:13px}.footer{margin-top:70px;border-top:1px solid var(--line);padding-top:30px;padding-bottom:30px;display:grid;grid-template-columns:1fr auto;gap:15px}.footer strong{font-size:16px}.footer p{font-size:12px;color:var(--muted);margin:4px 0}.footer small{font-size:10px;color:var(--muted)}.footer nav{display:flex;align-items:flex-start;gap:22px;font-size:11px;padding-top:3px}.footer .footer-note{grid-column:1/-1;margin-top:12px;font-size:10px}.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;border-radius:7px;padding:12px 20px;font-size:13px;box-shadow:0 5px 20px #0002;opacity:0;pointer-events:none;transition:opacity .15s;max-width:90vw}.toast.visible{opacity:1}.document{max-width:760px;margin:40px auto 0}.back-link{font-size:12px;color:var(--muted);display:inline-block;padding:9px 0}.document h1{font-size:28px;line-height:1.5;margin:18px 0 22px}.document h2{font-size:18px;margin:32px 0 10px}.document p,.document li{font-size:14px;line-height:1.95;color:#5c5265}.document ul{padding-left:20px}.document .notice{background:var(--pale);padding:17px 20px;border-radius:7px;font-size:13px}.detail-hero{display:flex;align-items:center;gap:22px;margin:22px 0}.detail-hero .pack{width:85px;height:105px;font-size:44px}.detail-hero h1{margin:4px 0;font-size:24px}.specs{background:white;border:1px solid var(--line);border-radius:8px;padding:15px 22px}.specs div{display:flex;justify-content:space-between;gap:15px;padding:9px 0;font-size:13px;border-bottom:1px solid #ece7f0}.specs div:last-child{border:0}.specs dd{margin:0;text-align:right}.document .product{margin-top:18px}.document .demo-detail{font-size:11px;color:var(--muted)}
@media(min-width:1100px){.product-content{display:grid;grid-template-columns:1fr 1.05fr;column-gap:28px}.product-top{grid-column:1}.pricing{grid-column:2;grid-row:1;margin:0;padding:0 0 0 23px;border-top:0;border-left:1px solid #ece7f0;align-content:center;gap:13px}.rank{position:absolute;top:0;right:0;border-radius:0 9px 0 6px;border-top:0;border-right:0;font-size:9px;padding:2px 10px}.coupon-line{grid-column:1;margin-top:16px}.card-actions{grid-column:2;margin-top:12px;justify-content:space-between;padding-left:23px}.identity h3{font-size:14px}.price-number{font-size:32px}.total-number{font-size:27px}}
@media(max-width:760px){.wrap{padding-left:19px;padding-right:19px}.demo-band{font-size:10px;padding:8px 14px;gap:8px;line-height:1.6;align-items:flex-start}.demo-label{margin-top:1px}.site-header{min-height:82px}.wordmark{font-size:16px;gap:9px}.logo{width:32px;height:36px;font-size:25px}.wordmark small{font-size:7px}.site-header nav{font-size:11px;gap:14px}.site-header nav a:first-child{display:none}.hero{padding:30px 0 24px}.hero h1{font-size:28px;margin-bottom:12px;letter-spacing:.01em}.hero p.description{font-size:12px}.hero-note{display:none}.eyebrow{font-size:9px;margin-bottom:12px}.steps{font-size:10px;gap:15px;flex-wrap:wrap;padding-bottom:20px}.steps b{font-size:13px}.workspace{display:block}.filters{position:static;padding:15px 16px;margin-bottom:24px}.filter-heading{margin-bottom:3px}.filter-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.field{margin:10px 0}.field select{font-size:12px}.field>span,.field>label{font-size:11px}.check{margin:10px 0}.filter-fine{font-size:10px}.region{padding-top:10px;margin-top:12px}.conditions{font-size:10px;margin-bottom:10px}.product-content{padding:20px}.product-top{gap:13px}.identity h3{font-size:15px}.brand{font-size:8px}.meta{font-size:11px}.pack{width:57px;height:73px;font-size:31px}.rank{font-size:9px;padding:2px 6px}.pricing{margin-top:17px;padding-top:15px;gap:10px;grid-template-columns:1.15fr 1fr}.price-number{font-size:34px}.total-number{font-size:28px}.metric-label{font-size:10px}.metric-sub{font-size:9px}.sample-cta{font-size:10px;padding:8px 10px}.breakdown summary{padding:11px 20px}.breakdown-body{padding:3px 20px 18px}.pending-row{padding:12px;gap:8px}.pending-row strong{font-size:11px}.status-tag{font-size:9px}.footer{margin-top:45px;display:block;padding-top:25px}.footer nav{flex-wrap:wrap;gap:17px;margin:19px 0}.document{margin-top:25px}.document h1{font-size:24px}.document h2{font-size:17px}.detail-hero{gap:15px}.detail-hero h1{font-size:21px}.detail-hero .pack{width:65px;height:86px}.document .notice{padding:14px;font-size:12px}.specs{padding:12px 16px}.specs div{font-size:12px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Independent visual identity: plum / primrose, cost-receipt layout. */
.logo{border-radius:50% 50% 6px 50%;font-family:inherit;font-size:23px;background:#62447f;width:44px;height:44px;transform:rotate(-8deg)}
.logo span{font-size:16px}.wordmark{letter-spacing:-.025em;font-weight:800}.wordmark small{letter-spacing:.12em;font-weight:600}
.hero{background:#3d2b50;color:#fff8ec;padding:36px 38px;margin:25px 0 0;border-radius:18px;min-height:230px;position:relative;overflow:hidden}.hero .eyebrow{color:#dce7a4;letter-spacing:.13em}.hero h1{font-size:clamp(29px,3.6vw,44px);line-height:1.45;letter-spacing:.01em}.hero p.description{color:#e4daed;font-size:13px}.hero-note{border-left:0;width:230px;padding:20px 10px;color:#e4daed;position:relative}.hero-note strong{color:#e5edb6;font-size:12px;letter-spacing:.05em}.hero-note .cost-symbol{font-size:72px;font-weight:750;line-height:1.2;letter-spacing:-.06em;display:block;color:#e5edb6;margin-bottom:9px}.hero-note .cost-symbol i{font-style:normal;font-size:30px;font-weight:400;color:#c7b6d7;margin:0 9px}.hero-note p{font-size:11px}.steps{padding:19px 2px 23px;gap:30px}.steps b{font-size:11px;font-weight:750;background:#ece6f1;border-radius:50%;width:25px;height:25px;display:inline-flex;align-items:center;justify-content:center;color:#62447f}
.workspace{display:block}.filters{position:static;padding:18px 22px;margin:0 0 24px;background:#fffdf8;border:1px solid #dfd8e5;border-radius:12px;display:grid;grid-template-columns:1fr auto;column-gap:24px}.filter-heading{grid-column:1/-1;border-bottom:1px solid #e9e2ee;margin-bottom:8px;padding-bottom:4px}.filter-heading strong{font-size:13px}.filter-grid{grid-column:1/-1;display:grid;grid-template-columns:1.1fr 1fr 1fr 1fr;gap:20px}.field{margin:10px 0}.field select{background:#fffdf8;border-color:#dbd3e3}.check{grid-column:1;margin:13px 0 1px}.filter-fine{grid-column:1;font-size:10px}.region{grid-column:2;grid-row:3/5;margin:8px 0 0;border:0;padding:0}.result-toolbar{padding-bottom:11px;border-bottom:2px solid #463153}.result-toolbar h2{font-size:14px}.result-toolbar h2 b{font-size:26px;font-weight:750}.result-toolbar h2 small{font-size:10px}.conditions span{background:#eee8f3;color:#654d7b;border-radius:3px}.cards{gap:13px}.product{border-radius:3px 3px 12px 12px;border-color:#ded5e7;box-shadow:0 3px 10px #3d2b5004}.product.first{border-color:#a58bb9}.product-content{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:30px;padding:25px 30px 21px 40px}.product-top{grid-column:1;gap:0}.product-top .pack{display:none}.identity{padding-right:20px}.identity h3{font-size:17px;font-weight:750}.brand{font-size:10px;letter-spacing:.15em;color:#74637f}.meta{font-size:12px}.rank{position:absolute;top:0;left:0;right:auto;writing-mode:vertical-rl;border:0;border-radius:0 0 5px 0;background:#f0ebf4;color:#715382;font-size:10px;padding:10px 5px;letter-spacing:.07em}.first .rank{background:#e5edb6;color:#443854}.pricing{grid-column:2;grid-row:1;border-top:0;border-left:1px dashed #cdbfda;padding:0 0 0 28px;margin:0;grid-template-columns:1.1fr 1fr;align-content:center;gap:18px}.price-number{font-size:34px;font-weight:750;letter-spacing:-.05em;font-variant-numeric:tabular-nums}.price-number span{font-size:12px;font-weight:500;letter-spacing:0}.total-number{font-size:27px;font-weight:650;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.total-number span{font-size:12px;font-weight:500}.metric-label{font-size:10px}.metric-sub{font-size:10px}.coupon-line{grid-column:1;margin-top:17px;font-size:11px}.card-actions{grid-column:2;padding-left:28px;margin-top:14px}.sample-cta{border-radius:2px;background:#efebf3;border-color:#d9cde3}.breakdown{border-top:1px dashed #cdbfda;background:#fcfafc}.breakdown summary{padding:11px 30px 11px 40px}.breakdown summary:after{color:#62447f}.breakdown-body{padding:3px 30px 20px 40px}.sum{color:#513469}.pending-row{background:#f3eff6;border-color:transparent;border-radius:5px}.status-tag{background:#eee9d0;color:#655a29;border-color:#d3c992}.footer strong{letter-spacing:-.02em}.primary{background:#62447f}.empty{border-color:#bca9cb}.document .notice{border-left:3px solid #9c80b4;border-radius:0 8px 8px 0}.detail-hero .pack{border-radius:50%;width:80px;height:80px;background:#ece5f3;color:#62447f;font-family:inherit;font-size:32px;font-weight:750;box-shadow:none}.detail-hero .pack:before{display:none}.detail-hero .pack:after{font-size:6px;bottom:13px}.specs{border-radius:5px}.document .product .product-content{grid-template-columns:1fr;padding-left:25px}.document .product .product-top{display:none}.document .product .pricing{grid-column:1;grid-row:1;border:0;padding:0}.document .product .coupon-line{grid-column:1}.document .product .card-actions{grid-column:1;padding-left:0}.document .product .breakdown summary{padding-left:25px}.document .product .breakdown-body{padding-left:25px}
@media(max-width:760px){.site-header{min-height:80px}.logo{width:35px;height:35px;font-size:20px}.hero{margin-top:18px;padding:28px 23px;border-radius:12px;min-height:0}.hero h1{font-size:29px;line-height:1.5}.hero p.description{font-size:11px;line-height:1.9}.hero-note{display:none}.steps{padding:14px 0 18px;gap:12px;font-size:9px}.steps b{font-size:9px;width:20px;height:20px}.steps span{gap:5px}.filters{display:block;padding:14px 15px;margin-bottom:24px}.filter-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.filter-heading{margin-bottom:4px}.check{margin-top:12px}.region{margin:12px 0 0;border-top:1px solid #e9e2ee;padding-top:11px}.conditions{gap:5px}.conditions span{padding:3px 7px}.product-content{display:block;padding:22px 20px 16px 31px}.identity h3{font-size:16px}.product-top{display:block}.identity{padding-right:0}.rank{font-size:9px;padding:8px 4px}.brand{font-size:9px}.pricing{margin-top:17px;padding:14px 0 0;border-left:0;border-top:1px dashed #cdbfda;grid-template-columns:1.15fr 1fr;gap:12px}.price-number{font-size:33px}.total-number{font-size:27px}.coupon-line{margin-top:15px;font-size:10px}.card-actions{padding-left:0;margin-top:14px}.sample-cta{font-size:10px}.breakdown summary{padding:11px 20px 11px 31px}.breakdown-body{padding:3px 20px 18px 31px}.document .product .product-content{padding:20px}.document .product .pricing{padding-top:0;margin-top:0}.document .product .breakdown summary{padding-left:20px}.document .product .breakdown-body{padding-left:20px}.detail-hero .pack{width:62px;height:62px;font-size:25px}.detail-hero .pack:after{bottom:9px;font-size:5px}.result-toolbar select{font-size:10px;max-width:62%}.result-toolbar h2 small{display:block;line-height:1.5}.footer nav{font-size:10px}}

/* Readable comparison: primary choices and prices first, notes below. */
body{font-size:17px}.demo-band{font-size:15px;padding:10px 18px}.demo-label{font-size:13px}.wordmark small{font-size:11px}.site-header nav{font-size:16px}.hero{padding:25px 28px;margin:22px 0;min-height:0}.hero h1{font-size:30px;margin:0 0 8px;line-height:1.5}.hero p.description{font-size:17px}.filters{display:block;padding:20px 24px}.filter-heading strong{font-size:18px}.text-button{font-size:15px;min-height:44px}.filter-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 20px}.field>span,.field>label{font-size:16px}.field select{font-size:16px;min-height:48px}.quantity button{font-size:16px;min-height:44px}.check{font-size:16px;align-items:center;margin-top:16px}.check input{width:20px;height:20px}.filter-context{font-size:15px;color:var(--muted);margin:12px 0 0}.result-toolbar{flex-wrap:wrap;align-items:center}.result-toolbar h2{font-size:18px}.result-toolbar h2 b{font-size:24px}.result-toolbar h2 small{font-size:15px}.result-toolbar select{font-size:16px;max-width:100%;border-color:#9c86ab}.product-content{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);padding:24px;column-gap:24px}.product-top{position:relative;display:block;padding-top:30px}.identity{padding:0}.identity h3{font-size:20px;margin-bottom:8px}.brand{font-size:14px;letter-spacing:.03em}.meta{font-size:16px}.meta .tag{font-size:14px}.rank{position:absolute;left:0;top:0;writing-mode:horizontal-tb;font-size:14px;padding:1px 10px;border-radius:4px}.pricing{padding-left:24px;gap:18px}.metric-label{font-size:15px;color:#62556e}.price-number{font-size:36px}.total-number{font-size:30px}.price-number span,.total-number span{font-size:16px}.coupon-line{font-size:16px}.coupon-line code{font-size:15px;overflow-wrap:anywhere}.card-actions{padding-left:24px}.detail-link,.sample-cta,.demo-detail{font-size:16px}.sample-cta{padding:10px 14px}.detail-link{display:inline-block;padding:6px 0}.breakdown summary{font-size:16px;min-height:48px;padding:12px 24px}.breakdown-body{font-size:16px;padding:6px 24px 20px}.breakdown-body dl,.breakdown-body dl div,.breakdown-body dt,.breakdown-body dd,.small-note{font-size:16px}.comparison-notes{margin-top:36px;padding-top:22px;border-top:1px solid var(--line)}.comparison-notes h2{font-size:20px;margin:0 0 12px}.comparison-notes details{border-bottom:1px solid var(--line);margin:0;background:transparent}.comparison-notes summary{font-size:17px;font-weight:600;padding:15px 0;cursor:pointer}.notes-body{font-size:16px;line-height:1.85;padding:0 0 18px;overflow-wrap:anywhere}.notes-body ul{padding-left:1.4em}.notes-body li+li{margin-top:10px}.notes-body p{margin:0 0 12px}.pending-row strong,.pending-row small,.status-tag{font-size:15px}.pending-row{flex-wrap:wrap}.footer nav,.footer small,.footer-note{font-size:15px}.document .notice,.specs div,.back-link{font-size:16px}.document .product .product-top{display:none}
@media(max-width:760px){.wrap{padding-left:18px;padding-right:18px}.demo-band{font-size:14px;align-items:center;gap:8px;line-height:1.5}.demo-label{font-size:12px}.site-header{min-height:76px}.site-header nav{font-size:15px}.wordmark{font-size:18px}.wordmark small{display:none}.hero{padding:22px 20px;margin:18px 0}.hero h1{font-size:26px;line-height:1.5}.hero p.description{font-size:16px;line-height:1.7}.filters{padding:16px}.filter-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px}.filter-grid .field:first-child{grid-column:1/-1}.field{min-width:0}.field>span{font-size:16px}.field select{font-size:16px;padding-left:7px}.result-toolbar{display:block}.result-toolbar h2{font-size:18px;margin-bottom:8px}.result-toolbar select{font-size:16px;max-width:100%;width:100%;padding:10px 4px}.product-content{display:block;padding:20px}.product-top{padding-top:32px}.identity h3{font-size:20px}.brand{font-size:14px}.meta{font-size:16px}.rank{font-size:14px;padding:1px 10px}.pricing{padding:18px 0 0;margin-top:18px;grid-template-columns:1fr 1fr;gap:16px}.metric-label{font-size:15px;line-height:1.6}.price-number{font-size:34px}.total-number{font-size:29px}.coupon-line{font-size:16px}.card-actions{padding-left:0;gap:12px;flex-wrap:wrap}.sample-cta{font-size:16px}.breakdown summary{font-size:16px;padding:13px 20px}.breakdown-body{padding:4px 20px 18px}.comparison-notes h2{font-size:20px}.footer nav{font-size:15px;gap:18px}.document .notice,.specs div{font-size:16px}}

/* Research-informed controls and consistent comparison columns. */
.hero{background:transparent;color:var(--ink);padding:6px 0 16px;border-radius:0;margin:22px 0 4px}.hero h1{font-size:28px;line-height:1.5}.hero p.description{color:var(--muted);font-size:16px}.filter-heading{border:0;margin-bottom:14px;padding:0}.filters{background:#fff;border-radius:12px}.type-switch{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:16px}.type-switch button{background:#faf8fc;border:1px solid #dcd2e5;border-radius:7px;min-height:48px;padding:10px 8px;font-size:16px;font-weight:650}.type-switch button.active{background:#62447f;color:white;border-color:#62447f;box-shadow:0 2px 5px #62447f24}.filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.advanced-filters{border-top:1px solid var(--line);margin-top:12px}.advanced-filters summary{padding:14px 0 4px;cursor:pointer;font-size:16px;font-weight:600}.advanced-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:center;max-width:700px}.filter-context{line-height:1.7}.pricing{grid-template-columns:1fr;gap:12px;align-content:center}.primary-metric{padding:0}.price-number{font-size:36px;color:#62447f;line-height:1.3}.secondary-metric{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}.secondary-metric .total-number{font-size:22px;line-height:1.5}.secondary-metric .metric-label{font-size:15px}.product-top{padding-top:26px}.product-content{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);row-gap:8px}.identity h3{line-height:1.55}.card-actions{margin-top:8px}.coupon-line{margin-top:8px}.meta .tag{display:none}.document .product .pricing{grid-template-columns:1fr}.document{max-width:780px}.document p{line-height:1.85}.breakdown summary:hover,.comparison-notes summary:hover{color:#62447f}.notes-body{max-width:780px}.rank{background:#f0ebf4}.first .rank{background:#e5edb6}
@media(max-width:760px){.hero{padding:0 0 12px;margin-top:20px}.hero h1{font-size:24px;line-height:1.5}.hero p.description{font-size:16px}.type-switch{gap:6px;margin-bottom:12px}.type-switch button{font-size:16px;padding:10px 6px;line-height:1.5}.filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.filter-grid .field:first-child{grid-column:auto}.filter-grid .field:last-child{grid-column:1/-1}.advanced-body{grid-template-columns:1fr;gap:0}.filter-context{font-size:15px}.product-content{display:block;padding:20px}.pricing{display:block;padding-top:16px}.price-number{font-size:34px}.secondary-metric{margin-top:10px}.secondary-metric .total-number{font-size:22px}.card-actions{margin-top:14px}.coupon-line{margin-top:12px}.identity h3{font-size:20px}.result-toolbar h2{font-size:18px}}

.advanced-body .check{grid-column:auto}

/* Review fixes: compact controls, price intent and explicit empty states. */
.site-header{min-height:76px}.hero{margin:14px 0 4px;padding:2px 0 12px}.hero h1{margin-bottom:4px}.filters{padding:14px 20px;margin-bottom:18px}.filter-heading{margin-bottom:8px}.type-switch{margin-bottom:8px}.quick-purchase .field{display:flex;align-items:center;gap:20px;margin:6px 0}.quick-purchase .field>span{margin:0;flex-shrink:0}.quick-purchase .quantity{width:240px;max-width:100%}.detail-filters{border-top:1px solid var(--line);margin-top:10px}.detail-filters summary,.advanced-filters summary{font-size:16px;font-weight:600;cursor:pointer;padding:10px 0;min-height:44px;line-height:1.5}.detail-filters .filter-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:720px}.advanced-filters{margin-top:0}.filter-context{margin:6px 0 0}.result-toolbar{margin-bottom:0;padding-bottom:8px}.purchase-scope{display:inline-block;font-size:16px;font-weight:500}.sort-help{font-size:16px;line-height:1.7;margin:8px 0 14px;color:#62556e}.inline-button{background:none;color:#62447f;text-decoration:underline;text-underline-offset:3px;font-size:inherit;padding:4px 2px;cursor:pointer}.empty{padding:24px}.empty h3{font-size:20px}.empty p{font-size:16px}.empty-actions{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}.empty-actions .primary{min-height:48px;padding:10px 16px;font-size:16px}.empty .text-button{font-size:16px}#excluded-products{scroll-margin-top:20px}#excluded-products summary:focus{outline:3px solid #725591;outline-offset:3px}
@media(max-width:760px){.site-header{min-height:68px}.hero{margin-top:12px;padding-bottom:8px}.hero h1{font-size:24px}.filters{padding:12px 16px}.filter-heading{margin-bottom:6px}.type-switch{margin-bottom:8px}.quick-purchase .field{gap:16px}.quick-purchase .quantity{flex:1;width:auto}.detail-filters .filter-grid .field:last-child{grid-column:auto}.detail-filters .field{margin:6px 0}.filter-context{font-size:15px}.result-toolbar h2{margin-bottom:4px}.result-toolbar select{padding:8px 4px}.purchase-scope{font-size:16px}.sort-help{font-size:16px;margin:6px 0 12px}.empty{padding:20px}.empty-actions{gap:10px}}

/* Language and reading review: keep secondary pages equally readable. */
.document p,.document li,.document .demo-detail{font-size:16px;line-height:1.85}
.document h2{font-size:20px;line-height:1.6}
.document .eyebrow{font-size:12px}
.specs div{align-items:baseline;flex-wrap:wrap;gap:4px 16px}
.specs dd{margin-left:auto;max-width:100%;overflow-wrap:anywhere}
.footer p,.footer .footer-note{font-size:15px;line-height:1.8}
.detail-hero .pack:after{content:attr(data-kind);font-size:10px;letter-spacing:.03em}
.inline-button{min-height:44px}
.sort-help{margin-top:4px}
.type-switch button{min-width:0}
@media(max-width:760px){
 .type-switch button{padding:10px 3px;font-size:16px}
 .filter-context{font-size:15px}
 .detail-hero{align-items:flex-start}
 .detail-hero>div:last-child{min-width:0}
 .detail-hero h1{overflow-wrap:anywhere}
 .document .notice{font-size:16px}
 .specs div{display:block}
 .specs dt{color:var(--muted)}
 .specs dd{text-align:left;margin:3px 0 0}
 .document .product .pricing{border-top:0}
}

/* ============================================================
   Emma redesign — 2026-11-01 — “Powder & Measure / 粉と計量”
   Diagnosis: the old look read as generated SaaS — a plum
   signboard colour swapped onto the same white/grey boxes as
   the sibling sites, thin 1px lines, uniform radii, and the
   product bags (the site's one real character) hidden away.
   Direction: a training-notebook grid on protein-powder cream,
   roasted-cocoa ink, a persimmon-orange scoop as the primary,
   turmeric as the highlighter, steel kept only for links —
   and product cards ruled like nutrition labels, with the
   thick black separator under the headline price.
   Structure, copy and layout intent are unchanged.
   ============================================================ */
:root{
  --ink:#2c2016;
  --muted:#7d6c57;
  --green:#c2511d;
  --bg:#f3ecdc;
  --line:#ddd0b6;
  --line-strong:#b39b72;
  --white:#fffdf6;
  --pale:#f7e7bd;
  --persimmon:#c2511d;
  --persimmon-deep:#9c3d12;
  --turmeric:#e0a51c;
  --turmeric-pale:#fdf0c0;
  --steel:#35566e;
  color-scheme:light;
}
::selection{background:#f2cd6b;color:var(--ink)}
body{
  background-color:var(--bg);
  background-image:
    linear-gradient(rgba(44,32,22,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(44,32,22,.05) 1px,transparent 1px);
  background-size:26px 26px;
  color:var(--ink);
}
a:focus-visible,button:focus-visible,select:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--persimmon);outline-offset:3px}

/* Demo band: cocoa bar with a turmeric dispatch label. */
.demo-band{background:var(--ink);color:#f0e4c8}
.demo-label{background:var(--turmeric);border:0;color:var(--ink);font-weight:800;border-radius:3px;transform:rotate(-1.5deg);padding:1px 8px}

/* Header: heavy wordmark, scoop-orange bag mark in an ink frame. */
.site-header{border-bottom:3px solid var(--ink)}
.wordmark{font-weight:900;letter-spacing:.01em;color:var(--ink)}
.wordmark small{color:var(--muted);font-weight:700}
.logo{
  background:var(--persimmon);color:#fff8ea;border:2px solid var(--ink);
  border-radius:9px 9px 5px 5px;box-shadow:3px 3px 0 #e0d0ab;
  transform:none;font-family:inherit;font-weight:900;font-size:24px;
  width:44px;height:44px;
}
.logo span{color:var(--turmeric-pale)}
.site-header nav a{font-weight:600}
.site-header nav a:hover{color:var(--persimmon);text-decoration:underline;text-underline-offset:5px}

/* Hero: the chalkboard at the back of the gym — cocoa board,
   cream chalk, one turmeric scoop-circle. */
.hero{
  background-color:var(--ink);color:#fff7e8;border-radius:14px;
  padding:30px 32px;margin:22px 0 6px;position:relative;overflow:hidden;
  background-image:
    radial-gradient(circle at 90% 18%,rgba(224,165,28,.4) 0 62px,transparent 63px),
    radial-gradient(circle at 99% 96%,rgba(194,81,29,.55) 0 105px,transparent 106px);
}
.hero h1{color:#fff7e8;font-weight:900;letter-spacing:.02em}
.hero p.description{color:#e9dcc0}
.hero .eyebrow{color:var(--turmeric)}

/* Filter panel: a notebook card with an ink frame and hard shadow. */
.filters{
  background:var(--white);border:2px solid var(--ink);border-radius:12px;
  box-shadow:6px 6px 0 #e7dbc0;
}
.filter-heading strong{font-weight:900}
.text-button{color:var(--muted)}
.type-switch button{
  background:#fdf8ec;border:2px solid var(--ink);border-radius:8px;
  font-weight:800;color:var(--ink);
}
.type-switch button.active{
  background:var(--persimmon);border-color:var(--ink);color:#fff8ea;
  box-shadow:3px 3px 0 var(--ink);
}
.type-switch button:hover:not(.active){background:var(--turmeric-pale)}
.quantity{background:#f1e7cf;border:1.5px solid var(--line-strong);border-radius:7px}
.quantity button{font-weight:700}
.quantity button.active{background:var(--ink);color:#fff7e8;box-shadow:none}
.field select{background:#fffef9;border:1.5px solid #8f7a5c;border-radius:6px;color:var(--ink)}
.check input{accent-color:var(--persimmon)}
.detail-filters summary,.advanced-filters summary{color:var(--ink)}
.detail-filters summary:hover,.advanced-filters summary:hover,
.breakdown summary:hover,.comparison-notes summary:hover{color:var(--persimmon)}
.detail-filters,.advanced-filters,.detail-filters summary{border-top-color:var(--line)}
.inline-button{color:var(--persimmon-deep);font-weight:700}
.primary{
  background:var(--persimmon);color:#fff8ea;border-radius:6px;
  box-shadow:3px 3px 0 var(--ink);font-weight:800;
}
.primary:hover{background:var(--persimmon-deep)}

/* Results heading sits on a thick ink rule; the count is persimmon. */
.result-toolbar{border-bottom:3px solid var(--ink)}
.result-toolbar h2 b{color:var(--persimmon);font-weight:900;font-family:inherit}
.result-toolbar select{border-bottom:2px solid var(--ink)}
.conditions span{background:var(--pale);color:#7c5410;border-radius:3px;font-weight:600}
.sort-help{color:var(--muted)}

/* Product cards: nutrition-label stock — ink frame, hard shadow,
   the product bag restored as the face of the card. */
.cards{gap:16px}
.product{
  background:var(--white);border:2px solid var(--ink);border-radius:10px;
  box-shadow:6px 6px 0 #e7dbc0;
}
.product.first{border-color:var(--ink);box-shadow:6px 6px 0 #ecc96f}
.product-top{display:flex;align-items:center;gap:16px}
.product-top .pack{
  display:flex;border:2px solid var(--ink);border-radius:8px 8px 5px 5px;
  box-shadow:3px 3px 0 rgba(44,32,22,.16);
  font-family:inherit;font-weight:800;
}
.pack:after{content:attr(data-kind);letter-spacing:.08em}
.identity h3{font-weight:900;letter-spacing:.01em}
.brand{color:#a06a1b;font-weight:800}
.meta{color:var(--muted)}
.meta .tag{border-color:var(--line-strong);border-radius:3px}
.rank{
  background:var(--ink);color:#fff7e8;border:0;border-radius:999px;
  font-weight:800;padding:2px 12px;letter-spacing:.05em;
}
.first .rank{background:var(--turmeric);color:var(--ink)}

/* Pricing: the headline number in persimmon, closed off by the
   nutrition-label thick rule; totals stay in ink beneath it. */
.pricing{border-left:2px dashed #b39b72}
.primary-metric{border-bottom:6px solid var(--ink);padding-bottom:10px}
.price-number{color:var(--persimmon);font-weight:900;font-family:inherit}
.total-number{color:var(--ink);font-weight:800;font-family:inherit}
.metric-label{color:var(--muted);font-weight:700}
.coupon-line{
  background:var(--turmeric-pale);border:1.5px dashed #b07d14;border-radius:4px;
  color:#6d4d0c;padding:6px 10px;justify-self:start;font-weight:600;
}
.coupon-line code{background:#fffef9;border-color:#d8bc72;color:#6d4d0c}
.detail-link{color:var(--steel);font-weight:700}
.sample-cta{
  background:#f3ecdc;border:1.5px solid var(--ink);color:var(--muted);
  border-radius:6px;font-weight:600;
}
.breakdown{border-top:2px solid var(--ink);background:#faf3e0}
.breakdown summary{color:var(--ink);font-weight:600}
.breakdown summary:after{color:var(--persimmon)}
.breakdown-body{background:transparent}
.breakdown .sum{color:var(--persimmon-deep);border-top-color:var(--line-strong)}
.small-note,.filter-context,.metric-sub{color:var(--muted)}

/* Excluded products: a rotated persimmon stamp, like the shikaku
   hanko but in this site's own colours and voice. */
.pending-row{background:var(--white);border:1.5px solid var(--line-strong);border-radius:8px}
.status-tag{
  background:#fdf0e6;border:2px solid var(--persimmon);color:var(--persimmon-deep);
  border-radius:3px;transform:rotate(-1.2deg);font-weight:700;
}
.empty{background:var(--white);border:2px dashed var(--line-strong);border-radius:10px}
.comparison-notes{border-top-color:var(--line-strong)}
.comparison-notes h2{font-weight:900}
.comparison-notes details{border-bottom-color:var(--line)}

/* Footer: binding rule echoed from the header. */
.footer{border-top:4px double var(--ink)}
.footer strong{font-weight:900}
.footer nav a:hover{color:var(--persimmon);text-decoration:underline;text-underline-offset:4px}
.toast{background:var(--ink);color:#fff7e8;border-radius:6px}

/* Document pages share the same powder-and-ink world. */
.document .eyebrow{color:#a06a1b;font-weight:800}
.document h1{font-weight:900}
.document h2{font-weight:900}
.document p,.document li{color:#5d4c38}
.document .notice{
  background:var(--turmeric-pale);border-left:5px solid var(--turmeric);
  border-radius:0 8px 8px 0;color:#6d4d0c;
}
.back-link{color:var(--steel);font-weight:700}
.detail-hero .pack{
  width:85px;height:105px;border:2px solid var(--ink);
  border-radius:8px 8px 5px 5px;box-shadow:3px 3px 0 rgba(44,32,22,.16);
  font-family:inherit;font-weight:800;font-size:36px;
}
.detail-hero .pack:before{display:block}
.detail-hero .pack:after{font-size:9px;bottom:10px}
.specs{
  background:var(--white);border:2px solid var(--ink);border-radius:8px;
  box-shadow:4px 4px 0 #e7dbc0;
}
.specs div{border-bottom-color:var(--line)}
.document .product .pricing{border-left:0}

@media(max-width:760px){
  .hero{padding:24px 20px;border-radius:12px}
  .product-top{gap:12px}
  .product{box-shadow:4px 4px 0 #e7dbc0}
  .product.first{box-shadow:4px 4px 0 #ecc96f}
  .filters{box-shadow:4px 4px 0 #e7dbc0}
  .pricing{border-left:0;border-top:2px dashed #b39b72}
  .logo{width:36px;height:36px;font-size:20px}
  .detail-hero .pack{width:65px;height:86px;font-size:27px}
}

/* ===== Compact type adjustments (Emma, 2026-11-02, approved by Hayato) =====
   Desktop only: supporting text steps down about 2px so the cards feel tighter.
   Prices and product names keep their presence. Form controls keep 16px
   to avoid iOS focus zoom. Mobile sizes are unchanged. */
@media (min-width:761px){
  body{font-size:16px}
  .demo-band{font-size:13px}
  .demo-label{font-size:11px}
  .site-header nav{font-size:14px}
  .hero p.description{font-size:15px}
  .filter-heading strong{font-size:16px}
  .text-button{font-size:13px}
  .field>span,.field>label{font-size:14px}
  .quantity button{font-size:14px}
  .check{font-size:14px}
  .check input{width:18px;height:18px}
  .filter-context{font-size:13px}
  .result-toolbar h2{font-size:16px}
  .result-toolbar h2 small{font-size:13px}
  .sort-help{font-size:14px}
  .purchase-scope{font-size:14px}
  .identity h3{font-size:18px}
  .brand{font-size:12px}
  .meta{font-size:14px}
  .meta .tag{font-size:12px}
  .rank{font-size:12px}
  .metric-label{font-size:13px}
  .secondary-metric .metric-label{font-size:13px}
  .secondary-metric .total-number{font-size:20px}
  .price-number span,.total-number span{font-size:14px}
  .coupon-line{font-size:14px}
  .coupon-line code{font-size:13px}
  .detail-link,.sample-cta,.demo-detail{font-size:14px}
  .breakdown summary{font-size:14px}
  .breakdown-body dl,.breakdown-body dl div,.breakdown-body dt,.breakdown-body dd{font-size:14px}
  .small-note{font-size:13px}
  .comparison-notes h2{font-size:18px}
  .comparison-notes summary{font-size:15px}
  .notes-body{font-size:14px}
  .pending-row strong,.pending-row small,.status-tag{font-size:13px}
  .footer p,.footer .footer-note{font-size:13px}
  .footer nav,.footer small{font-size:13px}
  .document .notice{font-size:15px}
  .specs div{font-size:14px}
  .back-link{font-size:14px}
  .empty h3{font-size:18px}
  .empty p{font-size:14px}
}

/* ===== Compact type adjustments, mobile (Emma, 2026-11-02, approved by Hayato) =====
   Phone view: supporting text steps down about 2px and the price figures
   ease off a little, so more of each card fits on screen. Selects keep 16px
   to avoid focus zoom; tap targets keep their height. */
@media (max-width:760px){
  body{font-size:15px}
  .demo-band{font-size:12px}
  .demo-label{font-size:10px}
  .site-header nav{font-size:13px}
  .hero h1{font-size:22px}
  .hero p.description{font-size:14px}
  .type-switch button{font-size:14px}
  .field>span,.field>label{font-size:14px}
  .quantity button{font-size:14px}
  .check{font-size:14px}
  .filter-context{font-size:13px}
  .result-toolbar h2{font-size:16px}
  .sort-help{font-size:13px}
  .purchase-scope{font-size:14px}
  .identity h3{font-size:17px}
  .brand{font-size:11px}
  .meta{font-size:13px}
  .meta .tag{font-size:11px}
  .rank{font-size:11px}
  .metric-label{font-size:12px}
  .secondary-metric .metric-label{font-size:12px}
  .price-number{font-size:30px}
  .secondary-metric .total-number{font-size:19px}
  .price-number span,.total-number span{font-size:13px}
  .coupon-line{font-size:13px}
  .coupon-line code{font-size:12px}
  .detail-link,.sample-cta{font-size:13px}
  .breakdown summary{font-size:14px}
  .breakdown-body dl,.breakdown-body dl div,.breakdown-body dt,.breakdown-body dd{font-size:13px}
  .small-note{font-size:12px}
  .comparison-notes h2{font-size:17px}
  .comparison-notes summary{font-size:15px}
  .notes-body{font-size:14px}
  .pending-row strong,.pending-row small,.status-tag{font-size:12px}
  .footer p,.footer .footer-note{font-size:12px}
  .footer nav,.footer small{font-size:12px}
  .document .notice,.specs div{font-size:14px}
}

@media (max-width:760px){.identity h3{text-wrap:balance}}

/* ===== View switch + compact list (Emma, 2026-11-02, approved by Hayato) =====
   A dense one-line-per-product view so the scroll stays short as the
   catalogue grows. Rows link to the same product detail pages as cards. */
.toolbar-controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.view-switch{display:flex;background:#efebf3;border-radius:6px;padding:3px;gap:3px}
.view-switch button{background:transparent;border-radius:4px;padding:7px 12px;font-size:13px;min-height:36px;color:#62556e}
.view-switch button.active{background:#fff;box-shadow:0 1px 4px #30263c1f;font-weight:700;color:var(--ink)}
.compact-list{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.compact-row{display:flex;align-items:center;gap:14px;padding:13px 16px;border-top:1px solid #eee8f2}
.compact-row:first-child{border-top:0}
.compact-row:hover{background:#faf7fc}
.c-rank{flex-shrink:0;font-size:11px;font-weight:700;background:#f0ebf4;color:#715382;border-radius:4px;padding:3px 7px;min-width:34px;text-align:center}
.compact-row.first .c-rank{background:#62447f;color:#fff}
.c-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.c-brand{font-size:10px;letter-spacing:.08em;color:var(--muted);font-weight:700}
.c-name{font-size:15px;font-weight:650;line-height:1.45}
.c-meta{font-size:11px;color:var(--muted)}
.c-price{flex-shrink:0;text-align:right;display:flex;flex-direction:column;gap:1px}
.c-primary{font-size:21px;font-weight:750;color:#62447f;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.c-yen{font-size:12px;font-weight:500;margin-left:2px}
.c-secondary{font-size:11px;color:var(--muted)}
@media(max-width:760px){
  .toolbar-controls{margin-top:10px}
  .view-switch button{font-size:12px;padding:6px 10px;min-height:34px}
  .compact-row{gap:10px;padding:11px 12px}
  .c-rank{min-width:30px;font-size:10px;padding:2px 5px}
  .c-name{font-size:14px}
  .c-primary{font-size:19px}
}

/* Compact list, phone tuning: the unit label moves above the price and the
   inline label drops out, so product names get the width they need. */
.c-unit{display:none}
@media(max-width:760px){
  .c-unit{display:block;font-size:9px;color:var(--muted);letter-spacing:.02em}
  .c-label-inline{display:none}
  .c-name{text-wrap:balance}
}