/* Approved Screen 04 reference composition: result / chart / wallpaper / CTA. */
body.on-v2-reveal .wrap{max-width:1024px;padding-bottom:0}
body.on-v2-reveal .v2-brand-header{padding:15px 4.8% 0}
body.on-v2-reveal .v2-brand-header .brand{margin-left:0}
#s-reveal{max-width:1024px}
#s-reveal .s4-approved-hero{position:relative;min-height:510px;overflow:hidden;background:radial-gradient(circle at 79% 25%,#30405266,transparent 32%),#080d18;color:#f9e9d3}
#s-reveal .s4-art-stage{position:absolute;top:72px;right:0;width:52%;height:425px;overflow:hidden}
#s-reveal .s4-art-stage img{display:block;width:100%;height:100%;object-fit:contain;object-position:right top;filter:saturate(.96)}
#s-reveal .s4-approved-hero:before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#080d18 0%,#080d18c8 35%,transparent 74%),linear-gradient(0deg,#080d18 0%,transparent 27%)}
#s-reveal .s4-hero-inner{position:relative;z-index:2;max-width:1024px;min-height:510px;padding:91px 4.8% 25px}
#s-reveal .s4-result{width:45%;text-align:left;text-shadow:0 2px 12px #000}
#s-reveal .s4-eyebrow{margin:0;font-size:clamp(17px,2.1vw,23px);line-height:1.2}
#s-reveal .s4-result h1{margin:-4px 0 -7px;color:#f6ce94;font:600 clamp(56px,8.4vw,88px)/1.15 'Mahayant Sarabun',sans-serif}
#s-reveal .s4-english{margin:0;letter-spacing:.15em;font:400 clamp(15px,2.1vw,23px)/1.3 Georgia,serif}
#s-reveal .s4-degree{margin:1px 0 6px;font:400 clamp(25px,3vw,34px)/1.2 Georgia,serif}
#s-reveal .s4-result-sub{margin:0;max-width:320px;padding-top:7px;border-top:1px solid #be9a64;font-size:clamp(12px,1.45vw,16px)}
#s-reveal .s4-reading{width:49%;margin-top:20px;padding:15px 18px 17px;border:1px solid #b6925a;border-radius:12px;background:#111725e3;box-shadow:0 11px 38px #0009;color:#f9e9d3}
#s-reveal .s4-reading h2{margin:0 0 9px;color:#f7dfb8;font-size:clamp(17px,2.25vw,23px);font-weight:600;line-height:1.3}
#s-reveal .s4-reading-columns{display:grid;grid-template-columns:1fr 1fr;gap:15px}
#s-reveal .s4-reading-columns>div{min-width:0;border-top:1px solid #b3915a80;padding-top:6px}
#s-reveal .s4-reading h3{margin:0 0 4px;color:#f1cf95;font-size:clamp(12px,1.4vw,15px);line-height:1.25}
#s-reveal .s4-excerpt{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;margin:0;color:#eee3d3;font-size:clamp(11px,1.2vw,13px);line-height:1.42}
#s-reveal .s4-range{margin:0 0 3px;color:#e1bb80;font:600 12px/1.2 Georgia,serif}
#s-reveal .s4-pill{display:flex;align-items:center;justify-content:center;gap:16px;border:1px solid #b28b58;border-radius:40px;background:linear-gradient(100deg,#be915d,#e1bf8c 50%,#bd8d56);color:#2e1d12;font:600 16px/1.2 'Mahayant Sarabun',sans-serif;min-height:43px;cursor:pointer}
#s-reveal .s4-read{width:100%;margin:12px 0 0;font-size:14px}
#s-reveal .s4-chart-section{background:linear-gradient(130deg,#fff9ef,#f2e6d0 55%,#fbf4e8);color:#312416;border-top:2px solid #b6915c;border-bottom:2px solid #b6915c}
#s-reveal .s4-chart-inner{display:grid;grid-template-columns:47% 53%;min-height:410px;max-width:1024px;margin:auto;padding:31px 4.8% 20px;gap:6px}
#s-reveal .s4-chart-copy{min-width:0}
#s-reveal .s4-chart-copy h2{margin:0 0 6px;font-size:clamp(24px,3.2vw,36px);line-height:1.25;color:#2e2217}
#s-reveal .s4-bridge-sub{margin:0;font-size:clamp(14px,1.8vw,19px);font-weight:600}
#s-reveal .s4-bridge-desc{margin:9px 0 7px;font-size:clamp(12px,1.4vw,15px);line-height:1.55;max-width:470px}
#s-reveal .s4-revealed{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:9px 0;color:#78522c;font-size:clamp(11px,1.3vw,13px)}
#s-reveal .s4-revealed>span:first-child{font:22px Georgia,serif}
#s-reveal .s4-chart-factors{display:grid;grid-template-columns:1fr 1fr;gap:14px 17px;margin-top:13px}
#s-reveal .s4-chart-factors>div{display:grid;grid-template-columns:30px 1fr;column-gap:7px;align-content:start}
#s-reveal .s4-chart-factors>div>span{grid-row:1/3;display:grid;place-items:center;width:28px;height:28px;border:1px solid #b39871;border-radius:50%;color:#8b6035;font:21px Georgia,serif}
#s-reveal .s4-chart-factors strong{font-size:clamp(12px,1.45vw,15px);line-height:1.2}
#s-reveal .s4-chart-factors small{font-size:clamp(10px,1.2vw,13px);line-height:1.28;color:#675642}
#s-reveal .s4-chart-visual{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0}
#s-reveal .s4-chart-visual>img{display:block;width:min(84%,350px);aspect-ratio:1202/1309;object-fit:contain;mix-blend-mode:screen;filter:contrast(1.13) brightness(1.18)}
#s-reveal .s4-dna{text-align:center;margin-top:-25px;max-width:390px}
#s-reveal .s4-dna h3{margin:0;color:#614626;font-size:clamp(17px,2vw,22px)}
#s-reveal .s4-dna p{margin:2px 0 0;color:#4d4033;font-size:clamp(11px,1.35vw,14px);line-height:1.35}
#s-reveal .s4-wallpaper-section{background:radial-gradient(circle at 63% 47%,#233143 0%,#0b1523 40%,#080d17 80%);color:#f2dfbd}
#s-reveal .s4-wallpaper-inner{display:grid;grid-template-columns:49% 51%;max-width:1024px;min-height:440px;margin:auto;padding:43px 4.8% 32px;align-items:center}
#s-reveal .s4-wallpaper-copy h2{margin:0 0 14px;color:#f0ce99;font-size:clamp(23px,2.7vw,31px);line-height:1.3}
#s-reveal .s4-wallpaper-copy>p:not(.s4-wallpaper-point){margin:0 0 10px;max-width:470px;color:#ede3d0;font-size:clamp(12px,1.5vw,16px);line-height:1.52}
#s-reveal .s4-wallpaper-point{margin:8px 0;padding-left:20px;position:relative;color:#dfc99f;font-size:clamp(11px,1.25vw,14px)}
#s-reveal .s4-wallpaper-point:before{content:'✧';position:absolute;left:0;color:#dfad69}
#s-reveal .s4-wallpaper-visual{display:flex;align-items:center;justify-content:center;min-width:0;gap:2%;padding-left:2%}
#s-reveal .s4-small-wheel{width:44%}#s-reveal .s4-small-wheel img{display:block;width:100%;object-fit:contain}
#s-reveal .s4-flow-arrow{color:#e4bd82;font-size:clamp(25px,3.8vw,42px)}
#s-reveal .s4-phone{width:34%;max-height:365px;overflow:hidden}#s-reveal .s4-phone img{display:block;width:100%;max-height:365px;object-fit:contain}
#s-reveal .s4-footer-panel{text-align:center;min-height:175px;padding:28px 6% 22px;background:linear-gradient(#fcf4e6,#e8d7b8);color:#392719}
#s-reveal .s4-footer-panel>p{margin:0 auto 13px;max-width:800px;font-size:clamp(17px,2.2vw,23px);font-weight:600;line-height:1.35}
#s-reveal .s4-next{width:min(450px,100%);margin:0 auto}
#s-reveal .s4-next:disabled{opacity:.75;cursor:not-allowed}
#s-reveal .v2-s4-edit{margin:8px auto 0;font-size:13px}
#s-reveal .s4-pill:focus-visible,#s-reveal .v2-s4-edit:focus-visible{outline:3px solid #d6a35d;outline-offset:3px}
@media(max-width:600px){
 body.on-v2-reveal .v2-brand-header{padding:11px 3% 0}
 body.on-v2-reveal .v2-brand-name{font-size:clamp(9px,2.55vw,13px)}
 body.on-v2-reveal .v2-brand-header .brand{max-width:calc(100% - 148px);gap:3px}
 body.on-v2-reveal .v2-brand-header .lang-switcher{grid-template-columns:repeat(4,31px)}
 body.on-v2-reveal .v2-brand-header .lang-btn{width:31px;height:31px;font-size:11px}
 #s-reveal .s4-approved-hero{min-height:555px}
 #s-reveal .s4-art-stage{top:66px;right:-6%;width:69%;height:330px}
 #s-reveal .s4-art-stage img{object-position:right top}
 #s-reveal .s4-approved-hero:before{background:linear-gradient(90deg,#080d18 0%,#080d18bd 34%,transparent 82%),linear-gradient(0deg,#080d18 8%,transparent 38%)}
 #s-reveal .s4-hero-inner{min-height:555px;padding:94px 5% 20px}
 #s-reveal .s4-result{width:55%}
 #s-reveal .s4-eyebrow{font-size:14px}
 #s-reveal .s4-result h1{font-size:clamp(44px,12vw,61px);margin:0 0 -4px}
 #s-reveal .s4-english{font-size:12px}
 #s-reveal .s4-degree{font-size:24px}
 #s-reveal .s4-result-sub{font-size:11px}
 #s-reveal .s4-reading{position:absolute;bottom:18px;left:5%;width:90%;margin:0;padding:13px 14px}
 #s-reveal .s4-reading h2{font-size:18px;margin-bottom:7px}
 #s-reveal .s4-reading-columns{gap:9px}
 #s-reveal .s4-reading h3{font-size:12px}
 #s-reveal .s4-excerpt{font-size:11px;-webkit-line-clamp:3}
 #s-reveal .s4-range{font-size:11px}
 #s-reveal .s4-read{min-height:40px;margin-top:10px}
 #s-reveal .s4-chart-inner{display:flex;flex-direction:column;min-height:0;padding:23px 5% 27px;gap:10px}
 #s-reveal .s4-chart-copy h2{font-size:25px}
 #s-reveal .s4-bridge-sub{font-size:15px}
 #s-reveal .s4-bridge-desc{font-size:12px;line-height:1.4;margin:6px 0}
 #s-reveal .s4-revealed{font-size:11px;margin:4px 0}
 #s-reveal .s4-chart-factors{gap:8px 11px;margin-top:10px}
 #s-reveal .s4-chart-factors>div{grid-template-columns:24px 1fr;gap:4px}
 #s-reveal .s4-chart-factors>div>span{width:23px;height:23px;font-size:17px}
 #s-reveal .s4-chart-factors strong{font-size:11px}
 #s-reveal .s4-chart-factors small{font-size:10px}
 #s-reveal .s4-chart-visual>img{width:min(67%,270px);max-height:270px}
 #s-reveal .s4-dna{margin-top:-12px}
 #s-reveal .s4-dna h3{font-size:17px}
 #s-reveal .s4-dna p{font-size:11px}
 #s-reveal .s4-wallpaper-inner{display:flex;flex-direction:column;min-height:0;padding:28px 5% 25px;align-items:stretch}
 #s-reveal .s4-wallpaper-copy h2{font-size:23px;margin-bottom:9px}
 #s-reveal .s4-wallpaper-copy>p:not(.s4-wallpaper-point){font-size:12px;line-height:1.42;margin-bottom:7px}
 #s-reveal .s4-wallpaper-point{font-size:11px;margin:4px 0}
 #s-reveal .s4-wallpaper-visual{height:225px;padding:5px 8% 0}
 #s-reveal .s4-small-wheel{width:44%}
 #s-reveal .s4-phone{width:29%;max-height:205px}#s-reveal .s4-phone img{max-height:205px}
 #s-reveal .s4-footer-panel{min-height:153px;padding:22px 6% 19px}
 #s-reveal .s4-footer-panel>p{font-size:16px}
}
@media(max-width:360px){#s-reveal .s4-approved-hero,#s-reveal .s4-hero-inner{min-height:590px}#s-reveal .s4-reading h2{font-size:16px}}