/* Design layer for the pre-built wiki pages rendered inside the site layout (.i2-wiki). */
/* Undo the site's CSS reset inside the wiki content so the generator's styles apply as written. */
/* (zero weight, before the generator rules) */
:where(.i2-wiki) :where(p,ul,ol,li,a,img,h1,h2,h3,h4,dl,dd,dt,blockquote,table,th,td,small,strong,code,figure){all:revert}
.i2-wiki{color:var(--fg);font:16px/1.6 Lato,system-ui,-apple-system,"Segoe UI",sans-serif;padding-bottom:2rem}
.i2-wiki .find,.i2-wiki main{margin-left:auto;margin-right:auto}
.i2-wiki>main{flex:1;width:100%}
/* content polish */
.i2-wiki main{max-width:68rem}
.i2-wiki .find{max-width:68rem}
.i2-wiki .find input{padding:.8rem 1rem .8rem 2.6rem;border-radius:6px;background:oklch(0.185 0.01 50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%23d9bf86' stroke-width='2' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat .8rem center;transition:border-color .2s,box-shadow .2s}
.i2-wiki .find input:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 3px oklch(0.85 0.09 80 / 15%)}
.i2-wiki h1{font-size:clamp(1.8rem,3.5vw,2.6rem);text-shadow:0 2px 20px oklch(0.85 0.09 80 / 25%)}
.i2-wiki h2{position:relative;padding-bottom:.4rem}
.i2-wiki h2::after{content:"";position:absolute;left:0;bottom:0;width:3rem;height:2px;background:linear-gradient(90deg,var(--gold),transparent)}
.i2-wiki table{border-radius:6px;overflow:hidden}
.i2-wiki tbody tr{transition:background .15s}
.i2-wiki tbody tr:hover td{background:oklch(0.85 0.09 80 / 7%)}
.i2-wiki th{background:oklch(0.22 0.02 60);position:sticky;top:0}
.i2-wiki img.ico{transition:transform .2s;filter:drop-shadow(0 2px 4px #0008)}
.i2-wiki tr:hover img.ico{transform:scale(1.25)}
/* hero (wiki home + categories) */
.i2-hero{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:10px;margin:1rem 0 1.6rem;min-height:14rem;display:flex;align-items:flex-end;padding:1.6rem;isolation:isolate}
.i2-hero .bg{position:absolute;inset:0;z-index:-2;display:block}
.i2-hero .bg img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s}
.i2-hero .bg img.on{opacity:.55}
.i2-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,oklch(0.155 0.004 160 / 20%),oklch(0.155 0.004 160 / 95%)),linear-gradient(90deg,oklch(0.155 0.004 160 / 90%),transparent)}
.i2-hero h1{margin:0 0 .4rem}
.i2-hero p{margin:0;max-width:40rem;color:var(--fg)}
.i2-hero.small{min-height:9rem}
/* cards with images */
.i2-wiki ul.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:1rem;list-style:none;padding:0}
.i2-wiki ul.cards li{margin:0}
.i2-wiki ul.cards a{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:11rem;height:100%;padding:1rem;border:1px solid var(--line);border-radius:8px;overflow:hidden;text-decoration:none;color:var(--fg);background:var(--card);isolation:isolate;transition:transform .25s,border-color .25s,box-shadow .25s}
.i2-wiki ul.cards a:hover{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 14px 30px -14px oklch(0.85 0.09 80 / 45%)}
.i2-wiki ul.cards a .cbg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;opacity:.35;transition:transform .5s,opacity .3s}
.i2-wiki ul.cards a:hover .cbg{transform:scale(1.08);opacity:.5}
.i2-wiki ul.cards a::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 15%,oklch(0.12 0.005 60 / 95%) 75%)}
.i2-wiki ul.cards a .cico{position:absolute;top:.8rem;right:.8rem;height:4rem;width:auto;max-width:4rem;object-fit:contain;filter:drop-shadow(0 4px 10px #000c);transition:transform .3s}
.i2-wiki ul.cards a:hover .cico{transform:scale(1.15) rotate(-6deg)}
.i2-wiki ul.cards strong{font-family:Cinzel,Georgia,serif;color:var(--gold);font-size:1.05rem;letter-spacing:.04em}
.i2-wiki ul.cards span{display:block;font-size:.85rem;color:var(--muted);margin-top:.25rem}
/* table filter */
.i2-filter{display:flex;gap:.6rem;align-items:center;margin:.4rem 0 .6rem}
.i2-filter input{flex:1;max-width:22rem;padding:.45rem .8rem;font:inherit;font-size:.9rem;color:var(--fg);background:var(--card);border:1px solid var(--line);border-radius:4px}
.i2-filter small{color:var(--muted)}
/* reveal + misc */
.i2-rv{opacity:0;transform:translateY(14px);transition:opacity .5s,transform .5s}
.i2-rv.in{opacity:1;transform:none}
.i2-top{position:fixed;left:1rem;bottom:1rem;z-index:30;width:2.6rem;height:2.6rem;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--gold);cursor:pointer;opacity:0;pointer-events:none;transition:opacity .3s}
.i2-top.on{opacity:1;pointer-events:auto}
/* Entity-first cards: no unrelated map wallpaper. */
.i2-wiki ul.cards a{min-height:12rem;justify-content:flex-start;gap:.25rem}
.i2-wiki ul.cards a::before{display:none}
.i2-wiki ul.cards a .cico{position:static;align-self:center;height:6rem;width:100%;max-width:10rem;object-fit:contain;margin:0 auto .6rem}
.i2-wiki ul.cards a:hover .cico{transform:scale(1.06)}
/* Wiki home: uniform image box per card, mapped by card target. */
.i2-wiki.i2-home ul.cards a .i2-cimg{display:flex;align-items:center;justify-content:center;height:7.5rem;margin:0 0 .6rem;overflow:hidden}
.i2-wiki.i2-home ul.cards a .cico{position:static;align-self:auto;height:auto;width:auto;max-width:100%;max-height:100%;object-fit:contain;margin:0}
.i2-wiki.i2-home ul.cards a .cico.cico-sm{max-width:70%;max-height:70%}
.i2-class-filter{margin:1rem 0 .5rem;color:var(--gold)}
.i2-class-filter select{font:inherit;color:var(--fg);background:var(--card);border:1px solid var(--line);border-radius:4px;padding:.5rem .8rem;min-width:10rem}
.i2-level-source{color:var(--muted);font-size:.85rem}
.i2-hero{border-radius:8px}
@media(prefers-reduced-motion:reduce){.i2-rv{opacity:1;transform:none}.i2-hero img,.i2-wiki ul.cards a,.i2-wiki ul.cards a .cico{transition:none}}
/* Inline item icons (tables, lists): 2.5x the base 1.6em. */
.i2-wiki img.ico{height:4em;width:auto;margin-right:.7em}
.i2-wiki tr:hover img.ico{transform:scale(1.1)}
.i2-wiki .find img.ico{height:1.6em;margin-right:.4em}
@media (max-width:40rem){.i2-wiki img.ico{height:3em;margin-right:.5em}}
.i2-top{--card:oklch(0.185 0.01 50);--gold:oklch(0.85 0.09 80);--line:oklch(0.85 0.09 80 / 35%)}
