@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;500;600;700;800&family=Montserrat:wght@300;400;500;600;700;800&display=swap');
:root{--yellow:#EBC301;--ink:#111;--muted:#666;--line:#deded8;--soft:#f7f7f4;--max:1180px}
*{box-sizing:border-box}body{margin:0;font-family:"Kanit",Arial,sans-serif;color:var(--ink);line-height:1.58;background:#fff}a{text-decoration:none;color:inherit}.wrap{width:min(var(--max),calc(100% - 44px));margin:auto}.kicker,.topbar,.btn,.crumb,.send-message-button,.challenge-question{font-family:"Montserrat","Kanit",Arial,sans-serif}
.topbar{background:#111;color:#ddd;font-size:12px}.topbar .wrap{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:14px}header{position:sticky;top:0;z-index:10;background:#fff;border-bottom:1px solid var(--line)}.nav{height:82px;display:flex;align-items:center;justify-content:space-between;gap:20px}.logo{font-family:"Montserrat";font-size:23px;font-weight:800;letter-spacing:.09em;white-space:nowrap}.logo b{color:#b28d00}.navlinks{display:flex;gap:21px;font-size:14px;font-weight:600;align-items:center}.navlinks a:hover{color:#9f7a00}.header-btn{padding:12px 16px;background:#111;color:#fff;font-weight:700;font-size:13px;white-space:nowrap}
.message-hero{background:#181818;color:#fff;padding:58px 0}.message-hero .kicker{color:var(--yellow)}.kicker{font-size:12px;letter-spacing:.16em;font-weight:800;color:#a47a00;text-transform:uppercase}.message-hero h1{font-size:48px;line-height:1.1;margin:8px 0 10px}.message-hero p{max-width:760px;color:#ddd;margin:0}.crumb{font-size:12px;color:#777;padding:15px 0}.crumb a{color:#555}
.message-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:28px;padding:20px 0 64px}.message-card{border:1px solid var(--line);background:#fff;padding:24px;box-shadow:0 16px 38px rgba(0,0,0,.05)}.message-form{display:grid;gap:16px}.message-form label{display:grid;gap:7px}.message-form label span:not(.challenge-question){font-weight:700;color:#333}.message-form input,.message-form textarea{width:100%;border:1px solid #cfcfca;background:#fff;padding:14px 16px;font:inherit;font-size:17px;color:#111}.message-form textarea{resize:vertical;min-height:150px}.message-form input::placeholder,.message-form textarea::placeholder{color:#9b9b9b}.challenge-row{display:grid;grid-template-columns:1fr 48px;gap:0;align-items:end}.challenge-row label input{border-right:0}.challenge-question{font-size:18px;font-weight:800;color:#111}.challenge-refresh{height:50px;border:1px solid #cfcfca;background:#d9d9d9;color:#111;font-size:24px;font-weight:800;cursor:pointer}.challenge-refresh:hover{background:var(--yellow)}.message-actions{display:flex;align-items:center;justify-content:flex-end;gap:14px}.message-status{color:#8a6b00;font-weight:700}.send-message-button{border:0;background:#0073aa;color:#fff;font-size:15px;font-weight:800;padding:12px 18px;cursor:pointer}.send-message-button:before{content:"";display:inline-block;width:14px;height:10px;margin-right:7px;border:2px solid currentColor;border-top:0;transform:skewY(-8deg)}.send-message-button:hover{background:#005f8d}.send-message-button:disabled{background:#b7b7b7;color:#f7f7f7;cursor:not-allowed}
.message-side{background:#111;color:#fff;padding:28px;align-self:start}.message-side .kicker{color:var(--yellow)}.message-side h2{font-size:30px;margin:8px 0}.message-side p{color:#ddd;margin:0 0 20px}.side-info{border-top:1px solid #333;padding:14px 0}.side-info b{display:block;color:var(--yellow);font-family:"Montserrat";font-size:12px;letter-spacing:.08em}.side-info span{color:#f1f1f1}
.message-modal{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.58);display:flex;align-items:center;justify-content:center;padding:22px}.message-modal[hidden]{display:none}.message-modal-box{width:min(520px,100%);background:#fff;border-top:6px solid var(--yellow);padding:28px;box-shadow:0 24px 70px rgba(0,0,0,.28);text-align:center}.message-modal-box h2{font-size:30px;margin:0 0 10px}.message-modal-box p{color:#444;margin:0 0 22px}.modal-button{display:inline-flex;background:#111;color:#fff;padding:12px 18px;font-weight:800}
footer{background:#151515;color:#bbb;padding:35px 0 18px}.bottom{border-top:1px solid #383838;margin-top:18px;padding-top:12px;font-size:12px;color:#888;display:flex;justify-content:space-between;gap:12px}
@media(max-width:980px){.navlinks{display:none}.message-layout{grid-template-columns:1fr}.message-side{order:-1}.message-hero h1{font-size:40px}}
@media(max-width:620px){.wrap{width:min(var(--max),calc(100% - 28px))}.topbar .wrap{display:block;padding:8px 0}.message-card{padding:16px}.message-actions{display:grid;justify-content:stretch}.send-message-button{width:100%}.bottom{display:block}}