/* The Greenwake app's look (approved Oct 24, 2026): a light "paper" working surface, ink text, a black header band
   with the logo and the main links, Archivo Black headlines over Figtree, lime kept for buttons and small highlights,
   deep teal for links. Sadie's own spaces (her side panels, Help) stay dark so they stand apart from the page. */
@font-face{font-family:"Archivo Black";src:url(/static/archivo-black.woff2) format("woff2");font-display:swap}
@font-face{font-family:Figtree;src:url(/static/figtree-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Figtree;src:url(/static/figtree-600.woff2) format("woff2");font-weight:500 600;font-display:swap}
@font-face{font-family:Figtree;src:url(/static/figtree-700.woff2) format("woff2");font-weight:700 900;font-display:swap}

:root{
  --ink:#0B0B0C; --paper:#F3F5F0; --raised:#FFFFFF; --field:#FFFFFF; --text:#0B0B0C; --muted:#5A625D;
  --line:#DCE3DB; --line2:#C8D2C9; --accent:#0A7A56; --teal:#0C9A6C; --lime:#9BF26B; --tint:#E6F6DC; --tintline:#CFEABD;
  --forest:#FFFFFF; /* older pages call their cards "forest": on paper they're white */
  --head:"Archivo Black",system-ui,sans-serif; --body:Figtree,system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
}
body{margin:0;min-height:100vh;background:var(--paper);color:var(--text);font:17px/1.5 var(--body)}
main{width:100%;max-width:34rem;margin:0 auto;box-sizing:border-box;padding:32px 16px 72px;display:flex;flex-direction:column;gap:18px}
h1{font:400 clamp(28px,5vw,40px)/1.08 var(--head);margin:0;letter-spacing:-.005em}
h2{font-family:var(--body)}
.g{background:linear-gradient(90deg,#0A7A56,#0C9A6C);-webkit-background-clip:text;background-clip:text;color:transparent}
/* the ink knockout (as on greenwake.ai): the brand's teal-to-lime gradient on a black block, for headline accents */
.ko{background:#0B0B0C;padding:0 .14em;border-radius:.045em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.ko i{font-style:normal;background:linear-gradient(90deg,#2EE59D 0%,#9BF26B 55%,#E6FF6E 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
p{color:var(--muted);margin:0} a{color:var(--accent)} a:hover{color:#075C41}
.btn{display:inline-block;align-self:flex-start;background:var(--ink);color:#FFFFFF;font-weight:700;text-decoration:none;padding:12px 20px;border-radius:999px}
.btn:hover{color:var(--lime)}
ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
li{display:flex;justify-content:space-between;gap:12px;background:var(--raised);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
li span{color:var(--muted);font-size:14px} .fine{font-size:14px}
input,select,textarea{font-family:inherit}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}

/* the black header band on every signed-in page */
/* signed in at a company, the band becomes the left-hand nav (Oct 28): pages grouped Diagnose it / Run it / Prove it */
body:has(>.gwside){display:flex;flex-direction:row;align-items:stretch}
body:has(>.gwside)>:not(.gwside):not(script):not(.askfab){flex:1 1 auto;min-width:0}
.gwside{flex:none;width:248px;box-sizing:border-box;background:var(--ink);color:#C9D2CC;font:15px/1.4 var(--body);position:sticky;top:0;height:100vh;
  overflow-y:auto;display:flex;flex-direction:column;padding:18px 14px}
.gwside .ntop{display:flex;align-items:center;justify-content:space-between;padding:0 8px 16px}
.gwside .logo{line-height:0} .gwside .logo img{height:26px;width:auto;display:block}
.gwside .ntog,.gwside .nbtn{display:none}
.gwside .nbody{display:flex;flex-direction:column;flex:1 1 auto;gap:2px}
.gwside .nco{display:flex;flex-direction:column;background:#1B2A21;border-radius:12px;padding:10px 12px;margin-bottom:12px}
.gwside .nco b{color:#FFFFFF;font-size:15.5px} .gwside .nco span{font-size:13px;color:#9FB0A5}
.gwside .ntrial{display:flex;flex-direction:column;gap:2px;border:1px solid rgba(155,242,107,.45);border-radius:12px;padding:9px 12px;margin:0 0 12px;text-decoration:none}
.gwside .ntrial b{color:#9BF26B;font-size:12px;letter-spacing:.12em;text-transform:uppercase} .gwside .ntrial span{color:#FFFFFF;font-size:13.5px}
.gwside .nsoon{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 12px;color:#6F8075;cursor:default}
.gwside .nsoon small{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:#8FA196;border:1px solid #2C3E33;border-radius:999px;padding:2px 7px;white-space:nowrap}
.gwside .nview{display:flex;flex-direction:column;gap:6px;margin:-4px 0 12px;padding:0 4px}
.gwside .nview label{font:700 11px var(--body);letter-spacing:.12em;text-transform:uppercase;color:#7F9186}
.gwside .nview select{width:100%;font:600 14px var(--body);color:var(--ink);background:#FFFFFF;border:1px solid #2E4236;border-radius:10px;padding:7px 8px}
.gwside .nco.nvas{border:1px solid rgba(155,242,107,.55);gap:4px} .gwside .nvas span{color:#FFFFFF} .gwside .nvas strong{color:#9BF26B}
.gwside .nvas a{padding:0;font-size:13px;color:#9BF26B;text-decoration:underline} .gwside .nvas a:hover{background:none;color:#FFFFFF}
.gwside .nsw{margin:-6px 0 12px;font-size:14px} .gwside .nsw summary{cursor:pointer;padding:4px 12px;color:#9FB0A5}
.gwside .nsw a{display:block;padding:6px 12px}
.gwside nav,.gwside .nfoot{display:flex;flex-direction:column;gap:2px}
.gwside .ng{margin:14px 0 4px;padding:0 12px;font:700 11.5px var(--body);letter-spacing:.14em;text-transform:uppercase;color:#7F9186}
.gwside a{color:#C9D2CC;text-decoration:none;padding:8px 12px;border-radius:10px}
.gwside a:hover{color:#FFFFFF;background:#16201A}
.gwside a.on{color:var(--ink);background:var(--lime);font-weight:700}
.gwside .nfoot{margin-top:auto;padding-top:14px;border-top:1px solid #222B25}
.gwside .nme{display:flex;flex-direction:column;gap:2px;padding:10px 12px 0;font-size:13px;color:#9FB0A5;overflow-wrap:anywhere}
.gwside .nme a{padding:0;color:#C9D2CC} .gwside .nme a:hover{background:none;color:var(--lime)}
@media (max-width:900px){
  body:has(>.gwside){flex-direction:column}
  body.diag:has(>.gwside),body.learn:has(>.gwside){height:100dvh}
  .gwside{width:100%;height:auto;position:sticky;top:0;z-index:5;padding:10px 16px;max-height:100dvh}
  .gwside .ntop{padding:0}
  .gwside .nbtn{display:block;color:#FFFFFF;font-weight:700;cursor:pointer;padding:6px 12px;border:1px solid #2A352E;border-radius:999px}
  .gwside .nbody{display:none;padding-top:12px}
  .gwside:has(.ntog:checked) .nbody{display:flex}
}
.gwbar{background:var(--ink);color:#C9D2CC;font:15px/1.4 var(--body)}
.gwbar .in{max-width:88rem;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.gwbar .logo{line-height:0} .gwbar .logo img{height:26px;width:auto;display:block}
.gwbar nav{display:flex;gap:18px;flex-wrap:wrap;flex:1 1 auto}
.gwbar nav a{color:#C9D2CC;text-decoration:none;padding:4px 0;border-bottom:2px solid transparent}
.gwbar nav a:hover{color:#FFFFFF} .gwbar nav a.on{color:#FFFFFF;font-weight:600;border-bottom-color:var(--lime)}
.gwbar .me{display:flex;align-items:center;gap:12px;font-size:14px;flex-wrap:wrap}
.gwbar .co{background:#1B2A21;color:#E6EDE7;border-radius:999px;padding:5px 12px;font-weight:600}
.gwbar .me a{color:#C9D2CC} .gwbar .me a:hover{color:var(--lime)}

/* the etched illustrations: lime etching in an ink circle */
.ib{flex:none;width:56px;height:56px;border-radius:50%;background:var(--ink);display:flex;align-items:center;justify-content:center}
.etch{display:inline-block;width:38px;height:38px;background:var(--lime);-webkit-mask:var(--e) center/contain no-repeat;mask:var(--e) center/contain no-repeat}
.e-eye{--e:url(/static/etch-eye-open.png)} .e-path{--e:url(/static/etch-growth-path-no-axes.png)} .e-wheat{--e:url(/static/etch-revenue.png)}
.e-sapling{--e:url(/static/etch-stage-sapling.png)} .e-arch{--e:url(/static/etch-acquisition.png)} .e-roots{--e:url(/static/etch-roots.png)}
.e-sun{--e:url(/static/etch-insight.png)} .e-hands{--e:url(/static/etch-retention.png)} .e-garden{--e:url(/static/etch-techstack.png)}
.e-fern{--e:url(/static/etch-retention-ring.png)}
/* the home tiles' own icons (Oct 25): one per page, none borrowed from the Diagnostic's areas */
.e-scale{--e:url(/static/etch-scale.png)} .e-shears{--e:url(/static/etch-shears.png)} .e-moons{--e:url(/static/etch-moons.png)}
.e-sundial{--e:url(/static/etch-sundial.png)} .e-stump{--e:url(/static/etch-stump.png)} .e-book{--e:url(/static/etch-book.png)}
.e-keys{--e:url(/static/etch-keys.png)} .e-envelope{--e:url(/static/etch-envelope.png)} .e-owner{--e:url(/static/etch-owner.png)}
@media print{.gwbar,.gwside{display:none}}

/* a full report (Progress Report) inside the app frame: the nav stays, the report fills the rest */
main.framed{max-width:none;margin:0;padding:0;flex:1;min-width:0;display:flex}
.rframe{flex:1;width:100%;min-height:100vh;border:0;background:#fff}
