/* Thiên Cảnh Hoán Hình LANDING – sky-and-gold wheel, 16 real rewards. */
html body.x-subpage.tchh-snow-v1 .tchh-landing-wheel-page{--w-blue:#1f77ae;--w-ice:#eff9ff;--w-gold:#f5cc71;position:relative;z-index:2;width:100%;font-family:"Segoe UI",Arial,sans-serif;color:#153e5a}
.tchh-landing-wheel-page *, .landing-result-overlay *{box-sizing:border-box}
.tchh-landing-wheel-page .landing-intro{text-align:center;margin:0 auto 22px;max-width:850px;background:rgba(236,249,255,.72);border:1.5px solid #89beda;border-radius:18px;padding:21px 25px}
.tchh-landing-wheel-page .landing-intro .landing-eyebrow{font-size:12px;font-weight:900;color:#267daf!important;letter-spacing:3px;margin:0 0 8px}
html body.x-subpage.tchh-snow-v1 .tchh-landing-wheel-page .landing-intro h2{font-size:30px;letter-spacing:2px;line-height:1.2;color:#1e608f!important;-webkit-text-fill-color:#1e608f!important;margin:0 0 9px;text-shadow:none!important}
.tchh-landing-wheel-page .landing-intro p{font-size:14px!important;line-height:1.65;color:#245979!important;margin:0}
.tchh-landing-wheel-page .landing-wheel-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(290px,.9fr);gap:18px;align-items:start}
.tchh-landing-wheel-page .landing-wheel-panel{background:linear-gradient(160deg,rgba(239,249,255,.87),rgba(208,230,248,.78));border:2px solid #c5a058;border-radius:22px;box-shadow:0 15px 34px rgba(16,73,111,.18),inset 0 0 0 4px rgba(255,255,255,.45);padding:25px 12px 18px;overflow:hidden}
.tchh-landing-wheel-page .landing-wheel-glow{position:relative;margin:auto;width:min(100%,570px);aspect-ratio:1/1;display:grid;place-items:center}
.tchh-landing-wheel-page .landing-wheel-glow:before{position:absolute;inset:1.5%;border-radius:50%;content:"";background:radial-gradient(circle,#ffffff 15%,#7cd7f2 50%,rgba(30,99,162,0) 73%);filter:blur(22px);opacity:.43}
.tchh-landing-wheel-page .landing-wheel-ring{width:93%;height:93%;position:relative;border-radius:50%;background:#d9b263;border:8px solid #f9e3a8;box-shadow:0 0 0 5px #996e29,0 0 0 11px rgba(241,206,126,.55),0 14px 35px rgba(16,64,105,.32),inset 0 0 0 5px #fff9e7;padding:5px}
.tchh-landing-wheel-page .landing-rotor{width:100%;height:100%;border-radius:50%;position:relative;overflow:hidden;border:2px solid #fff3cc;background:conic-gradient(from 0deg,#13517d 0 22.5deg,#f1d08c 22.5deg 45deg,#2e8db7 45deg 67.5deg,#f0e4b8 67.5deg 90deg,#1c6b99 90deg 112.5deg,#f2c875 112.5deg 135deg,#267eac 135deg 157.5deg,#f4df9d 157.5deg 180deg,#16517e 180deg 202.5deg,#f1cd88 202.5deg 225deg,#3189ad 225deg 247.5deg,#f2e1ad 247.5deg 270deg,#1f6692 270deg 292.5deg,#f0c97f 292.5deg 315deg,#287daf 315deg 337.5deg,#f5dfab 337.5deg 360deg);transition:transform 6s cubic-bezier(.12,.71,.11,1);transform:rotate(0deg)}
.tchh-landing-wheel-page .landing-rotor:before{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 4px rgba(255,255,255,.5),inset 0 0 38px rgba(0,0,0,.15);pointer-events:none;z-index:1}
.tchh-landing-wheel-page .landing-wheel-label{position:absolute;top:50%;left:50%;z-index:2;width:68px;text-align:center;transform:translate(-50%,-50%) rotate(calc((var(--spin-i) + .5)* 360deg / var(--spin-count))) translateY(calc(-1 * min(17vw,205px))) rotate(90deg);font:bold 10px/1.12 "Segoe UI",Arial,sans-serif;letter-spacing:-.12px;color:#fff;-webkit-text-fill-color:#fff;text-shadow:0 1px 3px #0a3655;pointer-events:none}
.tchh-landing-wheel-page .landing-wheel-label:nth-of-type(even){color:#244a62;-webkit-text-fill-color:#244a62;text-shadow:0 1px 0 rgba(255,255,255,.5)}
.tchh-landing-wheel-page .landing-wheel-label span{display:block;transform:rotate(0deg);white-space:normal}
.tchh-landing-wheel-page .landing-wheel-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-align:center;width:28%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 34% 20%,#ffffff,#b9e4f6 52%,#458ba9);border:6px solid #ecc66d;box-shadow:0 0 0 3px #fff3c9,0 3px 18px rgba(16,51,76,.48);color:#205076;font-size:clamp(9px,1.15vw,13px);font-weight:1000;text-shadow:0 1px white}
.tchh-landing-wheel-page .landing-wheel-center b{color:#906320;font-size:clamp(9px,1.15vw,13px)}
.tchh-landing-wheel-page .landing-wheel-pointer{position:absolute;top:-2%;left:50%;transform:translateX(-50%);z-index:11;filter:drop-shadow(0 4px 4px rgba(0,0,0,.35));width:0;height:0;border-left:24px solid transparent;border-right:24px solid transparent;border-top:49px solid #ae731a}
.tchh-landing-wheel-page .landing-wheel-pointer:after{content:"";position:absolute;left:-15px;top:-46px;width:0;height:0;border-left:15px solid transparent;border-right:15px solid transparent;border-top:33px solid #ffe0a1}
.tchh-landing-wheel-page .landing-spin-footer{text-align:center;margin-top:11px}
.tchh-landing-wheel-page .landing-spins-left{display:flex;align-items:center;justify-content:center;gap:12px;color:#225d85;font-weight:900;font-size:13px;letter-spacing:.75px}
.tchh-landing-wheel-page .landing-spins-left strong{font-size:38px;color:#b47413;-webkit-text-fill-color:#b47413;font-variant-numeric:tabular-nums}
.tchh-landing-wheel-page .landing-spins-left small{font-size:14px}
.tchh-landing-wheel-page .landing-primary{display:inline-flex;align-items:center;justify-content:center;min-width:min(100%,310px);min-height:55px;border:3px solid #b58129!important;border-radius:16px;background:linear-gradient(140deg,#ffeed3,#d5a13c)!important;color:#17496e!important;-webkit-text-fill-color:#17496e!important;font:bold 18px "Segoe UI",Arial,sans-serif!important;text-decoration:none!important;cursor:pointer;box-shadow:0 6px 16px rgba(96,66,26,.27);margin:10px auto 0;letter-spacing:1px}
.tchh-landing-wheel-page .landing-primary:not(:disabled):hover{background:linear-gradient(140deg,#fff9ea,#efc56f)!important;transform:translateY(-1px)}
.tchh-landing-wheel-page .landing-primary:disabled{cursor:not-allowed;filter:saturate(.45);opacity:.73}
.tchh-landing-wheel-page .landing-status{font-size:13px!important;line-height:1.6;color:#346581!important;margin:12px auto 0;max-width:520px}
.tchh-landing-wheel-page .landing-wheel-sidebar{display:grid;gap:16px}
.tchh-landing-wheel-page .landing-info-card,.tchh-landing-wheel-page .landing-history{border:1.5px solid #93bdce;background:rgba(242,250,255,.82);border-radius:17px;padding:17px;box-shadow:0 8px 18px rgba(23,72,102,.09)}
.tchh-landing-wheel-page .landing-info-card .landing-number{color:#b57b23;font-size:12px;letter-spacing:2px;font-weight:900}
html body.x-subpage.tchh-snow-v1 .tchh-landing-wheel-page .landing-info-card h3,.tchh-landing-wheel-page .landing-history h3{color:#1b5b8a!important;-webkit-text-fill-color:#1b5b8a!important;margin:5px 0 9px;font-size:19px;line-height:1.3;text-shadow:none!important}
.tchh-landing-wheel-page .landing-info-card p{font-size:13px!important;color:#295a78!important;line-height:1.62;margin:8px 0}
.tchh-landing-wheel-page .landing-prize-grid{display:grid;grid-template-columns:1fr;gap:3px;margin-top:8px;max-height:490px;overflow-y:auto}
.tchh-landing-wheel-page .landing-prize-entry{display:flex;align-items:center;gap:9px;font-size:12px;min-height:28px;padding:3px 6px;border-bottom:1px solid rgba(73,142,174,.18);color:#254f6b}
.tchh-landing-wheel-page .landing-prize-entry span{font-size:10px;font-weight:900;color:#ae7c2d}
.tchh-landing-wheel-page .landing-prize-entry b{font-weight:700}
.tchh-landing-wheel-page .landing-history{margin-top:20px}
.tchh-landing-wheel-page .landing-history-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}
.tchh-landing-wheel-page .landing-history-heading span{font-weight:800;color:#3073a1}
.tchh-landing-wheel-page .landing-history-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:rgba(212,235,249,.5);padding:12px;margin:9px 0;border-radius:10px}
.tchh-landing-wheel-page .landing-history-row strong{flex:1 1 180px;color:#1b5885}
.tchh-landing-wheel-page .landing-history-row code{font:800 14px Consolas,monospace;color:#954f09}
.tchh-landing-wheel-page .landing-history-row small{font-size:11px;color:#4b657e}
.tchh-landing-wheel-page .landing-copy,.landing-result-overlay button{background:#1b6095;border:1px solid #134e7e;color:white!important;border-radius:9px;cursor:pointer;font-weight:900;padding:10px 14px}
.tchh-landing-wheel-page .landing-empty{color:#32617b;font-size:13px;padding:12px 0}
.landing-result-overlay[hidden]{display:none!important}
.landing-result-overlay{position:fixed;inset:0;background:rgba(10,33,63,.68);z-index:99999;display:grid;place-items:center;padding:20px}
.landing-result-panel{text-align:center;width:min(96vw,490px);border:5px solid #eec773;border-radius:22px;background:linear-gradient(160deg,#f8feff,#cce9fa);padding:36px 24px;box-shadow:0 30px 70px rgba(0,0,0,.36)}
.landing-result-panel .landing-result-icon{font-size:54px;color:#d49c2e}
.landing-result-panel h2{font:bold 30px "Segoe UI",sans-serif;color:#205d8a;margin:8px}
.landing-result-panel p{font-size:15px;line-height:1.6;color:#235574}
.landing-result-code{font:bold 23px Consolas,monospace;letter-spacing:2px;background:white;border:2px dashed #c9a052;border-radius:12px;padding:18px;color:#9f671b;overflow-wrap:anywhere}
.landing-result-actions{display:flex;justify-content:center;gap:9px;margin-top:19px}
.tchh-landing-home-link{background:linear-gradient(155deg,#fbf1ce,#e9bf6b)!important;border:2px solid #b7832a!important;color:#224d6a!important}
.tchh-landing-home-link :is(strong,small,.action-icon){color:#224d6a!important;-webkit-text-fill-color:#224d6a!important}
html body.tchh-landing .hero-ctas{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;width:min(94%,870px)!important;max-width:870px!important;gap:13px!important;align-items:stretch!important;justify-content:center!important;margin:25px auto 0!important;padding:0 6px!important}
html body.tchh-landing .hero-ctas>.gold-btn{display:flex!important;flex:none!important;min-width:0!important;width:100%!important;min-height:72px!important;gap:8px!important;padding:8px 12px!important}
html body.tchh-landing .hero-ctas>.gold-btn.tchh-landing-home-link{background:linear-gradient(145deg,#fff1c2,#e8b756)!important;border:3px solid #a57119!important;color:#1d4c70!important;-webkit-text-fill-color:#1d4c70!important;box-shadow:0 6px 0 rgba(113,72,9,.28),0 11px 22px rgba(46,71,92,.2)!important}
html body.tchh-landing .hero-ctas>.gold-btn.tchh-landing-home-link :is(strong,small,.action-icon){color:#1d4c70!important;-webkit-text-fill-color:#1d4c70!important;text-shadow:none!important}
html body.tchh-landing .hero-ctas>.gold-btn.tchh-landing-home-link:hover{background:linear-gradient(145deg,#fff8dc,#f5cb6f)!important}
/* TRANG CHU - BA NUT 3 MAU RIENG: TAI GAME DO / DANG KY XANH / LANDING VANG */
html body.tchh-landing .hero-ctas>a.gold-btn.blue-btn {
  background:linear-gradient(145deg,#f65d65 0%,#be202c 100%)!important;
  border:3px solid #8d1724!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;
  box-shadow:0 6px 0 rgba(106,13,24,.28),0 12px 22px rgba(62,42,58,.20)!important;
}
html body.tchh-landing .hero-ctas>a.gold-btn.blue-btn :is(strong,small,.action-icon){
  color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:none!important;
}
html body.tchh-landing .hero-ctas>a.gold-btn.blue-btn:hover{
  background:linear-gradient(145deg,#ff7780 0%,#d42a39 100%)!important;
}
html body.tchh-landing .hero-ctas>a.gold-btn.beige-btn{
  background:linear-gradient(145deg,#41a8e5 0%,#16669d 100%)!important;
  border:3px solid #12517f!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;
  box-shadow:0 6px 0 rgba(15,67,112,.27),0 12px 22px rgba(28,72,106,.20)!important;
}
html body.tchh-landing .hero-ctas>a.gold-btn.beige-btn :is(strong,small,.action-icon){
  color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:none!important;
}
html body.tchh-landing .hero-ctas>a.gold-btn.beige-btn:hover{
  background:linear-gradient(145deg,#5dbbf2 0%,#2279b5 100%)!important;
}
html body.tchh-landing .hero-ctas>a.gold-btn.tchh-landing-home-link{
  background:linear-gradient(145deg,#ffe9a2 0%,#ebb94f 100%)!important;
  border:3px solid #b07820!important;
  color:#16436a!important;-webkit-text-fill-color:#16436a!important;
  box-shadow:0 6px 0 rgba(114,75,9,.28),0 12px 22px rgba(72,64,36,.21)!important;
}
html body.tchh-landing .hero-ctas>a.gold-btn.tchh-landing-home-link :is(strong,small,.action-icon){
  color:#16436a!important;-webkit-text-fill-color:#16436a!important;text-shadow:none!important;
}
html body.tchh-landing .hero-ctas>a.gold-btn.tchh-landing-home-link:hover{
  background:linear-gradient(145deg,#fff2ba 0%,#f2ca73 100%)!important;
}
@media(max-width:680px){html body.tchh-landing .hero-ctas{width:98%!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important;padding:0 4px!important}html body.tchh-landing .hero-ctas>.gold-btn{padding:7px 2px!important;min-height:60px!important}html body.tchh-landing .hero-ctas>.gold-btn strong{font-size:clamp(11px,2.9vw,16px)!important}html body.tchh-landing .hero-ctas>.gold-btn small{font-size:clamp(9px,2.3vw,12px)!important}}
@media(min-width:1024px){.tchh-landing-wheel-page .landing-wheel-label{transform:translate(-50%,-50%) rotate(calc((var(--spin-i) + .5)*22.5deg)) translateY(-196px) rotate(90deg)}}
@media(max-width:970px){.tchh-landing-wheel-page .landing-wheel-grid{grid-template-columns:1fr}.tchh-landing-wheel-page .landing-wheel-label{transform:translate(-50%,-50%) rotate(calc((var(--spin-i) + .5)*22.5deg)) translateY(-175px) rotate(90deg)}.tchh-landing-wheel-page .landing-prize-grid{grid-template-columns:1fr 1fr;max-height:none}}
@media(max-width:580px){.tchh-landing-wheel-page .landing-intro{padding:14px}.tchh-landing-wheel-page .landing-intro h2{font-size:23px}.tchh-landing-wheel-page .landing-wheel-ring{border-width:5px}.tchh-landing-wheel-page .landing-wheel-label{width:40px;font-size:8px;transform:translate(-50%,-50%) rotate(calc((var(--spin-i) + .5)*22.5deg)) translateY(-37vw) rotate(90deg)}.tchh-landing-wheel-page .landing-prize-grid{grid-template-columns:1fr}.tchh-landing-wheel-page .landing-wheel-pointer{border-left-width:17px;border-right-width:17px;border-top-width:37px}.tchh-landing-wheel-page .landing-wheel-pointer:after{display:none}.tchh-landing-wheel-page .landing-wheel-center{border-width:3px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.tchh-landing-wheel-page .landing-rotor{transition-duration:.1s!important}}

/* HOME HERO V4 — bỏ logo vuông giữa, chữ thương hiệu bên phải chính xác. */
html body.tchh-landing .hero .hero-center{display:none!important}
html body.tchh-landing .hero .hero-secondary-logo{
 position:absolute!important;z-index:3!important;
 top:35%!important;right:1.5%!important;left:auto!important;
 width:34%!important;max-width:550px!important;
 min-height:112px!important;display:flex!important;
 align-items:center!important;justify-content:center!important;
 margin:0!important;padding:10px 2px!important;
 background:none!important;border:0!important;
 filter:none!important;overflow:visible!important;pointer-events:none!important;
}
html body.tchh-landing .hero .hero-secondary-logo::before{
 content:"";position:absolute;z-index:0;inset:-19% -3%;
 background:url('/assets/img/tchh-gold-horizontal.webp') center center/100% 100% no-repeat;
 clip-path:inset(0 83% 0 0);-webkit-mask-image:linear-gradient(to right,#000 0%,#000 8%,transparent 17%);mask-image:linear-gradient(to right,#000 0%,#000 8%,transparent 17%);opacity:.92;pointer-events:none;
 filter:drop-shadow(0 3px 6px rgba(4,46,101,.55))
}
html body.tchh-landing .hero .hero-secondary-logo::after{
 content:"";position:absolute;z-index:0;inset:-19% -3%;
 background:url('/assets/img/tchh-gold-horizontal.webp') center center/100% 100% no-repeat;
 clip-path:inset(0 83% 0 0);-webkit-mask-image:linear-gradient(to right,#000 0%,#000 8%,transparent 17%);mask-image:linear-gradient(to right,#000 0%,#000 8%,transparent 17%);transform:scaleX(-1);opacity:.92;pointer-events:none;
 filter:drop-shadow(0 3px 6px rgba(4,46,101,.55))
}
html body.tchh-landing .hero .hero-secondary-logo .tchh-correct-wordmark{
 position:relative;z-index:1;display:block!important;
 width:max-content!important;max-width:none!important;
 color:#ffe0a0!important;-webkit-text-fill-color:#ffe0a0!important;
 -webkit-text-stroke:1.05px #9d6013!important;
 font:italic 900 clamp(21px,2.6vw,41px)/1.15 "Palatino Linotype","Book Antiqua",Georgia,serif!important;
 text-transform:none!important;white-space:nowrap!important;
 letter-spacing:-1.6px!important;transform:scaleX(.96);
 text-shadow:
  0 2px 0 #794410,0 4px 0 #224c7c,
  0 6px 7px rgba(6,30,68,.82),
  0 0 10px #fff3c5,0 0 24px rgba(33,145,245,.95),
  2px 0 #b97920!important;
}
@media(max-width:850px){
 html body.tchh-landing .hero .hero-secondary-logo{
  right:1.5%!important;top:40%!important;width:47%!important;
  min-height:75px!important;
 }
 html body.tchh-landing .hero .hero-secondary-logo .tchh-correct-wordmark{
  font-size:clamp(15px,3.65vw,29px)!important;letter-spacing:-1.25px!important
 }
}
@media(max-width:500px){
 html body.tchh-landing .hero .hero-secondary-logo{
  right:1.5%!important;top:51%!important;width:54%!important;min-height:55px!important
 }
 html body.tchh-landing .hero .hero-secondary-logo .tchh-correct-wordmark{
  font-size:clamp(13px,3.3vw,18px)!important;letter-spacing:-.8px!important;
  -webkit-text-stroke:.45px #885211!important
 }
}



/* Khôi phục nguyên ảnh logo rồng xanh-vàng do chủ web chọn, không chèn chữ CSS. */
html body.tchh-landing .hero .hero-secondary-logo{
 top:35%!important;right:1.7%!important;left:auto!important;
 width:32%!important;max-width:490px!important;
 min-height:0!important;height:auto!important;
 padding:0!important;display:block!important;
 background:none!important;border:0!important;filter:none!important;
}
html body.tchh-landing .hero .hero-secondary-logo::before,
html body.tchh-landing .hero .hero-secondary-logo::after{
 content:none!important;display:none!important;background:none!important;
}
html body.tchh-landing .hero .hero-secondary-logo img.tchh-right-logo-art{
 display:block!important;width:100%!important;height:auto!important;
 max-width:100%!important;object-fit:contain!important;
 filter:drop-shadow(0 5px 7px rgba(7,47,100,.42))!important;
}
@media(max-width:850px){
 html body.tchh-landing .hero .hero-secondary-logo{
  top:40%!important;right:1.5%!important;width:46%!important;
  max-width:none!important
 }
}
@media(max-width:500px){
 html body.tchh-landing .hero .hero-secondary-logo{
  top:51%!important;right:1%!important;width:51%!important;
 }
}
