.atlas-panel{height:100%;padding:12px;border:1px solid rgba(128,183,216,.18);border-radius:20px;background:linear-gradient(145deg,rgba(14,42,63,.96),rgba(4,18,31,.98));color:#f5f9fc;box-shadow:inset 0 1px rgba(255,255,255,.04)}
.atlas-control-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.atlas-toolbar,.atlas-groups,.atlas-subgroups{display:flex;flex-wrap:wrap;gap:6px}.atlas-subgroups{margin:8px 0}.atlas-panel button{min-height:34px;border:1px solid rgba(157,198,223,.2);border-radius:10px;padding:7px 11px;font:inherit;font-size:.56rem;background:rgba(255,255,255,.055);color:#eef6fb;cursor:pointer;transition:.2s ease}.atlas-panel button:hover{border-color:#ffcf32;color:#ffdc63;transform:translateY(-1px)}.atlas-panel button[aria-pressed=true]{background:#ffcf32;border-color:#ffcf32;color:#071526;font-weight:900}.atlas-panel button:focus-visible{outline:3px solid rgba(255,207,50,.45);outline-offset:2px}.atlas-subgroups:empty{display:none}
.atlas-viewport{height:clamp(500px,54vw,680px);border-radius:16px;background:radial-gradient(circle at 50% 34%,rgba(32,96,137,.68),transparent 42%),radial-gradient(ellipse at center,#15354e,#030b12 78%);position:relative;overflow:hidden;touch-action:none;box-shadow:inset 0 0 90px rgba(0,0,0,.42)}.atlas-viewport::after{content:"";position:absolute;inset:auto 12% 4%;height:11%;border-radius:50%;background:radial-gradient(ellipse,rgba(255,207,50,.14),transparent 70%);filter:blur(14px);pointer-events:none}.atlas-viewport canvas{position:relative;z-index:1;display:block;width:100%;height:100%}.atlas-hover-label{position:absolute;z-index:4;min-width:max-content;padding:8px 12px;border:1px solid rgba(255,207,50,.48);border-radius:10px;background:rgba(3,14,24,.92);color:#fff;font-size:.64rem;font-weight:900;pointer-events:none;transform:translate(-50%,calc(-100% - 18px));box-shadow:0 12px 34px rgba(0,0,0,.34);backdrop-filter:blur(10px)}.atlas-hover-label::after{content:"";position:absolute;left:50%;bottom:-5px;width:9px;height:9px;background:inherit;border-right:1px solid rgba(255,207,50,.48);border-bottom:1px solid rgba(255,207,50,.48);transform:translateX(-50%) rotate(45deg)}.atlas-hover-label[hidden]{display:none}.atlas-status{min-height:2.4em;margin:9px 3px 0;color:#b8cbd8;font-size:.55rem;line-height:1.9}
@media(max-width:980px){.atlas-viewport{height:520px}}
@media(max-width:600px){.atlas-panel{padding:8px}.atlas-control-row{display:grid}.atlas-toolbar{order:-1}.atlas-viewport{height:430px}.atlas-panel button{font-size:.53rem;padding:6px 8px}}