*{box-sizing:border-box}body{margin:0;background:#effaf9;color:#073d3b;font-family:"Noto Sans Thai","Leelawadee UI",Tahoma,sans-serif}header{display:flex;align-items:center;gap:18px;padding:18px clamp(16px,5vw,64px);background:linear-gradient(110deg,#087873,#0abab5);color:#fff}header div{flex:1}header h1{margin:2px 0}main{width:min(850px,calc(100% - 28px));margin:28px auto;display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:18px}.rule-card,aside{background:#fff;border:1px solid #9bd4d0;border-radius:18px;padding:22px}.rule-card h2{margin:0 0 12px}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:24px}.choice-grid label{display:flex;gap:10px;border:1px solid #9bd4d0;border-radius:14px;padding:14px;cursor:pointer}.choice-grid label:has(input:checked){background:#e1f8f5;border-color:#0abab5}.choice-grid input{width:20px;height:20px}.choice-grid span{display:grid;gap:4px}.choice-grid small,#prefixField small{color:#557876}#prefixField{display:grid;gap:8px;margin:4px 0 18px}textarea{width:100%;padding:12px;border:1px solid #86c8c4;border-radius:11px;font:inherit}.preview{margin:0 0 16px;padding:12px;border-left:4px solid #0abab5;background:#effaf9}#status.error{color:#b83232}@media(max-width:700px){main{grid-template-columns:1fr}.choice-grid{grid-template-columns:1fr}header>b{display:none}}
