:root{--background:0 0% 100%;--foreground:0 0% 13%;--card:0 0% 100%;--card-foreground:0 0% 13%;--popover:0 0% 100%;--popover-foreground:0 0% 13%;--primary:189 100% 42%;--primary-foreground:0 0% 100%;--secondary:210 40% 96.1%;--secondary-foreground:222.2 47.4% 11.2%;--muted:210 40% 96.1%;--muted-foreground:0 0% 45%;--accent:210 40% 96.1%;--accent-foreground:222.2 47.4% 11.2%;--destructive:0 84.2% 60.2%;--destructive-foreground:210 40% 98%;--border:0 0% 90%;--input:0 0% 90%;--ring:189 100% 42%;--radius:0.375rem;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:0.75rem;--spacing-lg:1rem;--spacing-xl:1.5rem;--spacing-2xl:2rem;--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-size-xs:0.6875rem;--font-size-sm:0.8125rem;--font-size-base:0.875rem;--font-size-lg:1rem;--font-size-xl:1.125rem;--font-size-2xl:1.375rem;--font-size-3xl:1.625rem;--font-size-4xl:2rem;--shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.05);--shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--shadow-xl:0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)}body.dark-mode{--background:0 0% 7%;--foreground:0 0% 88%;--card:0 0% 10%;--card-foreground:0 0% 88%;--popover:0 0% 10%;--popover-foreground:0 0% 88%;--primary:189 100% 42%;--primary-foreground:0 0% 100%;--secondary:0 0% 15%;--secondary-foreground:0 0% 88%;--muted:0 0% 15%;--muted-foreground:0 0% 60%;--accent:0 0% 18%;--accent-foreground:0 0% 88%;--destructive:0 70% 50%;--destructive-foreground:0 0% 98%;--border:0 0% 20%;--input:0 0% 20%;--ring:189 100% 42%}.shadcn-card{background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:var(--radius);color:hsl(var(--card-foreground));box-shadow:none;overflow:hidden;transition:all 0.3s ease}.shadcn-card:hover{box-shadow:none;transform:none}.shadcn-card-header{padding:var(--spacing-lg);border-bottom:1px solid hsl(var(--border))}.shadcn-card-title{font-size:var(--font-size-lg);font-weight:600;line-height:1.4;margin:0;color:hsl(var(--foreground))}.shadcn-card-description{font-size:var(--font-size-sm);color:hsl(var(--muted-foreground));margin-top:var(--spacing-xs)}.shadcn-card-content{padding:var(--spacing-lg)}.shadcn-card-footer{padding:var(--spacing-lg);border-top:1px solid hsl(var(--border));display:flex;align-items:center;justify-content:space-between}.shadcn-btn{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:var(--radius);font-size:var(--font-size-sm);font-weight:500;transition:all 0.2s ease;cursor:pointer;border:none;outline:none;text-decoration:none;padding:var(--spacing-sm) var(--spacing-md);gap:var(--spacing-xs)}.shadcn-btn:disabled{pointer-events:none;opacity:.5}.shadcn-btn-primary{background:hsl(var(--primary));color:hsl(var(--primary-foreground))}.shadcn-btn-primary:hover{background:hsl(var(--primary) / .9)}.shadcn-btn-secondary{background:hsl(var(--secondary));color:hsl(var(--secondary-foreground))}.shadcn-btn-secondary:hover{background:hsl(var(--secondary) / .8)}.shadcn-btn-outline{border:1px solid hsl(var(--border));background:#fff0;color:hsl(var(--foreground))}.shadcn-btn-outline:hover{background:hsl(var(--accent));color:hsl(var(--accent-foreground))}.shadcn-btn-ghost{background:#fff0;color:hsl(var(--foreground))}.shadcn-btn-ghost:hover{background:hsl(var(--accent))}.shadcn-btn-link{background:#fff0;color:hsl(var(--primary));text-decoration:underline;padding:0}.shadcn-btn-sm{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs)}.shadcn-btn-lg{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-base)}.shadcn-badge{display:inline-flex;align-items:center;border-radius:9999px;padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs);font-weight:500;transition:all 0.2s ease;white-space:nowrap}.shadcn-badge-default{background:hsl(var(--primary));color:hsl(var(--primary-foreground))}.shadcn-badge-secondary{background:hsl(var(--secondary));color:hsl(var(--secondary-foreground))}.shadcn-badge-outline{border:1px solid hsl(var(--border));background:#fff0;color:hsl(var(--foreground))}.shadcn-badge-destructive{background:hsl(var(--destructive));color:hsl(var(--destructive-foreground))}.shadcn-avatar{position:relative;display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:9999px;overflow:hidden;background:hsl(var(--muted))}.shadcn-avatar-img{width:100%;height:100%;object-fit:cover}.shadcn-avatar-fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:hsl(var(--muted));color:hsl(var(--muted-foreground));font-size:var(--font-size-sm);font-weight:500}.shadcn-avatar-sm{width:2rem;height:2rem}.shadcn-avatar-lg{width:3rem;height:3rem}.shadcn-avatar-xl{width:4rem;height:4rem}.shadcn-separator{background:hsl(var(--border));height:1px;width:100%;margin:var(--spacing-md) 0}.shadcn-separator-vertical{width:1px;height:auto;margin:0 var(--spacing-md)}.shadcn-input{display:flex;width:100%;border-radius:var(--radius);border:1px solid hsl(var(--input));background:hsl(var(--background));padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm);color:hsl(var(--foreground));transition:all 0.2s ease}.shadcn-input:focus{outline:none;border-color:hsl(var(--ring));box-shadow:none}.shadcn-input::placeholder{color:hsl(var(--muted-foreground))}.shadcn-container{width:100%;max-width:1100px;margin:0 auto;padding:0 0}.shadcn-grid{display:grid;gap:var(--spacing-lg)}.shadcn-grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.shadcn-grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.shadcn-grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.shadcn-grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.kumparan-hero-card{position:relative;border-radius:var(--radius);overflow:hidden;background:hsl(var(--card));box-shadow:none;transition:all 0.3s ease}.kumparan-hero-card:hover{box-shadow:none;transform:scale(1.02)}.kumparan-hero-image{width:100%;height:400px;object-fit:cover}.kumparan-hero-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgb(0 0 0 / .8) 0%,rgb(0 0 0 / .4) 50%,transparent 100%);padding:var(--spacing-2xl);color:#fff}.kumparan-hero-category{display:inline-block;background:hsl(var(--primary));color:#fff;padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius);font-size:var(--font-size-xs);font-weight:600;margin-bottom:var(--spacing-sm);text-transform:uppercase}.kumparan-hero-title{font-size:var(--font-size-3xl);font-weight:700;line-height:1.2;margin:var(--spacing-sm) 0;color:#fff}.kumparan-hero-meta{display:flex;align-items:center;gap:var(--spacing-md);font-size:var(--font-size-sm);color:rgb(255 255 255 / .9);margin-top:var(--spacing-md)}.kumparan-article-card{display:flex;flex-direction:column;background:hsl(var(--card));border-radius:var(--radius);overflow:hidden;box-shadow:none;transition:all 0.3s ease;height:100%}.kumparan-article-card:hover{box-shadow:none;transform:translateY(-4px)}.kumparan-article-image{width:100%;height:200px;object-fit:cover}.kumparan-article-content{padding:var(--spacing-md);flex:1;display:flex;flex-direction:column}.kumparan-article-category{display:inline-block;color:hsl(var(--primary));font-size:var(--font-size-xs);font-weight:600;text-transform:uppercase;margin-bottom:var(--spacing-xs)}.kumparan-article-title{font-size:var(--font-size-lg);font-weight:600;line-height:1.4;margin:var(--spacing-xs) 0;color:hsl(var(--foreground));flex:1}.kumparan-article-title a{color:inherit;text-decoration:none;transition:color 0.2s ease}.kumparan-article-title a:hover{color:hsl(var(--primary))}.kumparan-article-meta{display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-xs);color:hsl(var(--muted-foreground));margin-top:var(--spacing-sm)}@media (max-width:768px){.shadcn-container{padding:0 0}.shadcn-grid-cols-2,.shadcn-grid-cols-3,.shadcn-grid-cols-4{grid-template-columns:repeat(1,minmax(0,1fr))}.kumparan-hero-image{height:250px}.kumparan-hero-title{font-size:var(--font-size-2xl)}.kumparan-hero-overlay{padding:var(--spacing-lg)}}@media (min-width:769px) and (max-width:1024px){.shadcn-grid-cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}}