/* ═══════════════════════════════════════════════════════════
   Widgets CSS — Theme-independent functional components
   Always loaded, never overridden by themes.
   Handles: Chat, Search, Lightbox, Mobile Menu, Auth,
   Modals, Notifications, Theme Toggle, Overlays
   ═══════════════════════════════════════════════════════════ */
/* Public ambient background contract:
   The frontend body background is shared infrastructure, not a per-theme copy.
   It must derive only from tenant color-picker variables so brand changes,
   theme switches, and translated tenant pages keep one consistent atmosphere.
   Do not hardcode theme colors here; use --bg/--main/--ac1/--ac2.
   Public pages may carry data-admin when an admin is logged in; only the real
   backend shell gets data-admin-shell, so exclude that marker instead. */
body:not([data-admin-shell]){
  --aoe-ambient-bg:
    radial-gradient(circle at 14% -10%, color-mix(in srgb, var(--main) 20%, transparent) 0, transparent 34rem),
    radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--ac1) 18%, transparent) 0, transparent 32rem),
    radial-gradient(circle at 58% 112%, color-mix(in srgb, var(--ac2) 14%, transparent) 0, transparent 36rem),
    linear-gradient(135deg, color-mix(in srgb, var(--bg) 84%, var(--main)) 0%, var(--bg) 52%, color-mix(in srgb, var(--bg) 88%, var(--ac2)) 100%);
  background:var(--aoe-ambient-bg);
  background-attachment:fixed;
}
body[data-page-width="wide"]{--public-page-width:90vw;--detail-no-sidebar-max:90vw;--detail-grid-no-sidebar-max:90vw}
body[data-page-width="normal"]{--public-page-width:65vw;--detail-no-sidebar-max:65vw;--detail-grid-no-sidebar-max:65vw}
body[data-page-width="narrow"]{--public-page-width:50vw;--detail-no-sidebar-max:50vw;--detail-grid-no-sidebar-max:50vw}
.sp-detail{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.sp-detail > .toc-wrap{
  width:100%;
  margin:0;
}
body[data-page-width] main.container,
body[data-page-width] .public-page-shell{
  max-width:min(var(--public-page-width,1100px),calc(100vw - 1rem));
}
body[data-page-width] section.page-content:not(.catalogue-page){
  width:100%;
  max-width:100%!important;
  box-sizing:border-box;
}
body[data-page-width] article.post-full.detail-no-sidebar,
body[data-page-width] section.page-content.detail-no-sidebar,
body[data-page-width] .sp-detail.detail-no-sidebar,
body[data-page-width] .funnel-page.detail-no-sidebar,
body[data-page-width] .funnel-content.detail-no-sidebar,
body[data-page-width] .product-page-content.detail-no-sidebar,
body[data-page-width] .streaming-page-content.detail-no-sidebar,
body[data-page-width] .technical-paper-reader.detail-no-sidebar{
  max-width:min(var(--public-page-width,1100px),calc(100vw - 1rem));
}
body[data-page-width] article.post-full.has-sidebar,
body[data-page-width] section.page-content.has-sidebar,
body[data-page-width] .sp-detail.has-sidebar,
body[data-page-width] .pp-wrap.has-sidebar,
body[data-page-width] article.post-full:has(.toc-wrap),
body[data-page-width] section.page-content:has(.toc-wrap),
body[data-page-width] .sp-detail:has(.toc-wrap),
body[data-page-width] .pp-wrap:has(.toc-wrap){
  width:100%;
  max-width:min(var(--public-page-width,1100px),calc(100vw - 1rem))!important;
  margin-inline:auto;
  padding-inline:0!important;
}
body[data-page-width] .toc-wrap{
  width:100%;
  max-width:100%!important;
  box-sizing:border-box;
}
body[data-page-width] .toc-wrap > .toc-main,
body[data-page-width] .toc-wrap .content-card{
  min-width:0;
}
@media(min-width:900px){
  body[data-page-width] .toc-wrap.toc-right{
    grid-template-columns:minmax(0,1fr) clamp(190px,16vw,250px)!important;
  }
  body[data-page-width] .toc-wrap.toc-left{
    grid-template-columns:clamp(190px,16vw,250px) minmax(0,1fr)!important;
  }
}
@media(max-width:899px){
  body[data-page-width] .toc-wrap,
  body[data-page-width] .toc-wrap.toc-left,
  body[data-page-width] .toc-wrap.toc-right{
    grid-template-columns:1fr!important;
  }
}
@media(max-width:760px){
  body[data-page-width]{--public-page-width:calc(100vw - 1rem);--detail-no-sidebar-max:calc(100vw - 1rem);--detail-grid-no-sidebar-max:calc(100vw - 1rem)}
  body[data-page-width] main.container{max-width:100%;padding-inline:clamp(.75rem,4vw,1rem)}
  .tenant-cta-button{width:100%;min-width:0}
}
/* ── CHAT FAB ── */
.chat-fab{position:fixed;z-index:100;border:none;cursor:pointer;width:56px;height:56px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--main);color:var(--txt-main);box-shadow:0 4px 12px rgba(0,0,0,.2);transition:transform .15s ease,opacity .15s ease}
.chat-fab:hover{transform:scale(1.08)}
.chat-fab:active{transform:scale(.95)}
.chat-fab svg{width:24px;height:24px}
/* ── CHAT BOX (widget mode) ── */
/* Legacy chat theme contract:
   index.html still mounts the historical .chat-box fallback before widgets.js
   can replace it. Keep this visually identical to the injected .aoe-chat-box:
   the panel must include visible --main/--ac1/--ac2 theme color, not only
   --card/--bg, otherwise dark themes regress to a detached black popup. */
.chat-box{position:fixed;z-index:101;width:min(460px,calc(100vw - 2rem));max-height:min(520px,75vh);display:none;flex-direction:column;background:linear-gradient(135deg,color-mix(in srgb,var(--main) 28%,var(--card)) 0%,color-mix(in srgb,var(--ac1) 24%,var(--bg)) 54%,color-mix(in srgb,var(--ac2) 14%,var(--bg)) 100%);border:1px solid var(--border);border-radius:var(--rad);box-shadow:var(--shadow),0 28px 70px color-mix(in srgb,var(--main) 18%,rgba(0,0,0,.35));overflow:hidden}
.chat-box.show{display:flex}
.chat-header{padding:12px 16px;font-weight:600;font-size:.9rem;color:var(--txt);border-bottom:1px solid color-mix(in srgb,var(--main) 24%,var(--border-subtle));background:color-mix(in srgb,var(--main) 12%,transparent);display:flex;align-items:center;justify-content:space-between}
.chat-header button{background:none;border:none;cursor:pointer;color:var(--txt);opacity:.5;font-size:1.1rem;padding:4px}
.chat-header button:hover{opacity:1}
.chat-body{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px}
.chat-msg{padding:8px 12px;border-radius:10px;font-size:.88rem;line-height:1.5;max-width:85%;word-wrap:break-word}
.chat-msg.bot{background:color-mix(in srgb,var(--main) 10%,var(--card));color:var(--txt);align-self:flex-start;border:1px solid color-mix(in srgb,var(--main) 24%,var(--border-subtle));border-bottom-left-radius:2px}
.chat-msg.user{background:var(--main);color:var(--txt-main);align-self:flex-end;border-bottom-right-radius:2px}
.chat-input{border-top:1px solid color-mix(in srgb,var(--main) 24%,var(--border-subtle));padding:8px;display:flex;gap:6px;background:color-mix(in srgb,var(--ac1) 18%,var(--card))}
.chat-input input{flex:1;border:1px solid color-mix(in srgb,var(--main) 24%,var(--border-subtle));border-radius:8px;padding:8px 12px;font-size:16px;background:color-mix(in srgb,var(--bg) 84%,var(--main));color:var(--txt);outline:none}
.chat-input input:focus{border-color:var(--main)}
.chat-input input::placeholder{color:color-mix(in srgb,var(--txt) 40%,transparent)}
/* Public chat button theme contract:
   The public fallback widget is outside the per-theme CSS files, so the send
   button must inherit the active theme's shape, shadow, and hover motion through
   tokens instead of using a fixed widget-only button style. */
.chat-input button{background:var(--main);color:var(--txt-main);border:1px solid color-mix(in srgb,var(--main) 72%,var(--border));border-radius:var(--rad);padding:8px 14px;cursor:pointer;font-weight:600;font-size:.85rem;box-shadow:var(--t-shadow,var(--shadow));transition:transform var(--t-speed,.15s) var(--t-ease,ease),box-shadow var(--t-speed,.15s) var(--t-ease,ease),opacity .15s}
.chat-input button:hover{opacity:.95;transform:translateY(-1px);box-shadow:var(--t-shadow-hover,var(--shadow))}
/* ── UPGRADE BUTTONS ── */
.upgrade-btns{display:flex;gap:.5rem;padding:.75rem}
.upgrade-btns button{flex:1;padding:.55rem .85rem;font-size:.82rem;border-radius:var(--rad,8px);cursor:pointer;border:2px solid color-mix(in srgb,var(--txt) 15%,transparent);background:var(--main);color:var(--txt-main);font-weight:700;letter-spacing:var(--t-label-spacing,0);text-transform:var(--t-label-transform,none);box-shadow:var(--t-shadow,0 2px 8px rgba(0,0,0,.18));transition:transform var(--t-speed,.18s) var(--t-ease,ease),box-shadow var(--t-speed,.18s) var(--t-ease,ease),opacity var(--t-speed,.18s),filter var(--t-speed,.18s)}
.upgrade-btns button:hover{transform:translateY(-2px) scale(var(--t-hover-scale,1.01));box-shadow:var(--t-shadow-hover,var(--t-shadow,0 8px 20px rgba(0,0,0,.2)));opacity:1;filter:brightness(.98)}
/* ── SEARCH WIDGET ── */
.site-search{position:relative;z-index:100}
.ss-toggle{background:var(--card);border:1px solid var(--border-subtle);color:var(--txt);cursor:pointer;padding:.55rem;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:10px;box-shadow:0 2px 8px rgba(0,0,0,.08);transition:opacity .15s,border-color .15s}
.ss-toggle:hover{opacity:1;border-color:var(--border)}
.ss-toggle svg{width:18px;height:18px}
.ss-panel{display:none;position:fixed;width:min(420px,calc(100vw - 2rem));max-height:480px;background:var(--card);border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,.15);z-index:300;flex-direction:column;overflow:hidden}
.ss-panel.show{display:flex}
.ss-panel.ss-top-left{top:4rem;left:1.5rem}
.ss-panel.ss-top-right{top:4rem;right:1.5rem}
.ss-panel.ss-bottom-left{bottom:4rem;left:1.5rem}
.ss-panel.ss-bottom-right{bottom:4rem;right:1.5rem}
.ss-input{border:none;border-bottom:1px solid var(--border-subtle);padding:12px 16px;font-size:16px;background:transparent;color:var(--txt);outline:none;width:100%}
.ss-input:focus{border-color:var(--main)}
.ss-input::placeholder{color:color-mix(in srgb,var(--txt) 40%,transparent)}
.ss-results{flex:1;overflow-y:auto;padding:4px 0}
.ss-item{display:flex;align-items:center;gap:10px;padding:10px 16px;cursor:pointer;transition:background .1s;color:var(--txt);text-decoration:none}
.ss-item:hover{background:color-mix(in srgb,var(--txt) 5%,var(--card));text-decoration:none}
.ss-item img{width:40px;height:40px;border-radius:6px;object-fit:cover;flex-shrink:0}
.ss-item-title{font-size:.88rem;font-weight:500;color:var(--txt)}
.ss-item-text{font-size:.78rem;color:color-mix(in srgb,var(--txt) 60%,transparent);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ss-item-meta{font-size:.72rem;color:color-mix(in srgb,var(--txt) 45%,transparent)}
.ss-empty{padding:2rem;text-align:center;color:color-mix(in srgb,var(--txt) 50%,transparent);font-size:.88rem}
.ss-type{font-size:.68rem;padding:2px 6px;border-radius:4px;background:color-mix(in srgb,var(--txt) 8%,var(--card));color:var(--txt);white-space:nowrap}
/* ── LIGHTBOX ── */
.lightbox{position:fixed;inset:0;background:color-mix(in srgb,var(--bg,#000) 92%,transparent);z-index:10000;display:none;align-items:center;justify-content:center;padding:1rem;cursor:zoom-out}
.lightbox.show{display:flex}
.lightbox img,.lightbox video{max-width:95vw;max-height:90vh;border-radius:8px;object-fit:contain}
.lightbox .lb-close{position:absolute;top:1rem;right:1.5rem;color:var(--txt,#fff);font-size:2rem;cursor:pointer;background:color-mix(in srgb,var(--txt,#fff) 15%,transparent);border:none;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .15s;z-index:10001}
.lightbox .lb-close:hover{background:color-mix(in srgb,var(--txt,#fff) 30%,transparent)}
[data-lightbox]{cursor:zoom-in}
/* Listing cards: shared structure only; theme frontend.css owns the visual tokens. */
article.card{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border-radius:var(--listing-card-radius,var(--rad));
  background:var(--listing-card-bg,var(--card));
  border:var(--listing-card-border,1px solid var(--border-subtle));
  box-shadow:var(--listing-card-shadow,var(--t-shadow,var(--shadow)));
  transition:transform var(--listing-card-speed,var(--t-speed,.2s)) var(--t-ease,ease),border-color var(--listing-card-speed,var(--t-speed,.2s)) var(--t-ease,ease),box-shadow var(--listing-card-speed,var(--t-speed,.2s)) var(--t-ease,ease);
}
article.card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
  background:var(--listing-card-sheen,linear-gradient(180deg,color-mix(in srgb,var(--main) 12%,transparent),transparent 38%,color-mix(in srgb,var(--bg) 48%,transparent)));
  opacity:var(--listing-card-sheen-opacity,.8);
}
article.card:hover{
  transform:translateY(var(--listing-card-hover-y,-4px));
  border-color:var(--listing-card-hover-border,color-mix(in srgb,var(--listing-card-accent,var(--main)) 50%,var(--border)));
  box-shadow:var(--listing-card-hover-shadow,var(--t-shadow-hover,var(--shadow)));
}
article.card img{
  transition:transform var(--listing-card-image-speed,.35s) var(--t-ease,ease),filter var(--listing-card-image-speed,.35s) var(--t-ease,ease);
  filter:var(--listing-card-image-filter,saturate(1.08) contrast(1.05));
}
article.card:hover img{
  transform:scale(var(--listing-card-image-hover-scale,1.035));
  filter:var(--listing-card-image-hover-filter,var(--listing-card-image-filter,saturate(1.08) contrast(1.05)));
}
.card-body{
  position:relative;
  z-index:2;
  background:var(--listing-card-body-bg,linear-gradient(180deg,color-mix(in srgb,var(--card) 88%,transparent),var(--card)));
}
.card-body h3{
  display:inline;
  align-self:flex-start;
  padding:var(--listing-card-title-padding,.08em .3em .12em);
  border-left:var(--listing-card-title-border,3px solid var(--listing-card-accent,var(--main)));
  border-radius:var(--listing-card-title-radius,calc(var(--listing-card-radius,var(--rad)) / 2));
  background:var(--listing-card-title-bg,color-mix(in srgb,var(--card) 74%,var(--bg) 26%));
  color:var(--listing-card-title-color,var(--txt));
  text-shadow:var(--listing-card-title-shadow,0 1px 20px rgba(0,0,0,.55));
  line-height:var(--listing-card-title-line-height,1.22);
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
}
.card-body p{
  color:var(--listing-card-text-color,color-mix(in srgb,var(--txt) 72%,transparent));
}
.card-body .card-meta{
  color:var(--listing-card-meta-color,color-mix(in srgb,var(--listing-card-accent,var(--main)) 62%,var(--txt)));
  border-top-color:var(--listing-card-meta-border,color-mix(in srgb,var(--listing-card-accent,var(--main)) 22%,var(--border-subtle)));
  letter-spacing:var(--listing-card-meta-spacing,var(--t-label-spacing,.05em));
  text-transform:var(--listing-card-meta-transform,var(--t-label-transform,uppercase));
}
/* Shared public collection contract. The renderer is reused by home, category,
   shop, streaming and related collections; themes continue to own color tokens. */
.collection-shell{
  container-type:inline-size;
  width:100%;
  max-width:clamp(64rem,94vw,112rem);
  margin-inline:auto;
  padding-inline:clamp(.25rem,1.2vw,1rem);
}
.collection-grid{
  --collection-card-min:clamp(15.5rem,18vw,20rem);
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--collection-card-min)),1fr));
  grid-auto-flow:dense;
  align-items:stretch;
  gap:clamp(.85rem,1.55vw,1.35rem);
}
.collection-grid:not(.collection-grid--list)[data-count="1"]{
  grid-template-columns:minmax(0,min(100%,32rem));
  justify-content:start;
}
.collection-grid:not(.collection-grid--list)[data-count="2"]{
  grid-template-columns:repeat(2,minmax(0,32rem));
  justify-content:start;
}
.collection-card{
  min-width:0;
  height:100%;
}
.collection-card__link{
  display:flex;
  flex-direction:column;
  min-width:0;
  height:100%;
  color:inherit;
  text-decoration:none;
}
.collection-card__link:hover{text-decoration:none}
.collection-card__link:focus-visible{outline:3px solid color-mix(in srgb,var(--main) 72%,var(--txt));outline-offset:-3px}
.collection-card__media,
.collection-card__placeholder{
  display:block;
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
  background:color-mix(in srgb,var(--card) 80%,var(--main));
}
.collection-card__placeholder{display:flex;align-items:center;justify-content:center}
.collection-card__body{
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  align-items:flex-start;
  min-width:0;
  gap:clamp(.42rem,.8vw,.65rem);
  padding:clamp(.82rem,1.45vw,1.1rem);
}
.collection-card__title{
  margin:0;
  max-width:100%;
  overflow-wrap:anywhere;
  font-size:clamp(1rem,1.5vw,1.25rem);
}
.collection-card__excerpt{
  display:-webkit-box;
  margin:0;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  line-height:1.55;
}
.collection-card__meta{margin-top:auto;width:100%}
.collection-card__tags{position:relative;z-index:3;padding:0 clamp(.82rem,1.45vw,1.1rem) clamp(.82rem,1.45vw,1.1rem)}
.collection-card--editorial .collection-card__title{
  display:block;
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  color:var(--txt);
  text-shadow:none;
  line-height:1.18;
}
.collection-card--editorial .collection-card__body{
  background:linear-gradient(180deg,color-mix(in srgb,var(--card) 94%,transparent),color-mix(in srgb,var(--card) 98%,var(--bg)));
}
.collection-grid--list{grid-template-columns:1fr}
.collection-card--list .collection-card__link{display:grid;grid-template-columns:minmax(9rem,28%) minmax(0,1fr)}
.collection-card--list .collection-card__media,.collection-card--list .collection-card__placeholder{height:100%;aspect-ratio:auto;min-height:10rem}
.editorial-home{padding-block:clamp(.25rem,1.5vw,1rem) clamp(1.5rem,4vw,3rem)}
.editorial-home__section+.editorial-home__section{margin-top:clamp(1.8rem,4vw,3.4rem)}
.collection-section-skeleton{min-height:clamp(12rem,24vw,20rem)}
.collection-empty{padding:clamp(2rem,6vw,5rem);text-align:center;opacity:.62}
@container (min-width:70rem){
  .collection-grid[data-count="6"]{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@container (min-width:96rem){
  .collection-grid{--collection-card-min:16rem}
  .collection-grid[data-count="6"]{grid-template-columns:repeat(6,minmax(0,1fr))}
  .collection-grid[data-count="12"]{grid-template-columns:repeat(6,minmax(0,1fr))}
}
@media(max-width:680px){
  .collection-shell{padding-inline:0}
  .collection-grid{--collection-card-min:min(100%,18rem);gap:.8rem}
  .collection-grid:not(.collection-grid--list)[data-count="1"],.collection-grid:not(.collection-grid--list)[data-count="2"]{grid-template-columns:1fr}
  .collection-card--list .collection-card__link{grid-template-columns:1fr}
  .collection-card--list .collection-card__media,.collection-card--list .collection-card__placeholder{height:auto;aspect-ratio:16/10;min-height:0}
}
.feature-card{
  isolation:isolate;
  border:var(--listing-card-border,1px solid var(--border-subtle));
  border-radius:var(--listing-card-radius,var(--rad));
  box-shadow:var(--listing-card-shadow,var(--t-shadow,var(--shadow)));
  transition:transform var(--listing-card-speed,var(--t-speed,.2s)) var(--t-ease,ease),box-shadow var(--listing-card-speed,var(--t-speed,.2s)) var(--t-ease,ease),border-color var(--listing-card-speed,var(--t-speed,.2s)) var(--t-ease,ease);
}
.feature-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
  background:var(--listing-feature-overlay,linear-gradient(90deg,color-mix(in srgb,#000 72%,transparent),transparent 62%),linear-gradient(180deg,transparent 20%,rgba(0,0,0,.82)));
}
.feature-card:hover{
  transform:translateY(var(--listing-card-hover-y,-4px));
  border-color:var(--listing-card-hover-border,color-mix(in srgb,var(--listing-card-accent,var(--main)) 50%,var(--border)));
  box-shadow:var(--listing-card-hover-shadow,var(--t-shadow-hover,var(--shadow)));
}
.feature-card-media{
  filter:var(--listing-card-image-filter,saturate(1.08) contrast(1.05) brightness(.92));
  transition:transform var(--listing-card-image-speed,.35s) var(--t-ease,ease),filter var(--listing-card-image-speed,.35s) var(--t-ease,ease);
}
.feature-card:hover .feature-card-media{
  transform:scale(var(--listing-card-image-hover-scale,1.035));
  filter:var(--listing-card-image-hover-filter,var(--listing-card-image-filter,saturate(1.08) contrast(1.05) brightness(.92)));
}
.feature-card-copy{
  z-index:2;
}
.feature-card-title{
  display:block;
  width:fit-content;
  max-width:min(100%,var(--listing-feature-title-max,42rem));
  padding:var(--listing-card-title-padding,.08em .3em .12em);
  border-left:var(--listing-card-title-border,3px solid var(--listing-card-accent,var(--main)));
  border-radius:var(--listing-card-title-radius,calc(var(--listing-card-radius,var(--rad)) / 2));
  background:var(--listing-card-title-bg,color-mix(in srgb,#000 58%,var(--listing-card-accent,var(--main)) 18%));
  text-shadow:var(--listing-card-title-shadow,0 2px 22px rgba(0,0,0,.72));
  line-height:var(--listing-card-title-line-height,1.12);
}
/* Shared card-title contract: card headings remain typography, not a second
   box inside the card. Keep this after the theme-token consumers so tenant
   themes cannot accidentally restore a filled title container. */
.card-body h3,
.collection-card__title,
.feature-card-title{
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  box-decoration-break:slice;
  -webkit-box-decoration-break:slice;
}
.feature-card-excerpt{
  text-shadow:0 1px 14px rgba(0,0,0,.75);
}
/* ── MOBILE MENU ── */
.mobile-menu{display:none;position:fixed;inset:0;z-index:9999;background:var(--main);color:var(--txt-main);flex-direction:column;align-items:center;justify-content:center;gap:.5rem;padding:2rem;overflow-y:auto}
.mobile-menu.open{display:flex}
.mobile-menu a{display:block;width:100%;text-align:center;padding:.9rem 1rem;font-size:1.15rem;color:var(--txt-main);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--txt-main,#fff) 10%,transparent);opacity:.9}
.mobile-menu a.mobile-menu-parent{font-weight:700;letter-spacing:.04em}
.mobile-menu a.mobile-menu-subitem{width:min(82%,520px);font-size:1rem;opacity:.78;padding:.65rem 1rem;margin-top:-.25rem;border-bottom-color:color-mix(in srgb,var(--txt-main,#fff) 6%,transparent)}
.mobile-menu a:hover{opacity:1;text-decoration:none}
.mobile-menu a:last-child{border-bottom:none}
.mobile-menu-close{position:absolute;top:1rem;right:1rem;background:none;border:none;color:var(--txt-main);cursor:pointer;padding:8px;font-size:1.5rem;opacity:.7}
.mobile-menu-close:hover{opacity:1}
/* ── NAV TOGGLE (hamburger) ── */
.nav-toggle{display:none;background:none;border:none;color:inherit;cursor:pointer;padding:.25rem;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent}
/* ── AUTH OVERLAY ── */
.auth-overlay{position:fixed;inset:0;background:transparent;z-index:200;display:none;align-items:flex-end;justify-content:center;padding:0}
.auth-overlay.show{display:flex}
.auth-box{background:var(--card);border-radius:12px 12px 0 0;max-width:480px;width:100%;padding:clamp(1.2rem,3vw,2rem);position:relative;box-shadow:0 -4px 24px rgba(0,0,0,.12);animation:auth-slide-up .25s ease}
@keyframes auth-slide-up{from{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}
.auth-tabs{display:flex;gap:0;border-bottom:1px solid var(--border-subtle);margin-bottom:1rem}
.auth-tabs button{flex:1;padding:10px 12px;font-size:.88rem;font-weight:500;background:transparent;border:none;border-bottom:2px solid transparent;color:color-mix(in srgb,var(--txt) 55%,transparent);cursor:pointer;transition:color .15s,border-color .15s}
.auth-tabs button.active{color:var(--txt);border-bottom-color:var(--main)}
.auth-tabs button:hover{color:var(--txt)}
.auth-form{display:flex;flex-direction:column;gap:10px}
.auth-form input{border:1px solid var(--border-subtle);border-radius:8px;padding:10px 12px;font-size:16px;background:var(--bg);color:var(--txt)}
.auth-form input:focus{border-color:var(--main);outline:none}
.auth-form input::placeholder{color:color-mix(in srgb,var(--txt) 40%,transparent)}
.auth-form button[type=submit]{background:var(--main);color:var(--txt-main);border:2px solid color-mix(in srgb,var(--txt) 15%,transparent);border-radius:var(--rad,8px);padding:.65rem 1.4rem;font-size:.9rem;font-weight:700;letter-spacing:var(--t-label-spacing,0);text-transform:var(--t-label-transform,none);cursor:pointer;box-shadow:var(--t-shadow,0 2px 8px rgba(0,0,0,.18));transition:transform var(--t-speed,.18s) var(--t-ease,ease),box-shadow var(--t-speed,.18s) var(--t-ease,ease),opacity var(--t-speed,.18s),filter var(--t-speed,.18s)}
.auth-form button[type=submit]:hover{transform:translateY(-2px) scale(var(--t-hover-scale,1.01));box-shadow:var(--t-shadow-hover,var(--t-shadow,0 8px 20px rgba(0,0,0,.2)));opacity:1;filter:brightness(.98)}
.auth-close{position:absolute;top:12px;right:12px;background:none;border:none;cursor:pointer;color:var(--txt);font-size:1.2rem;opacity:.5;transition:opacity .15s}
.auth-close:hover{opacity:1}
.auth-msg{font-size:.82rem;padding:8px 12px;border-radius:8px;border:1px solid var(--border-subtle);color:var(--txt);margin-bottom:6px}
.auth-msg:empty{display:none}
.auth-msg.err{border-color:var(--err,#e5484d);color:var(--err,#e5484d)}
.auth-msg.ok{border-color:var(--success,#30a46c);color:var(--success,#30a46c)}
/* ── AUTHOR OVERLAY ── */
.author-overlay{position:fixed;inset:0;background:color-mix(in srgb,var(--bg) 60%,transparent);z-index:200;display:none;align-items:center;justify-content:center;padding:1rem}
.author-overlay.show{display:flex}
.author-card .ac-close{position:absolute;top:.75rem;right:.75rem;background:none;border:none;cursor:pointer;color:var(--txt);font-size:1.1rem;opacity:.5}
.author-card .ac-close:hover{opacity:1}
.author-card .ac-avatar{width:64px;height:64px;border-radius:50%;object-fit:cover;border:2px solid var(--border-subtle)}
.author-card .ac-avatar-placeholder{width:64px;height:64px;border-radius:50%;background:var(--border-subtle);display:flex;align-items:center;justify-content:center;font-size:1.4rem;font-weight:700}
.author-card .ac-bio{font-size:.88rem;line-height:1.6;opacity:.8;margin:.75rem 0}
.author-card .ac-links{display:flex;gap:.5rem;flex-wrap:wrap}
.author-card .ac-links a{display:inline-flex;align-items:center;gap:.3rem;font-size:.82rem;opacity:.6;text-decoration:none;color:var(--txt)}
.author-card .ac-links a:hover{opacity:1}
/* ── PROFILE OVERLAY ── */
.profile-overlay{position:fixed;inset:0;background:transparent;z-index:200;display:none;align-items:flex-end;justify-content:center;padding:0}
.profile-overlay.show{display:flex}
/* ── MODAL ── */
.modal-bg,.feat-modal-overlay{position:fixed;inset:0;z-index:150;display:none;align-items:center;justify-content:center;padding:1rem;background:color-mix(in srgb,var(--bg) 60%,transparent)}
.modal-bg.show,.feat-modal-overlay.show{display:flex}
/* ── THEME TOGGLE ── */
.theme-toggle{position:fixed;z-index:99;width:44px;height:44px;border:1px solid var(--border-subtle);border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;background:var(--card);color:var(--txt);box-shadow:0 2px 8px rgba(0,0,0,.08);transition:border-color .15s}
.theme-toggle:hover,.theme-toggle:focus-visible{border-color:var(--border);outline:none}
.theme-toggle svg{width:18px;height:18px}
/* ── NOTIFICATIONS (hidden on frontend) ── */
.notif-btn,.notif-bell,.notif-badge{display:none}
.notif-panel{position:absolute;top:100%;right:0;z-index:60;display:none;background:var(--card);border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.12);min-width:280px;max-height:360px;overflow-y:auto}
.notif-panel.show{display:block}
.notif-item{padding:10px 14px;border-bottom:1px solid var(--border-subtle);font-size:.85rem;cursor:pointer;transition:background .1s;color:var(--txt)}
.notif-item:hover{background:color-mix(in srgb,var(--txt) 4%,var(--card))}
.notif-item:last-child{border-bottom:none}
.notif-item.unread{background:color-mix(in srgb,var(--main) 5%,var(--card))}
.notif-empty{padding:2rem;text-align:center;color:color-mix(in srgb,var(--txt) 50%,transparent);font-size:.85rem}
/* ── TOAST / NOTIFICATIONS ── */
.toast,.notif-toast{position:fixed;z-index:10000;background:var(--card);color:var(--txt);border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.12);padding:12px 18px;font-size:.88rem;animation:toastIn .3s ease}
/* ── DROPDOWNS (always readable) ── */
.nav-dd-menu,.user-dd-menu{position:absolute;z-index:60;display:none;background:var(--card);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.12);min-width:160px;padding:4px 0}
.nav-dropdown.open>.nav-dd-menu,.user-dd-menu.show{display:block}
.nav-dd-menu a,.nav-dd-menu button,.user-dd-menu a,.user-dd-menu button{display:block;width:100%;padding:8px 14px;font-size:.85rem;text-align:left;color:var(--txt);text-decoration:none;background:none;border:none;cursor:pointer;transition:background .1s}
.nav-dd-menu a:hover,.nav-dd-menu button:hover,.user-dd-menu a:hover,.user-dd-menu button:hover{background:color-mix(in srgb,var(--txt) 5%,var(--card));text-decoration:none}
.nav-dropdown,.user-dropdown{position:relative}
#main-nav .nav-dd-menu a,#main-nav .user-dd-menu a{color:var(--txt)}
.list-dropdown{position:absolute;z-index:50;display:none;background:var(--card);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.12);min-width:140px;padding:4px 0}
.list-dropdown.show{display:block}
.list-dd-btn{background:none;border:1px solid var(--border-subtle);border-radius:6px;padding:6px 10px;font-size:.82rem;color:var(--txt);cursor:pointer}
.list-dd-btn:hover{border-color:var(--border)}
.list-dd-menu a,.list-dd-item{display:block;padding:8px 14px;font-size:.85rem;color:var(--txt);text-decoration:none;cursor:pointer;transition:background .1s}
.list-dd-menu a:hover,.list-dd-item:hover{background:color-mix(in srgb,var(--txt) 5%,var(--card))}
.list-dd-item.active{background:color-mix(in srgb,var(--main) 8%,var(--card))}
/* ── EMOJI PICKER ── */
.cm-emoji-picker-wrap{position:relative}
.cm-emoji-picker{position:absolute;z-index:110;display:none;width:320px;max-height:380px;overflow-y:auto;background:var(--card);border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.12);padding:10px}
.cm-emoji-picker.show{display:block}
.cm-emoji-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;border-bottom:1px solid var(--border-subtle);padding-bottom:8px;margin-bottom:8px}
.cm-emoji-tab{padding:5px 4px;font-size:.7rem;font-family:inherit;background:none;border:1px solid var(--border-subtle);border-radius:var(--rad,6px);color:var(--txt);cursor:pointer;text-align:center;transition:.15s;white-space:nowrap}
.cm-emoji-tab:hover{border-color:var(--border);background:color-mix(in srgb,var(--txt) 4%,var(--card))}
.cm-emoji-tab.active{background:var(--main);color:var(--txt-main);border-color:var(--main)}
.cm-emoji-section-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;opacity:.4;padding:.6rem 0 .3rem;display:block}
.cm-emoji-picker button:not(.cm-emoji-tab){background:none;border:none;padding:0;cursor:pointer;border-radius:var(--rad,6px);transition:.1s;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px}
.cm-emoji-picker button:not(.cm-emoji-tab):hover{background:color-mix(in srgb,var(--txt) 8%,var(--card));transform:scale(1.1)}
.cm-emoji-picker img{width:24px;height:24px;display:block}
/* ── AI COMMENT SUGGESTIONS ── */
.cm-ai-modal{display:none;position:fixed;inset:0;z-index:300;background:color-mix(in srgb,var(--bg) 60%,transparent);align-items:center;justify-content:center;padding:1rem}
.cm-ai-modal.show{display:flex}
.cm-ai-panel{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:1.5rem;max-width:480px;width:100%;max-height:80vh;overflow-y:auto;box-shadow:0 12px 40px rgba(0,0,0,.15)}
.cm-ai-panel h4{font-size:.95rem;font-weight:600;margin-bottom:.75rem;display:flex;align-items:center;gap:.4rem}
.cm-ai-suggestion{padding:.6rem .8rem;border:1px solid var(--border-subtle);border-radius:8px;margin-bottom:.4rem;cursor:pointer;font-size:.88rem;line-height:1.5;transition:border-color .15s,background .15s}
.cm-ai-suggestion:hover{border-color:var(--border);background:color-mix(in srgb,var(--txt) 4%,var(--card))}
.cm-ai-loading{text-align:center;padding:1rem;opacity:.6;font-size:.85rem}
.cm-ai-cancel{padding:.35rem .65rem;font-size:.8rem;background:none;border:1px solid var(--border-subtle);border-radius:6px;color:var(--txt);cursor:pointer;margin-top:.5rem}
.author-card{background:var(--card);color:var(--txt);border:1px solid var(--border-subtle);border-top-left-radius:var(--rad);border-top-right-radius:var(--rad);border-bottom:none;padding:clamp(1.5rem,3vw,2.5rem);max-width:480px;width:100%;text-align:center;position:relative;box-shadow:0 -4px 24px rgba(0,0,0,.15);animation:auth-slide-up .3s ease both}
.author-card h3{font-size:clamp(1.1rem,2vw,1.4rem);margin-bottom:.3rem}
.list-dd-menu{display:none;position:absolute;top:calc(100% + 4px);left:0;background:var(--card);border:1px solid var(--border-subtle);border-radius:var(--rad);box-shadow:0 4px 16px rgba(0,0,0,.15);z-index:50;min-width:120px;max-width:calc(100vw - 1rem);padding:.25rem 0;max-height:260px;overflow-y:auto}
.list-dropdown.open .list-dd-menu{display:block}

/* Public collection pages use list-dropdown as a visible toolbar wrapper.
   Keep the legacy hidden dropdown behaviour everywhere else. */
.public-page-shell .list-dropdown{
 display:block;
 position:relative;
 z-index:20;
 min-width:0;
 padding:0;
 background:transparent;
 border:0;
 border-radius:0;
 box-shadow:none;
}
.public-page-shell .list-dropdown .list-dd-menu{
 position:absolute;
}
.public-page-shell .list-dropdown.open .list-dd-menu{
 display:block;
}
.list-dd-item:hover{background:var(--border-subtle)}
.lightbox img{object-fit:contain}
.auth-box h2{font-size:clamp(1.2rem,2.8vw,1.5rem);margin-bottom:1.2rem;color:var(--txt);font-weight:700;letter-spacing:-.02em}
.user-dropdown{position:relative;display:inline-block}
.user-dd-menu{position:absolute;top:100%;right:0;background:var(--card);border:1px solid var(--border-subtle);border-radius:var(--rad);box-shadow:var(--shadow);min-width:160px;max-width:90vw;z-index:50;display:none;padding:.3rem 0}
.user-dd-menu.show{display:block}
.user-dd-menu a,.user-dd-menu button{display:block;width:100%;padding:.5rem 1rem;background:none;border:none;color:var(--txt);text-align:left;cursor:pointer;font-size:clamp(.78rem,1.3vw,.88rem)}
.user-dd-menu a:hover,.user-dd-menu button:hover{background:var(--border-subtle);text-decoration:none}
.nav-dropdown{position:relative;display:inline-block}
.nav-dropdown>.nav-dd-menu{position:absolute;top:100%;left:0;background:var(--card);color:var(--txt);border:1px solid var(--border-subtle);border-radius:var(--rad);box-shadow:var(--shadow);min-width:160px;z-index:50;display:none;padding:.3rem 0;margin-top:.3rem}
.nav-dropdown.open>.nav-dd-menu{display:block}
.nav-dd-menu a{display:block;padding:.5rem 1rem;font-size:clamp(.78rem,1.3vw,.88rem);white-space:normal;color:var(--txt);opacity:1}
.nav-dd-menu a:hover{background:var(--border-subtle);text-decoration:none}
.upgrade-btns .btn-sub,
.upgrade-btns .btn-ot{background:var(--main);color:var(--txt-main)}
@keyframes toastIn{from{opacity:0;transform:translateX(-50%) translateY(-.5rem)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.notif-bell:hover{opacity:1}
.notif-badge{position:absolute;top:-2px;right:-4px;background:var(--err,#e5484d);color:#fff;font-size:.6rem;min-width:16px;height:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:700;padding:0 3px}
.notif-item .notif-from{font-weight:600}
.notif-item .notif-time{opacity:.4;font-size:.7rem}
.ss-top-left .ss-panel,.ss-top-right .ss-panel{top:48px}
.ss-bottom-left .ss-panel,.ss-bottom-right .ss-panel{bottom:48px}
.ss-top-right .ss-panel,.ss-bottom-right .ss-panel{right:0}
.ss-top-left .ss-panel,.ss-bottom-left .ss-panel{left:0}
.cm-emoji-picker.show button:not(.cm-emoji-tab){display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border:none;background:transparent;cursor:pointer;border-radius:var(--rad)}
.cm-emoji-picker.show button:not(.cm-emoji-tab):hover{background:var(--border-subtle)}
.cm-emoji-picker button{background:none;border:none;padding:2px;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.1s;width:36px;height:36px}
.cm-emoji-picker button:hover{background:var(--border-subtle);transform:scale(1.15)}
.cm-ai-panel h4 svg{flex-shrink:0}
.cm-ai-cancel:hover{color:var(--txt)}
.notif-bell{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center}
.list-dd-item{min-height:44px;display:flex;align-items:center}
@media(max-width:600px){.auth-close{width:44px;height:44px}footer[role=contentinfo]{font-size:clamp(.72rem,1.4vw,.82rem)}}
/* ── RESPONSIVE WIDGETS ── */
/* Widgets shell contract: widgets.css loads after every theme frontend stylesheet.
   Even when themes already define the mobile navigation breakpoint, keep the mobile nav visibility rule mirrored here
   so late widget CSS never hides the hamburger or leaves the desktop nav visible on phones again. */
@media(max-width:768px){
  .chat-box{width:calc(100vw - 2rem);right:1rem;bottom:4.5rem}
  .ss-panel{width:calc(100vw - 2rem)}
  .cm-emoji-picker{width:min(280px,calc(100vw - 2rem));left:auto;right:0}
  .nav-toggle{display:flex}#main-nav{display:none}
}
@media(max-width:480px){
  .auth-box{max-width:none;width:100%;border-radius:12px 12px 0 0}
}

/* ── HQ OVERLAY ── */

/* ── SOCIAL HUB FEED LAYOUTS ──
   Theme-independent layout structure for the public Social Hub feed.
   Tenants choose list (default) / mosaic / grid in admin Settings → Social Hub.
   Each card is rendered by _shPostHtml() with shape:
     <article.sh-feed-post>
       <div.cm-avatar>           ← 32px avatar, leftmost
       <div.cm-body>              ← flex:1 — meta + text + media + actions
         <div.cm-meta>...<time></div>
         <div.body.sh-post-body>...</div>
         optional <img|audio|video.sh-post-media>
         <div.cm-actions>         ← horizontal row: comment, share, edit, [reactions push-right]
           <button.sh-comment-btn>   <button.sh-share-btn>   <button.sh-edit-btn>
           <div#sh-react-X style="margin-left:auto"><div.reaction-bar>…</div></div>
         </div>
       </div>
     </article>
   The base rule below makes EVERY .sh-feed-post a horizontal flex (avatar | body)
   regardless of layout container. Without this, avatar collapses under body and
   the reaction bar wraps to a vertical column. This was the visible layout bug. */
.sh-feed-post{
  display:flex;
  align-items:flex-start;
  gap:.7rem;
  padding:clamp(.7rem,1.6vw,1rem);
}
.sh-feed-post>.cm-avatar{
  flex:0 0 36px;
  width:36px;
  height:36px;
  align-self:flex-start;
}
.sh-feed-post>.cm-body{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:.35rem;
}
.sh-feed-post .cm-meta{
  font-size:.8rem;
  display:flex;
  align-items:baseline;
  gap:.4rem;
  flex-wrap:wrap;
}
.sh-feed-post .cm-meta strong{font-weight:600}
.sh-feed-post .cm-meta time{
  font-size:.72rem;
  opacity:.55;
}
.sh-feed-post .body.sh-post-body{
  font-size:.92rem;
  line-height:1.5;
  word-break:break-word;
  cursor:pointer;
}
.sh-feed-post .body.sh-post-body p:first-child{margin-top:0}
.sh-feed-post .body.sh-post-body p:last-child{margin-bottom:0}
.sh-feed-post img.sh-post-media{
  display:block;
  width:100%;
  max-width:100%;
  border-radius:var(--rad,8px);
  margin:.2rem 0 .4rem;
}
/* Social post edit panel: public mutation controls must be visible in-page,
   not hidden behind low-contrast buttons or native browser prompts. */
.sh-feed-post .sh-edit-wrap{
  width:100%;
  margin:.75rem 0 0;
  padding:clamp(.65rem,1.5vw,.9rem);
  border:1px solid var(--border);
  border-radius:var(--rad,8px);
  background:color-mix(in srgb,var(--card) 88%,var(--main));
  box-shadow:0 12px 30px color-mix(in srgb,var(--bg,#000) 34%,transparent);
}
.sh-feed-post .sh-edit-wrap .pf-text{
  width:100%;
  min-height:110px;
  border:1px solid var(--border);
  background:color-mix(in srgb,var(--bg) 88%,var(--card));
  color:var(--txt);
}
.sh-feed-post .sh-edit-actions{
  display:flex;
  align-items:center;
  gap:.55rem;
  flex-wrap:wrap;
  margin-top:.65rem;
}
.sh-feed-post .sh-edit-btn{
  opacity:1;
  font-weight:700;
  border-color:var(--border);
  background:color-mix(in srgb,var(--main) 18%,var(--card));
}
.sh-feed-post .sh-delete-post{
  margin-left:auto;
  opacity:1;
  color:var(--err,#e5484d);
  border-color:color-mix(in srgb,var(--err,#e5484d) 45%,var(--border));
  background:color-mix(in srgb,var(--err,#e5484d) 14%,var(--card));
}
@media(max-width:640px){
  .sh-feed-post .sh-edit-actions{align-items:stretch}
  .sh-feed-post .sh-edit-actions .sh-edit-btn{flex:1;justify-content:center}
  .sh-feed-post .sh-delete-post{margin-left:0;flex-basis:100%}
}
.cm-submit.btn,
.pf-submit.btn,
.sh-comment-btn.btn,
.sh-share-btn.btn,
.sh-edit-btn.btn,
.social-action-btn.btn,
.cm-share-btn.btn,
.cm-reply-btn.btn,
.cm-edit-btn.btn,
.cm-delete-btn.btn,
.tenant-cta-button.btn{
  background:var(--main);
  color:var(--txt-main);
  border-color:color-mix(in srgb,var(--txt) 15%,transparent);
  border-width:2px;
  border-radius:var(--rad);
  opacity:1;
  box-shadow:var(--t-shadow,0 2px 8px rgba(0,0,0,.18));
  transition:transform var(--t-speed,.18s) var(--t-ease,ease),box-shadow var(--t-speed,.18s),filter var(--t-speed,.18s),opacity var(--t-speed,.18s);
}
.cm-submit.btn:hover,
.pf-submit.btn:hover,
.sh-comment-btn.btn:hover,
.sh-share-btn.btn:hover,
.sh-edit-btn.btn:hover,
.social-action-btn.btn:hover,
.cm-share-btn.btn:hover,
.cm-reply-btn.btn:hover,
.cm-edit-btn.btn:hover,
.cm-delete-btn.btn:hover,
.tenant-cta-button.btn:hover{
  transform:translateY(-2px) scale(var(--t-hover-scale,1.01));
  box-shadow:var(--t-shadow-hover,var(--t-shadow,0 8px 20px rgba(0,0,0,.2)));
  filter:brightness(.98);
  opacity:1;
  text-decoration:none;
}
/* cm-actions: horizontal row of buttons + reaction bar pushed right by margin-left:auto on the reaction wrapper. */
.sh-feed-post .cm-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.4rem;
  margin-top:.3rem;
}
.sh-feed-post .cm-actions>.sh-react-wrap{
  display:flex;
  align-items:center;
  min-width:0;
  margin-left:auto;
}
.sh-feed-post .cm-actions .reaction-bar{
  display:flex;
  flex-wrap:wrap;
  gap:.25rem;
  margin-top:0;             /* override theme rule that adds top margin */
  align-items:center;
  justify-content:flex-end;
}

/* List layout (default, single column) */
.sh-feed-list{display:block}
.sh-feed-list .sh-feed-post{margin-bottom:1rem}

/* Mosaic layout (adaptive masonry columns) */
.sh-feed-mosaic{column-width:360px;column-gap:clamp(.9rem,1.6vw,1.2rem);max-width:min(1320px,100%);margin-inline:auto}
.sh-feed-mosaic .sh-feed-post{
  break-inside:avoid;
  page-break-inside:avoid;
  -webkit-column-break-inside:avoid;
  display:flex;
  flex-direction:column;
  gap:.5rem;
  width:100%;
  margin:0 0 clamp(.9rem,1.6vw,1.2rem) 0;
}
.sh-feed-mosaic .sh-feed-post>.cm-avatar{
  align-self:flex-start;
}
.sh-feed-mosaic .sh-feed-post>.cm-body{
  width:100%;
}

/* Grid layout (uniform tiles) */
.sh-feed-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),420px));
  gap:clamp(.9rem,1.6vw,1.2rem);
  align-items:start;
  justify-content:center;
}
/* Inside a grid cell, switch the card from row to column so avatar sits ON TOP
   of a tighter card body — this makes uniform tiles read better. */
.sh-feed-grid .sh-feed-post{
  margin:0;
  display:flex;
  flex-direction:column;
  gap:.5rem;
}
.sh-feed-grid .sh-feed-post>.cm-avatar{
  align-self:flex-start;
}
.sh-feed-grid .sh-feed-post>.cm-body{
  width:100%;
}
.sh-feed-grid .sh-feed-post .cm-actions>.sh-react-wrap,
.sh-feed-mosaic .sh-feed-post .cm-actions>.sh-react-wrap{
  margin-left:auto;
  width:auto;
}
.sh-feed-grid .sh-feed-post .cm-actions .reaction-bar,
.sh-feed-mosaic .sh-feed-post .cm-actions .reaction-bar{
  flex-wrap:nowrap;
  justify-content:flex-end;
}
.sh-feed-grid .sh-feed-post .sh-post-media,
.sh-feed-grid .sh-feed-post img.sh-post-media{
  aspect-ratio:4/3;
  object-fit:cover;
  width:100%;
}
.sh-feed-mosaic .sh-feed-post .sh-post-media,
.sh-feed-mosaic .sh-feed-post img.sh-post-media{
  aspect-ratio:4/3;
  object-fit:cover;
  width:100%;
}
.sh-feed-grid .sh-feed-post .body.sh-post-body{
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
}
.sh-feed-mosaic>#inf-social{column-span:all;-webkit-column-span:all}
.sh-feed-grid>#inf-social{grid-column:1/-1}

/* Streaming page grid/cards follow the global page-width contract. */
.sp-list{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),280px));
  gap:clamp(.9rem,1.7vw,1.2rem);
  justify-content:center;
  align-items:start;
}
.sp-card{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  text-decoration:none;
}
.sp-card .sp-card-img,
.sp-card .sp-card-img-placeholder{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--border-subtle);
}
.sp-card-body{min-width:0}
.post-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));
  gap:clamp(.85rem,1.8vw,1.2rem);
  align-items:stretch;
}
.post-card{
  display:flex;
  flex-direction:column;
  gap:.55rem;
  min-width:0;
  padding:clamp(.9rem,2vw,1.15rem);
  color:var(--txt);
  background:var(--card);
  border:1px solid color-mix(in srgb,var(--main) 16%,var(--border-subtle));
  border-radius:calc(var(--rad) + 6px);
  box-shadow:var(--t-shadow,var(--shadow));
  transition:transform var(--t-speed,.2s) var(--t-ease,ease),box-shadow var(--t-speed,.2s) var(--t-ease,ease),border-color var(--t-speed,.2s) var(--t-ease,ease),background var(--t-speed,.2s) var(--t-ease,ease);
}
.post-card h2{
  margin:0;
  font-size:clamp(1.05rem,2vw,1.3rem);
  line-height:1.18;
}
.post-card h2 a{
  color:inherit;
  text-decoration:none;
}
.post-card h2 a::after{
  content:"";
  display:block;
  width:2.2rem;
  height:2px;
  margin-top:.45rem;
  background:color-mix(in srgb,var(--main) 70%,transparent);
  transition:width var(--t-speed,.2s) var(--t-ease,ease),background var(--t-speed,.2s) var(--t-ease,ease);
}
.post-card .meta{
  margin:0;
  color:color-mix(in srgb,var(--txt) 62%,transparent);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.post-card p{
  margin:0;
  color:color-mix(in srgb,var(--txt) 78%,transparent);
  line-height:1.55;
}
.post-card:hover,
.post-card:focus-within{
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--main) 42%,var(--border));
  box-shadow:var(--t-shadow-hover,0 18px 44px color-mix(in srgb,var(--main) 16%,transparent));
}
.post-card:hover h2 a::after,
.post-card:focus-within h2 a::after{
  width:3.6rem;
  background:var(--main);
}
.chess-hub-content .content-card{
  max-width:min(100%,64rem);
}
.chess-card{
  min-height:11rem;
}
.chess-page-content .content-card>.meta{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  margin:0 0 .8rem;
  padding:.35rem .65rem;
  color:var(--txt-main);
  background:var(--main);
  border-radius:999px;
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.chess-tool{
  display:grid;
  grid-template-columns:minmax(220px,320px) minmax(0,1fr);
  gap:clamp(1rem,2.5vw,1.6rem);
  align-items:start;
  margin:clamp(1.1rem,2.4vw,1.7rem) 0;
  padding:clamp(.95rem,2.4vw,1.35rem);
  border:1px solid color-mix(in srgb,var(--main) 28%,var(--border));
  border-radius:calc(var(--rad) + 8px);
  background:linear-gradient(135deg,color-mix(in srgb,var(--card) 92%,var(--main) 8%),color-mix(in srgb,var(--card) 96%,var(--ac1) 4%));
  box-shadow:0 16px 42px color-mix(in srgb,var(--main) 10%,transparent);
}
.chess-board-wrap{
  min-width:0;
}
.chess-board-wrap h2,
.chess-tool-panel h2{
  margin:0 0 .75rem;
  font-size:clamp(1rem,1.8vw,1.2rem);
}
.chess-board,
.chess-board-grid{
  display:grid;
  grid-template-columns:repeat(8,1fr);
  width:100%;
  aspect-ratio:1/1;
  overflow:hidden;
  border:2px solid color-mix(in srgb,var(--txt) 70%,var(--main));
  border-radius:calc(var(--rad) + 2px);
  background:var(--card);
}
.chess-board-frame{
  display:grid;
  grid-template-columns:1.25rem auto;
  grid-template-rows:auto 1.25rem;
  gap:.28rem;
  width:max-content;
  max-width:100%;
  align-items:stretch;
  justify-content:start;
  padding:.45rem .55rem .55rem .38rem;
  border:2px solid color-mix(in srgb,var(--txt) 70%,var(--main));
  border-radius:calc(var(--rad) + 6px);
  background:color-mix(in srgb,var(--card) 88%,var(--bg) 12%);
  box-shadow:0 12px 26px rgba(0,0,0,.14);
}
.chess-board-frame .chess-board-grid{
  grid-column:2;
  grid-row:1;
  width:max-content;
  max-width:100%;
  border:0;
  border-radius:calc(var(--rad) + 1px);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.18);
}
.chess-board-ranks{
  grid-column:1;
  grid-row:1;
  display:grid;
  grid-template-rows:repeat(8,var(--chess-cell,44px));
  align-items:center;
  justify-items:center;
  color:color-mix(in srgb,var(--txt) 78%,var(--main) 22%);
  font:700 .72rem/1 var(--t-sans,system-ui,sans-serif);
  user-select:none;
}
.chess-board-files{
  grid-column:2;
  grid-row:2;
  display:grid;
  grid-template-columns:repeat(8,var(--chess-cell,44px));
  align-items:center;
  justify-items:center;
  color:color-mix(in srgb,var(--txt) 78%,var(--main) 22%);
  font:700 .72rem/1 var(--t-sans,system-ui,sans-serif);
  text-transform:uppercase;
  user-select:none;
}
.chess-board-rank-label,
.chess-board-file-label{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
}
.chess-square{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  min-height:0;
  font-size:clamp(1.15rem,5.8vw,2.25rem);
  line-height:1;
  font-family:Georgia,'Times New Roman',serif;
  color:var(--txt);
  user-select:none;
}
.chess-board-grid .chess-square{
  width:var(--chess-cell,44px);
  height:var(--chess-cell,44px);
  aspect-ratio:auto;
  border:0;
  border-radius:0;
}
.chess-square button,
button.chess-square{
  cursor:pointer;
}
.chess-piece-drag-handle{
  display:flex;
  width:100%;
  height:100%;
  align-items:center;
  justify-content:center;
  cursor:grab;
  touch-action:none;
}
.chess-piece-drag-handle:active{
  cursor:grabbing;
}
.chess-square.light{
  background:var(--chess-light,color-mix(in srgb,var(--card) 88%,var(--ac1) 12%));
}
.chess-square.dark{
  background:var(--chess-dark,color-mix(in srgb,var(--main) 34%,var(--txt) 8%));
  color:var(--txt-main);
}
.chess-piece-img{
  width:72%;
  height:72%;
  object-fit:contain;
  pointer-events:none;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.35));
}
.chess-tool-panel{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:.85rem;
}
.chess-note,
.chess-solution{
  padding:.85rem 1rem;
  border:1px solid color-mix(in srgb,var(--main) 24%,var(--border));
  border-radius:var(--rad);
  background:color-mix(in srgb,var(--card) 88%,transparent);
}
.chess-note p,
.chess-solution p{
  margin:0;
  line-height:1.6;
}
.chess-solution summary{
  cursor:pointer;
  color:var(--txt);
  font-weight:800;
}
.category-type-section{margin-top:clamp(1.2rem,2.5vw,2rem)}
.category-type-section>h2{font-size:clamp(1.05rem,2vw,1.35rem);margin:0 0 .8rem}
.category-list{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(.8rem,1.6vw,1.1rem)}
.category-card-list{display:block}
.category-card-list>a{display:grid;grid-template-columns:minmax(120px,220px) minmax(0,1fr);align-items:stretch;height:100%;color:inherit;text-decoration:none}
.category-card-list>a>img{width:100%;height:100%;min-height:150px;object-fit:cover}
.category-tags{display:flex;flex-wrap:wrap;gap:.35rem;margin:.7rem 0 0}
.category-tags a{font-size:.78rem;line-height:1;text-decoration:none;padding:.28rem .45rem;border:1px solid var(--border-subtle,rgba(0,0,0,.12));border-radius:999px;color:var(--txt,#111);background:var(--card-bg,rgba(255,255,255,.55))}
@media(max-width:760px){
  .sh-feed-grid{grid-template-columns:minmax(0,1fr)}
  .sp-list{grid-template-columns:minmax(0,1fr)}
  .chess-tool{grid-template-columns:minmax(0,1fr)}
  .chess-board,.chess-board-frame{max-width:min(100%,320px)}
  .chess-board-frame{--chess-cell:min(10vw,36px);padding:.32rem .38rem .42rem .25rem}
  .chess-board-frame .chess-board-grid{grid-template-columns:repeat(8,var(--chess-cell))!important}
  .chess-board-ranks{grid-template-rows:repeat(8,var(--chess-cell));font-size:.62rem}
  .chess-board-files{grid-template-columns:repeat(8,var(--chess-cell));font-size:.62rem}
  .category-card-list>a{grid-template-columns:minmax(0,1fr)}
  .category-card-list>a>img{height:auto;min-height:0}
}

/* Public markdown rendering contract: widgets.css owns structure; theme frontend.css files own --md-* styling tokens. */
.body .md-table-wrap{width:100%;border:var(--md-table-border,1px solid color-mix(in srgb,var(--main) 34%,var(--border)));overflow-x:auto;-webkit-overflow-scrolling:touch;margin:clamp(1rem,2vw,1.35rem) 0;border-radius:var(--md-table-radius,calc(var(--rad) + 4px));background:var(--md-table-bg,linear-gradient(135deg,color-mix(in srgb,var(--card) 86%,var(--main) 14%),color-mix(in srgb,var(--card) 90%,var(--ac2) 10%)));box-shadow:var(--md-table-shadow,0 16px 42px color-mix(in srgb,var(--main) 10%,transparent))}
.body table.md-table{width:100%;min-width:520px;border-collapse:separate;border-spacing:0;font-size:clamp(.78rem,1.35vw,.92rem);line-height:1.55;color:var(--txt)}
.body table.md-table th,.body table.md-table td{padding:clamp(.62rem,1.2vw,.9rem) clamp(.7rem,1.5vw,1rem);vertical-align:top;border-bottom:1px solid color-mix(in srgb,var(--main) 18%,var(--border-subtle))}
.body table.md-table th{color:var(--txt);background:var(--md-table-head-bg,linear-gradient(180deg,color-mix(in srgb,var(--main) 22%,transparent),color-mix(in srgb,var(--ac1) 10%,transparent)));border-bottom:var(--md-table-head-border,2px solid color-mix(in srgb,var(--main) 70%,var(--border)));font-weight:700;letter-spacing:.01em}
.body table.md-table td{color:color-mix(in srgb,var(--txt) 82%,transparent)}
.body table.md-table tbody tr:nth-child(even){background:var(--md-table-row-even-bg,color-mix(in srgb,var(--main) 5%,transparent))}
.body table.md-table tbody tr:hover{background:var(--md-table-row-hover-bg,color-mix(in srgb,var(--main) 10%,transparent))}
.body table.md-table tr:last-child td{border-bottom:none}
.content-card>.body h2,.content-card>.body h3{margin:clamp(1.6rem,3vw,2.2rem) 0 clamp(.8rem,1.6vw,1rem);line-height:1.28;text-transform:var(--md-heading-transform,none);letter-spacing:var(--md-heading-spacing,var(--t-heading-spacing,normal))}
.content-card>.body h2:first-child,.content-card>.body h3:first-child{margin-top:0}
.post-hero img{transition:transform .24s ease,filter .24s ease}
.post-hero:hover img{transform:scale(1.012);filter:saturate(1.04)}
.content-listing-page>.content-card+.grid{margin-top:clamp(1rem,2.5vw,1.5rem)}
#funnel-step-stream{display:flex;flex-direction:column;gap:clamp(1.5rem,4vw,3rem)}
.funnel-step-page{display:block;width:100%}
.funnel-step-page .funnel-section-inner{--funnel-step-card-bleed:clamp(1.5rem,4vw,2.5rem);margin-inline:auto;width:100%;max-width:none}
.funnel-step-hero{display:block;width:calc(100% + var(--funnel-step-card-bleed) + var(--funnel-step-card-bleed));margin:calc(-1 * var(--funnel-step-card-bleed)) calc(-1 * var(--funnel-step-card-bleed)) clamp(1rem,3vw,1.5rem);overflow:hidden;cursor:zoom-in}
.funnel-step-hero img{display:block;width:100%;height:auto}
@keyframes funnel-cta-pulse{0%,100%{opacity:.28;transform:scale(.96)}50%{opacity:.7;transform:scale(1.05)}}
@keyframes funnel-cta-shine{0%{transform:translateX(-130%) skewX(-18deg)}52%,100%{transform:translateX(130%) skewX(-18deg)}}
.funnel-step-page .funnel-cta{display:flex;justify-content:center;margin:clamp(1.6rem,4.5vw,2.8rem) auto 0;padding:clamp(1rem,2.8vw,1.35rem);position:relative}
.funnel-step-page .funnel-cta::before{content:"";position:absolute;inset:.2rem;border-radius:calc(var(--rad) + 16px);background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--funnel-cta-main,var(--main)) 24%,transparent),color-mix(in srgb,var(--funnel-cta-ac1,var(--ac1)) 16%,transparent) 42%,transparent 72%);filter:blur(13px);opacity:.72;pointer-events:none;animation:funnel-cta-pulse 2.9s ease-in-out infinite}
.funnel-step-page .funnel-cta .funnel-btn-next{display:inline-flex;align-items:center;justify-content:center;gap:.75em;font-size:clamp(1rem,2.2vw,1.25rem);min-width:min(100%,28rem);font-family:var(--funnel-cta-font,inherit);border-radius:var(--funnel-cta-radius,var(--rad));position:relative;z-index:1;isolation:isolate;overflow:hidden;padding:clamp(1rem,2.3vw,1.25rem) clamp(1.7rem,4.6vw,3rem);text-align:center;text-transform:uppercase;letter-spacing:clamp(.08em,.6vw,.16em);font-weight:900;border:1px solid color-mix(in srgb,var(--funnel-cta-text,var(--txt-main)) 40%,var(--border));background:linear-gradient(135deg,var(--funnel-cta-main,var(--main)),color-mix(in srgb,var(--funnel-cta-ac1,var(--ac1)) 82%,var(--funnel-cta-main,var(--main))),var(--funnel-cta-ac2,var(--ac2)));color:var(--funnel-cta-text,var(--txt-main));-webkit-text-stroke:.45px var(--funnel-cta-text-stroke,rgba(0,0,0,.68));text-shadow:0 1px 1px var(--funnel-cta-text-shadow,rgba(0,0,0,.72)),0 2px 5px var(--funnel-cta-text-shadow,rgba(0,0,0,.52)),0 0 12px color-mix(in srgb,var(--funnel-cta-main,var(--main)) 36%,transparent),0 0 1px color-mix(in srgb,var(--funnel-cta-text,var(--txt-main)) 70%,transparent);box-shadow:0 22px 54px color-mix(in srgb,var(--funnel-cta-main,var(--main)) 28%,transparent),0 0 0 1px color-mix(in srgb,var(--funnel-cta-text,var(--txt-main)) 16%,transparent) inset,0 1px 0 color-mix(in srgb,var(--funnel-cta-text,var(--txt-main)) 28%,transparent) inset;transition:transform var(--t-speed,.2s) var(--t-ease,ease),box-shadow var(--t-speed,.2s) var(--t-ease,ease),filter var(--t-speed,.2s) var(--t-ease,ease)}
.funnel-step-page .funnel-cta .funnel-btn-next::before{content:"";position:absolute;inset:-40% -70%;background:linear-gradient(120deg,transparent 36%,color-mix(in srgb,var(--funnel-cta-text,var(--txt-main)) 28%,transparent) 48%,color-mix(in srgb,var(--funnel-cta-text,var(--txt-main)) 44%,transparent) 52%,transparent 64%);z-index:-1;pointer-events:none;animation:funnel-cta-shine 3.4s ease-in-out infinite}
.funnel-step-page .funnel-cta .funnel-btn-next::after{content:"";display:inline-block;width:.58em;height:.58em;margin-left:.1em;border-right:2px solid currentColor;border-bottom:2px solid currentColor;position:relative;z-index:1;transform:rotate(-45deg) translateY(-1px);transition:transform var(--t-speed,.2s) var(--t-ease,ease)}
.funnel-step-page .funnel-cta .funnel-btn-next:hover{filter:saturate(1.15) brightness(1.04);transform:translateY(-2px) scale(1.01);box-shadow:0 30px 74px color-mix(in srgb,var(--funnel-cta-main,var(--main)) 34%,transparent),0 0 0 1px color-mix(in srgb,var(--funnel-cta-text,var(--txt-main)) 24%,transparent) inset,0 1px 0 color-mix(in srgb,var(--funnel-cta-text,var(--txt-main)) 34%,transparent) inset}
.funnel-step-page .funnel-cta .funnel-btn-next:hover::after{transform:rotate(-45deg) translate(.12em,.1em)}
.funnel-step-page .funnel-cta .funnel-btn-next:focus-visible{outline:3px solid color-mix(in srgb,var(--funnel-cta-ac2,var(--ac2)) 70%,var(--funnel-cta-text,var(--txt-main)));outline-offset:4px}
@media (prefers-reduced-motion:reduce){.funnel-step-page .funnel-cta::before,.funnel-step-page .funnel-cta .funnel-btn-next::before{animation:none}.funnel-step-page .funnel-cta .funnel-btn-next,.funnel-step-page .funnel-cta .funnel-btn-next::after{transition:none}}
.funnel-step-page .funnel-cta .funnel-btn-next.btn{min-width:auto;background:var(--main);color:var(--txt-main);-webkit-text-stroke:0;text-shadow:none;border:2px solid color-mix(in srgb,var(--txt) 15%,transparent);box-shadow:var(--t-shadow);letter-spacing:var(--t-label-spacing);font-weight:700}
.funnel-step-page .funnel-cta .funnel-btn-next.btn::before,.funnel-step-page .funnel-cta .funnel-btn-next.btn::after{content:none}
.funnel-step-page .funnel-cta .funnel-btn-next.btn:hover{filter:none;transform:translateY(-2px) scale(var(--t-hover-scale));box-shadow:var(--t-shadow-hover)}
#funnel-step-sentinel{width:100%;min-height:1px}

/* Category Wiki presentation */
.wiki-category-shell{width:min(100%,1180px);margin:0 auto;padding:clamp(.75rem,2vw,1.4rem) 0 2rem;font-family:Georgia,"Times New Roman",serif}
.wiki-category-intro{padding:clamp(1rem,2.8vw,1.65rem) 0;border-bottom:1px solid color-mix(in srgb,var(--txt) 30%,transparent)}
.wiki-category-kicker{margin:0 0 .35rem;font:700 .72rem/1.2 system-ui,-apple-system,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:color-mix(in srgb,var(--txt) 58%,var(--main))}
.wiki-category-intro h1{margin:0;font-size:clamp(2rem,5vw,3.8rem);font-weight:500;line-height:1.05;letter-spacing:-.035em}
.wiki-category-intro p{max-width:72ch;margin:.65rem 0 0;line-height:1.65;color:color-mix(in srgb,var(--txt) 74%,transparent)}
.wiki-category-layout{display:grid;grid-template-columns:minmax(190px,240px) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start;padding-top:clamp(1.25rem,3vw,2rem)}
.wiki-category-layout.wiki-no-facets{grid-template-columns:minmax(0,1fr)}
.wiki-facets{position:sticky;top:calc(var(--header-height,72px) + 1rem);display:grid;gap:1.4rem;padding-right:1.25rem;border-right:1px solid color-mix(in srgb,var(--txt) 18%,transparent);font-family:system-ui,-apple-system,sans-serif}
.wiki-facet-title{margin:0 0 .65rem;font-size:.73rem;line-height:1.2;letter-spacing:.11em;text-transform:uppercase;color:color-mix(in srgb,var(--txt) 62%,transparent)}
.wiki-topic-list{display:grid;gap:.25rem}
.wiki-topic-filter{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.48rem .55rem;border:0;border-left:3px solid transparent;border-radius:0;background:transparent;color:inherit;font:600 .86rem/1.25 system-ui,-apple-system,sans-serif;text-align:left;cursor:pointer}
.wiki-topic-filter:hover{background:color-mix(in srgb,var(--main) 8%,transparent)}
.wiki-topic-filter[aria-pressed="true"]{border-left-color:var(--main);background:color-mix(in srgb,var(--main) 13%,transparent);color:var(--txt)}
.wiki-topic-count{min-width:1.8em;text-align:right;font-variant-numeric:tabular-nums;opacity:.52}
.wiki-clear-filters{justify-self:start;border:0;border-bottom:1px solid currentColor;background:transparent;color:inherit;padding:.2rem 0;font:600 .78rem/1.3 system-ui,-apple-system,sans-serif;cursor:pointer;opacity:.7}
.wiki-main{min-width:0}
.wiki-toolbar{display:grid;grid-template-columns:minmax(180px,1fr) minmax(150px,auto);gap:.75rem;align-items:end;padding-bottom:1rem;border-bottom:1px solid color-mix(in srgb,var(--txt) 24%,transparent);font-family:system-ui,-apple-system,sans-serif}
.wiki-toolbar label{display:grid;gap:.35rem;font-size:.72rem;font-weight:750;letter-spacing:.06em;text-transform:uppercase;color:color-mix(in srgb,var(--txt) 66%,transparent)}
.wiki-toolbar input,.wiki-toolbar select{width:100%;min-height:42px;padding:.65rem .75rem;border:1px solid color-mix(in srgb,var(--txt) 28%,transparent);border-radius:3px;background:color-mix(in srgb,var(--bg) 92%,var(--txt) 8%);color:var(--txt);font:500 .92rem/1.2 system-ui,-apple-system,sans-serif}
.wiki-toolbar input:focus,.wiki-toolbar select:focus{outline:2px solid color-mix(in srgb,var(--main) 74%,transparent);outline-offset:2px}
.wiki-result-count{margin:.8rem 0 0;font:600 .78rem/1.4 system-ui,-apple-system,sans-serif;color:color-mix(in srgb,var(--txt) 62%,transparent)}
.wiki-alphabet{display:flex;flex-wrap:nowrap;gap:.08rem;margin:.9rem 0 0;padding:.65rem 0;border-top:1px solid color-mix(in srgb,var(--txt) 13%,transparent);border-bottom:1px solid color-mix(in srgb,var(--txt) 13%,transparent);font-family:system-ui,-apple-system,sans-serif}
.wiki-alphabet button,.wiki-alphabet a,.wiki-alphabet span{flex:1 1 0;min-width:0;min-height:2rem;display:grid;place-items:center;border:0;border-radius:2px;background:transparent;color:inherit;font:700 .8rem/1 system-ui,-apple-system,sans-serif;text-decoration:none;cursor:pointer}
.wiki-alphabet button:first-child,.wiki-alphabet a:first-child{flex:0 0 auto;min-width:3.1rem;padding-inline:.45rem}
.wiki-alphabet button:hover:not(:disabled),.wiki-alphabet a:hover{background:color-mix(in srgb,var(--main) 11%,transparent)}
.wiki-alphabet button[aria-pressed="true"],.wiki-alphabet a[aria-current="true"]{background:var(--main);color:var(--txt-main)}
.wiki-alphabet button:disabled,.wiki-alphabet span{opacity:.2;cursor:not-allowed}
.wiki-groups{display:grid;gap:clamp(1.4rem,3vw,2.2rem);margin-top:1rem}
.wiki-group{scroll-margin-top:calc(var(--header-height,72px) + 1rem)}
.wiki-group-title{display:flex;align-items:baseline;gap:.7rem;margin:0;padding:0 0 .35rem;border-bottom:1px solid color-mix(in srgb,var(--txt) 32%,transparent);font-size:clamp(1.45rem,3vw,2rem);font-weight:500;line-height:1.15}
.wiki-group-count{font:600 .72rem/1 system-ui,-apple-system,sans-serif;opacity:.48}
.wiki-entry-list{list-style:none;margin:0;padding:0}
.wiki-entry{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.55rem 1.2rem;padding:.95rem 0;border-bottom:1px solid color-mix(in srgb,var(--txt) 12%,transparent)}
.wiki-entry-main{min-width:0}
.wiki-entry-title{display:inline;color:var(--txt);font-size:clamp(1.03rem,2vw,1.22rem);font-weight:600;line-height:1.35;text-decoration:none;text-decoration-color:color-mix(in srgb,var(--main) 60%,transparent);text-underline-offset:.18em}
.wiki-entry-title:hover{text-decoration:underline}
.wiki-entry-description{max-width:76ch;margin:.3rem 0 0;color:color-mix(in srgb,var(--txt) 70%,transparent);font-size:.94rem;line-height:1.58}
.wiki-entry-tags{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.45rem;font:600 .72rem/1.3 system-ui,-apple-system,sans-serif}
.wiki-entry-tags a{color:color-mix(in srgb,var(--txt) 65%,var(--main));text-decoration:none}
.wiki-entry-tags a:hover{text-decoration:underline}
.wiki-entry-meta{padding-top:.18rem;white-space:nowrap;font:600 .7rem/1.4 system-ui,-apple-system,sans-serif;color:color-mix(in srgb,var(--txt) 50%,transparent)}
.wiki-entry-thumb{grid-column:1/-1;width:min(180px,100%);height:auto;max-height:110px;object-fit:cover;border:1px solid color-mix(in srgb,var(--txt) 16%,transparent)}
.wiki-empty{margin:1rem 0;padding:1.2rem 0;border-top:1px solid color-mix(in srgb,var(--txt) 20%,transparent);font-style:italic;opacity:.7}
@media(max-width:800px){.wiki-category-layout{grid-template-columns:1fr;gap:1.25rem}.wiki-facets{position:static;padding:0 0 1rem;border-right:0;border-bottom:1px solid color-mix(in srgb,var(--txt) 18%,transparent)}.wiki-topic-list{grid-template-columns:repeat(auto-fit,minmax(135px,1fr))}.wiki-toolbar{grid-template-columns:1fr}.wiki-alphabet{flex-wrap:wrap;gap:.2rem}.wiki-alphabet button,.wiki-alphabet a,.wiki-alphabet span{flex:0 0 2rem;min-width:2rem}.wiki-entry{grid-template-columns:1fr}.wiki-entry-meta{white-space:normal}.wiki-category-intro h1{font-size:clamp(2rem,10vw,3.2rem)}} 
@media(max-width:480px){.wiki-category-shell{padding-inline:.1rem}.wiki-topic-list{grid-template-columns:1fr 1fr}.wiki-alphabet button,.wiki-alphabet a,.wiki-alphabet span{min-width:1.85rem}.wiki-entry{padding:.8rem 0}}

/* Shared content explorer and detail navigation */
.content-explorer{width:min(100%,clamp(46rem,88vw,112rem));margin:clamp(1.25rem,3vw,2.5rem) auto;container-type:inline-size}
.content-explorer__heading{margin:0 0 clamp(.8rem,1.6vw,1.15rem);font-size:clamp(1.25rem,2.5vw,2rem);line-height:1.15}
.content-explorer__toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(12rem,19rem);gap:clamp(.65rem,1.5vw,1rem);align-items:end}
.content-explorer__toolbar label{display:grid;gap:.35rem;min-width:0;color:color-mix(in srgb,var(--txt) 74%,transparent);font-size:clamp(.72rem,1.2vw,.82rem);font-weight:700;letter-spacing:.04em}
.content-explorer__toolbar input,.content-explorer__toolbar select{width:100%;min-height:46px;padding:.72rem .85rem;border:1px solid color-mix(in srgb,var(--txt) 24%,var(--border));border-radius:var(--rad);background:color-mix(in srgb,var(--card) 92%,var(--bg));color:var(--txt);font:inherit;letter-spacing:normal}
.content-explorer__toolbar input:focus,.content-explorer__toolbar select:focus{outline:2px solid color-mix(in srgb,var(--main) 72%,transparent);outline-offset:2px}
.content-explorer__filters{display:flex;flex-wrap:wrap;gap:.45rem;min-height:.2rem;margin-top:.7rem}
.content-explorer__active-filter,.detail-context__topic{display:inline-flex;align-items:center;gap:.35rem;padding:.38rem .62rem;border:1px solid color-mix(in srgb,var(--txt) 22%,var(--border));border-radius:999px;background:color-mix(in srgb,var(--main) 10%,var(--card));color:var(--txt);font:700 clamp(.72rem,1.1vw,.8rem)/1.2 system-ui,-apple-system,sans-serif;text-decoration:none;cursor:pointer}
.content-explorer__active-filter:hover,.detail-context__topic:hover{border-color:color-mix(in srgb,var(--main) 55%,var(--border));background:color-mix(in srgb,var(--main) 17%,var(--card))}
.content-explorer__status{min-height:1.3em;margin:.55rem 0 .8rem;color:color-mix(in srgb,var(--txt) 62%,transparent);font-size:.82rem}
.content-explorer__empty{padding:clamp(1.2rem,3vw,2rem) 0;border-top:1px solid var(--border-subtle);color:color-mix(in srgb,var(--txt) 65%,transparent)}
.content-explorer__sentinel{width:100%;height:1px}
.content-explorer[aria-busy="true"] .content-explorer__status{opacity:.65}
.detail-context{display:flex;align-items:flex-start;justify-content:space-between;gap:clamp(.7rem,2vw,1.25rem);margin:0 0 clamp(.8rem,2vw,1.25rem)}
.detail-context__topics{display:flex;flex-wrap:wrap;gap:.4rem;min-width:0}
.detail-context__back{flex:0 0 auto}
.detail-context__back>div{margin-bottom:0!important}
@media(max-width:700px){.content-explorer__toolbar{grid-template-columns:1fr}.content-explorer{width:100%;margin-block:1rem}.detail-context{align-items:stretch;flex-direction:column-reverse}.detail-context__back{align-self:flex-end}.detail-context__topics{overflow-x:auto;flex-wrap:nowrap;padding-bottom:.2rem}.detail-context__topic{white-space:nowrap}}

/* Responsive public chess board and move player. */
.chess-page-content{
  width:100%;
  min-width:0;
}
.chess-page-content>.content-card{
  width:100%;
  max-width:68rem;
  margin-inline:auto;
}
.chess-tool{
  grid-template-columns:minmax(18rem,32rem) minmax(18rem,1fr);
  align-items:stretch;
  overflow:hidden;
}
.chess-board-wrap{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.chess-board-frame.chess-board-responsive{
  box-sizing:border-box;
  grid-template-columns:1.25rem minmax(0,1fr);
  width:min(100%,34rem);
  max-width:34rem;
  justify-content:stretch;
}
.chess-board-responsive .chess-board-grid{
  grid-template-columns:repeat(8,minmax(0,1fr))!important;
  width:100%;
  max-width:none;
  aspect-ratio:1;
}
.chess-board-responsive .chess-square{
  width:100%!important;
  height:auto!important;
  aspect-ratio:1;
}
.chess-board-responsive .chess-piece-img{
  width:78%!important;
  height:78%!important;
}
.chess-board-responsive .chess-board-ranks{
  grid-template-rows:repeat(8,minmax(0,1fr));
}
.chess-board-responsive .chess-board-files{
  grid-template-columns:repeat(8,minmax(0,1fr));
}
.chess-player{
  display:grid;
  gap:.85rem;
  padding:clamp(.9rem,2vw,1.15rem);
  border:1px solid color-mix(in srgb,var(--main) 30%,var(--border));
  border-radius:calc(var(--rad) + 4px);
  background:linear-gradient(145deg,color-mix(in srgb,var(--main) 9%,var(--card)),color-mix(in srgb,var(--ac1) 7%,var(--card)));
}
.chess-player-heading{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:.8rem;
}
.chess-player-heading h2{
  margin:0;
}
.chess-player-status{
  color:color-mix(in srgb,var(--txt) 68%,transparent);
  font-size:clamp(.74rem,1.25vw,.84rem);
  font-weight:700;
  text-align:right;
}
.chess-player-controls{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.5rem;
}
.chess-player-controls button{
  min-width:0;
  min-height:2.65rem;
  padding:.62rem .5rem;
  border:1px solid color-mix(in srgb,var(--main) 58%,var(--border));
  border-radius:var(--rad);
  background:var(--main);
  color:var(--txt-main);
  font:800 clamp(.72rem,1.25vw,.84rem)/1.1 var(--t-sans,system-ui,sans-serif);
  cursor:pointer;
  box-shadow:0 5px 14px color-mix(in srgb,var(--main) 18%,transparent);
  transition:transform .15s ease,box-shadow .15s ease,opacity .15s ease;
}
.chess-player-controls button:hover:not(:disabled),
.chess-player-controls button:focus-visible{
  transform:translateY(-1px);
  box-shadow:0 8px 18px color-mix(in srgb,var(--main) 25%,transparent);
}
.chess-player-controls button:focus-visible{
  outline:2px solid color-mix(in srgb,var(--txt) 70%,var(--main));
  outline-offset:2px;
}
.chess-player-controls button:disabled{
  cursor:not-allowed;
  opacity:.36;
  box-shadow:none;
}
.chess-player-warning{
  margin:0;
  color:color-mix(in srgb,#b42318 72%,var(--txt));
  font-size:.8rem;
  line-height:1.45;
}
@media(max-width:780px){
  .chess-tool{
    grid-template-columns:minmax(0,1fr);
  }
  .chess-board-frame.chess-board-responsive{
    width:min(100%,32rem);
    max-width:32rem;
    margin-inline:auto;
  }
}

/* Local two-player chess, Lights Off fullscreen, and profile previews. */
.chess-card-local{
  position:relative;
  overflow:hidden;
  border-color:color-mix(in srgb,var(--main) 42%,var(--border));
  background:linear-gradient(145deg,color-mix(in srgb,var(--card) 90%,var(--main)) 0%,var(--card) 64%,color-mix(in srgb,var(--card) 92%,var(--ac2)) 100%);
}
.chess-card-local::after{
  content:'♞  10:00';
  position:absolute;
  right:.85rem;
  bottom:.7rem;
  color:color-mix(in srgb,var(--txt) 26%,transparent);
  font:700 .72rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.08em;
}
.aion-chess-local-game{
  --aion-chess-panel:color-mix(in srgb,var(--card) 91%,var(--bg));
  display:grid;
  gap:1rem;
  width:100%;
  padding:clamp(.8rem,2vw,1.25rem);
  border:1px solid color-mix(in srgb,var(--txt) 18%,transparent);
  border-radius:calc(var(--rad) + 5px);
  background:linear-gradient(145deg,color-mix(in srgb,var(--card) 94%,var(--main)) 0%,var(--card) 55%,color-mix(in srgb,var(--card) 94%,var(--ac2)) 100%);
  box-shadow:0 18px 50px rgba(15,23,42,.12);
  color:var(--txt);
  box-sizing:border-box;
}
.aion-chess-local-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:1rem;
  padding-bottom:.8rem;
  border-bottom:1px solid color-mix(in srgb,currentColor 13%,transparent);
}
.aion-chess-local-head h2,.aion-chess-local-head p{margin:0}
.aion-chess-local-kicker{
  margin-bottom:.25rem!important;
  color:color-mix(in srgb,var(--txt) 62%,transparent);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.aion-chess-local-status{
  max-width:28rem;
  color:color-mix(in srgb,var(--txt) 72%,transparent);
  font-size:.86rem;
  font-weight:650;
  text-align:right;
}
.aion-chess-local-body{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,360px);
  align-items:start;
  gap:clamp(.85rem,2vw,1.35rem);
}
.aion-chess-board-zone{
  display:grid;
  gap:.55rem;
  justify-items:center;
  min-width:0;
}
.aion-chess-local-board{
  width:min(100%,640px);
  min-width:0;
  touch-action:manipulation;
}
.aion-chess-local-board .chess-board-frame{
  width:100%;
  max-width:none;
}
.aion-chess-local-board [data-square]{
  position:relative;
  cursor:pointer;
  outline:0;
  transition:box-shadow .12s ease,filter .12s ease;
}
.aion-chess-local-board [data-square]:focus-visible{
  z-index:3;
  box-shadow:inset 0 0 0 4px #38bdf8;
}
.aion-chess-local-board [data-square].is-selected{
  box-shadow:inset 0 0 0 5px rgba(250,204,21,.9);
}
.aion-chess-local-board [data-square].is-last-move{
  box-shadow:inset 0 0 0 999px rgba(250,204,21,.22);
}
.aion-chess-local-board [data-square].is-selected.is-last-move{
  box-shadow:inset 0 0 0 5px rgba(250,204,21,.92),inset 0 0 0 999px rgba(250,204,21,.16);
}
.aion-chess-local-board [data-square].is-legal-target::after{
  content:'';
  position:absolute;
  width:24%;
  aspect-ratio:1;
  left:38%;
  top:38%;
  border-radius:50%;
  background:rgba(15,23,42,.38);
  box-shadow:0 0 0 5px rgba(255,255,255,.18);
  pointer-events:none;
}
.aion-chess-local-board [data-square].is-check{
  box-shadow:inset 0 0 0 999px rgba(220,38,38,.48);
}
.aion-chess-clock{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:min(100%,640px);
  min-height:64px;
  padding:.7rem .9rem;
  border:1px solid color-mix(in srgb,var(--txt) 14%,transparent);
  border-radius:calc(var(--rad) + 3px);
  background:color-mix(in srgb,var(--card) 84%,var(--bg));
  box-shadow:0 8px 24px rgba(15,23,42,.08);
  transition:background .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.aion-chess-clock span{
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.aion-chess-clock strong{
  font:800 clamp(1.45rem,4vw,2.15rem)/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  font-variant-numeric:tabular-nums;
  letter-spacing:-.04em;
}
.aion-chess-clock.is-active{
  background:var(--aion-chess-light,#eeeed2);
  color:#111827;
  border-color:color-mix(in srgb,var(--aion-chess-dark,#769656) 62%,#111827);
  box-shadow:0 12px 34px rgba(0,0,0,.2);
  transform:translateY(-1px);
}
.aion-chess-clock.is-flagged{
  background:#7f1d1d;
  color:#fff;
  border-color:#ef4444;
}
.aion-chess-local-rail{
  display:grid;
  gap:.85rem;
  min-width:0;
  padding:.9rem;
  border:1px solid color-mix(in srgb,var(--txt) 14%,transparent);
  border-radius:calc(var(--rad) + 3px);
  background:var(--aion-chess-panel);
  box-shadow:0 12px 34px rgba(15,23,42,.08);
}
.aion-chess-time-control{
  display:grid;
  gap:.3rem;
  font-size:.78rem;
  font-weight:750;
}
.aion-chess-time-control select,
.aion-chess-local-actions button{
  width:100%;
  min-height:42px;
  padding:.58rem .72rem;
  border:1px solid color-mix(in srgb,var(--txt) 18%,transparent);
  border-radius:var(--rad);
  background:color-mix(in srgb,var(--card) 88%,var(--bg));
  color:var(--txt);
  font:inherit;
  font-weight:700;
  cursor:pointer;
}
.aion-chess-time-control select:disabled,
.aion-chess-local-actions button:disabled{cursor:not-allowed;opacity:.48}
.aion-chess-local-actions button:not(:disabled):hover{
  border-color:color-mix(in srgb,var(--main) 72%,var(--border));
  transform:translateY(-1px);
}
.aion-chess-local-actions button:focus-visible,
.aion-chess-time-control select:focus-visible{
  outline:3px solid color-mix(in srgb,var(--main) 55%,#38bdf8);
  outline-offset:2px;
}
.aion-chess-move-card{
  display:grid;
  gap:.5rem;
  min-height:190px;
}
.aion-chess-move-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
}
.aion-chess-move-head h3{margin:0;font-size:1rem}
.aion-chess-move-head span{font-size:.74rem;opacity:.6}
.aion-chess-moves{
  list-style:none;
  display:grid;
  align-content:start;
  gap:.3rem;
  min-height:145px;
  max-height:260px;
  margin:0;
  padding:.55rem;
  overflow:auto;
  border:1px solid color-mix(in srgb,var(--txt) 12%,transparent);
  border-radius:var(--rad);
  background:color-mix(in srgb,var(--bg) 75%,transparent);
  font-size:.82rem;
}
.aion-chess-moves li{
  display:grid;
  grid-template-columns:2rem 1fr 1fr;
  gap:.35rem;
  padding:.34rem .4rem;
  border-radius:6px;
}
.aion-chess-moves li:nth-child(odd){background:color-mix(in srgb,var(--txt) 5%,transparent)}
.aion-chess-moves li>span{opacity:.52}
.aion-chess-moves li.is-empty{display:block;padding:.6rem;opacity:.58;font-style:italic}
.aion-chess-local-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.5rem;
}
.aion-chess-local-actions [data-local-fullscreen]{grid-column:1/-1;background:var(--main);color:var(--txt-main)}
.aion-chess-local-hint{margin:0;text-align:center;font-size:.72rem;opacity:.55}
.aion-chess-promotion[hidden]{display:none}
.aion-chess-promotion{
  position:absolute;
  inset:0;
  z-index:20;
  display:grid;
  place-items:center;
  padding:1rem;
  border-radius:inherit;
  background:rgba(2,6,23,.68);
  backdrop-filter:blur(8px);
}
.aion-chess-local-game{position:relative}
.aion-chess-promotion>div{
  display:grid;
  gap:.8rem;
  padding:1rem;
  border-radius:calc(var(--rad) + 4px);
  background:var(--card);
  color:var(--txt);
  box-shadow:0 22px 64px rgba(0,0,0,.38);
  text-align:center;
}
.aion-chess-promotion [data-local-promotion-choices]{display:flex;gap:.5rem}
.aion-chess-promotion button{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  border:1px solid var(--border);
  border-radius:var(--rad);
  background:var(--aion-chess-light,#eeeed2);
  cursor:pointer;
}
.aion-chess-promotion img{width:46px;height:46px;object-fit:contain}
.aion-chess-local-game:fullscreen,
.aion-chess-local-game.is-fullscreen{
  position:fixed;
  inset:0;
  z-index:2147483647;
  width:100vw;
  height:100vh;
  height:100dvh;
  max-width:none;
  margin:0;
  padding:clamp(.65rem,1.6vw,1.25rem);
  overflow:auto;
  border:0;
  border-radius:0;
  background:radial-gradient(circle at 50% 42%,#182230 0,#070b10 70%);
  color:#f8fafc;
  box-shadow:none;
}
.aion-chess-local-game:fullscreen .aion-chess-local-rail,
.aion-chess-local-game.is-fullscreen .aion-chess-local-rail{
  background:rgba(15,23,42,.86);
  border-color:rgba(248,250,252,.18);
  box-shadow:0 20px 58px rgba(0,0,0,.44);
  backdrop-filter:blur(12px);
}
.aion-chess-local-game:fullscreen .aion-chess-local-board,
.aion-chess-local-game.is-fullscreen .aion-chess-local-board{width:min(100%,calc(100dvh - 12rem),860px)}
.aion-chess-profile-preview{
  display:grid;
  grid-template-columns:1fr minmax(112px,138px);
  gap:.7rem;
  align-items:start;
  margin-top:.15rem;
  padding:.65rem;
  border:1px solid color-mix(in srgb,var(--txt) 14%,transparent);
  border-radius:var(--rad);
  background:color-mix(in srgb,var(--card) 72%,var(--bg));
}
.aion-chess-profile-preview__section{display:grid;gap:.35rem;min-width:0}
.aion-chess-profile-preview__label{font-size:.7rem;font-weight:750;opacity:.66}
.aion-chess-profile-preview__pieces{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  overflow:hidden;
  border-radius:7px;
  background:color-mix(in srgb,var(--txt) 7%,transparent);
}
.aion-chess-profile-piece{display:grid;place-items:center;aspect-ratio:1}
.aion-chess-profile-piece:nth-child(n+7){background:color-mix(in srgb,var(--txt) 6%,transparent)}
.aion-chess-profile-piece img{width:88%;height:88%;object-fit:contain;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))}
.aion-chess-profile-preview__board{
  display:grid;
  grid-template-columns:repeat(8,1fr);
  aspect-ratio:1;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--txt) 18%,transparent);
  border-radius:7px;
}
.aion-chess-profile-preview__board>span{display:grid;place-items:center;min-width:0}
.aion-chess-profile-preview__board img{width:92%;height:92%;object-fit:contain;filter:drop-shadow(0 1px 1px rgba(0,0,0,.28))}
@media(max-width:860px){
  .aion-chess-local-body{grid-template-columns:1fr}
  .aion-chess-local-rail{order:2;width:min(100%,640px);justify-self:center}
  .aion-chess-local-head{align-items:flex-start;flex-direction:column}
  .aion-chess-local-status{text-align:left}
}
@media(max-width:560px){
  .aion-chess-local-game{padding:.65rem}
  .aion-chess-clock{min-height:54px}
  .aion-chess-local-actions{grid-template-columns:1fr}
  .aion-chess-local-actions [data-local-fullscreen]{grid-column:auto}
  .aion-chess-profile-preview{grid-template-columns:1fr}
  .aion-chess-profile-preview__board{width:min(100%,170px);justify-self:center}
}
@media(orientation:landscape) and (max-height:720px){
  .aion-chess-local-game:fullscreen .aion-chess-local-body,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-body{grid-template-columns:minmax(0,1fr) minmax(240px,330px)}
  .aion-chess-local-game:fullscreen .aion-chess-local-board,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-board{width:min(calc(100dvh - 10rem),720px)}
  .aion-chess-local-game:fullscreen .aion-chess-local-head,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-head{display:none}
}

/* Comfortable player controls at all public desktop widths. */
.chess-player-heading{
  align-items:flex-start;
  flex-direction:column;
  gap:.25rem;
}
.chess-player-status{
  text-align:left;
}
.chess-player-controls{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media(max-width:480px){
  .chess-tool{
    padding:.72rem;
  }
  .chess-player-heading{
    align-items:flex-start;
    flex-direction:column;
    gap:.25rem;
  }
  .chess-player-status{
    text-align:left;
  }
  .chess-player-controls{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* Lights Off contrast, verified against the live fullscreen renderer. */
.aion-chess-local-game:fullscreen .aion-chess-clock:not(.is-active):not(.is-flagged),
.aion-chess-local-game.is-fullscreen .aion-chess-clock:not(.is-active):not(.is-flagged){
  background:rgba(15,23,42,.9);
  color:#f8fafc;
  border-color:rgba(248,250,252,.22);
}
.aion-chess-local-game:fullscreen .aion-chess-local-rail,
.aion-chess-local-game.is-fullscreen .aion-chess-local-rail{color:#f8fafc}
.aion-chess-local-game:fullscreen .aion-chess-move-head h3,
.aion-chess-local-game.is-fullscreen .aion-chess-move-head h3{color:#f8fafc}
.aion-chess-local-game:fullscreen .aion-chess-moves,
.aion-chess-local-game.is-fullscreen .aion-chess-moves{background:rgba(2,6,23,.58);border-color:rgba(248,250,252,.18);color:#f8fafc}
.aion-chess-local-game:fullscreen .aion-chess-local-hint,
.aion-chess-local-game.is-fullscreen .aion-chess-local-hint{color:#cbd5e1;opacity:.82}

/* Piece-only dragging keeps the board anchored while preserving click controls. */
.aion-chess-local-board .chess-piece-img[draggable="true"]{pointer-events:auto;cursor:grab;touch-action:none;user-select:none;-webkit-user-drag:element}
.aion-chess-local-board .chess-piece-img[draggable="true"]:active{cursor:grabbing}
.aion-chess-local-board-frame .chess-square{cursor:pointer}

/* Balanced profile preview: figures and board share the available modal height. */
.aion-chess-profile-preview{
  grid-template-columns:minmax(0,1fr) minmax(118px,140px);
  align-items:stretch;
}
.aion-chess-profile-preview__section{grid-template-rows:auto 1fr;align-content:stretch}
.aion-chess-profile-preview__pieces{grid-template-columns:repeat(4,minmax(0,1fr));align-self:stretch}
.aion-chess-profile-preview__board{width:100%;align-self:end}
@media(max-width:360px){
  .aion-chess-profile-preview{grid-template-columns:1fr}
  .aion-chess-profile-preview__board{width:min(100%,160px);justify-self:center}
}

/* Searchable, progressively loaded Chess hub. */
.chess-hub-content .content-card,.chess-elo-page .content-card{overflow:visible}
.chess-hub-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin:.3rem 0 1.15rem}
.chess-hub-heading h1,.chess-elo-hero h1{margin:.05rem 0 0}
.chess-hub-kicker{margin:0!important;font-size:.72rem!important;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ac2)}
.chess-hub-count{font-size:.78rem;font-weight:750;opacity:.58;white-space:nowrap}
.chess-hub-toolbar{display:grid;gap:.75rem;margin-bottom:1.15rem;padding:.8rem;border:1px solid var(--border-subtle);border-radius:calc(var(--rad) + 5px);background:color-mix(in srgb,var(--card) 86%,var(--bg));box-shadow:0 10px 28px rgba(15,23,42,.06)}
.chess-hub-search{display:flex;align-items:center;gap:.6rem;min-height:44px;padding:0 .8rem;border:1px solid var(--border-subtle);border-radius:999px;background:var(--bg);transition:border-color .18s ease,box-shadow .18s ease}
.chess-hub-search:focus-within{border-color:var(--ac2);box-shadow:0 0 0 3px color-mix(in srgb,var(--ac2) 18%,transparent)}
.chess-hub-search svg{flex:0 0 auto;opacity:.52}
.chess-hub-search input{width:100%;min-width:0;padding:0!important;border:0!important;outline:0!important;background:transparent!important;color:var(--txt)!important;box-shadow:none!important;font:inherit}
.chess-hub-filters{display:flex;gap:.4rem;overflow-x:auto;padding-bottom:.05rem;scrollbar-width:thin}
.chess-hub-filters button{flex:0 0 auto;min-height:34px;padding:.42rem .78rem;border:1px solid var(--border-subtle);border-radius:999px;background:transparent;color:var(--txt);font:inherit;font-size:.74rem;font-weight:750;cursor:pointer;transition:.18s ease}
.chess-hub-filters button:hover,.chess-hub-filters button.active{background:var(--main);border-color:var(--main);color:var(--txt-main);transform:translateY(-1px)}
.chess-hub-results{align-items:stretch}
.chess-hub-results .chess-card{height:100%;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.chess-hub-results .chess-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--ac2) 45%,var(--border-subtle));box-shadow:0 18px 40px rgba(15,23,42,.12)}
.chess-hub-empty{grid-column:1/-1;display:grid;place-items:center;gap:.25rem;min-height:190px;padding:2rem;text-align:center;border:1px dashed var(--border-subtle);border-radius:calc(var(--rad) + 4px);background:color-mix(in srgb,var(--card) 72%,transparent)}
.chess-hub-empty span{font-size:.85rem;opacity:.58}
.chess-hub-sentinel{display:flex;justify-content:center;gap:.35rem;padding:1rem}
.chess-hub-sentinel span{width:7px;height:7px;border-radius:50%;background:var(--ac2);animation:aion-chess-load 1s ease-in-out infinite alternate}
.chess-hub-sentinel span:nth-child(2){animation-delay:.16s}.chess-hub-sentinel span:nth-child(3){animation-delay:.32s}
@keyframes aion-chess-load{to{opacity:.22;transform:translateY(5px)}}

/* ELO standings combine a compact podium with a complete responsive table. */
.chess-elo-hero{padding:.6rem 0 1.3rem;text-align:center}
.chess-elo-hero>p:not(.chess-hub-kicker){max-width:660px;margin:.55rem auto 0;opacity:.68}
.chess-elo-summary{display:flex;justify-content:center;gap:.55rem;flex-wrap:wrap;margin-top:1rem}
.chess-elo-summary span{padding:.48rem .72rem;border:1px solid var(--border-subtle);border-radius:999px;background:color-mix(in srgb,var(--card) 78%,transparent);font-size:.75rem;opacity:.8}
.chess-elo-summary strong{margin-right:.2rem;color:var(--txt);font-size:.9rem}
.chess-elo-podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:.7rem;margin:1.1rem 0 1.35rem}
.chess-elo-podium-card{position:relative;display:grid;justify-items:center;gap:.25rem;min-height:190px;padding:1.15rem .75rem 1rem;border:1px solid var(--border-subtle);border-radius:calc(var(--rad) + 8px);background:linear-gradient(155deg,color-mix(in srgb,var(--card) 94%,white),color-mix(in srgb,var(--card) 78%,var(--bg)));box-shadow:0 16px 34px rgba(15,23,42,.1);text-align:center;overflow:hidden}
.chess-elo-podium-card.is-rank-1{min-height:220px;border-color:color-mix(in srgb,#c99b2d 60%,var(--border-subtle));background:linear-gradient(155deg,color-mix(in srgb,#fff4c7 30%,var(--card)),color-mix(in srgb,var(--card) 82%,var(--bg)))}
.chess-elo-medal{position:absolute;top:.65rem;left:.7rem;display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--main);color:var(--txt-main);font-size:.72rem;font-weight:900}
.chess-elo-podium-card.is-rank-1 .chess-elo-medal{background:#b88314;color:#fff}
.chess-elo-avatar{display:grid;place-items:center;width:62px;height:62px;margin-top:.15rem;border:2px solid color-mix(in srgb,var(--ac2) 65%,transparent);border-radius:50%;background:color-mix(in srgb,var(--ac2) 18%,var(--card));color:var(--ac2);font-family:var(--font-heading,serif);font-size:1.7rem;font-weight:800}
.chess-elo-podium-card h2{margin:.3rem 0 0;font-size:clamp(.95rem,2vw,1.18rem)}
.chess-elo-podium-card p{margin:0!important;font-size:.7rem!important;letter-spacing:.05em;text-transform:uppercase;opacity:.54}
.chess-elo-podium-card>strong{margin-top:.45rem;font-size:1.45rem;line-height:1;color:var(--txt)}
.chess-elo-podium-card>strong span{display:block;margin-top:.2rem;font-size:.58rem;letter-spacing:.14em;opacity:.48}
.chess-elo-table-wrap{overflow-x:auto;border:1px solid var(--border-subtle);border-radius:calc(var(--rad) + 7px);background:color-mix(in srgb,var(--card) 88%,var(--bg));box-shadow:0 14px 32px rgba(15,23,42,.07)}
.chess-elo-table{width:100%;min-width:680px;border-collapse:collapse;font-size:.8rem}
.chess-elo-table th,.chess-elo-table td{padding:.78rem .72rem;border-bottom:1px solid var(--border-subtle);text-align:center;white-space:nowrap}
.chess-elo-table thead th{font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;opacity:.52;background:color-mix(in srgb,var(--txt) 4%,transparent)}
.chess-elo-table tbody tr:last-child>*{border-bottom:0}
.chess-elo-table tbody tr:hover{background:color-mix(in srgb,var(--ac2) 7%,transparent)}
.chess-elo-table tbody th{text-align:left}
.chess-elo-rank{display:inline-grid;place-items:center;width:27px;height:27px;border-radius:50%;background:color-mix(in srgb,var(--txt) 7%,transparent);font-weight:850}
.chess-elo-player-name,.chess-elo-player-tier{display:block}.chess-elo-player-tier{margin-top:.12rem;font-size:.65rem;font-weight:500;opacity:.48}
.chess-elo-empty{display:grid;place-items:center;gap:.35rem;min-height:240px;padding:2rem;text-align:center;border:1px dashed var(--border-subtle);border-radius:calc(var(--rad) + 6px)}
.chess-elo-empty span{max-width:480px;font-size:.82rem;opacity:.58}
@media(max-width:720px){
  .chess-hub-heading{align-items:flex-start;flex-direction:column}.chess-hub-count{align-self:flex-start}
  .chess-elo-podium{grid-template-columns:1fr;align-items:stretch}.chess-elo-podium-card,.chess-elo-podium-card.is-rank-1{min-height:0}.chess-elo-podium-card.is-rank-1{order:-1}
}

/* Mobile chess stage: portrait stacks cleanly; landscape spends height on the board. */
@media(orientation:portrait) and (max-width:760px){
  .aion-chess-local-game:fullscreen,
  .aion-chess-local-game.is-fullscreen{padding:.45rem;overflow-x:hidden;overflow-y:auto}
  .aion-chess-local-game:fullscreen .aion-chess-local-head,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-head{display:none}
  .aion-chess-local-game:fullscreen .aion-chess-local-body,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-body{grid-template-columns:1fr;gap:.55rem}
  .aion-chess-local-game:fullscreen .aion-chess-clock,
  .aion-chess-local-game.is-fullscreen .aion-chess-clock{min-height:46px;padding:.42rem .65rem}
  .aion-chess-local-game:fullscreen .aion-chess-clock strong,
  .aion-chess-local-game.is-fullscreen .aion-chess-clock strong{font-size:1.25rem}
  .aion-chess-local-game:fullscreen .aion-chess-local-rail,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-rail{width:100%;padding:.65rem}
  .aion-chess-local-game:fullscreen .aion-chess-move-card,
  .aion-chess-local-game.is-fullscreen .aion-chess-move-card{min-height:140px}
  .aion-chess-local-game:fullscreen .aion-chess-moves,
  .aion-chess-local-game.is-fullscreen .aion-chess-moves{min-height:96px}
}

@media(orientation:landscape) and (max-width:1200px),
       (orientation:landscape) and (max-height:720px){
  .aion-chess-local-game:fullscreen,
  .aion-chess-local-game.is-fullscreen{
    --aion-chess-landscape-rail:clamp(220px,30vw,290px);
    padding:clamp(.3rem,1vw,.5rem);
    overflow:hidden;
  }
  .aion-chess-local-game:fullscreen .aion-chess-local-head,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-head{display:none}
  .aion-chess-local-game:fullscreen .aion-chess-local-body,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-body{
    grid-template-columns:minmax(0,1fr) var(--aion-chess-landscape-rail);
    align-items:center;
    gap:clamp(.4rem,1.2vw,.75rem);
    min-height:0;
    height:100%;
  }
  .aion-chess-local-game:fullscreen .aion-chess-board-zone,
  .aion-chess-local-game.is-fullscreen .aion-chess-board-zone{
    width:min(calc(100dvh - 5.15rem),calc(100vw - var(--aion-chess-landscape-rail) - 1.65rem),720px);
    max-width:100%;
    gap:.25rem;
    justify-self:center;
  }
  .aion-chess-local-game:fullscreen .aion-chess-local-board,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-board{width:100%}
  .aion-chess-local-game:fullscreen .aion-chess-clock,
  .aion-chess-local-game.is-fullscreen .aion-chess-clock{width:100%;min-height:32px;padding:.22rem .52rem}
  .aion-chess-local-game:fullscreen .aion-chess-clock span,
  .aion-chess-local-game.is-fullscreen .aion-chess-clock span{font-size:.57rem;letter-spacing:.08em}
  .aion-chess-local-game:fullscreen .aion-chess-clock strong,
  .aion-chess-local-game.is-fullscreen .aion-chess-clock strong{font-size:clamp(1rem,4.2vh,1.25rem)}
  .aion-chess-local-game:fullscreen .aion-chess-local-rail,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-rail{
    grid-template-rows:auto minmax(0,1fr) auto auto;
    align-self:center;
    gap:.35rem;
    width:100%;
    height:calc(100dvh - clamp(.6rem,2vw,1rem));
    min-height:0;
    max-height:100%;
    padding:.48rem;
    overflow:hidden;
  }
  .aion-chess-local-game:fullscreen .aion-chess-time-control,
  .aion-chess-local-game.is-fullscreen .aion-chess-time-control{gap:.18rem;font-size:.64rem}
  .aion-chess-local-game:fullscreen .aion-chess-time-control select,
  .aion-chess-local-game:fullscreen .aion-chess-local-actions button,
  .aion-chess-local-game.is-fullscreen .aion-chess-time-control select,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-actions button{min-height:32px;padding:.3rem .45rem;font-size:.7rem}
  .aion-chess-local-game:fullscreen .aion-chess-move-card,
  .aion-chess-local-game.is-fullscreen .aion-chess-move-card{grid-template-rows:auto minmax(0,1fr);gap:.22rem;min-height:0;overflow:hidden}
  .aion-chess-local-game:fullscreen .aion-chess-move-head h3,
  .aion-chess-local-game.is-fullscreen .aion-chess-move-head h3{font-size:.78rem}
  .aion-chess-local-game:fullscreen .aion-chess-moves,
  .aion-chess-local-game.is-fullscreen .aion-chess-moves{height:100%;min-height:0;max-height:none;padding:.3rem;font-size:.68rem}
  .aion-chess-local-game:fullscreen .aion-chess-local-actions,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:.32rem}
  .aion-chess-local-game:fullscreen .aion-chess-local-actions [data-local-fullscreen],
  .aion-chess-local-game.is-fullscreen .aion-chess-local-actions [data-local-fullscreen]{grid-column:auto}
  .aion-chess-local-game:fullscreen .aion-chess-local-hint,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-hint{font-size:.57rem;line-height:1.15}
}

@media(orientation:landscape) and (max-height:360px){
  .aion-chess-local-game:fullscreen,
  .aion-chess-local-game.is-fullscreen{--aion-chess-landscape-rail:clamp(190px,29vw,240px)}
  .aion-chess-local-game:fullscreen .aion-chess-local-hint,
  .aion-chess-local-game.is-fullscreen .aion-chess-local-hint{display:none}
}

@media(orientation:landscape) and (max-height:600px) and (max-width:1200px){
  .nav-toggle{display:flex!important}
  #main-nav{display:none!important}
}