*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}:root{--op-orange:#e58a3f;--op-orange-dark:#b56b2f;--op-orange-light:#f0a050;--op-bg:#0e0e0e;--op-surface:#1a1a1a;--op-surface2:#242424;--op-border:rgba(255,255,255,.08);--op-border-hover:rgba(255,255,255,.18);--op-text:#f0ede8;--op-muted:#888880;--op-success:#2ecc71;--op-blue:#3498db;--op-radius:12px;--op-radius-sm:8px}html,body{min-height:100vh;background:var(--op-bg);color:var(--op-text);font-family:'DM Sans',sans-serif}.app{max-width:680px;margin:0 auto;padding:0 0 60px}.header{background:var(--op-surface);border-bottom:1px solid var(--op-border);padding:18px 28px;display:flex;align-items:center;gap:14px;position:sticky;top:0;z-index:10}.logo-badge{height:38px;display:flex;align-items:center;flex-shrink:0}.logo-badge img{height:28px;width:auto;display:block;filter:brightness(0) invert(1)}.header-info{flex:1;text-align:center}font-size: 16px;
  font-weight: 600;
  color: var(--op-text);
  letter-spacing: -0.3px;
}

.header-info h1 span {color:var(--op-orange)}.header-info p{font-size:12px;color:var(--op-muted);margin-top:1px}.header-clock{margin-left:auto;text-align:right}.header-clock strong{display:block;font-size:15px;font-weight:600;color:var(--op-text);font-variant-numeric:tabular-nums}.header-clock span{font-size:12px;color:var(--op-muted)}.screen{display:none;padding:32px 28px}.screen.active{display:block}.welcome-head{margin-bottom:32px}.welcome-head h2{font-size:28px;font-weight:700;color:var(--op-text);letter-spacing:-.6px;line-height:1.2}.welcome-head h2 span{color:var(--op-orange)}.welcome-head p{font-size:14px;color:var(--op-muted);margin-top:8px}.welcome-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.welcome-btn{background:var(--op-surface);border:1px solid var(--op-border);border-radius:var(--op-radius);padding:32px 24px;cursor:pointer;transition:all .2s ease;text-align:center;user-select:none}.welcome-btn:hover{border-color:var(--op-orange);background:var(--op-surface2);transform:translateY(-2px)}.welcome-btn:active{transform:translateY(0)}.welcome-btn .icon{font-size:38px;margin-bottom:14px;display:block}.welcome-btn .btn-title{font-size:17px;font-weight:600;color:var(--op-text);margin-bottom:6px}.welcome-btn .btn-sub{font-size:13px;color:var(--op-muted)}.welcome-btn.entry{border-top:3px solid var(--op-orange)}.welcome-btn.exit{border-top:3px solid var(--op-blue)}.btn-storico{display:block;text-align:center;margin-top:16px;padding:11px;background:var(--op-surface);border:1px solid var(--op-border);border-radius:var(--op-radius-sm);color:var(--op-muted);font-size:13px;text-decoration:none;transition:all .15s}.btn-storico:hover{border-color:var(--op-border-hover);color:var(--op-text)}.stats-bar{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px}.stat-card{background:var(--op-surface);border:1px solid var(--op-border);border-radius:var(--op-radius-sm);padding:16px 18px}.stat-label{font-size:11px;color:var(--op-muted);text-transform:uppercase;letter-spacing:.6px;margin-bottom:6px}.stat-value{font-size:28px;font-weight:700;font-variant-numeric:tabular-nums}.stat-value.orange{color:var(--op-orange)}.screen-title{font-size:20px;font-weight:700;color:var(--op-text);margin-bottom:4px;letter-spacing:-.4px}.screen-sub{font-size:13px;color:var(--op-muted);margin-bottom:28px}.back-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:none;color:var(--op-muted);font-size:13px;cursor:pointer;font-family:inherit;margin-bottom:20px;padding:0;transition:color .15s}.back-btn:hover{color:var(--op-text)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:20px}.form-field{display:flex;flex-direction:column;gap:6px}.form-field.full{grid-column: 1 / -1}.form-field.sig-field{margin-bottom:16px}label{font-size:11px;font-weight:600;color:var(--op-muted);text-transform:uppercase;letter-spacing:.7px}input[type="text"],input[type="email"],select,textarea{background:var(--op-surface);border:1px solid var(--op-border);border-radius:var(--op-radius-sm);color:var(--op-text);font-size:14px;padding:11px 14px;outline:none;transition:border-color .15s;width:100%;font-family:inherit;appearance:none}input[type="text"]:focus,select:focus,textarea:focus{border-color:var(--op-orange)}select{background-image:url(data:image/svg+xml,%3Csvg\ xmlns=\'http://www.w3.org/2000/svg\'\ width=\'12\'\ height=\'8\'\ viewBox=\'0\ 0\ 12\ 8\'%3E%3Cpath\ d=\'M1\ 1l5\ 5\ 5-5\'\ stroke=\'%23888880\'\ stroke-width=\'1.5\'\ fill=\'none\'\ stroke-linecap=\'round\'/%3E%3C/svg%3E);background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}select option{background:#1a1a1a}.sig-wrap{background:var(--op-surface);border:1px solid var(--op-border);border-radius:var(--op-radius-sm);overflow:hidden}.sig-wrap canvas{display:block;width:100%;height:160px;cursor:crosshair;touch-action:none;background:#111}.sig-toolbar{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-top:1px solid var(--op-border)}.sig-status{font-size:12px;color:var(--op-muted)}.sig-status.ok{color:var(--op-success)}.btn-clear{background:transparent;border:1px solid var(--op-border);color:var(--op-muted);font-size:12px;padding:5px 12px;border-radius:6px;cursor:pointer;font-family:inherit;transition:all .15s}.btn-clear:hover{border-color:var(--op-orange);color:var(--op-orange)}.privacy-box{background:var(--op-surface);border:1px solid var(--op-border);border-radius:var(--op-radius-sm);padding:14px 16px;margin:16px 0 20px}.privacy-check{display:flex;align-items:flex-start;gap:12px;cursor:pointer}.privacy-check input[type="checkbox"]{width:18px;height:18px;min-width:18px;margin-top:2px;accent-color:var(--op-orange);cursor:pointer}.privacy-text{font-size:12px;color:var(--op-muted);line-height:1.65}.privacy-text strong{color:var(--op-text);display:block;margin-bottom:4px}.btn-primary{background:var(--op-orange);color:#fff;border:none;border-radius:var(--op-radius-sm);padding:13px 28px;font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;transition:background .15s;width:100%}.btn-primary:hover:not(:disabled) {background:var(--op-orange-light)}.btn-primary:disabled{background:#2a2a2a;color:#555;cursor:not-allowed}.visitor-list{display:flex;flex-direction:column;gap:10px;margin-bottom:24px}.visitor-card{background:var(--op-surface);border:1px solid var(--op-border);border-radius:var(--op-radius-sm);padding:14px 16px;display:flex;align-items:center;gap:14px;transition:border-color .15s}.visitor-card:hover{border-color:var(--op-border-hover)}.visitor-card .v-info{flex:1}.v-avatar{width:42px;height:42px;min-width:42px;border-radius:50%;background:var(--op-orange);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px;color:#fff}.v-name{font-size:14px;font-weight:600;color:var(--op-text)}.v-meta{font-size:12px;color:var(--op-muted);margin-top:2px}.v-time{font-size:11px;color:#555;margin-top:3px}.btn-exit{background:rgba(52,152,219,.12);border:1px solid rgba(52,152,219,.25);color:#5bb8f5;border-radius:6px;padding:8px 16px;font-size:13px;font-weight:500;cursor:pointer;font-family:inherit;white-space:nowrap;transition:all .15s;margin-left:auto}.btn-exit:hover{background:rgba(52,152,219,.22)}.success-wrap{text-align:center;padding:48px 28px}.success-icon{font-size:56px;margin-bottom:20px}.success-title{font-size:24px;font-weight:700;color:var(--op-text);margin-bottom:8px}.success-sub{font-size:15px;color:var(--op-muted);margin-bottom:8px}.success-detail{font-size:13px;color:#555;margin-bottom:28px}.tags{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:28px}.tag{background:rgba(240,90,40,.12);border:1px solid rgba(240,90,40,.25);color:#ff9070;border-radius:20px;padding:5px 14px;font-size:12px;font-weight:500}.btn-home{background:var(--op-orange);color:#fff;border:none;border-radius:var(--op-radius-sm);padding:13px 40px;font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;transition:background .15s}.btn-home:hover{background:var(--op-orange-light)}.empty-state{text-align:center;padding:52px 0;color:var(--op-muted);font-size:14px;line-height:2}.spinner{display:inline-block;width:20px;height:20px;border:2px solid var(--op-border);border-top-color:var(--op-orange);border-radius:50%;animation:spin .7s linear infinite;vertical-align:middle;margin-right:8px}@keyframes spin {
  to { transform: rotate(360deg); }
}#toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%) translateY(80px);background:#2a2a2a;color:var(--op-text);border:1px solid var(--op-border);border-radius:8px;padding:10px 20px;font-size:13px;z-index:999;transition:transform .3s ease;pointer-events:none}#toast.show{transform:translateX(-50%) translateY(0)}#toast.error{border-color:#e74c3c;color:#ff6b6b}@media (max-width:480px){.welcome-grid,.form-grid,.stats-bar{grid-template-columns:1fr}.form-field.full{grid-column:1}.screen,.header{padding-left:18px;padding-right:18px}}.toolbar{display:flex;align-items:center;gap:12px;margin-bottom:28px;flex-wrap:wrap}.date-nav{display:flex;align-items:center;gap:4px;background:var(--op-surface);border:1px solid var(--op-border);border-radius:var(--op-radius-sm);padding:4px}.date-nav button{background:none;border:none;color:var(--op-muted);cursor:pointer;width:32px;height:32px;border-radius:6px;font-size:16px;display:flex;align-items:center;justify-content:center;transition:all .15s;font-family:inherit}.date-nav button:hover{background:var(--op-surface2);color:var(--op-text)}.date-nav button:disabled{opacity:.3;cursor:not-allowed}input[type="date"]#date-picker{background:none;border:none;color:var(--op-text);font-size:14px;font-weight:600;font-family:inherit;padding:4px 8px;cursor:pointer;outline:none;width:130px;text-align:center;color-scheme:dark}.btn-today{background:var(--op-surface);border:1px solid var(--op-border);color:var(--op-muted);border-radius:var(--op-radius-sm);padding:8px 14px;font-size:13px;cursor:pointer;font-family:inherit;transition:all .15s;white-space:nowrap}.btn-today:hover{border-color:var(--op-orange);color:var(--op-orange)}.btn-today.active{background:rgba(229,138,63,.1);border-color:rgba(229,138,63,.4);color:var(--op-orange)}.day-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:28px}.history-table{width:100%;border-collapse:collapse;font-size:13px}.history-table thead th{text-align:left;font-size:11px;font-weight:600;color:var(--op-muted);text-transform:uppercase;letter-spacing:.6px;padding:0 12px 10px;border-bottom:1px solid var(--op-border)}.history-table tbody tr{border-bottom:1px solid var(--op-border);transition:background .1s}.history-table tbody tr:last-child{border-bottom:none}.history-table tbody tr:hover{background:var(--op-surface2)}.history-table td{padding:12px;color:var(--op-text);vertical-align:middle}.td-avatar{width:44px}.td-name{font-weight:600}.td-sub{font-size:12px;color:var(--op-muted);margin-top:2px}.td-time{font-variant-numeric:tabular-nums;color:var(--op-muted);font-size:12px;white-space:nowrap}.td-time strong{display:block;font-size:13px;color:var(--op-text);font-weight:500}.badge-present{display:inline-flex;align-items:center;gap:5px;background:rgba(46,204,113,.1);border:1px solid rgba(46,204,113,.25);color:#2ecc71;border-radius:20px;padding:3px 10px;font-size:11px;font-weight:600;white-space:nowrap}.badge-present::before{content:'';width:6px;height:6px;border-radius:50%;background:#2ecc71;animation:pulse 1.5s infinite}@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}.badge-uscito{display:inline-block;color:var(--op-muted);font-size:12px;font-variant-numeric:tabular-nums}.durata{font-size:11px;color:#555;margin-top:2px}.table-wrap{background:var(--op-surface);border:1px solid var(--op-border);border-radius:var(--op-radius);overflow:hidden}.back-home{display:inline-flex;align-items:center;gap:6px;background:none;border:none;color:var(--op-muted);font-size:13px;cursor:pointer;font-family:inherit;margin-bottom:20px;padding:0;transition:color .15s;text-decoration:none}.back-home:hover{color:var(--op-text)}@media (max-width:480px){.day-stats{grid-template-columns:1fr 1fr}.history-table .td-referente{display:none}.toolbar{gap:8px}}.btn-detail{background:transparent;border:1px solid var(--op-border);color:var(--op-muted);border-radius:6px;padding:5px 12px;font-size:12px;cursor:pointer;font-family:inherit;transition:all .15s;white-space:nowrap}.btn-detail:hover{border-color:var(--op-orange);color:var(--op-orange)}.v-avatar-sm{width:34px;height:34px;min-width:34px;font-size:12px}.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:100;align-items:center;justify-content:center;padding:20px}.modal-overlay.active{display:flex}.modal{background:#1a1a1a;border:1px solid rgba(255,255,255,.12);border-radius:16px;width:100%;max-width:480px;max-height:90vh;overflow-y:auto}.modal-header{display:flex;align-items:flex-start;justify-content:space-between;padding:20px 20px 16px;border-bottom:1px solid var(--op-border)}.modal-title{font-size:17px;font-weight:700;color:var(--op-text)}.modal-sub{font-size:13px;color:var(--op-muted);margin-top:3px}.modal-close{background:none;border:none;color:var(--op-muted);font-size:18px;cursor:pointer;padding:0 0 0 12px;line-height:1;transition:color .15s;flex-shrink:0}.modal-close:hover{color:var(--op-text)}.modal-body{padding:20px}.modal-section-label{font-size:11px;font-weight:600;color:var(--op-muted);text-transform:uppercase;letter-spacing:.7px;margin-bottom:10px}.modal-sig-wrap{background:#111;border:1px solid var(--op-border);border-radius:var(--op-radius-sm);overflow:hidden;line-height:0}.modal-sig-wrap img{width:100%;height:auto;display:block}.modal-privacy{background:var(--op-surface);border:1px solid var(--op-border);border-radius:var(--op-radius-sm);padding:14px 16px}.modal-privacy p{font-size:12px;color:var(--op-muted);line-height:1.65;margin-top:8px}.privacy-accepted{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#2ecc71}.privacy-declined{font-size:13px;font-weight:600;color:#e74c3c}