:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#dce8df;background:#15211f;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,select,input{color:inherit}button{background:#263632;border:1px solid #4b6055;border-radius:5px;padding:10px 12px;cursor:pointer;text-align:left;transition:background .16s,transform .16s}button:hover{background:#385145;transform:translateY(-1px)}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,textarea:focus-visible{outline:3px solid #edc687;outline-offset:3px}header{height:76px;display:flex;justify-content:space-between;align-items:center;padding:0 4vw;border-bottom:1px solid #354a40}.brand{font-size:30px;color:#e5bd80;display:flex;align-items:center;gap:12px}.brand span,.edition{font-size:11px;font-weight:650;letter-spacing:2px}.edition span{color:#9aad9e;margin-left:32px}main{padding:28px 4vw 0;max-width:1800px;margin:auto}.intro{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:30px}.eyebrow{letter-spacing:3px;font-size:10px;color:#c3a16e}h1{font:normal clamp(36px,4.4vw,66px)/1 Georgia,serif;margin:12px 0}h1 em{color:#e7c488;font-weight:400}.intro p{color:#aebeb3;font-size:13px;line-height:1.7}.meter{padding:25px 30px;border-left:2px solid #94b99c;min-width:280px}.meter.alert{border-color:#ff8573}.meter span{letter-spacing:2px;font-size:10px}.meter strong{font: 28px Georgia,serif;display:block;margin-top:13px}.meter.alert strong{color:#ffad90}.meter p{margin-bottom:0}.workspace{display:grid;grid-template-columns:220px minmax(280px,1fr) 230px;gap:26px;align-items:start}aside{background:#1c2b26;padding:18px;border:1px solid #354b3e;border-radius:8px}h2{font-size:10px;letter-spacing:1.8px;margin:0 0 17px;color:#c6b58b}aside h2:not(:first-child){margin-top:28px}.presets{display:grid;gap:6px}.presets button{font-size:12px}.modes{display:flex;margin:18px 0 10px}.modes button{flex:1;text-align:center;font-size:12px}button[aria-pressed=true],.primary{background:#d4b17a;color:#15211f}.primary{width:100%;font-weight:650}.hint{font-size:10px;color:#a2b4a7;line-height:1.7}.pair{display:grid;grid-template-columns:1fr 1fr;gap:8px}label{font-size:11px;display:block;margin-bottom:12px;color:#b5c5b8}input:not([type=checkbox]),select{display:block;width:100%;margin-top:6px;background:#15211f;border:1px solid #4d6455;padding:8px;border-radius:4px}input[type=color]{height:40px;padding:4px}aside>button{margin:5px 0;width:100%;font-size:11px}.canvas-top,.canvas-bottom{display:flex;justify-content:space-between;gap:8px;font-size:9px;letter-spacing:1px;color:#bccabf;padding:11px 0}.paper{background-color:#fff;border:12px solid #e7dfca;box-shadow:0 18px 50px #0004}.paper canvas{display:block;width:100%;height:auto;aspect-ratio:96/80;touch-action:none;image-rendering:pixelated;cursor:crosshair}.dot{color:#d1b57c}.reference{display:flex;align-items:center;gap:18px;margin-top:24px;padding:18px;border-top:1px solid #3d5144}.reference canvas{width:96px;height:80px;image-rendering:pixelated;background:#fff;border:4px solid #e7dfca}.reference h3{font: 19px Georgia,serif;margin:0 0 8px}.reference p{font-size:11px;line-height:1.6;color:#a6b8aa;margin:0}.check{display:flex;gap:8px;align-items:center}.checkpoint-list{max-height:420px;overflow:auto;margin-top:16px}.checkpoint-list>div{padding:8px 0;border-top:1px solid #405245;display:flex;flex-wrap:wrap;justify-content:space-between;font-size:10px}.checkpoint-list small{width:100%;margin-top:4px;color:#9aac9e}.checkpoint-list .bad{color:#ffaf92}.checkpoint-list .good{color:#bbd6bc}.footer-tools{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:25px 0;border-top:1px solid #405245;margin-top:24px}.footer-tools h2{margin-bottom:8px}.footer-tools p{font-size:11px;color:#b7c5b9}.exports{display:flex;flex-wrap:wrap;gap:8px}.exports button{font-size:11px}.status{padding:13px;background:#233c2f;font-size:12px;border-left:3px solid #bfba83}details{padding:20px 0;border-bottom:1px solid #405245;font-size:12px}details p{color:#b4c5b7}textarea{display:block;background:#101b17;border:1px solid #526957;color:#d4e3d4;width:100%;height:130px;margin-bottom:10px;resize:vertical}details button{margin-right:8px}footer{font-size:10px;color:#a5b6a9;line-height:1.8;padding:20px 0 30px}footer p{max-width:1000px}footer button{font-size:10px;margin-right:8px}@media(min-width:1600px){.workspace{grid-template-columns:240px minmax(280px,1fr) 260px}}@media(max-width:1050px){.workspace{grid-template-columns:190px 1fr}.checks{grid-column:1/-1}.checkpoint-list{max-height:180px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}}@media(max-width:680px){main{padding:20px}.intro{display:block}.meter{margin-top:20px;padding:12px 18px}.workspace{display:flex;flex-direction:column}.workspace>*{width:100%}.canvas-column{order:-1}.presets{grid-template-columns:1fr 1fr}.edition span{display:none}.footer-tools{display:block}.checkpoint-list{grid-template-columns:repeat(2,1fr)}h1{font-size:44px}.reference{padding:10px 0}.brand span{font-size:9px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.app{min-height:100svh}.focus .intro,.focus .workspace aside:first-child,.focus .reference,.focus .footer-tools,.focus details,.focus footer{display:none}.focus main{max-width:none;padding-top:12px}.focus .workspace{grid-template-columns:minmax(0,1fr) 230px}.focus .canvas-column{width:100%;max-width:calc((100svh - 185px)*1.2);justify-self:center}.focus .checks{max-height:calc(100svh - 170px);overflow:auto}.focus .status{margin:8px 0}.focus header{height:60px}.focus .checkpoint-list{max-height:calc(100svh - 410px)}@media(max-width:680px){.focus .workspace{display:flex}.focus .checks{max-height:240px}.focus .canvas-column{max-width:100%}.edition{display:none}}
