/* Numbers in Order: the wax tablet (shared look in brain-kit.css) */
.nio-stage{position:relative}
.nio-tab{--c:8;--r:5;position:relative;aspect-ratio:var(--c)/var(--r);width:min(100cqw,calc(100cqh * var(--c) / var(--r)));max-height:100%;box-sizing:border-box;
  display:grid;grid-template-columns:repeat(var(--c),1fr);grid-template-rows:repeat(var(--r),1fr);gap:1.4%;padding:2.2%;
  border:clamp(7px,2.2cqmin,14px) solid #7b4f2b;border-radius:10px;
  background:radial-gradient(ellipse at 40% 35%,#4a3524 0,#35251a 60%,#2a1d14 100%);
  box-shadow:inset 0 0 0 2px #5e3b1f,inset 0 3px 14px rgba(0,0,0,.55),0 5px 16px rgba(0,0,0,.25);
  border-image:linear-gradient(135deg,#9a6a3c,#6e4422 40%,#8a5b31 70%,#5b3820) 1}
.nio-cell{display:block}
.nio-sq{position:relative;border:0;margin:0;padding:0;border-radius:6%;background:transparent;color:#f3e3bf;cursor:pointer;-webkit-tap-highlight-color:transparent;
  display:grid;place-items:center;container-type:size;min-width:0;min-height:0;touch-action:manipulation}
.nio-n{font:700 62cqmin/1 Georgia,"Gentium Book Plus",serif;letter-spacing:-.02em;text-shadow:0 1px 0 rgba(0,0,0,.6),0 -1px 0 rgba(255,240,200,.15)}
.nio-n.l2{font-size:46cqmin}.nio-n.l3{font-size:34cqmin}
.nio-tab.wait .nio-sq{visibility:hidden}
.nio-tab.show .nio-sq{background:rgba(0,0,0,.18);box-shadow:inset 0 1px 3px rgba(0,0,0,.5)}
.nio-tab.masked .nio-sq,.nio-tab.reveal .nio-sq{background:linear-gradient(160deg,#fbf8f1,#e9e3d6);box-shadow:0 2px 0 #b9ad97,0 3px 6px rgba(0,0,0,.35)}
.nio-tab.masked .nio-sq .nio-n{visibility:hidden}
.nio-tab.reveal .nio-sq{color:#3a2a1c}.nio-tab.reveal .nio-n{text-shadow:none}
.nio-tab .nio-sq.done{background:rgba(216,184,96,.16) !important;box-shadow:inset 0 0 0 2px rgba(216,184,96,.55) !important;color:#d8b860;cursor:default}
.nio-tab .nio-sq.done .nio-n{visibility:visible;opacity:.75;text-shadow:none}
.nio-tab .nio-sq.wrong{background:#8f2b40 !important;color:#fff;box-shadow:0 0 0 3px #fff,0 0 0 6px #8f2b40 !important}
.nio-tab .nio-sq.wrong .nio-n{visibility:visible}
.nio-tab .nio-sq.wrong::after{content:"✗";position:absolute;right:4%;top:0;font:700 30cqmin/1 system-ui,sans-serif;color:#fff}
.nio-tab .nio-sq:focus-visible{outline:3px solid #ffd479;outline-offset:1px}
.nio-ready{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;width:min(92%,22rem);pointer-events:none}
.nio-show{pointer-events:auto;min-width:9rem;min-height:52px;font-size:1.15rem;border-radius:999px;box-shadow:0 0 0 4px rgba(255,212,121,.35),0 6px 18px rgba(0,0,0,.35)}
.nio-next{margin:0;padding:.3rem .7rem;border-radius:8px;background:rgba(20,14,9,.72);color:#f3e3bf;font-size:.85rem;text-align:center;line-height:1.3}
.nio-next b{color:#ffd479}
.nio-tw{overflow-x:auto}
.nio-rec{border-collapse:collapse;font-size:.85rem;margin:.4rem 0;min-width:100%}
.nio-rec th,.nio-rec td{border:1px solid var(--line);padding:.25rem .4rem;text-align:center;white-space:nowrap}
.nio-rec td small{display:block;font-size:.68rem;color:var(--muted)}
.nio-bars{text-align:left;margin:.5rem 0}
.nio-br{display:grid;grid-template-columns:1fr auto;gap:.1rem .5rem;align-items:center;margin:.35rem 0;font-size:.85rem}
.nio-br span{grid-column:1/-1}
.nio-br i{display:block;height:12px;border-radius:6px;background:var(--line);overflow:hidden}
.nio-br i b{display:block;height:100%;background:var(--gold)}
.nio-br em{font-style:normal;font-weight:700;min-width:5.5rem;text-align:right}
.nio-about{max-width:640px;text-align:left;user-select:text;-webkit-user-select:text}
.nio-about h2{text-align:center}.nio-about h3{font:700 1.05rem Georgia,serif;margin:.9rem 0 .3rem;color:var(--g)}
.nio-about p,.nio-about li{font-size:.92rem;line-height:1.5}
.nio-about ol{padding-left:1.2rem}
/* the article under the game */
.nio-study{max-width:760px;margin:1.6rem auto 0;line-height:1.6}
.nio-study h2{font:700 1.45rem Georgia,serif;margin:.4rem 0 .5rem}
.nio-study h3{font:700 1.1rem Georgia,serif;margin:1.1rem 0 .3rem}
.nio-study .src{font-size:.88rem}
.nio-study .src li{margin:.3rem 0}
.nio-about a{color:var(--g);text-decoration:underline;text-underline-offset:2px;word-break:break-word}
.nio-link{border:0;background:none;padding:0;font:inherit;color:var(--g);text-decoration:underline;text-underline-offset:2px;cursor:pointer;font-weight:600}
.nio-study p{margin:.6rem 0}
.nio-study ul{padding-left:1.3rem;margin:.4rem 0}.nio-study li{margin:.3rem 0}
.nio-study a{color:inherit;text-decoration:underline;text-underline-offset:2px;word-break:break-word}