/* Prihlásenie pre klientov Alpinefy. Vzhľad podľa alpinefy.com (D4). */
@font-face{font-family:"Clash Display";src:url("fonts/clash-display-600.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Geist";src:url("fonts/geist.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Geist Mono";src:url("fonts/geist-mono.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Geist";src:url("fonts/geist-latin-ext.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C4}
@font-face{font-family:"Geist Mono";src:url("fonts/geist-mono-latin-ext.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C4}

:root{--bg:#090B0F;--text:#F3F5F8;--muted:#9CA3B0;--line:rgba(255,255,255,.09);--line2:rgba(255,255,255,.16);
  --aqua:#26CAFF;--mint:#47F7B7;--ink:#02141A;--bad:#FF8A7A;--grad:linear-gradient(100deg,var(--aqua) 0%,var(--mint) 100%)}
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{background:var(--bg);color:var(--text);font:16px/1.5 "Geist",system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;
  display:flex;justify-content:center;padding:max(28px,env(safe-area-inset-top)) 16px max(28px,env(safe-area-inset-bottom));position:relative;overflow-x:hidden}
body::before{content:"";position:fixed;inset:-30% -20% auto;height:70vh;background:radial-gradient(closest-side at 35% 50%,rgba(38,202,255,.16),transparent),radial-gradient(closest-side at 70% 40%,rgba(71,247,183,.10),transparent);pointer-events:none;z-index:-1}
button,input{font:inherit;color:inherit}
[hidden]{display:none!important}
.box{width:100%;max-width:420px;display:flex;flex-direction:column;min-height:calc(100dvh - 56px)}
.logo{display:flex;align-items:center;gap:10px;font-weight:600;font-size:19px;color:var(--text);text-decoration:none;letter-spacing:-.01em}
.logo-mark{width:34px;height:34px;border-radius:11px;background-image:var(--grad);display:grid;place-items:center;box-shadow:0 0 24px -4px rgba(38,202,255,.5),inset 0 1px 0 rgba(255,255,255,.55)}
.logo-mark svg{width:20px;height:20px;fill:var(--ink)}
.krok{margin:auto 0;padding:40px 0 24px}
.eyebrow{font-family:"Geist Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:8px}
.eyebrow i{width:6px;height:6px;border-radius:50%;background:var(--mint);box-shadow:0 0 10px var(--mint);display:block}
h1{font-family:"Clash Display","Geist",sans-serif;font-weight:600;font-size:clamp(2rem,8vw,2.6rem);line-height:1.06;letter-spacing:-.01em;margin:14px 0 12px;text-wrap:balance}
.muted{color:var(--muted)}
.muted b{color:var(--text);font-weight:600}
.field{display:block;margin-top:22px}
.field span{display:block;font-size:13px;color:var(--muted);margin-bottom:7px}
.input{width:100%;height:54px;border-radius:14px;border:1px solid var(--line2);background:rgba(255,255,255,.05);padding:0 16px;font-size:17px;outline:none;transition:border-color .15s,box-shadow .15s}
.input:focus{border-color:var(--mint);box-shadow:0 0 0 3px rgba(71,247,183,.15)}
.input.kod{font-family:"Geist Mono",ui-monospace,monospace;font-size:26px;letter-spacing:.3em;text-align:center}
.btn{width:100%;height:54px;margin-top:12px;border-radius:999px;border:1px solid var(--line2);background:rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;gap:10px;font-weight:600;font-size:16px;cursor:pointer;transition:transform .15s}
.btn:active{transform:scale(.98)}
.btn:disabled{opacity:.6;cursor:default}
.btn-p{border:0;background-image:var(--grad);color:var(--ink);box-shadow:0 10px 32px -10px rgba(38,202,255,.55),inset 0 1px 0 rgba(255,255,255,.5)}
.ic{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#passkey{margin-top:26px}
.alebo{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px;margin-top:22px}
.alebo::before,.alebo::after{content:"";flex:1;height:1px;background:var(--line)}
.alebo + form .field{margin-top:14px}
.link{background:none;border:0;color:var(--mint);font-weight:500;margin-top:18px;cursor:pointer;min-height:44px}
.chyba{color:var(--bad);font-size:14px;text-align:center;margin-top:-8px;margin-bottom:12px}
.spin{width:40px;height:40px;border-radius:50%;border:3px solid var(--line2);border-top-color:var(--mint);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.ok{width:56px;height:56px;border-radius:18px;background-image:var(--grad);display:grid;place-items:center}
.ok svg{width:28px;height:28px;fill:none;stroke:var(--ink);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.jazyky{display:flex;justify-content:center;gap:4px;padding-top:8px}
.jazyky a{font-family:"Geist Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-decoration:none;padding:10px 8px;border-radius:8px}
.jazyky a[aria-current]{color:var(--text)}
:focus-visible{outline:2px solid var(--mint);outline-offset:2px}
