/* Woordzoeker Suite */
.wz-wrap, .wz-maker, .wz-solver { --wz-accent:#2563eb; --wz-accent2:#16a34a; --wz-ink:#1e293b; --wz-line:#e2e8f0; }

.wz-puzzle, .wz-maker-root, .wz-solver-root { margin: 1.5rem 0; }
.wz-wrap { display:flex; gap:1.5rem; flex-wrap:wrap; align-items:flex-start; }

/* Board */
.wz-board { position:relative; flex:1 1 320px; min-width:280px; max-width:560px; }
.wz-grid {
  display:grid; gap:2px; background:var(--wz-line); border:2px solid var(--wz-line);
  border-radius:10px; padding:6px; user-select:none; touch-action:none;
}
.wz-cell {
  aspect-ratio:1/1; display:flex; align-items:center; justify-content:center;
  background:#fff; border:0; border-radius:4px; cursor:pointer;
  font-weight:700; font-size:clamp(11px, 2.4vw, 20px); color:var(--wz-ink);
  font-family: ui-monospace, "Courier New", monospace; line-height:1; padding:0;
  transition:background .08s;
}
.wz-cell:hover { background:#eff6ff; }
.wz-cell.wz-sel { background:#bfdbfe; color:#1e3a8a; }
.wz-cell.wz-found { background:#bbf7d0; color:#14532d; }
.wz-cell.wz-hintcell { animation: wz-pulse .7s ease-in-out 2; background:#fde68a; }
@keyframes wz-pulse { 50% { transform:scale(1.12); background:#fbbf24; } }

.wz-overlay { position:absolute; inset:6px; width:calc(100% - 12px); height:calc(100% - 12px); pointer-events:none; z-index:2; }
.wz-mark { stroke:rgba(37,99,235,.35); stroke-width:.7; stroke-linecap:round; }

/* Static (print) board */
.wz-static .wz-grid { gap:0; background:#fff; }
.wz-static .wz-cell { border:1px solid #cbd5e1; border-radius:0; cursor:default; }
.wz-static .wz-cell.wz-found { background:#fde68a; }

/* Side panel */
.wz-side { flex:1 1 200px; min-width:200px; }
.wz-stats { display:flex; justify-content:space-between; align-items:center; margin-bottom:.6rem; font-size:1.1rem; }
.wz-timer { font-variant-numeric:tabular-nums; font-weight:700; color:var(--wz-accent); }
.wz-progress strong { color:var(--wz-accent2); }
.wz-words { list-style:none; padding:0; margin:0 0 1rem; columns:2; column-gap:1rem; }
.wz-words li { padding:.15rem 0; font-weight:600; text-transform:uppercase; letter-spacing:.5px; font-size:.95rem; break-inside:avoid; }
.wz-words li.wz-done { text-decoration:line-through; color:#94a3b8; }
.wz-words li.wz-miss { color:#dc2626; }
.wz-words-print { columns:3; }

.wz-actions { display:flex; gap:.5rem; flex-wrap:wrap; }
.wz-btn {
  cursor:pointer; border:1px solid var(--wz-line); background:#fff; color:var(--wz-ink);
  padding:.5rem .85rem; border-radius:8px; font-weight:600; font-size:.95rem;
}
.wz-btn:hover { background:#f1f5f9; }
.wz-btn-primary { background:var(--wz-accent); color:#fff; border-color:var(--wz-accent); }
.wz-btn-primary:hover { background:#1d4ed8; }
.wz-win { background:#dcfce7; border:1px solid #86efac; color:#14532d; padding:.7rem .9rem; border-radius:8px; margin-bottom:.8rem; }

/* Maker / Solver forms */
.wz-maker-form { display:flex; flex-direction:column; gap:.8rem; max-width:640px; }
.wz-maker-form label { display:flex; flex-direction:column; font-weight:600; gap:.3rem; }
.wz-maker-form input[type=text], .wz-maker-form textarea, .wz-maker-form select {
  font:inherit; padding:.55rem .7rem; border:1px solid #cbd5e1; border-radius:8px; width:100%;
}
.wz-m-opts { display:flex; gap:1.2rem; flex-wrap:wrap; align-items:center; }
.wz-check { flex-direction:row !important; align-items:center; gap:.4rem !important; font-weight:600; }
.wz-check input { width:auto; }
.wz-note { color:#64748b; font-size:.92rem; }
.wz-sheet-title { margin:.5rem 0; }
.wz-maker-out, .wz-solver-out { margin-top:1.2rem; }
.wz-maker-out .wz-board, .wz-solver-out .wz-board { max-width:520px; }

/* Mobile */
@media (max-width:600px) {
  .wz-wrap { gap:1rem; }
  .wz-words { columns:2; }
}

/* Breadcrumbs */
.wz-breadcrumbs { font-size:.9rem; margin:0 0 1rem; }
.wz-breadcrumbs ol { list-style:none; display:flex; flex-wrap:wrap; gap:.3rem; padding:0; margin:0; }
.wz-breadcrumbs li:not(:last-child)::after { content:"›"; margin-left:.4rem; color:#94a3b8; }
.wz-breadcrumbs a { color:#2563eb; text-decoration:none; }
.wz-breadcrumbs a:hover { text-decoration:underline; }
.wz-breadcrumbs [aria-current="page"] { color:#64748b; }

/* Cards / hub grid */
.wz-cards { display:grid; grid-template-columns:repeat(auto-fill, minmax(160px,1fr)); gap:1rem; margin:1.5rem 0; }
.wz-card {
  display:flex; flex-direction:column; gap:.25rem; text-decoration:none; color:#1e293b;
  border:1px solid #e2e8f0; border-radius:12px; padding:1rem; background:#fff; transition:.15s;
}
.wz-card:hover { border-color:#93c5fd; box-shadow:0 6px 18px rgba(37,99,235,.12); transform:translateY(-2px); }
.wz-card-emoji { font-size:1.8rem; line-height:1; }
.wz-card strong { font-size:1.02rem; }
.wz-card span { color:#64748b; font-size:.85rem; }

/* Related */
.wz-related { margin:2rem 0 0; padding:1.2rem 1.4rem; background:#f8fafc; border-radius:12px; }
.wz-related h2 { margin:0 0 .6rem; font-size:1.15rem; }
.wz-related ul { list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:.5rem .9rem; }
.wz-related a { color:#2563eb; text-decoration:none; font-weight:600; }
.wz-related a:hover { text-decoration:underline; }

/* Lead + FAQ */
.wz-lead { font-size:1.15rem; color:#475569; }
.wz-faq { margin:1rem 0; }
.wz-faq details { border:1px solid #e2e8f0; border-radius:10px; padding:.2rem .9rem; margin-bottom:.6rem; background:#fff; }
.wz-faq summary { cursor:pointer; font-weight:700; padding:.7rem 0; list-style:none; }
.wz-faq summary::-webkit-details-marker { display:none; }
.wz-faq summary::before { content:"＋"; color:#2563eb; margin-right:.5rem; font-weight:700; }
.wz-faq details[open] summary::before { content:"－"; }
.wz-faq details > div { padding:0 0 .8rem; color:#475569; }

/* Footer nav (linkjuice) */
.wz-footernav { background:#0f172a; color:#cbd5e1; margin-top:3rem; padding:2.5rem 1rem; }
.wz-footernav-inner { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1.4fr repeat(4,1fr); gap:1.5rem; }
.wz-footernav h3 { color:#fff; font-size:.95rem; margin:0 0 .7rem; text-transform:uppercase; letter-spacing:.5px; }
.wz-footernav ul { list-style:none; padding:0; margin:0; }
.wz-footernav li { margin:.3rem 0; }
.wz-footernav a { color:#cbd5e1; text-decoration:none; font-size:.9rem; }
.wz-footernav a:hover { color:#fff; text-decoration:underline; }
.wz-fn-brand a { color:#fff; font-weight:800; font-size:1.2rem; }
.wz-fn-brand p { font-size:.85rem; color:#94a3b8; }
@media (max-width:780px) { .wz-footernav-inner { grid-template-columns:1fr 1fr; } }

/* Ad */
.wz-ad { margin:1.5rem 0; min-height:90px; text-align:center; }

/* Print */
@media print {
  body * { visibility:hidden !important; }
  .wz-sheet, .wz-sheet *, .wz-puzzle .wz-board, .wz-puzzle .wz-board *,
  .wz-maker-out, .wz-maker-out *, .wz-solver-out, .wz-solver-out * { visibility:visible !important; }
  .wz-maker-out, .wz-solver-out, .wz-sheet { position:absolute; left:0; top:0; width:100%; }
  .wz-actions, .wz-side .wz-actions, .wz-maker-form, .wz-overlay, .wz-stats { display:none !important; }
  .wz-static .wz-cell { border:1px solid #000; color:#000; }
  .wz-static .wz-cell.wz-found { background:none; outline:2px solid #000; }
}
