.ex-skeuomorphism{--g-hw:700;--g-ht:-.025em;--g-r:14px;--g-btn-r:10px;--g-bw:1px;--g-bc:color-mix(in srgb,var(--gk) 20%,transparent);--metal:linear-gradient(180deg,#f4f4f2,#c9c9c6 48%,#dededb 52%,#b4b4b0);--brushed:repeating-linear-gradient(90deg,rgb(255 255 255/.18) 0 1px,rgb(0 0 0/.05) 1px 3px),var(--metal);--leather:radial-gradient(rgb(0 0 0/.25) 1px,transparent 1.5px) 0 0 /5px 5px,radial-gradient(rgb(255 255 255/.06) 1px,transparent 1.5px) 2px 2px /5px 5px,color-mix(in srgb,var(--gb) 70%,#1a1410);--g-card:linear-gradient(180deg,color-mix(in srgb,#fff 70%,var(--gp)),var(--gp));--g-sh:inset 0 1px 0 rgb(255 255 255/.8),0 1px 2px rgb(0 0 0/.2),0 10px 20px -10px rgb(0 0 0/.3);--g-btn-sh:inset 0 1px 0 rgb(255 255 255/.45),inset 0 -2px 0 rgb(0 0 0/.2),0 2px 4px rgb(0 0 0/.3)}.ex-skeuomorphism:has(.ex-dark:checked){--g-card:linear-gradient(180deg,color-mix(in srgb,#fff 8%,var(--gp)),var(--gp));--g-sh:inset 0 1px 0 rgb(255 255 255/.1),0 1px 2px #000,0 10px 20px -10px #000}.g-skeuo .g-btn{background:linear-gradient(180deg,color-mix(in srgb,var(--ga-btn) 80%,#fff),var(--ga-btn) 60%)}.g-skeuo .g-btn-2{background:var(--g-card);border-width:1px;border-color:var(--g-bc);box-shadow:var(--g-sh)}.sb-mark{display:inline-block;width:24px;height:24px;margin-right:8px;vertical-align:-6px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#8fb4ff 0 12%,#10203a 30%,#000 60%),#000;box-shadow:0 0 0 3px #bdbdb9,0 0 0 4px #777}.sb-hero{padding:80px 0 100px}.sb-hero-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}.sb-hero h1{font-size:clamp(52px,7vw,104px)}.sb-hero h1 em{display:block;font-style:normal;color:var(--gat)}.sb-cam{position:relative;aspect-ratio:1.3;filter:drop-shadow(0 30px 30px rgb(0 0 0/.35))}.sb-cam i{position:absolute;display:block;font-style:normal}.sb-cam .body{left:4%;right:4%;top:22%;bottom:12%;border-radius:22px;background:var(--brushed);box-shadow:inset 0 2px 0 #fff,inset 0 -3px 0 rgb(0 0 0/.2)}.sb-cam .leather{left:4%;right:4%;top:36%;bottom:20%;background:var(--leather);box-shadow:inset 0 2px 3px rgb(0 0 0/.5),inset 0 -1px 0 rgb(255 255 255/.15)}.sb-cam .top{left:30%;right:30%;top:10%;height:16%;border-radius:10px 10px 0 0;background:var(--brushed);clip-path:polygon(14% 0,86% 0,100% 100%,0 100%)}.sb-cam .vf{left:43%;top:13%;width:14%;height:8%;border-radius:4px;background:linear-gradient(135deg,#3a4a63,#0b1018);box-shadow:inset 0 0 0 2px #888}.sb-cam .dial{top:12%;width:13%;aspect-ratio:1;border-radius:50%;background:repeating-conic-gradient(#9a9a96 0 4deg,#e8e8e4 4deg 8deg);box-shadow:inset 0 0 0 5px #d7d7d3,0 2px 0 #666}.sb-cam .d1{left:12%}.sb-cam .d2{right:12%}.sb-cam .btn{right:30%;top:15%;width:6%;background:radial-gradient(circle at 35% 35%,color-mix(in srgb,var(--ga) 50%,#fff),var(--ga) 60%);box-shadow:0 2px 0 rgb(0 0 0/.4)}.sb-cam .btn,.sb-cam .lens{aspect-ratio:1;border-radius:50%}.sb-cam .lens{left:31%;top:30%;width:38%;background:repeating-conic-gradient(#1b1b1b 0 3deg,#3a3a3a 3deg 6deg);box-shadow:0 0 0 6px #c8c8c4,0 0 0 8px #6a6a66,0 8px 14px rgb(0 0 0/.5)}.sb-cam .glass{left:37%;top:37.6%;width:26%;background:radial-gradient(circle at 34% 30%,rgb(255 255 255/.85) 0 6%,transparent 9%),radial-gradient(circle at 62% 64%,rgb(150 120 255/.5) 0 10%,transparent 26%),radial-gradient(circle,#1a2b55 0 30%,#05070d 70%);box-shadow:inset 0 0 0 4px #111,inset 0 0 20px #000}.sb-cam .count,.sb-cam .glass{aspect-ratio:1;border-radius:50%}.sb-cam .count{right:16%;top:40%;display:grid;place-items:center;width:9%;background:#111;color:#ffb347;font:700 clamp(10px,1.2vw,16px) var(--font-mono);box-shadow:inset 0 2px 4px #000,0 0 0 3px #bbb}.sb-panel h2{font-size:clamp(34px,4.6vw,62px);margin-bottom:36px!important}.sb-plate{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;padding:36px;border-radius:22px;background:var(--brushed);color:#1d1d1b;box-shadow:inset 0 2px 0 #fff,inset 0 -3px 0 rgb(0 0 0/.2),0 20px 40px -20px rgb(0 0 0/.5)}.sb-plate>div{display:grid;justify-items:center;gap:4px;text-align:center}.sb-plate b{margin-top:12px;font-size:15px;letter-spacing:.06em;text-transform:uppercase}.sb-plate small{font:600 13px var(--font-mono);color:#3d3d3a}.sb-knob i{position:relative;display:block;width:110px;aspect-ratio:1;border-radius:50%;background:repeating-conic-gradient(#8f8f8b 0 3deg,#ecece8 3deg 6deg);box-shadow:inset 0 0 0 12px #d9d9d5,0 6px 10px rgb(0 0 0/.35)}.sb-knob i:after{content:"";position:absolute;left:calc(50% - 3px);top:16px;width:6px;height:22px;border-radius:3px;background:var(--ga)}.sb-toggle span{display:block;width:90px;height:110px;padding:10px;border-radius:14px;background:linear-gradient(180deg,#2b2b2b,#111);box-shadow:inset 0 2px 4px #000,0 1px 0 #fff}.sb-toggle i{display:block;height:50%;border-radius:8px;background:var(--metal);box-shadow:0 4px 6px rgb(0 0 0/.6),inset 0 1px 0 #fff}.sb-meter span{position:relative;display:block;width:130px;height:110px;overflow:hidden;border-radius:12px;background:linear-gradient(#fbf6e8,#e9e0c8);box-shadow:inset 0 3px 6px rgb(0 0 0/.4),0 0 0 4px #9a9a96}.sb-meter span:before{content:"";position:absolute;left:10%;right:10%;bottom:20%;height:60%;border-radius:50% 50% 0 0;border:2px solid #333;border-bottom:0}.sb-meter i{position:absolute;left:calc(50% - 1.5px);bottom:20%;width:3px;height:58%;background:#c0392b;transform-origin:bottom;rotate:18deg}@media (prefers-reduced-motion:no-preference){.sb-meter i{animation:sb-needle 2.6s ease-in-out infinite alternate}}@keyframes sb-needle{to{rotate:34deg}}.g-pic-sb-f1,.g-pic-sb-f2,.g-pic-sb-f3{--g-pic-bg:var(--leather)}.g-pic-sb-f1 i:first-child,.g-pic-sb-f2 i:first-child,.g-pic-sb-f3 i:first-child{left:30%;top:16%;width:40%;height:68%;border-radius:10px;background:linear-gradient(90deg,#d9d9d5,#fff 40%,#bdbdb9);box-shadow:0 10px 20px rgb(0 0 0/.5)}.g-pic-sb-f1 i:nth-child(2),.g-pic-sb-f2 i:nth-child(2),.g-pic-sb-f3 i:nth-child(2){left:30%;top:32%;width:40%;height:36%;background:var(--ga)}.g-pic-sb-f2 i:nth-child(2){background:#1a1a1a}.g-pic-sb-f3 i:nth-child(2){background:linear-gradient(135deg,#1f8a5b,#1e5bb8)}.g-pic-sb-f1 i:nth-child(3),.g-pic-sb-f2 i:nth-child(3),.g-pic-sb-f3 i:nth-child(3){left:44%;top:8%;width:12%;height:10%;border-radius:3px;background:#444}@media (max-width:1000px){.sb-hero-in{grid-template-columns:minmax(0,1fr)}.sb-cam{max-width:520px}.sb-plate{grid-template-columns:1fr 1fr}}@media (max-width:640px){.sb-plate{padding:22px;gap:18px}.sb-knob i{width:84px}.sb-meter span{width:110px}}