:root{color-scheme:dark;--bg:#101917;--panel:#17211e;--line:#354036;--gold:#c2a26b;--text:#e3dfd0;--muted:#8b978a;--serif:"Songti SC","STSong","Noto Serif CJK SC",Georgia,serif}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 0,#26302a55,transparent 65%),var(--bg);color:var(--text);font:13px/1.6 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif}button,input{font:inherit}button{cursor:pointer;transition:background .18s,color .18s,transform .18s;border:0}button:disabled{cursor:not-allowed;opacity:.4}button:focus-visible,a:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold);outline-offset:4px}button:not(:disabled):active{transform:translateY(1px)}button:not(:disabled):hover{filter:brightness(1.15)}.masthead{height:90px;border-bottom:1px solid #9f916522;display:flex;align-items:center;justify-content:space-between;padding:0 4.4%;gap:20px}.brand{display:flex;align-items:center;gap:13px;color:var(--text);text-decoration:none;font:22px var(--serif);letter-spacing:3px}.brand small{display:block;font:8px/2.6 Georgia,serif;letter-spacing:2.2px;color:var(--gold)}.brand-seal{width:43px;height:43px;border:1px solid var(--gold);outline:1px solid #c2a26b40;outline-offset:4px;display:grid;place-items:center;border-radius:50%;color:var(--gold);font-size:36px}.header-motto{font:13px var(--serif);letter-spacing:4px;color:#acb3a1}.header-actions{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:11px}.icon-button{background:transparent;color:#c6c9b8;border:1px solid #5b63534d;min-width:30px;height:30px;padding:0 10px;border-radius:3px}.icon-button span{margin-left:5px}.live-dot{display:inline-block;width:5px;height:5px;background:#92af87;border-radius:50%;box-shadow:0 0 8px #83ad7655}.header-actions>.live-dot{margin-right:-6px}main{max-width:1560px;padding:0 4.4%;margin:0 auto}.intro{padding:37px 0 29px;display:flex;justify-content:space-between;align-items:center}.eyebrow{font-size:9px;letter-spacing:2px;color:var(--gold)}h1{font:35px/1.5 var(--serif);letter-spacing:3px;font-weight:400;margin:9px 0 5px}h1 span{color:var(--gold)}.intro p{margin:0;color:var(--muted);font-size:12px;letter-spacing:1px}.edition{display:flex;flex-direction:column;align-items:flex-end;color:var(--muted);font-size:9px;letter-spacing:2px}.edition strong{font:32px/1.6 Georgia,serif;color:var(--gold);letter-spacing:1px}.workspace{display:grid;grid-template-columns:224px minmax(350px,1fr) 250px;gap:22px;align-items:start}.panel{border:1px solid #89907732;background:linear-gradient(140deg,#ffffff03,transparent),var(--panel);padding:20px 17px;border-radius:3px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:8px}h2{font:16px/1.5 var(--serif);letter-spacing:1px;margin:0;font-weight:400}.section-title>span,.tiny{font:8px/1.6 Georgia,serif;letter-spacing:1.2px;color:var(--muted)}.label-row{display:flex;justify-content:space-between;align-items:center;margin:22px 0 12px;color:#bcc1b0;font-size:11px}.text-button{background:none;padding:0;color:var(--muted);font-size:10px;text-decoration:underline;text-decoration-color:#7c876944;text-underline-offset:4px}.dice-row{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px solid #87907616;gap:8px}.dice-name{display:flex;align-items:center;gap:10px}.dice-name svg{width:29px;height:29px;stroke:#7e8c78;fill:#8ea47f07;stroke-width:1.1;transition:.2s}.dice-row.selected .dice-name svg{stroke:var(--gold);fill:#c2a26b0a}.dice-name strong{font:15px Georgia,serif;color:#cbd0c0}.dice-name small{display:block;font-size:8px;color:var(--muted);line-height:1.1}.stepper{display:flex;align-items:center;border:1px solid #74826832;border-radius:3px;height:29px}.stepper button{width:23px;height:27px;background:transparent;color:#aeb6a0;padding:0;font-size:16px}.stepper input{width:26px;text-align:center;background:transparent;border:0;color:#d4c6a6;font-size:12px;appearance:textfield;-moz-appearance:textfield;padding:0}.stepper input::-webkit-inner-spin-button,.stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.capacity{margin-top:18px}.capacity>div:first-child{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.capacity strong{color:#cab383;font-weight:400}.capacity-track{display:flex;gap:4px;margin-top:10px}.capacity-track i{height:3px;flex:1;background:#344333;border-radius:2px}.capacity-track i.filled{background:var(--gold)}.capacity p{font-size:9px;color:#83917e;margin-top:9px}.material-section{border-top:1px solid #87907625;margin-top:19px}.material-options{display:flex;gap:7px}.material{display:flex;align-items:center;gap:7px;position:relative;background:#141d19;border:1px solid #6c796144;border-radius:3px;padding:10px 7px;flex:1;color:#9ca58f;text-align:left;font-size:11px}.material.active{border-color:#b69b62;background:#ad976315;color:#dec28c}.material small{display:block;font-size:8px;color:var(--muted);white-space:nowrap}.material b{display:none;position:absolute;right:3px;top:1px;font-size:8px}.material.active b{display:block}.swatch{display:block;width:20px;height:23px;border-radius:4px;flex-shrink:0;transform:rotate(-9deg);box-shadow:inset -3px -3px 5px #0006,inset 2px 2px 3px #fff3}.resin{background:linear-gradient(135deg,#b7c09e,#5b7259)}.wood{background:repeating-linear-gradient(100deg,#aa7b47 0,#c9a572 3px,#9c7040 4px,#aa7b47 7px)}.aside-note{text-align:center;margin-top:23px;color:#8f9886}.aside-note>span{color:var(--gold)}.aside-note p{font:11px/1.9 var(--serif);letter-spacing:.6px}.aside-note small{font:7px Georgia,serif;letter-spacing:1px}.table-heading{display:flex;justify-content:space-between;align-items:center;height:30px;font-size:10px;color:#a5ad98}.table-heading .live-dot{margin-right:6px}.table{position:relative;height:484px;overflow:hidden;background:#172b24;border:1px solid #8c795649;box-shadow:0 12px 40px #0003,inset 0 0 0 7px #6b593223,inset 0 0 70px #0008;border-radius:5px;touch-action:none;cursor:grab}.table:active{cursor:grabbing}.table canvas{width:100%;height:100%;display:block}.table-top-label{position:absolute;top:24px;left:0;right:0;text-align:center;font:8px Georgia,serif;letter-spacing:2px;color:#a4a58488;pointer-events:none;z-index:2}.table-hint{position:absolute;bottom:40px;left:0;right:0;text-align:center;color:#acb598aa;font-size:10px;letter-spacing:1px;pointer-events:none;z-index:2}.table-hint span{font-size:17px;padding-right:7px;color:#c7ac74}.table-coordinate{position:absolute;bottom:18px;left:0;right:0;text-align:center;font:7px Georgia,serif;letter-spacing:2px;color:#9ca78866;pointer-events:none}.table-corner{position:absolute;width:22px;height:22px;border-color:#b49c60;border-style:solid;z-index:3;pointer-events:none}.tl{top:12px;left:12px;border-width:1px 0 0 1px}.tr{top:12px;right:12px;border-width:1px 1px 0 0}.bl{bottom:12px;left:12px;border-width:0 0 1px 1px}.br{bottom:12px;right:12px;border-width:0 1px 1px 0}.loading{position:absolute;inset:0;display:grid;place-content:center;color:#dac99e;background:#172b24;z-index:5;text-align:center;padding:25px}.loading[hidden]{display:none}.drag-line{display:none;position:absolute;pointer-events:none;transform-origin:left center;height:2px;background:linear-gradient(90deg,#bfa16755,#e5c184);z-index:4;box-shadow:0 0 12px #d8c58355}.drag-line:after{content:"";position:absolute;right:0;top:-4px;width:8px;height:8px;border-right:2px solid #e5c184;border-top:2px solid #e5c184;transform:rotate(45deg)}.roll-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:21px 0 14px}.formula-block .eyebrow{font-size:8px;color:#96a18c;display:block;letter-spacing:1px}.formula-block strong{display:block;font:19px/1.8 Georgia,serif;font-weight:400;letter-spacing:.5px;color:#cec9b3}.roll-button{display:flex;justify-content:space-between;align-items:center;gap:18px;background:linear-gradient(110deg,#dfc18a,#bca06d);color:#253126;border:1px solid #e5cb98;border-radius:3px;box-shadow:0 3px 12px #0003;min-height:49px;padding:0 21px;font-size:13px;letter-spacing:2px;white-space:nowrap}.roll-symbol{font-size:25px;line-height:1}.below-table{border-top:1px solid #7e896128;padding:13px 0;display:flex;justify-content:space-between;font-size:9px;color:#7f8d77;letter-spacing:.4px}kbd{font:8px monospace;border:1px solid #7c8b6244;padding:2px 4px;border-radius:2px;margin-right:4px}.notice{min-height:22px;font-size:11px;color:#d5bc89;margin:0}.records{padding-top:30px}.result-card{background:linear-gradient(130deg,#ece6cf,#cec7aa);color:#3d4839;border:1px solid #ded2aa;border-radius:3px;padding:20px 20px 16px;box-shadow:0 5px 18px #0002;position:relative}.result-card:before{content:"";position:absolute;inset:6px;border:1px solid #71684429;pointer-events:none}.result-card .section-title>span{color:#827e61;font-size:8px}.result-card h2{font-size:16px}.result-caption{text-align:center;font-size:10px;margin:20px 0 2px;color:#7e806b;letter-spacing:1px}.total{font:76px/1.15 Georgia,serif;text-align:center;color:#354c3d;font-variant-numeric:tabular-nums}.total-label{text-align:center;font-size:9px;letter-spacing:3px;color:#84846b;margin-top:5px}.paper-divider{display:flex;align-items:center;gap:12px;color:#a09870;font-size:11px;margin:18px 0 12px}.paper-divider:before,.paper-divider:after{content:"";flex:1;height:1px;background:#8c896944}.empty-result{text-align:center;font:12px/2 var(--serif);color:#898973;margin:16px 0}.result-meta{text-align:center;font-size:8px;letter-spacing:.6px;color:#86866d;border-top:1px solid #8c896933;padding-top:12px;margin-top:15px}.result-row{display:flex;justify-content:space-between;align-items:center;font:13px/1.9 Georgia,var(--serif);gap:8px}.result-row span:last-child{font-weight:bold;text-align:right}.result-row small{font-size:10px;font-weight:400;color:#818268;margin-left:6px}.history-section{margin-top:25px}.history-section h2{font-size:15px}.history-section h2 span{font:9px Georgia,serif;color:var(--muted);margin-left:6px}.history{margin-top:14px;max-height:254px;overflow:auto;scrollbar-width:thin;scrollbar-color:#687054 transparent}.history-empty{text-align:center;color:#818e7a;padding:15px 0}.history-empty>span{font:36px Georgia,serif;color:#8c997b}.history-empty p{font:12px var(--serif);margin:4px 0 8px}.history-empty small{font-size:9px;color:#687561}.history-item{display:flex;align-items:center;justify-content:space-between;gap:9px;padding:12px 0;border-bottom:1px solid #7e896126}.history-item time{font-size:8px;color:#7f8a74;display:block;letter-spacing:.5px}.history-item .history-formula{font:12px/1.8 Georgia,serif;color:#bfc5ad}.history-item small{display:block;font-size:9px;color:#87977e}.history-item strong{font:25px Georgia,serif;color:#cdb584}footer{display:flex;justify-content:space-between;gap:15px;margin-top:27px;padding:19px 0 25px;border-top:1px solid #7e896128;color:#68745f;font-size:8px;letter-spacing:1.5px}footer i{font-style:normal;color:#ad9361;margin:0 7px}dialog{max-width:470px;width:90vw;background:#1a2721;color:var(--text);border:1px solid #a9915c;padding:36px;border-radius:5px;box-shadow:0 20px 90px #0008}dialog::backdrop{background:#060e0bcc;backdrop-filter:blur(5px)}dialog h2{font-size:25px;margin:13px 0 20px}dialog p{font-size:12px;line-height:1.9;color:#b7bea9}dialog>.icon-button{position:absolute;right:12px;top:12px}dialog .roll-button{width:100%;margin-top:24px;justify-content:center}
@media(min-width:1450px){.workspace{grid-template-columns:244px minmax(350px,1fr) 275px;gap:27px}.table{height:515px}.dice-row{padding:11px 0}.panel{padding:22px}.intro{padding-top:43px}}@media(max-width:1150px){.workspace{grid-template-columns:205px minmax(300px,1fr) 215px;gap:15px}main{padding:0 3%}.masthead{padding:0 3%}.header-motto{display:none}.panel{padding:17px 13px}.table{height:470px}.result-card{padding:19px 14px}.roll-button{padding:0 13px;gap:9px}.formula-block strong{font-size:16px}.below-table{font-size:8px}.tiny{font-size:7px}}@media(max-width:920px){.workspace{grid-template-columns:200px minmax(300px,1fr)}.records{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:20px;padding-top:0}.history-section{margin:0}.table{height:470px}.table-column{min-width:0}.result-card{padding:20px}.total{font-size:65px}.intro{padding-top:25px}h1{font-size:29px}}@media(max-width:580px){.masthead{height:77px}.desktop-label,.header-actions>.live-dot,.edition,.header-actions button span{display:none}.brand{font-size:18px}.brand small{font-size:6px}.brand-seal{width:32px;height:32px;font-size:29px}.workspace{grid-template-columns:1fr}.configuration{padding:15px}.configuration>.section-title,.aside-note{display:none}#dice-picker{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.configuration>.label-row{margin-top:0}.capacity{margin-top:12px}.material-section{margin-top:8px}.material-section>.label-row{margin:9px 0}.material{justify-content:center}.material small{display:inline;margin-left:7px}.table{height:430px}.records{grid-template-columns:1fr}.table-column{grid-row:2}.history{max-height:230px}.intro{padding:23px 0}h1{font-size:26px}.intro p{font-size:11px}.below-table{font-size:8px}footer>span:first-child{display:none}.table-heading .tiny{font-size:7px}.notice{min-height:12px}}
@media(min-width:921px) and (max-height:820px){.masthead{height:70px}.intro{padding:23px 0 21px}h1{font-size:29px;margin:5px 0}.table{height:350px}.panel{padding:15px}.configuration>.label-row{margin:14px 0 6px}.dice-row{padding:5px 0}.dice-name svg{width:25px;height:25px}.capacity{margin-top:12px}.capacity p{margin:6px 0}.material-section{margin-top:11px}.material-section .label-row{margin:11px 0 8px}.material{padding:8px 6px}.aside-note{display:none}.roll-bar{padding:16px 0 12px}.result-card{padding:17px}.result-caption{margin-top:14px}.total{font-size:65px}.history-section{margin-top:18px}.history{max-height:140px}.paper-divider{margin:13px 0 9px}footer{margin-top:18px;padding:15px 0}.table-hint{bottom:29px;font-size:9px}.table-coordinate{bottom:12px}.table-top-label{top:18px;font-size:7px}}
/* Phone controls: keep the seven dice types within narrow screens. */
@media(max-width:580px){
  #dice-picker{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 8px}
  .dice-row{min-width:0;gap:4px;padding:7px 0}
  .dice-name{gap:4px;min-width:0}
  .dice-name svg{width:18px;height:23px;flex-shrink:0}
  .dice-name strong{font-size:14px}
  .dice-name small{display:none}
  .stepper{height:44px;flex-shrink:0}
  .stepper button{width:30px;height:42px}
  .stepper input{width:24px;font-size:16px}
  .header-actions .icon-button{min-width:42px;height:42px}
  .material{min-height:48px;padding:9px 5px}
  .material small{font-size:8px;margin-left:4px}
  .table{height:390px}
  .roll-bar{align-items:stretch;flex-direction:column;gap:10px}
  .roll-button{min-height:52px}
  .formula-block strong{font-size:16px;overflow-wrap:anywhere}
  .below-table>span:last-child{display:none}
}
@media(max-width:350px){.dice-name svg{display:none}.material small{display:none}}
