/* =========================================================
   カシャリ UI v2
   - 配色は現行を維持
   - 視認性 / 可読性 / モバイル操作性を最優先
   - 既存のクラス名はすべて維持
   ========================================================= */

/* ----- 1. デザイントークン（ウェブオク ラグジュアリー / ゴールド×オニキス） ----- */
:root{
  /* ゴールド系 */
  --gold-1:#FBEFB6;  /* シャンパン */
  --gold-2:#E7C65A;  /* 明るい金 */
  --gold-3:#C9A227;  /* リッチゴールド */
  --gold-4:#A8801C;  /* 深い金・ブロンズ */
  --gold-line:rgba(201,162,39,.30);
  --gold-grad:linear-gradient(135deg,#FBEFB6,#E7C65A 38%,#C9A227 70%,#E7C65A 88%,#A8801C);
  --onyx:#15131A;    /* 漆黒（やや暖） */
  --ink:#221F2A;     /* 本文 */
  --crimson:#D6322B; /* 価格・LIVEアクセント */
  --wash:#FFFBF0;    /* 淡い金の地 */
  --wash-2:#FEF6E2;

  /* 既存クラス互換のためのエイリアス（名称は維持しつつ配色を金×墨へ） */
  --primary:#C9A227;
  --primary-2:#A8801C;
  --primary-3:#9A7B1A;            /* リンク等 */
  --primary-3-soft:rgba(201,162,39,.12);
  --primary-soft:rgba(201,162,39,.10);
  --primary-2-soft:rgba(231,198,90,.20);
  --success:#1f8f5f;
  --success-soft:rgba(31,143,95,.12);
  --danger:#D6322B;
  --danger-soft:rgba(214,50,43,.10);
  --warning:#C9821B;
  --warning-soft:rgba(201,130,27,.14);

  /* 中性色 */
  --bg:#FFFBF0;
  --bg-subtle:#FDF4DE;
  --surface:#ffffff;
  --surface-2:#FFFCF4;
  --text:#221F2A;
  --text-2:#4A4452;
  --muted:#7C7568;
  --line:#ECE4CF;
  --line-strong:#DCCFA8;
  --border:#ECE4CF;              /* 旧コンポーネントが参照する境界線 */

  /* タイポグラフィ */
  --font-sans:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Noto Sans JP",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --font-disp:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Noto Sans JP",sans-serif;
  --font-num:"Oswald","Helvetica Neue",-apple-system,BlinkMacSystemFont,system-ui,sans-serif;

  /* 形 */
  --radius:14px;
  --radius-sm:10px;
  --radius-lg:20px;
  --radius-pill:999px;

  /* 影（金の柔らかい陰影） */
  --shadow:0 1px 2px rgba(20,18,24,.04), 0 10px 28px rgba(201,162,39,.10);
  --shadow-sm:0 1px 2px rgba(20,18,24,.06);
  --shadow-lg:0 6px 18px rgba(20,18,24,.08), 0 24px 60px rgba(201,162,39,.18);

  /* レイアウト */
  --container:1180px;
  --topbar-h:56px;
  --mobile-nav-h:64px;
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--topbar-h) + 12px)}
body{
  font-family:var(--font-sans);
  color:var(--text);
  background:var(--bg);
  line-height:1.65;
  font-size:15px;
  letter-spacing:.01em;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:var(--primary-3);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}

/* タイポ */
h1,h2,h3,h4{margin:0;line-height:1.35;color:var(--text);font-weight:700;letter-spacing:.005em}
h1{font-size:1.6rem}
h2{font-size:1.3rem}
h3{font-size:1.08rem}
h4{font-size:.98rem}
p{margin:0;line-height:1.75}
.small{font-size:.86rem;color:var(--muted);line-height:1.7}
.muted{color:var(--muted)}

/* ----- 2. トップバー ----- */
.topbar{
  position:sticky;top:0;z-index:30;
  background:var(--surface);
  border-bottom:1px solid var(--line);
}
.topbar-inner{
  max-width:var(--container);margin:0 auto;
  padding:7px 18px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  min-height:var(--topbar-h);
}
.brand{display:flex;align-items:center;gap:10px;color:var(--text);flex:none;white-space:nowrap}
.brand:hover{text-decoration:none}
.brand-logo{
  width:38px;height:38px;border-radius:10px;object-fit:cover;
  box-shadow:var(--shadow-sm);flex:none;
}
.brand-title{font-size:.98rem;font-weight:800;letter-spacing:.02em;line-height:1.2;white-space:nowrap}
.brand-sub{font-size:.72rem;color:var(--muted);margin-top:2px;line-height:1.3;white-space:nowrap}

/* デスクトップナビ（1行固定・はみ出しは横スクロールで吸収して改行させない） */
.nav{display:flex;align-items:center;gap:4px;flex-wrap:nowrap;justify-content:flex-end;min-width:0;position:relative;overflow:visible}
.nav a{
  color:var(--text-2);font-weight:600;font-size:.85rem;
  padding:6px 9px;border-radius:var(--radius-pill);
  background:transparent;border:1px solid transparent;white-space:nowrap;flex:none;
  transition:background .15s, border-color .15s, color .15s;
}
.nav a:hover{background:var(--bg-subtle);text-decoration:none}
.nav a.is-active{
  background:var(--primary-3-soft);
  color:var(--primary-3);
  border-color:rgba(21,94,239,.18);
}
.user-chip{
  padding:5px 10px;border-radius:var(--radius-pill);
  background:var(--bg-subtle);color:var(--text-2);
  font-size:.78rem;font-weight:600;white-space:nowrap;flex:none;
  max-width:150px;overflow:hidden;text-overflow:ellipsis;
}
.nav-alert-link{position:relative;display:inline-flex;align-items:center}
.nav-alert-dot{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:20px;height:20px;margin-left:8px;padding:0 6px;
  border-radius:var(--radius-pill);background:var(--danger);color:#fff;
  font-size:.72rem;font-weight:700;line-height:1;
}

/* ===== アカウントメニュー / ハンバーガー ===== */
.nav-acc{position:relative;display:inline-flex;align-items:center;flex:none;margin-left:4px}
.nav-acc-btn{
  display:inline-flex;align-items:center;gap:7px;cursor:pointer;font-family:inherit;
  padding:4px 9px 4px 5px;border-radius:var(--radius-pill);
  background:var(--bg-subtle);border:1px solid var(--line);color:var(--text-2);
  font-size:.82rem;font-weight:700;white-space:nowrap;max-width:230px;
  transition:background .15s,border-color .15s;
}
.nav-acc-btn:hover{background:var(--primary-3-soft);border-color:rgba(201,162,39,.3)}
.nav-acc-av{
  width:26px;height:26px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--gold-grad,linear-gradient(135deg,#E7C65A,#C9A227));color:#3a2c08;font-weight:800;font-size:.85rem;
}
.nav-acc-name{overflow:hidden;text-overflow:ellipsis;max-width:120px}
.nav-acc-caret{font-size:.66rem;color:var(--muted);transition:transform .2s}
.nav-acc.open .nav-acc-caret{transform:rotate(180deg)}
.nav-burger{
  display:none;align-items:center;justify-content:center;flex-direction:column;gap:4px;
  width:42px;height:38px;border:1px solid var(--line);border-radius:10px;background:var(--surface);
  cursor:pointer;position:relative;flex:none;
}
.nav-burger span{display:block;width:18px;height:2px;background:var(--text-2);border-radius:2px;transition:.25s}
.nav-burger.open span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-burger.open span:nth-child(2){opacity:0}
.nav-burger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.nav-burger-dot{position:absolute;top:5px;right:6px;width:8px;height:8px;border-radius:50%;background:var(--danger);border:1.5px solid var(--surface)}
/* ドロップダウン */
.nav-menu{
  position:absolute;top:calc(100% + 10px);right:0;z-index:60;min-width:232px;max-width:calc(100vw - 28px);
  background:var(--surface);border:1px solid var(--line);border-radius:14px;
  box-shadow:var(--shadow-lg);padding:7px;display:none;
}
.nav-menu.open{display:block;animation:navMenuIn .16s ease}
@keyframes navMenuIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.nav-menu .nav-menu-link{
  display:flex;align-items:center;gap:10px;width:100%;
  padding:10px 12px;border-radius:10px;border:none;background:transparent;
  color:var(--text);font-size:.9rem;font-weight:600;white-space:nowrap;text-decoration:none;
}
.nav-menu .nav-menu-link:hover{background:var(--bg-subtle);text-decoration:none}
.nav-menu .nav-menu-link.is-active{background:var(--primary-3-soft);color:var(--primary-3)}
.nav-menu-ic{width:20px;text-align:center;font-size:1rem;flex:none}
.nav-menu-badge{margin-left:auto;min-width:18px;height:18px;padding:0 5px;border-radius:var(--radius-pill);background:var(--danger);color:#fff;font-size:.68rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.nav-menu .nav-menu-link.is-logout{color:var(--crimson,#D6322B)}
.nav-menu .nav-menu-link.is-logout:hover{background:rgba(214,50,43,.08)}
.nav-menu .nav-menu-link.is-cta{color:var(--primary-3);font-weight:700}
.nav-menu-sep{height:1px;background:var(--line);margin:6px 4px}
.nav-menu .only-mobile{display:none}
.nav-guest-cta{background:var(--gold-grad,linear-gradient(135deg,#E7C65A,#C9A227))!important;color:#3a2c08!important;font-weight:700}

/* ----- 3. メインコンテナ / ページヘッド ----- */
.container{
  max-width:var(--container);margin:0 auto;
  padding:12px 16px calc(40px + env(safe-area-inset-bottom));
}
.page-head{
  display:flex;justify-content:space-between;align-items:flex-start;
  gap:12px;flex-wrap:wrap;margin-bottom:16px;
}
.page-head h1,.page-head h2,.page-head h3{margin:0}
.page-head p{margin:6px 0 0;color:var(--muted);font-size:.92rem;line-height:1.7}
.section-title{
  display:flex;justify-content:space-between;align-items:flex-start;
  gap:12px;flex-wrap:wrap;margin-bottom:14px;
}
.section-title h2,.section-title h3{margin:0}
.section-title p{margin:4px 0 0;color:var(--muted);font-size:.88rem;line-height:1.7}

/* ----- 4. カード ----- */
.card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:18px;
  margin-bottom:14px;
}
.card.soft{background:var(--surface-2)}
.card-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;
}
.grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;
}
.feature-card,.role-card,.stat-card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:16px;
}
.role-card h3,.feature-card h3,.stat-card h3{margin:0 0 6px;font-size:1rem}
.feature-card p,.role-card p,.stat-card p{margin:0;color:var(--muted);line-height:1.7;font-size:.9rem}

/* ----- 5. ヒーロー (ランディングのみ) ----- */
.hero{
  position:relative;overflow:hidden;
  border-radius:var(--radius-lg);
  padding:28px 24px;margin-bottom:20px;
  background:linear-gradient(135deg, #0e2235 0%, #156073 50%, #1fc6c4 100%);
  color:#fff;
}
.hero::before{
  content:"";position:absolute;
  top:-60px;right:-60px;width:240px;height:240px;border-radius:50%;
  background:radial-gradient(circle, rgba(140,217,79,.35), transparent 65%);
  pointer-events:none;
}
.hero-grid{
  display:grid;grid-template-columns:1.3fr 1fr;gap:24px;
  align-items:center;position:relative;z-index:1;
}
.hero h1,.hero h2{
  margin:10px 0 12px;
  font-size:clamp(1.6rem, 4vw, 2.4rem);
  line-height:1.2;color:#fff;
}
.hero p{font-size:.98rem;line-height:1.8;color:rgba(255,255,255,.92);margin:0}
.hero-badges{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.hero-badges .badge{
  background:rgba(255,255,255,.16);color:#fff;
  border:1px solid rgba(255,255,255,.24);
}
.hero-card,.glass-card{
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--radius);
  padding:16px;
  backdrop-filter:blur(8px);
}
.hero-card{padding:18px;text-align:center}
.hero-card img{max-width:140px;margin:0 auto 12px}
.hero-card .small{color:rgba(255,255,255,.85)}
.glass-card .kpi{color:#fff !important}
.glass-card .small{color:rgba(255,255,255,.86)}

/* ヒーロー内のグリッド（KPI用）はモバイルでも横並びを維持 */
.hero .card-grid{grid-template-columns:repeat(3,1fr);gap:10px}
.hero .glass-card{padding:14px;text-align:center}

/* ----- 6. KPI ----- */
.kpi{
  font-size:1.9rem;font-weight:800;line-height:1.1;
  color:var(--primary-3);
  font-feature-settings:"tnum";
  margin:0 0 4px;
}
.kpi-label{color:var(--muted);font-size:.86rem}
.contact-kpi{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:10px;margin-bottom:14px;
}
.contact-card{
  padding:16px;border-radius:var(--radius);
  background:var(--surface);border:1px solid var(--line);
}
.contact-card .kpi{margin-bottom:2px}
.card-link{display:block;text-decoration:none;color:inherit}
.card-link:hover{text-decoration:none}
.card-link:hover .contact-card,
.card-link:hover .pickup-card{border-color:var(--primary);transform:translateY(-1px);transition:.15s}

/* ----- 7. ピックアップ / 注目カード ----- */
.pickup-strip{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:12px;margin-bottom:16px;
}
.pickup-card{
  position:relative;
  padding:16px;border-radius:var(--radius);
  background:var(--surface);border:1px solid var(--line);
  border-left:3px solid var(--primary-3);
}
.pickup-card.is-alert{border-left-color:var(--danger)}
.pickup-card.is-warm{border-left-color:var(--warning)}
.pickup-label{
  display:inline-block;padding:4px 10px;
  border-radius:var(--radius-pill);font-size:.76rem;font-weight:700;
  background:var(--primary-3-soft);color:var(--primary-3);
  letter-spacing:.04em;
}
.pickup-card.is-alert .pickup-label{background:var(--danger-soft);color:var(--danger)}
.pickup-card.is-warm .pickup-label{background:var(--warning-soft);color:var(--warning)}
.pickup-card h3{margin:10px 0 6px;font-size:1.1rem}
.pickup-card p{margin:0;color:var(--muted);font-size:.92rem;line-height:1.7}
.pickup-card .actions{margin-top:12px}

/* ----- 8. バッジ / ピル ----- */
.badge{
  display:inline-flex;align-items:center;gap:4px;
  padding:4px 10px;border-radius:var(--radius-pill);
  background:var(--bg-subtle);color:var(--text-2);
  font-size:.76rem;font-weight:700;
  border:1px solid transparent;
}
.notification-tag{
  display:inline-flex;align-items:center;
  padding:4px 10px;border-radius:var(--radius-pill);
  background:var(--primary-3-soft);color:var(--primary-3);
  font-size:.76rem;font-weight:700;letter-spacing:.02em;
}
.tab-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.tab-chip{
  display:inline-flex;align-items:center;justify-content:center;
  padding:8px 14px;border-radius:var(--radius-pill);
  background:var(--surface);color:var(--text-2);
  border:1px solid var(--line);font-size:.88rem;font-weight:600;
  text-decoration:none;
}
.tab-chip:hover{text-decoration:none;border-color:var(--line-strong)}
.tab-chip.is-active{
  background:var(--primary-3-soft);color:var(--primary-3);
  border-color:rgba(21,94,239,.20);
}
.chip-row{display:flex;flex-wrap:wrap;gap:8px}
.keyword-chip,.tag-chip,.status-pill{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 12px;border-radius:var(--radius-pill);
  border:1px solid var(--line);background:var(--surface);
  font-size:.84rem;font-weight:600;color:var(--text-2);
}
.keyword-chip form{display:inline}
.keyword-chip button{
  min-height:26px;padding:0 10px;font-size:.74rem;
  margin-left:4px;border-radius:var(--radius-pill);
}

/* ----- 9. ボタン ----- */
button,.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  min-height:44px;padding:0 18px;
  border:none;border-radius:var(--radius-pill);
  cursor:pointer;font-weight:700;font-size:.92rem;
  background:var(--primary);color:#fff;
  font-family:inherit;letter-spacing:.02em;
  transition:transform .12s, background-color .15s, box-shadow .15s, opacity .15s;
  box-shadow:0 1px 2px rgba(31,198,196,.30);
}
button:hover,.btn:hover{background:#1ab6b4;text-decoration:none}
button:active,.btn:active{transform:translateY(1px)}
button:disabled,.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.btn-secondary{
  background:var(--surface);color:var(--text-2);
  border:1px solid var(--line-strong);box-shadow:none;
}
.btn-secondary:hover{background:var(--bg-subtle);border-color:var(--text-2)}
.btn-danger{
  background:var(--danger);color:#fff;
  box-shadow:0 1px 2px rgba(198,58,84,.25);
}
.btn-danger:hover{background:#b73149}
.btn-success,button.btn-success{
  background:var(--success);color:#fff;
  box-shadow:0 1px 2px rgba(20,148,93,.25);
}
.btn-success:hover{background:#127a4d}
.btn-dark{
  background:#14304a;color:#fff;
  box-shadow:0 1px 2px rgba(20,48,74,.30);
}
.btn-dark:hover{background:#0e2538}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.inline-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.actions form{display:inline}

/* ----- 10. フォーム ----- */
.form-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:14px;
}
label{
  display:block;margin:0 0 6px;
  font-weight:700;font-size:.86rem;color:var(--text-2);
}
input,select,textarea{
  width:100%;padding:11px 12px;
  border:1px solid var(--line-strong);border-radius:var(--radius-sm);
  background:var(--surface);color:var(--text);
  font-family:inherit;font-size:15px;line-height:1.5;
  outline:none;
  transition:border-color .15s, box-shadow .15s, background-color .15s;
}
input[type=checkbox],input[type=radio]{
  width:18px;height:18px;padding:0;
  border:1px solid var(--line-strong);border-radius:4px;
  background:transparent;accent-color:var(--primary-3);
  vertical-align:middle;
}
input[type=radio]{border-radius:50%}
input:focus,select:focus,textarea:focus{
  border-color:var(--primary-3);
  box-shadow:0 0 0 3px var(--primary-3-soft);
}
input::placeholder,textarea::placeholder{color:#a1adc1}
input:read-only,input[readonly]{background:var(--bg-subtle);color:var(--text-2)}
textarea{resize:vertical;min-height:110px;line-height:1.7}
select{appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='%23697791' d='M5 8l5 5 5-5z'/></svg>");background-repeat:no-repeat;background-position:right 10px center;background-size:18px;padding-right:34px}

.inline-field{display:flex;gap:8px;align-items:stretch}
.inline-field input{flex:1}
.inline-field .btn,.inline-field button{min-height:44px}
.postal-result{margin-top:8px;font-size:.84rem;color:var(--muted)}

/* チェックボックス並びの行 (同意確認など) */
.consent-boxes{display:grid;gap:10px}
.consent-row{
  display:flex;align-items:flex-start;gap:10px;
  padding:12px 14px;border-radius:var(--radius-sm);
  background:var(--surface);border:1px solid var(--line);
  line-height:1.7;font-size:.92rem;color:var(--text-2);
}
.consent-row input{margin-top:2px;flex:none}

/* ----- 11. テーブル (デスクトップ) ----- */
.table-wrap{
  overflow:auto;border-radius:var(--radius);
  border:1px solid var(--line);background:var(--surface);
}
.table{width:100%;border-collapse:collapse;min-width:680px}
.table th,.table td{
  padding:12px 14px;
  border-bottom:1px solid var(--line);
  text-align:left;vertical-align:top;font-size:.9rem;
}
.table th{
  background:var(--surface-2);color:var(--text-2);
  font-size:.78rem;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;border-bottom:1px solid var(--line);
}
.table tr:last-child td{border-bottom:none}
.table tr:hover td{background:var(--surface-2)}
.table .actions{gap:6px}
.table .actions .btn,.table .actions button{
  min-height:34px;padding:0 12px;font-size:.84rem;
}

/* ----- 12. お知らせ / 通知 ----- */
.notice-stack{display:grid;gap:10px}
.notice-item{
  padding:14px 16px;border-radius:var(--radius);
  background:var(--surface);border:1px solid var(--line);
}
.notice-item.unread{
  background:var(--surface);border-color:rgba(21,94,239,.30);
  border-left:3px solid var(--primary-3);
}
.notice-item h4{margin:0 0 4px;font-size:.96rem}
.notice-item p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.7}
.notice-meta{
  display:flex;justify-content:space-between;gap:10px;
  align-items:center;flex-wrap:wrap;margin-top:10px;
  font-size:.8rem;color:var(--muted);
}
.notice-item-link{display:block;color:inherit;text-decoration:none}
.notice-item-link:hover{text-decoration:none}
.notice-item-actions{
  display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;align-items:center;
}

/* ----- 13. 情報行 (info row / rich summary) ----- */
.rich-summary{
  padding:14px 16px;border-radius:var(--radius);
  background:var(--surface-2);border:1px solid var(--line);
}
.info-list{display:grid;gap:0}
.info-row{
  display:flex;justify-content:space-between;gap:14px;
  padding:10px 0;border-bottom:1px solid var(--line);
}
.info-row:first-child{padding-top:0}
.info-row:last-child{border-bottom:none;padding-bottom:0}
.info-row strong{
  display:block;font-size:.84rem;color:var(--text-2);
  font-weight:700;margin-bottom:3px;
}
.info-row span,.info-row div{
  color:var(--text);line-height:1.7;font-size:.92rem;
}

/* ----- 14. 詳細グリッド / KV ----- */
.rich-detail-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;margin-top:14px;
}
.rich-detail-card{
  padding:16px;border-radius:var(--radius);
  background:var(--surface);border:1px solid var(--line);
}
.rich-detail-card h3{margin:0 0 8px;font-size:.96rem}
.rich-detail-card ul{
  margin:0;padding-left:18px;color:var(--text-2);
  line-height:1.85;font-size:.9rem;
}
.detail-kv{
  padding:12px 14px;border-radius:var(--radius-sm);
  background:var(--surface);border:1px solid var(--line);
}
.detail-kv strong{
  display:block;margin-bottom:6px;font-size:.82rem;
  color:var(--muted);font-weight:700;letter-spacing:.02em;
}
.detail-kv div{font-weight:600;color:var(--text);font-size:.94rem;line-height:1.6}
.detail-kv small{
  display:block;margin-top:6px;
  color:var(--muted);font-size:.82rem;line-height:1.65;
}
.contact-detail-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:12px;
}
.contact-detail-hero{
  display:grid;grid-template-columns:120px 1fr;gap:14px;
  align-items:start;
}
.contact-detail-hero img{
  width:120px;height:120px;object-fit:cover;border-radius:var(--radius);
  border:1px solid var(--line);
}
.contact-detail-summary{display:grid;gap:8px}
.contact-detail-card{margin-top:14px}
.contact-meta-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:10px;margin-top:12px;
}
.address-note{
  color:var(--muted);font-size:.84rem;line-height:1.7;margin-top:6px;
}

/* ----- 15. プロフィール ----- */
.profile-summary-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:10px;
}
.profile-summary-card{
  padding:14px;border-radius:var(--radius);
  background:var(--surface);border:1px solid var(--line);
}
.profile-summary-card h3{margin:0 0 6px;font-size:.86rem;color:var(--muted);font-weight:700;letter-spacing:.02em}
.profile-summary-card p{font-size:.94rem;color:var(--text);line-height:1.6;margin:0}

/* ----- 16. 認証 (ログイン / 新規登録) ----- */
.auth-shell{
  display:grid;grid-template-columns:1.1fr .9fr;gap:18px;
  align-items:stretch;
}
.auth-card{padding:24px}
.auth-visual{
  min-height:100%;
  background:linear-gradient(155deg, #0e2235, #1fc6c4 60%, #8cd94f);
  color:#fff;border-radius:var(--radius);
  padding:24px;position:relative;overflow:hidden;
}
.auth-visual h2{color:#fff;margin:12px 0 10px}
.auth-visual p{color:rgba(255,255,255,.92);font-size:.92rem;line-height:1.75}
.auth-visual img{max-width:120px;margin:18px 0 14px}
.auth-visual ul{
  padding-left:18px;margin:10px 0 0;
  line-height:1.9;color:rgba(255,255,255,.92);font-size:.92rem;
}
.auth-visual .badge{
  background:rgba(255,255,255,.18);color:#fff;
  border:1px solid rgba(255,255,255,.24);
}

/* ----- 17. 商品画像 ----- */
.image-thumb{
  width:100%;max-width:240px;aspect-ratio:1/1;
  object-fit:cover;border-radius:var(--radius);
  border:1px solid var(--line);
}
.image-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:12px;
}

/* ----- 18. 出品作成 (upload stage / preview / ai panel) ----- */
.upload-stage{
  display:grid;grid-template-columns:minmax(260px,1fr) minmax(280px,1.2fr);
  gap:14px;align-items:stretch;
}
.upload-stage-box,
.ai-draft-panel{
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:16px;
}
.upload-stage-box label{font-size:.94rem}
.preview-grid-large{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:10px;margin-top:14px;
}
.preview-slot{
  position:relative;min-height:170px;
  border-radius:var(--radius);
  border:1px dashed var(--line-strong);
  background:var(--surface);
  overflow:hidden;
  display:flex;flex-direction:column;
  justify-content:center;align-items:center;
  padding:10px;
}
.preview-slot img{
  width:100%;height:120px;object-fit:cover;
  border-radius:var(--radius-sm);
}
.preview-slot-number{
  position:absolute;top:8px;left:8px;
  min-width:24px;height:24px;border-radius:var(--radius-pill);
  display:inline-flex;align-items:center;justify-content:center;
  font-size:.74rem;font-weight:800;
  background:var(--primary-3);color:#fff;
  padding:0 7px;
}
.preview-slot-remove{
  position:absolute;top:6px;right:6px;
  width:26px;height:26px;min-height:26px;
  padding:0;border-radius:var(--radius-pill);
  background:rgba(14,31,51,.78);color:#fff;
  border:none;font-size:.86rem;font-weight:700;line-height:1;
  display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.25);
  transition:background-color .15s;
  z-index:2;
}
.preview-slot-remove:hover{background:var(--danger)}
.preview-slot-remove:active{transform:scale(0.95)}
.preview-placeholder{
  color:var(--muted);font-size:.86rem;font-weight:600;
}
.preview-meta{
  width:100%;margin-top:8px;
  font-size:.78rem;color:var(--muted);
  line-height:1.45;word-break:break-word;
}

/* ----- 19. 買取業者 登録パネル ----- */
.buyer-required-panel{
  margin-top:16px;padding:16px;
  border-radius:var(--radius);
  border:1px solid var(--line);
  background:var(--surface-2);
}
.buyer-register-grid{margin-top:8px}
.register-file-preview{
  margin-top:8px;min-height:120px;max-width:260px;
  border:1px dashed var(--line-strong);
  border-radius:var(--radius);
  background:var(--surface);
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  padding:10px;color:var(--muted);
  text-align:center;overflow:hidden;font-size:.86rem;
}
.register-file-preview img{
  width:100%;max-height:150px;object-fit:contain;
  border-radius:var(--radius-sm);background:var(--surface-2);
}
.register-file-name{
  margin-top:6px;font-size:.82rem;color:var(--text);word-break:break-word;
}
.register-file-icon{
  width:54px;height:54px;border-radius:var(--radius-sm);
  display:flex;align-items:center;justify-content:center;
  font-size:.84rem;font-weight:800;color:#fff;
  background:var(--primary-3);
}
.buyer-type-panel{margin-top:14px;padding-top:2px}

/* ----- 20. AI待機オーバーレイ ----- */
.ai-wait-overlay[hidden]{display:none !important}
.ai-wait-overlay{
  position:fixed;inset:0;z-index:1200;
  background:rgba(14,31,51,.40);
  backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;
  padding:20px;
}
.ai-wait-card{
  width:min(440px,100%);
  border-radius:var(--radius-lg);
  padding:24px 22px;
  background:var(--surface);
  box-shadow:var(--shadow-lg);
  text-align:center;
  border:1px solid var(--line);
}
.ai-spinner-ring{
  width:56px;height:56px;margin:0 auto 14px;
  border-radius:50%;
  border:5px solid var(--primary-3-soft);
  border-top-color:var(--primary-3);
  animation:spin360 .9s linear infinite;
}
.ai-wait-title{font-size:1.1rem;font-weight:700;color:var(--text)}
.ai-wait-text{margin-top:8px;color:var(--muted);line-height:1.7;font-size:.92rem}
.ai-wait-dots{
  margin-top:14px;display:flex;justify-content:center;gap:6px;
}
.ai-wait-dots span{
  width:8px;height:8px;border-radius:50%;
  background:var(--primary-3);
  animation:dotBounce 1.1s ease-in-out infinite;
}
.ai-wait-dots span:nth-child(2){animation-delay:.12s}
.ai-wait-dots span:nth-child(3){animation-delay:.24s}
body.waiting{overflow:hidden}
.badge-loading{position:relative;padding-left:30px}
.badge-loading::before{
  content:'';position:absolute;left:10px;top:50%;
  width:10px;height:10px;margin-top:-5px;border-radius:50%;
  border:2px solid var(--primary-3-soft);
  border-top-color:var(--primary-3);
  animation:spin360 .8s linear infinite;
}

/* ----- 21. オファー比較画面 (利益サマリー / メモ) ----- */
.offer-profit-summary{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:10px;margin-bottom:16px;
}
.offer-profit-summary .stat-card{
  background:var(--surface);border:1px solid var(--line);
  text-align:left;padding:14px;
}
.offer-profit-summary .kpi{
  color:var(--primary-3);font-size:1.5rem;
}
.mini-note-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;margin-top:12px;
}
.mini-note{
  padding:12px 14px;border-radius:var(--radius-sm);
  background:var(--surface);border:1px solid var(--line);
  display:flex;flex-direction:column;gap:4px;
  color:var(--muted);font-size:.86rem;line-height:1.7;
}
.mini-note strong{color:var(--text-2);font-size:.82rem;font-weight:700}

/* ----- 22. ブックマーク ----- */
.bookmark-btn.is-active{
  background:#ffb12a;color:#3b1f00;
  box-shadow:0 1px 2px rgba(255,177,42,.30);
}
.bookmark-btn.is-active:hover{background:#f0a51a}
.bookmark-meta{
  display:flex;align-items:center;gap:8px;
  flex-wrap:wrap;margin-top:8px;
}
.bookmark-meta .small{margin:0}

/* ----- 23. レイアウト分割 ----- */
.split-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:14px}

/* ----- 24. コンタクト ステージ カード ----- */
.contact-stage-card{
  padding:16px;border-radius:var(--radius);
  border:1px solid var(--line);background:var(--surface);
  margin-bottom:14px;
  border-left:3px solid var(--primary-3);
}
.contact-stage-card.is-action{
  border-left-color:var(--warning);
  background:linear-gradient(180deg, var(--warning-soft), var(--surface) 60%);
}
.contact-stage-card.is-waiting{
  border-left-color:var(--primary-3);
  background:linear-gradient(180deg, var(--primary-3-soft), var(--surface) 60%);
}
.contact-stage-card.is-success{
  border-left-color:var(--success);
  background:linear-gradient(180deg, var(--success-soft), var(--surface) 60%);
}
.contact-stage-head{
  display:flex;justify-content:space-between;gap:12px;
  align-items:flex-start;flex-wrap:wrap;
}
.contact-stage-head h3{margin:8px 0 4px;font-size:1.05rem}
.contact-stage-head p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.7}
.contact-stage-status{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 12px;border-radius:var(--radius-pill);
  background:var(--surface);border:1px solid var(--line-strong);
  font-weight:700;font-size:.82rem;color:var(--text-2);
}

/* ----- 25. 訪問予定フォーカスカード ----- */
.visit-focus-card{
  margin-top:14px;padding:18px;
  border-radius:var(--radius);
  background:var(--surface);border:1px solid var(--line);
}
.visit-focus-head{
  display:flex;justify-content:space-between;gap:14px;
  align-items:flex-start;flex-wrap:wrap;margin-bottom:12px;
}
.visit-focus-head h3{margin:6px 0 4px;font-size:1.05rem}
.visit-focus-head p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.7}
.visit-focus-badges{display:flex;gap:6px;flex-wrap:wrap}
.visit-focus-hero{
  display:grid;grid-template-columns:120px 1fr;gap:14px;
  align-items:stretch;margin-bottom:14px;
}
.visit-focus-hero.is-noimage{grid-template-columns:1fr}
.visit-focus-media img{
  width:120px;height:120px;object-fit:cover;
  border-radius:var(--radius);border:1px solid var(--line);
}
.visit-summary-stack{display:grid;gap:10px}
.schedule-emphasis{
  padding:14px 16px;border-radius:var(--radius);
  background:var(--primary-3-soft);
  border:1px solid rgba(21,94,239,.16);
}
.schedule-emphasis .label{
  font-size:.78rem;color:var(--primary-3);font-weight:800;
  letter-spacing:.06em;text-transform:uppercase;
}
.schedule-emphasis .value{
  margin-top:6px;font-size:1.2rem;font-weight:800;
  line-height:1.4;color:var(--text);
}
.schedule-emphasis small{
  display:block;margin-top:6px;
  color:var(--text-2);line-height:1.65;font-size:.84rem;
}
.quick-note{
  padding:10px 12px;border-radius:var(--radius-sm);
  background:var(--surface-2);border:1px dashed var(--line-strong);
  color:var(--muted);line-height:1.65;font-size:.86rem;
}

/* ワークフロー ステップ */
.workflow-steps{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));
  gap:8px;
}
.workflow-step{
  display:flex;align-items:center;gap:8px;
  padding:9px 11px;border-radius:var(--radius-sm);
  background:var(--surface);border:1px solid var(--line);
  color:var(--muted);font-weight:600;font-size:.84rem;
}
.workflow-step.is-active{
  border-color:rgba(217,119,6,.30);
  background:var(--warning-soft);color:#8a5b00;
}
.workflow-step.is-done{
  border-color:rgba(20,148,93,.30);
  background:var(--success-soft);color:#0f6845;
}
.workflow-dot{
  width:10px;height:10px;border-radius:var(--radius-pill);
  background:var(--line-strong);flex:none;
}
.workflow-step.is-active .workflow-dot{background:var(--warning)}
.workflow-step.is-done .workflow-dot{background:var(--success)}

.visit-focus-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:10px;
}
.visit-focus-kv{
  padding:12px 14px;border-radius:var(--radius-sm);
  background:var(--surface);border:1px solid var(--line);
}
.visit-focus-kv strong{
  display:block;margin-bottom:6px;font-size:.78rem;
  color:var(--muted);font-weight:700;letter-spacing:.02em;
}
.visit-focus-kv div{font-weight:700;color:var(--text);line-height:1.55;font-size:.94rem}
.visit-focus-kv small{
  display:block;margin-top:6px;color:var(--muted);
  line-height:1.65;font-size:.82rem;
}

.visit-form-shell{padding:18px}
.visit-preset-list{display:flex;gap:8px;flex-wrap:wrap}
.visit-preset{
  min-height:auto;padding:9px 14px;
  border-radius:var(--radius-pill);
  background:var(--surface);color:var(--primary-3);
  border:1px solid rgba(21,94,239,.20);box-shadow:none;
  font-size:.86rem;
}
.visit-preset:hover{background:var(--primary-3-soft);color:var(--primary-3)}

.visit-preference-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:10px;margin-top:6px;
}
.visit-preference-card{
  padding:12px;border-radius:var(--radius);
  background:var(--surface);border:1px solid var(--line);
}
.visit-preference-card h4{margin:0 0 8px;font-size:.92rem;color:var(--text-2)}
.visit-preference-card .small{margin-top:6px}
.visit-slot-extra[hidden]{display:none !important}

/* ----- 26. フラッシュ / アラート / 空状態 ----- */
.flash{
  padding:12px 14px;border-radius:var(--radius);
  margin-bottom:12px;font-weight:600;font-size:.92rem;
}
.flash-success{
  background:var(--success-soft);color:#0f6845;
  border:1px solid rgba(20,148,93,.20);
}
.flash-error{
  background:var(--danger-soft);color:#8d1e35;
  border:1px solid rgba(198,58,84,.20);
}
.flash-warn{
  background:var(--warning-soft);color:#8a5b00;
  border:1px solid rgba(201,130,27,.28);
}
.alert{
  padding:12px 14px;border-radius:var(--radius);
  margin-bottom:12px;font-size:.92rem;
}
.alert-error{
  background:var(--danger-soft);color:#8d1e35;
  border:1px solid rgba(198,58,84,.20);
}
.empty{
  padding:24px 18px;border-radius:var(--radius);
  border:1px dashed var(--line-strong);text-align:center;
  color:var(--muted);background:var(--surface-2);font-size:.92rem;
}
.notify-help{
  margin-top:8px;padding:9px 11px;border-radius:var(--radius-sm);
  background:var(--success-soft);color:#0f6845;
  line-height:1.6;font-size:.84rem;
}

/* ----- 27. 価格・住所・小要素 ----- */
.price-highlight{
  font-size:1.02rem;font-weight:800;color:var(--text);
  font-feature-settings:"tnum";
}
.contact-stage-card .badge,
.visit-focus-badges .badge{font-size:.74rem}

/* prose */
.prose-like p{line-height:1.8}

/* ----- 28. チャットボット (控えめに) ----- */
.kashari-bot{
  position:fixed;right:14px;
  bottom:calc(14px + env(safe-area-inset-bottom));
  z-index:50;
  display:flex;align-items:flex-end;gap:10px;
}
/* デスクトップではトップバー右下、モバイルでは下部ナビの上に避ける */
.kashari-bot-panel{
  width:min(360px,calc(100vw - 40px));
  max-height:min(560px,calc(100vh - 110px));
  display:flex;flex-direction:column;
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);box-shadow:var(--shadow-lg);
  overflow:hidden;
}
.kashari-bot-head{
  display:flex;justify-content:space-between;align-items:center;flex:none;
  padding:11px 14px;
  background:linear-gradient(120deg,var(--primary-3-soft),var(--surface));
  border-bottom:1px solid var(--line);
}
.kashari-bot-head-main{display:flex;align-items:center;gap:10px;min-width:0}
.kashari-bot-head-main img{width:34px;height:34px;border-radius:10px;object-fit:cover;flex:none}
.kashari-bot-head-main strong{font-size:.94rem;color:var(--text);display:block;line-height:1.2}
.kashari-bot-status{font-size:.74rem;color:var(--muted);margin-top:2px;display:flex;align-items:center;gap:5px}
.kbot-dot{width:7px;height:7px;border-radius:50%;background:#34c759;display:inline-block;box-shadow:0 0 0 2px rgba(52,199,89,.18)}
.kashari-bot-head-actions{display:flex;align-items:center;gap:4px;flex:none}
.kashari-bot-iconbtn{
  width:32px;height:32px;border-radius:9px;border:none;cursor:pointer;background:transparent;
  font-size:1rem;line-height:1;color:var(--text-2);display:grid;place-items:center;transition:background .15s;
}
.kashari-bot-iconbtn:hover{background:rgba(0,0,0,.05)}
.kashari-bot-iconbtn.is-on{filter:none}
.kashari-bot-iconbtn:disabled{opacity:.5;cursor:default}
/* 通知バナー（クリック可能） */
.kashari-bot-push{
  flex:none;display:flex;align-items:flex-start;gap:8px;width:100%;text-align:left;cursor:pointer;
  padding:10px 14px;border:none;border-bottom:1px solid var(--line);
  background:var(--warning-soft);color:#8a5b00;font-size:.82rem;line-height:1.5;font-family:inherit;
}
.kashari-bot-push[hidden]{display:none}
.kbot-push-ic{flex:none;font-size:1rem}
.kbot-push-tx b{font-weight:700}
/* 会話フィード（スクロール領域） */
.kashari-bot-feed{
  flex:1 1 auto;min-height:120px;overflow-y:auto;
  padding:12px 14px;display:flex;flex-direction:column;gap:8px;
  background:var(--surface-2);
}
.kbot-msg{
  max-width:88%;padding:9px 12px;border-radius:14px;font-size:.86rem;line-height:1.6;
  white-space:pre-wrap;word-break:break-word;
}
.kbot-msg.bot{align-self:flex-start;background:var(--surface);border:1px solid var(--line);border-bottom-left-radius:4px;color:var(--text)}
.kbot-msg.user{align-self:flex-end;background:var(--primary-3-soft);color:var(--primary-3);font-weight:600;border-bottom-right-radius:4px}
.kbot-msg.is-typing{color:var(--muted);font-weight:400;letter-spacing:.1em}
/* フィード内のクリック可能チップ（リンク/項目移動） */
.kbot-links{display:flex;flex-wrap:wrap;gap:6px;align-self:flex-start;max-width:100%}
.kbot-chip{
  display:inline-flex;align-items:center;gap:5px;cursor:pointer;font-family:inherit;
  padding:6px 11px;border-radius:var(--radius-pill);font-size:.8rem;font-weight:600;
  background:var(--surface);color:var(--primary-3);border:1px solid rgba(21,94,239,.28);
  text-decoration:none;transition:background .15s,border-color .15s;
}
.kbot-chip:hover{background:var(--primary-3-soft);text-decoration:none}
.kbot-chip-ic{font-size:.92rem}
/* 質問候補チップ */
.kashari-bot-suggest{
  flex:none;display:flex;gap:6px;overflow-x:auto;padding:9px 12px;border-top:1px solid var(--line);
  background:var(--surface);scrollbar-width:none;
}
.kashari-bot-suggest::-webkit-scrollbar{display:none}
.kbot-suggest-chip{
  flex:none;cursor:pointer;font-family:inherit;white-space:nowrap;
  padding:6px 12px;border-radius:var(--radius-pill);font-size:.78rem;font-weight:600;
  background:var(--surface-2);color:var(--text-2);border:1px solid var(--line);transition:background .15s,color .15s,border-color .15s;
}
.kbot-suggest-chip:hover{background:var(--primary-3-soft);color:var(--primary-3);border-color:rgba(201,162,39,.3)}
/* チャット入力 */
.kashari-bot-input{flex:none;display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);background:var(--surface)}
.kashari-bot-input input{
  flex:1;min-width:0;border:1px solid var(--line);border-radius:var(--radius-pill);
  padding:10px 14px;font-family:inherit;font-size:.86rem;outline:none;background:var(--surface-2);color:var(--text);
}
.kashari-bot-input input:focus{border-color:var(--primary-3);box-shadow:0 0 0 3px var(--primary-3-soft);background:var(--surface)}
.kashari-bot-input button{
  flex:none;width:40px;height:40px;border-radius:50%;border:none;cursor:pointer;
  background:var(--gold-grad,var(--primary-3));color:#3a2c08;font-size:1rem;display:grid;place-items:center;font-weight:700;
}
.kashari-bot-input button:hover{filter:brightness(1.04)}
/* ランチャーの未読バッジ */
.kashari-bot-badge{
  position:absolute;top:-3px;right:-3px;min-width:19px;height:19px;padding:0 5px;border-radius:var(--radius-pill);
  background:var(--danger);color:#fff;font-size:.66rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center;line-height:1;border:2px solid var(--surface);
}
.kashari-bot-badge[hidden]{display:none}
/* 項目移動時のハイライト */
.kbot-flash{animation:kbotFieldFlash 1.6s ease}
@keyframes kbotFieldFlash{0%,100%{box-shadow:none}30%,70%{box-shadow:0 0 0 3px var(--primary-3-soft),0 0 0 1px var(--primary-3)}}
.kashari-bot-launcher,.kashari-bot-toggle{border:none;cursor:pointer;font-family:inherit}
.kashari-bot-launcher{
  position:relative;
  width:52px;height:52px;border-radius:var(--radius-pill);
  padding:6px;background:var(--surface);
  box-shadow:var(--shadow-lg);
  border:1px solid var(--line);
}
.kashari-bot-launcher img{
  width:100%;height:100%;border-radius:50%;object-fit:cover;
}
.kashari-bot-toggle{
  width:30px;height:30px;border-radius:var(--radius-pill);
  background:var(--surface);color:var(--text-2);
  box-shadow:none;border:1px solid var(--line);
  font-size:1rem;line-height:1;
}
.kashari-bot.is-collapsed .kashari-bot-panel{display:none}

/* ----- 29. モバイル下部ナビ (新規追加) ----- */
.mobile-nav{display:none}

/* ----- 30. レスポンシブ調整 ----- */
@media (max-width: 920px){
  .auth-shell{grid-template-columns:1fr}
  .auth-visual{order:-1;min-height:auto;padding:18px}
  .auth-visual img{max-width:84px;margin:10px 0}
  .split-layout{grid-template-columns:1fr}
  .contact-detail-grid{grid-template-columns:1fr}
  .contact-detail-hero{grid-template-columns:1fr}
  .contact-detail-hero img{width:100%;height:auto;max-height:240px}
  .upload-stage{grid-template-columns:1fr}
  .hero-grid{grid-template-columns:1fr;gap:18px}
  .hero{padding:24px 20px}
  .visit-focus-hero{grid-template-columns:1fr}
  .visit-focus-media img{width:100%;height:auto;max-height:240px}
}

/* タブレット〜小型ノート：上部ナビが収まらない幅では下部ナビへ集約して改行/崩れを防ぐ */
@media (max-width: 960px){
  /* インラインの主要リンク・アカウントボタンは隠し、ハンバーガーに集約 */
  .nav-primary{display:none}
  .nav-acc-btn{display:none}
  .nav-guest-login,.nav-guest-cta{display:none}
  .user-chip{display:none}
  .nav-burger{display:inline-flex}
  .nav-menu .only-mobile{display:flex}
  .container{padding-bottom:calc(var(--mobile-nav-h) + 24px + env(safe-area-inset-bottom))}

  .mobile-nav{
    display:flex;
    position:fixed;left:0;right:0;bottom:0;z-index:40;
    background:var(--surface);border-top:1px solid var(--line);
    padding:6px 4px calc(6px + env(safe-area-inset-bottom));
    justify-content:space-around;align-items:stretch;
    box-shadow:0 -2px 8px rgba(15,32,53,.04);
  }
  .mobile-nav-item{
    flex:1;display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:2px;
    padding:6px 4px;text-decoration:none;
    color:var(--muted);font-size:.7rem;font-weight:600;
    border-radius:var(--radius-sm);min-height:52px;line-height:1.2;position:relative;
  }
  .mobile-nav-item:hover{text-decoration:none}
  .mobile-nav-item.is-active{color:var(--primary-3)}
  .mobile-nav-item.is-active .mobile-nav-icon{background:var(--primary-3-soft)}
  .mobile-nav-icon{
    display:inline-flex;align-items:center;justify-content:center;
    width:30px;height:30px;border-radius:8px;font-size:1.1rem;color:inherit;
  }
  .mobile-nav-dot{
    position:absolute;top:4px;right:50%;transform:translateX(20px);
    min-width:18px;height:18px;padding:0 5px;border-radius:var(--radius-pill);
    background:var(--danger);color:#fff;font-size:.66rem;font-weight:700;
    display:inline-flex;align-items:center;justify-content:center;line-height:1;
  }
}

@media (max-width: 640px){
  body{font-size:14.5px}
  h1{font-size:1.4rem}
  h2{font-size:1.15rem}
  h3{font-size:1rem}
  .container{padding:14px 12px calc(var(--mobile-nav-h) + 24px + env(safe-area-inset-bottom))}
  .topbar-inner{padding:8px 12px;min-height:54px;gap:10px}
  .brand-logo{width:34px;height:34px}
  .brand-title{font-size:.92rem}
  .brand-sub{display:none}

  .card{padding:14px;border-radius:var(--radius)}
  .hero{padding:22px 18px;border-radius:var(--radius)}
  .hero h1,.hero h2{font-size:1.5rem}
  .hero .card-grid{grid-template-columns:repeat(3,1fr);gap:8px}
  .hero .glass-card{padding:10px}
  .hero .glass-card .kpi{font-size:1.4rem}
  .hero .glass-card .small{font-size:.74rem}

  .page-head{flex-direction:column;align-items:stretch}
  .page-head .actions{justify-content:flex-start}
  .actions{gap:6px}
  .actions .btn,.actions button{flex:1 1 auto;min-width:fit-content}

  .card-grid,.grid{grid-template-columns:1fr;gap:10px}
  .pickup-strip{grid-template-columns:1fr}
  .contact-kpi{grid-template-columns:repeat(3,1fr);gap:8px}
  .contact-kpi .contact-card{padding:12px 10px;text-align:center}
  .contact-kpi .kpi{font-size:1.4rem}
  .contact-kpi .small{font-size:.78rem}
  .profile-summary-grid{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .offer-profit-summary{grid-template-columns:1fr}
  .contact-meta-grid{grid-template-columns:1fr}
  .visit-focus-grid{grid-template-columns:1fr}
  .workflow-steps{grid-template-columns:repeat(2,1fr)}
  .preview-grid-large{grid-template-columns:repeat(2,1fr)}
  .image-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .rich-detail-grid{grid-template-columns:1fr}

  /* テーブルをカード化 (スマホでは横スクロールから縦カードへ) */
  .table-wrap{
    overflow:visible;border:none;background:transparent;
  }
  .table{
    min-width:0;border-collapse:separate;border-spacing:0 8px;
    display:block;
  }
  .table thead{display:none}
  .table tbody{display:block}
  .table tr{
    display:block;background:var(--surface);
    border:1px solid var(--line);border-radius:var(--radius);
    padding:12px;margin-bottom:0;
  }
  .table td{
    display:flex;justify-content:space-between;gap:10px;
    padding:6px 0;border-bottom:1px solid var(--line);
    font-size:.88rem;text-align:right;
  }
  .table td::before{
    content:attr(data-label);
    font-weight:700;color:var(--muted);font-size:.78rem;
    text-align:left;flex:none;letter-spacing:.02em;
  }
  .table td:last-child{border-bottom:none}
  .table td:only-child{justify-content:flex-start}
  .table td .actions{justify-content:flex-end;flex-wrap:wrap}
  .table tr:hover td{background:transparent}

  /* 認証画面はモバイルで縦並び */
  .auth-visual{padding:16px}
  .auth-visual h2{font-size:1.2rem;margin:8px 0 6px}
  .auth-visual p{font-size:.86rem}

  /* チャットボットはモバイル下部ナビの上に避ける */
  .kashari-bot{
    right:12px;
    bottom:calc(var(--mobile-nav-h) + 12px + env(safe-area-inset-bottom));
  }
  .kashari-bot-launcher{width:46px;height:46px}

  /* 入力 UI: ボタンを大きく */
  button,.btn{min-height:46px;padding:0 16px}
  .table .actions .btn,.table .actions button{min-height:38px}

  /* モバイル下部ナビ */
  .mobile-nav{
    display:flex;
    position:fixed;left:0;right:0;
    bottom:0;
    z-index:40;
    background:var(--surface);
    border-top:1px solid var(--line);
    padding:6px 4px calc(6px + env(safe-area-inset-bottom));
    justify-content:space-around;align-items:stretch;
    box-shadow:0 -2px 8px rgba(15,32,53,.04);
  }
  .mobile-nav-item{
    flex:1;display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:2px;
    padding:6px 4px;text-decoration:none;
    color:var(--muted);font-size:.7rem;font-weight:600;
    border-radius:var(--radius-sm);
    min-height:52px;line-height:1.2;
    position:relative;
  }
  .mobile-nav-item:hover{text-decoration:none}
  .mobile-nav-item.is-active{color:var(--primary-3)}
  .mobile-nav-item.is-active .mobile-nav-icon{
    background:var(--primary-3-soft);
  }
  .mobile-nav-icon{
    display:inline-flex;align-items:center;justify-content:center;
    width:30px;height:30px;border-radius:8px;
    font-size:1.1rem;color:inherit;
  }
  .mobile-nav-dot{
    position:absolute;top:4px;right:50%;
    transform:translateX(20px);
    min-width:18px;height:18px;padding:0 5px;
    border-radius:var(--radius-pill);
    background:var(--danger);color:#fff;
    font-size:.66rem;font-weight:700;
    display:inline-flex;align-items:center;justify-content:center;line-height:1;
  }
}

/* ----- 31. 小さなスマホ ----- */
@media (max-width: 380px){
  .hero .card-grid{grid-template-columns:1fr 1fr}
  .hero .card-grid .glass-card:last-child{grid-column:1 / -1}
  .contact-kpi{grid-template-columns:1fr 1fr}
  .actions{flex-direction:column;align-items:stretch}
  .actions .btn,.actions button{width:100%}
  .inline-actions{flex-direction:row}
}

/* ----- 32. フッター ----- */
.footer{
  max-width:var(--container);margin:0 auto;
  padding:0 16px 28px;color:var(--muted);font-size:.82rem;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:10px 18px;
}
.footer .footer-links{
  display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;
  font-size:.82rem;
}
.footer .footer-links a{
  color:var(--muted);text-decoration:none;
  padding:2px 4px;border-radius:4px;
  transition:color .15s ease,background .15s ease;
}
.footer .footer-links a:hover{
  color:var(--primary-deep,#0E8579);
  background:rgba(31,198,196,.10);
  text-decoration:none;
}
.footer .footer-links span{color:var(--rule,#E3E7EE)}
@media (max-width:560px){
  .footer{justify-content:center;text-align:center}
}

/* ----- 33. アニメーション ----- */
@keyframes spin360{
  from{transform:rotate(0deg)}
  to{transform:rotate(360deg)}
}
@keyframes dotBounce{
  0%,80%,100%{transform:translateY(0);opacity:.45}
  40%{transform:translateY(-6px);opacity:1}
}
@keyframes kbotPulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.06)}
}

/* ----- 34. その他のページ専用 (旧スタイルとの互換) ----- */
.contact-stage-card .badge{background:rgba(255,255,255,.7)}
.visit-focus-card .badge{background:var(--bg-subtle)}

/* ----- 34a. AI フィールド補完 (出品編集画面) ----- */
.ai-fill-banner{
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;flex-wrap:wrap;margin-bottom:14px;padding:14px 16px;
  border-radius:var(--radius);
  background:linear-gradient(135deg, var(--primary-3-soft) 0%, var(--primary-soft) 100%);
  border:1px solid rgba(21,94,239,.18);
}
.ai-fill-banner-main{
  display:flex;align-items:center;gap:12px;flex:1;min-width:0;
}
.ai-fill-banner-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:var(--radius-pill);
  background:var(--primary-3);color:#fff;
  font-size:18px;flex:none;
}
.ai-fill-banner-title{
  font-size:1.02rem;font-weight:700;color:var(--text);
}
.ai-fill-banner-actions{flex:none}
.ai-fill-banner-actions .btn{min-height:42px}

.ai-fill-field{position:relative}
.ai-fill-label{
  display:flex;align-items:center;gap:8px;
}
label .ai-fill-btn{margin-left:auto}

.ai-fill-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:24px;height:24px;width:auto;min-width:24px;
  padding:0 8px;
  border-radius:var(--radius-pill);
  background:var(--primary-3-soft);color:var(--primary-3);
  border:1px solid rgba(21,94,239,.20);
  font-size:.78rem;font-weight:700;line-height:1;
  cursor:pointer;font-family:inherit;
  box-shadow:none;letter-spacing:.02em;
  transition:background-color .15s, transform .12s;
}
.ai-fill-btn:hover{background:var(--primary-3);color:#fff}
.ai-fill-btn:active{transform:scale(0.95)}
.ai-fill-btn:disabled{opacity:.6;cursor:not-allowed}
.ai-fill-btn.is-loading{
  background:var(--primary-3);color:#fff;
  position:relative;
}
.ai-fill-btn.is-loading::after{
  content:"";position:absolute;
  width:10px;height:10px;border-radius:50%;
  border:2px solid rgba(255,255,255,.4);border-top-color:#fff;
  animation:spin360 .8s linear infinite;
  margin-left:4px;
}
input.ai-just-filled,textarea.ai-just-filled{
  background-color:rgba(31,198,196,.16) !important;
  transition:background-color 1.2s ease;
}

@media (max-width: 640px){
  .ai-fill-banner{padding:12px;gap:10px}
  .ai-fill-banner-actions{width:100%}
  .ai-fill-banner-actions .btn{width:100%}
}

/* ----- 34b. AI処理中パネル (汎用) ----- */
.ai-loading-panel{
  margin-top:14px;padding:18px;
  border-radius:var(--radius);
  background:linear-gradient(135deg, var(--surface) 0%, var(--primary-3-soft) 200%);
  border:1px solid rgba(21,94,239,.18);
  display:none;
  animation:aiPanelIn .25s ease;
}
.ai-loading-panel.is-visible{display:block}
.ai-loading-panel.is-error{
  background:linear-gradient(135deg, var(--surface) 0%, var(--danger-soft) 200%);
  border-color:rgba(198,58,84,.22);
}
.ai-loading-panel.is-success{
  background:linear-gradient(135deg, var(--surface) 0%, var(--success-soft) 200%);
  border-color:rgba(20,148,93,.22);
}
.ai-loading-head{
  display:flex;align-items:center;gap:12px;
  margin-bottom:12px;flex-wrap:wrap;
}
.ai-loading-spinner{
  width:36px;height:36px;border-radius:50%;
  border:3px solid var(--primary-3-soft);
  border-top-color:var(--primary-3);
  animation:spin360 .9s linear infinite;
  flex:none;
}
.ai-loading-panel.is-success .ai-loading-spinner{
  border:3px solid var(--success);background:var(--success);
  animation:none;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:18px;font-weight:800;
}
.ai-loading-panel.is-success .ai-loading-spinner::before{content:"✓"}
.ai-loading-panel.is-error .ai-loading-spinner{
  border:3px solid var(--danger);background:var(--danger);
  animation:none;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:18px;font-weight:800;
}
.ai-loading-panel.is-error .ai-loading-spinner::before{content:"!"}
.ai-loading-status{flex:1;min-width:0}
.ai-loading-title{
  font-size:.96rem;font-weight:700;color:var(--text);
  line-height:1.4;margin:0 0 2px;
}
.ai-loading-stage{
  font-size:.84rem;color:var(--muted);line-height:1.5;
  margin:0;
}
.ai-loading-time{
  font-size:.78rem;color:var(--text-2);font-weight:600;
  display:flex;gap:12px;flex-wrap:wrap;
  font-variant-numeric:tabular-nums;
}
.ai-loading-time strong{color:var(--text);font-weight:800}
.ai-loading-bar{
  position:relative;height:6px;border-radius:var(--radius-pill);
  background:var(--bg-subtle);overflow:hidden;margin-top:8px;
}
.ai-loading-bar-fill{
  position:absolute;left:0;top:0;bottom:0;
  border-radius:var(--radius-pill);
  background:linear-gradient(90deg, var(--primary), var(--primary-3));
  width:0%;
  transition:width .4s ease;
}
.ai-loading-panel.is-success .ai-loading-bar-fill{
  background:linear-gradient(90deg, var(--success), var(--primary-2));
  width:100% !important;
}
.ai-loading-panel.is-error .ai-loading-bar-fill{
  background:linear-gradient(90deg, var(--danger), #e07090);
}
.ai-loading-tips{
  display:grid;grid-template-columns:1fr;gap:6px;
  margin-top:10px;font-size:.8rem;color:var(--text-2);
  line-height:1.6;
}
.ai-loading-tip{
  padding:8px 10px;border-radius:var(--radius-sm);
  background:rgba(255,255,255,.6);border:1px solid var(--line);
  display:flex;align-items:flex-start;gap:6px;
}
.ai-loading-tip-icon{flex:none;font-size:.9rem;line-height:1.4}
@keyframes aiPanelIn{
  from{opacity:0;transform:translateY(-4px)}
  to{opacity:1;transform:translateY(0)}
}
@media (max-width: 640px){
  .ai-loading-panel{padding:14px}
  .ai-loading-time{font-size:.74rem;gap:8px}
}

/* ----- 35. 案件進捗バー (新規) ----- */
.deal-progress{
  padding:14px;border-radius:var(--radius);
  background:var(--surface-2);border:1px solid var(--line);
  margin-top:12px;
}
.deal-progress-head{
  display:flex;justify-content:space-between;align-items:center;
  gap:10px;flex-wrap:wrap;margin-bottom:10px;
}
.deal-progress-status{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 12px;border-radius:var(--radius-pill);
  background:var(--primary-3-soft);color:var(--primary-3);
  font-size:.82rem;font-weight:700;
  white-space:nowrap;
}
.deal-progress-status.is-completed{background:var(--success-soft);color:var(--success)}
.deal-progress-bar{
  position:relative;height:6px;border-radius:var(--radius-pill);
  background:var(--bg-subtle);overflow:hidden;margin-bottom:14px;
  width:100%;
}
.deal-progress-bar-fill{
  position:absolute;left:0;top:0;bottom:0;
  border-radius:var(--radius-pill);
  background:linear-gradient(90deg, var(--primary), var(--primary-3));
  transition:width .4s ease;
}
.deal-progress-bar.is-completed .deal-progress-bar-fill{
  background:linear-gradient(90deg, var(--success), var(--primary-2));
}
/* 5列のステップ表示 - flexで実装 (grid非対応環境でも崩れない) */
.deal-progress-steps{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap;
  justify-content:space-between;
  align-items:flex-start;
  gap:4px;
  width:100%;
  list-style:none;
  padding:0;
  margin:0;
}
.deal-progress-step{
  flex:1 1 0;
  min-width:0;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start;
  gap:4px;
  font-size:.72rem;
  text-align:center;
  color:var(--muted);
  font-weight:600;
  line-height:1.25;
  word-break:keep-all;
}
.deal-progress-step > span:not(.deal-progress-step-dot){
  display:block;
  width:100%;
  word-wrap:break-word;
  overflow-wrap:break-word;
}
.deal-progress-step-dot{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:22px;
  height:22px;
  border-radius:var(--radius-pill);
  background:var(--surface);
  border:2px solid var(--line-strong);
  font-size:.7rem;
  color:var(--muted);
  font-weight:800;
  flex:none;
  line-height:1;
  box-sizing:border-box;
}
.deal-progress-step.is-active{color:var(--primary-3)}
.deal-progress-step.is-active .deal-progress-step-dot{
  background:var(--primary-3);border-color:var(--primary-3);color:#fff;
  box-shadow:0 0 0 4px var(--primary-3-soft);
}
.deal-progress-step.is-done{color:var(--success)}
.deal-progress-step.is-done .deal-progress-step-dot{
  background:var(--success);border-color:var(--success);color:#fff;
}
@media (max-width: 640px){
  .deal-progress-step{font-size:.64rem;line-height:1.2}
  .deal-progress-step-dot{width:18px;height:18px;font-size:.6rem}
  .deal-progress-status{font-size:.74rem;padding:3px 9px}
  .deal-progress{padding:12px 10px}
}
@media (max-width: 380px){
  .deal-progress-step{font-size:.58rem}
}

/* 案件カード（ダッシュボードの進行中・完了リスト） */
.deal-card{
  padding:14px;border-radius:var(--radius);
  background:var(--surface);border:1px solid var(--line);
  margin-bottom:10px;
}
.deal-card-body{
  display:flex;gap:14px;align-items:flex-start;
  margin-bottom:8px;
}
.deal-card-thumb{
  flex:0 0 96px;width:96px;height:96px;
  border-radius:var(--radius-sm);overflow:hidden;
  background:var(--bg-subtle);
  border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
}
.deal-card-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.deal-card-thumb.is-placeholder{
  color:var(--muted);font-size:.72rem;text-align:center;padding:8px;line-height:1.3;
}
.deal-card-main{flex:1 1 auto;min-width:0}
.deal-card-head{
  display:flex;justify-content:space-between;
  gap:10px;align-items:flex-start;flex-wrap:wrap;
  margin-bottom:6px;
}
.deal-card-head > div:first-child{
  flex:1 1 200px;
  min-width:0;
}
.deal-card-head .actions{
  flex:0 0 auto;
}
.deal-card-head h4{margin:0;font-size:.98rem;line-height:1.4;word-break:break-word}
.deal-card-meta{
  display:flex;gap:10px;flex-wrap:wrap;
  color:var(--muted);font-size:.84rem;margin:6px 0 0;
}
.deal-card-meta strong{color:var(--text);font-weight:700}
.deal-card.is-completed{background:var(--surface-2);opacity:.92}
.deal-card.is-completed .deal-card-head h4{color:var(--text-2)}
@media (max-width: 640px){
  .deal-card-body{flex-direction:column;gap:10px}
  .deal-card-thumb{width:100%;height:auto;aspect-ratio:16/9;flex:none}
  .deal-card-head{flex-direction:column}
  .deal-card-head .actions{width:100%;justify-content:flex-start}
}

/* 詳細フォームのチェックボックス並び: 縦の列を読みやすく */
label.consent-row{font-weight:500}

/* リンクボタンは下線抑制 */
a.btn{text-decoration:none}
a.btn:hover{text-decoration:none}

/* =========================================================
   カシャリ運営への秘匿通報 - 報告ボタン & モーダル
   ========================================================= */
.kashari-report-btn{
  display:inline-flex;align-items:center;gap:4px;
  padding:3px 9px;font-size:.74rem;line-height:1.4;
  border-radius:var(--radius-pill);
  background:transparent;
  color:var(--muted);
  border:1px solid var(--line-strong);
  cursor:pointer;
  transition:all .15s ease;
  margin-left:6px;vertical-align:middle;
  white-space:nowrap;
}
.kashari-report-btn:hover{
  background:var(--danger-soft);
  color:var(--danger);
  border-color:var(--danger);
}
.kashari-report-btn::before{
  content:"⚠";font-size:.78rem;line-height:1;
}

.kashari-modal-backdrop{
  position:fixed;inset:0;
  background:rgba(15,32,53,.55);
  display:none;align-items:center;justify-content:center;
  z-index:1000;padding:14px;
}
.kashari-modal-backdrop.is-open{display:flex}
.kashari-modal{
  background:var(--surface);
  border-radius:var(--radius-lg);
  width:100%;max-width:520px;
  max-height:calc(100vh - 28px);
  overflow-y:auto;
  box-shadow:var(--shadow-lg);
  padding:22px 22px 18px;
}
.kashari-modal h3{margin:0 0 4px;font-size:1.1rem;color:var(--text)}
.kashari-modal .modal-lead{
  color:var(--muted);font-size:.85rem;line-height:1.6;margin:0 0 14px;
}
.kashari-modal .modal-target{
  background:var(--bg-subtle);
  border-radius:var(--radius-sm);
  padding:10px 12px;margin-bottom:14px;
  font-size:.85rem;
}
.kashari-modal .modal-target strong{color:var(--text);display:block;margin-bottom:2px}
.kashari-modal-field{margin-bottom:12px}
.kashari-modal-field label{
  display:block;font-size:.82rem;color:var(--text-2);
  font-weight:700;margin-bottom:6px;
}
.kashari-modal-field select,
.kashari-modal-field textarea,
.kashari-modal-field input[type="text"]{
  width:100%;padding:9px 11px;
  border:1px solid var(--line-strong);
  border-radius:var(--radius-sm);
  font-size:.92rem;font-family:inherit;
  background:var(--surface);
}
.kashari-modal-field textarea{
  min-height:88px;resize:vertical;line-height:1.6;
}
.kashari-modal-field .field-help{
  font-size:.76rem;color:var(--muted);margin-top:4px;
}
.kashari-modal-score{
  display:flex;gap:6px;flex-wrap:wrap;
}
.kashari-modal-score label{
  flex:1 1 0;min-width:62px;
  text-align:center;cursor:pointer;
  padding:8px 4px;border-radius:var(--radius-sm);
  border:1px solid var(--line-strong);
  background:var(--surface);
  font-size:.78rem;color:var(--text-2);
  font-weight:600;transition:all .15s ease;
}
.kashari-modal-score label.is-selected{
  background:var(--primary-3-soft);
  border-color:var(--primary-3);
  color:var(--primary-3);
}
.kashari-modal-score input[type="radio"]{display:none}
.kashari-modal-notice{
  background:rgba(20,148,93,.06);
  border-left:3px solid var(--success);
  padding:8px 12px;border-radius:var(--radius-sm);
  font-size:.78rem;color:var(--text-2);
  margin-bottom:14px;line-height:1.6;
}
.kashari-modal-actions{
  display:flex;gap:8px;justify-content:flex-end;
  margin-top:8px;flex-wrap:wrap;
}
.kashari-modal-actions .btn{min-width:84px}
.kashari-modal-status{
  margin-top:10px;font-size:.82rem;
  padding:8px 10px;border-radius:var(--radius-sm);
  display:none;
}
.kashari-modal-status.is-error{
  display:block;background:var(--danger-soft);color:var(--danger);
}
.kashari-modal-status.is-success{
  display:block;background:var(--success-soft);color:var(--success);
}
@media (max-width: 480px){
  .kashari-modal{padding:18px 16px 14px}
  .kashari-modal-score label{font-size:.72rem;padding:7px 2px}
}

/* 管理者: 通報一覧テーブル */
.kashari-report-severity{
  display:inline-block;padding:2px 8px;border-radius:var(--radius-pill);
  font-size:.72rem;font-weight:700;
}
.kashari-report-severity.is-high{background:var(--danger-soft);color:var(--danger)}
.kashari-report-severity.is-medium{background:var(--warning-soft);color:var(--warning)}
.kashari-report-severity.is-low{background:var(--bg-subtle);color:var(--text-2)}
.kashari-report-status{
  display:inline-block;padding:2px 8px;border-radius:var(--radius-pill);
  font-size:.72rem;font-weight:700;background:var(--bg-subtle);color:var(--text-2);
}
.kashari-report-status.is-open{background:var(--primary-3-soft);color:var(--primary-3)}
.kashari-report-status.is-resolved{background:var(--success-soft);color:var(--success)}
.kashari-report-status.is-dismissed{background:var(--bg-subtle);color:var(--muted)}
.kashari-warning-banner{
  background:var(--danger-soft);
  border-left:4px solid var(--danger);
  padding:12px 14px;border-radius:var(--radius-sm);
  margin-bottom:14px;color:var(--text);
}
.kashari-warning-banner strong{color:var(--danger)}


/* ==========================================================================
   27. ウェブオークション 追加コンポーネント
   ========================================================================== */

/* 汎用 */
.btn-primary{background:var(--primary);color:#fff}
.btn-text{background:transparent;color:var(--primary-3);box-shadow:none;border:none;min-height:38px;padding:0 10px}
.btn-text:hover{background:var(--primary-3-soft)}
.btn-text.btn-danger{background:transparent;color:var(--danger)}
.btn-text.btn-danger:hover{background:var(--danger-soft)}
.btn-block{width:100%}
.btn-sm{min-height:34px;padding:0 12px;font-size:.82rem}
.flash-info{background:var(--primary-3-soft);color:#15489f;border:1px solid rgba(21,94,239,.20);padding:12px 14px;border-radius:var(--radius);margin-bottom:12px;font-weight:600;font-size:.92rem}
.empty-state{text-align:center;color:var(--muted);padding:28px 18px}
.empty-state p{margin:0 0 12px}
.req{display:inline-block;font-size:.7rem;color:var(--danger);background:var(--danger-soft);border-radius:var(--radius-pill);padding:1px 8px;font-style:normal;margin-left:4px;vertical-align:middle}
.page-head{margin:6px 0 18px}
.page-head h1{font-size:1.5rem;margin-bottom:4px}
.page-head .muted{font-size:.92rem}
.section-actions{margin:8px 0 22px}
.section-head{display:flex;align-items:baseline;justify-content:space-between;margin:24px 0 12px;gap:12px}
.crumbs{color:var(--muted);margin:4px 0 14px}
.crumbs a{color:var(--primary-3)}
.badge-good{background:var(--success-soft);color:var(--success)}
.badge-warn{background:var(--warning-soft);color:var(--warning)}

/* フィールド */
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:4px}
.field>span,.field>legend{font-size:.86rem;font-weight:600;color:var(--text-2)}
.field input,.field select,.field textarea{width:100%}
.field-wide{grid-column:1 / -1}
.field-block{border:1px solid var(--border);border-radius:var(--radius);padding:14px;margin:14px 0}
.field-block legend{font-size:.9rem;font-weight:700;padding:0 6px}
.check-row,.radio-row{display:flex;align-items:center;gap:8px;min-height:38px;font-size:.92rem}
.check-row input,.radio-row input{width:auto;min-height:auto}
/* ラベルのクリック範囲を「チェックボックス＋文字」の内容幅だけに限定する。
   （flex の label は既定で行幅いっぱいに広がり、枠外の離れた位置を押しても反応してしまうため） */
.check-row{width:-webkit-fit-content;width:fit-content;max-width:100%;cursor:pointer}

/* 統計カード */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:8px}
.stat-card{padding:16px 18px}
.stat-num{font-size:1.6rem;font-weight:800;color:var(--text);line-height:1.1}
.stat-sub{font-size:.9rem;color:var(--muted);font-weight:600}
/* マイページ統計カードの項目名（出品中・入札中など）：見やすいように大きく・太く表示 */
.stat-label{font-size:1.02rem;font-weight:800;color:var(--text);margin-top:6px;line-height:1.3}

/* オークションカード一覧 */
.auction-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.auction-card{display:flex;flex-direction:column;padding:0;overflow:hidden;text-decoration:none;color:inherit;transition:transform .12s, box-shadow .15s}
.auction-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(14,31,51,.10);text-decoration:none}
.auction-thumb{position:relative;aspect-ratio:4/3;background:var(--bg-subtle);overflow:hidden}
.auction-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.auction-thumb-empty{display:flex;align-items:center;justify-content:center;height:100%;color:var(--muted);font-size:.8rem;letter-spacing:.08em;background:var(--bg-subtle)}
.auction-timer{position:absolute;left:8px;bottom:8px;background:rgba(14,31,51,.78);color:#fff}
.auction-card-body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:8px}
.auction-title{font-size:.98rem;font-weight:700;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;overflow-wrap:anywhere}
.auction-meta{display:flex;flex-wrap:wrap;gap:8px}
.auction-price-row{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-top:auto}
.auction-price{font-size:1.18rem;font-weight:800;color:var(--primary-3)}
.auction-bidcount{white-space:nowrap}
.filter-card{margin-bottom:14px}

/* オークション詳細 */
.auction-detail{display:grid;grid-template-columns:1fr 320px;gap:18px;align-items:start}
.auction-detail-main{display:flex;flex-direction:column;gap:16px;min-width:0}
/* v124: 写真側と金額・入札側が別々に動いてギクシャクするため、追従（sticky）をやめて
   ページ全体で一体にスクロールする固定レイアウトに変更。 */
.auction-detail-side{display:flex;flex-direction:column;gap:16px}
.auction-gallery-main{aspect-ratio:4/3;background:var(--bg-subtle);border-radius:var(--radius);overflow:hidden}
.auction-gallery-main img{width:100%;height:100%;object-fit:contain;display:block}
.auction-gallery-thumbs{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.auction-gallery-thumbs img{width:64px;height:64px;object-fit:cover;border-radius:8px;cursor:pointer;border:1px solid var(--border)}
.auction-detail-title{font-size:1.35rem;margin-bottom:8px}
.spec-list{display:flex;flex-direction:column;gap:0;margin:14px 0}
.spec-list>div{display:flex;gap:12px;padding:8px 0;border-bottom:1px solid var(--border)}
.spec-list dt{flex:0 0 90px;color:var(--muted);font-size:.86rem;margin:0}
.spec-list dd{margin:0;font-size:.92rem}
.auction-description{white-space:normal;line-height:1.8;font-size:.94rem}
.delivery-list{margin:8px 0;padding-left:18px;line-height:1.9}
.auction-bid-card{padding:18px}
.auction-price-lg{font-size:2rem;font-weight:800;color:var(--primary-3);line-height:1.1;margin:2px 0 8px}
.auction-side-meta{display:flex;justify-content:space-between;gap:8px;margin-bottom:12px}
.bid-form-message{margin-top:8px;color:var(--muted)}
.bid-form-message.is-error{color:var(--danger)}

/* 出品者チップ */
.seller-chip{display:flex;align-items:center;gap:12px}
.seller-avatar{width:42px;height:42px;border-radius:50%;background:var(--primary-2-soft);color:var(--text);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.1rem}
.seller-avatar-lg{width:64px;height:64px;font-size:1.6rem}
.seller-profile-head{display:flex;align-items:center;gap:16px}
.seller-profile-name{font-size:1.3rem}

/* Q&A */
.qa-form,.qa-answer-form{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.qa-thread,.qa-admin-list{display:flex;flex-direction:column;gap:14px;list-style:none;padding:0;margin:0}
.qa-item{border-bottom:1px solid var(--border);padding-bottom:12px}
.qa-q,.qa-a{display:flex;gap:8px;align-items:flex-start;line-height:1.7;font-size:.92rem;margin:4px 0}
.qa-a{margin-left:18px;color:var(--text-2)}
.qa-tag{flex:0 0 auto;width:22px;height:22px;border-radius:6px;background:var(--primary-3-soft);color:var(--primary-3);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.78rem}
.qa-tag-a{background:var(--success-soft);color:var(--success)}
.qa-time{margin-left:auto;white-space:nowrap}
.qa-admin-item{display:flex;flex-direction:column;gap:8px}
.qa-admin-head{display:flex;align-items:center;justify-content:space-between;gap:8px}

/* リスト行（出品・取引・入札） */
.listing-rows{display:flex;flex-direction:column;gap:12px}
.listing-row{display:flex;align-items:center;gap:14px;padding:12px 14px}
.listing-row-thumb{flex:0 0 72px;width:72px;height:72px;border-radius:10px;overflow:hidden;background:var(--bg-subtle)}
.listing-row-thumb img{width:100%;height:100%;object-fit:cover}
.listing-row-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.listing-row-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.listing-row-actions{display:flex;flex-direction:column;gap:6px;align-items:flex-end}

/* 通知センター */
.contacts-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.filter-tabs{display:flex;gap:4px;flex-wrap:wrap}
.filter-tabs a{padding:6px 14px;border-radius:var(--radius-pill);font-size:.86rem;font-weight:600;color:var(--text-2);background:var(--surface);border:1px solid var(--border)}
.filter-tabs a.is-active{background:var(--primary-3);color:#fff;border-color:var(--primary-3)}
.notify-list{display:flex;flex-direction:column;gap:10px}
.notify-item{display:flex;gap:12px;align-items:flex-start;padding:14px}
.notify-item.is-unread{border-left:3px solid var(--primary-3)}
.notify-item-body{flex:1;display:flex;flex-direction:column;gap:4px}
.notify-item-head{display:flex;align-items:center;gap:8px}
.notify-item-action{flex:0 0 auto}

/* 取引管理 */
.tx-list{display:flex;flex-direction:column;gap:12px}
.tx-item{display:flex;gap:16px;align-items:flex-start;padding:14px 16px}
.tx-item-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.tx-item-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tx-figures{display:flex;flex-wrap:wrap;gap:10px;color:var(--text-2)}
.tx-item-actions{display:flex;flex-direction:column;gap:6px;align-items:flex-end}

/* バナー */
.banner-strip{display:flex;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.banner-slot{position:relative;flex:1;min-width:200px;min-height:72px;border-radius:var(--radius);overflow:hidden;background:var(--bg-subtle);display:flex;align-items:center;justify-content:center;color:var(--text-2);font-weight:700;border:1px solid var(--border)}
.banner-slot img{width:100%;height:100%;object-fit:cover}
.banner-pr{position:absolute;top:6px;right:6px;font-size:.66rem;background:rgba(14,31,51,.7);color:#fff;padding:1px 6px;border-radius:4px}
.banner-admin-list{display:flex;flex-direction:column;gap:12px}
.banner-admin-item{display:flex;gap:14px;align-items:center;padding:12px 14px}
.banner-admin-thumb{flex:0 0 96px;width:96px;height:54px;border-radius:8px;overflow:hidden;background:var(--bg-subtle)}
.banner-admin-thumb img{width:100%;height:100%;object-fit:cover}
.banner-admin-body{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0}
.banner-admin-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.banner-admin-controls select{min-height:34px;width:auto}

/* 使い方 */
.how-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-top:12px}
.how-step{display:flex;flex-direction:column;gap:6px}
.how-num{width:30px;height:30px;border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800}

/* 画像管理 */
.image-manage-grid{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:12px}
.image-manage-item{width:120px;display:flex;flex-direction:column;gap:4px;position:relative}
.image-manage-item img{width:120px;height:120px;object-fit:cover;border-radius:8px;border:1px solid var(--border)}
.img-order-btns{display:flex;gap:2px;justify-content:center;align-items:center}
.img-order-btns .btn{padding:2px 7px;font-size:.8rem;line-height:1.4;min-width:0}
.img-order-btns .btn[disabled]{opacity:.35;cursor:default;pointer-events:none}
.inline-upload{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.publish-card{text-align:center}

@media (max-width:860px){
  .auction-detail{grid-template-columns:1fr}
  .auction-detail-side{position:static}
}

/* ==========================================================================
   28. ウェブオク ラグジュアリーテーマ・オーバーレイ
   （ゴールド×オニキス。トップページのデザイン言語に統一）
   ========================================================================== */

/* 見出しはゴシックディスプレイ書体に */
h1,h2,h3,
.brand-title,.section-title h2,.section-title h3,
.page-head h1,.auction-detail-title,.seller-profile-name,
.hero h1,.stat-num{
  font-family:var(--font-disp);
  letter-spacing:.01em;
}
.page-head h1{color:var(--onyx);font-weight:800}
.section-title h2,.section-title h3{color:var(--onyx);font-weight:800}

/* 金のあしらいの細い上罫 */
.section-title{position:relative}

/* リンク */
a{color:var(--gold-4)}
a:hover{color:var(--gold-3)}

/* 既定ボタン＝ゴールド */
button,.btn,.btn-primary{
  background:var(--gold-grad);
  color:#3a2c08;
  font-weight:700;
  border:0;
  box-shadow:0 8px 22px rgba(201,162,39,.40);
}
button:hover,.btn:hover,.btn-primary:hover{
  background:var(--gold-grad);
  filter:brightness(1.03);
  transform:translateY(-1px);
  box-shadow:0 12px 30px rgba(201,162,39,.52);
}
button:active,.btn:active{transform:translateY(0)}

/* セカンダリ＝白地に金枠 */
.btn-secondary{
  background:#fff;color:var(--gold-4);
  border:1.5px solid var(--gold-3);box-shadow:none;
}
.btn-secondary:hover{background:var(--wash-2);border-color:var(--gold-4);color:var(--gold-4);filter:none;transform:translateY(-1px)}

/* テキストボタン */
.btn-text{background:transparent;color:var(--gold-4);box-shadow:none;border:0}
.btn-text:hover{background:var(--primary-soft);filter:none;transform:none}
.btn-text.btn-danger{background:transparent;color:var(--crimson)}
.btn-text.btn-danger:hover{background:var(--danger-soft)}

/* 危険・成功・ダークは個別色を維持（金より優先） */
.btn-danger{background:var(--crimson);color:#fff;box-shadow:0 6px 16px rgba(214,50,43,.28)}
.btn-danger:hover{background:#bf2a24;filter:none}
.btn-success,button.btn-success{background:var(--success);color:#fff;box-shadow:0 6px 16px rgba(31,143,95,.25)}
.btn-success:hover{background:#1a7a51;filter:none}
.btn-dark{background:var(--onyx);color:#fff}
.btn-dark:hover{background:#221F2A;filter:none}

/* バッジ＝淡い金 */
.badge{
  background:linear-gradient(135deg,rgba(251,239,182,.55),rgba(231,198,90,.30));
  color:#8a6a17;border:1px solid var(--gold-line);font-weight:700;
}
.badge-good{background:var(--success-soft);color:var(--success);border-color:rgba(31,143,95,.25)}
.badge-warn{background:var(--warning-soft);color:var(--warning);border-color:rgba(201,130,27,.30)}

/* 数値・価格は Oswald＋朱 */
.stat-num{font-family:var(--font-num);font-weight:700;color:var(--onyx)}
.auction-price,.auction-price-lg{font-family:var(--font-num);color:var(--crimson);font-weight:700;font-variant-numeric:tabular-nums}
.auction-timer{font-family:var(--font-num);letter-spacing:.04em}

/* カードの陰影をやや温かく＋金縁 */
.card{border:1px solid var(--line);box-shadow:var(--shadow)}
.auction-card:hover{box-shadow:0 16px 40px rgba(201,162,39,.22)}
.auction-bid-card{border:1.5px solid var(--gold-line);box-shadow:0 18px 48px rgba(201,162,39,.20)}

/* フィルタタブのアクティブを金に */
.filter-tabs a.is-active{background:var(--gold-grad);color:#3a2c08;border-color:transparent}

/* 通知の未読インジケータを金に */
.notify-item.is-unread{border-left:3px solid var(--gold-3)}

/* ヒーロー（共通ヘッダ下の簡易ヒーローを使う画面向け） */
.hero h1{color:var(--onyx)}

/* 出品者アバター・how-num を金に */
.seller-avatar{background:var(--gold-grad);color:#3a2c08}
.how-num{background:var(--gold-grad);color:#3a2c08}

/* テーブル見出し */
.table th{color:var(--text-2);background:var(--wash-2)}

/* スクロールバー（任意のリッチ感） */
*{scrollbar-color:var(--gold-3) transparent}

/* ---- ヘッダー（トップバー）をラグジュアリーに ---- */
.topbar{
  background:rgba(255,251,240,.86);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--gold-line);
}
.brand-mark{
  position:relative;width:38px;height:38px;border-radius:10px;flex:none;
  background:var(--gold-grad);display:grid;place-items:center;overflow:hidden;
  font-family:var(--font-disp);font-weight:800;color:#3a2c08;font-size:1.25rem;
  box-shadow:0 4px 16px rgba(201,162,39,.5);
}
.brand-mark::after{
  content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.9),transparent);
  transform:skewX(-20deg);animation:sheen 3.8s infinite;
}
@keyframes sheen{0%{left:-70%}55%{left:160%}100%{left:160%}}
.brand-title{color:var(--onyx);letter-spacing:.04em}
.brand-sub{font-family:var(--font-num);color:var(--gold-4);letter-spacing:.22em;font-size:.62rem}
.nav a{color:var(--muted)}
.nav a:hover{color:var(--gold-4);background:var(--primary-soft)}
.nav a.is-active{
  background:linear-gradient(135deg,rgba(251,239,182,.6),rgba(231,198,90,.32));
  color:#8a6a17;border-color:var(--gold-line);
}
.user-chip{color:var(--text-2)}
.nav-logout{color:var(--muted)}
.nav-logout:hover{color:var(--crimson)}
.mobile-nav-item.is-active{color:var(--gold-4)}

/* フッターのリンクを金系に */
.footer .footer-links a:hover{color:var(--gold-4);background:var(--primary-soft)}
.footer .footer-links span{color:var(--line-strong)}

/* ---- 認証画面ビジュアル / ヒーロー / インフォを金×墨へ ---- */
.auth-visual{
  background:linear-gradient(155deg,#1a1620 0%,#2a2330 42%,#C9A227 100%);
}
.auth-visual h2{font-family:var(--font-disp)}
.auth-visual .badge{background:rgba(231,198,90,.22);color:#FBEFB6;border:1px solid rgba(231,198,90,.4)}
.hero{
  background:
    radial-gradient(680px 420px at 82% -6%,rgba(231,198,90,.28),transparent 60%),
    radial-gradient(620px 460px at 2% 108%,rgba(201,162,39,.18),transparent 60%),
    linear-gradient(135deg,#1a1620,#2a2330);
  color:#fff;
}
.hero h1{color:#fff}
.hero .badge{background:rgba(231,198,90,.20);color:#FBEFB6;border:1px solid rgba(231,198,90,.38)}
.flash-info{
  background:var(--wash-2);color:#6b5618;
  border:1px solid var(--gold-line);border-left:3px solid var(--gold-3);
}

/* ==========================================================================
   29. AI出品（画像アップ→AI自動入力）
   ========================================================================== */
.ai-upload{
  border:1.5px solid var(--gold-line);border-radius:16px;
  background:linear-gradient(135deg,var(--wash-2),#fff);
  padding:18px;margin-bottom:18px;
}
.ai-upload-head{display:flex;gap:12px;align-items:flex-start;margin-bottom:14px}
.ai-badge{
  flex:0 0 auto;display:inline-flex;align-items:center;
  background:var(--gold-grad);color:#3a2c08;font-weight:800;
  font-size:.74rem;letter-spacing:.04em;padding:4px 12px;border-radius:999px;
  box-shadow:0 4px 12px rgba(201,162,39,.4);
}
.ai-upload-head strong{font-family:var(--font-disp);font-size:1.05rem;color:var(--onyx)}
.ai-drop{
  display:block;border:2px dashed var(--gold-3);border-radius:14px;
  background:#fff;padding:22px 16px;text-align:center;cursor:pointer;
  transition:background .15s,border-color .15s;
}
.ai-drop:hover{background:var(--wash);border-color:var(--gold-4)}
.ai-drop input[type=file]{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.ai-drop-inner{display:flex;flex-direction:column;align-items:center;gap:6px}
.ai-drop-icon{font-size:2rem}
.ai-drop-text{font-weight:700;color:var(--gold-4)}
.ai-preview{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.ai-preview img{width:72px;height:72px;object-fit:cover;border-radius:10px;border:1px solid var(--line)}
.ai-status{
  margin-top:12px;padding:10px 14px;border-radius:10px;font-size:.9rem;font-weight:600;
  background:var(--wash-2);color:#6b5618;border:1px solid var(--gold-line);
}
.ai-status-loading{
  background:var(--wash-2);color:#6b5618;border-color:var(--gold-line);
  position:relative;padding-left:38px;
}
.ai-status-loading::before{
  content:"";position:absolute;left:14px;top:50%;width:16px;height:16px;margin-top:-8px;
  border:2px solid var(--gold-line);border-top-color:var(--gold-3);border-radius:50%;
  animation:spin360 .8s linear infinite;
}
@keyframes spin360{to{transform:rotate(360deg)}}
.ai-status-success{background:var(--success-soft);color:var(--success);border-color:rgba(31,143,95,.3)}
.ai-status-warn{background:var(--warning-soft);color:var(--warning);border-color:rgba(201,130,27,.3)}
.ai-status-error{background:var(--danger-soft);color:var(--crimson);border-color:rgba(214,50,43,.25)}
/* AIが入力した瞬間のハイライト */
.ai-filled{
  animation:aiflash 1.6s ease;
}
@keyframes aiflash{
  0%{background-color:rgba(231,198,90,.45);box-shadow:0 0 0 3px rgba(201,162,39,.25)}
  100%{background-color:#fff;box-shadow:none}
}

/* ==========================================================================
   30. ライブオークション演出（LIVE・歓声・クイック入札・アバター）
   ========================================================================== */
.bid-live-row{display:flex;align-items:center;justify-content:space-between}
.live-pill{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--font-num);font-size:.72rem;letter-spacing:.14em;font-weight:700;
  color:#fff;background:var(--crimson);padding:3px 10px;border-radius:999px;
  box-shadow:0 4px 14px rgba(214,50,43,.4);
}
.live-dot{width:7px;height:7px;border-radius:50%;background:#fff;animation:livepulse 1.1s infinite}
@keyframes livepulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.7)}}

.price-pop{animation:pricepop .7s cubic-bezier(.2,1.6,.4,1)}
@keyframes pricepop{0%{transform:scale(1)}35%{transform:scale(1.14);text-shadow:0 0 18px rgba(214,50,43,.45)}100%{transform:scale(1)}}

/* 歓声ステージ */
.cheer-stage{position:relative;height:0;overflow:visible;pointer-events:none;z-index:3}
.cheer-word{
  position:absolute;top:0;transform:translateY(0);
  font-family:var(--font-disp);font-weight:800;font-size:1rem;color:var(--crimson);
  text-shadow:0 2px 8px rgba(255,251,240,.9);white-space:nowrap;
  animation:cheerfloat 1.8s ease-out forwards;
}
@keyframes cheerfloat{
  0%{opacity:0;transform:translateY(6px) scale(.85)}
  18%{opacity:1;transform:translateY(-6px) scale(1.08)}
  100%{opacity:0;transform:translateY(-46px) scale(1)}
}
.confetti{
  position:absolute;top:-4px;width:8px;height:12px;border-radius:2px;opacity:.95;
  animation:confettifall 1.5s ease-in forwards;
}
@keyframes confettifall{
  0%{transform:translateY(0) rotate(0deg)}
  100%{transform:translateY(120px) rotate(540deg);opacity:0}
}

/* クイック入札ボタン */
.quick-bids{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:4px 0 8px}
.quick-bid{
  min-height:38px;padding:0 4px;border-radius:10px;font-weight:800;font-size:.82rem;
  background:#fff;color:var(--gold-4);border:1.5px solid var(--gold-3);box-shadow:none;cursor:pointer;
}
.quick-bid:hover{background:var(--wash-2);transform:translateY(-1px);filter:none}
.quick-bid:active{transform:translateY(0)}

/* 入札履歴（ライブリスト・アバター） */
.bid-live-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.bid-live-item{
  display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;
  background:var(--surface-2);border:1px solid var(--line);
}
.bid-live-item.is-new{animation:bidslide .6s ease}
@keyframes bidslide{0%{transform:translateY(-8px);opacity:0;background:rgba(231,198,90,.35)}100%{transform:translateY(0);opacity:1}}
.bidder-avatar{
  flex:0 0 auto;width:30px;height:30px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:.9rem;color:#3a2c08;background:var(--gold-grad);
}
.bidder-avatar[data-initial="A"],.bidder-avatar[data-initial="E"],.bidder-avatar[data-initial="I"]{background:linear-gradient(135deg,#9bd4c0,#3f9d7a);color:#fff}
.bidder-avatar[data-initial="K"],.bidder-avatar[data-initial="S"],.bidder-avatar[data-initial="T"]{background:linear-gradient(135deg,#a9c4f5,#3a6fd8);color:#fff}
.bid-live-name{flex:0 0 auto;font-size:.88rem}
.bid-live-amount{font-family:var(--font-num);font-weight:700;color:var(--crimson);margin-left:auto}
.bid-live-time{flex:0 0 auto}

/* ==========================================================================
   31. LIVE競りカード（トップページ準拠の派手なオークションUI）
   ========================================================================== */
.live-card{padding:0;overflow:hidden;border:1.5px solid var(--gold-line)}
.live-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:linear-gradient(135deg,#15131A,#2a2330);
  padding:12px 16px;
}
.live-head .live-pill{box-shadow:none}
.live-pill-ended{background:#5a5562}
.live-clock{display:flex;flex-direction:column;align-items:flex-end;line-height:1.1}
.live-clock-time{
  font-family:var(--font-num);font-weight:700;font-size:1.25rem;letter-spacing:.06em;
  color:var(--gold-2);font-variant-numeric:tabular-nums;
}
.live-clock-time.is-final{color:#ff6b61;animation:livepulse 1s infinite}
.live-clock-label{font-size:.64rem;color:#bdb6a6;letter-spacing:.12em}
.live-body{padding:16px}
.live-chips{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.chip-gold{
  display:inline-flex;align-items:center;padding:3px 12px;border-radius:999px;
  background:var(--gold-grad);color:#3a2c08;font-size:.76rem;font-weight:800;
}
.chip-dark{
  display:inline-flex;align-items:center;gap:4px;padding:3px 12px;border-radius:999px;
  background:rgba(21,19,26,.85);color:#fff;font-size:.76rem;font-weight:700;
}
.live-price-row{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:4px}
.live-bidcount-box{text-align:right}
.live-bidcount-num{font-family:var(--font-num);font-weight:700;font-size:1.5rem;color:var(--onyx);line-height:1.1}
.live-bidcount-unit{font-size:.8rem;color:var(--muted);font-weight:600}
.side-bid-list{list-style:none;margin:0 0 12px;padding:0}
.side-bid-list li{
  display:flex;align-items:center;gap:8px;
  padding:8px 2px;border-bottom:1px solid var(--line);font-size:.88rem;
}
.side-bid-list li:last-child{border-bottom:none}
.side-bid-name{color:var(--text-2)}
.side-bid-amount{margin-left:auto;font-family:var(--font-num);font-weight:700;color:var(--crimson)}
.btn-join{
  min-height:52px;font-size:1.02rem;letter-spacing:.04em;border-radius:999px;
  box-shadow:0 12px 30px rgba(201,162,39,.5);
}

/* 落札速報ティッカー */
.sold-ticker{
  display:flex;align-items:center;gap:0;overflow:hidden;
  background:linear-gradient(135deg,#15131A,#2a2330);
  border:1px solid var(--gold-line);border-radius:12px;
  margin:0 0 16px;min-height:42px;
  position:sticky;top:var(--ticker-top, calc(var(--topbar-h) + 22px));z-index:25;
  box-shadow:0 8px 22px rgba(20,18,24,.18);
}
.sold-ticker-label{
  flex:0 0 auto;display:flex;align-items:center;gap:6px;
  background:var(--gold-grad);color:#3a2c08;font-weight:800;font-size:.8rem;
  padding:0 14px;align-self:stretch;white-space:nowrap;
}
.sold-ticker-track{flex:1;overflow:hidden;position:relative}
.sold-ticker-inner{
  display:inline-flex;gap:48px;white-space:nowrap;padding-left:100%;
  animation:tickerscroll 80s linear infinite;
}
.sold-ticker:hover .sold-ticker-inner{animation-play-state:paused}
@keyframes tickerscroll{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}
.sold-ticker-item{display:inline-flex;align-items:center;gap:6px;color:#e9e2d2;font-size:.85rem}
.sold-ticker-item .t-price{font-family:var(--font-num);font-weight:700;color:#ff8d85}
.sold-ticker-item .t-name{color:var(--gold-2);font-weight:700}

/* ==========================================================================
   32. オンボーディング「次にやること」＆ガイド誘導ハイライト
   ========================================================================== */
.onboarding{
  margin:0 0 16px;border:1.5px solid var(--gold-line);border-radius:14px;
  background:linear-gradient(135deg,var(--wash-2),#fff);overflow:hidden;
  box-shadow:0 8px 24px rgba(201,162,39,.14);
}
.onboarding.is-quiet{opacity:.92}
.onboarding-bar{
  display:flex;align-items:center;gap:10px;width:100%;
  background:transparent;border:0;box-shadow:none;color:var(--onyx);
  padding:12px 16px;min-height:48px;cursor:pointer;font-family:inherit;
  font-size:.94rem;text-align:left;
}
.onboarding-bar:hover{background:rgba(231,198,90,.10);filter:none;transform:none}
.onboarding-spark{animation:sparkle 2.2s ease-in-out infinite}
@keyframes sparkle{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.25) rotate(12deg)}}
.onboarding-bar strong{font-family:var(--font-disp);letter-spacing:.02em}
.onboarding-progress{font-size:.8rem;color:var(--gold-4);font-weight:700;white-space:nowrap}
.onboarding-meter{flex:1;max-width:160px;height:6px;border-radius:999px;background:rgba(201,162,39,.18);overflow:hidden}
.onboarding-meter span{display:block;height:100%;background:var(--gold-grad);border-radius:999px;transition:width .4s}
.onboarding-caret{margin-left:auto;color:var(--gold-4);transition:transform .2s}
.onboarding.is-open .onboarding-caret{transform:rotate(180deg)}
.onboarding-panel{padding:0 16px 16px;border-top:1px dashed var(--gold-line)}
.onboarding-lead{margin:12px 0}
.onboarding-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.onboarding-step-link{
  display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;
  transition:box-shadow .15s,transform .12s,border-color .15s;
}
.onboarding-step-link:hover{border-color:var(--gold-3);box-shadow:0 8px 20px rgba(201,162,39,.18);transform:translateY(-1px);text-decoration:none}
.onboarding-num{
  flex:0 0 auto;width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--gold-grad);color:#3a2c08;font-weight:800;font-family:var(--font-num);font-size:1rem;
  box-shadow:0 4px 12px rgba(201,162,39,.35);
}
.onboarding-step.is-done .onboarding-num{background:var(--success);color:#fff;box-shadow:none}
.onboarding-step.is-done .onboarding-step-body strong{text-decoration:line-through;color:var(--muted)}
.onboarding-step-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.onboarding-go{margin-left:auto;white-space:nowrap;color:var(--gold-4);font-weight:800;font-size:.86rem;animation:nudgemove 1.6s ease-in-out infinite}
@keyframes nudgemove{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}
.onboarding-foot{margin-top:12px;text-align:right}

/* ガイド誘導: 対象を金の波紋で光らせる */
.guide-glow{
  position:relative;z-index:2;border-radius:14px;
  animation:guidepulse 1.4s ease-in-out infinite;
  outline:3px solid var(--gold-3);outline-offset:3px;
}
@keyframes guidepulse{
  0%,100%{box-shadow:0 0 0 0 rgba(201,162,39,.55)}
  50%{box-shadow:0 0 0 14px rgba(201,162,39,0)}
}
.guide-callout{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--onyx);color:var(--gold-2);font-weight:800;font-size:.9rem;
  padding:8px 16px;border-radius:999px;margin:0 0 10px;
  box-shadow:0 10px 26px rgba(21,19,26,.35);
  animation:calloutbob 1.2s ease-in-out infinite;
}
@keyframes calloutbob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}

/* ===== ver.3 追加：ウォッチ機能 / 即決価格 ===== */
/* 詳細ページのウォッチボタン（チップ風） */
.chip-watch{
  display:inline-flex;align-items:center;gap:4px;padding:3px 12px;border-radius:999px;
  background:#fff;color:var(--gold-4);border:1.5px solid var(--gold-3);
  font-size:.76rem;font-weight:800;cursor:pointer;line-height:1.6;transition:all .15s ease;
}
.chip-watch:hover{background:var(--wash-2)}
.chip-watch.is-watching{background:var(--gold-grad);color:#3a2c08;border-color:transparent}

/* 即決価格表示 */
.live-buynow-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:2px 0 10px;padding:6px 10px;border:1px dashed var(--gold-line);border-radius:10px;background:var(--wash-2)}
.buynow-price{font-family:var(--font-num);font-weight:800;color:var(--gold-4);font-size:1.05rem}
.btn-buynow{margin-top:8px}

/* カタログカードのウォッチトグル */
.auction-thumb .card-watch-btn{
  position:absolute;right:8px;top:8px;z-index:2;
  width:34px;height:34px;border-radius:999px;border:0;cursor:pointer;
  background:rgba(20,18,24,.55);color:#fff;font-size:1rem;line-height:1;
  display:flex;align-items:center;justify-content:center;transition:transform .12s ease, background .15s ease;
}
.auction-thumb .card-watch-btn:hover{transform:scale(1.08)}
.auction-thumb .card-watch-btn.is-watching{background:var(--gold-grad);color:#3a2c08}

/* ウォッチリスト：LIVE入札カードのグリッド（複数同時入札） */
.live-badge-inline{display:inline-block;vertical-align:middle;margin-left:8px;padding:2px 10px;border-radius:999px;background:linear-gradient(135deg,#D6322B,#a31f1a);color:#fff;font-size:.7rem;font-weight:800;letter-spacing:.08em;animation:livepulse 1.4s infinite}
.watch-live-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;align-items:start}
.watch-live-card{padding:0;transition:transform .25s ease, box-shadow .25s ease, opacity .3s ease}
.watch-live-card:hover{transform:translateY(-3px);box-shadow:0 22px 56px rgba(201,162,39,.28)}
.watch-live-card .live-body{padding:14px 16px 16px}
.watch-live-title{display:block;margin-bottom:10px;color:var(--onyx);line-height:1.35;min-height:2.7em}
.watch-live-title:hover strong{color:var(--gold-4)}
/* 商品写真（小さめのギャラリー） */
.watch-photos{display:flex;gap:6px;margin:0 0 12px;align-items:stretch}
.watch-photo-main{flex:1 1 auto;border-radius:10px;overflow:hidden;background:var(--bg-subtle);aspect-ratio:4/3;display:block}
.watch-photo-main img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease}
.watch-photos:hover .watch-photo-main img{transform:scale(1.05)}
.watch-photo-thumbs{flex:0 0 56px;display:flex;flex-direction:column;gap:6px;position:relative}
.watch-photo-thumb{position:relative;flex:1 1 0;border-radius:8px;overflow:hidden;background:var(--bg-subtle);min-height:0}
.watch-photo-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.watch-photo-more{position:absolute;right:3px;bottom:3px;padding:1px 7px;border-radius:999px;background:rgba(20,18,24,.72);color:#fff;font-size:.66rem;font-weight:800}
.watch-live-card .chip-watch{cursor:pointer;font-size:.72rem;padding:2px 10px}
.watch-live-card.is-won{box-shadow:0 0 0 2px var(--gold-3),0 22px 56px rgba(201,162,39,.4)}
.watch-live-card.is-removing{opacity:0;transform:scale(.92)}
.live-pill-won{background:var(--gold-grad)!important;color:#3a2c08!important}
.quick-bid.pulse{animation:qpulse .5s ease}
.side-bid-list li.just-in{animation:justin .6s ease}
@keyframes qpulse{0%{transform:scale(1)}40%{transform:scale(1.12)}100%{transform:scale(1)}}
@keyframes justin{0%{background:rgba(231,198,90,.45);transform:translateX(-8px);opacity:0}100%{background:transparent;transform:translateX(0);opacity:1}}
.btn.is-loading{position:relative;color:transparent!important}
.btn.is-loading::after{content:"";position:absolute;left:50%;top:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:btnspin .6s linear infinite}
@keyframes btnspin{to{transform:rotate(360deg)}}
@media(max-width:560px){
  .watch-live-grid{grid-template-columns:1fr;gap:14px}
}

/* ===== 売り買い切替（一本化） ===== */
.nav-mode-switch{
  display:inline-flex;align-items:center;gap:4px;padding:.3rem .8rem;border-radius:999px;
  border:1.5px solid var(--gold-3);color:var(--gold-4);font-weight:700;font-size:.8rem;white-space:nowrap;
}
.nav-mode-switch:hover{background:var(--gold-grad);color:#3a2c08;border-color:transparent}
.mode-badge{
  display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;
  background:var(--gold-grad);color:#3a2c08;font-size:.7rem;font-weight:800;vertical-align:middle;
}

/* ===== カテゴリ新着・絞り込み・速報・画面内トースト ===== */
/* NEWバッジ（カタログ） */
.auction-new-badge{position:absolute;left:8px;top:8px;background:linear-gradient(135deg,#D6322B,#a31f1a);color:#fff;font-size:.66rem;font-weight:800;letter-spacing:.06em;padding:2px 8px;border-radius:999px;box-shadow:0 4px 10px rgba(214,50,43,.4)}
/* 新着案内バナー */
.new-arrival-hint{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px;padding:10px 14px;border-radius:12px;background:var(--wash-2);border:1px solid var(--gold-line);font-size:.9rem}
.new-arrival-flag{background:linear-gradient(135deg,#D6322B,#a31f1a);color:#fff;font-size:.66rem;font-weight:800;padding:2px 9px;border-radius:999px}
.new-arrival-hint a{margin-left:auto;color:var(--gold-4);font-weight:700;white-space:nowrap}
/* ウォッチのツールバー・絞り込み */
.watch-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.watch-filter{display:flex;align-items:center;gap:8px;margin:0}
.watch-filter select{padding:7px 10px;border:1px solid var(--line);border-radius:8px;font:inherit;max-width:62vw}
.watch-new-badge{margin-left:auto;background:linear-gradient(135deg,#D6322B,#a31f1a);color:#fff;font-size:.62rem;font-weight:800;padding:2px 8px;border-radius:999px;align-self:center}
.watch-live-card .live-head{position:relative}
/* 速報ティッカーの種別色 */
.sold-ticker-item .t-ico{margin-right:2px}
.sold-ticker-item.t-bid .t-price{color:#E7C65A}
.sold-ticker-item.t-new{color:#FBEFB6}
/* 画面内トースト（見逃し防止） */
.webauc-toast-host{position:fixed;right:16px;top:16px;z-index:9999;display:flex;flex-direction:column;gap:10px;max-width:360px;pointer-events:none}
.webauc-toast{pointer-events:auto;cursor:pointer;display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:14px;background:#fff;border:1px solid var(--gold-line);box-shadow:0 16px 44px rgba(20,18,24,.22);transform:translateX(120%);opacity:0;transition:transform .35s cubic-bezier(.2,1.3,.4,1),opacity .35s}
.webauc-toast.is-in{transform:translateX(0);opacity:1}
.webauc-toast.is-warn{border-color:#e7a; box-shadow:0 16px 44px rgba(214,50,43,.28); animation:toastShake .5s}
.webauc-toast-ico{font-size:1.3rem;line-height:1.4}
.webauc-toast-body{flex:1 1 auto;min-width:0}
.webauc-toast-title{font-weight:800;font-size:.92rem;color:var(--onyx);margin-bottom:2px}
.webauc-toast-text{font-size:.82rem;color:var(--muted);line-height:1.4}
.webauc-toast-close{pointer-events:auto;border:0;background:transparent;font-size:1.1rem;line-height:1;color:var(--muted);cursor:pointer;padding:0 2px}
@keyframes toastShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}
@media(max-width:560px){
  .webauc-toast-host{left:12px;right:12px;top:12px;max-width:none}
  .webauc-toast{transform:translateY(-120%)}
  .webauc-toast.is-in{transform:translateY(0)}
}

/* ティッカー固定位置はヘッダー実高さ(--ticker-top)に追従（_footer.php で設定） */

/* ===== v68: 本人確認ステータス ===== */
.id-verify-status{
  margin:10px 0 6px;padding:10px 14px;border-radius:12px;font-size:.86rem;font-weight:700;line-height:1.5;
  border:1.5px solid var(--border);background:var(--wash-2);color:var(--muted);
}
.id-verify-status[data-state="loading"]{border-color:var(--gold-3);background:#fffdf3;color:var(--gold-4);}
.id-verify-status[data-state="ok"]{border-color:#2faf64;background:#f0fbf4;color:#1d7d44;}
.id-verify-status[data-state="error"]{border-color:#d9534f;background:#fdf2f2;color:#b23b38;}

/* ===== v68: マイページ＝あなたのお店 ハブ ===== */
.shop-hub{
  position:relative;overflow:hidden;border-radius:20px;padding:20px 22px;margin:0 0 18px;
  background:linear-gradient(135deg,#1f1a24,#2c2533 60%,#3a2f1c);color:#fff;
  box-shadow:0 14px 38px rgba(21,19,26,.28);
}
.shop-hub::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(420px 200px at 88% -10%,rgba(231,198,90,.28),transparent 60%);}
.shop-hub-top{position:relative;z-index:2;display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.shop-hub-avatar{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;font-size:1.5rem;
  background:linear-gradient(135deg,#e7c65a,#c9a227);color:#3a2c08;box-shadow:0 6px 16px rgba(201,162,39,.45);flex:0 0 auto;}
.shop-hub-name{font-family:var(--disp,inherit);font-weight:800;font-size:1.25rem;line-height:1.2;margin:0;}
.shop-hub-sub{font-size:.8rem;color:rgba(255,255,255,.72);margin-top:3px;}
.shop-hub-verify{display:inline-flex;align-items:center;gap:5px;margin-top:6px;padding:3px 10px;border-radius:999px;
  font-size:.74rem;font-weight:800;background:rgba(47,175,100,.18);color:#7be0a4;border:1px solid rgba(47,175,100,.4);}
.shop-hub-verify.is-warn{background:rgba(217,83,79,.16);color:#ff9a97;border-color:rgba(217,83,79,.45);}
.shop-hub-badge-dealer{display:inline-flex;align-items:center;gap:5px;margin-top:6px;margin-left:6px;padding:3px 10px;border-radius:999px;
  font-size:.74rem;font-weight:800;background:rgba(231,198,90,.16);color:#f0d985;border:1px solid rgba(231,198,90,.4);}
.shop-modes{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px;}
.shop-mode{
  display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;text-decoration:none;
  background:rgba(255,255,255,.06);border:1.5px solid rgba(255,255,255,.14);color:#fff;transition:transform .14s ease,background .14s ease,border-color .14s ease;
}
.shop-mode:hover{transform:translateY(-2px);background:rgba(255,255,255,.12);}
.shop-mode .ic{font-size:1.5rem;flex:0 0 auto;}
.shop-mode b{display:block;font-size:1rem;}
.shop-mode span{display:block;font-size:.76rem;color:rgba(255,255,255,.72);margin-top:1px;}
.shop-mode.is-current{background:linear-gradient(135deg,#e7c65a,#c9a227);border-color:transparent;color:#3a2c08;}
.shop-mode.is-current span{color:rgba(58,44,8,.72);}
@media(max-width:560px){.shop-modes{grid-template-columns:1fr;}}

/* ===== v68: オンボーディングの主要アクション・ピル ===== */
.onb-cta-pill{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  margin:0 0 16px;padding:13px 16px;border-radius:14px;
  background:linear-gradient(135deg,#fff7e0,#fdeecb);border:1.5px solid var(--gold-3);
  box-shadow:0 8px 22px rgba(201,162,39,.18);
}
.onb-cta-pill .ic{font-size:1.3rem;}
.onb-cta-pill .tx{flex:1 1 200px;}
.onb-cta-pill .tx b{display:block;font-size:.96rem;color:var(--onyx,#1f1a24);}
.onb-cta-pill .tx span{display:block;font-size:.8rem;color:var(--muted);margin-top:2px;}
.onb-cta-pill .btn{flex:0 0 auto;}

/* ===== v69: 特定商取引法テーブル ===== */
.legal-table{width:100%;border-collapse:collapse;font-size:.92rem;}
.legal-table th,.legal-table td{border:1px solid var(--border,#e6e0d4);padding:11px 14px;text-align:left;vertical-align:top;}
.legal-table th{width:34%;background:var(--wash-2,#faf7ef);font-weight:800;color:var(--text-2,#5b5443);white-space:nowrap;}
@media(max-width:560px){
  .legal-table,.legal-table tbody,.legal-table tr,.legal-table th,.legal-table td{display:block;width:100%;}
  .legal-table th{border-bottom:none;}
  .legal-table td{border-top:none;margin-bottom:6px;}
}

/* ===== v72: デポジット入金 ===== */
.deposit-presets{display:flex;flex-wrap:wrap;gap:8px;}
.deposit-presets .deposit-preset{flex:0 0 auto;}
.btn-sm{padding:6px 12px;font-size:.85rem;}

/* ===== v73: デポジット残高警告 ===== */
.deposit-warn{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  margin:0 0 16px;padding:12px 16px;border-radius:14px;
  background:linear-gradient(135deg,#fff6e0,#ffe9c7);border:1.5px solid #e6b450;
  box-shadow:0 6px 18px rgba(214,158,46,.16);
}
.deposit-warn-ic{font-size:1.3rem;flex:0 0 auto;}
.deposit-warn-body{flex:1 1 240px;font-size:.86rem;color:#7a5a12;line-height:1.5;}
.deposit-warn-body strong{display:block;color:#5b4109;margin-bottom:2px;}
.deposit-warn .btn{flex:0 0 auto;}

/* ===== v74: ウォッチ（ライブ入札）カードを縦圧縮し、入札ボタンを画面内に収める ===== */
.watch-live-card .live-body{padding:12px 14px 14px}
/* タイトルは2行までにクランプ（固定の高さ確保をやめる） */
.watch-live-card .watch-live-title{
  margin-bottom:6px;min-height:0;font-size:.9rem;line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
/* 写真ギャラリーを小さく（縦を大幅に節約） */
.watch-live-card .watch-photos{margin:0 0 8px;height:110px}
.watch-live-card .watch-photo-main{aspect-ratio:auto;height:110px}
.watch-live-card .watch-photo-thumbs{flex:0 0 44px}
/* 各セクションの余白を詰める */
.watch-live-card .live-chips{margin-bottom:8px}
.watch-live-card .live-buynow-row{margin:0 0 8px;padding:4px 10px}
.watch-live-card .live-price-row{padding-bottom:8px;margin-bottom:6px}
.watch-live-card .auction-price-lg{font-size:1.5rem;margin:0}
.watch-live-card .live-bidcount-num{font-size:1.1rem}
/* 入札履歴は最大3行ぶんの高さに収め、超過はスクロール */
.watch-live-card .side-bid-list{margin:0 0 8px;max-height:96px;overflow:auto}
.watch-live-card .side-bid-list li{padding:3px 0;font-size:.8rem}
.watch-live-card .cheer-stage{min-height:0}
/* 入札操作エリアを詰める */
.watch-live-card .watch-bid .field{margin-bottom:6px}
.watch-live-card .watch-bid .field > span{font-size:.78rem}
.watch-live-card .watch-bid .js-amount{padding:8px 10px}
.watch-live-card .quick-bids{gap:5px;margin:4px 0 8px}
.watch-live-card .quick-bid{padding:6px 2px;font-size:.76rem}
.watch-live-card .watch-bid fieldset.field{margin-bottom:8px;display:flex;flex-wrap:wrap;gap:2px 12px;align-items:center}
.watch-live-card .watch-bid fieldset.field legend{font-size:.76rem;flex:1 1 100%;margin-bottom:2px}
.watch-live-card .watch-bid .radio-row{font-size:.82rem;padding:2px 0;gap:6px;display:inline-flex;align-items:center}
/* 参加（入札）ボタンを目立たせつつコンパクトに */
.watch-live-card .btn-join{padding:11px;font-size:.95rem}
.watch-live-card .btn-buynow{margin-top:6px;padding:9px;font-size:.85rem}

/* ===== v75: 領収証 ===== */
.receipt-actions{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 16px}
.receipt-sheet{
  max-width:640px;margin:0 auto;background:#fff;border:1px solid var(--line);
  border-radius:14px;padding:32px 36px;box-shadow:0 10px 30px rgba(20,18,24,.08);color:#1c1a22;
}
.receipt-title{font-size:1.7rem;font-weight:800;letter-spacing:.4em;text-align:center;margin:0 0 18px;border-bottom:2px solid #1c1a22;padding-bottom:10px}
.receipt-meta{display:flex;justify-content:space-between;font-size:.85rem;color:#555;margin-bottom:18px}
.receipt-to{font-size:1.1rem;margin:6px 0 18px;border-bottom:1px solid #999;padding-bottom:8px}
.receipt-to-name{font-weight:700;font-size:1.25rem}
.receipt-amount{display:flex;align-items:baseline;gap:14px;background:var(--wash-2,#faf6ec);border:1px solid var(--gold-line,#e3cf9b);border-radius:10px;padding:14px 18px;margin:0 0 14px}
.receipt-amount-label{font-size:.9rem;color:#555;flex:0 0 auto}
.receipt-amount-value{font-size:1.9rem;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.receipt-subject{font-size:1rem;margin:0 0 6px}
.receipt-note{font-size:.85rem;color:#555;margin:0 0 16px}
.receipt-breakdown{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:.9rem}
.receipt-breakdown th,.receipt-breakdown td{border:1px solid #ddd;padding:7px 12px;text-align:left}
.receipt-breakdown td{text-align:right;font-variant-numeric:tabular-nums;width:40%}
.receipt-breakdown .receipt-total th,.receipt-breakdown .receipt-total td{background:#faf6ec;font-weight:800}
.receipt-issuer{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-top:18px}
.receipt-issuer-info{font-size:.85rem;line-height:1.7}
.receipt-seal{flex:0 0 auto;width:64px;height:64px;border:2px solid #c0392b;border-radius:8px;color:#c0392b;display:flex;align-items:center;justify-content:center;font-size:1.6rem;opacity:.75}
.receipt-stamp-note{font-size:.74rem;color:#888;margin-top:16px}
@media print{
  body{background:#fff!important}
  .no-print,.site-header,.site-footer,header,footer,nav{display:none!important}
  .receipt-sheet{box-shadow:none;border:none;max-width:none;margin:0;padding:0}
  .main-wrap,main,.container{margin:0!important;padding:0!important;max-width:none!important}
}

/* ===== v76: ウォッチカードの折りたたみ（入札履歴・受け渡し方法） ===== */
.watch-collapse{border:1px solid var(--line);border-radius:10px;margin:0 0 8px;background:#fff;overflow:hidden}
.watch-collapse>summary{
  cursor:pointer;list-style:none;padding:8px 12px;font-size:.82rem;font-weight:700;color:var(--onyx);
  display:flex;align-items:center;gap:8px;user-select:none;
}
.watch-collapse>summary::-webkit-details-marker{display:none}
.watch-collapse>summary::after{content:"▾";margin-left:auto;color:var(--muted);transition:transform .2s ease}
.watch-collapse[open]>summary::after{transform:rotate(180deg)}
.watch-collapse>summary:hover{background:var(--wash-1,#faf6ec)}
.watch-collapse .wc-sub{font-weight:500;color:var(--muted);font-size:.78rem}
.watch-collapse[open]>summary{border-bottom:1px solid var(--line)}
/* 中身の余白を整える（折りたたみ内では既存マージンを打ち消す） */
.watch-collapse .side-bid-list{margin:0;padding:6px 10px;max-height:140px;overflow:auto}
.watch-collapse fieldset.field{margin:0;padding:8px 12px;border:none}
.watch-collapse fieldset.field legend{font-size:.76rem;margin-bottom:4px}

/* ===== 出品写真マネージャ（v79） ===== */
.pm-grid{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.pm-grid.has-items{margin-bottom:6px}
.pm-item{position:relative;width:96px;height:96px;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:var(--surface-2,#f4f2ee);cursor:grab;touch-action:none;box-shadow:0 1px 3px rgba(0,0,0,.08)}
/* 並び替えボタン付き：画像の下に操作バーを置くため、タイルを縦に伸ばす */
.pm-item.pm-has-controls{width:104px;height:auto;cursor:default}
.pm-item.pm-has-controls .pm-thumb{height:104px}
.pm-controls{display:flex;align-items:stretch;gap:2px;padding:3px;background:var(--surface,#fff);border-top:1px solid var(--line)}
.pm-move{flex:1 1 0;min-width:0;min-height:32px;padding:0;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--text,#222);font-size:.95rem;line-height:1;cursor:pointer;box-shadow:none;font-weight:700}
.pm-move:hover:not(:disabled){background:var(--wash-2,#f3efe3);border-color:var(--gold-3,#c9a227)}
.pm-move:disabled{opacity:.32;cursor:default}
.pm-move-main{color:var(--gold-4,#b8860b)}
.pm-item:active{cursor:grabbing}
.pm-item.pm-dragging{opacity:.45}
.pm-item.pm-over{outline:2px dashed var(--primary-3,#155eef);outline-offset:-2px}
.pm-thumb{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.pm-badge{position:absolute;top:3px;left:3px;min-width:22px;height:22px;line-height:22px;text-align:center;border-radius:50%;background:rgba(21,19,26,.82);color:#fff;font-weight:700;font-size:.86rem;font-family:'Oswald',sans-serif;padding:0 2px;z-index:2}
.pm-badge-main{background:var(--gold-4,#b8860b)}
.pm-main-tag{position:absolute;bottom:3px;left:3px;background:var(--gold-4,#b8860b);color:#fff;font-size:.62rem;font-weight:700;padding:1px 6px;border-radius:6px;z-index:2;letter-spacing:.04em}
.pm-item.pm-has-controls .pm-main-tag{top:3px;right:3px;left:auto;bottom:auto}
.pm-remove{position:absolute;top:2px;right:2px;width:22px;height:22px;border:none;border-radius:50%;background:rgba(200,30,30,.92);color:#fff;font-size:.8rem;font-weight:700;line-height:1;cursor:pointer;z-index:3;display:flex;align-items:center;justify-content:center;padding:0}
.pm-remove:hover{background:#b01818}
.pm-drop-active{outline:2px dashed var(--primary-3,#155eef);outline-offset:3px;background:var(--primary-3-soft,rgba(21,94,239,.06))}
.pm-hint{font-size:.78rem;color:var(--muted);margin-top:6px}

/* ===== 管理ページ（サブナビ・テーブル・分析） ===== */
.admin-subnav{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 18px}
.admin-subnav a{
  padding:7px 14px;border-radius:var(--radius-pill);font-size:.86rem;font-weight:600;
  color:var(--text-2);background:var(--surface-2);border:1px solid var(--line);text-decoration:none;transition:background .15s,color .15s;
}
.admin-subnav a:hover{background:var(--bg-subtle);text-decoration:none}
.admin-subnav a.is-active{background:var(--primary-3-soft);color:var(--primary-3);border-color:rgba(201,162,39,.3)}
.admin-search{display:flex;gap:8px;margin:0 0 16px;flex-wrap:wrap}
.admin-search input{flex:1;min-width:200px;padding:9px 14px;border:1px solid var(--line);border-radius:10px;font-family:inherit;font-size:.9rem;background:var(--surface)}
.table-card{padding:0;overflow:hidden}
.table-card.card{padding:0}
.data-table{width:100%;border-collapse:collapse;font-size:.88rem}
.data-table th,.data-table td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle}
.data-table thead th{background:var(--surface-2);font-weight:700;color:var(--text-2);font-size:.8rem;white-space:nowrap}
.data-table tbody tr:last-child td{border-bottom:none}
.data-table tbody tr:hover{background:var(--bg-subtle)}
.data-table .num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.data-table .link-strong{font-weight:700;color:var(--primary-3)}
.badge-danger{background:rgba(214,50,43,.12);color:var(--crimson,#D6322B)}
.admin-2col{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:860px){.admin-2col{grid-template-columns:1fr}}
/* 棒グラフ（日別） */
.bar-chart{display:flex;align-items:flex-end;gap:8px;min-height:150px;padding:8px 4px;overflow-x:auto}
.bar-col{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:34px;flex:1}
.bar-col .bar{width:60%;min-width:14px;background:var(--gold-grad,linear-gradient(180deg,#E7C65A,#C9A227));border-radius:6px 6px 0 0}
.bar-col .bar-val{font-size:.72rem;color:var(--muted);font-variant-numeric:tabular-nums}
.bar-col .bar-x{font-size:.68rem;color:var(--muted);white-space:nowrap}
/* ミニバー（種別シェア） */
.mini-bar{margin-top:5px;height:5px;border-radius:3px;background:var(--surface-2);overflow:hidden}
.mini-bar span{display:block;height:100%;background:var(--primary-3);border-radius:3px}
.form-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}

/* ===== コンタクト（通知）項目の操作性 ===== */
.notify-item.is-clickable{cursor:pointer;transition:box-shadow .15s,border-color .15s,transform .05s}
.notify-item.is-clickable:hover{box-shadow:var(--shadow-md,0 6px 20px rgba(15,32,53,.08));border-color:rgba(201,162,39,.35)}
.notify-item.is-clickable:active{transform:translateY(1px)}
.notify-action{
  display:inline-flex;align-items:center;gap:6px;margin-top:8px;
  padding:7px 14px;border-radius:var(--radius-pill);font-size:.84rem;font-weight:700;
  background:var(--primary-3-soft);color:var(--primary-3);text-decoration:none;border:1px solid rgba(201,162,39,.28);
}
.notify-action:hover{background:var(--gold-grad,var(--primary-3));color:#3a2c08;text-decoration:none}
.badge-unread{background:var(--crimson,#D6322B);color:#fff}
.notify-item.is-unread{border-left:3px solid var(--crimson,#D6322B)}

/* ==========================================================================
   v98: 買う/売るの色分け・カタログ残り時間・受け渡し・プレビュー・一括入札
   ========================================================================== */

/* --- 買う＝青系 / 売る＝金系 のアクセント変数 --- */
:root{
  --buy-accent:#2f6fd8; --buy-accent-2:#5b8def;
  --buy-grad:linear-gradient(135deg,#5b8def,#2f6fd8 70%,#1f57b8);
  --buy-soft:rgba(47,111,216,.12);
  --sell-accent:#C9A227; --sell-accent-2:#E7C65A;
  --sell-grad:linear-gradient(135deg,#FBEFB6,#E7C65A 40%,#C9A227 80%);
  --sell-soft:rgba(201,162,39,.14);
}

/* マイページ上部ハブ：現在モードのフラグ（どちらをやっているか一目で分かる） */
.shop-hub-mode-flag{
  position:relative;z-index:2;display:inline-flex;align-items:center;gap:6px;
  margin-bottom:12px;padding:5px 14px;border-radius:999px;
  font-size:.82rem;font-weight:800;letter-spacing:.02em;
}
.shop-hub-mode-flag .ic{font-size:1rem;}
.shop-hub-buyer .shop-hub-mode-flag{background:var(--buy-soft);color:#bcd4ff;border:1px solid rgba(91,141,239,.5);}
.shop-hub-seller .shop-hub-mode-flag{background:var(--sell-soft);color:#f0d985;border:1px solid var(--gold-line);}

/* ハブ全体の縁取りも現在モードの色に */
.shop-hub-buyer{box-shadow:0 14px 38px rgba(21,19,26,.28),0 0 0 2px rgba(91,141,239,.45) inset;}
.shop-hub-seller{box-shadow:0 14px 38px rgba(21,19,26,.28),0 0 0 2px rgba(231,198,90,.45) inset;}

/* 切り替えボタン：選択中は各モードの色で塗る（買う＝青・売る＝金） */
.shop-mode-buyer.is-current{background:var(--buy-grad);border-color:transparent;color:#fff;}
.shop-mode-buyer.is-current span{color:rgba(255,255,255,.82);}
.shop-mode-seller.is-current{background:var(--sell-grad);border-color:transparent;color:#3a2c08;}
.shop-mode-seller.is-current span{color:rgba(58,44,8,.72);}

/* ページ全体のモード色：買う＝青系 / 売る＝金系 をはっきり分ける。
   （data-mode は会員がログイン中のみ body に付与される：buyer=入札 / seller=出品） */

/* --- ページ背景をモードごとにはっきり色分け --- */
body[data-mode="buyer"]{background:#E8F0FD;}   /* 買う＝ライトブルー */
body[data-mode="seller"]{background:#FBF3D9;}  /* 売る＝ウォームゴールド */

/* --- 見出し（ページタイトル）の下線をモード色に --- */
body[data-mode="buyer"] .page-head h1{border-bottom:3px solid var(--buy-accent);display:inline-block;padding-bottom:4px;}
body[data-mode="seller"] .page-head h1{border-bottom:3px solid var(--sell-accent);display:inline-block;padding-bottom:4px;}

/* --- セクション見出しにモード色の縦バーを付ける（各ページで一目で分かる） --- */
body[data-mode="buyer"] .section-title h2,body[data-mode="buyer"] .section-title h3{border-left:5px solid var(--buy-accent);padding-left:10px;}
body[data-mode="seller"] .section-title h2,body[data-mode="seller"] .section-title h3{border-left:5px solid var(--sell-accent);padding-left:10px;}

/* --- 統計カードの上辺をモード色に --- */
body[data-mode="buyer"] .stat-card{border-top:3px solid var(--buy-accent);}
body[data-mode="seller"] .stat-card{border-top:3px solid var(--sell-accent);}

/* --- 主要ボタン（CTA）をモード色に。買うモードは青、売るモードは金（既定）。 --- */
body[data-mode="buyer"] .btn-primary,
body[data-mode="buyer"] button[type="submit"].btn-primary{
  background:var(--buy-grad);color:#fff;box-shadow:0 8px 22px rgba(47,111,216,.38);
}
body[data-mode="buyer"] .btn-primary:hover{background:var(--buy-grad);filter:brightness(1.04);box-shadow:0 12px 30px rgba(47,111,216,.5);}
body[data-mode="buyer"] .btn-secondary{color:var(--buy-accent);border-color:var(--buy-accent);}
body[data-mode="buyer"] .btn-secondary:hover{background:var(--buy-soft);border-color:var(--buy-accent);color:var(--buy-accent);}

/* --- ナビの現在モードバッジ：買う＝青 / 売る＝金 --- */
body[data-mode="buyer"] .mode-badge{background:var(--buy-grad);color:#fff;}
body[data-mode="seller"] .mode-badge{background:var(--sell-grad);color:#3a2c08;}

/* --- カード等の面は白のまま可読性を確保（背景色に埋もれないように） --- */
body[data-mode="buyer"] .card,body[data-mode="seller"] .card{background:var(--surface);}

/* --- カタログ：残り時間バッジを見やすく --- */
.auction-timer{
  display:inline-flex;align-items:center;gap:4px;
  left:8px;bottom:8px;padding:5px 10px;border-radius:999px;
  background:rgba(14,31,51,.86);color:#fff;font-weight:800;font-size:.82rem;
  box-shadow:0 4px 12px rgba(14,31,51,.28);backdrop-filter:blur(2px);
}
.auction-timer .auction-timer-ic{font-size:.9rem;line-height:1;}
.auction-timer .auction-timer-text{font-family:var(--font-num);letter-spacing:.02em;}
.auction-timer.is-soon{background:linear-gradient(135deg,#c97a1a,#e0992a);color:#fff;}
.auction-timer.is-urgent{background:linear-gradient(135deg,#c0271f,#e23b30);color:#fff;animation:timerpulse 1.1s ease-in-out infinite;}
@keyframes timerpulse{0%,100%{transform:scale(1);box-shadow:0 4px 12px rgba(214,50,43,.35);}50%{transform:scale(1.05);box-shadow:0 6px 18px rgba(214,50,43,.55);}}

/* --- 入札詳細：受け渡し方法（行頭マークと折返しを揃える） --- */
.delivery-list{list-style:none;margin:8px 0;padding:0;}
.delivery-list li{display:flex;align-items:flex-start;gap:8px;padding:6px 0;line-height:1.7;}
.delivery-list .delivery-mark{flex:0 0 auto;color:var(--primary-3);font-size:.7rem;line-height:1.9;}
.delivery-list .delivery-text{flex:1;min-width:0;}
.delivery-list .delivery-fee{color:var(--muted);font-size:.9em;white-space:nowrap;}

/* --- 出品プレビュー --- */
.preview-bar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  margin:0 0 14px;padding:12px 16px;border-radius:14px;
  background:linear-gradient(135deg,#2a2333,#3a2f1c);color:#fff;
  border:1px solid var(--gold-line);box-shadow:0 8px 22px rgba(20,18,24,.18);
  /* v163: プレビュー画面の最上部に常時表示（スクロールしても画面上部に固定） */
  position:sticky;top:calc(var(--topbar-h) + 8px);z-index:28;
}
@media (max-width:640px){
  .preview-bar{top:calc(var(--topbar-h) + 4px);padding:10px 12px;}
  .preview-bar-msg{font-size:.84rem;}
}
.preview-bar-msg{font-size:.9rem;line-height:1.6;flex:1 1 280px;}
.preview-bar-badge{display:inline-block;margin-right:8px;padding:3px 12px;border-radius:999px;background:var(--gold-grad);color:#3a2c08;font-weight:800;font-size:.78rem;}
.preview-bar-actions{display:flex;gap:8px;flex-wrap:wrap;flex:0 0 auto;}
.live-pill-preview{background:linear-gradient(135deg,#e7c65a,#c9a227);color:#3a2c08;}

/* --- 入札成立バナー（商品トップで確認） --- */
.bid-success-banner{
  display:flex;align-items:center;gap:10px;
  margin:0 0 16px;padding:14px 18px;border-radius:14px;
  background:linear-gradient(135deg,#1f8f5f,#2fae74);color:#fff;font-weight:800;
  box-shadow:0 10px 28px rgba(31,143,95,.35);animation:bidbanner .4s ease;
}
.bid-success-banner.is-fading{opacity:0;transition:opacity .6s ease;}
.bid-success-banner.is-outbid{
  background:linear-gradient(135deg,#a8322e,#c74b3f);
  box-shadow:0 10px 28px rgba(168,50,46,.35);
}
.bid-success-ic{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.25);font-size:1rem;}
@keyframes bidbanner{from{transform:translateY(-8px);opacity:0;}to{transform:translateY(0);opacity:1;}}

/* --- 出品者ダッシュボード：行内フォーム（再出品・削除） --- */
.listing-row-actions .inline-form{margin:0;}

/* --- マイページ：入札中の一括表示・その場入札 --- */
.livebid-list{display:flex;flex-direction:column;gap:12px;margin-top:8px;}
.livebid-row{display:flex;align-items:stretch;gap:16px;padding:14px 16px;flex-wrap:wrap;}
.livebid-main{display:flex;gap:12px;flex:1 1 260px;min-width:0;}
.livebid-thumb{flex:0 0 72px;width:72px;height:72px;border-radius:10px;overflow:hidden;background:var(--bg-subtle);}
.livebid-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.livebid-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px;}
.livebid-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.livebid-head a{text-decoration:none;color:inherit;}
.livebid-figures{line-height:1.7;}
.livebid-cur{font-family:var(--font-num);color:var(--crimson);}
.livebid-timer{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;background:var(--bg-subtle);color:var(--muted);font-size:.8rem;font-weight:700;}
.livebid-action{flex:0 0 auto;display:flex;flex-direction:column;gap:8px;min-width:220px;border-left:1px solid var(--line);padding-left:16px;}
.livebid-input-wrap{display:flex;flex-direction:column;gap:6px;}
.livebid-amount{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:8px;font-family:var(--font-num);font-size:1rem;}
.livebid-amount.ai-filled{background:var(--sell-soft);}
.livebid-quick{display:flex;gap:6px;}
.livebid-quick .quick-bid{flex:1;padding:6px 4px;font-size:.8rem;}
.livebid-delivery{padding:7px 10px;border:1px solid var(--border);border-radius:8px;font-size:.86rem;}
.livebid-msg{min-height:1em;color:var(--muted);}
.livebid-msg.is-error{color:var(--danger);}
.livebid-msg.is-ok{color:var(--success);font-weight:700;}
/* 「入札したオークション」一覧の行内入札（ダブルタップ不要でそのまま入札できる） */
.history-inline-bid{
  display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;
  margin-top:10px;padding-top:10px;border-top:1px dashed var(--line);
}
.history-inline-bid .livebid-input-row{flex:1 1 220px;min-width:200px;}
.history-inline-bid .livebid-amount{max-width:220px;}
.history-inline-bid .livebid-quick{max-width:220px;}
.history-inline-bid .livebid-delivery{flex:0 0 auto;}
.history-inline-bid .livebid-submit{flex:0 0 auto;}
.history-inline-bid .livebid-msg{flex:1 1 100%;}
@media(max-width:640px){
  .livebid-action{border-left:none;padding-left:0;border-top:1px solid var(--line);padding-top:12px;min-width:0;width:100%;}
}

/* ===== 現在モードの常時表示バッジ（売／買）＝左下フローティング ===== */
/* 出品（売り）＝金 / 入札（買い）＝青。クリックで各マイページへ。 */
.mode-float{
  position:fixed;left:10px;bottom:14px;z-index:45;
  display:inline-flex;align-items:center;text-decoration:none;
}
.mode-float:hover{text-decoration:none}
.mode-float-ic{
  width:36px;height:36px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:1rem;line-height:1;
  border:2px solid rgba(255,255,255,.9);
  box-shadow:0 4px 12px rgba(0,0,0,.22);
}
body[data-mode="seller"] .mode-float-ic{background:var(--sell-grad);color:#3a2c08}
body[data-mode="buyer"] .mode-float-ic{background:var(--buy-grad);color:#fff}
.mode-float-tx{
  max-width:0;opacity:0;overflow:hidden;white-space:nowrap;
  margin-left:0;padding:4px 0;border-radius:999px;
  background:#fff;color:var(--ink,#2b2b2b);
  font-size:.75rem;font-weight:700;
  box-shadow:0 4px 12px rgba(0,0,0,.15);
  transition:max-width .25s ease,opacity .25s ease,padding .25s ease,margin-left .25s ease;
}
.mode-float:hover .mode-float-tx,
.mode-float:focus-visible .mode-float-tx{
  max-width:130px;opacity:1;padding:4px 12px;margin-left:6px;
}
@media (max-width: 900px){
  /* モバイルは下部ナビの上に退避 */
  .mode-float{
    left:8px;
    bottom:calc(var(--mobile-nav-h) + 12px + env(safe-area-inset-bottom));
  }
  .mode-float-ic{width:32px;height:32px;font-size:.9rem}
}
@media print{ .mode-float{display:none} }

/* ========== 商品の受け渡し連絡（落札後の当事者間メッセージ v121） ========== */
.badge-alert{background:var(--danger-soft);color:var(--danger);border-color:rgba(214,50,43,.30)}
.deal-unread-total{margin-left:8px;vertical-align:middle;font-size:.74rem}
/* 集計カード「落札・取引中」の新着コンタクトバッジ（気付きやすいよう軽く点滅） */
.stat-unread-badge{display:inline-flex;align-items:center;gap:3px;vertical-align:middle;margin-left:6px;padding:2px 8px;border-radius:var(--radius-pill);background:var(--danger);color:#fff;font-size:.72rem;font-weight:700;line-height:1.4;animation:statUnreadPulse 1.6s ease-in-out infinite}
@keyframes statUnreadPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.72;transform:scale(1.06)}}
@media (prefers-reduced-motion: reduce){.stat-unread-badge{animation:none}}
.listing-row.has-deal-unread{border-left:3px solid var(--danger)}
.deal-contact-btn{position:relative;white-space:nowrap}
.deal-unread-pill{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;margin-left:6px;border-radius:var(--radius-pill);background:var(--danger);color:#fff;font-size:.7rem;font-weight:700;line-height:1}

.deal-contact-card{border-left:3px solid var(--primary-3)}
.deal-contact-summary{margin-bottom:10px}
/* ---------- v124: 取引の進行状況バー ---------- */
.deal-steps{display:flex;list-style:none;margin:14px 0 10px;padding:0;counter-reset:none}
.deal-step{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;gap:6px;min-width:0}
.deal-step::before{content:"";position:absolute;top:13px;left:-50%;width:100%;height:2px;background:var(--border)}
.deal-step:first-child::before{display:none}
.deal-step.is-done::before{background:var(--primary-3)}
.deal-step-dot{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:.8rem;font-weight:700;background:var(--bg-subtle);border:2px solid var(--border);color:var(--muted);position:relative;z-index:1}
.deal-step.is-done .deal-step-dot{background:var(--primary-3);border-color:var(--primary-3);color:#fff}
.deal-step.is-current .deal-step-dot{border-color:var(--primary-3);color:var(--primary-3);background:#fff;box-shadow:0 0 0 4px rgba(154,123,26,.15);animation:deal-step-pulse 1.8s ease-in-out infinite}
@keyframes deal-step-pulse{0%,100%{box-shadow:0 0 0 3px rgba(154,123,26,.12)}50%{box-shadow:0 0 0 6px rgba(154,123,26,.22)}}
.deal-step-label{font-size:.72rem;line-height:1.3;color:var(--muted);word-break:keep-all}
.deal-step.is-done .deal-step-label{color:var(--text)}
.deal-step.is-current .deal-step-label{color:var(--primary-3);font-weight:700}
.deal-step-now{display:block;font-size:.62rem;color:#fff;background:var(--primary-3);border-radius:999px;padding:1px 7px;margin-top:2px;font-weight:700;letter-spacing:.05em}
.deal-steps-confirm{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:10px}
.deal-confirm-chip{font-size:.75rem;padding:4px 10px;border-radius:999px;border:1px solid var(--border);background:var(--bg-subtle);color:var(--muted)}
.deal-confirm-chip.is-done{border-color:var(--primary-3);color:var(--primary-3);background:rgba(154,123,26,.08);font-weight:700}
.deal-steps-note{margin:0 0 12px}
@media (max-width:640px){
  .deal-step-label{font-size:.64rem}
  .deal-step-dot{width:22px;height:22px;font-size:.72rem}
}

.deal-msg-thread{display:flex;flex-direction:column;gap:10px;max-height:380px;overflow-y:auto;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--bg-subtle);margin-bottom:12px}
.deal-msg{display:flex;flex-direction:column;max-width:78%}
.deal-msg.is-mine{align-self:flex-end;align-items:flex-end}
.deal-msg.is-other{align-self:flex-start;align-items:flex-start}
.deal-msg-meta{margin-bottom:2px}
.deal-msg-bubble{padding:9px 12px;border-radius:12px;line-height:1.7;font-size:.92rem;word-break:break-word;white-space:normal}
.deal-msg.is-mine .deal-msg-bubble{background:var(--primary-3-soft);border:1px solid rgba(201,162,39,.35);border-bottom-right-radius:4px}
.deal-msg.is-other .deal-msg-bubble{background:var(--surface);border:1px solid var(--border);border-bottom-left-radius:4px}
.deal-msg-form{display:flex;flex-direction:column;gap:8px}
.deal-msg-form textarea{resize:vertical}
.deal-msg-form-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.deal-msg-status.is-ok{color:var(--success)}
.deal-msg-status.is-error{color:var(--danger)}
@media (max-width:640px){
  .deal-msg{max-width:92%}
  .deal-msg-thread{max-height:320px}
}

/* ========== 出品一覧のグループ分け（v122） ========== */
/* 出品中バッジ：緑（開催中であることをひと目で） */
.badge-live{background:var(--success-soft);color:var(--success);border:1px solid rgba(31,143,95,.35);display:inline-flex;align-items:center;gap:5px;font-weight:700}
.badge-live .live-dot{width:7px;height:7px;border-radius:50%;background:var(--success);animation:livepulse 1.1s infinite}
/* 落札なしで終了バッジ：ダークグレー（終わった商品であることをひと目で） */
.badge-ended{background:#3A3A3A;color:#D9D9D9;border:1px solid #555}

.listing-group{margin-bottom:26px}
.listing-group-head{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.listing-group-title{margin:0;font-size:1.02rem}
.listing-group-mark{font-size:.9rem;line-height:1}
.mark-ended{color:#7A7A7A}
.mark-live{color:var(--success);animation:livepulse 1.1s infinite}
.mark-draft{color:var(--text-2)}

/* 落札なしで終了の行：全体をトーンダウンし、左に濃いグレーの帯 */
.listing-row-ended{border-left:4px solid #5A5A5A;background:var(--bg-subtle)}
.listing-row-ended .listing-row-thumb img{filter:grayscale(.85);opacity:.75}
.listing-row-ended .listing-row-head strong{color:var(--text-2)}

/* 出品中の行：左に緑の帯で「動いている」ことを強調 */
.listing-row-live{border-left:4px solid var(--success)}

/* 下書きの行：点線ボーダーで未公開を表現 */
.listing-group-draft .listing-row{border-left:4px dashed var(--border)}

/* ===== マイページ：集計カードのクリックでしぼり込み（①） ===== */
.stat-card-filter,
.stat-card-link{
  cursor:pointer;
  text-decoration:none;
  color:inherit;
  display:block;
  transition:box-shadow .15s ease, border-color .15s ease, transform .05s ease;
  position:relative;
}
.stat-card-filter:hover,
.stat-card-link:hover{
  box-shadow:var(--shadow-md,0 6px 20px rgba(15,32,53,.10));
  border-color:rgba(201,162,39,.45);
}
.stat-card-filter:focus-visible,
.stat-card-link:focus-visible{
  outline:2px solid var(--primary-3,#9A7B1A);
  outline-offset:2px;
}
.stat-card-filter:active,
.stat-card-link:active{ transform:translateY(1px); }
/* クリックできることを示す小さな目印 */
.stat-card-filter::after,
.stat-card-link::after{
  content:"⌕";
  position:absolute;
  top:8px;right:10px;
  font-size:.8rem;
  color:var(--muted);
  opacity:.5;
}
.stat-card-link::after{ content:"›"; font-size:1rem; }
/* 選択中のカードを強調 */
.stat-card-filter.is-active{
  border-color:var(--primary-3,#9A7B1A);
  box-shadow:0 0 0 2px rgba(154,123,26,.28), var(--shadow-md,0 6px 20px rgba(15,32,53,.10));
}
.stat-card-filter.is-active::after{ content:"✓"; opacity:1; color:var(--primary-3,#9A7B1A); }

/* しぼり込み状態バー */
.dash-filter-bar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  margin:6px 0 14px;padding:9px 14px;
  background:rgba(154,123,26,.08);
  border:1px solid rgba(154,123,26,.28);
  border-radius:10px;
}
.dash-filter-label{font-weight:700;color:var(--text);font-size:.92rem}
.dash-filter-msg{margin:6px 0 14px}

/* ================= 落札お祝い演出（webaucCelebrate / celebration.js） ================= */
#webauc-celebration{position:fixed;top:0;right:0;bottom:0;left:0;inset:0;z-index:9999;pointer-events:none;overflow:hidden}
#webauc-celebration.cele-out{opacity:0;transition:opacity .6s ease}
.cele-canvas{position:absolute;top:0;left:0;inset:0;width:100%;height:100%}
/* 金色フラッシュ：発火の瞬間に画面全体を一瞬光らせる */
.cele-flash{position:absolute;top:0;right:0;bottom:0;left:0;inset:0;background:radial-gradient(circle at 50% 35%, rgba(255,244,200,.95), rgba(231,198,90,.55) 45%, rgba(231,198,90,0) 75%);opacity:0;animation:celeFlash .9s ease-out forwards}
@keyframes celeFlash{0%{opacity:0}12%{opacity:1}100%{opacity:0}}
/* 中央バナー＋回転する後光 */
.cele-banner-wrap{position:absolute;left:50%;top:34%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center}
.cele-rays{position:absolute;width:560px;height:560px;border-radius:50%;background:conic-gradient(from 0deg, rgba(231,198,90,.35) 0deg 14deg, rgba(231,198,90,0) 14deg 28deg, rgba(231,198,90,.35) 28deg 42deg, rgba(231,198,90,0) 42deg 56deg, rgba(231,198,90,.35) 56deg 70deg, rgba(231,198,90,0) 70deg 84deg, rgba(231,198,90,.35) 84deg 98deg, rgba(231,198,90,0) 98deg 112deg, rgba(231,198,90,.35) 112deg 126deg, rgba(231,198,90,0) 126deg 140deg, rgba(231,198,90,.35) 140deg 154deg, rgba(231,198,90,0) 154deg 168deg, rgba(231,198,90,.35) 168deg 182deg, rgba(231,198,90,0) 182deg 196deg, rgba(231,198,90,.35) 196deg 210deg, rgba(231,198,90,0) 210deg 224deg, rgba(231,198,90,.35) 224deg 238deg, rgba(231,198,90,0) 238deg 252deg, rgba(231,198,90,.35) 252deg 266deg, rgba(231,198,90,0) 266deg 280deg, rgba(231,198,90,.35) 280deg 294deg, rgba(231,198,90,0) 294deg 308deg, rgba(231,198,90,.35) 308deg 322deg, rgba(231,198,90,0) 322deg 336deg, rgba(231,198,90,.35) 336deg 350deg, rgba(231,198,90,0) 350deg 360deg);filter:blur(2px);animation:celeRays 6s linear infinite;mask-image:radial-gradient(circle, #000 30%, transparent 70%);-webkit-mask-image:radial-gradient(circle, #000 30%, transparent 70%)}
@keyframes celeRays{to{transform:rotate(360deg)}}
.cele-banner{position:relative;background:linear-gradient(160deg, #FFF8E1, #FBEFB6 55%, #F3DE8F);border:3px solid var(--primary-3, #9A7B1A);border-radius:18px;box-shadow:0 12px 40px rgba(154,123,26,.45), 0 0 0 6px rgba(255,255,255,.55);padding:22px 34px;text-align:center;animation:celeBanner .8s cubic-bezier(.22,1.6,.36,1) both}
@keyframes celeBanner{0%{transform:scale(.2) rotate(-6deg);opacity:0}60%{transform:scale(1.12) rotate(2deg);opacity:1}80%{transform:scale(.96) rotate(-1deg)}100%{transform:scale(1) rotate(0)}}
.cele-banner-title{font-family:var(--font-heading, serif);font-weight:800;font-size:clamp(1.3rem, 4.2vw, 2.2rem);color:#7A5E10;letter-spacing:.04em;text-shadow:0 2px 0 rgba(255,255,255,.8)}
.cele-banner-sub{margin-top:6px;font-weight:700;color:#8a6a17;font-size:clamp(.85rem, 2.4vw, 1.05rem)}
/* モノ降り（絵文字） */
.cele-fall{position:absolute;top:-48px;animation-name:celeFall;animation-timing-function:linear;animation-fill-mode:forwards;will-change:transform;filter:drop-shadow(0 2px 3px rgba(0,0,0,.18))}
@keyframes celeFall{0%{transform:translate(0,-48px) rotate(0deg)}25%{transform:translate(var(--sway,20px),25vh) rotate(90deg)}50%{transform:translate(calc(var(--sway,20px) * -1),50vh) rotate(200deg)}75%{transform:translate(var(--sway,20px),78vh) rotate(300deg)}100%{transform:translate(0,108vh) rotate(390deg)}}
/* 画面シェイク（発火直後の短時間だけ） */
body.cele-shake{animation:celeShake .55s ease-in-out}
@keyframes celeShake{0%,100%{transform:translate(0,0)}15%{transform:translate(-6px,3px)}30%{transform:translate(5px,-4px)}45%{transform:translate(-4px,-3px)}60%{transform:translate(4px,3px)}75%{transform:translate(-2px,2px)}90%{transform:translate(2px,-1px)}}
/* 動きを抑える設定へのフォールバック */
#webauc-celebration.cele-reduced .cele-flash,#webauc-celebration.cele-reduced .cele-rays{animation:none;opacity:.25}
#webauc-celebration.cele-reduced .cele-banner{animation:none}
@media (prefers-reduced-motion: reduce){body.cele-shake{animation:none}.cele-fall{animation-duration:.01s !important;opacity:0}}

/* 落札演出 強化版：バナーの鼓動＋輝きの掃引＋大粒モノ降り */
.cele-banner{animation:celeBanner .8s cubic-bezier(.22,1.6,.36,1) both, celePulse 1.4s ease-in-out .9s infinite;overflow:hidden}
@keyframes celePulse{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}
.cele-banner::after{content:'';position:absolute;top:-60%;left:-30%;width:34%;height:220%;transform:rotate(20deg);background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.85), rgba(255,255,255,0));animation:celeShine 1.8s ease-in-out .5s infinite}
@keyframes celeShine{0%{left:-40%}60%,100%{left:120%}}
.cele-fall-big{filter:drop-shadow(0 4px 6px rgba(0,0,0,.3));z-index:2}
@media (prefers-reduced-motion: reduce){.cele-banner{animation:none}.cele-banner::after{animation:none;display:none}}

/* ---------- ページ切り替えタブ（マイページ・下書き・終了・質問・通知などの常時表示タブ） ---------- */
.page-tabs{display:flex;gap:6px;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:2px 0 8px;margin:2px 0 10px;border-bottom:1px solid var(--border)}
.page-tabs::-webkit-scrollbar{display:none}
.page-tab{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:var(--radius-pill);font-size:.88rem;font-weight:600;color:var(--text-2);background:var(--surface);border:1px solid var(--border);white-space:nowrap;text-decoration:none;transition:background .15s,color .15s,border-color .15s}
.page-tab:hover{border-color:var(--primary-3);color:var(--primary-3)}
.page-tab.is-active{background:var(--gold-grad, var(--primary-3));color:#3a2c08;border-color:transparent;pointer-events:none}
.page-tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--primary-3);color:#fff;font-size:.74rem;font-weight:700;font-family:var(--num);line-height:1}
.page-tab.is-active .page-tab-count{background:rgba(58,44,8,.85);color:#fff}

/* ================= v152: マイページ整理・買うモードの配色統一 ================= */
/* --- 買う（入札）モードは青系ファミリーに統一する ---
   商品ページ（価格・リンク・入札カード）やデポジット関連が「売る（金）」と同じ色で
   紛らわしかったため、買うモードではゴールドの基調色を青系へ差し替える。
   （data-mode は会員ログイン中のみ body に付与：buyer=入札 / seller=出品） */
body[data-mode="buyer"]{
  --primary:#2f6fd8;
  --primary-2:#1f57b8;
  --primary-3:#2b66c8;              /* リンク・価格・アクセント */
  --primary-3-soft:rgba(47,111,216,.12);
  --primary-soft:rgba(47,111,216,.10);
  --primary-2-soft:rgba(91,141,239,.18);
  --bg-subtle:#EDF3FD;              /* 淡い青の地（金の地から差し替え） */
  --surface-2:#F7FAFF;
  --line:#DCE6F6;
  --line-strong:#C2D4EF;
  --border:#DCE6F6;
  --gold-line:rgba(47,111,216,.28);
  --shadow:0 1px 2px rgba(20,24,32,.04), 0 10px 28px rgba(47,111,216,.10);
}

/* デポジット残高の警告バナーも、買うモードでは青系にする（金＝売ると紛らわしいため） */
body[data-mode="buyer"] .deposit-warn{
  background:linear-gradient(135deg,#eef4ff,#dce9ff);
  border-color:#7ba3e8;
  box-shadow:0 6px 18px rgba(47,111,216,.16);
}
body[data-mode="buyer"] .deposit-warn-body{color:#2a4d8f;}
body[data-mode="buyer"] .deposit-warn-body strong{color:#1c3a70;}

/* デポジット情報カード：各モードの同系色の面にして、売る／買うで迷わない */
body[data-mode="buyer"] .stat-card[data-guide="deposit"]{background:var(--buy-soft);}
body[data-mode="seller"] .stat-card[data-guide="deposit"]{background:var(--sell-soft);}

/* デポジット情報セクション（＋デポジット入金・入出金一覧を1箇所に集約） */
.deposit-info-card{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:wrap;padding:18px 20px;
}
.deposit-info-balance{flex:1 1 220px;min-width:0;}
.deposit-info-actions{flex:0 0 auto;gap:10px;flex-wrap:wrap;}

/* ---------- 欲しい物の事前登録（v157）：複数選択＋まとめて登録 ---------- */
/* 複数選択のチェックリスト（カテゴリはスクロール、地域はグリッド） */
.alert-check-box{
  max-height:240px;overflow-y:auto;
  border:1px solid var(--line, #e3ddcf);border-radius:10px;
  background:var(--bg-subtle, #faf8f2);padding:6px 8px;
}
.alert-check-item{
  display:flex;align-items:center;gap:8px;
  padding:5px 6px;border-radius:8px;cursor:pointer;
  font-size:.92rem;line-height:1.35;
}
.alert-check-item:hover{background:rgba(154,123,26,.08)}
body[data-mode="buyer"] .alert-check-item:hover{background:rgba(47,111,216,.08)}
.alert-check-item input{flex:0 0 auto;width:16px;height:16px;accent-color:var(--primary-3,#9A7B1A)}
body[data-mode="buyer"] .alert-check-item input{accent-color:#2f6fd8}
.alert-check-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));
  gap:0 4px;max-height:220px;
}
.alert-picked-count{font-weight:400;margin-left:8px}
.alert-picked-count b{font-family:'Oswald',sans-serif}

/* 登録中の条件：種類ごとに1枚のカードへチップでひとまとめ */
.alert-group-card{margin-bottom:12px}
.alert-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.alert-chip{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 6px 5px 12px;border-radius:999px;
  background:var(--bg-subtle,#faf8f2);border:1px solid var(--line,#e3ddcf);
  font-size:.9rem;max-width:100%;
}
.alert-chip-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:320px}
.alert-chip .inline-form{display:inline-flex;margin:0}
.alert-chip-del{
  border:0;background:transparent;cursor:pointer;
  color:var(--muted,#8a8577);font-size:.85rem;line-height:1;
  padding:4px 6px;border-radius:999px;
}
.alert-chip-del:hover{color:#c0392b;background:rgba(192,57,43,.1)}
@media (max-width:560px){
  .alert-chip-label{max-width:200px}
  .alert-check-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}
}

/* ===== v161: 商品グリッドの表示列数切替（1〜4列） ===== */
.grid-cols-bar{display:flex;align-items:center;gap:6px;margin:2px 0 10px;justify-content:flex-end}
.grid-cols-label{margin-right:2px}
.grid-cols-btn{
  display:inline-flex;align-items:center;gap:4px;
  padding:6px 9px;min-height:36px;border:1px solid var(--line);
  border-radius:var(--radius-sm);background:var(--surface);color:var(--muted);
  font-size:.78rem;font-weight:700;cursor:pointer;line-height:1;
  transition:background .12s,color .12s,border-color .12s;
}
.grid-cols-btn:hover{border-color:var(--primary-3);color:var(--primary-3)}
.grid-cols-btn.is-active{background:var(--primary-3);border-color:var(--primary-3);color:#fff}
.grid-cols-ic{display:inline-flex;gap:2px}
.grid-cols-ic i{display:block;width:4px;height:12px;border-radius:1px;background:currentColor;opacity:.85}
/* v162: PC／スマホでボタンセットを出し分け（保存値も別々） */
.grid-cols-btn.for-sp{display:none}
.grid-cols-btn.for-pc{display:inline-flex}
@media (max-width:640px){
  .grid-cols-btn.for-sp{display:inline-flex}
  .grid-cols-btn.for-pc{display:none}
}
.grid-cols-unit{font-size:.62rem;font-weight:600;margin-left:1px;opacity:.8}
/* 列数の指定（切替バーで選択された場合）。未選択（data-cols無し）は従来のauto-fill。 */
.auction-grid[data-cols="1"]{grid-template-columns:1fr !important}
.auction-grid[data-cols="2"]{grid-template-columns:repeat(2,1fr) !important}
.auction-grid[data-cols="3"]{grid-template-columns:repeat(3,1fr) !important}
.auction-grid[data-cols="4"]{grid-template-columns:repeat(4,1fr) !important}
.auction-grid[data-cols="6"]{grid-template-columns:repeat(6,1fr) !important;gap:12px}
.auction-grid[data-cols="8"]{grid-template-columns:repeat(8,1fr) !important;gap:10px}
.auction-grid[data-cols="12"]{grid-template-columns:repeat(12,1fr) !important;gap:8px}
/* PC多列時の圧縮表示（6列〜） */
.auction-grid[data-cols="6"] .auction-card-body,
.auction-grid[data-cols="8"] .auction-card-body{padding:8px 9px 10px;gap:5px}
.auction-grid[data-cols="12"] .auction-card-body{padding:6px 7px 8px;gap:4px}
.auction-grid[data-cols="6"] .auction-title{font-size:.84rem;line-height:1.3}
.auction-grid[data-cols="8"] .auction-title{font-size:.76rem;line-height:1.25}
.auction-grid[data-cols="12"] .auction-title{font-size:.68rem;line-height:1.2;-webkit-line-clamp:2}
.auction-grid[data-cols="6"] .auction-price{font-size:1rem}
.auction-grid[data-cols="8"] .auction-price{font-size:.88rem}
.auction-grid[data-cols="12"] .auction-price{font-size:.78rem}
.auction-grid[data-cols="8"] .auction-meta,
.auction-grid[data-cols="12"] .auction-meta{display:none}
.auction-grid[data-cols="8"] .auction-bidcount{font-size:.66rem}
.auction-grid[data-cols="12"] .auction-bidcount{display:none}
.auction-grid[data-cols="6"] .auction-timer,
.auction-grid[data-cols="8"] .auction-timer{font-size:.66rem;padding:2px 6px;left:5px;bottom:5px}
.auction-grid[data-cols="12"] .auction-timer{font-size:.6rem;padding:1px 5px;left:4px;bottom:4px}
.auction-grid[data-cols="12"] .auction-timer-ic{display:none}
.auction-grid[data-cols="8"] .card-watch-btn{transform:scale(.85);transform-origin:top right}
.auction-grid[data-cols="12"] .card-watch-btn{transform:scale(.72);transform-origin:top right}
.auction-grid[data-cols="12"] .auction-new-badge{font-size:.56rem;padding:1px 5px}
/* 多列時は文字・余白を詰めて1画面に多く収める */
/* v163: 文字の被り・縦1文字折れ対策（全列数共通の安全策） */
.auction-card-body{min-width:0}
.auction-card-body>*{min-width:0}
.auction-timer{white-space:nowrap}
.auction-price{white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.auction-price-row{min-width:0}
/* PC 8・12列（カード幅が狭い）：価格行を縦積みにして被りを防ぐ */
.auction-grid[data-cols="8"] .auction-price-row,
.auction-grid[data-cols="12"] .auction-price-row{flex-direction:column;align-items:flex-start;gap:1px}
/* v163: 3・4列の圧縮スタイルはスマホ専用に変更（PCの4列は既定表示のため通常サイズで表示する） */
@media (max-width:640px){
  .auction-grid[data-cols="3"] .auction-card-body{padding:7px 8px 9px;gap:4px}
  .auction-grid[data-cols="4"] .auction-card-body{padding:6px 7px 8px;gap:3px}
  .auction-grid[data-cols="3"] .auction-title{font-size:.78rem;line-height:1.3}
  .auction-grid[data-cols="4"] .auction-title{font-size:.7rem;line-height:1.25}
  .auction-grid[data-cols="3"] .auction-price{font-size:.92rem}
  .auction-grid[data-cols="4"] .auction-price{font-size:.8rem}
  .auction-grid[data-cols="3"] .auction-meta,
  .auction-grid[data-cols="4"] .auction-meta{display:none}
  /* 価格行：横並び（価格⇔入札件数）をやめて縦積みにし、狭いカードでの被りをなくす */
  .auction-grid[data-cols="3"] .auction-price-row,
  .auction-grid[data-cols="4"] .auction-price-row{flex-direction:column;align-items:flex-start;gap:1px}
  .auction-grid[data-cols="3"] .auction-bidcount{font-size:.62rem}
  .auction-grid[data-cols="4"] .auction-bidcount{display:none}
  .auction-grid[data-cols="3"] .auction-timer{font-size:.62rem;padding:1px 5px;left:4px;bottom:4px}
  .auction-grid[data-cols="4"] .auction-timer{font-size:.58rem;padding:1px 4px;left:3px;bottom:3px}
  .auction-grid[data-cols="4"] .auction-timer-ic{display:none}
  .auction-grid[data-cols="4"] .auction-new-badge{font-size:.56rem;padding:1px 4px}
  .auction-grid[data-cols]{gap:10px}
  .auction-grid[data-cols="3"]{gap:8px}
  .auction-grid[data-cols="4"]{gap:6px}
  .auction-grid[data-cols="3"] .card-watch-btn{transform:scale(.85);transform-origin:top right}
  .auction-grid[data-cols="4"] .card-watch-btn{transform:scale(.7);transform-origin:top right}
  .grid-cols-bar{position:sticky;top:0;z-index:5;background:var(--bg,#f6f4ee);padding:6px 0;margin:0 0 8px;justify-content:flex-end}
}

/* ===== v161: スマホUI/UX改善 ===== */
@media (max-width:640px){
  /* iOSでフォーカス時に画面が拡大されないよう、入力系は16px以上にする */
  input[type="text"],input[type="number"],input[type="email"],input[type="tel"],
  input[type="password"],input[type="search"],input[type="date"],select,textarea{
    font-size:16px;min-height:44px;
  }
  /* タップしやすいボタンサイズ（44px目安） */
  .btn,button.btn{min-height:44px}
  .btn-sm{min-height:38px}
  /* 表は横スクロールで崩れを防ぐ（.table-scroll で包んだ表／素の .table 両対応） */
  .table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -2px}
  .table-scroll .table{min-width:520px}
  .card > table.table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}
  .card > table.table thead,.card > table.table tbody,.card > table.table tr{display:table;width:100%;table-layout:auto}
  /* カード内の余白・見出しの整理 */
  .section-title{font-size:1.02rem}
  .page-head h1{line-height:1.3}
  /* フィルタフォームは折りたたみ感を出すため余白を詰める */
  .filter-card{padding:12px}
  .filter-card .form-grid{gap:8px}
  /* デポジット関連 */
  .deposit-presets{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
  .deposit-presets .deposit-preset{width:100%}
  .refund-route-note{padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg-subtle,#faf8f2)}
  /* 通知やフラッシュの読みやすさ */
  .flash{line-height:1.6}
}
@media (min-width:641px){
  .refund-route-note{padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--bg-subtle,#faf8f2)}
  .table-scroll{overflow-x:auto}
}
.payout-schedule-box{margin:8px 0;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg-subtle,#faf8f2)}

/* ===== v164: カテゴリー段階選択（大分類→中分類→小分類） ===== */
.cat-cascade-row{display:flex;flex-direction:column;gap:8px}
.cat-cascade-row select{width:100%}
@media (min-width:641px){
  .cat-cascade-row{flex-direction:row;flex-wrap:wrap}
  .cat-cascade-row select{flex:1 1 200px;min-width:180px;width:auto}
}
.cat-cascade select.ai-filled{outline:2px solid var(--gold-line,#c9a227);transition:outline .3s}
/* 欲しいもの登録：追加したカテゴリのチップ */
.alert-cat-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.alert-cat-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--line);border-radius:999px;background:var(--bg-subtle,#faf8f2);font-size:.86rem;line-height:1.4}
.alert-cat-chip-del{border:0;background:transparent;color:var(--muted);font-size:1rem;line-height:1;cursor:pointer;padding:2px 4px;border-radius:50%}
.alert-cat-chip-del:hover{color:var(--danger,#c0392b);background:rgba(192,57,43,.08)}