:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:#20313d;background:#f2eee5;font-synthesis:none;color-scheme:light}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 95% 0,#e2e9e3 0,transparent 50%);min-height:100vh}button,input,select,textarea{font:inherit}button,select{padding:10px 14px;border:1px solid #cdd0c8;border-radius:7px;background:#faf8f2;color:#243a46;cursor:pointer;min-height:40px}button:hover,select:hover{border-color:#405f66;background:#fff}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,canvas:focus-visible{outline:3px solid #ed7149;outline-offset:3px}button[aria-pressed=true]{background:#243e4a;color:#fff;border-color:#243e4a}button.primary{background:#e4613c;border-color:#e4613c;color:#fff;font-weight:700;padding:12px 27px}a{color:inherit}header{max-width:1440px;margin:auto;display:flex;align-items:center;gap:24px;padding:25px 38px;border-bottom:1px solid #ced0c5}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:17px;letter-spacing:3px;font-weight:800}.brand svg{width:34px;height:30px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linejoin:round}.brand-dot{width:6px;height:6px;border-radius:50%;background:#e4613c;align-self:flex-start;margin-top:6px}nav{margin-left:auto;display:flex;gap:15px}nav a{text-decoration:none;font-size:11px;color:#74817d;padding:7px 0}nav a[aria-current=page]{color:#243a46;border-bottom:2px solid #e4613c}.rank-link{font-size:11px;text-decoration:none;border-left:1px solid #c3ccc5;padding-left:24px}main{max-width:1360px;padding:0 38px;margin:auto}.hero{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;padding:38px 0 28px}.eyebrow{font-family:ui-monospace,monospace;font-size:10px;letter-spacing:2px;color:#6b7a72;margin:0 0 12px}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(32px,4.5vw,58px);line-height:1.08;letter-spacing:-2px;margin:0}.intro{font-size:13px;line-height:1.8;color:#667871;max-width:660px;margin:14px 0 0}.hero-actions{display:flex;gap:9px;flex-shrink:0}.hero-actions button{background:transparent;font-size:12px}.studio{border:1px solid #bfc9bf;border-radius:12px;overflow:hidden;background:#fcfaf3;box-shadow:0 16px 50px #223c3310}.studio-top{display:flex;align-items:center;gap:12px;padding:13px 19px;border-bottom:1px solid #dbe0d5;background:#e9eee5}.studio-top label{font-size:10px;text-transform:uppercase;letter-spacing:1px}.studio-top select{border:0;background:transparent;padding:3px 24px 3px 2px;font-size:13px;min-height:28px}.autosave{margin-left:auto;font-size:10px;color:#6d7f72}#day-label{font:10px ui-monospace,monospace;color:#5c7367}.tools{display:flex;align-items:center;gap:14px;padding:10px 14px;border-bottom:1px solid #dce0d5;flex-wrap:wrap}.tool-group{display:flex;gap:4px}.tools button{padding:8px 10px;font-size:11px;border-color:transparent;background:transparent}.tools button[aria-pressed=true]{background:#243e4a;color:white}.tool-group+.tool-group{border-left:1px solid #dce0d5;padding-left:14px}.view-tools{margin-left:auto;display:flex;gap:2px}.view-tools button{min-width:34px}.canvas-wrap{position:relative;aspect-ratio:1200/650;background:#faf9f1;isolation:isolate}.canvas-wrap:fullscreen{width:100vw;height:100vh;aspect-ratio:auto;background:#faf9f1}#board{width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}.canvas-badge{position:absolute;right:22px;bottom:18px;pointer-events:none;font:8px ui-monospace,monospace;letter-spacing:2px;color:#94a393}.canvas-badge span{color:#e4613c;margin-left:8px}.ride-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;border-top:1px solid #dce0d5;background:#f5f5eb}.ride-controls{display:flex;gap:7px;flex-wrap:wrap}.ride-controls button{font-size:11px}.stats{display:flex;gap:28px}.stats div{display:flex;flex-direction:column;gap:5px;min-width:68px}.stats span{font-size:9px;text-transform:uppercase;letter-spacing:.8px;color:#748274}.stats strong{font:17px ui-monospace,monospace;font-variant-numeric:tabular-nums;font-weight:500}.studio-foot{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:9px 18px;border-top:1px solid #dce0d5}.studio-foot p{font-size:11px;line-height:1.6;color:#62776c}.studio-foot div{display:flex;gap:8px;flex-shrink:0}.studio-foot button{font-size:10px;border:0;background:transparent}.mobile-note{display:none}.instructions{margin:22px 0;color:#64736c;font-size:12px;line-height:1.8;max-width:860px}.instructions summary{cursor:pointer;display:list-item}.instructions p{margin:12px 0}.community{padding:36px 0;margin-top:35px;border-top:1px solid #cbd2c8}.section-title{display:flex;align-items:center;justify-content:space-between;gap:16px}.section-title h2{font:34px Georgia;margin:0}.section-title select,.section-title button{font-size:12px}.rank-rules{font-size:12px;color:#667a6b;line-height:1.8;max-width:800px}#rank-status{font-size:13px;color:#74816f}#rank-list{list-style:none;margin:20px 0;padding:0;max-width:780px}#rank-list li{display:flex;justify-content:space-between;padding:13px 6px;border-bottom:1px solid #d6d9ce;font-size:13px}#rank-list strong{font-family:ui-monospace,monospace;color:#d45936}footer{padding:22px 0 30px;border-top:1px solid #cbd2c8;display:flex;justify-content:space-between;gap:20px;font-size:10px;color:#728270}footer a{text-decoration:none}dialog{background:#faf8ef;color:#243a46;border:1px solid #c9d1c1;border-radius:14px;padding:30px;max-width:470px;width:calc(100% - 30px);max-height:90vh;overflow:auto;box-shadow:0 30px 120px #142d4e55;text-align:center}dialog::backdrop{background:#203b4699;backdrop-filter:blur(4px)}dialog h2{font:32px/1.2 Georgia;margin:14px 0}dialog p{font-size:13px;line-height:1.8;color:#62766b;white-space:pre-line}#dialog-actions,.share-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:center;margin:20px 0 0}.share-actions a{font-size:13px;padding:12px}dialog button{font-size:12px}#score-form{border-top:1px solid #d6dccd;padding-top:18px;margin-top:20px}#score-form label{display:block;text-align:left;font-size:12px}#score-name{width:100%;padding:11px;border:1px solid #bccab7;border-radius:6px;background:#fff;margin-top:7px}#name-hint{font-size:10px}#share-text{height:155px;width:100%;padding:12px;font-size:13px;line-height:1.7;border:1px solid #bccab7;border-radius:5px;resize:vertical}#share-note,#share-local{font-size:11px}[hidden]{display:none!important}@media(max-width:900px){header{padding:20px;gap:18px}main{padding:0 20px}.hero{align-items:flex-start}.hero-actions{flex-direction:column}.stats{gap:12px}.tools{gap:7px}.tool-group+.tool-group{padding-left:7px}.ride-bar{flex-wrap:wrap}.stats{margin-left:auto}.autosave{display:none}.studio-foot{flex-wrap:wrap;gap:0}.studio-foot div{margin-left:auto}}@media(max-width:600px){header{padding:15px 14px;flex-wrap:wrap;gap:10px}.brand{font-size:14px;letter-spacing:2px}.brand svg{width:25px}nav{order:3;width:100%;justify-content:center;gap:22px}.rank-link{margin-left:auto;font-size:10px;padding-left:8px}main{padding:0 10px}.hero{padding:24px 5px 22px;gap:10px}h1{font-size:35px;letter-spacing:-1px}.intro{font-size:11px}.hero-actions button{font-size:10px;padding:7px 9px;min-height:33px}.eyebrow{font-size:9px}.studio-top{padding:9px;gap:6px}.studio-top label{display:none}.studio-top select{font-size:12px}.tools{padding:6px;gap:4px}.tools button{font-size:10px;padding:7px 8px;min-height:37px}.tool-group+.tool-group{border:0;padding:0}.view-tools{margin-left:0}.canvas-wrap{aspect-ratio:1200/820}.ride-bar{padding:10px 8px;gap:14px}.ride-controls{gap:4px;width:100%}.ride-controls button{padding:9px;font-size:10px;flex:1}.ride-controls button.primary{padding:10px 18px}.stats{margin:0;justify-content:space-between;width:100%}.stats strong{font-size:15px}.stats span{font-size:8px}.studio-foot{padding:4px 10px}.studio-foot p{font-size:10px}.studio-foot div{margin-left:0}.mobile-note{display:block;font-size:10px;color:#7c8775;line-height:1.7;margin:13px 5px}.section-title{align-items:flex-start}.section-title h2{font-size:28px}.section-title>div:last-child{display:flex;flex-direction:column;gap:5px}.community{padding:24px 7px;margin-top:20px}.rank-rules{font-size:11px}footer{font-size:9px;padding-left:5px;padding-right:5px}.instructions{font-size:11px;margin:16px 6px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
