#idol-tab-btn[hidden], #tab-idol-score[hidden], .idol-config-backdrop[hidden], .idol-gift-picker-backdrop[hidden] { display: none !important; }

#tab-idol-score { padding: 16px; }
.idol-shell { --idol-border: rgba(139, 161, 205, .22); --idol-panel: rgba(11, 24, 44, .92); min-height: calc(100vh - 98px); color: #eef4ff; }
.idol-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 18px; border: 1px solid var(--idol-border); border-radius: 16px; background: linear-gradient(135deg, rgba(18,34,61,.96), rgba(8,19,38,.96)); box-shadow: 0 18px 45px rgba(0,0,0,.22); }
.idol-title { display: flex; gap: 13px; align-items: center; }
.idol-title > .material-symbols-rounded { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; color: #9f8cff; background: linear-gradient(145deg, rgba(128,88,255,.30), rgba(35,211,238,.15)); font-size: 30px; }
.idol-title h1, .idol-header h2 { margin: 2px 0 0; font-size: 1.35rem; }
.idol-title p { margin: 5px 0 0; color: #91a4c5; font-size: .78rem; }
.idol-header-actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; justify-content: flex-end; }
.idol-ledger-status { display: inline-flex; gap: 7px; align-items: center; border: 1px solid rgba(52,211,153,.24); background: rgba(16,185,129,.10); color: #8df0c8; padding: 8px 11px; border-radius: 999px; font-size: .76rem; font-weight: 700; }
.idol-ledger-status i { width: 8px; height: 8px; border-radius: 50%; background: #34d399; box-shadow: 0 0 0 4px rgba(52,211,153,.12); }
.idol-ledger-status.error { color: #fecaca; background: rgba(239,68,68,.12); border-color: rgba(248,113,113,.3); }
.idol-ledger-status.error i { background: #fb7185; }
.idol-action-button { border: 1px solid rgba(130,151,191,.34); border-radius: 10px; padding: 9px 13px; background: #10213b; color: #dce7fa; font-weight: 700; display: inline-flex; align-items: center; gap: 7px; cursor: pointer; }
.idol-action-button.primary, .idol-config-modal footer .primary { background: linear-gradient(135deg,#7457f5,#5c4ad9); border-color: #8e79ff; color: white; }
.idol-action-button:hover { filter: brightness(1.13); }

.idol-score-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 13px; }
.idol-score-card { position: relative; overflow: hidden; min-height: 146px; border: 1px solid color-mix(in srgb, var(--idol-color) 46%, transparent); border-radius: 16px; padding: 15px 17px; background: linear-gradient(145deg, color-mix(in srgb, var(--idol-color) 19%, #0b172c), rgba(8,18,35,.96) 72%); }
.idol-score-card::after { content: ''; position: absolute; width: 150px; height: 150px; right: -75px; top: -82px; border-radius: 50%; background: var(--idol-color); filter: blur(45px); opacity: .20; pointer-events: none; }
.idol-score-card.leader { box-shadow: 0 0 0 1px color-mix(in srgb, var(--idol-color) 55%, transparent), 0 18px 45px rgba(0,0,0,.22); }
.idol-card-top { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.idol-rank { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; background: rgba(0,0,0,.25); color: #fff; font-weight: 900; }
.idol-symbol { display: inline-flex; align-items: center; gap: 6px; color: #c4d2ec; font-size: .72rem; max-width: 65%; }
.idol-symbol img { width: 25px; height: 25px; object-fit: contain; }
.idol-symbol span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.idol-score-card h2 { margin: 11px 0 0; font-size: 1.06rem; }
.idol-diamond-total { display: flex; align-items: baseline; gap: 7px; color: white; margin-top: 4px; }
.idol-diamond-total strong { font-size: clamp(1.75rem, 3vw, 2.55rem); line-height: 1; letter-spacing: -.04em; }
.idol-diamond-total span { color: #78b7ff; font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.idol-card-meta { display: flex; gap: 12px; color: #9aacca; font-size: .72rem; margin-top: 10px; }

.idol-control-strip { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1px; margin-top: 12px; border: 1px solid var(--idol-border); border-radius: 13px; overflow: hidden; background: var(--idol-border); }
.idol-control-strip > div { background: #0c1b31; padding: 10px 13px; min-width: 0; }
.idol-control-strip span { display: block; color: #8fa3c3; font-size: .67rem; margin-bottom: 4px; }
.idol-control-strip strong { display: block; font-size: 1.05rem; overflow: hidden; text-overflow: ellipsis; }
.idol-control-strip .warn strong { color: #fbbf24; }
.idol-control-strip .check strong { color: #5ee8bd; font-size: .85rem; padding-top: 3px; }
.idol-control-strip .check.bad strong { color: #fb7185; }

.idol-live-grid { display: grid; grid-template-columns: minmax(0, 1fr) 292px; gap: 12px; margin-top: 12px; }
.idol-ledger-panel, .idol-mc-panel { border: 1px solid var(--idol-border); border-radius: 15px; background: var(--idol-panel); overflow: hidden; }
.idol-ledger-panel > header, .idol-mc-panel > header { height: 62px; padding: 0 15px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--idol-border); }
.idol-ledger-panel h2, .idol-mc-panel h2 { margin: 2px 0 0; font-size: .96rem; }
.idol-ledger-panel > header > span { color: #8fa3c3; font-size: .72rem; }
.idol-ledger-table-wrap { height: min(430px, calc(100vh - 430px)); min-height: 270px; overflow: auto; }
.idol-ledger-table { width: 100%; border-collapse: collapse; font-size: .75rem; }
.idol-ledger-table th { position: sticky; top: 0; z-index: 2; background: #111f36; color: #91a4c5; text-align: left; padding: 10px; white-space: nowrap; border-bottom: 1px solid var(--idol-border); }
.idol-ledger-table td { padding: 9px 10px; border-bottom: 1px solid rgba(139,161,205,.10); vertical-align: middle; }
.idol-ledger-table tr.switch { background: rgba(124,92,255,.10); }
.idol-ledger-table tr.unassigned { background: rgba(245,158,11,.07); }
.idol-ledger-table img { width: 26px; height: 26px; object-fit: contain; vertical-align: middle; margin-right: 7px; }
.idol-user-cell strong, .idol-gift-cell strong { display: block; color: #f2f6ff; max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.idol-user-cell small, .idol-gift-cell small { color: #7f94b6; }
.idol-assignment-pill { display: inline-flex; padding: 4px 8px; border-radius: 999px; font-size: .68rem; font-weight: 800; background: rgba(122,97,255,.16); color: #c9bcff; white-space: nowrap; }
.idol-assignment-pill.none { background: rgba(245,158,11,.12); color: #fcd34d; }
.idol-empty-row td { text-align: center; color: #8196b8; padding: 45px 15px; }

.idol-mc-panel > header { justify-content: flex-start; }
.idol-mc-panel > header > .material-symbols-rounded { color: #a78bfa; font-size: 28px; }
.idol-mc-leader { margin: 13px; border-radius: 13px; padding: 14px; background: linear-gradient(145deg,rgba(124,92,255,.22),rgba(30,211,238,.08)); border: 1px solid rgba(145,119,255,.3); }
.idol-mc-leader small, .idol-mc-leader span { display: block; color: #9fb0ca; font-size: .7rem; }
.idol-mc-leader strong { display: block; font-size: 1.4rem; margin: 4px 0; }
.idol-recent-switches { padding: 0 14px 12px; }
.idol-recent-switches h3 { font-size: .8rem; color: #c8d6ec; margin: 8px 0; }
.idol-recent-switches ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.idol-recent-switches li { border: 1px solid rgba(139,161,205,.14); background: rgba(8,18,35,.55); border-radius: 9px; padding: 8px 9px; color: #9eb0cd; font-size: .7rem; }
.idol-recent-switches li strong { color: white; }
.idol-rule-note { display: flex; gap: 8px; margin: 0 13px 13px; padding: 10px; border-radius: 10px; color: #9aacca; background: rgba(31,46,70,.55); font-size: .68rem; line-height: 1.5; }
.idol-rule-note .material-symbols-rounded { color: #5ee8bd; }
.idol-rule-note p { margin: 0; }
.idol-rule-note strong { color: #dce7f8; display: block; }

.idol-config-backdrop { position: fixed; inset: 0; z-index: 10020; padding: 20px; display: grid; place-items: center; background: rgba(1,7,18,.78); backdrop-filter: blur(8px); }
.idol-config-modal { width: min(920px, 96vw); max-height: 92vh; overflow: auto; border: 1px solid rgba(151,128,255,.45); border-radius: 18px; background: #0a172b; box-shadow: 0 30px 100px rgba(0,0,0,.52); }
.idol-config-modal > header { padding: 18px 20px; display: flex; flex-flow: row nowrap; align-items: flex-start; justify-content: space-between; gap: 20px; margin: 0; text-align: left; border-bottom: 1px solid var(--idol-border); }
.idol-config-modal h2 { margin: 3px 0; }
.idol-config-modal p { color: #8fa3c3; margin: 0; font-size: .75rem; }
.idol-config-modal > header button { flex: 0 0 36px; width: 36px; height: 36px; padding: 0; display: grid; place-items: center; border: 0; background: transparent; color: #b8c6da; cursor: pointer; }
.idol-catalog-status { display: flex; gap: 8px; align-items: center; margin: 13px 18px 0; padding: 9px 11px; border: 1px solid rgba(34,211,238,.18); border-radius: 10px; background: rgba(34,211,238,.07); color: #9edfe9; font-size: .73rem; }
.idol-config-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 18px 0; }
.idol-config-toolbar > div { display: flex; align-items: center; gap: 8px; color: #d8e3f5; }
.idol-config-toolbar > div span { color: #8fa3c3; font-size: .72rem; }
.idol-config-toolbar button { display: inline-flex; align-items: center; gap: 6px; border: 1px solid rgba(139,123,255,.45); border-radius: 9px; padding: 8px 12px; background: rgba(116,87,245,.16); color: #d7d0ff; font-weight: 800; cursor: pointer; }
.idol-config-toolbar button:disabled { opacity: .45; cursor: not-allowed; }
.idol-config-live-note { display: flex; align-items: center; gap: 7px; margin: 10px 18px 0 !important; padding: 9px 11px; border: 1px solid rgba(251,191,36,.25); border-radius: 9px; background: rgba(245,158,11,.08); color: #fcd58b !important; }
.idol-config-live-note[hidden] { display: none; }
.idol-config-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px,1fr)); gap: 11px; padding: 13px 18px; }
.idol-config-card { padding: 13px; border: 1px solid rgba(139,161,205,.2); border-radius: 13px; background: rgba(15,30,52,.85); }
.idol-config-card-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.idol-config-card h3 { margin: 0; font-size: .84rem; color: #cdd9eb; }
.idol-remove-profile { border: 0; border-radius: 7px; padding: 5px; background: rgba(239,68,68,.09); color: #fb7185; cursor: pointer; }
.idol-remove-profile:disabled { opacity: .32; cursor: not-allowed; }
.idol-remove-profile .material-symbols-rounded { display: block; font-size: 18px; }
.idol-config-card label { display: grid; gap: 5px; color: #8fa3c3; font-size: .7rem; margin-top: 9px; }
.idol-config-card input, .idol-config-card select { min-width: 0; width: 100%; box-sizing: border-box; border: 1px solid rgba(139,161,205,.26); border-radius: 8px; padding: 9px; background: #071326; color: #edf4ff; }
.idol-config-card select { min-height: 42px; }
.idol-selected-gift { display: grid; grid-template-columns: 44px minmax(0,1fr) auto; align-items: center; gap: 9px; padding: 9px; border: 1px solid rgba(34,211,238,.22); border-radius: 10px; background: rgba(7,19,38,.72); }
.idol-selected-gift.empty { border-style: dashed; border-color: rgba(251,191,36,.34); }
.idol-selected-gift-visual { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 9px; background: rgba(255,255,255,.05); color: #8196b8; }
.idol-selected-gift-visual img { width: 36px; height: 36px; object-fit: contain; }
.idol-selected-gift-copy { min-width: 0; }
.idol-selected-gift-copy strong, .idol-selected-gift-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.idol-selected-gift-copy strong { color: #eef4ff; font-size: .77rem; }
.idol-selected-gift-copy small { color: #7890b2; font-size: .63rem; margin-top: 3px; }
.idol-choose-gift { border: 1px solid rgba(139,123,255,.42); border-radius: 8px; padding: 7px 8px; background: rgba(116,87,245,.15); color: #d4ccff; font-size: .67rem; font-weight: 800; cursor: pointer; white-space: nowrap; }
.idol-config-error { margin: 0 18px 13px; padding: 9px 11px; border: 1px solid rgba(248,113,113,.3); border-radius: 9px; color: #fecaca; background: rgba(239,68,68,.1); font-size: .75rem; }
.idol-config-modal footer { display: flex; justify-content: flex-end; gap: 9px; padding: 13px 18px 17px; border-top: 1px solid var(--idol-border); }
.idol-config-modal footer button { border: 1px solid rgba(139,161,205,.28); border-radius: 9px; padding: 9px 15px; background: #11223d; color: #eaf1fc; font-weight: 700; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; }

.idol-gift-picker-backdrop { position: fixed; inset: 0; z-index: 10030; padding: 20px; display: grid; place-items: center; background: rgba(1,7,18,.86); backdrop-filter: blur(10px); }
.idol-gift-picker { width: min(1080px, 97vw); height: min(820px, 94vh); display: grid; grid-template-rows: auto auto minmax(0,1fr) auto; overflow: hidden; border: 1px solid rgba(34,211,238,.34); border-radius: 18px; background: #08162a; box-shadow: 0 35px 110px rgba(0,0,0,.62); }
.idol-gift-picker > header { display: flex; flex-flow: row nowrap; align-items: flex-start; justify-content: space-between; gap: 18px; margin: 0; padding: 17px 20px; text-align: left; border-bottom: 1px solid var(--idol-border); }
.idol-gift-picker h2 { margin: 3px 0; font-size: 1.08rem; }
.idol-gift-picker header p { margin: 0; color: #89a0c2; font-size: .72rem; }
.idol-gift-picker header button { flex: 0 0 36px; width: 36px; height: 36px; padding: 0; display: grid; place-items: center; border: 0; background: transparent; color: #b8c6da; cursor: pointer; }
.idol-gift-picker-controls { display: grid; grid-template-columns: minmax(260px,1fr) 190px auto; align-items: end; gap: 10px; padding: 12px 18px; border-bottom: 1px solid var(--idol-border); }
.idol-gift-picker-controls label { display: grid; gap: 5px; color: #8fa3c3; font-size: .68rem; }
.idol-gift-picker-controls input, .idol-gift-picker-controls select { width: 100%; box-sizing: border-box; border: 1px solid rgba(139,161,205,.28); border-radius: 9px; padding: 9px 10px; background: #071326; color: #eef4ff; }
.idol-gift-search { position: relative; display: block; }
.idol-gift-search .material-symbols-rounded { position: absolute; left: 9px; top: 8px; color: #7185a4; font-size: 19px; pointer-events: none; }
.idol-gift-search input { padding-left: 34px; }
.idol-gift-picker-controls > strong { color: #9edfe9; font-size: .72rem; padding-bottom: 9px; white-space: nowrap; }
.idol-gift-picker-grid { overflow: auto; padding: 14px 18px; display: grid; grid-template-columns: repeat(auto-fill, minmax(135px,1fr)); align-content: start; gap: 9px; }
.idol-gift-tile { position: relative; min-height: 148px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; border: 1px solid rgba(139,161,205,.17); border-radius: 12px; padding: 10px 8px; background: rgba(13,29,51,.9); color: #eef4ff; cursor: pointer; }
.idol-gift-tile:hover { transform: translateY(-1px); border-color: rgba(34,211,238,.48); background: rgba(17,39,67,.96); }
.idol-gift-tile.selected { border-color: #8b78ff; box-shadow: inset 0 0 0 1px rgba(139,120,255,.55); }
.idol-gift-tile.used:not(.selected) { border-color: rgba(251,191,36,.32); }
.idol-gift-tile img, .idol-gift-placeholder { width: 64px; height: 64px; object-fit: contain; }
.idol-gift-placeholder { display: grid; place-items: center; color: #6f86a8; font-size: 42px; }
.idol-gift-tile strong { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .74rem; }
.idol-gift-tile small { color: #fbbf24; font-size: .64rem; }
.idol-gift-tile em { color: #fcd58b; font-size: .59rem; font-style: normal; }
.idol-gift-picker-empty { grid-column: 1 / -1; text-align: center; color: #8297b8; padding: 60px 10px; }
.idol-gift-picker > footer { display: flex; justify-content: flex-end; padding: 11px 18px; border-top: 1px solid var(--idol-border); }
.idol-gift-picker > footer button { border: 1px solid rgba(139,161,205,.28); border-radius: 9px; padding: 9px 15px; background: #11223d; color: #eaf1fc; font-weight: 700; cursor: pointer; }

@media (max-width: 1050px) {
  .idol-control-strip { grid-template-columns: repeat(3, 1fr); }
  .idol-live-grid { grid-template-columns: 1fr; }
  .idol-mc-panel { display: grid; grid-template-columns: 190px 1fr 1fr; align-items: start; }
  .idol-mc-panel > header { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  #tab-idol-score { padding: 9px; }
  .idol-header { align-items: flex-start; flex-direction: column; }
  .idol-score-grid, .idol-config-list { grid-template-columns: 1fr; }
  .idol-control-strip { grid-template-columns: repeat(2, 1fr); }
  .idol-mc-panel { display: block; }
  .idol-ledger-table { min-width: 820px; }
  .idol-config-toolbar { align-items: flex-start; }
  .idol-selected-gift { grid-template-columns: 40px minmax(0,1fr); }
  .idol-choose-gift { grid-column: 1 / -1; width: 100%; }
  .idol-gift-picker-controls { grid-template-columns: 1fr; }
  .idol-gift-picker-controls > strong { padding: 0; }
  .idol-gift-picker-grid { grid-template-columns: repeat(2, minmax(0,1fr)); padding: 10px; }
}

@media (max-height: 600px) {
  .idol-gift-picker-backdrop { padding: 8px; }
  .idol-gift-picker { height: calc(100vh - 16px); }
  .idol-gift-picker > header { align-items: center; padding: 8px 12px; }
  .idol-gift-picker > header .eyebrow, .idol-gift-picker > header p { display: none; }
  .idol-gift-picker h2 { margin: 0; font-size: .95rem; }
  .idol-gift-picker-controls { grid-template-columns: minmax(0,1fr) 140px auto; gap: 7px; padding: 7px 10px; }
  .idol-gift-picker-controls label { gap: 2px; }
  .idol-gift-picker-controls input, .idol-gift-picker-controls select { padding: 6px 8px; }
  .idol-gift-search input { padding-left: 31px; }
  .idol-gift-search .material-symbols-rounded { top: 5px; }
  .idol-gift-picker-controls > strong { padding-bottom: 7px; }
  .idol-gift-picker > footer { padding: 6px 10px; }
  .idol-gift-picker > footer button { padding: 6px 12px; }
}