/* TJK-Chess v16.0.9 — drag-source feedback + consolidated application shell */

/* During an active drag both source and legal destination use the same yellow
   inset frame. The board square itself keeps its original light/dark colour. */
.live-square.is-drag-source,
.computer-square.is-drag-source,
.v266-position-board-card .analysis-square.is-drag-source {
  box-shadow: inset 0 0 0 5px #f2c21a !important;
  background-color: inherit !important;
}
.v266-position-board-card .analysis-square.is-drag-source {
  box-shadow: inset 0 0 0 4px #f3c64d !important;
}

/* One predictable desktop shell. This final layer owns spacing and dropdown
   geometry without changing the feature-specific workspaces. */
@media (min-width:1081px){
  .site-header{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:stretch;
    min-height:72px;
    padding-inline:clamp(18px,2.6vw,46px);
  }
  .site-brand{align-self:center;white-space:nowrap}
  .site-nav{
    display:flex;
    align-items:stretch;
    justify-content:center;
    gap:clamp(2px,.45vw,8px);
    min-width:0;
    margin-left:clamp(16px,2vw,34px);
  }
  .site-nav>button,
  .site-nav>.site-nav-link,
  .site-nav-item>[aria-haspopup="true"]{
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:0;
    padding-inline:clamp(10px,1.15vw,18px)!important;
    white-space:nowrap;
  }
  .site-nav-item{position:relative}
  .site-nav-item>.site-nav-dropdown{
    top:calc(100% - 1px)!important;
    left:50%!important;
    right:auto!important;
    width:max-content;
    min-width:270px;
    max-width:min(360px,calc(100vw - 28px));
    transform:translate(-50%,7px)!important;
  }
  .site-nav-item:hover>.site-nav-dropdown,
  .site-nav-item:focus-within>.site-nav-dropdown{
    transform:translate(-50%,0)!important;
  }
  .site-nav-dropdown>button,
  .site-nav-dropdown>.site-nav-link{width:100%;min-width:0}
  .site-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    white-space:nowrap;
  }
  .site-sound-toggle,.site-notifications{flex:0 0 auto}
  .site-notifications{display:flex;align-items:center;position:relative}
  .site-language{width:auto;min-width:144px;max-width:190px}
}

/* Only the owning top-level destination is active. */
.site-nav>[data-view-button].is-shell-active,
.site-nav-item>[data-view-button].is-shell-active,
.site-nav-item>[data-repertoire-menu].is-shell-active{
  color:var(--tjk-blue,#0b5fe7)!important;
}
.site-nav>[data-view-button].is-shell-active::after,
.site-nav-item>[data-view-button].is-shell-active::after,
.site-nav-item>[data-repertoire-menu].is-shell-active::after{
  opacity:1!important;
  transform:scaleX(1)!important;
}
.site-brand.is-shell-active{color:inherit!important}

@media (max-width:1080px){
  .site-header.is-menu-open .site-nav{display:grid;grid-template-columns:1fr;gap:4px}
  .site-header.is-menu-open .site-nav-item{display:grid;grid-column:auto}
  .site-header.is-menu-open .site-nav-dropdown{
    position:static!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    padding:3px 0 6px 12px!important;
    transform:none!important;
    box-shadow:none!important;
  }
  .site-language{max-width:132px}
}