/* login.css - stile della pagina di accesso di W2PP.
   Estratto il 2026-10-29 dal blocco <style> della pagina (regola 1.12): stesse regole,
   incluso nella stessa posizione, quindi l'ordine della cascata non cambia. */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:'Segoe UI',system-ui,-apple-system,sans-serif;background:#0a0e1f;color:#eaf0ff;overflow:hidden}
.wrap{position:relative;display:flex;height:100vh;width:100vw;background:
      radial-gradient(1800px 1100px at 52% 42%, rgba(56,84,220,.27), transparent 74%),
      radial-gradient(1400px 1000px at 40% 72%, rgba(120,60,220,.18), transparent 74%),
      linear-gradient(90deg,#070b1f 0%,#0a1030 18%,#0b1338 50%,#0c1642 100%)}
.wrap::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:url('/static/new/assets/worldmap_dots.png') center center / cover no-repeat;opacity:.09;mix-blend-mode:screen;}

/* Colonna scena */
.scene{order:2;flex:1 1 58%;transform:translateX(38px);position:relative;min-width:0;overflow:hidden;background:transparent}
.scene .grid{position:absolute;inset:0;opacity:.35;background-image:linear-gradient(rgba(80,120,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(80,120,255,.06) 1px,transparent 1px);background-size:46px 46px}
/* animazione nodi/flussi */
.node{position:absolute;transform:translate(-50%,-50%);text-align:center;z-index:3}
.node .box{width:66px;height:66px;border-radius:16px;margin:0 auto;background:linear-gradient(145deg,rgba(30,40,90,.9),rgba(18,24,58,.9));border:1px solid rgba(120,160,255,.35);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 20px rgba(0,0,0,.4),inset 0 0 14px rgba(80,130,255,.12);animation:nodePulse 3s ease-in-out infinite}
.node .box svg{width:30px;height:30px;stroke:#8fd0ff;fill:none;stroke-width:1.7}
.node .lbl{color:#a9b8ea;font-size:11px;font-weight:600;margin-top:8px;letter-spacing:.5px}
@keyframes nodePulse{0%,100%{box-shadow:0 6px 20px rgba(0,0,0,.4),inset 0 0 14px rgba(80,130,255,.12),0 0 0 rgba(79,125,255,0)}50%{box-shadow:0 6px 22px rgba(0,0,0,.4),inset 0 0 18px rgba(80,130,255,.2),0 0 26px rgba(79,125,255,.4)}}
.core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:4;animation:coreFloat 5s ease-in-out infinite}
.core svg{width:120px;height:120px;filter:drop-shadow(0 0 30px rgba(90,120,255,.7))}
@keyframes coreFloat{0%,100%{transform:translate(-50%,-52%)}50%{transform:translate(-50%,-48%)}}
svg.flows{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.path-base{fill:none;stroke:rgba(90,130,255,.25);stroke-width:2.5}
.path-glow{fill:none;stroke-width:3;stroke-linecap:round;stroke-dasharray:14 220;filter:drop-shadow(0 0 6px currentColor);animation:flowMove 2.6s linear infinite}
@keyframes flowMove{to{stroke-dashoffset:-234}}
.particles{position:absolute;inset:0;z-index:1;pointer-events:none}
.particles .p{position:absolute;width:3px;height:3px;border-radius:50%;background:#6fb0ff;box-shadow:0 0 8px 2px rgba(90,150,255,.7);animation:riseP linear infinite}
@keyframes riseP{from{transform:translateY(20px);opacity:0}10%{opacity:1}90%{opacity:1}to{transform:translateY(-120px);opacity:0}}
.scene::after{content:'';position:absolute;inset:0;background:none;pointer-events:none;z-index:5}
/* Colonna login */
.side{order:1;flex:0 0 42%;max-width:520px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:40px 46px;background:transparent;position:relative;z-index:2;transform:translateX(114px)}
.brand{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:6px;width:100%;max-width:392px}
.brand svg{width:44px;height:44px}
.brand .t{font-size:38px;font-weight:800;letter-spacing:1px;color:#ffffff}
.sub{font-size:15px;font-weight:700;color:#7c8cff;margin-bottom:14px;text-align:center;width:100%;max-width:392px}
.tag{font-size:13.5px;line-height:1.6;color:#aab4d4;text-align:center;margin-bottom:26px;width:100%;max-width:392px}
.tag b{color:#8aa2ff;font-weight:700}
.form{width:100%;max-width:392px;padding:34px 30px 30px;background:linear-gradient(180deg,rgba(20,26,48,.92),rgba(14,19,38,.92));border:1.5px solid #232b45;border-radius:18px;box-shadow:0 24px 60px rgba(0,0,0,.55),0 0 0 1px rgba(124,92,255,.06),inset 0 1px 0 rgba(255,255,255,.04);backdrop-filter:blur(6px);position:relative;animation:loginPulse 3.4s ease-in-out infinite}
.form::before{content:'';position:absolute;inset:-1px;border-radius:18px;padding:1px;background:linear-gradient(140deg,rgba(91,140,255,.45),rgba(124,92,255,.15) 40%,transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.form>label:first-child{margin-top:0}
label{display:block;font-size:13px;font-weight:600;color:#c7d0ea;margin:14px 0 7px}
.fld{position:relative}
.fld svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:17px;height:17px;stroke:#5a6b95}
input[type=text],input[type=password]{width:100%;background:#111629;border:1.5px solid #232b45;border-radius:11px;padding:13px 44px 13px 40px;font-size:14.5px;color:#eaf0ff;outline:none;transition:border .15s,box-shadow .15s}
input[type=text]:focus,input[type=password]:focus{border-color:#5b8cff;box-shadow:0 0 0 3px rgba(91,140,255,.18)}
input[type=text]:focus,input[type=password]:focus{border-color:#3b6fd4}
input::placeholder{color:#55618a}
.fld svg.eye{left:auto;right:12px;cursor:pointer;stroke:#5a6b95;width:18px;height:18px}
.fld svg.eye:hover{stroke:#8aa2ff}
.row{display:flex;align-items:center;justify-content:space-between;margin-top:14px;font-size:13px}
.rem{display:flex;align-items:center;gap:7px;color:#c7d0ea;cursor:pointer}
.rem input{width:15px;height:15px;accent-color:#3b6fd4}
.forgot{color:#6f8bff;text-decoration:none}
.forgot:hover{text-decoration:underline}
.btn{width:100%;margin-top:22px;border:none;border-radius:11px;padding:14px;font-size:15px;font-weight:700;color:#fff;cursor:pointer;background:linear-gradient(90deg,#2f6be0,#7c5cff);display:flex;align-items:center;justify-content:center;gap:9px;transition:filter .15s,transform .12s,box-shadow .15s;box-shadow:0 8px 22px rgba(79,90,220,.35)}
.btn:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 12px 28px rgba(79,90,220,.5)}
.btn:active{transform:translateY(0)}
.btn:hover{filter:brightness(1.08)}
.btn:disabled{opacity:.6;cursor:default}
.sep{display:flex;align-items:center;gap:12px;margin:18px 0;color:#55618a;font-size:12.5px}
.sep::before,.sep::after{content:'';flex:1;height:1px;background:#232b45}
.sso{width:100%;border:1.5px solid #2a3350;border-radius:11px;padding:12px;font-size:14px;font-weight:600;color:#c7d0ea;background:transparent;cursor:pointer;transition:border .15s,background .15s}
.sso:hover{border-color:#3a4570;background:rgba(58,69,112,.15)}
.sso:hover{background:#141a30}
#msg{min-height:18px;margin-top:14px;font-size:13px;text-align:center;color:#ff8f8f}
#totpWrap{display:none;margin-top:12px}
#totpWrap input{text-align:center;letter-spacing:6px;padding-left:14px;font-size:17px}
.ver{position:absolute;bottom:14px;font-size:11px;color:#41507a}
@media(max-width:860px){.scene{display:none}.side{flex:1;max-width:none}}

.mapdots{position:absolute;inset:0;z-index:0;pointer-events:none}
.mapdots i{position:absolute;width:5px;height:5px;border-radius:50%;background:#bcd3ff;
  box-shadow:0 0 6px 1px rgba(150,190,255,.8);opacity:0;animation:dotpulse 4s ease-in-out infinite}
@keyframes dotpulse{0%,100%{opacity:0;transform:scale(.6)}50%{opacity:.95;transform:scale(1)}}

@keyframes loginPulse{0%,100%{box-shadow:0 24px 60px rgba(0,0,0,.55),0 0 0 1px rgba(124,92,255,.06),inset 0 1px 0 rgba(255,255,255,.04),0 0 0 rgba(79,125,255,0)}50%{box-shadow:0 24px 60px rgba(0,0,0,.55),0 0 0 1px rgba(124,92,255,.1),inset 0 1px 0 rgba(255,255,255,.04),0 0 34px rgba(79,125,255,.28)}}
