:root{--bg-start: #0b1220;--bg-end: #111827;--surface: #111827;--surface-strong: #1f2937;--surface-soft: #18202a;--border: rgba(148, 163, 184, .16);--accent: #38bdf8;--accent-strong: #22c55e;--text: #f8fafc;--muted: #94a3b8;--success: #10b981;--warning: #f59e0b;--danger: #ef4444}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(circle at top,#243b5b 0%,var(--bg-start) 55%,var(--bg-end) 100%);color:var(--text);font-family:Inter,system-ui,sans-serif}button,input,select{font:inherit}button{cursor:pointer}.app-shell{width:100%;min-height:100vh;padding:24px}.admin-shell{max-width:1280px;margin:0 auto}.login-wrapper{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}.login-card{width:100%;max-width:420px;padding:32px;border-radius:28px;background:#0f172af2;box-shadow:0 28px 70px #00000059;border:1px solid rgba(148,163,184,.12)}.login-card h1{font-size:2rem;margin-bottom:10px}.login-description{color:var(--muted);margin-bottom:28px}.login-card label{display:block;margin-bottom:18px;color:var(--muted)}.login-card input{width:100%;padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:14px;color:var(--text);margin-top:8px}.btn{border:none;border-radius:14px;padding:12px 18px;color:#fff;font-weight:600;transition:transform .16s ease,filter .16s ease}.btn:hover{transform:translateY(-1px)}.btn-primary{background:linear-gradient(135deg,#3b82f6,#0ea5e9)}.btn-success{background:linear-gradient(135deg,#22c55e,#16a34a)}.btn-warning{background:linear-gradient(135deg,#f59e0b,#ea580c)}.btn-danger{background:linear-gradient(135deg,#ef4444,#dc2626)}.btn-secondary{background:#ffffff14;color:var(--text);border:1px solid rgba(148,163,184,.15)}.btn-outline{background:transparent;border:1px solid rgba(255,255,255,.18)}.btn-small{padding:10px 14px;font-size:.94rem}.status-message,.status-banner{margin-top:18px;padding:14px 18px;border-radius:16px;background:#38bdf81f;color:#e0f2fe;border:1px solid rgba(56,189,248,.2)}.admin-topbar{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;margin-bottom:28px;flex-wrap:wrap}.admin-topbar h1{margin:0;font-size:clamp(2rem,2.6vw,3rem)}.admin-topbar p{max-width:620px;color:var(--muted);margin-top:10px}.topbar-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end}.dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-bottom:28px}.info-card{background:#0f172af2;border:1px solid rgba(148,163,184,.12);border-radius:24px;padding:28px;min-height:150px}.info-card p{color:var(--muted);margin-bottom:16px}.info-card span{display:block;font-size:3rem;font-weight:700;color:var(--text)}.section-panel{background:#0f172af2;border:1px solid rgba(148,163,184,.12);border-radius:24px;padding:28px;margin-bottom:28px}.section-header{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:24px}.section-header h2{margin:0;font-size:1.65rem}.section-header p{color:var(--muted);max-width:640px}.section-header.spaced{align-items:center}.month-controls{display:grid;grid-template-columns:minmax(220px,1fr) repeat(2,auto);gap:12px;width:100%}.month-controls select,.upload-card input{width:100%;border-radius:14px;border:1px solid rgba(148,163,184,.18);background:var(--surface);color:var(--text);padding:14px 16px}.upload-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.bulk-upload-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-bottom:24px}.upload-card{background:#1f2937f5;border:1px solid rgba(148,163,184,.12);padding:24px;border-radius:24px}.upload-card.upload-manual-card{grid-column:span 2}.manual-action-bar{display:grid;grid-template-columns:auto minmax(180px,1fr);align-items:center;gap:12px;margin-bottom:18px}.manual-search{width:100%;border-radius:14px;border:1px solid rgba(148,163,184,.18);background:var(--surface);color:var(--text);padding:14px 16px}.employee-table-panel{margin-top:24px}.table-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px;flex-wrap:wrap}.table-summary{color:var(--text);font-weight:700}.employee-table{border-radius:24px;overflow:hidden;background:#0f172af5;border:1px solid rgba(148,163,184,.12)}.table-row{display:grid;grid-template-columns:1.2fr 2fr 1fr 1.2fr 1.8fr;padding:16px 18px;gap:12px;align-items:center;border-bottom:1px solid rgba(148,163,184,.08)}.table-row:last-child{border-bottom:none}.table-header{background:#1e293bf2;color:var(--muted);font-size:.95rem;text-transform:uppercase;letter-spacing:.05em}.table-actions{display:flex;gap:10px;justify-content:flex-end}@media (max-width: 980px){.table-row{grid-template-columns:1fr;grid-template-rows:auto auto;gap:10px;text-align:left}.table-row .table-actions{justify-content:flex-start}}@media (max-width: 720px){.manual-action-bar{grid-template-columns:1fr}.table-row{padding:14px}}.upload-card label{display:block;margin-top:16px;color:var(--muted);font-size:.95rem}.upload-card label input{margin-top:10px}.manual-prompt{color:var(--muted);margin:18px 0 0;padding:18px;border:1px dashed rgba(148,163,184,.3);border-radius:18px;background:#ffffff08}.upload-card .btn,.employee-table .btn{width:100%;justify-content:center}.upload-card input[type=file]{border-radius:14px;padding:14px 12px}.upload-card.upload-manual-card{position:relative}.upload-manual-card h3{margin-top:0;margin-bottom:18px;color:var(--text)}.hint-text{color:var(--muted);margin-top:10px;font-size:.95rem}.bulk-upload-panel,.employee-table{width:100%}.upload-card{box-shadow:0 22px 50px #00000029;background:#0f172afa;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.upload-card h3,.section-header h2,.info-card span{letter-spacing:.02em}.table-actions .btn{min-width:110px}.table-actions .btn:hover{transform:translateY(-1px)}.view-modal{padding:18px}.view-card{width:min(100%,680px);max-width:100%;padding:24px;max-height:92vh;overflow-y:auto}.view-card-body{display:grid;grid-template-columns:1fr;gap:18px;align-items:start;justify-items:stretch;width:100%;min-height:260px}.view-card-body img{width:100%;height:auto;border-radius:20px;max-width:560px}.view-card-body label{width:100%}.modal-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end;margin-top:16px;width:100%}.modal-actions .btn{min-width:140px}@media (max-width: 720px){.bulk-upload-panel{grid-template-columns:1fr}.upload-card{padding:20px;border-radius:26px}.upload-card .btn,.table-actions .btn{width:100%}.table-row{grid-template-columns:1fr}.table-actions{flex-direction:column;align-items:stretch}.view-card{padding:22px}}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}.emp-card{background:#ffffff0d;border:1px solid rgba(148,163,184,.12);border-radius:28px;padding:22px;display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;min-height:150px;transition:transform .22s ease,box-shadow .22s ease;transform-style:preserve-3d}.emp-card:hover{transform:translateY(-4px) rotateX(1.3deg) translateZ(2px);box-shadow:0 24px 50px #0f172a47}.emp-card-info{text-align:left}.emp-card-info h3{margin:0 0 10px;font-size:1.25rem}.emp-card-info p{margin:8px 0;color:var(--muted)}.emp-card-actions{display:flex;flex-direction:column;gap:10px;align-items:stretch;justify-content:center}.emp-card-actions .btn{width:100%}.view-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:grid;place-items:center;padding:24px;z-index:1000}.view-card{width:min(640px,100%);background:#0f172afa;border-radius:28px;border:1px solid rgba(148,163,184,.16);padding:28px}.view-card-header{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:24px}.view-card-header h2{margin:0 0 8px}.view-card-body{display:grid;grid-template-columns:1fr;gap:16px;align-items:start;justify-items:stretch;width:100%;min-height:240px}.view-card-body img{width:100%;max-width:420px;border-radius:24px;object-fit:cover;box-shadow:0 28px 70px #00000059}.view-card-body label{display:block;color:var(--muted);font-size:.95rem}.view-card-body label input{width:100%;margin-top:10px;padding:14px 16px;border-radius:14px;border:1px solid rgba(148,163,184,.18);background:var(--surface);color:var(--text)}.modal-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}.emp-card h3{margin:0 0 10px;font-size:1.25rem}.emp-card p{margin:6px 0;color:var(--muted)}.empty-state{grid-column:1 / -1;background:#1e293be6;border-radius:24px;padding:36px;text-align:center;border:1px dashed rgba(148,163,184,.2)}.tv-page{min-height:100vh;position:relative;overflow:hidden;background:#000;color:#fff;display:grid;place-items:center;padding:0}.bg{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(270deg,#24c6dc,#514a9d,#dd2476);background-size:600% 600%;animation:bg 18s ease infinite;z-index:-2}@keyframes bg{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.flash{position:absolute;top:0;right:0;bottom:0;left:0;background:#fff;opacity:0;pointer-events:none}.flash.active{animation:flashAnim 1s ease}@keyframes flashAnim{0%{opacity:0}50%{opacity:1}to{opacity:0}}.tv-body{width:100%;min-height:100vh;display:grid;place-items:center;padding:40px;z-index:1}.countdown{font-size:clamp(8rem,18vw,14rem);font-weight:700;text-shadow:0 0 40px white;animation:countAnim 1s ease infinite}@keyframes countAnim{0%{transform:scale(.5) rotateY(90deg);opacity:0}50%{transform:scale(1.2) rotateY(0);opacity:1}to{transform:scale(1);opacity:1}}.card{width:min(92vw,1600px);height:min(80vh,820px);padding:70px 100px;border-radius:40px;background:#00000073;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);display:flex;align-items:center;justify-content:space-between;gap:100px;animation:flipIn 1.2s ease}.card-text{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.card-text h1{font-size:clamp(4rem,7vw,9rem);margin:0 0 30px}.card-text h2{font-size:clamp(3rem,6vw,6rem);margin:15px 0}.card-text p{font-size:clamp(1.75rem,2.5vw,2.5rem);margin:10px 0;opacity:.9}.card img{flex:1;height:100%;max-width:45%;object-fit:contain;object-position:center;border-radius:35px;background:#00000040;box-shadow:0 35px 100px #000000e6;animation:slowZoom 8s ease-in-out infinite alternate}@keyframes slowZoom{0%{transform:scale(1)}to{transform:scale(1.05)}}@keyframes flipIn{0%{transform:perspective(1000px) rotateY(90deg) scale(.7);opacity:0}to{transform:perspective(1000px) rotateY(0) scale(1);opacity:1}}.tv-empty{display:grid;place-items:center;text-align:center}.tv-empty h1{font-size:clamp(3rem,6vw,4.5rem);margin-bottom:18px}.confetti{position:absolute;width:12px;height:12px;border-radius:4px;opacity:.9;pointer-events:none;animation:fall linear infinite;z-index:1}@keyframes fall{to{transform:translateY(100vh) rotate(360deg)}}@media (max-width: 980px){.dashboard-grid,.upload-grid,.month-controls,.tv-card{grid-template-columns:1fr}}.mobile-nav{display:none;position:fixed;bottom:16px;left:50%;transform:translate(-50%);width:min(100%,680px);grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:12px;background:#0f172aeb;border:1px solid rgba(148,163,184,.16);border-radius:34px;box-shadow:0 20px 60px #00000059;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:999}.mobile-nav-button{min-width:0;border:none;border-radius:22px;padding:16px 14px;background:linear-gradient(145deg,#ffb3471f,#ec489929);color:var(--text);font-weight:700;font-size:.88rem;overflow:hidden;box-shadow:0 20px 40px #0d1b3547;transition:transform .22s ease,box-shadow .22s ease,background .22s ease;transform-style:preserve-3d;position:relative;z-index:1}.mobile-nav-button:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:22px;background:radial-gradient(circle at top left,rgba(56,189,248,.22),transparent 38%),radial-gradient(circle at bottom right,rgba(34,197,94,.18),transparent 42%);opacity:.85;pointer-events:none;transition:opacity .22s ease}.mobile-nav-button:hover,.mobile-nav-button:focus-visible{transform:translateY(-6px) rotateX(6deg) translateZ(4px);box-shadow:0 28px 50px #0d1b3580}.mobile-nav-button:active{transform:translateY(-2px) rotateX(2deg) translateZ(2px)}.mobile-nav-button.active{background:linear-gradient(135deg,#f97316,#ec4899);box-shadow:0 28px 60px #ec489959}.mobile-nav-button.active:before{opacity:1}.mobile-nav-button,.mobile-nav-button.active{animation:floatGlow 4.8s ease-in-out infinite}@keyframes floatGlow{0%,to{transform:translateY(0) rotateX(0) translateZ(0);box-shadow:0 20px 40px #0d1b3547}50%{transform:translateY(-4px) rotateX(4deg) translateZ(2px);box-shadow:0 28px 55px #0d1b3573}}@media (max-width: 720px){.admin-topbar{padding:0}.topbar-actions{display:none}.section-panel,.login-card{padding:22px}.emp-card{padding:20px;grid-template-columns:1fr}.info-card{padding:22px}.mobile-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:fixed;bottom:12px;left:50%;transform:translate(-50%);width:calc(100% - 24px);padding:10px;gap:8px}.section-panel .upload-grid .upload-card:nth-child(1),.section-panel .upload-grid .upload-card:nth-child(2){display:none}.app-shell{padding-bottom:100px}}