@import url('https://fonts.googleapis.com/css2?family=Patrick+Hand&display=swap');

/* LMC landing overrides.
 * Keep the purchased Ley UI, but remove only the demo hero branding and the
 * dark image overlay. The background itself is selected by world time.
 */

/* One handwritten voice across the landing page. The body-qualified rules
 * intentionally outrank the legacy inline Handlee overrides still injected by
 * the landing renderer. Icon-font classes are left untouched. */
body,
body input,
body button,
body textarea,
body select,
body .menu-desktop,
body .mobile-nav,
body .navNumber,
body .navTitle,
body .navSubtitle,
body .lmc-world-clock,
body .lmc-about-dialogue,
body .lmc-about-line,
body .lmc-club-page,
body .lmc-club-page *,
body .lmc-door-page,
body .lmc-door-page *,
body .lmc-period-caption {
    font-family: "Patrick Hand", cursive !important;
}

body .lmc-period-caption { font-size: 30px !important; }
.overlay { display: none !important; background: transparent !important; opacity: 0 !important; }
body[data-world-period="morning"] { background-image: url("/static/lmc-v1/lmc/background_landing_pagi.png") !important; }
body[data-world-period="day"] { background-image: url("/static/lmc-v1/lmc/background_landing_siang.png") !important; }
body[data-world-period="afternoon"] { background-image: url("/static/lmc-v1/lmc/background_landing_sore.png") !important; }
body[data-world-period="night"] { background-image: url("/static/lmc-v1/lmc/background_landing_malam.png") !important; }
body[data-world-period] { background-repeat:no-repeat!important; background-position:center center!important; background-size:cover!important; background-attachment:fixed!important; }
.center-container-home { display:none!important; }
.title-top-time,.title-intro-time { display:none!important; }
.borders,.border-left,.border-right,.border-top,.border-bottom { border:0!important; box-shadow:none!important; background:transparent!important; }
.borders,.border-left,.border-right,.border-bottom { display:none!important; }
.border-top { display:block!important; pointer-events:none!important; }
.border-top .social-icons-wrapper,.border-top .full-screen-wrapper { pointer-events:auto!important; }
#subscribe-wrapper,#newsletter,.newsletter { display:none!important; }
/* Ley's demo colour customizer is not part of kotakecil. */
#customizer { display:none!important; visibility:hidden!important; pointer-events:none!important; }
.menu-desktop { box-sizing:border-box; width:360px; padding:18px 70px 18px 24px; background:linear-gradient(to right,rgba(0,0,0,.5) 0%,rgba(0,0,0,.32) 45%,rgba(0,0,0,0) 100%); }
#about,#about.lmc-about-page,#about .center-container,#about .center-block,#about .lower-content,#about .sections { background:transparent!important; background-color:transparent!important; }
.lmc-about-scene { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:clamp(28px,6vw,110px); padding:80px 9vw 60px; box-sizing:border-box; }
.lmc-about-rani { display:block; width:min(34vw,430px); max-height:68vh; object-fit:contain; filter:drop-shadow(0 18px 30px rgba(0,0,0,.38)); }
.lmc-about-dialogue { display:flex; flex-direction:column; align-items:flex-start; gap:20px; width:min(42vw,570px); color:#fff; }
.lmc-about-line { position:relative; max-width:100%; padding:18px 24px; border:1px solid rgba(255,255,255,.2); background:rgba(0,0,0,.32); box-shadow:0 12px 32px rgba(0,0,0,.16); font-size:clamp(26px,3vw,44px); font-weight:400; line-height:1.15; letter-spacing:.02em; }
.lmc-about-line--first { align-self:flex-start; }
.lmc-about-line--second { align-self:flex-end; color:#f5df45; }
.lmc-about-closer { z-index:5; }
/* Pintu's final bit of copy: keep the renderer simple and decorate the two
   existing lines without disturbing the login form or Ley transitions. */
.lmc-door-title::before { content:'"ini" '; text-transform:none; }
.lmc-door-lead::after { content:'!'; }
#countdown-wrapper.lmc-world-clock-wrapper { position:fixed!important; right:54px!important; bottom:48px!important; left:auto!important; top:auto!important; width:auto!important; height:auto!important; z-index:20; text-align:right; }
.lmc-world-clock { color:#fff; text-shadow:0 2px 12px rgba(0,0,0,.75); }
.lmc-world-date { margin-bottom:2px; font-size:18px; font-weight:400; letter-spacing:.04em; text-transform:none; }
.lmc-world-time { font-size:64px; font-weight:400; line-height:.95; letter-spacing:.03em; }
.lmc-corner-ambience { position:fixed; bottom:0; width:260px; height:210px; z-index:8; overflow:hidden; pointer-events:none; }
.lmc-corner-ambience--left { left:0; }
.lmc-corner-ambience--right { right:0; }
.lmc-firefly { position:absolute; left:var(--x); bottom:var(--y); width:var(--size); height:var(--size); border-radius:50%; background:rgba(255,235,125,.95); box-shadow:0 0 5px rgba(255,229,102,.9),0 0 12px rgba(255,220,80,.6); opacity:0; animation:lmc-firefly-drift var(--duration) ease-in-out var(--delay) infinite alternate,lmc-firefly-glow calc(var(--duration) * .55) ease-in-out var(--delay) infinite; }
@keyframes lmc-firefly-drift { 0%{transform:translate3d(0,8px,0)} 45%{transform:translate3d(var(--drift-x),-18px,0)} 100%{transform:translate3d(calc(var(--drift-x) * -.45),-42px,0)} }
@keyframes lmc-firefly-glow { 0%,28%,100%{opacity:.08} 45%,72%{opacity:.9} }
body:not([data-world-period="night"]) .lmc-corner-ambience { display:none; }
.lmc-static-hero,.lmc-static-hero .slide { position:absolute; inset:0; width:100%; height:100%; }
.lmc-static-hero .slide { display:block!important; background-repeat:no-repeat; background-position:center center; background-size:cover; }

@media only screen and (max-width:995px) {
    #navigation-icon.navigation-fire {
        position:fixed!important;
        top:60px!important;
        right:20px!important;
        left:auto!important;
        display:block!important;
        visibility:visible!important;
        width:45px!important;
        height:40px!important;
        margin:0!important;
        padding:0!important;
        z-index:100002!important;
        pointer-events:auto!important;
        cursor:pointer!important;
        touch-action:manipulation;
        -webkit-tap-highlight-color:transparent;
    }
    #navigation-icon.navigation-fire span { pointer-events:none!important; }
    nav.mobile-nav { z-index:100001!important; }
    .lmc-period-caption-wrapper { box-sizing:border-box!important; padding-right:82px!important; }
    body .lmc-period-caption { font-size:22px!important; white-space:normal!important; line-height:1.05!important; }
}

@media only screen and (max-width:768px) {
    body .lmc-period-caption { font-size:20px!important; }
    #countdown-wrapper.lmc-world-clock-wrapper { right:24px!important; bottom:28px!important; }
    .lmc-world-date { font-size:15px; }
    .lmc-world-time { font-size:46px; }
    .lmc-corner-ambience { width:180px; height:150px; }
    .lmc-about-scene { flex-direction:column; justify-content:flex-end; gap:10px; padding:72px 22px 56px; }
    .lmc-about-rani { width:min(72vw,330px); max-height:50vh; }
    .lmc-about-dialogue { width:min(88vw,440px); gap:10px; }
    .lmc-about-line { padding:12px 16px; font-size:clamp(22px,7vw,32px); }
}
@media (prefers-reduced-motion:reduce) { .lmc-firefly { animation:none!important; opacity:.35; } }