/* Shared saved products: compact controls, with an independently scrolling comparison table. */
.saved-open, .saved-toggle, .saved-dialog button { font: inherit; letter-spacing: 0; cursor: pointer; }
.saved-open { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; gap: 5px; min-height: 40px; padding: 7px 10px; border: 1px solid #b8d5c5; border-radius: 6px; background: #fff; color: #14683e; font-size: 12px; font-weight: 700; white-space: nowrap; }
.saved-open b { min-width: 20px; font-size: 12px; text-align: center; }
.saved-open svg, .saved-toggle svg { width: 18px; height: 18px; flex: 0 0 18px; }
.saved-open:hover, .saved-toggle:hover { background: #eaf7ee; }
.saved-open[hidden], .saved-toggle[hidden], .saved-dialog [hidden] { display: none !important; }
.saved-toggle { display: inline-flex; justify-content: center; align-items: center; gap: 4px; width: 40px; height: 40px; padding: 6px; border: 1px solid #abc8b8; border-radius: 6px; background: #fff; color: #267248; }
.saved-toggle[aria-pressed="true"] { background: #e0f2e7; color: #10623b; border-color: #218551; }
.saved-toggle[aria-pressed="true"] svg { fill: #bfe6cd; }
.saved-toggle-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.saved-toggle--home, .saved-toggle--ranking { position: absolute; right: 8px; top: 8px; z-index: 2; box-shadow: 0 2px 6px #00000014; }
.saved-toggle--inline { width: auto; min-width: 90px; margin: 6px 0 0; font-size: 12px; }
.saved-toggle--inline .saved-toggle-label { position: static; width: auto; height: auto; clip-path: none; }
.result-actions:has(> .saved-toggle) { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 8px; align-items: center; }
.result-actions .saved-toggle { flex-shrink: 0; }
.search-page .result-actions:has(> .saved-toggle) > a { grid-column: auto; min-width: 0; }
body.home-page .home-sticky-inner:has(> .saved-open) { grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 12px; }
.saved-dialog { width: min(920px, calc(100% - 32px)); max-width: none; max-height: min(84vh, 820px); max-height: min(84dvh, 820px); margin: auto; padding: 0; border: 1px solid #c6d7ce; border-radius: 8px; background: #fff; color: #263a33; box-shadow: 0 20px 70px #162e2440; font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif; font-size: 14px; letter-spacing: 0; }
.saved-dialog[open] { display: flex; flex-direction: column; }
.saved-dialog::backdrop { background: #14271f88; }
.saved-dialog-open { overflow: hidden; }
.saved-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px 12px; background: #f5faf7; border-bottom: 1px solid #dce6e0; flex: 0 0 auto; }
.saved-heading h2 { margin: 0; font-size: 18px; line-height: 1.5; }
.saved-heading p { margin: 2px 0 0; font-size: 11px; color: #65756d; }
.saved-icon-button { display: inline-grid; place-items: center; width: 40px; height: 40px; flex: 0 0 40px; padding: 0; border: 1px solid #d9e1dd; border-radius: 6px; background: #fff; color: #55665e; font-size: 24px !important; }
.saved-body { flex: 1 1 auto; min-height: 0; padding: 0 20px; overflow-y: auto; overscroll-behavior: contain; }
.saved-list { display: grid; }
.saved-row { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; align-items: start; gap: 12px; padding: 16px 0; border-bottom: 1px solid #e0e8e3; }
.saved-row-picture img { width: 72px; height: 88px; object-fit: contain; }
.saved-row-copy { min-width: 0; }
.saved-row h3 { margin: 3px 0 5px; font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.saved-row-copy > small { color: #68776e; font-size: 11px; }
.saved-row a, .saved-table a { color: #263d33; text-decoration: none; }
.saved-row a:hover, .saved-table a:hover { text-decoration: underline; }
.saved-row p { margin: 3px 0; }
.saved-quantity, .saved-unit { font-size: 12px; line-height: 1.6; }
.saved-price { color: #087941; }
.saved-price strong { font-size: 18px; }
.saved-price small { color: #5a6c61; font-size: 11px; }
.saved-row-controls { display: flex; align-items: center; gap: 8px; }
.saved-row-controls label { display: flex; align-items: center; gap: 5px; min-height: 40px; font-size: 12px; cursor: pointer; }
.saved-row-controls input { width: 18px; height: 18px; accent-color: #188751; }
.saved-row-controls label:has(input:disabled) { opacity: .55; cursor: default; }
.saved-rating { color: #3c443d; font-size: 13px; white-space: nowrap; }
.saved-rating > span { color: #bc7900; }
.saved-rating small { font-size: 11px; }
.saved-review-note { display: block; color: #6a756f; font-size: 10px; line-height: 1.5; }
.saved-footer { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 12px 20px; border-top: 1px solid #dce6e0; background: #fff; flex: 0 0 auto; }
.saved-compare-button, .saved-back, .saved-detail-button, [data-saved-retry] { display: inline-flex; justify-content: center; align-items: center; gap: 8px; min-height: 42px; padding: 8px 14px; border: 1px solid #17844c; border-radius: 6px; background: #188751; color: #fff; font-weight: 700; font-size: 13px; }
.saved-compare-button:disabled { background: #eef2ef; border-color: #d6ded8; color: #7e8982; cursor: default; }
.saved-back, [data-saved-retry] { color: #1a7044; background: #fff; }
.saved-empty { margin: 0; padding: 32px 12px; text-align: center; line-height: 1.8; }
.saved-empty > div { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; margin-top: 18px; }
.saved-empty a { color: #147546; }
.saved-status:empty { display: none; }
.saved-status { flex: 0 0 auto; margin: 0; padding: 8px 20px; background: #fff4d9; color: #6a4f12; font-size: 12px; }
.saved-comparison-note { margin: 14px 0; color: #58675e; font-size: 12px; line-height: 1.7; }
.saved-table-scroll { overflow-x: auto; overscroll-behavior-inline: contain; max-width: 100%; }
.saved-table { width: 100%; border-collapse: collapse; table-layout: fixed; margin: 0; background: #fff; }
.saved-table th, .saved-table td { padding: 12px; border: 1px solid #dbe5de; text-align: left; vertical-align: top; overflow-wrap: anywhere; line-height: 1.6; font-size: 13px; }
.saved-table th:first-child { width: 118px; background: #f4f8f5; color: #58685e; }
.saved-table thead th { background: #fff; color: #273b31; }
.saved-table th img { display: block; width: 80px; height: 80px; object-fit: contain; margin: 0 auto 10px; }
.saved-table td small { display: block; margin-top: 4px; color: #68766d; font-size: 11px; }
.saved-table .saved-detail-button { color: #fff; width: 100%; padding: 7px; font-size: 12px; text-align: center; }
.saved-credit { margin: 14px 0; font-size: 10px; color: #6b766f; }
.saved-credit a { color: #53665a; }
.saved-no-image, .saved-image-missing { color: #6b776f; font-size: 11px; }
.saved-toast { position: fixed; z-index: 2147483646; left: 50%; bottom: max(22px, env(safe-area-inset-bottom)); transform: translateX(-50%); max-width: calc(100% - 32px); margin: 0; padding: 11px 16px; border-radius: 6px; color: #fff; background: #263f32; font-size: 13px; opacity: 0; pointer-events: none; }
.saved-toast.is-visible { opacity: 1; }
.saved-dialog :focus-visible, .saved-open:focus-visible, .saved-toggle:focus-visible { outline: 3px solid #2989b7; outline-offset: 3px; }
@media (max-width: 600px) {
  body.home-page .home-sticky-inner:has(> .saved-open) { grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; }
  body.home-page .home-sticky-inner:has(> .saved-open) .home-sticky-links { display: none; }
  .site-brand-bar-inner > .saved-open { order: 2; }
  .saved-open { padding: 6px; gap: 3px; }
  .saved-open > span { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; }
  .saved-dialog { width: calc(100% - 16px); max-height: 92vh; max-height: 92dvh; }
  .saved-heading { padding: 12px; }
  .saved-heading h2 { font-size: 16px; }
  .saved-body { padding: 0 12px; }
  .saved-row { grid-template-columns: 56px minmax(0, 1fr); gap: 8px 10px; padding: 12px 0; }
  .saved-row-picture img { width: 56px; height: 70px; }
  .saved-row-controls { grid-column: 2; justify-content: flex-end; }
  .saved-row h3 { font-size: 13px; }
  .saved-footer { padding: 10px 12px; }
  .saved-compare-button { width: 100%; }
  .saved-table { width: max(100%, 630px); }
  .saved-table th:first-child { width: 92px; position: sticky; left: 0; z-index: 1; }
  .saved-table th, .saved-table td { font-size: 12px; padding: 10px; }
  .saved-table .saved-detail-button { min-height: 44px; }
}
.saved-dialog, .saved-dialog * { box-sizing: border-box; }
.saved-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
