:root{color-scheme:light;--bg:#f4f5f8;--paper:#fff;--ink:#20232d;--muted:#6b7180;--blue:#3168e8;--line:#e6e8ee;--font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:1rem/1.5 var(--font);-webkit-font-smoothing:antialiased}button,input{font:inherit;color:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer;border:0;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,.board-viewport:focus-visible{outline:3px solid #3168e880;outline-offset:4px}[hidden]{display:none!important}.page{width:min(1120px,calc(100% - 64px));margin:auto}.topbar{display:flex;justify-content:space-between;align-items:center;height:86px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;font-size:1.375rem;font-weight:650;letter-spacing:-.04em}.notes-link{display:flex;align-items:center;gap:10px;font-size:1rem;color:var(--muted)}.notes-link>span{display:grid;place-items:center;min-width:28px;height:28px;padding:0 7px;background:#e8eaf0;border-radius:9px;color:var(--ink);font-variant-numeric:tabular-nums}h1{font-size:clamp(1.5rem,3vw,2rem);font-weight:600;line-height:1.4;letter-spacing:-.035em;margin:36px 0 28px}h2{margin:0;font-size:1.125rem;font-weight:550;letter-spacing:-.02em}.playground{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:22px}.module{border-radius:26px;background:var(--paper);border:1px solid #e8eaf0;overflow:hidden;min-width:0}.module-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:26px 28px 0}.stepper{display:flex;align-items:center;gap:10px}.stepper>button{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;font-size:1.5rem;background:#f0f2f7;color:#747b8b;line-height:1;transition:background .15s,transform .15s}.stepper>button:hover{background:#e3eafa;color:var(--blue)}.stepper>button:active{transform:scale(.88)}.stepper>button:disabled{opacity:.3}.number-field{display:flex;align-items:baseline;gap:3px}.number-field input{font-size:1.75rem;font-weight:550;letter-spacing:-.035em;text-align:center;font-variant-numeric:tabular-nums;border:0;border-bottom:2px solid transparent;background:transparent;width:3ch;min-width:2.2ch;padding:4px 0;border-radius:2px;outline-offset:3px}.number-field input:hover{border-bottom-color:#d9dfeb}.number-field input:focus{border-bottom-color:var(--blue)}.number-field input[aria-invalid="true"]{border-bottom-color:#c03932;color:#c03932}.number-field span{font-size:1rem;color:var(--muted)}.board-viewport{height:346px;padding:24px 26px 26px;display:flex;align-items:center;justify-content:center;overflow:auto;scrollbar-width:thin;scrollbar-color:#c8d2e5 transparent;overscroll-behavior:contain}.board-viewport svg{display:block;width:100%;height:100%;flex-shrink:0;overflow:visible}.board-viewport.is-large{display:block}.board-viewport.is-large svg{height:auto}.board-track{fill:none;stroke:#d6deed;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.board-tile rect{fill:#f6f8fc;stroke:#e0e5ef;stroke-width:1.2;transition:fill .25s,stroke .25s}.board-tile text{fill:#7a8497;font:500 20px var(--font);text-anchor:middle;dominant-baseline:central}.board-tile.visited rect{fill:#e9f0ff;stroke:#b9cef8}.board-tile.visited text{fill:#4573cd}.board-tile.current rect{fill:#e5eeff;stroke:#7fa3f2;stroke-width:1.7}.board-tile.current text{fill:#255ccb;font-weight:650}.board-center{fill:#a5afbf;font:500 22px var(--font);text-anchor:middle}.piece{transition:transform .3s cubic-bezier(.2,.8,.2,1)}.dice-module{background:linear-gradient(155deg,#fff 25%,#f4f7ff)}.dice-stage{height:346px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:8px 20px 18px}.die-button{background:transparent;display:block;width:205px;height:200px;padding:0;transition:transform .3s cubic-bezier(.2,.8,.2,1);filter:drop-shadow(0 20px 14px #2955b425)}.die-button:hover{transform:translateY(-7px) rotate(-5deg)}.die-button:active{transform:scale(.95) rotate(5deg)}.die-button svg{display:block;width:100%;height:100%;overflow:visible}.die-button.is-rolling{animation:toss .45s ease-in-out}.die-button:disabled{cursor:default}.dice-outcomes{display:flex;gap:9px;align-items:center;justify-content:center;flex-wrap:wrap;margin-top:14px;min-height:32px}.outcome{font-size:1rem;color:#697997;min-width:26px;height:29px;text-align:center;line-height:29px;border-radius:7px;transition:background .2s,color .2s}.outcome.active{background:#e0eaff;color:#265dce;font-weight:650}.try-roll{display:flex;align-items:center;gap:9px;font-size:1rem;color:#4773c6;background:transparent;min-height:44px;padding:10px 18px;margin-top:6px;border-radius:10px}.try-roll:hover{background:#e7efff}.try-roll:disabled{opacity:.4}.error{color:#b52d29;font-size:1rem;margin:16px 4px}
.result-module{position:relative;display:flex;align-items:center;justify-content:space-between;gap:32px;padding:30px 36px;margin-top:22px;background:white;border:1px solid #e8eaf0;border-radius:26px;overflow:hidden}.answer-block{min-width:0}.answer-block h2{color:var(--muted);font-size:1rem;font-weight:400}.answer{display:flex;align-items:baseline;gap:12px;margin-top:4px;font-variant-numeric:tabular-nums}.answer output{font-size:clamp(3rem,6vw,4.6rem);font-weight:550;line-height:1.2;letter-spacing:-.055em}.answer>span{font-size:1.125rem;color:var(--muted);white-space:nowrap}#resultStatus{font-size:1rem;color:var(--muted);margin:8px 0 0;min-height:24px}.result-actions{width:255px;flex-shrink:0;display:flex;flex-direction:column;gap:8px}.run-button{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:15px 21px;border-radius:15px;background:var(--blue);box-shadow:0 5px 12px #3168e824;color:white;font-weight:550;font-size:1rem;transition:background .2s,transform .2s}.run-button:hover{background:#2357d2;transform:translateY(-1px)}.run-button:active{transform:scale(.98)}.run-button:disabled{opacity:.45;box-shadow:none;transform:none}.run-arrow{font-size:1.5rem;line-height:1}.save-button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;background:transparent;border-radius:12px;color:#5c6b88;font-size:1rem}.save-button:hover:not(:disabled){background:#f0f4fc;color:var(--blue)}.save-button:disabled{color:#adb3bf}.progress-track{position:absolute;bottom:0;left:0;right:0;height:4px;background:#e9effc}#progressBar{height:100%;width:0;background:var(--blue);transition:width .3s}.result-module.is-running .answer output{color:#8b9cbb}.module.is-running .board-track{stroke:#739aee;stroke-dasharray:8 12;animation:pathTravel 3s linear infinite}.module.is-running .die-button{animation:hoverDice 1.5s ease-in-out infinite}
.distribution{margin-top:18px;border-bottom:1px solid var(--line)}.distribution>summary{display:flex;justify-content:space-between;align-items:center;padding:16px 4px;font-size:1rem;color:var(--muted);list-style:none;cursor:pointer}.distribution>summary>span{font-size:1.5rem}.distribution[open]>summary>span{transform:rotate(45deg)}summary::-webkit-details-marker{display:none}.distribution-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:32px;background:white;border-radius:20px;margin:8px 0 20px;padding:26px}.distribution-grid>section{min-width:0}.distribution-grid h2{font-size:1rem;margin-bottom:20px}.distribution-grid canvas{width:100%;height:230px;display:block}.last-cells{display:grid;gap:12px}.last-cell{display:grid;grid-template-columns:60px minmax(0,1fr) 65px;align-items:center;gap:12px;font-size:1rem;color:var(--muted)}.bar-track{height:9px;background:#edf1f8;border-radius:6px;overflow:hidden}.bar-fill{height:100%;background:#91afe9;border-radius:6px}.last-cell:first-child .bar-fill{background:var(--blue)}
.notes-section{padding-top:36px;scroll-margin-top:24px}.notes-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:0 4px 20px}.notes-head>span{font-size:1rem;color:var(--muted)}.notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.note{position:relative;padding:25px 24px 20px;border-radius:5px 5px 24px 5px;background:#fff7d4;box-shadow:0 3px 5px #34382705,0 10px 24px #34382707;animation:pinNote .35s ease both;min-width:0}.note:nth-child(3n+2){background:#e7efff}.note:nth-child(3n){background:#e6f2eb}.note::before{content:"";position:absolute;width:70px;height:17px;left:calc(50% - 35px);top:-7px;background:#ffffff70;transform:rotate(-3deg);backdrop-filter:blur(2px)}.note-close{position:absolute;right:9px;top:9px;width:36px;height:36px;font-size:1.5rem;color:#79796d;background:transparent;border-radius:50%;line-height:1}.note-close:hover{background:#00000008}.note-config{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-right:18px;font-size:1rem;font-weight:500;color:#62634f}.note:nth-child(3n+2) .note-config{color:#556984}.note:nth-child(3n) .note-config{color:#516e5c}.note-value{font-size:2.75rem;letter-spacing:-.055em;font-weight:550;margin:16px 0 15px;line-height:1.25;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.note-value>span{font-size:1rem;font-weight:400;letter-spacing:0;margin-left:7px;color:#737466}.note-restore{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px 0 0;border-top:1px solid #00000012;background:transparent;font-size:1rem;color:#666a61;min-height:44px}.note-restore:hover{color:var(--ink)}.empty-note{display:flex;align-items:center;justify-content:center;gap:16px;min-height:130px;border:1.5px dashed #d9dde6;border-radius:19px;color:#7c8390}.empty-note p{font-size:1rem;margin:0}.note-status{font-size:1rem;color:var(--muted);margin:14px 4px 0;min-height:0}.note-status:empty{display:none}footer{margin-top:38px;padding:24px 0 30px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px;color:var(--muted);font-size:1rem}
@keyframes toss{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-24px) rotate(-15deg)}65%{transform:translateY(-9px) rotate(14deg)}}@keyframes hoverDice{50%{transform:translateY(-8px) rotate(3deg)}}@keyframes pathTravel{to{stroke-dashoffset:-120}}@keyframes pinNote{from{opacity:0;transform:translateY(-12px) rotate(-2deg)}to{opacity:1;transform:translateY(0) rotate(0)}}
.board-tile text{font-size:24px}
@media(max-width:960px){.page{width:calc(100% - 40px)}.playground{grid-template-columns:1.25fr 1fr;gap:16px}.module-head{padding:22px 20px 0;gap:8px}.stepper{gap:6px}.stepper>button{width:36px;height:36px}.number-field input{font-size:1.6rem}.board-viewport{padding:22px 18px;height:314px}.dice-stage{height:314px}.notes{grid-template-columns:repeat(2,minmax(0,1fr))}.result-module{padding:28px}.die-button{width:190px;height:185px}}
@media(max-width:700px){.page{width:calc(100% - 32px)}.topbar{height:72px}h1{font-size:1.5rem;margin:27px 0 20px}.playground{grid-template-columns:1fr;gap:16px}.module{border-radius:22px}.module-head{padding:22px 22px 0}.stepper{gap:12px}.stepper>button{width:42px;height:42px}.number-field input{font-size:1.75rem}.board-viewport{height:280px;padding:18px 20px 22px}.dice-module .module-head{padding-bottom:0}.dice-stage{height:230px;padding:0 20px 14px;display:grid;grid-template-columns:minmax(0,1fr) 116px;grid-template-rows:1fr 50px;column-gap:8px}.die-button{width:185px;max-width:100%;height:195px;grid-row:1/3;justify-self:center}.dice-outcomes{align-self:end;gap:8px;margin:0 0 10px}.try-roll{align-self:start;justify-self:center;margin:0;padding:9px 4px;white-space:nowrap}.outcome{min-width:27px;height:29px}.result-module{display:block;border-radius:22px;padding:26px;margin-top:16px}.answer{margin-top:8px}.answer output{font-size:3.75rem}.result-actions{width:100%;margin-top:22px;gap:7px}.run-button{min-height:56px}.save-button{min-height:48px}.notes-section{padding-top:30px}.notes-head{align-items:flex-start;flex-direction:column;gap:5px}.notes{gap:20px;grid-template-columns:1fr}.note{padding:25px 25px 20px}.note-config{font-size:1.125rem}.note-value{font-size:3rem}.empty-note{padding:24px;justify-content:flex-start}.distribution-grid{grid-template-columns:1fr;padding:20px;gap:28px}.distribution>summary{padding:16px 4px}.last-cell{grid-template-columns:56px minmax(0,1fr) 65px}.notes-link{font-size:1rem}.board-center{font-size:24px}footer{flex-direction:column;align-items:flex-start;gap:6px;font-size:1rem;margin-top:30px}}
@media(max-width:360px){.page{width:calc(100% - 24px)}.module-head{padding:18px 16px 0}.stepper{gap:7px}.board-viewport{padding:16px 10px;height:260px}.dice-stage{grid-template-columns:minmax(0,1fr) 95px;padding-left:12px;padding-right:12px}.die-button{height:174px;width:165px}.dice-outcomes{gap:4px}.result-module{padding:22px}.answer output{font-size:3.3rem}.notes-head>span{font-size:1rem}.board-tile text{font-size:22px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Dice photography, deterministic results, and tactile actions. */
.dice-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;height:346px;padding:18px 24px 22px}
.die-button{position:relative;display:grid;place-items:center;width:270px;height:270px;max-width:100%;filter:none;border-radius:30px;isolation:isolate}
.die-button svg,.die-button canvas{display:block;width:100%;height:100%;pointer-events:none}
.die-value{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);min-width:68px;padding:7px 15px;border:1px solid #ffffffa0;border-radius:20px;background:#f5f8ffe8;color:#315ebc;box-shadow:0 4px 16px #2c57951a;font-size:1rem;font-weight:550;white-space:nowrap;pointer-events:none}
.answer-heading{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.method-tag{padding:4px 10px;border-radius:8px;font-size:1rem;background:#eaf0fd;color:#3964b2}
.method-tag[data-method="exact"]{color:#316b63;background:#e5f2ed}
.result-actions{gap:10px;width:265px}
.exact-button{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:14px 21px;border:1px solid #d7e2df;border-radius:15px;background:#eff5f3;color:#326258;font-size:1rem;font-weight:550;transition:background .2s,transform .2s,box-shadow .2s}
.exact-symbol{font-family:Georgia,serif;font-style:italic;font-size:1.5rem;line-height:1}
.exact-button:hover:not(:disabled){background:#e3efea;transform:translateY(-1px);box-shadow:0 5px 14px #2c5d4920}
.exact-button:active:not(:disabled){transform:scale(.98)}
.exact-button:disabled{opacity:.45}
.run-button,.exact-button{position:relative;overflow:hidden;isolation:isolate}
.run-button>*,.exact-button>*{position:relative;z-index:1}
.run-button::before,.exact-button::before{content:"";position:absolute;top:-80%;left:-80%;width:65%;height:260%;background:linear-gradient(90deg,transparent,#ffffff65,transparent);transform:rotate(22deg);pointer-events:none;z-index:0}
.run-button:hover::before,.exact-button:hover:not(:disabled)::before{animation:buttonLight .9s ease-out}
.run-button.is-active::before,.exact-button.is-active::before{animation:buttonLight 1.8s ease-in-out infinite}
.run-button.is-active{box-shadow:0 0 0 4px #3168e812,0 6px 20px #3168e829}
.exact-button.is-active{box-shadow:0 0 0 4px #4a8c7812,0 6px 20px #31685519}
.run-button:disabled::before,.exact-button:disabled::before{animation:none}
.answer output{display:inline-block}
.result-module.is-complete .answer output{animation:answerArrive .45s cubic-bezier(.2,.8,.2,1) both}
.save-button:active:not(:disabled){transform:scale(.97)}
.note.note-simulation{background:#fff7d4}
.note.note-exact{background:#e6f2ed}
.note.note-simulation .note-config{color:#70643b}
.note.note-exact .note-config{color:#496c5f}
.note-method{display:inline-block;margin:0 0 14px;padding:4px 9px;border:1px solid #dfce904d;border-radius:6px;color:#7d692d;background:#eeda982c;font-size:1rem;font-weight:550}
.note-exact .note-method{color:#386c57;background:#bfdccc40;border-color:#8fbaa94d}
.note-restore:disabled{opacity:.4;cursor:default}
footer{align-items:center;flex-wrap:wrap;gap:16px 24px;font-size:1rem}
.filings{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px}
.filings a{display:inline-flex;align-items:center;gap:7px;min-height:40px}
.filings img{flex:none}
footer a{transition:color .2s}
footer a:hover{color:var(--ink)}
@keyframes buttonLight{0%{left:-80%}100%{left:150%}}
@keyframes answerArrive{from{opacity:.25;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:960px){.dice-stage{height:314px}.die-button{width:250px;height:250px}}
@media(max-width:700px){.dice-stage{display:flex;height:260px;padding:2px 24px 12px}.die-button{width:248px;height:248px;grid-row:auto}.result-actions{width:100%;gap:10px}.answer-heading{gap:10px}.filings{display:flex;flex-direction:column;align-items:flex-start;gap:2px}footer{align-items:flex-start;gap:8px}.filings a{font-size:1rem;overflow-wrap:anywhere}}
@media(max-width:360px){.die-button{width:228px;height:228px}.filings a{align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.run-button::before,.exact-button::before{display:none}.result-module.is-complete .answer output{animation:none}}
/* 上面给骰子的 svg 和 canvas 都写了 display:block，会盖掉浏览器默认的 [hidden]，这里补回来 */
.die-button svg[hidden],.die-button canvas[hidden]{display:none}

/* Keep the table stationary while the model moves in world space. */
.die-button:hover,.die-button:active{transform:none}
.module.is-running .die-button{animation:none}
.die-button canvas{transition:filter .25s}
.die-button:hover canvas{filter:brightness(1.035)}

.die-loading{color:var(--muted);font-size:1rem;letter-spacing:.04em}.die-button[aria-busy="true"]{cursor:progress}