:root{--n:#071927;--n2:#102b39;--g:#d5ad61;--p:#f3eee4}*{box-sizing:border-box}body{margin:0;background:var(--n);color:#fff;font-family:"Noto Sans Thai",Tahoma,sans-serif}header{height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;border-bottom:1px solid #294653}header a{color:#fff;text-decoration:none}.brand{display:flex;align-items:center}.brand img{width:40px;height:40px}.brand-word{font:900 15px Arial;letter-spacing:.18em}.brand-word i{color:var(--g)}main{max-width:1400px;margin:auto;padding:20px 4vw 70px}.notice{background:#ead7ab;color:#142b38;padding:11px 15px}.intro{display:grid;grid-template-columns:.45fr .8fr 1.3fr;align-items:end;gap:28px;padding:45px 0}.intro>p,.step,aside>span,#result>p{color:var(--g);font:800 11px Arial;letter-spacing:.15em}h1{font:400 clamp(42px,5vw,70px)/1.05 Georgia,"Noto Serif Thai",serif;margin:0}.tabs{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}.tabs button{padding:12px;border:1px solid #48626e;background:transparent;color:#fff}.tabs button.active{background:var(--g);color:var(--n);border-color:var(--g)}.stage{display:grid;grid-template-columns:.55fr 1.1fr;gap:18px;align-items:start}aside,.quiz{background:var(--n2);border:1px solid #31505e;padding:clamp(24px,4vw,50px)}aside h2,.quiz h2{font:400 clamp(28px,4vw,48px)/1.2 Georgia,"Noto Serif Thai",serif}aside p,aside dt{color:#aebec5}aside dl{display:grid;grid-template-columns:1fr 1fr}aside dd{text-align:right}.quiz{min-height:590px;box-shadow:16px 16px 0 var(--g)}.progress{height:5px;background:#294653}.progress i{display:block;height:100%;background:var(--g);transition:width .25s}.quiz #answers{display:grid;gap:11px}.quiz button,.quiz #answers button,.quiz a{display:block;width:100%;padding:15px;background:#183b4a;color:#fff;border:1px solid #496875;text-align:left;text-decoration:none}.quiz button:hover,.quiz button:focus{background:var(--g);color:var(--n)}.quiz label{display:grid;gap:5px;margin:13px 0}.quiz input{padding:14px;background:#071927;color:#fff;border:1px solid #4e6975}.quiz .consent{display:flex;align-items:start}.quiz .consent input{margin-right:9px}#result a{background:var(--g);color:var(--n);text-align:center;margin-top:25px}@media(max-width:850px){.intro,.stage{grid-template-columns:1fr}.tabs{justify-content:flex-start}}@media(max-width:520px){main{padding-left:12px;padding-right:12px}.tabs button{width:100%;text-align:left}.quiz{min-height:530px;padding:24px;box-shadow:8px 8px 0 var(--g)}}