/* ── WORLD PRESENCE OVERLAY ── */
#world-presence{
  position:fixed;top:60px;right:0;
  width:220px;padding:14px 16px;
  background:rgba(4,3,9,0.78);
  border-left:1px solid rgba(var(--char-rgb),0.12);
  border-bottom:1px solid rgba(var(--char-rgb),0.08);
  backdrop-filter:blur(16px);
  transform:translateX(100%);transition:transform 0.4s cubic-bezier(0.4,0,0.2,1),opacity 0.4s,visibility 0.4s;
  opacity:0;visibility:hidden;z-index:50;
  border-radius:0 0 0 10px;
}
#world-presence.show{transform:translateX(0);opacity:1;visibility:visible}
.wp-world{font-family:var(--font-mono);font-size:8px;letter-spacing:0.18em;color:rgba(var(--char-rgb),0.5);text-transform:uppercase;margin-bottom:8px}
.wp-event{font-size:10px;color:var(--sub);line-height:1.5;padding:5px 0;border-bottom:1px solid var(--muted)}
.wp-event:last-child{border-bottom:none}
.wp-event-dot{display:inline-block;width:4px;height:4px;border-radius:50%;background:rgba(var(--char-rgb),0.5);margin-right:6px;vertical-align:middle}

/* ── NOTIFICATIONS DRAWER ── */
#notif-drawer{
  position:fixed;top:0;right:0;bottom:0;width:280px;
  background:rgba(6,5,18,0.96);
  border-left:1px solid var(--acc-border);
  backdrop-filter:blur(24px);
  transform:translateX(100%);transition:transform 0.3s cubic-bezier(0.4,0,0.2,1),visibility 0.3s;
  visibility:hidden;
  z-index:300;display:flex;flex-direction:column;
}
#notif-drawer.open{transform:translateX(0);visibility:visible}
.nd-header{
  padding:16px;border-bottom:1px solid var(--acc-border);
  display:flex;align-items:center;justify-content:space-between;
}
.nd-title{font-family:var(--font-mono);font-size:9px;letter-spacing:0.2em;color:var(--acc);text-transform:uppercase}
.nd-close{background:none;border:none;color:var(--sub);cursor:pointer;font-size:16px;line-height:1;padding:2px;transition:color 0.15s}
.nd-close:hover{color:var(--text)}
.nd-list{flex:1;overflow-y:auto;padding:8px}
.nd-list::-webkit-scrollbar{width:0}
.nd-item{
  padding:10px;border-radius:8px;
  border:1px solid transparent;
  margin-bottom:4px;cursor:pointer;
  transition:background 0.15s,border-color 0.15s;
}
.nd-item:hover{background:rgba(139,92,246,0.06);border-color:var(--acc-border)}
.nd-item.unread{border-left:2px solid var(--acc);padding-left:9px}
.nd-type{font-family:var(--font-mono);font-size:8px;letter-spacing:0.14em;color:var(--acc);text-transform:uppercase;margin-bottom:3px}
.nd-text{font-size:11px;color:var(--sub);line-height:1.45}
.nd-time{font-size:8px;color:var(--muted);margin-top:3px;letter-spacing:0.04em}

/* ── TOOLTIP ── */
#ud-tip{
  position:fixed;z-index:10000;pointer-events:none;
  background:rgba(8,7,26,0.96);
  border:1px solid rgba(var(--char-rgb),0.28);
  border-radius:7px;padding:6px 10px;
  font-family:var(--font-mono);font-size:8.5px;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--sub);line-height:1.5;
  max-width:240px;
  box-shadow:0 6px 24px rgba(0,0,0,0.5),0 0 12px rgba(var(--char-rgb),0.08);
  backdrop-filter:blur(12px);
  opacity:0;transform:translateY(2px);
  transition:opacity 0.15s ease,transform 0.15s ease;
}
#ud-tip.show{opacity:1;transform:none}

/* ── TOAST ── */
#toast{
  position:fixed;bottom:80px;left:50%;
  transform:translateX(-50%) translateY(16px);
  background:rgba(10,9,22,0.92);
  border:1px solid var(--acc-border);
  border-radius:8px;padding:9px 18px;
  font-size:11px;letter-spacing:0.04em;color:var(--text);
  z-index:800;opacity:0;pointer-events:none;
  transition:opacity 0.3s,transform 0.3s;
  backdrop-filter:blur(16px);white-space:nowrap;
  box-shadow:0 8px 32px rgba(0,0,0,0.4);
}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ── BOND LEVEL UP ── */
#bond-ceremony{
  position:fixed;inset:0;z-index:700;
  display:flex;align-items:center;justify-content:center;
  background:rgba(4,3,9,0.6);backdrop-filter:blur(8px);
  opacity:0;pointer-events:none;visibility:hidden;
  transition:opacity 0.5s,visibility 0.5s;
}
#bond-ceremony.show{opacity:1;pointer-events:auto;visibility:visible}
.bc-box{
  text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px;
  animation:bcIn 0.6s cubic-bezier(0.34,1.56,0.64,1);
}
@keyframes bcIn{from{transform:scale(0.85) translateY(20px);opacity:0}to{transform:none;opacity:1}}
.bc-ring{
  width:90px;height:90px;border-radius:50%;
  background:conic-gradient(var(--char) var(--bp,100%),transparent var(--bp,100%));
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 40px var(--char-glow),0 0 80px rgba(var(--char-rgb),0.1);
  transition:--bp 1.1s cubic-bezier(0.4,0,0.2,1);
}
.bc-ring-inner{
  width:74px;height:74px;border-radius:50%;
  background:var(--bg);display:flex;align-items:center;justify-content:center;
  flex-direction:column;
}
.bc-num{
  font-family:var(--font-display);font-size:28px;font-weight:200;color:var(--char);
  text-shadow:0 0 18px var(--char-glow);
}
.bc-label-top{font-family:var(--font-mono);font-size:8px;letter-spacing:0.2em;color:var(--sub);text-transform:uppercase}
.bc-name{font-family:var(--font-display);font-size:18px;font-weight:300;letter-spacing:0.1em;color:var(--text)}
.bc-unlock{font-size:11px;color:var(--sub);letter-spacing:0.06em;line-height:1.6;max-width:260px}
.bc-unlock span{color:rgba(var(--char-rgb),0.8)}
.bc-dismiss{
  background:none;border:1px solid rgba(var(--char-rgb),0.2);
  border-radius:6px;padding:7px 20px;
  font-family:var(--font-mono);font-size:9px;letter-spacing:0.16em;
  color:var(--sub);cursor:pointer;text-transform:uppercase;
  transition:all 0.2s;margin-top:4px;
}
.bc-dismiss:hover{border-color:rgba(var(--char-rgb),0.5);color:var(--char)}

/* ── WORLD EVENT INTERRUPT ── */
#world-event-popup{
  position:fixed;top:64px;left:50%;
  transform:translateX(-50%) translateY(-12px) scale(0.96);
  z-index:600;opacity:0;pointer-events:none;visibility:hidden;
  transition:opacity 0.4s ease-out,transform 0.4s cubic-bezier(0.34,1.2,0.64,1),visibility 0.4s;
  width:min(440px,calc(100vw - 24px));
}
#world-event-popup.show{opacity:1;pointer-events:auto;visibility:visible;transform:translateX(-50%) translateY(0) scale(1)}
.wep-box{
  background:rgba(6,5,18,0.95);
  border:1px solid rgba(var(--char-rgb),0.25);
  border-radius:12px;padding:16px 18px;
  backdrop-filter:blur(20px);
  box-shadow:0 8px 40px rgba(0,0,0,0.5),0 0 0 1px rgba(var(--char-rgb),0.05);
}
.wep-type{font-family:var(--font-mono);font-size:8px;letter-spacing:0.2em;color:rgba(var(--char-rgb),0.6);text-transform:uppercase;margin-bottom:6px}
.wep-title{font-family:var(--font-display);font-size:14px;font-weight:300;color:var(--text);margin-bottom:6px}
.wep-desc{font-size:11px;color:var(--sub);line-height:1.5;margin-bottom:14px}
.wep-actions{display:flex;gap:8px}
.wep-btn{
  flex:1;padding:8px 12px;border-radius:7px;
  font-family:var(--font-mono);font-size:9px;letter-spacing:0.1em;
  text-transform:uppercase;cursor:pointer;transition:all 0.2s;
  border:1px solid rgba(var(--char-rgb),0.2);
  background:none;color:var(--sub);
}
.wep-btn:hover{background:rgba(var(--char-rgb),0.1);color:var(--text);border-color:rgba(var(--char-rgb),0.4);box-shadow:0 0 14px rgba(var(--char-rgb),0.18)}
.wep-btn.primary{background:rgba(var(--char-rgb),0.15);color:rgba(var(--char-rgb),0.9);border-color:rgba(var(--char-rgb),0.3)}
.wep-btn.primary:hover{background:rgba(var(--char-rgb),0.28);color:var(--char);box-shadow:0 0 18px var(--char-glow)}

/* ── content unlock modal ─────────────────────────────────────────────────── */
.ud-unlock-ov{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,0.72);backdrop-filter:blur(4px)}
.ud-unlock-box{width:min(92vw,360px);padding:22px 22px 18px;background:var(--bg-panel);border:1px solid var(--acc-border);border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,0.55)}
.ud-unlock-title{font-family:var(--font-display);font-size:17px;color:var(--text);letter-spacing:.04em;margin-bottom:8px}
.ud-unlock-lede{font-size:12px;line-height:1.5;color:var(--sub);margin-bottom:16px}
.ud-unlock-in{width:100%;box-sizing:border-box;margin-bottom:10px;padding:10px 12px;background:var(--bg-glass);border:1px solid var(--acc-border);border-radius:10px;color:var(--text);font-size:14px;letter-spacing:.06em}
.ud-unlock-in:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px rgba(var(--acc-rgb),0.2)}
.ud-unlock-err{min-height:16px;font-size:12px;color:#f56b6b;margin:2px 0 10px}
.ud-unlock-row{display:flex;gap:10px;justify-content:flex-end}
.ud-unlock-btn{padding:9px 16px;border-radius:10px;font-size:13px;cursor:pointer;border:1px solid var(--acc-border);background:transparent;color:var(--sub)}
.ud-unlock-btn.ghost:hover{color:var(--text);border-color:var(--acc)}
.ud-unlock-btn.primary{background:rgba(var(--acc-rgb),0.16);color:var(--acc);border-color:rgba(var(--acc-rgb),0.4)}
.ud-unlock-btn.primary:hover{background:rgba(var(--acc-rgb),0.3);box-shadow:0 0 18px var(--acc-glow)}