:root{--cat-yellow: #FFCD11;--cat-black: #1a1a1a;--cat-gray: #4a4a4a;--bg: #0b0f16;--bg-panel: #121826;--bg-card: #151c2c;--line: rgba(255, 205, 17, .22);--text: #e8ecf4;--text-dim: #93a0b4;--ok: #38d97c;--err: #ff5964;--glow: 0 0 18px rgba(255, 205, 17, .35);--radius: 12px;--font-head: "Orbitron", "Montserrat", sans-serif;--font-body: "Montserrat", sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-text-size-adjust:100%}button{font-family:inherit;cursor:pointer}input,select{font-family:inherit}[hidden]{display:none!important}.btn-primary{background:var(--cat-yellow);color:#111;border:0;border-radius:8px;padding:12px 22px;font-family:var(--font-head);font-weight:700;letter-spacing:1px;font-size:14px;box-shadow:var(--glow);transition:transform .15s,box-shadow .15s}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 0 26px #ffcd1180}.btn-primary:disabled{opacity:.6;cursor:wait}.btn-ghost{background:transparent;color:var(--cat-yellow);border:1px solid var(--line);border-radius:8px;padding:9px 14px;font-family:var(--font-head);font-size:12px;letter-spacing:1px;transition:background .15s,border-color .15s}.btn-ghost:hover{background:#ffcd1114;border-color:var(--cat-yellow)}.login-view{min-height:100dvh;display:grid;place-items:center;padding:24px;padding-top:max(24px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom));position:relative;overflow:hidden}.login-bg-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,205,17,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,205,17,.05) 1px,transparent 1px);background-size:46px 46px;-webkit-mask-image:radial-gradient(ellipse at center,black 30%,transparent 75%);mask-image:radial-gradient(ellipse at center,black 30%,transparent 75%);animation:gridDrift 24s linear infinite}@keyframes gridDrift{to{background-position:46px 46px,46px 46px}}.login-card{position:relative;width:min(420px,100%);background:linear-gradient(160deg,var(--bg-panel),#0d1420);border:1px solid var(--line);border-radius:var(--radius);padding:34px 30px;display:flex;flex-direction:column;gap:18px;box-shadow:0 20px 60px #0000008c,inset 0 1px #ffffff0a}.login-card:before{content:"";position:absolute;top:0;left:24px;right:24px;height:3px;background:var(--cat-yellow);border-radius:0 0 4px 4px;box-shadow:var(--glow)}.login-brand{text-align:center;margin-bottom:6px}.login-brand h1,.app-title h1{font-family:var(--font-head);font-size:19px;letter-spacing:2.5px;margin:10px 0 4px;color:#fff}.brand-sub{margin:0;color:var(--text-dim);font-size:11px;letter-spacing:3px}.brand-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--cat-yellow);box-shadow:var(--glow);animation:blink 2.2s ease-in-out infinite}@keyframes blink{50%{opacity:.35}}.field{display:flex;flex-direction:column;gap:6px}.field span{font-size:11px;letter-spacing:2px;color:var(--text-dim);text-transform:uppercase}.field input{background:#0a0f18;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:var(--text);padding:13px 14px;font-size:16px;outline:none;transition:border-color .15s,box-shadow .15s}.field input:focus{border-color:var(--cat-yellow);box-shadow:0 0 0 3px #ffcd1126}.login-error{margin:0;color:var(--err);font-size:13px;text-align:center}.intro-view{position:fixed;inset:0;z-index:60;background:radial-gradient(ellipse at 50% 30%,#101a2e,#070b12 70%);display:grid;place-items:center;transition:opacity .45s}.intro-view.intro-out{opacity:0}.intro-stars{position:absolute;inset:0;background-image:radial-gradient(1px 1px at 12% 22%,#fff8 0,transparent 40%),radial-gradient(1px 1px at 78% 12%,#fff6 0,transparent 40%),radial-gradient(1.5px 1.5px at 55% 68%,#fff7 0,transparent 40%),radial-gradient(1px 1px at 32% 82%,#fff5 0,transparent 40%),radial-gradient(1px 1px at 88% 55%,#fff6 0,transparent 40%),radial-gradient(1.5px 1.5px at 8% 60%,#fff4 0,transparent 40%);animation:twinkle 3.4s ease-in-out infinite alternate}@keyframes twinkle{to{opacity:.45}}.intro-stage{text-align:center;padding:16px}.intro-svg{width:min(72vw,62vh,520px);height:auto;overflow:visible}.gt-outline{fill:#ffcd110d;stroke:var(--cat-yellow);stroke-width:2;stroke-dasharray:2600;stroke-dashoffset:2600;filter:drop-shadow(0 0 8px rgba(255,205,17,.45));animation:drawMap 2.2s ease forwards}@keyframes drawMap{to{stroke-dashoffset:0}}.gt-dot{opacity:0;animation:dotIn .4s ease forwards;animation-delay:calc(1.4s + var(--delay))}@keyframes dotIn{to{opacity:1}}.gt-dot-core{fill:var(--cat-yellow)}.gt-dot-pulse{fill:none;stroke:var(--cat-yellow);stroke-width:1.4;transform-origin:center;transform-box:fill-box;animation:dotPulse 1.6s ease-out infinite;animation-delay:calc(1.4s + var(--delay))}@keyframes dotPulse{0%{transform:scale(.4);opacity:1}to{transform:scale(2.4);opacity:0}}.intro-sat{opacity:0;animation:satIn .6s ease forwards 2.8s}@keyframes satIn{0%{transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}.sat-body{fill:#d7dde8}.sat-panel{fill:#2b6cb0;stroke:#9db8d8;stroke-width:1}.sat-ring{fill:none;stroke:var(--cat-yellow);stroke-width:1.6;opacity:0;transform-origin:center;transform-box:fill-box}.sat-ring-1{animation:ringOut 1.8s ease-out infinite 3.2s}.sat-ring-2{animation:ringOut 1.8s ease-out infinite 3.8s}.sat-ring-3{animation:ringOut 1.8s ease-out infinite 4.4s}@keyframes ringOut{0%{transform:scale(.3);opacity:.9}to{transform:scale(3.2);opacity:0}}.gt-beam{stroke:#ffcd11a6;stroke-width:1;stroke-dasharray:6 8;opacity:0;animation:beamIn .5s ease forwards,beamFlow 1s linear infinite;animation-delay:var(--delay),var(--delay)}@keyframes beamIn{to{opacity:1}}@keyframes beamFlow{to{stroke-dashoffset:-14}}.intro-caption{margin-top:18px;min-height:3.4em}.intro-line{margin:2px 0;font-family:var(--font-head);letter-spacing:3px;font-size:clamp(12px,2.4vw,16px);color:var(--cat-yellow);opacity:0}.intro-line-1{animation:lineIn .4s ease forwards .6s}.intro-line-2{animation:lineIn .4s ease forwards 3.1s}.intro-line-3{animation:lineIn .4s ease forwards 5.2s;color:var(--ok)}@keyframes lineIn{to{opacity:1}}.intro-skip{position:absolute;bottom:max(22px,env(safe-area-inset-bottom));right:22px}.app-view{min-height:100dvh;display:flex;flex-direction:column}.app-header{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:14px clamp(14px,3vw,34px);padding-top:max(14px,env(safe-area-inset-top));background:#0b0f16eb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:2px solid var(--cat-yellow);box-shadow:0 8px 30px #00000073}.app-title{display:flex;align-items:center;gap:12px}.app-title h1{font-size:clamp(14px,2.2vw,20px);margin:0}.app-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.search{background:#0a0f18;border:1px solid rgba(255,255,255,.12);border-radius:8px;color:var(--text);padding:10px 14px;font-size:16px;width:min(300px,62vw);outline:none}.search:focus{border-color:var(--cat-yellow)}.dashboard{flex:1;padding:clamp(14px,3vw,34px);display:flex;flex-direction:column;gap:30px}.dep-title{font-family:var(--font-head);font-size:clamp(15px,2vw,19px);letter-spacing:3px;color:#fff;display:flex;align-items:center;gap:14px;margin:0 0 6px}.dep-title:before{content:"";width:14px;height:14px;background:var(--cat-yellow);clip-path:polygon(0 0,100% 50%,0 100%)}.dep-title:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line),transparent)}.mun-title{font-size:clamp(12px,1.6vw,14px);letter-spacing:2px;color:var(--cat-yellow);text-transform:uppercase;margin:18px 0 12px}.camera-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(340px,100%),1fr));gap:clamp(12px,2vw,22px)}.camera-card{background:var(--bg-card);border:1px solid rgba(255,255,255,.07);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:border-color .2s,transform .2s,box-shadow .2s}.camera-card:hover{border-color:var(--line);transform:translateY(-2px);box-shadow:0 14px 34px #00000073}.viewer{position:relative;aspect-ratio:16 / 9;background:#05080d}.player-mount{position:absolute;inset:0}.player-mount canvas,.player-mount video{width:100%!important;height:100%!important}.placeholder{position:absolute;inset:0;z-index:2;display:grid;place-items:center;background-color:#0a1018;background-size:cover;background-position:center}.ph-badge{position:absolute;top:10px;left:10px;background:#0a0e14c7;border:1px solid var(--line);color:var(--cat-yellow);font-family:var(--font-head);font-size:10px;letter-spacing:1.5px;padding:4px 8px;border-radius:5px}.btn-play{display:inline-flex;align-items:center;gap:10px;background:#0c1018d1;border:1.5px solid var(--cat-yellow);color:#fff;font-family:var(--font-head);font-size:13px;letter-spacing:1.5px;padding:13px 22px;border-radius:999px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:background .2s,box-shadow .2s,transform .15s}.btn-play:hover:not(:disabled){background:#ffcd1129;box-shadow:var(--glow);transform:scale(1.04)}.btn-play:disabled{opacity:.75;cursor:wait}.play-ico{color:var(--cat-yellow);font-size:15px}.btn-stop{position:absolute;z-index:3;bottom:10px;right:10px;background:#0a0e14d9;border:1px solid var(--line);color:var(--cat-yellow);font-family:var(--font-head);font-size:11px;letter-spacing:1px;padding:8px 14px;border-radius:7px}.btn-stop:hover{background:#ffcd1126}.card-info{padding:13px 15px 15px;display:flex;flex-direction:column;gap:8px}.card-title{margin:0;font-size:13px;font-weight:700;line-height:1.35;text-transform:uppercase;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}.chip{background:#ffcd111f;border:1px solid var(--line);color:var(--cat-yellow);font-size:10.5px;letter-spacing:1px;padding:3px 9px;border-radius:999px;text-transform:uppercase}.cap-time{color:var(--text-dim);font-size:11.5px}.card-log{margin:0;min-height:1em;font-size:11.5px;color:var(--err)}.app-footer{text-align:center;color:var(--text-dim);font-size:11px;letter-spacing:1px;padding:18px;padding-bottom:max(18px,env(safe-area-inset-bottom));border-top:1px solid rgba(255,255,255,.06)}.app-footer p{margin:0}.view-toggle{display:flex;gap:4px}.view-toggle .toggle.active{background:#ffcd1129;border-color:var(--cat-yellow);color:var(--cat-yellow)}body.wall-mode .app-footer{display:none}body.wall-mode .dashboard{padding:6px;gap:0;overflow:hidden}.wall-grid{display:grid;grid-template-columns:repeat(var(--cols, 5),1fr);gap:6px;align-content:start}.wall-card{position:relative;aspect-ratio:16 / 9;background:#05080d;border:1px solid rgba(255,255,255,.08);border-radius:6px;overflow:hidden;transition:border-color .15s}.wall-card:hover{border-color:var(--line)}.wall-card.live{border-color:var(--cat-yellow);box-shadow:0 0 10px #ffcd1140}.wall-card .placeholder{position:absolute;inset:0;z-index:2;display:grid;place-items:center;background-color:#0a1018;background-size:cover;background-position:center}.wall-play{width:clamp(34px,22%,52px);aspect-ratio:1;border-radius:50%;border:1.5px solid var(--cat-yellow);background:#0c1018b8;color:var(--cat-yellow);font-size:clamp(13px,55%,18px);display:grid;place-items:center;opacity:.85;transition:transform .15s,opacity .15s,background .15s}.wall-play:hover:not(:disabled){transform:scale(1.12);opacity:1;background:#ffcd1133}.wall-play:disabled{cursor:wait}.wall-stop{position:absolute;z-index:3;top:6px;right:6px;width:26px;height:26px;border-radius:6px;border:1px solid var(--line);background:#0a0e14d9;color:var(--cat-yellow);font-size:11px;line-height:1}.wall-label{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:14px 8px 6px;background:linear-gradient(transparent,#05080deb);display:flex;flex-direction:column;gap:1px;pointer-events:none}.wall-title{font-size:10.5px;font-weight:700;text-transform:uppercase;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;text-shadow:0 1px 3px #000}.wall-muni{font-size:9px;letter-spacing:1.2px;text-transform:uppercase;color:var(--cat-yellow)}.wall-pager{position:sticky;bottom:0;display:flex;align-items:center;justify-content:center;gap:8px;padding:8px;padding-bottom:max(8px,env(safe-area-inset-bottom));background:#0b0f16eb;border-top:1px solid rgba(255,255,255,.07)}.pager-label{font-family:var(--font-head);font-size:10px;letter-spacing:2px;color:var(--text-dim);margin-right:6px}.pager-btn{min-width:40px;height:40px;border-radius:8px;border:1px solid rgba(255,255,255,.14);background:transparent;color:var(--text);font-family:var(--font-head);font-size:15px}.pager-btn.active{background:var(--cat-yellow);border-color:var(--cat-yellow);color:#111;box-shadow:var(--glow)}.wall-empty{color:var(--text-dim);text-align:center;padding:40px}@media(min-width:1900px){.wall-title{font-size:14px}.wall-muni{font-size:11px}.pager-btn{min-width:52px;height:52px;font-size:19px}}.admin-modal{width:min(860px,calc(100vw - 24px));max-height:min(84dvh,900px);background:var(--bg-panel);color:var(--text);border:1px solid var(--line);border-radius:var(--radius);padding:22px}.admin-modal::backdrop{background:#04060abf;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.admin-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.admin-head h2{margin:0;font-family:var(--font-head);font-size:16px;letter-spacing:2px}.admin-tabs{display:flex;gap:8px;margin-bottom:16px}.tab{background:transparent;border:1px solid rgba(255,255,255,.12);color:var(--text-dim);border-radius:7px;padding:8px 14px;font-family:var(--font-head);font-size:11px;letter-spacing:1px}.tab.active{border-color:var(--cat-yellow);color:var(--cat-yellow)}.user-create{display:grid;grid-template-columns:1fr 1fr auto auto;gap:8px;margin-bottom:16px}.user-create input,.user-create select{background:#0a0f18;border:1px solid rgba(255,255,255,.12);border-radius:7px;color:var(--text);padding:10px 12px;font-size:14px}.table-wrap{overflow-x:auto}.admin-modal table{width:100%;border-collapse:collapse;font-size:13px}.admin-modal th{text-align:left;color:var(--text-dim);font-size:11px;letter-spacing:1px;text-transform:uppercase;padding:8px 10px;border-bottom:1px solid var(--line)}.admin-modal td{padding:9px 10px;border-bottom:1px solid rgba(255,255,255,.06)}.row-actions{display:flex;gap:6px;flex-wrap:wrap}.row-actions button{background:transparent;border:1px solid rgba(255,255,255,.16);color:var(--text);border-radius:6px;padding:5px 9px;font-size:11.5px}.row-actions button:hover{border-color:var(--cat-yellow);color:var(--cat-yellow)}.row-actions button.danger:hover{border-color:var(--err);color:var(--err)}.ok{color:var(--ok)}.err{color:var(--err)}.admin-msg{margin:12px 0 0;font-size:13px;color:var(--ok)}.admin-msg.error{color:var(--err)}@media(max-width:640px){.camera-grid{grid-template-columns:1fr}.app-header{padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}.app-actions{width:100%;justify-content:space-between}.search{width:100%;order:2}.user-create{grid-template-columns:1fr}.btn-play{padding:15px 26px;font-size:14px}}@media(min-width:641px)and (max-width:1024px){.camera-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1900px){.camera-grid{grid-template-columns:repeat(4,1fr);gap:28px}.card-title{font-size:16px}.cap-time,.card-log{font-size:14px}.chip{font-size:13px}.ph-badge{font-size:12px}.btn-play{font-size:16px;padding:16px 30px}.dep-title{font-size:24px}.mun-title{font-size:17px}.app-title h1{font-size:24px}.app-footer{font-size:14px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}