:root{font-family:ui-monospace,"SFMono-Regular","SF Mono",Menlo,Monaco,monospace;color:#161616;background:#fff;font-size:16px}*{box-sizing:border-box}body{margin:0}header{border-bottom:1px solid #c8c8c8;padding:22px 4%;font-size:11px;letter-spacing:.08em}header a{color:inherit;text-decoration:none}main{max-width:1400px;margin:auto;padding:24px 4%}.heading{margin-bottom:24px}h1{font:400 36px Garamond,"EB Garamond",serif;margin:0 0 8px}.heading p,.note,#warning,footer{font-size:11px;line-height:1.6;color:#555}.workspace{display:grid;grid-template-columns:245px minmax(0,1fr);gap:40px;align-items:start}fieldset{border:1px solid #aaa;margin:0;padding:18px}legend{font-size:11px;letter-spacing:.1em;padding:0 8px}label{display:flex;justify-content:space-between;font-size:11px;margin:18px 0 8px}select,input[type=number]{width:100%;padding:9px;border:1px solid #aaa;background:#fff;font:11px inherit}input[type=range]{width:100%;accent-color:#111}button{width:100%;margin-top:10px;padding:10px;border:1px solid #111;background:#111;color:#fff;font:11px inherit}.secondary,.view-controls button{background:#fff;color:#111}.drawing{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:0 20px;align-items:start}#viewport{position:relative;overflow:hidden;width:100%;height:72vh;min-height:300px;max-height:850px;background:#ededed;border:1px solid #bbb}#paper-preview{position:absolute;left:0;top:0;background:#fff;line-height:0}#paper-preview svg{display:block;width:100%;height:100%;background:#fff}.study-notes{border-top:1px solid #161616;text-align:left;font-size:12px;line-height:1.45}.study-notes h2{font-size:11px;font-weight:400;letter-spacing:.08em;text-transform:uppercase;margin:9px 0 18px}.study-notes p{margin:0 0 20px}.study-notes dl{margin:0}.study-notes dt{font-size:11px;font-weight:600;margin:16px 0 3px}.study-notes dd{margin:0;color:#555}.view-controls,.metadata,#warning{grid-column:1}.view-controls{display:flex;justify-content:center;align-items:center;gap:8px;margin:12px 0}.view-controls button{width:auto;margin:0;padding:8px 14px}.view-controls button[aria-pressed=true]{background:#111;color:#fff}.view-controls output{min-width:44px;font-size:11px}.metadata{font-size:11px;margin-top:14px;text-transform:uppercase;text-align:center}@media(max-width:800px){.workspace{grid-template-columns:1fr}.drawing{grid-row:1;grid-template-columns:1fr}.study-notes{grid-row:4;margin-top:24px;max-width:600px}.view-controls,.metadata,#warning{grid-column:1}#viewport{height:60vh}main{padding:20px}}

/* Shared readable control rule: controls are always 12px monospace and action rows begin at the left edge. */
#controls,#controls *,.view-controls,.view-controls *{font-size:12px!important}.view-controls{justify-content:flex-start}