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;display:block;margin:2.25rem 0 3rem;text-align:left}quaternion-rotation-lab *,quaternion-rotation-lab *:before,quaternion-rotation-lab *:after{box-sizing:border-box}quaternion-rotation-lab .qrl-card{overflow:hidden;border:1px solid var(--qrl-border);border-radius:.85rem;background:var(--qrl-surface);box-shadow:0 14px 38px #29252414;color:var(--qrl-ink);font-family:Inter,sans-serif;font-size:.875rem;line-height:1.45}quaternion-rotation-lab .qrl-heading{display:flex;align-items:start;justify-content:space-between;gap:1rem;padding:1.25rem 1.35rem;border-bottom:1px solid var(--qrl-border)}quaternion-rotation-lab .qrl-eyebrow{margin:0 0 .25rem!important;color:var(--qrl-accent);font-size:.66rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase}quaternion-rotation-lab h3#qrl-title{margin:0;color:var(--qrl-ink);font-family:Literata,serif;font-size:1.3rem;line-height:1.25}quaternion-rotation-lab .qrl-intro{max-width:34rem;margin:.35rem 0 0!important;color:var(--qrl-muted);font-size:.82rem}quaternion-rotation-lab .qrl-layout{display:grid;grid-template-columns:minmax(19rem,.9fr) minmax(18rem,1.1fr)}quaternion-rotation-lab .qrl-controls{padding:1.25rem;border-right:1px solid var(--qrl-border)}quaternion-rotation-lab .qrl-table-wrap{max-height:13rem;overflow:auto;border:1px solid var(--qrl-border);border-radius:.45rem;background:#fff}.article-content quaternion-rotation-lab .qrl-table{width:100%;margin:0;border-collapse:collapse;font-size:.78rem;font-variant-numeric:tabular-nums}.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{padding:.42rem .3rem;border:0;border-bottom:1px solid #eee9e2;text-align:center}.article-content quaternion-rotation-lab .qrl-table thead th{position:sticky;top:0;z-index:1;background:#f3efe9;color:var(--qrl-muted);font-size:.68rem;font-weight:700;letter-spacing:.04em}.article-content quaternion-rotation-lab .qrl-table tbody tr:hover{background:transparent}quaternion-rotation-lab input,quaternion-rotation-lab select,quaternion-rotation-lab button{font:inherit}quaternion-rotation-lab input,quaternion-rotation-lab select{width:100%;min-height:2.2rem;border:1px solid var(--qrl-border);border-radius:.35rem;background:#fff;color:var(--qrl-ink)}quaternion-rotation-lab input{min-width:3.6rem;padding:.4rem;text-align:right}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:2px solid #b7793b;outline-offset:2px}quaternion-rotation-lab button{min-height:2.25rem;border:1px solid var(--qrl-border);border-radius:.4rem;background:transparent;color:var(--qrl-ink);cursor:pointer;transition:border-color .15s ease,background-color .15s ease,color .15s ease}quaternion-rotation-lab button:hover{border-color:#a8a29e;background:#78716c12}quaternion-rotation-lab .qrl-preset,quaternion-rotation-lab .qrl-add{padding:.35rem .65rem;color:var(--qrl-accent);font-size:.74rem;font-weight:600}quaternion-rotation-lab .qrl-add{width:100%;margin-top:.6rem;border-style:dashed}quaternion-rotation-lab .qrl-remove{width:1.8rem;min-height:1.8rem;border:0;color:#78716c;font-size:1.15rem;line-height:1}quaternion-rotation-lab .qrl-remove:disabled{cursor:not-allowed;opacity:.3}quaternion-rotation-lab .qrl-settings{display:grid;grid-template-columns:1fr 1.3fr;gap:.75rem;margin-top:1rem}quaternion-rotation-lab .qrl-settings label{display:grid;gap:.35rem;color:var(--qrl-muted);font-size:.7rem;font-weight:700;letter-spacing:.04em}quaternion-rotation-lab .qrl-input-with-unit{position:relative;display:block}quaternion-rotation-lab .qrl-input-with-unit input{padding-right:1.65rem}quaternion-rotation-lab .qrl-input-with-unit>span{position:absolute;top:50%;right:.6rem;color:var(--qrl-muted);font-weight:500;transform:translateY(-50%)}quaternion-rotation-lab .qrl-actions{display:flex;gap:.6rem;margin-top:1rem}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{margin:.65rem 0 0!important;color:var(--qrl-muted);font-size:.68rem}quaternion-rotation-lab .qrl-stage{display:flex;min-width:0;min-height:24rem;flex-direction:column;justify-content:center;padding:1rem 1rem .85rem;background:radial-gradient(circle at 50% 42%,rgb(139 110 78 / 12%),transparent 48%),linear-gradient(var(--qrl-panel),var(--qrl-surface))}quaternion-rotation-lab canvas{display:block;width:100%;height:19rem}quaternion-rotation-lab .qrl-progress{overflow:hidden;height:3px;margin:.25rem 0 .7rem;border-radius:99px;background:var(--qrl-border)}quaternion-rotation-lab .qrl-progress span{display:block;width:0;height:100%;background:var(--qrl-accent);transition:width 80ms linear}quaternion-rotation-lab .qrl-status{min-height:2.25rem;color:var(--qrl-muted);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.68rem;line-height:1.45;text-align:center}quaternion-rotation-lab .qrl-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;clip-path:inset(50%)}@media(max-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(max-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}}