:root{font-family:Inter,system-ui,sans-serif;color:#142e46;background:#f3f6fa;font-size:16px}*{box-sizing:border-box}body{margin:0}main{max-width:1180px;margin:auto;padding:36px 28px}header{margin-bottom:30px}.brand{font-size:14px;font-weight:800;letter-spacing:.13em;color:#087f82}h1{font-size:clamp(28px,4vw,42px);margin:10px 0;letter-spacing:-.04em}p{color:#506779;line-height:1.6}h2{font-size:21px;margin:0}section,main>details{background:white;border:1px solid #d6e0e8;border-radius:18px;padding:24px;margin:18px 0}.section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:22px}button,input,select{font:inherit}button{cursor:pointer;border:1px solid #bccdd9;border-radius:10px;padding:12px 18px;background:white;color:#19394f;font-weight:650;min-height:44px}button:hover{background:#eaf3f5}button:disabled{opacity:.5;cursor:default}.primary{background:#087f82;color:white;border-color:#087f82}.primary:hover{background:#066a6d}.quiet{border:0;background:transparent}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}.device{min-width:0;border:1px solid #d5e2eb;border-radius:14px;overflow:hidden;background:#fcfdff}.device-head{display:flex;justify-content:space-between;padding:16px;align-items:center}.device-head strong{font-size:18px}.device-head button{padding:4px 10px}.visual{height:240px;display:flex;align-items:center;justify-content:center;position:relative;background:radial-gradient(ellipse,#e9f5f5,transparent 70%)}.outcome{text-align:center;font-size:22px;font-weight:750;padding:8px 18px 20px;overflow-wrap:anywhere}.device details{border-top:1px solid #e0e8ee;padding:14px}summary{cursor:pointer;font-weight:650;min-height:30px}summary span{float:right;color:#60798b;font-size:14px;font-weight:400}label{display:block;color:#385366;margin:12px 0}input:not([type=checkbox]):not([type=color]),select{border:1px solid #b8cbd8;border-radius:8px;padding:10px;background:white;color:#142e46;max-width:100%;width:100%;margin-top:6px}input[type=checkbox]{width:18px;height:18px;vertical-align:middle;margin-right:8px}input[type=color]{width:42px;height:40px;border:0;background:transparent}.run{display:flex;align-items:center;gap:22px;flex-wrap:wrap}.run label{margin:0;width:160px}.run button{align-self:flex-end;min-width:180px}.run span{font-size:14px}#error{color:#a02c39}#picker{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}#picker[hidden]{display:none}#picker button{flex:1;min-width:130px}.wheel{width:210px;height:210px;filter:drop-shadow(0 6px 5px #1232)}.pointer{position:absolute;top:9px;left:calc(50% - 11px);width:0;height:0;border-left:11px solid transparent;border-right:11px solid transparent;border-top:26px solid #142e46;z-index:2}.hub{position:absolute;width:26px;height:26px;background:white;border:5px solid #142e46;border-radius:50%;pointer-events:none}.die{width:120px;height:120px;background:#143b58;color:white;border:5px solid #2f6687;border-radius:22px;box-shadow:10px 10px 0 #0c2437;display:grid;place-items:center;font-size:52px;font-weight:800}.poly{clip-path:polygon(50% 0,100% 28%,90% 80%,50% 100%,10% 80%,0 28%);border-radius:0;box-shadow:none}.coin{width:138px;height:138px;border:9px double #b98319;border-radius:50%;background:#ffdc78;color:#78520f;display:grid;place-items:center;font-size:26px;font-weight:800;box-shadow:0 8px 0 #bd8d33}.number{font-size:72px;font-weight:800;color:#087f82}.card{width:112px;height:155px;border:2px solid #cad6df;border-radius:12px;background:white;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:37px;box-shadow:6px 6px 0 #d7e5ed}.red{color:#c72b43}.sector-row{display:grid;grid-template-columns:1fr 80px 42px 40px;gap:5px;align-items:center}.sector-row button{padding:3px}.sector-row input{min-width:0}.rename-row{display:grid;grid-template-columns:85px 1fr;align-items:center;gap:10px}.toolbar{display:flex;gap:20px}.toolbar label{width:220px}.scroll{overflow:auto;max-height:600px}table{border-collapse:collapse;width:100%;font-size:14px}th,td{text-align:left;border-bottom:1px solid #e0e8ef;padding:12px;white-space:nowrap}th{background:#edf4f8}footer{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:8px 0}footer p{width:100%;font-size:14px}footer details{margin-left:auto}#pagination{padding-top:14px;display:flex;gap:12px;align-items:center}.bar{height:8px;background:#087f82;border-radius:4px;min-width:2px;margin-top:5px}.note{font-size:14px;color:#5e7283}.rolling{animation:roll .85s ease-out}.flipping{animation:flip 1s ease-out}@keyframes roll{0%{transform:rotate(-30deg) translateY(-15px)}40%{transform:rotate(160deg) translateY(10px)}100%{transform:rotate(360deg)}}@keyframes flip{0%{transform:rotateY(0) translateY(0)}50%{transform:rotateY(900deg) translateY(-35px)}100%{transform:rotateY(1800deg)}}@media(max-width:600px){main{padding:20px 14px}section,main>details{padding:16px}.grid{grid-template-columns:1fr}.run{gap:14px}.run span{width:100%}footer details{margin-left:0}.toolbar{flex-direction:column;gap:0}.section-head h2{font-size:19px}}@media(prefers-reduced-motion:reduce){*{animation:none!important}}
.spinner-banner{display:flex;align-items:flex-end;flex-wrap:wrap;gap:12px;padding:16px;background:#edf6f7;border-top:1px solid #d6e8eb}.spinner-banner label{flex:1 1 120px;margin:0;font-size:14px;font-weight:650}.spinner-banner button{flex:1 1 100%;background:#fff;border-color:#91bdc3}.spinner-banner input,.spinner-banner select{font-size:16px;font-weight:400}@media(min-width:900px){.grid:has(.device:only-child) .spinner-banner{flex-wrap:nowrap}.grid:has(.device:only-child) .spinner-banner button{flex:0 0 auto}}
/* Keep the experiment control beside the workspace as the page scrolls. */
main{max-width:1440px;padding-right:254px}.run{position:fixed;right:max(24px,calc((100vw - 1384px)/2));top:138px;width:210px;z-index:10;display:flex;flex-direction:column;align-items:stretch;gap:16px;padding:20px;margin:0;box-shadow:0 8px 26px #173c5018}.run label{width:100%}.run button{align-self:stretch;min-width:0}.run span{line-height:1.5}.device .visual{overflow:hidden}.dice-stage{width:110px;height:110px;perspective:650px;position:relative}.dice-cube{height:110px;width:110px;position:relative;transform-style:preserve-3d}.dice-face{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:8px;padding:15px;border:2px solid #d2e0e8;border-radius:13px;background:linear-gradient(135deg,#fff,#edf3f8);backface-visibility:hidden;box-shadow:inset 0 0 14px #203c5210}.pip{background:#173b57;border-radius:50%;box-shadow:inset 0 2px 2px #0003}.face-1{transform:translateZ(55px)}.face-2{transform:rotateY(90deg) translateZ(55px)}.face-3{transform:rotateY(180deg) translateZ(55px)}.face-4{transform:rotateY(-90deg) translateZ(55px)}.face-5{transform:rotateX(90deg) translateZ(55px)}.face-6{transform:rotateX(-90deg) translateZ(55px)}
@media(max-width:760px){main{padding-right:20px;padding-bottom:190px}.run{top:auto;bottom:14px;right:14px;width:220px;padding:14px;gap:8px}.run label{display:flex;align-items:center;gap:8px;font-size:14px}.run input{width:86px!important;margin-top:0!important}.run span{font-size:12px}.run button{min-height:44px}}
@media(max-width:760px){main{padding-bottom:250px}.run #reset{padding:8px 12px}}
.sector-list{margin-top:14px;display:grid;gap:10px}.simple-sector{display:grid;grid-template-columns:40px minmax(0,1fr) 95px 36px;gap:8px;align-items:center;background:#f2f6f9;padding:10px;border-radius:10px}.simple-sector>input:not([type=color]){min-width:0;margin:0}.simple-sector>strong{text-align:center}.simple-sector label{margin:0;font-size:12px}.simple-sector label input{margin-top:4px!important;min-width:0}.simple-sector button{padding:4px;min-width:0}.chance-total{font-size:14px;font-weight:650}.chance-total.valid{color:#087f68}.chance-total.invalid{color:#a02c39}.advanced-probability{margin-top:16px}.advanced-probability summary{font-size:14px}@media(max-width:440px){.simple-sector{grid-template-columns:34px minmax(0,1fr) 80px 30px;gap:5px;padding:8px}.simple-sector input[type=color]{width:34px}}
.simple-sector{grid-template-columns:minmax(0,1fr) 95px 36px;background:transparent;border-radius:0;padding:8px 0;gap:10px;border-bottom:1px solid #e5edf2}.sector-identity{display:flex;align-items:center;gap:7px;min-width:0}.sector-identity strong{text-align:left;font-size:16px}.sector-identity input:not([type=color]){border:0!important;background:transparent!important;border-radius:0!important;box-shadow:none!important;padding:7px 0!important;margin:0!important;min-width:0;font-weight:650}.sector-identity input:not([type=color]):focus{outline:2px solid #087f82;outline-offset:2px;border-radius:4px!important}.colour-dot{position:relative;display:block;flex:0 0 24px;width:24px;height:24px;border-radius:50%;background:var(--sector-colour);box-shadow:inset 0 0 0 1px #0002;margin:0!important;overflow:hidden;cursor:pointer}.colour-dot input[type=color]{position:absolute;inset:0;opacity:0;width:100%;height:100%;padding:0;cursor:pointer}.colour-dot:focus-within{outline:2px solid #087f82;outline-offset:3px}@media(max-width:440px){.simple-sector{grid-template-columns:minmax(0,1fr) 80px 30px;padding:8px 0;gap:8px}}
.device{container-type:inline-size}.customise-columns{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:start}.simple-settings,.advanced-settings{min-width:0}.advanced-settings .advanced-probability{margin-top:0;padding:0;border-top:0}.advanced-settings summary{line-height:1.5}.advanced-settings label{font-size:14px}.customise-columns .simple-sector{grid-template-columns:minmax(0,1fr) 74px 30px;gap:6px}.customise-columns .simple-sector label input{padding:8px 6px}.advanced-settings{padding-top:16px;border-top:1px solid #dce6ed}@container(min-width:390px){.customise-columns{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}.advanced-settings{border-top:0;border-left:1px solid #dce6ed;padding-top:0;padding-left:18px}}
.card-device{grid-column:1/-1}.card-name-groups{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0}.colour-groups{grid-template-columns:repeat(2,minmax(0,1fr))}.suit-column{padding:14px;border-radius:12px;min-width:0}.red-suit{background:#ae2339;color:white}.black-suit{background:#192a39;color:white}.suit-column h3{font-size:16px;margin:0 0 14px}.suit-column h3 span{font-size:22px;vertical-align:middle}.card-name-row{display:flex;align-items:center;gap:8px;margin:8px 0;color:white}.card-name-row>span{font-weight:700;width:34px;flex-shrink:0;font-size:15px}.suit-column input{min-width:0;background:white!important;color:#142e46!important;margin:0!important;font-size:14px;padding:9px!important}.suit-column input::placeholder{color:#647588;opacity:1}@media(max-width:620px){.card-name-groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.suit-column{padding:10px}.suit-column h3{font-size:14px}.card-name-row{gap:4px}.card-name-row>span{width:25px;font-size:14px}}
@media(max-width:760px){main{padding-bottom:310px}}
.sector-identity .inline-rename{flex:1 1 90px;width:90px!important;font-weight:400!important;font-size:14px;padding:6px 7px!important;border:1px solid #c7d8e3!important;border-radius:6px!important;background:#fff!important}.sector-identity>input:not(.inline-rename):not([type=color]){flex:0 1 80px;width:80px!important}.sector-identity{flex-wrap:wrap;column-gap:7px;row-gap:4px}.sector-identity .colour-dot{flex-shrink:0}.sector-identity .inline-rename::placeholder{font-size:12px;color:#607587}
.sector-identity{display:grid;grid-template-columns:24px minmax(24px,65px) minmax(50px,1fr);gap:7px}.sector-identity .inline-rename,.sector-identity>input:not(.inline-rename):not([type=color]){width:100%!important;min-width:0}.sector-identity>strong{overflow-wrap:anywhere}
.poly-die{width:220px;height:220px;filter:drop-shadow(0 5px 4px #173b5720);overflow:visible}
.number{font-size:clamp(32px,4vw,64px);max-width:92%;overflow-wrap:anywhere;text-align:center;line-height:1.15}

/* Shared The Varley Academy home link. */
a.mv-home-link{display:inline-flex;align-items:center;gap:12px;color:#152f40;text-decoration:none;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:18.4px;font-weight:750;letter-spacing:-.035em;line-height:1.25;max-width:100%;min-width:0;}
a.mv-home-link .mv-home-logo{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;background:#152f40;color:#fff;border-radius:10px;font-family:Georgia,serif;font-style:italic;font-size:21.6px;font-weight:400;line-height:1;letter-spacing:0;}
a.mv-home-link .mv-home-label{color:#152f40;min-width:0;}
a.mv-home-link:hover .mv-home-label{text-decoration:underline;text-underline-offset:4px;}
a.mv-home-link:focus-visible{outline:3px solid #176d87;outline-offset:5px;border-radius:4px;}
.mv-tool-label{display:block;margin-top:6px;color:#526775;font:400 14px/1.4 system-ui,sans-serif;}
