/* Shared brand, public navigation and member sidebar, including responsive rules. */

.skip-link { position:absolute;top:-100px;left:10px;z-index:30;padding:10px;background:white }
.skip-link:focus { top:10px }
.brand { display:inline-flex;align-items:center;gap:12px;text-decoration:none;flex-shrink:0 }
.brand-mark { font-size:25px;font-weight:900;letter-spacing:-2px;position:relative;display:grid;place-items:center;width:48px;height:48px;border:2px solid currentColor;line-height:1 }
.brand-mark>span { font-size:11px;position:absolute;right:3px;bottom:2px;letter-spacing:0 }
.brand-name { font-size:10px;font-weight:600;line-height:1.6;letter-spacing:.12em }
.brand-name strong { font-size:15px;letter-spacing:.06em }
.public-header { display:flex;justify-content:space-between;align-items:center;padding:25px max(5vw,24px);border-bottom:1px solid var(--line);background:#fafbf8 }
.public-header nav { display:flex;align-items:center;gap:30px }
.public-header nav>a:not(.button) { text-decoration:none;font-size:14px;font-weight:600 }
.sidebar { position:fixed;left:0;top:0;bottom:0;width:var(--sidebar);padding:30px 22px;background:#1d2424;color:white;display:flex;flex-direction:column;z-index:10 }
.sidebar .brand { padding:0 4px }
.sidebar .brand-mark { color:var(--gold);width:44px;height:44px }
.sidebar .brand-name { font-size:9px }
.sidebar .brand-name strong { font-size:13px }
.nav-label { font-size:8px;letter-spacing:.16em;color:#a6b3ad;margin:50px 12px 14px }
.app-nav { display:grid;gap:6px }
.app-nav a { display:flex;align-items:center;gap:12px;font-size:13px;text-decoration:none;color:#c3cec7;padding:12px;border-radius:6px }
.app-nav a.active { background:#34403a;color:#fff }
.app-nav a:hover { background:#2a3430;color:white }
.nav-number { color:#95a49b;font-size:10px }
.pro-dot { margin-left:auto;color:var(--gold) }
.sidebar-bottom { margin-top:auto;padding:30px 12px 0 }
.sidebar-bottom>p { font-size:11px;color:#aebdb3;margin:10px 0 18px }
.plan-label { font-size:9px;letter-spacing:.12em;color:var(--gold);font-weight:800 }
.sidebar-bottom .button { width:100% }
.account-link { display:block;border-top:1px solid #3c4740;margin-top:25px;padding-top:20px;text-decoration:none;font-size:12px }
.account-link>span { display:block;color:#a7b4ab;font-size:10px;margin-top:4px }
@media(max-width:1100px) {
  .sidebar { padding:25px 14px }
  .sidebar .brand-name strong { font-size:11px }
  .public-header nav { gap:20px }
}
@media(max-width:760px) {
  .public-header { padding:19px 22px }
  .public-header nav { gap:15px }
  .public-header nav>a:first-child, .public-header nav>a:nth-child(2) { display:none }
  .brand-name strong { font-size:13px }
  .brand-mark { width:40px;height:40px }
  .sidebar { position:relative;width:100%;height:auto;padding:17px 20px }
  .sidebar .brand-name strong { font-size:13px }
  .nav-label, .sidebar-bottom { display:none }
  .app-nav { display:flex;overflow-x:auto;margin-top:19px;gap:4px;padding-bottom:3px }
  .app-nav a { flex-shrink:0;padding:8px 10px;font-size:11px }
  .nav-number { display:none }
  .pro-dot { font-size:9px }
}
