.cx{height:550vh;font-family:var(--serif);color:var(--ink);position:relative}:where(.cx) :where(button){all:unset;box-sizing:border-box;cursor:pointer}.cx :is(a,button):focus-visible{outline:1px solid var(--signal);outline-offset:3px}.cx-sky{height:100dvh;position:sticky;top:0;overflow:hidden}.cx-sky canvas{width:100%;height:100%;position:absolute;inset:0}.cx-head{top:var(--page-top);left:max(var(--space-6), calc(50% - 540px));z-index:1;gap:var(--space-2);max-width:calc(100% - 2 * var(--space-6));padding:var(--space-2) var(--space-3);text-shadow:0 1px 5px var(--ground), 0 0 12px var(--ground);pointer-events:none;display:grid;position:absolute}.cx-head-title{align-items:baseline;gap:var(--space-3);flex-wrap:wrap;display:flex}.cx-head h1{font-size:var(--fs-40);font-weight:600;line-height:var(--lh-110);margin:0}.cx-head-title span{font-family:var(--latin-display);font-size:var(--fs-24);color:var(--ink-muted)}.cx-head p{max-width:26em;font-size:var(--fs-14);line-height:var(--lh-170);color:var(--ink-muted);margin:0}.cx-hint{top:calc(100vh - var(--space-24));font-family:var(--mono-font);font-size:var(--fs-11);letter-spacing:var(--ls-24);text-align:center;color:var(--ink-subtle);opacity:0;pointer-events:none;margin:0;position:absolute;left:0;right:0}.cx-mark,.cx-name{white-space:nowrap;opacity:0;pointer-events:none;text-shadow:0 0 6px var(--ground), 0 0 12px var(--ground);position:absolute;top:0;left:0}.cx-mark{font-family:var(--mono-font);font-size:var(--fs-11);letter-spacing:var(--ls-6);color:var(--ink-muted);translate:var(--space-3) -50%}.cx-mark.is-scale{translate:-50% var(--space-1)}.cx-mark.is-edge{color:var(--signal);translate:-50% calc(-100% - var(--space-1))}.cx-name{font-size:var(--fs-12);color:var(--signal);font-weight:600}.cx-scope{z-index:1;max-width:calc(100% - 1rem);padding:var(--space-2) var(--space-3);border-left:1px solid var(--signal);text-shadow:0 1px 4px var(--ground), 0 0 10px var(--ground);color:var(--ink);font-size:var(--fs-13);opacity:0;pointer-events:none;position:absolute;top:0;left:0}.cx-scope.is-on{opacity:1}.cx-foot{z-index:2;inset-inline:max(var(--space-6), calc(50% - 540px));bottom:var(--space-5);position:absolute}.cx-legend{gap:var(--space-3);grid-template-columns:repeat(3,minmax(0,1fr));margin:0;display:grid}.cx-legend-row{min-width:0;padding:var(--space-3) var(--space-4);border-top:1px solid var(--line);text-shadow:0 1px 4px var(--ground), 0 0 10px var(--ground)}.cx-legend dt{align-items:center;gap:var(--space-2);color:var(--ink);font-size:var(--fs-14);font-weight:600;display:flex}.cx-legend dd{margin:var(--space-1) 0 0;color:var(--ink-muted);font-size:var(--fs-13);line-height:var(--lh-150);overflow-wrap:anywhere}.cx-glyph{flex:none;width:9px;height:9px;position:relative}.cx-glyph:before,.cx-glyph:after{content:"";background:var(--ink);position:absolute}.cx-glyph.is-watch:before{border-radius:var(--r-round);inset:2px}.cx-glyph.is-book:before{inset:2px;rotate:45deg}.cx-glyph.is-music:before{height:1px;top:4px;left:0;right:0}.cx-glyph.is-music:after{width:1px;top:0;bottom:0;left:4px}@media (width<=760px){.cx-scope,.cx-hint{display:none}.cx-name{font-size:var(--fs-11)}.cx-head{left:var(--space-4);max-width:calc(100% - 2 * var(--space-4))}.cx-foot{inset-inline:var(--space-4);bottom:max(var(--space-4), env(safe-area-inset-bottom))}.cx-legend{gap:var(--space-1);grid-template-columns:minmax(0,1fr)}.cx-legend-row{padding:var(--space-2) var(--space-3)}}@media (height<=560px) and (width>=561px){.cx-legend{grid-template-columns:repeat(3,minmax(0,1fr))}}
