/* Bilby Bunch — app.css (logged-in app shell + components, from the design
   handoff). Class-based only; layers alongside styles.css without collision.
   Token header so it resolves standalone. */
:root{
  --euc-900:#16332c; --euc-800:#1c3f37; --euc-700:#235247; --euc-600:#2e6e5e;
  --euc-500:#3a8473; --euc-300:#9cc8bc; --euc-100:#dbeee7; --euc-50:#eef7f3;
  --ochre-700:#a86c22; --ochre-600:#c4862f; --ochre-500:#e3a24a; --ochre-300:#f0c684;
  --ochre-100:#f9ead0; --ochre-50:#fcf4e4;
  --clay-600:#b85c39; --clay-500:#c96f4c; --clay-100:#f4ddd2;
  --blue-700:#5d6b7d; --blue-500:#8b97a6; --blue-100:#dfe4ea;
  --ink:#21332e; --ink-soft:#4f5e58; --ink-faint:#7b877f;
  --paper:#faf7f1; --paper-2:#f4efe4; --sand:#f2ead9; --card:#ffffff; --card-2:#fdfbf6;
  --border:#e7e2d5; --border-strong:#d8d2c2;
  --font-display:"Bricolage Grotesque", ui-rounded, system-ui, sans-serif;
  --font-body:"Hanken Grotesk", system-ui, -apple-system, sans-serif;
  --r-xs:8px; --r-sm:12px; --r-md:18px; --r-lg:26px; --r-xl:36px; --r-pill:999px;
  --sh-sm:0 1px 2px rgba(33,51,46,.06), 0 2px 6px rgba(33,51,46,.05);
  --sh-md:0 4px 10px rgba(33,51,46,.07), 0 14px 30px rgba(33,51,46,.08);
  --sh-lg:0 10px 24px rgba(33,51,46,.10), 0 30px 60px rgba(33,51,46,.10);
  --sh-euc:0 14px 34px rgba(46,110,94,.22);
}
/* ============================================================
   Bilby Bunch — app.css  (logged-in product, faithful to live app)
   Top-nav + centered column of cards. Pairs with brand.css tokens.
   ============================================================ */

.app{min-height:100vh;display:flex;flex-direction:column;background:var(--paper);}

/* ---------- Top nav ---------- */
.anav{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--border);}
.anav-in{max-width:1180px;margin-inline:auto;display:flex;align-items:center;justify-content:space-between;
  gap:20px;padding:14px 32px;}
.anav .logo .word{font-size:1.3rem;}
.anav-links{display:flex;align-items:center;gap:26px;}
.anav-links a{font-weight:600;font-size:1rem;color:var(--ink-soft);cursor:pointer;white-space:nowrap;transition:color .14s;}
.anav-links a:hover{color:var(--euc-700);}
.anav-links a.on{color:var(--euc-600);font-weight:700;}
.anav-admin{position:relative;}
.anav-admin>a{display:inline-flex;align-items:center;gap:5px;}
.anav-menu{position:absolute;right:0;top:calc(100% + 12px);background:#fff;border:1px solid var(--border);
  border-radius:var(--r-md);box-shadow:var(--sh-lg);padding:10px;min-width:200px;display:none;flex-direction:column;gap:2px;z-index:60;}
.anav-admin.open .anav-menu{display:flex;}
.anav-menu a{padding:11px 14px;border-radius:10px;font-size:1rem;color:var(--ink);font-weight:600;}
.anav-menu a:hover{background:var(--euc-50);color:var(--euc-700);}
.anav-burger{display:none;background:none;border:0;cursor:pointer;color:var(--ink);padding:6px;}
@media(max-width:880px){
  .anav-links{display:none;position:absolute;top:64px;left:0;right:0;flex-direction:column;align-items:stretch;
    background:#fff;border-bottom:1px solid var(--border);padding:14px 32px 22px;gap:14px;}
  .app.menu-open .anav-links{display:flex;}
  .app.menu-open .anav-menu{position:static;display:flex;box-shadow:none;border:0;padding:0 0 0 12px;}
  .anav-burger{display:block;}
}

/* ---------- Page column ---------- */
.app-main{flex:1;width:100%;max-width:1100px;margin-inline:auto;padding:36px 32px 72px;}
@media(max-width:760px){.app-main{padding:24px 18px 56px;}.anav-in{padding:12px 18px;}}

.view{display:none;}
.view.on{display:block;animation:fade .22s ease;}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.page-title{font-size:clamp(2.1rem,4vw,2.9rem);font-family:var(--font-display);font-weight:800;letter-spacing:-.02em;margin-bottom:8px;}
.page-sub{color:var(--ink-soft);font-size:1.02rem;margin-bottom:26px;max-width:760px;}
.welcome{color:var(--ink-soft);font-size:1.05rem;margin-bottom:26px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}

/* ---------- Panel (the white card) ---------- */
.panel{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--sh-sm);
  padding:30px 32px;margin-bottom:22px;}
.panel.soft{border-radius:var(--r-xl);}
.panel h2{font-size:1.5rem;font-family:var(--font-display);font-weight:700;letter-spacing:-.01em;margin-bottom:18px;}
.panel h2.tight{margin-bottom:10px;}
.panel-note{color:var(--ink-soft);font-size:.98rem;margin-bottom:20px;}
.panel-outline{border:2px solid var(--euc-700);box-shadow:none;border-radius:var(--r-xl);}
@media(max-width:760px){.panel{padding:22px 20px;}}

/* ---------- Buttons (app = rounded-rect, faithful to live app) ---------- */
.abtn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--font-body);
  font-weight:700;font-size:1rem;padding:.7em 1.25em;border-radius:11px;border:1.5px solid transparent;cursor:pointer;
  transition:background .15s,border-color .15s,transform .12s;line-height:1.1;white-space:nowrap;text-align:center;}
.abtn:active{transform:translateY(1px);}
.abtn-primary{background:var(--euc-700);color:#fff;}
.abtn-primary:hover{background:var(--euc-800);}
.abtn-outline{background:#fff;color:var(--ink);border-color:var(--border-strong);}
.abtn-outline:hover{border-color:var(--euc-600);color:var(--euc-700);background:var(--euc-50);}
.abtn-sm{padding:.55em .95em;font-size:.9rem;border-radius:9px;}

/* ---------- Tag pills ---------- */
.tag{display:inline-flex;align-items:center;font-size:.8rem;font-weight:700;padding:.3em .8em;border-radius:var(--r-pill);
  white-space:nowrap;line-height:1.4;}
.tag-grey{background:#eceae2;color:#6f6a5d;}
.tag-green{background:#d8ece0;color:#2c6a5b;}
.tag-amber{background:#f8e7c6;color:#996b1c;}
.tag-lav{background:#e7e5f4;color:#665ba8;}

/* ---------- Home: "things that need you" rows ---------- */
.need{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 0;border-top:1px solid var(--border);}
.need:first-of-type{border-top:0;padding-top:4px;}
.need .nbody{flex:1;min-width:0;}
.need .nbody .nt{font-size:1.06rem;}
.need .nbody .nt .dotlive{display:inline-block;width:13px;height:13px;border-radius:50%;background:var(--clay-500);margin-right:8px;vertical-align:middle;}
.need .nbody .nmeta{color:var(--ink-soft);}
.need .nbody form{margin-top:12px;}

/* agenda list */
.agenda-list{list-style:none;counter-reset:a;padding:0;margin:0;display:flex;flex-direction:column;gap:13px;}
.agenda-list li{counter-increment:a;display:flex;align-items:center;gap:12px;}
.agenda-list li::before{content:counter(a) ".";font-weight:700;color:var(--ink-soft);min-width:20px;}
.agenda-list a{color:var(--euc-700);text-decoration:underline;text-underline-offset:3px;font-weight:600;cursor:pointer;}
.agenda-list a:hover{color:var(--euc-800);}

/* notices */
.notice-row{padding:16px 0;border-top:1px solid var(--border);}
.notice-row:first-of-type{border-top:0;}
.notice-row b{font-size:1.02rem;}
.notice-row .when{color:var(--ink-faint);font-size:.92rem;margin-left:6px;}

/* ---------- Forms ---------- */
.field{margin-bottom:18px;}
.field>label{display:block;font-weight:700;font-size:.98rem;margin-bottom:8px;}
.field>label .opt{font-weight:500;color:var(--ink-faint);}
.field .hint{font-size:.88rem;color:var(--ink-faint);margin-top:7px;}
.inp,.sel,.ta{width:100%;font-family:var(--font-body);font-size:1rem;color:var(--ink);background:#fff;
  border:1.5px solid var(--border-strong);border-radius:11px;padding:.8em 1em;}
.inp::placeholder,.ta::placeholder{color:var(--ink-faint);}
.inp:focus,.sel:focus,.ta:focus{outline:none;border-color:var(--euc-500);box-shadow:0 0 0 3px rgba(46,110,94,.1);}
.ta{min-height:120px;resize:vertical;}
.sel{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%234f5e58' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:42px;}
.field-2{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.field-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;}
@media(max-width:680px){.field-2,.field-3{grid-template-columns:1fr;}}
.check{display:flex;align-items:flex-start;gap:11px;}
.check input{width:20px;height:20px;margin-top:2px;accent-color:var(--euc-600);flex:none;}
.check .cl b{display:block;font-size:1rem;}
.check .cl span{font-size:.9rem;color:var(--ink-soft);}
.radio{display:flex;align-items:flex-start;gap:11px;margin-bottom:12px;}
.radio input{width:20px;height:20px;margin-top:2px;accent-color:var(--euc-600);flex:none;}
.filebox{display:flex;align-items:center;gap:12px;font-size:.92rem;color:var(--ink-faint);}
.filebtn{border:1px solid var(--border-strong);background:var(--paper-2);padding:.5em .9em;border-radius:9px;font-weight:600;color:var(--ink);cursor:pointer;}
.form-actions{display:flex;align-items:center;gap:12px;margin-top:6px;flex-wrap:wrap;}

/* ---------- Meeting / generic list rows with action ---------- */
.listrow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-top:1px solid var(--border);}
.listrow:first-of-type{border-top:0;}
.listrow .lr-l{min-width:0;}
.listrow .lr-l b{font-size:1.08rem;margin-right:10px;}
.listrow .lr-l .tag{margin-right:6px;vertical-align:middle;}
.listrow .lr-l .when{display:block;color:var(--ink-faint);font-size:.9rem;margin-top:4px;}
.listrow .lr-r{display:flex;gap:8px;flex:none;}

/* ---------- Tables ---------- */
.tbl{width:100%;border-collapse:collapse;}
.tbl th{text-align:left;font-size:.76rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-faint);
  padding:0 14px 14px;border-bottom:1px solid var(--border);}
.tbl td{padding:16px 14px;border-bottom:1px solid var(--border);font-size:1rem;vertical-align:middle;}
.tbl tr:last-child td{border-bottom:0;}
.tbl .muted{color:var(--ink-faint);}
.swap{display:inline-grid;place-items:center;width:26px;height:26px;border:1px solid var(--border-strong);border-radius:7px;
  margin-left:8px;color:var(--ink-faint);cursor:pointer;vertical-align:middle;}
.pill-btn{display:inline-flex;align-items:center;gap:.4em;border:1px solid var(--border-strong);background:#fff;border-radius:10px;
  padding:.4em .8em;font-size:.86rem;font-weight:600;color:var(--ink-soft);}
@media(max-width:760px){
  .tbl thead{display:none;}
  .tbl tr{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;padding:14px 0;border-bottom:1px solid var(--border);}
  .tbl td{border:0;padding:2px 0;}
}

/* ---------- Minutes doc ---------- */
.doc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:8px;flex-wrap:wrap;}
.doc-meta{color:var(--ink-faint);font-size:.95rem;margin-bottom:24px;display:flex;align-items:center;gap:10px;}
.minute-num{list-style:none;counter-reset:m;padding:0;margin:0;}
.minute-num>li{counter-increment:m;display:grid;grid-template-columns:28px 1fr;gap:10px;padding:14px 0;border-top:1px solid var(--border);}
.minute-num>li:first-child{border-top:0;}
.minute-num>li::before{content:counter(m) ".";font-weight:800;color:var(--ink-soft);}
.minute-num b{font-size:1.05rem;}
.minute-num .res-meta{color:var(--ink-faint);font-size:.92rem;margin-top:3px;}
.minute-num p{color:var(--ink-soft);margin-top:4px;}

/* ---------- Roles ---------- */
.role-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px;}
.role-head h2{margin:0;}
.perm-list{list-style:disc;padding-left:22px;color:var(--ink-soft);display:flex;flex-direction:column;gap:7px;margin:0 0 16px;}
.held{color:var(--ink-soft);font-size:.98rem;}
.sys-note{color:var(--ink-faint);font-size:.92rem;margin-top:6px;}
.perm-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 28px;margin:8px 0 18px;}
@media(max-width:680px){.perm-grid{grid-template-columns:1fr;}}

/* ---------- stat duo ---------- */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:22px;}
@media(max-width:680px){.duo{grid-template-columns:1fr;}}
.bignum{font-family:var(--font-display);font-weight:800;font-size:3.2rem;line-height:1;color:var(--euc-700);}

/* ---------- footer ---------- */
.app-foot{border-top:1px solid var(--border);padding:26px 32px;color:var(--ink-faint);font-size:.95rem;
  max-width:1180px;margin-inline:auto;width:100%;}
.app-foot a{color:var(--euc-700);text-decoration:underline;}
.app-foot b{color:var(--ink-soft);}

/* banner */
.banner{background:var(--euc-50);border:1px solid var(--euc-100);border-radius:var(--r-md);padding:16px 20px;color:var(--euc-800);margin-bottom:22px;font-size:1rem;}

.proj-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.proj-row a{color:var(--euc-700);font-weight:700;text-decoration:underline;text-underline-offset:3px;}

/* Logo lockup + nav right cluster (design relies on brand.css for these). */
.logo{display:inline-flex;align-items:center;gap:.55em;text-decoration:none;flex:none;}
.logo img{width:36px;height:36px;flex:none;}
.logo .word{font-family:var(--font-display);font-weight:800;letter-spacing:-.02em;font-size:1.3rem;color:var(--ink);line-height:1;white-space:nowrap;}
.logo .word b{color:var(--euc-600);}
.anav-right{display:flex;align-items:center;gap:14px;}
/* Administration dropdown driven by <details> (CSP-safe, no JS). */
details.anav-admin > summary{list-style:none;cursor:pointer;}
details.anav-admin > summary::-webkit-details-marker{display:none;}
details.anav-admin[open] .anav-menu{display:flex;}

/* Payments dropdown driven by <details> (CSP-safe, no JS). */
details.anav-payments > summary{list-style:none;cursor:pointer;}
details.anav-payments > summary::-webkit-details-marker{display:none;}
details.anav-payments[open] .anav-menu{display:flex;}

@media(max-width:880px){
  details.anav-admin[open] .anav-menu{position:static;display:flex;box-shadow:none;border:0;padding:0 0 0 12px;}
  details.anav-payments[open] .anav-menu{position:static;display:flex;box-shadow:none;border:0;padding:0 0 0 12px;}
}

/* Top-nav links are not underlined (the design's reset; styles.css doesn't zero <a>). */
.anav-links a, .anav-links summary, .anav-menu a, .setup-pill, .logo { text-decoration: none; }