:root{color:#1f2430;background:#f4f5f9;font-family:system-ui,sans-serif}*{box-sizing:border-box}body{margin:0}a{color:#4f46e5}h1{margin-top:0}.muted{color:#6b7280;font-weight:400}.error{color:#dc2626;margin:0}button{color:#fff;cursor:pointer;background:#4f46e5;border:0;border-radius:8px;padding:10px 14px;font-size:1rem}button:hover{background:#4338ca}.login-page{place-items:center;min-height:100vh;padding:16px;display:grid}.login-card{background:#fff;border-radius:16px;flex-direction:column;gap:16px;width:100%;max-width:360px;padding:32px;display:flex;box-shadow:0 8px 30px #00000014}.login-card h1,.login-card p{margin:0}.login-card label{flex-direction:column;gap:6px;font-weight:600;display:flex}.login-card input{border:1px solid #d1d5db;border-radius:8px;padding:10px;font-size:1rem}.dashboard{min-height:100vh;display:flex}.sidebar{color:#fff;background:#1f2430;flex-direction:column;flex-shrink:0;gap:24px;width:220px;padding:20px;display:flex}.sidebar h2{margin:0}.sidebar nav{flex-direction:column;gap:4px;display:flex}.sidebar nav a{color:#cbd5e1;border-radius:8px;padding:10px 12px;text-decoration:none}.sidebar nav a:hover{background:#2d3342}.sidebar nav a.active{color:#fff;background:#4f46e5}.sidebar-footer{flex-direction:column;gap:8px;margin-top:auto;display:flex}.sidebar-footer .muted{color:#9ca3af}.content{flex:1;min-width:0;padding:32px}.grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:20px;display:grid}.card{color:inherit;background:#fff;border-radius:12px;text-decoration:none;transition:transform .15s;overflow:hidden;box-shadow:0 2px 8px #00000014}.card:hover{transform:translateY(-4px)}.card img{aspect-ratio:3/4;object-fit:cover;background:#e5e7eb;width:100%;display:block}.card-title{padding:10px 12px;font-weight:600}.detail{flex-wrap:wrap;gap:32px;margin-top:16px;display:flex}.detail img{border-radius:12px;width:100%;max-width:360px;box-shadow:0 4px 16px #00000026}.detail>div{flex:1;min-width:240px}@media (width<=640px){.dashboard{flex-direction:column}.sidebar{width:100%}}