/* Path OS — shared chrome for public pages (landing, legal, help, 404).
   Header, footer and layout only. All colours / fonts / radii come from theme.css. */

html{scroll-behavior:smooth}
body[data-public]{background:var(--surface);overflow-x:hidden}
html:not([data-theme="dark"]) body[data-public]{background:var(--bg)}
html:not([data-theme="dark"]) .pub-h{background:var(--surface)}
/* theme.js adds a floating theme button; it belongs to the app, not the public site */
body[data-public] .thm-btn,body[data-public] .thm-panel{display:none!important}

.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.skip{position:absolute;left:12px;top:-60px;z-index:100;padding:8px 12px;border-radius:var(--r);background:var(--brand);color:var(--on-brand);font-weight:600}
.skip:focus{top:10px;color:var(--on-brand)}

/* ===== Header ===== */
.pub-h{position:sticky;top:0;z-index:50;height:var(--hh);background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.pub-h .wrap{height:100%;display:flex;align-items:center;gap:24px}
.pub-brand{display:flex;align-items:center;flex-shrink:0}
.pub-brand-name{gap:10px;font-size:19px;font-weight:600;letter-spacing:-.02em;color:var(--ink)}
.pub-brand-name:hover{text-decoration:none;color:var(--ink)}
.pub-nav{display:flex;align-items:center;gap:4px}
.pub-nav a{padding:8px 10px;border-radius:var(--r);font-size:13.5px;font-weight:500;color:var(--muted);white-space:nowrap}
.pub-nav a:hover{color:var(--ink);text-decoration:none;background:var(--bg-soft)}
.pub-nav a[aria-current="page"]{color:var(--brand);font-weight:600}
.pub-act{margin-left:auto;display:flex;align-items:center;gap:8px}
.pub-act .btn-ghost{color:var(--ink-2)}
.pub-act .btn-primary{background:var(--lime);border-color:var(--lime);color:var(--on-lime)}
.pub-act .btn-primary:hover{background:var(--lime-700);border-color:var(--lime-700);color:var(--on-lime)}

/* Signed-in / signed-out swaps (public.js sets body[data-auth]) */
body:not([data-auth="in"]) [data-auth-show="in"]{display:none!important}
body[data-auth="in"] [data-auth-show="out"]{display:none!important}
/* while public.js checks the session: keep the space but show neither set, so signed-in visitors never see "Sign up" flash */
body[data-auth="pending"] [data-auth-show]{visibility:hidden}

/* ===== Footer ===== */
.pub-f{border-top:1px solid var(--line);background:var(--bg);margin-top:72px}
.pub-f .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:28px;padding-bottom:28px}
.pub-f-l{display:flex;align-items:center;gap:14px;font-size:12.5px;color:var(--muted)}
.pub-f-l .p28-mark{width:32px;height:32px;border-radius:11px}
.pub-f nav{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.pub-f nav a{font-size:13px;color:var(--muted);padding:4px 6px;border-radius:6px}
.pub-f nav a:hover{color:var(--brand)}
.pub-f nav i{width:3px;height:3px;border-radius:999px;background:var(--muted-2)}

/* ===== Draft / placeholder markers ===== */
.todo{display:inline-block;padding:0 5px;border-radius:4px;background:var(--warn-tint);color:var(--warn-ink);border:1px dashed var(--warn-bar);font-weight:700;font-size:.92em;overflow-wrap:anywhere}

@media (max-width:760px){
  .wrap{padding:0 16px}
  .pub-h .wrap{gap:12px}
  .pub-nav{display:none}
  .pub-f .wrap{flex-direction:column;align-items:flex-start}
}
@media (max-width:400px){
  .pub-act .btn-ghost{display:none}
}

/* BILLING_ENABLED=false: hide pricing and anything that starts a purchase */
body[data-billing="off"] [data-billing-only]{display:none!important}