/* Browser layout extends the shared Needs theme; iOS keeps its mobile layout. */
body.needs-web { background:#f6f7f2; }
.needs-web .social-sign-in h2 { font-weight:650; }
.needs-web .login-shell { min-height:100%; }
.needs-web .provider-button { cursor:pointer; transition:box-shadow .15s ease; }
.needs-web .provider-button:hover { box-shadow:0 3px 12px #243f3618; }
.needs-web .provider-button:disabled { cursor:wait; }
@media(min-width:900px) {
  .needs-web .login-shell { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr); grid-template-rows:auto 1fr auto; column-gap:clamp(50px,7vw,120px); max-width:1180px; padding:40px 48px 32px; }
  .needs-web .login-brand { grid-column:1/-1; margin:0 0 68px; font-size:32px; }
  .needs-web .login-intro { align-self:center; padding-bottom:30px; }
  .needs-web .login-intro h1 { font-size:clamp(52px,5.2vw,76px); line-height:1.08; margin-top:18px; }
  .needs-web .login-intro p { max-width:430px; font-size:18px; margin-bottom:0; }
  .needs-web .social-sign-in { align-self:center; padding:36px; box-shadow:0 16px 70px #243f3608; }
  .needs-web .social-sign-in h2 { font-size:25px; margin:0 0 12px; }
  .needs-web .form-helper { font-size:14px; margin-bottom:24px; }
  .needs-web .login-mission { grid-column:1/-1; margin-top:64px; text-align:left; }
  .needs-web .page-shell { max-width:1100px; }
  .needs-web .page-shell.narrow { max-width:680px; }
  .needs-web .toolbar-content { max-width:1100px; margin:0 auto; }
  .needs-web .needs-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .needs-web .tabbar { padding-left:max(24px,calc((100vw - 1100px)/2)); padding-right:max(24px,calc((100vw - 1100px)/2)); }
  .needs-web .preview-tabs { padding-left:max(24px,calc((100vw - 1100px)/2)); padding-right:max(24px,calc((100vw - 1100px)/2)); }
}
@media(prefers-reduced-motion:reduce) { .needs-web .provider-button { transition:none; } }

/* Official store artwork, with matching visual height and clear space. */
.needs-web .app-downloads { grid-column:1 / -1;margin-top:12px;text-align:center; }
.needs-web .app-downloads > p { color:#566b60;font-size:14px;margin:0 0 16px; }
.needs-web .app-download-links { display:flex;justify-content:center;align-items:center;gap:22px;flex-wrap:wrap; }
.needs-web .app-download-links a { display:block;line-height:0;border-radius:9px;text-decoration:none; }
.needs-web .app-download-links a:focus-visible { outline:3px solid #477158;outline-offset:5px; }
.needs-web .app-download-links img { display:block;height:60px;width:auto;max-width:100%; }
.needs-web .app-downloads .download-test-note { max-width:360px;margin:16px auto 0;font-size:12px;line-height:1.5;color:#697766; }
@media(max-width:450px) { .needs-web .app-download-links { gap:16px; } .needs-web .app-download-links img { height:48px; } }

/* Signed-in web account tools remain separate from page navigation. */
.needs-web .web-account-bar { position:absolute;top:0;right:76px;z-index:100;height:64px;padding:0 12px;display:flex;align-items:center;gap:24px;background:#f6f7f2;color:#284b3e; }
.needs-web ion-nav.web-account-layout { top:0;height:100%; }
.needs-web .web-account-desktop { display:flex;align-items:center;gap:22px;font-size:13px; }
.needs-web .web-account-community { display:flex;flex-direction:column;gap:3px; }
.needs-web .web-account-community small,.needs-web .web-account-mobile small { font-size:10px;color:#6b786d;letter-spacing:.04em; }
.needs-web .web-account-name { font-weight:600; }
.needs-web .web-account-bar button { background:transparent;padding:10px 0;color:#476751;font-size:12px;text-decoration:underline;text-underline-offset:3px;cursor:pointer; }
.needs-web .web-account-bar button:disabled { opacity:.6;cursor:wait; }
.needs-web .web-account-bar button:focus-visible,.needs-web .web-account-mobile summary:focus-visible { outline:2px solid #477158;outline-offset:4px; }
.needs-web .web-account-mobile { display:none; }
.needs-web .web-signout-error { position:absolute;right:24px;top:58px;padding:10px;background:#fffefa;border:1px solid #d8b6a5;border-radius:8px;font-size:12px; }
@media(min-width:700px) {
  .needs-web page-more .page-shell.narrow { max-width:960px; }
  .needs-web page-more .settings-list { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;background:transparent; }
  .needs-web page-more .settings-list button.item { margin:0;min-height:80px;border:1px solid #dfe5d9;border-radius:14px;box-shadow:none; }
  .needs-web page-more .settings-list .item-inner { border-bottom:0; }
  .needs-web page-more .settings-list button.item:hover { background:#eef2e7; }
}
@media(max-width:699px) {
  .needs-web .web-account-bar { height:56px;right:52px;padding:0 8px;gap:12px;max-width:55%; }
  
  .needs-web .web-account-desktop { display:none; }
  .needs-web .web-account-mobile { display:block;position:relative;font-size:12px; }
  .needs-web .web-account-mobile summary { cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;min-height:40px; }
  .needs-web .web-account-mobile summary::-webkit-details-marker { display:none; }
  .needs-web .web-account-mobile > div { position:absolute;right:0;top:44px;min-width:230px;display:flex;flex-direction:column;gap:8px;padding:18px;background:#fffefa;border:1px solid #dfe5d9;border-radius:12px;box-shadow:0 8px 30px #243f3618; }
  .needs-web .web-account-mobile button { text-align:left; }
}

/* Laptop workspaces use horizontal space instead of long mobile stacks. */
@media(min-width:900px) {
  .needs-web page-contact .page-shell,
  .needs-web page-home .page-shell.narrow,
  .needs-web page-about .page-shell.narrow,
  .needs-web page-approveuser .page-shell.narrow,
  .needs-web page-notifications3 .page-shell.narrow { max-width:1180px;padding:16px 32px; }
  .needs-web page-contact .page-shell { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto 27px auto auto;gap:18px 22px; }
  .needs-web page-contact .discovery-hero { grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:10px 36px;align-items:center;padding:0 0 14px;border-bottom:1px solid #dfe5d9; }
  .needs-web page-contact .discovery-hero .eyebrow { grid-column:1; }
  .needs-web page-contact .discovery-hero h1 { grid-column:1;margin:0;font-size:42px;line-height:1.05; }
  .needs-web page-contact .discovery-hero .homepage-verse { grid-column:2;grid-row:1 / 3;width:100%;max-width:none;margin:0; }
  .needs-web page-contact .homepage-verse p { font-size:21px;line-height:1.4; }
  .needs-web page-contact .homepage-verse cite { margin-top:8px; }
  .needs-web page-contact .hero-flower { display:none; }
  .needs-web page-contact .page-shell > .section-heading { grid-column:1;grid-row:2;margin:0;align-self:start; }
  .needs-web page-contact .page-shell > .quick-link { grid-column:1;grid-row:3;align-self:start;margin:0; }
  .needs-web page-contact .field-section { margin:0;min-width:0; }
  .needs-web page-contact .field-section:nth-of-type(2) { grid-column:2;grid-row:2 / 4; }
  .needs-web page-contact .field-section:nth-of-type(3) { grid-column:3;grid-row:2 / 4; }
  .needs-web page-contact .section-heading { margin:0 0 12px;min-height:27px; }
  .needs-web page-contact .section-heading h2 { font-size:18px; }
  .needs-web page-contact .quick-link { padding:16px;gap:12px;margin:0 0 12px; }
  .needs-web page-contact .quick-link strong { font-size:16px; }
  .needs-web page-contact .quick-link small { font-size:12px; }
  .needs-web page-contact .surface-card { padding:14px;border-radius:14px; }
  .needs-web page-contact .form-card .item { margin-bottom:8px; }
  .needs-web page-contact .form-helper { margin:6px 0 0;line-height:1.4; }
  .needs-web page-contact .mission-note { grid-column:1 / -1;margin:0;padding:0; }
  .needs-web page-contact .form-card .select { min-height:44px;padding:11px; }
  .needs-web page-home .page-shell,.needs-web page-about .page-shell { display:grid;grid-template-columns:minmax(220px,.65fr) minmax(0,1.35fr);gap:38px;align-items:start; }
  .needs-web page-home .page-intro,.needs-web page-about .page-intro { margin:18px 0 0; }
  .needs-web page-home .page-intro h1,.needs-web page-about .page-intro h1 { font-size:32px;margin:12px 0; }
  .needs-web page-home .surface-card,.needs-web page-about .surface-card { padding:22px; }
  .needs-web page-home .form-card .item,.needs-web page-about .form-card .item { margin-bottom:14px; }
  .needs-web page-home .form-card .label[stacked],.needs-web page-about .form-card .label[stacked] { margin-bottom:6px; }
  .needs-web page-home .form-card textarea.text-input { min-height:80px; }
  .needs-web page-home .form-helper { margin:8px 0 12px;line-height:1.5; }
  .needs-web page-about .form-card { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 18px; }
  .needs-web page-about .form-card > .button { grid-column:1 / -1;margin:4px 0 0; }
  .needs-web page-approveuser .page-shell { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 20px; }
  .needs-web page-approveuser .page-intro { grid-column:1 / -1;margin:0 0 8px; }
  .needs-web page-approveuser .page-intro h1,.needs-web page-notifications3 .page-intro h1 { font-size:30px;margin:10px 0 8px; }
  .needs-web page-approveuser .quick-link { margin:0;padding:18px; }
  .needs-web page-approveuser .empty-state { grid-column:1 / -1;margin:0;padding:24px; }
  .needs-web page-notifications3 .page-intro { margin:0 0 18px; }
  .needs-web page-notifications3 .needs-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .needs-web page-notifications3 .empty-state { padding:24px;margin:12px 0; }
}