/* The OliMatica wiki (olimatica/wiki/, content/olimatica_wiki.py): its home (where to start, every page) and its pages,
   over the OliMatica page's look (olimatica.css: the hero). */
.wk{max-width:1000px}
.wk,.wk *{font-variant-ligatures:none!important}   /* Pixelify Sans joins f and i (first) into one odd letter: !important, the font shorthands put it back */
.wkhero{margin-bottom:6px}

.wkstart{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.wkstart a,.wkcard{background:var(--panel);border:1px solid var(--line);border-radius:12px;color:var(--text);transition:transform .12s,border-color .12s}
.wkstart a:hover,.wkcard:hover{transform:translateY(-2px);border-color:var(--edge);text-decoration:none}
.wkstart a{display:flex;flex-direction:column;gap:6px;padding:16px 18px}
.wkstart span,.wksteps span,.wkkick{font:800 11px Inter,sans-serif;letter-spacing:.14em;color:var(--red2)}
.wkstart .ico{width:26px;height:26px;color:var(--red2)}
.wkstart b{font:500 19px var(--px)}.wkstart small{color:var(--soft);font-size:13px}
.wkcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.wkcard{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;row-gap:2px;align-items:center;padding:14px 16px}
.wkcard .ico{grid-row:span 2;width:28px;height:28px;color:var(--red2)}
.wkcard b{font:500 17px var(--px)}.wkcard span{color:var(--muted);font-size:13px;line-height:1.45}

/* a page */
.wkpage{max-width:820px}
.wkhead{display:flex;align-items:center;gap:16px;margin:6px 0 4px}
.wkico{flex:none;display:grid;place-items:center;width:58px;height:58px;background:var(--glow);border:1px solid var(--edge);border-radius:14px}
.wkico .ico{width:30px;height:30px;color:var(--red2)}
.wkhead h1{font-size:38px;line-height:1.1;margin:2px 0 0}
.wklead{margin:4px 0 0;color:var(--soft);font-size:16px}
.wktoc{display:flex;flex-wrap:wrap;gap:6px;margin:18px 0 4px;padding:10px 12px;background:var(--bg2);border:1px solid var(--line);border-radius:10px}
.wktoc b{width:100%;font:700 10px Inter,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.wktoc a{padding:3px 10px;border:1px solid var(--line);border-radius:999px;color:var(--soft);font-size:13px;background:var(--panel)}
.wktoc a:hover{border-color:var(--edge);color:var(--text);text-decoration:none}
.wkpage section{scroll-margin-top:76px}
.wkpage h2{display:flex;align-items:center;gap:12px;font-size:22px;margin:30px 0 8px}
.wkpage h2:before{content:"";flex:none;width:9px;height:9px;margin-left:6px;background:var(--red);box-shadow:-6px -6px 0 -2px var(--text)}
.wkpage p,.wkpage li{color:var(--soft);font-size:15px}.wkpage p{margin:8px 0}
.wkpage ul{margin:6px 0;padding-left:4px;list-style:none}
.wkpage ul li{position:relative;padding-left:20px;margin:6px 0}
.wkpage ul li:before{content:"";position:absolute;left:3px;top:.62em;width:6px;height:6px;background:var(--red)}
.wkpage section a{text-decoration:underline;text-underline-offset:2px}
.wkpage section b{color:var(--text);font-weight:600}
.wkpage kbd{font:600 12px Inter,sans-serif;color:var(--text);background:var(--panel2);border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;padding:1px 6px}
.wksteps{list-style:none;margin:10px 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.wksteps li{margin:0;padding:14px 16px;background:var(--panel);border:1px solid var(--line);border-radius:12px}
.wksteps h3{margin:4px 0;font-size:19px}.wksteps p{margin:0;font-size:14px}
.wktable{overflow-x:auto;margin:10px 0;border:1px solid var(--line);border-radius:10px}
.wktable table{width:100%;border-collapse:collapse;font-size:14px}
.wktable th{text-align:left;font:700 11px Inter,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);background:var(--bg2);padding:9px 12px;border-bottom:1px solid var(--line)}
.wktable td{padding:9px 12px;border-bottom:1px solid var(--line);color:var(--soft);vertical-align:top}
.wktable tr:last-child td{border-bottom:0}
.wktable td:first-child{color:var(--text);font-weight:600;white-space:nowrap}
.wktip,.wkwarn{display:flex;gap:10px;align-items:baseline;padding:11px 14px;border:1px solid var(--line);border-radius:10px;background:var(--panel)}
.wktip{border-left:3px solid #3ec46d}.wkwarn{border-left:3px solid var(--red)}
.wkpage .wktip b,.wkpage .wkwarn b{flex:none;font:800 11px Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase}
.wkpage .wktip b{color:#3ec46d}.wkpage .wkwarn b{color:var(--red2)}
.wknav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:36px}
.wknav a{display:flex;flex-direction:column;padding:12px 16px;background:var(--panel);border:1px solid var(--line);border-radius:12px;color:var(--text);font:500 17px var(--px)}
.wknav a:hover{border-color:var(--edge);text-decoration:none}
.wknav small{font:700 10px Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.wknav .next{grid-column:2;text-align:right}
.wkback{margin-top:16px;color:var(--muted)}.wkback a{display:inline-flex;align-items:center;gap:6px}.wkback .ico{width:14px;height:14px}
@media (max-width:820px){.wkstart,.wksteps{grid-template-columns:1fr}.wkhead h1{font-size:30px}
.wknav{grid-template-columns:1fr}.wknav .next{grid-column:1}}
/* captures of the game (tools/build.py game_figure): one with its caption, or several taking turns with a button each */
.wkfig{margin:14px 0}
.wkfig .cbox{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:radial-gradient(ellipse at 50% 75%,#3a0a10 0,#0b0b0d 75%)}
.wkfig figcaption{margin-top:7px;color:var(--muted);font-size:13px}
.cchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.cchips button{font:600 12.5px/1 Inter,sans-serif;color:var(--soft);background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:7px 12px;cursor:pointer}
.cchips button.on{color:#fff;background:var(--red);border-color:var(--red)}
.wkstepfig{margin:-14px -16px 12px}.wkstepfig .cbox{border:0;border-bottom:1px solid var(--line);border-radius:12px 12px 0 0}.wkstepfig figcaption{display:none}
.wksteps li{overflow:hidden}
