@layer properties,theme,base;@layer components{.sruler{--u:1rem;--sr-line:var(--ink);--sr-text:var(--ink);--sr-text-2:var(--ink-2)}.stage .sruler{--sr-line:var(--on-stage);--sr-text:var(--on-stage);--sr-text-2:var(--on-stage-2)}.sruler__plot{height:calc(var(--u)*8.5);margin:0 calc(var(--u)*.625);direction:ltr;position:relative;container-type:inline-size}.sruler__edge{left:calc(var(--u)*-.625);right:calc(var(--u)*-.625);top:calc(var(--u)*3.125);height:calc(var(--u)*.25);background:var(--sr-line);position:absolute}.sruler__ticks{left:0;right:0;top:calc(var(--u)*3.375);width:100%;height:var(--u);position:absolute;overflow:visible}.sruler__tk{fill:none;stroke:var(--sr-line);stroke-width:2px;vector-effect:non-scaling-stroke;shape-rendering:crispedges}.sruler__lead,.sruler__ref,.sruler__tip,.sruler__you{--p:clamp(0, (var(--v) - var(--min)) / (var(--max) - var(--min)), 1);left:calc(var(--p)*100%);position:absolute}.sruler__ref,.sruler__you{transform:translateX(calc(var(--p)*-100%));white-space:nowrap;margin-left:calc((var(--p) - .5)*var(--u)*1.25)}.sruler__you{height:calc(var(--u)*2.25);padding:0 calc(var(--u)*.75);background:var(--signal);color:var(--on-signal);border-radius:calc(var(--u)*.25);font:800 calc(var(--u)*1.125)/2 var(--font-text);top:0}.sruler__tip{top:calc(var(--u)*2.1875);margin-left:calc(var(--u)*-.625);border:calc(var(--u)*.625) solid transparent;border-top:calc(var(--u)*.75) solid var(--signal);border-bottom-width:0}.sruler__lead{top:calc(var(--u)*3.375);height:calc(var(--u)*1.75);background:var(--sr-line);width:2px;margin-left:-1px}.sruler__ref{top:calc(var(--u)*5.25);font:600 calc(var(--u)*1.125)/1.4 var(--font-text);color:var(--sr-text)}.sruler__end{top:calc(var(--u)*7);font:600 var(--u)/1.5 var(--font-text);color:var(--sr-text-2);align-items:center;gap:calc(var(--u)*.375);display:inline-flex;position:absolute}.sruler__end--lo{left:calc(var(--u)*-.625)}.sruler__end--hi{right:calc(var(--u)*-.625)}.sruler__end--hi:after,.sruler__end--lo:before{content:"";border:calc(var(--u)*.3125) solid transparent}.sruler__end--lo:before{border-right:calc(var(--u)*.4375) solid currentColor;border-left-width:0}.sruler__end--hi:after{border-left:calc(var(--u)*.4375) solid currentColor;border-right-width:0}.sruler__end--plain:after,.sruler__end--plain:before{content:none}@keyframes sruler-arrive-tip{0%{translate:calc(var(--p)*-100cqi) 0}}@keyframes sruler-arrive-you{0%{translate:calc(var(--p)*(100% - 100cqi - var(--u)*1.25)) 0}}@media (prefers-reduced-motion:no-preference){.result__fig .sruler__tip{animation:.64s cubic-bezier(.22,.72,.18,1) .2s backwards sruler-arrive-tip}.result__fig .sruler__you{animation:.64s cubic-bezier(.22,.72,.18,1) .2s backwards sruler-arrive-you}}.sruler__you--aside{color:var(--sr-text);outline:2px dashed var(--signal);outline-offset:-2px;background:0 0}.sruler--alone .sruler__plot{height:calc(var(--u)*6.5)}.sruler--alone .sruler__end{top:calc(var(--u)*5)}.sruler__range{top:calc(var(--u)*4.5);height:calc(var(--u)*.625);--p:clamp(0, (var(--lo) - var(--min)) / (var(--max) - var(--min)), 1);left:calc(var(--p)*100%);width:calc((var(--hi) - var(--lo))/(var(--max) - var(--min))*100%);border:2px solid var(--sr-line);border-top:0;position:absolute}.sruler__range--reported{border-style:dashed}.sruler--off .sruler__edge{right:24%}.sruler--off .sruler__ticks{width:76%;right:auto}.sruler--mini .sruler__plot{height:2.75rem;margin:0 .5rem}.sruler--mini .sruler__edge{height:3px;top:.875rem;left:-.5rem;right:-.5rem}.sruler--mini .sruler__ticks{height:.625rem;top:calc(.875rem + 3px)}.sruler--mini .sruler__tip{border-width:.75rem .5rem 0;margin-left:-.5rem;top:0}.sruler--mini .sruler__lead{height:1.375rem;top:calc(.875rem + 3px)}.sruler--mini .sruler__range{height:.5rem;top:calc(1.75rem + 3px)}.ruler{--r-line:var(--ink);--r-text:var(--ink);--r-text-2:var(--ink-2);--r-body:var(--paper-2);--h-flag:2.25rem;--h-mark:1.625rem;--h-body:7.5rem;--h-under:2.5rem;--gutter-unit:2.25rem;container-type:inline-size}.ruler__plot{margin-right:var(--gutter-unit);height:calc(var(--h-flag) + var(--h-mark) + var(--h-body) + var(--h-under));font-family:var(--font-text);color:var(--r-text);direction:ltr;position:relative}.ruler__body{left:0;right:0;top:calc(var(--h-flag) + var(--h-mark));height:var(--h-body);background:var(--r-body);border-top:2px solid var(--r-line);border-bottom:2px solid var(--r-line);position:absolute}.ruler__ticks{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.ruler__tk{fill:none;stroke:var(--r-line);stroke-width:1px;vector-effect:non-scaling-stroke;shape-rendering:crispedges}.ruler__tk--major{stroke-width:2px}.ruler__tk--pm{opacity:.7}.ruler__band,.ruler__bandtip,.ruler__flag,.ruler__marker,.ruler__num,.ruler__pct,.ruler__pointer{--p:calc((var(--v) - var(--min))/(var(--max) - var(--min)));left:calc(var(--p)*100%);position:absolute}.ruler__num,.ruler__pct{line-height:1;transform:translate(-50%)}.ruler__num{background:var(--r-body);z-index:5;padding:.125rem .1875rem;font-size:1.0625rem;font-weight:700;top:1.75rem}.ruler__pct{color:var(--r-text-2);font-size:1rem;font-weight:600;bottom:1.125rem}.ruler__num--first{transform:translate(3px)}.ruler__num--last{transform:translate(calc(-100% - 3px))}.ruler__unit{white-space:nowrap;font:600 1rem/1 var(--font-text);color:var(--r-text-2);position:absolute;left:calc(100% + .375rem)}.ruler__unit--top{top:calc(var(--h-flag) + var(--h-mark) + 1.9375rem)}.ruler__unit--bottom{top:calc(var(--h-flag) + var(--h-mark) + var(--h-body) - 2.125rem)}.ruler__pointer{height:calc(var(--h-flag) + var(--h-mark) + var(--h-body));z-index:3;width:0;top:0}.ruler__pointer:before{content:"";top:calc(var(--h-flag) - .25rem);background:var(--signal);width:3px;position:absolute;bottom:0;left:-1.5px}.ruler__pointer:after{content:"";top:calc(var(--h-flag) - .125rem);border:.5rem solid #0000;border-top-color:var(--signal);border-bottom-width:0;position:absolute;left:-.5rem}.ruler__bandtip,.ruler__flag{z-index:4;transform:translateX(calc(var(--p)*-100%));background:var(--signal);height:2rem;color:var(--on-signal);font:800 1.0625rem/2rem var(--font-text);white-space:nowrap;border-radius:.25rem;padding:0 .625rem}.ruler__flag{margin-left:calc((var(--p) - .5)*1rem);top:0}.ruler__band{--p:calc((var(--lo) - var(--min))/(var(--max) - var(--min)));width:calc((var(--hi) - var(--lo))/(var(--max) - var(--min))*100%);z-index:2;background:repeating-linear-gradient(-45deg,var(--signal) 0 2px,transparent 2px 6px);border-top:1px solid var(--signal);border-bottom:1px solid var(--signal);border-left:1px dashed var(--signal);height:1rem;top:calc(50% - .5rem)}.ruler__bandtip{--v:calc((var(--lo) + var(--hi))/2);top:calc(var(--h-flag) + var(--h-mark) + var(--h-body) + .625rem);height:1.75rem;line-height:1.75rem}.ruler__bandtip:before{content:"";border:.4375rem solid #0000;border-bottom-color:var(--signal);border-top-width:0;position:absolute;bottom:100%;left:calc(50% - .4375rem)}.ruler__marker{top:var(--h-flag);height:calc(var(--h-mark) + 1.625rem);z-index:1;width:0}.ruler__marker:before{content:"";background:var(--r-line);width:2px;position:absolute;top:.25rem;bottom:0;left:-1px}.ruler__marker--centre:before{background:repeating-linear-gradient(var(--r-line) 0 9px,transparent 9px 12px,var(--r-line) 12px 14px,transparent 14px 17px)}.ruler__marker-label{white-space:nowrap;font:700 1rem/var(--h-mark) var(--font-text);color:var(--r-text);position:absolute;top:0;left:.375rem}@container (width<=44rem){.ruler__pct--yield,.ruler__tk--fine{display:none}}@container (width<=30rem){.ruler__pct--dense{display:none}}.ruler--single{--h-body:4.25rem;--h-under:.5rem}.ruler__range{--p:calc((var(--lo) - var(--min))/(var(--max) - var(--min)));left:calc(var(--p)*100%);width:calc((var(--hi) - var(--lo))/(var(--max) - var(--min))*100%);top:calc(var(--h-flag) + .25rem);height:calc(var(--h-mark) - .25rem);border:2px solid var(--r-line);font:700 1.125rem/1.25rem var(--font-text);color:var(--r-text);text-align:center;white-space:nowrap;border-bottom:0;position:absolute}.ruler__range--reported{border-style:dashed}.legend{gap:var(--s-4);max-inline-size:var(--measure);display:grid}.legend li{gap:var(--s-3);grid-template-columns:2.75rem minmax(0,1fr);align-items:start;display:grid}.key{width:2.75rem;height:1.5rem;margin-block-start:.15rem;display:inline-block;position:relative}.key--you:before{content:"";background:var(--signal);border-radius:3px;position:absolute;inset:0 .375rem .5rem}.key--you:after{content:"";border:.375rem solid #0000;border-top-color:var(--signal);border-bottom-width:0;position:absolute;bottom:0;left:calc(50% - .375rem)}.key--band{background:repeating-linear-gradient(-45deg,var(--signal) 0 2px,transparent 2px 6px);border-top:1px solid var(--signal);border-bottom:1px solid var(--signal);border-left:1px dashed var(--signal);border-right:3px solid var(--signal);height:1rem;margin-block-start:.4rem}.key--centre:before,.key--mark:before{content:"";background:var(--ink);width:2px;position:absolute;top:0;bottom:0;left:50%}.key--centre:before{background:repeating-linear-gradient(var(--ink) 0 7px,transparent 7px 10px,var(--ink) 10px 12px,transparent 12px 15px)}.key--scale{border-bottom:2px solid var(--ink)}.key--ghost:before{content:"";background:var(--signal);opacity:.85;width:3px;height:1.5rem;position:absolute;top:0;left:calc(50% - 1.5px)}.key--scale:before{content:"";border-inline:2px solid var(--ink);background:linear-gradient(var(--ink),var(--ink)) 50% /2px 100% no-repeat;height:.5rem;position:absolute;bottom:0;left:.4rem;right:.4rem}.ruler__zone{--p:calc((var(--lo) - var(--min))/(var(--max) - var(--min)));height:2rem;bottom:.375rem;left:calc(var(--p)*100%);width:calc((var(--hi) - var(--lo))/(var(--max) - var(--min))*100%);font:600 1rem/1 var(--font-text);color:var(--r-text-2);place-items:center;display:grid;position:absolute}.ruler__zone.is-you{color:var(--r-text);text-underline-offset:.3em;font-weight:800;text-decoration:underline;text-decoration-thickness:3px}.ruler__ghost{background:var(--signal);opacity:.85;--p:calc((var(--v) - var(--min))/(var(--max) - var(--min)));width:3px;height:1.5rem;top:0;left:calc(var(--p)*100%);margin-left:-1.5px;position:absolute}.ruler__note{font-weight:700}.ruler__cite,.ruler__note{margin-block-start:var(--s-2)}.ruler__cite{font-size:var(--fs-body);color:var(--ink-2);max-inline-size:var(--measure)}.ruler--compact{--h-flag:2.25rem;--h-mark:.5rem;--h-body:3rem;--h-under:.5rem}.ruler--compact .ruler__num{top:1.125rem}.ruler--compact .ruler__marker-label{display:none}}@layer utilities;
