/* Aggregate geometry is decorative. Counts and controls remain native HTML. */
#referral-modal .referral-network--hologram { display:none; }
#referral-modal .referral-hologram {
  --rh-ink:#dfedf7;--rh-muted:#94afc9;--rh-edge:rgba(126,191,228,.22);
  position:relative;isolation:isolate;overflow:hidden;border:1px solid var(--rh-edge);border-radius:20px;
  background:radial-gradient(ellipse at 50% 38%,rgba(50,83,140,.21),transparent 62%),linear-gradient(135deg,#09131f,#101b30 62%,#0a1924);
  color:var(--rh-ink);touch-action:pan-y pinch-zoom;
}
#referral-modal .referral-hologram[hidden] { display:none; }
.referral-hologram__header { display:flex;justify-content:space-between;gap:12px;padding:17px 20px 0;align-items:center; }
.referral-hologram__eyebrow { font:700 10px/1.4 system-ui;letter-spacing:.24em;color:#84cbe3; }
.referral-hologram__tag { font:500 9px/1.4 system-ui;letter-spacing:.13em;color:var(--rh-muted);text-align:right; }
.referral-hologram__viewport { position:relative;height:460px;touch-action:pan-y pinch-zoom;background:radial-gradient(ellipse at 42% 49%,#21688132,transparent 48%),radial-gradient(ellipse at 66% 52%,#7654bd22,transparent 50%),repeating-linear-gradient(0deg,transparent 0 39px,#6caed108 40px),repeating-linear-gradient(90deg,transparent 0 39px,#6caed108 40px); }
.referral-hologram__caption { position:absolute;left:20px;top:18px;right:20px;display:flex;flex-direction:column;gap:5px;pointer-events:none; }
.referral-hologram__scene-title { font:650 21px/1.2 system-ui;color:var(--rh-ink);letter-spacing:-.03em; }
.referral-hologram__scene-detail { font:500 11px/1.5 system-ui;color:var(--rh-muted); }
.referral-hologram__canvas,.referral-hologram__fallback { display:block;width:100%;height:100%;pointer-events:none; }
.referral-hologram__canvas[hidden] { display:none; }
.referral-hologram__core { position:absolute;left:50%;top:49%;transform:translate(-50%,-50%);display:grid;place-items:center;width:42px;height:42px;border:1px solid #85e7fa;border-radius:50%;color:#e5fcff;background:radial-gradient(circle at 35% 25%,#296b85,#101a39 80%);box-shadow:inset 0 0 12px #6bdff540,0 0 0 5px #63d9f00c;font:800 12px/1.2 system-ui;pointer-events:none; }
.referral-hologram__status { margin:0;padding:0 20px 10px;text-align:center;color:var(--rh-muted);font:500 12px/1.5 system-ui; }
.referral-hologram__levels { display:flex;gap:7px;flex-wrap:wrap;justify-content:center;padding:16px 16px 8px; }
#referral-modal .referral-hologram button { min-height:34px;min-width:36px;margin:0;box-shadow:none;border:1px solid var(--rh-edge);border-radius:8px;background:rgba(131,172,210,.06);color:var(--rh-ink);padding:7px 10px;font:600 11px/1.3 system-ui;cursor:pointer; }
#referral-modal .referral-hologram__levels button { border-left:3px solid var(--referral-level-color); }
#referral-modal .referral-hologram button:hover,#referral-modal .referral-hologram button[aria-pressed="true"] { border-color:#8acbe6;background:rgba(92,183,223,.15);color:var(--rh-ink); }
#referral-modal .referral-hologram button:disabled { opacity:.42;cursor:default; }
#referral-modal .referral-hologram button:focus-visible,#referral-modal .referral-metric-focus:focus-visible { outline:2px solid #79d6ef;outline-offset:3px; }
.referral-hologram__controls { display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:center;border-top:1px solid var(--rh-edge);padding:13px 16px; }
.referral-hologram__groups { margin:0;padding:0 20px 9px;color:var(--rh-ink);font:500 11px/1.7 ui-monospace,monospace;overflow-wrap:anywhere;text-align:center;max-height:95px;overflow:auto; }
.referral-hologram__description { margin:0;padding:0 20px 16px;color:var(--rh-muted);font:400 11px/1.6 system-ui;text-align:center; }
#referral-levels [data-referral-level] { --referral-level-color:#5de5ff; }
#referral-levels .referral-metric-focus { display:inline-grid;place-items:center;vertical-align:middle;margin-left:9px;padding:0;box-sizing:border-box;width:32px;min-width:32px;max-width:32px;height:32px;min-height:32px;max-height:32px;flex:0 0 32px;color:var(--referral-level-color);border:1px solid currentColor;border-radius:50%;background:transparent;font-size:18px;line-height:1;cursor:pointer; }
#referral-levels .referral-metric-focus[aria-pressed="true"] { background:rgba(109,176,221,.2);box-shadow:0 0 0 3px rgba(109,176,221,.12); }
#referral-levels .referral-metric-bar { display:block;width:100%;height:3px;margin-top:7px;position:relative;background:rgba(127,158,186,.13);overflow:hidden;border-radius:3px; }
#referral-levels .referral-metric-bar::before { content:"";position:absolute;inset:0;background:var(--referral-level-color);transform:scaleX(var(--referral-ratio,0));transform-origin:left; }
#referral-levels .referral-metric-selected { background:rgba(91,182,219,.08); }
body[data-theme="day"] #referral-modal .referral-hologram { --rh-ink:#143b52;--rh-muted:#496b81;--rh-edge:rgba(43,100,133,.25);background:radial-gradient(ellipse at 50% 38%,rgba(110,161,210,.2),transparent 65%),linear-gradient(135deg,#f2f9fc,#e6eef8 62%,#eaf7f7); }
body[data-theme="day"] .referral-hologram__eyebrow { color:#2c6680; }
body[data-theme="day"] #referral-modal .modal-head { background:linear-gradient(110deg,#ecf8fc,#e9edfa)!important;color:#16394f!important; }
body[data-theme="day"] #referral-modal #referral-modal-title { color:#16394f!important; }
body[data-theme="day"] #referral-modal .modal-head .muted { color:#426980!important; }
body[data-theme="day"] .referral-hologram__core { background:#edf6fb;border-color:#347f9b;color:#143b52; }
body[data-theme="day"] #referral-levels .referral-metric-focus { color:var(--referral-level-day); }
body[data-theme="day"] #referral-levels .referral-metric-bar::before { background:var(--referral-level-day); }
body[data-theme="day"] #referral-modal .referral-hologram__levels button { border-left-color:var(--referral-level-day); }
@media(max-width:900px) {
  #referral-modal .referral-hologram { border-radius:16px; }
  .referral-hologram__viewport { height:380px; }
  .referral-hologram__caption { left:12px;right:12px;top:14px; }
  .referral-hologram__scene-title { font-size:18px; }
  .referral-hologram__header { padding:14px 12px 0;gap:8px; }
  .referral-hologram__tag { font-size:8px;letter-spacing:.06em; }
  .referral-hologram__controls { padding:12px 9px;gap:6px; }
  #referral-modal .referral-hologram button { min-height:40px;min-width:40px;padding:8px; }
  .referral-hologram__description { padding:0 12px 14px; }
  #referral-levels .referral-metric-bar { min-width:55px; }
}
@media(prefers-contrast:more) { #referral-modal .referral-hologram { --rh-muted:var(--rh-ink);--rh-edge:currentColor; } }
