@import "https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700;800&family=Inter:wght@300;400;500;600;700;800&display=swap";
:root{--gold:#d4a853;--gold-light:#f5e6c8;--gold-dark:#b8922e;--gold-metallic:linear-gradient(135deg, #b8922e 0%, #d4a853 50%, #f5e6c8 100%);--gold-glow:0 0 20px #d4a8534d;--green-deep:#0d6b3e;--green-main:#10b981;--green-light:#ecfdf5;--green-50:#f0fdf4;--green-glass:#0d6b3e0d;--bg-primary:#f0fdf4;--bg-secondary:#fff;--bg-card:#ffffffd9;--bg-input:#fff;--bg-hover:#f0fdf4;--text-primary:#1e293b;--text-secondary:#475569;--text-muted:#94a3b8;--accent-gold:#d4a853;--danger:#ef4444;--danger-bg:#fef2f2;--warning:#f59e0b;--warning-bg:#fffbeb;--border:#e2e8f099;--border-gold:#d4a85340;--radius:20px;--radius-sm:12px;--shadow-premium:0 10px 30px #0000000a, 0 1px 8px #00000005;--font:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-serif:"Playfair Display", serif;--accent:#10b981!important;--accent-hover:#059669!important;--accent-light:#ecfdf5!important;--success:#10b981!important;--success-bg:#ecfdf5!important}*{box-sizing:border-box;margin:0;padding:0}html,body{background-color:var(--bg-primary);color:var(--text-primary);font-family:var(--font);-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 10% 20%,#d4a85308 0%,#0000 40%),radial-gradient(circle at 90% 80%,#10b98108 0%,#0000 40%);max-width:100vw;min-height:100vh;margin:0;padding:0;overflow-x:hidden}.premium-login-container{min-height:100vh;font-family:var(--font);background:linear-gradient(135deg,#f0fdf4 0%,#dcfce7 100%);justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.floating-icons{z-index:1;pointer-events:none;position:absolute;inset:0;overflow:hidden}.float-icon{color:#10b98166;filter:drop-shadow(0 4px 6px #10b9814d);will-change:transform, opacity;animation:linear infinite floatUp;position:absolute;bottom:-100px}@keyframes floatUp{0%{opacity:0;transform:translate(0)rotate(0)scale(.8)}20%{opacity:1;transform:translate(-30px,-20vh)rotate(45deg)scale(1)}50%{transform:translate(30px,-50vh)rotate(180deg)scale(1.1)}80%{opacity:1;transform:translate(-15px,-80vh)rotate(270deg)scale(1.2)}to{opacity:0;transform:translateY(-110vh)rotate(360deg)scale(1)}}.float-icon.i-1{animation-duration:26s;animation-delay:0s;left:12%}.float-icon.i-2{animation-duration:32s;animation-delay:-5s;left:30%}.float-icon.i-3{animation-duration:22s;animation-delay:-12s;left:45%}.float-icon.i-4{animation-duration:35s;animation-delay:-8s;left:70%}.float-icon.i-5{animation-duration:24s;animation-delay:-2s;left:85%}.float-icon.i-6{animation-duration:28s;animation-delay:-15s;left:92%}.float-icon.i-7{animation-duration:25s;animation-delay:-18s;left:55%}.float-icon.i-8{animation-duration:36s;animation-delay:-9s;left:6%}.bg-blobs{position:absolute}.login-wrapper{z-index:10;width:100%;max-width:440px;padding:20px;animation:.8s ease-out fadeIn;position:relative}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.premium-login-card{-webkit-backdrop-filter:blur(12px);background:#ffffffd9;border:1px solid #ffffff4d;border-radius:24px;width:100%;padding:40px;box-shadow:0 20px 40px #0000000d,0 1px 3px #00000005}.login-header{align-items:center;gap:16px;margin-bottom:32px;display:flex}.mascot-anim{background:#fff;border-radius:18px;justify-content:center;align-items:center;width:72px;height:72px;padding:6px;animation:4s ease-in-out infinite floatMascot;display:flex;box-shadow:0 8px 16px #10b9811a}@keyframes floatMascot{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.input-group{margin-bottom:24px}.input-group label{color:#64748b;margin-bottom:8px;font-size:.85rem;font-weight:700;display:block}.input-wrapper{align-items:center;display:flex;position:relative}.input-wrapper svg{color:#94a3b8;pointer-events:none;position:absolute;left:14px}.input-wrapper input{color:#1e293b;background:#fff;border:1.5px solid #e2e8f0;border-radius:12px;width:100%;padding:14px 14px 14px 44px;font-size:.95rem;transition:all .2s}.input-wrapper input:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 4px #10b9811a}.premium-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:14px;justify-content:center;align-items:center;gap:10px;width:100%;padding:16px;font-size:1rem;font-weight:700;transition:all .3s;display:flex;box-shadow:0 10px 15px -3px #10b9814d}.premium-btn:hover:not(:disabled){background:var(--accent-hover);transform:translateY(-2px);box-shadow:0 12px 20px -3px #10b98166}.premium-btn:active:not(:disabled){transform:translateY(0)}.premium-btn:disabled{opacity:.7;cursor:not-allowed}.logout-btn-premium{color:var(--text-secondary);border:1px solid var(--border);background:0 0;transition:all .3s}.logout-btn-premium:hover{border-color:var(--accent-gold);color:var(--gold-dark);background:#d4a8530d;box-shadow:0 0 15px #d4a8531a}.form-group{margin-bottom:24px}.form-group input,.form-group select,.form-group textarea{border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);font-size:.95rem;font-family:var(--font);background:#fff;outline:none;padding:12px 16px;transition:all .2s}.btn{border-radius:var(--radius-sm);cursor:pointer;font-size:.95rem;font-weight:600;font-family:var(--font);border:none;justify-content:center;align-items:center;gap:10px;padding:12px 24px;text-decoration:none;transition:all .2s;display:inline-flex}.btn:active{transform:scale(.98)}.btn-primary{background:linear-gradient(135deg, var(--green-deep), var(--green-main));color:#fff;border:1px solid #ffffff1a;position:relative;overflow:hidden;box-shadow:0 4px 15px #0d6b3e40}.btn-primary:after{content:"";pointer-events:none;background:radial-gradient(circle,#ffffff1a 0%,#0000 70%);width:200%;height:200%;transition:transform .6s;position:absolute;top:-50%;left:-50%}.btn-primary:hover{background:linear-gradient(135deg, var(--green-main), var(--green-deep));transform:translateY(-2px);box-shadow:0 8px 25px #0d6b3e59}.btn-primary:hover:after{transform:translate(25%,25%)}.btn-success{color:#fff;background:#10b981}.btn-danger{color:#fff;background:#ef4444}.btn-outline{color:var(--text-secondary);border:1px solid var(--border);background:#fff}.btn-outline:hover{background:var(--bg-hover);color:var(--text-primary);border-color:var(--text-muted)}.btn-sm{padding:8px 16px;font-size:.85rem}.btn-full{width:100%}.btn-group{flex-wrap:wrap;gap:10px;display:flex}.action-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex}.action-btn svg{stroke-width:2px;width:20px;height:20px}.action-btn:hover{color:var(--accent);background:var(--bg-hover)}.action-btn.delete:hover{color:var(--danger);background:var(--danger-bg)}.input{border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);font-family:var(--font);background-color:#fff;outline:none;padding:10px 14px;font-size:.95rem;transition:border-color .2s,box-shadow .2s}.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #10b98126}select.input{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2364748b'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");background-position:right 14px center;background-repeat:no-repeat;background-size:16px;padding-right:40px}.app-layout{min-height:100vh;display:flex}.sidebar{background:var(--green-deep);z-index:1000;border-right:1px solid #ffffff1a;flex-direction:column;width:270px;transition:transform .3s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;bottom:0;left:0;box-shadow:4px 0 15px #0000001a}.overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:999;opacity:0;pointer-events:none;background:#0f172a99;transition:all .3s;position:fixed;inset:0}.overlay.show{opacity:1;pointer-events:auto}.sidebar-header{border-bottom:1px solid #ffffff1a;padding:24px}.sidebar-header h2{color:var(--accent);font-size:1.25rem;font-weight:800}.sidebar-header .user-info{color:var(--text-secondary);margin-top:6px;font-size:.85rem;font-weight:500}.user-role{text-transform:uppercase;border-radius:99px;margin-top:8px;padding:2px 10px;font-size:.75rem;font-weight:700;display:inline-block}.role-admin{color:#10b981;background:#ecfdf5}.role-agen{color:#fff;background:#ffffff1a}.sidebar-nav{flex:1;padding:16px;overflow-y:auto}.nav-section{color:#ffffff4d;text-transform:uppercase;letter-spacing:.15em;padding:24px 14px 12px;font-size:.7rem;font-weight:800;position:relative}.nav-section:after{content:"";background:#ffffff1a;width:20px;height:1px;position:absolute;bottom:8px;left:14px}.nav-link{color:#ffffffb3;background:0 0;border-radius:12px;align-items:center;gap:12px;width:100%;margin-bottom:2px;padding:12px 14px;font-size:.95rem;font-weight:500;text-decoration:none;transition:all .3s;display:flex}.nav-link:hover{color:#fff;background:#ffffff0d}.nav-link.active{border-left:3px solid var(--gold);border-radius:0 12px 12px 0;margin-left:-16px;padding-left:27px;font-weight:700;color:var(--gold)!important;background:linear-gradient(90deg,#d4a85326,#0000)!important}.nav-link.active svg{filter:drop-shadow(0 0 5px #d4a85380);color:var(--gold)!important}.nav-link svg{stroke:currentColor;stroke-width:2px;fill:none;width:20px;height:20px;transition:all .2s}.main-content{flex:1;min-width:0;max-width:100vw;margin-left:270px;padding:0}.topbar{-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border);z-index:50;background:#ffffffb3;justify-content:space-between;align-items:center;padding:14px 24px;display:flex;position:sticky;top:0}.topbar h2{color:var(--text-primary);font-size:1.1rem;font-weight:700}.hamburger{color:var(--text-primary);cursor:pointer;background:0 0;border:none;font-size:1.5rem;display:none}.period-badge{white-space:nowrap;text-shadow:0 1px 2px #0000001a;border-radius:99px;align-items:center;gap:8px;padding:8px 18px;font-size:.85rem;font-weight:800;display:flex;box-shadow:0 4px 15px #b8922e4d;background:var(--gold-metallic)!important;color:#fff!important;border:none!important}.page-content{min-width:0;max-width:100%;padding:32px}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:32px;display:flex}.page-header h1{color:#1e293b;font-size:1.75rem;font-weight:800}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-bottom:32px;display:grid}.stat-card{background:var(--bg-card);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border);border-left:4px solid var(--accent-gold);border-radius:var(--radius);box-shadow:var(--shadow-premium);align-items:center;gap:20px;padding:28px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.stat-card:hover{border-color:var(--accent-gold);transform:translateY(-5px);box-shadow:0 15px 35px #d4a8531f}.stat-icon-wrapper{border-radius:14px;justify-content:center;align-items:center;width:56px;height:56px;display:flex}.stat-emerald .stat-icon-wrapper{color:#10b981;background:#ecfdf5}.stat-slate .stat-icon-wrapper{color:#475569;background:#f1f5f9}.stat-emerald-dark .stat-icon-wrapper{color:#059669;background:#d1fae5}.stat-slate-light .stat-icon-wrapper{color:#334155;background:#f8fafc}.stat-luxury .stat-icon-wrapper{background:var(--gold-metallic);color:#fff;box-shadow:0 5px 15px #b8922e4d}.stat-icon-wrapper svg{stroke:currentColor;fill:none;width:28px;height:28px}.stat-info{flex:1}.stat-label{color:var(--text-secondary);margin-bottom:4px;font-size:.85rem;font-weight:500}.stat-value{color:var(--text-primary);font-size:1.5rem;font-weight:800}.card{background:var(--bg-card);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border);border-top:2px solid var(--accent-gold);border-radius:var(--radius);box-shadow:var(--shadow-premium);min-width:0;max-width:100%;padding:32px;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.card:hover{border-color:var(--border-gold);transform:translateY(-4px);box-shadow:0 20px 40px #d4a85314,0 1px 12px #00000008}.card-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.card-header h3{color:var(--text-primary);font-size:1rem;font-weight:700}.table-wrapper{width:100%;padding:0 24px 24px;overflow-x:auto}table{border-collapse:collapse;width:100%}th,td{text-align:left;border-bottom:1px solid #f1f5f9;padding:16px 20px}th{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border);background:#f8fafc;font-size:.75rem;font-weight:700}.table-controls{border-bottom:1px dashed var(--border);background:#fff;justify-content:space-between;align-items:center;gap:16px;padding:24px 24px 16px;display:flex}.search-wrapper{flex:1;max-width:400px;position:relative}.search-wrapper input{border:1px solid var(--border);width:100%;height:48px;color:var(--text-primary);background:#fff;border-radius:12px;outline:none;padding-left:48px;font-size:.95rem;transition:all .2s}.search-wrapper input:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-light)}.search-wrapper svg{color:var(--text-muted);pointer-events:none;stroke-width:2px;width:20px;height:20px;position:absolute;top:50%;left:18px;transform:translateY(-50%)}.pagination-controls{border-top:1px solid var(--border);color:var(--text-secondary);background:#f8fafc;align-items:center;gap:12px;padding:16px 24px;font-size:.85rem;display:flex}.pagination-buttons{gap:4px;margin-left:auto;display:flex}.btn-pagination{border:1px solid var(--border);width:32px;height:32px;color:var(--text-primary);cursor:pointer;background:#fff;border-radius:6px;justify-content:center;align-items:center;transition:all .2s;display:flex}.btn-pagination:hover:not(:disabled){background:var(--accent-light);color:var(--accent);border-color:var(--accent)}.btn-pagination:disabled{opacity:.4;cursor:not-allowed}td{color:var(--text-primary);border-bottom:1px solid #f1f5f9;padding:16px 20px;font-size:.95rem}tr:last-child td{border-bottom:none}tr:hover td{background:#f8fafc}tr[style] td,tr[style]:hover td{background:inherit!important}.badge{border-radius:99px;padding:4px 12px;font-size:.75rem;font-weight:600}.badge-success{color:#059669;background:#ecfdf5}.badge-danger{color:#dc2626;background:#fef2f2}.badge-info{color:#0369a1;background:#f0f9ff}.setoran-grid{grid-template-columns:repeat(7,1fr);gap:6px;display:grid}.day-header{text-align:center;color:var(--text-secondary);text-transform:uppercase;padding:8px 4px;font-size:.7rem;font-weight:700}.day-cell{border:1px solid var(--border);aspect-ratio:1;cursor:pointer;background:#fff;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:2px;transition:all .15s;display:flex;position:relative}.day-cell:active:not(.disabled){transform:scale(.92)}.day-cell.setor{color:#fff;background:#10b981;border-color:#10b981}.day-cell.setor:active{background:#059669}.day-cell.today{border-width:2.5px;border-color:var(--accent);box-shadow:0 0 0 3px #10b98126}.day-cell.disabled{opacity:.3;cursor:default;pointer-events:none;background:#f8fafc}.day-cell.empty{background:0 0;border:none}.day-number{font-size:.9rem;font-weight:700;line-height:1}.day-icon-status{justify-content:center;align-items:center;line-height:1;display:flex}.day-status{font-size:.7rem}@media (max-width:1024px){.sidebar{width:240px}.main-content{margin-left:240px}.login-wrapper{gap:40px}}@media (max-width:900px){.login-wrapper{flex-direction:column;padding-bottom:60px}.login-mascot img{width:200px;height:auto}}.bottom-nav{display:none}@media (max-width:768px),(max-width:950px) and (orientation:landscape){.hide-mobile{display:none!important}.sidebar{width:270px;transform:translate(-100%)}.sidebar.open{transform:translate(0)}.main-content{margin-left:0}.hamburger{display:block}.page-content{padding:16px}.topbar{flex-wrap:nowrap;justify-content:space-between;gap:8px;padding:10px 16px}.topbar-right{flex:1;justify-content:flex-end;gap:6px;width:auto}.topbar h2{flex-shrink:0;margin-left:4px;font-size:1.2rem}.user-badge,.logout-btn{display:none}.period-badge{white-space:nowrap;flex-shrink:0;padding:4px 10px;font-size:.75rem}.period-badge svg{display:none}.topbar .btn{white-space:nowrap;padding:6px 12px;font-size:.8rem}.page-header{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:20px}.page-header h1{font-size:1.3rem}.page-header>.btn{width:100%}.page-header .btn-group{flex-direction:row;gap:8px;width:100%;display:flex}.page-header .btn-group .btn{flex:1;justify-content:center;padding:10px 12px;font-size:.85rem}.card{border-radius:12px;width:100%;margin-bottom:16px;padding:16px}.filter-bar{gap:10px!important}.filter-bar select{flex:100%;width:100%!important}.table-controls{flex-direction:column;align-items:stretch;gap:12px;padding:12px}.search-wrapper{width:100%;max-width:100%}.search-input{min-width:0}}@media (max-width:768px) and (orientation:portrait){.table-wrapper:not(.table-report){border:none;width:100%!important;margin:0!important;padding:0!important;overflow:hidden!important}.table-wrapper.table-report{padding:0 12px 12px;overflow-x:auto}.table-wrapper:not(.table-report) table,.table-wrapper:not(.table-report) thead,.table-wrapper:not(.table-report) tbody,.table-wrapper:not(.table-report) th,.table-wrapper:not(.table-report) td,.table-wrapper:not(.table-report) tr{width:100%;display:block}.table-wrapper:not(.table-report) table{min-width:0!important}.table-wrapper:not(.table-report) thead{display:none}.table-wrapper:not(.table-report) tr{border:1px solid #e2e8f0;border-left:4px solid var(--accent);background:#fff;border-radius:10px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;margin-bottom:10px;padding:14px 16px;display:flex;box-shadow:0 1px 3px #0000000a}.table-wrapper:not(.table-report) td{white-space:normal;text-align:left;color:#64748b;border-bottom:none;justify-content:flex-start;align-items:center;width:auto;min-height:0;padding:0;font-size:.85rem;display:inline-flex}.table-wrapper:not(.table-report) td:first-child{display:none}.table-wrapper:not(.table-report) td:nth-child(2){color:#0f172a;flex:1;font-size:1rem;font-weight:800}.table-wrapper:not(.table-report) td:last-child{border-top:none;justify-content:flex-end;gap:8px;width:auto;margin-top:0;margin-left:auto;padding-top:0}td strong{color:var(--accent);font-size:1rem}td .action-btn{margin-left:0;margin-right:0}td .badge{margin:0;font-size:.75rem}td .text-rupiah,td.text-rupiah{color:var(--accent);font-weight:600}}@media (max-width:768px),(max-width:950px) and (orientation:landscape){.main-content{padding-bottom:70px}.bottom-nav{border-top:1px solid var(--border);z-index:100;padding-bottom:env(safe-area-inset-bottom);background:#fff;grid-template-columns:repeat(5,1fr);display:grid;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -4px 10px #00000008}.bottom-nav-item{color:var(--text-muted);flex-direction:column;justify-content:flex-end;align-items:center;height:100%;padding:10px 0;font-size:.65rem;font-weight:700;text-decoration:none;transition:all .2s;display:flex}.bottom-nav-item svg{stroke-width:2.5px;width:22px;height:22px;margin-bottom:4px;transition:all .2s}.bottom-nav-item.active{color:var(--accent)}.bottom-nav-item.active svg{transform:scale(1.1)}.bottom-nav-item:active{background:#f8fafc}.bottom-nav-item.fab-container{position:relative;overflow:visible}.bottom-nav-item .fab-button{background:var(--accent);color:#fff;z-index:101;border-radius:50%;justify-content:center;align-items:center;width:60px;height:60px;transition:transform .2s;display:flex;position:absolute;bottom:24px;box-shadow:0 4px 14px #10b98166}.bottom-nav-item .fab-button svg{color:#fff;width:32px;height:32px;margin:0}.bottom-nav-item .fab-button:active{transform:scale(.9)}.bottom-nav-item .fab-label{margin-top:36px}}@media (max-width:600px){.login-mascot{display:none}.login-card{padding:32px}.stats-grid{grid-template-columns:1fr}}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0f172a99;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal{background:#fff;border-radius:24px;flex-direction:column;width:100%;max-width:500px;animation:.3s cubic-bezier(.34,1.56,.64,1) modalScale;display:flex;overflow:hidden;box-shadow:0 25px 50px -12px #00000040}@keyframes modalScale{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.modal-header{border-bottom:1px solid var(--border);background:#fff;justify-content:space-between;align-items:center;padding:24px 32px;display:flex}.modal-header h3{color:var(--text-primary);margin:0;font-size:1.25rem;font-weight:800}.modal-close{width:36px;height:36px;color:var(--text-secondary);cursor:pointer;background:#f1f5f9;border:none;border-radius:10px;justify-content:center;align-items:center;font-size:1.5rem;line-height:1;transition:all .2s;display:flex}.modal-close:hover{color:#ef4444;background:#fee2e2;transform:rotate(90deg)}.modal-body{max-height:calc(85vh - 160px);padding:32px;overflow-y:auto}.modal-footer{border-top:1px solid var(--border);background:#f8fafc;justify-content:flex-end;gap:12px;padding:20px 32px;display:flex}.form-group label{color:var(--text-secondary);margin-bottom:8px;font-size:.85rem;font-weight:600;display:block}.form-group input,.form-group select,.form-group textarea{border:1px solid var(--border);border-radius:12px;outline:none;width:100%;padding:12px 16px;font-size:.95rem;transition:all .2s}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-light)}.alert{border-radius:12px;margin-bottom:24px;padding:16px;font-size:.9rem}.alert-danger{color:#dc2626;background:#fef2f2;border:1px solid #fee2e2}@media (max-width:768px){.page-content{padding:16px}.page-header h1{font-size:1.5rem}.card{border-radius:12px;padding:16px}.table-wrapper{-webkit-overflow-scrolling:touch;width:calc(100% + 32px);margin:0 -16px;padding:0;overflow-x:auto}table{min-width:750px}th,td{white-space:nowrap;padding:12px 16px}.btn-group{width:100%}.btn-group .btn{flex:1}}@media (max-width:480px){.page-header{flex-direction:column;align-items:flex-start}.page-header .btn-group{width:100%}}
