quaternion-rotation-lab{--qrl-ink:#292524;--qrl-muted:#57534e;--qrl-border:#d6d3d1;--qrl-surface:#faf8f4;--qrl-panel:#f0ebe3;--qrl-accent:#8b5e34;--qrl-accent-hover:#704827;--qrl-face-a:#d6a66b;--qrl-face-b:#8b6e4e;--qrl-face-c:#b98954;--qrl-face-d:#ead7bc;--qrl-face-e:#c49a6c;--qrl-face-f:#f0e3d0;--qrl-edge:#3f3227;text-align:left;margin:2.25rem 0 3rem;display:block}quaternion-rotation-lab *,quaternion-rotation-lab :before,quaternion-rotation-lab :after{box-sizing:border-box}quaternion-rotation-lab .qrl-card{border:1px solid var(--qrl-border);background:var(--qrl-surface);color:var(--qrl-ink);font-family:var(--font-sans);border-radius:.85rem;font-size:.875rem;line-height:1.45;overflow:hidden;box-shadow:0 14px 38px #29252414}quaternion-rotation-lab .qrl-heading{border-bottom:1px solid var(--qrl-border);justify-content:space-between;align-items:start;gap:1rem;padding:1.25rem 1.35rem;display:flex}quaternion-rotation-lab .qrl-eyebrow{color:var(--qrl-accent);letter-spacing:.18em;text-transform:uppercase;font-size:.66rem;font-weight:700;margin:0 0 .25rem!important}quaternion-rotation-lab h3#qrl-title{color:var(--qrl-ink);font-family:var(--font-serif);margin:0;font-size:1.3rem;line-height:1.25}quaternion-rotation-lab .qrl-intro{max-width:34rem;color:var(--qrl-muted);font-size:.82rem;margin:.35rem 0 0!important}quaternion-rotation-lab .qrl-layout{grid-template-columns:minmax(19rem,.9fr) minmax(18rem,1.1fr);display:grid}quaternion-rotation-lab .qrl-controls{border-right:1px solid var(--qrl-border);padding:1.25rem}quaternion-rotation-lab .qrl-table-wrap{border:1px solid var(--qrl-border);background:#fff;border-radius:.45rem;max-height:13rem;overflow:auto}.article-content quaternion-rotation-lab .qrl-table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;margin:0;font-size:.78rem}.article-content quaternion-rotation-lab .qrl-table thead,.article-content quaternion-rotation-lab .qrl-table tbody{border:0}.article-content quaternion-rotation-lab .qrl-table th,.article-content quaternion-rotation-lab .qrl-table td{text-align:center;border:0;border-bottom:1px solid #eee9e2;padding:.42rem .3rem}.article-content quaternion-rotation-lab .qrl-table thead th{z-index:1;color:var(--qrl-muted);letter-spacing:.04em;background:#f3efe9;font-size:.68rem;font-weight:700;position:sticky;top:0}.article-content quaternion-rotation-lab .qrl-table tbody tr:hover{background:0 0}quaternion-rotation-lab input,quaternion-rotation-lab select,quaternion-rotation-lab button{font:inherit}quaternion-rotation-lab input,quaternion-rotation-lab select{border:1px solid var(--qrl-border);width:100%;min-height:2.2rem;color:var(--qrl-ink);background:#fff;border-radius:.35rem}quaternion-rotation-lab input{text-align:right;min-width:3.6rem;padding:.4rem}quaternion-rotation-lab select{padding:.35rem 2rem .35rem .55rem}quaternion-rotation-lab input:focus-visible,quaternion-rotation-lab select:focus-visible,quaternion-rotation-lab button:focus-visible{outline-offset:2px;outline:2px solid #b7793b}quaternion-rotation-lab button{border:1px solid var(--qrl-border);min-height:2.25rem;color:var(--qrl-ink);cursor:pointer;background:0 0;border-radius:.4rem;transition:border-color .15s,background-color .15s,color .15s}quaternion-rotation-lab button:hover{background:#78716c12;border-color:#a8a29e}quaternion-rotation-lab .qrl-preset,quaternion-rotation-lab .qrl-add{color:var(--qrl-accent);padding:.35rem .65rem;font-size:.74rem;font-weight:600}quaternion-rotation-lab .qrl-add{border-style:dashed;width:100%;margin-top:.6rem}quaternion-rotation-lab .qrl-remove{color:#78716c;border:0;width:1.8rem;min-height:1.8rem;font-size:1.15rem;line-height:1}quaternion-rotation-lab .qrl-remove:disabled{cursor:not-allowed;opacity:.3}quaternion-rotation-lab .qrl-settings{grid-template-columns:1fr 1.3fr;gap:.75rem;margin-top:1rem;display:grid}quaternion-rotation-lab .qrl-settings label{color:var(--qrl-muted);letter-spacing:.04em;gap:.35rem;font-size:.7rem;font-weight:700;display:grid}quaternion-rotation-lab .qrl-input-with-unit{display:block;position:relative}quaternion-rotation-lab .qrl-input-with-unit input{padding-right:1.65rem}quaternion-rotation-lab .qrl-input-with-unit>span{color:var(--qrl-muted);font-weight:500;position:absolute;top:50%;right:.6rem;transform:translateY(-50%)}quaternion-rotation-lab .qrl-actions{gap:.6rem;margin-top:1rem;display:flex}quaternion-rotation-lab .qrl-actions button{flex:1;padding:.45rem .75rem;font-weight:600}quaternion-rotation-lab .qrl-actions .qrl-primary{border-color:var(--qrl-accent);background:var(--qrl-accent);color:#fffdf8}quaternion-rotation-lab .qrl-actions .qrl-primary:hover{border-color:var(--qrl-accent-hover);background:var(--qrl-accent-hover)}quaternion-rotation-lab .qrl-hint{color:var(--qrl-muted);font-size:.68rem;margin:.65rem 0 0!important}quaternion-rotation-lab .qrl-stage{background:radial-gradient(circle at 50% 42%, #8b6e4e1f, transparent 48%), linear-gradient(var(--qrl-panel), var(--qrl-surface));flex-direction:column;justify-content:center;min-width:0;min-height:24rem;padding:1rem 1rem .85rem;display:flex}quaternion-rotation-lab canvas{width:100%;height:19rem;display:block}quaternion-rotation-lab .qrl-progress{background:var(--qrl-border);border-radius:99px;height:3px;margin:.25rem 0 .7rem;overflow:hidden}quaternion-rotation-lab .qrl-progress span{background:var(--qrl-accent);width:0;height:100%;transition:width 80ms linear;display:block}quaternion-rotation-lab .qrl-status{min-height:2.25rem;color:var(--qrl-muted);text-align:center;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.68rem;line-height:1.45}quaternion-rotation-lab .qrl-sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}@media (width<=720px){quaternion-rotation-lab .qrl-layout{grid-template-columns:1fr}quaternion-rotation-lab .qrl-controls{border-right:0;border-bottom:1px solid var(--qrl-border)}quaternion-rotation-lab .qrl-stage{min-height:21rem}quaternion-rotation-lab canvas{height:16rem}}@media (width<=440px){quaternion-rotation-lab .qrl-heading{flex-direction:column}quaternion-rotation-lab .qrl-preset{width:100%}quaternion-rotation-lab .qrl-settings{grid-template-columns:1fr}}@media (prefers-color-scheme:dark){quaternion-rotation-lab{--qrl-ink:#e7e5e4;--qrl-muted:#a8a29e;--qrl-border:#44403c;--qrl-surface:#151412;--qrl-panel:#1c1917;--qrl-accent:#c9a77c;--qrl-accent-hover:#d7b48a;--qrl-face-a:#9d7145;--qrl-face-b:#5f4937;--qrl-face-c:#795737;--qrl-face-d:#b58c61;--qrl-face-e:#8b6641;--qrl-face-f:#c4a37e;--qrl-edge:#ede4d9}quaternion-rotation-lab .qrl-card{box-shadow:none}quaternion-rotation-lab .qrl-table-wrap,quaternion-rotation-lab input,quaternion-rotation-lab select{background:#0f0e0d}.article-content quaternion-rotation-lab .qrl-table thead th{background:#24201c}.article-content quaternion-rotation-lab .qrl-table th,.article-content quaternion-rotation-lab .qrl-table td{border-bottom-color:#292524}}@media (prefers-reduced-motion:reduce){quaternion-rotation-lab button,quaternion-rotation-lab .qrl-progress span{transition:none}}
