:root{--ink:#15212b;--ink-soft:#41525e;--paper:#f8f6f0;--paper-2:#f3efe5;--line:#d1c7ac;--line-2:#dfd7c2;--blue:#1f5f8b;--brass:#b07c2e;--good:#3a7d3a;--bad:#a8392e;--shadow:#15212b2e}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{color:var(--ink);background:var(--paper);background-image:linear-gradient(var(--line-2) 1px, transparent 1px), linear-gradient(90deg, var(--line-2) 1px, transparent 1px);-webkit-font-smoothing:antialiased;background-size:22px 22px;flex-direction:column;align-items:center;min-height:100%;padding:18px 14px 40px;font-family:Courier New,ui-monospace,monospace;display:flex}.sheet{width:100%;max-width:560px}.sheet header{border:1.5px solid var(--ink);background:var(--paper-2);box-shadow:4px 4px 0 var(--shadow);padding:14px 16px 12px;position:relative}.corner{border:1.5px solid var(--ink);background:var(--paper);width:9px;height:9px;position:absolute}.corner.tl{top:-1.5px;left:-1.5px}.corner.tr{top:-1.5px;right:-1.5px}.corner.bl{bottom:-1.5px;left:-1.5px}.corner.br{bottom:-1.5px;right:-1.5px}.sheet h1{text-transform:uppercase;text-indent:10px;font-family:Georgia,Times New Roman,serif;font-size:34px;font-weight:700;line-height:1}.sub{text-transform:uppercase;color:var(--ink-soft);border-top:1px solid var(--line);justify-content:space-between;align-items:baseline;margin-top:8px;padding-top:7px;font-size:14px;display:flex}.sub b{color:var(--blue)}.stage-wrap{border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--shadow);background:linear-gradient(#eef0e9,#e4e0d0);border-top:none}.readout{text-transform:uppercase;border-bottom:1px dashed var(--line);font-size:14px;display:flex}.readout div{color:var(--ink-soft);flex-direction:column;flex:1;padding:7px 10px;display:flex}.readout div+div{border-left:1px dashed var(--line)}.readout span{color:var(--ink);letter-spacing:0;margin-top:auto;padding-top:2px;font-size:18px}.readout span.live{color:var(--blue)}.sheet svg{touch-action:none;cursor:crosshair;width:100%;height:auto;display:block}.controls{border:1.5px solid var(--ink);background:var(--paper-2);box-shadow:4px 4px 0 var(--shadow);border-top:none;padding:14px 16px 16px}.hint{color:var(--ink-soft);min-height:34px;margin-bottom:10px;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:16px;line-height:1.5}.hint b{color:var(--ink)}.sheet button{text-transform:uppercase;cursor:pointer;width:100%;color:var(--paper);background:var(--ink);border:1.5px solid var(--ink);box-shadow:3px 3px 0 var(--shadow);padding:13px;font-family:inherit;font-size:18px;font-weight:700;transition:transform 50ms,box-shadow 50ms}.sheet button:hover:not(:disabled){background:var(--blue);border-color:var(--blue)}.sheet button:active:not(:disabled){box-shadow:0 0 0 var(--shadow);transform:translate(3px,3px)}.sheet button:disabled{opacity:.4;cursor:not-allowed}.result{border:1.5px solid var(--ink);background:var(--paper-2);box-shadow:4px 4px 0 var(--shadow);margin-top:14px;padding:0;animation:.35s both rise}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.grade{border-bottom:1.5px solid var(--ink);align-items:center;gap:14px;padding:14px 16px;display:flex}.grade .big{font-family:Georgia,serif;font-size:46px;line-height:1}.grade .meta{text-transform:uppercase;color:var(--ink-soft);font-size:14px}.grade .meta b{color:var(--ink);margin-top:3px;font-size:20px;display:block}.res-actions{padding:12px 16px 14px}.res-actions button{background:var(--brass);border-color:var(--brass)}.res-actions button:hover{background:#8f6320;border-color:#8f6320}.streak{text-transform:uppercase;color:var(--ink-soft);justify-content:space-between;align-items:baseline;gap:12px;margin-top:14px;font-size:14px;display:flex}.streak b{color:var(--brass)}.streak .next{white-space:nowrap}.streak .count{color:var(--blue);font-variant-numeric:tabular-nums}