/* Side menu + login/settings/users pages. Uses Parker's tokens from a/sb.css only. */

/* Parker's tab row is replaced by the side menu. */
.top .nav{display:none}

/* ---------- burger ---------- */
.mf-burger{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;flex:none;padding:0;cursor:pointer;
  background:rgba(230,235,240,.04);border:1px solid var(--line-2);border-radius:12px;color:var(--fg-2);transition:color .2s,background .2s}
.mf-burger:hover{color:var(--fg);background:rgba(230,235,240,.08)}
.mf-burger svg{width:20px;height:20px}
html.mf-docked .mf-burger{display:none}

/* ---------- drawer ---------- */
.mf-side{position:fixed;top:0;left:0;bottom:0;width:248px;max-width:84vw;box-sizing:border-box;z-index:460;
  display:flex;flex-direction:column;padding:16px 12px;overflow-y:auto;-webkit-overflow-scrolling:touch;
  background:var(--bg-2);border-right:1px solid var(--line-2);font-family:var(--font);
  transform:translateX(-100%);transition:transform .24s var(--ease)}
.mf-side.open{transform:none}
.mf-mark{display:flex;align-items:center;gap:8px;padding:6px 6px 14px;margin-bottom:6px;border-bottom:1px solid var(--line)}
.mf-brand{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;color:var(--fg)}
.mf-brand .w{font-variation-settings:'wdth' 125;font-weight:800;font-size:14.5px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.mf-brand .w span{font-weight:500;color:var(--fg-2)}
.mf-brand .a{font-variation-settings:'wdth' 125;font-weight:800;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--acc)}
.mf-pin{flex:none;width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;padding:0;cursor:pointer;
  background:none;border:1px solid transparent;border-radius:9px;color:var(--muted)}
.mf-pin:hover{color:var(--fg);border-color:var(--line-2)}
.mf-pin.on{color:var(--acc);border-color:rgba(23,169,138,.45);background:rgba(23,169,138,.1)}
.mf-pin svg{width:17px;height:17px}

.mf-cat{display:flex;align-items:center;justify-content:space-between;margin:12px 6px 4px;padding:4px 6px;cursor:pointer;user-select:none;border-radius:8px;
  font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.mf-cat:hover{color:var(--fg-2)}
.mf-caret{width:14px;height:14px;transition:transform .18s}
.mf-cat[aria-expanded="true"] .mf-caret{transform:rotate(180deg)}
.mf-sub{display:flex;flex-direction:column;gap:2px}
.mf-sub.closed{display:none}

.mf-link{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:11px;font-size:14px;font-weight:600;color:var(--fg-2);
  transition:color .15s,background .15s}
.mf-link:hover{color:var(--fg);background:rgba(230,235,240,.05)}
.mf-link.on{color:var(--fg);background:rgba(23,169,138,.14);box-shadow:inset 2px 0 0 var(--acc)}
.mf-link.on .mf-i{color:var(--acc)}
.mf-i{width:18px;height:18px;flex:none;color:var(--muted)}
.mf-link span{flex:1}
.mf-draft{font-style:normal;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--warn);
  border:1px solid rgba(247,197,72,.4);border-radius:999px;padding:1px 7px}

.mf-foot{margin-top:auto;padding-top:12px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.mf-who{display:flex;flex-direction:column;padding:10px 11px 2px;font-size:13px;color:var(--fg-2)}
.mf-who b{color:var(--fg);font-weight:700}
.mf-who span{color:var(--muted);font-size:12px}
.mf-sas{padding:6px 11px 2px;font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--subtle)}

.mf-scrim{position:fixed;inset:0;z-index:450;background:rgba(5,7,10,.55);opacity:0;pointer-events:none;transition:opacity .22s}
.mf-scrim.show{opacity:1;pointer-events:auto}
@media(min-width:1000px){body{transition:padding-left .24s var(--ease)}html.mf-docked body{padding-left:248px}}
@media(max-width:999px){.mf-pin{display:none}}

/* ---------- our own pages (sign in, settings, users) ---------- */
.mf-main{max-width:1100px;margin:0 auto;padding:40px var(--pad) 80px}
body.mf-app:not(:has(.top)) .mf-main{min-height:100vh;display:flex;align-items:center;justify-content:center;padding-top:24px}
.mf-card{background:var(--card);border:1px solid var(--line-2);border-radius:var(--r);padding:28px;margin-bottom:20px}
.mf-narrow{width:100%;max-width:440px;margin-left:auto;margin-right:auto}
.mf-wide h1,.mf-card h1{font-variation-settings:'wdth' 112;font-weight:800;font-size:26px;letter-spacing:-.01em;margin:0 0 10px;color:var(--fg)}
.mf-card h2{font-weight:800;font-size:17px;margin:0 0 14px;color:var(--fg)}
.mf-lock{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.mf-word{font-variation-settings:'wdth' 125;font-weight:800;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--fg)}
.mf-word span{font-weight:500;color:var(--fg-2)}
.mf-sub{font-size:11px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--acc);margin-top:3px}
.mf-muted{color:var(--muted);font-size:13.5px;line-height:1.5;margin:0 0 14px}
.mf-note{font-size:12px;margin:18px 0 0;line-height:1.5;color:var(--subtle)}
.mf-err{color:var(--bad);background:var(--bad-bg);border-radius:var(--r-sm);padding:10px 14px;font-size:14px;margin:0 0 14px}
.mf-ok{color:var(--good);background:var(--good-bg);border-radius:var(--r-sm);padding:10px 14px;font-size:14px;margin:0 0 14px}
.mf-card form label,.mf-add label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:var(--fg-2);margin-bottom:14px}
.mf-card input[type=email],.mf-card input[type=password],.mf-card input:not([type]),.mf-card select{
  font:inherit;font-size:15px;color:var(--fg);background:var(--bg);border:1px solid var(--line-2);border-radius:12px;padding:11px 13px;outline:none}
.mf-card input:focus,.mf-card select:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(23,169,138,.2)}
.mf-btn{display:inline-flex;align-items:center;justify-content:center;font:inherit;font-weight:700;font-size:14.5px;cursor:pointer;
  color:#0E1116;background:var(--acc);border:1px solid var(--acc);border-radius:12px;padding:11px 18px;transition:filter .15s}
.mf-btn:hover{filter:brightness(1.08)}
.mf-card form>.mf-btn{width:100%}
.mf-btn.ghost{color:var(--fg-2);background:transparent;border-color:var(--line-2)}
.mf-btn.ghost:hover{color:var(--fg);background:rgba(230,235,240,.05)}
.mf-btn.small{font-size:12.5px;padding:7px 12px;border-radius:10px;width:auto}
.mf-inline{margin-top:12px}
.mf-inline .mf-btn{width:100%}
.mf-tablewrap{overflow-x:auto}
.mf-table{width:100%;border-collapse:collapse;font-size:14px}
.mf-table th{text-align:left;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:8px 10px;border-bottom:1px solid var(--line-2)}
.mf-table td{padding:14px 10px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--fg-2)}
.mf-table td b{color:var(--fg)}
.mf-table tr.off td{opacity:.55}
.mf-table .mf-muted{margin:2px 0 0;font-size:12.5px}
.mf-uform{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.mf-uform select{padding:7px 10px;font-size:14px}
.mf-acts{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.mf-pages{display:flex;flex-wrap:wrap;gap:6px 14px;margin:2px 0 6px}
.mf-chk{display:inline-flex !important;flex-direction:row !important;align-items:center;gap:6px !important;margin:0 !important;font-weight:500 !important;font-size:13px !important;color:var(--fg-2)}
.mf-chk input{accent-color:var(--acc);width:15px;height:15px}
.mf-add{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 14px}
.mf-add .mf-pages,.mf-add .mf-btn{grid-column:1/-1}
.mf-add .mf-btn{justify-self:start;width:auto}
.mf-temp{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;background:var(--warn-bg);border:1px solid rgba(247,197,72,.35);
  border-radius:var(--r-sm);padding:14px 16px;margin:0 0 20px;color:var(--fg);font-size:14px}
.mf-temp code{font-size:18px;font-weight:700;letter-spacing:.06em;color:var(--warn);background:var(--bg);padding:6px 12px;border-radius:10px;user-select:all}
.mf-pill{font-size:12px;font-weight:700;border-radius:999px;padding:3px 10px}
.mf-pill.live{color:var(--good);background:var(--good-bg)}
.mf-pill.draft{color:var(--warn);background:var(--warn-bg)}
@media(max-width:720px){.mf-add{grid-template-columns:1fr}.mf-card{padding:20px}}

/* fixes after first look */
.mf-side .mf-link,.mf-side .mf-link span{text-transform:none;letter-spacing:0;font-variation-settings:normal;font-size:14px}
.mf-uform .mf-btn,.mf-acts .mf-btn{width:auto}
.mf-uform:not(:has(option[value="team"]:checked)) .mf-pages,
.mf-add:not(:has(option[value="team"]:checked)) .mf-pages{display:none}
.mf-card .mf-uform>.mf-btn,.mf-card .mf-add>.mf-btn{width:auto}
.mf-uform:has(input[name="role"][type="hidden"]) .mf-btn{display:none}