:root{font-family:Georgia,serif;color:#293f3e;background:#faf6ec;font-synthesis:none}*{box-sizing:border-box}body{margin:0}header,nav,main,footer,.status,.draft{max-width:1360px;margin:auto}header{padding:35px 30px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #c8c4b5}small,.header-note,button,label,.status,aside p{font-family:system-ui,sans-serif}small{letter-spacing:3px;color:#8e573d}h1{font-size:48px;font-weight:400;line-height:1.04;margin:14px 0}h1 em{color:#b45b39}header p{font-size:20px}.header-note{line-height:1.8;text-align:right;font-size:14px}nav{display:flex;flex-wrap:wrap;gap:6px;padding:18px 30px}button{cursor:pointer;background:#fffcf5;border:1px solid #b4b7aa;border-radius:4px;padding:9px 12px;color:#293f3e;font-size:13px}button:hover,button[aria-pressed=true]{background:#d9e6df}.primary{background:#315f5a;color:#fff}.status{padding:10px 30px;color:#76502e;font-size:13px}main{display:grid;grid-template-columns:290px minmax(0,1fr);gap:30px;padding:20px 30px}aside{padding-right:24px;border-right:1px solid #c8c4b5}h2{font-size:21px;font-weight:400}h3{font-size:16px}label{display:block;font-size:12px;margin:12px 0;color:#506260}input,select,textarea{display:block;width:100%;border:1px solid #acb8af;border-radius:3px;padding:9px;background:#fffefa;color:#263b37;font:14px system-ui}input[type=color]{height:42px}input[type=range]{padding:0}aside p{font-size:12px;line-height:1.6}.coords{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}form button{margin:6px 4px 4px 0}.ledger{max-height:270px;overflow:auto;display:grid;gap:4px}.ledger button{text-align:left}.ledger span{width:12px;height:12px;float:right;border-radius:50%}.sectionhead{display:flex;align-items:center;justify-content:space-between}.preview{background:#e9eee6;border:1px solid #d3dbd0;padding:16px 25px}.canvas{background:#f8f2e5;border:1px solid #cec9b7;box-shadow:inset 0 0 70px #e1d7c177}.canvas svg{width:100%;height:360px}.preview form{display:flex;gap:12px;align-items:center}.preview form input{width:100px}.preview p,.notice p,footer p{font-size:14px;line-height:1.6}.states{display:grid;grid-template-columns:1fr 1fr;gap:15px}.states>div{border:1px solid #c9cabb;background:#fffdf8;padding:14px}.states svg{width:100%;height:200px}.states button{margin:3px}.notice{margin-top:25px;border-top:1px solid #c8c4b5}footer{padding:25px 30px;border-top:1px solid #c8c4b5}footer p{max-width:950px}.draft{padding:20px 30px;background:#efe4d2}.draft textarea{height:260px}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #bb613d;outline-offset:3px}@media(max-width:760px){header{padding:25px 18px}.header-note{display:none}h1{font-size:38px}main{grid-template-columns:1fr;padding:16px;gap:20px}aside{border:0;padding:0}.states{grid-template-columns:1fr}.canvas svg{height:260px}nav{padding:14px}.status{padding:10px 16px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}:fullscreen{overflow:auto;background:#faf6ec}