/* ===== ボタン ===== */
.btn{
  font-family:'Zen Kaku Gothic New', sans-serif;
  font-size:15px;
  padding:11px 26px;
  border-radius:var(--radius-card);
  border:1px solid transparent;
  cursor:pointer;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
  text-decoration:none;
  display:inline-block;
}
.btn:focus-visible{ outline:2px solid var(--plum); outline-offset:2px; }
.btn-ghost{ background:transparent; color:var(--plum-deep); border-color:var(--plum-deep); }
.btn-ghost:hover{ background:var(--plum-deep); color:var(--white); }
.btn-primary{ background:var(--plum-deep); color:var(--white); }
.btn-primary:hover{ background:var(--plum); }
.btn-text{
  background:transparent; color:var(--ink-soft); border-color:transparent;
  text-decoration:underline; padding:11px 10px;
}
.btn-text:hover{ color:var(--plum-deep); }
.btn-danger{ background:transparent; color:var(--danger); border-color:var(--danger); }
.btn-danger:hover{ background:var(--danger); color:var(--white); }
.btn-sm{ padding:8px 16px; font-size:13px; }

/* ===== モーダル ===== */
.modal-overlay{
  position:fixed; inset:0; background: rgba(46,36,34,.55);
  display:none; align-items:center; justify-content:center;
  padding: 24px; z-index:100;
}
.modal-overlay.is-open{ display:flex; }
.modal-card{
  background:var(--cream); width:100%; max-width:440px;
  border-radius:6px; box-shadow: var(--shadow-card);
  padding: 40px 36px 36px;
  max-height:92vh; overflow-y:auto;
  position:relative;
}
.modal-close{
  position:absolute; top:16px; right:16px;
  background:none; border:none; font-size:22px; line-height:1;
  color:var(--ink-soft); cursor:pointer; padding:6px;
}
.modal-close:hover{ color:var(--plum-deep); }
.modal-logo{
  width:44px; height:44px; border-radius:50%;
  background: linear-gradient(135deg, var(--gold), var(--plum));
  display:flex; align-items:center; justify-content:center;
  color:var(--white); font-family:'Shippori Mincho', serif; font-weight:700;
  margin:0 auto 20px;
}
.modal-title{ text-align:center; font-size:22px; font-weight:600; color:var(--plum-deep); margin:0 0 6px; }
.modal-subtitle{ text-align:center; font-size:13px; color:var(--gold); letter-spacing:.03em; margin:0 0 16px; }
.modal-desc{ text-align:center; font-size:14px; color:var(--ink-soft); margin:0 0 28px; }

/* ===== ラジオボタン風トグル（会員区分選択など） ===== */
.role-toggle{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:26px; }
.role-toggle input{ position:absolute; opacity:0; pointer-events:none; }
.role-toggle label{
  display:block; text-align:center; padding:14px 8px;
  border:1px solid var(--hairline); border-radius:4px;
  font-size:13px; color:var(--ink-soft); cursor:pointer;
  transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}
.role-toggle label strong{ display:block; font-size:14px; color:var(--ink); margin-bottom:3px; font-weight:700;}
.role-toggle input:checked + label{ border-color: var(--plum-deep); background: var(--rose); color:var(--plum-deep); }
.role-toggle input:checked + label strong{ color:var(--plum-deep); }
.role-toggle input:focus-visible + label{ outline:2px solid var(--plum-deep); outline-offset:2px; }

/* ===== フォーム ===== */
.field{ margin-bottom:18px; }
.field label{ display:block; font-size:13px; color:var(--ink); margin-bottom:7px; font-weight:500; }
.field .required{ color:var(--plum); font-size:11px; margin-left:4px; }
.field .hint{ font-size:12px; color:var(--ink-soft); margin-top:5px; }
.field input[type="text"],
.field input[type="email"],
.field input[type="password"],
.field input[type="number"],
.field select,
.field textarea{
  width:100%; padding:12px 14px; font-size:15px;
  border:1px solid var(--hairline); border-radius:4px;
  background:var(--white); color:var(--ink);
  font-family:'Zen Kaku Gothic New', sans-serif;
}
.field textarea{ resize:vertical; min-height:120px; }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible{
  outline:2px solid var(--plum-deep); outline-offset:1px; border-color:var(--plum-deep);
}

.form-links{ text-align:right; margin:-8px 0 22px; }
.form-links a{ font-size:13px; color:var(--plum); text-decoration:underline; }

.charter-note{
  font-size:12.5px; color:var(--ink-soft); background:var(--cream-deep);
  border-radius:4px; padding:14px 16px; margin-bottom:16px;
}
.charter-note a{ color:var(--plum-deep); text-decoration:underline; }

.agree-row{ display:flex; align-items:flex-start; gap:10px; margin-bottom:24px; }
.agree-row input{ margin-top:3px; }
.agree-row label{ font-size:13px; color:var(--ink); }

.submit-btn{
  width:100%; padding:14px; font-size:15px; border:none; border-radius:4px;
  background:var(--plum-deep); color:var(--white); cursor:pointer;
  font-family:'Zen Kaku Gothic New', sans-serif; font-weight:500;
  transition: background-color .2s ease;
}
.submit-btn:hover{ background:var(--plum); }
.submit-btn:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }

.switch-link{ text-align:center; font-size:13px; color:var(--ink-soft); margin-top:18px; }
.switch-link button{
  background:none; border:none; color:var(--plum-deep); text-decoration:underline;
  cursor:pointer; font-size:13px; padding:0; font-family:inherit;
}

.alert{
  background:#FBE9E7; border:1px solid #E3A79C; color:#7A2E1F;
  padding:12px 14px; border-radius:4px; font-size:13px; margin-bottom:20px;
}
.alert-success{
  background:#EAF4EA; border:1px solid #B7D8B7; color:#2E5C2E;
  padding:12px 14px; border-radius:4px; font-size:13px; margin-bottom:20px;
}

/* ===== 許可マトリクス表 ===== */
.matrix-wrap{ overflow-x:auto; border:1px solid var(--hairline); border-radius:6px; }
.matrix{ width:100%; border-collapse:collapse; min-width:560px; background:var(--white); }
.matrix caption{ caption-side:top; text-align:left; font-size:13px; color:var(--ink-soft); padding:14px 18px 0; }
.matrix th, .matrix td{ padding:13px 16px; font-size:14px; text-align:center; border-bottom:1px solid var(--hairline); }
.matrix thead th{ font-size:13px; color:var(--ink-soft); font-weight:500; }
.matrix td:first-child, .matrix th:first-child{ text-align:left; color:var(--ink); font-weight:500; }
.matrix tbody tr:last-child td{ border-bottom:none; }
.matrix .ok{ color:var(--success); font-weight:700; }
.matrix .ng{ color:var(--danger); }
.matrix .cond{ color:var(--gold); font-size:12.5px; }
.matrix-note{ font-size:12.5px; color:var(--ink-soft); margin-top:14px; }

/* ===== タブ ===== */
.tabs{
  max-width:1200px; margin:0 auto; padding: 0 6vw; display:flex; gap:8px;
  border-bottom:1px solid var(--hairline); margin-top:36px;
}
.tab-btn{
  background:none; border:none; padding:14px 6px; margin-right:22px;
  font-family:'Zen Kaku Gothic New', sans-serif; font-size:15px; color:var(--ink-soft);
  cursor:pointer; border-bottom:2px solid transparent; position:relative; top:1px;
}
.tab-btn.is-active{ color:var(--plum-deep); border-bottom-color:var(--plum-deep); font-weight:700; }
.tab-btn:focus-visible{ outline:2px solid var(--plum-deep); outline-offset:2px; }
.tab-panel{ max-width:1200px; margin:0 auto; padding: 40px 6vw 8vw; display:none; }
.tab-panel.is-active{ display:block; }
.tab-panel-note{ font-size:13px; color:var(--ink-soft); margin:0 0 28px; }

/* ===== 出品カード ===== */
.listing-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:24px; }
.listing-card{
  background:var(--white); border:1px solid var(--hairline); border-radius:6px;
  overflow:hidden; display:flex; flex-direction:column;
}
.listing-thumb{
  height:140px; background: linear-gradient(135deg, var(--rose), var(--cream-deep));
  display:flex; align-items:center; justify-content:center;
  color:var(--plum); font-family:'Shippori Mincho', serif; font-size:14px;
  position:relative;
}
.favorite-btn{
  position:absolute; top:10px; right:10px;
  width:32px; height:32px; border-radius:50%; border:none;
  background:rgba(255,255,255,.85); color:var(--ink-soft);
  font-size:15px; line-height:1; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition: color .15s ease, transform .1s ease;
}
.favorite-btn:hover{ transform:scale(1.08); }
.favorite-btn.is-favorited{ color:#D6395C; }
.favorite-btn:focus-visible{ outline:2px solid var(--plum-deep); outline-offset:2px; }
.listing-body{ padding:20px; display:flex; flex-direction:column; gap:10px; flex:1; }
.listing-tag{ font-size:11px; color:var(--gold); letter-spacing:.03em; }
.listing-title{ font-size:16px; color:var(--ink); font-weight:700; margin:0; }
.listing-by{ font-size:12.5px; color:var(--ink-soft); }
.listing-desc{ font-size:13.5px; color:var(--ink-soft); flex:1; }
.listing-footer{ display:flex; align-items:center; justify-content:space-between; margin-top:6px; }
.listing-price{ font-size:15px; color:var(--plum-deep); font-weight:700; }
.listing-cta{
  font-size:13px; padding:9px 16px; border-radius:4px; border:1px solid var(--plum-deep);
  background:transparent; color:var(--plum-deep); cursor:pointer;
  font-family:'Zen Kaku Gothic New', sans-serif;
}
.listing-cta:hover{ background:var(--plum-deep); color:var(--white); }
.listing-status{
  font-size:11px; padding:3px 10px; border-radius:20px; display:inline-block;
}
.listing-status.published{ background:#EAF4EA; color:#2E5C2E; }
.listing-status.draft{ background:var(--cream-deep); color:var(--ink-soft); }
.listing-status.hidden{ background:#FBE9E7; color:#7A2E1F; }

.banner-note{
  background:var(--cream-deep); border:1px dashed var(--gold); border-radius:6px;
  padding:16px 20px; font-size:13px; color:var(--ink-soft); margin-bottom:28px;
}

.empty-state{
  text-align:center; padding:40px 20px; color:var(--ink-soft); font-size:14px;
  border:1px dashed var(--hairline); border-radius:6px;
}

@media (max-width: 860px){
  .listing-grid{ grid-template-columns:1fr; }
  .tabs{ overflow-x:auto; }
}
