/* TWINS v0.2.83 — compact secondary headers + relationship archive */

/* TWINトップ以外はロゴ行そのものを持たず、ページタイトルをコンパクトに中央配置。 */
.page-head{
  position:relative!important;
  min-height:42px!important;
  padding:7px 54px 8px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.page-head>div{min-width:0;text-align:center!important}
.page-head small{display:none!important}
.page-head h1{margin:0!important;font-size:17px!important;line-height:1.2!important;letter-spacing:.01em!important}
.page-head>.header-text-link,.page-head>.filter-btn{
  position:absolute!important;right:12px!important;top:50%!important;transform:translateY(-50%)!important;
  margin:0!important;padding:6px 9px!important;font-size:9px!important;border-radius:8px!important;
}
.nearby-head,.messages-page-head{padding-top:7px!important;padding-bottom:8px!important}

/* 個人ページだけは従来どおり左矢印のみ。高さを少し詰める。 */
.topbar.topbar-profile-only{height:48px!important;padding:0 14px!important}
.topbar-profile-back{width:36px!important;height:36px!important;font-size:30px!important;margin-left:-3px!important}

/* 関係カード右側をまとめ、解消ボタンを高さを増やしすぎず配置。 */
.relation-controls-v083{display:grid;gap:4px;align-items:center;justify-items:center}
.relation-controls-v083 .relation-flags-v080{padding:0!important}
.relation-end-form-v083{margin:0;width:100%}
.relation-end-form-v083 button{
  width:100%;border:0;background:transparent;color:#716b76;font-size:7px;line-height:1;padding:3px 2px;cursor:pointer;
}
.relation-end-form-v083 button:active{color:#b996aa}

/* 解消済みは関係ページの最下部へまとめる。 */
.relation-ended-v083{margin:12px 14px 22px;padding-top:11px;border-top:1px solid #ffffff0b}
.relation-ended-head-v083{display:flex;align-items:center;justify-content:space-between;padding:0 2px 7px}
.relation-ended-head-v083 h2{margin:0;font-size:10px;font-weight:700;color:#77717c}
.relation-ended-head-v083 span{font-size:8px;color:#5e5962}
.relation-ended-list-v083{display:grid;gap:5px}
.relation-ended-row-v083{display:grid;grid-template-columns:48px minmax(0,1fr) 14px;gap:9px;align-items:center;padding:6px 7px;border:1px solid #ffffff08;border-radius:9px;background:#ffffff025;opacity:.72}
.relation-ended-photo-v083{position:relative;display:block;width:48px;height:48px;overflow:hidden;border-radius:8px;background:#18151d}
.relation-ended-photo-v083 img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.relation-ended-photo-v083 .activity-corner{top:3px!important;right:3px!important;transform:scale(.78);transform-origin:top right}
.relation-ended-photo-v083 .status-now-corner{left:3px;top:3px;transform:scale(.78);transform-origin:top left}
.relation-ended-copy-v083{display:grid;gap:2px;min-width:0}
.relation-ended-copy-v083 strong{font-size:10px;color:#aaa4ae;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.relation-ended-copy-v083 small{font-size:8px;color:#68626d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.relation-ended-chevron-v083{font-size:17px;color:#4f4a53;text-align:center}

@media(max-width:520px){
  .page-head{min-height:39px!important;padding:6px 48px 7px!important}
  .page-head h1{font-size:16px!important}
  .page-head>.header-text-link,.page-head>.filter-btn{right:9px!important;padding:5px 7px!important;font-size:8px!important}
  .relation-end-form-v083 button{font-size:6.5px;padding-top:2px}
}
.relation-notice-v083{margin:0 14px 8px!important;padding:7px 9px!important;font-size:9px!important;border-radius:8px!important}