*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;background:#edf3fa;color:#263b56}body{min-height:100vh}.app{width:min(740px,100%);min-height:100vh;margin:auto;display:flex;flex-direction:column;padding:24px 16px}.top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:22px}.eyebrow{font-size:11px;letter-spacing:.13em;font-weight:850;color:#50739d}.top h1{margin:3px 0;font-size:30px;letter-spacing:-.045em}.top h1 span{color:#2467a9}.top p,.sectiontop p{color:#667c94;font-size:13px;margin:0}main{flex:1}.card{background:#fff;border:1px solid #dce5ee;border-radius:15px;box-shadow:0 6px 26px #193b5910;padding:23px;margin-bottom:13px}h2{font-size:21px;margin:0 0 5px}.sectiontop{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.login{max-width:440px;margin:24px auto}.login>p{font-size:13px;color:#64748b}label{display:block;font-size:13px;font-weight:700;margin:13px 0}input{margin-top:7px;width:100%;border:1px solid #c4d3e3;border-radius:9px;padding:12px;font:inherit;font-size:15px;min-width:0}button,.link{font:inherit;font-size:13px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;min-height:43px;padding:10px 16px;border-radius:9px;border:1px solid #cbd9e7;color:#37516e;background:white}.primary{background:#236cb7;border-color:#236cb7;color:white}.danger{background:#b93844;border-color:#b93844;color:white}.logoff{background:#dceeff;border-color:#acd4fa;color:#155d9e}.subtle{background:#f0f5fb;border-color:#dbe7f2}.textbtn{border:0;background:transparent;color:#2467a9;padding:9px 0}.login .primary{width:100%}button:disabled{opacity:.5;cursor:not-allowed}.state{display:flex;align-items:center;gap:12px;padding:16px 0;font-size:19px}#light{display:inline-block;width:13px;height:13px;border-radius:50%;background:#b0bbc9;flex-shrink:0}.on #light{background:#1fa96b}.off #light{background:#d15059}.pill{padding:9px 12px;border-radius:22px;background:#e8f0f9;color:#486584;font-weight:850;font-size:11px}.buttons{display:flex;gap:12px}.buttons button{flex:1;min-height:52px;font-size:15px}.notice{font-size:13px;color:#58708a;line-height:1.5;min-height:18px;margin-top:12px}.lower{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px;color:#70839c;font-size:12px}.lower #refresh{margin-right:auto}footer{font-size:11px;color:#8293a6;text-align:center;margin-top:28px}.create{display:flex;align-items:end;gap:12px}.create label{flex:1;margin:0}.userrow{border-top:1px solid #e7eef5;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 0}.userrow small{display:block;color:#70839c;margin-top:3px}.rowbuttons{display:flex;gap:6px;flex-wrap:wrap}.rowbuttons button{min-height:35px;padding:6px 10px}.generated{background:#eef7ff;border:1px solid #bdd9f4;padding:13px;border-radius:10px;overflow-wrap:anywhere;margin:12px 0;font-size:14px}.audit{max-height:220px;overflow:auto;font-size:12px;line-height:1.9;color:#516882}.auditrow{border-bottom:1px solid #eef2f6}.overlay[hidden],.monitor[hidden],[hidden]{display:none!important}.overlay,.monitor{position:fixed;inset:0;z-index:20;background:#152a46b9;display:flex;align-items:center;justify-content:center;padding:16px}.dialog{width:min(390px,100%);background:white;padding:26px;border-radius:17px;box-shadow:0 25px 80px #0004}.dialog p{line-height:1.6}.actions{display:flex;justify-content:flex-end;gap:8px}.monitor{z-index:30;background:#edf3fa}.monitorinner{width:min(520px,100%);text-align:center;background:white;border:1px solid #dce6f0;border-radius:20px;box-shadow:0 16px 50px #142f4a16;padding:40px 20px}.monitor h2{font-size:clamp(21px,6vw,31px);letter-spacing:.015em;margin:14px 0}.timer{font-size:clamp(35px,10vw,52px);font-weight:850;letter-spacing:.06em;color:#2467a9;font-variant-numeric:tabular-nums}.monitor p{font-size:16px;color:#566d86}.gears{width:165px;height:105px;position:relative;margin:20px auto 8px}.gear{position:absolute;width:82px;height:82px;color:#266baa}.gear-a{left:0;top:19px;animation:clock 4s linear infinite}.gear-b{left:43px;top:0;width:76px;height:76px;color:#7e9bb7;animation:counter 4s linear infinite}.gear-c{left:85px;top:20px;animation:clock 4s linear infinite}@keyframes clock{to{transform:rotate(360deg)}}@keyframes counter{to{transform:rotate(-360deg)}}@media(max-width:430px){.app{padding:14px 10px}.top h1{font-size:24px}.card{padding:16px}.top{margin-bottom:16px}.create{flex-direction:column;align-items:stretch}.rowbuttons button{font-size:11px;padding:6px}.userrow{align-items:flex-start;flex-direction:column}.monitorinner{padding:30px 14px}.monitor p{font-size:15px}}@media(prefers-reduced-motion:reduce){.gear{animation-duration:12s}}
/* ONOFF BUCEGI v3 visual adjustments */
html,body{height:100%;overflow:hidden}.app{height:100dvh;min-height:0;padding-bottom:10px}.top{flex-shrink:0}main{min-height:0;flex:1;overflow-y:auto;overscroll-behavior:contain;padding-bottom:12px}footer{flex-shrink:0;margin-top:8px;padding:5px}
.activation-title{width:100%;background:#eef6ff;color:#1c619c;border:1px solid #bed8ef;font-size:19px;font-weight:850;min-height:53px;justify-content:space-between;padding:12px 16px}.login-divider{height:1px;background:#e0e9f1;margin:22px 0}.hint{font-size:12px;color:#566d86;line-height:1.65}.table-heading{font-size:14px;letter-spacing:.04em;margin:18px 0 8px;color:#436684}
.userlist{border-top:1px solid #e5edf4}.userrow{display:flex;flex-direction:row;align-items:center}.userrow>div:first-child{min-width:0;overflow-wrap:anywhere}.rowbuttons{flex-shrink:0}.rowbuttons button{min-width:63px}.share-message{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;font-size:14px;line-height:1.65}.share-actions{margin-top:12px}.share-actions button{min-height:40px}.state{font-size:20px;font-weight:750}.on .state{color:#168658}.off .state{color:#bd3b49}#light{width:15px;height:15px}
.gears{transform:scale(.76);margin:0 auto -7px}.monitor h2{font-size:clamp(23px,5.8vw,32px)}.monitor p{line-height:1.5}
@media(max-width:430px){.userrow{flex-direction:row;align-items:center}.rowbuttons{flex-wrap:nowrap}.rowbuttons button{font-size:11px;padding:6px;min-width:54px}.monitorinner{padding:22px 12px}.monitor p{font-size:15px}}

/* v3 popup revision: title above smaller gears, restrained typography */
.monitorinner #monitorText{font-size:clamp(19px,4.8vw,25px);line-height:1.25;margin:18px auto 4px;font-weight:800}
.monitorinner .gears{transform:scale(.64);margin:-7px auto -13px}
.monitorinner .timer{font-size:clamp(34px,9vw,46px)}
@media(max-width:430px){.monitorinner #monitorText{font-size:21px}.monitorinner .gears{transform:scale(.61)}}

/* Dopo READY: ingranaggi fermi, tempo finale visibile e countdown di chiusura. */
.monitor.is-ready .gear { animation-play-state: paused; }

/* ONOFF BUCEGI - Leggibilita testi secondari */
.top p, .sectiontop p, .login > p, .eyebrow,
.hint, .notice, .lower, .userrow small,
.audit, footer, .table-heading, .monitor p {
    color: #303842;
    font-size: 14px;
}

/* ONOFF BUCEGI v4 - accesso e conferme */
.password-wrap{position:relative;display:block}
.password-wrap input{padding-right:55px}
.password-eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);min-width:42px;width:42px;min-height:42px;padding:7px;border:0;background:transparent;color:#416a93;border-radius:8px}
.password-eye svg{width:23px;height:23px}
.password-eye.is-visible{color:#1764af;background:#e6f2ff}
.password-eye:focus-visible{outline:2px solid #2467a9;outline-offset:1px}
.activation-success{margin-top:18px;padding:24px 12px;border:1px solid #beded1;border-radius:15px;background:#f2fbf6;text-align:center;color:#225e41}
.activation-success h2{font-size:clamp(20px,5vw,25px);margin:10px 0}
.activation-success p{font-size:16px;line-height:1.5}
.activation-check{display:inline-flex;align-items:center;justify-content:center;width:62px;height:62px;border-radius:50%;background:#d9f4e4;color:#187747;font-size:34px;font-weight:850}
.force-modal{z-index:50}
.force-modal .dialog{max-width:420px;text-align:center}
.force-modal .actions{justify-content:center;flex-wrap:wrap;margin-top:22px}
.force-modal .actions button{flex:1;min-width:120px}


/* ONOFF BUCEGI - ritocco compatto e azioni intuitive
   Aggiungere ALLA FINE di public/assets/onoff.css
   Il titolo ONOFF BUCEGI resta bicolore.
*/

/* Riquadri bianchi piu' compatti, senza sacrificare il contenuto. */
.app { width: min(660px,100%); }
.card { padding: 18px 19px; margin-bottom: 10px; border-radius: 13px; }
.sectiontop { margin-bottom: 12px; }
.state { padding: 10px 0; }
.buttons { gap: 10px; }
.buttons button { min-height: 45px; font-size: 13px; padding: 9px 13px; }

/* PORNESTE: verde quando utilizzabile. */
#wake { background: #23845b; border-color: #23845b; color: #fff; }
#wake:not(:disabled):hover { background: #1b714d; border-color: #1b714d; }

/* OPRESTE: rosso quando utilizzabile. */
#shutdown { background: #b9444d; border-color: #b9444d; color: #fff; }
#shutdown:not(:disabled):hover { background: #a9343e; border-color: #a9343e; }

/* Azioni non disponibili: tinte leggere ma testi leggibili. */
#wake:disabled { background: #e7f4eb; border-color: #d5e8db; color: #8ba89a; opacity: 1; cursor: not-allowed; }
#shutdown:disabled { background: #fae9eb; border-color: #efd8dc; color: #b79b9e; opacity: 1; cursor: not-allowed; }

/* Compact anche la finestra di monitoraggio, mantenendo gli ingranaggi. */
.monitorinner { width: min(475px,100%); padding: 26px 19px; border-radius: 17px; }
.monitorinner #monitorText { font-size: clamp(18px,4.2vw,22px); }
.monitorinner .timer { font-size: clamp(32px,8vw,42px); }
.monitor p { font-size: 14px; }

@media (max-width:430px) {
  .app { width: 100%; }
  .card { padding: 15px 13px; }
  .buttons { gap: 8px; }
  .buttons button { min-height: 44px; font-size: 13px; padding: 8px 9px; }
  .monitorinner { padding: 22px 13px; }
  .monitorinner #monitorText { font-size: 19px; }
}

/* ONOFF BUCEGI - Ritocco tipografico finale */

/* Operator logat */
.status-card h2 {
    font-size: 18px;
    font-weight: 700;
}

/* CALCULATORUL PORNIT / OPRIT */
.status-card .state {
    font-size: 17px;
    font-weight: 700;
}

/* Maggiore distanza tra stato e pulsanti */
.status-card .buttons {
    padding-top: 12px;
}

/* Smartphone */
@media (max-width: 430px) {
    .status-card h2 {
        font-size: 17px;
    }

    .status-card .state {
        font-size: 16px;
    }
}

/* ONOFF BACKDROP ANTRACITE - 2026-10-24 */
/* Solo lo sfondo esterno ai popup: le schede bianche restano leggibili. */
.monitor { background: rgba(34, 39, 46, .76); }
.overlay { background: rgba(34, 39, 46, .76); }

/* ONOFF REFRESH CUSTOM - 20261024 */
/* Stesso azzurro LOGOUT, icona verde originale di SVG Repo. */
#refresh.logoff { display:inline-flex; align-items:center; justify-content:center; gap:8px; }
#refresh .refresh-icon { display:block; width:30px; height:30px; flex:0 0 30px; object-fit:contain; }
#updated { font-size:15px; color:#303842; }
@media(max-width:430px) {
    #refresh .refresh-icon { width:26px; height:26px; flex-basis:26px; }
    #updated { font-size:14px; }
}