/* Langit Leventureee: kartu kaca di atas ladang dandelion. Siang = kaca terang, malam = kaca ungu gelap.
   File ini dimuat SETELAH gaya halaman, jadi hanya menimpa warna dan latar; ukuran dan tata letak tetap dari halaman. */
:root{
  --glass:rgba(255,255,255,.74); --glass-strong:rgba(255,255,255,.88); --glass-soft:rgba(255,255,255,.52);
  --glass-line:rgba(255,255,255,.75);
  --tint:rgba(214,203,255,.78); --tint-d:rgba(156,136,238,.55);
  --ink-fix:#2A2257; --halo:0 1px 0 rgba(255,255,255,.6),0 0 14px rgba(238,233,251,.95);
  --card:var(--glass); --paper:transparent; --soft:rgba(255,255,255,.5); --shade:rgba(156,136,238,.38);
}
html{background:#B9C2F7}
body{background:transparent!important;background-image:none!important}
html[data-langit=malam]{
  background:#1B1640; color-scheme:dark;
  --glass:rgba(32,26,78,.74); --glass-strong:rgba(32,26,78,.88); --glass-soft:rgba(32,26,78,.55);
  --glass-line:rgba(255,255,255,.14); --tint:rgba(70,56,150,.76); --tint-d:rgba(10,8,34,.55);
  --ink:#F4F0FF; --muted:#CDC5F0; --line:rgba(255,255,255,.16); --shade:rgba(6,4,24,.55); --soft:rgba(255,255,255,.08);
  --on-ink:#2A2257; --contour:rgba(255,255,255,.12); --north:rgba(255,255,255,.05); --water:rgba(150,170,255,.22);
  --halo:0 1px 2px rgba(0,0,0,.55),0 0 14px rgba(18,14,44,.9);
  --lift:0 16px 26px -14px rgba(0,0,0,.6);
}

/* Latar */
/* Latar dipaku setinggi layar terbesar (100lvh): tidak ikut membesar/bergeser saat bilah alamat HP muncul-hilang. */
.sky{position:fixed;left:0;top:0;width:100%;height:100vh;height:100lvh;z-index:-1;overflow:hidden;pointer-events:none;background:#B9C2F7;contain:strict;transform:translateZ(0)}
.sky-art{position:absolute}
.sky-img,.sky-vid,.sky-stars{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:50% 100%;transition:opacity 1.4s ease}
.sky-img[hidden],.sky-vid[hidden],.sky-stars[hidden]{display:none}
.sky-img.malam,.sky-stars,.sky-vid{opacity:0}
[data-langit=malam] .sky{background:#1B1640}
[data-langit=malam] .sky-img.malam,[data-langit=malam] .sky-stars{opacity:1}
[data-langit=malam] .sky-img.siang{opacity:0}
[data-latar=video][data-langit=siang] .sky-vid.siang,[data-latar=video][data-langit=malam] .sky-vid.malam{opacity:1}
[data-latar=video] .sky-stars{opacity:0}
.sky-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(238,233,251,0) 0%,rgba(238,233,251,.12) 45%,rgba(238,233,251,.42) 100%);transition:opacity 1.4s}
[data-langit=malam] .sky-scrim{background:linear-gradient(180deg,rgba(18,14,44,0) 0%,rgba(18,14,44,.18) 45%,rgba(18,14,44,.5) 100%)}
.sky-fx{position:fixed;left:0;top:0;z-index:8;pointer-events:none;transition:opacity 1s}
[data-latar=video] .sky-fx{opacity:0}
@media (prefers-reduced-motion:reduce){.sky-fx{display:none}.sky-img,.sky-vid,.sky-stars,.sky-scrim{transition:none}}

/* Tombol siang/malam */
.sky-toggle{appearance:none;flex:none;display:grid;place-items:center;width:38px;height:38px;margin-left:auto;padding:0;border:0;border-radius:50%;background:var(--glass-strong);color:var(--ink);cursor:pointer;box-shadow:inset 0 0 0 1px var(--glass-line),0 3px 0 var(--shade);transition:transform .14s cubic-bezier(.3,1.6,.5,1)}
.sky-toggle:active{transform:translateY(2px) scale(.94)}
.sky-toggle:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
[data-langit=siang] .sky-toggle{color:#5B4BC4}
[data-langit=malam] .sky-toggle{color:#FFD23F}

/* Kartu kaca (halaman petualangan dan form). Sengaja TANPA backdrop-filter: efek buram dihitung ulang
   setiap frame saat scroll dan bikin patah-patah di HP. Kartu cukup semi-transparan. */
.bar{margin-inline:-16px;padding-inline:16px;background:var(--glass-strong);border-radius:0 0 20px 20px;box-shadow:inset 0 -1px 0 var(--glass-line),0 8px 18px -12px rgba(42,34,87,.35)}
[data-langit=malam] .bar{background:rgba(24,19,60,.9)}
.box.locked,.photo,.route-card svg,.thumb{background:var(--glass-soft)}
.photo{border-color:var(--glass-line)}
.slip,.letter,.sheet{background-color:var(--glass-strong)}
.hero,.note-scene,.cover,.done-head{background:var(--tint);box-shadow:inset 0 0 0 1px var(--glass-line),0 8px 0 var(--tint-d),var(--lift)}
.page:nth-child(3n+2),.page:nth-child(3n+3){background:var(--glass)}
.map,.slip,.mission,.page,.route-card,.share-item,.confirm,.box,.sheet,.ticket{box-shadow:inset 0 0 0 1px var(--glass-line),0 6px 0 var(--shade),var(--lift)}
.btn.primary:disabled{background:var(--glass-soft);color:var(--muted)}

/* Teks yang langsung di atas latar: diberi cahaya tipis supaya tetap terbaca */
main > h1,main > section > h1,.section > h2,main > .section > h2,.t-head h1,.t-head .eyebrow,.strip-head h1,.cc-head h2,.cc-head .num,
.tip,.reason,.note,.sub,.link,main > .lead,.section > .lead,.section > .sub,.letter-cap,#note-status,.top .brand,.wordmark,.steps li,.deck-hint{text-shadow:var(--halo)}
.sheet .link,.plan .link,.bubble .link,.kartu .link{text-shadow:none}

/* Warna tetap gelap di atas latar terang (kuning, hijau muda, merah muda) */
.btn.primary,.btn.lilac,.btn.danger,.box.active,.box.active .box-top,.box.active .box-lbl,.ring-code,.rl-no,.page-no,.stamp div,.star.on,.pin,.always,.agree,.code-stamp,.chip[aria-pressed=true],.chip.card[aria-pressed=true] small,.always small,.cocok,.trail i.now{color:var(--ink-fix)}
.btn.lilac{background:var(--lilac)}
.fog{background:#231C55;color:#FFFFFF}
.mission input::after{border-color:#FFFFFF}
.photo .redo,.toast{background:#2A2257;color:#FFFFFF}
.polaroid figcaption{color:#544C7E}

/* Malam: kartu hijau dan kuning jadi kaca berwarna supaya tidak menyilaukan */
[data-langit=malam] .answer,[data-langit=malam] .done-note,[data-langit=malam] .quest,[data-langit=malam] .box.done,[data-langit=malam] .stamp:not(.full){background:rgba(31,122,74,.42);box-shadow:inset 0 0 0 1px rgba(147,211,174,.35),0 5px 0 rgba(6,30,18,.6)}
[data-langit=malam] .answer h2,[data-langit=malam] .answer .eyebrow,[data-langit=malam] .addr,[data-langit=malam] .done-note,[data-langit=malam] .quest .eyebrow,[data-langit=malam] .box.done .box-lbl,[data-langit=malam] .limit,[data-langit=malam] .share-act,[data-langit=malam] .stamp:not(.full){color:#BFF0D2}
[data-langit=malam] .letter{background-image:repeating-linear-gradient(transparent 0 31px,rgba(255,255,255,.08) 31px 32px)}
[data-langit=malam] .chip i{background:var(--muted)}
[data-langit=malam] .chip[data-state="ready"],[data-langit=malam] .chip[data-state="offline"]{color:#BFF0D2}
[data-langit=malam] .ring{fill:rgba(32,26,78,.7)}
[data-langit=malam] .ctl.locked .ring{fill:rgba(32,26,78,.5)}
[data-langit=malam] .q,[data-langit=malam] .ctl.locked .lbl{fill:#A9A0D8}
[data-langit=malam] .pin.on{fill:#7FE0A8}
[data-langit=malam] .page-stars,[data-langit=malam] .rl-stars{color:#FFD23F}
[data-langit=malam] .errors{color:#A3174A}
[data-langit=malam] input::placeholder,[data-langit=malam] textarea::placeholder{color:#9D94C8}
[data-langit=malam] .agree,[data-langit=malam] .always{background:rgba(255,241,184,.92)}
[data-langit=malam] .ticket .chip,[data-langit=malam] .ticket input[type=text],[data-langit=malam] .ticket input[type=url],[data-langit=malam] .ticket textarea{background:var(--soft)}

/* Bintang rapor yang belum dipilih tetap kelihatan di atas ladang */
.star{background:var(--glass-strong)}
.star svg{fill:#C9BFEF}
[data-langit=malam] .star svg{fill:rgba(255,255,255,.35)}
.star.on svg{fill:#FFFFFF}

/* Form v3 dan kartu paket (18 Okt): permukaan kaca untuk gelembung Levia, tiket rencana, lipatan tambahan */
.bubble,.plan,.extra,.deck:not(.on),.deck-box{background-color:var(--glass-strong)}
.plan,.extra,.deck,.deck-box{box-shadow:inset 0 0 0 1px var(--glass-line),0 5px 0 var(--shade),var(--lift)}
.deck.on{box-shadow:inset 0 0 0 2.5px var(--dc),0 5px 0 var(--dd),var(--lift)}
.bubble{box-shadow:inset 0 0 0 2.5px var(--sun),0 5px 0 var(--sun-d),var(--lift)}
[data-langit=malam] .names li{background:rgba(255,255,255,.1)}
[data-langit=malam] .extra-n{color:#BFF0D2}
[data-langit=malam] .steps .done i{background:rgba(31,122,74,.55);color:#BFF0D2}
[data-langit=malam] .ticket .chip[aria-pressed=true]{background:var(--sun);color:var(--ink-fix)}
[data-langit=malam] .spin-plate{background:rgba(255,156,203,.14)}
.menu-row{background-color:var(--glass-strong)}
