*{box-sizing:border-box}[hidden]{display:none!important}:root{font-family:system-ui,-apple-system,sans-serif;color:#171819;background:white;font-size:17px}body{margin:0}button,select,input,textarea{font:inherit;color:inherit}button,select,input{min-height:44px}button{border:1px solid #cbd0d4;background:white;padding:.55rem .9rem;font-weight:650;cursor:pointer;border-radius:4px}button:hover{background:#eef0f2}button:disabled{opacity:.45;cursor:default}button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #275d7c;outline-offset:3px}select,input,textarea{background:white;border:1px solid #bfc6cc;border-radius:4px;padding:.5rem .65rem}select{padding-right:2rem}header{max-width:1300px;padding:20px 32px;margin:auto;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #d8dde0}header a{font-weight:850;font-size:28px;color:#b52d27;text-decoration:none}header a span{font-size:14px;font-weight:500;color:#555d64;margin-left:12px}.badge{font-size:11px;letter-spacing:.13em;color:#68717a}main{max-width:1300px;margin:auto;padding:28px 32px}.intro h1{font:700 clamp(28px,4vw,42px)/1.15 Georgia,serif;margin:0 0 10px}.intro p{color:#626a72;margin:0 0 28px}.board{border:1px solid #ccd0d3;background:#f5f6f7;padding:24px;border-radius:8px}.board-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.board-head h2{font-size:20px;margin:0;overflow-wrap:anywhere}.toolbar{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:22px}.toolbar>label{display:flex;gap:10px;align-items:center;font-size:14px}.toolbar #setup{margin-left:auto}.mode-switch{display:flex;background:#e3e6e9;padding:3px;border-radius:6px}.mode-switch button{border:0;background:transparent;font-size:14px}.mode-switch button[aria-pressed=true]{background:white;box-shadow:0 1px 4px #0001}.stage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px 26px;padding:50px 10px 35px;min-height:300px;align-content:center}.stage[data-count="1"]{grid-template-columns:1fr}.stage[data-count="2"]{grid-template-columns:repeat(2,1fr)}.die-slot{min-width:0;display:flex;flex-direction:column;align-items:center;position:relative}.die-label{font-size:12px;letter-spacing:.06em;font-weight:700;margin-bottom:26px;max-width:100%;overflow-wrap:anywhere;text-align:center}.die-wrap{position:relative;width:130px;height:130px;isolation:isolate}.solid-die{position:absolute;width:220%!important;height:220%!important;left:-60%;top:-60%;pointer-events:none;z-index:1}.die-wrap:before{content:'';position:absolute;width:85%;height:15px;bottom:-6px;left:7.5%;background:#15233222;filter:blur(9px);border-radius:50%}.pop-face{height:100%;width:100%;border:2px solid #242a31;border-radius:9px;box-shadow:6px 7px 0 #242a31;display:flex;align-items:center;justify-content:center;text-align:center;overflow-wrap:anywhere;padding:12px;font-weight:750;font-size:16px;background:var(--face);color:var(--ink)}.pips{width:100%;height:100%;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr)}.pip{width:18px;height:18px;background:currentColor;border-radius:50%;align-self:center;justify-self:center}.die-result{font-size:20px;font-weight:700;margin:22px 0 15px;min-height:30px;text-align:center;max-width:100%;overflow-wrap:anywhere}.word-mode .die-result{font-size:17px;line-height:1.4;min-height:48px;max-width:280px}.die-actions{display:flex;gap:7px}.die-actions button{font-size:13px;padding:.4rem .8rem}.die-actions button[aria-pressed=true]{background:#171819;color:white;border-color:#171819}.held .die-label:after{content:' · HELD';color:#b52d27}.board-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #cbd1d6;padding-top:22px;gap:16px}.total{font-size:23px;font-weight:750}.actions{display:flex;gap:10px}.primary{background:#b52d27;border-color:#b52d27;color:white}.primary:hover{background:#992620}#roll{min-width:180px;font-size:20px}.hint,#status,.footnote{font-size:13px;color:#626b73;line-height:1.5}.hint{margin-bottom:0}#status{min-height:20px;margin-bottom:0}.settings{margin-top:24px}.setting-row{display:flex;gap:22px;align-items:end;flex-wrap:wrap}.setting-row>label{display:grid;gap:6px;font-size:14px;font-weight:650;min-width:180px}.setting-row .check{display:flex;align-items:center;gap:9px;min-width:0;min-height:44px}.check input{width:18px;min-height:18px;accent-color:#b52d27}details{border-top:1px solid #ccd0d3;margin-top:24px;padding-top:18px}summary{font-weight:650;cursor:pointer}.file-row{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin-top:18px}.file-row label{display:grid;gap:6px;font-size:14px}.footnote{margin-top:24px}dialog{width:min(700px,calc(100% - 28px));max-height:90dvh;border:1px solid #cbd0d4;border-radius:8px;padding:24px}dialog::backdrop{background:#17181988}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}.dialog-head h2{margin:0;font-size:23px}.dialog-head button{font-size:24px;border:0}dialog label{display:grid;gap:6px;font-size:14px;font-weight:650}dialog input,dialog select{width:100%}.all-colours{display:flex;gap:12px;align-items:end;margin-top:18px}.all-colours label{flex:1}.die-editor{border-top:1px solid #d7dbdf;padding-top:18px;margin-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:14px}.die-editor h3{grid-column:1/-1;margin:0;font-size:16px}.die-editor .faces{grid-column:1/-1}.faces textarea{height:160px;resize:vertical;line-height:1.5}.dialog-actions{display:flex;justify-content:end;gap:12px;margin-top:24px;position:sticky;bottom:-24px;background:white;padding:14px 0}.dialog-actions button{min-width:120px}#editor-error{color:#aa2722;font-size:14px}.presenting{overflow:hidden}.presenting .board{position:fixed;inset:0;z-index:10;border:0;border-radius:0;overflow:auto;display:flex;flex-direction:column;padding:24px}.presenting .stage{flex:1}.presenting .toolbar,.presenting .board>.hint{display:none}.presenting .die-wrap{width:clamp(110px,18vh,190px);height:clamp(110px,18vh,190px)}.presenting .die-result{font-size:26px}.presenting .word-mode .die-result{font-size:22px}.presenting .die-label{font-size:16px}.presenting .board-head h2{font-size:24px}@media(max-width:650px){header{padding:16px}header a span{display:none}main{padding:24px 14px}.board{padding:16px}.toolbar{gap:12px}.toolbar #setup{margin-left:0}.stage{gap:34px 12px;padding:35px 0;grid-template-columns:repeat(2,minmax(0,1fr))}.die-wrap{width:95px;height:95px}.die-label{margin-bottom:20px}.die-result{font-size:18px}.word-mode .die-result{font-size:14px}.board-bottom{align-items:start;flex-direction:column}.actions{width:100%}#roll{flex:1}.setting-row{gap:16px}.setting-row>label{flex:1;min-width:140px}.die-editor{grid-template-columns:1fr}.die-editor h3,.die-editor .faces{grid-column:auto}.all-colours{align-items:stretch;flex-direction:column}.presenting .die-wrap{width:95px;height:95px}.presenting .die-result{font-size:19px}.presenting .word-mode .die-result{font-size:16px}.presenting .board{padding:16px}.pop-face{font-size:13px}.pip{width:14px;height:14px}}
.board{overflow:hidden}.stage{overflow:hidden}.presenting .board{overflow-x:hidden;overflow-y:auto}.presenting .stage{flex:1 0 auto}.presenting .board-head,.presenting .board-bottom,.presenting #status{flex-shrink:0}.board-head>div{flex-shrink:0}@media(max-width:650px){.presenting .stage{min-height:300px}.presenting .stage[data-count="5"],.presenting .stage[data-count="6"]{min-height:740px}.presenting .stage[data-count="3"],.presenting .stage[data-count="4"]{min-height:510px}}
.setting-row select{width:100%;min-width:0}.setting-row>label{min-width:0}@media(max-width:650px){.setting-row>label:not(.check){flex-basis:100%}}

@media(max-width:360px){.board-head{align-items:flex-start;flex-direction:column;gap:12px}}

.display-options{margin-top:22px;padding-top:20px;border-top:1px solid #d8dde0}.presenting .display-options{display:none}.word-mode .pop-face{font-size:18px;line-height:1.15}@media(max-width:650px){.word-mode .pop-face{font-size:15px}}

/* Consistent control sizes across native browser select styles. */
select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23171819' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:38px;height:44px}
.toolbar{justify-content:flex-start;gap:16px}.toolbar #setup{margin-left:0}.toolbar>label{margin-left:auto}.toolbar #count{min-width:72px}
.setting-row{display:grid;grid-template-columns:minmax(150px,200px) minmax(190px,240px) minmax(150px,1fr);gap:16px;align-items:end}.setting-row>label,.sound-setting{font-size:14px;font-weight:650;display:grid;gap:6px}.sound-setting .check{height:44px;margin:0;display:flex;align-items:center;gap:9px;font-weight:500}.check input{margin:0}
#word-options{margin-top:20px;padding-top:18px;border-top:1px solid #d8dde0}#word-options .file-row{margin:0;gap:12px}#word-options label{font-weight:650;gap:6px;min-width:200px}#word-options button{height:44px}.display-options{margin-top:20px}.stage{padding-top:40px}
@media(max-width:650px){.setting-row{grid-template-columns:1fr 1fr}.sound-setting{grid-column:1/-1}.sound-setting>span{display:none}.toolbar>label{margin-left:0}.toolbar #setup{margin-left:0}#word-options label{flex:1;min-width:0}}
@media(max-width:380px){.setting-row{grid-template-columns:1fr}#word-options .file-row{align-items:stretch;flex-direction:column}}

#setup{background:#275d7c;border-color:#275d7c;color:#fff}#setup:hover{background:#1e4961;border-color:#1e4961}.setting-row{align-items:end}

.skip{position:fixed;top:8px;left:8px;transform:translateY(-150%);background:white;padding:12px;z-index:50}.skip:focus{transform:none}header>a{display:flex;align-items:center;gap:10px}header>a span{margin:0;font-size:17px;font-weight:700;color:#171819}header nav a{font-size:15px;color:#171819;font-weight:600}footer{max-width:1236px;margin:24px auto;padding:20px;border-top:1px solid #ccd0d3;font-size:14px;display:flex;gap:18px;justify-content:space-between;flex-wrap:wrap}footer nav{display:flex;gap:18px;flex-wrap:wrap}footer a,.tool-feedback a{color:inherit}.tool-feedback{margin-top:28px;padding-top:20px;border-top:1px solid #ccd0d3}.tool-feedback h2{font-size:23px}.tool-feedback p{line-height:1.6}.presenting .tool-feedback{display:none}@media(max-width:650px){header>a span{display:block;max-width:130px;font-size:14px}}
