html.cctv{--cctv-plastic:#141618;--cctv-plastic-hi:#292c2e;--cctv-plastic-lo:#060709;--cctv-void:#010101;--cctv-engrave:#9c9fa2;background:#000;background:lab(0% 0 0);font-size:min(.625vw,1.11111dvh)}@supports (color:lab(0% 0 0)){html.cctv{--cctv-plastic:lab(7.22142% -.487506 -1.72786);--cctv-plastic-hi:lab(17.634% -.637189 -2.13255);--cctv-plastic-lo:lab(1.98273% -.161909 -.589612);--cctv-void:lab(.30983% 0 -.00000298023);--cctv-engrave:lab(65.1951% -.658125 -2.14387)}}.cctv-stage{background:radial-gradient(circle 3.4rem at 2.1rem 2.1rem, #0503028c, transparent), radial-gradient(circle 3.4rem at calc(100% - 2.1rem) 2.1rem, #0503028c, transparent), radial-gradient(circle 3.4rem at 2.1rem calc(100% - 2.1rem), #0503028c, transparent), radial-gradient(circle 3.4rem at calc(100% - 2.1rem) calc(100% - 2.1rem), #0503028c, transparent), url(/cctv/steel-wear.jpg) center / cover no-repeat, url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1600' height='900' fill='none' stroke='white' stroke-linecap='round'><g stroke-opacity='0.06' stroke-width='0.6'><path d='M120 640 l220 -38'/><path d='M180 662 l140 -20'/><path d='M1380 210 l160 30'/><path d='M760 820 l260 -14'/><path d='M60 120 l90 60'/></g><g stroke='black' stroke-opacity='0.12' stroke-width='0.6'><path d='M121 641 l220 -38'/><path d='M761 821 l260 -14'/></g></svg>") center / 100% 100% no-repeat, linear-gradient(in oklch 102deg, transparent 14%, #ffffff12 27%, #ffffff1c 31%, #ffffff0d 37%, transparent 52%, transparent 66%, #ffffff0d 76%, transparent 86%), url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='3840' height='240'><filter id='b'><feTurbulence type='fractalNoise' baseFrequency='0.0006 1.1' numOctaves='2' seed='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.42 -0.19'/></filter><rect width='100%' height='100%' filter='url(%23b)'/></svg>") 0 0 / 3840px 240px repeat-y, url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='3840' height='220'><filter id='d'><feTurbulence type='fractalNoise' baseFrequency='0.0008 0.8' numOctaves='2' seed='11' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.45 -0.2'/></filter><rect width='100%' height='100%' filter='url(%23d)'/></svg>") 0 0 / 3840px 220px repeat-y, url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='800' height='450'><filter id='u'><feTurbulence type='fractalNoise' baseFrequency='0.004 0.012' numOctaves='3' seed='5'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.12 0'/></filter><rect width='100%' height='100%' filter='url(%23u)'/></svg>") center / 100% 100% no-repeat, linear-gradient(in oklch 180deg, #343637, #252728 50%, #191b1c);background-blend-mode:normal, normal, normal, normal, screen, normal, soft-light, normal, normal, overlay, normal;place-items:center;display:grid;position:fixed;inset:0;overflow:hidden;box-shadow:inset 0 0 0 .3rem #08090b,inset 0 .42rem 0 -.12rem #ffffff1f,inset .42rem 0 0 -.12rem #ffffff0d,inset 0 -.42rem 0 -.12rem #0006,inset -.42rem 0 0 -.12rem #00000040;box-shadow:inset 0 0 0 .3rem lab(2.4766% -.189044 -.681877),inset 0 .42rem 0 -.12rem lab(100% 0 0/.12),inset .42rem 0 0 -.12rem lab(100% 0 0/.05),inset 0 -.42rem 0 -.12rem lab(0% 0 0/.4),inset -.42rem 0 0 -.12rem lab(0% 0 0/.25)}@supports (color:lab(0% 0 0)){.cctv-stage{background:radial-gradient(circle 3.4rem at 2.1rem 2.1rem, lab(.896511% .456087 .682038/.55), transparent), radial-gradient(circle 3.4rem at calc(100% - 2.1rem) 2.1rem, lab(.896511% .456087 .682038/.55), transparent), radial-gradient(circle 3.4rem at 2.1rem calc(100% - 2.1rem), lab(.896511% .456087 .682038/.55), transparent), radial-gradient(circle 3.4rem at calc(100% - 2.1rem) calc(100% - 2.1rem), lab(.896511% .456087 .682038/.55), transparent), url(/cctv/steel-wear.jpg) center / cover no-repeat, url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1600' height='900' fill='none' stroke='white' stroke-linecap='round'><g stroke-opacity='0.06' stroke-width='0.6'><path d='M120 640 l220 -38'/><path d='M180 662 l140 -20'/><path d='M1380 210 l160 30'/><path d='M760 820 l260 -14'/><path d='M60 120 l90 60'/></g><g stroke='black' stroke-opacity='0.12' stroke-width='0.6'><path d='M121 641 l220 -38'/><path d='M761 821 l260 -14'/></g></svg>") center / 100% 100% no-repeat, linear-gradient(in oklch 102deg, transparent 14%, lab(100% 0 0/.07) 27%, lab(100% 0 0/.11) 31%, lab(100% 0 0/.05) 37%, transparent 52%, transparent 66%, lab(100% 0 0/.05) 76%, transparent 86%), url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='3840' height='240'><filter id='b'><feTurbulence type='fractalNoise' baseFrequency='0.0006 1.1' numOctaves='2' seed='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.42 -0.19'/></filter><rect width='100%' height='100%' filter='url(%23b)'/></svg>") 0 0 / 3840px 240px repeat-y, url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='3840' height='220'><filter id='d'><feTurbulence type='fractalNoise' baseFrequency='0.0008 0.8' numOctaves='2' seed='11' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.45 -0.2'/></filter><rect width='100%' height='100%' filter='url(%23d)'/></svg>") 0 0 / 3840px 220px repeat-y, url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='800' height='450'><filter id='u'><feTurbulence type='fractalNoise' baseFrequency='0.004 0.012' numOctaves='3' seed='5'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.12 0'/></filter><rect width='100%' height='100%' filter='url(%23u)'/></svg>") center / 100% 100% no-repeat, linear-gradient(in oklch 180deg, lab(22.2765% -.434726 -1.42697), lab(15.3164% -.431627 -1.42528) 50%, lab(9.51618% -.427723 -1.42321))}}.cctv-console{width:160rem;height:90rem;position:relative;overflow:visible}.cctv-console:before{content:"";pointer-events:none;background:radial-gradient(in oklch 9rem 3rem at 22rem 82rem, #ffffff0d, transparent), radial-gradient(in oklch 14rem 2.5rem at 70rem 88rem, #ffffff0a, transparent), radial-gradient(in oklch 6rem 4rem at 118rem 79rem, #ffffff09, transparent), radial-gradient(in oklch 30rem 20rem at 0 90rem, #2b1f112e, transparent), radial-gradient(in oklch 3rem .6rem at 140rem 30rem, #ffffff0d, transparent);position:absolute;inset:0}@supports (color:lab(0% 0 0)){.cctv-console:before{background:radial-gradient(in oklch 9rem 3rem at 22rem 82rem, lab(100% 0 0/.05), transparent), radial-gradient(in oklch 14rem 2.5rem at 70rem 88rem, lab(100% 0 0/.04), transparent), radial-gradient(in oklch 6rem 4rem at 118rem 79rem, lab(100% 0 0/.035), transparent), radial-gradient(in oklch 30rem 20rem at 0 90rem, lab(12.9693% 4.30039 11.4723/.18), transparent), radial-gradient(in oklch 3rem .6rem at 140rem 30rem, lab(100% 0 0/.05), transparent)}}.cctv-bezel{--glass-r:6.5rem;--glass-inset:2.5rem 2.5rem 2.5rem 2.5rem;border-radius:calc(var(--glass-r) + 2.5rem);background:linear-gradient(in oklch 180deg, #202224, var(--cctv-plastic-lo));width:110.333rem;height:84rem;padding:2.5rem;position:absolute;top:3rem;left:3rem;box-shadow:inset 0 .25rem #ffffff1a,inset 0 -.3rem .6rem #0009,0 1.2rem 2.4rem #0009;box-shadow:inset 0 .25rem lab(100% 0 0/.1),inset 0 -.3rem .6rem lab(0% 0 0/.6),0 1.2rem 2.4rem lab(0% 0 0/.6)}@supports (color:lab(0% 0 0)){.cctv-bezel{background:linear-gradient(in oklch 180deg, lab(12.9951% -.531986 -1.77765), var(--cctv-plastic-lo))}}.cctv-brand{filter:brightness(.62)contrast(1.05)drop-shadow(0 .08rem .06rem #000000b3);filter:brightness(.62)contrast(1.05)drop-shadow(0 .08rem .06rem lab(0% 0 0/.7));width:auto;height:1.9rem;position:absolute;bottom:.3rem;left:50%;translate:-50%}.cctv-bezel:before{content:"";inset:var(--glass-inset);border-radius:var(--glass-r);pointer-events:none;box-shadow:0 0 0 .35rem var(--cctv-void), 0 0 5rem .5rem oklch(.75 .04 170 / calc(.1 * var(--bright,1)));position:absolute}.cctv-glass{border-radius:var(--glass-r);width:100%;height:100%;clip-path:inset(0 round var(--glass-r));isolation:isolate;background:#000101;background:lab(.199678% -.105776 .0419557);position:relative;overflow:hidden}.cctv-picture{filter:brightness(var(--bright,1)) contrast(calc(.85 + var(--bright,1) * .15))}.cctv-video{filter:saturate(.45)contrast(1.16)brightness(1.06)}.cctv-crt{pointer-events:none;border-radius:inherit;background:radial-gradient(in oklch 60% 45% at 30% 18%, #ffffff17, transparent 70%), linear-gradient(in oklch 165deg, #ffffff0d 0%, transparent 32%), radial-gradient(in oklch 120% 120% at 50% 50%, transparent 58%, #0000008c 100%),  repeating-linear-gradient(180deg, #00000021, transparent .18rem, #00000021 .36rem);animation:.16s steps(2,end) infinite cctv-flicker;position:absolute;inset:0;box-shadow:inset 0 0 4rem 1rem #0000008c,inset 0 0 0 .15rem #ffffff0d;box-shadow:inset 0 0 4rem 1rem lab(0% 0 0/.55),inset 0 0 0 .15rem lab(100% 0 0/.05)}@supports (color:lab(0% 0 0)){.cctv-crt{background:radial-gradient(in oklch 60% 45% at 30% 18%, lab(100% 0 0/.09), transparent 70%), linear-gradient(in oklch 165deg, lab(100% 0 0/.05) 0%, transparent 32%), radial-gradient(in oklch 120% 120% at 50% 50%, transparent 58%, lab(0% 0 0/.55) 100%),  repeating-linear-gradient(180deg, lab(0% 0 0/.13), transparent .18rem, lab(0% 0 0/.13) .36rem)}}.cctv-boot{z-index:5;cursor:pointer;background:#000101;background:lab(.325321% -.35359 .139704);place-content:center;justify-items:center;gap:2.4rem;display:grid;position:absolute;inset:0}.cctv-boot-title{font-size:2.6rem;animation:1s step-end infinite cctv-rec}.cctv-boot-list{grid-template-columns:repeat(3,auto);gap:.8rem 3rem;font-size:2rem;display:grid}.cctv-boot-tap{color:#ffc324;color:lab(82.7905% 13.2835 80.528);font-size:2.2rem}.cctv-hum{pointer-events:none;background:linear-gradient(#0000 0%,#00000012 40%,#0000001a 50%,#00000012 60%,#0000 100%) 0 0/100% 35% no-repeat;background:linear-gradient(#0000 0%,lab(0% 0 0/.07) 40%,lab(0% 0 0/.1) 50%,lab(0% 0 0/.07) 60%,#0000 100%) 0 0/100% 35% no-repeat;animation:9s linear infinite cctv-hum;position:absolute;inset:0}@keyframes cctv-hum{0%{background-position:0 -60%}to{background-position:0 160%}}@media (prefers-reduced-motion:reduce){.cctv-hum{opacity:0;animation:none}}.cctv-noise{pointer-events:none;opacity:.09;mix-blend-mode:overlay;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='256' height='256'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.95' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.9 -0.35'/></filter><rect width='100%' height='100%' filter='url(%23g)'/></svg>") 0 0/256px 256px;animation:.4s steps(4,end) infinite cctv-noise;position:absolute;inset:-25%}@keyframes cctv-noise{0%{transform:translate(0)}25%{transform:translate(-7%,4%)}50%{transform:translate(5%,-6%)}75%{transform:translate(-3%,-2%)}to{transform:translate(6%,5%)}}.cctv-breathe{animation-name:cctv-breathe;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate}@keyframes cctv-breathe{0%{filter:brightness(.96)}to{filter:brightness(1.05)}}.cctv-sheen{pointer-events:none;border-radius:inherit;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1000' height='750'><filter id='s'><feGaussianBlur stdDeviation='18'/></filter><g fill='white'><circle cx='130' cy='90' r='1.6' opacity='0.5'/><circle cx='640' cy='120' r='1.1' opacity='0.4'/><circle cx='820' cy='540' r='1.4' opacity='0.45'/><circle cx='300' cy='600' r='1' opacity='0.35'/><circle cx='905' cy='260' r='0.9' opacity='0.4'/><circle cx='470' cy='410' r='1.2' opacity='0.3'/></g><ellipse cx='760' cy='610' rx='70' ry='40' fill='white' opacity='0.06' filter='url(%23s)' transform='rotate(-20 760 610)'/><ellipse cx='200' cy='180' rx='55' ry='30' fill='white' opacity='0.04' filter='url(%23s)'/></svg>") center / 100% 100% no-repeat, linear-gradient(in oklch 115deg, transparent 58%, #ffffff09 62%, #ffffff05 70%, transparent 74%), radial-gradient(in oklch 18% 30% at 86% 18%, #d4dfeb0d, transparent 70%);position:absolute;inset:0;box-shadow:inset .25rem 0 .6rem #de3b3d0d,inset -.25rem 0 .6rem #008cbb0d;box-shadow:inset .25rem 0 .6rem lab(51.5803% 63.2457 38.9399/.05),inset -.25rem 0 .6rem lab(53.8137% -22.1188 -38.6685/.05)}@supports (color:lab(0% 0 0)){.cctv-sheen{background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1000' height='750'><filter id='s'><feGaussianBlur stdDeviation='18'/></filter><g fill='white'><circle cx='130' cy='90' r='1.6' opacity='0.5'/><circle cx='640' cy='120' r='1.1' opacity='0.4'/><circle cx='820' cy='540' r='1.4' opacity='0.45'/><circle cx='300' cy='600' r='1' opacity='0.35'/><circle cx='905' cy='260' r='0.9' opacity='0.4'/><circle cx='470' cy='410' r='1.2' opacity='0.3'/></g><ellipse cx='760' cy='610' rx='70' ry='40' fill='white' opacity='0.06' filter='url(%23s)' transform='rotate(-20 760 610)'/><ellipse cx='200' cy='180' rx='55' ry='30' fill='white' opacity='0.04' filter='url(%23s)'/></svg>") center / 100% 100% no-repeat, linear-gradient(in oklch 115deg, transparent 58%, lab(100% 0 0/.035) 62%, lab(100% 0 0/.02) 70%, transparent 74%), radial-gradient(in oklch 18% 30% at 86% 18%, lab(88.3797% -2.11504 -7.10391/.05), transparent 70%)}}@keyframes cctv-flicker{50%{opacity:.94}}.cctv-osd{font-family:var(--font-osd), ui-monospace, monospace;color:#f8f8f8;color:lab(97.68% -.0000298023 .0000119209);letter-spacing:.05em;text-shadow:-.08rem -.08rem #000,.08rem -.08rem #000,-.08rem .08rem #000,.08rem .08rem #000,0 0 .3rem #000c;text-shadow:-.08rem -.08rem lab(0% 0 0),.08rem -.08rem lab(0% 0 0),-.08rem .08rem lab(0% 0 0),.08rem .08rem lab(0% 0 0),0 0 .3rem lab(0% 0 0/.8);white-space:nowrap}.cctv-rec-dot{background:#ee0f1f;background:lab(51.1789% 75.779 56.0668);border-radius:50%;width:.55em;height:.55em;animation:1s step-end infinite cctv-rec;box-shadow:0 0 0 .08rem #000,0 0 .6em #ee0f1fcc;box-shadow:0 0 0 .08rem lab(0% 0 0),0 0 .6em lab(51.1789% 75.779 56.0668/.8)}@keyframes cctv-rec{50%{opacity:0}}.cctv-lost{background:#000;background:lab(.0578117% 0 0);animation:.25s step-end both cctv-lost-in}.cctv-lost:before{content:"";background-image:repeating-linear-gradient(0deg,#ffffff80 0 1px,#0009 1px 3px),repeating-linear-gradient(90deg,#ffffff4d 0 2px,#0000 2px 5px);background-image:repeating-linear-gradient(0deg,lab(100% 0 0/.5) 0 1px,lab(0% 0 0/.6) 1px 3px),repeating-linear-gradient(90deg,lab(100% 0 0/.3) 0 2px,#0000 2px 5px);animation:.25s steps(5,end) both cctv-lost-static;position:absolute;inset:0}.cctv-lost-flag{animation:1s step-end .25s infinite cctv-rec;position:relative}@keyframes cctv-lost-static{0%{opacity:1;background-position:0 0,0 0}99%{opacity:1;background-position:0 37px,13px 0}to{opacity:0}}.cctv-lens-glass{object-fit:cover;mix-blend-mode:screen;opacity:.7;filter:blur(.4px)contrast(1.1)}.cctv-lens-frost{-webkit-backdrop-filter:blur(2.5px)contrast(.8)brightness(1.1);border-radius:50%;width:18%;height:24%;position:absolute;top:25%;left:72.5%;translate:-50% -50%;-webkit-mask-image:radial-gradient(closest-side,#000 35%,#0000);mask-image:radial-gradient(closest-side,#000 35%,#0000)}.cctv-glass-dust{object-fit:cover;mix-blend-mode:screen;opacity:.13;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.cctv-cobweb{object-fit:cover;mix-blend-mode:screen;opacity:.55;filter:blur(.5px)}.cctv-drop{aspect-ratio:1;-webkit-backdrop-filter:blur(2.5px)brightness(1.18)contrast(.85);border-radius:50%;position:absolute;translate:-50% -50%;box-shadow:inset 0 -.06rem .14rem #ffffff4d,inset 0 .08rem .16rem #0000004d;box-shadow:inset 0 -.06rem .14rem lab(100% 0 0/.3),inset 0 .08rem .16rem lab(0% 0 0/.3)}.cctv-power-osd{align-items:center;gap:.35em;display:inline-flex}.cctv-batt{border:.09em solid;border-radius:.12em;width:1.5em;height:.72em;padding:.1em;position:relative;box-shadow:0 0 0 .06em #000;box-shadow:0 0 0 .06em lab(0% 0 0)}.cctv-batt:after{content:"";background:currentColor;width:.13em;height:.32em;position:absolute;top:50%;right:-.22em;translate:0 -50%}.cctv-batt>span{background:currentColor;height:100%;display:block}.cctv-power-osd.is-low{color:#ff5149;color:lab(60.713% 68.9928 46.2455);animation:1s step-end infinite cctv-rec}.cctv-ir .cctv-video{filter:grayscale()contrast(.8)brightness(1.38)}.cctv-ir:before,.cctv-ir:after{content:"";z-index:1;pointer-events:none;position:absolute;inset:0}.cctv-ir:before{background:radial-gradient(in oklch 75% 80% at 50% 58%, #ffffff12, transparent 45%, #0000008c 100%)}@supports (color:lab(0% 0 0)){.cctv-ir:before{background:radial-gradient(in oklch 75% 80% at 50% 58%, lab(100% 0 0/.07), transparent 45%, lab(0% 0 0/.55) 100%)}}.cctv-ir:after{opacity:.2;mix-blend-mode:overlay;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='1' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 1.1 -0.45'/></filter><rect width='100%' height='100%' filter='url(%23g)'/></svg>") 0 0/200px 200px;animation:.3s steps(3,end) infinite cctv-noise;inset:-20%}.cctv-ir-tag{color:#d4dfeb;color:lab(88.3797% -2.11504 -7.10391)}.cctv-motion{box-shadow:inset 0 0 0 .22rem #60e56bd9;box-shadow:inset 0 0 0 .22rem lab(81.5248% -56.1621 47.0193/.85)}.cctv-motion-flag{color:#75f97f;color:lab(88.501% -56.1172 46.6016);animation:1s step-end infinite cctv-rec}.cctv-roll{background-image:repeating-linear-gradient(0deg,#ffffff73 0 1px,#000000b3 1px 3px),repeating-linear-gradient(90deg,#ffffff40 0 2px,#0000 2px 5px),linear-gradient(#0000 40%,#ffffff59 46%,#0000 52%);background-image:repeating-linear-gradient(0deg,lab(100% 0 0/.45) 0 1px,lab(0% 0 0/.7) 1px 3px),repeating-linear-gradient(90deg,lab(100% 0 0/.25) 0 2px,#0000 2px 5px),linear-gradient(#0000 40%,lab(100% 0 0/.35) 46%,#0000 52%);background-size:auto,auto,100% 200%;animation:.52s steps(8,end) both cctv-roll}@keyframes cctv-roll{0%{opacity:0;background-position:0 0,0 0,0 100%}12%{opacity:1}88%{opacity:1}to{opacity:0;background-position:0 41px,17px 0,0 -100%}}@keyframes cctv-lost-in{0%{background:#2e2e2e;background:lab(18.8% 0 0)}}.cctv-controls{flex-direction:column;gap:2rem;display:flex;position:relative}.cctv-power{align-items:center;gap:1rem;display:flex;position:absolute;bottom:.65rem;right:10rem}.cctv-engrave{font:600 1.2rem/1 var(--font-archivo), sans-serif;letter-spacing:.3em;text-transform:uppercase;color:var(--cctv-engrave);text-shadow:0 -1px #000000d9,0 1px #ffffff14;text-shadow:0 -1px lab(0% 0 0/.85),0 1px lab(100% 0 0/.08)}.cctv-led{background:#1a3520;background:lab(19.4409% -14.9847 9.75814);border-radius:50%;width:1.2rem;height:1.2rem}.cctv-led.is-on{background:radial-gradient(in oklch circle at 40% 35%, #c4ffcf, #00c55b 60%);box-shadow:0 0 1rem #00c55bcc, 0 0 0 .2rem var(--cctv-void)}@supports (color:lab(0% 0 0)){.cctv-led.is-on{background:radial-gradient(in oklch circle at 40% 35%, lab(95.7577% -35.8013 23.1468), lab(69.998% -60.8666 40.704) 60%);box-shadow:0 0 1rem lab(69.998% -60.8666 40.704/.8), 0 0 0 .2rem var(--cctv-void)}}.cctv-7seg{background:radial-gradient(in oklch 70% 80% at 50% 50%, #4601038c, transparent 75%), #040000;border-radius:.8rem;gap:.333rem;height:6.333rem;padding:.667rem 1.333rem;display:flex;position:relative;box-shadow:inset 0 .3rem .8rem #000c,0 .1rem #ffffff0f;box-shadow:inset 0 .3rem .8rem lab(0% 0 0/.8),0 .1rem lab(100% 0 0/.06)}@supports (color:lab(0% 0 0)){.cctv-7seg{background:radial-gradient(in oklch 70% 80% at 50% 50%, lab(11.9912% 31.5746 17.6692/.55), transparent 75%), lab(.281645% 1.06481 .362831)}}.cctv-7seg svg{filter:drop-shadow(0 0 .12rem #ff5e51e6)drop-shadow(0 0 .7rem #f000118c);filter:drop-shadow(0 0 .12rem lab(62.7376% 78.3459 57.1505/.9))drop-shadow(0 0 .7rem lab(51.0888% 78.7869 64.0756/.55));overflow:visible}.cctv-7seg:after{content:"";border-radius:inherit;pointer-events:none;background:linear-gradient(in oklch 165deg, #ffffff17, transparent 38%, transparent 70%, #ffffff08);position:absolute;inset:0}@supports (color:lab(0% 0 0)){.cctv-7seg:after{background:linear-gradient(in oklch 165deg, lab(100% 0 0/.09), transparent 38%, transparent 70%, lab(100% 0 0/.03))}}.cctv-7seg .on{fill:#ff9e8d;fill:lab(74.954% 61.2538 43.9339)}.cctv-7seg .off{fill:#1f0606;fill:lab(4.14363% 10.7719 4.12393)}.cctv-key{background:#020203;background:lab(.657829% -.057742 -.212649);border-radius:1.2rem;padding:.333rem;display:inline-flex;position:relative;box-shadow:inset 0 .25rem .5rem #000000d9,inset 0 -.08rem #ffffff0d,0 .08rem #ffffff0f;box-shadow:inset 0 .25rem .5rem lab(0% 0 0/.85),inset 0 -.08rem lab(100% 0 0/.05),0 .08rem lab(100% 0 0/.06)}.cctv-cap,.cctv-rocker>span{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.3' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.07 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"), radial-gradient(in oklch 90% 75% at 50% 42%, #1e1f21, #27292b 70%, #2e3133), linear-gradient(in oklch 180deg, #2c2e30, #151618)}@supports (color:lab(0% 0 0)){.cctv-cap,.cctv-rocker>span{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.3' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.07 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"), radial-gradient(in oklch 90% 75% at 50% 42%, lab(11.8363% -.429466 -1.42414), lab(16.4752% -.535086 -1.77927) 70%, lab(19.9554% -.537589 -1.78059)), linear-gradient(in oklch 180deg, lab(18.7953% -.536799 -1.78018), lab(7.22269% -.395872 -1.37621))}}.cctv-cap{min-width:8rem;height:4.333rem;font:700 1.2rem/1 var(--font-archivo), sans-serif;letter-spacing:.16em;border-radius:.9rem;justify-content:center;align-items:center;gap:.8rem;padding:0 1.5rem;transition:translate 70ms cubic-bezier(.3,0,.2,1);display:inline-flex;position:relative;box-shadow:inset 0 .1rem #ffffff29,inset 0 -.15rem #00000059,0 .25rem #060709,0 .4rem .4rem #0009;box-shadow:inset 0 .1rem lab(100% 0 0/.16),inset 0 -.15rem lab(0% 0 0/.35),0 .25rem lab(1.98273% -.161909 -.589612),0 .4rem .4rem lab(0% 0 0/.6)}.cctv-print{color:#dad7cfeb;color:lab(86.1408% .000536442 4.59757/.92);text-shadow:0 0 .04rem #dad7cf99;text-shadow:0 0 .04rem lab(86.1408% .000536442 4.59757/.6);transition:color .15s ease-out;-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='90' height='90'><filter id='w'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='1' seed='7'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 -2 2.25'/></filter><rect width='100%' height='100%' filter='url(%23w)'/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='90' height='90'><filter id='w'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='1' seed='7'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 -2 2.25'/></filter><rect width='100%' height='100%' filter='url(%23w)'/></svg>")}@media (hover:hover){.cctv-cap:hover .cctv-print,.cctv-rocker:hover .cctv-print{color:#f8f5ee;color:lab(96.5712% -.00905991 3.82484)}.cctv-knob:hover{filter:brightness(1.18)}}.cctv-cap[data-down=true],.cctv-cap:active{translate:0 .2rem;box-shadow:inset 0 .1rem #ffffff1a,inset 0 -.1rem #0000004d,0 .05rem #060709,0 .1rem .15rem #0009;box-shadow:inset 0 .1rem lab(100% 0 0/.1),inset 0 -.1rem lab(0% 0 0/.3),0 .05rem lab(1.98273% -.161909 -.589612),0 .1rem .15rem lab(0% 0 0/.6)}.cctv-knob:active{filter:brightness(.86)}.cctv-led-window{background:#432e14;background:lab(21.0449% 7.58372 20.3754);border-radius:.2rem;width:.8rem;height:.8rem;transition:background-color .12s ease-out;box-shadow:inset 0 .1rem .15rem #000000b3;box-shadow:inset 0 .1rem .15rem lab(0% 0 0/.7)}.cctv-led-window[data-on=true]{background:radial-gradient(in oklch circle at 40% 35%, #fff0c5, #ffa824 70%);box-shadow:0 0 .7rem #ffa824d9,inset 0 0 .1rem #fff9;box-shadow:0 0 .7rem lab(76.4239% 27.8159 77.4337/.85),inset 0 0 .1rem lab(100% 0 0/.6)}@supports (color:lab(0% 0 0)){.cctv-led-window[data-on=true]{background:radial-gradient(in oklch circle at 40% 35%, lab(95.6233% 7.20272 49.943), lab(76.4239% 27.8159 77.4337) 70%)}}.cctv-rocker{height:4.333rem;font:700 1.2rem/1 var(--font-archivo), sans-serif;letter-spacing:.16em;transform:perspective(24rem) rotateY(var(--rock,0deg));border-radius:.9rem;transition:transform .11s cubic-bezier(.3,0,.2,1);display:flex;overflow:hidden;box-shadow:inset 0 .1rem #ffffff24,0 .25rem #060709,0 .4rem .4rem #0009;box-shadow:inset 0 .1rem lab(100% 0 0/.14),0 .25rem lab(1.98273% -.161909 -.589612),0 .4rem .4rem lab(0% 0 0/.6)}.cctv-rocker[data-quad=true]{--rock:-7deg}.cctv-rocker[data-quad=false]{--rock:7deg}.cctv-rocker>span{place-items:center;width:8rem;display:grid;position:relative}.cctv-rocker>span+span{box-shadow:inset .08rem 0 #00000073;box-shadow:inset .08rem 0 lab(0% 0 0/.45)}.cctv-rocker[data-quad=true]>span:first-child,.cctv-rocker[data-quad=false]>span:last-child{filter:brightness(.72)}.cctv-rocker[data-quad=true]>span:last-child,.cctv-rocker[data-quad=false]>span:first-child{box-shadow:inset 0 .14rem #ffffff1f;box-shadow:inset 0 .14rem lab(100% 0 0/.12)}.cctv-side{flex-direction:column;gap:2.333rem;width:40.333rem;height:84rem;display:flex;position:absolute;top:3rem;left:116.667rem}.cctv-clock{filter:drop-shadow(0 1rem 1.4rem #000000a6);filter:drop-shadow(0 1rem 1.4rem lab(0% 0 0/.65));flex:none;align-self:center;width:21rem;height:21rem}.cctv-hand{transform-origin:50px 50px;transform-box:view-box}.cctv-second{transition:transform .17s cubic-bezier(.3,1.9,.5,1)}.cctv-speaker{box-shadow:inset 0 .5rem 1.2rem #000000e6, 0 0 0 .5rem var(--cctv-plastic-lo), 0 0 0 .6rem #ffffff0d;background:#000;background:lab(.112911% 0 0);border-radius:1.6rem;flex:1;position:relative;overflow:hidden}@supports (color:lab(0% 0 0)){.cctv-speaker{box-shadow:inset 0 .5rem 1.2rem lab(0% 0 0/.9), 0 0 0 .5rem var(--cctv-plastic-lo), 0 0 0 .6rem lab(100% 0 0/.05)}}.cctv-speaker-glow{background:radial-gradient(in oklch closest-side, #82d9b48c, #4e907426 60%, transparent);opacity:.08;border-radius:50%;position:absolute;inset:8% 10%}@supports (color:lab(0% 0 0)){.cctv-speaker-glow{background:radial-gradient(in oklch closest-side, lab(80.4547% -33.6681 9.64601/.55), lab(54.6666% -27.0087 7.72598/.15) 60%, transparent)}}.cctv-plate-screw{z-index:1;pointer-events:none;width:2rem;height:2rem;position:absolute}.cctv-screw{background:radial-gradient(in oklch circle at 35% 30%, #848689, #27292b 70%);border-radius:50%;width:1.5rem;height:1.5rem;position:absolute;box-shadow:0 .12rem .2rem #000000b3;box-shadow:0 .12rem .2rem lab(0% 0 0/.7)}@supports (color:lab(0% 0 0)){.cctv-screw{background:radial-gradient(in oklch circle at 35% 30%, lab(55.916% -.549167 -1.78696), lab(16.4752% -.535086 -1.77927) 70%)}}.cctv-screw:after{content:"";background:#030303;background:lab(.903296% 0 0);border-radius:.1rem;position:absolute;inset:45% 14%}.cctv-knob{cursor:grab;touch-action:none;background:linear-gradient(#e0e5eb, #e0e5eb) 50% .5rem / .4rem 2rem no-repeat, radial-gradient(in oklch circle at 40% 30%, #3b3d40, #141618 65%), repeating-conic-gradient(from 0deg, #2c2e30 0 4deg, #0c0d0f 4deg 8deg);background-origin:border-box;background-clip:padding-box,padding-box,border-box;border:.55rem solid #0000;border-radius:50%;width:7rem;height:7rem;transition:rotate .14s cubic-bezier(.3,1.5,.5,1),filter .12s ease-out;box-shadow:0 .7rem 1.1rem #000000a6,inset 0 .2rem #ffffff1f;box-shadow:0 .7rem 1.1rem lab(0% 0 0/.65),inset 0 .2rem lab(100% 0 0/.12)}@supports (color:lab(0% 0 0)){.cctv-knob{background:linear-gradient(lab(90.7116% -1.09041 -3.56942), lab(90.7116% -1.09041 -3.56942)) 50% .5rem / .4rem 2rem no-repeat, radial-gradient(in oklch circle at 40% 30%, lab(25.7556% -.540838 -1.78233), lab(7.22142% -.487506 -1.72786) 65%), repeating-conic-gradient(from 0deg, lab(18.7953% -.536799 -1.78018) 0 4deg, lab(3.69645% -.306115 -1.11712) 4deg 8deg)}}.cctv-knob:active{cursor:grabbing}.cctv-tape{z-index:2;filter:drop-shadow(0 .12rem .1rem #0009);filter:drop-shadow(0 .12rem .1rem lab(0% 0 0/.6));width:18rem;height:auto;position:absolute}.cctv-tape-ink{font-family:var(--font-marker), cursive;fill:#070e21f2;fill:lab(4.20702% 1.36386 -12.8199/.95);stroke:#070e2199;stroke:lab(4.20702% 1.36386 -12.8199/.6);stroke-width:.5px;font-size:27px}.cctv-sticker{filter:brightness(.82)drop-shadow(0 .2rem .25rem #0000008c);filter:brightness(.82)drop-shadow(0 .2rem .25rem lab(0% 0 0/.55));width:15rem;height:auto;position:absolute;bottom:2.333rem;left:2.333rem;rotate:-4deg}.cctv-prints{object-fit:cover;mix-blend-mode:screen;opacity:.28;pointer-events:none;z-index:3;width:calc(100% + 4rem);height:calc(100% + 6rem);position:absolute;inset:-3rem -2rem}@media (prefers-reduced-motion:reduce){.cctv-noise,.cctv-breathe,.cctv-crt,.cctv-rec-dot,.cctv-lost-flag{animation:none}.cctv-second{transition:none}}@media (orientation:portrait) and (max-width:1100px){html.cctv{font-size:min(2.17391vw,1.6129dvh)}html.cctv body{height:auto;min-height:100dvh;overflow:hidden auto}.cctv-stage{min-height:100dvh;padding:calc(env(safe-area-inset-top) + 2.5rem) calc(env(safe-area-inset-right) + 1.5rem) calc(env(safe-area-inset-bottom) + 2.5rem) calc(env(safe-area-inset-left) + 1.5rem);display:block;position:relative;inset:auto;overflow:visible}.cctv-console{flex-direction:column;gap:3.5rem;width:100%;height:auto;display:flex;overflow:visible}.cctv-bezel{--glass-r:1.6rem;--glass-inset:1.25rem 1.25rem 3rem 1.25rem;border-radius:calc(var(--glass-r) + 1.25rem);width:100%;height:auto;padding:1.25rem 1.25rem 3rem;position:relative;top:auto;left:auto}.cctv-glass{aspect-ratio:4/3;height:auto}.cctv-brand{height:1.4rem;bottom:.8rem}.cctv-power{gap:.6rem;bottom:.75rem;right:2rem}.cctv-power .cctv-engrave{font-size:1rem}.cctv-tape{width:19rem;top:-1.75rem!important;bottom:auto!important;left:1.5rem!important}.cctv-tile-osd{font-size:9px}.cctv-tile-osd .cctv-osd-top,.cctv-tile-osd .cctv-osd-bottom{left:6px!important}.cctv-tile-osd .cctv-osd-top{top:5px!important}.cctv-tile-osd .cctv-osd-bottom{white-space:nowrap;text-overflow:clip;max-width:62%;overflow:hidden;bottom:5px!important}.cctv-tile-osd .cctv-osd-power:not(:has(.is-low)){display:none}.cctv-tile-osd:not(:has(.is-low)) .cctv-osd-bottom{max-width:calc(100% - 12px)}.cctv-tile-osd .cctv-osd-top{top:.6rem;left:.7rem}.cctv-tile-osd .cctv-osd-flag{font-size:7px;top:5px!important;right:6px!important}.cctv-boot-list{font-size:1.1rem!important}.cctv-single-osd .cctv-dvr{display:none}.cctv-tile-osd .cctv-osd-power{bottom:.6rem;right:.7rem}.cctv-tile-osd .cctv-osd-bottom{bottom:.6rem;left:.7rem}.cctv-single-osd{padding:12px 14px;font-size:13px}.cctv-single-stamp{flex-direction:column}.cctv-single-stamp>span:last-child{opacity:.9;font-size:11px}.cctv-single-osd .cctv-single-flag{font-size:9px}.cctv-single-osd .cctv-banner{font-size:15px}.cctv-side{grid-template-columns:1fr 1fr;grid-template-areas:"controls controls""knobs knobs""clock speaker";align-items:center;gap:3.5rem 2.5rem;width:100%;height:auto;display:grid;position:static}.cctv-side>.cctv-clock{grid-area:clock;justify-self:center;width:100%;max-width:19rem;height:auto}.cctv-side>.cctv-speaker{flex:none;grid-area:speaker;height:19rem}.cctv-side>.cctv-controls{grid-area:controls;gap:2.25rem}.cctv-side>div:last-child{grid-area:knobs}.cctv-cap{min-width:9.5rem;height:5.5rem;font-size:1.4rem}.cctv-rocker{height:5.5rem;font-size:1.4rem}.cctv-rocker>span{width:9rem}.cctv-7seg{height:6rem}.cctv-sticker{transform-origin:0 100%;bottom:1.75rem;left:1.5rem;scale:.85}}@media (orientation:portrait) and (min-width:700px) and (max-width:1100px){html.cctv{font-size:min(1.5625vw,.980392dvh)}.cctv-side{grid-template-columns:auto 1fr;grid-template-areas:"controls clock""knobs speaker";gap:2.5rem 3rem}.cctv-side>.cctv-speaker{height:100%;min-height:12rem}.cctv-side>.cctv-clock{justify-self:center;max-width:19rem}}@media (pointer:coarse){.cctv-cap,.cctv-rocker{min-height:44px;font-size:max(1.2rem,11px)}.cctv-cap{min-width:max(8rem,64px)}.cctv-rocker>span{width:max(8rem,48px)}.cctv-7seg{min-height:44px}}@media (orientation:landscape) and (max-height:500px) and (pointer:coarse){.cctv-side>.cctv-clock,.cctv-side>.cctv-speaker,.cctv-prints{display:none}.cctv-side{grid-template-columns:repeat(2,minmax(0,1fr));align-content:center;justify-items:stretch;gap:10px 8px;padding-left:2rem;display:grid}.cctv-controls,.cctv-controls>div,.cctv-extra{display:contents}.cctv-side .cctv-key,.cctv-side .cctv-cap,.cctv-side .cctv-rocker{width:100%}.cctv-cap,.cctv-rocker{letter-spacing:.1em;min-width:0;padding:0 6px;font-size:11px}.cctv-rocker>span{flex:1;width:auto}.cctv-7seg{justify-self:center;height:44px}.cctv-side{grid-auto-flow:dense}.cctv-side .cctv-key:has(.cctv-rocker){grid-column:span 2}}html.cctv.cctv-bare{font-size:min(.859601vw,1.11111dvh)}html.cctv-bare .cctv-console{width:116.333rem;overflow:hidden}html.cctv-bare .cctv-side,html.cctv-bare .cctv-plate-screw{display:none}