/* Layout 1 — Agora: bright marketplace. Deep teal brand, airy cards, search-first hero. */
:root {
  --bg: #f5f7f8; --surface: #ffffff; --surface-2: #f0f3f5; --surface-3: #e5eaee;
  --text: #13222b; --text-2: #364650; --muted: #5a6a74; --border: #dfe5ea; --border-strong: #c3ced6;
  --primary: #0f6e6e; --primary-hover: #0a5656; --on-primary: #fff; --primary-soft: #dff1ef;
  --accent: #d9531e; --accent-hover: #ba4413;
  --radius: 14px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0d1316; --surface: #141c20; --surface-2: #1b252a; --surface-3: #243137;
    --text: #e6eef1; --text-2: #bfccd2; --muted: #8b9ba3; --border: #26333a; --border-strong: #38474f;
    --primary: #3cb5a8; --primary-hover: #63cdc1; --on-primary: #04211e; --primary-soft: #14302d;
    --accent: #ef7a47; --accent-hover: #f6956b; --on-accent: #2a0f03;
    --offer: #3987e5; --offer-soft: #142739; --offer-ink: #92bff3;
    --request: #d95926; --request-soft: #35200f; --request-ink: #f2a581;
    --ok-soft: #10301a; --ok-ink: #84d98f; --warn-soft: #36290b; --warn-ink: #f2c465; --danger-soft: #3a1818; --danger-ink: #f39c9c;
    --series-1: #3987e5; --series-2: #d95926; --grid: #2c2c2a;
    --shadow: 0 1px 2px rgb(0 0 0 / .4); --shadow-lg: 0 14px 34px rgb(0 0 0 / .5);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0d1316; --surface: #141c20; --surface-2: #1b252a; --surface-3: #243137;
  --text: #e6eef1; --text-2: #bfccd2; --muted: #8b9ba3; --border: #26333a; --border-strong: #38474f;
  --primary: #3cb5a8; --primary-hover: #63cdc1; --on-primary: #04211e; --primary-soft: #14302d;
  --accent: #ef7a47; --accent-hover: #f6956b; --on-accent: #2a0f03;
  --offer: #3987e5; --offer-soft: #142739; --offer-ink: #92bff3;
  --request: #d95926; --request-soft: #35200f; --request-ink: #f2a581;
  --ok-soft: #10301a; --ok-ink: #84d98f; --warn-soft: #36290b; --warn-ink: #f2c465; --danger-soft: #3a1818; --danger-ink: #f39c9c;
  --series-1: #3987e5; --series-2: #d95926; --grid: #2c2c2a;
  --shadow: 0 1px 2px rgb(0 0 0 / .4); --shadow-lg: 0 14px 34px rgb(0 0 0 / .5);
}

body.l-agora { background: var(--bg); }

/* header */
.ag-header { position: sticky; top: 0; z-index: 40; background: color-mix(in srgb, var(--surface) 88%, transparent); backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--border); }
.ag-header__inner { max-width: var(--maxw); margin: 0 auto; padding: 10px var(--gutter); display: flex; align-items: center; gap: 18px; }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--text); flex: none; }
.brand__name { font-weight: 800; font-size: 1.22rem; letter-spacing: -.02em; }
.brand:hover { color: var(--text); }
.ag-nav { display: flex; gap: 2px; flex: 1; }
.ag-nav a { padding: 8px 12px; border-radius: 999px; text-decoration: none; color: var(--text-2); font-weight: 600; font-size: .95rem; }
.ag-nav a:hover { background: var(--surface-2); color: var(--text); }
.ag-nav a.is-active { background: var(--primary-soft); color: var(--primary-hover); }
.ag-tools { display: flex; align-items: center; gap: 6px; flex: none; }
.nav-toggle { display: none; align-items: center; gap: 6px; border: 1px solid var(--border); background: var(--surface); color: var(--text); border-radius: 999px; height: 40px; padding: 0 12px; font: inherit; font-weight: 600; cursor: pointer; }
.nav-toggle .i { margin: 0; }
@media (max-width: 1080px) {
  .ag-header__inner { flex-wrap: wrap; gap: 10px; }
  .nav-toggle { display: inline-flex; order: 3; }
  .ag-tools { margin-left: auto; order: 2; }
  .ag-nav { order: 4; flex-basis: 100%; display: none; flex-direction: column; padding: 6px 0 8px; }
  .nav-open .ag-nav { display: flex; }
}
@media (max-width: 640px) {
  .ag-post span, .account__name, .ag-tools .account__tier { display: none; }
  .ag-post { padding: 4px 10px; } .ag-post .i { margin: 0; }
  .account__chip { padding: 3px; }
  .brand__name { font-size: 1.1rem; }
}

/* main */
.ag-main { max-width: var(--maxw); margin: 0 auto; padding: 18px var(--gutter) 48px; min-height: 60vh; }

/* hero */
.ag-hero { display: grid; gap: 24px; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); align-items: stretch; margin: 10px 0 36px; }
@media (max-width: 920px) { .ag-hero { grid-template-columns: 1fr; } }
.ag-hero__text { padding: clamp(20px, 3vw, 36px); border-radius: 24px; color: #fff;
  background: radial-gradient(120% 140% at 0% 0%, #138a85 0%, #0f6e6e 45%, #0b4f55 100%); position: relative; overflow: hidden; }
.ag-hero__text::after { content: ""; position: absolute; right: -60px; bottom: -80px; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle, rgb(235 104 52 / .45), transparent 70%); pointer-events: none; }
.ag-hero__text .kicker { color: #bfe7e2; }
.ag-hero__text h1 { color: #fff; font-size: clamp(1.9rem, 1.3rem + 2.4vw, 3rem); margin-bottom: .35em; }
.ag-hero__text h1 span { color: #ffd2bd; }
.ag-hero__text .lead { color: #dbf1ee; max-width: 60ch; }
.ag-search { position: relative; z-index: 1; margin-top: 18px; background: var(--surface); color: var(--text); border-radius: 18px; padding: 12px; box-shadow: var(--shadow-lg); }
.ag-search__kind { border: 0; padding: 0; margin: 0 0 10px; display: inline-flex; background: var(--surface-2); border-radius: 999px; padding: 4px; }
.ag-search__kind input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ag-search__kind label { padding: 6px 14px; border-radius: 999px; cursor: pointer; font-weight: 650; font-size: .9rem; color: var(--text-2); }
.ag-search__kind input:checked + label { background: var(--surface); color: var(--text); box-shadow: var(--shadow); }
.ag-search__kind input:focus-visible + label { box-shadow: var(--ring); }
.ag-search__fields { display: grid; gap: 8px; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: end; }
.ag-search__fields label { display: grid; gap: 3px; font-size: .74rem; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
.ag-search__fields .btn { min-height: 42px; }
@media (max-width: 720px) { .ag-search__fields { grid-template-columns: 1fr; } }
.ag-popular { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 16px 0 0; font-size: .86rem; color: #cbeae6; }
.ag-popular .chip { background: rgb(255 255 255 / .12); border-color: rgb(255 255 255 / .25); color: #fff; }
.ag-popular .chip:hover { background: rgb(255 255 255 / .22); color: #fff; border-color: #fff; }
.ag-hero__panel { background: var(--surface); border: 1px solid var(--border); border-radius: 24px; padding: 22px; display: grid; gap: 18px; align-content: center; box-shadow: var(--shadow); }
.ag-kpis { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ag-kpis li { padding: 12px; border-radius: 14px; background: var(--surface-2); display: grid; }
.ag-kpis b { font-size: 1.9rem; font-weight: 800; letter-spacing: -.03em; line-height: 1.1; }
.ag-kpis span { color: var(--muted); font-size: .84rem; }
.ag-kpis li:nth-child(1) b, .ag-kpis li:nth-child(3) b { color: var(--offer-ink); }
.ag-kpis li:nth-child(2) b, .ag-kpis li:nth-child(4) b { color: var(--request-ink); }
.ag-hero__cta { display: grid; gap: 8px; }
.ag-hero__note { margin: 0; font-size: .86rem; color: var(--muted); }

/* home sections */
.ag-split { display: grid; gap: 24px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); margin-bottom: 36px; }
.ag-col .section-head h2 .i { color: var(--muted); }
.ag-week { margin-bottom: 36px; }
.ag-days { list-style: none; margin: 0; padding: 0 0 6px; display: grid; grid-template-columns: repeat(7, minmax(130px, 1fr)); gap: 10px; overflow-x: auto; }
.ag-day a { display: grid; gap: 4px; padding: 14px; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--border); text-decoration: none; color: var(--text); height: 100%; box-shadow: var(--shadow); }
.ag-day a:hover { border-color: var(--primary); }
.ag-day.is-today a { border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary-soft); }
.ag-day__name { font-weight: 750; }
.ag-day__date { color: var(--muted); font-size: .84rem; margin-bottom: 6px; }
.ag-day__row { display: grid; font-size: .84rem; color: var(--text-2); padding-left: 14px; position: relative; }
.ag-day__row::before { content: ""; position: absolute; left: 0; top: .45em; width: 8px; height: 8px; border-radius: 2px; background: var(--offer); }
.ag-day__row--want::before { background: var(--request); border-radius: 50%; }
.ag-day__row b { font-size: 1rem; color: var(--text); margin-right: 3px; }
.ag-day__row small { color: var(--muted); font-size: .76rem; }
.ag-how { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); margin-bottom: 36px; }
.ag-how__item { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 20px; position: relative; }
.ag-how__n { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--primary); color: var(--on-primary); font-weight: 800; margin-bottom: 10px; }
.ag-how__item p { color: var(--text-2); margin: 0; font-size: .95rem; }
.ag-bottom { display: grid; gap: 24px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); }
.ag-bottom > div { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 18px; }

/* board */
.ag-board { display: grid; gap: 22px; grid-template-columns: 270px minmax(0, 1fr); align-items: start; }
.ag-board__filters { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; position: sticky; top: 76px; }
.ag-board__filters > summary { font-weight: 700; cursor: pointer; display: flex; align-items: center; list-style: none; }
.ag-board__filters > summary::-webkit-details-marker { display: none; }
.ag-board__filters[open] > summary { margin-bottom: 12px; }
@media (min-width: 901px) { .ag-board__filters > summary { pointer-events: none; } }
@media (max-width: 900px) { .ag-board { grid-template-columns: 1fr; } .ag-board__filters { position: static; } }

/* backend side nav */
.ag-side { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px; }
@media (max-width: 959px) { .ag-side { padding: 10px; } }

/* footer */
.ag-footer { background: #0b3d40; color: #cfe6e3; margin-top: 24px; }
.ag-footer__inner { max-width: var(--maxw); margin: 0 auto; padding: 36px var(--gutter) 20px; display: grid; gap: 24px; grid-template-columns: 2fr repeat(3, 1fr); }
@media (max-width: 760px) { .ag-footer__inner { grid-template-columns: 1fr 1fr; } .ag-footer__brand { grid-column: 1 / -1; } }
.ag-footer h2 { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: #8fc4bf; margin-bottom: 10px; }
.ag-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ag-footer a { color: #e6f4f2; text-decoration: none; }
.ag-footer a:hover { text-decoration: underline; color: #fff; }
.ag-footer .footer-links { display: grid; }
.ag-footer .brand { color: #fff; }
.ag-footer__brand p { margin-top: 10px; max-width: 40ch; font-size: .92rem; }
.ag-footer__base { max-width: var(--maxw); margin: 0 auto; padding: 14px var(--gutter) 24px; border-top: 1px solid rgb(255 255 255 / .12); font-size: .82rem; color: #8fc4bf; }