.ip-panel { padding: 1rem 1.15rem 1.2rem; }
.ip-primary { min-height: 128px; display: flex; flex-direction: column; justify-content: center; padding: 1rem; background: var(--surface-2); border: 1px solid var(--border); border-radius: 15px; }
.ip-primary > span { color: var(--muted-2); font-size: .55rem; font-weight: 700; letter-spacing: .13em; }
.ip-primary > div { display: flex; align-items: center; flex-wrap: wrap; gap: .65rem; }
.ip-primary strong { color: var(--orange); font-size: clamp(1.35rem, 3vw, 2rem); overflow-wrap: anywhere; }
.ip-primary p { margin: .38rem 0 0; color: var(--text); font-size: .78rem; }
.copy-button { padding: .28rem .6rem; border: 1px solid rgba(232,93,4,.35); color: var(--orange); background: var(--orange-soft); border-radius: 999px; cursor: pointer; font-size: .62rem; font-weight: 600; }
.copy-button:disabled { opacity: .45; cursor: not-allowed; }
.detail-grid { display: grid; grid-template-columns: repeat(2, 1fr); margin: .65rem 0 0; }
.detail-grid > div { min-width: 0; padding: .7rem .45rem; border-bottom: 1px solid var(--border); }
.detail-grid > div:nth-last-child(-n+2) { border-bottom: 0; }
.detail-grid dt, .reputation-grid dt { color: var(--muted-2); font-size: .58rem; }
.detail-grid dd, .reputation-grid dd { margin: .2rem 0 0; overflow-wrap: anywhere; color: var(--text); font-size: .72rem; }
.badge, .status-badge { display: inline-flex; align-items: center; min-height: 23px; padding: .18rem .52rem; border-radius: 999px; font-size: .61rem; font-weight: 700; }
.badge.muted, .status-badge.muted { color: var(--muted); background: var(--bg-alt); }
.badge.clean, .status-badge.clean { color: #13814a; background: rgba(27,154,90,.12); }
.badge.risk, .status-badge.risk { color: #8d6600; background: rgba(228,161,0,.14); }
.badge.caution, .status-badge.caution { color: var(--orange-deep); background: var(--orange-soft); }
.badge.flagged, .status-badge.flagged { color: #b82f2f; background: rgba(217,59,59,.12); }
html[data-theme="dark"] .badge.clean, html[data-theme="dark"] .status-badge.clean { color: #76dfaa; }
html[data-theme="dark"] .badge.risk, html[data-theme="dark"] .status-badge.risk { color: #f0ca62; }
html[data-theme="dark"] .badge.flagged, html[data-theme="dark"] .status-badge.flagged { color: #ff9797; }
.skeleton-text { position: relative; color: transparent!important; overflow: hidden; background: var(--bg-alt); border-radius: 5px; }
.is-loading .skeleton-text::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent); animation: skeleton 1.25s infinite; }
html[data-theme="dark"] .is-loading .skeleton-text::after { background: linear-gradient(90deg, transparent, rgba(255,255,255,.09), transparent); }
.ip-panel:not(.is-loading) .skeleton-text { color: inherit!important; background: transparent; }
@keyframes skeleton { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
.blacklist-panel { min-height: 350px; padding: 1rem 1.15rem 1.2rem; }
.panel-loading, .empty-state { min-height: 300px; display: grid; place-items: center; align-content: center; text-align: center; color: var(--muted); }
.spinner { width: 34px; height: 34px; border: 3px solid var(--border); border-top-color: var(--orange); border-radius: 50%; animation: spin .8s linear infinite; }
.panel-loading p, .empty-state p { max-width: 420px; margin: .75rem 0 0; font-size: .72rem; }
.empty-state strong { color: var(--text-strong); }
@keyframes spin { to { transform: rotate(360deg); } }
.reputation-summary { display: grid; grid-template-columns: .8fr 1.2fr; gap: 1rem; padding: .8rem 0 1rem; border-bottom: 1px solid var(--border); }
.reputation-summary > div { display: flex; flex-direction: column; gap: .42rem; }
.reputation-summary span { color: var(--muted-2); font-size: .56rem; letter-spacing: .11em; }
.reputation-summary .status-badge { width: fit-content; font-size: .72rem; }
.score-wrap strong { color: var(--text-strong); font-size: 1.05rem; }
.score-bar { height: 6px; overflow: hidden; background: var(--bg-alt); border-radius: 7px; }
.score-bar span { display: block; width: 0; height: 100%; background: var(--success); transition: width .5s; }
.reputation-grid { display: grid; grid-template-columns: repeat(2, 1fr); margin: 0; }
.reputation-grid > div { padding: .78rem .4rem .25rem; }
.history-table-wrap { overflow: auto; background: var(--surface); border: 1px solid var(--border); border-radius: 16px; box-shadow: var(--shadow-sm); }
.history-table { width: 100%; min-width: 720px; border-collapse: collapse; }
.history-table th, .history-table td { padding: .82rem 1rem; text-align: left; border-bottom: 1px solid var(--border); font-size: .7rem; }
.history-table th { color: var(--muted-2); background: var(--surface-2); font-size: .56rem; letter-spacing: .1em; }
.history-table tr:last-child td { border-bottom: 0; }
.empty-cell { padding: 2rem!important; color: var(--muted); text-align: center!important; }

@media (max-width: 700px) {
  .detail-grid { grid-template-columns: 1fr; }
  .detail-grid > div:nth-last-child(2) { border-bottom: 1px solid var(--border); }
  .blacklist-panel { min-height: 280px; }
  .panel-loading, .empty-state { min-height: 230px; }
}

@media (max-width: 420px) {
  .reputation-summary { grid-template-columns: 1fr; }
  .reputation-grid { grid-template-columns: 1fr 1fr; }
}