*{box-sizing:border-box}body{margin:0;background:#f6f3e9;color:#29332d;font:15px/1.5 Arial,sans-serif}main{min-height:100vh;padding:26px 4vw 40px;max-width:1800px;margin:auto}header,.arthead,.row,.stats{display:flex;justify-content:space-between;align-items:center;gap:12px}.brand{font-size:29px;font-weight:900;letter-spacing:-2px}.brand span{font-size:11px;letter-spacing:2px;margin-left:18px;font-weight:500}.chip,.eyebrow,.arthead{font-size:10px;letter-spacing:1.8px}.chip{border:1px solid #c7cbbd;border-radius:30px;padding:8px 12px}.intro{display:flex;justify-content:space-between;align-items:end;margin:45px 0 32px}h1{font-size:clamp(50px,6.4vw,100px);line-height:.96;font-weight:500;letter-spacing:-5px;margin:10px 0}h1 em{font-family:Georgia,serif;font-weight:400;color:#d65d3e}.dek{max-width:300px;font-size:17px;color:#6c7368}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;border:1px solid #cbd0be;border-radius:18px;overflow:hidden}.art{background:#fbf9f1;padding:20px 24px}.art>svg{width:100%;max-height:53vh;min-height:260px}.arthead{color:#777e70}.stats{border-top:1px solid #dde0d3;padding-top:18px}.stats strong{font-size:23px;display:block;font-weight:500}.stats span{font-size:10px;color:#72796d}aside{padding:25px;background:#e8edda}h2{font:40px/1.05 Georgia,serif;font-weight:400;margin:14px 0 18px;letter-spacing:-1px}aside p,.note{color:#65705d;font-size:13px}.note{border-top:1px solid #c5ccb8;padding-top:16px;margin-top:20px;font-size:11px}label{display:block;margin:14px 0;font-size:12px}input,select,textarea{width:100%;font:inherit;border:1px solid #c8cebb;border-radius:6px;background:#fffdf5;padding:8px;color:inherit}input[type=range]{padding:0;accent-color:#d45e43}button{border:1px solid #c5ccb9;border-radius:7px;background:transparent;padding:11px 14px;color:inherit;cursor:pointer;font:12px Arial,sans-serif;transition:background .18s}button:hover{background:#dce5bd}.dark{background:#2d392f;color:#f5f4e8;border-color:#2d392f}.dark:hover{background:#46573d}aside button{width:100%;margin:4px 0}.railsection{padding:20px 24px;margin-top:18px;background:#fffdf5;border:1px solid #cbd0be;border-radius:14px}.rail{height:120px;width:100%;margin-top:16px;touch-action:none;cursor:ns-resize}.author{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin:40px 0}.author .row{justify-content:start;flex-wrap:wrap}.author p{max-width:480px;color:#6d7567;font-size:13px}.author label{display:inline-block;width:45%;margin-right:4%}textarea{height:210px;font:12px/1.4 monospace;margin:12px 0;resize:vertical}small{color:#6c7368;font-size:11px}footer{border-top:1px solid #c6cdbb;padding-top:20px}footer .row{justify-content:start;flex-wrap:wrap}details{font-size:11px;max-width:700px;margin-top:20px}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #bc4a2e;outline-offset:3px}@media(max-width:800px){.workspace,.author{grid-template-columns:1fr}.intro{display:block}h1{letter-spacing:-3px}.chip{display:none}.brand span{font-size:9px}.art{padding:16px}.arthead{font-size:8px}.dek{max-width:400px}.stats{gap:8px}.stats strong{font-size:18px}aside{padding:22px}.author{gap:20px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
