.contFlag{z-index:9999;background:#fff;border:1px solid #ddd;border-radius:8px;padding:8px 12px;position:fixed;box-shadow:0 4px 15px #00000026}.contFlag p{margin:0}.container-employee{border:1px solid #000;border-radius:15px;height:200px;margin-top:25px;padding-top:10px;padding-left:15px;overflow:hidden scroll}.container-employee div{cursor:pointer;transition:all .2s}.container-employee div:hover{color:#fff;background-color:#000}.secondary-button{background:#000;width:auto;margin-top:0}.success-box{color:#155724;background:#d4edda;border-radius:8px;margin-bottom:1rem;padding:1rem}.error-box{color:#721c24;background:#f8d7da;border-radius:8px;margin-bottom:1rem;padding:1rem}:root{--ink:#1a1d1f;--paper:#fafaf8;--line:#dfe1de;--accent:#c0392b;--accent-ink:#fff;--success:#2f7d5f;--success-bg:#e8f3ee;--danger:#c0392b;--danger-bg:#fbeae8;--muted:#6b7270;--radius:14px;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{font-family:var(--font);background:var(--paper);color:var(--ink);-webkit-tap-highlight-color:transparent;margin:0}.screen{flex-direction:column;justify-content:center;align-items:center;min-height:fit-content;padding:24px;display:flex}.adminButton{text-align:left;cursor:pointer;background-color:#ca1f2c;border:1px solid #ddd;border-radius:12px;padding:1.25rem}.adminButtonNoir{text-align:left;cursor:not-allowed;-webkit-user-select:none;user-select:none;background-color:#000;border:1px solid #ddd;border-radius:12px;padding:1.25rem}.card{width:100%;max-width:380px}.eyebrow{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 4px;font-size:13px;font-weight:600}h1{letter-spacing:-.01em;margin:0 0 24px;font-size:26px;font-weight:700}label{margin:16px 0 6px;font-size:14px;font-weight:600;display:block}input{border:1.5px solid var(--line);border-radius:var(--radius);width:100%;color:var(--ink);background:#fff;padding:14px 16px;font-size:17px}input:focus{border-color:var(--accent);outline:none}button{border-radius:var(--radius);background:var(--ink);color:#fff;cursor:pointer;border:none;width:100%;margin-top:20px;padding:16px;font-size:17px;font-weight:700}button:disabled{opacity:.5;cursor:not-allowed}button:active:not(:disabled){transform:scale(.98)}.error-box{background:var(--danger-bg);color:var(--danger);border-radius:10px;margin-top:16px;padding:12px 14px;font-size:14px;font-weight:500}.result-card{text-align:center;border-radius:20px;padding:32px 24px}.result-card.in{background:var(--success-bg);color:var(--success)}.result-card.out{background:var(--danger-bg);color:var(--danger)}.result-type{margin:8px 0 4px;font-size:34px;font-weight:800}.result-time{opacity:.8;font-size:15px}#qr-reader{border-radius:var(--radius);width:100%;overflow:hidden}.secondary-button{width:auto;color:var(--ink);border:1.5px solid var(--line);background:0 0;margin-top:0;margin-bottom:16px;padding:10px 16px;font-size:14px;font-weight:600}.punch-list{flex-direction:column;gap:10px;margin-top:20px;display:flex}.punch-item{border:1.5px solid var(--line);border-radius:var(--radius);background:#fff;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:14px 16px;display:flex}.punch-item-info{flex:auto;min-width:0}.punch-item-name{margin:0 0 2px;font-size:15px;font-weight:700}.punch-item-time{color:var(--muted);margin:0;font-size:13px}.badge{white-space:nowrap;border-radius:999px;align-items:center;padding:4px 10px;font-size:12px;font-weight:700;display:inline-flex}.badge-in{background:var(--success-bg);color:var(--success)}.badge-out{background:var(--danger-bg);color:var(--danger)}.punch-item-actions{flex-shrink:0;width:100%}.icon-button{background:var(--ink);color:#fff;border:none;border-radius:10px;width:100%;margin-top:0;padding:10px 14px;font-size:13px;font-weight:600}.result:hover{color:#fff;background-color:#000}.sheet-backdrop{z-index:40;background:#0006;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet-panel{background:var(--paper);width:100%;max-width:480px;padding:20px 20px calc(20px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0;max-height:85vh;animation:.2s ease-out sheet-up;overflow-y:auto}@keyframes sheet-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}.sheet-handle{background:var(--line);border-radius:999px;width:40px;height:4px;margin:0 auto 16px}.segmented{border:1.5px solid var(--line);border-radius:var(--radius);margin-top:6px;display:flex;overflow:hidden}.segmented button{color:var(--muted);background:#fff;border:none;border-radius:0;flex:1;margin:0;padding:12px;font-size:15px;font-weight:700}.segmented button.active.in{background:var(--success-bg);color:var(--success)}.segmented button.active.out{background:var(--danger-bg);color:var(--danger)}textarea{border:1.5px solid var(--line);border-radius:var(--radius);width:100%;font-size:15px;font-family:var(--font);resize:vertical;min-height:70px;padding:12px 14px}textarea:focus{border-color:var(--accent);outline:none}.sheet-actions{gap:10px;margin-top:20px;display:flex}.sheet-actions button{margin-top:0}.sheet-actions .cancel-button{color:var(--ink);border:1.5px solid var(--line);background:0 0}.range-container{width:100%}.range-container input{padding:14px 0}#minutes{width:100%;margin:0}.range-ticks{justify-content:space-between;padding:0 8px;display:flex}.range-ticks span{background:#000;width:2px;display:block}.range-labels{justify-content:space-between;margin-top:4px;padding:0 2px;font-size:14px;display:flex}.backboard{width:50%;display:flex}.backboard .app{justify-content:space-between;align-items:center;width:100%;display:flex}.backboard .app .results select{width:100%}.calculator-header{text-align:center;max-width:850px;margin:0 auto 35px}.calculator-header .eyebrow{color:#7d6b9b;background:#fff;border:1px solid #eeeaf4;border-radius:999px;margin-bottom:12px;padding:7px 13px;font-size:13px;font-weight:700;display:inline-block}.calculator-header h1{letter-spacing:-1.5px;margin:0;font-size:clamp(32px,5vw,52px);line-height:1.05}.calculator-header p{color:#858095;margin-top:15px;font-size:16px}.backboard{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffd9;border:1px solid #eeeaf4;border-radius:28px;width:min(100%,1000px);margin:auto;box-shadow:0 25px 70px #45365c1f,0 4px 12px #45365c0d}.form h2{letter-spacing:-.5px;margin:0 0 30px;font-size:24px}.field{margin-bottom:23px}.field label{color:#514c60;margin-bottom:8px;font-size:14px;font-weight:650;display:block}.field input[type=number]{box-sizing:border-box;color:#29263a;background:#fbfaff;border:2px solid #eeeaf4;border-radius:12px;outline:none;width:100%;padding:13px 15px;font-size:15px;transition:border-color .2s,box-shadow .2s,background .2s}.field input[type=number]:focus{background:#fff;border-color:#b59ce8;box-shadow:0 0 0 4px #b59ce826}.input-with-symbol{position:relative}.input-with-symbol span{color:#9186a5;font-weight:700;position:absolute;top:50%;left:15px;transform:translateY(-50%)}.input-with-symbol input{padding-left:32px!important}.range-container{width:100%;padding-top:5px}.range-labels{color:#9a93a8;justify-content:space-between;align-items:center;margin-top:5px;font-size:12px;display:flex}.range-labels strong{color:#7655ad;background:#f0e9ff;border-radius:999px;padding:4px 9px;font-size:13px}.results{text-align:center;background:linear-gradient(145deg,#f5efff,#fff4f7);border-radius:22px;flex-direction:column;justify-content:center;align-items:center;padding:35px;display:flex}.result-icon{background:#fff;border-radius:18px;place-items:center;width:62px;height:62px;margin-bottom:18px;font-size:28px;display:grid;box-shadow:0 8px 20px #5b43781a}.data h1{letter-spacing:-2px;color:red;margin:12px 0 10px;font-size:clamp(36px,5vw,54px)}.data .instructions{color:#91889c;max-width:280px;margin:auto;font-size:14px;line-height:1.5}.period-selector{width:100%;margin-top:35px}.period-selector label{color:#83798f;margin-bottom:7px;font-size:12px;font-weight:700;display:block}.period-selector select{color:#51485e;cursor:pointer;background:#fff;border:2px solid #e8dfef;border-radius:12px;outline:none;width:100%;padding:12px 14px;font-size:14px;font-weight:600}.period-selector select:focus{border-color:#b59ce8}@media (width<=750px){.screen{padding:35px 15px}.app{grid-template-columns:1fr;gap:30px;padding:25px}.results{padding:30px 20px}.calculator-header{margin-bottom:25px}}.range-container{width:100%}#minutes{accent-color:#9c7bd8;cursor:pointer;width:100%;margin:0}.range-labels{color:#9a93a8;justify-content:space-between;align-items:center;gap:10px;margin-top:5px;font-size:12px;display:flex}.range-labels strong{color:#7655ad;background:#f0e9ff;border-radius:999px;flex-shrink:0;padding:4px 9px;font-size:13px}.calculator-header{text-align:center;width:min(100%,850px);margin:0 auto 35px}.calculator-header .eyebrow{color:#7d6b9b;background:#fff;border:1px solid #eeeaf4;border-radius:999px;margin-bottom:12px;padding:7px 13px;font-size:13px;font-weight:700;display:inline-block}.calculator-header h1{letter-spacing:-1.5px;margin:0;font-size:clamp(32px,5vw,52px);line-height:1.05}.backboard{box-sizing:border-box;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffd9;border:1px solid #eeeaf4;border-radius:28px;width:min(100%,1000px);margin:0 auto;box-shadow:0 25px 70px #45365c1f,0 4px 12px #45365c0d}.app{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:55px;padding:50px;display:grid}.form{min-width:0}.form h2{letter-spacing:-.5px;margin:0 0 30px;font-size:24px}.field{width:100%;margin-bottom:23px}.field label{color:#514c60;margin-bottom:8px;font-size:14px;font-weight:650;display:block}.field input[type=number]{box-sizing:border-box;color:#29263a;background:#fbfaff;border:2px solid #eeeaf4;border-radius:12px;outline:none;width:100%;padding:13px 15px;font-size:15px;transition:border-color .2s,box-shadow .2s,background .2s}.field input[type=number]:focus{background:#fff;border-color:#b59ce8;box-shadow:0 0 0 4px #b59ce826}.input-with-symbol{width:100%;position:relative}.input-with-symbol span{color:#9186a5;font-weight:700;position:absolute;top:50%;left:15px;transform:translateY(-50%)}.input-with-symbol input{box-sizing:border-box;width:100%;padding-left:32px!important}.results{text-align:center;background:linear-gradient(145deg,#f5efff,#fff4f7);border-radius:22px;flex-direction:column;justify-content:center;align-items:center;min-width:0;padding:35px;display:flex}.result-label{color:#81778f;font-size:14px;font-weight:650}.data{max-width:100%}.data h1{letter-spacing:-2px;color:red;overflow-wrap:anywhere;margin:12px 0 10px;font-size:clamp(36px,5vw,54px)}.data .instructions{color:#91889c;max-width:280px;margin:auto;font-size:14px;line-height:1.5}.period-selector{width:100%;margin-top:35px}.period-selector label{color:#83798f;margin-bottom:7px;font-size:12px;font-weight:700;display:block}.period-selector select{box-sizing:border-box;color:#51485e;cursor:pointer;background:#fff;border:2px solid #e8dfef;border-radius:12px;outline:none;width:100%;padding:12px 14px;font-size:14px;font-weight:600}.period-selector select:focus{border-color:#b59ce8}@media (width<=900px){.app{gap:30px;padding:35px}}@media (width<=750px){.screen{box-sizing:border-box;width:100%;padding:30px 15px}.calculator-header{margin-bottom:22px}.calculator-header .eyebrow{margin-bottom:10px}.calculator-header h1{font-size:clamp(30px,9vw,42px)}.backboard{border-radius:20px;width:100%}.app{flex-direction:column;gap:30px;padding:25px 20px;display:flex}.form h2{margin-bottom:25px;font-size:21px}.field{margin-bottom:20px}.results{box-sizing:border-box;border-radius:18px;width:100%;padding:30px 20px}.data h1{font-size:clamp(34px,12vw,48px)}.period-selector{margin-top:28px}}@media (width<=400px){.screen{padding:25px 10px}.app{padding:22px 16px}.calculator-header h1{font-size:30px}.results{padding:25px 16px}.range-labels{font-size:11px}.range-labels strong{font-size:12px}}
