/* ---------- decipher ---------- */
.dcb{width:min(100%,1100px);--u:clamp(21px,min(6.6vw,4.6dvh),64px);display:flex;flex-wrap:wrap;gap:calc(var(--u) * .5) calc(var(--u) * 1.15);justify-content:center;padding:6px 0 4px;user-select:none}
.dcb .w{display:flex;gap:calc(var(--u) * .1)}
.dcb .lt{width:calc(var(--u) * .78);display:flex;flex-direction:column;align-items:center;gap:2px;border:0;background:transparent;padding:0;border-radius:6px}
.dcb .lt .g{width:100%;height:calc(var(--u) * 1.3);display:grid;place-items:center;border-bottom:2px solid var(--tan);font-family:var(--display);font-weight:700;font-size:calc(var(--u) * .84);border-radius:4px 4px 0 0}
.dcb .lt .c{font-size:calc(var(--u) * .48);font-weight:600;color:var(--muted)}
.dcb .lt.solved .g{border-bottom-color:var(--line);color:var(--pc,var(--ink))}
.dcb .lt.solved .c{opacity:.45}
.dcb .lt.given .g{color:var(--ink)}
.dcb .lt.same .g{background:var(--you-soft);border-bottom-color:var(--you)}
.dcb .lt.cur .g{background:var(--you);color:var(--amber-ink)}
.dcb .lt.psel .g{box-shadow:0 0 0 2px var(--ps)}
.dcb .lt.shake{animation:shake .32s}
.dcb .p{margin-left:calc(var(--u) * -.04);font-family:var(--display);font-weight:700;font-size:calc(var(--u) * .84);align-self:flex-start;padding-top:2px}
.stats{display:flex;gap:16px;justify-content:center;font-size:14px;color:var(--muted)}
.stats b{color:var(--ink);font-variant-numeric:tabular-nums}
#dcstars{color:var(--amber)}
.kb{display:flex;flex-direction:column;gap:6px;width:min(100%,max(320px,calc(100dvh * .7)),900px);margin:0 auto}
.kb .kr{display:flex;gap:4px;justify-content:center}
.kb button{flex:1;height:clamp(48px,6dvh,76px);border:1px solid var(--line);border-radius:7px;background:var(--raise);font-weight:600;font-size:clamp(17px,2.4dvh,28px);font-family:var(--display);padding:0;color:var(--ink)}
.kb button.used{opacity:.25}
.kb button.wide{white-space:nowrap;flex:1.6;font-size:clamp(14px,1.8dvh,20px);font-family:var(--body)}

.dcb .dcbr{flex-basis:100%;height:calc(var(--u) * .25)}
/* Long quotes get smaller tiles so the whole puzzle, author line included, fits on one screen. */
.dcb[data-size="m"]{--u:clamp(19px,min(6.2vw,4.1dvh),58px)}
.dcb[data-size="l"]{--u:clamp(15px,min(5vw,3.4dvh),52px)}
.dcb[data-size="xl"]{--u:clamp(14px,min(4.55vw,3dvh),46px)}