.ql-play{flex-direction:column;align-items:center;gap:12px;width:100%;max-width:560px;margin:0 auto;display:flex}.ql-letter{border:2px solid var(--ink);border-radius:var(--radius);background:var(--surface);width:96px;height:96px;box-shadow:var(--shadow);place-items:center;display:grid}.ql-letter b{font-family:var(--f-display);color:var(--accent);font-size:64px;line-height:1}.ql-head{z-index:2;background:var(--surface);justify-content:center;align-items:center;gap:20px;width:100%;padding:6px 0;display:flex;position:sticky;top:0}.ql-play .ql-head{background:var(--ground)}.ql-low{color:var(--bad)}.ql-list{flex-direction:column;align-items:center;gap:12px;width:100%;display:flex}.ql-list ol{counter-reset:ql;flex-direction:column;gap:10px;width:100%;margin:0;padding:0;list-style:none;display:flex}.ql-list li{counter-increment:ql;text-align:left;flex-direction:column;gap:3px;display:flex}.ql-list label{font-size:15px;font-weight:700}.ql-list label:before{content:counter(ql)". ";font-family:var(--f-mono);color:var(--muted);font-weight:400}.ql-list .input{width:100%}.ql-list .input.ql-bad{border-color:var(--bad)}.ql-warn{color:var(--bad);font-size:12px}.ql-review{width:100%}.ql-cat{font-family:var(--f-display);color:var(--accent);font-size:28px;line-height:1.1}.ql-rows{text-align:left;flex-direction:column;gap:6px;width:100%;margin:0;padding:0;list-style:none;display:flex}.ql-rows li{border:1.5px solid var(--line);border-radius:var(--radius);background:var(--surface);grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"who x""ans x""cell x";align-items:center;column-gap:10px;padding:8px 10px;display:grid}.ql-who{color:var(--muted);grid-area:who;font-size:13px}.ql-ans{font-family:var(--f-word);overflow-wrap:anywhere;grid-area:ans;font-size:18px}.ql-cell{font-family:var(--f-mono);color:var(--muted);grid-area:cell;font-size:12px}.ql-x{grid-area:x}.ql-rows li.ql-ok{border-color:var(--good)}.ql-rows li.ql-ok .ql-cell{color:var(--good)}.ql-rows li.ql-struck .ql-ans,.ql-rows li.ql-letter .ql-ans{color:var(--muted);text-decoration:line-through}.ql-rows li.ql-same .ql-cell,.ql-rows li.ql-struck .ql-cell,.ql-rows li.ql-letter .ql-cell{color:var(--bad)}.ql-note{margin:0;font-size:13px}.ql-cats{text-align:left;flex-direction:column;gap:4px;margin:0;padding-left:1.4em;display:flex}@media (max-width:420px){.ql-letter{width:76px;height:76px}.ql-letter b{font-size:50px}.ql-cat{font-size:24px}}