/* Shared top nav for all tool pages. Loaded by /assets/nav.js. */
:root{
  --nav-navy:#02305A;
  --nav-navy-700:#011C38;
  --nav-navy-800:#011226;
  --nav-green:#00AC6C;
  --nav-blue:#34B8EA;
  --nav-ink-100:#E4E9EF;
}

.ppi-nav{
  position:sticky;top:0;z-index:100;
  background:rgba(2,28,56,0.92);
  backdrop-filter:saturate(180%) blur(8px);
  -webkit-backdrop-filter:saturate(180%) blur(8px);
  border-bottom:1px solid rgba(255,255,255,0.08);
  box-shadow:0 1px 0 rgba(0,172,108,0.55);
  height:56px;
  display:flex;align-items:center;
  padding:0 24px;
  color:#fff;
  font-family:'Source Sans Pro',system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.ppi-nav .ppi-brand{
  display:inline-flex;align-items:center;gap:14px;
  text-decoration:none;
}
.ppi-nav .ppi-brand img{height:24px;display:block;}
.ppi-nav .ppi-brand .ppi-divider{
  width:1px;height:22px;
  background:rgba(255,255,255,0.18);
}
.ppi-nav .ppi-brand .ppi-label{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:10px;font-weight:700;letter-spacing:0.2em;
  text-transform:uppercase;color:var(--nav-blue);
}

.ppi-nav .ppi-nav-links{
  display:flex;align-items:center;gap:2px;
  margin-left:32px;flex:1;overflow:hidden;
}
.ppi-nav .ppi-nav-links a{
  color:rgba(255,255,255,0.72);
  font-size:13px;font-weight:600;
  padding:8px 12px;border-radius:6px;
  text-decoration:none;white-space:nowrap;
  transition:color .15s,background .15s;
}
.ppi-nav .ppi-nav-links a:hover{
  color:#fff;background:rgba(255,255,255,0.06);
}
.ppi-nav .ppi-nav-links a.active{
  color:#fff;background:rgba(0,172,108,0.22);
  box-shadow:inset 0 -2px 0 var(--nav-green);
}

.ppi-nav .ppi-nav-right{
  display:inline-flex;align-items:center;gap:10px;margin-left:auto;
}
.ppi-nav .ppi-me{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 12px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:999px;
  font-size:12px;color:rgba(255,255,255,0.9);font-weight:600;
}
.ppi-nav .ppi-me .ppi-dot{
  width:6px;height:6px;background:var(--nav-green);border-radius:50%;
  box-shadow:0 0 0 3px rgba(0,172,108,0.22);
}
.ppi-nav .ppi-home-link{
  color:rgba(255,255,255,0.72);font-size:13px;font-weight:600;
  padding:6px 10px;border-radius:6px;text-decoration:none;
  display:inline-flex;align-items:center;gap:6px;
  transition:color .15s,background .15s;
}
.ppi-nav .ppi-home-link:hover{color:#fff;background:rgba(255,255,255,0.06);}

.ppi-nav .ppi-cmdk-btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 10px 6px 10px;
  background:rgba(255,255,255,0.08);
  color:rgba(255,255,255,0.85);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:8px;cursor:pointer;
  font-family:inherit;
  transition:background .15s,color .15s,border-color .15s;
}
.ppi-nav .ppi-cmdk-btn:hover{
  background:rgba(255,255,255,0.14);color:#fff;
  border-color:rgba(255,255,255,0.16);
}
.ppi-nav .ppi-cmdk-btn svg{width:14px;height:14px;opacity:0.75;}
.ppi-nav .ppi-kbd{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:10px;font-weight:700;letter-spacing:0.5px;
  padding:2px 6px;
  border:1px solid rgba(255,255,255,0.18);
  border-radius:4px;line-height:1;
  background:rgba(0,0,0,0.18);color:rgba(255,255,255,0.85);
}

/* ===== Command palette ===== */
.ppi-cmdk{position:fixed;inset:0;z-index:3000;display:none;}
.ppi-cmdk.open{display:block;}
.ppi-cmdk-backdrop{
  position:absolute;inset:0;
  background:rgba(1,18,38,0.62);
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
}
.ppi-cmdk-panel{
  position:absolute;left:50%;top:88px;transform:translateX(-50%);
  width:min(580px,calc(100% - 32px));
  background:#fff;border-radius:16px;
  box-shadow:0 24px 64px rgba(2,48,90,0.28),0 8px 16px rgba(2,48,90,0.12);
  overflow:hidden;display:flex;flex-direction:column;
  border:1px solid rgba(2,48,90,0.06);
  font-family:'Source Sans Pro',system-ui,-apple-system,sans-serif;
}
.ppi-cmdk-input{
  width:100%;padding:18px 22px;border:none;outline:none;
  font-size:16px;color:var(--nav-navy);background:#fff;
  border-bottom:1px solid var(--nav-ink-100);
  font-family:inherit;
}
.ppi-cmdk-input::placeholder{color:#A6B1BD;}
.ppi-cmdk-results{max-height:50vh;overflow:auto;padding:8px 0;}
.ppi-cmdk-item{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  width:100%;padding:12px 22px;
  background:transparent;border:none;text-align:left;cursor:pointer;
  font-family:inherit;font-size:14px;color:#262F3A;
  transition:background .12s;
}
.ppi-cmdk-item:hover,.ppi-cmdk-item.active{background:#F1F4F8;}
.ppi-cmdk-item.active{box-shadow:inset 3px 0 0 var(--nav-green);}
.ppi-cmdk-item .ppi-cmdk-label{font-weight:600;color:var(--nav-navy);}
.ppi-cmdk-item .ppi-cmdk-href{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:11px;color:#7A8694;
}
.ppi-cmdk-empty{padding:22px;text-align:center;color:#7A8694;font-size:13px;}
.ppi-cmdk-hint{
  padding:12px 22px;font-size:11px;color:#7A8694;
  font-family:'JetBrains Mono',ui-monospace,monospace;letter-spacing:0.04em;
  background:#F7F8FA;border-top:1px solid var(--nav-ink-100);
}

body.has-ppi-nav{padding-top:0;}
body.has-ppi-nav .ppi-backnav{display:none !important;}

@media (max-width:720px){
  .ppi-nav{height:auto;min-height:48px;padding:8px 16px;flex-wrap:wrap;gap:8px;}
  .ppi-nav .ppi-brand .ppi-divider,.ppi-nav .ppi-brand .ppi-label{display:none;}
  .ppi-nav .ppi-nav-links{margin-left:0;flex-basis:100%;order:3;overflow-x:auto;padding-bottom:4px;}
  .ppi-nav .ppi-nav-links a{padding:6px 10px;font-size:12px;}
  .ppi-nav .ppi-me{display:none;}
  .ppi-nav .ppi-kbd{display:none;}
  .ppi-cmdk-panel{top:16px;width:calc(100% - 24px);}
}