.setup-board[data-case]{--case-radius:13px;--case-bezel-x:14px;--case-bezel-top:14px;--case-bezel-bottom:16px;--case-chamfer:1px;--case-weight-width:0%;--case-weight-height:0px;--case-weight-offset:18px;--case-top-highlight:7%;padding:var(--case-bezel-top) var(--case-bezel-x) var(--case-bezel-bottom);border-radius:var(--case-radius);clip-path:polygon(var(--case-chamfer) 0, calc(100% - var(--case-chamfer)) 0, 100% var(--case-chamfer), 100% calc(100% - var(--case-chamfer)), calc(100% - var(--case-chamfer)) 100%, var(--case-chamfer) 100%, 0 calc(100% - var(--case-chamfer)), 0 var(--case-chamfer));background:linear-gradient(180deg, color-mix(in srgb, white var(--case-top-highlight), transparent), transparent 20%), linear-gradient(145deg, color-mix(in srgb,var(--case-color) 92%,white 2%), color-mix(in srgb,var(--case-color) 70%,var(--surface)))}.setup-board[data-case]:before{inset:calc(var(--case-bezel-top) * .48) calc(var(--case-bezel-x) * .48) calc(var(--case-bezel-bottom) * .48);border-radius:max(4px, calc(var(--case-radius) - 6px));border-color:color-mix(in srgb,var(--case-edge) 58%,transparent);box-shadow:inset 0 1px #ffffff0f}.setup-board[data-case]:after{right:var(--case-weight-offset);bottom:calc(var(--case-depth) * -.62);width:var(--case-weight-width);height:var(--case-weight-height);background:var(--case-edge);min-height:0;box-shadow:0 1px 6px color-mix(in srgb,var(--case-edge) 38%,transparent);opacity:.96;border-radius:2px}.setup-board[data-case^=keycult-]{--case-radius:7px;--case-bezel-x:18px;--case-bezel-top:16px;--case-bezel-bottom:19px;--case-chamfer:7px;--case-weight-width:46%;--case-weight-height:5px;--case-weight-offset:27%;--case-top-highlight:10%}.setup-board[data-case=keycult-no2-65]{--case-bezel-bottom:23px;--case-chamfer:9px}.setup-board[data-case=keycult-no1-rev2]{--case-bezel-x:20px;--case-weight-width:52%}.setup-board[data-case^=rama-]{--case-radius:20px;--case-bezel-x:17px;--case-bezel-top:18px;--case-bezel-bottom:21px;--case-chamfer:2px;--case-weight-width:30%;--case-weight-height:3px;--case-weight-offset:35%}.setup-board[data-case=rama-kara]{--case-radius:25px;--case-bezel-x:20px;--case-bezel-top:20px;--case-bezel-bottom:23px;background:linear-gradient(145deg,color-mix(in srgb,var(--case-color) 72%,transparent),color-mix(in srgb,var(--case-edge) 54%,transparent));-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.setup-board[data-case=rama-u80a]{--case-radius:16px;--case-bezel-x:21px}.setup-board[data-case^=kbdfans-tofu]{--case-radius:5px;--case-bezel-x:13px;--case-bezel-top:13px;--case-bezel-bottom:15px;--case-chamfer:3px}.setup-board[data-case=kbdfans-blade65],.setup-board[data-case^=brutal-]{--case-radius:3px;--case-bezel-x:17px;--case-bezel-top:15px;--case-bezel-bottom:20px;--case-chamfer:13px}.setup-board[data-case=kbdfans-blade65]{--case-chamfer:22px}.setup-board[data-case^=qk]{--case-radius:18px;--case-bezel-x:15px;--case-bezel-top:15px;--case-bezel-bottom:20px;--case-chamfer:2px;--case-weight-width:34%;--case-weight-height:4px;--case-weight-offset:33%}.setup-board[data-case=qk75n]{--case-weight-width:24%;--case-weight-offset:39%}.setup-board[data-case^=mode-]{--case-radius:12px;--case-bezel-x:12px;--case-bezel-top:13px;--case-bezel-bottom:23px;--case-chamfer:6px;--case-weight-width:18%;--case-weight-height:3px;--case-weight-offset:41%}.setup-board[data-case=mode-envoy]{--case-radius:15px;--case-bezel-bottom:18px}.setup-board[data-case=mode-sonnet]{--case-bezel-bottom:25px}.setup-board[data-case^=zoom],.setup-board[data-case=mammoth75]{--case-radius:20px;--case-bezel-x:16px;--case-bezel-top:16px;--case-bezel-bottom:22px;--case-chamfer:3px;--case-weight-width:42%;--case-weight-height:5px;--case-weight-offset:29%}.setup-board[data-case=mammoth75]{--case-weight-width:55%;--case-weight-offset:22.5%}.setup-board[data-case^=neo]{--case-radius:14px;--case-bezel-x:13px;--case-bezel-top:13px;--case-bezel-bottom:17px;--case-chamfer:5px;--case-weight-width:28%;--case-weight-height:3px;--case-weight-offset:36%}.setup-board[data-case^=tgr-]{--case-radius:8px;--case-bezel-x:19px;--case-bezel-top:18px;--case-bezel-bottom:24px;--case-chamfer:8px;--case-weight-width:48%;--case-weight-height:5px;--case-weight-offset:26%}.setup-board[data-case=tgr-910]{--case-radius:11px;--case-bezel-x:16px}.setup-board[data-case^=geon-]{--case-radius:5px;--case-bezel-x:15px;--case-bezel-top:14px;--case-bezel-bottom:21px;--case-chamfer:6px;--case-weight-width:32%;--case-weight-height:3px;--case-weight-offset:34%}.setup-board[data-case^=keychron-q]{--case-radius:10px;--case-bezel-x:18px;--case-bezel-top:17px;--case-bezel-bottom:21px;--case-chamfer:5px}.setup-board[data-case=keychron-q1]{--case-radius:8px;--case-bezel-x:17px;--case-bezel-top:16px;--case-bezel-bottom:20px;--case-chamfer:4px;--case-depth:22.6px;--case-angle:5.2deg;--case-q1-length-mm:327.5;--case-q1-width-mm:145;--case-q1-front-mm:22.6;--case-q1-rear-mm:35.8;--case-q1-rear-rise:13.2px;--case-weight-width:0%;--case-weight-height:0px;aspect-ratio:327.5/145;background:linear-gradient(180deg, #ffffff13, transparent 18%), linear-gradient(90deg, #ffffff06, transparent 12%, transparent 88%, #00000014), linear-gradient(145deg, color-mix(in srgb,var(--case-color) 94%,white 2%), color-mix(in srgb,var(--case-color) 73%,var(--surface)));box-shadow:0 22.6px 0 color-mix(in srgb,var(--case-edge) 94%,black 6%), 0 27px 18px color-mix(in srgb,var(--bg) 34%,transparent), 0 46px 68px color-mix(in srgb,var(--bg) 55%,transparent), inset 0 1px 0 #ffffff12, inset 0 -1px 0 #00000047;align-content:center}.setup-board[data-case=keychron-q1]:after{content:"";z-index:-1;left:7px;right:7px;top:calc(-1 * var(--case-q1-rear-rise));width:auto;height:var(--case-q1-rear-rise);min-height:var(--case-q1-rear-rise);background:linear-gradient(180deg, color-mix(in srgb,var(--case-color) 82%,white 5%), color-mix(in srgb,var(--case-edge) 90%,black 4%));box-shadow:inset 0 1px 0 #ffffff0f, 0 -1px 0 color-mix(in srgb,var(--case-edge) 88%,black 12%);opacity:1;border-radius:7px 7px 2px 2px;position:absolute;bottom:auto}.setup-board[data-case=keychron-q1]:before{border-color:color-mix(in srgb,var(--case-edge) 72%,transparent);border-radius:5px;inset:8px 9px 10px;box-shadow:inset 0 1px #ffffff0b,0 1px #0003}.setup-board[data-case=clear-pc-60],.setup-board[data-case=polycarbonate-65],.setup-board[data-case=kbdfans-tiger-lite],.setup-board[data-case=ikki68-aurora],.setup-board[data-case=bauer-lite]{--case-radius:19px;--case-top-highlight:16%;background:linear-gradient(145deg,color-mix(in srgb,var(--case-color) 74%,white 10%),color-mix(in srgb,var(--case-edge) 58%,transparent));box-shadow:0 var(--case-depth) 0 color-mix(in srgb,var(--case-edge) 82%,transparent), 0 calc(var(--case-depth) + 22px) 52px color-mix(in srgb,var(--bg) 58%,transparent), inset 0 0 0 2px #ffffff1c}.setup-board[data-case=acrylic-65]{--case-radius:8px;--case-bezel-x:18px;--case-bezel-top:17px;--case-bezel-bottom:20px;box-shadow:0 4px 0 color-mix(in srgb,var(--case-color) 78%,white 8%), 0 8px 0 color-mix(in srgb,var(--case-edge) 68%,transparent), 0 12px 0 color-mix(in srgb,var(--case-color) 66%,transparent), 0 var(--case-depth) 0 var(--case-edge), 0 calc(var(--case-depth) + 24px) 54px color-mix(in srgb,var(--bg) 58%,transparent)}.setup-board[data-case=poly-hhkb]{--case-radius:14px;--case-bezel-x:20px;--case-bezel-top:23px;--case-bezel-bottom:24px;--case-chamfer:4px}@media (max-width:680px){.setup-board[data-case]{--case-bezel-x:9px;--case-bezel-top:9px;--case-bezel-bottom:11px}.setup-board[data-case^=keycult-],.setup-board[data-case^=tgr-],.setup-board[data-case^=rama-]{--case-bezel-x:11px;--case-bezel-top:10px;--case-bezel-bottom:13px}.setup-board[data-case=keychron-q1]{--case-bezel-x:10px;--case-bezel-top:10px;--case-bezel-bottom:12px;--case-depth:15px;--case-q1-rear-rise:8.8px}}@media (prefers-reduced-motion:reduce){.setup-board[data-case]{transition:none}}
.setup-board[data-case=keychron-q1]{--case-depth:22.6px!important;--case-angle:5.2deg!important}.setup-board[data-case=keychron-q2]{--case-radius:8px;--case-bezel-x:16px;--case-bezel-top:15px;--case-bezel-bottom:19px;--case-chamfer:4px;--case-q2-length-mm:327.5;--case-q2-width-mm:121;--case-q2-front-mm:20;--case-q2-rear-mm:33.8;--case-q2-rear-rise:13.8px;--case-weight-width:0%;--case-weight-height:0px;aspect-ratio:327.5/121;background:linear-gradient(180deg, #ffffff13, transparent 18%), linear-gradient(90deg, #ffffff06, transparent 12%, transparent 88%, #00000014), linear-gradient(145deg, color-mix(in srgb,var(--case-color) 94%,white 2%), color-mix(in srgb,var(--case-color) 73%,var(--surface)));box-shadow:0 20px 0 color-mix(in srgb,var(--case-edge) 94%,black 6%), 0 24px 16px color-mix(in srgb,var(--bg) 34%,transparent), 0 42px 62px color-mix(in srgb,var(--bg) 55%,transparent), inset 0 1px 0 #ffffff12, inset 0 -1px 0 #00000047;align-content:center;--case-depth:20px!important;--case-angle:6.5deg!important}.setup-board[data-case=keychron-q2]:after{content:"";z-index:-1;left:7px;right:7px;top:calc(-1 * var(--case-q2-rear-rise));width:auto;height:var(--case-q2-rear-rise);min-height:var(--case-q2-rear-rise);background:linear-gradient(180deg, color-mix(in srgb,var(--case-color) 82%,white 5%), color-mix(in srgb,var(--case-edge) 90%,black 4%));box-shadow:inset 0 1px 0 #ffffff0f, 0 -1px 0 color-mix(in srgb,var(--case-edge) 88%,black 12%);opacity:1;border-radius:7px 7px 2px 2px;position:absolute;bottom:auto}.setup-board[data-case=keychron-q2]:before{border-color:color-mix(in srgb,var(--case-edge) 72%,transparent);border-radius:5px;inset:8px 9px 10px;box-shadow:inset 0 1px #ffffff0b,0 1px #0003}.setup-board[data-case=keychron-q3]{--case-radius:8px;--case-bezel-x:17px;--case-bezel-top:15px;--case-bezel-bottom:19px;--case-chamfer:4px;--case-q3-length-mm:365.1;--case-q3-width-mm:137;--case-q3-front-mm:19.7;--case-q3-rear-mm:32.6;--case-q3-rear-rise:12.9px;--case-weight-width:0%;--case-weight-height:0px;aspect-ratio:365.1/137;background:linear-gradient(180deg, #ffffff14, transparent 17%), linear-gradient(90deg, #ffffff06, transparent 10%, transparent 90%, #00000016), linear-gradient(145deg, color-mix(in srgb,var(--case-color) 95%,white 2%), color-mix(in srgb,var(--case-color) 72%,var(--surface)));box-shadow:0 19.7px 0 color-mix(in srgb,var(--case-edge) 94%,black 6%), 0 24px 18px color-mix(in srgb,var(--bg) 36%,transparent), 0 44px 64px color-mix(in srgb,var(--bg) 56%,transparent), inset 0 1px 0 #ffffff13, inset 0 -1px 0 #00000047;align-content:center;--case-depth:19.7px!important;--case-angle:5.2deg!important}.setup-board[data-case=keychron-q3]:after{content:"";z-index:-1;left:8px;right:8px;top:calc(-1 * var(--case-q3-rear-rise));width:auto;height:var(--case-q3-rear-rise);min-height:var(--case-q3-rear-rise);background:linear-gradient(180deg, color-mix(in srgb,var(--case-color) 83%,white 5%), color-mix(in srgb,var(--case-edge) 91%,black 4%));box-shadow:inset 0 1px 0 #ffffff0f, 0 -1px 0 color-mix(in srgb,var(--case-edge) 88%,black 12%);opacity:1;border-radius:7px 7px 2px 2px;position:absolute;bottom:auto}.setup-board[data-case=keychron-q3]:before{border-color:color-mix(in srgb,#aeb3b8 34%,var(--case-edge));border-radius:5px;inset:8px 10px 10px;box-shadow:inset 0 1px #ffffff0d,0 1px #0003}.setup-board[data-case=keycult-no2-65]{--case-radius:6px;--case-bezel-x:16px;--case-bezel-top:15px;--case-bezel-bottom:19px;--case-chamfer:7px;--case-keycult-length-mm:315;--case-keycult-width-mm:120;--case-keycult-front-mm:19.8;--case-keycult-rear-mm:36.05;--case-keycult-rear-rise:16.25px;--case-weight-width:0%;--case-weight-height:0px;aspect-ratio:315/120;background:linear-gradient(180deg, #ffffff17, transparent 16%), linear-gradient(90deg, #ffffff06, transparent 11%, transparent 89%, #00000014), linear-gradient(145deg, color-mix(in srgb,var(--case-color) 95%,white 2%), color-mix(in srgb,var(--case-color) 72%,var(--surface)));box-shadow:0 6px 0 color-mix(in srgb,var(--case-color) 77%,var(--case-edge)), 0 11px 0 color-mix(in srgb,var(--case-edge) 88%,black 6%), 0 19.8px 0 color-mix(in srgb,var(--case-edge) 95%,black 5%), 0 26px 20px color-mix(in srgb,var(--bg) 38%,transparent), 0 46px 66px color-mix(in srgb,var(--bg) 56%,transparent), inset 0 1px 0 #ffffff14, inset 0 -1px 0 #0000004d;align-content:center;--case-depth:19.8px!important;--case-angle:8deg!important}.setup-board[data-case=keycult-no2-65]:after{content:"";z-index:-1;left:8px;right:8px;top:calc(-1 * var(--case-keycult-rear-rise));width:auto;height:var(--case-keycult-rear-rise);min-height:var(--case-keycult-rear-rise);background:linear-gradient(180deg, color-mix(in srgb,var(--case-color) 83%,white 5%), color-mix(in srgb,var(--case-edge) 94%,black 3%));box-shadow:inset 0 1px 0 #ffffff12, 0 -1px 0 color-mix(in srgb,var(--case-edge) 90%,black 10%);opacity:1;border-radius:6px 6px 1px 1px;position:absolute;bottom:auto}.setup-board[data-case=keycult-no2-65]:before{border-color:color-mix(in srgb,var(--case-edge) 76%,transparent);border-radius:4px;inset:8px 9px 10px;box-shadow:inset 0 1px #ffffff0d,0 1px #0000003d}@media (max-width:680px){.setup-board[data-case=keychron-q1]{--case-depth:15px!important}.setup-board[data-case=keychron-q2]{--case-bezel-x:10px;--case-bezel-top:9px;--case-bezel-bottom:11px;--case-q2-rear-rise:9.2px;--case-depth:13.3px!important}.setup-board[data-case=keychron-q3]{--case-bezel-x:11px;--case-bezel-top:10px;--case-bezel-bottom:12px;--case-q3-rear-rise:8.6px;--case-depth:13.2px!important}.setup-board[data-case=keycult-no2-65]{--case-bezel-x:10px;--case-bezel-top:10px;--case-bezel-bottom:12px;--case-keycult-rear-rise:10.7px;--case-depth:13px!important}}
.setup-board[data-case=mode-envoy]{--case-radius:18px;--case-bezel-x:13px;--case-bezel-top:13px;--case-bezel-bottom:17px;--case-chamfer:3px;--case-mode-envoy-width-mm:317;--case-mode-envoy-depth-mm:112;--case-mode-envoy-front-mm:19.5;--case-weight-width:22%;--case-weight-height:3px;--case-weight-offset:39%;aspect-ratio:317/112;background:linear-gradient(180deg, #ffffff13, transparent 18%), radial-gradient(ellipse at 50% 100%, color-mix(in srgb,var(--case-edge) 12%,transparent), transparent 44%), linear-gradient(145deg, color-mix(in srgb,var(--case-color) 94%,white 2%), color-mix(in srgb,var(--case-color) 74%,var(--surface)));box-shadow:0 19.5px 0 color-mix(in srgb,var(--case-edge) 94%,black 5%), 0 25px 18px color-mix(in srgb,var(--bg) 35%,transparent), 0 44px 64px color-mix(in srgb,var(--bg) 55%,transparent), inset 0 1px 0 #ffffff12, inset 0 -1px 0 #0000003d;align-content:center;--case-depth:19.5px!important;--case-angle:5.8deg!important}.setup-board[data-case=mode-envoy]:before{border-color:color-mix(in srgb,var(--case-edge) 46%,transparent);border-radius:13px;inset:7px 8px 9px;box-shadow:inset 0 1px #ffffff0a}.setup-board[data-case=mode-envoy]:after{right:var(--case-weight-offset);bottom:calc(var(--case-depth) * -.38);width:var(--case-weight-width);height:var(--case-weight-height);background:color-mix(in srgb,var(--case-edge) 84%,var(--case-color));min-height:0;box-shadow:0 1px 4px color-mix(in srgb,var(--case-edge) 32%,transparent);opacity:.82;border-radius:999px}.setup-board[data-case=mode-sonnet]{--case-radius:15px;--case-bezel-x:15px;--case-bezel-top:14px;--case-bezel-bottom:19px;--case-chamfer:4px;--case-mode-sonnet-width-mm:315;--case-mode-sonnet-depth-mm:143;--case-mode-sonnet-front-mm:19;--case-mode-sonnet-rear-mm:24;--case-mode-sonnet-rear-rise:5px;--case-sonnet-accent-width:72%;--case-sonnet-accent-offset:14%;--case-sonnet-weight-width:38%;aspect-ratio:315/143;background:linear-gradient(180deg, #ffffff16, transparent 16%), linear-gradient(108deg, transparent 0 7%, color-mix(in srgb,var(--case-color) 94%,white 3%) 15% 84%, transparent 93%), linear-gradient(145deg, color-mix(in srgb,var(--case-color) 96%,white 2%), color-mix(in srgb,var(--case-color) 72%,var(--surface)));clip-path:polygon(2.2% 0,97.8% 0,100% 8%,99.2% 92%,95.8% 100%,4.2% 100%,.8% 92%,0 8%);box-shadow:0 19px 0 color-mix(in srgb,var(--case-edge) 92%,black 7%), 0 25px 18px color-mix(in srgb,var(--bg) 35%,transparent), 0 45px 64px color-mix(in srgb,var(--bg) 55%,transparent), inset 0 1px 0 #ffffff14, inset 0 -1px 0 #00000042;align-content:center;--case-depth:19px!important;--case-angle:5.5deg!important}.setup-board[data-case=mode-sonnet]:before{border-color:color-mix(in srgb,var(--case-edge) 48%,transparent);box-shadow:inset 0 1px 0 #ffffff0b, 0 4px 0 color-mix(in srgb,var(--case-edge) 28%,transparent);border-radius:10px;inset:8px 9px 11px}.setup-board[data-case=mode-sonnet]:after{right:var(--case-sonnet-accent-offset);bottom:calc(var(--case-depth) * -.48);width:var(--case-sonnet-accent-width);border:1px solid color-mix(in srgb,var(--case-edge) 58%,transparent);background:linear-gradient(90deg, transparent 0 calc((100% - var(--case-sonnet-weight-width)) / 2), color-mix(in srgb,var(--case-edge) 78%,black 11%) calc((100% - var(--case-sonnet-weight-width)) / 2) calc((100% + var(--case-sonnet-weight-width)) / 2), transparent calc((100% + var(--case-sonnet-weight-width)) / 2) 100%), linear-gradient(180deg, color-mix(in srgb,var(--case-edge) 58%,#b9774f 42%), color-mix(in srgb,var(--case-edge) 72%,#8e5940 28%));height:7px;min-height:0;box-shadow:inset 0 1px 0 #ffffff2e, inset 0 -1px 0 #0000002e, 0 2px 7px color-mix(in srgb,var(--case-edge) 38%,transparent);opacity:.98;border-radius:3px}@media (max-width:680px){.setup-board[data-case=mode-envoy]{--case-bezel-x:9px;--case-bezel-top:9px;--case-bezel-bottom:11px;--case-weight-height:2px;--case-depth:13px!important}.setup-board[data-case=mode-sonnet]{--case-bezel-x:10px;--case-bezel-top:9px;--case-bezel-bottom:12px;--case-depth:12.7px!important}.setup-board[data-case=mode-sonnet]:after{height:4px}}
.setup-board[data-case=mode-envoy]{--case-radius:18px;--case-bezel-x:13px;--case-bezel-top:13px;--case-bezel-bottom:19px;--case-chamfer:3px;--case-envoy-width-mm:317;--case-envoy-depth-mm:112;--case-envoy-front-mm:19.5;--case-weight-width:76%;--case-weight-height:7px;--case-weight-offset:12%;aspect-ratio:317/112;background:radial-gradient(120% 80% at 50% -10%, #ffffff17, transparent 45%), linear-gradient(90deg, #ffffff06, transparent 10%, transparent 90%, #00000013), linear-gradient(145deg, color-mix(in srgb,var(--case-color) 95%,white 2%), color-mix(in srgb,var(--case-color) 74%,var(--surface)));box-shadow:0 19.5px 0 color-mix(in srgb,var(--case-edge) 91%,black 5%), 0 24px 18px color-mix(in srgb,var(--bg) 34%,transparent), 0 43px 62px color-mix(in srgb,var(--bg) 54%,transparent), inset 0 1px 0 #ffffff13, inset 0 -1px 0 #00000038;align-content:center;--case-depth:19.5px!important;--case-angle:5.8deg!important}.setup-board[data-case=mode-envoy]:before{border-color:color-mix(in srgb,var(--case-edge) 46%,transparent);border-radius:12px;inset:7px 8px 9px;box-shadow:inset 0 1px #ffffff0a,0 1px #00000029}.setup-board[data-case=mode-envoy]:after{right:var(--case-weight-offset);bottom:calc(var(--case-depth) * -.72);width:var(--case-weight-width);height:var(--case-weight-height);background:radial-gradient(circle at 2px 2px, color-mix(in srgb,var(--case-color) 40%,black) 0 1px, transparent 1.3px) left 8px center / 5px 5px no-repeat, radial-gradient(circle at 2px 2px, color-mix(in srgb,var(--case-color) 40%,black) 0 1px, transparent 1.3px) right 8px center / 5px 5px no-repeat, linear-gradient(90deg, color-mix(in srgb,var(--case-edge) 74%,black 8%), color-mix(in srgb,var(--case-edge) 90%,white 8%) 48%, color-mix(in srgb,var(--case-edge) 72%,black 10%));min-height:0;box-shadow:inset 0 1px 0 #fff3, inset 0 -1px 0 #0003, 0 2px 7px color-mix(in srgb,var(--case-edge) 34%,transparent);opacity:1;border-radius:3px}@media (max-width:680px){.setup-board[data-case=mode-envoy]{--case-bezel-x:9px;--case-bezel-top:9px;--case-bezel-bottom:12px;--case-weight-height:4px;--case-depth:13.1px!important}}
.setup-board[data-case=keycult-no1-rev2]{--case-radius:7px;--case-bezel-x:18px;--case-bezel-top:16px;--case-bezel-bottom:20px;--case-chamfer:4px;--case-keycult-no1-length-mm:355;--case-keycult-no1-width-mm:139;--case-keycult-no1-front-mm:20.16;--case-keycult-no1-rear-mm:39.5;--case-keycult-no1-rear-rise:19.34px;--case-weight-width:0%;--case-weight-height:0px;aspect-ratio:355/139;border-color:color-mix(in srgb,var(--case-edge) 78%,transparent);background:linear-gradient(180deg, #ffffff16 0, transparent 17%), linear-gradient(180deg, transparent 0 83%, color-mix(in srgb,var(--case-edge) 42%,#b69a63 58%) 84% 88%, color-mix(in srgb,var(--case-edge) 82%,black 5%) 89% 100%), linear-gradient(90deg, #ffffff06, transparent 10% 90%, #00000016), linear-gradient(145deg, color-mix(in srgb,var(--case-color) 95%,white 2%), color-mix(in srgb,var(--case-color) 73%,var(--surface)));clip-path:polygon(1.2% 0,98.8% 0,100% 3.2%,100% 96.8%,98.8% 100%,1.2% 100%,0 96.8%,0 3.2%);align-content:center;--case-depth:20.16px!important;--case-angle:8deg!important}.setup-board[data-case=keycult-no1-rev2] .setup-key{border-color:color-mix(in srgb,var(--case-edge) 54%,transparent)}@media (max-width:680px){.setup-board[data-case=keycult-no1-rev2]{--case-bezel-x:11px;--case-bezel-top:10px;--case-bezel-bottom:12px;--case-depth:13.51px!important}}
.setup-board[data-case=kbdfans-tofu60]{--case-radius:5px;--case-bezel-x:12px;--case-bezel-top:12px;--case-bezel-bottom:14px;--case-chamfer:2px;--case-tofu60-width-mm:294.8;--case-tofu60-depth-mm:112.26;--case-tofu60-front-mm:19.7;--case-tofu60-rear-mm:32.82;--case-tofu60-rear-rise:13.12px;aspect-ratio:294.8/112.26;background:linear-gradient(180deg, #fff1, transparent 13%), linear-gradient(90deg, color-mix(in srgb,var(--case-edge) 22%,transparent) 0 1.2%, transparent 1.2% 98.8%, color-mix(in srgb,var(--case-edge) 22%,transparent) 98.8% 100%), linear-gradient(145deg, color-mix(in srgb,var(--case-color) 95%,white 2%), color-mix(in srgb,var(--case-color) 76%,var(--surface)));box-shadow:0 19.7px 0 color-mix(in srgb,var(--case-edge) 94%,black 5%), 0 27px 18px color-mix(in srgb,var(--bg) 34%,transparent), 0 46px 62px color-mix(in srgb,var(--bg) 54%,transparent), inset 0 1px 0 #ffffff12, inset 0 -1px 0 #00000038;align-content:center;--case-depth:19.7px!important;--case-angle:7deg!important}.setup-board[data-case=kbdfans-tofu65]{--case-radius:5px;--case-bezel-x:12px;--case-bezel-top:12px;--case-bezel-bottom:14px;--case-chamfer:2px;--case-tofu65-width-mm:313.7;--case-tofu65-depth-mm:115.7;--case-tofu65-front-mm:18.5;--case-tofu65-rear-mm:32.5;--case-tofu65-rear-rise:14px;aspect-ratio:313.7/115.7;background:linear-gradient(180deg, #fff1, transparent 13%), linear-gradient(90deg, color-mix(in srgb,var(--case-edge) 22%,transparent) 0 1.1%, transparent 1.1% 98.9%, color-mix(in srgb,var(--case-edge) 22%,transparent) 98.9% 100%), linear-gradient(145deg, color-mix(in srgb,var(--case-color) 95%,white 2%), color-mix(in srgb,var(--case-color) 76%,var(--surface)));box-shadow:0 18.5px 0 color-mix(in srgb,var(--case-edge) 94%,black 5%), 0 26px 18px color-mix(in srgb,var(--bg) 34%,transparent), 0 44px 60px color-mix(in srgb,var(--bg) 54%,transparent), inset 0 1px 0 #ffffff12, inset 0 -1px 0 #00000038;align-content:center;--case-depth:18.5px!important;--case-angle:7deg!important}.setup-board:is([data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65])>.setup-key-row:first-child{box-shadow:0 -4px 0 color-mix(in srgb,var(--case-edge) 18%,transparent)}.setup-board:is([data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65])>.setup-key-row:last-child{box-shadow:0 4px 0 color-mix(in srgb,var(--case-edge) 18%,transparent)}@media (max-width:680px){.setup-board[data-case=kbdfans-tofu60]{--case-bezel-x:8px;--case-bezel-top:8px;--case-bezel-bottom:9px;--case-tofu60-rear-rise:8.8px;--case-depth:13.2px!important}.setup-board[data-case=kbdfans-tofu65]{--case-bezel-x:8px;--case-bezel-top:8px;--case-bezel-bottom:9px;--case-tofu65-rear-rise:9.4px;--case-depth:12.4px!important}}
.setup-board[data-case=keychron-q1]{--reference-footprint-ratio:327.5 / 145;--reference-front-height:22.6px;--reference-angle:5.2deg}.setup-board[data-case=keychron-q2]{--reference-footprint-ratio:327.5 / 121;--reference-front-height:20px;--reference-angle:6.5deg}.setup-board[data-case=keychron-q3]{--reference-footprint-ratio:365.1 / 137;--reference-front-height:19.7px;--reference-angle:5.2deg}.setup-board[data-case=keycult-no1-rev2]{--reference-footprint-ratio:355 / 139;--reference-front-height:20.16px;--reference-angle:8deg}.setup-board[data-case=keycult-no2-65]{--reference-footprint-ratio:315 / 120;--reference-front-height:19.8px;--reference-angle:8deg}.setup-board[data-case=kbdfans-tofu60]{--reference-footprint-ratio:294.8 / 112.26;--reference-front-height:19.7px;--reference-angle:7deg}.setup-board[data-case=kbdfans-tofu65]{--reference-footprint-ratio:313.7 / 115.7;--reference-front-height:18.5px;--reference-angle:7deg}.setup-board[data-case=mode-envoy]{--reference-footprint-ratio:317 / 112;--reference-front-height:19.5px;--reference-angle:5.8deg}.setup-board[data-case=mode-sonnet]{--reference-footprint-ratio:315 / 143;--reference-front-height:19px;--reference-angle:5.5deg}.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet]){aspect-ratio:var(--reference-footprint-ratio);box-shadow:0 calc(var(--case-depth) + 22px) 52px color-mix(in srgb,var(--bg) 58%,transparent), inset 0 0 0 2px #ffffff0d;align-content:center;--case-depth:var(--reference-front-height)!important;--case-angle:var(--reference-angle)!important}.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet]):before{content:"";border:1px solid color-mix(in srgb,var(--case-edge) 82%,transparent);border-radius:inherit;background:linear-gradient(155deg, color-mix(in srgb,var(--case-edge) 88%,white 3%), color-mix(in srgb,var(--case-edge) 86%,black 10%));pointer-events:none;transform:translateZ(calc(var(--case-depth) * -1));backface-visibility:visible;position:absolute;inset:0}.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet]):after{content:"";width:100%;height:var(--case-depth);border:1px solid color-mix(in srgb,var(--case-edge) 88%,transparent);background:linear-gradient(180deg, color-mix(in srgb,var(--case-color) 76%,var(--case-edge)), color-mix(in srgb,var(--case-edge) 88%,black 10%));pointer-events:none;transform-origin:top;backface-visibility:visible;border-top:0;border-radius:0 0 10px 10px;position:absolute;top:100%;left:0;transform:rotateX(-90deg);box-shadow:inset 0 -1px #ffffff0f}.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet])>.setup-key-row:first-child:before{content:"";z-index:-1;width:100%;height:var(--case-depth);border:1px solid color-mix(in srgb,var(--case-edge) 88%,transparent);background:linear-gradient(180deg, color-mix(in srgb,var(--case-color) 84%,white 3%), color-mix(in srgb,var(--case-edge) 91%,black 7%));pointer-events:none;transform-origin:bottom;backface-visibility:visible;border-bottom:0;border-radius:10px 10px 0 0;position:absolute;bottom:100%;left:0;transform:rotateX(90deg)}.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet])>.setup-key-row:first-child:after{content:"";z-index:-1;width:var(--case-depth);border:1px solid color-mix(in srgb,var(--case-edge) 88%,transparent);background:linear-gradient(90deg, color-mix(in srgb,var(--case-edge) 91%,black 10%), color-mix(in srgb,var(--case-color) 76%,var(--case-edge)));pointer-events:none;transform-origin:100%;backface-visibility:visible;border-right:0;border-radius:10px 0 0 10px;height:100%;position:absolute;top:0;right:100%;transform:rotateY(-90deg)}.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet])>.setup-key-row:last-child:after{content:"";z-index:-1;width:var(--case-depth);border:1px solid color-mix(in srgb,var(--case-edge) 88%,transparent);background:linear-gradient(90deg, color-mix(in srgb,var(--case-color) 77%,var(--case-edge)), color-mix(in srgb,var(--case-edge) 92%,black 10%));pointer-events:none;transform-origin:0;backface-visibility:visible;border-left:0;border-radius:0 10px 10px 0;height:100%;position:absolute;top:0;left:100%;transform:rotateY(90deg)}@media (max-width:680px){.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet]){--case-depth:calc(var(--reference-front-height) * .67)!important}}
.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet]){--case-bevel:8px;--case-bevel-highlight:#ffffff17;--case-bevel-shadow:#0000002e}.setup-board:is([data-case=keycult-no1-rev2],[data-case=keycult-no2-65]){--case-bevel:5px}.setup-board:is([data-case=mode-envoy],[data-case=mode-sonnet]){--case-bevel:11px}.setup-board:is([data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65]){--case-bevel:4px}.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet]):after,.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet])>.setup-key-row:first-child:before{clip-path:polygon(var(--case-bevel) 0, calc(100% - var(--case-bevel)) 0, 100% var(--case-bevel), 100% 100%, 0 100%, 0 var(--case-bevel));box-shadow:inset 0 1px 0 var(--case-bevel-highlight), inset 0 -1px 0 var(--case-bevel-shadow)}.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet])>.setup-key-row:first-child:after,.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet])>.setup-key-row:last-child:after{clip-path:polygon(0 var(--case-bevel), 100% 0, 100% 100%, 0 calc(100% - var(--case-bevel)));box-shadow:inset 1px 0 0 var(--case-bevel-highlight)}.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet]):before{background:linear-gradient(var(--case-bevel-shadow), var(--case-bevel-shadow)) center / calc(100% - 34px) calc(100% - 30px) no-repeat, linear-gradient(155deg, color-mix(in srgb,var(--case-edge) 88%,white 3%), color-mix(in srgb,var(--case-edge) 86%,black 10%));box-shadow:inset 0 0 0 1px var(--case-bevel-highlight), inset 0 0 18px #0003}@media (max-width:680px){.setup-board:is([data-case=keychron-q1],[data-case=keychron-q2],[data-case=keychron-q3],[data-case=keycult-no1-rev2],[data-case=keycult-no2-65],[data-case=kbdfans-tofu60],[data-case=kbdfans-tofu65],[data-case=mode-envoy],[data-case=mode-sonnet]){--case-bevel:4px}}
.setup-procedural-case-mesh{z-index:0;pointer-events:none;opacity:0;width:100%;height:100%;transition:opacity .18s;position:absolute;inset:0}.setup-stage.setup-mesh-ready .setup-procedural-case-mesh{opacity:1}.setup-stage.setup-mesh-ready .setup-board.setup-mesh-board-ready{z-index:1;box-shadow:none!important;background:0 0!important;border-color:#0000!important}.keyboard-preview-shell:hover .setup-stage.setup-mesh-ready .setup-board.setup-mesh-board-ready{transform:rotateX(var(--setup-rotate-x,52deg)) rotateZ(var(--setup-rotate-z,-22deg)) translate3d(2%,-3%,0) scale(.91)}.setup-stage.setup-mesh-ready .setup-board.setup-mesh-board-ready:before,.setup-stage.setup-mesh-ready .setup-board.setup-mesh-board-ready:after,.setup-stage.setup-mesh-ready .setup-board.setup-mesh-board-ready>.setup-key-row:first-child:before,.setup-stage.setup-mesh-ready .setup-board.setup-mesh-board-ready>.setup-key-row:first-child:after,.setup-stage.setup-mesh-ready .setup-board.setup-mesh-board-ready>.setup-key-row:last-child:after{opacity:0!important}@media (prefers-reduced-motion:reduce){.setup-procedural-case-mesh{transition:none}}@media (max-width:680px){.setup-procedural-case-mesh{inset:0}.keyboard-preview-shell:hover .setup-stage.setup-mesh-ready .setup-board.setup-mesh-board-ready{transform:rotateX(var(--setup-rotate-x,51deg)) rotateZ(var(--setup-rotate-z,-18deg)) scale(.84)}}
.setup-stage[data-camera-pose]:after{content:"view · " attr(data-camera-pose);z-index:8;border:1px solid var(--border);background:color-mix(in srgb, var(--surface) 82%, transparent);color:var(--muted);letter-spacing:.08em;text-transform:uppercase;pointer-events:none;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:999px;padding:5px 8px;font-size:10px;font-weight:700;line-height:1;position:absolute;bottom:12px;right:14px}.setup-stage[data-camera-pose=custom]:after{content:"view · custom";color:var(--text)}@media (max-width:720px){.setup-stage[data-camera-pose]:after{padding:4px 6px;font-size:9px;bottom:8px;right:9px}}@media (prefers-reduced-motion:reduce){.setup-stage[data-camera-pose]:after{-webkit-backdrop-filter:none;backdrop-filter:none}}
.setup-live-input{color:inherit;letter-spacing:.02em;text-transform:none;white-space:nowrap;opacity:.52;background:0 0;border:0;align-items:center;gap:3px;padding:0;font-size:7px;font-weight:450;line-height:1;display:inline-flex}.setup-live-input:before{content:"";background:color-mix(in srgb,var(--setup-switch,var(--accent)) 55%,var(--muted));border-radius:50%;width:3px;height:3px}.setup-stage[data-interactive-keyboard=true] .setup-key{cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent;will-change:transform,filter,box-shadow}.setup-stage[data-interactive-keyboard=true] .setup-key.is-pressed,.setup-stage[data-interactive-keyboard=true] .setup-key.is-pressed:hover{transform:translate3d(0,1px,1.5px) rotateX(var(--cap-row-tilt,0deg)) scale(.985);filter:brightness(.93)saturate(.96);box-shadow:0 1.5px 0 color-mix(in srgb,var(--cap-base) 76%,black), 0 3px 5px color-mix(in srgb,var(--bg) 34%,transparent), inset 0 1px 2px #ffffff12;transition-duration:42ms,42ms,42ms;transition-timing-function:cubic-bezier(.2,.9,.3,1)}.setup-stage[data-interactive-keyboard=true] .setup-key.accent.is-pressed,.setup-stage[data-interactive-keyboard=true] .setup-key.accent.is-pressed:hover{box-shadow:0 1.5px 0 color-mix(in srgb,var(--cap-accent) 72%,black), 0 3px 6px color-mix(in srgb,var(--setup-switch,var(--accent)) 16%,transparent), inset 0 1px 2px #ffffff14}.setup-stage[data-interactive-keyboard=true] .setup-key:focus-visible{outline:1px solid color-mix(in srgb,var(--setup-switch,var(--accent)) 68%,white 10%);outline-offset:2px}@media (max-width:680px){.setup-live-input{font-size:6px}.setup-stage[data-interactive-keyboard=true] .setup-key.is-pressed,.setup-stage[data-interactive-keyboard=true] .setup-key.is-pressed:hover{transform:translate3d(0,.5px,1px) rotateX(var(--cap-row-tilt,0deg)) scale(.982)}}@media (prefers-reduced-motion:reduce){.setup-stage[data-interactive-keyboard=true] .setup-key{transition-duration:.01ms!important}}
.account-avatar-file-input{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.account-popover>.account-photo-action{position:relative}.account-popover>.account-photo-action.locked{background:color-mix(in srgb, var(--accent) 4%, transparent)}.account-popover>.account-photo-action.locked:hover{background:color-mix(in srgb, var(--accent) 9%, var(--surface2))}.account-photo-title{justify-content:space-between;align-items:center;gap:8px;display:flex}.account-pro-badge{border:1px solid color-mix(in srgb, var(--accent) 38%, var(--border));min-height:16px;color:var(--accent);letter-spacing:.1em;border-radius:999px;align-items:center;padding:2px 5px;font-size:7px;font-weight:850;line-height:1;display:inline-flex}.account-photo-status{color:var(--muted);padding:2px 10px 7px;font-size:8px;line-height:1.35}.account-popover>.account-signout{box-shadow:inset 0 1px 0 var(--border);margin-top:3px}.custom-profile-avatar .profile-avatar-image{z-index:2;object-fit:cover;width:100%;height:100%;position:absolute;inset:0}@media (max-width:680px){.account-popover{overscroll-behavior:contain;max-height:calc(100dvh - 84px);overflow-y:auto}}