:root{font-family:Arial,"Noto Sans Thai",Tahoma,sans-serif;color:#283950;background:#f2f6fa;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-height:100vh}.page-shell{width:min(880px,100%);margin:0 auto;padding:22px 18px 26px}.brand{display:flex;align-items:center;gap:10px;margin:0 auto 16px;color:#20344e;font-size:19px;font-weight:800}.brand small{display:block;margin-top:3px;color:#8593a6;font-size:14px;font-weight:500;letter-spacing:.2px}.brand-icon{display:grid;width:40px;height:40px;place-items:center;border-radius:12px;background:#e1f4f1;color:#149b96;font-size:24px}.card,.survey-content{overflow:hidden;border:1px solid #e8edf3;border-radius:16px;background:#fff;box-shadow:0 4px 16px #23384f0a}.hero{position:relative;overflow:hidden;margin-bottom:14px;padding:26px 29px 20px;border-radius:17px;background:linear-gradient(125deg,#116a77,#169d96);box-shadow:0 10px 24px #178d8c26;color:#fff}.hero:after{position:absolute;top:-125px;right:-45px;width:210px;height:210px;border:1px solid #ffffff30;border-radius:50%;box-shadow:0 0 0 27px #ffffff10,0 0 0 54px #ffffff08;content:""}.eyebrow{position:relative;z-index:1;color:#c9f1ed;font-size:14px;font-weight:800;letter-spacing:1px}.hero h1{position:relative;z-index:1;margin:6px 0;font-size:29px;line-height:1.35}.hero p{position:relative;z-index:1;margin:0;color:#dcf7f4;font-size:17px;line-height:1.55}.scale-key{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:10px 16px;margin-top:17px;padding-top:13px;border-top:1px solid #ffffff45}.scale-key span{color:#e4faf8;font-size:15px}.scale-key b{display:inline-grid;width:21px;height:21px;margin-right:4px;place-items:center;border-radius:5px;background:#ffffff2a;font-size:15px}.survey-content{padding:21px 25px}.privacy{display:flex;align-items:center;gap:9px;padding:11px 13px;border-radius:8px;background:#edf7ff;color:#58738f}.privacy>span{font-size:20px}.privacy p{margin:0;font-size:15px;line-height:1.55}.survey-section{margin-top:22px}.survey-section>header{display:flex;align-items:center;gap:10px;margin-bottom:4px;padding-bottom:9px;border-bottom:1px solid #edf1f5}.survey-section>header>span{display:grid;width:27px;height:27px;place-items:center;border-radius:7px;background:#e7f6f4;color:#128f8b;font-size:15px;font-weight:800}.survey-section h2{margin:0;color:#30435d;font-size:19px}.question{padding:14px 2px;border-bottom:1px solid #f0f2f6}.question.invalid{margin:0 -8px;padding-right:10px;padding-left:10px;border-radius:8px;background:#fff9f8}.prompt{margin-bottom:9px;color:#43546b;font-size:17px;font-weight:650;line-height:1.55}.prompt em{color:#d75e50;font-style:normal}.ratings{display:flex;gap:8px}.ratings button{width:45px;height:40px;border:1px solid #e1e7ee;border-radius:8px;background:#fff;color:#728198;font-size:18px;font-weight:700;cursor:pointer;transition:.15s}.ratings button:hover,.ratings button.selected{border-color:#168f8e;background:#168f8e;color:white;box-shadow:0 3px 8px #168f8e2b}.choices{display:flex;flex-wrap:wrap;gap:10px 20px}.choices label{display:flex;align-items:center;gap:7px;color:#586a82;font-size:16px;line-height:1.5;cursor:pointer}.choices input{width:17px;height:17px;accent-color:#168f8e}.question textarea{display:block;width:100%;min-height:78px;resize:vertical;border:1px solid #dfe6ed;border-radius:8px;padding:10px 12px;color:#33445c;font:inherit;font-size:16px;line-height:1.5;outline:0}.question textarea:focus{border-color:#83c9c4;box-shadow:0 0 0 3px #168f8e12}.field-error{display:block;margin-top:6px;color:#ce5c4d;font-size:14px}.submit-error{margin-top:14px;padding:10px 12px;border-radius:8px;background:#fff2f0;color:#b84f43;font-size:15px;line-height:1.5}.submit{display:block;width:100%;margin-top:18px;padding:13px;border:0;border-radius:9px;background:#168f8e;color:#fff;font-size:18px;font-weight:750;cursor:pointer;box-shadow:0 5px 12px #168f8e25}.submit:hover{background:#107d79}.submit:disabled{opacity:.65;cursor:wait}.thanks-note{margin:13px 0 0;text-align:center;color:#929eae;font-size:14px}.state{padding:65px 14px;text-align:center;color:#738399}.state p{margin:10px 0 0;font-size:16px}.spinner{display:inline-block;width:28px;height:28px;border:3px solid #e1eeee;border-top-color:#159b96;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.state-card{padding:52px 24px;text-align:center}.state-card .state-icon{display:grid;width:58px;height:58px;margin:0 auto 15px;place-items:center;border-radius:50%;background:#f0f3f7;color:#8291a4;font-size:26px;font-weight:700}.state-card h1{margin:0;color:#2e415b;font-size:26px}.state-card p{margin:10px auto 0;color:#7d8b9d;font-size:16px;line-height:1.6}.state-card.success .state-icon{background:#e5f7f0;color:#27a47b}.state-card .eyebrow{color:#168f8e}footer{padding:18px;text-align:center;color:#9aa6b4;font-size:14px}@media(max-width:600px){.page-shell{padding:15px 11px 22px}.hero{padding:21px 18px 16px}.hero h1{font-size:25px}.hero p{font-size:16px}.survey-content{padding:16px 15px}.scale-key{gap:8px 11px}.scale-key span{font-size:14px}.ratings{gap:6px}.ratings button{width:calc((100vw - 82px)/5);max-width:58px;height:40px}.choices{flex-direction:column;gap:10px}.prompt{font-size:16px}}
