@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Inter:wght@300;400;500;600&display=swap";
:root{--background-hsl:240 10% 98%;--card-hsl:0 0% 100%;--foreground-hsl:240 10% 3.9%;--primary-hsl:240 5.9% 10%;--secondary-hsl:240 4.8% 95.9%;--muted-hsl:240 3.8% 46.1%;--border-hsl:240 5.9% 90%;--success-hsl:142.1 76.2% 36.3%;--warning-hsl:24.6 95% 53.1%;--danger-hsl:0 72.2% 50.6%;--info-hsl:221.2 83.2% 53.3%;--font-title:"Outfit", -apple-system, BlinkMacSystemFont, sans-serif;--font-body:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--radius:12px;--shadow-sm:0 1px 2px 0 #0000000d;--shadow:0 4px 6px -1px #0000000d, 0 2px 4px -1px #0000000d;--shadow-lg:0 10px 15px -3px #0000000d, 0 4px 6px -4px #0000000d}.dark{--background-hsl:240 10% 3.9%;--card-hsl:240 10% 5.9%;--foreground-hsl:0 0% 98%;--primary-hsl:0 0% 98%;--secondary-hsl:240 3.7% 15.9%;--muted-hsl:240 5% 64.9%;--border-hsl:240 3.7% 15.9%;--success-hsl:142.1 70.6% 45.3%;--warning-hsl:20.5 90.2% 48.2%;--danger-hsl:0 72.2% 50.6%;--info-hsl:217.2 91.2% 59.8%}*{box-sizing:border-box;margin:0;padding:0}html,body{background-color:hsl(var(--background-hsl));color:hsl(var(--foreground-hsl));font-family:var(--font-body);-webkit-font-smoothing:antialiased;scrollbar-gutter:stable;min-height:100dvb;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-title);letter-spacing:-.02em;font-weight:500}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:hsl(var(--border-hsl));border-radius:9999px}::-webkit-scrollbar-thumb:hover{background:hsl(var(--muted-hsl))}.app-container{min-height:100dvb;display:flex}.main-content{max-width:1200px;flex:1;inline-size:100%;margin:0 auto;padding:2rem}.card{background:hsl(var(--card-hsl));border:1px solid hsl(var(--border-hsl));border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:1.5rem;transition:all .2s}.card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}.card-title{margin-bottom:.5rem;font-size:1.25rem}.card-desc{color:hsl(var(--muted-hsl));margin-bottom:1.25rem;font-size:.875rem}.badge{text-transform:uppercase;letter-spacing:.05em;border-radius:9999px;align-items:center;padding:.25rem .625rem;font-size:.75rem;font-weight:500;display:inline-flex}.badge-success{background-color:hsla(var(--success-hsl) / .1);color:hsl(var(--success-hsl))}.badge-warning{background-color:hsla(var(--warning-hsl) / .1);color:hsl(var(--warning-hsl))}.badge-danger{background-color:hsla(var(--danger-hsl) / .1);color:hsl(var(--danger-hsl))}.badge-info{background-color:hsla(var(--info-hsl) / .1);color:hsl(var(--info-hsl))}.btn{font-family:var(--font-body);border-radius:var(--radius);cursor:pointer;border:none;justify-content:center;align-items:center;gap:.5rem;padding:.625rem 1.25rem;font-size:.875rem;font-weight:500;transition:all .15s;display:inline-flex}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background-color:hsl(var(--primary-hsl));color:hsl(var(--background-hsl))}.btn-primary:hover:not(:disabled){opacity:.9;transform:scale(.98)}.btn-secondary{background-color:hsl(var(--secondary-hsl));color:hsl(var(--foreground-hsl));border:1px solid hsl(var(--border-hsl))}.btn-secondary:hover:not(:disabled){background-color:hsla(var(--foreground-hsl) / .05)}.btn-danger{background-color:hsla(var(--danger-hsl) / .1);color:hsl(var(--danger-hsl))}.btn-danger:hover:not(:disabled){background-color:hsl(var(--danger-hsl));color:#fff}.form-group{flex-direction:column;gap:.375rem;margin-bottom:1.25rem;display:flex}.form-label{color:hsl(var(--foreground-hsl));font-size:.875rem;font-weight:500}.input,.select,.textarea{font-family:var(--font-body);border:1px solid hsl(var(--border-hsl));background:hsl(var(--card-hsl));color:hsl(var(--foreground-hsl));border-radius:8px;outline:none;padding:.625rem .875rem;font-size:.875rem;transition:border-color .15s,box-shadow .15s}.input:focus,.select:focus,.textarea:focus{border-color:hsla(var(--primary-hsl) / .5);box-shadow:0 0 0 2px hsla(var(--primary-hsl) / .1)}.grid{gap:1.5rem;display:grid}.grid-cols-1{grid-template-columns:1fr}@media (min-width:768px){.grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}}.timeline{border-left:2px solid hsl(var(--border-hsl));flex-direction:column;gap:2rem;margin-top:1rem;padding-left:1.5rem;display:flex;position:relative}.timeline-item{position:relative}.timeline-dot{background:hsl(var(--primary-hsl));border:2px solid hsl(var(--background-hsl));border-radius:50%;width:10px;height:10px;position:absolute;top:4px;left:calc(-1.5rem - 6px)}.timeline-dot.success{background:hsl(var(--success-hsl))}.timeline-dot.warning{background:hsl(var(--warning-hsl))}.timeline-dot.danger{background:hsl(var(--danger-hsl))}.timeline-date{color:hsl(var(--muted-hsl));margin-bottom:.375rem;font-size:.75rem;font-weight:500}.timeline-body{background:hsl(var(--card-hsl));border:1px solid hsl(var(--border-hsl));border-radius:var(--radius);padding:1rem}.alert{border-radius:var(--radius);align-items:center;gap:.75rem;margin-bottom:1.25rem;padding:.875rem 1.25rem;font-size:.875rem;font-weight:500;display:flex}.alert-success{background-color:hsla(var(--success-hsl) / .08);border:1px solid hsla(var(--success-hsl) / .2);color:hsl(var(--success-hsl))}.alert-warning{background-color:hsla(var(--warning-hsl) / .08);border:1px solid hsla(var(--warning-hsl) / .2);color:hsl(var(--warning-hsl))}.alert-error{background-color:hsla(var(--danger-hsl) / .08);border:1px solid hsla(var(--danger-hsl) / .2);color:hsl(var(--danger-hsl))}.table-container{border:1px solid hsl(var(--border-hsl));border-radius:var(--radius);background:hsl(var(--card-hsl));overflow-x:auto}.table{border-collapse:collapse;text-align:left;width:100%;font-size:.875rem}.table th{background:hsl(var(--secondary-hsl));border-bottom:1px solid hsl(var(--border-hsl));padding:.75rem 1rem;font-weight:600}.table td{border-bottom:1px solid hsl(var(--border-hsl));padding:1rem}.table tr:last-child td{border-bottom:none}.flex-between{justify-content:space-between;align-items:center;display:flex}.flex-align-center{align-items:center;gap:.5rem;display:flex}.text-muted{color:hsl(var(--muted-hsl))}.mt-4{margin-top:1rem}.mb-4{margin-bottom:1rem}
