:root{color-scheme:light;--ink:#27392F;--muted:#637065;--line:#CBD2C7;--green:#355E46}*{box-sizing:border-box}body{margin:0;background:#ECEEE7;color:var(--ink);font:14px/1.5 system-ui,sans-serif}header{padding:20px 32px;display:flex;align-items:center;gap:30px;border-bottom:1px solid var(--line)}a{color:inherit}.eyebrow{font-size:11px;letter-spacing:.18em}.version{margin-left:auto;color:var(--muted);font-size:12px}main{max-width:1500px;margin:auto;padding:32px}.intro{display:flex;align-items:center;justify-content:space-between;gap:20px}h1{font:40px/1.1 Georgia,serif;margin:0}.intro p{color:var(--muted)}.actions{display:flex;gap:8px;flex-wrap:wrap}button,.button{display:inline-block;font:inherit;color:inherit;background:#FBFCF7;border:1px solid var(--line);border-radius:6px;padding:9px 12px;cursor:pointer;text-align:center;min-height:42px}button:hover,.button:hover{background:#E1E8DB}.primary{background:var(--green);color:white}button:disabled{opacity:.45;cursor:default}input,textarea,select{font:inherit;width:100%;padding:8px;border:1px solid var(--line);border-radius:5px;background:#FFF;color:var(--ink)}input[type=checkbox]{width:auto}input[type=color]{height:42px;padding:3px}input[type=range]{padding:0}label{display:block;font-size:12px;color:var(--muted);margin:8px 0}textarea{min-height:72px;resize:vertical}.workspace{display:grid;grid-template-columns:310px minmax(0,1fr);gap:28px;margin-top:20px}aside{max-height:calc(100vh - 80px);overflow:auto;position:sticky;top:20px}details{padding:14px;background:#F8F9F4;border:1px solid var(--line);border-radius:8px;margin-bottom:12px}summary{cursor:pointer;font-weight:650}.pair{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.colors{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.hint{font-size:12px;color:var(--muted)}.toolbar{display:flex;gap:20px;align-items:center;flex-wrap:wrap;padding:8px 20px;background:#F8F9F4;border-radius:8px 8px 0 0}.toolbar label{display:flex;align-items:center;gap:8px}.toolbar select{width:auto}.canvas-wrap{padding:36px;overflow:auto;background-color:#D9DED3;background-image:linear-gradient(45deg,#E5E9E0 25%,transparent 25%),linear-gradient(-45deg,#E5E9E0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#E5E9E0 75%),linear-gradient(-45deg,transparent 75%,#E5E9E0 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0;max-height:900px;display:flex;justify-content:center;align-items:flex-start}canvas{width:400px;max-width:100%;height:auto;filter:drop-shadow(3px 8px 8px #27392F30);touch-action:none}.proof{display:flex;gap:18px;flex-wrap:wrap;padding:14px;background:#F8F9F4;border-radius:0 0 8px 8px;font-size:12px}#status{padding:12px 0;min-height:44px}#json{font:11px/1.6 ui-monospace,monospace;min-height:300px}#sample{min-height:160px}.error{color:#9B302E}*:focus-visible{outline:3px solid #78A998;outline-offset:2px}[hidden]{display:none!important}@media(max-width:800px){main{padding:20px}.intro{display:block}h1{font-size:32px}.workspace{grid-template-columns:1fr}aside{position:static;max-height:500px}.version{display:none}.canvas-wrap{padding:20px}header{padding:16px 20px;gap:15px}}

.toolbar input[type=number]{width:90px}.toolbar{gap:12px}#undo,#redo{min-width:65px}

.note-stage{width:400px;max-width:100%;flex:none;position:relative;overflow-anchor:none}.note-stage canvas{display:block;width:100%}.canvas-wrap{overflow-anchor:none}#height-handle{position:sticky;bottom:0;display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:8px 12px;border:1px solid #8AA38D;border-radius:0 0 8px 8px;background:#F8FCF3;color:#254631;font-size:12px;cursor:ns-resize;touch-action:none;user-select:none;box-shadow:0 3px 8px #27392F20}#height-handle:hover,#height-handle.dragging{background:#DCEAD4}#handle-height{font-variant-numeric:tabular-nums;font-weight:650}#height-hint{margin:8px 0 12px}

.history-actions{display:flex;gap:8px;margin:16px 0 24px}.paper-manager{width:520px;max-width:100%;flex-shrink:0}.paper-manager>.actions{margin-top:10px;align-items:center}.paper-manager .button{margin:0}dialog{max-width:620px;width:calc(100% - 40px);border:1px solid var(--line);border-radius:12px;padding:24px;background:#F8F9F4;color:var(--ink)}dialog::backdrop{background:#18292080}dialog h2{margin-top:0}#save-state{min-height:18px}@media(max-width:1000px){.intro{display:block}.paper-manager{width:100%}}

#store-environment{font:600 11px/1.4 system-ui;padding:6px 10px;border:1px solid currentColor;border-radius:5px;white-space:nowrap}#store-environment[data-environment=development]{color:#825200;background:#FFF0BF}#store-environment[data-environment=release]{color:#1C583A;background:#DAEFE2}header{flex-wrap:wrap}