/* Complete de Seure key; inherits the site's type, blue and rules. */
.cipher-key{--key-body-size:18px;margin:0;max-width:100%;color:var(--ink)}
.key-glyph{position:relative;display:inline-block;flex:none;overflow:hidden;font-size:var(--key-body-size);vertical-align:middle}
.cipher-key .key-glyph img{position:absolute;display:block;max-width:none;object-fit:fill;margin:0}
.cipher-key h3{font:400 1.2rem/1.35 Cochin,Palatino,Georgia,serif;margin:28px 0 16px}
.cipher-key h3:first-child{margin-top:0}
.key-names-note{font-size:.95rem;line-height:1.5;color:var(--muted);max-width:48rem;margin:0 0 20px}.compact-key .key-names-note{font-size:.8rem}
.key-values{display:grid;gap:18px 16px;margin:0;padding:0;align-items:start}
.key-values>div{min-width:0;text-align:center;break-inside:avoid;padding:10px 4px 12px}
.key-separator{display:block;flex:none;width:1px;height:36px;background:var(--line)}
.key-values dt{margin:0;display:flex;align-items:center;justify-content:center;gap:clamp(5px,.9vw,9px);min-height:90px}
.key-values dd{font:400 1.12rem/1.3 Cochin,Palatino,Georgia,serif;color:var(--blue);margin:5px 0 0;overflow-wrap:normal}
.key-letters{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.key-letters dd{font-size:1.35rem}
.key-short{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.key-words{grid-template-columns:repeat(auto-fit,minmax(126px,1fr))}
.key-null-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(84px,1fr));gap:12px;list-style:none;margin:0;padding:0}
.key-null-list li{display:flex;align-items:center;justify-content:center;min-width:0;min-height:90px}
.cipher-key .key-note{font:400 1rem/1.5 Cochin,Palatino,Georgia,serif;color:var(--muted);margin:14px 0 0;max-width:44rem}
.key-specials{display:flex;flex-wrap:wrap;gap:36px 72px;margin-top:26px;align-items:start}
.key-specials section{flex:0 1 auto}.key-specials h3{margin-top:0}
.key-specials .key-note{margin-top:8px;max-width:19rem}
.key-possible{max-width:126px;margin-top:22px}
.key-uncertain{white-space:nowrap}
.cipher-key:target{scroll-margin-top:24px}
#key{scroll-margin-top:24px}
.cipher-key .key-specials .key-glyph{margin:8px 0}
@media(max-width:700px){.cipher-key{--key-body-size:16px}.key-values{column-gap:10px}.key-letters{grid-template-columns:repeat(2,minmax(0,1fr))}.key-short{grid-template-columns:repeat(2,minmax(0,1fr))}.key-words{grid-template-columns:repeat(2,minmax(0,1fr))}.key-null-list{grid-template-columns:repeat(3,minmax(0,1fr))}.key-specials{gap:24px 40px}}
@media(max-width:359px){.key-letters,.key-short{grid-template-columns:1fr}}
/* The decryption page keeps the full key in a compact, wrapping strip. */
.compact-key.showcase-section{margin:24px 0 32px;padding:20px 0}
.compact-key>summary{font-size:1.2rem;color:var(--blue);cursor:pointer}
.compact-key[open]>summary{margin-bottom:16px}
.compact-key h2{font-size:1.2rem;margin:0 0 16px}
.compact-key .cipher-key{--key-body-size:8.5px}
.compact-key .cipher-key h3{font-size:.9rem;margin:16px 0 8px}
.compact-key .key-values{display:flex;flex-wrap:wrap;gap:8px 18px}
.compact-key .key-values>div{flex:0 0 auto;min-width:30px;padding:0}
.compact-key .key-values dt{min-height:40px;gap:4px}
.compact-key .key-values dd{font-size:.8rem;margin-top:4px}
.compact-key .key-separator{height:22px}
.compact-key .key-possible{margin-top:8px}
.compact-key .key-null-list{display:flex;flex-wrap:wrap;gap:8px 18px}
.compact-key .key-null-list li{min-height:40px}
.compact-key .key-specials{margin-top:16px;gap:16px}
.compact-key .key-specials .key-glyph{margin:0}
@media print{.cipher-key{--key-body-size:12px;print-color-adjust:exact}.cipher-key h3{break-after:avoid}.key-values>div,.key-null-list li{break-inside:avoid}.key-values{gap:12px}.key-letters{grid-template-columns:repeat(5,minmax(0,1fr))}.key-short{grid-template-columns:repeat(5,minmax(0,1fr))}.key-words{grid-template-columns:repeat(6,minmax(0,1fr))}.key-null-list{grid-template-columns:repeat(12,minmax(0,1fr))}}
