*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}:root{font-family:"Segoe UI","Microsoft YaHei",sans-serif;color:#333e48;background:#eee9dd}body{margin:0;min-height:100dvh;background:radial-gradient(ellipse at top right,#f9f6ee,transparent 65%),#eee9dd}button{font:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid #c16c48;outline-offset:3px}button:disabled{cursor:default}button{border:0}.app{max-width:1200px;padding:25px max(26px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(26px,env(safe-area-inset-left));margin:auto}header{display:flex;align-items:center;justify-content:space-between;padding-bottom:20px;border-bottom:1px solid #2e394622}.brand{text-decoration:none;color:#364450;font-weight:700;letter-spacing:2px;font-size:17px}.brand span{margin-left:14px;font-size:10px;color:#89887f}.tools{display:flex;gap:9px}.tools button{background:transparent;color:#60676a;border:1px solid #60676a30;border-radius:7px;padding:10px 14px;font-size:12px;min-height:40px}.heading{display:flex;justify-content:space-between;align-items:center;margin:26px 0}.eyebrow{font-size:9px;letter-spacing:2.5px;color:#8a877b;margin:0 0 10px}h1{font-size:38px;font-weight:600;margin:0;letter-spacing:3px}h1 span{display:block;font-size:12px;color:#817c70;font-weight:400;letter-spacing:2px;margin-top:12px}.best{text-align:right;display:flex;flex-direction:column;color:#888477;font-size:11px;gap:3px}.best strong{font-family:Georgia,serif;font-size:34px;color:#ab5e3f}.best small{font-size:10px}.workspace{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:24px;align-items:stretch}.table{background:radial-gradient(ellipse at 50% 50%,#455963,#2d404b);border:1px solid #253b45;border-radius:15px;color:#f9f1de;padding:24px;box-shadow:0 12px 24px #23323d17;display:flex;flex-direction:column;position:relative;min-width:0}.table:before{content:'';position:absolute;inset:10px;border:1px solid #d9d5ba1c;border-radius:10px;pointer-events:none}.tableTop,.tableBottom{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.3px;color:#aab7b8;gap:8px}.tableTop{padding-bottom:20px;border-bottom:1px solid #d9d5ba20}.tableTitle{margin:35px 0 22px;text-align:center}.tableTitle h2{font-size:20px;font-weight:500;margin:0 0 10px;letter-spacing:1px}.tableTitle p{font-size:11px;color:#aebdbb;line-height:1.7;margin:0}.dice{display:flex;justify-content:center;gap:10px;min-height:95px;align-items:flex-start}.dieWrap{min-width:0;flex:1;max-width:72px;text-align:center}.die{width:100%;aspect-ratio:1;border-radius:12px;background:linear-gradient(145deg,#fffdf5,#e3dcc8);box-shadow:0 5px 0 #c7bfae,0 10px 13px #13232d66;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:4px;padding:13px;transition:transform .16s,background .16s;position:relative}.die.held{background:linear-gradient(145deg,#edc293,#dba36f);box-shadow:0 5px 0 #a9734c,0 0 0 2px #f1c28c;transform:translateY(-4px)}.dieWrap small{font-size:10px;display:block;margin-top:12px;letter-spacing:1px;color:#a8b5b4}.dieWrap:has(.held) small{color:#efc495}.pip{border-radius:50%;background:#374955;box-shadow:inset 0 1px 2px #16293255;aspect-ratio:1}.pip.off{visibility:hidden}.rollArea{margin:auto 0 28px;text-align:center;padding-top:20px}.rollDots{display:flex;justify-content:center;gap:7px;margin-bottom:13px}.rollDots i{width:6px;height:6px;border-radius:50%;background:#f0c99a}.rollDots i.used{background:#758b8c}.rollButton{background:#edc799;border:1px solid #f9dcb7;border-radius:9px;color:#34434b;font-size:15px;padding:13px 22px;width:100%;max-width:290px;min-height:46px;font-weight:600}.rollButton span{margin-left:25px;font-size:21px}.rollButton:disabled{background:#64777d;border-color:#7e9193;color:#cad4d0}.rollArea p{font-size:10px;color:#aabbb7;margin:14px 0 0}.tableBottom{padding-top:18px;border-top:1px solid #d9d5ba20;font-size:9px;letter-spacing:.5px}.scorecard{background:#faf7ee;border:1px solid #d3cfc1;border-radius:15px;padding:23px;min-width:0;box-shadow:0 8px 20px #746c4b09}.scoreHeading{display:flex;justify-content:space-between;align-items:center}.scoreHeading h2{font-size:18px;font-weight:600;margin:0}.scoreHeading .eyebrow{font-size:8px;margin-bottom:6px}.total{display:flex;align-items:baseline;gap:6px}.total strong{font-family:Georgia,serif;font-size:35px;font-weight:400}.total span{font-size:10px;color:#8b877c}.bonus{margin:15px 0 19px}.bonus>div:first-child{display:flex;justify-content:space-between;font-size:10px;color:#898272}.bar{height:4px;background:#e9e4d7;border-radius:3px;margin-top:8px}.bar span{display:block;height:100%;background:#b66d4d;border-radius:3px;transition:width .3s}.scoreColumns{display:grid;grid-template-columns:1fr 1fr;gap:18px}h3{font-size:10px;font-weight:400;color:#99917e;margin:0 0 8px;letter-spacing:1px}.scoreRows{display:flex;flex-direction:column;gap:3px}.scoreRow{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:37px;border-radius:6px;padding:7px 9px;background:transparent;border:1px solid #d8d1bf;color:#45505a;font-size:12px;text-align:left;gap:6px}.scoreRow b{font-family:Georgia,serif;font-size:16px;font-weight:500;min-width:21px;text-align:right;color:#af6444}.scoreRow:hover:not(:disabled){background:#eee5d4}.scoreRow.selected{background:#eee1cc;border-color:#b46d4b;box-shadow:inset 3px 0 #b46d4b}.scoreRow.filled{border-color:transparent;background:#ece9df;color:#8d8c81}.scoreRow.filled b{color:#5f6b67}.scoreRow:disabled:not(.filled){opacity:.6}.scoreRow .check{font-size:10px;color:#8e988b;margin-left:4px}.commitArea{border-top:1px solid #ded7c6;margin-top:15px;padding-top:12px;display:flex;align-items:center;gap:10px;justify-content:space-between;min-height:60px}.commitArea p{font-size:10px;line-height:1.65;color:#8d7b62;margin:0;max-width:65%}.commitArea button{border-radius:7px;min-height:40px;white-space:nowrap;padding:10px 14px;color:#fff8eb;background:#a95e40;font-size:12px}.commitArea button:disabled{background:#e6e0d2;color:#9c9688}footer{display:flex;justify-content:space-between;margin-top:22px;color:#938b7a;font-size:10px;gap:20px;line-height:1.6}dialog{background:#faf7ee;color:#384952;max-width:420px;width:calc(100% - 30px);border:1px solid #bfb6a1;border-radius:15px;padding:26px;max-height:85dvh}dialog::backdrop{background:#1e3039aa;backdrop-filter:blur(4px)}dialog h2{font-size:23px;font-weight:500}#dialogText{font-size:13px;line-height:1.9;white-space:pre-line;color:#736b5c}.close{float:right;background:transparent;color:#8f8779;font-size:25px;padding:0 5px}.dialogAction{width:100%;padding:13px;background:#a95e40;color:#fff7e8;border-radius:8px;margin-top:22px;min-height:44px}.rolling .die:not(.held){animation:toss .35s ease-out}@keyframes toss{0%{transform:translateY(0) rotate(0)}35%{transform:translateY(-12px) rotate(-12deg)}70%{transform:translateY(-3px) rotate(8deg)}100%{transform:none}}@media(prefers-reduced-motion:reduce){*,*:before{animation:none!important;transition:none!important}}
@media(max-width:760px){.app{padding:16px max(14px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))}header{padding-bottom:13px}.brand{font-size:14px}.brand span{display:none}.tools{gap:6px}.tools button{padding:8px;font-size:11px;min-height:36px}.heading{margin:20px 0}.eyebrow{font-size:7px;letter-spacing:1.5px}h1{font-size:30px}h1 span{font-size:10px;letter-spacing:1px;margin-top:8px}.best strong{font-size:28px}.best small{font-size:9px}.workspace{display:flex;flex-direction:column;gap:16px}.table{padding:20px}.tableTop{padding-bottom:12px;font-size:8px}.tableTitle{margin:20px 0}.tableTitle h2{font-size:17px}.dice{gap:9px;min-height:80px}.die{padding:10px;gap:3px;border-radius:10px}.dieWrap small{font-size:9px}.rollArea{padding-top:12px;margin:0 0 18px}.rollButton{max-width:none;padding:9px;min-height:44px}.rollDots{margin-bottom:10px}.rollArea p{margin-top:10px}.tableBottom{padding-top:12px;font-size:8px}.scorecard{padding:19px}.scoreColumns{gap:12px}.scoreRow{min-height:42px}.commitArea p{font-size:11px}.commitArea button{min-height:44px}.scoreHeading h2{font-size:17px}footer{font-size:9px}footer span:last-child{display:none}}
@media(min-aspect-ratio:13/10) and (max-height:620px){.app{padding-top:10px;padding-bottom:8px}header{padding-bottom:8px}.brand span,.heading,.tableTop,.tableBottom,footer{display:none}.tools button{min-height:32px;padding:6px 10px}.workspace{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:14px;margin-top:10px;align-items:start}.table,.scorecard{height:calc(100dvh - 76px);min-height:225px;padding:14px;border-radius:10px}.tableTitle{margin:4px 0 18px}.tableTitle h2{font-size:14px;margin-bottom:6px}.tableTitle p{font-size:9px}.dice{gap:7px;min-height:65px}.die{padding:8px;gap:2px;border-radius:8px}.dieWrap small{font-size:8px;margin-top:9px}.rollArea{margin:auto 0 0;padding-top:10px}.rollDots{margin-bottom:8px}.rollButton{min-height:36px;padding:6px;font-size:12px}.rollArea p{font-size:8px;margin-top:8px}.scorecard{display:flex;flex-direction:column}.scoreHeading h2{font-size:13px}.scoreHeading .eyebrow{display:none}.total strong{font-size:25px}.bonus{margin:7px 0 10px}.scoreScroll{overflow:auto;min-height:0;flex:1;padding:2px}.scoreColumns{gap:9px}.scoreRow{min-height:35px;font-size:10px;padding:5px}.scoreRow b{font-size:14px}h3{font-size:8px}.commitArea{flex-shrink:0;min-height:42px;margin-top:7px;padding-top:7px}.commitArea p{font-size:9px}.commitArea button{min-height:32px;padding:7px;font-size:10px}}
.tableBottom a{color:#e6c49b;text-decoration:none;display:inline-block;padding:5px;margin:-5px;min-height:24px}.scrollHint{display:none}.commitArea p{white-space:pre-line}.table{scroll-margin-top:12px}.scorecard{scroll-margin-top:12px}@media(min-aspect-ratio:13/10) and (max-height:620px){.scrollHint{display:block;font-size:8px;color:#938772;margin-top:3px}.scoreScroll{scrollbar-width:thin;scrollbar-color:#c5b396 #eee8dc}}
.contentControls{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:11px;margin:12px 0 18px;color:#736b5c}.contentControls label{display:flex;gap:8px;align-items:center}.contentControls select{font:inherit;padding:8px;background:#faf7ee;border:1px solid #c9bfaa;border-radius:6px;min-height:36px;color:#384952}.contentControls>span{flex:1;min-width:190px;line-height:1.7}.contentControls button{background:transparent;border:1px solid #c9bfaa;border-radius:6px;padding:8px;font-size:10px;color:inherit;min-height:36px}@media(min-aspect-ratio:13/10) and (max-height:620px){.contentControls{margin:6px 0;gap:5px}.contentControls>span{font-size:9px;min-width:170px}.contentControls select,.contentControls button{min-height:28px;padding:5px;font-size:9px}.table,.scorecard{height:calc(100dvh - 126px);min-height:185px}.workspace{margin-top:5px}.tableTitle{margin-bottom:10px}.tableTitle p{display:none}.dice{min-height:53px}.rollArea{padding-top:6px}.rollArea p{margin-top:4px;font-size:8px}.rollButton{min-height:30px}.scoreHeading .scrollHint{font-size:7px}.bonus{margin:4px 0 5px}.contentControls label{font-size:9px}}
@media(min-aspect-ratio:13/10) and (max-height:400px){.table,.scorecard{height:calc(100dvh - 108px)}.dice{min-height:67px;flex-shrink:0}.tableTitle{flex-shrink:0;margin:0 0 10px}.tableTitle h2{font-size:12px}.rollArea{flex-shrink:0}.scoreHeading h2{font-size:11px}.scoreHeading .scrollHint{font-size:7px}.scorecard .bonus{margin:3px 0}.scorecard h3{margin-bottom:4px}.scoreRow{min-height:30px}}
