/* Page frame: top tabs, sidebar + content shell, group-box panels, footer. */
.vr-page{ min-height:100vh; display:flex; flex-direction:column; background:var(--page); color:var(--ink); }
.inner{ max-width:1140px; margin:0 auto; width:100%; padding:0 18px; }

/* Top tabs = primary menu (tool selector) */
.tabs{ background:linear-gradient(180deg,var(--hdr-1),var(--hdr-2)); box-shadow:inset 0 2px 0 rgba(0,0,0,.2); }
.tabs .inner{ display:flex; gap:3px; padding-top:7px; overflow:visible; }
.tabs ul{ list-style:none; margin:0; padding:0; display:flex; gap:3px; }
.tabs li{ position:relative; }
.tab, .tabs a{ flex:0 0 auto; display:block; padding:6px 16px 7px; color:var(--band-2); text-decoration:none; white-space:nowrap; background:linear-gradient(180deg,var(--face),var(--face-lt)); border:1px solid var(--lo); border-bottom:0; border-radius:6px 6px 0 0; position:relative; top:1px; }
.tab:hover, .tabs a:hover{ background:var(--hover); }
.tab.active, .tabs .current-menu-item > a, .tabs .current_page_item > a, .tabs .current-menu-parent > a{ background:var(--panel); color:var(--band-2); font-weight:bold; top:0; padding-bottom:8px; }

/* Dropdown submenus in the top tabs (parent items). Open on hover (desktop),
   on keyboard focus, or when menu.js adds .vr-open (click / touch). */
.tabs .menu-item-has-children > a::after{ content:"\25BE"; margin-left:7px; font-size:11px; opacity:.8; }
.tabs .sub-menu{ list-style:none; margin:0; padding:0; position:absolute; left:0; top:100%; min-width:186px; z-index:60;
  background:var(--panel); border:1px solid var(--lo); box-shadow:0 6px 18px rgba(0,0,0,.45); display:none; }
.tabs li:hover > .sub-menu, .tabs li:focus-within > .sub-menu, .tabs li.vr-open > .sub-menu{ display:block; }
.tabs .sub-menu li{ display:block; }
.tabs .sub-menu a{ display:block; position:static; top:0; flex:none; white-space:nowrap; border:0; border-bottom:1px solid var(--lt); border-radius:0;
  background:var(--panel); color:var(--link); padding:6px 12px 6px 12px; }
.tabs .sub-menu li:last-child a{ border-bottom:0; }
.tabs .sub-menu a:hover{ background:var(--hover); text-decoration:underline; }
.tabs .sub-menu .menu-item-has-children > a::after{ content:"\25B8"; float:right; margin-left:8px; }
/* nested (third level) opens to the right */
.tabs .sub-menu .sub-menu{ left:100%; top:-1px; }

/* Body shell: fixed-width sidebar + fluid content */
.shell{ flex:1 0 auto; background:var(--page); }
.shell .inner{ display:flex; gap:13px; padding-top:14px; padding-bottom:18px; align-items:flex-start; }
.sidebar{ flex:0 0 196px; display:flex; flex-direction:column; gap:11px; }
.content{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:13px; }
.microbar{ flex:0 0 300px; display:flex; flex-direction:column; gap:11px; }

/* Group-box panels */
.panel{ background:var(--panel); border:1px solid var(--lo); box-shadow:inset -1px -1px 0 var(--face-lt), inset 0 1px 0 rgba(255,255,255,.32); }
.panel > .hd{ padding:4px 9px; color:var(--hd-ink); font-weight:bold; letter-spacing:.2px; text-shadow:0 1px 1px rgba(0,0,0,.5),0 0 3px rgba(0,0,0,.35); background:linear-gradient(180deg,var(--hdr-1),var(--hdr-2)); box-shadow:inset 0 1px 0 rgba(255,255,255,.28); border-bottom:1px solid rgba(0,0,0,.22); display:flex; align-items:center; gap:7px; }
.panel > .hd .dot{ width:13px; height:13px; flex:0 0 auto; }
.panel > .hd .hd-hidden{ visibility:hidden; }
.panel > .bd{ padding:9px 11px; }
.panel > .bd.flush{ padding:0; }
.panel > .bd.landing{ padding:20px 24px; }

/* Vertical nav lists (sidebar menu / widgets) */
.nav{ display:flex; flex-direction:column; }
.nav ul{ list-style:none; margin:0; padding:0; }
.nav a{ display:block; padding:5px 8px 5px 20px; position:relative; color:var(--link); text-decoration:none; border-bottom:1px solid var(--lt); }
.nav li:last-child a{ border-bottom:0; }
.nav a::before{ content:"\00BB"; position:absolute; left:8px; color:var(--band-2); font-weight:bold; }
.nav a:hover{ background:var(--hover); text-decoration:underline; }
.nav a.active, .nav .current-menu-item > a, .nav .current_page_item > a{ background:linear-gradient(180deg,var(--hdr-1),var(--hdr-2)); color:var(--hd-ink); text-shadow:0 1px 1px rgba(0,0,0,.5),0 0 3px rgba(0,0,0,.35); }
.nav a.active::before, .nav .current-menu-item > a::before{ color:var(--hd-ink); opacity:.75; }
.nav .muted a{ color:var(--muted); }

/* Footer */
.siteftr{ background:linear-gradient(180deg,var(--foot-1),var(--foot-2)); color:var(--ft-ink); text-shadow:0 1px 1px rgba(0,0,0,.5),0 0 3px rgba(0,0,0,.35); box-shadow:inset 0 2px 0 rgba(255,255,255,.18); }
.siteftr .inner{ display:flex; flex-wrap:wrap; gap:6px 18px; align-items:center; padding-top:9px; padding-bottom:9px; font-size:13px; }
.siteftr a{ color:var(--ft-ink); }
.siteftr .spacer{ margin-left:auto; }
.footer-menu{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; align-items:center; }
.footer-menu li{ display:inline; }
.footer-menu li + li::before{ content:"\00B7"; margin:0 10px; opacity:.6; }
.footer-menu a{ color:var(--ft-ink); text-decoration:none; }
.footer-menu a:hover{ text-decoration:underline; }
.footer-widgets{ display:flex; flex-wrap:wrap; gap:18px; padding:12px 0; }
.footer-widgets .widget{ flex:1 1 200px; }

/* Responsive */
@media (max-width:760px){
  .shell .inner{ flex-direction:column; }
  .sidebar, .microbar{ flex-basis:auto; width:100%; }
  .masthead .corner{ display:none; }
}
@media (prefers-reduced-motion: reduce){ *{ transition:none !important; } }