/* TJK-Chess v13 application shell */
:root {
  --tjk-navy: #0b1739;
  --tjk-blue: #0b5fe7;
  --tjk-blue-strong: #0748b5;
  --tjk-blue-soft: #eaf2ff;
  --tjk-gold: #d6a52d;
  --tjk-gold-soft: #fff7dc;
  --tjk-surface: #ffffff;
  --tjk-bg: #f4f7fb;
  --tjk-border: #dce4ef;
  --tjk-muted: #64748b;
  --tjk-shadow: 0 16px 45px rgba(17, 35, 74, .09);
}

body { background: var(--tjk-bg); color: var(--tjk-navy); }
.site-header { min-height: 70px; padding-inline: clamp(16px, 3vw, 52px); }
.site-brand-mark {
  background: linear-gradient(145deg, #eff5ff, #dbe9ff);
  box-shadow: inset 0 0 0 1px rgba(11,95,231,.08);
}
.site-nav { margin-left: clamp(18px, 3vw, 46px); }
.site-nav button { min-width: auto; padding-inline: clamp(12px, 1.6vw, 22px); white-space: nowrap; }
.site-actions { gap: 12px; font-size: 1rem; }
.site-language {
  height: 38px;
  padding: 0 28px 0 11px;
  border: 1px solid var(--tjk-border);
  border-radius: 9px;
  background: #fff;
  color: var(--tjk-navy);
  font-weight: 700;
}
.site-menu-toggle {
  display: none;
  width: 40px;
  height: 40px;
  border: 1px solid var(--tjk-border);
  border-radius: 10px;
  background: #fff;
  color: var(--tjk-navy);
  cursor: pointer;
  font-size: 1.2rem;
}
.site-profile-copy { display: grid; line-height: 1.05; }
.site-profile-copy strong { font-size: .82rem; }
.site-profile-copy small { color: var(--tjk-muted); font-size: .68rem; }
.site-avatar { background: linear-gradient(145deg, #102a56, #071b3e); }

.home-hero {
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--tjk-border);
  background:
    radial-gradient(circle at 82% 24%, rgba(214,165,45,.18), transparent 24%),
    radial-gradient(circle at 70% 65%, rgba(11,95,231,.16), transparent 34%),
    linear-gradient(125deg, #ffffff 0%, #ffffff 54%, #edf4ff 100%);
}
.home-hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(360px, .9fr);
  align-items: center;
  width: min(1480px, 100%);
  min-height: 500px;
  margin: 0 auto;
  padding: 64px clamp(20px, 5vw, 76px);
}
.home-hero h1 {
  max-width: 760px;
  margin: 12px 0 18px;
  font-size: clamp(2.65rem, 5.8vw, 5.2rem);
  line-height: .98;
  letter-spacing: -.055em;
}
.home-hero h1 span { color: var(--tjk-blue); }
.home-hero p { max-width: 660px; margin: 0; color: #53627a; font-size: clamp(1rem, 1.5vw, 1.22rem); line-height: 1.65; }
.home-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.home-primary-action, .home-secondary-action {
  min-height: 48px;
  padding: 12px 20px;
  border-radius: 10px;
  cursor: pointer;
  font-weight: 800;
}
.home-primary-action { border: 1px solid var(--tjk-blue); background: var(--tjk-blue); color: #fff; box-shadow: 0 10px 24px rgba(11,95,231,.25); }
.home-primary-action:hover { background: var(--tjk-blue-strong); }
.home-secondary-action { border: 1px solid var(--tjk-border); background: #fff; color: var(--tjk-navy); }
.home-hero-board {
  position: relative;
  justify-self: center;
  width: min(430px, 90%);
  aspect-ratio: 1;
  padding: 18px;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 30px;
  background: rgba(255,255,255,.7);
  box-shadow: 0 30px 80px rgba(24,55,110,.18);
  transform: rotate(3deg);
  backdrop-filter: blur(12px);
}
.home-mini-board { display: grid; grid-template-columns: repeat(8,1fr); width: 100%; height: 100%; overflow: hidden; border-radius: 18px; box-shadow: inset 0 0 0 1px rgba(10,35,80,.12); }
.home-mini-square { display: grid; place-items: center; font-family: "Segoe UI Symbol", "DejaVu Sans", sans-serif; font-size: clamp(1.4rem, 3vw, 2.8rem); }
.home-mini-square.light { background: #eef3fb; }
.home-mini-square.dark { background: #5f82b5; }
.home-mini-square.gold { background: #d8af4c; }
.home-mini-badge { position: absolute; right: -22px; bottom: 28px; display: grid; gap: 2px; min-width: 165px; padding: 15px 18px; border: 1px solid rgba(214,165,45,.35); border-radius: 14px; background: #fffdf5; box-shadow: var(--tjk-shadow); transform: rotate(-3deg); }
.home-mini-badge strong { color: #8a6400; }
.home-mini-badge span { color: var(--tjk-muted); font-size: .82rem; }

.home-dashboard { width: min(1480px, 100%); margin: 0 auto; padding: 38px clamp(18px, 5vw, 76px) 64px; }
.home-section-head { display: flex; justify-content: space-between; align-items: end; gap: 18px; margin-bottom: 18px; }
.home-section-head h2 { margin: 6px 0 0; font-size: clamp(1.6rem, 3vw, 2.25rem); letter-spacing: -.035em; }
.home-quick-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; }
.home-quick-card {
  position: relative;
  display: grid;
  align-content: start;
  min-height: 210px;
  padding: 22px;
  overflow: hidden;
  border: 1px solid var(--tjk-border);
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 7px 24px rgba(17,35,74,.055);
}
.home-quick-card::after { content:""; position:absolute; width:110px; height:110px; right:-30px; bottom:-38px; border-radius:50%; background:var(--tjk-blue-soft); }
.home-quick-card.gold::after { background: var(--tjk-gold-soft); }
.home-quick-icon { display:grid; place-items:center; width:46px; height:46px; border-radius:12px; background:var(--tjk-blue-soft); color:var(--tjk-blue); font-size:1.5rem; }
.home-quick-card.gold .home-quick-icon { background: var(--tjk-gold-soft); color:#9a7107; }
.home-quick-card h3 { margin: 17px 0 8px; font-size: 1.18rem; }
.home-quick-card p { margin: 0 0 18px; color: var(--tjk-muted); line-height: 1.5; }
.home-card-link { position: relative; z-index: 2; justify-self: start; margin-top: auto; border: 0; background: transparent; color: var(--tjk-blue); cursor: pointer; font-weight: 800; padding: 0; }
.home-card-link:hover { text-decoration: underline; }
.home-status-strip { display:grid; grid-template-columns: repeat(3,1fr); gap:1px; margin-top:18px; overflow:hidden; border:1px solid var(--tjk-border); border-radius:15px; background:var(--tjk-border); }
.home-status-strip > div { display:grid; grid-template-columns:auto 1fr; gap:2px 12px; align-items:center; padding:20px 22px; background:#fff; }
.home-status-strip b { grid-row:1/3; font-size:1.55rem; color:var(--tjk-blue); }
.home-status-strip span { color:var(--tjk-muted); font-size:.82rem; }

.course-hero { min-height: 300px; }
.course-hero-copy { padding-block: 44px; }
.course-hero h1 { font-size: clamp(2.2rem, 4.3vw, 3.7rem); }

.beta-pill { display:inline-flex; align-items:center; gap:6px; width:max-content; padding:6px 10px; border-radius:999px; background:var(--tjk-gold-soft); color:#805d05; font-size:.72rem; font-weight:850; letter-spacing:.04em; text-transform:uppercase; }

@media (max-width: 1180px) {
  .home-quick-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .site-profile-copy { display: none; }
}
@media (max-width: 1080px) {
  .site-header { grid-template-columns: 1fr auto auto; min-height: 64px; }
  .site-menu-toggle { display: grid; place-items: center; }
  .site-nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: none;
    grid-column: auto;
    margin: 0;
    padding: 8px 14px 14px;
    border-bottom: 1px solid var(--tjk-border);
    background: rgba(255,255,255,.98);
    box-shadow: 0 18px 30px rgba(15,23,42,.08);
  }
  .site-header.is-menu-open .site-nav { display: grid; grid-template-columns: repeat(2,1fr); gap: 6px; }
  .site-nav button { min-height: 44px; border-radius: 9px; text-align: left; }
  .site-nav button.is-active { background: var(--tjk-blue-soft); }
  .site-nav button.is-active::after { display:none; }
  .site-actions { display: flex; }
  .course-search, .site-avatar { display:none; }
  .home-hero-inner { grid-template-columns: 1fr; min-height: auto; }
  .home-hero-board { display: none; }
  .home-status-strip { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .site-header { padding-inline: 12px; }
  .site-actions { gap: 8px; }
  .site-language { width: 62px; padding-left: 8px; font-size: .78rem; }
  .site-header.is-menu-open .site-nav { grid-template-columns: 1fr; }
  .home-hero-inner { padding: 44px 20px; }
  .home-hero h1 { font-size: clamp(2.45rem, 13vw, 3.6rem); }
  .home-dashboard { padding-inline: 16px; }
  .home-quick-grid { grid-template-columns: 1fr; }
  .home-section-head { align-items:flex-start; flex-direction:column; }
}

.puzzle-filterbar {
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 16px;
  padding:12px 14px;
  border:1px solid var(--tjk-border);
  border-radius:12px;
  background:#fff;
}
.puzzle-filterbar label { font-weight:800; }
.puzzle-filterbar select { min-height:40px; padding:7px 34px 7px 10px; border:1px solid #c7d2e1; border-radius:8px; background:#fff; }
.puzzle-filterbar span { color:var(--tjk-muted); font-size:.86rem; }
@media (max-width:620px) { .puzzle-filterbar { align-items:stretch; flex-direction:column; } }

/* v13.5 hover menus for Play Game and Tools */
.site-nav-item { position: relative; display: flex; align-items: stretch; }
.site-nav-item > [data-view-button] { height: 100%; }
.site-nav-dropdown {
  position: absolute; z-index: 1500; top: calc(100% - 1px); left: 50%;
  display: grid; min-width: 245px; padding: 8px;
  border: 1px solid var(--tjk-border); border-radius: 0 0 12px 12px;
  background: #fff; box-shadow: 0 18px 38px rgba(15,23,42,.17);
  opacity: 0; visibility: hidden; pointer-events: none; transform: translate(-50%, 7px);
  transition: opacity .14s ease, transform .14s ease, visibility .14s;
}
.site-nav-item:hover .site-nav-dropdown,
.site-nav-item:focus-within .site-nav-dropdown { opacity: 1; visibility: visible; pointer-events: auto; transform: translate(-50%, 0); }
.site-nav-dropdown button {
  display: grid; gap: 2px; width: 100%; min-height: 54px; padding: 9px 12px !important;
  border: 0 !important; border-radius: 8px; background: #fff; color: var(--tjk-navy); text-align: left; cursor: pointer;
}
.site-nav-dropdown button::after { display: none !important; }
.site-nav-dropdown button:hover, .site-nav-dropdown button:focus-visible { background: var(--tjk-blue-soft); outline: none; }
.site-nav-dropdown strong { font-size: .88rem; }
.site-nav-dropdown span { color: var(--tjk-muted); font-size: .72rem; font-weight: 600; }
@media (max-width: 1080px) {
  .site-nav-item { display: grid; grid-column: 1 / -1; }
  .site-nav-dropdown { position: static; display: grid; min-width: 0; padding: 4px 0 0 12px; border: 0; box-shadow: none; opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
  .site-nav-dropdown button { min-height: 42px; }
}

/* v13.9: force all 64 hero-board cells into identical rows and columns. */
.home-mini-board {
  grid-template-columns: repeat(8, minmax(0, 1fr));
  grid-template-rows: repeat(8, minmax(0, 1fr));
}
.home-mini-square {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  line-height: 1;
}

/* v14.1: close hover menus immediately after a destination is selected. */
.site-nav-item.is-dropdown-dismissed .site-nav-dropdown {
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transform:translate(-50%,-7px) !important;
}
@media(max-width:900px){
  .site-nav-item.is-dropdown-dismissed .site-nav-dropdown{display:none !important;transform:none !important;}
}

.home-mini-board{grid-template-rows:repeat(8,minmax(0,1fr))}.home-mini-square{min-width:0;min-height:0}


/* v14.7.6 — the expanded mobile navigation remains fully reachable. */
@media(max-width:940px){
  .site-header.is-menu-open .site-nav{
    max-height:calc(100dvh - 64px);
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    align-content:start;
    -webkit-overflow-scrolling:touch;
  }
  .site-header.is-menu-open .site-nav-item,
  .site-header.is-menu-open .site-nav-dropdown{min-height:0}
}

/* v15 public footer */
.site-footer{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:22px clamp(18px,4vw,56px);border-top:1px solid var(--border,#d9dee8);font-size:13px;opacity:.85}.site-footer nav{display:flex;gap:18px;flex-wrap:wrap}.site-footer a{color:inherit;text-decoration:none}.site-footer a:hover{text-decoration:underline}@media(max-width:650px){.site-footer{align-items:flex-start;flex-direction:column}.site-footer nav{gap:12px}}


/* v15.1.6: direct navigation link for opponent preparation. */
.site-nav > .site-nav-link{min-width:auto;padding-inline:clamp(10px,1.2vw,18px);white-space:nowrap}
@media(max-width:1480px){.site-nav > .site-nav-link{font-size:.82rem;padding-inline:8px}}
@media(max-width:1220px){.site-header.is-menu-open .site-nav > .site-nav-link{display:flex;min-height:44px;align-items:center;padding:0 12px;border-radius:9px;text-align:left}.site-header.is-menu-open .site-nav > .site-nav-link::after{display:none}}

/* v15.1.10 compact Prepare navigation label */
.site-nav > .prepare-nav-link{font-weight:800}


/* v15.1.14 — every primary navigation destination uses the same bold weight. */
.site-header .site-nav > button,
.site-header .site-nav > .site-nav-link,
.site-header .site-nav > .site-nav-item > button{font-weight:800!important}
.site-header .site-nav > button,.site-header .site-nav > .site-nav-link,.site-header .site-nav > .site-nav-item > button,.site-header .site-nav .site-nav-link{font-weight:800!important}

/* v15.1.16 — identical typography for buttons and the Prepare anchor. */
.site-header .site-nav > button,
.site-header .site-nav > .site-nav-link,
.site-header .site-nav > .site-nav-item > button {
  font-family: inherit !important;
  font-size: .92rem !important;
  font-style: normal !important;
  font-weight: 800 !important;
  font-synthesis: none !important;
  font-variation-settings: "wght" 800 !important;
  letter-spacing: 0 !important;
  line-height: 1.1 !important;
}

/* v15.1.18 — one complete, identical header on desktop and mobile. */
.site-header .site-nav > .site-nav-top-link,
.site-header .site-nav > .site-nav-item > .site-nav-top-link {
  position: relative;
  display: flex;
  align-items: center;
  min-width: auto;
  height: 70px;
  padding-inline: clamp(10px,1.2vw,18px);
  border: 0;
  background: transparent;
  color: var(--tjk-navy) !important;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  font-family: inherit !important;
  font-size: .92rem !important;
  font-style: normal !important;
  font-weight: 800 !important;
  font-synthesis: none !important;
  font-variation-settings: "wght" 800 !important;
  letter-spacing: 0 !important;
  line-height: 1.1 !important;
}
.site-header .site-nav > button,
.site-header .site-nav > .site-nav-link,
.site-header .site-nav > .site-nav-item > button {
  color: var(--tjk-navy) !important;
}
.site-header .site-nav > .site-nav-top-link:hover,
.site-header .site-nav > .site-nav-item > .site-nav-top-link:hover,
.site-header .site-nav > .site-nav-top-link.is-active,
.site-header .site-nav > .site-nav-item > .site-nav-top-link.is-active {
  color: var(--tjk-navy) !important;
}
@media (hover:hover) and (pointer:fine) and (min-width:1081px) {
  .site-header .site-nav > .site-nav-top-link,
  .site-header .site-nav > .site-nav-item > .site-nav-top-link {
    transition: background-color .14s ease, color .14s ease, transform .14s ease;
    border-radius: 10px;
  }
  .site-header .site-nav > .site-nav-top-link:hover,
  .site-header .site-nav > .site-nav-item > .site-nav-top-link:hover,
  .site-header .site-nav > .site-nav-top-link:focus-visible,
  .site-header .site-nav > .site-nav-item > .site-nav-top-link:focus-visible {
    background: var(--tjk-blue, #315be8) !important;
    color: #fff !important;
    transform: translateY(-1px);
  }
}
.site-header .site-nav .site-nav-top-link.is-active::after {
  content: "";
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 0;
  height: 3px;
  border-radius: 3px 3px 0 0;
  background: var(--tjk-blue);
}
.site-nav-dropdown a {
  display: grid;
  gap: 2px;
  min-height: 50px;
  padding: 9px 12px;
  border-radius: 8px;
  color: var(--tjk-navy);
  text-decoration: none;
}
.site-nav-dropdown a:hover,
.site-nav-dropdown a:focus-visible { background: var(--tjk-blue-soft); outline: none; }
.site-nav-dropdown a strong { font-size: .88rem; }
.site-nav-dropdown a span { color: var(--tjk-muted); font-size: .72rem; font-weight: 600; }
.site-profile-link { text-decoration: none; }
.site-icon-button[href] { display:grid; place-items:center; text-decoration:none; }

@media (max-width:1080px) {
  .site-header.is-menu-open .site-nav {
    display:grid;
    grid-template-columns:1fr;
    gap:6px;
    max-height:calc(100dvh - 64px);
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  .site-header.is-menu-open .site-nav-item,
  .site-header.is-menu-open .site-nav > .site-nav-top-link { width:100%; }
  .site-header.is-menu-open .site-nav > .site-nav-top-link,
  .site-header.is-menu-open .site-nav > .site-nav-item > .site-nav-top-link {
    min-height:44px;
    height:44px;
    padding:0 12px;
    border-radius:9px;
  }
  .site-header.is-menu-open .site-nav .site-nav-top-link.is-active::after { display:none; }
  .site-header.is-menu-open .site-nav-dropdown,
  .site-header.is-menu-open .site-nav-item.is-dropdown-dismissed .site-nav-dropdown {
    position:static !important;
    display:grid !important;
    min-width:0 !important;
    padding:4px 0 4px 12px !important;
    border:0 !important;
    box-shadow:none !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:none !important;
  }
  .site-header.is-menu-open .site-nav-dropdown a { min-height:42px; }
}
@media (max-width:620px) {
  .site-header .site-actions .site-sound-toggle { display:none; }
  .site-header .site-profile-link { min-width:38px; padding:0; }
  .site-header .site-profile-link .site-avatar { display:grid; }
}
@media (max-width:1080px){.opp-site-header .site-profile-link{display:none}}
@media (max-width:620px){.opp-site-header .site-search-link{display:none}.site-header .site-actions .site-sound-toggle{display:grid}.site-header .site-profile-link{display:none}}
/* v15.1.18 sound control is compact in every header; its volume panel floats instead of widening the page. */
.site-volume-control{position:relative;display:inline-grid;place-items:center;width:40px;min-width:40px;flex:0 0 40px}
.site-volume-control>.site-icon-button{width:40px;height:40px}
.site-volume-popover{position:absolute;z-index:2200;top:calc(100% + 10px);right:0;display:grid;width:210px;padding:12px;border:1px solid var(--tjk-border);border-radius:11px;background:var(--tjk-surface);box-shadow:0 16px 38px rgba(15,23,42,.18);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-5px);transition:.14s ease}
.site-volume-control.is-open .site-volume-popover,.site-volume-control:focus-within .site-volume-popover{opacity:1;visibility:visible;pointer-events:auto;transform:none}
.site-volume-popover label{display:grid;gap:7px;font-size:.78rem;font-weight:800}.site-volume-popover input[type=range]{width:100%}.site-volume-popover button{min-height:34px;margin-top:8px;border:1px solid var(--tjk-border);border-radius:8px;background:transparent;color:inherit;font-weight:800}
@media(max-width:620px){.opp-site-header{grid-template-columns:minmax(0,1fr) auto auto;column-gap:6px}.opp-site-header .site-actions{gap:6px;min-width:0}.opp-site-header .site-brand{min-width:0}.opp-site-header .site-brand>span:last-child{white-space:nowrap}.site-volume-popover{position:fixed;top:64px;right:10px}}


/* v15.1.39 — top-level navigation hover changes text only. */
@media (hover:hover) and (pointer:fine) and (min-width:1081px) {
  .site-header .site-nav > .site-nav-top-link:hover,
  .site-header .site-nav > .site-nav-item > .site-nav-top-link:hover,
  .site-header .site-nav > .site-nav-top-link:focus-visible,
  .site-header .site-nav > .site-nav-item > .site-nav-top-link:focus-visible {
    background:transparent !important;
    box-shadow:none !important;
    color:var(--tjk-blue,#315be8) !important;
    transform:none !important;
  }
}


/* v15.1.40 — top navigation hover is a text-colour change on every desktop page.
   The stronger selector also wins over older page-specific rules. */
@media (hover:hover) and (pointer:fine) and (min-width:1081px) {
  body .site-header .site-nav > a.site-nav-top-link:hover,
  body .site-header .site-nav > .site-nav-item > a.site-nav-top-link:hover,
  body .site-header .site-nav > button.site-nav-top-link:hover,
  body .site-header .site-nav > .site-nav-item > button.site-nav-top-link:hover,
  body .site-header .site-nav > a.site-nav-top-link:focus-visible,
  body .site-header .site-nav > .site-nav-item > a.site-nav-top-link:focus-visible {
    background:transparent !important;
    box-shadow:none !important;
    color:var(--tjk-blue,#315be8) !important;
    transform:none !important;
  }
  body .site-header .site-nav > .site-nav-item:hover > .site-nav-top-link {
    color:var(--tjk-blue,#315be8) !important;
  }
}

/* v15.1.42 — homepage and standalone pages use the same text-only nav hover.
   The homepage buttons do not carry .site-nav-top-link, so target the actual
   direct navigation children as well. */
@media (hover:hover) and (pointer:fine) {
  body .site-header .site-nav > button:hover,
  body .site-header .site-nav > a.site-nav-link:hover,
  body .site-header .site-nav > .site-nav-item:hover > button,
  body .site-header .site-nav > button:focus-visible,
  body .site-header .site-nav > a.site-nav-link:focus-visible,
  body .site-header .site-nav > .site-nav-item > button:focus-visible {
    color:var(--tjk-blue,#315be8) !important;
    background:transparent !important;
    box-shadow:none !important;
    transform:none !important;
  }
}

/* v15.1.65 deterministic language picker: all languages are rendered immediately. */
.site-language.is-native-hidden{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;clip-path:inset(50%)!important}
.site-language-picker{position:relative;min-width:146px}
.site-language-picker-button{width:100%;height:42px;padding:0 38px 0 14px;border:1px solid var(--line,#d9e2f1);border-radius:10px;background:var(--surface,#fff);color:var(--text,#0c1b39);font:inherit;font-weight:700;text-align:left;cursor:pointer;position:relative}
.site-language-picker-button::after{content:'⌄';position:absolute;right:13px;top:50%;transform:translateY(-52%);font-size:18px}
.site-language-picker-list{position:absolute;z-index:10050;top:calc(100% + 7px);right:0;width:max(190px,100%);max-height:min(70vh,620px);overflow-y:auto;overscroll-behavior:contain;padding:6px;background:var(--surface,#fff);border:1px solid var(--line,#d9e2f1);border-radius:12px;box-shadow:0 18px 50px rgba(10,25,55,.18)}
.site-language-picker-list[hidden]{display:none!important}
.site-language-picker-option{display:block;width:100%;padding:9px 11px;border:0;border-radius:8px;background:transparent;color:var(--text,#0c1b39);font:inherit;text-align:left;cursor:pointer;white-space:nowrap}
.site-language-picker-option:hover,.site-language-picker-option.is-active{background:var(--soft,#eef4ff)}
html[dir="rtl"] .site-language-picker-button{text-align:right;padding:0 14px 0 38px}html[dir="rtl"] .site-language-picker-button::after{right:auto;left:13px}

/* v15.1.74 — hard mobile width contract. No page may become wider than the
   visual viewport merely because a header control or translated label is long. */
html,body{max-width:100%;overflow-x:clip}
body>main,.standalone-view,.home-hero,.home-hero-inner,.home-dashboard,.home-quick-grid,.home-status-strip{max-width:100%;min-width:0}
.site-header,.site-header>*{min-width:0;box-sizing:border-box}
.site-brand{min-width:0;max-width:100%}.site-brand>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.site-actions{min-width:0}.site-language-picker{max-width:100%}
.home-hero-inner>*,.home-dashboard>*,.home-quick-card,.home-status-strip>div{min-width:0;max-width:100%;box-sizing:border-box}
.home-hero h1,.home-hero p,.home-quick-card h3,.home-quick-card p,.home-section-head h2{overflow-wrap:anywhere}
@media(max-width:620px){
  .site-header{width:100%;max-width:100vw;padding-inline:8px;column-gap:6px;grid-template-columns:minmax(0,1fr) auto auto}
  .site-actions{gap:5px;max-width:100%}
  .site-language-picker{width:108px;min-width:0!important;flex:0 1 108px}
  .site-language-picker-button{height:38px;padding-left:9px;padding-right:26px;font-size:.78rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .site-language-picker-button::after{right:8px}
  .site-theme-toggle,.site-sound-toggle,.site-menu-toggle{width:38px!important;height:38px!important;min-width:38px!important}
  .home-hero-inner{width:100%;padding:38px 14px}
  .home-hero h1{font-size:clamp(2.15rem,11.2vw,3.25rem);letter-spacing:-.045em}
  .home-hero-actions{width:100%;gap:8px}
  .home-primary-action,.home-secondary-action{max-width:100%}
  .home-dashboard{width:100%;padding:28px 12px 46px}
  .home-status-strip{width:100%}
}
@media(max-width:390px){
  .site-brand>span:last-child{display:none}
  .site-language-picker{width:92px;flex-basis:92px}
  .site-header{grid-template-columns:auto minmax(0,1fr) auto}
  .site-actions{justify-content:flex-end}
  .home-hero-inner{padding-inline:11px}
  .home-dashboard{padding-inline:9px}
}

/* v15.1.116 — direct-function home page. */
.home-launchpad{width:min(1320px,calc(100% - 36px));margin:0 auto;padding:38px 0 58px}
.home-launch-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.home-launch-card{position:relative;min-width:0;border:1px solid var(--tjk-border);border-radius:18px;background:#fff;color:var(--tjk-navy);box-shadow:0 8px 28px rgba(17,35,74,.06);text-decoration:none;cursor:pointer;overflow:hidden;text-align:left;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}
.home-launch-card:hover{transform:translateY(-2px);border-color:#afc7eb;box-shadow:0 15px 36px rgba(17,35,74,.11)}
.home-launch-card-board{grid-column:span 4;padding:0;display:grid;grid-template-rows:auto 1fr}
.home-launch-card-board .home-launch-copy{padding:17px 19px 19px}
.home-launch-play{grid-column:span 4}
.home-card-board-wrap{position:relative;padding:14px;background:linear-gradient(145deg,#eaf2ff,#f7faff)}
.home-preview-board{display:grid;grid-template-columns:repeat(8,1fr);aspect-ratio:1;overflow:hidden;border-radius:9px;box-shadow:0 3px 12px rgba(13,32,67,.16)}
.home-preview-square{display:grid;place-items:center;min-width:0;min-height:0}.home-preview-square.light{background:#e8eed2}.home-preview-square.dark{background:#789d5f}.home-preview-square img{width:88%;height:88%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 1px 1px rgba(0,0,0,.16))}
.home-board-badge{position:absolute;right:23px;bottom:23px;padding:5px 8px;border-radius:999px;background:rgba(12,24,51,.84);color:#fff;font-size:.72rem;font-weight:850;backdrop-filter:blur(6px)}
.home-launch-copy{min-width:0}.home-launch-kicker{display:block;margin-bottom:5px;color:var(--tjk-blue);font-size:.67rem;font-weight:900;letter-spacing:.12em}.home-launch-copy h2{margin:0;font-size:1.24rem;letter-spacing:-.025em}.home-launch-copy p{margin:7px 0 0;color:var(--tjk-muted);font-size:.88rem;line-height:1.45}
.home-launch-card-feature{grid-column:span 3;min-height:156px;padding:20px;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:start}
.home-feature-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--tjk-blue-soft);color:var(--tjk-blue);font-size:1.45rem;font-weight:900}.home-feature-arrow{align-self:center;color:#8090a8;font-size:1.35rem}.home-live-icon{color:#d9293f;background:#fff0f2}.home-eval-icon{position:relative;background:#eef2f7;overflow:hidden}.home-eval-icon:before,.home-eval-icon:after{content:"";position:absolute;top:8px;bottom:8px;width:9px}.home-eval-icon:before{left:12px;background:#16233b}.home-eval-icon:after{right:12px;background:#fff;border:1px solid #cbd4e1}.home-eval-icon i{position:absolute;z-index:2;width:24px;height:3px;background:var(--tjk-blue);left:10px;top:20px}
@media(max-width:1100px){.home-launch-card-board{grid-column:span 6}.home-launch-card-feature{grid-column:span 6}}
@media(max-width:680px){.home-launchpad{width:min(100% - 22px,620px);padding-top:22px}.home-launch-card-board,.home-launch-card-feature{grid-column:1/-1}.home-launch-card-feature{min-height:128px}.home-card-board-wrap{padding:10px}}
html[data-theme="dark"] .home-launch-card{background:#1a2431;border-color:#344254;color:#edf4ff;box-shadow:none}html[data-theme="dark"] .home-launch-card:hover{border-color:#5578a8;background:#1f2b3a}html[data-theme="dark"] .home-card-board-wrap{background:linear-gradient(145deg,#202d3d,#17212d)}html[data-theme="dark"] .home-launch-copy p{color:#aebbd0}html[data-theme="dark"] .home-feature-icon{background:#253851;color:#8fb6ff}html[data-theme="dark"] .home-feature-arrow{color:#8092a9}

/* v15.1.117 — refined dashboard proportions and true square preview boards. */
.home-launchpad{width:min(1400px,calc(100% - 40px));padding:34px 0 64px}
.home-launch-grid{gap:18px;align-items:stretch}
.home-launch-card{border-radius:20px;box-shadow:0 10px 34px rgba(17,35,74,.075)}
.home-launch-card:hover{transform:translateY(-3px);box-shadow:0 18px 44px rgba(17,35,74,.12)}
.home-launch-card-board{display:grid;min-height:0}
.home-launch-primary{grid-column:span 6;grid-template-columns:minmax(250px,1fr) minmax(260px,.95fr);grid-template-rows:1fr;align-items:center;background:linear-gradient(135deg,#fff 0%,#f9fbff 100%)}
.home-launch-primary .home-card-board-wrap{height:100%;display:grid;place-items:center;padding:22px;background:linear-gradient(145deg,#e8f0ff,#f5f8ff)}
.home-launch-primary .home-preview-board{width:min(100%,360px)}
.home-launch-primary .home-launch-copy{padding:28px 28px 30px}
.home-launch-primary .home-launch-copy h2{font-size:clamp(1.55rem,2vw,2.05rem)}
.home-launch-primary .home-launch-copy p{font-size:.96rem;max-width:34ch}
.home-launch-primary .home-launch-copy:after{content:"Partie starten  →";display:inline-flex;margin-top:22px;padding:10px 15px;border-radius:10px;background:var(--tjk-blue);color:#fff;font-size:.84rem;font-weight:850;letter-spacing:.01em}
.home-launch-secondary{grid-column:span 3;grid-template-rows:auto 1fr;background:#fff}
.home-launch-secondary .home-card-board-wrap{padding:14px 14px 10px;display:grid;place-items:center;background:linear-gradient(145deg,#edf3fc,#f8faff)}
.home-launch-secondary .home-preview-board{width:min(100%,265px)}
.home-launch-secondary .home-launch-copy{padding:14px 18px 20px}
.home-launch-secondary .home-launch-copy h2{font-size:1.16rem}
.home-launch-secondary .home-launch-copy p{font-size:.84rem}
.home-preview-board{width:100%;aspect-ratio:1/1;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(8,minmax(0,1fr));overflow:hidden;border-radius:9px;box-shadow:0 4px 16px rgba(13,32,67,.16);contain:layout paint size}
.home-preview-square{width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;display:grid;place-items:center}
.home-preview-square img{display:block;width:86%;height:86%;max-width:100%;max-height:100%;object-fit:contain}
.home-launch-card-feature{min-height:142px;padding:19px 20px;border-top:3px solid transparent}
.home-launch-card-feature:hover{border-top-color:var(--tjk-blue)}
.home-feature-icon{box-shadow:inset 0 0 0 1px rgba(35,93,190,.06)}
@media(max-width:1180px){.home-launch-primary{grid-column:1/-1}.home-launch-primary .home-preview-board{width:min(100%,320px)}.home-launch-secondary{grid-column:span 6}.home-launch-card-feature{grid-column:span 6}}
@media(max-width:720px){.home-launchpad{width:min(100% - 22px,640px);padding-top:20px}.home-launch-primary{grid-template-columns:1fr;grid-template-rows:auto auto}.home-launch-primary .home-card-board-wrap{padding:14px}.home-launch-primary .home-preview-board{width:min(100%,300px)}.home-launch-primary .home-launch-copy{padding:18px 20px 22px}.home-launch-secondary,.home-launch-card-feature{grid-column:1/-1}.home-launch-secondary .home-preview-board{width:min(100%,300px)}}
html[data-theme="dark"] .home-launch-primary,html[data-theme="dark"] .home-launch-secondary{background:#1a2431}html[data-theme="dark"] .home-launch-primary .home-card-board-wrap,html[data-theme="dark"] .home-launch-secondary .home-card-board-wrap{background:linear-gradient(145deg,#202d3d,#17212d)}

/* v15.1.118: compact professional heading for the dashboard home. */
.home-page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:0 0 22px;padding:2px 2px 0}
.home-page-eyebrow{display:block;margin-bottom:5px;color:var(--tjk-blue);font-size:.67rem;font-weight:900;letter-spacing:.14em}
.home-page-heading h1{margin:0;color:var(--tjk-navy);font-size:clamp(2rem,3vw,2.8rem);line-height:1;letter-spacing:-.045em}
.home-page-heading p{margin:9px 0 0;color:var(--tjk-muted);font-size:.98rem;font-weight:620;letter-spacing:-.01em}
html[data-theme="dark"] .home-page-heading h1{color:#f4f7fb}
html[data-theme="dark"] .home-page-heading p{color:#aebbd0}
@media(max-width:680px){.home-page-heading{margin-bottom:16px}.home-page-heading h1{font-size:2.05rem}.home-page-heading p{font-size:.9rem}}


/* v15.1.126 — task-first home inspired by mature chess platforms: one dominant action,
   one training continuation, one real puzzle preview, then compact specialist tools. */
.home-command-center{width:min(1420px,calc(100% - 40px));padding:30px 0 62px}
.home-command-heading{align-items:center;margin-bottom:20px}
.home-command-heading p{margin-top:7px;font-size:.94rem}
.home-player-summary{display:grid;justify-items:end;gap:1px;min-width:112px;padding:10px 14px;border:1px solid var(--tjk-border);border-radius:13px;background:#fff;box-shadow:0 4px 16px rgba(17,35,74,.045)}
.home-player-summary span{color:var(--tjk-muted);font-size:.61rem;font-weight:900;letter-spacing:.13em}.home-player-summary strong{font-size:1.42rem;color:var(--tjk-navy);line-height:1.05}
.home-focus-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(230px,3fr) minmax(230px,3fr);gap:17px;align-items:stretch}
.home-focus-card{min-width:0;border:1px solid var(--tjk-border);border-radius:20px;background:#fff;color:var(--tjk-navy);box-shadow:0 10px 30px rgba(17,35,74,.07);overflow:hidden;text-align:left;cursor:pointer;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}
.home-focus-card:hover{transform:translateY(-2px);border-color:#a9c2e8;box-shadow:0 17px 40px rgba(17,35,74,.115)}
.home-focus-play{display:grid;grid-template-columns:minmax(260px,.96fr) minmax(250px,1.04fr);background:linear-gradient(135deg,#fff,#f7faff)}
.home-focus-board-wrap{display:grid;place-items:center;padding:18px;background:linear-gradient(145deg,#e7effd,#f6f9ff)}
.home-focus-play .home-preview-board{width:min(100%,350px)}
.home-focus-copy{min-width:0}.home-focus-play .home-focus-copy{display:flex;flex-direction:column;justify-content:center;padding:29px 30px}
.home-focus-copy h2{margin:0;font-size:clamp(1.35rem,2vw,2rem);letter-spacing:-.035em}.home-focus-copy p{margin:8px 0 0;color:var(--tjk-muted);font-size:.92rem;line-height:1.48}
.home-focus-meta{margin-top:15px;color:#697891;font-size:.76rem;font-weight:750}.home-primary-cta{align-self:flex-start;margin-top:22px;padding:10px 15px;border-radius:10px;background:var(--tjk-blue);color:#fff;font-size:.83rem;font-weight:900;box-shadow:0 7px 17px rgba(11,95,231,.2)}.home-primary-cta b{margin-left:7px}
.home-focus-training{display:flex;flex-direction:column;padding:22px;background:linear-gradient(150deg,#0f63e9,#215fbd);color:#fff;border-color:#1b60c7}.home-focus-training:hover{border-color:#0b55cf}.home-focus-training .home-launch-kicker{color:#dce9ff}.home-focus-training .home-focus-copy h2{font-size:1.34rem;color:#fff}.home-focus-training .home-focus-copy p{color:#e6efff}.home-training-symbol{display:grid;place-items:center;width:48px;height:48px;margin-bottom:auto;border-radius:14px;background:rgba(255,255,255,.16);font-size:1.55rem;font-weight:900}.home-inline-action{display:inline-block;margin-top:19px;color:#fff;font-size:.82rem;font-weight:900}
.home-focus-puzzle{display:grid;grid-template-rows:auto 1fr}.home-puzzle-preview-wrap{position:relative;display:grid;place-items:center;padding:14px;background:linear-gradient(145deg,#edf3fc,#fafcff)}.home-focus-puzzle .home-preview-board{width:min(100%,250px)}.home-focus-puzzle .home-focus-copy{padding:15px 18px 19px}.home-focus-puzzle .home-focus-copy h2{font-size:1.2rem}.home-focus-puzzle .home-focus-copy p{font-size:.82rem;margin-top:6px}
.home-tool-section{margin-top:27px}.home-tool-heading{display:flex;align-items:end;justify-content:space-between;margin:0 2px 12px}.home-tool-heading h2{margin:3px 0 0;font-size:1.25rem;letter-spacing:-.025em;color:var(--tjk-navy)}
.home-tool-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px}.home-tool-card{min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:11px;padding:15px 14px;border:1px solid var(--tjk-border);border-radius:14px;background:#fff;color:var(--tjk-navy);text-decoration:none;text-align:left;cursor:pointer;box-shadow:0 4px 15px rgba(17,35,74,.04);transition:border-color .14s ease,background .14s ease,transform .14s ease}.home-tool-card:hover{transform:translateY(-1px);border-color:#aac3e8;background:#fbfdff}.home-tool-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--tjk-blue-soft);color:var(--tjk-blue);font-size:1.18rem;font-weight:900}.home-tool-card strong{display:block;font-size:.92rem}.home-tool-card small{display:block;margin-top:2px;color:var(--tjk-muted);font-size:.7rem;line-height:1.25}.home-tool-card>span:last-child{color:#91a0b5;font-weight:900}.home-tool-live{color:#d52a41;background:#fff0f2}.home-tool-eval{position:relative;background:#eef2f7;overflow:hidden}.home-tool-eval:before,.home-tool-eval:after{content:"";position:absolute;top:7px;bottom:7px;width:7px}.home-tool-eval:before{left:10px;background:#17243a}.home-tool-eval:after{right:10px;background:#fff;border:1px solid #c7d0dd}.home-tool-eval i{position:absolute;left:9px;right:9px;top:18px;height:2px;background:var(--tjk-blue);z-index:2}
html[data-theme="dark"] .home-player-summary,html[data-theme="dark"] .home-focus-card:not(.home-focus-training),html[data-theme="dark"] .home-tool-card{background:#1a2431;border-color:#344254;color:#eef4ff;box-shadow:none}html[data-theme="dark"] .home-player-summary strong,html[data-theme="dark"] .home-tool-heading h2{color:#f4f7fb}html[data-theme="dark"] .home-focus-board-wrap,html[data-theme="dark"] .home-puzzle-preview-wrap{background:linear-gradient(145deg,#202d3d,#17212d)}html[data-theme="dark"] .home-focus-copy p,html[data-theme="dark"] .home-tool-card small,html[data-theme="dark"] .home-focus-meta{color:#aebbd0}html[data-theme="dark"] .home-tool-card:hover{background:#202d3c;border-color:#56759f}
@media(max-width:1120px){.home-focus-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-focus-play{grid-column:1/-1}.home-tool-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.home-command-center{width:min(100% - 22px,650px);padding-top:20px}.home-command-heading{align-items:flex-start}.home-player-summary{padding:8px 11px}.home-focus-grid{grid-template-columns:1fr}.home-focus-play{grid-column:auto;grid-template-columns:1fr}.home-focus-play .home-focus-board-wrap{padding:13px}.home-focus-play .home-preview-board{width:min(100%,300px)}.home-focus-play .home-focus-copy{padding:19px 20px 22px}.home-focus-training{min-height:195px}.home-focus-puzzle .home-preview-board{width:min(100%,280px)}.home-tool-grid{grid-template-columns:1fr}.home-tool-card{padding:14px}}

/* v15.1.128 — restore the calmer classic TJK-Chess landing hero; tools follow below. */
.home-dashboard-expanded{padding-top:42px!important}
.home-quick-grid-expanded{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.home-rating-pill{display:inline-flex;align-items:baseline;gap:5px;padding:8px 12px;border:1px solid var(--tjk-line);border-radius:999px;background:#fff;color:var(--tjk-muted);font-size:.78rem;font-weight:800}.home-rating-pill b{color:var(--tjk-ink);font-size:1.05rem}
.home-card-anchor{display:inline-flex;text-decoration:none}
html[data-theme="dark"] .home-rating-pill{background:#171b21;border-color:#303844;color:#aeb7c4}.home-quick-card>a.home-card-link{width:max-content}
@media(max-width:1100px){.home-quick-grid-expanded{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:620px){.home-quick-grid-expanded{grid-template-columns:1fr!important}.home-section-head{align-items:flex-start}.home-rating-pill{margin-top:4px}}