body.imlek-mode .coin-front {
opacity: 0;
animation: none;
}

body.imlek-mode .coin-back {
opacity: 1;
transform: scale(1);
animation: none;
}

body.imlek-mode .coin-back {
background: var(--profile-photo) var(--profile-photo-position) / cover no-repeat;
}

body.imlek-mode {
--bg: #0d0002;
--card: rgba(160, 20, 20, 0.18);
--blue: #ffc53d;
--cyan: #ff6060;
--text: #fff8e7;
--muted: #f5c8a0;
--border: rgba(200, 100, 0, 0.28);
--particle: rgba(255, 190, 0, 0.85);
--particle-line: 255, 180, 0;
--particle-mouse: rgba(255, 80, 80, 0.32);
--profile-photo: url("/assets/img/foto-rahman-imlek.png");
background:
radial-gradient(circle at top right, rgba(200, 30, 30, 0.28), transparent 36%),
radial-gradient(circle at bottom left, rgba(255, 160, 0, 0.14), transparent 32%),
linear-gradient(135deg, #0d0002, #1e0408 50%, #2a0808);
}

body.imlek-mode header {
background: rgba(13, 0, 2, 0.74);
border-bottom-color: rgba(200, 80, 0, 0.24);
}

body.imlek-mode .logo {
color: #fff8e7;
}

body.imlek-mode .logo::before {
content: "\1F409\00a0";
color: #ffc53d;
}

body.imlek-mode nav a {
color: #f5c8a0;
}

body.imlek-mode nav a:hover,
body.imlek-mode .title span,
body.imlek-mode .card i,
body.imlek-mode .project-img i {
color: #ffc53d;
}

body.imlek-mode .hero h1,
body.imlek-mode .title h2,
body.imlek-mode .card h3 {
color: #fff8e7;
}

body.imlek-mode .hero h1 span {
background: linear-gradient(90deg, #ffc53d, #ff6060);
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
}

body.imlek-mode .hero h2,
body.imlek-mode .hero p,
body.imlek-mode .card p,
body.imlek-mode .about-text p,
body.imlek-mode .contact-box p {
color: #f5c8a0;
}

body.imlek-mode .badge {
background: rgba(200, 60, 0, 0.16);
color: #ffc53d;
border-color: rgba(200, 100, 0, 0.34);
}

body.imlek-mode .badge i {
color: #ff6060;
}

body.imlek-mode .btn {
color: #fff8e7;
background: rgba(200, 60, 0, 0.10);
border-color: rgba(200, 100, 0, 0.30);
}

body.imlek-mode .btn.primary {
color: #1a0000;
background: linear-gradient(135deg, #ffc53d, #ff6060);
box-shadow: 0 0 28px rgba(255, 100, 0, 0.30);
}

body.imlek-mode .hero-card,
body.imlek-mode .card,
body.imlek-mode .contact-box {
background: linear-gradient(145deg, rgba(120, 30, 20, 0.42), rgba(20, 5, 5, 0.58));
border-color: rgba(200, 80, 0, 0.26);
box-shadow:
inset 0 0 28px rgba(255, 150, 0, 0.05),
0 18px 44px rgba(0, 0, 0, 0.22);
}

body.imlek-mode .hero-card::before {
border-color: rgba(200, 80, 0, 0.22);
}

body.imlek-mode .hero-card::after {
background: linear-gradient(
90deg,
transparent,
rgba(255, 180, 0, 0.14),
transparent
);
}

body.imlek-mode .profile-frame {
background: linear-gradient(135deg, #ffc53d, #ff4040);
box-shadow:
0 0 24px rgba(255, 160, 0, 0.52),
0 0 58px rgba(200, 30, 30, 0.22);
}

body.imlek-mode .profile-frame::before {
border-color: rgba(255, 160, 0, 0.36);
box-shadow: 0 0 36px rgba(255, 140, 0, 0.20);
}

body.imlek-mode .coin-front {
color: #ffc53d;
background: radial-gradient(circle, #3a0808, #0d0002 72%);
}

body.imlek-mode .project-img,
body.imlek-mode .about-photo {
background:
linear-gradient(135deg, rgba(255, 160, 0, 0.22), rgba(200, 30, 30, 0.10)),
linear-gradient(45deg, rgba(255,255,255,0.04) 25%, transparent 25%, transparent 50%, rgba(255,255,255,0.04) 50%, rgba(255,255,255,0.04) 75%, transparent 75%);
background-size: auto, 24px 24px;
border-color: rgba(200, 80, 0, 0.24);
}

body.imlek-mode .blob.one {
background: radial-gradient(circle, rgba(255, 160, 0, 0.30), rgba(200, 60, 0, 0.14), transparent 70%);
filter: blur(78px);
}

body.imlek-mode .blob.two {
background: radial-gradient(circle, rgba(200, 30, 30, 0.22), rgba(255, 130, 0, 0.12), transparent 70%);
filter: blur(88px);
}

body.imlek-mode .skill {
background: rgba(200, 80, 0, 0.14);
border-color: rgba(200, 100, 0, 0.28);
color: #ffe4a0;
}

body.imlek-mode .socials a,
body.imlek-mode .theme-toggle {
color: #ffc53d;
background: rgba(200, 80, 0, 0.10);
border-color: rgba(200, 100, 0, 0.26);
}

body.imlek-mode footer {
background: rgba(13, 0, 2, 0.60);
border-top-color: rgba(200, 80, 0, 0.22);
}

body.imlek-mode .tool-tags span {
background: rgba(200, 60, 0, 0.14);
border-color: rgba(200, 100, 0, 0.26);
color: #ffe0a0;
}

body.imlek-mode .coin-front {
font-size: 48px;
}

body.imlek-mode .imlek-showcase {
display: block;
padding-top: 80px;
padding-bottom: 80px;
background:
linear-gradient(180deg, rgba(13, 0, 2, 0.96), rgba(50, 10, 5, 0.92)),
repeating-linear-gradient(90deg, rgba(255, 160, 0, 0.08) 0 1px, transparent 1px 28px);
}

@media (max-width: 900px) {
body.imlek-mode .imlek-showcase {
padding-top: 56px;
padding-bottom: 56px;
}

}

