:root{font-family:var(--font-brand);font-weight:500;color:#172140;background:#f5f5ee;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}input::file-selector-button{font:inherit}button{cursor:pointer}header{height:92px;display:flex;align-items:center;padding:0 42px;border-bottom:1px solid #dcded5;gap:65px}.brand{text-decoration:none;color:inherit;font-size:30px;letter-spacing:-1.7px;font-weight:700}.brand span{font-size:11px;vertical-align:top;letter-spacing:0;margin-left:4px}.identity,.live,.eyebrow,.section-title,.stage-head,.stage-foot,.below,.range-ends{font-size:10px;letter-spacing:1.5px}.identity span{color:#aaa;margin:0 14px}.live{margin-left:auto;letter-spacing:1px;color:#626954}main{display:grid;grid-template-columns:minmax(0,1fr) 326px;min-height:calc(100vh - 92px)}.workspace{padding:45px 42px 24px;min-width:0}.intro{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:35px;gap:20px}.eyebrow{font-weight:700;font-size:9px;letter-spacing:1.7px;margin:0 0 19px}h1{font-size:clamp(34px,3.7vw,58px);font-weight:500;line-height:1.06;letter-spacing:-2.5px;margin:0}h1 span{color:#9da855}.intro-note{font-size:11px;color:#858a7e;line-height:1.9;margin-bottom:4px}.stage-wrap{background:#0a1a53;color:#fefed4;border-radius:5px;overflow:hidden;box-shadow:0 15px 40px #0a1a5309}.stage-head,.stage-foot{display:flex;justify-content:space-between;padding:22px 25px;font-size:8px;letter-spacing:1.1px;color:#c0c8df}.stage-head{border-bottom:1px solid #ffffff13}.stage-foot{align-items:center;border-top:1px solid #ffffff13;letter-spacing:.6px}.stage-foot i{display:inline-block;width:5px;height:5px;background:#fcea30;border-radius:50%;margin-right:7px}.stage-foot button{border:0;background:none;color:inherit;font-size:10px}#stage{height:clamp(280px,38vw,520px);position:relative}canvas{display:block;width:100%;height:100%}.below{display:flex;justify-content:space-between;font-size:8px;color:#838779;letter-spacing:1px;margin-top:25px}aside{background:#fbfbf6;border-left:1px solid #dcded5;padding:35px 28px 23px}.panel-heading .eyebrow{color:#8a907d;margin-bottom:12px}h2{font-size:27px;font-weight:500;letter-spacing:-1px;margin:0}.panel-heading>p:last-child{font-size:11px;color:#929788;margin:10px 0 28px}.control-section{border-top:1px solid #e3e5da;padding:22px 0}.section-title{font-size:9px;letter-spacing:1.2px;margin-bottom:20px;font-weight:700}.section-title>span{color:#9ca18e;margin-right:13px}.segments{display:flex;background:#eceee5;border-radius:5px;padding:3px;gap:2px}.segments button{flex:1;border:0;background:none;color:#878d7b;padding:9px 3px;font-size:10px;border-radius:3px}.segments button.active{color:#172140;background:#fff;box-shadow:0 1px 4px #0000000c}.select-label{display:block;color:#858a7e;font-size:10px;margin-top:18px}select{width:100%;border:1px solid #dce0d2;border-radius:4px;background:transparent;color:#27304a;margin-top:8px;padding:10px;font-size:11px}.range-label{display:flex;align-items:center;font-size:11px;margin:18px 0 13px;gap:9px}.range-label>span,.toggle-row>span{font-size:10px;color:#9a9f91}.range-label output{margin-left:auto;font-variant-numeric:tabular-nums;font-size:10px;background:#eceee4;padding:5px 7px;border-radius:3px}input[type=range]{appearance:none;display:block;width:100%;height:3px;background:#dce0d0;accent-color:#1a284f;cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:13px;height:13px;border-radius:50%;background:#192851;border:3px solid #fbfbf6;box-shadow:0 0 0 1px #192851}.range-ends{display:flex;justify-content:space-between;font-size:8px;letter-spacing:0;color:#a3a795;margin-top:10px}.toggle-row{display:flex;align-items:center;gap:8px;font-size:11px;margin:17px 0}.toggle-row input{margin-left:auto;accent-color:#17244c;width:27px;height:15px}.palette{display:flex;align-items:center;gap:9px;margin-top:23px}.palette button{background:var(--swatch);height:24px;width:24px;border-radius:50%;border:3px solid #fbfbf6;outline:1px solid #dadfcd}.palette button.active{outline-color:#18244a}.palette span{font-size:10px;color:#868d77;margin-left:auto}.actions{display:flex;flex-direction:column;gap:12px}.actions button{border:0;background:none;font-size:10px;color:#959b89;padding:7px}.actions .export{background:#17244c;color:#fefed4;border-radius:4px;padding:14px 16px;text-align:left;font-size:11px}.export span{float:right}.panel-note{color:#a1a693;font-size:9px;line-height:1.8;margin-top:24px}#status{font-size:10px;color:#59674b}@media(min-width:1600px){.workspace{padding:55px 65px}header{padding:0 65px}main{grid-template-columns:minmax(0,1fr) 350px}}@media(max-width:850px){header{padding:0 22px;height:75px}.identity{display:none}main{grid-template-columns:1fr}.workspace{padding:30px 20px}.intro-note{display:none}aside{border-top:1px solid #ddd;border-left:0}.below{font-size:7px}.stage-head{padding:18px 15px}.stage-head span:last-child{display:none}h1{font-size:42px}#stage{height:350px}}
.cube-lab{display:grid;grid-template-columns:minmax(0,1fr) 326px;border-top:1px solid #dcded5}.cube-work{padding:55px 42px 35px;min-width:0}.cube-frame{border-radius:5px;background:#080a0b;color:#fcea30;overflow:hidden}.cube-frame .stage-head,.cube-frame .stage-foot{color:inherit;opacity:.7}#cube-stage{height:580px;cursor:grab}#cube-stage:active{cursor:grabbing}.cube-lab aside{padding-top:43px}.cube-lab .control-section{padding:19px 0}.cube-lab .range-label{font-size:10px}.cube-lab .intro-note{max-width:220px}@media(min-width:1600px){.cube-lab{grid-template-columns:minmax(0,1fr) 350px}.cube-work{padding:55px 65px}}@media(max-width:850px){.cube-lab{grid-template-columns:1fr}.cube-work{padding:35px 20px}#cube-stage{height:430px}.cube-lab .stage-head span:last-child{display:none}}
@media(min-width:851px){.cube-work{position:sticky;top:-170px;align-self:start}}
.avatar-frame{border-radius:5px;overflow:hidden;background:#fefed4}.avatar-frame .stage-head,.avatar-frame .stage-foot{color:inherit;border-color:#17214012}.avatar-frame .stage-head{opacity:.65}.avatar-frame .stage-foot{font-size:8px}#avatar-stage{height:610px;cursor:pointer}.avatar-picker{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;max-height:215px;overflow:auto;padding:3px}.avatar-picker button{background:#f0f0e5;border:1px solid transparent;border-radius:4px;padding:0;aspect-ratio:1}.avatar-picker button.active{border-color:#17244c;background:#fff}.avatar-picker canvas{width:100%;height:100%}.avatar-navigation{display:flex;justify-content:space-between;margin-top:12px}.avatar-navigation button{border:0;background:none;color:#7e8670;font-size:10px;padding:5px}#avatar-selected-label{float:right;letter-spacing:0}#avatar-status{font-size:10px;color:#66754d}.avatar-lab input:disabled{opacity:.3;cursor:default}@media(max-width:850px){#avatar-stage{height:520px}}
#people-stage{height:610px;cursor:pointer}#people-status{font-size:10px;color:#66754d}#people-selected-label{float:right;letter-spacing:0}@media(max-width:850px){#people-stage{height:520px}}
.pattern-frame{background:#0a1a53;border-radius:5px;overflow:hidden;color:#fefed4}.pattern-frame .stage-head,.pattern-frame .stage-foot{color:inherit;opacity:.7}#pattern-stage{height:610px}.pattern-frame .stage-foot button{border:0;background:transparent;color:inherit;font-size:10px;cursor:pointer}.pattern-colors{display:flex;gap:13px;margin:18px 0 22px}.pattern-colors label{flex:1;font-size:9px;color:#878d7d}.pattern-colors input{display:block;width:100%;height:35px;border:1px solid #dce0d0;border-radius:4px;background:transparent;margin-top:8px;cursor:pointer}#pattern-seed{display:block;width:100%;padding:10px;border:1px solid #dce0d0;border-radius:4px;background:transparent;margin-top:8px;color:#17244c;font:inherit}.pattern-random{width:100%;padding:11px;border:1px solid #dce0d0;border-radius:4px;background:transparent;font-size:10px;color:#59634d;margin-top:12px;cursor:pointer}#pattern-status{font-size:10px;color:#66754d}@media(max-width:850px){#pattern-stage{height:460px}}
.parameter-io{margin-top:18px}.parameter-io input[type=file]{display:block;width:100%;margin-top:12px;font-size:10px;color:#17244c}.parameter-io p{font-size:10px;color:#8b927f;line-height:1.8}.parameter-status{font-size:10px;line-height:1.6;color:#53663e;overflow-wrap:anywhere}.export:disabled{opacity:.5;cursor:wait}
.brand{display:inline-flex;align-items:center;flex-shrink:0;line-height:1}.brand-logo{display:block;width:88px;height:64px;overflow:hidden}@media(max-width:850px){.brand-logo{width:74px;height:54px}}

h1{font-weight:400}.intro-note,.panel-note,.parameter-io p{font-weight:400}.eyebrow,.section-title{font-weight:700}