.skala-semesta{--void: #04060b;--glass: rgba(10, 14, 24, .62);--glass-strong: rgba(12, 17, 29, .86);--hairline: rgba(160, 185, 230, .16);--ink: #e8edf6;--ink-soft: #b9c3d6;--muted: #7f8ba3;--sun: #ffc56b;--sky: #7cc4ff;--font-ui: "Figtree", system-ui, sans-serif;--font-display: "IM Fell DW Pica", Georgia, serif;--font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;--radius: 10px;--gutter: 16px;position:relative;overflow:hidden;overscroll-behavior:none;touch-action:manipulation;background:var(--void);color:var(--ink);font-family:var(--font-ui);font-size:15px;-webkit-font-smoothing:antialiased;color-scheme:dark}.skala-semesta:fullscreen{width:100%;height:100%}.skala-semesta.expanded{position:fixed;inset:0;z-index:60;height:100dvh}.skala-semesta #ss-scene{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab;outline:none}.skala-semesta #ss-scene.dragging{cursor:grabbing}.skala-semesta button{font:inherit;color:inherit}.skala-semesta :focus-visible{outline:2px solid var(--sky);outline-offset:2px}.skala-semesta .readout{position:absolute;top:max(var(--gutter),env(safe-area-inset-top,0px));left:max(var(--gutter),env(safe-area-inset-left,0px));max-width:min(420px,calc(100% - 120px));pointer-events:none;text-shadow:0 1px 12px rgba(0,0,0,.6)}.skala-semesta .brand{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft)}.skala-semesta .brand-mark{width:10px;height:10px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 3px #7cc4ff40,0 0 14px #ffc56b99}.skala-semesta .scale-name{margin-top:10px;font-family:var(--font-display);font-size:clamp(28px,4.4vw,44px);font-weight:400;line-height:1.02;text-wrap:balance}.skala-semesta .distance{margin-top:6px;font-family:var(--font-mono);font-size:14px;color:var(--sun);font-variant-numeric:tabular-nums}.skala-semesta .detail{margin-top:4px;font-size:13px;color:var(--ink-soft);font-variant-numeric:tabular-nums;min-height:1.3em}.skala-semesta .actions{position:absolute;top:max(var(--gutter),env(safe-area-inset-top,0px));right:max(var(--gutter),env(safe-area-inset-right,0px));display:flex;gap:6px;padding:5px;border-radius:12px;background:var(--glass);border:1px solid var(--hairline);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3)}.skala-semesta .icon-btn,.skala-semesta .step-btn{display:grid;place-items:center;width:36px;height:36px;padding:0;border:0;border-radius:8px;background:transparent;cursor:pointer;transition:background-color .12s ease,color .12s ease}.skala-semesta .icon-btn svg,.skala-semesta .step-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.skala-semesta .icon-btn:hover,.skala-semesta .step-btn:hover{background:#a0b9e61f}.skala-semesta .icon-btn[aria-pressed=false]{color:var(--muted)}.skala-semesta #ss-compass{transition:transform 80ms linear}.skala-semesta #ss-compass .needle-n{fill:var(--sun);stroke:var(--sun)}.skala-semesta #ss-compass path:not(.needle-n){fill:currentColor;opacity:.45}.skala-semesta .zoom{position:absolute;right:max(var(--gutter),env(safe-area-inset-right,0px));top:calc(max(var(--gutter),env(safe-area-inset-top,0px)) + 64px);bottom:calc(max(var(--gutter),env(safe-area-inset-bottom,0px)) + 78px);width:210px;display:flex;flex-direction:column;align-items:flex-end;gap:10px;pointer-events:none}.skala-semesta .zoom-rail{position:relative;flex:1;width:100%;min-height:160px;pointer-events:auto;cursor:ns-resize;touch-action:none}.skala-semesta .zoom-track{position:absolute;right:21px;top:0;bottom:0;width:2px;border-radius:2px;background:linear-gradient(to bottom,#ffc56b8c,#7cc4ff8c)}.skala-semesta .zoom-ticks{position:absolute;inset:0}.skala-semesta .tick{position:absolute;right:17px;height:1px;width:10px;background:#c8d7f052}.skala-semesta .tick.major{width:14px;right:15px;background:#dce6fa99}.skala-semesta .tick-label{position:absolute;right:40px;transform:translateY(-50%);white-space:nowrap;font-size:12px;font-weight:500;letter-spacing:.04em;color:var(--ink-soft);text-shadow:0 1px 8px rgba(0,0,0,.9);background:none;border:0;padding:2px 4px;cursor:pointer;border-radius:4px}.skala-semesta .tick-label:hover{color:var(--ink);background:#0a0e188c}.skala-semesta .zoom-thumb{position:absolute;right:12px;width:20px;height:20px;margin-top:-10px;border-radius:50%;background:var(--void);border:2px solid var(--sun);box-shadow:0 0 0 4px #ffc56b2e,0 0 18px #ffc56b59;pointer-events:none}.skala-semesta .zoom-thumb-value{position:absolute;right:28px;top:50%;transform:translateY(-50%);white-space:nowrap;padding:3px 8px;border-radius:6px;background:var(--glass-strong);border:1px solid var(--hairline);font-family:var(--font-mono);font-size:12px;color:var(--sun);font-variant-numeric:tabular-nums}.skala-semesta .tick-note{position:absolute;right:44px;transform:translateY(-50%);white-space:nowrap;font-size:11px;font-style:italic;letter-spacing:.06em;color:var(--ink-soft);opacity:.7;pointer-events:none}.skala-semesta .zoom-rail:active .tick-label,.skala-semesta .zoom-rail.active .tick-label{opacity:.35}.skala-semesta .zoom-steps{display:flex;gap:4px;padding:4px;border-radius:10px;background:var(--glass);border:1px solid var(--hairline);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);pointer-events:auto}.skala-semesta .timebar{position:absolute;left:50%;bottom:max(var(--gutter),env(safe-area-inset-bottom,0px));transform:translate(-50%);display:flex;align-items:center;gap:10px;max-width:calc(100% - 2 * var(--gutter));padding:6px 8px 6px 6px;border-radius:14px;background:var(--glass);border:1px solid var(--hairline);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3)}.skala-semesta #ss-btn-fullscreen .ic-exit,.skala-semesta #ss-btn-fullscreen[aria-pressed=true] .ic-enter{display:none}.skala-semesta #ss-btn-fullscreen[aria-pressed=true] .ic-exit{display:block}.skala-semesta[data-failed]:after{content:"Tampilan 3D tidak bisa dimulai di browser ini. Skala Semesta butuh WebGL.";position:absolute;inset:0;display:grid;place-items:center;padding:0 32px;text-align:center;color:var(--ink-soft)}.skala-semesta #ss-btn-play .ic-play{display:none}.skala-semesta #ss-btn-play.paused .ic-play{display:block;fill:currentColor}.skala-semesta #ss-btn-play.paused .ic-pause{display:none}.skala-semesta .clock{min-width:0;padding-right:4px}.skala-semesta .clock-date{font-family:var(--font-mono);font-size:13px;white-space:nowrap;font-variant-numeric:tabular-nums}.skala-semesta .clock-zone{font-size:11px;letter-spacing:.06em;color:var(--muted);white-space:nowrap}.skala-semesta .rates{display:flex;gap:2px;padding:2px;border-radius:9px;background:#00000040}.skala-semesta .chip{border:0;border-radius:7px;padding:6px 9px;background:transparent;font-size:12.5px;font-weight:500;letter-spacing:.02em;color:var(--ink-soft);cursor:pointer;white-space:nowrap;transition:background-color .12s ease,color .12s ease}.skala-semesta .chip:hover{color:var(--ink);background:#a0b9e61a}.skala-semesta .chip[aria-checked=true],.skala-semesta .chip[aria-pressed=true]{color:var(--void);background:var(--sun)}.skala-semesta .chip-strong{border:1px solid rgba(255,197,107,.5);color:var(--sun)}.skala-semesta #ss-labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}.skala-semesta .label{position:absolute;left:0;top:0;display:flex;align-items:center;gap:6px;white-space:nowrap;font-size:12.5px;font-weight:500;letter-spacing:.03em;color:var(--ink);text-shadow:0 0 6px rgba(0,0,0,.95),0 1px 2px rgba(0,0,0,.9);will-change:transform,opacity}.skala-semesta .label .sub{font-family:var(--font-mono);font-size:10.5px;font-weight:400;text-transform:none;letter-spacing:normal;color:var(--ink-soft)}.skala-semesta .label.kind-star{font-size:11.5px;color:#ffe9c9}.skala-semesta .label.kind-galaxy{color:#cfdcff}.skala-semesta .label.kind-structure{font-size:13px;text-transform:uppercase;letter-spacing:.16em;color:#e7d6ff}.skala-semesta .label.kind-region{font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.2em;color:#ffe9c4eb}.skala-semesta .label.kind-you{font-weight:600;color:var(--sun)}.skala-semesta .label.kind-you:before{content:"";width:12px;height:12px;margin-left:-6px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 4px #ffc56b4d,0 0 16px #ffc56bcc}.skala-semesta .label.kind-planet:before,.skala-semesta .label.kind-galaxy:before,.skala-semesta .label.kind-star:before{content:"";width:5px;height:5px;margin-left:-2.5px;border-radius:50%;border:1px solid currentColor;opacity:.8}.skala-semesta .label.kind-part{font-size:12px;color:#dff3e4}.skala-semesta .label.kind-part:before{content:"";width:4px;height:4px;margin-left:-2px;border-radius:50%;background:currentColor;opacity:.85}.skala-semesta .label.flip:before{order:1;margin-left:0}.skala-semesta .label.kind-you.flip:before{margin-right:-6px}.skala-semesta .label.kind-planet.flip:before,.skala-semesta .label.kind-galaxy.flip:before,.skala-semesta .label.kind-star.flip:before{margin-right:-2.5px}.skala-semesta .label.kind-part.flip:before{margin-right:-2px}.skala-semesta .rings{position:absolute;inset:0;pointer-events:none;overflow:hidden}.skala-semesta .scale-ring{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;border:1px dashed rgba(200,215,240,.45);will-change:width,height,opacity}.skala-semesta .scale-ring-limit{border:1.5px dashed rgba(255,197,107,.85)}.skala-semesta .scale-ring-planck{border:1.5px solid var(--sun);box-shadow:0 0 18px #ffc56b59,inset 0 0 18px #ffc56b33}.skala-semesta .scale-ring-label{position:absolute;left:50%;top:0;transform:translate(-50%,calc(-100% - 6px));display:flex;flex-direction:column;align-items:center;gap:2px;white-space:nowrap;font-size:12.5px;font-weight:500;letter-spacing:.03em;color:var(--ink);text-shadow:0 0 6px rgba(0,0,0,.95)}.skala-semesta .scale-ring-label .sub{font-family:var(--font-mono);font-size:10.5px;color:var(--ink-soft)}.skala-semesta .scale-ring-limit .scale-ring-label,.skala-semesta .scale-ring-planck .scale-ring-label{color:var(--sun)}.skala-semesta .toast{position:absolute;left:50%;top:max(var(--gutter),env(safe-area-inset-top,0px));transform:translate(-50%);max-width:min(520px,calc(100% - 2 * var(--gutter)));padding:10px 14px;border-radius:10px;background:var(--glass-strong);border:1px solid var(--hairline);font-size:14px;line-height:1.4;text-align:center;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.skala-semesta .hint{position:absolute;left:50%;bottom:calc(max(var(--gutter),env(safe-area-inset-bottom,0px)) + 64px);transform:translate(-50%);width:max-content;max-width:min(560px,calc(100% - 2 * var(--gutter)));font-size:12.5px;letter-spacing:.04em;text-align:center;color:var(--muted);pointer-events:none;transition:opacity .6s ease;text-shadow:0 1px 8px rgba(0,0,0,.9)}.skala-semesta .hint.gone{opacity:0}.skala-semesta .credits{position:absolute;left:max(var(--gutter),env(safe-area-inset-left,0px));bottom:calc(max(var(--gutter),env(safe-area-inset-bottom,0px)) - 14px);font-size:10px;line-height:12px;white-space:nowrap;color:#b9c3d69e;pointer-events:none;text-shadow:0 1px 4px rgba(0,0,0,.9)}.skala-semesta .stats{position:absolute;left:max(var(--gutter),env(safe-area-inset-left,0px));bottom:60px;font-family:var(--font-mono);font-size:11px;color:var(--muted);white-space:pre;pointer-events:none}@media(max-width:760px){.skala-semesta .credits{right:max(var(--gutter),env(safe-area-inset-right,0px));bottom:calc(max(var(--gutter),env(safe-area-inset-bottom,0px)) + 120px);white-space:normal}.skala-semesta .brand{display:none}.skala-semesta .timebar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"play clock now" "rates rates reverse";column-gap:8px;row-gap:6px;width:calc(100% - 2 * var(--gutter))}.skala-semesta #ss-btn-play{grid-area:play}.skala-semesta .clock{grid-area:clock}.skala-semesta .clock-date{font-size:12px;overflow:hidden;text-overflow:ellipsis}.skala-semesta #ss-btn-now{grid-area:now;justify-self:end}.skala-semesta #ss-btn-reverse{grid-area:reverse}.skala-semesta .rates{grid-area:rates;justify-content:space-between}.skala-semesta .rates .chip{flex:1;padding:6px 4px}.skala-semesta .hint{display:none}.skala-semesta .toast{top:calc(max(var(--gutter),env(safe-area-inset-top,0px)) + 58px)}.skala-semesta .zoom{width:64px;bottom:calc(max(var(--gutter),env(safe-area-inset-bottom,0px)) + 150px)}.skala-semesta .tick-label{display:none}.skala-semesta .tick-label.keep{display:block;right:38px;font-size:10.5px}.skala-semesta .tick-note{display:none}.skala-semesta .label{flex-wrap:wrap;row-gap:0;max-width:60vw}.skala-semesta .label .sub{flex-basis:100%;white-space:normal}.skala-semesta .label.flip{flex-direction:row-reverse}.skala-semesta .label.flip:before{order:0}.skala-semesta .label.flip .sub{text-align:right}.skala-semesta .readout{max-width:calc(100% - 200px)}.skala-semesta .scale-name{font-size:24px}}@media(prefers-reduced-motion:reduce){.skala-semesta *{transition:none!important}}