:root{font-family:Segoe UI,Arial,sans-serif;background:#0c1625;color:#e1ecf7;color-scheme:dark}body{margin:0}main{max-width:1000px;margin:auto;padding:32px 24px}small{color:#9fbbd2}h1{font-size:34px}h2,h3{color:#68dccb}p{line-height:1.6}a{color:#75c9ff}nav{padding:20px 0}article,form,.notice{background:#132339;border:1px solid #304b67;border-radius:10px;padding:20px;margin:18px 0}label{display:block;margin:12px 0}input,textarea,select{box-sizing:border-box;display:block;width:100%;padding:12px;margin-top:6px;background:#0e1c2d;color:inherit;border:1px solid #405c77;border-radius:5px;font:inherit}textarea{min-height:100px}button{font:inherit;background:#137c91;color:#fff;border:0;border-radius:5px;padding:12px 18px;cursor:pointer;margin-right:8px}button:disabled{opacity:.5;cursor:default}pre{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6;font:inherit}input[type=checkbox]{display:inline;width:auto}#preview{border:1px solid #405c77;padding:20px}#result{white-space:pre-wrap}