.ht{--s:1;--p:1;background:radial-gradient(55% 45% at 72% 48%, #014cb04d, transparent 70%), var(--color-navy);color:#fff;position:relative}.ht-grid{gap:28px;padding-block:64px;display:grid}@media (width>=1024px){.ht-grid{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);align-items:center;gap:56px;padding-block:96px}}.ht-legend{gap:6px;margin:28px 0 0;padding:0;list-style:none;display:grid}.ht-legend a{color:#fff;background:#014cb029;border:1px solid #5ea8ff4d;border-radius:14px;grid-template-columns:30px 20px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:50px;padding:6px 12px 6px 8px;transition:background-color .35s,border-color .35s,color .35s;display:grid}.ht-legend a:hover{border-color:#5ea8ff99}.ht-n{background:var(--color-brand);width:30px;height:30px;font:700 11.5px var(--font-display);color:#fff;border:1.5px solid #8ec2ff;border-radius:999px;place-items:center;transition:inherit;display:grid}.ht-ic{color:var(--color-glow);transition:color .35s}.ht-l b{font:600 15px/1.25 var(--font-display);display:block}.ht-l small{color:var(--color-on-navy-2);white-space:nowrap;text-overflow:ellipsis;font-size:12px;display:block;overflow:hidden}.ht-c{font:600 11.5px var(--font-display);color:var(--color-on-navy);background:#ffffff12;border-radius:999px;padding:3px 9px}.ht.ready .ht-legend li:not(.on) a{color:var(--color-on-navy-2);background:#ffffff05;border-color:#ffffff12}.ht.ready .ht-legend li:not(.on) .ht-n{color:var(--color-on-navy-2);background:0 0;border-color:#8fa2c366}.ht.ready .ht-legend li:not(.on) .ht-ic{color:var(--color-on-navy-2)}.ht-stage{aspect-ratio:4/3;background-color:var(--color-navy-2);background-image:linear-gradient(#5ea8ff12 1px,#0000 1px),linear-gradient(90deg,#5ea8ff12 1px,#0000 1px);background-size:2.5% 3.33333%;border:1px solid #ffffff14;border-radius:24px;position:relative;overflow:hidden;box-shadow:0 40px 80px -40px #000000a6}.ht-cam{transform-origin:0 0;position:absolute;inset:0}.ht-layer,.ht-fx{width:100%;height:100%;display:block;position:absolute;inset:0}.ht-layer svg{width:100%;height:100%;display:block}.ht-draw{overflow:visible}.ht-dim{--ln:#8fa2c34d;--wall:#0b244980;--slab:#12305e73;--glass:#040f22a6;--dev:#12305e99;--dev-ln:#8fa2c36b;--panel:#0b2449b3;--screen:#8fa2c32e}.ht-lit{--ln:#cad6eaeb;--wall:#0e2a56f2;--slab:#1a3e74;--glass:#5ea8ff24;--dev:#014cb099;--dev-ln:#8ec2ff;--panel:#03337af2;--screen:#5ea8ff73}.ht-draw .ln{fill:none;stroke:var(--ln);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.ht-draw .thin{stroke-width:1.3px}.ht-draw .dash{stroke-dasharray:5 6}.ht-draw .wall,.ht-draw .slab,.ht-draw .glass,.ht-draw .door{stroke:var(--ln);stroke-width:2px;stroke-linejoin:round}.ht-draw .wall{fill:var(--wall)}.ht-draw .slab,.ht-draw .door{fill:var(--slab)}.ht-draw .glass{fill:var(--glass)}.ht-draw .dev,.ht-draw .panel{stroke:var(--dev-ln);stroke-width:2px;stroke-linejoin:round}.ht-draw .dev{fill:var(--dev)}.ht-draw .panel{fill:var(--panel)}.ht-draw .screen{fill:var(--screen)}.ht-draw .led{fill:var(--dev-ln)}.ht-draw .cut{fill:#030c1c80;stroke:var(--ln);stroke-width:1.5px;stroke-dasharray:7 6}.ht-draw .hatch{stroke:var(--ln);stroke-width:1.2px}.ht-draw .stone{fill:none;stroke:var(--ln);stroke-width:1px;opacity:.45}.ht-fx .cap{fill:#8fa2c399;font:600 15px var(--font-display);letter-spacing:.16em}.ht-fx .cap2{opacity:.75;font-size:13px}.ht-fx .cap:lang(ar){letter-spacing:0;font-size:17px}.ht-gate{transition:transform 2.4s cubic-bezier(.65,0,.35,1) .25s}.ht-gate.on{transform:translate(-236px)}.ht-fx{pointer-events:none}.ht-fx .fx{opacity:0;transition:opacity .6s}.ht-fx .fx.on{opacity:1}.ht-fx .hot{fill:#5ea8ff}.ht-fx .arc{fill:none;stroke:#5ea8ff;stroke-width:3.5px;stroke-linecap:round;opacity:.2}.ht-fx .fx.on .arc{animation:1.8s ease-in-out infinite ht-wave;animation-delay:calc(var(--i) * .22s)}.ht-fx .cell{fill:url(#ht-cell-g);opacity:0;transition:opacity .5s ease calc(var(--i) * .14s)}.ht-fx .fx.on .cell{opacity:.5}.ht-fx .flow{fill:none;stroke:#5ea8ff;stroke-width:3px;stroke-dasharray:8 12;stroke-linecap:round;stroke-linejoin:round}.ht-fx .fx.on .flow{animation:.9s linear infinite ht-flow}.ht-fx .bat{fill:#5ea8ff;opacity:0;transition:opacity .35s ease calc(.7s + var(--i) * .16s)}.ht-fx .fx.on .bat{opacity:.55}.ht-fx .rec{fill:#ff5a5f}.ht-fx .fx.on .rec{animation:1.6s step-end infinite ht-rec}.ht-fx .scr{fill:#5ea8ff}.ht-fx .face{fill:none;stroke:#061733;stroke-width:1.6px;stroke-linecap:round}.ht-fx .ok{fill:none;stroke:#fff;stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;opacity:0}.ht-fx .unlock{fill:#34d399;opacity:0}.ht-fx .fx.on .scr{animation:1.5s forwards ht-grant}.ht-fx .fx.on .face{animation:1.5s forwards ht-out}.ht-fx .fx.on .ok,.ht-fx .fx.on .unlock{animation:1.5s forwards ht-in}.ht-fx .lamp{fill:#ffb020;opacity:0}.ht-fx .fx.on .lamp{animation:.45s ease-in-out 6 alternate ht-blink}.ht-fx .beam{fill:none;stroke:#ff5a5f;stroke-width:1.5px;stroke-dasharray:2 6;opacity:.8}.ht-fx .scan{opacity:0}.ht.ready.complete .ht-fx .scan{transition:opacity .6s}.ht-fx .scan-ln{fill:none;stroke:#8ec2ff;stroke-width:2.5px}.ht-fx .scan-glow{fill:none;stroke:#5ea8ff;stroke-width:12px;opacity:.25}.ht:not(.is-visible) .ht-fx *{animation-play-state:paused!important}.ht-fx .tag{pointer-events:auto}.ht-fx .leader{fill:none;stroke:#8ec2ff;stroke-width:1.6px;transition:stroke .4s}.ht-fx .pin{fill:#8ec2ff;transition:fill .4s}.ht-fx .bub{fill:var(--color-brand);stroke:#8ec2ff;stroke-width:2px;transition:fill .35s,stroke .35s}.ht-fx .num{fill:#fff;font:700 17px var(--font-display);text-anchor:middle;transition:fill .35s}.ht-fx .ring{fill:none;stroke:#5ea8ff;stroke-width:2px;opacity:0;transform-box:fill-box;transform-origin:50%}.ht-fx .tag.on .ring{animation:1.2s cubic-bezier(.22,1,.36,1) both ht-ping}.ht.ready .ht-fx .tag:not(.on) .leader{stroke:#8fa2c366;stroke-dasharray:4 5}.ht.ready .ht-fx .tag:not(.on) .pin{fill:#8fa2c38c}.ht.ready .ht-fx .tag:not(.on) .bub{fill:var(--color-navy-2);stroke:#8fa2c380}.ht.ready .ht-fx .tag:not(.on) .num{fill:#cad6eab3}.ht-meter{color:var(--color-on-navy-2);grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;margin-top:18px;font-size:13px;display:grid}.ht-bar{background:#ffffff1a;border-radius:3px;height:3px;overflow:hidden}.ht-bar>span{background:linear-gradient(90deg, var(--color-brand), var(--color-glow));height:100%;transform:scaleX(var(--p));transform-origin:0;display:block}[dir=rtl] .ht-bar>span{transform-origin:100%}.ht-mc b{font:700 16px var(--font-display);color:#fff}.ht-done{flex-wrap:wrap;gap:10px;margin-top:18px;display:flex}.ht.ready .ht-done{visibility:hidden;opacity:0;transition:opacity .4s ease, transform .5s var(--ease-out), visibility 0s linear .5s;transform:translateY(6px)}.ht.ready.complete .ht-done{visibility:visible;opacity:1;transition:opacity .4s ease, transform .5s var(--ease-out), visibility 0s;transform:none}.ht-now{color:#fff;transition:transform .12s var(--ease-out), border-color .2s ease;-webkit-tap-highlight-color:transparent;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:16px;align-items:center;gap:12px;padding:10px 14px 10px 10px;display:none}.ht-now:active{border-color:#5ea8ff80;transform:scale(.98)}.ht-now-n{width:58px;height:42px;font:700 12px var(--font-display);color:var(--color-glow);direction:ltr;background:#5ea8ff1a;border:1px solid #5ea8ff66;border-radius:11px;flex:none;place-items:center;display:grid}.ht-now-t{flex:1;gap:1px;min-width:0;display:grid}.ht-now-l{font:600 16px/1.3 var(--font-display);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.ht-now-s{color:var(--color-on-navy-2);white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;overflow:hidden}.ht-now-a{color:var(--color-glow);flex:none}@media (width>=640px) and (width<=1023px) and (height<=539px){.ht-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:32px}.ht-lede{display:none}}@media (prefers-reduced-motion:reduce),(width>=1024px) and (height<=699px),(width<=1023px) and (height<=539px){.ht-stage{width:min(100%,133.333svh - 200px);margin-inline:auto}}@media (width>=1024px) and (height>=700px) and (prefers-reduced-motion:no-preference){.ht{height:290vh}.ht-sticky{top:var(--hdr,122px);height:calc(100vh - var(--hdr,122px));align-items:center;display:flex;position:sticky}.ht-grid{padding-block:20px}.ht-stage{width:min(100%, calc((100vh - var(--hdr,122px) - 130px) * 4 / 3));margin-inline:auto}}@media (width>=1024px) and (height>=700px) and (height<=820px) and (prefers-reduced-motion:no-preference){.ht-lede{display:none}}@media (width<=1023px) and (height>=540px) and (prefers-reduced-motion:no-preference){.ht{height:360svh}.ht-sticky{top:var(--hdr,65px);height:calc(100svh - var(--hdr,65px));height:calc(100dvh - var(--hdr,65px));padding-bottom:calc(env(safe-area-inset-bottom) + 84px);flex-direction:column;display:flex;position:sticky}.ht-grid{flex:1;grid-template-rows:auto minmax(0,1fr);gap:14px;min-height:0;padding-block:18px 6px}.ht .display-section{font-size:clamp(1.55rem,1.2rem + 1.6vw,2.2rem)}.ht-lede{display:none}.ht-legend{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.ht-view{flex-direction:column;gap:12px;min-height:0;display:flex}.ht-stage{aspect-ratio:auto;border-inline:0;border-radius:0;flex:1;min-height:180px;margin-inline:-16px;-webkit-mask-image:linear-gradient(90deg,#0000,#000 5% 95%,#0000);mask-image:linear-gradient(90deg,#0000,#000 5% 95%,#0000)}.ht.ready .ht-cam{will-change:transform}.ht-now{display:flex}.ht-meter{margin-top:0}.ht-done{display:none}}@media (width>=768px) and (width<=1023px) and (height>=540px) and (prefers-reduced-motion:no-preference){.ht-stage{margin-inline:-28px}}@keyframes ht-wave{0%,to{opacity:.15}40%{opacity:1}}@keyframes ht-flow{to{stroke-dashoffset:-20px}}@keyframes ht-rec{0%{opacity:1}50%{opacity:.15}}@keyframes ht-grant{0%,55%{fill:#5ea8ff}70%,to{fill:#11b981}}@keyframes ht-out{0%,55%{opacity:1}70%,to{opacity:0}}@keyframes ht-in{0%,60%{opacity:0}75%,to{opacity:1}}@keyframes ht-blink{0%{opacity:0}to{opacity:1}}@keyframes ht-ping{0%{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(2.4)}}@media (prefers-reduced-motion:reduce){.ht-fx .fx.on .arc,.ht-fx .fx.on .rec{opacity:.8;animation:none}.ht-fx .fx.on .flow{animation:none}.ht-fx .fx.on .scr{fill:#11b981;animation:none}.ht-fx .fx.on .face{opacity:0;animation:none}.ht-fx .fx.on .ok,.ht-fx .fx.on .unlock{opacity:1;animation:none}.ht-gate{transition:none}}
