.wheel-page{background:#f4f1ea;color:#20221f;min-height:100vh}
.wheel-intro{padding:65px clamp(20px,5vw,84px) 50px;display:flex;align-items:end;justify-content:space-between;gap:40px;border-bottom:1px solid #dedbd2}
.wheel-intro-copy{max-width:920px}.wheel-kicker{font:800 11px 'Manrope',sans-serif;letter-spacing:.18em;color:#777a71;margin:0 0 20px}
.wheel-intro h1{font:800 clamp(48px,6.2vw,96px)/1.03 'Manrope',sans-serif;letter-spacing:-.075em;margin:0 0 22px}.wheel-intro h1 em{font-family:Georgia,serif;font-weight:400;letter-spacing:-.07em}
.wheel-intro-copy>p:last-child{font:400 clamp(15px,1.45vw,20px)/1.55 'DM Sans',sans-serif;color:#62675f;max-width:620px;margin:0}
.wheel-intro-stamp{width:150px;height:150px;border:1px solid #a5a597;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;transform:rotate(10deg);flex-shrink:0}.wheel-intro-stamp span{font:800 9px 'Manrope',sans-serif;letter-spacing:.15em;color:#777a71}.wheel-intro-stamp strong{font:800 19px/1.05 'Manrope',sans-serif;text-align:center;letter-spacing:-.05em}
.wheel-workspace{display:grid;grid-template-columns:minmax(390px,1fr) minmax(380px,1fr);gap:clamp(20px,4vw,70px);padding:56px clamp(20px,5vw,84px) 90px;max-width:1700px;margin:auto}
.wheel-left,.wheel-right{min-width:0}.wheel-card{background:#fbfaf7;border:1px solid #dedbd2;padding:clamp(16px,2vw,30px)}.wheel-card-top{display:flex;justify-content:space-between;gap:10px;font:800 10px 'Manrope',sans-serif;letter-spacing:.16em;color:#7b7f75}
.wheel-svg-wrap{width:min(100%,630px);margin:0 auto}.wheel-svg-wrap svg{display:block;width:100%;height:auto;overflow:visible}
.wheel-segment{cursor:pointer;transition:opacity .18s,filter .18s}.wheel-segment:hover,.wheel-segment:focus-visible{filter:brightness(1.1);outline:none}.wheel-segment[data-active="true"]{stroke:#20221f;stroke-width:2.5;paint-order:stroke fill}.wheel-pointers{pointer-events:none}.wheel-pointers line,.wheel-pointers polygon{fill:#fbfaf7a6;stroke:#20221f;stroke-width:2}.wheel-pointers circle{fill:#fbfaf7;stroke:#20221f;stroke-width:2}.wheel-hub{fill:#20221f}.wheel-hub-text{font:800 20px 'Manrope',sans-serif;fill:#fff;letter-spacing:-.12em}.wheel-hub-dot{fill:#e5ad20}
.wheel-instruction{font-size:12px;color:#73776e;line-height:1.6;text-align:center;margin:4px 0 0}.wheel-base-control{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;margin-top:14px;padding:14px 18px;border:1px solid #dedbd2;background:#fbfaf7}.wheel-base-control label{font:800 10px 'Manrope',sans-serif;letter-spacing:.12em;color:#777b73}.wheel-base-control select{min-width:0;width:100%;border:0;background:transparent;color:#20221f;font:800 13px 'Manrope',sans-serif;outline-offset:3px}
.wheel-neutral-heading{display:flex;justify-content:space-between;gap:10px;align-items:center;border-top:1px solid #dedbd2;margin-top:22px;padding-top:18px;font:800 10px 'Manrope',sans-serif;letter-spacing:.12em}.wheel-neutral-heading span{color:#797d75;font-weight:600;letter-spacing:0}.wheel-neutral{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:4px;margin-top:10px}.wheel-neutral button{height:34px;border:1px solid #a7a9a2;min-width:0;cursor:pointer}.wheel-neutral button[aria-pressed="true"]{outline:2px solid #222;outline-offset:2px}.wheel-neutral-note{padding:12px 15px;background:#e8e5dc;color:#454942;font-size:12px;line-height:1.5}.wheel-hex-fields{display:flex;align-items:center;gap:12px;min-width:0}.wheel-hex-fields input[type="text"]{width:100%;min-width:0;height:38px;padding:5px 9px;border:1px solid #c9c6bd;background:#fff;color:#20221f;font:800 14px 'Manrope',sans-serif}.wheel-hex-fields input[type="color"]{width:46px;height:38px;padding:2px;border:1px solid #c9c6bd;background:#fff;flex-shrink:0;cursor:pointer}.wheel-hex-fields input:focus-visible,.wheel-neutral button:focus-visible{outline:2px solid #a37500;outline-offset:2px}
.wheel-panel-head{display:flex;justify-content:space-between;align-items:end;gap:20px;border-bottom:1px solid #d7d4c9;padding-bottom:20px}.wheel-panel-head .wheel-kicker{margin-bottom:10px}.wheel-panel-head h2{font:800 clamp(35px,3.5vw,56px)/1.05 'Manrope',sans-serif;letter-spacing:-.07em;margin:0}.wheel-panel-head h2 span{color:#d7a925}.wheel-panel-head>span{font:800 10px 'Manrope',sans-serif;color:#85877e;letter-spacing:.14em;white-space:nowrap}.wheel-panel-intro{font-size:15px;line-height:1.6;color:#646960;margin:22px 0 24px;max-width:620px}
.wheel-schemes{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}.wheel-schemes button{border:1px solid #cdc9bd;background:#fbfaf7;color:#30342e;padding:11px 15px;font:800 12px 'Manrope',sans-serif;border-radius:999px;line-height:1.2}.wheel-schemes button[aria-pressed="true"]{background:#202620;border-color:#202620;color:white}.wheel-schemes button:focus-visible,.wheel-rotate button:focus-visible,.wheel-actions button:focus-visible,.wheel-actions a:focus-visible,.wheel-color button:focus-visible,.wheel-color a:focus-visible{outline:2px solid #a37500;outline-offset:3px}
.wheel-rotate{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #d7d4c9;border-bottom:1px solid #d7d4c9;padding:11px 0;gap:15px}.wheel-rotate>span{font:800 10px 'Manrope',sans-serif;letter-spacing:.13em;color:#777b73}.wheel-rotate>div{display:flex;gap:6px}.wheel-rotate button{width:38px;height:38px;border:1px solid #c8c7bb;background:#fbfaf7;color:#20221f;border-radius:50%;font-size:19px;line-height:1}
.wheel-palette{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:20px 0 24px}.wheel-color{background:#fbfaf7;border:1px solid #dedbd2;min-width:0}.wheel-color-swatch{height:clamp(80px,9vw,135px);display:flex;align-items:end;padding:12px}.wheel-color-swatch span{font:800 10px 'Manrope',sans-serif;letter-spacing:.1em;background:#fbfaf7ed;padding:7px 9px}.wheel-color-info{padding:15px}.wheel-color-info strong{display:block;font:800 16px 'Manrope',sans-serif;letter-spacing:-.04em;line-height:1.3}.wheel-color-info small{display:block;color:#777b73;margin:4px 0 15px;font-size:11px}.wheel-color-info>div{display:flex;align-items:center;justify-content:space-between;gap:8px}.wheel-color-info code{font:800 12px 'Manrope',sans-serif}.wheel-color-info button{border:0;background:transparent;font:800 11px 'Manrope',sans-serif;color:#755410;padding:5px;white-space:nowrap}.wheel-color-info a{display:inline-block;font:800 11px 'Manrope',sans-serif;margin-top:12px;text-decoration:underline;text-underline-offset:3px}
.wheel-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.wheel-actions button{border:0;background:#202620;color:white;padding:16px 19px;font:800 12px 'Manrope',sans-serif;display:flex;gap:25px;justify-content:space-between}.wheel-actions a{padding:14px;font:800 12px 'Manrope',sans-serif;text-decoration:underline;text-underline-offset:4px}.wheel-status{min-height:20px;color:#5e665b;font-size:12px;margin:10px 0 0}
.wheel-note{background:#eae6dc;padding:45px clamp(20px,5vw,84px) 55px;display:grid;grid-template-columns:220px minmax(0,690px);gap:45px}.wheel-note .wheel-kicker{margin:4px 0 0}.wheel-note p:last-child{font-size:15px;line-height:1.7;color:#555b52;margin:0}
.wheel-page [hidden]{display:none!important}
@media(max-width:1020px){.wheel-workspace{grid-template-columns:1fr;max-width:780px}.wheel-intro-stamp{width:112px;height:112px}.wheel-intro-stamp strong{font-size:15px}.wheel-note{grid-template-columns:1fr;gap:10px}}
@media(max-width:620px){.wheel-intro{padding-top:45px}.wheel-intro-stamp{display:none}.wheel-workspace{padding-top:26px}.wheel-panel-head{align-items:start;flex-direction:column;gap:8px}.wheel-palette{grid-template-columns:1fr}.wheel-color-swatch{height:100px}.wheel-base-control{grid-template-columns:1fr;gap:4px}.wheel-note{padding-top:35px}.wheel-card{padding:12px}}
@media(prefers-reduced-motion:reduce){.wheel-segment{transition:none}}
.wheel-hue-label{font:800 9px 'Manrope',sans-serif;letter-spacing:.015em;pointer-events:none;user-select:none}
.wheel-segment[data-active="true"]{stroke:none;filter:none}
.wheel-segment:focus,.wheel-segment:focus-visible{outline:none!important;filter:none}
.wheel-segment[data-active="true"] path:first-child{stroke:#20221f;stroke-width:1.25}
.wheel-pointers line,.wheel-pointers polygon{fill:#fbfaf74d;stroke:#20221f;stroke-width:2.5}
.wheel-hub{fill:#20221f;stroke:#fbfaf7;stroke-width:4}
.wheel-hub-small{font:800 8px 'Manrope',sans-serif;letter-spacing:.13em;fill:#e6c364;pointer-events:none}
.wheel-hub-text{font:800 10px 'Manrope',sans-serif;letter-spacing:-.02em;fill:#fff;pointer-events:none}
.wheel-band-key{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:8px auto 13px;max-width:530px}
.wheel-band-key button{display:flex;align-items:center;gap:8px;min-width:0;min-height:38px;padding:6px 8px;border:1px solid #dedbd2;background:#fff;text-align:left;cursor:pointer}
.wheel-band-key button[aria-pressed="true"]{border-color:#20221f;box-shadow:inset 0 0 0 1px #20221f}
.wheel-band-key button:focus-visible{outline:2px solid #a37500;outline-offset:2px}
.wheel-band-key button:disabled{opacity:.5;cursor:default}
.wheel-band-key i{width:17px;height:17px;flex:0 0 17px;border-radius:50%;background:#e95e51}
.wheel-band-key b{font:700 10px 'Manrope',sans-serif;color:#555b52}
.wheel-scheme-explainer{margin:-8px 0 22px;padding:15px 18px;border-left:3px solid #d5a925;background:#ebe8df;color:#3e433c;font:500 13px/1.5 'DM Sans',sans-serif;min-height:50px}
@media(max-width:620px){.wheel-hue-label{font-size:9px}.wheel-band-key{gap:3px}.wheel-band-key button{flex-direction:column;align-items:start;gap:4px;padding:5px 4px}.wheel-band-key b{font-size:9px}}
.wheel-mixer{padding:75px clamp(20px,5vw,84px) 80px;background:#eae7df;border-top:1px solid #d7d3c9}
.wheel-mixer-heading{max-width:830px;margin-bottom:36px}.wheel-mixer-heading h2{font:800 clamp(43px,5vw,78px)/1.04 'Manrope',sans-serif;letter-spacing:-.073em;margin:0 0 18px}.wheel-mixer-heading h2 span,.wheel-mixer-chart h3 span{color:#cfa524}.wheel-mixer-heading>p:last-child{font:400 16px/1.6 'DM Sans',sans-serif;color:#5c6259;margin:0;max-width:720px}
.wheel-mixer-workbench{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;max-width:1550px;margin:auto}
.wheel-mixer-controls,.wheel-mixer-result{background:#fbfaf7;border:1px solid #d4d0c6;min-width:0}.wheel-mixer-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0}.wheel-mixer-input{padding:25px;min-width:0}.wheel-mixer-input:first-child{border-right:1px solid #d4d0c6}.wheel-mixer-input label,.wheel-mixer-ratio>div:first-child>span{display:block;font:800 10px 'Manrope',sans-serif;letter-spacing:.14em;color:#6d7269;margin-bottom:14px}.wheel-mixer-input>div{display:flex;gap:10px;align-items:center}.wheel-mixer-input input[type="color"]{width:58px;height:53px;flex:0 0 58px;border:1px solid #bcb9ae;background:#fff;padding:3px;cursor:pointer}.wheel-mixer-input input[type="text"]{min-width:0;width:100%;height:53px;border:1px solid #bcb9ae;background:#fff;padding:10px;font:800 17px 'Manrope',sans-serif;color:#20221f}.wheel-mixer-input button{border:0;background:none;color:#755514;text-decoration:underline;text-underline-offset:3px;font:700 11px 'Manrope',sans-serif;padding:14px 0 0;cursor:pointer}
.wheel-mixer-ratio{grid-column:1/-1;padding:22px 25px 27px;border-top:1px solid #d4d0c6}.wheel-mixer-ratio>div:first-child{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}.wheel-mixer-ratio>div:first-child>span{margin:0}.wheel-mixer-ratio strong{font:800 15px 'Manrope',sans-serif}.wheel-mixer-ratio input{width:100%;accent-color:#222822;cursor:pointer}.wheel-mixer-ratio-ends{display:flex;justify-content:space-between;font:600 11px 'Manrope',sans-serif;color:#777b73;margin-top:7px}
.wheel-mixer-result{display:grid;grid-template-rows:minmax(180px,1fr) auto auto}.wheel-mixer-swatch{min-height:225px;background:#85B080;display:flex;align-items:end;padding:20px}.wheel-mixer-swatch span{font:800 10px 'Manrope',sans-serif;letter-spacing:.14em;color:#fff;background:#20221fa6;padding:8px 10px}.wheel-mixer-swatch.light-ink span{color:#20221f;background:#fbfaf7cf}.wheel-mixer-result-detail{padding:21px 24px;display:flex;align-items:end;justify-content:space-between;gap:15px}.wheel-mixer-result-detail p{margin:0 0 8px;font:800 10px 'Manrope',sans-serif;letter-spacing:.14em;color:#777b73}.wheel-mixer-result-detail strong{display:block;font:800 clamp(27px,3vw,44px)/1 'Manrope',sans-serif;letter-spacing:-.06em}.wheel-mixer-result-detail small{display:block;color:#70766d;margin-top:7px}.wheel-mixer-result-detail button{border:1px solid #202620;background:#202620;color:#fff;padding:12px 15px;font:800 11px 'Manrope',sans-serif;cursor:pointer;white-space:nowrap}.wheel-mixer-result>p{min-height:18px;margin:0 24px 14px;font-size:11px;color:#566052}
.wheel-mixer-chart{max-width:1550px;margin:38px auto 0;border:1px solid #d4d0c6;background:#fbfaf7;padding:30px}.wheel-mixer-chart-head{display:flex;justify-content:space-between;align-items:end;gap:30px;border-bottom:1px solid #d4d0c6;padding-bottom:22px;margin-bottom:24px}.wheel-mixer-chart-head .wheel-kicker{margin:0 0 10px}.wheel-mixer-chart h3{margin:0;font:800 clamp(31px,3.3vw,49px)/1.08 'Manrope',sans-serif;letter-spacing:-.065em}.wheel-mixer-chart-head>p{max-width:450px;color:#646960;font-size:13px;line-height:1.55;margin:0}.wheel-mixer-matrix-scroll{overflow-x:auto;padding:0 0 8px}.wheel-mixer-matrix{display:grid;grid-template-columns:55px repeat(12,minmax(43px,1fr));gap:3px;min-width:720px;max-width:1060px;margin:auto}.wheel-matrix-corner,.wheel-matrix-header{display:flex;align-items:center;justify-content:center;min-height:43px;font:800 10px 'Manrope',sans-serif;color:#5b6158}.wheel-matrix-header{gap:4px}.wheel-matrix-header i{display:block;width:22px;height:22px;box-shadow:inset 0 0 0 1px #20221f25}.wheel-matrix-header small{font-size:9px;color:#777b73}.wheel-matrix-cell{height:43px;border:0;cursor:pointer;min-width:0;position:relative}.wheel-matrix-cell:hover,.wheel-matrix-cell:focus-visible{outline:3px solid #202620;outline-offset:-3px;z-index:1}.wheel-matrix-cell[data-selected="true"]{outline:3px solid #202620;outline-offset:-3px}.wheel-mixer-matrix-caption{margin:17px 0 0;font:700 12px 'Manrope',sans-serif;color:#4c534b;text-transform:capitalize}
.wheel-mixer-caveat{max-width:1100px;margin:28px auto 0;color:#596057;font:400 12px/1.6 'DM Sans',sans-serif}.wheel-mixer-input input:focus-visible,.wheel-mixer-input button:focus-visible,.wheel-mixer-ratio input:focus-visible,.wheel-mixer-result-detail button:focus-visible{outline:2px solid #a37500;outline-offset:3px}
@media(max-width:980px){.wheel-mixer-workbench{grid-template-columns:1fr}.wheel-mixer-result{grid-template-rows:220px auto auto}.wheel-mixer-chart-head{align-items:start;flex-direction:column;gap:12px}}
@media(max-width:620px){.wheel-mixer{padding-top:55px;padding-bottom:60px}.wheel-mixer-controls{grid-template-columns:1fr}.wheel-mixer-input:first-child{border-right:0;border-bottom:1px solid #d4d0c6}.wheel-mixer-input{padding:20px}.wheel-mixer-ratio{padding:20px}.wheel-mixer-result-detail{align-items:start;flex-direction:column}.wheel-mixer-chart{padding:20px 12px}.wheel-mixer-chart-head{padding:0 8px 18px}.wheel-mixer-matrix-caption{padding:0 8px}}
.wheel-mixer-matrix{grid-template-columns:55px repeat(15,minmax(40px,1fr));min-width:780px;max-width:1160px}
.wheel-mixer-heading h2,.wheel-mixer-chart h3{letter-spacing:-.025em}