.wiw-hero{display:grid;grid-gap:.75rem;gap:.75rem;padding:2.5rem 0 1.25rem;text-align:center;max-width:62ch;margin:0 auto}.wiw-hero h1{font-size:clamp(2rem,5vw,3.1rem);margin:0;line-height:1.08}.wiw-hero .wiw-subtitle{font-size:clamp(1.05rem,2.2vw,1.3rem);color:var(--ink-dim);margin:0 auto;max-width:54ch}.wiw-grid{display:grid;grid-gap:1.25rem;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:1.5rem 0 2.5rem}@media (min-width:1100px){.wiw-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width:680px) and (max-width:1099px){.wiw-grid{grid-template-columns:repeat(2,1fr)}}.wiw-card{display:flex;flex-direction:column;border:1px solid var(--border);border-radius:14px;background:var(--bg-panel);overflow:hidden;text-decoration:none;color:inherit;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;will-change:transform}.wiw-card:focus-visible,.wiw-card:hover{transform:translateY(-6px);border-color:var(--brass);box-shadow:0 12px 30px rgba(0,0,0,.35);outline:none}.wiw-card:focus-visible{box-shadow:0 0 0 2px var(--brass-bright),0 12px 30px rgba(0,0,0,.35)}.wiw-thumb{position:relative;aspect-ratio:16/9;display:grid;place-items:center;font-size:2.6rem;overflow:hidden;background:linear-gradient(135deg,var(--bg-panel-2),var(--bg-panel))}.wiw-thumb-img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;object-position:center;display:block;transition:transform .4s ease}.wiw-card:hover .wiw-thumb-img{transform:scale(1.06)}.wiw-thumb:after{content:"";position:absolute;inset:0;background:radial-gradient(120% 120% at 15% 10%,var(--accent-a),transparent 55%),radial-gradient(120% 120% at 85% 90%,var(--accent-b),transparent 55%);opacity:.55;transition:transform .4s ease,opacity .3s ease}.wiw-card:hover .wiw-thumb:after{transform:scale(1.12);opacity:.8}.wiw-thumb-glyph{position:relative;z-index:1;filter:drop-shadow(0 2px 6px rgba(0,0,0,.4));transition:transform .3s ease}.wiw-card:hover .wiw-thumb-glyph{transform:scale(1.1) translateY(-2px)}[data-accent=chess]{--accent-a:#7c9cff;--accent-b:#3b4d99}[data-accent=engineer]{--accent-a:#43e0c0;--accent-b:#1f7a6b}[data-accent=beginner]{--accent-a:#ffd27c;--accent-b:#b8862f}[data-accent=science]{--accent-a:#c78bff;--accent-b:#6a3b99}[data-accent=student]{--accent-a:#7cffa6;--accent-b:#2f8f57}.wiw-card-body{display:flex;flex-direction:column;gap:.5rem;padding:1.1rem 1.15rem 1.25rem;flex:1 1}.wiw-card-title{margin:0;font-size:1.2rem;line-height:1.2}.wiw-card-subtitle{margin:0;font-weight:600;color:var(--brass-bright);font-size:.92rem}.wiw-card-desc{margin:0;color:var(--ink-dim);font-size:.92rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}.wiw-card-cta{margin-top:auto;padding-top:.6rem;font-weight:700;color:var(--brass);display:inline-flex;align-items:center;gap:.35rem}.wiw-card-cta .wiw-arrow{transition:transform .2s ease}.wiw-card:hover .wiw-card-cta .wiw-arrow{transform:translateX(4px)}.wiw-explain{max-width:68ch;margin:0 auto}.wiw-explain-hero{display:grid;grid-gap:.6rem;gap:.6rem;padding:1.5rem 0 .5rem}.wiw-explain-hero h1{font-size:clamp(1.7rem,4vw,2.6rem);margin:0;line-height:1.12}.wiw-explain-intro{font-size:1.2rem;color:var(--ink-dim);margin:.25rem 0 0}.wiw-explain-body p{font-size:1.05rem;line-height:1.65;margin:.85rem 0}.wiw-explain-body ul{margin:.5rem 0 1rem;padding-left:1.3rem;display:grid;grid-gap:.3rem;gap:.3rem}.wiw-explain-body ul li{font-size:1.05rem;line-height:1.5}.wiw-back{display:inline-flex;align-items:center;gap:.35rem;margin:1rem 0 .5rem;color:var(--ink-dim);text-decoration:none;font-size:.9rem}.wiw-back:hover{color:var(--brass)}.wiw-reel{margin:1.25rem 0 1.75rem;border:1px solid var(--border);border-radius:16px;padding:1.1rem 1.1rem 1.25rem;background:radial-gradient(130% 130% at 15% 0,var(--accent-a),transparent 60%),radial-gradient(130% 130% at 85% 100%,var(--accent-b),transparent 60%),var(--bg-panel)}.wiw-reel-stage{aspect-ratio:16/10;max-width:420px;margin:0 auto;display:grid;place-items:center}.wiw-diagram{width:100%;height:100%}.wiw-diagram-grid line{stroke:var(--border);stroke-width:.4;opacity:.5}.wiw-diagram-link{stroke:var(--brass);stroke-width:1.6;fill:none;transition:opacity .5s ease,stroke-dashoffset .7s ease}.wiw-diagram-cut{transition:opacity .3s ease}.wiw-diagram-cut line{stroke:var(--danger);stroke-width:1.4;stroke-linecap:round}.wiw-diagram-piece{transition:opacity .5s ease,filter .5s ease,transform .5s ease;filter:drop-shadow(0 1px 2px rgba(0,0,0,.35))}.wiw-diagram-piece--severed{filter:grayscale(1) brightness(.7) drop-shadow(0 1px 2px rgba(0,0,0,.35));opacity:.55!important}.wiw-diagram-piece--removed{filter:grayscale(1) drop-shadow(0 1px 2px rgba(0,0,0,.35));transform:scale(.72);transform-box:fill-box;transform-origin:center}.wiw-diagram-ring{fill:none;stroke:var(--brass-bright);stroke-width:1;stroke-dasharray:2.2 2.2;opacity:.85;transform-origin:center;animation:wiw-spin 6s linear infinite}.wiw-diagram-block{fill:var(--bg-panel-2);stroke:var(--brass);stroke-width:1.6;transition:x .6s cubic-bezier(.34,1.4,.64,1),y .6s cubic-bezier(.34,1.4,.64,1),opacity .5s ease,fill .5s ease}.wiw-diagram-block--outline{fill:none;stroke:var(--ink-dim);stroke-dasharray:3 3}@keyframes wiw-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.wiw-reel-caption{text-align:center;min-height:3.2rem;margin-top:.4rem}.wiw-reel-caption-title{margin:0;font-weight:700;color:var(--brass-bright);font-size:1rem}.wiw-reel-caption-text{margin:.2rem 0 0;color:var(--ink-dim);font-size:.92rem}.wiw-reel-controls{display:flex;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap;margin-top:.75rem}.wiw-reel-navbtn,.wiw-reel-playbtn{border:1px solid var(--border-strong);background:var(--bg-panel-2);color:var(--ink);border-radius:8px;padding:.35rem .6rem;font-size:.85rem;cursor:pointer}.wiw-reel-playbtn{font-weight:700;padding:.35rem .9rem}.wiw-reel-navbtn:hover:not(:disabled),.wiw-reel-playbtn:hover{border-color:var(--brass);color:var(--brass-bright)}.wiw-reel-navbtn:disabled{opacity:.4;cursor:default}.wiw-reel-dots{display:flex;gap:.35rem;margin-left:.25rem}.wiw-reel-dot{width:9px;height:9px;border-radius:50%;border:1px solid var(--border-strong);background:transparent;padding:0;cursor:pointer}.wiw-reel-dot.is-active{background:var(--brass);border-color:var(--brass)}.wiw-reel-note{text-align:center;margin:.6rem 0 0;font-size:.78rem;color:var(--ink-dim)}.wiw-ready{margin:2.5rem auto 1rem;max-width:68ch;text-align:center;border:1px solid var(--border);border-radius:16px;padding:2rem 1.5rem;background:radial-gradient(140% 120% at 50% 0,var(--bg-panel-2),var(--bg-panel))}.wiw-ready h2{margin:0 0 .6rem;font-size:clamp(1.4rem,3vw,2rem)}.wiw-ready p{margin:.2rem 0;color:var(--ink-dim)}.wiw-ready-actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap;margin-top:1.25rem}@media (prefers-reduced-motion:reduce){.wiw-card,.wiw-card-cta .wiw-arrow,.wiw-thumb-glyph,.wiw-thumb:after{transition:none}.wiw-card:hover{transform:none}.wiw-diagram-block,.wiw-diagram-link,.wiw-diagram-piece{transition:none}.wiw-diagram-ring{animation:none}}