:root{color-scheme:dark;--bg:#171a16;--panel:#22261f;--ink:#f1f1e7;--muted:#a4ab9c;--gold:#ecc37a;--line:#393e33}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;font-size:16px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,.board:focus-visible{outline:3px solid var(--gold);outline-offset:5px}main{max-width:1440px;padding:0 56px;margin:auto}header{display:flex;align-items:center;justify-content:space-between;height:104px;border-bottom:1px solid var(--line)}.brand{text-decoration:none;font:700 29px 'Space Grotesk',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;letter-spacing:-1.5px}.mark{display:inline-block;color:var(--gold);font-size:33px;letter-spacing:-5px;margin-right:16px;transform:rotate(-13deg)}.brand-dot{color:var(--gold)}.edition,.eyebrow{font-size:12px;letter-spacing:2px;font-weight:600}.edition{color:var(--muted)}.quiet{background:none;border:0;color:var(--muted);font-size:14px;padding:8px 0}.quiet span{border:1px solid var(--line);border-radius:50%;padding:2px 7px;margin-left:10px}.intro{display:flex;align-items:center;justify-content:space-between;margin:40px 0 32px}.eyebrow{color:var(--gold);margin:0 0 12px}h1{font:500 clamp(30px,3.5vw,48px)/1.1 'Space Grotesk',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;letter-spacing:-2px;margin:0}.intro>p{font-size:15px;line-height:1.7;color:var(--muted);margin:0}.game-layout{display:grid;grid-template-columns:minmax(0,720px) 340px;justify-content:center;gap:32px}.scene-top{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;letter-spacing:1px;margin-bottom:14px}.scene-top span:first-child{color:var(--ink)}.board{position:relative;aspect-ratio:1;overflow:hidden;border-radius:8px;background:#2f2f27;touch-action:none;user-select:none;cursor:crosshair}.board svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.guide{stroke:#fff5d2;stroke-opacity:.6;stroke-width:1.5;stroke-dasharray:4 7}.handle-ring{fill:#24251aaa;stroke:var(--gold);stroke-width:2}.handle-dot{fill:var(--gold)}.handle-arrow{fill:none;stroke:var(--gold);stroke-width:2}#cut{stroke:#f7d39b;stroke-width:2;fill:none;stroke-linecap:round}#cutShadow{stroke:#2b1408;stroke-width:8;fill:none;stroke-linecap:round}.board-label,.board-scale{position:absolute;bottom:20px;font-size:11px;letter-spacing:1.5px;color:#fff4dc;text-shadow:0 1px 6px #000}.board-label{left:22px}.board-scale{right:22px;letter-spacing:.3px;font-size:12px}.finish-stamp{position:absolute;top:20px;right:20px;padding:10px 12px;border:1px solid #ecc37a88;background:#171a16df;color:var(--gold);font-size:12px;letter-spacing:1px}.under-board{display:flex;align-items:center;gap:16px;justify-content:space-between;color:var(--muted);font-size:14px;min-height:56px}.under-board p{margin:12px 0;line-height:1.5}.under-board span{white-space:nowrap;font:14px monospace}.progress{height:3px;background:var(--line);border-radius:3px}.progress span{display:block;height:3px;background:var(--gold);width:0;transition:width .1s}aside{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:23px}.measurement-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.measurement-heading .eyebrow{margin:0;font-size:11px;letter-spacing:1.4px}.measurement-heading>span:last-child{font-size:11px;color:var(--muted);letter-spacing:1px}.lcd{background:#c5cbb4;color:#293326;border:5px solid #171b16;border-radius:5px;padding:15px 15px 12px;box-shadow:inset 0 2px 5px #0003}.lcd-label{font:10px monospace;letter-spacing:1px}.lcd>div{display:flex;align-items:baseline;justify-content:flex-end;gap:9px;margin:11px 0 9px}.lcd strong{font:52px/1 monospace;letter-spacing:-3px}.lcd>div>span{font:18px monospace}.lcd p{font:11px/1.4 monospace;margin:0;min-height:30px}.result-heading{display:flex;align-items:center;justify-content:space-between;margin-top:24px}.result-heading h2{font-size:14px;font-weight:500;margin:0}.result-heading>span{font-size:10px;color:var(--muted);letter-spacing:1px}.measurements{list-style:none;padding:0;margin:12px 0}.measurements li{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}.measurements li>span{color:var(--muted)}.measurements b{font:11px monospace;display:inline-block;margin-right:10px;color:var(--gold)}.measurements strong{font:14px monospace;font-weight:400}.result-note{font-size:13px;color:var(--muted);line-height:1.5;min-height:43px;margin:14px 0}.primary{width:100%;background:var(--gold);color:#262719;border:0;border-radius:4px;padding:14px 17px;text-align:left;font-size:15px;font-weight:600;display:flex;justify-content:space-between}.primary:hover{background:#ffda96}.session-best{font-size:11px;display:flex;justify-content:space-between;gap:10px;margin-top:18px;color:var(--muted)}.session-best strong{color:var(--ink);white-space:nowrap}footer{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);margin-top:36px;padding:22px 0;color:var(--muted);font-size:12px}footer>span:first-child{font-size:14px;color:var(--ink)}footer a{text-underline-offset:3px}#help{background:var(--panel);border:1px solid var(--line);padding:18px;margin-bottom:24px;line-height:1.7;color:var(--muted);font-size:15px}#measureDots text{fill:#fce0a7;font:14px monospace}#measureDots circle{fill:var(--gold);stroke:#352615;stroke-width:2}@media(min-width:1350px){.game-layout{grid-template-columns:minmax(0,760px) 350px}aside{padding:26px}.lcd strong{font-size:60px}}@media(max-width:1000px){main{padding:0 24px}.game-layout{grid-template-columns:minmax(0,1fr) 285px;gap:20px;justify-content:stretch}aside{padding:18px}.intro>p{font-size:13px}.board-label{display:none}footer{flex-wrap:wrap}.edition{display:none}}@media(max-width:760px){main{padding:0 18px}header{height:78px}.brand{font-size:25px}.intro{margin:28px 0 25px;display:block}.intro>p{margin-top:14px;font-size:14px}.intro>p br{display:none}.intro>p br:after{content:' '}.game-layout{grid-template-columns:1fr}.board{aspect-ratio:1}.scene-top{font-size:10px}.board-scale{bottom:13px;right:13px;font-size:11px}aside{padding:22px}.lcd>div{justify-content:center}.lcd strong{font-size:62px}.lcd p{text-align:center;min-height:16px}.measurements li{font-size:14px}.session-best{font-size:12px}.result-note{min-height:0}.measurement-heading .eyebrow,.measurement-heading>span:last-child{font-size:12px}.result-heading>span{font-size:12px}footer{margin-top:25px;gap:12px;padding-bottom:20px}footer>span:nth-child(2){order:3;width:100%;font-size:11px}h1{letter-spacing:-1px}.finish-stamp{font-size:10px;right:12px;top:12px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* leaderboard and 28-day performance */
.performance,.leaderboard{border-top:1px solid var(--line);margin-top:42px;padding-top:28px}.section-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:20px}.section-head h2{font:500 24px 'Space Grotesk',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;margin:0;letter-spacing:-.7px}.streak{color:var(--muted);font:11px monospace;letter-spacing:1px}.performance-grid{display:grid;grid-template-columns:1fr 290px;gap:28px}.chart{height:126px;display:grid;grid-template-columns:repeat(28,1fr);align-items:end;gap:5px;padding:8px 0;border-bottom:1px solid var(--line)}.chart i{display:block;background:#59604f;border-radius:3px 3px 0 0;min-height:5px;position:relative}.chart i.active{background:var(--gold)}.chart i::after{content:attr(data-day);position:absolute;top:calc(100% + 8px);font:9px monospace;color:var(--muted);left:50%;transform:translateX(-50%)}.performance-copy{border:1px solid var(--line);border-radius:6px;padding:17px;background:#1d201b}.performance-copy>strong{display:block;color:var(--gold);font:36px monospace}.performance-copy>span{font-size:12px;color:var(--muted)}.performance-copy p{font-size:13px;line-height:1.5;color:var(--muted);margin:15px 0}.metric-row{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:9px 0;font-size:13px}.metric-row b{font-family:monospace;color:var(--ink)}.leaderboard-head,.leaderboard-list li{display:grid;grid-template-columns:1fr 130px;gap:20px}.leaderboard-head{font:10px monospace;color:var(--muted);letter-spacing:1px;padding-bottom:8px}.leaderboard-list{list-style:none;padding:0;margin:0}.leaderboard-list li{padding:12px 0;border-top:1px solid var(--line);font-size:14px}.leaderboard-list b{display:inline-block;width:30px;color:var(--gold);font-family:monospace}.leaderboard-list strong{font:14px monospace}.leaderboard-list small{color:var(--muted);font-size:11px;margin-left:8px}.leaderboard-note{font-size:12px;color:var(--muted);margin:16px 0 0}@media(max-width:760px){.performance-grid{grid-template-columns:1fr}.chart{height:112px}.section-head h2{font-size:20px}.leaderboard-head,.leaderboard-list li{grid-template-columns:1fr 112px}}
/* named cutter */
.name-field{display:block;margin:0 0 16px}.name-field span{display:block;color:var(--muted);font:10px monospace;letter-spacing:1px;margin:0 0 7px}.name-field input{width:100%;border:1px solid var(--line);border-radius:4px;background:#171a16;color:var(--ink);padding:10px 11px;font:14px 'DM Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif}.name-field input:focus{outline:2px solid var(--gold);outline-offset:2px}.name-field input::placeholder{color:#6f766b}
.board.celebrate{box-shadow:0 0 0 3px var(--gold),0 0 44px #ecc37a55}.board.celebrate .finish-stamp{animation:stamp-pop .6s cubic-bezier(.2,1.6,.4,1)}#confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:5}#confetti i{position:absolute;top:-14px;left:var(--x);width:8px;height:14px;background:hsl(var(--hue),85%,65%);transform:rotate(18deg);animation:confetti-fall 3.8s var(--delay) ease-out forwards}@keyframes confetti-fall{0%{opacity:0;transform:translate3d(0,-20px,0) rotate(0)}12%{opacity:1}100%{opacity:0;transform:translate3d(var(--drift),680px,0) rotate(720deg)}}@keyframes stamp-pop{0%{transform:scale(.65);opacity:0}100%{transform:scale(1);opacity:1}}@media(prefers-reduced-motion:reduce){#confetti{display:none}.board.celebrate{box-shadow:0 0 0 3px var(--gold)}}
.board.finale{animation:loaf-finale 1.2s cubic-bezier(.2,.9,.3,1)}.board.finale:after{content:'THE END OF THE LOAF';position:absolute;inset:0;display:grid;place-items:center;background:#171a16bb;color:var(--gold);font:700 clamp(22px,4vw,54px) 'Space Grotesk',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;letter-spacing:3px;text-align:center;animation:finale-curtain 1.2s ease-out}.loaf-summary{position:fixed;z-index:50;inset:0;background:#0e100ddd;display:grid;place-items:center;padding:22px;animation:summary-in .35s ease-out}.loaf-summary-card{width:min(510px,100%);background:#262b22;border:2px solid var(--gold);box-shadow:0 18px 70px #000a;border-radius:10px;padding:30px;text-align:center}.summary-kicker{font:11px monospace;letter-spacing:2px;color:var(--gold)}.summary-confetti{font-size:30px;color:var(--gold);letter-spacing:14px;margin:15px 0 3px}.loaf-summary h2{font:500 clamp(30px,5vw,46px) 'Space Grotesk',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;margin:0;letter-spacing:-1px}.summary-joke{font-size:15px;color:var(--muted);margin:12px auto 24px;max-width:350px;line-height:1.5}.summary-stats{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;margin-bottom:20px;gap:10px}.summary-stats div+div{border-left:1px solid var(--line)}.summary-stats strong{display:block;color:var(--gold);font:26px monospace}.summary-stats span{display:block;color:var(--muted);font-size:11px;margin-top:5px}.summary-entry{font-size:14px;line-height:1.6;color:var(--ink);margin:0 0 20px}.summary-entry b{color:var(--gold)}.loaf-summary .primary{text-align:center;justify-content:center;gap:12px}@keyframes loaf-finale{0%{transform:translateY(0) scale(1)}45%{transform:translateY(18px) scale(1.02)}100%{transform:translateY(0) scale(1)}}@keyframes finale-curtain{0%{opacity:0;transform:translateY(-100%)}100%{opacity:1;transform:translateY(0)}}@keyframes summary-in{0%{opacity:0}.100%{opacity:1}}@media(prefers-reduced-motion:reduce){.board.finale,.loaf-summary{animation:none}.board.finale:after{animation:none}}
@keyframes summary-in{0%{opacity:0}100%{opacity:1}}
.share-card-wrap{margin:10px auto 18px;background:#171a16;border:1px solid var(--line);border-radius:6px;padding:8px;max-width:100%;overflow:hidden}.share-card-canvas{display:block;width:100%;height:auto;border-radius:3px}.share-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:8px}.share-actions .secondary{background:transparent;color:var(--ink);border:1px solid var(--line);border-radius:4px;padding:14px 17px;font-size:15px;font-weight:600}.share-actions .secondary:hover{border-color:var(--gold);color:var(--gold)}.share-status{min-height:22px;color:var(--gold);font-size:12px;margin:4px 0 12px}@media(max-width:520px){.loaf-summary-card{padding:20px}.share-actions{grid-template-columns:1fr}.loaf-summary h2{font-size:32px}}

/* cut-through: the slice really comes off the loaf */
#crumb{display:none;fill:none;stroke:#2a1a0d;stroke-opacity:.92;stroke-width:42;stroke-linecap:round;stroke-linejoin:round}
#crumbEdge{display:none;fill:none;stroke:#f0dcb6;stroke-opacity:.75;stroke-width:7;stroke-linecap:round}
.pieces{display:none}
.board.sliced #crumb,.board.sliced #crumbEdge,.board.sliced .pieces{display:block}
.board.sliced #guide{opacity:0}
#sliceShift{transform-box:fill-box;transform-origin:50% 50%;transform:translate(0,0);transition:transform .75s cubic-bezier(.22,.9,.25,1)}
.board.sliced #sliceShift{transform:translate(-27px,5px) rotate(-.7deg)}
.board.sliced #pieceSlice{filter:drop-shadow(7px 5px 9px rgba(0,0,0,.55))}

/* anonymous cutter name */
.name-field{display:block;margin:0 0 18px}
.name-caption{display:block;color:var(--muted);font:10px monospace;letter-spacing:1px;margin:0 0 8px}
.name-row{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--line);border-radius:4px;background:#171a16;padding:9px 10px}
.name-row b{font:15px 'Space Grotesk',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:var(--gold);letter-spacing:-.2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.name-row button{background:none;border:0;color:var(--muted);font:11px monospace;white-space:nowrap;padding:2px 0}
.name-row button:hover{color:var(--gold)}
.name-field small{display:block;color:#6f766b;font-size:11px;margin-top:7px}

/* leaderboard, Urban-Grow style */
.board-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:#1d201b;border:1px solid var(--line);border-radius:6px;padding:5px;margin-bottom:16px}
.board-tabs button{background:none;border:0;border-radius:4px;color:var(--muted);font-size:13px;padding:9px 6px}
.board-tabs button.active{background:var(--panel);color:var(--ink);box-shadow:0 1px 3px #0004}
.board-hint{background:#1d201b;border:1px solid var(--line);border-radius:6px;padding:12px 14px;margin:0 0 14px;font-size:13px;line-height:1.5;color:var(--muted)}
.board-count{font:11px monospace;letter-spacing:.5px;color:var(--muted);margin:0 0 6px}
.leaderboard-list li{display:grid;grid-template-columns:34px 1fr 120px;gap:14px;align-items:center;padding:13px 0;border-top:1px solid var(--line)}
.leaderboard-list li.empty{display:block;color:var(--muted);font-size:13px;padding:18px 0}
.leaderboard-list .rank{font:13px monospace;color:var(--gold);text-align:center}
.leaderboard-list .who{min-width:0}
.leaderboard-list .who b{display:block;width:auto;font:15px 'DM Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.leaderboard-list .who em{font-style:normal;font:10px monospace;color:var(--gold);border:1px solid #ecc37a55;border-radius:3px;padding:1px 5px;margin-left:6px;vertical-align:1px}
.leaderboard-list .who small{display:block;margin:3px 0 0;color:var(--muted);font-size:11.5px}
.leaderboard-list strong{font:16px monospace;text-align:right}
.leaderboard-list li.mine{background:#1d201b;border-radius:6px}
@media(max-width:760px){.leaderboard-list li{grid-template-columns:28px 1fr 96px;gap:10px}.leaderboard-list strong{font-size:14px}}

/* bread change: the finished loaf lifts off, the next one drops in */
#stage{transform-box:fill-box;transform-origin:50% 50%}
.board.swap-out #stage{transform:translateY(-9%) scale(.88) rotate(-2deg);opacity:0;transition:transform .46s cubic-bezier(.5,0,.9,.3),opacity .46s ease-in}
.board.swap-prep #stage{transform:translateY(12%) scale(.9) rotate(1.5deg);opacity:0;transition:none}
.board.swap-in #stage{transform:none;opacity:1;transition:transform .66s cubic-bezier(.18,.9,.25,1.06),opacity .42s ease-out}
.board.swap-out,.board.swap-prep{cursor:default}
.board.swap-in:after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 46%,#ecc37a55,transparent 62%);animation:fresh-flash .66s ease-out forwards}
@keyframes fresh-flash{0%{opacity:.9}100%{opacity:0}}
.board.swap-out #handle,.board.swap-prep #handle,.board.swap-in #handle,
.board.swap-out #guide,.board.swap-prep #guide,.board.swap-in #guide{opacity:0;transition:opacity .2s}

/* countdown to the next loaf */
.loaf-summary #newBread{justify-content:center;gap:6px}
.loaf-summary #countdown{display:inline-block;min-width:1.1em;color:#2b2c1c;font-family:monospace}
@media(prefers-reduced-motion:reduce){
  .board.swap-out #stage,.board.swap-prep #stage,.board.swap-in #stage{transition:none;transform:none;opacity:1}
  .board.swap-in:after{display:none}
}
.name-row{align-items:flex-start}
.name-row b{white-space:normal;overflow:visible;text-overflow:clip;font-size:14px;line-height:1.3;padding-right:4px}
.name-row button{flex:0 0 auto;padding-top:2px}