:root{ --bg:#F7F7F9; --surface:#FFFFFF; --surface2:#FFF9F5; --surface3:#FFF4EB; --line:rgba(15,23,42,.08); --line-strong:rgba(15,23,42,.12);
--txt:#101828; --txt-strong:#172033; --muted:rgba(16,24,40,.62); --muted-2:rgba(16,24,40,.48);
--pri:#F27A2E; --pri2:#E8641C; --hot:#FF934D;
--focus:rgba(242,122,46,.24); --radius:24px; --radius-lg:28px; --radius-md:18px; --radius-sm:14px;
--shadow-hero:0 22px 50px rgba(17,24,39,.11); --shadow-card:0 14px 30px rgba(17,24,39,.08); --shadow-soft:0 8px 18px rgba(17,24,39,.06); --shadow-float:0 18px 38px rgba(17,24,39,.10);
--max-mobile:430px; }
*{ box-sizing:border-box; }
html{ -webkit-overflow-scrolling:touch; }
body{ margin:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,"Noto Sans Thai",sans-serif; background: radial-gradient(900px 380px at 50% -10%, rgba(242,122,46,.12), transparent 60%), linear-gradient(180deg, #FFF7F1 0%, #F7F7F9 100%); min-height:100svh; min-height:100dvh; -webkit-text-size-adjust:100%; display:flex; justify-content:center; }
a{ color:inherit; }
input, select, textarea{ font-size:16px; }
.wrap{ max-width:var(--max-mobile); margin:0 auto; padding-left:max(12px, env(safe-area-inset-left)); padding-right:max(12px, env(safe-area-inset-right)); padding-top:max(12px, env(safe-area-inset-top)); padding-bottom:max(18px, env(safe-area-inset-bottom)); }
.glass{ background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.94)); border-radius:var(--radius); box-shadow:var(--shadow-card); position:relative; overflow:hidden; padding-left:22px; backdrop-filter:blur(8px); }
.glass::before{ content:""; position:absolute; left:0; top:12px; bottom:12px; width:6px; background:linear-gradient(180deg, var(--pri), var(--pri2)); border-radius:999px; opacity:.95; pointer-events:none; }
.glass::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(255,255,255,.24), transparent 28%); pointer-events:none; }
.glass.bar-indigo::before{ background:linear-gradient(180deg, var(--pri2), var(--pri)); }
.glass.bar-orange::before{ background:linear-gradient(180deg, var(--pri), #FF9A57); }
.topbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.brand{ display:flex; align-items:center; gap:12px; min-width:0; flex:1; }
.brand img{ box-shadow:0 14px 28px rgba(17,24,39,.12); border:1px solid rgba(0,0,0,.05); background:#fff; }
.brand .name{ font-weight:950; letter-spacing:.1px; line-height:1.2; color:var(--txt-strong); }
.brand .tag{ color:var(--muted); margin-top:3px; line-height:1.45; }
.topCtaWrap{ display:flex; flex-shrink:0; align-items:center; }
.topCtaBtn{ display:inline-flex; align-items:center; justify-content:center; font-weight:950; letter-spacing:.1px; text-decoration:none; white-space:nowrap; color:#fff; background:linear-gradient(180deg, #FF9E5D 0%, #F27A2E 55%, #DE6118 100%); border:1px solid rgba(0,0,0,.05); box-shadow: 0 14px 28px rgba(242,122,46,.28), inset 0 1px 0 rgba(255,255,255,.22); -webkit-tap-highlight-color:transparent; touch-action:manipulation; position:relative; z-index:5; transition:transform .18s ease, filter .18s ease, box-shadow .18s ease; }
.topCtaBtn:hover{ transform:translateY(-1px); filter:brightness(1.02); box-shadow: 0 18px 34px rgba(242,122,46,.30), inset 0 1px 0 rgba(255,255,255,.24); }
.topCtaBtn:focus-visible, .socialBtn:focus-visible, .phoneBright:focus-visible, .cardLink:focus-visible .card{ outline:3px solid var(--focus); outline-offset:2px; }
.pill{ display:inline-flex; align-items:center; gap:8px; border-radius:999px; border:1px solid rgba(242,122,46,.16); background:rgba(242,122,46,.07); color:rgba(17,24,39,.72); box-shadow:var(--shadow-soft); }
.hero{ }
.heroGrid{ display:grid; grid-template-columns:1fr; gap:12px; }
.heroMain, .heroSide{ border-radius:22px; border:1px solid var(--line); background:var(--surface2); overflow:hidden; box-shadow:var(--shadow-hero); }
.heroMain{ padding:0; position:relative; display:flex; }
.heroSide{ padding:0; display:flex; }
.heroSlider .slides{ display:flex; height:100%; animation:heroSlide 18s infinite; }
.heroSlider .slide{ width:100%; height:100%; flex-shrink:0; display:block; -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
.promoFrame{ width:100%; height:100%; position:relative; display:flex; align-items:center; justify-content:center; background-size:cover; background-position:center; background-repeat:no-repeat; overflow:hidden; }
.promoFrame::before{ content:""; position:absolute; inset:0; background:inherit; filter:blur(16px); transform:scale(1.14); opacity:.34; }
.promoFrame::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.03)); }
.promoFrame img{ position:relative; z-index:1; width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
@keyframes heroSlide{ 0%{transform:translateX(0)} 30%{transform:translateX(0)} 35%{transform:translateX(-100%)} 65%{transform:translateX(-100%)} 70%{transform:translateX(-200%)} 95%{transform:translateX(-200%)} 100%{transform:translateX(0)} }
.dots{ position:absolute; left:50%; bottom:10px; transform:translateX(-50%); display:flex; gap:8px; border-radius:999px; background:rgba(255,255,255,.88); border:1px solid rgba(255,255,255,.75); box-shadow:0 12px 22px rgba(17,24,39,.10); z-index:2; }
.dots .dot{ width:7px; height:7px; border-radius:999px; background:rgba(15,23,42,.20); transition:transform .2s ease; }
.dots .d1{animation:dot1 18s infinite} .dots .d2{animation:dot2 18s infinite} .dots .d3{animation:dot3 18s infinite}
@keyframes dot1{ 0%,30%{ background:var(--pri); transform:scale(1.35) } 35%,100%{ background:rgba(15,23,42,.20); transform:scale(1) } }
@keyframes dot2{ 0%,34%{ background:rgba(15,23,42,.20); transform:scale(1) } 35%,65%{ background:var(--pri2); transform:scale(1.35) } 70%,100%{ background:rgba(15,23,42,.20); transform:scale(1) } }
@keyframes dot3{ 0%,69%{ background:rgba(15,23,42,.20); transform:scale(1) } 70%,95%{ background:var(--hot); transform:scale(1.35) } 100%{ background:rgba(15,23,42,.20); transform:scale(1) } }
.section{ margin-top:12px; }
.sectionHead{ display:flex; flex-direction:column; align-items:flex-start; gap:8px; }
.sectionHead .title{ font-weight:950; font-size:18px; line-height:1.2; color:var(--txt-strong); }
.sectionHead .desc{ color:var(--muted); font-size:12.5px; line-height:1.5; }
.cards{ display:grid; grid-template-columns:1fr; gap:12px; }
.card{ background:linear-gradient(180deg, #FFFFFF 0%, #FFFDFB 100%); box-shadow: 0 10px 22px rgba(17,24,39,.06), 0 2px 6px rgba(17,24,39,.03); position:relative; overflow:hidden; }
.card::before{ content:""; position:absolute; left:0; top:12px; bottom:12px; width:4px; background:linear-gradient(180deg, var(--pri), var(--pri2)); border-radius:999px; opacity:.95; pointer-events:none; }
.card .k{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.badge{ color:rgba(17,24,39,.76); border-radius:999px; border:1px solid rgba(0,0,0,.06); }
.card .h{ font-weight:950; line-height:1.28; color:var(--txt-strong); }
.card .p{ color:var(--muted); line-height:1.62; }
.cardLink{ display:block; text-decoration:none; color:inherit; -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
.cardLink .card{ height:100%; transition:transform .16s ease, box-shadow .16s ease, filter .16s ease, border-color .16s ease; }
.cardLink:hover .card{ transform:translateY(-2px); filter:brightness(1.01); box-shadow:0 18px 34px rgba(17,24,39,.10); border-color:rgba(242,122,46,.16); }
.contactGrid{ display:grid; grid-template-columns:1fr; gap:12px; }
.inputLike{ display:flex; align-items:flex-start; border:1px solid var(--line); background:linear-gradient(180deg, #FFFFFF, #FFFDFC); width:100%; box-shadow:var(--shadow-soft); }
.ico{ border:1px solid rgba(0,0,0,.06); display:flex; align-items:center; justify-content:center; font-weight:900; flex-shrink:0; }
.val{ font-weight:900; word-break:break-word; }
.hint{ color:var(--muted); margin-top:3px; line-height:1.45; }
.phoneBright{ display:inline-flex; align-items:center; gap:8px; border-radius:999px; border:1px solid rgba(242,122,46,.24); background:rgba(242,122,46,.10); color:#1f2937; text-decoration:none; box-shadow:0 8px 18px rgba(242,122,46,.12); -webkit-tap-highlight-color:transparent; touch-action:manipulation; font-weight:900; transition:transform .16s ease, filter .16s ease, box-shadow .16s ease; }
.phoneBright:hover{ transform:translateY(-1px); filter:brightness(1.01); box-shadow:0 12px 22px rgba(242,122,46,.16); }
.phoneBright .picon{ width:22px; height:22px; border-radius:8px; display:flex; align-items:center; justify-content:center; background:rgba(242,122,46,.16); border:1px solid rgba(0,0,0,.05); }
.socialRow{ display:flex; flex-direction:column; gap:10px; margin-top:10px; }
.socialBtn{ display:flex; align-items:center; gap:10px; border:1px solid var(--line); background:linear-gradient(180deg, #FFFFFF, #FFFDFC); text-decoration:none; transition:transform .15s ease, filter .15s ease, box-shadow .15s ease, border-color .15s ease; -webkit-tap-highlight-color:transparent; touch-action:manipulation; box-shadow:var(--shadow-soft); width:100%; }
.socialBtn:hover{ transform:translateY(-2px); filter:brightness(1.01); box-shadow:0 16px 30px rgba(17,24,39,.08); border-color:rgba(242,122,46,.14); }
.socialBtn img{ background:#fff; box-shadow:0 8px 16px rgba(17,24,39,.08); flex-shrink:0; }
.socialBtn .sname{ font-weight:950; color:var(--txt-strong); }
.socialBtn .sdesc{ color:var(--muted); margin-top:2px; line-height:1.4; }
.footer{ padding:16px; }
.compactFooter{ padding-top:16px; padding-bottom:16px; }
.footBrand{ font-weight:950; line-height:1.25; color:var(--txt-strong); }
.footer .footText{ margin-top:6px; font-size:12px; line-height:1.6; color:var(--muted); }
.footMini{ margin-top:8px; font-size:11.5px; line-height:1.7; color:rgba(16,24,40,.58); }
.divider{ height:1px; background:rgba(0,0,0,.08); margin:14px 0 0 0; }
.copy{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; color:var(--muted); font-size:11.5px; padding-top:12px; }
.resultCard{ background:transparent; padding:0; }
.resultWrap{ width:100%; display:flex; flex-direction:column; border:1px solid rgba(242,122,46,.14); box-shadow: 0 18px 38px rgba(242,122,46,.10), 0 8px 18px rgba(17,24,39,.05); overflow:hidden; background: radial-gradient(900px 320px at 10% 0%, rgba(242,122,46,.16), transparent 60%), radial-gradient(700px 260px at 95% 10%, rgba(255,147,77,.14), transparent 55%), linear-gradient(180deg, #FFF7F1 0%, #FFFDFB 100%); }
.resultHeader{ display:flex; flex-direction:column; gap:3px; }
.resultTitle{ font-weight:950; letter-spacing:.1px; line-height:1.25; }
.resultDate{ color:var(--muted); line-height:1.4; }
.resultGrid{ display:grid; gap:10px; min-height:0; }
.resultBox{ background:rgba(255,255,255,.95); border:1px solid rgba(0,0,0,.05); box-shadow:0 10px 22px rgba(17,24,39,.07); position:relative; overflow:hidden; }
.resultBox::before{ content:""; position:absolute; left:0; top:10px; bottom:10px; width:4px; background:linear-gradient(180deg, var(--pri), var(--pri2)); border-radius:999px; opacity:.95; pointer-events:none; }
.resultBox.r2::before{ background:linear-gradient(180deg, var(--pri2), var(--hot)); }
.resultBox.r3::before{ background:linear-gradient(180deg, var(--hot), #FFB067); }
.resultBox.r4::before{ background:linear-gradient(180deg, #FF9A57, var(--pri)); }
.resultBox.r1{ background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(255,253,251,.98) 100%), radial-gradient(280px 120px at 50% -10%, rgba(242,122,46,.09), transparent 70%); }
.r1Top{ display:flex; align-items:center; justify-content:flex-start; }
.r1PrizeWrap{ display:flex; justify-content:center; }
.r1PrizePill{ display:inline-flex; align-items:center; justify-content:center; border-radius:999px; background:linear-gradient(180deg, rgba(242,122,46,.12), rgba(242,122,46,.06)); border:1px solid rgba(242,122,46,.16); box-shadow:0 8px 16px rgba(242,122,46,.08); }
.r1PrizePill .rPrize{ margin-top:0; font-weight:950; color:#9A3412; }
.rBadge{ display:inline-flex; align-items:center; justify-content:center; border-radius:999px; font-weight:950; color:#fff; background:linear-gradient(180deg, var(--pri), var(--pri2)); box-shadow:0 8px 16px rgba(232,100,28,.14); }
.rBadge.ghost{ color:#B45309; background:rgba(242,122,46,.10); border:1px solid rgba(242,122,46,.20); box-shadow:none; }
.rNum{ margin-top:6px; font-weight:950; color:#0f172a; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:clip; line-height:1.04; }
.resultBox.r1 .rNum.big{ font-size:clamp(42px, 13vw, 58px); letter-spacing:.12em; text-shadow:0 8px 18px rgba(15,23,42,.05); }
.resultBox.r2 .rNum.huge{ font-size:clamp(30px, 10vw, 42px); letter-spacing:.04em; }
.rNum.mid{ font-size:clamp(17px, 5vw, 24px); letter-spacing:.08em; }
.rPrize{ margin-top:7px; text-align:center; color:#111827; font-weight:800; line-height:1.4; }
.resultBox.r2 .rPrize, .resultBox.r3 .rPrize, .resultBox.r4 .rPrize{ font-size:11.5px; font-weight:900; color:#111827; }
.resultBox.r2{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding-top:14px; padding-bottom:14px; }
.resultRow2{ gap:10px; }
.seoIntro{ margin-top:12px; }
.seoHeading{ line-height:1.3; font-weight:950; }
.seoSubHeading{ line-height:1.35; font-weight:900; }
.seoText{ line-height:1.72; }
.seoStack{ display:grid; grid-template-columns:1fr; gap:12px; }
.seoBlock{ border:1px solid var(--line); background:linear-gradient(180deg, #FFFFFF 0%, #FFFDFB 100%); box-shadow:var(--shadow-soft); position:relative; overflow:hidden; }
.seoBlock::before{ content:""; position:absolute; left:0; top:10px; bottom:10px; width:4px; background:linear-gradient(180deg, var(--pri), var(--pri2)); border-radius:999px; opacity:.95; }
.articleHead{ margin-bottom:6px; }
.articleHead .title{ font-size:20px; font-weight:950; line-height:1.2; color:var(--txt-strong); }
.articleHead .desc{ font-size:13px; color:var(--muted); }
@media (min-width:431px){ .wrap{ max-width:430px; } }
/* Homepage only. No application bindings, links or content are changed. */
:root{--pri:#792b91;--pri2:#5b206e;--hot:#a453b6;--txt:#241c2d;--txt-strong:#452052;--muted:#6c6474;--surface2:#f7f2fa;--surface3:#f0e7f5;--line:#e9e2ed;--focus:#b78bc8;--green:#087247}
body{background:#f6f3f8;color:var(--txt);font-family:Tahoma,"Leelawadee UI",system-ui,sans-serif}
.wrap{max-width:430px;padding:12px 12px 24px}
.glass{padding:16px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 5px 18px rgba(53,28,64,.035);backdrop-filter:none}
.glass::before,.glass::after,.card::before,.resultBox::before{display:none}
.topbar{gap:10px}.brand{gap:9px}.brand img{width:42px;height:42px;border-radius:12px;box-shadow:none}
.brand .name{font-size:17px;font-weight:700}.brand .tag{font-size:11px;line-height:1.55}
.topCtaBtn{min-height:44px;padding:10px 14px;border-radius:12px;background:var(--green);box-shadow:none;font-size:14px;font-weight:700;border:none}
.topCtaBtn:hover{background:#065c39;box-shadow:0 3px 10px #08724722;transform:none}
.hero{padding:0;border:0;background:transparent;box-shadow:none;margin-top:14px}
.heroGrid{gap:14px}.heroMain,.heroSide{box-shadow:none;border-radius:16px}
.heroMain{height:260px}.heroSide{border:none}
.heroSlider .slides{width:100%;flex:0 0 100%;min-width:0}
.heroSlider .slide{flex:0 0 100%;min-width:0}
.dots{padding:6px 9px;box-shadow:none;gap:6px}
.resultWrap{min-height:0;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:none}
.resultHeader{padding:16px 16px 10px;gap:5px}.resultTitle{font-size:17px;color:var(--txt-strong);font-weight:700}.resultDate{font-size:12px}
.resultGrid{gap:0;padding:0 14px 14px;grid-template-columns:1fr}
.resultBox{padding:12px 6px;background:transparent;border:0;border-radius:0;box-shadow:none}
.resultBox.r1{padding:8px 6px 16px;background:transparent;border-bottom:1px solid var(--line)}
.r1Top{justify-content:center;margin-bottom:8px}.rBadge{background:transparent;color:var(--txt-strong);box-shadow:none;padding:0;font-size:12px;font-weight:700}
.rNum{display:block;color:var(--txt-strong);font-weight:700;text-shadow:none}
.resultBox.r1 .rNum.big{font-size:50px;letter-spacing:.08em;text-shadow:none;margin-top:0}
.r1PrizeWrap{margin-top:8px}.r1PrizePill{padding:0;border:none;background:none;box-shadow:none}.r1PrizePill .rPrize{font-size:12px;color:var(--muted)}
.resultBox.r2{padding:14px 6px;border-bottom:1px solid var(--line);text-align:center}
.resultBox.r2 .rNum.huge{font-size:32px;margin:0 0 6px}
.rBadge.ghost{padding:0;background:transparent;border:0;color:var(--muted)}
.rPrize{display:block;font-size:11px;color:var(--muted);font-weight:400}
.resultRow2{display:grid;grid-template-columns:1fr 1fr;gap:0;padding-top:4px}
.resultBox.r4{border-left:1px solid var(--line)}.rNum.mid{font-size:22px;letter-spacing:.03em}
.section,.seoIntro{margin-top:18px}.seoIntro{background:transparent;border:0;box-shadow:none;padding:0 4px}
.seoHeading{font-size:19px;line-height:1.55;margin:0;color:var(--txt-strong)}
.seoText{font-size:13px;line-height:1.85;color:var(--muted);margin:6px 0 0}
.section{padding:16px}.sectionHead{gap:7px;margin-bottom:12px}.sectionHead .title,.articleHead .title{font-size:18px;font-weight:700;line-height:1.5;margin:0;text-align:left}
.sectionHead .desc,.articleHead .desc{font-size:12px;line-height:1.7}
.pill{font-size:11px;padding:5px 9px;background:var(--surface2);border:1px solid var(--line);box-shadow:none;color:var(--muted)}
.cards{gap:10px}
.card{min-height:0;border:1px solid var(--line);border-radius:13px;background:#fff;padding:12px;box-shadow:none}
.card .k{gap:4px}.badge{font-size:10px;padding:4px 7px;background:var(--surface2);border:0;color:#76617e}
.card .h{font-size:14px;line-height:1.6;margin-top:8px;font-weight:700}.card .p{font-size:12px;line-height:1.75;margin-top:5px}
.cardLink:hover .card{transform:none;filter:none;box-shadow:none;border-color:#b78bc8;background:#fcf9fd}
.contactGrid{gap:14px;margin-top:18px}.contactPanel{padding:16px}
.inputLike{border:0;border-radius:0;padding:10px 0;background:none;box-shadow:none;gap:10px}
.ico{border:0;background:var(--surface2);border-radius:9px;font-size:16px}
.val{font-size:13px;font-weight:700;overflow-wrap:anywhere}.hint{font-size:11px;line-height:1.65}
.phoneBright{padding:3px 0;border:0;background:transparent;box-shadow:none;color:var(--green);font-size:15px}
.phoneBright:hover{box-shadow:none;transform:none}.phoneBright .picon{display:none}
.socialRow{gap:8px}.socialBtn{padding:10px;border-radius:12px;background:#fff;box-shadow:none}
.socialBtn img{width:32px;height:32px;padding:4px;border-radius:9px;box-shadow:none}.socialBtn .sname{font-size:13px;font-weight:700}.socialBtn .sdesc{font-size:11px}
.socialBtn:hover{transform:none;box-shadow:none;border-color:#b78bc8}
.seoStack{display:flex;flex-direction:column;gap:0}.seoBlock{border:0;border-radius:0;background:none;box-shadow:none;padding:14px 0}
.seoBlock::before{display:none}.seoBlock+.seoBlock{border-top:1px solid var(--line)}
.seoSubHeading{font-size:15px;line-height:1.65;color:var(--txt-strong);margin:0;font-weight:700}
.footer{margin-top:18px;background:#f0e8f4;border:0;box-shadow:none}.footBrand{font-size:15px;font-weight:700}.footer .footText,.footMini,.copy{font-size:11px;line-height:1.8}
.topCtaBtn:focus-visible,.socialBtn:focus-visible,.phoneBright:focus-visible,.cardLink:focus-visible .card{outline:3px solid #a376b5;outline-offset:3px}
@media(max-width:360px){.glass{padding:12px}.hero{padding:0}.brand .tag{font-size:10px}.brand img{width:36px;height:36px}.topCtaBtn{padding:10px}.resultBox.r1 .rNum.big{font-size:42px}.rNum.mid{font-size:19px}.card{padding:10px}.card .h{font-size:13px}}
@media(prefers-reduced-motion:reduce){.heroSlider .slides,.dots .dot{animation:none}.topCtaBtn,.socialBtn,.cardLink .card{transition:none}}
/* Local SVG decoration: no external icon fonts or network dependencies. */
.feature-menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.feature-menu>.cardLink{min-width:0}
.feature-menu .card{height:100%;overflow:visible;display:flex;flex-direction:column;align-items:flex-start;gap:0}
.feature-menu .card::after{content:"";display:block;order:-1;width:44px;height:44px;flex:0 0 44px;margin-bottom:10px;border-radius:50%;background:#eee6fa url('../images/home/dream.svg') center/27px 27px no-repeat}
.feature-menu>.cardLink:nth-child(2) .card::after{background-color:#fbe7ed;background-image:url('../images/home/incense.svg')}
.feature-menu>.cardLink:nth-child(3) .card::after{background-color:#e1f4e9;background-image:url('../images/home/numbers.svg')}
.feature-menu>.cardLink:nth-child(4) .card::after{background-image:url('../images/home/shop.svg')}
.feature-menu .k{width:100%;justify-content:flex-start}.feature-menu .h{overflow-wrap:anywhere}.feature-menu .p{overflow-wrap:anywhere}
.wrap{width:100%;padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right));padding-top:max(12px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom))}
.wrap,.wrap *{min-width:0}
.brand .tag,.val,.seoText,.seoHeading,.seoSubHeading,.footMini,.card .p{overflow-wrap:anywhere}
.topbar{flex-wrap:wrap}.topCtaWrap{margin-left:auto}.brand{flex:1 1 155px}.brand img{flex-shrink:0}
.rNum{white-space:normal;overflow:visible;overflow-wrap:anywhere;line-height:1.25}
.resultRow2{grid-template-columns:repeat(2,minmax(0,1fr))}
.section,.seoIntro,.contactPanel,.footer,.card,.resultBox{overflow:visible}
.inputLike>div:last-child,.socialBtn>div{min-width:0;overflow-wrap:anywhere}
.phoneBright{flex-wrap:wrap}.socialBtn{min-height:44px}
.ico{width:1.9em;height:1.9em;flex:0 0 1.9em}
@media(max-width:360px){.feature-menu{grid-template-columns:1fr}.feature-menu .card{display:block;padding-left:66px;position:relative;min-height:90px}.feature-menu .card::after{position:absolute;left:12px;top:14px;width:42px;height:42px}.feature-menu .h{font-size:14px}.feature-menu .p{font-size:13px}}
/* Static layout helpers extracted from the ZUL markup. */
.home-layout-1{text-align:center; margin-top:8px;}
.home-layout-2{height:8px;}
.home-layout-3{margin-bottom:6px;}
.home-layout-4{height:10px}
/* Stronger brand hierarchy, scoped to the homepage including ZK labels. */
body{background:radial-gradient(ellipse at 50% 0,#e8d8f2 0,transparent 650px),#f3f0f6}
.wrap,.wrap .z-label,.wrap .z-a{font-family:"Leelawadee UI",Tahoma,Arial,sans-serif}
.wrap>.glass:first-child{background:linear-gradient(125deg,#431452,#792b91);border:1px solid #8e4fa1;box-shadow:0 10px 24px #4a1c6626}
.wrap>.glass:first-child .name{color:#fff;font-size:18px;letter-spacing:.15px}
.wrap>.glass:first-child .tag{color:#eee0f3}
.wrap .brand img{border:1px solid #c793d3;box-shadow:0 3px 10px #230d3833}
.wrap .topCtaBtn{background:linear-gradient(135deg,#128553,#056440);border:1px solid #45b481;box-shadow:0 4px 12px #172c3333;color:#fff}
.wrap .topCtaBtn:hover{background:#065c39}
.wrap .heroMain{border:1px solid #d1b4e0;box-shadow:0 8px 20px #51226416}
.wrap .resultWrap{background:#fff;border:1px solid #d7bce5;box-shadow:0 8px 24px #50205f12}
.wrap .resultHeader{background:linear-gradient(115deg,#4d195f,#7c3394);gap:6px}
.wrap .resultHeader .resultTitle{color:#fff;font-size:17px;font-weight:700}
.wrap .resultHeader .resultDate{color:#edddf2;font-size:12px}
.wrap .resultGrid{}
.wrap .resultBox.r1{background:radial-gradient(ellipse at 50% 20%,#f0e3fa,transparent 80%);border-bottom:1px solid #e5d2ee}
.wrap .r1Top .rBadge{background:#eee1f5;color:#5a226e;padding:5px 12px;border:1px solid #dbc2e6;border-radius:20px;font-size:12px}
.wrap .resultBox.r1 .rNum.big{color:#63267b;font-weight:800;line-height:1.25}
.wrap .r1PrizePill{background:#fff7df;border:1px solid #ead7a4;padding:6px 12px;border-radius:20px}
.wrap .r1PrizePill .rPrize{color:#795a12;font-weight:700}
.wrap .resultBox.r2 .rNum.huge{color:#087247;font-weight:800}
.wrap .rNum.mid{color:#62277a;font-weight:700}
.wrap .rBadge.ghost{color:#594361;font-weight:700}
.wrap .rPrize{color:#6b6071}
.wrap .sectionHead .title,.wrap .articleHead .title,.wrap .seoHeading{color:#541e69;font-weight:700}
.wrap .sectionHead .title,.wrap .articleHead .title{font-size:19px}
.wrap .sectionHead .desc,.wrap .articleHead .desc{color:#75677c;font-size:12px}
.wrap .section,.wrap .contactPanel{border-color:#ddcee6;box-shadow:0 6px 20px #4c20580b}
.wrap .pill{background:#eee1f6;border-color:#dac2e7;color:#6e3883}
.wrap .feature-menu .card{border:1px solid #d8bce9;background:linear-gradient(145deg,#f5ecfd,#eee1f8);box-shadow:0 4px 10px #693a8110}
.wrap .feature-menu>.cardLink:nth-child(2) .card{background:linear-gradient(145deg,#fff1f5,#f8e6ef);border-color:#e8c5d5}
.wrap .feature-menu>.cardLink:nth-child(3) .card{background:linear-gradient(145deg,#eefaf4,#dff2e8);border-color:#bbdccb}
.wrap .feature-menu>.cardLink:nth-child(4) .card{background:linear-gradient(145deg,#f3ebfc,#e9ddf7);border-color:#d5bce6}
.wrap .feature-menu .card::after{box-shadow:0 3px 8px #49205d15,inset 0 0 0 1px #ffffffb0;background-color:#fff9}
.wrap .feature-menu .h{color:#502062;font-weight:700}
.wrap .feature-menu>.cardLink:nth-child(3) .h{color:#075b3c}
.wrap .feature-menu .badge{background:#ffffffb8;color:#6e5578}
.wrap .feature-menu .p{color:#66566e}
.wrap .card .h .z-label{font-size:inherit;font-weight:inherit;color:inherit;line-height:inherit}
.wrap .card .p .z-label{font-size:inherit;color:inherit;line-height:inherit}
.wrap .articleHead~.cards .card{background:#faf5fd;border-color:#d9c2e5;border-left:3px solid #9951b0}
.wrap .phoneBright{color:#087247}.wrap .ico{background:#eee1f6}
.wrap .socialBtn{background:linear-gradient(110deg,#fff,#f7f1fb);border-color:#e1cfea}
.wrap .socialBtn .sname{color:#522366;font-weight:700}
.wrap .seoSubHeading{color:#632c77}
.wrap .footer{background:linear-gradient(130deg,#421651,#652579);border:1px solid #79428a;color:#f7edf9}
.wrap .footer .footBrand{color:#fff}.wrap .footer .footText,.wrap .footer .footMini,.wrap .footer .copy{color:#e3cfe9}
.wrap .footer .divider{background:#ffffff26}
/* Compact articles/contact/social sections, matching the selected layout. */
.wrap .articles-compact,.wrap .contact-compact,.wrap .social-compact{padding:0;background:transparent;border:0;box-shadow:none;border-radius:0}
.wrap .articles-compact .sectionHead,.wrap .contact-compact .sectionHead,.wrap .social-compact .sectionHead{margin-bottom:8px;gap:0}
.wrap .articles-compact .sectionHead .title,.wrap .contact-compact .sectionHead .title,.wrap .social-compact .sectionHead .title{font-size:17px;line-height:1.5}
.wrap .articles-compact .sectionHead .desc,.wrap .articles-compact .sectionHead>.pill,.wrap .articles-compact .card .k,.wrap .contact-compact .sectionHead .desc,.wrap .social-compact .sectionHead .desc{display:none}
.wrap .articles-compact .card,.wrap .articles-compact .articleHead~.cards .card{background:#fff;border:1px solid #eee5f3;border-radius:13px;padding:12px;box-shadow:none}
.wrap .articles-compact .card .h{margin:0;font-size:14px;line-height:1.6;color:#41234e}
.wrap .articles-compact .card .p{margin-top:4px;font-size:12px;line-height:1.7}
.wrap .contactGrid{gap:16px;margin-top:16px}
.wrap .contact-details{background:#fff;border:1px solid #eee5f3;border-radius:13px;padding:2px 12px}
.wrap .contact-details .inputLike{align-items:center;padding:9px 0;gap:10px}
.wrap .contact-details .inputLike+.home-layout-4{display:none}
.wrap .contact-details .inputLike~.inputLike{border-top:1px solid #ece5f0}
.wrap .contact-details .ico{border-radius:50%;background:#eee1f6}
.wrap .contact-details .inputLike:first-child .ico{background:#e1f4e9}
.wrap .contact-details .phoneBright,.wrap .contact-details .val{font-size:13px;line-height:1.6;font-weight:600;color:#35233f}
.wrap .contact-details .hint{font-size:10px;line-height:1.5;margin-top:2px}
.wrap .social-compact .socialRow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:0}
.wrap .social-compact .socialBtn{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:5px;padding:9px 4px;border:1px solid #eee5f3;border-radius:10px;background:#fff;box-shadow:none;text-align:center}
.wrap .social-compact .socialBtn img{width:25px;height:25px;padding:0;border-radius:50%;flex-shrink:0}
.wrap .social-compact .socialBtn .sname{font-size:11px;line-height:1.5;font-weight:600;color:#35233f;overflow-wrap:anywhere}
.wrap .social-compact .socialBtn .sdesc{display:none}
.wrap .social-compact .socialBtn:hover{border-color:#b78bc8;background:#faf5fd}
/* myApp.css applies color:var(--text)!important to all ZK labels.
   Override its token locally, without changing other application pages. */
.wrap .resultHeader .resultTitle{--text:#fff}
.wrap .resultHeader .resultDate{--text:#edddf2}
.wrap .resultBox.r1 .rNum.big{--text:#63267b}
.wrap .resultBox.r2 .rNum.huge{--text:#087247}
.wrap .rNum.mid{--text:#62277a}
.wrap .r1Top .rBadge{--text:#5a226e}
.wrap .r1PrizePill .rPrize{--text:#795a12}
.wrap .rBadge.ghost{--text:#594361}
.wrap .rPrize{--text:#6b6071}
.wrap .articleHead .title{--text:#541e69}
.wrap .card .h{--text:#41234e}
.wrap .card .p{--text:#66566e}
/* Native radio controls: tap or use arrow keys to hold a selected slide. */
.wrap .heroSlider .promo-choice{appearance:none;-webkit-appearance:none;position:absolute;z-index:5;bottom:6px;width:36px;height:36px;min-width:36px;margin:0;padding:0;border:0;border-radius:50%;cursor:pointer;background:radial-gradient(circle,#aaa 0 4px,#ffffffeb 5px 15px,transparent 16px);touch-action:manipulation}
.wrap .heroSlider .promo-choice-1{left:calc(50% - 54px)}
.wrap .heroSlider .promo-choice-2{left:calc(50% - 18px)}
.wrap .heroSlider .promo-choice-3{left:calc(50% + 18px)}
.wrap .heroSlider .promo-choice:checked{background:radial-gradient(circle,#792b91 0 6px,#fff 7px 15px,transparent 16px)}
.wrap .heroSlider .promo-choice:focus-visible{outline:3px solid #087247;outline-offset:1px}
.wrap .heroSlider .promo-choice:checked~.slides{animation:none}
.wrap .heroSlider .promo-choice-1:checked~.slides{transform:translateX(0)}
.wrap .heroSlider .promo-choice-2:checked~.slides{transform:translateX(-100%)}
.wrap .heroSlider .promo-choice-3:checked~.slides{transform:translateX(-200%)}
/* Editorial polish: restrained surfaces, clear hierarchy, readable Thai. */
.wrap{background:linear-gradient(180deg,#f5edf9 0,#faf8fc 65%,#f3eef7 100%);border-radius:24px;color:#302438}
.wrap .glass{border-radius:16px}
.wrap>.glass:first-child{padding:15px;border-radius:18px;background:linear-gradient(120deg,#40144f,#71308a)}
.wrap .brand .tag{font-size:11px;line-height:1.6}
.wrap .topCtaBtn{font-size:14px;min-height:44px;border-radius:11px}
.wrap h1,.wrap h2,.wrap h3{font-family:inherit}
.wrap .resultHeader .resultTitle{margin:0;line-height:1.5}
.wrap .resultHeader{padding:13px 16px}
.wrap .resultDate{display:block;line-height:1.7}
.wrap .resultBox.r1{padding-top:14px;padding-bottom:14px}
.wrap .resultBox.r2{padding-top:12px;padding-bottom:12px}
.wrap .seoIntro{padding:6px 4px 2px}
.wrap .seoHeading{font-size:20px;font-weight:700;line-height:1.65;letter-spacing:-.2px}
.wrap .seoText{font-size:13px;line-height:1.95;color:#65576d}
.wrap .sectionHead .title{letter-spacing:-.15px}
.wrap .feature-menu .card{border-radius:14px;padding:13px;box-shadow:0 2px 5px #46225208}
.wrap .feature-menu .h{font-size:15px;line-height:1.65}
.wrap .feature-menu .p{font-size:12px;line-height:1.8}
.wrap .contact-details{border-color:#e2d6e9;box-shadow:0 3px 12px #44215305}
.wrap .contact-details .phoneBright{min-height:32px}
.wrap .social-compact .socialBtn{min-height:48px}
.wrap .seoBlock{padding:14px 0}.wrap .seoSubHeading{font-size:15px;line-height:1.75}
.wrap .footer{padding:18px;border-radius:16px}.wrap .footer .footBrand{font-size:17px}
.wrap .footer .footMini{line-height:1.95}
@media(max-width:360px){.wrap .feature-menu .card{padding-left:66px}.wrap .seoHeading{font-size:19px}.wrap>.glass:first-child{padding:12px}}
/* Full artwork, compact secondary prizes, and factual service navigation. */
.wrap .heroMain{height:auto;aspect-ratio:4/3;background:#eee6f4;position:relative}
.wrap .heroSlider .slides{position:absolute;inset:0;width:100%;height:100%}
.wrap .promoFrame img{object-fit:contain;object-position:center}
.wrap .promoFrame::before{opacity:.12}
.wrap .resultGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding:0 10px 12px}
.wrap .resultBox.r1{grid-column:1/-1;padding:12px 6px}
.wrap .resultBox.r1 .rNum.big{font-size:44px}
.wrap .resultRow2{display:contents}
.wrap .resultBox.r2,.wrap .resultBox.r3,.wrap .resultBox.r4{padding:12px 4px 2px;border-bottom:0}
.wrap .resultBox.r3,.wrap .resultBox.r4{border-left:1px solid #eadff0;margin-top:8px;padding-top:4px}
.wrap .resultBox.r2 .rNum.huge{font-size:24px;line-height:1.3;margin:0 0 6px}
.wrap .rNum.mid{font-size:17px;line-height:1.85;letter-spacing:0;margin:0}
.wrap .resultBox .rBadge.ghost{font-size:10px;line-height:1.6}
.wrap .resultBox.r2 .rPrize,.wrap .resultBox.r3 .rPrize,.wrap .resultBox.r4 .rPrize{font-size:10px;line-height:1.6}
.wrap .service-guide{padding:16px}.wrap .service-links{display:flex;flex-direction:column;margin-top:12px}
.wrap .service-links a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;min-height:44px;border-bottom:1px solid #eadff0;text-decoration:none;font-size:13px;font-weight:600;color:#5b276f;overflow-wrap:anywhere}
.wrap .service-links a:hover{color:#087247}.wrap .service-links a:focus-visible,.wrap .back-home:focus-visible{outline:3px solid #a376b5;outline-offset:2px}
.wrap .service-links a span{flex-shrink:0;font-size:20px}.wrap .service-note{font-size:12px;line-height:1.8;color:#74657d;margin:12px 0 0}
.wrap.policy-page{padding-top:18px;padding-bottom:24px}
.wrap .back-home{display:inline-flex;align-items:center;min-height:44px;font-size:14px;color:#64277a;font-weight:600;text-decoration:none}
.wrap .policy-header{padding:18px 16px;background:linear-gradient(120deg,#48175a,#75358d);border-radius:16px;color:white}
.wrap .policy-header h1{font-size:22px;line-height:1.7;margin:0}.wrap .policy-header p{font-size:12px;line-height:1.8;margin:6px 0 0;color:#edddf2}
.wrap .policy-notice{font-size:13px;line-height:1.9;background:#fff8e6;border:1px solid #ebdcb6;padding:12px;border-radius:12px;color:#6b531a}
.wrap .policy-content{background:#fff;border:1px solid #e5d8ed;padding:16px;border-radius:16px;font-size:14px;line-height:1.95;overflow-wrap:anywhere}
.wrap .policy-content h2{font-size:17px;line-height:1.8;color:#602775;scroll-margin-top:16px}
.wrap .policy-content ul{padding-left:22px}.wrap .policy-content li{margin-bottom:8px}.wrap .policy-content hr{border:0;border-top:1px solid #eee4f3;margin:20px 0}
@media(max-width:360px){.wrap .resultBox.r1 .rNum.big{font-size:40px}.wrap .rNum.mid{font-size:15px}}
/* Orange homepage palette. Scoped to home-content; layout and bindings unchanged. */
body:has(#home-content){background:radial-gradient(ellipse at 50% 0,#ffe0c4 0,transparent 650px),#fffaf5}
#home-content{--pri:#c95416;--pri2:#a94010;--hot:#f27a2e;--txt-strong:#78320f;--muted:#71645b;--surface2:#fff0e3;--surface3:#ffe5cc;--line:#efdfd2;--focus:#c95416;--green:#c95416;background:linear-gradient(180deg,#fff0e3 0,#fffcf9 65%,#fff4e9 100%);}
#home-content>.glass:first-child{background:linear-gradient(120deg,#a94010,#d45c17);border-color:#df7739;box-shadow:0 10px 24px #a940101a}
#home-content .brand .tag{}
#home-content .brand img{border-color:#ffc694;box-shadow:0 3px 10px #71300926}
#home-content .topCtaBtn{background:linear-gradient(135deg,#fff8ee,#ffe4bf);border-color:#ffe7c7;box-shadow:0 4px 12px #75320726}
#home-content .topCtaBtn:hover{background:#fff4e3}
#home-content .heroMain{background:#fff0e3;border-color:#ebc5a6;box-shadow:0 8px 20px #a9401012}
#home-content .resultWrap{border-color:#ebc5a6;box-shadow:0 8px 24px #a9401010}
#home-content .resultHeader{background:linear-gradient(115deg,#a94010,#cf5b19)}
#home-content .resultHeader .resultDate{--text:#fff0e3}
#home-content .resultBox.r1{background:radial-gradient(ellipse at 50% 20%,#fff0ce,transparent 80%);border-color:#efdfd2}
#home-content .r1Top .rBadge{background:#fff0d2;border-color:#ebd3a0;--text:#845409}
#home-content .rBadge.ghost{color:#655043;--text:#655043}
#home-content .rPrize{color:#71645b;--text:#71645b}
#home-content .sectionHead .title,#home-content .articleHead .title,#home-content .seoHeading,#home-content .seoSubHeading{color:#a94010;--text:#a94010}
#home-content .sectionHead .desc,#home-content .articleHead .desc,#home-content .seoText,#home-content .service-note{color:#71645b}
#home-content .section,#home-content .contactPanel{border-color:#efdfd2;box-shadow:0 6px 20px #a9401008}
#home-content .pill{background:#fff0e3;border-color:#efd1ba;color:#8f421a}
#home-content .feature-menu .card{background:linear-gradient(145deg,#fff9f2,#ffeddb);border-color:#efd1ba;box-shadow:0 4px 10px #a940100a}
#home-content .feature-menu .card::after{box-shadow:0 3px 8px #a9401010}
#home-content .feature-menu .h,#home-content .card .h,#home-content .articles-compact .card .h{--text:#78320f}
#home-content .feature-menu .badge{background:#ffffffb8;}
#home-content .feature-menu .p,#home-content .card .p{color:#71645b;--text:#71645b}
#home-content .cardLink:hover .card{background:#fff7ee;border-color:#d99a69}
#home-content .articles-compact .card,#home-content .contact-details,#home-content .social-compact .socialBtn{border-color:#efdfd2;box-shadow:none}
#home-content .contact-details .inputLike~.inputLike,#home-content .resultBox.r3,#home-content .resultBox.r4,#home-content .service-links a{border-color:#efdfd2}
#home-content .ico,#home-content .contact-details .ico{background:#fff0e3}
#home-content .contact-details .phoneBright,#home-content .contact-details .val,#home-content .socialBtn .sname{color:#292524}
#home-content .socialBtn{background:#fff;border-color:#efdfd2}
#home-content .socialBtn:hover{background:#fff7ee;border-color:#d99a69}
#home-content .service-links a{}
#home-content .service-links a:hover{}
#home-content .footer{background:linear-gradient(130deg,#79320f,#a94010);border-color:#b75c2c}
#home-content .footer .footText,#home-content .footer .footMini,#home-content .footer .copy{}
#home-content .heroSlider .promo-choice:checked{background:radial-gradient(circle,#c95416 0 6px,#fff 7px 15px,transparent 16px)}
#home-content a:focus-visible,#home-content .heroSlider .promo-choice:focus-visible,#home-content .cardLink:focus-visible .card{outline:3px solid #c95416;outline-offset:3px}
/* Light orange homepage: compact hierarchy with an isolated purchase action. */
body:has(#home-content){background:#f5f5f5}
#home-content{background:#fafafa;--line:#eee7e1}
#home-content>.glass:first-child{background:#fff;border:1px solid #eee7e1;box-shadow:0 3px 12px #29252406;}
#home-content .brand .tag{}
#home-content .topCtaBtn{border:1px solid #db5a14;box-shadow:0 4px 10px #df570e20}
#home-content .topCtaBtn:hover{background:#c94c0b}
#home-content .heroGrid{gap:12px}
#home-content .heroMain{border-color:#eee7e1;}
#home-content .promoFrame{background-image:none!important;}
#home-content .promoFrame::before,#home-content .promoFrame::after{display:none}
#home-content .resultWrap{border-color:#eee7e1;box-shadow:0 3px 12px #29252404;}
#home-content .resultHeader{display:flex;flex-direction:row;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:3px 8px}
#home-content .resultHeader .resultTitle{}
#home-content .resultHeader .resultDate{font-size:10px;--text:#746b65}
#home-content .resultGrid{}
#home-content .resultBox.r1{background:#fff;border-bottom:1px solid #eee7e1}
#home-content .r1Top{margin-bottom:2px}
#home-content .r1Top .rBadge{padding:0;background:none;border:0;font-size:11px;--text:#746b65}
#home-content .resultBox.r1 .rNum.big{font-size:40px;line-height:1.15;letter-spacing:.08em;margin:2px 0;color:#292524;--text:#292524}
#home-content .r1PrizeWrap{margin-top:4px}
#home-content .r1PrizePill{background:#fff8e8;border-color:#f3e6c9}
#home-content .r1PrizePill .rPrize{font-size:11px}
#home-content .resultBox.r2,#home-content .resultBox.r3,#home-content .resultBox.r4{padding:7px 3px 0;margin-top:5px;gap:2px}
#home-content .resultBox.r2 .rNum.huge{font-size:21px;margin:0;line-height:1.5}
#home-content .rNum.mid{font-size:16px;line-height:1.9}
#home-content .resultBox .rBadge.ghost{font-size:10px}
#home-content .resultBox .rPrize{margin-top:3px}
#home-content .seoIntro{}
#home-content .seoHeading{font-size:17px;color:#292524}
#home-content .seoText{font-size:12px;line-height:1.8}
#home-content .sectionHead .title,#home-content .articleHead .title{font-size:17px;color:#292524;--text:#292524}
#home-content .section{margin-top:14px}
#home-content .section,#home-content .contactPanel{box-shadow:none}
#home-content .feature-menu .card{background:#fff;border-color:#eee7e1;box-shadow:0 2px 6px #29252404;}
#home-content .feature-menu .badge{background:#fff4e9;color:#895b3b}
#home-content .feature-menu .card:hover{background:#fffbf6;border-color:#edbc96}
#home-content .footer{background:#f5f0eb;border:1px solid #eee7e1}
#home-content .footer .footBrand{}
#home-content .footer .footText,#home-content .footer .footMini,#home-content .footer .copy{}
#home-content .footer .divider{background:#e5dbd2}
@media(max-width:360px){#home-content .resultBox.r1 .rNum.big{font-size:36px}#home-content .rNum.mid{font-size:14px}#home-content .feature-menu .card{padding-left:66px}}
/* White / orange / forest green homepage accents. */
body:has(#home-content){background:#f3f6f4}
#home-content{background:#fafcfb;--green:#126344}
#home-content>.glass:first-child{border-color:#e1ebe5}
#home-content .brand .name{}
#home-content .topCtaBtn{background:linear-gradient(135deg,#f57824,#df570e);}
#home-content .resultWrap{border-color:#dce9e1}
#home-content .resultHeader .resultTitle{--text:#126344}
#home-content .resultBox.r1{background:radial-gradient(ellipse at 50% 15%,#f0f8f3,transparent 80%);border-color:#e1ebe5}
#home-content .resultBox.r1 .rNum.big,#home-content .resultBox.r2 .rNum.huge,#home-content .rNum.mid{--text:#164b38}
#home-content .seoHeading,#home-content .sectionHead .title,#home-content .articleHead .title,#home-content .seoSubHeading{color:#164b38;--text:#164b38}
#home-content .feature-menu .card{border-color:#e1ebe5}
#home-content .feature-menu .h,#home-content .card .h,#home-content .articles-compact .card .h{color:#164b38;--text:#164b38}
#home-content .feature-menu .card::after{}
#home-content .feature-menu .card:hover{background:#f5faf7;border-color:#9bc5ac}
#home-content .contact-details .phoneBright{color:#126344}
#home-content .contact-details .inputLike:first-child .ico{background:#e1f4e9}
#home-content .service-links a{}
#home-content .service-links a:hover{color:#a94010}
#home-content .footer{background:#edf5ef;border-color:#dce9e1}
#home-content .footer .footBrand{}
#home-content .footer .footText,#home-content .footer .footMini,#home-content .footer .copy{}
#home-content .footer .divider{background:#d6e4da}
/* Same white wordmark asset as the ticket shop, on its original orange. */
#home-content .brand img{width:90px;height:48px;object-fit:contain;padding:7px;background:#F37932;flex-shrink:0;}
#home-content .brand{flex-basis:220px} #home-content .brand .name{overflow-wrap:anywhere}
/* Deep green backdrop; white cards retain their existing readable palette. */
body:has(#home-content){background:#0b3025}
#home-content{background:linear-gradient(180deg,#124b38 0%,#0c372a 65%,#092b22 100%)}
#home-content .seoIntro .seoHeading{--text:#fff}
#home-content .seoIntro .seoText{--text:#d1e5da}
#home-content .articles-compact>.sectionHead .title,
#home-content .contact-compact>.sectionHead .title,
#home-content .social-compact>.sectionHead .title{color:#fff;--text:#fff}
#home-content .articles-compact>.sectionHead .desc,
#home-content .contact-compact>.sectionHead .desc,
#home-content .social-compact>.sectionHead .desc{color:#d1e5da;--text:#d1e5da}
#home-content>.glass:first-child,#home-content .resultWrap{box-shadow:0 5px 18px #001a141a}
/* Wallet-logo green: solid background, no teal gradient. */ body:has(#home-content){background:#005b29} #home-content{background:#005b29}
/* Consistent text palette across native markup and ZK labels on homepage only. */
#home-content{--txt:#37413b;--txt-strong:#164b38;--muted:#526158;--muted-2:#526158;--text:#37413b;color:#37413b}
#home-content .glass,#home-content .card,#home-content .resultWrap,#home-content .contact-details,#home-content .socialBtn{color:#37413b;--text:#37413b}
#home-content .brand .name,#home-content .sectionHead .title,#home-content .articleHead .title,#home-content .seoHeading,#home-content .seoSubHeading,#home-content .feature-menu .h,#home-content .card .h,#home-content .articles-compact .card .h,#home-content .resultHeader .resultTitle,#home-content .footBrand{color:#164b38;--text:#164b38}
#home-content .brand .tag,#home-content .sectionHead .desc,#home-content .articleHead .desc,#home-content .seoText,#home-content .feature-menu .p,#home-content .card .p,#home-content .hint,#home-content .resultHeader .resultDate,#home-content .service-note,#home-content .footer .footText,#home-content .footer .footMini,#home-content .footer .copy{color:#526158;--text:#526158}
#home-content .rBadge.ghost,#home-content .r1Top .rBadge,#home-content .rPrize,#home-content .resultBox.r2 .rPrize,#home-content .resultBox.r3 .rPrize,#home-content .resultBox.r4 .rPrize,#home-content .contact-details .val,#home-content .socialBtn .sname{color:#37413b;--text:#37413b}
#home-content .resultBox.r1 .rNum.big,#home-content .resultBox.r2 .rNum.huge,#home-content .rNum.mid,#home-content .contact-details .phoneBright,#home-content .service-links a{color:#164b38;--text:#164b38}
#home-content .r1PrizePill .rPrize{--text:#795a12}
#home-content .topCtaBtn{--text:#fff}
#home-content .seoIntro .seoHeading,#home-content .articles-compact>.sectionHead .title,#home-content .contact-compact>.sectionHead .title,#home-content .social-compact>.sectionHead .title{color:#fff;--text:#fff}
#home-content .seoIntro .seoText,#home-content .articles-compact>.sectionHead .desc,#home-content .contact-compact>.sectionHead .desc,#home-content .social-compact>.sectionHead .desc{color:#d8eadd;--text:#d8eadd}
#home-content .pill,#home-content .feature-menu .badge{color:#874016;--text:#874016}
/* Subtle gold light on wallet green. No animation or transactional changes. */
body:has(#home-content){background:#06452a}
#home-content{background:radial-gradient(ellipse 120% 430px at 0 0,rgba(225,191,100,.19),transparent 72%),radial-gradient(ellipse 100% 520px at 100% 62%,rgba(207,175,86,.08),transparent 75%),linear-gradient(165deg,#075b30,#06442b 75%,#063d28)}
#home-content>.glass:first-child{border:1px solid #e8ddbf;box-shadow:0 5px 16px #001e1920}
#home-content .heroMain{aspect-ratio:4/3;border:1px solid #dfd5b9;background:#fffdf8;padding-bottom:34px;box-shadow:0 8px 22px #001e1924}
#home-content .promoFrame{}
#home-content .heroSlider .promo-choice{bottom:0;width:36px;height:34px;min-width:36px;border-radius:8px;background:radial-gradient(circle,#b8b8aa 0 3px,transparent 4px)}
#home-content .heroSlider .promo-choice:checked{background:radial-gradient(circle,#c65d18 0 4px,transparent 5px)}
#home-content .resultWrap{border:1px solid #e5d8b5;box-shadow:0 6px 18px #001e191a}
#home-content .resultHeader{}
#home-content .resultBox.r1{background:radial-gradient(ellipse at 50% 20%,#fff5da,transparent 85%);border-bottom-color:#e9dfc6;}
#home-content .r1Top .rBadge{--text:#795a12;letter-spacing:.2px}
#home-content .r1PrizePill{background:#fff8e7;border-color:#e7d5a4}
#home-content .section,#home-content .contactGrid{margin-top:20px}
#home-content .seoIntro{margin-top:18px;margin-bottom:0}
#home-content .seoIntro .seoHeading{line-height:1.65}
#home-content .seoIntro .seoText{line-height:1.8}
#home-content .sectionHead{margin-bottom:12px}
#home-content .sectionHead .title{font-size:18px;line-height:1.5}
#home-content .sectionHead .desc{font-size:12px;line-height:1.8}
#home-content .section:has(.feature-menu){border-color:#e5ddca;box-shadow:0 6px 18px #001e191a}
#home-content .section:has(.feature-menu)>.sectionHead>.pill{display:none}
#home-content .feature-menu{gap:9px}
#home-content .feature-menu .card{background:linear-gradient(145deg,#fff,#f7faf7);border:1px solid #e1e9e1;}
#home-content .feature-menu .k{display:none}
#home-content .feature-menu .card::after{flex-basis:40px;margin-bottom:6px;filter:sepia(1) saturate(1.5) hue-rotate(85deg)}
#home-content .feature-menu>.cardLink:nth-child(even) .card::after{filter:sepia(1) saturate(2)}
#home-content .feature-menu .h{margin-top:3px}
#home-content .feature-menu .p{font-size:12px;line-height:1.8;margin-top:5px}
#home-content .articles-compact .sectionHead .title,#home-content .contact-compact .sectionHead .title,#home-content .social-compact .sectionHead .title{font-size:17px;letter-spacing:.1px}
#home-content .articles-compact .card,#home-content .contact-details,#home-content .social-compact .socialBtn{border-color:#e5ddca}
#home-content .service-guide{border-color:#e5ddca}
#home-content .footer{background:linear-gradient(125deg,#f7f5e9,#edf5ed);border-color:#ddd4b8}
@media(max-width:360px){#home-content .feature-menu .card{padding-left:64px}#home-content .feature-menu .card::after{top:12px;left:12px}#home-content .seoIntro .seoHeading{font-size:17px}}
/* Continuous white storefront; orange actions, sections separated by rhythm. */
body:has(#home-content){background:#f4f4f3}
#home-content{background:#fff;border-radius:0;--txt:#292524;--txt-strong:#292524;--text:#292524;--muted:#66615c;--line:#ece8e3;}
#home-content .glass,#home-content>.glass:first-child{background:transparent;border:0;border-radius:0;box-shadow:none;backdrop-filter:none}
#home-content>.glass:first-child{border-bottom:1px solid #eee8e1}
#home-content .brand .name{}
#home-content .brand .tag{}
#home-content .topCtaBtn{background:#dc570c;border:0;}
#home-content .topCtaBtn:hover{background:#bc4406}
#home-content .hero{margin-top:14px;padding:0}
#home-content .heroGrid{gap:18px}
#home-content .heroMain{border:0;border-radius:0;background:#fff;box-shadow:none}
#home-content .promoFrame{background-color:#fff}
#home-content .heroSlider .promo-choice:checked{background:radial-gradient(circle,#ff7a1a 0 4px,transparent 5px)}
#home-content .resultHeader{background:transparent;gap:4px 8px}
#home-content .resultHeader .resultTitle{font-size:15px;color:#a94010;--text:#a94010}
#home-content .resultHeader .resultDate{color:#66615c;--text:#66615c}
#home-content .resultGrid{border-bottom:1px solid #ece8e3}
#home-content .resultBox.r1{background:linear-gradient(180deg,#fff7ee,#fff);padding:10px 4px 12px;border-bottom-color:#ece8e3}
#home-content .resultBox.r1 .rNum.big,#home-content .resultBox.r2 .rNum.huge,#home-content .rNum.mid{color:#292524;--text:#292524}
#home-content .r1PrizePill{border:0;background:transparent;padding:0}
#home-content .r1PrizePill .rPrize{color:#66615c;--text:#66615c}
#home-content .r1Top .rBadge{color:#a94010;--text:#a94010}
#home-content .seoIntro{padding:0;margin:18px 0}
#home-content .seoIntro .seoHeading{font-size:17px;color:#292524;--text:#292524}
#home-content .seoIntro .seoText{font-size:12px;color:#66615c;--text:#66615c}
#home-content .section,#home-content .section:has(.feature-menu){padding:0;margin-top:22px;border:0;box-shadow:none;background:transparent}
#home-content .sectionHead .title,#home-content .articleHead .title,#home-content .articles-compact>.sectionHead .title,#home-content .contact-compact>.sectionHead .title,#home-content .social-compact>.sectionHead .title{font-size:17px;color:#292524;--text:#292524}
#home-content .feature-menu{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:5px 0 18px;border-bottom:1px solid #ece8e3}
#home-content .feature-menu .card{display:flex;align-items:center;text-align:center;min-height:0;height:100%;}
#home-content .feature-menu .card::after{position:static;display:block;width:44px;height:44px;flex-basis:44px;margin:0 0 6px;background-color:#fff0e1;filter:sepia(1) saturate(1.5);border-radius:14px;box-shadow:none}
#home-content .feature-menu>.cardLink:nth-child(even) .card::after{background-color:#fff0e1;filter:sepia(1) saturate(1.5)}
#home-content .feature-menu .h{line-height:1.65;margin:0;overflow-wrap:anywhere}
#home-content .feature-menu .p,#home-content .feature-menu .k{display:none}
#home-content .feature-menu .card:hover{background:#fff7ef}
#home-content .articles-compact .card{padding:10px 0 15px;background:transparent;border:0;border-bottom:1px solid #ece8e3;border-radius:0;box-shadow:none}
#home-content .articles-compact .card .h{color:#292524;--text:#292524}
#home-content .contactGrid{gap:18px;margin-top:22px}
#home-content .contactPanel,#home-content .contact-details{padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}
#home-content .contact-details .inputLike{padding:10px 0}
#home-content .contact-details .phoneBright,#home-content .contact-details .val{color:#292524;--text:#292524}
#home-content .social-compact .socialRow{gap:0;border-bottom:1px solid #ece8e3;padding-bottom:16px}
#home-content .social-compact .socialBtn{background:transparent;border:0;border-radius:0;padding:6px 2px;box-shadow:none}
#home-content .social-compact .socialBtn+.socialBtn{border-left:1px solid #ece8e3}
#home-content .service-guide{padding:0;border:0;background:transparent}
#home-content .service-links{margin-top:4px}
#home-content .service-links a{color:#47413a;--text:#47413a;padding:11px 0;border-color:#ece8e3}
#home-content .service-links a span{color:#e46414}
#home-content .footer{border-top:2px solid #ff7a1a;background:transparent;}
#home-content .footer .footBrand{color:#292524;--text:#292524}
#home-content .footer .footText,#home-content .footer .footMini,#home-content .footer .copy{color:#66615c;--text:#66615c}
@media(max-width:360px){#home-content .feature-menu{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}#home-content .feature-menu .card{padding:6px 3px}#home-content .feature-menu .h{font-size:13px}}
/* Orange bookends around the continuous white homepage. */
#home-content>.glass:first-child{background:#e96516;border:0;border-radius:0;padding:14px 12px;box-shadow:none}
#home-content .brand img{background:transparent;border:0;box-shadow:none;border-radius:0}
#home-content .brand .name{color:#fff;--text:#fff}
#home-content .brand .tag{color:#fff;--text:#fff}
#home-content .topCtaBtn{background:#fff;color:#a63d08;border:1px solid #fff;border-radius:9px;box-shadow:none;--text:#a63d08}
#home-content .topCtaBtn:hover{background:#fff3e8;color:#873106}
#home-content .footer{background:#e96516;border:0;border-radius:0;padding:18px 14px;margin-top:22px;box-shadow:none}
#home-content .footer .footBrand,#home-content .footer .footText,#home-content .footer .footMini,#home-content .footer .copy{color:#fff;--text:#fff}
#home-content .footer .divider{background:#ffffff52}
#home-content>.glass:first-child a:focus-visible{outline:3px solid #572309;outline-offset:3px}
/* Warm cream canvas, white result/menu surfaces without nested card borders. */
body:has(#home-content){background:#fff8f1}
#home-content{background:#fff8f1}
#home-content .heroMain,#home-content .promoFrame{background-color:#fff8f1}
#home-content .resultWrap{background:#fff;border:0;border-radius:0;box-shadow:none}
#home-content .resultHeader{background:#fff;padding:10px 10px 9px}
#home-content .resultGrid{padding:0 10px 14px}
#home-content .section:has(.feature-menu){background:#fff;border:0;border-radius:0;box-shadow:none;padding:14px 10px 0}
#home-content .feature-menu .card{background:transparent;border:0;box-shadow:none}
/* Stronger menu affordance without restoring nested cards. */
#home-content .section:has(.feature-menu)>.sectionHead{padding-left:10px;border-left:4px solid #f47721;margin-bottom:16px}
#home-content .section:has(.feature-menu)>.sectionHead .title{font-size:18px;font-weight:800;color:#873a12}
#home-content .feature-menu{gap:8px;padding-bottom:18px}
#home-content .feature-menu .card{padding:8px 1px;gap:0;border-radius:8px}
#home-content .feature-menu .card::after,#home-content .feature-menu>.cardLink:nth-child(even) .card::after{width:54px;height:54px;flex-basis:54px;margin-bottom:9px;border-radius:16px;background-size:32px 32px;box-shadow:0 3px 0 #efbd971f}
#home-content .feature-menu .h{font-size:13px;font-weight:800;line-height:1.6;--text:#602909}
#home-content .feature-menu .card:hover{background:#fff0e2}
#home-content .feature-menu .cardLink:focus-visible .card{outline:3px solid #c95416;outline-offset:2px}
@media(max-width:360px){#home-content .feature-menu .h{font-size:14px}}
/* Unified high-contrast menu icon palette. */
#home-content .feature-menu .card::after,#home-content .feature-menu>.cardLink:nth-child(even) .card::after{background-color:#ffe0c2;filter:none}
#home-content .feature-menu .h{color:#292524;--text:#292524}
/* Read-only policy page: orange/cream theme, original policy text untouched. */
body:has(.policy-page){background:#fff8f1}
.wrap.policy-page{background:#fff8f1;border-radius:0;color:#37413b;--text:#37413b;--muted:#625b54}
.policy-page .back-home{color:#a63d08;font-size:14px}
.policy-page .back-home:focus-visible{outline:3px solid #c95416;outline-offset:3px}
.policy-page .policy-header{background:#e96516;color:#fff;border:0;border-radius:0;padding:17px 14px;box-shadow:none}
.policy-page .policy-header h1{color:#fff;font-size:22px;line-height:1.6;margin:0;overflow-wrap:anywhere}
.policy-page .policy-content{background:#fff;border:0;border-radius:0;box-shadow:none;padding:18px 14px;margin-top:16px;color:#37413b;font-size:14px;line-height:1.95;overflow-wrap:anywhere}
.policy-page .policy-content h2{color:#a94010;font-size:17px;line-height:1.8;font-weight:700;scroll-margin-top:18px}
.policy-page .policy-content hr{border:0;border-top:1px solid #eddfd2;margin:20px 0}
.policy-page .policy-content ul{padding-left:21px}
.policy-page .policy-content li{margin-bottom:8px}
@media(max-width:360px){.policy-page .policy-header h1{font-size:20px}.policy-page .policy-content{padding:15px 12px}}
/* Latest articles: compact thumbnails and flexible mobile text. */
#home-content .articles-compact .homeArticleRow{display:flex;align-items:center;gap:12px;min-width:0}
#home-content .articles-compact .homeArticleThumb{width:80px;height:72px;flex:0 0 80px;border-radius:9px;overflow:hidden;background:#ffead8 url("../images/article-placeholder.svg") center/40px 40px no-repeat}
#home-content .articles-compact .homeArticleImage{display:block;width:100%;height:100%;object-fit:cover;font-size:0}
#home-content .articles-compact .homeArticleText{flex:1;min-width:0}
#home-content .articles-compact .homeArticleText .h,#home-content .articles-compact .homeArticleText .p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere}
@media(max-width:360px){#home-content .articles-compact .homeArticleThumb{width:64px;height:64px;flex-basis:64px}#home-content .articles-compact .homeArticleRow{gap:10px}}
/* Home dream shortcut: reuse the moon artwork from the dream page. */
#home-content .feature-menu>.cardLink[href$="/apps/dream.zul"] .card::after{
background-color:#f47721;
background-image:url('home-dream-motion.svg');
background-position:center;
background-repeat:no-repeat;
background-size:62px 62px;
filter:none;
}
/* Homepage incense shortcut: warm vector artwork matching the dream icon. */
#home-content .feature-menu>.cardLink[href$="/apps/incense.zul"] .card::after{
background-color:#f47721;
background-image:url('home-incense-motion.svg');
background-position:center;
background-repeat:no-repeat;
background-size:62px 62px;
filter:none;
}
/* Decorative numbered balls: transform-only motion, no timers or requests. */
#home-content .feature-menu>.cardLink[href$="/lucky.zul"] .card::after{display:none}
#home-content .home-lucky-icon{position:relative;display:block;order:-1;width:54px;height:54px;flex:0 0 54px;margin:0 0 9px;overflow:hidden;border-radius:16px;background:#f47721;box-shadow:0 3px 0 #efbd971f;pointer-events:none}
#home-content .home-lucky-icon::before{content:"";position:absolute;inset:5px;border:1px solid #ffffff30;border-radius:50%}
#home-content .home-lucky-orbit{position:absolute;inset:0;animation:home-lucky-orbit 12s linear infinite}
#home-content .home-lucky-ball{position:absolute;display:flex;align-items:center;justify-content:center;width:21px;height:21px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fffdf4,#ffe3a6 65%,#ffc971);color:#a44c13;font:800 13px/1 Arial,sans-serif;box-shadow:0 2px 3px #983a1726,inset 0 0 0 1px #fff4cf;animation:home-lucky-upright 12s linear infinite}
#home-content .home-lucky-ball:nth-child(1){left:17px;top:4px}
#home-content .home-lucky-ball:nth-child(2){left:4px;top:28px}
#home-content .home-lucky-ball:nth-child(3){left:30px;top:28px}
@keyframes home-lucky-orbit{to{transform:rotate(360deg)}}
@keyframes home-lucky-upright{to{transform:rotate(-360deg)}}
@media(prefers-reduced-motion:reduce){#home-content .home-lucky-orbit,#home-content .home-lucky-ball{animation:none}}
/* Shop shortcut: matching warm gift artwork with gentle decorative motion. */
#home-content .feature-menu>.cardLink[href$="/apps/shop.zul"] .card::after{display:none}
#home-content .home-shop-icon{position:relative;display:block;order:-1;width:54px;height:54px;flex:0 0 54px;margin:0 0 9px;overflow:hidden;border-radius:16px;background:#f47721;box-shadow:0 3px 0 #efbd971f;pointer-events:none}
#home-content .home-shop-icon::after{content:"";position:absolute;inset:0;background:url('shop-gift.svg') center/62px 62px no-repeat;transform-origin:50% 70%;animation:home-shop-sway 5s ease-in-out infinite}
@keyframes home-shop-sway{0%,60%,100%{transform:translateY(0) rotate(0)}20%{transform:translateY(-2px) rotate(-5deg)}40%{transform:translateY(-2px) rotate(5deg)}}
@media(prefers-reduced-motion:reduce){#home-content .home-shop-icon::after{animation:none}}
/* Mobile accessibility: allow long labels to wrap and retain device safe areas. */
#home-content{padding-bottom:24px;padding-bottom:max(24px,env(safe-area-inset-bottom))}
#home-content .brand>div,#home-content .inputLike>div,#home-content .socialBtn>div{min-width:0;overflow-wrap:anywhere}
#home-content .service-links a{min-width:0;white-space:normal;overflow-wrap:anywhere}
#home-content .socialRow{min-width:0;flex-wrap:wrap}
@media(max-width:360px){
#home-content .social-compact .socialBtn{flex-wrap:wrap;justify-content:center;text-align:center}
}

/* Portrait posters: reserve image space and keep controls outside the artwork. */
#home-content .heroMain.heroSlider {
 aspect-ratio: 3 / 4; height:auto; padding-bottom:34px;
 border:1px solid #efd8c5; border-radius:14px; background:#fff8f1;
 box-shadow:none; min-width:0;
}
#home-content .heroSlider .slides { height:calc(100% - 34px); }
#home-content .heroSlider .promoFrame img {
 width:100%; height:100%; object-fit:contain; object-position:center;
}