:root{
  --paper:#f4e4bd;--paper2:#ead3a0;--ink:#3a2b1d;--muted:#755f43;--green:#173d31;--green2:#0f2d25;--red:#8d3026;--gold:#b58a3a;--line:#9a7744;--cream:#fff4d6;--shadow:0 24px 55px rgba(58,43,29,.22);--hero-accent:#b58a3a;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;color:var(--ink);font-family:"Noto Sans Thai",system-ui,sans-serif;background:#cbb27d;background-image:radial-gradient(circle at 20% 10%,rgba(255,246,216,.85),transparent 25%),linear-gradient(rgba(89,61,31,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(89,61,31,.035) 1px,transparent 1px),linear-gradient(135deg,#e8d5a7,#caae74);background-size:auto,28px 28px,28px 28px,auto;overflow-x:hidden}button,a{font:inherit}.noise{position:fixed;inset:0;pointer-events:none;opacity:.32;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.20'/%3E%3C/svg%3E");mix-blend-mode:multiply}.app-shell{width:min(1160px,calc(100% - 26px));margin:auto;position:relative;z-index:1}.screen{display:none;min-height:100vh;padding:22px 0 38px}.screen.active{display:block}.center-screen.active{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.topbar{display:flex;align-items:center;justify-content:space-between;padding:10px 2px 18px;border-bottom:2px solid rgba(64,44,25,.38);position:relative}.topbar:after{content:"✦  ❖  ✦";position:absolute;bottom:-10px;left:50%;transform:translateX(-50%);background:var(--paper);padding:0 12px;color:var(--gold);font-size:13px}.brand-mark{font:800 20px/1 "Plus Jakarta Sans",sans-serif;color:var(--cream);background:var(--green);border:2px solid var(--gold);padding:10px 13px;border-radius:6px;box-shadow:inset 0 0 0 2px rgba(255,244,214,.18),3px 3px 0 rgba(58,43,29,.15)}.brand-mark span{color:#e9c877}.topbar-copy{font:700 10px/1.3 "Plus Jakarta Sans",sans-serif;letter-spacing:.18em;color:var(--muted)}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center;min-height:calc(100vh - 175px);padding:56px 0 34px}.eyebrow{display:inline-block;font:800 10px/1.2 "Plus Jakarta Sans",sans-serif;letter-spacing:.16em;color:var(--cream);text-transform:uppercase;background:var(--green);border:1px solid var(--gold);padding:7px 11px;border-radius:4px;box-shadow:2px 2px 0 rgba(58,43,29,.12)}.eyebrow.light{color:var(--cream)}h1{font:800 clamp(56px,9.2vw,118px)/.9 "Noto Serif Thai",serif;letter-spacing:-.045em;margin:22px 0 25px;color:var(--green);text-shadow:0 2px 0 #f8eaca}h1 span{color:var(--red)}.lede{max-width:680px;font-size:clamp(16px,1.8vw,21px);line-height:1.72;color:#51402b;margin:0}.chips{display:flex;flex-wrap:wrap;gap:8px;margin:25px 0}.chips span{border:1px dashed var(--line);background:rgba(255,246,218,.48);border-radius:5px;padding:8px 11px;color:#5a4932;font:700 10px "Plus Jakarta Sans",sans-serif;text-transform:uppercase;letter-spacing:.08em}.hero-teaser{padding:14px 15px;border-left:5px solid var(--red);background:rgba(255,245,215,.52);max-width:650px;color:#5a4630;font-size:14px;line-height:1.6;margin-bottom:18px}.teaser-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--red);margin-right:8px}.primary-btn,.secondary-btn,.tertiary-btn{border:0;border-radius:6px;padding:15px 20px;cursor:pointer;font-weight:800;transition:.18s;box-shadow:3px 4px 0 rgba(58,43,29,.2)}.primary-btn{background:var(--red);color:#fff4d6;border:2px solid #6f211a}.primary-btn:hover{transform:translateY(-2px) rotate(-.2deg);box-shadow:4px 6px 0 rgba(58,43,29,.18)}.primary-btn span{margin-left:12px}.primary-btn.compact{padding:14px 18px}.secondary-btn{background:var(--green);color:var(--cream);border:2px solid #0c291f}.tertiary-btn{background:#f4e4bd;color:var(--ink);border:2px solid #735a35}.microcopy{font-size:12px;line-height:1.55;color:var(--muted);margin-top:14px}.hero-visual{position:relative;height:600px;display:grid;place-items:center}.orb{position:absolute;border-radius:50%}.orb-1{width:410px;height:410px;background:radial-gradient(circle at 35% 30%,rgba(181,138,58,.3),rgba(23,61,49,.04) 65%,transparent 70%);border:2px solid rgba(115,87,43,.35)}.orb-2{width:315px;height:315px;border:2px dashed rgba(85,58,29,.34);animation:spin 28s linear infinite}.radar{width:190px;height:190px;border-radius:50%;border:2px solid #6c5735;display:grid;place-items:center;position:relative;background:radial-gradient(circle,#f8e9c5,rgba(230,208,157,.6));box-shadow:inset 0 0 0 8px rgba(101,74,35,.08),var(--shadow)}.radar:before,.radar:after{content:"";position:absolute;background:rgba(91,64,35,.2)}.radar:before{width:1px;height:100%}.radar:after{height:1px;width:100%}.radar-center{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:var(--red);color:#fff4d6;font:800 12px "Plus Jakarta Sans",sans-serif;z-index:2;border:3px double #f0d28f}.dot{position:absolute;width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px rgba(23,61,49,.13)}.d1{top:24px;right:41px}.d2{bottom:37px;left:29px}.d3{top:64px;left:16px}.d4{right:20px;bottom:68px}.hero-card-stack{position:absolute;inset:0}.mini-card{position:absolute;width:220px;padding:18px;border:2px solid #6f5630;background:#f4e4bd;border-radius:5px;box-shadow:var(--shadow);font-family:"Plus Jakarta Sans",sans-serif}.mini-card:before{content:"";position:absolute;inset:5px;border:1px dashed rgba(101,75,42,.4);pointer-events:none}.mini-card span{display:block;color:var(--red);font-size:11px}.mini-card b{display:block;font-size:18px;margin:8px 0 4px;color:var(--green)}.mini-card small{color:var(--muted)}.c1{top:55px;left:8px;transform:rotate(-6deg)}.c2{right:0;top:155px;transform:rotate(7deg)}.c3{left:28px;bottom:42px;transform:rotate(4deg)}.program-strip{display:flex;overflow:auto;border-top:2px solid rgba(75,53,29,.35);border-bottom:2px solid rgba(75,53,29,.35);scrollbar-width:none;background:rgba(255,246,216,.35)}.program-strip span{white-space:nowrap;padding:13px 19px;border-right:1px dashed rgba(90,66,36,.35);font:700 10px "Plus Jakarta Sans",sans-serif;color:#5f4c31;letter-spacing:.06em}.program-strip span:first-child{padding-left:5px}.landing-follow{display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding:16px 4px;font-size:12px;color:#655139}.landing-follow>span{font:800 10px "Plus Jakarta Sans";letter-spacing:.12em;color:var(--red)}.landing-follow a{color:var(--green);font-weight:700;text-decoration:none;border-bottom:1px dotted var(--green)}
.quiz-header{max-width:860px;margin:18px auto 52px;display:flex;align-items:center;gap:16px}.ghost-icon{width:45px;height:45px;border-radius:50%;background:#f5e6c2;border:2px solid #6f5630;color:var(--green);cursor:pointer;box-shadow:2px 3px 0 rgba(58,43,29,.14)}.progress-wrap{flex:1}.progress-meta{display:flex;justify-content:space-between;font:800 10px "Plus Jakarta Sans",sans-serif;letter-spacing:.12em;color:#655139;margin-bottom:10px}.progress-track{height:8px;border:1px solid #9b7841;background:#e4c98c;overflow:hidden}.progress-bar{height:100%;width:14.2%;background:repeating-linear-gradient(45deg,var(--green),var(--green) 9px,#28584a 9px,#28584a 18px);transition:width .35s ease}.question-card{max-width:860px;margin:auto;background:rgba(247,232,194,.82);border:2px solid #6f5630;padding:34px;border-radius:8px;box-shadow:var(--shadow);position:relative}.question-card:before{content:"";position:absolute;inset:8px;border:1px solid rgba(111,86,48,.38);pointer-events:none}.question-card h2{font:700 clamp(31px,4.5vw,54px)/1.35 "Noto Serif Thai",serif;letter-spacing:-.025em;margin:18px 0 11px;color:var(--green)}.question-hint{color:#715b3d;font-size:15px;margin:0 0 28px}.answers{display:grid;gap:11px}.answer-btn{display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:14px;width:100%;text-align:left;padding:17px;border:1px solid #9d7b46;border-radius:5px;background:#fff2cf;color:#3f301e;cursor:pointer;transition:.16s;box-shadow:1px 2px 0 rgba(82,58,30,.12)}.answer-btn:hover{border-color:var(--red);background:#f8e5ba;transform:translateX(3px)}.answer-letter{width:40px;height:40px;border-radius:50%;background:var(--green);display:grid;place-items:center;font:800 11px "Plus Jakarta Sans",sans-serif;color:var(--cream);border:2px double #d5b870}.answer-text{font-size:16px;line-height:1.55}.answer-arrow{color:var(--red);font-weight:900}.scan-ring{width:180px;height:180px;border-radius:50%;border:2px solid #806331;display:grid;place-items:center;position:relative;margin-bottom:34px;background:#ead5a3;box-shadow:var(--shadow)}.scan-ring:before{content:"";position:absolute;inset:-12px;border-radius:50%;border:3px dashed var(--red);animation:spin 2.8s linear infinite}.scan-core{width:86px;height:86px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#f6e7bd;font:800 19px "Plus Jakarta Sans",sans-serif;border:4px double #d3b66b}.center-screen h2{font:700 clamp(30px,4vw,50px) "Noto Serif Thai",serif;margin:18px 0 18px;color:var(--green)}.analysis-lines{display:flex;gap:6px}.analysis-lines span{width:42px;height:4px;background:#9d7b45;animation:pulse 1.1s ease-in-out infinite}.analysis-lines span:nth-child(2){animation-delay:.15s}.analysis-lines span:nth-child(3){animation-delay:.3s}#analysisText{color:#6c5638}.result-topbar{margin-bottom:30px}.link-btn{border:0;background:none;color:var(--green);font-weight:800;cursor:pointer;text-decoration:underline}.result-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(380px,.98fr);gap:28px;align-items:start}.result-card{min-height:720px;border-radius:8px;padding:36px;position:sticky;top:22px;overflow:hidden;background:#f3dfaf!important;border:3px solid #4e3a20;box-shadow:var(--shadow);color:var(--ink)}.result-card:before{content:"";position:absolute;inset:9px;border:2px solid var(--green);box-shadow:inset 0 0 0 4px #d3b270;pointer-events:none}.result-card:after{content:"MISSION COMPLETE";position:absolute;right:25px;top:86px;transform:rotate(10deg);width:135px;height:135px;border:5px double rgba(141,48,38,.78);border-radius:50%;display:grid;place-items:center;text-align:center;color:rgba(141,48,38,.82);font:900 18px/1.15 "Plus Jakarta Sans",sans-serif;letter-spacing:.05em;opacity:.92}.result-card>*{position:relative;z-index:2}.card-glow,.sparkles{display:none}.result-card-head{display:flex;justify-content:space-between;align-items:flex-start}.hero-icon-shell{margin-top:16px;width:100px;height:100px;display:grid;place-items:center;border:2px solid #705531;border-radius:50%;background:#f8ebca;box-shadow:inset 0 0 0 5px rgba(181,138,58,.18)}.hero-icon{font-size:58px}.result-meta{text-align:right}.story-ready{display:inline-block;background:var(--green);color:var(--cream);border:1px solid var(--gold);padding:7px 10px;font:800 10px "Plus Jakarta Sans",sans-serif;letter-spacing:.08em}.result-code{margin-top:9px;font:800 10px "Plus Jakarta Sans",sans-serif;color:#745b39;letter-spacing:.12em}.hero-badge{display:inline-block;margin-top:28px;background:var(--red);color:#fff0ce;border:2px solid #6b251d;padding:7px 12px;font:800 10px "Plus Jakarta Sans",sans-serif;letter-spacing:.12em}.hero-thai-name{font:800 clamp(42px,5.8vw,68px)/1.1 "Noto Serif Thai",serif;letter-spacing:-.03em;margin:20px 0 5px;color:var(--red);max-width:650px;text-shadow:0 2px 0 #f8ebc8}.hero-name-en{font:800 clamp(20px,2.5vw,31px)/1.15 "Plus Jakarta Sans",sans-serif;color:var(--green);letter-spacing:.02em;margin-bottom:13px}.tagline{font:700 17px/1.4 "Noto Serif Thai",serif;color:#76562e;margin:0 0 18px}.hero-desc{font-size:16px;line-height:1.72;color:#53412b;max-width:650px}.dna-title{font:800 10px "Plus Jakarta Sans",sans-serif;letter-spacing:.16em;color:var(--cream);background:var(--green);padding:7px 10px;display:inline-block;margin:30px 0 15px;border:1px solid var(--gold)}.dna-bars{display:grid;gap:10px}.dna-row{display:grid;grid-template-columns:118px 1fr 42px;align-items:center;gap:10px;font:700 10px "Plus Jakarta Sans",sans-serif;color:#59452d}.dna-track{height:8px;border:1px solid #9d7a42;background:#dec184;overflow:hidden}.dna-fill{height:100%;background:repeating-linear-gradient(45deg,var(--red),var(--red) 8px,#a8493d 8px,#a8493d 16px)}.dna-score{text-align:right;color:var(--red);font-weight:900}.result-social-tag{display:inline-block;margin-top:26px;padding:8px 11px;border:1px dashed #8a6938;background:#f8e9c4;color:var(--green);font-weight:800}.result-footer{position:absolute!important;left:36px;right:36px;bottom:28px;display:flex;justify-content:space-between;padding-top:14px;border-top:1px solid #8d6c3d;font:700 9px "Plus Jakarta Sans",sans-serif;letter-spacing:.1em;color:#6e5839}.result-panel{display:grid;gap:17px}.panel-section,.squad-card,.share-hub,.follow-card{border:2px solid #735831;background:rgba(248,232,193,.84);border-radius:7px;padding:24px;box-shadow:0 12px 30px rgba(58,43,29,.09);position:relative}.panel-section:before,.squad-card:before,.share-hub:before,.follow-card:before{content:"";position:absolute;inset:6px;border:1px dashed rgba(116,88,49,.3);pointer-events:none}.panel-section h3,.squad-card h3,.share-hub h3,.follow-card h3{font:700 23px/1.35 "Noto Serif Thai",serif;margin:10px 0 18px;color:var(--green)}.program-matches{display:grid;gap:9px}.program-match{display:grid;grid-template-columns:42px 1fr auto;gap:11px;align-items:center;padding:13px;border:1px solid #a17d43;background:#fff1ce}.program-rank{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:var(--red);color:#fff2cf;font:800 9px "Plus Jakarta Sans"}.program-name{font:800 15px "Plus Jakarta Sans";color:var(--green)}.program-name small{display:block;font:500 12px "Noto Sans Thai";color:#70583b;margin-top:2px}.program-score{font:900 18px "Plus Jakarta Sans";color:var(--red)}.route-list{display:grid;gap:10px}.route-item{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:start;padding:12px 0;border-bottom:1px dashed #a27e44;font-size:14px;line-height:1.55}.route-num{font:900 10px "Plus Jakarta Sans";color:var(--red);padding-top:3px}.squad-card{display:flex;justify-content:space-between;align-items:center;gap:18px}.squad-card p{color:#685338;line-height:1.55;margin:0}.squad-orbs{display:flex;gap:5px}.squad-orbs span{width:25px;height:25px;border-radius:50%;border:2px solid var(--green);background:#e7cf98}.share-hub-head{display:flex;justify-content:space-between;gap:14px;align-items:start}.share-hint{font-size:11px;color:var(--red);font-weight:800}.social-share-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.social-btn{display:flex;align-items:center;gap:11px;text-align:left;border:1px solid #8c6a38;background:#fff0cb;color:var(--ink);padding:12px;border-radius:5px;cursor:pointer;transition:.16s}.social-btn:hover{transform:translateY(-2px);border-color:var(--red)}.social-icon{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff2d0;font:900 16px "Plus Jakarta Sans"}.social-btn b{display:block;font-size:13px}.social-btn small{display:block;font-size:11px;color:#765e3e}.action-row{display:flex;flex-wrap:wrap;gap:9px;margin-top:13px}.follow-card{display:grid;grid-template-columns:1fr 1fr;gap:18px}.follow-copy p{color:#685238;line-height:1.55}.follow-links{display:grid;gap:9px}.follow-link{display:grid;grid-template-columns:34px 1fr 18px;align-items:center;gap:9px;color:var(--ink);text-decoration:none;padding:11px;border:1px solid #967343;background:#fff0cb;border-radius:5px}.follow-link>span{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--red);color:#fff1ce;font-weight:900}.follow-link b{display:block;font-size:13px}.follow-link small{font-size:11px;color:#6f583b;word-break:break-word}.follow-link i{font-style:normal;color:var(--red)}.toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:var(--green);color:#fff1ce;border:2px solid var(--gold);padding:12px 16px;border-radius:6px;font-weight:700;z-index:60;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}.share-modal{position:fixed;inset:0;background:rgba(44,29,15,.55);display:none;place-items:center;padding:20px;z-index:70}.share-modal.open{display:grid}.share-modal-card{width:min(420px,100%);background:#f4e4bd;border:3px solid #604724;padding:28px;border-radius:8px;position:relative;box-shadow:var(--shadow);text-align:center}.share-modal-card:before{content:"";position:absolute;inset:7px;border:1px dashed #8c6a38;pointer-events:none}.modal-close{position:absolute;right:10px;top:8px;border:0;background:none;font-size:25px;color:var(--red);cursor:pointer;z-index:2}.modal-sticker{display:inline-block;background:var(--red);color:#fff2d2;padding:7px 10px;font:800 10px "Plus Jakarta Sans";letter-spacing:.1em;transform:rotate(-2deg)}.share-modal-card h3{font:700 29px "Noto Serif Thai";color:var(--green);margin:18px 0 9px}.share-modal-card p{line-height:1.65;color:#5f4a31}.modal-cta{display:inline-block;text-decoration:none;margin-top:5px}.confetti-layer{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:90}.confetti-piece{position:absolute;top:-15px;width:9px;height:18px;background:var(--red);animation:fall var(--dur) linear forwards;transform:translateX(0) rotate(0)}.result-card.reveal{animation:cardReveal .7s cubic-bezier(.2,.9,.2,1)}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.25;transform:scaleX(.75)}}@keyframes cardReveal{from{opacity:0;transform:translateY(20px) rotate(-.8deg)}to{opacity:1;transform:none}}@keyframes fall{to{transform:translate(var(--drift),105vh) rotate(var(--rot));opacity:.9}}
@media(max-width:900px){.hero-grid,.result-grid{grid-template-columns:1fr}.hero-grid{padding-top:42px}.hero-visual{height:420px}.result-card{position:relative;top:auto;min-height:690px}.follow-card{grid-template-columns:1fr}}
@media(max-width:620px){.app-shell{width:min(100% - 18px,620px)}.landing-meet{font-size:13px;line-height:1.5}.screen{padding-top:12px}.topbar-copy{font-size:8px;letter-spacing:.1em}.hero-grid{gap:22px;min-height:auto;padding:35px 0 28px}.hero-copy h1{font-size:clamp(48px,16vw,74px);line-height:.95}.lede{font-size:16px;line-height:1.7}.hero-visual{height:350px}.orb-1{width:300px;height:300px}.orb-2{width:245px;height:245px}.radar{width:150px;height:150px}.mini-card{width:162px;padding:13px}.mini-card b{font-size:13px}.c1{top:20px}.c2{top:100px}.c3{bottom:15px}.quiz-header{position:sticky;top:0;z-index:20;background:rgba(238,217,170,.95);padding:10px 3px;margin:0 auto 24px;backdrop-filter:blur(8px)}.question-card{padding:24px 16px}.question-card:before{inset:5px}.question-card h2{font-size:31px;line-height:1.38}.answer-btn{grid-template-columns:43px 1fr 18px;padding:14px 12px;gap:9px}.answer-text{font-size:15px;line-height:1.55}.result-topbar{margin-bottom:15px}.result-card{padding:27px 19px 76px;min-height:690px}.result-card:before{inset:6px}.result-card:after{width:94px;height:94px;right:14px;top:91px;font-size:12px;border-width:3px}.hero-icon-shell{width:82px;height:82px}.hero-icon{font-size:48px}.story-ready{font-size:8px;padding:6px 7px}.hero-thai-name{font-size:43px;line-height:1.13;margin-top:18px;padding-right:28px}.hero-name-en{font-size:19px;line-height:1.2}.hero-desc{font-size:14px;line-height:1.65}.dna-row{grid-template-columns:92px 1fr 33px;font-size:9px}.result-footer{left:20px;right:20px;font-size:7px}.panel-section,.squad-card,.share-hub,.follow-card{padding:19px 15px}.social-share-grid{grid-template-columns:1fr}.social-btn{padding:11px}.action-row>*{width:100%}.share-hub-head{display:block}.share-hint{display:block;margin:-8px 0 12px}.squad-card{align-items:flex-start}.landing-follow{font-size:11px}.program-strip span{padding:12px 15px}.follow-card{gap:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}