:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#21313a;background:#fbfaf7;font-size:13px}*{box-sizing:border-box}body{margin:0;height:100dvh;min-height:360px;display:flex;flex-direction:column;gap:7px;padding:12px}header{display:flex;justify-content:space-between;align-items:baseline;gap:10px}header strong{font-size:15px}header>span{color:#687579;font-size:11px}.toolbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap}button,select{font:inherit;border:1px solid #c9d1cf;border-radius:5px;background:white;color:inherit;padding:5px 8px;cursor:pointer}button:hover{background:#eff4f1}button:disabled{opacity:.5;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #2a716d;outline-offset:2px}#run{background:#285f5b;border-color:#285f5b;color:white}.toolbar label{display:flex;align-items:center;gap:4px;font-size:11px}.view{position:relative;flex:1;min-height:180px;border:1px solid #dce0d8;border-radius:7px;overflow:hidden;background:#f7f6ee}canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}.legend{position:absolute;left:9px;top:8px;display:flex;gap:12px;padding:4px 7px;border-radius:4px;background:#fbfaf7e8;font-size:11px;pointer-events:none}.legend>span{display:flex;align-items:center;gap:5px}.legend i{width:11px;height:11px;border:1px solid #6b7a75;border-radius:2px}.even{background:#b9d9d1}.odd{background:#eed5ae}.hint{position:absolute;bottom:6px;right:8px;color:#6b7674;font-size:10px;pointer-events:none}.morph{padding:0 3px}.morph>label{display:flex;justify-content:space-between;font-size:12px;font-weight:600}.morph output{font-weight:400;color:#496a63}input[type=range]{width:100%;accent-color:#326d67;cursor:ew-resize;margin:8px 0 3px}.endpoints{display:flex;justify-content:space-between}.endpoints button{padding:0;border:0;background:transparent;font-size:11px;color:#526b65;text-decoration:underline;text-underline-offset:2px}p{margin:0;font-size:12px;line-height:1.4}.counts{font-variant-numeric:tabular-nums;color:#61716b;font-size:11px}footer{font-size:10px;color:#75817c;line-height:1.35}@media(max-width:600px){header>span{display:none}body{padding:8px;gap:6px}.toolbar{gap:4px}button,select{font-size:11px;padding:5px}footer{font-size:9px}}
