/* PlanetPad · the ONE header (markup: pp-header.js, behaviour: public/pp/header.js). Linked on every page by the
   server, after the page's own styles. Three parts: the header row, the navigation drawer, the phone tab bar.
   Everything is sized from four variables so a page can place its own chrome against them:
     --pp-hd-h   header height, safe area included        --pp-tb-h   phone tab bar height (0 on desktop)
     --pp-sat / --pp-sab   the safe areas */
:root{--pp-sat:env(safe-area-inset-top,0px);--pp-sab:env(safe-area-inset-bottom,0px);--pp-hd-row:56px;--pp-hd-h:calc(var(--pp-hd-row) + var(--pp-sat));--pp-tb-h:0px;--pp-hd-z:45;--pp-tb-z:40;
  --pph-bg:rgba(5,7,14,.94);--pph-solid:#080b15;--pph-ink:#eef1f8;--pph-dim:#a3acc2;--pph-faint:#6b7590;--pph-line:rgba(150,175,235,.2);--pph-line2:rgba(150,175,235,.36);--pph-fill:rgba(150,175,235,.07);
  --pph-ice:#8fe6ff;--pph-hot:#ffd9c4;--pph-hot-bg:rgba(255,106,43,.17);--pph-hot-line:rgba(255,106,43,.5);--pph-grad:linear-gradient(100deg,#ffb02e,#ff6a2b 45%,#f0386b);--pph-font:'Chakra Petch',ui-sans-serif,system-ui,sans-serif}
html[data-theme="light"]{--pph-bg:rgba(247,248,251,.95);--pph-solid:#f7f8fb;--pph-ink:#131826;--pph-dim:#4c566c;--pph-faint:#7b859b;--pph-line:rgba(24,36,72,.15);--pph-line2:rgba(24,36,72,.3);--pph-fill:rgba(24,36,72,.05);
  --pph-ice:#1c7fa3;--pph-hot:#a8380a;--pph-hot-bg:rgba(255,106,43,.14);--pph-hot-line:rgba(226,84,20,.55)}
@media (max-width:820px){:root{--pp-hd-row:52px;--pp-tb-h:calc(56px + var(--pp-sab))}}
html:has(#pp-gl){--pp-hd-z:7;--pp-tb-z:7}
html:has(#pane-home){--pp-hd-z:19;--pp-tb-z:19}

/* room for the header and the tab bar on every scrolling page (the solar system is a fixed canvas and places itself) */
html body{padding-top:var(--pp-hd-h);padding-bottom:var(--pp-tb-h)}
html body.pp-sys{padding:0}

.pp-hd,.pp-hd *,.pp-nav,.pp-nav *,.pp-tb,.pp-tb *,.pp-hd-q,.pp-hd-q *{box-sizing:border-box}
.pp-hd [hidden],.pp-nav [hidden],.pp-nav[hidden],.pp-nav-scrim[hidden],.pp-hd-q[hidden]{display:none!important}
.pp-hd svg,.pp-nav svg,.pp-tb svg,.pp-hd-q svg{fill:none;stroke:currentColor;flex:0 0 auto}
.pp-hd{position:fixed;z-index:var(--pp-hd-z);left:0;right:0;top:0;height:var(--pp-hd-h);padding:var(--pp-sat) max(10px,env(safe-area-inset-right,0px)) 0 max(10px,env(safe-area-inset-left,0px));display:flex;align-items:center;justify-content:space-between;gap:8px;
  background:var(--pph-bg);border-bottom:1px solid var(--pph-line);color:var(--pph-ink);font-family:var(--pph-font);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
@media (max-width:820px),(pointer:coarse){.pp-hd{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--pph-solid)}}
.pp-hd-l,.pp-hd-r{display:flex;align-items:center;gap:8px;min-width:0;flex:0 0 auto}
.pp-hd-r{position:relative}
.pp-hd a,.pp-nav a,.pp-tb a{text-decoration:none;color:inherit}
:where(.pp-hd,.pp-nav,.pp-hd-q) button{font:600 13px/1 var(--pph-font);color:inherit;cursor:pointer;margin:0;letter-spacing:normal}

/* the square controls: menu, search */
.pp-hd-ic{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:40px;height:40px;padding:0;border:1px solid var(--pph-line);border-radius:12px;background:var(--pph-fill);color:var(--pph-ink)}
.pp-hd-ic svg{width:19px;height:19px}.pp-hd-ic>span{display:none}
.pp-hd-ic:hover{border-color:var(--pph-line2)}

/* the view switch: System | List. The one piece of the header with the instrument corner ticks. */
.pp-hd-seg{position:relative;display:flex;gap:2px;height:40px;padding:3px;border:1px solid var(--pph-line);border-radius:12px;background:var(--pph-fill)}
.pp-hd-seg::before,.pp-hd-seg::after{content:'';position:absolute;top:-1px;width:9px;height:9px;border-top:1.5px solid var(--pph-ice);opacity:.75;pointer-events:none}
.pp-hd-seg::before{left:-1px;border-left:1.5px solid var(--pph-ice);border-top-left-radius:12px}.pp-hd-seg::after{right:-1px;border-right:1.5px solid var(--pph-ice);border-top-right-radius:12px}
.pp-hd-v{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:40px;height:100%;padding:0 10px;border-radius:9px;color:var(--pph-dim);font:600 12.5px/1 var(--pph-font);letter-spacing:.04em;white-space:nowrap}
.pp-hd-v svg{width:18px;height:18px}
.pp-hd-v:hover{color:var(--pph-ink)}
.pp-hd-v.on{background:var(--pph-hot-bg);color:var(--pph-hot);box-shadow:inset 0 0 0 1px var(--pph-hot-line)}

.pp-hd-logo{display:inline-flex;align-items:center;gap:9px;flex:0 0 auto;height:40px;padding:0 2px}
.pp-hd-logo img{display:block;width:28px;height:28px}.pp-hd-logo .pp-hd-wm{width:auto;height:18px}
html[data-theme="light"] .pp-hd-logo .pp-hd-wm{filter:invert(1) hue-rotate(180deg)}

.pp-hd-launch{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:40px;min-width:40px;padding:0 14px 0 11px;border-radius:12px;background:var(--pph-grad);color:#190802;font:700 13px/1 var(--pph-font);letter-spacing:.03em;white-space:nowrap;box-shadow:0 5px 18px rgba(255,106,43,.28)}
.pp-hd-launch svg{width:17px;height:17px}.pp-hd-launch b{font-weight:700}.pp-hd-launch i{font-style:normal}
.pp-hd-launch:hover{filter:brightness(1.08)}
.pp-hd-conn,.pp-hd-acct{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:40px;padding:0 13px;border:1px solid var(--pph-line2);border-radius:12px;background:var(--pph-fill);color:var(--pph-ink);font:600 13px/1 var(--pph-font);letter-spacing:.03em;white-space:nowrap}
.pp-hd-conn:hover,.pp-hd-acct:hover{border-color:var(--pph-ice)}
.pp-hd-acct{font-variant-numeric:tabular-nums;letter-spacing:.01em;padding:0 11px 0 9px}
.pp-hd-acct i,.pp-nav-who i{width:9px;height:9px;border-radius:50%;background:#3ddc97;box-shadow:0 0 8px rgba(61,220,151,.7);flex:0 0 9px}
.pp-hd-conn.wide{width:100%}
.pp-hd :focus-visible,.pp-nav :focus-visible,.pp-tb :focus-visible,.pp-hd-q :focus-visible{outline:2px solid var(--pph-ice);outline-offset:2px}

/* the account menu */
.pp-hd-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:210px;padding:6px;border:1px solid var(--pph-line2);border-radius:14px;background:var(--pph-solid);box-shadow:0 18px 50px rgba(0,0,0,.5);display:grid;gap:2px}
.pp-hd-menu-h{padding:8px 10px 9px;font:500 11.5px/1.3 var(--pph-font);color:var(--pph-faint);border-bottom:1px solid var(--pph-line);margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;max-width:260px}
.pp-hd-menu a,.pp-hd-menu button{display:flex;align-items:center;gap:10px;width:100%;height:42px;padding:0 10px;border:0;border-radius:9px;background:none;font:600 13.5px/1 var(--pph-font);color:var(--pph-ink);text-align:left}
.pp-hd-menu svg{width:17px;height:17px;color:var(--pph-dim)}.pp-hd-menu a:hover,.pp-hd-menu button:hover{background:var(--pph-fill)}

/* the search sheet (pages with no search of their own) */
.pp-hd-q{position:fixed;z-index:calc(var(--pp-hd-z) + 1);left:0;right:0;top:0;height:var(--pp-hd-h);padding:var(--pp-sat) 10px 0;display:flex;align-items:center;gap:8px;background:var(--pph-solid);border-bottom:1px solid var(--pph-line2);color:var(--pph-ink);font-family:var(--pph-font)}
.pp-hd-q label{display:grid;place-items:center;width:34px;height:40px;color:var(--pph-dim)}.pp-hd-q label svg{width:18px;height:18px}
.pp-hd-q input{flex:1;min-width:0;height:40px;border:0;outline:0;background:none;color:var(--pph-ink);font:500 16px/1 var(--pph-font)}
.pp-hd-q input::placeholder{color:var(--pph-faint)}

/* the navigation drawer: the same on every page, at every width */
.pp-nav-scrim{position:fixed;inset:0;z-index:4990;background:rgba(2,3,8,.62)}
.pp-nav{position:fixed;z-index:5000;left:0;top:0;bottom:0;width:min(308px,86vw);display:flex;flex-direction:column;background:var(--pph-solid);border-right:1px solid var(--pph-line2);color:var(--pph-ink);font-family:var(--pph-font);box-shadow:24px 0 70px rgba(0,0,0,.55);padding-top:var(--pp-sat);animation:pp-nav-in .2s ease}
@keyframes pp-nav-in{from{transform:translateX(-18px);opacity:0}}
@media (prefers-reduced-motion:reduce){.pp-nav{animation:none}}
.pp-nav-h{display:flex;align-items:center;justify-content:space-between;height:var(--pp-hd-row);padding:0 10px 0 14px;border-bottom:1px solid var(--pph-line);flex:0 0 auto}
.pp-nav .pp-hd-logo .pp-hd-wm{display:block}
.pp-nav-b{flex:1 1 auto;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:1px;scrollbar-width:thin}
.pp-nav-b hr{width:auto;height:1px;border:0;background:var(--pph-line);margin:7px 8px}
.pp-nav-i{display:flex;align-items:center;gap:13px;width:100%;min-height:46px;padding:0 12px;border:0;border-radius:11px;background:none;font:600 14.5px/1.2 var(--pph-font);color:var(--pph-ink);text-align:left}
.pp-nav-i svg{width:19px;height:19px;color:var(--pph-dim)}
.pp-nav-i:hover{background:var(--pph-fill)}
.pp-nav-i.on{background:var(--pph-hot-bg);color:var(--pph-hot);box-shadow:inset 0 0 0 1px var(--pph-hot-line)}.pp-nav-i.on svg{color:inherit}
.pp-nav-f{flex:0 0 auto;padding:10px 12px calc(12px + var(--pp-sab));border-top:1px solid var(--pph-line);display:grid;gap:8px}
.pp-nav-who{display:flex;align-items:center;gap:9px;min-height:42px;font:600 13.5px/1 var(--pph-font);font-variant-numeric:tabular-nums}
.pp-nav-who span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.pp-nav-who button{height:36px;padding:0 12px;border:1px solid var(--pph-line2);border-radius:10px;background:none;font:600 12.5px/1 var(--pph-font)}
.pp-nav-v{margin:0;font:500 11px/1.4 var(--pph-font);color:var(--pph-faint)}
html.pp-nav-open,html.pp-nav-open body{overflow:hidden}

/* the phone tab bar: five places, the same five everywhere */
.pp-tb{display:none}
@media (max-width:820px){
  .pp-tb{position:fixed;z-index:var(--pp-tb-z);left:0;right:0;bottom:0;height:var(--pp-tb-h);padding:0 4px var(--pp-sab);display:grid;grid-template-columns:repeat(5,1fr);background:var(--pph-solid);border-top:1px solid var(--pph-line);color:var(--pph-dim);font-family:var(--pph-font);-webkit-tap-highlight-color:transparent}
  .pp-tb-i{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;font:600 10.5px/1 var(--pph-font);letter-spacing:.01em;white-space:nowrap}
  .pp-tb-i svg{width:21px;height:21px}
  .pp-tb-i span{max-width:100%;overflow:hidden;text-overflow:ellipsis}
  .pp-tb-i.on{color:var(--pph-hot)}
  .pp-tb-i.on::before{content:'';position:absolute;top:-1px;left:50%;width:26px;height:2px;margin-left:-13px;border-radius:2px;background:var(--pph-grad)}
  .pp-tb-i[data-pp-tab=launch] svg{color:#ff8a4d}
}

/* ── widths. The phone row: menu, the switch, the mark · search, Launch, Connect. Nothing wraps down to 360. ── */
@media (min-width:1024px){
  .pp-hd{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));gap:14px}
  .pp-hd-l,.pp-hd-r{gap:10px}
  .pp-hd-v{padding:0 13px}
  .pp-hd-ic#pp-hd-search{width:auto;padding:0 14px 0 11px;color:var(--pph-dim);font:600 13px/1 var(--pph-font)}.pp-hd-ic#pp-hd-search>span{display:inline}
}
@media (max-width:1023px){.pp-hd-launch i{display:none}}
@media (max-width:699px){.pp-hd-logo .pp-hd-wm{display:none}}
@media (max-width:519px){
  .pp-hd{gap:6px;padding-left:max(8px,env(safe-area-inset-left,0px));padding-right:max(8px,env(safe-area-inset-right,0px))}
  .pp-hd-l,.pp-hd-r{gap:6px}
  .pp-hd-v{padding:0;width:40px}.pp-hd-v span{display:none}
  .pp-hd-conn,.pp-hd-acct{padding:0 10px;font-size:12.5px}.pp-hd-acct{padding:0 9px 0 8px;gap:6px}
}
@media (max-width:479px){
  .pp-hd-launch{padding:0;width:40px}.pp-hd-launch span{display:none}.pp-hd-launch svg{width:20px;height:20px}
  .pp-hd-logo img{width:26px;height:26px}
}
@media (max-width:389px){
  .pp-hd,.pp-hd-l,.pp-hd-r{gap:4px}
  .pp-hd-seg{padding:2px;gap:0}.pp-hd-logo{padding:0}
  .pp-hd-acct i{display:none}.pp-hd-acct{padding:0 6px;font-size:12px;letter-spacing:0;max-width:88px}.pp-hd-acct span{min-width:0;overflow:hidden;text-overflow:ellipsis}.pp-hd-conn{padding:0 9px}
}

/* ── the pages' old chrome: one header, one drawer, one tab bar ── */
header.top,.topbar,.left-sidebar,.scrim,.mbottom,.fd-tabbar,#kb-launch-fab,.pp-doc-top,.pp-demo-float{display:none!important}
html:root{--side-w:0px;--sidebar-w:0px}
html:has(#view) body{padding-left:0}
.main-wrap{margin-left:auto!important;margin-right:auto!important}
/* what used to stick under the pages' own bars now sticks under the header */
.rail{top:calc(var(--pp-hd-h) + 16px)!important}.tside{top:calc(var(--pp-hd-h) + 14px)!important}
.mtabs,.tview .tmain-tabs .ttabs,.pf-head{top:var(--pp-hd-h)!important}
#view.tokenwide .thead2{top:calc(var(--pp-hd-h) + 8px)!important}
@media print{.pp-hd,.pp-nav,.pp-tb,.pp-hd-q,.pp-nav-scrim{display:none!important}html body{padding:0}}
/* the sign-in card opens under the header and above the tab bar, so the way back to the map is never covered */
#fd-gate{top:var(--pp-hd-h)!important;bottom:var(--pp-tb-h)!important}
/* the header looks the same on every page: page link styles (documents, the list view) never reach into it */
#pp-hd a,#pp-nav a,#pp-tb a,#pp-hd a:hover,#pp-nav a:hover,#pp-tb a:hover{text-decoration:none!important;border-bottom:0}
#pp-hd .pp-hd-v,#pp-tb .pp-tb-i{color:var(--pph-dim)}#pp-hd .pp-hd-v:hover{color:var(--pph-ink)}
#pp-hd .pp-hd-v.on,#pp-tb .pp-tb-i.on,#pp-nav .pp-nav-i.on{color:var(--pph-hot)}
#pp-hd .pp-hd-conn,#pp-nav .pp-hd-conn,#pp-nav .pp-nav-i,#pp-hd .pp-hd-menu a{color:var(--pph-ink)}
#pp-hd .pp-hd-launch{color:#190802}
#pp-hd button,#pp-nav button{text-transform:none;box-shadow:none}#pp-hd button{min-height:0}
#pp-hd .pp-hd-seg{box-shadow:none}
@media (max-width:389px){#pp-hd .pp-hd-acct{font-size:11px;letter-spacing:-.01em}}
@media (max-width:429px){#pp-hd .pp-hd-acct i{display:none}#pp-hd .pp-hd-acct{padding:0 8px;font-size:12px;letter-spacing:0;max-width:104px}#pp-hd .pp-hd-acct span{min-width:0;overflow:hidden;text-overflow:ellipsis}}
@media (max-width:389px){#pp-hd .pp-hd-acct{padding:0 6px;font-size:11px;letter-spacing:-.01em;max-width:88px}}
/* 0.1.0-dev.19: the switch says what its two glyphs are. From 390 px a small word sits under each; from 520 px beside it. The mark stands apart from the switch. */
@media (min-width:390px) and (max-width:519px){
  #pp-hd .pp-hd-v{flex-direction:column;gap:3px;width:auto;min-width:46px;padding:0 5px}
  #pp-hd .pp-hd-v span{display:block;font:600 9px/1 var(--pph-font);letter-spacing:.02em}
  #pp-hd .pp-hd-v svg{width:16px;height:16px}
  #pp-hd .pp-hd-logo{margin-left:3px}
}
@media (min-width:1024px){#pp-hd .pp-hd-logo{margin-left:6px}}

/* ── Connect (0.1.0-dev.20): no sign-in card. Our own UI is one line when something fails, and one small panel when
   this browser has no Phantom to open. ── */
.pp-hd-conn.busy{opacity:.78;pointer-events:none}
.pp-si-note{position:fixed;z-index:4200;left:50%;bottom:calc(var(--pp-tb-h) + 14px);transform:translate(-50%,12px);max-width:min(440px,calc(100vw - 24px));padding:12px 16px;border-radius:12px;background:#10141f;border:1px solid rgba(150,175,235,.3);color:#eef1f8;font:500 14px/1.4 'Chakra Petch',ui-sans-serif,system-ui,sans-serif;box-shadow:0 14px 40px rgba(0,0,0,.55);opacity:0;pointer-events:none;transition:opacity .16s,transform .16s}
.pp-si-note.on{opacity:1;transform:translate(-50%,0)}
.pp-si-pop{position:fixed;z-index:4300;right:max(10px,env(safe-area-inset-right,0px));top:calc(var(--pp-hd-h) + 8px);width:min(320px,calc(100vw - 20px));padding:16px 16px 14px;border-radius:16px;background:#0d111c;border:1px solid rgba(150,175,235,.28);color:#eef1f8;font:500 14px/1.45 'Chakra Petch',ui-sans-serif,system-ui,sans-serif;box-shadow:0 18px 50px rgba(0,0,0,.6)}
.pp-si-pop.sheet{left:0;right:0;top:auto;bottom:0;width:auto;border-radius:20px 20px 0 0;border-width:1px 0 0;padding:20px 18px calc(18px + var(--pp-sab))}
.pp-si-pop b{display:block;font:600 16px/1.25 'Unbounded',ui-sans-serif,system-ui,sans-serif;letter-spacing:-.01em;margin:0 34px 6px 0}
.pp-si-pop p{margin:0 0 14px;color:#98a1b8;font-size:13.5px}
.pp-si-pop .pp-si-b{display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;margin-top:8px;border-radius:12px;border:1px solid rgba(150,175,235,.3);background:transparent;color:#eef1f8;font:600 15px/1 'Chakra Petch',ui-sans-serif,system-ui,sans-serif;text-decoration:none;cursor:pointer}
.pp-si-pop .pp-si-b.pri{border:0;background:linear-gradient(100deg,#ffb02e,#ff6a2b 45%,#f0386b);color:#140a04}
.pp-si-pop .pp-si-x{position:absolute;right:6px;top:6px;width:44px;height:44px;border:0;background:none;color:#98a1b8;font-size:22px;line-height:1;cursor:pointer}
.pp-guest{max-width:520px;margin:8vh auto 0;padding:28px 20px;text-align:center}
.pp-guest h1{font:700 22px/1.2 'Unbounded',ui-sans-serif,system-ui,sans-serif;letter-spacing:-.02em;margin:0 0 10px}
.pp-guest p{margin:0 0 20px;color:var(--pp-dim,#98a1b8);font-size:15px;line-height:1.5}
.pp-guest-b{min-height:50px;padding:0 34px;border:0;border-radius:14px;background:linear-gradient(100deg,#ffb02e,#ff6a2b 45%,#f0386b);color:#140a04;font:700 16px/1 'Chakra Petch',ui-sans-serif,system-ui,sans-serif;cursor:pointer}
@media (prefers-reduced-motion:reduce){.pp-si-note{transition:none}}

/* Terms: one compact sheet after the first sign-in (header.js PP.terms). A bottom sheet on a phone, a small card on a desktop. */
.pp-tos{position:fixed;inset:0;z-index:4250;display:flex;align-items:flex-end;justify-content:center;background:rgba(3,4,9,.62)}
.pp-tos-card{box-sizing:border-box;width:100%;max-width:460px;padding:18px 18px calc(12px + var(--pp-sab));border-radius:20px 20px 0 0;background:#0d111c;border:1px solid rgba(150,175,235,.28);border-bottom:0;color:#eef1f8;font:500 14px/1.45 'Chakra Petch',ui-sans-serif,system-ui,sans-serif;box-shadow:0 -14px 50px rgba(0,0,0,.55)}
.pp-tos-card b{display:block;margin:0 0 6px;font:600 16px/1.25 'Unbounded',ui-sans-serif,system-ui,sans-serif;letter-spacing:-.01em}
.pp-tos-card p{margin:0 0 14px;color:#98a1b8;font-size:13.5px;line-height:1.45}.pp-tos-card a{color:#eef1f8;text-decoration:underline}
#pp-tos-ok{display:block;width:100%;min-height:50px;margin:0;padding:0 14px;border:0;border-radius:13px;background:linear-gradient(100deg,#ffb02e,#ff6a2b 45%,#f0386b);color:#140a04;font:700 15.5px/1 'Chakra Petch',ui-sans-serif,system-ui,sans-serif;letter-spacing:.01em;cursor:pointer}
#pp-tos-ok[aria-busy=true]{opacity:.6}
#pp-tos-out{display:block;width:100%;min-height:44px;margin:4px 0 0;padding:0;border:0;background:none;color:#98a1b8;font:600 13.5px/1 'Chakra Petch',ui-sans-serif,system-ui,sans-serif;text-decoration:underline;cursor:pointer}
#pp-tos-ok:focus-visible,#pp-tos-out:focus-visible{outline:2px solid #8fe6ff;outline-offset:2px}
@media (min-width:821px){.pp-tos{align-items:center}.pp-tos-card{border-bottom:1px solid rgba(150,175,235,.28);border-radius:18px;padding-bottom:12px}}