.sample-notice-copy{min-width:0}
.sample-notice-links{display:inline-flex;align-items:center;justify-content:center;gap:4px;flex-wrap:nowrap}
.sample-exit-link{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:0 10px;border-radius:8px;box-sizing:border-box;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:background-color 140ms ease,box-shadow 140ms ease,transform 100ms ease;text-underline-offset:4px}
.sample-exit-link:active{transform:translateY(1px) scale(.97);background:#efefef;color:#181818}
.sample-exit-link[data-pending='true']{background:#efefef;color:#181818;text-decoration:none;pointer-events:none}
.sample-exit-label{white-space:nowrap}
.sample-exit-link[data-pending='true'] .sample-exit-label{visibility:hidden}
.sample-exit-pending{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:6px;font:inherit;font-size:12px;white-space:nowrap}
.sample-exit-link:focus-visible{outline:3px solid #00a6f4;outline-offset:2px}
.sample-exit-link i{flex:none;width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;box-sizing:border-box;animation:sample-exit-spin .7s linear infinite}
@keyframes sample-exit-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.sample-exit-link{transition:none}.sample-exit-link:active{transform:none}.sample-exit-link i{animation:none;border-right-color:currentColor}}

.sample-photo{position:absolute;inset:0;display:block;isolation:isolate}
.sample-photo-status{position:absolute;z-index:4;left:50%;bottom:12%;transform:translateX(-50%);font-size:11px;line-height:1.5;padding:7px 10px;max-width:95%;width:max-content;color:#34312d;background:#ffffffed;border-radius:4px;pointer-events:none}
.sample-photo-status [role=button]{display:block;min-height:32px;padding:6px;cursor:pointer;text-decoration:underline;pointer-events:auto}
.sample-shell,.sample-page{background:#fff;color:#181818}
.sample-shell{min-height:100vh;font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",Meiryo,sans-serif}
.sample-page{max-width:1100px;margin:auto;padding:48px 32px 80px;font-size:14px;line-height:1.75}
.sample-page p{margin:12px 0 20px}
.sample-page-title{margin-bottom:26px}
.sample-page-title small{font-size:11px;letter-spacing:.17em;color:#77736c}
.sample-page h1{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(26px,3vw,34px);font-weight:500;line-height:1.4;margin:12px 0 0}
.sample-page h1:focus{outline:none}
.sample-page h2{font-size:18px;margin:18px 0}
.sample-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 20px;border:1px solid #d8d5ce;background:white;color:#181818;font:inherit;cursor:pointer;text-decoration:none}
.sample-button:hover{border-color:#181818;background:#fafafa}
.sample-primary{background:#333333;color:#fff;border-color:#333333}
.sample-primary:hover,.sample-primary:active,.sample-primary:focus-visible{background:#fff;color:#333333;border-color:#333333}
.sample-button:focus-visible,.sample-photo-status [role=button]:focus-visible{outline:2px solid #0878c9;outline-offset:3px}
.sample-actions,.sample-home-actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:32px}
.sample-home-actions{align-items:stretch}
.sample-lines{border-top:1px solid #dedad2;margin-top:28px}
.sample-line{display:grid;grid-template-columns:104px 1fr auto;align-items:center;gap:24px;padding:24px 0;border-bottom:1px solid #dedad2}
.sample-line img{display:block;width:104px;height:130px;object-fit:contain;background:#f6f4f0}
.sample-line p{margin:5px 0;font-size:13px}
.sample-line small,.sample-note{color:#77736c;font-size:12px}
.sample-line-end{text-align:right;display:grid;gap:8px;justify-items:end}
.sample-line-end strong{font-size:19px;font-variant-numeric:tabular-nums}
.sample-line-end [aria-pressed=true]{color:#005f5a;background:#f1fdfa;border-color:#95f7e4}
.sample-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:30px 0}
.sample-summary>div{border-bottom:1px solid #dedad2;padding-bottom:15px}
.sample-summary dt{font-size:12px;color:#77736c}
.sample-summary dd{margin:8px 0 0;font-size:21px;font-variant-numeric:tabular-nums}
.sample-info{margin:24px 0}
.sample-info>div{display:grid;grid-template-columns:150px 1fr;gap:16px;border-bottom:1px solid #dedad2;padding:18px 0}
.sample-info dt{color:#77736c}.sample-info dd{margin:0;overflow-wrap:anywhere}
.sample-history{border-top:1px solid #dedad2;border-bottom:1px solid #dedad2;padding:24px 0;margin:30px 0}
.sample-tag{font-size:12px;background:#efefef;padding:5px 9px}
.sample-success{padding:20px;background:#f1fdfa;color:#005f5a}
.sample-footer{font-size:11px;line-height:1.7;padding:24px 32px 100px;border-top:1px solid #dedad2;color:#77736c}
@media(max-width:767px){.sample-page{padding:30px 20px 64px}.sample-line{grid-template-columns:80px 1fr;gap:16px}.sample-line img{width:80px;height:100px}.sample-line-end{grid-column:2;text-align:left;justify-items:start}.sample-summary{gap:12px;grid-template-columns:1fr}.sample-summary>div{display:flex;justify-content:space-between;align-items:baseline}.sample-summary dd{font-size:19px}.sample-actions,.sample-home-actions{flex-direction:column;align-items:stretch}.sample-actions a{text-align:center;padding:12px}.sample-info>div{grid-template-columns:90px 1fr;gap:12px}}
@media(prefers-reduced-motion:reduce){.sample-photo .catalog_preview_cardImageFrame{animation:none!important}}

.sample-filters{display:flex;gap:20px;margin:24px 0}.sample-filters label{display:grid;gap:8px;flex:1;font-size:12px}.sample-filters select{min-height:44px;border:1px solid #dedad2;background:white;color:#181818;font:inherit;font-size:14px;padding:10px;width:100%}
.catalog_preview_detailImageZoomTarget { cursor: default; }
.sample-order-guide{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;min-height:44px;box-sizing:border-box;margin:0;padding:6px 12px;background:#eef8ff;color:#1c6089;border-bottom:1px solid #d6e8f2;font-size:12px;line-height:16px;font-weight:400}
.sample-order-guide strong{font-weight:600}
[data-sample-order-guide="true"]{--customer-preview-mobile-navigation-height:calc(109px + env(safe-area-inset-bottom))}

/* Repeat the comparison hint until the visitor actually swipes. */
@media(max-width:759px){
  .catalog_preview_comparisonSwipeFingerHand,
  .catalog_preview_comparisonSwipeFingerTrail{animation-iteration-count:infinite}
}
@media(max-width:759px) and (prefers-reduced-motion:reduce){
  .catalog_preview_comparisonSwipeFingerHand{animation:none;opacity:1;transform:translateX(-75px)}
  .catalog_preview_comparisonSwipeFingerTrail{animation:none}
}

/* The six favourites are fixed; only comparison selection is editable. */
[data-sample-comparison="true"] [data-testid="bulk-unlike-button"] { display: none; }
[data-sample-comparison="true"] [aria-disabled="true"][data-testid^="toggle-considered"] { cursor: default; }
.sample-comparison-notice { margin: 12px 0; padding: 10px 12px; background: #eff9ff; color: #0069a9; font-size: .875rem; line-height: 1.6; }

/* Point to the existing comparison action until its first activation. */
[data-sample-comparison="true"] button[data-sample-comparison-guide="true"] {
  position: relative;
  overflow: visible;
  color: #ffffff !important;
  background-color: #333333 !important;
  border-color: #333333;
  box-shadow: none;
  animation: none;
}
[data-sample-comparison="true"] button[data-sample-comparison-guide="true"]::before {
  position: absolute;
  z-index: 3;
  top: -36px;
  right: 2px;
  box-sizing: border-box;
  padding: 6px 10px;
  border: 1px solid #e1e3e3;
  border-radius: 999px;
  color: #5f5f5c;
  background: #ffffff;
  box-shadow: 0 3px 10px rgb(24 24 24 / 7%);
  content: "次はこちら";
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: .02em;
  white-space: nowrap;
  pointer-events: none;
  animation: sample-comparison-guide 2.2s cubic-bezier(.45,0,.25,1) 2;
}
[data-sample-comparison="true"] button[data-sample-comparison-guide="true"]::after {
  position: absolute;
  z-index: 2;
  top: -13px;
  right: 24px;
  width: 7px;
  height: 7px;
  border-right: 1px solid #e1e3e3;
  border-bottom: 1px solid #e1e3e3;
  background: #ffffff;
  content: "";
  transform: rotate(45deg);
  pointer-events: none;
  animation: sample-comparison-guide-tip 2.2s cubic-bezier(.45,0,.25,1) 2;
}
@keyframes sample-comparison-guide {
  0%, 70%, 100% { transform: translateY(0); }
  35% { transform: translateY(4px); }
}
@keyframes sample-comparison-guide-tip {
  0%, 70%, 100% { transform: translateY(0) rotate(45deg); }
  35% { transform: translateY(4px) rotate(45deg); }
}
@media (prefers-reduced-motion: reduce) {
  [data-sample-comparison="true"] button[data-sample-comparison-guide="true"]::before,
  [data-sample-comparison="true"] button[data-sample-comparison-guide="true"]::after {
    animation: none;
  }
}

/* Catalogue review stays in its own experience; the order menu owns its fixture. */
[data-sample-catalog="true"] [data-testid="bulk-unlike-button"],
[data-sample-catalog="true"] [data-testid="order-draft-fields"],
[data-sample-catalog="true"] [data-testid="order-summary-group-parties"],
[data-sample-standalone-order="true"] .catalog_preview_orderHeader > button,
[data-sample-standalone-order="true"] [data-testid="clear-order"] { display:none; }

.sample-catalog-finale {
  box-sizing:border-box; width:min(560px,calc(100vw - 40px)); max-height:calc(100dvh - 40px);
  margin:auto; padding:44px 48px 30px; border:1px solid #e1e3e3; border-radius:20px;
  overflow:auto; overscroll-behavior:contain; background:#fff; color:#181818; text-align:center;
  font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",Meiryo,sans-serif;
  box-shadow:0 28px 100px #0004;
}
.sample-catalog-finale[open] { animation:sample-finale-arrive .52s cubic-bezier(.2,.85,.25,1) both; }
.sample-catalog-finale::backdrop { background:rgb(16 16 16 / .62); backdrop-filter:blur(3px); animation:sample-finale-dim .35s ease-out both; }
.sample-finale-close { position:absolute; right:10px; top:10px; width:44px; height:44px; border:0; background:transparent; color:#5f5f5c; font:28px/1 sans-serif; cursor:pointer; }
.sample-finale-mark { width:84px; height:84px; margin:0 auto 12px; color:#181818; }
.sample-finale-mark svg { width:100%; height:100%; }
.sample-finale-f { stroke:#3a86f6; }
.sample-finale-spark { fill:#eafe57; stroke:#181818; stroke-width:1.2; transform-origin:65px 18px; animation:sample-finale-spark .65s .2s both; }
.sample-finale-brand { margin:0 0 24px; font-size:17px; font-weight:700; letter-spacing:.26em; padding-left:.26em; }
.sample-catalog-finale h2 { margin:0 0 24px; font-family:"Yu Mincho","YuMincho","Hiragino Mincho ProN",serif; font-size:clamp(26px,4.5vw,36px); line-height:1.65; font-weight:500; letter-spacing:.035em; outline:none; }
.sample-finale-copy { margin:0; color:#5f5f5c; font-size:14px; line-height:2; }
.sample-finale-actions { display:grid; gap:12px; margin:30px 0 18px; }
.sample-finale-actions .sample-button { width:100%; min-height:52px; box-sizing:border-box; gap:18px; font-size:15px; }
.sample-finale-actions .sample-primary:focus-visible { background:#fff; color:#333333; outline:3px solid #00a6f4; outline-offset:3px; }
.sample-finale-close:focus-visible { outline:3px solid #00a6f4; outline-offset:0; }
.sample-finale-note { margin:0; font-size:11px; line-height:1.7; color:#77736c; }
@keyframes sample-finale-arrive { 0%{opacity:0;transform:translateY(22px) scale(.94)} 72%{opacity:1;transform:translateY(-3px) scale(1.008)} 100%{opacity:1;transform:translateY(0) scale(1)} }
@keyframes sample-finale-dim { from{background:rgb(16 16 16 / 0);backdrop-filter:blur(0)} to{background:rgb(16 16 16 / .62);backdrop-filter:blur(3px)} }
@keyframes sample-finale-spark { from{opacity:0;transform:scale(.4) rotate(-18deg)} to{opacity:1;transform:scale(1) rotate(0)} }
@media(max-width:480px){
 .sample-catalog-finale{width:calc(100vw - 32px);padding:36px 22px 24px;border-radius:16px;max-height:calc(100dvh - 32px)}
 .sample-finale-mark{width:70px;height:70px}
 .sample-finale-brand{margin-bottom:18px}
 .sample-catalog-finale h2{margin-bottom:18px}
 .sample-finale-copy{font-size:13px}
 .sample-finale-actions{margin-top:24px}
}
@media(prefers-reduced-motion:reduce){
 .sample-catalog-finale[open],.sample-catalog-finale::backdrop,.sample-finale-spark{animation:none}
}

[data-sample-standalone-order="true"] [data-testid^="toggle-considered"] { display:none; }

/* Three exit actions wrap only in the invitation-specific sample. */
.sample-notice[data-invitation-return="true"] .sample-notice-links{flex-wrap:wrap}

/* Charcoal from the approved reference. Scope the ink token to filled controls;
   page text, product photography, disabled states and navigation keep their tone. */
.catalog_preview_mobileFiltersActions button:last-child,
.catalog_preview_comparisonToolbar button,
.catalog_preview_comparisonProduct > button,
.catalog_preview_globalImageHelpPanel button,
.catalog_preview_globalImagePickerGrid button[data-selected=true],
.catalog_preview_globalImageNumberScroller button[data-selected=true],
.catalog_preview_cardCompareButton[data-selected=true],
.catalog_preview_primaryButton,
.catalog_preview_orderEmpty button,
.catalog_preview_confirmSubmitButton,
.catalog_preview_mobileCartBar,
.catalog_preview_mobileDetailBar button,
.catalog_preview_mobileOrderDock,
.catalog_preview_orderBarSheetGo,
.customer_home_preview_brandDiscoveryLink,
.customer_home_preview_primaryAction,
.order_store_destination_manager_primaryButton {
  --ink: #333333;
}

/* Keep primary-action feedback legible with the new charcoal. */
:is(.catalog_preview_primaryButton,
    .catalog_preview_confirmDialogActions .catalog_preview_confirmSubmitButton,
    .catalog_preview_mobileDetailBar button,
    .catalog_preview_orderEmpty button,
    .catalog_preview_orderBarSheetGo,
    .customer_home_preview_primaryAction,
    .order_store_destination_manager_primaryButton):not(:disabled):is(:hover,:active,:focus-visible) {
  background: #fff;
  color: #333333;
  border-color: #333333;
}
:is(.catalog_preview_primaryButton,
    .catalog_preview_confirmSubmitButton,
    .catalog_preview_mobileDetailBar button,
    .catalog_preview_orderEmpty button,
    .catalog_preview_orderBarSheetGo,
    .customer_home_preview_primaryAction,
    .order_store_destination_manager_primaryButton):not(:disabled):focus-visible {
  outline: 3px solid #00a6f4;
  outline-offset: 3px;
}

/* Accepted B: shared 13px count typography; order drafts use blue ink on white. */
#root .customer_preview_navigation_navigationItem strong[data-count-kind],
#root .customer_preview_navigation_activeNavigationItem strong[data-count-kind] {
  font-family: "Hiragino Sans", "Yu Gothic", sans-serif;
  font-size: 13px;
  font-weight: 600;
  line-height: 18px;
  letter-spacing: normal;
  height: 22px;
  min-width: 28px;
  padding: 1px 5px;
  white-space: nowrap;
  background: #fff;
}
#root strong[data-count-kind="order-draft"] {
  color: #3b86f7;
  border: 1px solid #3b86f7;
  background: #fff;
}
/* A: acknowledge a changed draft total once, without moving the menu. */
#root strong[data-count-kind="order-draft"].sample-order-count-pop {
  transform-origin: right center;
  animation: sample-order-count-pop 960ms ease-in-out both;
}
@keyframes sample-order-count-pop {
  0% { transform: scale(1); }
  45% { transform: scale(1.26); }
  65% { transform: scale(1.26); }
  87% { transform: scale(.98); }
  100% { transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  #root strong[data-count-kind="order-draft"].sample-order-count-pop { animation: none; }
}
#root .customer_preview_navigation_mobileNavigation strong[data-count-kind] {
  top: 2px;
  left: auto;
  right: 4px;
}
@media (max-width: 767px) {
  #root .customer_preview_navigation_navigationItem strong[data-count-kind],
  #root .customer_preview_navigation_activeNavigationItem strong[data-count-kind] {
    top: 2px;
    left: auto;
    right: 4px;
  }
}

/* Accepted empty-order A: grouped status, measured copy and a separate action. */
#root [data-sample-catalog="true"] .catalog_preview_orderEmpty {
  gap: 0;
  margin-top: 0;
  padding: 52px 0 60px;
  background: #fff;
}
#root [data-sample-catalog="true"] .catalog_preview_orderEmpty > svg {
  margin: 0;
  width: 28px;
  height: 28px;
}
#root [data-sample-catalog="true"] .catalog_preview_orderEmpty > p {
  margin: 12px 0 0;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: .16em;
}
#root [data-sample-catalog="true"] .catalog_preview_orderEmpty h2 {
  margin: 24px 0 0;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: .01em;
}
#root [data-sample-catalog="true"] .catalog_preview_orderEmpty > span {
  max-width: 330px;
  margin: 16px 0 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 2;
  text-wrap: balance;
}
.sample-empty-description > span { display: inline-block; }
.sample-empty-description > span:first-child { display: block; }
#root [data-sample-catalog="true"] .catalog_preview_orderEmpty button {
  margin: 36px 0 0;
  min-width: 192px;
  min-height: 46px;
  padding: 12px 23px;
  gap: 26px;
  font-size: 13px;
  font-weight: 400;
}
#root [data-sample-catalog="true"] .catalog_preview_orderView:has(.catalog_preview_orderEmpty) .catalog_preview_orderHeader {
  margin-bottom: 0;
  padding-bottom: 28px;
}
@media (min-width: 768px) {
  #root [data-sample-catalog="true"] .catalog_preview_orderEmpty { padding-left: 40px; padding-right: 40px; }
}