.kinetic-page{--accent:#536c7b}.kinetic-page .facade-heading h1 span,.kinetic-page .quiet-button,.kinetic-page .facade-controls output{color:var(--accent)}.kinetic-page input[type=range],.kinetic-page input[type=checkbox]{accent-color:var(--accent)}.kinetic-page .facade-workbench{background:#f2f3ef}.kinetic-page .material-label i{background:linear-gradient(130deg,#123c8f,#a6d5ff 42%,#2155e9 50%,#122b66);border-color:#536c7b}.kinetic-page .facade-notes .button{background:var(--accent);border-color:var(--accent)}#kinetic-stage{position:relative;min-height:530px;flex:1;overflow:hidden}#kinetic-canvas{display:block;position:absolute;inset:0;width:100%;height:100%;touch-action:none}.finish-options{display:flex;gap:12px}.finish-options button{width:38px;height:38px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px #ccd1da;background:var(--swatch);cursor:pointer}.finish-options button[aria-pressed=true]{box-shadow:0 0 0 2px var(--accent)}#finish-name{font-size:.75rem;margin:.6rem 0 .3rem}.kinetic-page input:focus-visible,.kinetic-page button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}@media(max-width:680px){#kinetic-stage{min-height:370px}.finish-options{gap:8px}.finish-options button{width:30px;height:30px}.kinetic-page .model-options{gap:.6rem}}
.custom-finish{margin-top:1rem}.colour-wheel{display:block;position:relative;width:160px;max-width:100%;aspect-ratio:1;border:0;border-radius:50%;padding:0;margin:0 auto 1rem;background:#000;cursor:crosshair;touch-action:none}.colour-wheel:before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle,white,transparent 70.7%),conic-gradient(from 90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);opacity:var(--brightness,1)}#wheel-cursor{position:absolute;width:13px;height:13px;border:2px solid white;border-radius:50%;box-shadow:0 0 0 1px #0009;transform:translate(-50%,-50%);pointer-events:none}.colour-entry{display:flex;gap:.6rem;align-items:center}.colour-entry input[type=color]{width:38px;height:34px;padding:2px;border:1px solid #ccd1da;background:white;border-radius:6px;cursor:pointer}.colour-entry input[type=text]{min-width:0;width:100%;padding:.45rem;border:1px solid #ccd1da;border-radius:6px;font:inherit;font-size:.75rem}.colour-wheel:focus-visible{outline:2px solid var(--accent);outline-offset:5px}

.kinetic-page .motion-toggle{justify-content:flex-start;gap:.5rem;margin-top:.6rem}.kinetic-page .material-label i{background:linear-gradient(130deg,#748592,#f4f8fa 42%,#9facb6 70%);border-color:#7f929f}