*{box-sizing:border-box}html,body{color:#e8ecf2;background:#02040a;height:100%;margin:0;font:14px/1.4 system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}#globe,#labels{position:fixed;inset:0}#labels{pointer-events:none;overflow:hidden}.label{white-space:nowrap;opacity:0;text-shadow:0 0 3px #000,0 0 6px #000;will-change:transform;transition:opacity .2s;position:absolute;top:0;left:0}.label.place{font-size:12px;font-weight:600}.label.place:before{content:"";vertical-align:middle;background:#fff;border-radius:50%;width:5px;height:5px;margin-right:5px;display:inline-block}.label.atlantica{color:#ffd27a}.label.atlantica:before{background:#ffd27a}.label.super{letter-spacing:.18em;text-transform:uppercase;color:#ffe2a8;font-size:20px;font-weight:700}.label.ocean{letter-spacing:.12em;color:#a9d4ff;font-size:15px;font-style:italic}header{pointer-events:none;justify-content:space-between;align-items:center;padding:14px 20px;display:flex;position:fixed;top:0;left:0;right:0}header>*{pointer-events:auto}h1{letter-spacing:.05em;margin:0;font-size:18px;font-weight:600}button{font:inherit;color:inherit;cursor:pointer;background:#ffffff1a;border:1px solid #ffffff40;border-radius:6px;padding:6px 12px}button:hover{background:#fff3}.buttons{gap:8px;display:flex}footer{background:linear-gradient(#0000,#02040ad9 30%);padding:16px 24px 10px;position:fixed;bottom:0;left:0;right:0}.readout{flex-wrap:wrap;align-items:baseline;gap:16px;display:flex}.age{font-variant-numeric:tabular-nums;font-size:30px;font-weight:700}.units{opacity:.8;font-size:15px}.note{opacity:.9;max-width:900px;min-height:2.8em;margin:4px 0 10px}.controls{align-items:flex-start;gap:14px;display:flex}#play{border-radius:50%;flex:none;width:42px;height:42px;padding:0;font-size:16px}.track{flex:1;position:relative}.periods{border-radius:3px;height:10px;margin:0 8px;display:flex;overflow:hidden}.periods div{height:100%}#slider{accent-color:#ffd27a;cursor:pointer;width:100%;margin:4px 0 0}.ticks{opacity:.7;height:18px;margin:0 8px;font-size:11px;position:relative}.ticks span{white-space:nowrap;position:absolute;transform:translate(-50%)}.ticks span:first-child{transform:none}.ticks span:last-child{transform:translate(-100%)}.credit{opacity:.55;margin:6px 0 0;font-size:11px}.credit a{color:inherit}
