/* ==================================================================================================================
   Matte + menus layer, loaded last. Nothing shines: no gradients on buttons or text, no inner highlights, no glows.
   Pill buttons stay, flat. The search palette, wallet picker, dropdowns, selects, tabs, tooltips, toasts and dialogs
   drop the old parchment look for dark frosted panels with neutral hairlines.
   ================================================================================================================== */
:root{--menu-bg:rgba(14,20,16,.86);--menu-rim:rgba(238,242,231,.12);--menu-hover:rgba(238,242,231,.06);--menu-shadow:0 24px 60px -24px rgba(0,0,0,.85)}

/* ---- matte buttons: flat fills, no inner highlights or halos */
.btn,.kbtn{background:rgba(238,242,231,.04);box-shadow:none!important;filter:none}
.btn:hover,.kbtn:hover{background:rgba(238,242,231,.08);border-color:rgba(238,242,231,.22)}
.btn.ghost{background:transparent}
.btn.ghost:hover{background:rgba(238,242,231,.05)}
.btn.accent,.btn.accent.xl,.h2-hero .btn.accent,.pf .btn.accent,.h2-end .btn.accent{background:var(--accent)!important;border-color:var(--accent)!important;color:#0a1206}
.btn.accent:hover,.h2-hero .btn.accent:hover,.h2-end .btn.accent:hover{background:#d4ff5c!important;border-color:#d4ff5c!important}
.btn.primary{background:#eef2e7!important;border-color:#eef2e7!important;color:#0b100d}
.btn.primary:hover{background:#fff!important;border-color:#fff!important}
.btn:active{transform:none}

/* ---- matte everything else: flat highlight text, flat chips and icon tiles, no light behind the hero or closing box */
.h2-hl{background:none!important;color:var(--accent)!important;-webkit-text-fill-color:var(--accent)!important}
nav.links a[aria-current],details.more:has(a[aria-current]) > summary{background:rgba(238,242,231,.07);box-shadow:none}
.h2-kick{background:rgba(238,242,231,.04);box-shadow:none}
.h2-step-i{background:rgba(201,255,63,.08);box-shadow:inset 0 0 0 1px rgba(201,255,63,.16)}
.h2-stats{background:rgba(238,242,231,.02)}
.mcard:hover,.mcard:focus-visible,.fl-card:hover,.fcard:hover,.h2-done:hover,.h2-steps li:hover,.mg-more:hover,.h2-chip:hover{background:var(--glass-2);box-shadow:var(--glass-drop)}
.h2-hero::before{background:repeating-radial-gradient(circle at 50% 50%,transparent 0 119px,rgba(201,255,63,.075) 119px 120px)!important}
.h2-end{background:var(--glass)}
.h2-sec-h h2::before{background:var(--accent)}
.pod-1 .pod-base{background:rgba(201,255,63,.07)!important}
.chipbtn[aria-pressed="true"],.seg button[aria-pressed="true"]{box-shadow:none}
.in:focus,.h2-ask:focus-within{box-shadow:none!important}

/* ---- search palette: a dark frosted sheet, sans input, rows with an icon tile */
.palette{background:rgba(4,7,5,.6);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding-top:14vh}
.pal-box{width:min(640px,100%);border-radius:16px;overflow:hidden;background:var(--menu-bg);color:var(--ink);border:1px solid var(--menu-rim);
  -webkit-backdrop-filter:blur(24px) saturate(140%);backdrop-filter:blur(24px) saturate(140%);box-shadow:var(--menu-shadow);
  --ink:#eef2e7;--muted:#8e9985;--text-2:#c6cdbb;--bg-2:rgba(238,242,231,.05);--line:rgba(238,242,231,.08);--line-2:rgba(238,242,231,.12);--accent:#c9ff3f}
.pal-in{gap:12px;padding:0 18px;border-bottom:1px solid var(--line)}
.pal-in > span{color:var(--muted);font-size:16px}
.pal-in input{height:58px;font:400 16px var(--sans);color:var(--ink);letter-spacing:-.005em}
.pal-in input::placeholder{color:var(--muted)}
.pal-in kbd{height:22px;padding:0 7px;display:inline-grid;place-items:center;border:1px solid var(--line-2);border-radius:6px;background:transparent;color:var(--muted);font:500 11px var(--sans)}
.pal-r{padding:8px;max-height:min(56vh,480px);scrollbar-width:thin;scrollbar-color:rgba(238,242,231,.15) transparent}
.pal-r a{gap:12px;padding:9px 10px;border-radius:10px;font:450 14px var(--sans);color:var(--ink)}
.pal-r a .pi{width:28px;height:28px;flex:none;display:grid;place-items:center;border-radius:8px;border:1px solid var(--line);background:rgba(238,242,231,.03);color:var(--muted);font-size:12px}
.pal-r a small{font:400 12px var(--sans);color:var(--muted)}
.pal-r a.on,.pal-r a:hover{background:var(--menu-hover)}
.pal-r a.on .pi,.pal-r a:hover .pi{color:var(--accent);border-color:rgba(201,255,63,.25)}
.pal-r .ident .bg{fill:hsl(var(--h) 25% 22%)} .pal-r .ident .fg{fill:hsl(var(--h) 60% 70%)}

/* ---- wallet pickers and edit dialogs: the same sheet, neutral rims instead of lime */
.pal-box.wp{width:min(420px,100%)}
.wp-h{font:600 16px var(--sans);letter-spacing:-.01em}
.wp-note{color:var(--muted)}
.wp .wp-out,.wp2 .wp-out{background:transparent;color:#ea7564!important;border:1px solid rgba(234,117,100,.35)!important;border-radius:999px}
.pal-box.wp2,.pal-box.ed{border-radius:16px;background:var(--menu-bg);border:1px solid var(--menu-rim);--line:rgba(238,242,231,.08);--line-2:rgba(238,242,231,.13);--accent-soft:rgba(238,242,231,.05)}
.wp2-bal,.wp2-nav{border-radius:12px!important}
.wp2-bal{background:rgba(238,242,231,.03)!important}
.wp2-bal .lbl{font:500 12px var(--sans);letter-spacing:0;text-transform:none}
.wp2-icon{border-radius:8px}

/* ---- nav "More" dropdown: a roomier menu, chevron that turns when open */
details.more > summary::after{content:"";display:inline-block;width:6px;height:6px;margin:0 0 3px 7px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(45deg);opacity:.6;transition:transform .2s}
details.more[open] > summary::after{transform:translateY(3px) rotate(-135deg)}
.more-m{min-width:220px;padding:6px;border-radius:14px;background:var(--menu-bg);border:1px solid var(--menu-rim);box-shadow:var(--menu-shadow);animation:menu-in .14s ease-out}
.more-m a{display:flex;align-items:center;justify-content:space-between;padding:9px 12px!important;border-radius:9px!important;font:450 14px var(--sans);color:var(--text-2)}
.more-m a:hover{background:var(--menu-hover);color:var(--ink)}
.more-m a[aria-current]{color:var(--ink);background:rgba(238,242,231,.07)}
.more-m a[aria-current]::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent)}
@keyframes menu-in{from{opacity:0;transform:translateY(-4px)}}

/* ---- selects: matte field with a drawn chevron */
.sel,select.in{-webkit-appearance:none;appearance:none;height:38px;padding:0 34px 0 12px;border:1px solid var(--glass-rim-2);border-radius:10px;font:450 14px var(--sans);color:var(--ink);cursor:pointer;
  background:rgba(238,242,231,.03) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238e9985' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center}
.sel:hover,select.in:hover{border-color:rgba(238,242,231,.24)}
.sel option,.in option{background:#111814;color:#eef2e7}

/* ---- tabs: sentence case, the active one underlined in lime */
.tabs{gap:24px;border-bottom:1px solid var(--glass-rim)}
.tabs button{padding:12px 0;margin-bottom:-1px;font:500 14px var(--sans);letter-spacing:0;text-transform:none;color:var(--muted);border-bottom:2px solid transparent;transition:color .15s}
.tabs button:hover{color:var(--text-2)}
.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent)}

/* ---- filter chips: quiet outlines, the pressed one solid */
.chipbtn{height:34px;padding:0 14px;border-radius:999px;border-color:var(--glass-rim-2);background:transparent;font:450 13.5px var(--sans);color:var(--text-2)}
.chipbtn:hover{border-color:rgba(238,242,231,.26);color:var(--ink)}
.chipbtn[aria-pressed="true"]{background:#eef2e7;border-color:#eef2e7;color:#0b100d}

/* ---- page headers: title and actions on one line, a hairline under the block */
.page-h{border-bottom:1px solid var(--glass-rim);margin-bottom:28px;padding-bottom:28px}
.page-h .lede{max-width:60ch;font-size:16px;line-height:1.55}

/* ---- tooltips, toasts, mission drawer: dark and matte */
.tip{background:var(--menu-bg);color:#eef2e7;border:1px solid var(--menu-rim);border-radius:10px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:var(--menu-shadow);--muted:#8e9985}
#toast{background:var(--menu-bg);color:#eef2e7;border:1px solid var(--menu-rim);border-radius:12px;font:450 14px var(--sans);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:var(--menu-shadow)}
#toast.ok{background:#16251a;border-color:rgba(201,255,63,.3);color:#eef2e7}
#toast.bad{background:#2a1512;border-color:rgba(234,117,100,.4);color:#f6ddd8}
.drawer-bg{background:rgba(4,7,5,.6);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.drawer-p{border-radius:18px;border:1px solid var(--menu-rim);box-shadow:var(--menu-shadow)}

/* ---- leftovers: flat medals and bars; the header hairline comes off (it ran past the content edge) */
.pod-medal{background:#9a9a9a!important;box-shadow:none!important;text-shadow:none!important}
.pod-1 .pod-medal{background:#e9b64c!important}
.pod-3 .pod-medal{background:#b8733a!important}
.bar-cell i,.w-bar i{background:var(--accent)!important}
.page-h{border-bottom:0;margin-bottom:12px;padding-bottom:20px}

/* ---- nav runs the full width: logo hard left, actions hard right, links still centred */
.top .wrap{max-width:none;padding:0 clamp(16px,2.4vw,36px)}

/* ---- the request box: the prompt is drawn over the empty box, with a blinking errand dash at the end of it until you click in */
.h2-ask{position:relative}
.h2-ph{position:absolute;left:24px;top:22px;right:24px;font:400 16px/1.5 var(--sans);color:var(--muted);pointer-events:none;display:none}
.h2-ask:has(textarea:placeholder-shown) .h2-ph{display:block}
.h2-caret{display:inline-block;width:11px;height:3px;margin-left:5px;border-radius:1px;background:var(--accent);vertical-align:baseline;opacity:0}
.h2-ask:not(:focus-within) .h2-caret{opacity:1;animation:h2-blink 1.06s steps(1,end) infinite}
@keyframes h2-blink{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.h2-ask .h2-caret{animation:none!important}}

/* ---- example missions: further down the page, with a heading of their own */
.h2-ex{margin-top:clamp(64px,8vw,104px);padding:0}
.h2-ex .h2-sec-h{margin-bottom:24px}

/* ---- agent cards, marketplace style: round avatar, name, one line of figures, a short pitch, plain skill tags, full-width buttons */
.fl-grid{grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px}
.fl-up{gap:14px;padding:22px 22px 20px}
.fl-up .fl-top{align-items:flex-start;gap:14px}
.fl-up .fl-top .av,.fl-up .fl-top img.av{width:60px!important;height:60px!important;border-radius:50%!important;flex:none}
.fl-up .fl-id{gap:3px;padding-right:16px}
.fl-up .fl-id b{font:600 18px/1.25 var(--round);letter-spacing:-.015em;white-space:normal;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.fl-up .fl-id b .lp{font:600 11px var(--mono);font-style:normal;padding:2px 6px;border-radius:5px;background:rgba(201,255,63,.1);color:var(--accent)}
.fl-up .fl-kind{font:400 14px var(--sans);letter-spacing:0;text-transform:none;color:var(--muted)}
.fl-meta{display:flex;align-items:center;gap:6px 18px;flex-wrap:wrap;margin-top:8px;font:400 13.5px var(--sans);color:var(--text-2)}
.fl-meta span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.fl-meta b{font:600 13.5px var(--sans);color:var(--ink)}
.fl-meta svg{color:var(--muted);flex:none}
.fl-up .fl-top .fl-dot{top:6px}
.fl-up .fl-tag{font-size:14.5px;line-height:1.6;color:var(--text-2);min-height:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.fl-up .fl-skills{gap:8px}
.fl-sk{font:500 12.5px var(--sans);padding:5px 11px;border-radius:999px;background:rgba(238,242,231,.07);color:var(--text-2)}
.fl-up .fl-foot{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:auto;padding-top:4px}
.fl-up .fl-foot .btn{height:42px;width:100%;justify-content:center;font-size:14.5px}
.fl-up .fl-see{border-color:rgba(201,255,63,.55);color:var(--accent);background:transparent}
.fl-up .fl-see:hover{background:rgba(201,255,63,.07);border-color:var(--accent)}
.fl-reviewer.fl-up .fl-foot{grid-template-columns:1fr}
.fl-reviewer{background:var(--glass)!important;border-color:rgba(201,255,63,.28)!important}
@media(max-width:420px){.fl-grid{grid-template-columns:1fr}}
.fl-up .fl-meta b{font:600 13.5px/1 var(--sans)!important;letter-spacing:0;color:var(--ink)}
.fl-up .fl-meta{font-size:13.5px}

/* ---- browse pages (Explore missions, Agents): filters in a left sidebar, search above the results */
.browse{display:grid;grid-template-columns:232px minmax(0,1fr);gap:36px;align-items:start}
.browse-side{position:sticky;top:84px;display:grid;gap:26px;padding-top:2px}
.bs-group{display:grid;gap:10px}
.bs-group h4{margin:0;font:600 12.5px var(--sans);letter-spacing:.01em;color:var(--muted)}
.bs-list{display:grid;gap:2px}
.bs-item{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;height:36px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:var(--text-2);font:450 14px var(--sans);text-align:left;cursor:pointer;transition:background .15s,color .15s}
.bs-item span{display:inline-flex;align-items:center;gap:9px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bs-item i{font-style:normal;width:16px;text-align:center;color:var(--muted);font-size:13px}
.bs-item small{font:500 12px var(--sans);color:var(--muted);font-variant-numeric:tabular-nums}
.bs-item:hover{background:rgba(238,242,231,.05);color:var(--ink)}
.bs-item[aria-pressed="true"]{background:rgba(238,242,231,.08);color:var(--ink)}
.bs-item[aria-pressed="true"] i{color:var(--accent)}
.bs-item[aria-pressed="true"]:not(.bs-check)::before{content:"";position:absolute;margin-left:-10px;width:2px;height:18px;border-radius:2px;background:var(--accent)}
.bs-check span::before{content:"";width:14px;height:14px;flex:none;border:1.5px solid var(--glass-rim-2);border-radius:4px;box-sizing:border-box}
.bs-check[aria-pressed="true"] span::before{background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230a1206' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/11px no-repeat;border-color:var(--accent)}
.bs-group .sel{width:100%}
.browse-main{min-width:0;display:grid;gap:22px;align-content:start}
.browse-top{display:flex;align-items:center;gap:12px}
.browse-top .search{flex:1;display:flex;align-items:center;gap:10px;height:44px;padding:0 14px;border:1px solid var(--glass-rim-2);border-radius:12px;background:rgba(6,10,8,.5);color:var(--muted)}
.browse-top .search:focus-within{border-color:rgba(238,242,231,.3)}
.browse-top .search input{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;color:var(--ink);font:400 15px var(--sans)}
.browse-top .search input::placeholder{color:var(--muted)}
.browse-top #flCount{white-space:nowrap}
.browse .mgrid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.browse .fl-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.browse .mgroup:first-child .mg-h,.browse .mg-quiet+.mgroup .mg-h{margin-top:0}
/* phones and tablets: the sidebar folds into scrolling rows above the results */
@media(max-width:900px){
  .browse{grid-template-columns:1fr;gap:18px}
  .browse-side{position:static;gap:12px}
  .bs-group{grid-template-columns:auto 1fr;align-items:center;gap:10px}
  .bs-group h4{display:none}
  .bs-list{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;grid-column:1/-1}
  .bs-item{width:auto;flex:none;height:34px;padding:0 12px;border:1px solid var(--glass-rim-2);border-radius:999px}
  .bs-item small{display:none}
  .bs-item[aria-pressed="true"]:not(.bs-check)::before{display:none}
  .bs-item[aria-pressed="true"]:not(.bs-check){background:#eef2e7;color:#0b100d;border-color:#eef2e7}
  .bs-group .sel{grid-column:1/-1;width:auto;justify-self:start}
}
@media(max-width:900px){.browse-side{display:flex;flex-wrap:wrap;align-items:center;gap:10px 8px}.browse-side .bs-group:first-child{width:100%}.browse-side .bs-group{display:flex}.bs-group .sel{height:34px;border-radius:999px}}
@media(max-width:900px){.browse>*{min-width:0}.browse-side .bs-group{min-width:0;max-width:100%}.browse-side .bs-list{min-width:0;flex:1}}

/* ---- slimmer sidebar, pushed out to the page edge (lined up with the logo); the title block lines up with the results */
@media(min-width:901px){
  .browse,.page-h:has(+ .browse){--edge:clamp(16px,2.4vw,36px);--side:168px;--gap:clamp(24px,3vw,44px)}
  .browse{max-width:none;padding:0 var(--edge);grid-template-columns:var(--side) minmax(0,1fr);gap:var(--gap)}
  .page-h:has(+ .browse){max-width:none;padding-left:calc(var(--edge) + var(--side) + var(--gap));padding-right:var(--edge)}
  .browse-side{top:80px;gap:20px}
  .bs-group{gap:6px}
  .bs-group h4{font:600 11.5px var(--sans);color:var(--dim,var(--muted));padding-left:8px}
  .bs-list{gap:0}
  .bs-item{height:29px;padding:0 8px;border-radius:6px;font:450 13px var(--sans);gap:8px}
  .bs-item span{gap:7px}
  .bs-item i{width:13px;font-size:11px}
  .bs-item small{font-size:11px}
  .bs-item[aria-pressed="true"]:not(.bs-check)::before{margin-left:-8px;height:14px}
  .bs-check span::before{width:12px;height:12px;border-radius:3px}
  .bs-check[aria-pressed="true"] span::before{background-size:9px}
  .bs-group .sel{height:30px;padding:0 26px 0 8px;border-radius:6px;font-size:13px;background-position:right 8px center}
}