/* プロフィール（仕様書 4.8） */
.profile-layout { display: grid; gap: var(--gap); }
.profile-main { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 24px; align-items: center; padding: 28px; }
.profile-avatar { width: 96px; height: 96px; font-size: 40px; }
.profile-name { font-size: 26px; overflow-wrap: anywhere; }
.profile-bio { margin-top: 6px; color: var(--text); white-space: pre-wrap; overflow-wrap: anywhere; }
.profile-actions { display: grid; gap: 8px; }
.edit-form { display: grid; gap: 14px; padding: 0 28px 24px; }

.stats-band .stat {
  display: grid; justify-items: center; gap: 0; padding: 12px 8px; border: 0; background: none; color: #fff; min-height: 64px;
}
button.stat:hover { background: var(--slate-divider); }
.stat-label { font-size: 12px; color: #DCE3EA; }
.stat strong { font-size: 22px; }
.stat .rating { color: var(--aqua); }

.history-scroll { overflow-x: auto; }
.history-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.history-table th { text-align: left; font-size: 12px; color: var(--text-sub); font-weight: 600; padding: 10px 16px; border-bottom: 1px solid var(--line-light); }
.history-table td { padding: 12px 16px; border-bottom: 1px solid var(--line-light); vertical-align: middle; }
.history-table tbody tr:nth-child(even) { background: var(--bg); }
.history-table .diff { display: block; font-size: 12px; font-weight: 700; margin-top: 2px; }
.diff.up { color: var(--aqua-text); }
.diff.down { color: var(--red-text); }
.history-table a { font-weight: 600; }
.history-list { display: none; }
.pager span { font-weight: 700; font-size: 14px; flex: 2 1 0; }
#history-loading:empty, #history-loading.hidden { display: none; }

/* 未ログイン */
.login-card { max-width: 640px; margin: 0 auto; }
.login-hero { background: var(--aqua); color: #fff; padding: 32px; display: grid; gap: 12px; }
.login-hero h1 { color: #fff; font-size: 24px; }
.login-list { list-style: none; display: grid; gap: 8px; }
.login-list li { padding-left: 22px; position: relative; font-weight: 600; }
.login-list li::before { content: ''; position: absolute; left: 0; top: 0.55em; width: 10px; height: 10px; background: #fff; }
.login-note { font-size: 13px; opacity: 0.95; }
.login-band { width: 100%; min-height: 56px; border: 0; background: var(--slate); color: #fff; font-weight: 700; font-size: 16px; display: flex; align-items: center; justify-content: center; gap: 10px; }
.login-band:hover { background: var(--slate-divider); }

/* フォローの一覧（ダイアログの中） */
.follow-list { list-style: none; max-height: 50vh; overflow-y: auto; margin: -4px 0; }
.follow-list li { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line-light); }
.follow-list li:last-child { border-bottom: 0; }
.follow-list a { flex: 1 1 auto; font-weight: 600; color: var(--ink); text-decoration: none; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.follow-list .btn { min-height: 36px; padding: 0 12px; font-size: 13px; }

@media (max-width: 767px) {
  .profile-main { grid-template-columns: auto minmax(0, 1fr); padding: 20px 16px; gap: 16px; }
  .profile-avatar { width: 64px; height: 64px; font-size: 28px; }
  .profile-name { font-size: 20px; }
  .profile-actions { grid-column: 1 / -1; grid-auto-flow: column; grid-auto-columns: 1fr; }
  .edit-form { padding: 0 16px 20px; }
  .stat strong { font-size: 18px; }
  .history-scroll { display: none; }
  .history-list { display: block; }
  .history-list .list-row { padding: 12px 16px; align-items: flex-start; }
  .history-list .grow { display: grid; gap: 2px; font-size: 14px; }
  .login-hero { padding: 24px 20px; }
}
.profile-actions .btn { white-space: nowrap; padding: 0 14px; }
.history-list .list-row > a { white-space: nowrap; font-size: 13.5px; }
