/* Family Business Hub. The portal's design tokens, so the hub feels familiar.
   Poppins headings, Inter body, blue #1273c2, page #f1f5f9, white cards with 12px corners.
   Fonts are served from this app's own folder. There is no outside font or icon call. */

@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/inter-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/inter-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+2020,U+20A0-20AB,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/inter-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/inter-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+FEFF,U+FFFD;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/poppins-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+FEFF,U+FFFD;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/poppins-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+FEFF,U+FFFD;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:800;font-display:swap;src:url('/fonts/poppins-800-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+FEFF,U+FFFD;}

:root{
  --blue:#1273c2;
  --navy:#05052e;
  --navy-indigo:#080a7d;
  --page:#f1f5f9;
  --ink:#1e293b;
  --ink-soft:#64748b;
  --line:#e2e8f0;
  --teal:#0D9488;
  --amber:#F59E0B;
  --red:#EF4444;
  --green:#10B981;
  --radius:12px;
  --font-head:'Poppins',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--font-body);background:var(--page);color:var(--ink);min-height:100vh;
     -webkit-text-size-adjust:100%}
h1,h2,h3,h4{font-family:var(--font-head);line-height:1.25}
a{color:var(--blue)}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}

/* ── Top bar ── */
.topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:1rem;
  height:60px;padding:0 1rem;background:linear-gradient(135deg,#05052e,#05063f);
  box-shadow:0 2px 12px rgba(0,0,0,.35)}
.topbar__brand{font-family:var(--font-head);font-weight:800;color:#fff;font-size:1.05rem;flex:1}
.topbar__brand span{color:#7fb2e2}
.topbar__user{display:flex;align-items:center;gap:.6rem}
.topbar__avatar{width:34px;height:34px;border-radius:50%;background:var(--blue);color:#fff;
  font-weight:700;font-size:.78rem;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.topbar__name{font-size:.85rem;color:rgba(255,255,255,.9);font-weight:600;line-height:1.1}
.topbar__role{font-size:.7rem;color:rgba(255,255,255,.45)}
.topbar__out{margin:0}

/* ── Layout ── */
.wrap{max-width:1100px;margin:0 auto;padding:1.25rem 1rem 4rem}
.section{margin-bottom:2rem}
.section__head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:.75rem;flex-wrap:wrap}
.section__head h2{font-size:1.15rem;font-weight:700;color:var(--navy)}
.section__count{font-size:.8rem;color:var(--ink-soft)}

.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1rem}
.card + .card{margin-top:.75rem}

/* ── Goals strip ── */
.goals{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.goal{background:#fff;border:1px solid var(--line);border-left:4px solid var(--blue);
  border-radius:var(--radius);padding:.9rem;text-align:left;width:100%;cursor:pointer;font:inherit;
  /* The whole card is one link, so the text inside must not read as underlined link text. */
  color:inherit;text-decoration:none;display:block}
.goal:hover .goal__name{color:var(--blue)}
.goal:hover{box-shadow:0 2px 10px rgba(5,5,46,.08)}
.goal__name{font-family:var(--font-head);font-weight:700;font-size:.92rem;margin-bottom:.5rem}
.goal__label{font-size:.68rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);font-weight:600;margin-top:.5rem}
.goal__val{font-size:.85rem;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.goal__val--empty{color:var(--ink-soft);font-style:italic}
.goal__status{display:inline-block;margin-top:.6rem;font-size:.74rem;font-weight:600;
  background:#eef5fc;color:var(--blue);border-radius:999px;padding:.2rem .6rem}

/* ── Chips and badges ── */
.chip{display:inline-flex;align-items:center;gap:.3rem;font-size:.72rem;font-weight:600;
  border-radius:999px;padding:.18rem .55rem;white-space:nowrap}
.chip--biz{color:#fff}
.chip--update{background:#eef5fc;color:var(--blue)}
.chip--help{background:#fef3e2;color:#B45309}
.chip--offer{background:#e6f7f3;color:#0F766E}
.chip--project{background:#f1ebfd;color:#6D28D9}
.chip--done{background:#e9f8f0;color:#047857}
.chip--brain{background:#f1f5f9;color:var(--ink-soft)}

/* ── Message board ── */
.msg{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:.9rem;margin-bottom:.7rem}
.msg--done{opacity:.72}
.msg__top{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;margin-bottom:.5rem}
.msg__route{font-size:.78rem;color:var(--ink-soft);font-weight:600}
.msg__text{font-size:.92rem;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.msg__foot{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-top:.6rem;
  font-size:.75rem;color:var(--ink-soft)}
.msg__tag{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.72rem;
  background:#f1f5f9;border-radius:4px;padding:.1rem .35rem;color:#475569}

/* ── Projects ── */
.proj__top{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.proj__title{font-family:var(--font-head);font-weight:700;font-size:1rem}
.proj__meta{font-size:.78rem;color:var(--ink-soft);margin-top:.2rem}
.proj__bar{height:6px;background:var(--line);border-radius:999px;margin:.7rem 0 .5rem;overflow:hidden}
.proj__bar i{display:block;height:100%;background:var(--green);border-radius:999px}
.steps{list-style:none;margin:.4rem 0 0}
.steps li{display:flex;align-items:flex-start;gap:.5rem;padding:.3rem 0;font-size:.88rem}
.steps li.is-done{color:var(--ink-soft);text-decoration:line-through}
.steps button{flex:0 0 auto;width:20px;height:20px;border-radius:5px;border:2px solid var(--line);
  background:#fff;cursor:pointer;line-height:1;font-size:.8rem;color:#fff;padding:0}
.steps li.is-done button{background:var(--green);border-color:var(--green)}
.updates{list-style:none;margin:.6rem 0 0;border-top:1px dashed var(--line);padding-top:.5rem}
.updates li{font-size:.82rem;line-height:1.45;padding:.25rem 0;overflow-wrap:anywhere}
.updates time{color:var(--ink-soft);font-size:.74rem}

/* ── Calendar ── */
.cal{list-style:none}
.cal li{display:flex;align-items:flex-start;gap:.7rem;background:#fff;border:1px solid var(--line);
  border-left:4px solid var(--blue);border-radius:var(--radius);padding:.7rem .9rem;margin-bottom:.55rem}
.cal__when{flex:0 0 8.5rem;font-weight:600;font-size:.85rem}
.cal__time{display:block;font-weight:400;color:var(--ink-soft);font-size:.78rem}
.cal__what{font-size:.9rem;overflow-wrap:anywhere}
.cal__who{font-size:.74rem;color:var(--ink-soft);margin-top:.15rem}

/* ── Forms ── */
.form{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1rem;margin-top:.9rem}
.form h3{font-size:.95rem;font-weight:700;margin-bottom:.1rem}
.row{display:grid;gap:.7rem;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-top:.7rem}
label{display:block;font-size:.76rem;font-weight:600;color:var(--ink-soft);margin-bottom:.25rem}
input[type=text],input[type=email],input[type=password],input[type=date],select,textarea{
  width:100%;font:inherit;font-size:.9rem;padding:.55rem .65rem;border:1px solid var(--line);
  border-radius:8px;background:#fff;color:var(--ink)}
textarea{min-height:5.5rem;resize:vertical;line-height:1.5}
input:focus,select:focus,textarea:focus{border-color:var(--blue);outline:none;box-shadow:0 0 0 3px rgba(18,115,194,.15)}
.check{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:var(--ink);font-weight:500;margin-top:.7rem}
.check input{width:18px;height:18px;accent-color:var(--blue)}

.btn{font:inherit;font-weight:600;font-size:.88rem;border:none;border-radius:8px;
  padding:.6rem 1.1rem;background:var(--blue);color:#fff;cursor:pointer}
.btn:hover{background:#0f63a8}
.btn:disabled{opacity:.6;cursor:progress}
.btn--small{font-size:.78rem;padding:.35rem .7rem}
.btn--ghost{background:#fff;color:var(--blue);border:1px solid var(--line)}
.btn--ghost:hover{background:#f8fafc}
.btn--quiet{background:rgba(255,255,255,.12);color:rgba(255,255,255,.9);
  border:1px solid rgba(255,255,255,.18);font-size:.78rem;padding:.35rem .8rem}
.btn--quiet:hover{background:rgba(255,255,255,.22)}
.btn-row{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.85rem;align-items:center}

/* ── The privacy reminder. Sits above every box a person can type into. ── */
.reminder{font-size:.78rem;font-weight:600;color:#92400e;background:#fffbeb;
  border:1px solid #fde68a;border-radius:8px;padding:.5rem .7rem;margin-top:.1rem}

/* ── Notices. A failure never looks like a success. ── */
.notice{font-size:.85rem;border-radius:8px;padding:.6rem .8rem;margin:.75rem 0;font-weight:500;line-height:1.45}
.notice--bad{background:#fef2f2;border:1px solid #fecaca;color:#991b1b}
.notice--good{background:#ecfdf5;border:1px solid #a7f3d0;color:#065f46}
.notice--plain{background:#f8fafc;border:1px solid var(--line);color:var(--ink-soft)}
.empty{font-size:.88rem;color:var(--ink-soft);background:#fff;border:1px dashed var(--line);
  border-radius:var(--radius);padding:1.1rem;text-align:center}
.shortened{font-size:.78rem;color:var(--ink-soft);margin:.4rem 0 .8rem}

/* ── Filter bar ── */
.filter{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-bottom:.9rem}
.filter label{margin:0}
.filter select{width:auto;min-width:11rem}

/* ── Login and consent ── */
.auth{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.25rem}
.auth__card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:1.6rem;width:100%;max-width:25rem;box-shadow:0 8px 30px rgba(5,5,46,.08)}
.auth__brand{font-family:var(--font-head);font-weight:800;color:var(--navy);font-size:1.2rem}
.auth__brand span{color:var(--blue)}
.auth__tag{font-size:.82rem;color:var(--ink-soft);margin:.25rem 0 1.1rem}
.auth__card .row{grid-template-columns:1fr}
.auth__alt{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line);font-size:.82rem}
.consent__what{list-style:none;margin:.8rem 0}
.consent__what li{font-size:.86rem;padding:.3rem 0 .3rem 1.1rem;position:relative;line-height:1.45}
.consent__what li::before{content:'';position:absolute;left:0;top:.62rem;width:6px;height:6px;
  border-radius:50%;background:var(--blue)}
.consent__where{font-size:.82rem;background:#f8fafc;border:1px solid var(--line);
  border-radius:8px;padding:.6rem .75rem;margin:.6rem 0;overflow-wrap:anywhere}
.consent__where b{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}

/* ── Connector help page ── */
.doc{max-width:46rem}
.doc h2{margin:1.4rem 0 .5rem;font-size:1.05rem}
.doc p,.doc li{font-size:.9rem;line-height:1.6}
.doc ol,.doc ul{margin:.5rem 0 .5rem 1.3rem}
.doc code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem;
  background:#f1f5f9;border-radius:4px;padding:.1rem .35rem;overflow-wrap:anywhere}
.doc table{width:100%;border-collapse:collapse;margin:.7rem 0;font-size:.84rem}
.doc th,.doc td{text-align:left;padding:.45rem .5rem;border-bottom:1px solid var(--line);vertical-align:top}
.doc th{font-weight:700;color:var(--navy)}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ── Phone ── */
@media (max-width:640px){
  .wrap{padding:1rem .75rem 3.5rem}
  .topbar{padding:0 .75rem;gap:.6rem}
  .topbar__who{display:none}
  .goals{grid-template-columns:1fr}
  .cal li{flex-direction:column;gap:.2rem}
  .cal__when{flex:none}
  .row{grid-template-columns:1fr}
  .section__head h2{font-size:1.05rem}
  .btn{width:100%;text-align:center}
  .btn--small,.btn-row .btn{width:auto}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ── Business colors as real classes ──
   These are classes and not inline styles on purpose. The hub's content security
   policy forbids inline style attributes, so a colour written into the markup would
   be dropped by the browser and the chips would come out invisible. That happened
   once during the build and it is the reason this block exists. */
.chip--biz-mirrah{background:#1273c2}
.bar--mirrah{border-left-color:#1273c2}
.chip--biz-ibl{background:#0D9488}
.bar--ibl{border-left-color:#0D9488}
.chip--biz-redefine{background:#7C3AED}
.bar--redefine{border-left-color:#7C3AED}
.chip--biz-sote{background:#C2410C}
.bar--sote{border-left-color:#C2410C}
.chip--biz-giggles{background:#DB2777}
.bar--giggles{border-left-color:#DB2777}
.chip--biz-salt-holdings{background:#080a7d}
.bar--salt-holdings{border-left-color:#080a7d}
.chip--biz-salt-ventures{background:#0369A1}
.bar--salt-ventures{border-left-color:#0369A1}
.chip--biz-trust{background:#475569}
.bar--trust{border-left-color:#475569}
.chip--biz-all{background:#1273c2}
.bar--all{border-left-color:#1273c2}

/* Progress bar widths, rounded to the nearest five, for the same reason. */
.w-0{width:0%}
.w-5{width:5%}
.w-10{width:10%}
.w-15{width:15%}
.w-20{width:20%}
.w-25{width:25%}
.w-30{width:30%}
.w-35{width:35%}
.w-40{width:40%}
.w-45{width:45%}
.w-50{width:50%}
.w-55{width:55%}
.w-60{width:60%}
.w-65{width:65%}
.w-70{width:70%}
.w-75{width:75%}
.w-80{width:80%}
.w-85{width:85%}
.w-90{width:90%}
.w-95{width:95%}
.w-100{width:100%}

/* Small layout helpers, so no element needs an inline style. */
.inline-form{display:inline}
.mt-sm{margin-top:.8rem}
.muted{color:var(--ink-soft)}
.page-title{font-size:1.3rem}
.goal--edit{border-left:4px solid var(--blue)}