.sa-pics{min-width:0;min-height:0;display:grid;position:relative;overflow:hidden}.sa-view{min-width:0;min-height:0;position:relative;overflow:hidden}.sa-view>canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.sa-ov{touch-action:none;cursor:grab}.sa-ov.grabbing{cursor:grabbing}.sa-glow{visibility:hidden;pointer-events:none}.sa-view.lit .sa-glow{visibility:visible}.sa-view.lit .sa-img{visibility:hidden}.sa-img{transition:opacity var(--dur-state) var(--ease-out)}.sa-pics.cloud .sa-img{opacity:.42}.sa-dev{opacity:0;transition:opacity .8s var(--ease-out)}.sa-pics.dev .sa-dev{opacity:1;transition-duration:var(--dur-state)}.sa-view.lit .sa-dev{visibility:hidden}.sa-pics[data-tone=dark]{background:var(--bg)}.sa-sample{z-index:2;right:calc(14 * var(--g));top:calc(12 * var(--g));pointer-events:none;font-family:var(--font-mono);font-size:var(--fs-2xs);letter-spacing:.08em;color:var(--text-3);text-shadow:0 0 6px var(--plot-bg), 0 1px 2px var(--plot-bg);position:absolute}.sa-pics:has(.sa-hint.on) .sa-sample,.sa-pics.hl-open .sa-sample{visibility:hidden}.sa .sa-vb{right:calc(12 * var(--g));bottom:calc(12 * var(--g));z-index:2;position:absolute}.sa-result{z-index:3;left:calc(18 * var(--g));bottom:calc(16 * var(--g));width:min(calc(520 * var(--u)), calc(100% - 120 * var(--g)));pointer-events:none;position:absolute}.sa-line{margin:0}.sa-sub{color:var(--text-2);font-size:var(--fs-xs)}.sa-view>.sa-info{z-index:5;top:calc(48 * var(--g));right:calc(14 * var(--g));width:min(calc(380 * var(--u)), calc(100% - 28 * var(--g)));position:absolute}.sa-info .win-body{gap:calc(6 * var(--g));display:grid}.sa-hud{z-index:4;pointer-events:none;position:absolute;inset:0}.sa .hl-nav{left:calc(12 * var(--g));top:calc(12 * var(--g));z-index:3;max-width:calc(100% - 24 * var(--g));pointer-events:auto;position:absolute}.sa .hl-nav.idle{display:none}.sa-hint,.sa-toast{left:50%;top:calc(16 * var(--g));z-index:4;width:max-content;max-width:calc(100% - 150px);padding:calc(7 * var(--g)) calc(14 * var(--g));text-align:center;border:1px solid var(--line);background:var(--plot-bg);backdrop-filter:blur(10px);color:var(--text);font-size:var(--fs-s);pointer-events:none;opacity:0;transition:opacity .6s var(--ease-out);border-radius:2px;line-height:1.45;position:absolute;transform:translate(-50%)}.sa-hint.on,.sa-toast.on{opacity:1;transition-duration:var(--dur-state)}.sa-hint.long{top:calc(56 * var(--g));width:min(calc(600 * var(--g)), calc(100% - 32px));text-align:left;max-width:none;line-height:1.5}.sa-panel{color:var(--text);display:grid}.sa-sec{min-width:0;display:grid}.sa-extras{gap:calc(6 * var(--g));display:grid}.sa-row{align-items:center;gap:calc(8 * var(--g));flex-wrap:wrap;display:flex}.sa-row>[hidden]{display:none}.sa-note{color:var(--text-3);font-size:var(--fs-xs);margin:0;line-height:1.45}.sa-inset{width:100%;padding:calc(5 * var(--g)) calc(7 * var(--g));--pp-aspect:1.25}.sa-mapbox{gap:calc(6 * var(--g));min-width:0;display:grid}.sa-pm{image-rendering:pixelated}.sa-formula{color:var(--text);font-size:var(--fs-s);margin:0;overflow-x:auto}.sa-fields{gap:calc(6 * var(--g)) calc(14 * var(--g));flex-wrap:wrap;display:flex}.sa-field{font-family:var(--font-mono);font-size:var(--fs-s);color:var(--text-2);align-items:baseline;gap:.4em;display:inline-flex}.sa-sym{color:var(--c-h)}.sa-procs{column-gap:calc(14 * var(--g));grid-template-columns:1fr 1fr;align-items:start;display:grid}.sa-proc{grid-template-rows:var(--control-primary) auto;place-items:center;gap:calc(4 * var(--g));text-align:center;display:grid}.sa-procnote{text-align:left;justify-self:stretch}.sa-look{position:relative}.sa-look .sdr-tray{left:0;right:0;bottom:calc(100% + 4 * var(--g));z-index:5;position:absolute}.sa .dkeys .dk-name:empty{display:none}.sa .lkey,.sa .wkey,.sa .hbtn,.sa .hl-step{min-height:24px}@media (width>=761px) and (height<=940px){.sa-inset{--pp-aspect:1.8}}@media (width>=761px) and (height<=820px){.wa04-hero .lede{display:none}.sa-inset{--pp-aspect:2.6}}@media (width<=760px){.sa-pics{border-block:1px solid var(--line);background:var(--bg)}.sa-panel{column-gap:calc(12 * var(--g));grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"map ring""map go""why why""keys keys""rule rule""rest rest""bar bar"}.sa-panel:has(.sa-procnote>.off-note[hidden]){grid-template-areas:"map ring""map go""keys keys""rule rule""rest rest""bar bar"}.sa-mapbox{grid-area:map;align-self:center}.sa-inset{--pp-aspect:1.15}.sa-go,.sa-go>.sa-procs,.sa-go>.sa-procs>.sa-proc:first-child{display:contents}.sa-go .zring{grid-area:ring;justify-self:center}.sa-go>.sa-procs>.sa-proc:last-child{grid-area:go}.sa-procnote{grid-area:why}.sa-procnote:has(>.off-note[hidden]),.sa-go>.sa-procs .sa-note{display:none}.sa-go>.sa-extras{grid-area:rest}.sa-sec-map{grid-area:keys}.sa-sec-rule{grid-area:rule}.sa-panel>.sa-look{grid-area:bar}.sa-result{left:calc(10 * var(--g));bottom:calc(8 * var(--g));width:calc(100% - 20 * var(--g))}.sa-hint{white-space:normal;width:calc(100% - 24px);max-width:none}.sa-hint.long{top:calc(10 * var(--g))}.sa .hl-nav{top:auto;bottom:calc(var(--sa-notes-height,80px) + 16 * var(--g));left:auto;right:calc(10 * var(--g))}.sa .sa-vb{display:none}}@media (width<=359px){.sa-panel{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"map map""ring go""why why""keys keys""rule rule""rest rest""bar bar"}.sa-panel:has(.sa-procnote>.off-note[hidden]){grid-template-areas:"map map""ring go""keys keys""rule rule""rest rest""bar bar"}.sa-inset{--pp-aspect:1.6}}@media (width<=980px) and (height<=500px) and (orientation:landscape){.sa .sa-vb{display:none}}@container phenomenon-column (width<=320px){.sa-procs{row-gap:calc(10 * var(--g));grid-template-columns:1fr}}