:root{color-scheme:light;--ink:#193f39;--muted:#60746b;--paper:#f5f2e9;--green:#174c45;--gold:#d3a74f;--line:#dcded1}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,select{font:inherit;color:inherit}button{cursor:pointer;border:1px solid #c7cec0;border-radius:9px;background:#fcfcf6;padding:10px 15px;font-size:13px;font-weight:650;transition:background .15s,transform .15s}button:hover{background:#e5ebdc}button:active{transform:translateY(1px)}button:focus-visible,select:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #bb762a;outline-offset:3px}header{height:95px;max-width:1320px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 44px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font-size:17px;font-weight:800;letter-spacing:2px}.brandmark{font-size:43px;font-weight:400;color:#a37335}.brand small{display:block;font-size:9px;font-weight:550;letter-spacing:3px;margin-top:5px}.header-note{font-family:Georgia,serif;font-style:italic;color:var(--muted);font-size:16px}main{max-width:1320px;margin:35px auto 25px;padding:0 44px;display:grid;grid-template-columns:310px minmax(0,1fr);gap:48px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:750;color:#7b8069}h1{font:400 43px/1.1 Georgia,serif;letter-spacing:-1.7px;margin:18px 0}h1 em{color:#9c6a39;font-weight:400}.intro{font-size:13px;line-height:1.8;color:var(--muted);margin:20px 0 28px}.collection-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.collection-label h2{font-size:13px;margin:0}.collection-label span{font-size:11px;color:var(--muted)}.patterns{display:grid;grid-template-columns:1fr 1fr;gap:12px}.pattern{text-align:left;padding:5px;background:#fffdf7;border-radius:12px;border:2px solid transparent;box-shadow:0 2px 8px #193f3907;overflow:hidden}.pattern[aria-pressed=true]{border-color:var(--green)}.pattern img{width:100%;aspect-ratio:1.35;object-fit:cover;border-radius:7px;display:block}.pattern span{font-size:12px;display:block;padding:7px 4px 3px}.pattern small{font-size:9px;color:var(--muted);display:block;padding:0 4px 5px}.project{margin:20px 0}.project label{display:block;font-size:11px;margin-bottom:8px;font-weight:700}select{border:1px solid #c7cec0;background:#fffdf7;border-radius:8px;padding:10px;font-size:12px;max-width:100%}#study{width:100%}#best{font-size:11px;color:var(--muted);margin-top:10px}details{border-top:1px solid var(--line);font-size:11px;line-height:1.7;padding-top:15px;color:var(--muted)}summary{cursor:pointer;font-weight:650}a{color:inherit}.workstation{background:#fffdf7;border:1px solid #d9ddce;border-radius:19px;padding:22px;box-shadow:0 16px 40px #28433208;align-self:start}.station-heading{display:flex;justify-content:space-between;align-items:center;gap:10px}.station-heading h2{font:400 24px Georgia,serif;margin:7px 0 0}.stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;margin:22px 0 17px}.stats>div{position:relative}.stats span{display:block;font-size:8px;letter-spacing:1.4px;color:var(--muted);font-weight:750}.stats strong{display:block;font:400 23px Georgia,serif;margin:7px 0}.stats small{font-size:9px;color:var(--muted)}.meter{height:3px;background:#e7e9df;overflow:hidden;border-radius:3px;margin-top:10px}.meter i{height:100%;background:#487369;display:block;width:0}.strain i{background:#c59742}.canvas-wrap{position:relative;overflow:hidden;border-radius:11px;background:#dbe1d3}canvas{width:100%;height:auto;display:block;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}.canvas-top{position:absolute;left:17px;right:17px;top:16px;display:flex;justify-content:space-between;pointer-events:none;color:#53685e;font-size:8px;font-weight:750;letter-spacing:1.3px}.canvas-top span{background:#f6f7eddd;padding:7px 9px;border-radius:5px}.guide{position:absolute;bottom:17px;left:15px;right:15px;text-align:center;pointer-events:none;font-size:11px;color:#fff;background:#173e36dd;border-radius:20px;padding:9px 12px;max-width:360px;margin:auto}.controls{display:flex;align-items:center;gap:8px;margin-top:17px;flex-wrap:wrap}.primary{background:var(--green);border-color:var(--green);color:#fff}.primary:hover{background:#286257}.primary:active,#pedal.pressed{background:#927137}.pace{display:flex;gap:8px;align-items:center;margin-right:auto}.pace label{font-size:11px;font-weight:650}.pace select{padding:8px}.controls #left,.controls #right{font-size:18px;min-width:42px;padding:6px 10px;touch-action:none}.controls #pedal{touch-action:none;user-select:none;min-width:116px}.instruction{font-size:10px;line-height:1.9;text-align:center;margin:16px 0 0;color:var(--muted)}.instruction span{font-size:10px}kbd{font:inherit;background:#edf0e5;border:1px solid #d8dfd2;border-radius:4px;padding:1px 5px}#status{text-align:center;color:#8a6632;font-size:11px;margin:9px 0 0;min-height:15px}.result{position:absolute;inset:60px 25px;align-content:center;text-align:center;padding:30px;background:#fffdf5f5;box-shadow:0 8px 28px #193f3933;border-radius:14px}.result h2{font:400 36px Georgia,serif;line-height:1.1;margin:18px 0}.result p{font-size:13px;line-height:1.7;color:var(--muted)}#result-stars{color:#b98731;font-size:31px;letter-spacing:5px}.result-actions{display:flex;gap:10px;justify-content:center;margin-top:22px}footer{max-width:1232px;margin:26px auto;padding:0 0 25px;display:flex;justify-content:space-between;color:#7b8069;font-size:9px;letter-spacing:1.5px}footer span{letter-spacing:0}dialog{max-width:520px;width:calc(100% - 36px);border:1px solid #ced6c6;border-radius:18px;background:#fffdf5;color:var(--ink);padding:35px;box-shadow:0 20px 80px #0004}dialog::backdrop{background:#163a3366;backdrop-filter:blur(4px)}dialog h2{font:400 32px Georgia,serif}dialog li,dialog p{font-size:13px;line-height:1.7}dialog li{padding:0 0 14px 5px}dialog ol{padding-left:18px}#close-help{float:right;border:0;font-size:23px;background:none;padding:0 5px}[hidden]{display:none!important}@media(min-width:1300px){main{grid-template-columns:335px minmax(0,1fr);gap:68px}}@media(max-width:900px){header{padding:0 24px;height:78px}.header-note{display:none}main{padding:0 24px;gap:25px;grid-template-columns:240px minmax(0,1fr)}h1{font-size:35px}.workstation{padding:16px}.station-heading h2{font-size:20px}.station-heading button{font-size:10px;padding:8px}.stats{gap:10px}footer{padding:0 24px 20px}.controls{gap:5px}.pace{width:100%;margin-bottom:4px}.result{inset:35px 12px;padding:18px}.result h2{font-size:27px}.result-actions{flex-wrap:wrap}}@media(max-width:680px){header{padding:0 18px;height:70px}.brand{font-size:13px}.brandmark{font-size:33px}.brand small{font-size:7px}header button{font-size:11px;padding:8px 10px}main{display:flex;flex-direction:column;padding:0 14px;margin:24px auto;gap:20px}aside>.eyebrow,h1,.intro{display:none}.patterns{grid-template-columns:repeat(4,1fr);gap:6px}.pattern{padding:3px;border-radius:8px}.pattern img{aspect-ratio:1.15}.pattern span{font-size:10px;padding:5px 2px}.pattern small{display:none}.collection-label{margin:0 0 9px}.project{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:12px 0 0}.project label{margin:0;font-size:10px}#study{width:auto;flex:1;font-size:11px;padding:8px}#best{width:100%;margin:0;font-size:10px}details{display:none}.workstation{padding:13px;width:100%;border-radius:13px}.stats{margin:16px 0 13px}.stats strong{font-size:21px}.stats span{font-size:7px}.canvas-top{top:9px;left:9px;right:9px;font-size:6px;letter-spacing:.6px}.canvas-top span{padding:5px}.guide{bottom:8px;font-size:9px;padding:7px}.pace{width:auto;margin:0 auto 0 0}.pace label{display:none}.pace select{font-size:10px;padding:8px}.controls #pedal{min-width:98px;font-size:11px;padding:10px}.controls #left,.controls #right{min-width:34px}.instruction{font-size:9px}.instruction span{font-size:9px}.result{inset:32px 12px;padding:14px}.result h2{font-size:24px;margin:10px 0}.result p{font-size:11px;margin:7px 0}.result-actions{margin-top:12px;gap:6px}.result-actions button{font-size:10px;padding:8px}#result-stars{font-size:25px}footer{font-size:7px;letter-spacing:.7px;gap:20px;padding:0 18px 15px}.station-heading h2{font-size:21px}}
