/* ===== Loy Krathong — shared scene for the home, ranking, member, and legal pages ===== */
body.theme-loykratong{
  --verm:#E8C56B;
  --c:#E8C56B;
  --ink:#F7F1E4;
  --grey:rgba(247,241,228,.62);
  --rule:rgba(232,197,107,.28);
  background:#061018;
  color:#F7F1E4;
}
body.theme-loykratong #map,
body.theme-loykratong .leaflet-container{background:#071422}
body.theme-loykratong #scHome{
  --paper:transparent;
  --ink:#F7F1E4;
  --ink2:rgba(247,241,228,.74);
  --ink3:rgba(247,241,228,.46);
  --rule:rgba(232,197,107,.28);
  --card:rgba(8,18,28,.62);
  --tile:rgba(8,18,28,.5);
  --shadow:0 18px 40px -28px rgba(0,0,0,.85), inset 0 1px 0 rgba(232,197,107,.28);
  --net:.22;
  --l-green:#8CC63F; --l-amber:#E8C56B; --l-purple:#C9A6E8;
  color:#F7F1E4;
  background:transparent;
}
body.theme-loykratong #scHome .hw-fx{display:none}
body.theme-loykratong .lk-fx{
  position:fixed;inset:0;z-index:2;pointer-events:none;overflow:hidden;
  background:
    radial-gradient(1200px 700px at 78% -10%, rgba(232,197,107,.16), transparent 55%),
    radial-gradient(900px 500px at 10% 20%, rgba(40,70,110,.35), transparent 60%),
    linear-gradient(180deg, #071422 0%, #0c2438 38%, #0a3044 58%, #06202c 72%, #04141c 100%);
}
body.theme-loykratong.playing .lk-fx{display:none}
body.theme-loykratong .lk-moon{
  position:absolute;top:9vh;left:5vw;width:128px;height:128px;border-radius:50%;
  background:radial-gradient(circle at 38% 36%, #fff8e4 0 18%, #f3e2b0 42%, #e7cf86 70%, #d7b56a 100%);
  box-shadow:0 0 0 18px rgba(243,220,160,.08), 0 0 80px 24px rgba(232,197,107,.28), 0 0 160px 40px rgba(232,197,107,.12);
}
body.theme-loykratong .lk-moon i{position:absolute;border-radius:50%;background:rgba(160,120,60,.18)}
body.theme-loykratong .lk-moon i:nth-child(1){width:18px;height:14px;left:28px;top:36px}
body.theme-loykratong .lk-moon i:nth-child(2){width:10px;height:10px;left:70px;top:28px}
body.theme-loykratong .lk-moon i:nth-child(3){width:22px;height:16px;left:58px;top:68px}
body.theme-loykratong .lk-gleam{
  position:absolute;top:calc(9vh + 118px);left:calc(5vw + 50px);width:28px;height:46vh;
  background:linear-gradient(180deg, rgba(243,220,160,.55), rgba(243,220,160,0));
  filter:blur(8px);opacity:.55;animation:lkGleam 5.5s ease-in-out infinite;
}
@keyframes lkGleam{50%{opacity:.28;transform:scaleX(1.6)}}
body.theme-loykratong .lk-water{
  position:absolute;left:0;right:0;bottom:0;height:58%;
  background:#10151c;
  -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 18%, #000 100%);
  mask-image:linear-gradient(180deg, transparent 0%, #000 18%, #000 100%);
}
body.theme-loykratong .lk-water svg{
  position:absolute;left:-6%;top:-6%;width:112%;height:118%;display:block;
}
body.theme-loykratong .lk-water .lk-glint{
  position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;opacity:.22;
  background-image:
    radial-gradient(1.2px 1.2px at 12% 28%, rgba(255,255,255,.85), transparent 60%),
    radial-gradient(1px 1px at 28% 62%, rgba(255,248,230,.7), transparent 60%),
    radial-gradient(1.4px 1.4px at 47% 40%, rgba(255,255,255,.8), transparent 60%),
    radial-gradient(1px 1px at 63% 74%, rgba(232,220,190,.75), transparent 60%),
    radial-gradient(1.2px 1.2px at 81% 36%, rgba(255,255,255,.7), transparent 60%),
    radial-gradient(1px 1px at 18% 82%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(1px 1px at 72% 18%, rgba(255,248,230,.6), transparent 60%);
  background-size:280px 180px;
  animation:lkGlint 16s linear infinite;
}
@keyframes lkGlint{to{background-position:280px 80px}}
body.theme-loykratong .lk-petal{
  position:absolute;width:14px;height:10px;border-radius:70% 10% 70% 10%;
  background:linear-gradient(135deg,#f6d5dc,#e7a0ae);opacity:.7;
  animation:lkFall linear infinite;filter:drop-shadow(0 2px 2px rgba(0,0,0,.25));
}
body.theme-loykratong .lk-petal.gold{background:linear-gradient(135deg,#ffe7a4,#e8c56b);width:11px;height:8px}
@keyframes lkFall{
  0%{transform:translateY(-10vh) rotate(0deg);opacity:0}
  12%{opacity:.75}
  100%{transform:translateY(105vh) rotate(240deg);opacity:0}
}
body.theme-loykratong .lk-lans{position:absolute;inset:0;overflow:hidden}
body.theme-loykratong .lk-lan{
  position:absolute;bottom:36%;width:32px;height:50px;
  animation:lkRise linear infinite;
  filter:drop-shadow(0 0 10px rgba(255,150,50,.4));
}
body.theme-loykratong .lk-lan.sm{width:18px;height:30px;filter:drop-shadow(0 0 6px rgba(255,150,50,.28))}
body.theme-loykratong .lk-lan.lg{width:44px;height:66px}
@keyframes lkRise{
  0%{transform:translate3d(0,16vh,0);opacity:0}
  12%{opacity:.92}
  100%{transform:translate3d(var(--dx,3vw),-88vh,0);opacity:0}
}
body.theme-loykratong .lk-lan-sway{width:100%;height:100%;transform-origin:50% 12%;animation:lkSway 5.4s ease-in-out infinite}
@keyframes lkSway{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(7deg)}}
body.theme-loykratong .lk-paper{
  position:absolute;left:0;right:0;top:7px;bottom:7px;border-radius:42% 42% 36% 36%;
  background:
    linear-gradient(90deg, rgba(255,255,255,.34), transparent 30%, transparent 72%, rgba(90,32,8,.2)),
    repeating-linear-gradient(90deg, transparent 0 7px, rgba(110,48,12,.2) 7px 8px),
    radial-gradient(ellipse at 50% 58%, #fff4cc 0%, #ffc56b 34%, #ee8432 70%, #c2591c 100%);
  box-shadow:inset 0 7px 8px rgba(255,255,255,.3), inset 0 -8px 12px rgba(255,176,70,.5);
}
body.theme-loykratong .lk-paper::before{
  content:"";position:absolute;left:50%;top:-6px;width:9px;height:7px;transform:translateX(-50%);
  background:#e7b15a;border-radius:3px 3px 1px 1px;box-shadow:0 -3px 0 -1px #b8742c;
}
body.theme-loykratong .lk-paper::after{
  content:"";position:absolute;left:12%;right:12%;bottom:-2px;height:6px;border-radius:50%;
  background:radial-gradient(ellipse at 50% 35%, #ffd27a, #8d3a12 72%);
  box-shadow:0 0 8px rgba(255,160,60,.75);
}
body.theme-loykratong .lk-lan-flame{
  position:absolute;left:50%;bottom:1px;width:6px;height:11px;margin-left:-3px;border-radius:50%;
  background:radial-gradient(circle at 50% 75%, #fff6d2, #ffb15a 46%, transparent 72%);
  transform-origin:50% 100%;animation:lkLanFlick .48s ease-in-out infinite;
}
@keyframes lkLanFlick{50%{transform:scale(1.12,.86)}}
body.theme-loykratong .lk-floats{position:absolute;left:0;right:0;bottom:0;height:34%;overflow:hidden}
body.theme-loykratong .lk-kr{
  position:absolute;width:108px;height:72px;animation:lkDrift linear infinite;
  filter:drop-shadow(0 10px 8px rgba(0,0,0,.35));
}
body.theme-loykratong .lk-kr svg{width:100%;height:100%;display:block;overflow:visible}
body.theme-loykratong .lk-kr-in{width:100%;height:100%;transform-origin:50% 72%}
body.theme-loykratong .lk-shine{
  position:absolute;left:18%;right:18%;bottom:-6px;height:8px;border-radius:50%;
  background:radial-gradient(closest-side, rgba(255,177,90,.55), transparent);
  filter:blur(2px);
}
body.theme-loykratong .lk-flame{transform-origin:60px 22px;animation:lkFlick .45s ease-in-out infinite}
@keyframes lkFlick{0%,100%{transform:scale(1) rotate(-3deg)}50%{transform:scale(1.08,.92) rotate(4deg)}}
@keyframes lkDrift{0%{transform:translateX(-30vw)}100%{transform:translateX(115vw)}}
body.theme-loykratong #scHome .net{opacity:0}
body.theme-loykratong #scHome .grain{opacity:.22;background-image:radial-gradient(rgba(232,197,107,.08) 1px, transparent 1.4px);background-size:16px 16px}
body.theme-loykratong #scHome .mkrow .mk [fill="#111111"],
body.theme-loykratong #scHome .emenu .brand .mk [fill="#111111"]{fill:#10202C}
body.theme-loykratong #scHome .mkrow .mk [fill="#FAFAFA"],
body.theme-loykratong #scHome .emenu .brand .mk [fill="#FAFAFA"]{fill:#E8C56B}
body.theme-loykratong #scHome .iconbtn,
body.theme-loykratong #scHome .rankchip,
body.theme-loykratong #scHome .acctpop .authpill,
body.theme-loykratong #scHome .langsw,
body.theme-loykratong #scHome .lchip,
body.theme-loykratong #scHome .board,
body.theme-loykratong #scHome .emenu,
body.theme-loykratong #scHome .ann,
body.theme-loykratong #scHome .kick{
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-color:rgba(232,197,107,.38)!important;
  box-shadow:0 18px 40px -28px rgba(0,0,0,.85), inset 0 1px 0 rgba(232,197,107,.22);
}
body.theme-loykratong #scHome h1.hd{color:#FFF8EC!important;text-shadow:0 10px 28px rgba(0,0,0,.45)}
body.theme-loykratong #scHome h1.hd::after{
  content:"";position:absolute;left:50%;top:-22px;width:34px;height:22px;transform:translateX(-50%);
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 22'%3E%3Cpath fill='%231F6A45' d='M17 20C8 20 2 15 0 8c4 3 9 4 17 3 8 1 13 0 17-3-2 7-8 12-17 12z'/%3E%3Ccircle cx='12' cy='8' r='2.2' fill='%23E7A0AE'/%3E%3Ccircle cx='17' cy='6' r='2.4' fill='%23E8C56B'/%3E%3Ccircle cx='22' cy='8' r='2.2' fill='%23F4D7DE'/%3E%3Cpath fill='%23FFB15A' d='M17 1c1 2 2.2 2.4 2.2 4a2.2 2.2 0 1 1-4.4 0C14.8 3.4 16 3 17 1z'/%3E%3C/svg%3E") center/contain no-repeat;
  pointer-events:none;
}
body.theme-loykratong #scHome .esub{color:rgba(247,241,228,.78)}
body.theme-loykratong #scHome .kick{background:rgba(8,18,28,.72);color:rgba(247,241,228,.82)}
body.theme-loykratong #scHome .kick .live{background:#FFB15A;box-shadow:0 0 0 4px rgba(255,177,90,.25);animation:lkPulse 1.8s ease-in-out infinite}
@keyframes lkPulse{50%{opacity:.45}}
body.theme-loykratong #scHome .lchip{background:rgba(8,18,28,.7)!important;color:#F7F1E4}
body.theme-loykratong #scHome .board,
body.theme-loykratong #scHome .emenu,
body.theme-loykratong #scHome .ann{background:rgba(8,18,28,.72)!important;position:relative;overflow:hidden}
body.theme-loykratong #scHome .board .bh .k,
body.theme-loykratong #scHome .ann .k{color:rgba(232,197,107,.8)}
body.theme-loykratong #scHome .board .bh a{color:#E8C56B}
body.theme-loykratong #scHome .board .r.you::before{background:#E8C56B;box-shadow:0 0 10px rgba(232,197,107,.7)}
body.theme-loykratong #scHome .board .r.you .nm,
body.theme-loykratong #scHome .board .r.you .rk{color:#E8C56B}
body.theme-loykratong #scHome .emenu .brand h2{color:#FFF8EC}
body.theme-loykratong #scHome .mode{border-bottom-color:rgba(232,197,107,.16)}
body.theme-loykratong #scHome .mode:hover{background:rgba(232,197,107,.06)}
body.theme-loykratong #scHome .mode.feat{border-color:rgba(232,197,107,.55);background:rgba(232,197,107,.1)}
body.theme-loykratong #scHome .socs a:hover{background:#E8C56B;color:#1a1208}
body.theme-loykratong #scHome .ann .dots button.on,
body.theme-loykratong #scHome .ann .dots button[aria-current=true],
body.theme-loykratong #scHome .langsw button[aria-pressed=true]{background:#E8C56B;color:#1a1208}
body.theme-loykratong #scHome .langsw{background:rgba(8,18,28,.78)!important}
body.theme-loykratong #scHome .foota,
body.theme-loykratong #scHome .foota a{color:rgba(247,241,228,.45)}
body.theme-loykratong #scHome .foota b{color:rgba(247,241,228,.72)}
body.theme-loykratong .veil.night,
body.theme-loykratong #scStart,
body.theme-loykratong #scQuiz,
body.theme-loykratong #scFun,
body.theme-loykratong #scMulti,
body.theme-loykratong #scSkins{
  --card:rgba(8,18,28,.9);
  --bg:transparent;
  --txt:#F7F1E4;
  --txt2:rgba(247,241,228,.68);
  --sep:rgba(232,197,107,.22);
  --tint:#E8C56B;
  color:#F7F1E4;
  background:transparent !important;
}
body.theme-loykratong .veil.night .panel,
body.theme-loykratong #scStart .panel,
body.theme-loykratong #scQuiz .panel,
body.theme-loykratong #scFun .panel{
  background:rgba(8,18,28,.88)!important;
  border:1px solid rgba(232,197,107,.4)!important;
  box-shadow:0 18px 40px -24px rgba(0,0,0,.8), inset 0 1px 0 rgba(232,197,107,.25)!important;
}
body.theme-loykratong .veil.night .navbar,
body.theme-loykratong #scStart .navttl,
body.theme-loykratong #scQuiz .navttl,
body.theme-loykratong #scFun .navttl{color:#F7F1E4}
body.theme-loykratong .tapbar{
  background:linear-gradient(135deg,#E8C56B,#C4923A)!important;
  border-color:transparent!important;
  color:#1a1208!important;
  box-shadow:0 0 24px rgba(232,197,107,.35)!important;
}
body.theme-loykratong #scResult{
  background:transparent !important;
  color:#F7F1E4;
}
body.theme-loykratong #scResult .nrcard{
  background:rgba(8,18,28,.9)!important;
  border-color:rgba(232,197,107,.35)!important;
}
body.theme-loykratong .sheet{
  background:rgba(8,16,26,.97)!important;
  color:#F7F1E4;
  border:1px solid rgba(232,197,107,.35);
}
body.theme-loykratong .topbar{color:#F7F1E4}
body.theme-loykratong #topbar,
body.theme-loykratong #fTop,
body.theme-loykratong #qTop{
  background:linear-gradient(rgba(7,20,34,.82), rgba(7,20,34,0));
}
/* ranking and member: the header wash has to span the viewport.
   The bar lives inside the centered column, so a background on .topbar
   stops short and leaves the viewport corners a different color. */
body.theme-loykratong .page::before{
  content:"";
  position:absolute;
  z-index:1;
  left:0;right:0;top:0;
  height:148px;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(7,20,34,.62), rgba(7,20,34,0));
}
body.theme-loykratong .exit,
body.theme-loykratong .accbox,
body.theme-loykratong .statcard{
  background:rgba(8,18,28,.88);color:#F7F1E4;border:1px solid rgba(232,197,107,.35);
}
body.theme-loykratong .mode-t,
body.theme-loykratong .dir,
body.theme-loykratong .dir b,
body.theme-loykratong .prog{color:#F7F1E4}
body.theme-loykratong .progbar{background:rgba(247,241,228,.16)}
body.theme-loykratong .progbar i{background:#E8C56B}
body.theme-loykratong .sign{box-shadow:0 10px 30px rgba(0,0,0,.4)}
body.theme-loykratong .center{background:#F7F1E4;color:#14202A}
body.theme-loykratong .target .todo{color:#b7b1a4}
@media(max-width:920px){
  body.theme-loykratong .lk-moon{width:78px;height:78px;top:-18px;left:-24px}
  body.theme-loykratong .lk-gleam{display:none}
  body.theme-loykratong .lk-kr:nth-child(n+4){display:none}
  body.theme-loykratong .lk-lan:nth-child(n+5){display:none}
  body.theme-loykratong #scHome h1.hd::after{top:-16px;width:28px;height:18px}
}
@media(prefers-reduced-motion:reduce){
  body.theme-loykratong .lk-kr,
  body.theme-loykratong .lk-flame,
  body.theme-loykratong .lk-gleam,
  body.theme-loykratong .lk-water .lk-glint,
  body.theme-loykratong .lk-lan,
  body.theme-loykratong .lk-lan-sway,
  body.theme-loykratong .lk-lan-flame,
  body.theme-loykratong .lk-petal,
  body.theme-loykratong #scHome .kick .live{animation:none}
}

/* ranking, member, about, privacy, terms, contact — content stays above the river */
body.theme-loykratong .page,
body.theme-loykratong .wrap{
  position:relative;
  z-index:3;
  background:transparent;
}
/* member and legal: a soft column, not a rounded frame.
   The hairline only showed at the corners of a tall page. */
body.theme-loykratong .wrap::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:-36px;right:-36px;top:0;bottom:0;
  pointer-events:none;
  background:rgba(7,16,28,.74);
  -webkit-mask-image:
    linear-gradient(180deg, transparent, #000 52px, #000 calc(100% - 72px), transparent),
    linear-gradient(90deg, transparent, #000 40px, #000 calc(100% - 40px), transparent);
  -webkit-mask-composite:source-in;
  mask-image:
    linear-gradient(180deg, transparent, #000 52px, #000 calc(100% - 72px), transparent),
    linear-gradient(90deg, transparent, #000 40px, #000 calc(100% - 40px), transparent);
  mask-composite:intersect;
}
body.theme-loykratong:has(.wrap):not(:has(#scHome)) .lk-floats{display:none}
body.theme-loykratong .net{opacity:.16;filter:drop-shadow(0 0 8px rgba(232,197,107,.28))}
body.theme-loykratong .grain{opacity:.22;background-image:radial-gradient(rgba(232,197,107,.08) 1px, transparent 1.4px);background-size:16px 16px}
body.theme-loykratong .iconbtn,
body.theme-loykratong .rankchip,
body.theme-loykratong .ghost,
body.theme-loykratong .card,
body.theme-loykratong .filters,
body.theme-loykratong .board,
body.theme-loykratong .kick,
body.theme-loykratong .kickbar,
body.theme-loykratong .rhead .players,
body.theme-loykratong .segsm,
body.theme-loykratong .acctpop .authpill{
  background:rgba(8,18,28,.78)!important;
  border-color:rgba(232,197,107,.38)!important;
  box-shadow:0 18px 40px -28px rgba(0,0,0,.85), inset 0 1px 0 rgba(232,197,107,.22);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  color:#F7F1E4;
}
body.theme-loykratong .iconbtn:hover,
body.theme-loykratong .rankchip:hover,
body.theme-loykratong .ghost:hover{border-color:#E8C56B!important;color:#E8C56B}
body.theme-loykratong .brand,
body.theme-loykratong .mkrow{color:#FFF8EC}
body.theme-loykratong .brand .mk [fill="#111111"],
body.theme-loykratong .mkrow .mk [fill="#111111"],
body.theme-loykratong .brand .mk [fill="#141414"]{fill:#10202C}
body.theme-loykratong .brand .mk [fill="#FAFAFA"],
body.theme-loykratong .mkrow .mk [fill="#FAFAFA"]{fill:#E8C56B}
body.theme-loykratong h1,
body.theme-loykratong .rhead h1{color:#FFF8EC;text-shadow:0 10px 28px rgba(0,0,0,.45)}
body.theme-loykratong h2{color:#E8C56B}
body.theme-loykratong a.inl{color:#E8C56B;border-bottom-color:rgba(232,197,107,.4)}
body.theme-loykratong .foot,
body.theme-loykratong .foota{color:rgba(247,241,228,.45);border-top-color:rgba(232,197,107,.25)}
body.theme-loykratong .foot a,
body.theme-loykratong .foota a{color:rgba(232,197,107,.75);border-bottom-color:rgba(232,197,107,.3)}
body.theme-loykratong section{border-bottom-color:rgba(232,197,107,.22)}
body.theme-loykratong .introbox,
body.theme-loykratong #body .box{background:rgba(8,18,28,.78)!important;border-color:rgba(232,197,107,.35)!important;color:#F7F1E4}
body.theme-loykratong .modal .sheet{background:rgba(8,16,26,.97)!important;color:#F7F1E4;border:1px solid rgba(232,197,107,.35)}