:root{--font-sans: "Libre Franklin", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-display: "Roboto Slab", Georgia, serif;--bg-purple: #CD92C1;--accent-yellow: #FFCF01;--card-cream: #FFF1D0;--text-dark: #483735;--text-light: #FFFDEB;--border-color: #513F3D;--ivory-2: #FFF7E1;--congo-light: #66504D;--teal: #99D6CC;--rose: #F79F99;--rose-deep: #F75454;--lavender: #D9ACD0;--yellow-light: #FFE18B;--bg-app: var(--bg-purple);--bg-panel: var(--card-cream);--bg-panel-hover: var(--ivory-2);--bg-input: var(--ivory-2);--border-width: 3px;--border-glass: var(--border-width) solid var(--border-color);--border-glass-focused: var(--border-width) solid var(--text-dark);--accent: var(--accent-yellow);--accent-alt: var(--teal);--accent-glow: rgba(81, 63, 61, .16);--accent-gradient: linear-gradient(135deg, var(--accent-yellow) 0%, var(--yellow-light) 100%);--text-primary: var(--text-dark);--text-secondary: var(--congo-light);--text-muted: rgba(72, 55, 53, .62);--success: #287A68;--success-glow: rgba(153, 214, 204, .65);--warning: #8A6200;--warning-glow: rgba(255, 225, 139, .78);--danger: var(--rose-deep);--danger-glow: rgba(247, 84, 84, .16);--sidebar-width: 260px;--border-radius-lg: 16px;--border-radius-md: 10px;--border-radius-sm: 8px;--shadow-sm: 4px 4px 0 var(--border-color);--shadow-md: 6px 6px 0 var(--border-color);--shadow-lg: 10px 10px 0 var(--border-color);--transition-smooth: all .18s ease}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background:radial-gradient(ellipse 45% 35% at 15% 10%,rgba(255,225,139,.5) 0%,transparent 62%),radial-gradient(ellipse 45% 35% at 88% 18%,rgba(153,214,204,.46) 0%,transparent 60%),linear-gradient(135deg,var(--bg-purple) 0%,var(--lavender) 48%,var(--rose) 100%);color:var(--text-primary);min-height:100vh;overflow-x:hidden;line-height:1.5;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#513f3d1f}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--text-dark)}.app-container{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-width);background:var(--accent-yellow);border-right:var(--border-glass);padding:2rem 1.5rem;display:flex;flex-direction:column;position:fixed;height:100vh;left:0;top:0;z-index:100}.logo-container{display:flex;align-items:center;gap:.9rem;margin-bottom:2.5rem;font-family:var(--font-display);font-weight:800;font-size:1.05rem;color:var(--text-dark)}.sidebar-logo{width:126px;height:auto;display:block;filter:drop-shadow(2px 2px 0 rgba(81,63,61,.3))}.nav-links{display:flex;flex-direction:column;gap:.5rem;flex-grow:1}.nav-link{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;border-radius:var(--border-radius-md);color:var(--text-dark);text-decoration:none;font-weight:500;cursor:pointer;transition:var(--transition-smooth);border:var(--border-width) solid transparent;background:transparent;text-align:left;font-size:.95rem}.nav-link:hover{color:var(--text-dark);background:var(--yellow-light);border-color:var(--border-color)}.nav-link.active{color:var(--text-dark);background:var(--card-cream);border-color:var(--border-color);box-shadow:var(--shadow-sm)}.sidebar-footer{margin-top:auto;border-top:var(--border-width) solid var(--border-color);padding-top:1.5rem}.user-profile{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.user-info{display:flex;flex-direction:column}.username{font-weight:600;font-size:.9rem}.role{font-size:.75rem;color:var(--text-muted)}.btn-logout{width:100%;padding:.75rem;border:var(--border-width) solid var(--border-color);border-radius:var(--border-radius-md);background:var(--rose);color:var(--text-dark);font-weight:800;cursor:pointer;transition:var(--transition-smooth)}.btn-logout:hover{transform:translate(-1px,-1px);box-shadow:var(--shadow-sm)}.main-content{margin-left:var(--sidebar-width);flex-grow:1;padding:2rem 2.5rem;max-width:calc(100vw - var(--sidebar-width));min-height:100vh;background:#fffdeb38}.page-header{margin-bottom:2rem}.page-title{font-size:2rem;font-family:var(--font-display);font-weight:800;letter-spacing:0;margin-bottom:.25rem}.page-subtitle{color:var(--text-secondary);font-size:.95rem}.glass-panel{background:var(--bg-panel);border:var(--border-glass);border-radius:var(--border-radius-lg);padding:1.75rem;box-shadow:var(--shadow-md);transition:var(--transition-smooth)}.glass-panel:hover{background:var(--bg-panel-hover);box-shadow:var(--shadow-lg)}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;margin-bottom:2rem}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem}.metric-card{display:flex;flex-direction:column;position:relative;overflow:hidden;background:var(--card-cream);border:var(--border-glass);border-radius:var(--border-radius-lg);padding:1.5rem;box-shadow:var(--shadow-sm);transition:var(--transition-smooth)}.metric-card:hover{transform:translate(-1px,-1px);box-shadow:var(--shadow-md)}.metric-card:before{content:"";position:absolute;top:0;left:0;width:8px;height:100%;background:var(--accent-yellow);border-right:var(--border-width) solid var(--border-color)}.metric-label{font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);font-weight:600;margin-bottom:.5rem}.metric-value{font-size:2.25rem;font-family:var(--font-display);font-weight:800;letter-spacing:0;margin-bottom:.25rem}.metric-trend{font-size:.8rem;display:flex;align-items:center;gap:.25rem}.metric-desc{color:var(--text-secondary);font-size:.8rem;margin-top:.25rem}.trend-up{color:var(--success)}.trend-down{color:var(--danger)}.table-container{overflow-x:auto;margin-top:1rem}.table-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.25rem;gap:1rem}.search-input-wrapper{position:relative;flex-grow:1;max-width:400px}.search-input{width:100%;padding:.75rem 1rem .75rem 2.5rem;border-radius:var(--border-radius-md);border:var(--border-glass);background:var(--bg-input);color:var(--text-primary);font-family:var(--font-sans);font-size:.95rem;transition:var(--transition-smooth)}.search-input:focus{outline:none;border-color:var(--border-color);box-shadow:var(--shadow-sm)}.search-icon{position:absolute;left:.875rem;top:50%;transform:translateY(-50%);color:var(--text-muted)}.filter-select{padding:.75rem 1rem;border-radius:var(--border-radius-md);border:var(--border-glass);background:var(--bg-input);color:var(--text-primary);font-family:var(--font-sans);font-size:.95rem;outline:none;cursor:pointer;transition:var(--transition-smooth)}.filter-select:focus{border-color:var(--border-color);box-shadow:var(--shadow-sm)}.custom-table{width:100%;border-collapse:collapse;text-align:left}.custom-table th{padding:1rem;border-bottom:var(--border-width) solid var(--border-color);color:var(--text-dark);font-weight:800;font-size:.875rem;text-transform:uppercase;letter-spacing:.05em}.custom-table td{padding:1rem;border-bottom:2px solid rgba(81,63,61,.18);font-size:.95rem;vertical-align:middle}.custom-table tbody tr{transition:var(--transition-smooth)}.custom-table tbody tr:hover{background:#ffcf0138}.badge{display:inline-flex;align-items:center;gap:.375rem;padding:.25rem .75rem;border-radius:999px;font-size:.75rem;font-weight:800;text-transform:capitalize}.badge-success{background:var(--success-glow);color:#165245;border:2px solid #287A68}.badge-warning{background:var(--warning-glow);color:#624500;border:2px solid #8A6200}.badge-danger{background:var(--danger-glow);color:#9f2222;border:2px solid var(--rose-deep)}.btn-primary{background:var(--accent-gradient);border:var(--border-glass);border-radius:var(--border-radius-md);color:var(--text-dark);padding:.75rem 1.25rem;font-weight:900;font-family:var(--font-sans);cursor:pointer;transition:var(--transition-smooth);box-shadow:var(--shadow-sm)}.btn-primary:hover{transform:translate(-1px,-1px);box-shadow:var(--shadow-md)}.btn-secondary{background:var(--ivory-2);border:var(--border-glass);border-radius:var(--border-radius-md);color:var(--text-primary);padding:.75rem 1.25rem;font-weight:800;font-family:var(--font-sans);cursor:pointer;transition:var(--transition-smooth)}.btn-secondary:hover{background:var(--teal);box-shadow:var(--shadow-sm)}.btn-secondary.active{background:var(--accent-yellow);box-shadow:var(--shadow-sm)}.drawer-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#48373561;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:200;opacity:0;animation:fadeIn .3s forwards cubic-bezier(.4,0,.2,1)}.drawer{position:fixed;top:0;right:0;width:100%;max-width:550px;height:100vh;background:var(--card-cream);border-left:var(--border-glass);box-shadow:-8px 0 0 var(--border-color);z-index:201;padding:2.5rem;display:flex;flex-direction:column;transform:translate(100%);animation:slideIn .3s forwards cubic-bezier(.4,0,.2,1)}.drawer-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;border-bottom:var(--border-width) solid var(--border-color);padding-bottom:1rem}.drawer-title{font-size:1.5rem;font-family:var(--font-display);font-weight:800}.btn-close{background:var(--ivory-2);border:2px solid var(--border-color);color:var(--text-secondary);font-size:1.5rem;cursor:pointer;transition:var(--transition-smooth);width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%}.btn-close:hover{background:var(--rose);color:var(--text-primary)}.drawer-content{flex-grow:1;overflow-y:auto;padding-right:.5rem}.detail-group{margin-bottom:1.5rem}.detail-label{font-size:.75rem;text-transform:uppercase;color:var(--text-secondary);letter-spacing:.05em;font-weight:600;margin-bottom:.375rem}.detail-value{font-size:1.05rem;font-weight:500;word-break:break-word}.raw-json-box{background:var(--ivory-2);border:2px solid rgba(81,63,61,.28);border-radius:var(--border-radius-md);padding:1rem;font-family:Courier New,Courier,monospace;font-size:.85rem;color:#165245;overflow-x:auto;white-space:pre-wrap;max-height:250px}@keyframes fadeIn{to{opacity:1}}@keyframes slideIn{to{transform:translate(0)}}@keyframes spin{to{transform:rotate(360deg)}}.auth-page{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:1.5rem;background:radial-gradient(ellipse 38% 32% at 18% 18%,rgba(153,214,204,.65) 0%,transparent 64%),radial-gradient(ellipse 38% 32% at 82% 72%,rgba(255,225,139,.7) 0%,transparent 60%)}.auth-card{width:100%;max-width:420px;padding:2.5rem}.auth-header{text-align:center;margin-bottom:2rem}.auth-logo{width:min(240px,82%);height:auto;display:block;margin:0 auto 1rem;filter:drop-shadow(3px 3px 0 rgba(81,63,61,.3))}.auth-title{font-size:1.75rem;font-family:var(--font-display);font-weight:800;margin-bottom:.5rem}.auth-subtitle{color:var(--text-secondary);font-size:.9rem}.form-group{margin-bottom:1.25rem}.form-label{display:block;font-size:.875rem;font-weight:800;color:var(--text-dark);margin-bottom:.5rem}.form-input{width:100%;padding:.75rem 1rem;border-radius:var(--border-radius-md);border:var(--border-glass);background:var(--bg-input);color:var(--text-primary);font-family:var(--font-sans);font-size:.95rem;transition:var(--transition-smooth)}.form-input:focus{outline:none;border-color:var(--border-color);box-shadow:var(--shadow-sm)}.form-input::placeholder{color:var(--text-muted)}.btn-auth-submit{width:100%;margin-top:1rem;padding:.875rem;font-size:1rem}.action-buttons{display:flex;gap:.5rem}.btn-icon{width:32px;height:32px;border-radius:var(--border-radius-sm);border:2px solid var(--border-color);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:var(--transition-smooth);color:var(--text-dark)}.btn-icon-approve{background:var(--teal);color:#165245}.btn-icon-approve:hover{background:var(--success);color:var(--text-light)}.btn-icon-reject{background:var(--rose);color:#9f2222}.btn-icon-reject:hover{background:var(--danger);color:var(--text-light)}.btn-icon-delete{background:var(--ivory-2);color:var(--text-muted)}.btn-icon-delete:hover{background:var(--border-color);color:var(--text-light)}.dashboard-grid{display:grid;grid-template-columns:2fr 1fr;gap:2rem;margin-top:2rem}@media (max-width: 1024px){.dashboard-grid{grid-template-columns:1fr}}.dashboard-list{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}.dashboard-list-item{display:flex;align-items:center;justify-content:space-between;padding:1rem;background:var(--ivory-2);border-radius:var(--border-radius-md);border:2px solid rgba(81,63,61,.22)}.list-item-meta{display:flex;flex-direction:column}.list-item-title{font-weight:600;font-size:.95rem}.list-item-subtitle{color:var(--text-secondary);font-size:.8rem}.chart-container{height:280px;position:relative;margin-top:1rem}.chart-svg{width:100%;height:100%;overflow:visible}.chart-grid-line{stroke:#513f3d29;stroke-width:1}.chart-axis-text{font-size:.75rem;fill:var(--text-muted);font-family:var(--font-sans)}.chart-line{fill:none;stroke:url(#chart-gradient);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(3px 3px 0 rgba(81,63,61,.22))}.chart-area{fill:url(#area-gradient);opacity:.15}.chart-point{fill:var(--accent);stroke:var(--border-color);stroke-width:2;cursor:pointer;transition:var(--transition-smooth)}.chart-point:hover{r:6}.toast-container{position:fixed;bottom:2rem;right:2rem;display:flex;flex-direction:column;gap:.75rem;z-index:1000}.toast{background:var(--card-cream);border:var(--border-glass);border-left:8px solid var(--accent);padding:1rem 1.5rem;border-radius:var(--border-radius-md);box-shadow:var(--shadow-md);color:var(--text-primary);font-weight:500;display:flex;align-items:center;gap:.75rem;animation:slideInLeft .3s forwards cubic-bezier(.4,0,.2,1)}.toast-success{border-left-color:var(--success)}.toast-danger{border-left-color:var(--danger)}@keyframes slideInLeft{0%{transform:translate(120%);opacity:0}to{transform:translate(0);opacity:1}}@media (max-width: 840px){:root{--sidebar-width: 100%}.app-container{flex-direction:column}.sidebar{position:sticky;height:auto;width:100%;padding:1rem}.logo-container{margin-bottom:1rem}.sidebar-logo{width:110px}.nav-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.sidebar-footer{display:none}.main-content{margin-left:0;max-width:100vw;padding:1.25rem}.page-header,.table-controls{flex-direction:column;align-items:stretch!important}.search-input-wrapper{max-width:none}.drawer{max-width:100%;padding:1.5rem}}