/* Cryptogram helper (T6): reči od polja (upis gore, šifrovano slovo dole), upozorenja, saveti, učestalost. Okvir calc.css + unscrambler polja. */
.unsfield{display:grid;gap:6px;font-weight:700;color:var(--cream)}
.unsfield small{font-weight:500;color:var(--cream-3)}
#crtext{border-radius:12px;border:1px solid rgba(120,80,30,.4);background:#fffaf0;color:var(--ink);font:700 20px/1.5 var(--sans);letter-spacing:.06em;padding:10px 14px;text-transform:uppercase;width:100%;box-sizing:border-box}
#crtext:focus{outline:3px solid var(--brass-hi);outline-offset:1px}
.crboard{display:flex;flex-wrap:wrap;gap:14px 18px;background:#fffdf7;border-radius:12px;padding:14px}
.crw{display:inline-flex;gap:3px;align-items:flex-end}
.crc{display:inline-flex;flex-direction:column;align-items:center;gap:2px}
.crc input{width:30px;height:36px;border:0;border-bottom:2px solid #1a1a1a;background:transparent;color:#1d4f9a;font:800 22px/1 var(--sans);text-align:center;text-transform:uppercase;padding:0;border-radius:0}
.crc input:focus{outline:3px solid #c08a10;outline-offset:1px;background:#fff3cf}
.crc i{font:600 14px var(--sans);font-style:normal;color:#5f5a52}
.crc.lit input{background:#f6dc92}
.crc.bad input{color:#a3241c;background:#f7c9c3}
.crp{font:800 22px var(--sans);color:#1a1a1a;padding-bottom:18px}
.result h3{font:700 18px var(--serif);margin:14px 0 6px;color:#1a1a1a}
.result h3:first-child{margin-top:0}
.crplain{font:700 19px/1.5 var(--sans);letter-spacing:.08em;word-break:break-word;margin:0}
.crwarn{margin:0 0 6px;padding:10px 14px 10px 30px !important;list-style:disc !important;background:#f7c9c3;border-radius:10px}
.crwarn li{display:list-item !important;border:0 !important;padding:2px 0 !important;color:#6b130e;font-weight:600}
.crtips li{display:block !important;border:0 !important;padding:3px 0 !important}
.crtip{width:100%;text-align:left;min-height:44px;border-radius:10px;border:1px solid #e3dccb;background:#f5f0e2;color:#1a1a1a;font:500 16px/1.4 var(--sans);padding:8px 12px;cursor:pointer}
.crtip:hover,.crtip:focus-visible{background:#f6dc92;outline:none}
.crfreq{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.crfreq span{display:inline-flex;align-items:baseline;gap:3px;padding:4px 8px;border-radius:8px;background:#efe8d6;font:800 16px var(--sans)}
.crfreq small{font:500 12px var(--sans);color:#555}
.crfreq b{color:#1d4f9a;margin-left:2px}