:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#f7f8ff;background:#050b18}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}button{font:inherit}#universe{display:block;position:fixed;width:100vw;height:100vh;touch-action:none}#planet-labels{position:fixed;inset:0;z-index:2;pointer-events:none;overflow:hidden}.planet-label{position:absolute;left:0;top:0;white-space:nowrap;font-size:11px;font-weight:600;color:#cfdaee;text-shadow:0 1px 10px #000;letter-spacing:.04em}.layout{position:fixed;inset:0;z-index:3;pointer-events:none;display:flex;flex-direction:column;padding:34px 42px 24px}.header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.eyebrow{font-size:11px;letter-spacing:.24em;font-weight:800;color:#9fb1d0;margin:0 0 12px}.tag{display:inline-block;letter-spacing:.08em;margin-left:8px;font-size:10px;background:#22334c;color:#a9d7fa;padding:5px 8px;border-radius:20px}h1{font-size:clamp(32px,4vw,55px);letter-spacing:-.04em;margin:0;line-height:1.1}.subtitle{font-size:13px;color:#92a0b8;line-height:1.6}.toolbar{display:flex;gap:8px;flex-wrap:wrap;pointer-events:auto}.toolbar button{border:1px solid #31405b;color:#ecf4ff;background:#121f34d9;padding:10px 13px;border-radius:9px;cursor:pointer;font-weight:600;font-size:12px}.toolbar button:hover{background:#283b57;border-color:#5d7399}.toolbar button:focus-visible{outline:2px solid #a9d7fa;outline-offset:3px}.details{margin-top:auto;margin-left:auto;margin-bottom:27px;background:#070f1ddb;border:1px solid #293853;border-radius:14px;padding:23px;max-width:330px;width:100%;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.details-hint{margin:0 0 10px;font-size:10px;font-weight:800;letter-spacing:.2em;color:#87accf}.details h2{margin:0 0 8px;font-size:23px}.details p:not(.details-hint){font-size:13px;line-height:1.7;color:#9aaac4;margin:0}.facts{margin-top:12px;padding-top:12px;border-top:1px solid #293853;color:#bfcce5;font-size:12px}.details p.distance{margin-top:8px;color:#d8e6ff;font-size:12px;font-variant-numeric:tabular-nums}.sim-date{color:#ecf4ff;font-weight:700;font-variant-numeric:tabular-nums}.footer{display:flex;justify-content:space-between;gap:16px;font-size:11px;color:#8393af}.mobile-hint{display:none}@media(max-width:800px){.layout{padding:22px 17px 20px}.header{flex-direction:column;gap:6px}.toolbar{flex-wrap:wrap}.toolbar button{padding:9px 10px;font-size:11px}.details{max-width:270px;padding:15px;margin-bottom:14px}.details h2{font-size:19px}.footer{line-height:1.4;flex-direction:column;gap:5px;font-size:10px}.desktop-hint{display:none}.mobile-hint{display:block}}@media(max-height:520px){.details{margin-bottom:8px;max-width:255px}.subtitle,.footer{display:none}}.layers{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px;pointer-events:auto}.layers button{border:1px solid #2a3852;color:#b9c7de;background:#0c1628b3;padding:7px 11px;border-radius:999px;cursor:pointer;font-size:11.5px;font-weight:600}.layers button[aria-pressed=true]{background:#3a60968c;border-color:#5f86c0;color:#f2f7ff}.layers button.action{border-color:#8a5a2a;background:#5a300e8c;color:#ffd9a8}.layers button.action:hover{background:#824614b3}.layers button:focus-visible{outline:2px solid #a9d7fa;outline-offset:2px}.planet-label.moon-label{font-size:10px;color:#aebbd2;font-weight:500}.planet-label.minor-label{font-size:10px;color:#e9d9b0;font-weight:600;letter-spacing:.06em}.facts div+div{margin-top:4px}.details p.note{margin-top:10px;font-size:11px;color:#f0c48f;line-height:1.5}.toasts{position:fixed;top:236px;left:42px;display:flex;flex-direction:column;gap:8px;max-width:340px;pointer-events:none;z-index:4}.toast{background:#140e06e0;border:1px solid #7a5726;border-radius:12px;padding:12px 14px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:toast-in .35s ease-out;transition:opacity .5s,transform .5s}.toast strong{display:block;color:#ffd28a;font-size:13px;margin-bottom:4px}.toast p{margin:0;color:#e8dcc8;font-size:12px;line-height:1.55}.toast.leaving{opacity:0;transform:translateY(-6px)}@keyframes toast-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}@media(max-width:700px){.layers{margin-top:10px}.layers button{padding:6px 9px;font-size:10.5px}.toasts{inset:auto 16px 240px;max-width:none}}