/* 設定の契約アップグレード以外のタブを、共通の読みやすい構成に整える。 */
.settings-main { background:#faf9f6; }
.settings-layout { grid-template-columns:190px minmax(0,1fr); gap:clamp(30px,4vw,56px); }
.settings-layout.is-upgrade-view { grid-template-columns:220px minmax(0,1fr); gap:18px; }
.settings-layout > div:last-child { min-width:0; }
.settings-mobile-hint { display:none; }
.settings-tabs { top:94px; gap:2px; padding:0 18px 0 0; border:0; border-right:1px solid #d9e0e6; border-radius:0; background:transparent; box-shadow:none; }
.settings-tab { min-height:48px; padding:12px 14px; border:0; border-left:3px solid transparent; border-radius:0 7px 7px 0; background:transparent; color:#506176; font-size:.9rem; font-weight:700; transition:background .18s ease,color .18s ease; }
.settings-tab:hover { background:#eef2f5; color:#193d6b; }
.settings-tab[aria-selected="true"] { border:0; border-left:3px solid #b79b68; background:#e9eff5; color:#193d6b; }
.settings-panel:not(#panel-upgrade) { gap:0; }
.settings-panel:not(#panel-upgrade) .public-section-head { width:100%; max-width:none; margin:0 0 30px; text-align:left; }
.settings-panel:not(#panel-upgrade) .public-section-head h2 { margin:0; color:#193453; font-size:clamp(1.75rem,3vw,2.3rem); line-height:1.35; letter-spacing:-.035em; }
.settings-panel:not(#panel-upgrade) .public-section-head h2::before { content:""; display:block; width:40px; height:3px; margin:0 0 18px; border-radius:2px; background:#b79b68; }
.settings-panel:not(#panel-upgrade) .public-section-head p { max-width:none; margin:10px 0 0; color:#58697d; font-size:.95rem; line-height:1.8; text-align:left; }

/* 現在の契約 */
#panel-contract .settings-card-grid { gap:16px; }
#panel-contract .settings-card { gap:16px; padding:24px; border:1px solid #dce4ea; border-radius:16px; background:#fff; box-shadow:0 10px 28px #142c480b; }
#panel-contract .settings-card-grid:has(> :only-child) { grid-template-columns:minmax(0,1fr); }
#panel-contract .settings-card h3 { color:#193453; font-size:1.18rem; line-height:1.5; }
#panel-contract .settings-card p { max-width:52ch; line-height:1.85; }
#panel-contract .settings-card .public-tag,#panel-contract .settings-card .public-badge { justify-self:start; padding:5px 11px; border-radius:999px; background:#eaf2ed; color:#246457; font-size:.74rem; font-weight:800; }
#panel-contract .settings-card .public-tag { background:#eff3f7; color:#52657c; }
#panel-contract .settings-kv { gap:0; margin-top:2px; border-top:1px solid #e7ebef; }
#panel-contract .settings-kv div { padding:11px 0; border-bottom:1px solid #e7ebef; }
#panel-contract .settings-kv dt { color:#65748a; font-size:.85rem; }
#panel-contract .settings-kv dd { color:#203a59; font-size:.9rem; }

/* 契約履歴 */
#panel-history .settings-table-wrap { border:1px solid #dce4ea; border-radius:14px; background:#fff; box-shadow:0 10px 28px #142c480b; }
#panel-history .settings-table { min-width:640px; }
#panel-history .settings-table thead th { padding:15px 18px; background:#edf2f6; color:#52657c; font-size:.78rem; }
#panel-history .settings-table tbody td { padding:18px; border-top:1px solid #e7ebef; }
#panel-history .settings-table tbody tr:nth-child(even) { background:#fff; }
#panel-history .settings-table tbody tr:hover { background:#f8fafc; }
#panel-history .settings-plan-name { color:#203a59; }
#panel-history .settings-date-text { color:#41566f; font-weight:600; }

/* 解約 */
#panel-cancel .settings-cancel-content { display:grid; justify-items:start; gap:14px; padding:30px; border:1px solid #dce4ea; border-radius:16px; background:#fff; box-shadow:0 10px 28px #142c480b; }
#panel-cancel .settings-cancel-content h3 { margin:0; color:#193453; font-size:1.28rem; line-height:1.5; }
#panel-cancel .settings-cancel-content > p { max-width:58ch; margin:0; color:#4c5f75; line-height:1.8; }
#panel-cancel .settings-card-actions { margin-top:5px; }
#panel-cancel .settings-card-actions[hidden],#panel-cancel .settings-cancel-guidance[hidden] { display:none; }
#panel-cancel .settings-card-actions .public-btn { min-height:48px; padding:12px 22px; border-radius:9px; background:#193d6b; box-shadow:0 8px 18px #193d6b21; }
#panel-cancel .settings-cancel-guidance { font-size:.84rem; }
#panel-cancel .settings-cancel-footnote { margin:20px 4px 0; color:#65748a; font-size:.82rem; line-height:1.8; }
#panel-cancel .settings-cancel-footnote[hidden] { display:none; }
#panel-cancel .settings-message.is-visible { margin-top:16px; }

/* よくある質問 */
#panel-faq .settings-faq { gap:0; border-top:1px solid #dce4ea; }
#panel-faq .settings-faq details,#panel-faq .settings-faq details[open] { border:0; border-bottom:1px solid #dce4ea; border-radius:0; background:transparent; box-shadow:none; }
#panel-faq .settings-faq summary { grid-template-columns:minmax(0,1fr) 28px; gap:16px; padding:23px 4px; color:#203a59; font-size:1rem; line-height:1.6; }
#panel-faq .settings-faq summary::before { content:none; }
#panel-faq .settings-faq summary::after { content:"＋"; width:28px; height:28px; border-radius:50%; background:#e9eff5; color:#193d6b; font-size:1rem; }
#panel-faq .settings-faq details[open] summary::after { content:"−"; }
#panel-faq .settings-faq details > p { max-width:75ch; padding:0 48px 24px 4px; color:#4c5f75; line-height:1.9; }
#panel-faq .settings-faq details > p::before { content:none; }
#panel-faq .settings-faq-answer { gap:18px; padding:0 48px 26px 4px; }
#panel-faq .settings-faq-answer::before { content:none; }
#panel-faq .settings-faq-upgrade { gap:6px; padding:0 0 0 16px; border:0; border-left:3px solid #b79b68; border-radius:0; background:transparent; }
#panel-faq .settings-faq-upgrade strong { color:#203a59; }
#panel-faq .settings-faq-upgrade p { color:#4c5f75; line-height:1.85; }

/* 基本情報 */
#panel-profile .settings-form { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 20px; max-width:760px; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
#panel-profile .public-field { min-width:0; color:#203a59; font-weight:700; }
#panel-profile .settings-field-label { display:flex; align-items:baseline; gap:9px; }
#panel-profile .public-field small { color:#718095; font-size:.74rem; font-weight:500; }
#panel-profile .public-field:first-child,#panel-profile .public-field:nth-child(4),#panel-profile .settings-form-actions { grid-column:1/-1; }
#panel-profile .public-input { width:100%; min-height:50px; margin-top:8px; border-color:#cbd6e1; border-radius:8px; background:#fff; box-shadow:0 3px 10px #142c4808; }
#panel-profile .public-input:focus { border-color:#557ca4; outline:2px solid #dbe9f5; outline-offset:0; }
#panel-profile .public-input:disabled { background:#f2f5f7; color:#64748b; }
#panel-profile .settings-form-actions { margin-top:6px; padding-top:22px; border-top:1px solid #dce3e9; }
#panel-profile .settings-form-actions .public-btn { min-height:48px; border-radius:9px; background:#193d6b; }
#panel-profile .settings-muted { color:#718095; font-size:.8rem; font-weight:500; }
#panel-profile .settings-message.is-visible { margin-top:16px; }

@media(max-width:900px) {
  .settings-layout,.settings-layout.is-upgrade-view { grid-template-columns:minmax(0,1fr); gap:32px; }
  .settings-tabs { position:static; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; padding:7px; border:1px solid #dce3e9; border-radius:12px; background:#fff; }
  .settings-tab { text-align:center; }
  .settings-tab[aria-selected="true"] { border-left:0; background:#193d6b; color:#fff; }
}
@media(max-width:640px) {
  .settings-layout,.settings-layout.is-upgrade-view { gap:12px; }
  .settings-mobile-hint { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0; color:#806538; font-size:.76rem; font-weight:800; }
  .settings-mobile-hint span { color:#6c7b8d; font-size:.7rem; font-weight:600; }
  .settings-tabs { display:flex; flex-wrap:nowrap; gap:8px; width:100%; min-width:0; overflow-x:auto; padding:0 1px 12px; border:0; border-bottom:1px solid #dce3e9; border-radius:0; background:transparent; box-shadow:none; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
  .settings-tabs::-webkit-scrollbar { display:none; }
  .settings-tab { flex:0 0 auto; width:auto; min-height:44px; padding:10px 14px; border:1px solid #d2dce6; border-radius:999px; background:#fff; color:#344e6c; font-size:.83rem; line-height:1.3; white-space:nowrap; }
  .settings-tab[aria-selected="true"] { border:1px solid #193d6b; background:#193d6b; color:#fff; }
  .settings-panel:not(#panel-upgrade) .public-section-head { margin-bottom:22px; }
  #panel-contract .settings-card { padding:20px; }
  #panel-cancel .settings-cancel-content { padding:22px; }
  #panel-faq .settings-faq summary { padding:18px 2px; font-size:.93rem; }
  #panel-faq .settings-faq details > p,#panel-faq .settings-faq-answer { padding-right:4px; }
  #panel-profile .settings-form { grid-template-columns:minmax(0,1fr); gap:17px; padding:0; }
  #panel-profile .public-field,#panel-profile .public-field:first-child,#panel-profile .public-field:nth-child(4),#panel-profile .settings-form-actions { grid-column:1; }
}
