/* Shared responsive tool-page navigation. */
.mobile-chess-menu{display:none}
@media(max-width:1099px){
 .navbar{position:sticky!important;top:0;z-index:1000!important;display:flex!important;align-items:center!important;justify-content:space-between!important;flex-wrap:nowrap!important;min-height:72px!important;padding:10px 20px!important;background:#031120!important;border-bottom:1px solid #21435e}
 .navbar .brand{min-width:0;flex:0 1 auto}
 .navbar .brand-logo{width:min(220px,55vw)!important;height:auto!important;max-height:56px!important;object-fit:contain}
 .hero-tool-links{display:none!important}
 .mobile-chess-menu{display:block!important;position:relative;flex:0 0 auto;margin-left:auto;color:#e9f8ff}
 .mobile-chess-menu summary{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid #2b789b;border-radius:10px;background:#0c2b45;color:#4de2ff;cursor:pointer;list-style:none;font-weight:800;font-size:13px}
 .mobile-chess-menu summary::-webkit-details-marker{display:none}
 .mobile-chess-menu summary svg{width:23px;height:23px}
 .mobile-chess-menu[open] summary{background:#16425e;border-color:#4de2ff}
 .mobile-chess-menu nav{position:absolute;right:0;top:calc(100% + 10px);width:min(250px,85vw);display:grid;gap:6px;padding:10px;border:1px solid #2b789b;border-radius:12px;background:#061b30;box-shadow:0 16px 40px rgba(0,0,0,.55)}
 .mobile-chess-menu nav a{display:block;padding:13px 14px;border-radius:8px;color:#e6f7ff;background:#102f49;border:1px solid #254f6c;text-decoration:none;font-size:15px;font-weight:750}
 .mobile-chess-menu nav a:hover,.mobile-chess-menu nav a:focus-visible{background:#1a4c6a;border-color:#4de2ff}
}

@media(max-width:1099px){.tool-page>.tool-nav{display:none!important}}

/* Compact mobile chess tool pages: heading directly below the sticky header. */
@media(max-width:1099px){
 .tool-page{margin-top:0!important;padding-top:12px!important}
 .tool-page>h1{margin-top:0!important;margin-bottom:12px!important}
 .tool-page>.tool-lead{display:none!important}
 .tool-page>.tool-card:first-of-type{margin-top:12px!important}
}

/* Tool pages share the top-right menu at desktop sizes too. */
@media(min-width:1100px){
 body:has(.tool-page) .navbar{position:sticky!important;top:0;z-index:1000!important;display:flex!important;align-items:center!important;justify-content:space-between!important;background:#031120!important}
 body:has(.tool-page) .mobile-chess-menu{display:block!important;position:relative;margin-left:auto;color:#e9f8ff}
 body:has(.tool-page) .mobile-chess-menu summary{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid #2b789b;border-radius:10px;background:#0c2b45;color:#4de2ff;cursor:pointer;list-style:none;font-weight:800;font-size:13px}
 body:has(.tool-page) .mobile-chess-menu summary::-webkit-details-marker{display:none}
 body:has(.tool-page) .mobile-chess-menu summary svg{width:23px;height:23px}
 body:has(.tool-page) .mobile-chess-menu nav{position:absolute;right:0;top:calc(100% + 10px);width:250px;display:grid;gap:6px;padding:10px;border:1px solid #2b789b;border-radius:12px;background:#061b30;box-shadow:0 16px 40px rgba(0,0,0,.55);z-index:20}
 body:has(.tool-page) .mobile-chess-menu nav a{display:block;padding:13px 14px;border-radius:8px;color:#e6f7ff;background:#102f49;border:1px solid #254f6c;text-decoration:none;font-size:15px;font-weight:750}
}
body:has(.tool-page) .tool-page>.tool-nav{display:none!important}
body:has(.tool-page) .tool-page{margin-top:0!important;padding-top:12px!important}
body:has(.tool-page) .tool-page>h1{margin-top:0!important;margin-bottom:12px!important}
body:has(.tool-page) .tool-page>.tool-lead{display:none!important}
body:has(.tool-page) .tool-page>.tool-card:first-of-type{margin-top:12px!important}