@font-face{font-family:'Manrope';src:url('../fonts/manrope-800.ttf') format('truetype');font-weight:600 900;font-style:normal;font-display:block}
body.sq-portal{--portal-ground:color-mix(in srgb,var(--sq-brand,#2955b7) 4%,#f0f3f8);--portal-paper:#fff;--portal-ink:#182333;--portal-muted:#526174;--portal-line:color-mix(in srgb,var(--sq-brand,#2955b7) 12%,#d8dfe9);--portal-accent:var(--sq-brand,#2955b7);--portal-accent-hover:var(--sq-brand-dark,color-mix(in srgb,var(--portal-accent) 80%,#000));--portal-glass:rgba(255,255,255,.78);--portal-shadow:color-mix(in srgb,var(--sq-brand,#2955b7) 16%,rgba(23,41,76,.14));background:var(--portal-ground);color:var(--portal-ink);font-family:'Segoe UI',sans-serif;min-height:100svh;isolation:isolate;overflow-x:clip}
html.dark body.sq-portal{--portal-ground:color-mix(in srgb,var(--sq-brand,#3b82f6) 6%,#090d16);--portal-paper:color-mix(in srgb,var(--sq-brand,#3b82f6) 8%,#101624);--portal-ink:#e2e8f0;--portal-ink-strong:#f1f5f9;--portal-muted:#94a3b8;--portal-line:color-mix(in srgb,var(--sq-brand,#3b82f6) 12%,rgba(255,255,255,.08));--portal-accent:var(--sq-brand,#3b82f6);--portal-accent-hover:color-mix(in srgb,var(--portal-accent) 85%,#ffffff);--portal-glass:color-mix(in srgb,var(--sq-brand,#3b82f6) 10%,rgba(13,19,33,.8));--portal-shadow:rgba(0,0,0,.55);background:var(--portal-ground);color:var(--portal-ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.sq-portal::before{display:none}.sq-portal *{box-sizing:border-box}.sq-portal ::selection{background:var(--portal-ink);color:var(--portal-paper)}
.sq-portal :focus-visible{outline:3px solid var(--portal-accent);outline-offset:4px}.sq-portal button{cursor:pointer}.sq-portal button:disabled{cursor:wait;opacity:.7}
.portal-skip{position:fixed;top:-100px;left:30px;z-index:200;background:var(--portal-paper);color:var(--portal-ink);padding:12px}.portal-skip:focus{top:20px}
.portal-atmosphere{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:-1;background:radial-gradient(ellipse 75% 65% at 4% 88%,color-mix(in srgb,var(--sq-brand) 16%,transparent),transparent 65%),radial-gradient(ellipse 65% 55% at 92% 10%,color-mix(in srgb,var(--sq-brand) 9%,transparent),transparent 65%)}
html.dark .portal-atmosphere{background:radial-gradient(ellipse 75% 65% at 4% 88%,color-mix(in srgb,var(--sq-brand) 22%,transparent),transparent 65%),radial-gradient(ellipse 65% 55% at 92% 10%,color-mix(in srgb,var(--sq-brand) 14%,transparent),transparent 65%)}
.portal-orbit{position:absolute;border-radius:50%;pointer-events:none}
.orbit-one{width:1050px;height:1050px;border:1.5px solid color-mix(in srgb,var(--portal-accent) 15%,transparent);left:-280px;top:32%;transform:rotate(-26deg) scaleY(.62)}
.orbit-two{width:1300px;height:1300px;left:-360px;top:26%;border-width:24px;border-style:solid;border-color:color-mix(in srgb,var(--portal-accent) 4.5%,transparent);transform:rotate(-22deg) scaleY(.64)}
.orbit-three{width:1550px;height:1550px;left:-440px;top:18%;border:1px dashed color-mix(in srgb,var(--portal-accent) 9%,transparent);transform:rotate(-18deg) scaleY(.61)}
.portal-bar{position:fixed;top:20px;left:0;right:0;margin:0 auto;width:calc(100% - 80px);max-width:1400px;min-height:70px;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(180deg,rgba(255,255,255,.82) 0%,rgba(255,255,255,.68) 100%);backdrop-filter:blur(28px) saturate(180%);-webkit-backdrop-filter:blur(28px) saturate(180%);border:1px solid rgba(255,255,255,.75);border-radius:18px;box-shadow:0 12px 34px -10px var(--portal-shadow),inset 0 1px 0 0 rgba(255,255,255,.95);z-index:100;will-change:top,width,border-radius,box-shadow;transition:width .32s cubic-bezier(.16,1,.3,1),max-width .32s cubic-bezier(.16,1,.3,1),top .32s cubic-bezier(.16,1,.3,1),border-radius .32s cubic-bezier(.16,1,.3,1),padding .32s cubic-bezier(.16,1,.3,1),background .25s ease,border-color .25s ease,box-shadow .25s ease}
html.dark .portal-bar{background:linear-gradient(180deg,rgba(255,255,255,.04) 0%,rgba(255,255,255,.01) 100%),rgba(13,19,33,.82);border:1px solid rgba(255,255,255,.08);box-shadow:0 16px 40px -10px rgba(0,0,0,.55),inset 0 1px 0 0 rgba(255,255,255,.1)}
.portal-bar.is-scrolled{top:0!important;margin:0 auto!important;width:100%!important;max-width:100%!important;border-radius:0!important;border-left:none!important;border-right:none!important;border-top:none!important;padding:12px clamp(20px,4vw,56px);box-shadow:0 10px 30px -6px var(--portal-shadow)}
html.dark .portal-bar.is-scrolled{border-bottom:1px solid rgba(255,255,255,.08);border-left:none;border-right:none;border-top:none}
.portal-brand{display:flex;align-items:center;gap:12px;color:var(--portal-ink)!important;text-decoration:none!important;font-family:Manrope,sans-serif;font-size:22px;font-weight:800;letter-spacing:-.03em}.portal-brand svg{color:var(--portal-accent)!important;transition:transform .25s ease}.portal-brand:hover svg{transform:scale(1.06)}.portal-signature svg{color:inherit!important}
.portal-bar-caption{font-size:13px;color:var(--portal-muted)}.portal-bar-actions{display:flex;align-items:center;gap:8px}.portal-help{border:0;background:none;color:var(--portal-ink);font-size:13px;padding:10px 0}.portal-help:hover{text-decoration:underline;text-underline-offset:5px}.portal-theme{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--portal-line);border-radius:12px;background:color-mix(in srgb,var(--portal-paper) 70%,transparent);color:var(--portal-ink);font-size:19px;transition:all .25s cubic-bezier(.16,1,.3,1);cursor:pointer}.portal-theme:hover{border-color:color-mix(in srgb,var(--portal-accent) 20%,transparent);color:var(--portal-accent);background:color-mix(in srgb,var(--portal-accent) 9%,transparent);transform:translateY(-1px);box-shadow:none}.portal-theme:focus-visible{outline:none!important;box-shadow:0 0 0 2px var(--portal-accent)!important}.portal-theme i{transition:transform .28s cubic-bezier(.16,1,.3,1),color .2s ease,filter .2s ease;display:inline-block}.portal-theme:hover i{transform:translateY(-1px) scale(1.12);filter:drop-shadow(0 2px 6px color-mix(in srgb,var(--portal-accent) 50%,transparent))}
html.dark .portal-theme{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09);color:#94a3b8;box-shadow:none}
html.dark .portal-theme:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);color:var(--portal-accent-hover);box-shadow:none;transform:translateY(-1px)}
html.dark .portal-theme:hover i{filter:drop-shadow(0 0 6px color-mix(in srgb,var(--portal-accent) 50%,transparent))}
html.dark .portal-theme:active{transform:scale(.96)}
html.dark .portal-theme:focus,html.dark .portal-theme:focus-visible{outline:none!important;border-color:var(--portal-accent)!important;box-shadow:0 0 0 2px color-mix(in srgb,var(--portal-accent) 25%,transparent)!important}
.portal-main{width:100%;margin:0 auto;display:block;padding:0;box-sizing:border-box}
.portal-story{position:relative;padding:14px 0}.portal-story h1{font-family:Manrope,sans-serif;font-size:clamp(44px,4.65vw,72px);font-weight:800;line-height:1.09;letter-spacing:-.04em;margin:0;color:var(--portal-ink)}
.portal-intro{font-size:17px;line-height:1.75;color:var(--portal-muted);max-width:440px;margin:28px 0 38px}
.portal-journey{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:16px;position:relative;max-width:550px}.portal-journey>div:not(.portal-journey-line){display:flex;flex-direction:column;align-items:flex-start;z-index:1}.portal-journey i{display:grid;place-items:center;width:46px;height:46px;font-size:25px;border:1px solid var(--portal-line);background:var(--portal-ground);color:var(--portal-accent);border-radius:50%;margin-bottom:18px}.portal-journey strong{font-size:14px;font-weight:650;color:var(--portal-ink)}.portal-journey div>span{font-size:12px;color:var(--portal-muted);line-height:1.6;margin-top:5px}.portal-journey-line{position:absolute;left:23px;right:60px;top:22px;height:1px;background:var(--portal-line);overflow:hidden}.portal-journey-line>span{position:absolute;inset:0;width:30%;background:var(--portal-accent);margin:0!important;animation:portal-trace 4.8s ease-in-out 2}
.portal-signature{display:flex;gap:14px;align-items:center;margin-top:42px;padding-top:22px;border-top:1px solid var(--portal-line);max-width:440px;color:var(--portal-muted);font-size:12px;line-height:1.65}
.portal-access{background:var(--portal-paper);border-radius:16px;box-shadow:0 24px 70px -24px var(--portal-shadow);position:relative;min-width:0}.portal-access-inner{padding:30px 36px}.portal-municipality{display:flex;align-items:center;gap:16px;padding-bottom:22px;border-bottom:1px solid var(--portal-line);margin-bottom:25px}.portal-emblem{width:138px;height:70px;flex-shrink:0;display:grid;place-items:center;background:#fff;border-radius:8px;padding:7px}.portal-emblem img{width:100%;height:100%;max-height:56px;object-fit:contain}.portal-municipality>span{font-size:13px;color:var(--portal-muted);line-height:1.5;overflow-wrap:anywhere}
.portal-welcome h2{font-family:Manrope,sans-serif;font-size:34px;font-weight:800;line-height:1.16;letter-spacing:-.03em;color:var(--portal-ink);margin:0 0 12px;max-width:300px}.portal-welcome p{font-size:14px;line-height:1.6;color:var(--portal-muted);margin:0 0 22px}
.portal-tabs{display:flex;gap:24px;border-bottom:1px solid var(--portal-line);margin-bottom:22px}.portal-tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:0 0 12px;font-size:13px;color:var(--portal-muted);font-weight:600}.portal-tabs button.is-active{color:var(--portal-ink);border-bottom-color:var(--portal-ink)}
.sq-portal .sq-auth-form{display:flex;flex-direction:column;gap:20px}.sq-portal .sq-auth-view{animation:none}.sq-portal .sq-mac-field{gap:8px}.sq-portal .sq-mac-label{font-size:13px;color:var(--portal-ink)}.sq-portal .sq-mac-input{height:48px;background:var(--portal-paper);border:1px solid var(--portal-line);border-radius:8px;font-size:14px;padding:0 46px 0 40px;color:var(--portal-ink);box-shadow:none;caret-color:var(--portal-accent)}.sq-portal .sq-mac-input::placeholder{color:var(--portal-muted);opacity:1}.sq-portal .sq-mac-input:focus{border-color:var(--portal-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--portal-accent) 15%,transparent)}.sq-portal .sq-mac-input-icon{color:var(--portal-muted);left:14px}.sq-portal .sq-mac-forgot-link{color:var(--portal-accent);font-size:12px}.sq-portal .sq-mac-eye-btn{height:40px;width:38px;right:4px;color:var(--portal-muted);font-size:19px}.sq-portal .sq-mac-check-label{font-size:13px;color:var(--portal-muted)}.sq-portal .sq-mac-checkbox{width:18px;height:18px;accent-color:var(--portal-accent)}
.sq-portal .sq-mac-btn-primary{height:50px;border-radius:8px;background:var(--portal-ink);color:var(--portal-paper);font-size:14px;margin:0;box-shadow:none;transition:background .2s,transform .2s}.sq-portal .sq-mac-btn-primary:hover{background:var(--portal-accent);color:var(--portal-paper);transform:translateY(-1px);box-shadow:none;filter:none}.sq-portal .sq-mac-btn-primary[aria-busy=true] i{animation:portal-wait 1s linear infinite}.sq-portal .sq-mac-alert{margin-bottom:18px}.sq-portal .text-muted{color:var(--portal-muted)!important}.portal-access-note{display:flex;align-items:center;justify-content:center;gap:7px;font-size:12px;color:var(--portal-muted);margin:22px 0 0}.portal-access-note i{font-size:15px}
@keyframes portal-type-arrive{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes portal-trace{0%{transform:translateX(-110%)}100%{transform:translateX(440%)}}
@keyframes portal-wait{to{transform:rotate(360deg)}}
@media(min-width:1600px){.portal-main{padding-top:70px;padding-bottom:70px}.portal-story h1{font-size:76px}}
@media(max-width:1050px){.portal-bar-caption{display:none}.portal-main{width:calc(100% - 64px);gap:32px;grid-template-columns:minmax(0,1fr) minmax(350px,1fr)}.portal-story h1{font-size:48px}.portal-access-inner{padding:28px}.portal-journey{gap:10px}.portal-journey strong{font-size:12px}.portal-journey div>span{font-size:11px}}
@media(max-width:760px){.portal-bar{top:12px;margin:0 auto;width:calc(100% - 32px);min-height:64px;padding:10px 16px;gap:12px}.portal-brand{font-size:19px;gap:8px}.portal-brand svg{width:32px!important;height:32px!important}.portal-bar-actions{gap:14px}.portal-help{font-size:12px}.portal-main{grid-template-columns:minmax(0,1fr);width:calc(100% - 40px);max-width:510px;padding:85px 0 30px;gap:30px}.portal-access{grid-row:1}.portal-access-inner{padding:26px}.portal-municipality{padding-bottom:18px;margin-bottom:22px}.portal-emblem{width:128px;height:62px}.portal-welcome h2{font-size:32px}.portal-welcome h2 br{display:none}.portal-story{padding:16px 6px}.portal-story h1{font-size:44px}.portal-intro{font-size:15px;margin:22px 0 28px}.portal-journey strong{font-size:12px}.portal-signature{margin-top:28px}.sq-portal .sq-mac-input{font-size:16px}}
@media(max-width:380px){.portal-bar{padding:10px 12px}.portal-help{font-size:11px}.portal-access-inner{padding:22px 18px}.portal-tabs{gap:18px}.portal-story h1{font-size:38px}.portal-municipality{gap:10px}.portal-emblem{width:110px}.portal-municipality>span{font-size:12px}.sq-portal .sq-mac-label-row{gap:8px;flex-wrap:wrap}.portal-bar-actions{gap:10px}}
@media(prefers-reduced-motion:reduce){.sq-portal *,.sq-portal *::before,.sq-portal *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.portal-journey-line>span{display:none}}/* Keep the portal's controls independent of the shared legacy auth theme. */
html.dark body.sq-portal .sq-mac-input{background:#0d1322;color:var(--portal-ink);border-color:var(--portal-line);box-shadow:none}
html.dark body.sq-portal .sq-mac-input:focus{border-color:var(--portal-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--portal-accent) 20%,transparent)}
html.dark body.sq-portal .sq-mac-btn-primary{background:linear-gradient(135deg,var(--portal-accent) 0%,color-mix(in srgb,var(--portal-accent) 80%,#000) 100%);color:#ffffff;border:1px solid rgba(255,255,255,.14);box-shadow:0 8px 22px -4px color-mix(in srgb,var(--portal-accent) 45%,transparent),inset 0 1px 0 rgba(255,255,255,.2)}
html.dark body.sq-portal .sq-mac-btn-primary:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--portal-accent) 88%,#fff) 0%,var(--portal-accent) 100%);color:#ffffff!important;box-shadow:0 10px 26px -4px color-mix(in srgb,var(--portal-accent) 55%,transparent)}
/* Landing and modal access drawer */
body.sq-portal{display:block}.sq-portal.portal-drawer-open{overflow:hidden}.sq-portal.portal-drawer-open .portal-pipeline-pulse{animation-play-state:paused!important}
.sq-portal .portal-main{display:block;width:100%;max-width:none;padding:0;margin:0}
.portal-nav-link{display:inline-flex;align-items:center;gap:7px;font-family:Manrope,sans-serif;font-size:13px;font-weight:700;letter-spacing:-.01em;color:var(--portal-muted);text-decoration:none;padding:9px 14px;border-radius:12px;border:1px solid transparent;transition:all .22s cubic-bezier(.16,1,.3,1)}
.portal-nav-link i{font-size:16px;color:var(--portal-accent);transition:transform .28s cubic-bezier(.16,1,.3,1),filter .2s ease;display:inline-block}
.portal-nav-link:hover{color:var(--portal-ink);background:color-mix(in srgb,var(--portal-accent) 9%,transparent);border-color:color-mix(in srgb,var(--portal-accent) 20%,transparent);transform:translateY(-1px)}
.portal-nav-link:hover i{transform:translateY(-1px) scale(1.12);filter:drop-shadow(0 2px 6px color-mix(in srgb,var(--portal-accent) 50%,transparent))}
html.dark .portal-nav-link{color:var(--portal-muted)}
html.dark .portal-nav-link i{color:var(--portal-accent)}
html.dark .portal-nav-link:hover{color:#f1f5f9;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12)}
html.dark .portal-nav-link:hover i{color:var(--portal-accent-hover);filter:drop-shadow(0 0 6px color-mix(in srgb,var(--portal-accent) 50%,transparent))}
.portal-bar-sep{width:1px;height:24px;background:var(--portal-line);margin:0 4px}
.portal-login-trigger{display:inline-flex;align-items:center;gap:10px;height:42px;padding:4px 5px 4px 16px;border-radius:12px;background:linear-gradient(135deg,var(--portal-accent) 0%,var(--sq-brand-dark,color-mix(in srgb,var(--portal-accent) 80%,#000)) 100%);color:#ffffff;border:0;font-family:Manrope,sans-serif;font-size:13.5px;font-weight:800;letter-spacing:-.015em;cursor:pointer;box-shadow:0 4px 16px -3px color-mix(in srgb,var(--portal-accent) 40%,transparent),inset 0 1px 0 rgba(255,255,255,.22);transition:all .25s cubic-bezier(.16,1,.3,1)}
.portal-login-trigger:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--portal-accent) 88%,#fff) 0%,var(--portal-accent) 100%);color:#ffffff!important;transform:translateY(-1.5px);box-shadow:0 8px 24px -4px color-mix(in srgb,var(--portal-accent) 50%,transparent)}
.portal-login-text{line-height:1;white-space:nowrap}
.portal-login-icon{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:rgba(255,255,255,.2);color:#ffffff;font-size:18px;transition:all .25s cubic-bezier(.16,1,.3,1)}
.portal-login-trigger:hover .portal-login-icon{transform:translateX(3px) scale(1.04);background:rgba(255,255,255,.28);color:#ffffff;box-shadow:none}
html.dark .portal-login-trigger{background:rgba(255,255,255,.07);color:#e2e8f0;border:1px solid rgba(255,255,255,.12);box-shadow:0 4px 14px -3px rgba(0,0,0,.4)}
html.dark .portal-login-trigger:hover{background:var(--portal-accent);color:#ffffff!important;border-color:color-mix(in srgb,var(--portal-accent) 75%,#ffffff);box-shadow:0 8px 24px -4px color-mix(in srgb,var(--portal-accent) 45%,transparent)}
html.dark .portal-login-trigger .portal-login-icon{background:rgba(255,255,255,.1);color:#e2e8f0}
html.dark .portal-login-trigger:hover .portal-login-icon{background:rgba(255,255,255,.2);color:#ffffff!important;box-shadow:none}
.portal-cta{display:inline-flex;align-items:center;justify-content:center;gap:16px;background:linear-gradient(135deg,var(--portal-accent) 0%,var(--sq-brand-dark,color-mix(in srgb,var(--portal-accent) 80%,#000)) 100%);color:#ffffff;border:1px solid rgba(255,255,255,.16);font-weight:650;text-decoration:none;border-radius:12px;padding:17px 26px;min-height:56px;font-size:15px;box-shadow:0 8px 24px -4px color-mix(in srgb,var(--portal-accent) 45%,transparent),inset 0 1px 0 rgba(255,255,255,.22);transition:transform .2s,background .2s,box-shadow .2s}
.portal-cta i{font-size:24px;transition:transform .25s}
.portal-cta:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--portal-accent) 88%,#fff) 0%,var(--portal-accent) 100%);color:#ffffff!important;transform:translateY(-2px);box-shadow:0 12px 32px -4px color-mix(in srgb,var(--portal-accent) 55%,transparent)}
.portal-cta:hover i{transform:translateX(4px)}
html.dark .portal-cta{background:linear-gradient(135deg,var(--portal-accent) 0%,color-mix(in srgb,var(--portal-accent) 80%,#000) 100%);color:#ffffff;border:1px solid rgba(255,255,255,.16);box-shadow:0 8px 24px -4px color-mix(in srgb,var(--portal-accent) 45%,transparent),inset 0 1px 0 rgba(255,255,255,.2)}
html.dark .portal-cta:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--portal-accent) 88%,#fff) 0%,var(--portal-accent) 100%);color:#ffffff!important;box-shadow:0 12px 32px -4px color-mix(in srgb,var(--portal-accent) 55%,transparent);transform:translateY(-2px)}
.portal-hero{min-height:100svh;height:100svh;max-width:1180px;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:space-between;text-align:center;padding:clamp(100px,13.5vh,132px) 28px clamp(16px,2.5vh,26px);position:relative;box-sizing:border-box}
.portal-hero-mark{color:var(--portal-ink);margin-bottom:20px;display:grid;place-items:center;width:92px;height:78px}.portal-hero-mark svg{color:inherit!important}
.portal-hero-center{display:flex;flex-direction:column;align-items:center;justify-content:center;margin:auto 0;width:100%;padding-top:clamp(12px,2.5vh,26px)}
.portal-hero h1{font-family:Manrope,sans-serif;font-weight:800;font-size:clamp(38px,4.8vw,74px);line-height:1.1;letter-spacing:-.04em;color:var(--portal-ink);margin:0;text-wrap:balance}
.portal-hero .portal-intro{font-size:17.5px;line-height:1.65;max-width:680px;margin:18px auto 24px;color:var(--portal-muted)}.portal-hero-actions{display:flex;align-items:center;gap:24px}.portal-secondary-link{font-size:14px;color:var(--portal-ink);text-decoration:underline;text-underline-offset:5px}
html.dark .portal-hero h1{background:linear-gradient(180deg,#ffffff 25%,#cbd5e1 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-.035em}
html.dark .portal-hero .portal-intro{color:#94a3b8}
html.dark .portal-secondary-link{color:#94a3b8;text-decoration-color:rgba(148,163,184,.4);transition:color .2s,text-decoration-color .2s}
html.dark .portal-secondary-link:hover{color:#e2e8f0;text-decoration-color:var(--portal-accent)}
.portal-hero-foot{margin-top:0;padding-top:0;padding-bottom:clamp(4px,1vh,12px);display:flex;justify-content:center;align-items:center;width:100%;flex-shrink:0}
.portal-pipeline-dock{display:inline-flex;align-items:center;gap:18px;padding:8px 12px 8px 18px;background:color-mix(in srgb,var(--portal-paper) 82%,transparent);backdrop-filter:blur(24px) saturate(140%);-webkit-backdrop-filter:blur(24px) saturate(140%);border:1px solid color-mix(in srgb,var(--portal-line) 85%,transparent);border-radius:18px;box-shadow:0 12px 36px -10px var(--portal-shadow),0 2px 6px rgba(0,0,0,.03),inset 0 1px 0 rgba(255,255,255,.9);transition:border-color .25s,box-shadow .25s}
html.dark .portal-pipeline-dock{background:rgba(17,24,39,.78);border-color:rgba(255,255,255,.09);box-shadow:0 16px 44px -10px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.07)}
.portal-pipeline-dock:hover{border-color:color-mix(in srgb,var(--portal-accent) 40%,transparent);box-shadow:0 16px 42px -8px var(--portal-shadow),0 0 0 1px color-mix(in srgb,var(--portal-accent) 15%,transparent)}
.portal-pipeline-steps{display:flex;align-items:center;gap:14px}
.portal-pipeline-step{display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:12px;transition:background .2s,transform .2s;cursor:default}
.portal-pipeline-step:hover{background:color-mix(in srgb,var(--portal-accent) 8%,transparent);transform:translateY(-1px)}
.portal-pipeline-icon{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--portal-accent) 12%,transparent);color:var(--portal-accent);font-size:16px;flex-shrink:0;transition:all .25s;box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.portal-pipeline-step:hover .portal-pipeline-icon{background:var(--portal-accent);color:#ffffff!important;transform:scale(1.05);box-shadow:0 4px 12px color-mix(in srgb,var(--portal-accent) 35%,transparent)}
html.dark .portal-pipeline-icon{background:rgba(255,255,255,.06);color:#94a3b8;border:1px solid rgba(255,255,255,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
html.dark .portal-pipeline-step:hover .portal-pipeline-icon{background:var(--portal-accent);color:#ffffff!important;border-color:transparent;box-shadow:0 4px 14px color-mix(in srgb,var(--portal-accent) 40%,transparent)}
.portal-pipeline-info{display:flex;flex-direction:column;gap:1px;text-align:left}
.portal-pipeline-title{font-family:Manrope,sans-serif;font-size:13px;font-weight:800;letter-spacing:-.015em;color:var(--portal-ink);line-height:1.2}
.portal-pipeline-sub{font-size:10.5px;color:var(--portal-muted);line-height:1.2;white-space:nowrap}
.portal-pipeline-connector{display:flex;align-items:center;gap:3px;color:var(--portal-muted);opacity:.7}
.portal-pipeline-line{width:28px;height:2px;background:color-mix(in srgb,var(--portal-line) 80%,transparent);border-radius:2px;position:relative;overflow:hidden}
.portal-pipeline-pulse{position:absolute;top:0;left:0;width:50%;height:100%;border-radius:2px;background:var(--portal-accent);box-shadow:0 0 8px var(--portal-accent);animation:portal-step-flow 2.4s cubic-bezier(.4,0,.2,1) infinite}
.portal-pipeline-pulse.delay{animation-delay:1.2s}
.portal-pipeline-arrow{font-size:14px;color:color-mix(in srgb,var(--portal-line) 95%,transparent);margin-left:-2px}
.portal-pipeline-divider{width:1px;height:34px;background:var(--portal-line);margin:0 2px}
.portal-pipeline-action{display:inline-flex;align-items:center;height:38px;gap:10px;padding:0 5px 0 14px;border-radius:12px;text-decoration:none;color:var(--portal-ink);cursor:pointer;background:color-mix(in srgb,var(--portal-accent) 8%,transparent);border:1px solid color-mix(in srgb,var(--portal-accent) 20%,transparent);transition:all .25s;box-sizing:border-box}
.portal-pipeline-action:hover{background:var(--portal-accent);color:#ffffff!important;border-color:var(--portal-accent);transform:translateY(-1px);box-shadow:0 6px 18px -4px color-mix(in srgb,var(--portal-accent) 40%,transparent)}
.portal-pipeline-action-text{font-family:Manrope,sans-serif;font-size:12.5px;font-weight:750;letter-spacing:-.01em;line-height:1;white-space:nowrap;transition:color .2s}
.portal-pipeline-action:hover .portal-pipeline-action-text{color:#ffffff!important}
.portal-pipeline-action-icon{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;flex-shrink:0;background:var(--portal-accent);color:#ffffff;font-size:16px;transition:all .25s;box-shadow:0 2px 6px color-mix(in srgb,var(--portal-accent) 30%,transparent)}
.portal-pipeline-action:hover .portal-pipeline-action-icon{background:rgba(255,255,255,.25);color:#ffffff;transform:scale(1.04)}
html.dark .portal-pipeline-action{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);color:#e2e8f0}
html.dark .portal-pipeline-action:hover{background:var(--portal-accent);border-color:color-mix(in srgb,var(--portal-accent) 80%,#ffffff);color:#ffffff!important;box-shadow:0 8px 20px -4px color-mix(in srgb,var(--portal-accent) 45%,transparent)}
html.dark .portal-pipeline-action:hover .portal-pipeline-action-text{color:#ffffff!important}
html.dark .portal-pipeline-action-icon{background:rgba(255,255,255,.1);color:#e2e8f0}
html.dark .portal-pipeline-action:hover .portal-pipeline-action-icon{background:rgba(255,255,255,.22);color:#ffffff!important;transform:scale(1.04)}
.portal-pipeline-action-icon i{animation:portal-arrow-glide 1.6s cubic-bezier(.4,0,.2,1) infinite}
@keyframes portal-step-flow{0%{transform:translateX(-120%);opacity:0}30%{opacity:1}70%{opacity:1}100%{transform:translateX(250%);opacity:0}}
@keyframes portal-arrow-glide{0%{transform:translateY(-14px);opacity:0}35%,65%{transform:translateY(0);opacity:1}100%{transform:translateY(14px);opacity:0}}
.portal-modules{scroll-margin-top:0;max-width:1280px;width:calc(100% - 112px);margin:0 auto;padding:94px 0 0}.portal-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:64px;margin-bottom:36px}.portal-section-heading h2{font-family:Manrope,sans-serif;font-size:clamp(32px,3.2vw,46px);font-weight:800;line-height:1.12;letter-spacing:-.035em;color:var(--portal-ink);margin:0}.portal-section-heading p{max-width:390px;font-size:16px;line-height:1.7;color:var(--portal-muted);margin:0}
.portal-module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.portal-module{background:var(--portal-paper);border:1px solid var(--portal-line);border-radius:16px;padding:30px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;transition:border-color .2s,transform .2s}.portal-module:hover{border-color:var(--portal-accent);transform:translateY(-3px)}.portal-module-icon{font-size:30px;color:var(--portal-accent);margin-bottom:28px;line-height:1}.portal-module h3{font-family:Manrope,sans-serif;font-size:21px;line-height:1.25;letter-spacing:-.025em;font-weight:800;color:var(--portal-ink);margin:0 0 14px}.portal-module p{font-size:15px;line-height:1.7;color:var(--portal-muted);margin:0 0 26px;max-width:540px}.portal-module-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}.portal-module-tags span{font-size:11px;padding:5px 9px;border-radius:5px;background:var(--portal-ground);color:var(--portal-muted)}
html.dark .portal-module-icon{color:var(--portal-accent)}
html.dark .portal-module:hover{border-color:color-mix(in srgb,var(--portal-accent) 40%,transparent);box-shadow:0 12px 30px -8px rgba(0,0,0,.55)}
html.dark .portal-module h3{color:#f1f5f9}
html.dark .portal-module p{color:#94a3b8}
html.dark .portal-section-heading h2{color:#f1f5f9}
html.dark .portal-section-heading p{color:#94a3b8}
.portal-module-featured{grid-column:span 2;background:linear-gradient(135deg,color-mix(in srgb,var(--portal-accent) 5%,var(--portal-paper)) 0%,var(--portal-paper) 100%);border:1px solid color-mix(in srgb,var(--portal-accent) 20%,var(--portal-line));border-radius:16px;padding:30px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;transition:border-color .2s,transform .2s,box-shadow .2s;box-shadow:0 8px 24px -6px var(--portal-shadow)}.portal-module-featured:hover{border-color:var(--portal-accent);transform:translateY(-3px);box-shadow:0 14px 34px -8px color-mix(in srgb,var(--portal-accent) 25%,var(--portal-shadow))}.portal-module-featured .portal-module-icon{font-size:30px;color:var(--portal-accent);margin-bottom:24px;line-height:1}.portal-module-featured h3{font-family:Manrope,sans-serif;font-size:26px;line-height:1.25;letter-spacing:-.025em;font-weight:800;color:var(--portal-ink);margin:0 0 14px}.portal-module-featured p{font-size:15px;line-height:1.7;color:var(--portal-muted);margin:0 0 26px;max-width:560px}.portal-module-featured .portal-module-tags span{font-size:11.5px;font-weight:650;padding:5px 10px;border-radius:6px;background:color-mix(in srgb,var(--portal-accent) 8%,var(--portal-ground));color:var(--portal-accent);border:1px solid color-mix(in srgb,var(--portal-accent) 18%,transparent)}.portal-record-flow{display:flex;gap:20px;align-items:center;margin-top:28px;width:100%;padding-top:20px;border-top:1px solid color-mix(in srgb,var(--portal-line) 80%,transparent);font-size:13px;color:var(--portal-muted)}.portal-record-flow span{display:flex;gap:10px;align-items:center;font-weight:600;color:var(--portal-ink)}.portal-record-flow i{font-size:20px;color:var(--portal-accent)}
html.dark .portal-module-featured{background:linear-gradient(135deg,color-mix(in srgb,var(--portal-accent) 10%,var(--portal-paper)) 0%,var(--portal-paper) 100%);border:1px solid color-mix(in srgb,var(--portal-accent) 24%,var(--portal-line));box-shadow:0 12px 36px -10px rgba(0,0,0,.5)}
html.dark .portal-module-featured h3{color:#f1f5f9}
html.dark .portal-module-featured p{color:#94a3b8}
html.dark .portal-module-featured .portal-module-tags span{background:color-mix(in srgb,var(--portal-accent) 12%,transparent);color:color-mix(in srgb,var(--portal-accent) 80%,#fff);border-color:color-mix(in srgb,var(--portal-accent) 26%,transparent)}
html.dark .portal-record-flow{border-top-color:var(--portal-line);color:var(--portal-muted)}
html.dark .portal-record-flow span{color:#e2e8f0}
html.dark .portal-record-flow i{color:var(--portal-accent)}.portal-module-report{background:color-mix(in srgb,var(--portal-accent) 5%,var(--portal-paper))}
.portal-bottom-cta{position:relative;display:flex;justify-content:space-between;align-items:center;gap:40px;margin-top:68px;margin-bottom:20px;padding:clamp(38px,4.8vw,56px) clamp(32px,5vw,60px);border-radius:24px;background:linear-gradient(135deg,color-mix(in srgb,var(--sq-brand) 6%,var(--portal-paper)) 0%,var(--portal-paper) 65%,color-mix(in srgb,var(--portal-accent) 6%,var(--portal-paper)) 100%);border:1px solid color-mix(in srgb,var(--portal-line) 85%,transparent);box-shadow:0 24px 60px -20px var(--portal-shadow),0 2px 8px rgba(0,0,0,.03),inset 0 1px 0 rgba(255,255,255,.9);overflow:hidden}
.portal-bottom-cta::before{content:'';position:absolute;top:-100px;right:-80px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--portal-accent) 18%,transparent) 0%,transparent 70%);pointer-events:none;z-index:0}
html.dark .portal-bottom-cta{background:linear-gradient(135deg,color-mix(in srgb,var(--portal-accent) 12%,var(--portal-paper)) 0%,var(--portal-paper) 65%,color-mix(in srgb,var(--portal-accent) 6%,var(--portal-paper)) 100%);border-color:color-mix(in srgb,var(--portal-line) 75%,transparent);box-shadow:0 28px 70px -20px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.07)}
html.dark .portal-bottom-cta::before{background:radial-gradient(circle,color-mix(in srgb,var(--portal-accent) 16%,transparent) 0%,transparent 70%)}
.portal-bottom-content{position:relative;z-index:1;max-width:620px;display:flex;flex-direction:column;align-items:flex-start}
.portal-bottom-cta h2{font-family:Manrope,sans-serif;font-size:clamp(28px,3vw,38px);letter-spacing:-.035em;line-height:1.15;color:var(--portal-ink);font-weight:800;margin:0 0 12px}
.portal-bottom-cta p{font-size:16px;line-height:1.65;color:var(--portal-muted);margin:0 0 20px}
html.dark .portal-bottom-cta h2{color:#f1f5f9}
html.dark .portal-bottom-cta p{color:#94a3b8}
.portal-bottom-tags{display:flex;align-items:center;flex-wrap:wrap;gap:14px}
.portal-bottom-tags span{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--portal-muted)}
.portal-bottom-tags span i{font-size:16px;color:var(--portal-accent)}
html.dark .portal-bottom-tags span i{color:var(--portal-accent)}
.portal-bottom-action-col{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-end;gap:10px;flex-shrink:0}
.portal-bottom-btn{display:inline-flex;align-items:center;gap:14px;height:52px;padding:6px 8px 6px 24px;border-radius:14px;background:linear-gradient(135deg,var(--portal-accent) 0%,var(--sq-brand-dark,color-mix(in srgb,var(--portal-accent) 80%,#000)) 100%);color:#ffffff;border:1px solid rgba(255,255,255,.14);font-family:Manrope,sans-serif;font-size:14.5px;font-weight:800;letter-spacing:-.015em;cursor:pointer;box-shadow:0 8px 24px -6px color-mix(in srgb,var(--portal-accent) 45%,transparent),inset 0 1px 0 rgba(255,255,255,.2);transition:all .25s cubic-bezier(.16,1,.3,1)}
.portal-bottom-btn:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--portal-accent) 88%,#fff) 0%,var(--portal-accent) 100%);color:#ffffff!important;transform:translateY(-2px);box-shadow:0 14px 34px -8px color-mix(in srgb,var(--portal-accent) 55%,transparent)}
.portal-bottom-btn-text{line-height:1;white-space:nowrap}
.portal-bottom-btn-icon{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.16);color:#ffffff;font-size:22px;transition:all .25s ease}
.portal-bottom-btn:hover .portal-bottom-btn-icon{transform:translateX(4px);background:rgba(255,255,255,.25);color:#ffffff;box-shadow:none}
html.dark .portal-bottom-btn{background:linear-gradient(135deg,var(--portal-accent) 0%,color-mix(in srgb,var(--portal-accent) 80%,#000) 100%);color:#ffffff;border:1px solid rgba(255,255,255,.14);box-shadow:0 8px 24px -4px color-mix(in srgb,var(--portal-accent) 45%,transparent),inset 0 1px 0 rgba(255,255,255,.2)}
html.dark .portal-bottom-btn:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--portal-accent) 88%,#fff) 0%,var(--portal-accent) 100%);color:#ffffff!important;box-shadow:0 12px 30px -4px color-mix(in srgb,var(--portal-accent) 55%,transparent)}
html.dark .portal-bottom-btn .portal-bottom-btn-icon{background:rgba(255,255,255,.16);color:#ffffff}
html.dark .portal-bottom-btn:hover .portal-bottom-btn-icon{background:rgba(255,255,255,.25);color:#ffffff!important}
.portal-bottom-notice{font-size:11.5px;color:var(--portal-muted);text-align:right}
.sq-portal .portal-footer{position:relative;width:100%;margin:48px 0 0;padding:22px 0 max(22px,env(safe-area-inset-bottom));border-top:1px solid var(--portal-line);background:linear-gradient(180deg,rgba(255,255,255,.45) 0%,rgba(255,255,255,.25) 100%);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-sizing:border-box}
html.dark .sq-portal .portal-footer{background:linear-gradient(180deg,rgba(255,255,255,.025) 0%,rgba(255,255,255,.01) 100%),rgba(10,14,24,.55);border-top:1px solid rgba(255,255,255,.07)}
.portal-footer-inner{width:calc(100% - 80px);max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;box-sizing:border-box}
.portal-footer-start{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.portal-footer-muni{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:8px;font-family:Manrope,sans-serif;font-size:11.5px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:var(--portal-ink);background:color-mix(in srgb,var(--portal-accent) 8%,transparent);border:1px solid color-mix(in srgb,var(--portal-accent) 18%,transparent)}
.portal-footer-muni i{font-size:14px;color:var(--portal-accent)}
html.dark .portal-footer-muni{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.09);color:#e2e8f0}
html.dark .portal-footer-muni i{color:var(--portal-accent)}
.portal-footer-sep{color:var(--portal-line);font-size:13px;line-height:1;user-select:none}
html.dark .portal-footer-sep{color:rgba(255,255,255,.15)}
.portal-footer-copy{font-size:12.5px;color:var(--portal-muted);font-weight:600;letter-spacing:-.01em}
.portal-footer-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.portal-footer-link{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:10px;font-family:Manrope,sans-serif;font-size:12.5px;font-weight:650;color:var(--portal-muted);text-decoration:none;border:1px solid transparent;background:none;cursor:pointer;transition:all .22s cubic-bezier(.16,1,.3,1)}
.portal-footer-link i{font-size:15px;color:var(--portal-accent);transition:transform .2s ease}
.portal-footer-link:hover{color:var(--portal-ink);background:color-mix(in srgb,var(--portal-accent) 9%,transparent);border-color:color-mix(in srgb,var(--portal-accent) 18%,transparent);transform:translateY(-1px)}
.portal-footer-link:hover i{transform:scale(1.15)}
html.dark .portal-footer-link{color:var(--portal-muted)}
html.dark .portal-footer-link:hover{color:#f1f5f9;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12)}
.sq-portal .portal-drawer{position:fixed;inset:0 0 0 auto;margin:0;border:0;border-radius:20px 0 0 20px;padding:0;width:min(520px,100%);max-width:100%;height:100%;height:100dvh;max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;background:var(--portal-paper);color:var(--portal-ink);box-shadow:-20px 0 80px rgba(8,18,36,.18)}
.portal-drawer:not([open]){display:none}.portal-drawer[open]{animation:portal-drawer-enter .38s cubic-bezier(.16,1,.3,1)}.portal-drawer[open].is-closing{animation:portal-drawer-exit .22s ease-in forwards}.portal-drawer::backdrop{background:rgba(11,22,40,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.portal-drawer-toolbar{position:sticky;top:0;z-index:2;display:flex;justify-content:flex-end;align-items:center;padding:18px 26px 8px;background:var(--portal-paper)}
.portal-drawer-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.portal-drawer-close,.portal-drawer-theme{display:grid;place-items:center;width:40px;height:40px;background:var(--portal-ground);color:var(--portal-ink);border:0;border-radius:50%;font-size:22px;transition:background .2s,transform .2s}
.portal-drawer-theme{font-size:19px}
.portal-drawer-close:hover,.portal-drawer-theme:hover{background:var(--portal-line);transform:scale(1.05)}
.sq-portal .portal-drawer .portal-access-inner{padding:10px 42px 48px}
.portal-municipality{display:flex;align-items:center;gap:18px;padding-bottom:18px;margin-bottom:22px;border-bottom:1px solid color-mix(in srgb,var(--portal-line) 80%,transparent)}
.portal-municipality-logo{height:46px;max-height:50px;width:auto;max-width:145px;object-fit:contain;object-position:left center;flex-shrink:0;transition:transform .2s ease}
.portal-municipality-logo-light{display:block;mix-blend-mode:multiply}
.portal-municipality-logo-dark{display:none}
html.dark .portal-municipality-logo-light{display:none!important}
html.dark .portal-municipality-logo-dark{display:block!important;mix-blend-mode:normal;background:transparent;padding:0;border-radius:0}
.portal-municipality-divider{width:1px;height:38px;background:var(--portal-line);flex-shrink:0}
.portal-municipality-meta{display:flex;flex-direction:column;gap:2px;min-width:0}
.portal-municipality-tag{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:750;letter-spacing:.025em;text-transform:uppercase;color:var(--portal-accent);line-height:1;margin-bottom:2px}
.portal-municipality-tag i{font-size:12px}
.portal-municipality-name{font-family:Manrope,sans-serif;font-size:17.5px;font-weight:800;letter-spacing:-.025em;color:var(--portal-ink);line-height:1.15}
.portal-municipality-sub{font-size:12px;color:var(--portal-muted);line-height:1.2}
.portal-drawer .portal-welcome{text-align:left;margin-bottom:22px}
.portal-drawer .portal-welcome h2{font-family:Manrope,sans-serif;font-size:30px;font-weight:800;letter-spacing:-.03em;color:var(--portal-ink);margin:0 0 8px;line-height:1.2;max-width:none}
.portal-drawer .portal-welcome p{font-size:14.5px;line-height:1.6;color:var(--portal-muted);margin:0;max-width:none}
.portal-drawer .portal-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;background:var(--portal-ground);border-radius:12px;border:1px solid color-mix(in srgb,var(--portal-line) 70%,transparent);margin-bottom:22px}
.portal-drawer .portal-tabs button{border:0;background:transparent;border-radius:8px;padding:9px 12px;font-family:Manrope,sans-serif;font-size:13px;font-weight:750;letter-spacing:-.01em;color:var(--portal-muted);cursor:pointer;transition:all .2s ease;min-height:38px}
.portal-drawer .portal-tabs button:hover{color:var(--portal-ink)}
.portal-drawer .portal-tabs button.is-active{background:var(--portal-paper);color:var(--portal-ink);box-shadow:0 2px 8px rgba(0,0,0,.08);border-bottom:0}
html.dark .portal-drawer .portal-tabs button.is-active{box-shadow:0 2px 8px rgba(0,0,0,.35)}

.sq-portal .portal-drawer .sq-auth-form{display:flex;flex-direction:column;gap:18px}
.sq-portal .portal-drawer .sq-mac-field{display:flex;flex-direction:column;gap:6px;width:100%}
.sq-portal .portal-drawer .sq-mac-label-row{display:flex;justify-content:space-between;align-items:center;width:100%;gap:10px}
.sq-portal .portal-drawer .sq-mac-label{font-family:Manrope,sans-serif;font-size:13px;font-weight:750;letter-spacing:-.01em;color:var(--portal-ink)}
.sq-portal .portal-drawer .sq-mac-forgot-link{border:0!important;background:none!important;padding:0!important;color:var(--portal-accent);font-size:12px;font-weight:700;cursor:pointer;text-decoration:none;box-shadow:none!important;outline:none}
.sq-portal .portal-drawer .sq-mac-forgot-link:hover{text-decoration:underline;text-underline-offset:3px}

.sq-portal .portal-drawer .sq-mac-input-wrap{position:relative;display:flex;align-items:center;width:100%}
.sq-portal .portal-drawer .sq-mac-input-icon{position:absolute;left:15px;top:50%;transform:translateY(-50%);font-size:19px;color:var(--portal-muted);pointer-events:none;transition:color .2s;z-index:1}
.sq-portal .portal-drawer .sq-mac-input{width:100%;height:48px;background:var(--portal-paper);border:1.5px solid var(--portal-line);border-radius:12px;font-family:inherit;font-size:14px;font-weight:500;padding:0 46px 0 44px;color:var(--portal-ink);box-shadow:none;outline:none;transition:border-color .2s,box-shadow .2s;caret-color:var(--portal-accent);margin:0}
.sq-portal .portal-drawer .sq-mac-input::placeholder{color:var(--portal-muted);opacity:.7}
.sq-portal .portal-drawer .sq-mac-input:hover{border-color:color-mix(in srgb,var(--portal-accent) 40%,transparent)}
.sq-portal .portal-drawer .sq-mac-input:focus{border-color:var(--portal-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--portal-accent) 18%,transparent)}
.sq-portal .portal-drawer .sq-mac-input-wrap:focus-within .sq-mac-input-icon{color:var(--portal-accent)}

.sq-portal .portal-drawer .sq-mac-input:-webkit-autofill,
.sq-portal .portal-drawer .sq-mac-input:-webkit-autofill:hover,
.sq-portal .portal-drawer .sq-mac-input:-webkit-autofill:focus{
    -webkit-box-shadow:0 0 0px 1000px var(--portal-paper) inset!important;
    -webkit-text-fill-color:var(--portal-ink)!important;
    border-color:var(--portal-line)!important;
    transition:background-color 5000s ease-in-out 0s;
}

html.dark .portal-drawer .sq-mac-input{
    background:#0d1322!important;
    border:1px solid rgba(255,255,255,.09)!important;
    color:var(--portal-ink)!important;
}
html.dark .portal-drawer .sq-mac-input:hover{
    border-color:rgba(255,255,255,.16)!important;
    background:#0f1728!important;
}
html.dark .portal-drawer .sq-mac-input:focus{
    border-color:var(--portal-accent)!important;
    background:#10192c!important;
    box-shadow:0 0 0 3px color-mix(in srgb,var(--portal-accent) 20%,transparent)!important;
}
html.dark .portal-drawer .sq-mac-input-wrap:focus-within .sq-mac-input-icon{
    color:var(--portal-accent)!important;
}
html.dark .portal-drawer .sq-mac-input:-webkit-autofill,
html.dark .portal-drawer .sq-mac-input:-webkit-autofill:hover,
html.dark .portal-drawer .sq-mac-input:-webkit-autofill:focus{
    -webkit-box-shadow:0 0 0px 1000px #0d1322 inset!important;
    -webkit-text-fill-color:#f1f5f9!important;
    border-color:rgba(255,255,255,.1)!important;
}

.sq-portal .portal-drawer .sq-mac-eye-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);height:34px;width:34px;border:0;background:transparent;border-radius:8px;display:grid;place-items:center;color:var(--portal-muted);font-size:19px;cursor:pointer;transition:all .2s;z-index:2}
.sq-portal .portal-drawer .sq-mac-eye-btn:hover{background:var(--portal-ground);color:var(--portal-ink)}

.sq-portal .portal-drawer .sq-mac-btn-primary{height:50px;width:100%;border-radius:12px;background:linear-gradient(135deg,var(--portal-accent) 0%,var(--sq-brand-dark,color-mix(in srgb,var(--portal-accent) 80%,#000)) 100%);color:#ffffff;border:1px solid rgba(255,255,255,.14);font-family:Manrope,sans-serif;font-size:14.5px;font-weight:800;letter-spacing:-.015em;display:inline-flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;box-shadow:0 6px 20px -4px color-mix(in srgb,var(--portal-accent) 45%,transparent),inset 0 1px 0 rgba(255,255,255,.2);transition:all .25s ease;margin-top:6px}
.sq-portal .portal-drawer .sq-mac-btn-primary:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--portal-accent) 88%,#fff) 0%,var(--portal-accent) 100%);color:#ffffff!important;transform:translateY(-1px);box-shadow:0 10px 24px -4px color-mix(in srgb,var(--portal-accent) 50%,transparent)}
.sq-portal .portal-drawer .sq-mac-btn-primary i{font-size:20px;transition:transform .2s}
.sq-portal .portal-drawer .sq-mac-btn-primary:hover i{transform:translateX(3px)}
html.dark .portal-drawer .sq-mac-btn-primary{background:linear-gradient(135deg,var(--portal-accent) 0%,color-mix(in srgb,var(--portal-accent) 80%,#000) 100%);color:#ffffff;border:1px solid rgba(255,255,255,.14);box-shadow:0 8px 22px -4px color-mix(in srgb,var(--portal-accent) 45%,transparent),inset 0 1px 0 rgba(255,255,255,.2)}
html.dark .portal-drawer .sq-mac-btn-primary:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--portal-accent) 88%,#fff) 0%,var(--portal-accent) 100%);color:#ffffff!important;box-shadow:0 10px 26px -4px color-mix(in srgb,var(--portal-accent) 55%,transparent)}

.sq-portal .portal-drawer .sq-mac-check-row{margin-top:2px;margin-bottom:2px}
.sq-remember-card{position:relative;display:flex;align-items:center;gap:12px;width:100%;padding:10px 14px;border-radius:12px;background:color-mix(in srgb,var(--portal-ground) 65%,transparent);border:1px solid color-mix(in srgb,var(--portal-line) 75%,transparent);cursor:pointer;user-select:none;transition:all .22s cubic-bezier(.16,1,.3,1)}
.sq-remember-card:hover{background:var(--portal-ground);border-color:color-mix(in srgb,var(--portal-accent) 40%,transparent);transform:translateY(-1px);box-shadow:0 4px 14px -3px var(--portal-shadow)}
.sq-remember-card:has(.sq-remember-input:focus-visible){border-color:var(--portal-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--portal-accent) 22%,transparent)}
.sq-remember-card:has(.sq-remember-input:checked){background:color-mix(in srgb,var(--portal-accent) 8%,var(--portal-paper));border-color:color-mix(in srgb,var(--portal-accent) 35%,transparent)}
html.dark .sq-remember-card{background:color-mix(in srgb,var(--portal-ground) 80%,transparent);border-color:var(--portal-line)}
html.dark .sq-remember-card:hover{background:var(--portal-ground);border-color:color-mix(in srgb,var(--portal-accent) 45%,transparent)}
html.dark .sq-remember-card:has(.sq-remember-input:checked){background:color-mix(in srgb,var(--portal-accent) 12%,var(--portal-paper));border-color:color-mix(in srgb,var(--portal-accent) 50%,transparent)}

.sq-remember-input{position:absolute;opacity:0;pointer-events:none;width:0;height:0;margin:0}

.sq-remember-box{position:relative;width:20px;height:20px;flex-shrink:0;border-radius:6px;border:1.5px solid var(--portal-line);background:var(--portal-paper);display:grid;place-items:center;transition:all .2s cubic-bezier(.16,1,.3,1)}
.sq-remember-card:hover .sq-remember-box{border-color:var(--portal-accent)}
.sq-remember-card:has(.sq-remember-input:checked) .sq-remember-box{background:var(--portal-accent);border-color:var(--portal-accent);box-shadow:0 2px 8px color-mix(in srgb,var(--portal-accent) 35%,transparent)}
html.dark .sq-remember-box{background:var(--portal-paper);border-color:var(--portal-line)}
html.dark .sq-remember-card:has(.sq-remember-input:checked) .sq-remember-box{background:var(--portal-accent);border-color:var(--portal-accent)}

.sq-remember-check{width:12px;height:12px;color:#ffffff;transform:scale(.3) rotate(-8deg);opacity:0;transition:all .22s cubic-bezier(.16,1,.3,1)}
html.dark .sq-remember-check{color:#ffffff!important}
.sq-remember-card:has(.sq-remember-input:checked) .sq-remember-check{transform:scale(1) rotate(0);opacity:1}

.sq-remember-content{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.sq-remember-title{font-family:Manrope,sans-serif;font-size:13.5px;font-weight:750;letter-spacing:-.01em;color:var(--portal-ink);line-height:1.2;transition:color .2s}
.sq-remember-sub{font-size:11.5px;color:var(--portal-muted);line-height:1.2}

.sq-remember-badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;color:var(--portal-muted);padding:3px 8px;border-radius:6px;background:color-mix(in srgb,var(--portal-line) 40%,transparent);border:1px solid color-mix(in srgb,var(--portal-line) 60%,transparent);flex-shrink:0;transition:all .2s ease}
.sq-remember-badge i{font-size:13px;color:var(--portal-accent)}
.sq-remember-card:has(.sq-remember-input:checked) .sq-remember-badge{background:color-mix(in srgb,var(--portal-accent) 12%,transparent);border-color:color-mix(in srgb,var(--portal-accent) 25%,transparent);color:var(--portal-accent)}
.sq-portal .portal-drawer .sq-mac-forgot-link{font-size:12.5px}
.portal-drawer .portal-access-note{margin:24px 0 0;font-size:12.5px}
@keyframes portal-drawer-enter{from{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes portal-drawer-exit{to{transform:translateX(100%)}}
@media(min-width:1600px){.portal-hero{height:100svh;min-height:100svh;padding-top:clamp(110px,15vh,150px)}.portal-hero h1{font-size:84px}}
@media(max-width:1050px){.portal-bar-caption,.portal-nav-link{display:none}.portal-modules{width:calc(100% - 64px)}.portal-module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.portal-module-featured{grid-column:span 2}.portal-module-report{grid-column:span 2}.portal-section-heading{gap:32px}.portal-section-heading p{max-width:330px}.portal-footer-inner{width:calc(100% - 48px)}}
@media(max-width:760px){.portal-bar{width:calc(100% - 24px);top:10px;margin:0 auto;padding:10px 12px;gap:10px}.portal-bar-actions{gap:6px}.portal-brand{font-size:17px}.portal-brand svg{width:30px!important;height:30px!important}.portal-bar-sep{display:none}.portal-login-trigger{height:38px;padding:3px 4px 3px 12px;font-size:12px;border-radius:10px;gap:8px}.portal-login-icon{width:28px;height:28px;font-size:15px;border-radius:7px}.portal-theme{width:38px;height:38px;border-radius:10px;font-size:17px;flex-shrink:0}.portal-hero{padding:26px 16px 20px;min-height:calc(100svh - 80px)}.portal-hero-mark{margin-bottom:22px;height:65px}.portal-hero-mark svg{width:60px!important;height:60px!important}.portal-hero h1{font-size:clamp(36px,7.5vw,54px);line-height:1.12;letter-spacing:-.035em}.portal-hero .portal-intro{font-size:16px;line-height:1.65;margin:18px 0 24px;max-width:470px}.portal-hero .portal-intro br{display:none}.portal-hero-actions{flex-direction:column;gap:20px;width:100%;max-width:350px}.portal-hero-actions .portal-cta{width:100%}.portal-hero-foot{padding-top:16px;width:100%}.portal-pipeline-dock{flex-direction:column;gap:10px;padding:10px 8px;width:100%;max-width:390px;box-sizing:border-box}.portal-pipeline-steps{width:100%;justify-content:space-between;gap:2px}.portal-pipeline-step{padding:3px 4px;gap:5px}.portal-pipeline-icon{width:24px;height:24px;font-size:13px}.portal-pipeline-title{font-size:11.5px}.portal-pipeline-sub{display:none}.portal-pipeline-line{width:10px}.portal-pipeline-arrow{display:none}.portal-pipeline-divider{width:100%;height:1px;margin:2px 0}.portal-pipeline-action{width:100%;justify-content:center;padding:8px 12px;box-sizing:border-box}.portal-modules{width:calc(100% - 40px);padding-top:76px;scroll-margin-top:0}.portal-section-heading{display:block;margin-bottom:28px}.portal-section-heading h2{font-size:34px}.portal-section-heading p{font-size:15px;max-width:none;margin-top:20px}.portal-module-grid{grid-template-columns:minmax(0,1fr);gap:16px}.portal-module,.portal-module-featured,.portal-module-report{grid-column:auto;padding:26px}.portal-module-featured h3{font-size:26px}.portal-module-icon{margin-bottom:22px}.portal-record-flow{gap:12px;flex-wrap:wrap;font-size:12px}.portal-bottom-cta{flex-direction:column;align-items:stretch;padding:32px 24px;border-radius:20px;margin-top:44px;margin-bottom:12px;gap:26px}.portal-bottom-cta h2{font-size:24px;margin-bottom:8px}.portal-bottom-cta p{font-size:14.5px;line-height:1.6;margin-bottom:16px}.portal-bottom-tags{gap:10px}.portal-bottom-action-col{align-items:stretch;width:100%;gap:10px}.portal-bottom-btn{width:100%;justify-content:center;height:50px;padding:6px 6px 6px 18px;font-size:14px}.portal-bottom-btn-icon{width:36px;height:36px;font-size:19px}.portal-bottom-notice{text-align:center}.sq-portal .portal-footer{margin-top:28px;padding:18px 0 max(18px,env(safe-area-inset-bottom))}.portal-footer-inner{width:calc(100% - 32px);flex-direction:column;align-items:center;text-align:center;gap:12px}.portal-footer-start{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}.portal-footer-sep{display:inline-block}.portal-footer-nav{width:100%;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}.portal-footer-link{padding:4px 0;font-size:12.5px}.sq-portal .portal-drawer{border-radius:0;width:100%}.sq-portal .portal-drawer .portal-access-inner{padding:14px 22px 36px}.portal-drawer-toolbar{padding:12px 18px 4px}.portal-municipality-logo{height:40px;max-width:125px}.portal-drawer .portal-welcome h2{font-size:26px}.portal-drawer .portal-tabs{gap:20px}}
@media(max-width:380px){.portal-brand{font-size:15px;gap:5px}.portal-brand svg{width:26px!important;height:26px!important}.portal-login-trigger{height:36px;padding:2px 3px 2px 10px;font-size:11.5px}.portal-login-icon{width:26px;height:26px;font-size:14px}.portal-theme{width:36px;height:36px;border-radius:9px}.portal-bar-actions{gap:5px}.portal-hero{padding-left:18px;padding-right:18px}.portal-hero h1{font-size:34px}.portal-pipeline-dock{padding:10px 8px}.portal-pipeline-step{padding:2px 4px;gap:5px}.portal-pipeline-icon{width:24px;height:24px;font-size:12px}.portal-pipeline-title{font-size:11px}.portal-pipeline-line{width:10px}.sq-portal .portal-drawer .portal-access-inner{padding:12px 18px 28px}.portal-drawer .portal-tabs{gap:18px}.portal-drawer .portal-welcome h2{font-size:24px}.portal-municipality-logo{height:34px;max-width:100px}.portal-bottom-cta{padding:26px 18px}.portal-bottom-cta h2{font-size:21px}.portal-bottom-tags span{font-size:11.5px}}
@media(prefers-reduced-motion:reduce){.portal-drawer[open],.portal-drawer[open].is-closing,.portal-pipeline-pulse,.portal-pipeline-action-icon i{animation:none!important}}

/* ==========================================================================
   Panel de acceso: version minimalista.
   - Sin pestañas: "¿Olvidaste tu contraseña?" lleva a recuperar y
     "Volver a iniciar sesión" regresa.
   - "Recordar" es una casilla simple, sin tarjeta ni etiqueta.
   - Oscuro: grafito neutro al estilo macOS. Antes mezclaba el color del
     municipio con azul marino y los campos eran azul marino fijo, lo que
     chocaba con acentos calidos (naranja). El acento queda solo en el boton,
     el enlace, la casilla y el foco.
   ========================================================================== */
.portal-drawer .portal-welcome { margin-bottom: 26px; }

/* Recordar sesion: casilla simple */
.sq-portal .portal-drawer .sq-remember-card,
.sq-portal .portal-drawer .sq-remember-card:hover,
html.dark .sq-portal .portal-drawer .sq-remember-card,
html.dark .sq-portal .portal-drawer .sq-remember-card:hover,
.sq-portal .portal-drawer .sq-remember-card:has(.sq-remember-input:checked),
html.dark .sq-portal .portal-drawer .sq-remember-card:has(.sq-remember-input:checked) {
    padding: 2px 0; gap: 10px;
    background: transparent; border: 0; border-radius: 0;
    box-shadow: none; transform: none;
}
.sq-portal .portal-drawer .sq-remember-card:has(.sq-remember-input:focus-visible) .sq-remember-box {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--portal-accent) 25%, transparent);
}
.sq-portal .portal-drawer .sq-remember-box { width: 18px; height: 18px; border-radius: 5px; }
.sq-portal .portal-drawer .sq-remember-card:has(.sq-remember-input:checked) .sq-remember-box { box-shadow: none; }
.sq-portal .portal-drawer .sq-remember-title {
    font-family: inherit; font-size: 13px; font-weight: 500; letter-spacing: 0; color: var(--portal-muted);
}
.sq-portal .portal-drawer .sq-remember-card:hover .sq-remember-title { color: var(--portal-ink); }

/* Volver a iniciar sesion */
.sq-portal .portal-drawer .portal-volver {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    align-self: center; margin-top: 2px;
    color: var(--portal-muted) !important; font-weight: 600;
}
.sq-portal .portal-drawer .portal-volver:hover { color: var(--portal-ink) !important; text-decoration: none !important; }
.sq-portal .portal-drawer .portal-volver i { font-size: 17px; }

/* Boton principal: color solido del municipio, sombra neutra (sin resplandor) */
.sq-portal .portal-drawer .sq-mac-btn-primary,
html.dark body.sq-portal .portal-drawer .sq-mac-btn-primary {
    background: var(--portal-accent);
    border: 0;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 1px 2px rgba(0, 0, 0, 0.2), 0 4px 12px -4px rgba(0, 0, 0, 0.25);
}
.sq-portal .portal-drawer .sq-mac-btn-primary:hover,
html.dark body.sq-portal .portal-drawer .sq-mac-btn-primary:hover {
    background: color-mix(in srgb, var(--portal-accent) 90%, #fff);
    transform: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.2), 0 6px 16px -4px rgba(0, 0, 0, 0.3);
}
.sq-portal .portal-drawer .sq-mac-btn-primary:active { transform: scale(.99); }

/* Oscuro: grafito neutro */
html.dark body.sq-portal .portal-drawer {
    --portal-paper: #1c1c1f;
    --portal-ground: #141416;
    --portal-ink: #f5f5f7;
    --portal-muted: #a1a1a6;
    --portal-line: rgba(255, 255, 255, 0.1);
    background: #1c1c1f;
    box-shadow: -1px 0 0 rgba(255, 255, 255, 0.06), -24px 0 80px rgba(0, 0, 0, 0.5);
}
html.dark body.sq-portal .portal-drawer .portal-drawer-toolbar { background: #1c1c1f; }
html.dark body.sq-portal .portal-drawer .portal-drawer-close,
html.dark body.sq-portal .portal-drawer .portal-drawer-theme { background: rgba(255, 255, 255, 0.06); color: #f5f5f7; }
html.dark body.sq-portal .portal-drawer .portal-drawer-close:hover,
html.dark body.sq-portal .portal-drawer .portal-drawer-theme:hover { background: rgba(255, 255, 255, 0.1); }
html.dark body.sq-portal .portal-drawer .sq-mac-input {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #f5f5f7 !important;
}
html.dark body.sq-portal .portal-drawer .sq-mac-input:hover {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
}
html.dark body.sq-portal .portal-drawer .sq-mac-input:focus {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: var(--portal-accent) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--portal-accent) 22%, transparent) !important;
}
html.dark body.sq-portal .portal-drawer .sq-mac-input::placeholder { color: #8e8e93; opacity: 1; }
html.dark body.sq-portal .portal-drawer .sq-mac-input:-webkit-autofill,
html.dark body.sq-portal .portal-drawer .sq-mac-input:-webkit-autofill:hover,
html.dark body.sq-portal .portal-drawer .sq-mac-input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #29292c inset !important;
    -webkit-text-fill-color: #f5f5f7 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}
html.dark body.sq-portal .portal-drawer .sq-mac-eye-btn:hover { background: rgba(255, 255, 255, 0.08); }
html.dark body.sq-portal .portal-drawer .sq-remember-box { background: rgba(255, 255, 255, 0.05); border-color: rgba(255, 255, 255, 0.22); }
html.dark body.sq-portal .portal-drawer .portal-municipality { border-color: rgba(255, 255, 255, 0.08); }
html.dark .portal-drawer::backdrop { background: rgba(0, 0, 0, 0.5); }

/* Escritorio: entrada con resorte, fondo que se difumina y contenido en
   cascada, una sola vez al abrir. En celular se queda la entrada simple. */
@media (min-width: 761px) and (prefers-reduced-motion: no-preference) {
    .portal-drawer[open] { animation: portal-drawer-in .5s cubic-bezier(.22, 1, .36, 1); }
    .portal-drawer[open].is-closing { animation: portal-drawer-out .22s cubic-bezier(.4, 0, 1, 1) forwards; }
    .portal-drawer[open]::backdrop { animation: portal-backdrop-in .35s ease-out; }
    .portal-drawer[open].is-closing::backdrop { animation: portal-backdrop-out .22s ease-in forwards; }

    .portal-drawer[open]:not(.is-closing) .portal-municipality,
    .portal-drawer[open]:not(.is-closing) .portal-welcome,
    .portal-drawer[open]:not(.is-closing) .sq-auth-view:not([hidden]) .sq-auth-form > *,
    .portal-drawer[open]:not(.is-closing) .portal-access-note {
        animation: portal-contenido-in .45s cubic-bezier(.22, 1, .36, 1) both;
    }
    .portal-drawer[open] .portal-municipality { animation-delay: .08s !important; }
    .portal-drawer[open] .portal-welcome { animation-delay: .12s !important; }
    .portal-drawer[open] .sq-auth-form > :nth-child(2) { animation-delay: .16s !important; }
    .portal-drawer[open] .sq-auth-form > :nth-child(3) { animation-delay: .2s !important; }
    .portal-drawer[open] .sq-auth-form > :nth-child(4) { animation-delay: .24s !important; }
    .portal-drawer[open] .sq-auth-form > :nth-child(5) { animation-delay: .28s !important; }
    .portal-drawer[open] .sq-auth-form > :nth-child(n+6) { animation-delay: .32s !important; }
    .portal-drawer[open] .portal-access-note { animation-delay: .34s !important; }
}
@keyframes portal-drawer-in {
    from { transform: translateX(104%); box-shadow: none; }
    to { transform: translateX(0); }
}
@keyframes portal-drawer-out { to { transform: translateX(104%); } }
@keyframes portal-backdrop-in {
    from { background: rgba(0, 0, 0, 0); backdrop-filter: blur(0); -webkit-backdrop-filter: blur(0); }
}
@keyframes portal-backdrop-out {
    to { background: rgba(0, 0, 0, 0); backdrop-filter: blur(0); -webkit-backdrop-filter: blur(0); }
}
@keyframes portal-contenido-in {
    from { opacity: 0; transform: translateX(14px); }
    to { opacity: 1; transform: none; }
}
/* Oscuro: el acento del municipio puede ser oscuro (naranja, guinda); en texto
   pequeño se aclara para que se lea sobre el grafito. */
html.dark body.sq-portal .portal-drawer .sq-mac-forgot-link:not(.portal-volver) { color: color-mix(in srgb, var(--portal-accent) 65%, #fff); }

/* ==========================================================================
   Portal en oscuro: grafito neutro de macOS. Antes el fondo mezclaba el color
   del municipio con azul marino y con acentos calidos (naranja) quedaba cafe.
   ========================================================================== */
html.dark body.sq-portal {
    --portal-ground: #121214;
    --portal-paper: #1c1c1e;
    --portal-ink: #e5e5ea;
    --portal-ink-strong: #f2f2f7;
    --portal-muted: #98989d;
    --portal-line: rgba(255, 255, 255, 0.08);
    --portal-glass: rgba(28, 28, 30, 0.72);
}
html.dark .portal-atmosphere {
    background:
        radial-gradient(ellipse 70% 60% at 4% 88%, color-mix(in srgb, var(--sq-brand) 9%, transparent), transparent 65%),
        radial-gradient(ellipse 60% 50% at 92% 10%, color-mix(in srgb, var(--sq-brand) 6%, transparent), transparent 65%);
}

/* ==========================================================================
   Panel de acceso: hoja de vidrio al estilo macOS, contenido centrado.
   ========================================================================== */
.sq-portal .portal-drawer {
    display: flex; flex-direction: column;
    background: rgba(255, 255, 255, 0.8);
    -webkit-backdrop-filter: blur(40px) saturate(180%);
    backdrop-filter: blur(40px) saturate(180%);
}
html.dark body.sq-portal .portal-drawer {
    --portal-paper: #1c1c1e;
    --portal-ground: #121214;
    --portal-ink: #e5e5ea;
    --portal-muted: #98989d;
    --portal-line: rgba(255, 255, 255, 0.08);
    background: rgba(30, 30, 32, 0.74);
    color: var(--portal-ink);
    box-shadow: inset 0 0.5px 0 rgba(255, 255, 255, 0.1), 0 0 0 0.5px rgba(0, 0, 0, 0.6), -24px 0 80px rgba(0, 0, 0, 0.45);
}
.portal-drawer:not([open]) { display: none !important; }

/* La pagina detras se difumina, como una hoja de macOS. */
.portal-drawer::backdrop {
    background: rgba(20, 22, 28, 0.28);
    -webkit-backdrop-filter: blur(10px) saturate(120%);
    backdrop-filter: blur(10px) saturate(120%);
}
html.dark .portal-drawer::backdrop { background: rgba(0, 0, 0, 0.42); }

.portal-drawer-toolbar,
html.dark body.sq-portal .portal-drawer .portal-drawer-toolbar { background: transparent; flex-shrink: 0; }

/* Columna centrada vertical y horizontalmente. */
.sq-portal .portal-drawer .portal-access-inner {
    flex: 1 1 auto;
    display: flex; flex-direction: column; justify-content: center;
    width: 100%; max-width: 380px; margin: 0 auto;
    padding: 8px 0 56px;
}
.portal-drawer .portal-municipality {
    justify-content: center; gap: 16px;
    padding-bottom: 22px; margin-bottom: 26px;
}
.portal-drawer .portal-welcome { text-align: center; margin-bottom: 28px; }
.portal-drawer .portal-welcome h2 { font-size: 26px; letter-spacing: -.025em; margin-bottom: 6px; }
.portal-drawer .portal-welcome p { font-size: 14px; }
.sq-portal .portal-drawer .sq-auth-form { gap: 16px; }
.sq-portal .portal-drawer .sq-mac-check-row { margin: 0; }
.portal-drawer .portal-access-note { margin-top: 22px; }

/* Textos y controles en oscuro: menos blanco, mas jerarquia por tono. */
html.dark body.sq-portal .portal-drawer .portal-welcome h2 { color: #ececf0; }
html.dark body.sq-portal .portal-drawer .portal-welcome p,
html.dark body.sq-portal .portal-drawer .portal-access-note,
html.dark body.sq-portal .portal-drawer .sq-remember-title { color: #98989d; }
html.dark body.sq-portal .portal-drawer .sq-mac-label { color: #c7c7cc; font-weight: 650; }
html.dark body.sq-portal .portal-drawer .portal-municipality-name { color: #d1d1d6; }
html.dark body.sq-portal .portal-drawer .portal-municipality { border-color: rgba(255, 255, 255, 0.07); }
html.dark body.sq-portal .portal-drawer .sq-mac-input {
    background: rgba(255, 255, 255, 0.045) !important;
    border: 1px solid rgba(255, 255, 255, 0.07) !important;
    color: #e5e5ea !important;
}
html.dark body.sq-portal .portal-drawer .sq-mac-input:hover {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}
html.dark body.sq-portal .portal-drawer .sq-mac-input:focus {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: color-mix(in srgb, var(--portal-accent) 80%, #fff) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--portal-accent) 24%, transparent) !important;
}
html.dark body.sq-portal .portal-drawer .sq-mac-input::placeholder { color: #6e6e73; }
html.dark body.sq-portal .portal-drawer .sq-mac-input-icon,
html.dark body.sq-portal .portal-drawer .sq-mac-eye-btn { color: #8e8e93; }
html.dark body.sq-portal .portal-drawer .sq-mac-input:-webkit-autofill,
html.dark body.sq-portal .portal-drawer .sq-mac-input:-webkit-autofill:hover,
html.dark body.sq-portal .portal-drawer .sq-mac-input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #2a2a2d inset !important;
    -webkit-text-fill-color: #e5e5ea !important;
}
html.dark body.sq-portal .portal-drawer .sq-remember-box { background: rgba(255, 255, 255, 0.04); border-color: rgba(255, 255, 255, 0.18); }
html.dark body.sq-portal .portal-drawer .portal-drawer-close,
html.dark body.sq-portal .portal-drawer .portal-drawer-theme { background: rgba(255, 255, 255, 0.06); color: #c7c7cc; }

/* Escritorio: hoja flotante separada del borde, con esquinas redondeadas. */
@media (min-width: 761px) {
    .sq-portal .portal-drawer {
        inset: 12px 12px 12px auto;
        width: min(460px, calc(100% - 24px));
        height: calc(100dvh - 24px); max-height: calc(100dvh - 24px);
        border-radius: 20px;
        box-shadow: inset 0 0.5px 0 rgba(255, 255, 255, 0.9), 0 0 0 0.5px rgba(0, 0, 0, 0.12), 0 24px 60px -12px rgba(15, 23, 42, 0.3);
    }
    html.dark body.sq-portal .portal-drawer {
        box-shadow: inset 0 0.5px 0 rgba(255, 255, 255, 0.1), 0 0 0 0.5px rgba(0, 0, 0, 0.7), 0 24px 70px -12px rgba(0, 0, 0, 0.7);
    }
}
@media (max-width: 760px) {
    .sq-portal .portal-drawer .portal-access-inner { padding: 8px 22px 36px; max-width: none; }
}
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .sq-portal .portal-drawer { background: #fff; }
    html.dark body.sq-portal .portal-drawer { background: #1c1c1e; }
}
/* Piezas del portal con azul marino fijo: al grafito en oscuro. */
html.dark .portal-bar { background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)), rgba(28,28,30,.78); }
html.dark .portal-pipeline-dock { background: rgba(28,28,30,.78); }
html.dark .sq-portal .portal-footer { background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01)), rgba(18,18,20,.6); }

/* Oscuro: bordes que no saturen la vista, incluido el autocompletado del
   navegador (con usuario y contrasena guardados los campos se veian con un
   borde casi blanco). */
html.dark body.sq-portal .portal-drawer .sq-mac-input:-webkit-autofill,
html.dark body.sq-portal .portal-drawer .sq-mac-input:-webkit-autofill:hover,
html.dark body.sq-portal .portal-drawer .sq-mac-input:-webkit-autofill:focus,
html.dark body.sq-portal .portal-drawer .sq-mac-input:autofill {
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    -webkit-box-shadow: 0 0 0 1000px #242427 inset !important;
    box-shadow: 0 0 0 1000px #242427 inset !important;
    -webkit-text-fill-color: #e5e5ea !important;
    caret-color: #e5e5ea;
}
html.dark body.sq-portal .portal-drawer .sq-mac-input:-webkit-autofill:focus {
    border-color: color-mix(in srgb, var(--portal-accent) 70%, #fff) !important;
}
html.dark body.sq-portal .portal-drawer .sq-mac-input { border-color: rgba(255, 255, 255, 0.06) !important; }
html.dark body.sq-portal .portal-drawer .sq-mac-input:hover { border-color: rgba(255, 255, 255, 0.1) !important; }
html.dark body.sq-portal .portal-drawer .portal-municipality { border-color: rgba(255, 255, 255, 0.05); }
html.dark body.sq-portal .portal-drawer .portal-municipality-divider { background: rgba(255, 255, 255, 0.08); }
html.dark body.sq-portal .portal-drawer .sq-remember-box { border-color: rgba(255, 255, 255, 0.14); }

/* Vidrio simulado: manchas de color muy difuminadas sobre el material, como
   un fondo de pantalla visto a traves del vidrio. Se nota aunque detras no
   haya nada que desenfocar (celular a pantalla completa, portal oscuro). */
.sq-portal .portal-drawer {
    background:
        radial-gradient(70% 45% at 10% 0%, color-mix(in srgb, var(--portal-accent) 12%, transparent), transparent 70%),
        radial-gradient(60% 40% at 100% 100%, rgba(120, 140, 190, 0.14), transparent 70%),
        radial-gradient(45% 30% at 100% 35%, rgba(255, 255, 255, 0.5), transparent 70%),
        rgba(250, 250, 252, 0.8);
}
html.dark body.sq-portal .portal-drawer {
    background:
        radial-gradient(70% 45% at 10% 0%, color-mix(in srgb, var(--portal-accent) 13%, transparent), transparent 70%),
        radial-gradient(60% 40% at 100% 100%, rgba(90, 110, 170, 0.14), transparent 70%),
        radial-gradient(45% 30% at 100% 35%, rgba(255, 255, 255, 0.035), transparent 70%),
        rgba(30, 30, 33, 0.8);
}
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    html.dark body.sq-portal .portal-drawer { background-color: #1e1e21; }
}

/* ==========================================================================
   Celular: franja de pasos del portal. Tres columnas iguales (icono arriba,
   nombre debajo) unidas por una via fina a la altura de los iconos; ya no se
   corta "Comprobacion". El enlace a los modulos queda como fila ligera.
   ========================================================================== */
@media (max-width: 760px) {
    .portal-hero-foot .portal-pipeline-dock {
        flex-direction: column; align-items: stretch; gap: 0;
        width: 100%; max-width: 380px; padding: 14px 12px 6px;
        border-radius: 18px;
    }
    .portal-hero-foot .portal-pipeline-steps {
        display: grid; grid-template-columns: 1fr minmax(14px, 28px) 1fr minmax(14px, 28px) 1fr;
        align-items: start; gap: 0; width: 100%;
    }
    .portal-hero-foot .portal-pipeline-step {
        display: flex; flex-direction: column; align-items: center; gap: 7px;
        min-width: 0; padding: 0; text-align: center;
    }
    .portal-hero-foot .portal-pipeline-icon {
        width: 34px; height: 34px; border-radius: 11px; font-size: 17px;
    }
    .portal-hero-foot .portal-pipeline-info { display: block; min-width: 0; }
    .portal-hero-foot .portal-pipeline-title {
        display: block; font-size: 12px; font-weight: 650; letter-spacing: -0.01em;
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .portal-hero-foot .portal-pipeline-sub { display: none; }
    .portal-hero-foot .portal-pipeline-connector {
        display: flex; align-items: center; justify-content: center;
        height: 34px; margin: 0 -6px;
    }
    .portal-hero-foot .portal-pipeline-line {
        display: block; width: 100%; height: 1px; border-radius: 1px;
        background: color-mix(in srgb, var(--portal-ink) 18%, transparent);
    }
    .portal-hero-foot .portal-pipeline-arrow { display: none; }
    .portal-hero-foot .portal-pipeline-divider {
        width: 100%; height: 1px; margin: 14px 0 6px;
        background: color-mix(in srgb, var(--portal-ink) 10%, transparent);
    }
    .portal-hero-foot .portal-pipeline-action {
        width: 100%; justify-content: center; gap: 10px;
        padding: 8px 12px; border: 0; border-radius: 12px;
        background: transparent; box-shadow: none;
        font-size: 13.5px; font-weight: 650;
    }
    .portal-hero-foot .portal-pipeline-action-icon { width: 28px; height: 28px; border-radius: 50%; font-size: 16px; }
    html.dark .portal-hero-foot .portal-pipeline-action { background: transparent; border: 0; }
    html.dark .portal-hero-foot .portal-pipeline-line { background: rgba(255, 255, 255, 0.14); }
    html.dark .portal-hero-foot .portal-pipeline-divider { background: rgba(255, 255, 255, 0.08); }
}

/* Celular: en los botones con flecha, el texto queda centrado y la flecha
   pegada al borde derecho (antes iba junto al texto, en el centro). */
@media (max-width: 760px) {
    .portal-bottom-btn,
    .portal-hero-foot .portal-pipeline-action {
        position: relative;
        justify-content: center;
        padding-left: 48px; padding-right: 48px;
    }
    .portal-bottom-btn .portal-bottom-btn-icon,
    .portal-hero-foot .portal-pipeline-action .portal-pipeline-action-icon {
        position: absolute; right: 7px; top: 50%; margin: 0;
        transform: translateY(-50%);
    }
    .portal-bottom-btn:hover .portal-bottom-btn-icon,
    .portal-hero-foot .portal-pipeline-action:hover .portal-pipeline-action-icon { transform: translateY(-50%); }
}

/* ==========================================================================
   Boton de acceso: la animacion cuenta lo que pasa.
   - Mouse encima: un destello de luz cruza una vez.
   - Verificando: el destello recorre el boton sin parar (progreso).
   - Acceso concedido: verde con palomita que aparece con rebote.
   - Credenciales incorrectas: el formulario se sacude (como macOS).
   ========================================================================== */
.sq-portal .portal-drawer .sq-mac-btn-primary {
    position: relative; overflow: hidden; isolation: isolate;
    transition: background-color .35s ease, box-shadow .2s ease, transform .15s ease;
}
.sq-portal .portal-drawer .sq-mac-btn-primary::after {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, 0.32) 50%, transparent 70%);
    transform: translateX(-120%);
    pointer-events: none;
}
.sq-portal .portal-drawer .sq-mac-btn-primary:hover:not(:disabled)::after { animation: portal-destello .85s cubic-bezier(.4, 0, .2, 1); }
.sq-portal .portal-drawer .sq-mac-btn-primary[aria-busy="true"]::after { animation: portal-destello 1.15s cubic-bezier(.4, 0, .2, 1) infinite; }
.sq-portal .portal-drawer .sq-mac-btn-primary[aria-busy="true"] { cursor: progress; opacity: 1; }
/* La flecha "entra" al pasar el mouse. */
.sq-portal .portal-drawer .sq-mac-btn-primary:hover:not(:disabled) i.bx-log-in-circle { animation: portal-entrar .5s cubic-bezier(.22, 1, .36, 1); transform: none; }

.sq-portal .portal-drawer .sq-mac-btn-primary.is-ok,
html.dark body.sq-portal .portal-drawer .sq-mac-btn-primary.is-ok { background: #28a745; opacity: 1; }
.sq-portal .portal-drawer .sq-mac-btn-primary.is-ok i { animation: portal-palomita .45s cubic-bezier(.34, 1.56, .64, 1); font-size: 22px; }

#form-login.is-sacudida { animation: portal-sacudida .5s cubic-bezier(.36, .07, .19, .97); }

@keyframes portal-destello { to { transform: translateX(120%); } }
@keyframes portal-entrar {
    0% { transform: translateX(0); }
    40% { transform: translateX(5px); opacity: .4; }
    41% { transform: translateX(-6px); }
    100% { transform: translateX(0); opacity: 1; }
}
@keyframes portal-palomita {
    from { transform: scale(0) rotate(-20deg); opacity: 0; }
    to { transform: scale(1) rotate(0); opacity: 1; }
}
@keyframes portal-sacudida {
    10%, 90% { transform: translateX(-2px); }
    20%, 80% { transform: translateX(5px); }
    30%, 50%, 70% { transform: translateX(-9px); }
    40%, 60% { transform: translateX(9px); }
}
@media (prefers-reduced-motion: reduce) {
    .sq-portal .portal-drawer .sq-mac-btn-primary::after,
    .sq-portal .portal-drawer .sq-mac-btn-primary i,
    #form-login.is-sacudida { animation: none !important; }
}