.surface{background:linear-gradient(145deg,rgba(24,35,59,.96),rgba(16,24,43,.96));border:1px solid var(--border-soft);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}
.popup-overlay{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(3,6,14,.76);backdrop-filter:blur(10px);animation:fadeIn .16s var(--ease)}
.popup-panel{width:min(620px,100%);max-height:min(820px,calc(100vh - 34px));overflow:auto;padding:22px;background:linear-gradient(160deg,#172139,#0f172a);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);animation:popupIn .2s var(--ease)}
.popup-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px}
.popup-header h2{margin:4px 0 0;font-size:1.55rem}
.popup-header p{margin:7px 0 0;color:var(--muted);line-height:1.45}
.icon-button{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;border:1px solid var(--border);border-radius:50%;background:var(--surface-hover);color:white}
body.popup-open{overflow:hidden}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes popupIn{from{opacity:0;transform:translateY(10px) scale(.975)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}