@import "https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600&family=Source+Sans+3:wght@400;600;700&display=swap";:root{--ink:#1c2430;--ink-soft:#f3f0ea;--paper:#fbfaf7;--paper-deep:#ebe6dc;--muted:#5c6570;--rule:#cfc8bb;--accent:#2f5d50;--display:"Fraunces", "Palatino Linotype", Palatino, serif;--sans:"Source Sans 3", "Segoe UI", sans-serif;font:16px/1.45 var(--sans);color:var(--ink);background:var(--paper);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,:before,:after{box-sizing:border-box}body{min-width:320px;margin:0}#root{min-height:100svh}button,input,select{font:inherit}.app{flex-direction:column;height:100svh;display:flex;overflow:hidden}.navbar{background:linear-gradient(180deg, var(--ink-soft) 0%, color-mix(in srgb, var(--ink-soft) 85%, var(--paper) 15%) 100%);border-bottom:1px solid var(--rule);box-shadow:0 1px 0 color-mix(in srgb, var(--ink) 6%, transparent);flex-direction:column;gap:1rem;padding:1rem 1.25rem 1.15rem;display:flex}.navbar-title{font-family:var(--display);letter-spacing:-.02em;color:var(--ink);margin:0;font-size:clamp(1.35rem,2.2vw,1.85rem);font-weight:600;line-height:1.15}.navbar-controls{flex-wrap:wrap;align-items:flex-end;gap:.85rem 1.1rem;display:flex}.field{border:none;flex-direction:column;gap:.3rem;min-width:0;margin:0;padding:0;display:flex}.field-narrow{width:5.5rem}.field-label,.field legend{font-family:var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:0;font-size:.68rem;font-weight:600}.field select,.field input[type=number],.ratio-row input{font-family:var(--sans);color:var(--ink);background:var(--paper);border:1px solid var(--rule);box-sizing:border-box;border-radius:4px;min-height:2.1rem;padding:.4rem .5rem;font-size:.875rem}.field select{cursor:pointer;min-width:11rem;max-width:16rem}.field select:focus-visible,.field input:focus-visible,.ratio-row input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.input-with-unit{align-items:center;gap:.3rem;display:flex}.input-with-unit input{width:100%}.unit{color:var(--muted);flex-shrink:0;font-size:.8rem}.radio-row{align-items:center;gap:.75rem;min-height:2.1rem;display:flex}.radio-row label{color:var(--ink);cursor:pointer;white-space:nowrap;align-items:center;gap:.35rem;font-size:.875rem;display:inline-flex}.radio-row input{accent-color:var(--accent);margin:0}.check-row{cursor:pointer;justify-content:center;align-items:center;min-height:2.1rem;display:inline-flex}.ratio-check .check-row{border:1px solid var(--rule);background:var(--paper);box-sizing:border-box;border-radius:4px;width:3.25rem;padding:0}.ratio-check .check-row input[type=checkbox]{appearance:none;border:1px solid var(--rule);background:var(--paper);width:1rem;height:1rem;min-height:0;accent-color:var(--accent);cursor:pointer;border-radius:2px;place-content:center;margin:0;padding:0;display:grid}.ratio-check .check-row input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}.ratio-check .check-row input[type=checkbox]:checked:after{content:"";border:solid var(--paper);border-width:0 1.5px 1.5px 0;width:.32rem;height:.55rem;transform:rotate(45deg)translate(-.5px,-.5px)}.ratio-check .check-row input[type=checkbox]:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.field-ratios .ratio-row{flex-wrap:wrap;gap:.45rem;display:flex}.ratio-row label{color:var(--muted);flex-direction:column;gap:.2rem;font-size:.68rem;display:flex}.ratio-row input{text-align:center;width:3.25rem;padding:.35rem}.download-btn{min-height:2.1rem;font-family:var(--sans);letter-spacing:.02em;color:var(--paper);background:var(--accent);border:1px solid color-mix(in srgb, var(--accent) 80%, var(--ink));cursor:pointer;border-radius:4px;padding:.45rem 1.15rem;font-size:.9rem;font-weight:600;transition:background .15s,transform .1s}.download-btn:hover{background:color-mix(in srgb, var(--accent) 88%, var(--ink))}.download-btn:active{transform:translateY(1px)}.download-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.workspace{background:radial-gradient(ellipse 80% 50% at 50% 0%, color-mix(in srgb, var(--accent) 8%, transparent), transparent 70%), var(--paper-deep);flex:1;place-items:center;min-height:0;padding:1rem;display:grid}.worksheet-frame{place-items:center;width:100%;height:100%;min-height:0;display:grid}.calligraphy-worksheet{width:100%;max-width:100%;height:100%;max-height:100%;box-shadow:0 1px 2px color-mix(in srgb, var(--ink) 12%, transparent), 0 12px 28px color-mix(in srgb, var(--ink) 14%, transparent);display:block}@media (width<=720px){.navbar-controls{gap:.75rem}.field select{min-width:100%;max-width:none}.field{flex:calc(50% - .5rem)}.field-ratios{flex:100%}}