:root{--bg: #eef3ee;--bg-soft: #e3ebe3;--card: #ffffff;--ink: #24312a;--ink-muted: #6f7d74;--sage: #5c8267;--sage-deep: #3f5f4b;--peach: #f0a868;--peach-soft: #fbe4cc;--border: #dbe6dc;--radius: 18px;--shadow: 0 10px 30px -14px rgba(37, 55, 44, .18)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--ink);font-family:Tajawal,sans-serif;min-height:100vh;background-image:radial-gradient(circle at 12% 8%,var(--bg-soft) 0%,transparent 40%),radial-gradient(circle at 88% 92%,var(--peach-soft) 0%,transparent 35%);background-attachment:fixed}.page{max-width:640px;margin:0 auto;padding:56px 24px 80px}.hero{margin-bottom:36px}.hero-eyebrow{font-family:Cairo,sans-serif;font-weight:600;font-size:13px;letter-spacing:.04em;color:var(--sage-deep);background:var(--sage);background:color-mix(in srgb,var(--sage) 14%,transparent);display:inline-block;padding:6px 14px;border-radius:999px;margin-bottom:14px}.hero h1{font-family:Cairo,sans-serif;font-weight:800;font-size:34px;margin:0 0 8px;color:var(--sage-deep)}.hero p{margin:0;color:var(--ink-muted);font-size:15px;line-height:1.7}.tabs{display:flex;gap:8px;margin-bottom:20px}.tab-btn{font-family:Cairo,sans-serif;font-weight:600;font-size:14px;padding:9px 20px;border:1.5px solid var(--border);border-radius:999px;background:#fbfdfb;color:var(--ink-muted);cursor:pointer;transition:all .15s ease}.tab-btn:hover{border-color:var(--sage);color:var(--sage-deep)}.tab-btn.active{background:var(--sage-deep);border-color:var(--sage-deep);color:#fff}.app-shell{display:flex;min-height:100vh}.sidebar{width:240px;flex-shrink:0;background:var(--card);border-left:1px solid var(--border);padding:28px 20px;display:flex;flex-direction:column;gap:32px}.sidebar-brand{display:flex;align-items:center;gap:10px;font-family:Cairo,sans-serif;font-weight:800;font-size:16px;color:var(--sage-deep);padding:0 10px}.brand-dot{width:10px;height:10px;border-radius:50%;background:var(--peach);flex-shrink:0}.sidebar-nav{display:flex;flex-direction:column;gap:6px}.nav-item{display:flex;align-items:center;gap:12px;width:100%;padding:11px 14px;border:none;border-radius:12px;background:transparent;color:var(--ink-muted);font-family:Tajawal,sans-serif;font-weight:500;font-size:14.5px;cursor:pointer;text-align:right;transition:background .15s ease,color .15s ease}.nav-item:hover{background:var(--bg-soft);color:var(--sage-deep)}.nav-item.active{background:var(--sage-deep);color:#fff}.nav-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}.main-content{flex:1;min-width:0}.main-content .page{max-width:640px;margin:0;padding:48px 40px 80px}@media (max-width: 720px){.app-shell{flex-direction:column}.sidebar{width:100%;flex-direction:row;align-items:center;justify-content:space-between;border-left:none;border-bottom:1px solid var(--border);padding:16px 20px}.sidebar-nav{flex-direction:row;gap:4px}.nav-item span:last-child{display:none}.main-content .page{padding:32px 20px 60px;max-width:100%}}.mode-toggle{display:flex;gap:8px;margin-bottom:18px}.attendance-actions{display:flex;gap:10px}.attendance-actions .submit-btn{flex:1;width:auto}.secondary-btn{background:transparent;color:var(--sage-deep);border:1.5px solid var(--sage-deep)}.secondary-btn:hover:not(:disabled){background:var(--bg-soft)}.info-box{margin-top:16px;padding:14px 16px;border-radius:12px;background:var(--peach-soft);color:var(--ink);font-size:14px;line-height:1.8}.info-time{font-family:Cairo,sans-serif;font-weight:700;font-size:15px;color:var(--sage-deep);margin-top:2px}.exit-tag{background:var(--peach-soft);color:#a05a1e}.print-btn{margin-top:18px;background:var(--peach)}.print-btn:hover:not(:disabled){background:#e0964f}@media print{body{background:#fff}.sidebar,.hero,.no-print{display:none!important}.app-shell,.main-content,.main-content .page{display:block;padding:0;margin:0;max-width:100%}#printable-report{box-shadow:none;border:none;padding:0}#printable-report .section-title{font-size:20px;border-bottom:2px solid var(--ink);padding-bottom:10px;margin-bottom:16px}.user-item{border:none;border-bottom:1px solid #ddd;border-radius:0;padding:10px 4px}}.manual-exit-box{margin-top:14px;padding-top:14px;border-top:1px solid rgba(63,95,75,.15)}.manual-exit-box .form-row label{color:var(--sage-deep)}.manual-exit-inputs{display:flex;gap:8px}.manual-exit-inputs input{flex:1}.notes-row textarea{font-family:Tajawal,sans-serif;font-size:14px;padding:10px 12px;border-radius:12px;border:1.5px solid var(--border);background:#fbfdfb;color:var(--ink);resize:vertical;outline:none}.notes-row textarea:focus{border-color:var(--sage);box-shadow:0 0 0 4px color-mix(in srgb,var(--sage) 16%,transparent)}.notes-row .secondary-btn{margin-top:10px}.table-wrap{overflow-x:auto}.report-table{width:100%;border-collapse:collapse;font-family:Tajawal,sans-serif;font-size:13.5px}.report-table th,.report-table td{padding:10px 12px;text-align:right;border-bottom:1px solid var(--border);white-space:nowrap}.report-table th{font-family:Cairo,sans-serif;font-weight:700;font-size:12.5px;color:var(--sage-deep);background:var(--bg-soft)}.report-table tbody tr:hover{background:#fbfdfb}.report-actions{display:flex;gap:8px}.print-btn{margin-top:0;width:auto;padding:8px 18px;font-size:13px}@media print{.report-table th{background:transparent;border-bottom:2px solid var(--ink)}}.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px}.card+.card{margin-top:24px}.form-row{display:flex;flex-direction:column;gap:6px;margin-bottom:18px}.form-row label{font-family:Cairo,sans-serif;font-weight:600;font-size:14px;color:var(--sage-deep)}.form-row input,.form-row select{font-family:Tajawal,sans-serif;font-size:15px;padding:12px 14px;border-radius:12px;border:1.5px solid var(--border);background:#fbfdfb;color:var(--ink);outline:none;transition:border-color .15s ease,box-shadow .15s ease}.form-row input:focus,.form-row select:focus{border-color:var(--sage);box-shadow:0 0 0 4px color-mix(in srgb,var(--sage) 16%,transparent)}.submit-btn{width:100%;font-family:Cairo,sans-serif;font-weight:700;font-size:15px;padding:13px 20px;border:none;border-radius:12px;background:var(--sage-deep);color:#fff;cursor:pointer;transition:transform .12s ease,background .15s ease}.submit-btn:hover:not(:disabled){background:var(--sage)}.submit-btn:active:not(:disabled){transform:scale(.98)}.submit-btn:disabled{opacity:.6;cursor:not-allowed}.error-msg{font-size:13px;color:#b3543c;background:#fbe9e3;border-radius:10px;padding:10px 14px;margin-bottom:16px}.section-title{font-family:Cairo,sans-serif;font-weight:700;font-size:15px;color:var(--sage-deep);margin:0 0 16px;display:flex;align-items:center;justify-content:space-between}.count-pill{font-family:Tajawal,sans-serif;font-weight:500;font-size:12px;color:var(--ink-muted);background:var(--bg-soft);padding:4px 10px;border-radius:999px}.user-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.user-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:12px;background:#fbfdfb;border:1px solid var(--border)}.user-name{font-family:Cairo,sans-serif;font-weight:600;font-size:15px;color:var(--ink)}.dept-tag{font-family:Tajawal,sans-serif;font-weight:500;font-size:12.5px;padding:5px 12px;border-radius:999px;white-space:nowrap}.empty-state,.loading-state{text-align:center;padding:30px 10px;color:var(--ink-muted);font-size:14px}.print-title{text-align:center;font-size:42px;font-weight:700;margin:0 0 20px;color:#2d4f3d}