@font-face{font-family:Barlow;font-style:normal;font-weight:200;font-display:swap;src:url(/assets/fonts/barlow-latin-200-normal.woff2) format('woff2')}
@font-face{font-family:Barlow;font-style:normal;font-weight:300;font-display:swap;src:url(/assets/fonts/barlow-latin-300-normal.woff2) format('woff2')}
@font-face{font-family:Barlow;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/barlow-latin-400-normal.woff2) format('woff2')}
:root{--tx:#d3e3ec;--dim:#5f7484;--dis:#3f5462;--cy:#1f93c4;--bl:#0f4ea3;--or:#d98a1f;--red:#dc2035;--line:rgba(170,205,225,.3);--pn:rgba(8,20,32,.85);--dx:40px;--dr:24deg}
*{box-sizing:border-box;margin:0}[hidden]{display:none!important}
html{background:#02060b}
body{background:transparent;color:var(--tx);font:300 16px Barlow,system-ui,sans-serif;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}
.bg{position:fixed;inset:0;pointer-events:none;z-index:-1;background:
 radial-gradient(circle at 5% 30%,rgba(130,215,235,.30),transparent 9%),
 radial-gradient(circle at 9% 72%,rgba(60,170,205,.28),transparent 11%),
 radial-gradient(ellipse 24% 80% at 0% 50%,rgba(35,145,185,.5),transparent 72%),
 linear-gradient(104deg,transparent 12%,rgba(200,225,240,.09) 22%,transparent 32%),
 radial-gradient(ellipse 60% 50% at 70% 100%,rgba(20,70,110,.35),transparent 70%),
 linear-gradient(180deg,#020a13,#07142200,#06121f);background-color:#03080f;animation:drift 18s ease-in-out infinite alternate}
@keyframes drift{to{background-position:14px 6px,-10px 8px,0 0,30px 0,0 0,0 0}}
.v{min-height:100vh;min-height:100dvh}
b{font-weight:300}
/* titoli */
h1{font-weight:200;font-size:28px;letter-spacing:1px;line-height:1.15;margin-top:6px;color:#e4eef4}h1 b{font-size:38px;font-weight:200}
small{color:var(--tx);font-size:14px;letter-spacing:.3px}
h2{display:flex;align-items:center;gap:8px;font-size:19px;font-weight:300;margin:26px 0 10px;color:var(--tx)}h2::before{content:"";width:7px;height:22px;background:#aebdc6}
.err{color:#ff8a7a;min-height:20px;font-size:14px}.hint{font-size:13px;color:var(--dim);line-height:1.5;margin-top:8px}
/* animazioni (stesso linguaggio del sito pubblico) */
@keyframes wi{from{opacity:0;transform:perspective(700px) translateX(var(--dx)) rotateY(var(--dr)) rotateX(6deg)}to{opacity:1;transform:perspective(700px) translateX(0) rotateY(0) rotateX(0)}}
@keyframes pop{from{opacity:0;transform:perspective(700px) rotateX(-20deg) rotateY(16deg) scale(.84)}60%{opacity:1}to{opacity:1;transform:perspective(700px) rotateX(0) rotateY(0) scale(1)}}
@keyframes pout{to{opacity:0;transform:perspective(700px) rotateX(12deg) rotateY(-10deg) scale(.9)}}
@keyframes pg{from{opacity:0}to{opacity:1}}
@keyframes ts{0%{opacity:0;transform:translateX(30px)}10%,85%{opacity:1;transform:none}100%{opacity:0}}
.enter>*{animation:wi .3s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:calc(var(--i,0)*28ms)}
.pop{animation:pop .17s cubic-bezier(.2,.9,.3,1.25) backwards}
/* angoli stile terminale */
.k{position:absolute;width:14px;height:14px;pointer-events:none;border:0 solid #e6eef2}
.k.tl{left:-1px;top:-1px;border-width:2px 0 0 2px}.k.tr{right:-1px;top:-1px;border-width:2px 2px 0 0}.k.bl{left:-1px;bottom:-1px;border-width:0 0 2px 2px}.k.br{right:-1px;bottom:-1px;border-width:0 2px 2px 0}
/* tilt su hover (mouse) */
.t{cursor:pointer;transform:perspective(700px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateZ(var(--z,0px));transition:transform .12s ease-out,background .15s,filter .15s}
.t:hover{--z:14px}
/* pulsanti */
.b{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 18px;background:rgba(15,78,163,.5);border:0;color:#fff;font:300 17px Barlow,system-ui,sans-serif;letter-spacing:.6px;cursor:pointer;clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%);transform:perspective(700px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateZ(var(--z,0px));transition:transform .12s ease-out,background .15s,filter .15s}
.b:hover{--z:10px;filter:brightness(1.25)}.b:active{filter:brightness(1.4)}
.b.pri{background:var(--cy);box-shadow:inset -5px 0 0 rgba(0,20,50,.35)}.b.on{background:#d98a1f}.b.del{background:rgba(192,40,52,.5)}.b:disabled{opacity:.4}
/* campi */
input,select,textarea{width:100%;min-height:46px;background:rgba(2,8,14,.8);border:1px solid var(--line);color:#fff;font:300 17px Barlow,system-ui,sans-serif;padding:0 12px;border-radius:0}
textarea{padding:10px 12px;min-height:80px}input:focus,select:focus,textarea:focus{outline:0;border-color:var(--cy);box-shadow:0 1px 0 var(--cy)}
input[type=checkbox]{width:22px;min-height:22px;accent-color:var(--cy)}
/* login */
#login{display:flex;align-items:center;justify-content:center;padding:24px}
#lf{position:relative;width:100%;max-width:380px;display:grid;gap:14px;background:rgba(0,0,0,.92);border:1px solid var(--line);padding:30px 24px 24px}
/* intestazione */
header{position:relative;max-width:760px;margin:0 auto;padding:calc(16px + env(safe-area-inset-top,0px)) 16px 12px}
header::after{content:"";position:absolute;left:16px;right:16px;bottom:0;height:1px;background:linear-gradient(90deg,rgba(170,205,225,.55),rgba(170,205,225,.12))}
.mon{position:absolute;right:16px;top:calc(16px + env(safe-area-inset-top,0px));font-size:11px;letter-spacing:4px;text-transform:uppercase}.mon.on{color:#63d8ea}
.mon.on::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#63d8ea;margin-right:8px;vertical-align:middle;animation:blink 1.6s infinite}@keyframes blink{50%{opacity:.25}}
.hrow{margin-top:12px}.hrow .b{min-height:40px;font-size:15px}
main{max-width:760px;margin:0 auto;padding:6px 16px calc(100px + env(safe-area-inset-bottom,0px))}
.tab{display:none}.tab.on{display:block}
/* navigazione */
nav{position:fixed;left:0;right:0;bottom:0;z-index:5;display:grid;grid-template-columns:repeat(4,1fr);gap:3px;padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px));background:linear-gradient(0deg,rgba(2,8,14,.97) 78%,transparent)}
nav button{all:unset;box-sizing:border-box;position:relative;text-align:center;padding:14px 2px;font-size:15px;color:var(--tx);cursor:pointer;background:rgba(15,78,163,.28);transform:perspective(700px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateZ(var(--z,0px));transition:transform .12s ease-out,background .15s}
nav button:hover{--z:10px;background:rgba(31,147,196,.28)}
nav button.on{background:var(--cy);color:#fff;box-shadow:inset -5px 0 0 rgba(0,20,50,.35)}
nav i{position:absolute;top:8px;right:8px;width:10px;height:10px;border-radius:50%;background:var(--red);animation:blink 1.2s infinite}
/* HUD e numeri */
.hud{margin-top:14px}.hb{display:grid;gap:6px;max-width:340px}.hr{display:flex;gap:6px;align-items:center}.hr>:last-child{flex:1}
.ic{background:#bfe6ec;color:#0c2a3a;display:grid;place-items:center;width:28px;height:28px;flex:0 0 28px;font-size:15px}
.red{background:var(--red);color:#fff;height:26px;font-size:13px;display:flex;align-items:center;justify-content:flex-end;padding:0 8px;letter-spacing:.5px}
.hsg{display:flex;gap:4px;height:22px}.hsg i{flex:1;background:#1b5fb0}
.big{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.big>div{position:relative;background:var(--pn);border:1px solid var(--line);padding:14px 14px 10px}
.big small{display:block;font-size:13px;color:var(--dim);letter-spacing:1.5px;text-transform:uppercase}
.num{display:block;font-size:46px;font-weight:200;line-height:1.15;letter-spacing:3px;color:#c4eef6;white-space:nowrap}.num u{text-decoration:none;color:#3f5a6c}
.prog{margin-top:14px}.pl2{display:flex;justify-content:space-between;font-size:14px;margin-bottom:6px}.pl2 em{font-style:normal;color:var(--dim)}
.lkt{height:10px;background:rgba(170,205,225,.2)}.lkt i{display:block;height:100%;width:0;background:var(--or);transition:width .5s}
.hours{display:grid;grid-template-columns:repeat(24,1fr);gap:3px;align-items:end;height:110px;margin-bottom:26px;border-bottom:1px solid var(--line)}
.hours i{background:var(--cy);min-height:2px;position:relative;transform-origin:bottom;animation:grow .5s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:calc(var(--i,0)*14ms)}.hours i.now{background:var(--or)}
@keyframes grow{from{transform:scaleY(0)}}
.hours i span{position:absolute;bottom:-20px;left:50%;transform:translateX(-50%);font-size:10px;color:var(--dim);font-style:normal}
/* liste */
.rows>div{display:flex;align-items:center;gap:12px;padding:10px 6px;border-bottom:1px solid rgba(170,205,225,.25);transition:background .15s}
.rows>div:hover{background:rgba(31,147,196,.14)}
.rows .gr{flex:1;min-width:0}.rows em{font-style:normal;color:var(--dim);font-size:13px}.rows b{font-weight:300;color:#fff}
.rows>div>b:last-child{font-size:22px;color:#c4eef6}
.av{width:44px;height:44px;flex:0 0 44px;border-radius:50%;background:#0b1b29 center/cover;border:1px solid var(--line);position:relative;overflow:hidden}
.av.ph::before{content:"";position:absolute;left:15px;top:8px;width:14px;height:14px;border-radius:50%;background:#37566b}.av.ph::after{content:"";position:absolute;left:8px;top:26px;width:28px;height:22px;border-radius:14px 14px 0 0;background:#37566b}
.new .nm::after{content:" ●";color:var(--red)}
.pl{display:flex;align-items:center;gap:10px;margin-top:8px}.pl .b{min-height:40px;padding:0 14px;font-size:15px}.pb{flex:1;height:6px;background:rgba(170,205,225,.18)}.pb i{display:block;height:100%;width:0;background:var(--cy)}
/* schede */
.card{position:relative;background:var(--pn);border:1px solid var(--line);padding:14px;display:grid;gap:8px}
.card label{font-size:13px;color:var(--dim);letter-spacing:1.2px;margin-top:6px;text-transform:uppercase}.card .file{margin-top:8px}.card label.chk{text-transform:none;font-size:16px;color:var(--tx);letter-spacing:0}
.two{display:grid;grid-template-columns:1fr auto;gap:8px}.row4{display:grid;gap:6px;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:4px}
.chk{display:flex;align-items:center;gap:10px}.big2{width:100%;margin-top:16px;min-height:56px;font-size:20px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.pgrid .p{border:1px solid var(--line);background:var(--pn);transition:opacity .2s}.pgrid .p.off{opacity:.45}
.pgrid .im{aspect-ratio:1;background:center/cover}.pgrid .pi{padding:8px;font-size:12px;color:var(--dim)}.pgrid .pa{display:flex;gap:4px;padding:0 8px 8px}.pgrid .pa .b{flex:1;min-height:38px;padding:0 6px;font-size:14px}
/* avvisi e chiamata */
#bn{position:fixed;left:12px;right:12px;bottom:calc(86px + env(safe-area-inset-bottom,0px));z-index:30;display:flex;flex-direction:column-reverse;gap:8px;pointer-events:none;max-width:420px;margin:0 auto}
.bnr{background:rgba(0,8,16,.94);border-left:3px solid var(--cy);padding:13px 16px;font-size:15px;animation:ts 2.8s forwards}
.mveil{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.65);display:flex;align-items:center;justify-content:center;padding:20px;animation:pg .12s ease-out}
.mveil.out{pointer-events:none;animation:pg .12s reverse forwards}.mveil.out .mmod{animation:pout .12s ease-in forwards}
.mmod{position:relative;background:#000;padding:28px 20px 20px;max-width:420px;width:100%;border:1px solid var(--line);text-align:center;font-size:19px;line-height:1.4;animation:pop .17s cubic-bezier(.2,.9,.3,1.25) backwards}
.mbtns{display:flex;gap:10px;margin-top:22px}.mbtns .b{flex:1;min-height:54px;font-size:20px}
#call{position:fixed;inset:0;z-index:60;background:radial-gradient(circle at 50% 30%,#0e3a52,#02080f 70%);display:flex;align-items:center;justify-content:center;padding:24px;animation:pg .15s ease-out}
.cc{position:relative;text-align:center;width:100%;max-width:380px;display:grid;gap:14px;justify-items:center;background:rgba(0,0,0,.6);border:1px solid var(--line);padding:30px 20px 22px}
.cc small{letter-spacing:4px;text-transform:uppercase;font-size:12px;color:#63d8ea}
.cav{width:140px;height:140px;border-radius:50%;background:#0b1b29 center/cover;border:2px solid #63d8ea;animation:pulse 1.2s infinite;position:relative;overflow:hidden}
.cav.ph::before{content:"";position:absolute;left:50px;top:28px;width:40px;height:40px;border-radius:50%;background:#37566b}.cav.ph::after{content:"";position:absolute;left:25px;top:76px;width:90px;height:70px;border-radius:45px 45px 0 0;background:#37566b}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(99,216,234,.55)}100%{box-shadow:0 0 0 34px rgba(99,216,234,0)}}
.cn{font-size:36px;font-weight:200;color:#fff;letter-spacing:1px}.cs{color:#9fb4c0}.cb{display:flex;gap:12px;margin-top:10px;width:100%}.cb .b{flex:1;min-height:58px;font-size:20px}
@media(min-width:820px){h1{font-size:34px}h1 b{font-size:46px}.num{font-size:58px}}
@media(prefers-reduced-motion:reduce){.bg,.cav,.hours i,.pop,.enter>*,.mmod,#call,.mveil,nav i,.mon.on::before{animation:none!important}.t,.b,nav button{transition:none}}
.card::before,.card::after,.big>div::before,.big>div::after{content:"";position:absolute;width:12px;height:12px;pointer-events:none;border:0 solid #e6eef2}
.card::before,.big>div::before{left:-1px;top:-1px;border-width:2px 0 0 2px}.card::after,.big>div::after{right:-1px;bottom:-1px;border-width:0 2px 2px 0}
nav button{font-size:14px;letter-spacing:0}
.mmod small{display:block;letter-spacing:4px;text-transform:uppercase;font-size:12px;color:#63d8ea;margin-bottom:8px}.lpn{font-size:64px;font-weight:200;line-height:1.1;color:#fff;letter-spacing:2px}.lps{color:#9fb4c0;margin-top:4px}
header>small{display:block;padding-right:120px}