/* Local arrival-only control studies; the portfolio remains the surrounding UI. */
.gravity-control{position:fixed;z-index:8;right:5.2vw;bottom:36px;width:250px;color:#cbc9df;font-family:Arial,Helvetica,sans-serif;pointer-events:auto}
.gravity-control[hidden],.gravity-control [hidden]{display:none!important}
.gravity-control label{display:block;margin-bottom:13px;font-size:11px;line-height:1.5;letter-spacing:.035em;color:#c8c5df}
.gravity-control-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.gravity-control output{display:block;min-width:0;font-size:24px;font-weight:400;line-height:1.2;letter-spacing:-.045em;color:#e3e1f1}
.gravity-mass,.gravity-count{font-size:11px;line-height:1.5;letter-spacing:.015em;color:#aaa5c8;white-space:nowrap}
.gravity-control-scale{position:relative;margin-top:8px}
.gravity-control input[type=range]{appearance:none;-webkit-appearance:none;display:block;width:100%;height:44px;margin:0;padding:0;border:0;background:transparent;cursor:ew-resize;color:#cbc5e8}
.gravity-control input[type=range]::-webkit-slider-runnable-track{height:1px;background:#b2aace73}
.gravity-control input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:3px;height:13px;margin-top:-6px;border:0;border-radius:0;background:#ddd8f3}
.gravity-control input[type=range]::-moz-range-track{height:1px;border:0;background:#b2aace73}
.gravity-control input[type=range]::-moz-range-thumb{width:3px;height:13px;border:0;border-radius:0;background:#ddd8f3}
.gravity-control input:focus,.gravity-control button:focus{outline:none}
.gravity-control-ticks{position:absolute;inset:22px 1px auto;display:flex;justify-content:space-between;pointer-events:none}
.gravity-control-ticks span{display:block;width:1px;height:5px;background:#b2aace73}
.gravity-control-ticks .is-active{background:#ded8f3}
.gravity-control-caption{margin:0;font-size:10px;line-height:1.5;letter-spacing:.015em;color:#918bad}
.gravity-control-actions{display:flex;justify-content:flex-end;margin-top:5px}
.gravity-control button{font-family:inherit;cursor:pointer}
.gravity-control button:disabled{cursor:default}
.gravity-control .gravity-restore{min-height:44px;padding:0;border:0;background:transparent;color:#c3bddf;font-size:11px;line-height:1.25;text-align:right}
/* 02: an editorial index, with one native button in the tab order. */
.gravity-control--index{width:300px}
.gravity-control--index label{margin-bottom:8px}
.gravity-control-index{display:grid;margin-bottom:13px}
.gravity-control-option{position:relative;display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:8px;width:100%;min-height:44px;padding:0;border:0;background:transparent;color:#a5a0bd;text-align:left}
.gravity-option-number{font-size:10px;letter-spacing:.015em;color:#79748e}
.gravity-option-name{font-size:16px;line-height:1.2;letter-spacing:-.025em}
.gravity-option-mass{font-size:10px;letter-spacing:.015em;color:#8e88a7}
.gravity-control-option[aria-checked=true]{color:#e3e1f1}
.gravity-control-option[aria-checked=true]::before{content:"";position:absolute;left:-12px;top:14px;width:1px;height:16px;background:#c5b9ed}
.gravity-control-option[aria-checked=true] .gravity-option-number,.gravity-control-option[aria-checked=true] .gravity-option-mass{color:#bdb4d9}
/* 03: small directional controls frame the source; the scale stays directly usable. */
.gravity-control--stepper{width:280px}
.gravity-control--stepper output{font-size:28px}
.gravity-stepper-navigation{display:flex;align-items:center;justify-content:space-between;margin-top:5px}
.gravity-step-button{display:flex;align-items:center;justify-content:center;width:44px;min-height:44px;padding:0;border:0;background:transparent;color:#ccc5e7}
.gravity-step-button:first-child{margin-left:-10px}.gravity-step-button:last-child{margin-right:-10px}
.gravity-step-button:disabled{color:#5f5a78}
.gravity-control--stepper .gravity-control-scale{margin-top:0}
.gravity-control--stepper input[type=range]::-webkit-slider-runnable-track{background:transparent}
.gravity-control--stepper input[type=range]::-moz-range-track{background:transparent}
.gravity-control--stepper .gravity-control-ticks{gap:7px;inset:22px 0 auto}
.gravity-control--stepper .gravity-control-ticks span{flex:1;width:auto;height:1px}
/* Selected editorial treatment uses type and marker cues instead of focus boxes. */
.gravity-control-option:focus-visible .gravity-option-name{color:#eeeaff;text-decoration:underline;text-decoration-color:#c5b9ed;text-decoration-thickness:1px;text-underline-offset:5px}
.gravity-control-option:focus-visible::before{content:"";position:absolute;left:-12px;top:14px;width:2px;height:16px;background:#e2d9ff}
.gravity-control .gravity-restore:focus-visible{text-decoration:underline;text-decoration-color:#c5b9ed;text-decoration-thickness:1px;text-underline-offset:5px;color:#eeeaff}
.gravity-step-button:focus-visible{color:#eeeaff}
.gravity-control input[type=range]:focus-visible::-webkit-slider-thumb{background:#eeeaff;width:4px}
.gravity-control input[type=range]:focus-visible::-moz-range-thumb{background:#eeeaff;width:4px}
@media(max-width:1023px),(hover:none),(pointer:coarse),(prefers-reduced-motion:reduce){.gravity-control{display:none}}
