/* WhatsBrain Frontend Runtime v3.2.0 — minimal reset & shared primitives.
 * Loaded on every page that has v3 documents. Per-element styles are produced
 * by the Style Compiler and persisted to /uploads/whatsbrain/css/post-{id}.css.
 */

/* ---------- Reset & box model ---------- */
.wb-doc{box-sizing:border-box;width:100%;}
.wb-doc *,.wb-doc *::before,.wb-doc *::after{box-sizing:inherit;}
.wb-el{position:relative;}
.wb-doc img{max-width:100%;height:auto;display:block;}
.wb-doc a{color:inherit;}

/* ---------- Layout primitives ---------- */
.wb-container{display:flex;width:100%;}
.wb-section-boxed{max-width:1200px;margin-left:auto;margin-right:auto;padding:0 16px;}

/* ---------- Heading / Text ---------- */
.wb-heading{margin:0;font-family:var(--wb-font-head,inherit);}
.wb-text-editor{line-height:1.6;}
.wb-text-editor.wb-drop-cap::first-letter{
  float:left;font-size:3em;line-height:.85;font-weight:700;padding:.05em .12em 0 0;
}

/* ---------- Button ---------- */
.wb-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  text-decoration:none;cursor:pointer;border:0;font:inherit;
  transition:background-color .2s ease,color .2s ease,box-shadow .2s ease,transform .15s ease;
}
.wb-btn:focus-visible{outline:2px solid var(--wb-color-primary,#6366f1);outline-offset:2px;}

/* ---------- Image ---------- */
.wb-image-figure{margin:0;display:inline-block;max-width:100%;}
.wb-image-caption{margin-top:.5em;font-size:.85em;color:var(--wb-color-muted,#64748b);text-align:center;}
.wb-img-fx-zoom img{transition:transform .4s ease;}
.wb-img-fx-zoom:hover img{transform:scale(1.05);}
.wb-img-fx-lift img{transition:transform .3s ease,box-shadow .3s ease;}
.wb-img-fx-lift:hover img{transform:translateY(-4px);box-shadow:0 12px 24px rgba(0,0,0,.15);}
.wb-img-fx-grayscale img{filter:grayscale(100%);transition:filter .3s ease;}
.wb-img-fx-grayscale:hover img{filter:grayscale(0);}
.wb-img-fx-blur img{transition:filter .3s ease;}
.wb-img-fx-blur:hover img{filter:blur(2px);}

/* ---------- Icon ---------- */
.wb-icon{display:inline-block;line-height:0;}
.wb-icon-svg{display:inline-block;vertical-align:middle;transition:color .2s ease,transform .3s ease;}

/* ---------- Divider ---------- */
.wb-divider-align-left hr{margin-left:0;margin-right:auto;}
.wb-divider-align-right hr{margin-left:auto;margin-right:0;}

/* ---------- Visibility helpers ---------- */
@media (min-width:1025px){.wb-hide-desktop{display:none!important;}}
@media (max-width:1024px) and (min-width:641px){.wb-hide-tablet{display:none!important;}}
@media (max-width:640px){.wb-hide-mobile{display:none!important;}}

/* ---------- Sticky positioning (v4) ---------- */
.wb-sticky{position:sticky;}
.wb-sticky-top{top:0;z-index:50;}
.wb-sticky-bottom{bottom:0;z-index:50;}

/* ---------- Hover effects (v4.21.0 — Iteration O) ---------- */
.wb-hover{transition:transform .25s ease,box-shadow .25s ease,background-color .25s ease,filter .25s ease,opacity .25s ease;will-change:transform,box-shadow;}
.wb-hover-fast{transition-duration:.12s;}
.wb-hover-slow{transition-duration:.5s;}
.wb-hover-lift:hover{transform:translateY(-6px);box-shadow:0 16px 32px rgba(0,0,0,.12);}
.wb-hover-lift-sm:hover{transform:translateY(-3px);box-shadow:0 8px 16px rgba(0,0,0,.08);}
.wb-hover-scale:hover{transform:scale(1.04);}
.wb-hover-scale-lg:hover{transform:scale(1.08);}
.wb-hover-shrink:hover{transform:scale(.96);}
.wb-hover-tilt:hover{transform:rotate(-2deg) scale(1.02);}
.wb-hover-shadow:hover{box-shadow:0 12px 28px rgba(0,0,0,.18);}
.wb-hover-glow:hover{box-shadow:0 0 0 4px var(--wb-color-primary,#6366f1),0 0 24px rgba(99,102,241,.45);}
.wb-hover-bright:hover{filter:brightness(1.1);}
.wb-hover-dim:hover{filter:brightness(.85);}
.wb-hover-blur:hover{filter:blur(1.5px);}
.wb-hover-fade:hover{opacity:.7;}
@media (prefers-reduced-motion:reduce){
  .wb-hover,.wb-hover-lift,.wb-hover-lift-sm,.wb-hover-scale,.wb-hover-scale-lg,.wb-hover-shrink,.wb-hover-tilt{transition:none!important;}
  .wb-hover:hover{transform:none!important;}
}

/* ---------- Entrance animations (v4) ---------- */
.wb-anim{opacity:0;transition:opacity .8s ease,transform .8s ease;will-change:opacity,transform;}
.wb-anim.wb-anim-fast{transition-duration:.35s;}
.wb-anim.wb-anim-slow{transition-duration:1.4s;}
.wb-anim-fade-up{transform:translateY(40px);}
.wb-anim-fade-down{transform:translateY(-40px);}
.wb-anim-fade-left{transform:translateX(-40px);}
.wb-anim-fade-right{transform:translateX(40px);}
.wb-anim-zoom-in{transform:scale(.85);}
.wb-anim-zoom-out{transform:scale(1.15);}
.wb-anim-slide-up{transform:translateY(80px);}
.wb-anim-slide-down{transform:translateY(-80px);}
.wb-anim-slide-left{transform:translateX(-80px);}
.wb-anim-slide-right{transform:translateX(80px);}
.wb-anim-flip{transform:perspective(800px) rotateX(60deg);}
.wb-anim-bounce{transform:translateY(40px);}
.wb-anim.wb-in{opacity:1;transform:none;}
.wb-anim-bounce.wb-in{animation:wbBounceIn .9s cubic-bezier(.34,1.56,.64,1);}
@keyframes wbBounceIn{0%{opacity:0;transform:translateY(40px) scale(.92)}60%{opacity:1;transform:translateY(-8px) scale(1.02)}100%{transform:none}}

/* ---------- Accessibility ---------- */
@media (prefers-reduced-motion:reduce){
  .wb-btn,.wb-icon-svg,.wb-img-fx-zoom img,.wb-img-fx-lift img,
  .wb-img-fx-grayscale img,.wb-img-fx-blur img,.wb-anim{transition:none!important;animation:none!important;}
  .wb-anim{opacity:1!important;transform:none!important;}
}
.wb-doc :focus-visible{outline:2px solid var(--wb-color-primary,#6366f1);outline-offset:2px;}
.wb-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* ---------- Print ---------- */
@media print{.wb-hide-print{display:none!important;}.wb-doc{color:#000;background:#fff;}}

/* ============================================================
 * v4.23.0 — Section primitives (cards, badges, tokens)
 * ============================================================ */
:root{
  --wb-color-primary:#6366f1;
  --wb-color-primary-fg:#ffffff;
  --wb-color-text:#0f172a;
  --wb-color-muted:#64748b;
  --wb-color-border:#e2e8f0;
  --wb-color-surface:#ffffff;
  --wb-color-surface-alt:#f8fafc;
  --wb-color-success:#10b981;
  --wb-color-warning:#f59e0b;
  --wb-color-danger:#ef4444;
  --wb-color-info:#3b82f6;
  --wb-radius-sm:6px;
  --wb-radius:12px;
  --wb-radius-lg:20px;
  --wb-radius-pill:999px;
  --wb-shadow-xs:0 1px 2px rgba(15,23,42,.05);
  --wb-shadow-sm:0 2px 8px rgba(15,23,42,.06);
  --wb-shadow:0 4px 16px rgba(15,23,42,.08);
  --wb-shadow-lg:0 16px 40px rgba(15,23,42,.12);
  --wb-font-head:inherit;
  --wb-font-body:inherit;
  --wb-ease:cubic-bezier(.4,0,.2,1);
}

/* ---------- Section card primitive ---------- */
.wb-card{
  background:var(--wb-color-surface);
  color:var(--wb-color-text);
  border:1px solid var(--wb-color-border);
  border-radius:var(--wb-radius);
  box-shadow:var(--wb-shadow-xs);
  padding:1.5rem;
  transition:transform .2s var(--wb-ease),box-shadow .2s var(--wb-ease),border-color .2s var(--wb-ease);
}
.wb-card-elevated{box-shadow:var(--wb-shadow);border-color:transparent;}
.wb-card-soft{background:var(--wb-color-surface-alt);border-color:transparent;}
.wb-card-glass{
  background:rgba(255,255,255,.65);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-color:rgba(255,255,255,.4);
}
.wb-card-interactive{cursor:pointer;}
.wb-card-interactive:hover{transform:translateY(-4px);box-shadow:var(--wb-shadow-lg);border-color:transparent;}

/* ---------- Badges & chips ---------- */
.wb-badge{
  display:inline-flex;align-items:center;gap:.4em;
  padding:.3em .7em;font-size:.78em;font-weight:600;line-height:1;
  border-radius:var(--wb-radius-pill);background:var(--wb-color-surface-alt);
  color:var(--wb-color-text);letter-spacing:.02em;
}
.wb-badge-primary{background:color-mix(in srgb,var(--wb-color-primary) 12%,transparent);color:var(--wb-color-primary);}
.wb-badge-success{background:color-mix(in srgb,var(--wb-color-success) 12%,transparent);color:var(--wb-color-success);}
.wb-badge-warning{background:color-mix(in srgb,var(--wb-color-warning) 14%,transparent);color:#92400e;}
.wb-badge-danger {background:color-mix(in srgb,var(--wb-color-danger) 12%,transparent);color:var(--wb-color-danger);}
.wb-badge-solid{background:var(--wb-color-primary);color:var(--wb-color-primary-fg);}

/* ---------- Stars ---------- */
.wb-stars{display:inline-flex;gap:2px;color:var(--wb-color-warning);line-height:1;}
.wb-stars svg{width:1em;height:1em;}

/* ---------- Avatar ---------- */
.wb-avatar{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--wb-color-surface-alt);color:var(--wb-color-muted);font-weight:700;overflow:hidden;flex-shrink:0;}
.wb-avatar img{width:100%;height:100%;object-fit:cover;display:block;}
.wb-avatar-lg{width:64px;height:64px;font-size:1.25em;}
.wb-avatar-sm{width:32px;height:32px;font-size:.85em;}

/* ---------- Alerts (semantic) ---------- */
.wb-alert{position:relative;border-radius:var(--wb-radius);padding:1rem 1.25rem;border:1px solid transparent;display:flex;gap:.75rem;align-items:flex-start;}
.wb-alert-info   {background:color-mix(in srgb,var(--wb-color-info) 10%,transparent);   border-color:color-mix(in srgb,var(--wb-color-info) 25%,transparent);   color:#1e3a8a;}
.wb-alert-success{background:color-mix(in srgb,var(--wb-color-success) 12%,transparent);border-color:color-mix(in srgb,var(--wb-color-success) 30%,transparent);color:#065f46;}
.wb-alert-warning{background:color-mix(in srgb,var(--wb-color-warning) 14%,transparent);border-color:color-mix(in srgb,var(--wb-color-warning) 30%,transparent);color:#92400e;}
.wb-alert-danger {background:color-mix(in srgb,var(--wb-color-danger) 10%,transparent); border-color:color-mix(in srgb,var(--wb-color-danger) 30%,transparent); color:#991b1b;}
.wb-alert-icon{flex-shrink:0;width:20px;height:20px;}

/* ---------- Section accent shapes ---------- */
.wb-accent-bar{display:block;width:48px;height:4px;background:var(--wb-color-primary);border-radius:var(--wb-radius-pill);margin:0 0 1rem;}
.wb-accent-bar-center{margin-left:auto;margin-right:auto;}

/* ---------- Skeleton (loading) ---------- */
.wb-skel{background:linear-gradient(90deg,#e2e8f0 0%,#f1f5f9 50%,#e2e8f0 100%);background-size:200% 100%;animation:wbSkel 1.4s infinite;border-radius:var(--wb-radius-sm);}
@keyframes wbSkel{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ---------- Section frame helper ---------- */
.wb-section-eyebrow{display:inline-block;font-size:.85em;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--wb-color-primary);margin-bottom:.5rem;}

/* ============================================================
 * v4.24.0 — Extended section widget primitives
 * ============================================================ */

/* ---------- Gallery (grid + masonry + lightbox) ---------- */
.wb-gallery{display:grid;gap:var(--wb-gallery-gap,12px);grid-template-columns:repeat(var(--wb-gallery-cols,3),1fr);}
.wb-gallery-masonry{display:block;column-count:var(--wb-gallery-cols,3);column-gap:var(--wb-gallery-gap,12px);}
.wb-gallery-masonry .wb-gallery-item{break-inside:avoid;margin-bottom:var(--wb-gallery-gap,12px);display:block;}
.wb-gallery-item{position:relative;overflow:hidden;border-radius:var(--wb-radius);background:var(--wb-color-surface-alt);display:block;cursor:zoom-in;}
.wb-gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--wb-ease);}
.wb-gallery-item:hover img{transform:scale(1.06);}
.wb-gallery-item .wb-gallery-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(15,23,42,.65));opacity:0;transition:opacity .25s var(--wb-ease);display:flex;align-items:flex-end;padding:1rem;color:#fff;font-size:.9em;font-weight:600;}
.wb-gallery-item:hover .wb-gallery-overlay{opacity:1;}
@media (max-width:768px){.wb-gallery,.wb-gallery-masonry{grid-template-columns:repeat(2,1fr);column-count:2;}}
@media (max-width:480px){.wb-gallery,.wb-gallery-masonry{grid-template-columns:1fr;column-count:1;}}

/* ---------- Lightbox ---------- */
.wb-lightbox{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:9999;display:none;align-items:center;justify-content:center;padding:2rem;}
.wb-lightbox[open]{display:flex;}
.wb-lightbox img{max-width:95vw;max-height:90vh;border-radius:var(--wb-radius);box-shadow:var(--wb-shadow-lg);}
.wb-lightbox button{position:absolute;background:rgba(255,255,255,.15);border:0;color:#fff;width:48px;height:48px;border-radius:50%;font-size:1.5rem;cursor:pointer;backdrop-filter:blur(8px);transition:background .2s var(--wb-ease);}
.wb-lightbox button:hover{background:rgba(255,255,255,.3);}
.wb-lb-close{top:1.5rem;right:1.5rem;}
.wb-lb-prev{left:1.5rem;top:50%;transform:translateY(-50%);}
.wb-lb-next{right:1.5rem;top:50%;transform:translateY(-50%);}

/* ---------- Carousel ---------- */
.wb-carousel{position:relative;}
.wb-carousel-viewport{position:relative;overflow:hidden;border-radius:var(--wb-radius);background:var(--wb-color-surface-alt);}
.wb-carousel-track{display:flex;transition:transform .55s var(--wb-ease);will-change:transform;}
.wb-carousel-slide{flex:0 0 100%;min-width:0;}
.wb-carousel-slide img{display:block;width:100%;height:auto;}
.wb-carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.92);border:0;color:var(--wb-color-text);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;box-shadow:var(--wb-shadow-sm);transition:background .2s var(--wb-ease),transform .2s var(--wb-ease);z-index:2;}
.wb-carousel-arrow:hover{background:#fff;transform:translateY(-50%) scale(1.06);}
.wb-carousel-arrow.prev{left:.75rem;}.wb-carousel-arrow.next{right:.75rem;}
.wb-carousel-dots{display:flex;justify-content:center;gap:8px;margin-top:.85rem;}
.wb-carousel-dots button{width:8px;height:8px;border-radius:var(--wb-radius-pill);border:0;background:var(--wb-color-border);cursor:pointer;padding:0;transition:width .25s var(--wb-ease),background .25s var(--wb-ease);}
.wb-carousel-dots button[aria-current="true"]{background:var(--wb-color-primary);width:24px;}

/* ---------- Tabs ---------- */
.wb-tabs{}
.wb-tabs-h{display:flex;flex-direction:column;}
.wb-tabs-v{display:grid;grid-template-columns:minmax(180px,240px) 1fr;gap:1.5rem;}
@media(max-width:640px){.wb-tabs-v{grid-template-columns:1fr;}}
.wb-tabs-list{display:flex;gap:.25rem;border-bottom:1px solid var(--wb-color-border);overflow-x:auto;scrollbar-width:none;}
.wb-tabs-list::-webkit-scrollbar{display:none;}
.wb-tabs-v .wb-tabs-list{flex-direction:column;border-bottom:0;border-right:1px solid var(--wb-color-border);overflow:visible;}
.wb-tab-btn{appearance:none;background:transparent;border:0;padding:.85rem 1.25rem;font:inherit;font-weight:600;color:var(--wb-color-muted);cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap;transition:color .2s var(--wb-ease),border-color .2s var(--wb-ease),background .2s var(--wb-ease);border-radius:8px 8px 0 0;}
.wb-tab-btn:hover{color:var(--wb-color-text);}
.wb-tab-btn[aria-selected="true"]{color:var(--wb-color-primary);border-bottom-color:var(--wb-color-primary);}
.wb-tabs-v .wb-tab-btn{text-align:left;border-bottom:0;border-right:2px solid transparent;border-radius:8px 0 0 8px;}
.wb-tabs-v .wb-tab-btn[aria-selected="true"]{border-right-color:var(--wb-color-primary);background:color-mix(in srgb,var(--wb-color-primary) 8%,transparent);}
.wb-tab-panel{padding:1.25rem 0;animation:wbTabIn .3s var(--wb-ease);}
.wb-tab-panel[hidden]{display:none;}
@keyframes wbTabIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

/* ---------- Flip box ---------- */
.wb-flip{perspective:1400px;}
.wb-flip-inner{position:relative;width:100%;height:100%;transition:transform .8s var(--wb-ease);transform-style:preserve-3d;border-radius:var(--wb-radius-lg);}
.wb-flip:hover .wb-flip-inner,.wb-flip:focus-within .wb-flip-inner{transform:rotateY(180deg);}
.wb-flip-h:hover .wb-flip-inner,.wb-flip-h:focus-within .wb-flip-inner{transform:rotateY(180deg);}
.wb-flip-v:hover .wb-flip-inner,.wb-flip-v:focus-within .wb-flip-inner{transform:rotateX(180deg);}
.wb-flip-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2rem;border-radius:var(--wb-radius-lg);box-shadow:var(--wb-shadow);}
.wb-flip-back{transform:rotateY(180deg);}
.wb-flip-v .wb-flip-back{transform:rotateX(180deg);}
.wb-flip-icon{width:54px;height:54px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.18);margin-bottom:1rem;}
.wb-flip-icon svg{width:28px;height:28px;}

/* ---------- Icon list ---------- */
.wb-icon-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.65rem;}
.wb-icon-list-inline{flex-direction:row;flex-wrap:wrap;gap:.5rem 1.25rem;}
.wb-icon-list li{display:flex;align-items:center;gap:.65rem;color:var(--wb-color-text);}
.wb-icon-list li a{color:inherit;text-decoration:none;transition:color .2s var(--wb-ease);}
.wb-icon-list li a:hover{color:var(--wb-color-primary);}
.wb-icon-list .wb-icon-list-icon{display:inline-flex;align-items:center;justify-content:center;width:1.5em;height:1.5em;color:var(--wb-color-primary);flex-shrink:0;}
.wb-icon-list svg{width:1em;height:1em;}

/* ---------- Progress ---------- */
.wb-progress{display:flex;flex-direction:column;gap:.5rem;}
.wb-progress-head{display:flex;justify-content:space-between;font-weight:600;font-size:.95em;color:var(--wb-color-text);}
.wb-progress-track{height:10px;background:var(--wb-color-surface-alt);border-radius:var(--wb-radius-pill);overflow:hidden;}
.wb-progress-bar{height:100%;background:var(--wb-color-primary);border-radius:inherit;transition:width 1s var(--wb-ease);width:0;}
.wb-progress-striped .wb-progress-bar{background-image:linear-gradient(45deg,rgba(255,255,255,.18) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.18) 50%,rgba(255,255,255,.18) 75%,transparent 75%);background-size:1.25rem 1.25rem;}

/* ---------- Countdown ---------- */
.wb-countdown{display:flex;gap:.85rem;justify-content:center;flex-wrap:wrap;}
.wb-countdown-unit{display:flex;flex-direction:column;align-items:center;min-width:72px;}
.wb-countdown-num{font-size:clamp(2rem,5vw,3rem);font-weight:800;line-height:1;font-variant-numeric:tabular-nums;background:var(--wb-color-text);color:var(--wb-color-primary-fg);padding:.5em .65em;border-radius:var(--wb-radius);box-shadow:var(--wb-shadow-sm);min-width:1.8em;text-align:center;}
.wb-countdown-label{margin-top:.55rem;font-size:.78em;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--wb-color-muted);}
.wb-countdown-expired{padding:1rem 1.5rem;border-radius:var(--wb-radius);background:var(--wb-color-surface-alt);color:var(--wb-color-text);font-weight:600;text-align:center;}

/* ---------- Rating stars ---------- */
.wb-rating{display:inline-flex;align-items:center;gap:.5em;}
.wb-rating-icons{position:relative;display:inline-flex;line-height:0;}
.wb-rating-empty,.wb-rating-fill{display:inline-flex;}
.wb-rating-empty{color:var(--wb-color-border);}
.wb-rating-fill{position:absolute;inset:0;overflow:hidden;color:var(--wb-color-warning);}
.wb-rating svg{width:1em;height:1em;}
.wb-rating-value{font-weight:600;color:var(--wb-color-text);}

/* ---------- Social icons ---------- */
.wb-socials{display:inline-flex;flex-wrap:wrap;align-items:center;}
.wb-social-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:#fff;transition:transform .2s var(--wb-ease),box-shadow .2s var(--wb-ease),filter .2s var(--wb-ease);}
.wb-social-link:hover{transform:translateY(-3px);box-shadow:var(--wb-shadow);filter:brightness(1.05);}
.wb-social-link:focus-visible{outline:2px solid var(--wb-color-primary);outline-offset:2px;}
.wb-social-link svg{width:50%;height:50%;}

/* ---------- Share buttons ---------- */
.wb-shares{display:inline-flex;flex-wrap:wrap;align-items:center;}
.wb-share-link{display:inline-flex;align-items:center;justify-content:center;color:#fff;text-decoration:none;transition:transform .15s var(--wb-ease),opacity .15s var(--wb-ease);gap:.45em;}
.wb-share-link:hover{transform:translateY(-2px);opacity:.92;}
.wb-share-link svg{width:1.1em;height:1.1em;}

/* ---------- Video ---------- */
.wb-video{position:relative;background:#000;overflow:hidden;border-radius:var(--wb-radius);width:100%;}
.wb-video iframe,.wb-video video{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;}

/* ---------- Animated headline ---------- */
.wb-ah{display:inline-flex;align-items:baseline;flex-wrap:wrap;gap:.35em;}
.wb-ah-rotating{display:inline-block;position:relative;color:var(--wb-color-primary);font-weight:inherit;min-width:1ch;}
.wb-ah-rotating.wb-ah-typing::after{content:'';display:inline-block;width:.08em;height:.95em;background:currentColor;margin-left:.1em;vertical-align:middle;animation:wbBlink 1s steps(1) infinite;}
@keyframes wbBlink{50%{opacity:0;}}

/* ---------- Sitemap ---------- */
.wb-sitemap{display:grid;gap:1.5rem;grid-template-columns:repeat(var(--wb-sitemap-cols,2),1fr);}
@media(max-width:640px){.wb-sitemap{grid-template-columns:1fr;}}
.wb-sitemap-section h4{margin:0 0 .85rem;font-size:1rem;font-weight:700;color:var(--wb-color-text);padding-bottom:.5rem;border-bottom:2px solid var(--wb-color-primary);display:inline-block;}
.wb-sitemap-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.4rem;}
.wb-sitemap-list a{color:var(--wb-color-text);text-decoration:none;display:inline-flex;align-items:center;gap:.5rem;padding:.25rem 0;transition:color .2s var(--wb-ease),padding .2s var(--wb-ease);}
.wb-sitemap-list a::before{content:'›';color:var(--wb-color-primary);font-weight:700;}
.wb-sitemap-list a:hover{color:var(--wb-color-primary);padding-left:.25rem;}
.wb-sitemap-count{font-size:.78em;color:var(--wb-color-muted);}

/* ---------- Login form ---------- */
.wb-login-card{max-width:420px;background:var(--wb-color-surface);border:1px solid var(--wb-color-border);border-radius:var(--wb-radius-lg);padding:2rem;box-shadow:var(--wb-shadow);}
.wb-login-card .login-username,.wb-login-card .login-password,.wb-login-card .login-remember,.wb-login-card .login-submit{margin:0 0 1rem;}
.wb-login-card label{display:block;font-size:.85em;font-weight:600;color:var(--wb-color-text);margin-bottom:.4rem;}
.wb-login-card input[type=text],.wb-login-card input[type=email],.wb-login-card input[type=password]{width:100%;padding:.7rem .9rem;border:1px solid var(--wb-color-border);border-radius:var(--wb-radius-sm);font:inherit;background:var(--wb-color-surface);color:var(--wb-color-text);transition:border-color .2s var(--wb-ease),box-shadow .2s var(--wb-ease);box-sizing:border-box;}
.wb-login-card input:focus{outline:none;border-color:var(--wb-color-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--wb-color-primary) 18%,transparent);}
.wb-login-card .login-remember{display:flex;align-items:center;gap:.5rem;font-size:.9em;color:var(--wb-color-muted);}
.wb-login-card input[type=submit]{width:100%;padding:.85rem 1.5rem;border:0;border-radius:var(--wb-radius-sm);background:var(--wb-color-primary);color:var(--wb-color-primary-fg);font-weight:600;cursor:pointer;transition:filter .2s var(--wb-ease),transform .15s var(--wb-ease);}
.wb-login-card input[type=submit]:hover{filter:brightness(1.06);transform:translateY(-1px);}
.wb-login-greeting{padding:1.25rem 1.5rem;border-radius:var(--wb-radius);background:var(--wb-color-surface-alt);border:1px solid var(--wb-color-border);display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;}

/* ---------- Form ---------- */
.wb-form{display:grid;grid-template-columns:repeat(12,1fr);gap:1rem;}
.wb-field{display:flex;flex-direction:column;gap:.4rem;}
.wb-field-w-100{grid-column:span 12;}.wb-field-w-75{grid-column:span 9;}.wb-field-w-66{grid-column:span 8;}
.wb-field-w-50{grid-column:span 6;}.wb-field-w-33{grid-column:span 4;}.wb-field-w-25{grid-column:span 3;}
@media(max-width:640px){.wb-form > .wb-field{grid-column:span 12;}}
.wb-field label{font-weight:600;font-size:.88em;color:var(--wb-color-text);}
.wb-field-required{color:var(--wb-color-danger);margin-left:2px;}
.wb-field input,.wb-field textarea,.wb-field select{width:100%;padding:.7rem .9rem;border:1px solid var(--wb-color-border);border-radius:var(--wb-radius-sm);font:inherit;background:var(--wb-color-surface);color:var(--wb-color-text);transition:border-color .2s var(--wb-ease),box-shadow .2s var(--wb-ease);box-sizing:border-box;}
.wb-field input:focus,.wb-field textarea:focus,.wb-field select:focus{outline:none;border-color:var(--wb-color-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--wb-color-primary) 18%,transparent);}
.wb-field-help{font-size:.78em;color:var(--wb-color-muted);}
.wb-form-actions{grid-column:span 12;display:flex;}
.wb-form-actions.al-center{justify-content:center;}.wb-form-actions.al-right{justify-content:flex-end;}
.wb-form-submit{padding:.85rem 2rem;border:0;border-radius:var(--wb-radius-sm);background:var(--wb-color-primary);color:var(--wb-color-primary-fg);font-weight:600;cursor:pointer;transition:filter .2s var(--wb-ease),transform .15s var(--wb-ease);}
.wb-form-submit:hover{filter:brightness(1.06);transform:translateY(-1px);}
.wb-form-submit[disabled]{opacity:.6;cursor:wait;transform:none;}
.wb-form-msg{grid-column:span 12;padding:.85rem 1.1rem;border-radius:var(--wb-radius-sm);display:none;font-size:.92em;}
.wb-form-msg.is-shown{display:block;animation:wbTabIn .3s var(--wb-ease);}
.wb-form-msg.success{background:color-mix(in srgb,var(--wb-color-success) 12%,transparent);color:#065f46;border-left:3px solid var(--wb-color-success);}
.wb-form-msg.error{background:color-mix(in srgb,var(--wb-color-danger) 10%,transparent);color:#991b1b;border-left:3px solid var(--wb-color-danger);}
.wb-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none;}

/* ---------- Divider variants ---------- */
.wb-divider-fancy{display:flex;align-items:center;gap:1rem;}
.wb-divider-fancy::before,.wb-divider-fancy::after{content:'';flex:1;height:1px;background:var(--wb-color-border);}
.wb-divider-fancy span{font-size:.85em;color:var(--wb-color-muted);font-weight:600;text-transform:uppercase;letter-spacing:.1em;}

