/* THE PARTNER PORTAL'S CLOTHES — the public door and the desk behind it.
   ═══════════════════════════════════════════════════════════════════════════

   Nakul, 20 Oct 2026: "jawab dikhe wajah nahi, DSA wala bana do", and with
   it "prototype bilkul professional nahi lag raha hai". The shape here is
   the one he approved in prototype-dsa-desk.html, lifted rather than
   redrawn so the thing he said yes to is the thing that shipped.

   ONE STYLESHEET FOR BOTH PAGES on purpose. partner.html is where a DSA
   decides whether to work with us and partner-desk.html is where they work;
   a partner who applies on one visual language and lands in another reads
   it as two companies. The desk half simply does not apply on the door.

   It does NOT import the site's style.css. The site stylesheet carries the
   member and marketing surface — nav, hero, calculators, 5,000 lines of it
   — and none of it is wanted here. A partner desk that inherits the
   marketing page's h1 is a partner desk that breaks every time the
   marketing page is restyled.
   ═══════════════════════════════════════════════════════════════════════════ */

:root{
  --ground:#06100b; --sunk:#0a1a12; --card:#0e2318; --raised:#143020;
  --ink:#eefaf3; --mute:#7f9c8d; --dim:#5c786a;
  --line:#1a3828; --line-soft:#152d1f;
  --brand:#18C979; --deep:#085C3A; --mint:#A9E7CE;
  --ok:#18C979; --wait:#e0a132; --stop:#F0776B; --cool:#6fc5f5;
  --glow:0 0 0 1px rgba(24,201,121,.14), 0 18px 44px -18px rgba(0,0,0,.9);
}
/* Every colour above is already in BRAND_PALETTE.txt or in the site's own
   tokens. Nothing new is invented here — see the note in
   tools/brand_geometry.py about what counts as a palette change. */
:root[data-theme="light"]{
  --ground:#f1f6f3; --sunk:#e8f1ec; --card:#fff; --raised:#f7fbf9;
  --ink:#0b1d14; --mute:#5d7a6c; --dim:#7b968a;
  --line:#dde8e2; --line-soft:#e8f0eb;
  --ok:#0F814D; --wait:#8F6C04; --stop:#C2361E; --cool:#0b6ea8;
  --glow:0 1px 2px rgba(11,29,20,.05), 0 16px 40px -20px rgba(11,29,20,.3);
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --ground:#f1f6f3; --sunk:#e8f1ec; --card:#fff; --raised:#f7fbf9;
    --ink:#0b1d14; --mute:#5d7a6c; --dim:#7b968a;
    --line:#dde8e2; --line-soft:#e8f0eb;
    --ok:#0F814D; --wait:#8F6C04; --stop:#C2361E; --cool:#0b6ea8;
    --glow:0 1px 2px rgba(11,29,20,.05), 0 16px 40px -20px rgba(11,29,20,.3);
  }
}

*{box-sizing:border-box}
/* [hidden] MUST WIN. The browser's own `[hidden]{display:none}` is a
   single-attribute selector, so any class rule that sets display beats it
   — and .shell sets display:grid. The gate was correctly marked hidden and
   the desk chrome kept rendering straight through it: a signed-out visitor
   saw the rail, the tiles and the case skeletons. The attribute has to be
   the last word or it is decoration. */
[hidden]{display:none !important}
html,body{margin:0;background:var(--ground);color:var(--ink)}
body{font:15px/1.58 Manrope,ui-sans-serif,system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased}
.bi{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;vertical-align:-.14em}
a{color:var(--brand)}

/* ── the shell both pages share ───────────────────────────────────── */
.shell{display:grid;grid-template-columns:238px 1fr;min-height:100vh}
@media (max-width:900px){.shell{grid-template-columns:1fr}}
.rail{background:linear-gradient(180deg,var(--sunk),var(--ground));
  border-right:1px solid var(--line);padding:20px 16px;display:flex;
  flex-direction:column;gap:22px}
@media (max-width:900px){.rail{border-right:0;border-bottom:1px solid var(--line)}}
.brandline{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.brandline img{width:32px;height:32px;border-radius:9px}
.brandline b{font:700 17px/1 Poppins,Manrope,sans-serif;letter-spacing:-.01em}
.brandline small{display:block;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--dim);margin-top:3px}
.who{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:13px 14px}
.who .nm{font:600 15px/1.2 Poppins,Manrope,sans-serif;overflow-wrap:anywhere}
.who .sub{font-size:11.5px;color:var(--mute);margin-top:3px;overflow-wrap:anywhere}
.who .pill{display:inline-flex;align-items:center;gap:5px;margin-top:9px;font:700 10px/1 Manrope;
  letter-spacing:.1em;text-transform:uppercase;color:var(--brand);
  background:rgba(24,201,121,.1);border:1px solid rgba(24,201,121,.28);
  border-radius:999px;padding:5px 9px}
.menu{display:flex;flex-direction:column;gap:3px}
.menu a,.menu button{display:flex;align-items:center;gap:10px;padding:10px 11px;border-radius:10px;
  color:var(--mute);text-decoration:none;font:600 13.5px/1 Manrope;cursor:pointer;
  background:none;border:0;width:100%;text-align:left}
.menu a:hover,.menu button:hover{background:var(--card);color:var(--ink)}
.menu a[aria-current="true"],.menu button[aria-current="true"]{background:var(--raised);color:var(--ink)}
.menu .bi{font-size:16px;opacity:.9}
.railfoot{margin-top:auto;font-size:11px;color:var(--dim);line-height:1.5}

.main{padding:26px 28px 70px;min-width:0}
@media (max-width:560px){.main{padding:20px 16px 60px}}
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;
  margin-bottom:20px}
h1{font:600 clamp(22px,3.2vw,30px)/1.15 Poppins,Manrope,sans-serif;margin:0;letter-spacing:-.02em;
  text-wrap:balance}
.head p{margin:5px 0 0;color:var(--mute);font-size:13.5px}
.sec{font:800 10.5px/1 Manrope;letter-spacing:.15em;text-transform:uppercase;color:var(--dim);
  margin:0 0 11px}

/* ── metrics ──────────────────────────────────────────────────────── */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:12px;
  margin-bottom:22px}
.tile{position:relative;background:
    radial-gradient(120% 140% at 0% 0%, rgba(24,201,121,.09), transparent 60%), var(--card);
  border:1px solid var(--line);border-radius:15px;padding:15px 16px;overflow:hidden}
.tile .ic{font-size:17px;color:var(--brand);opacity:.85}
.tile b{display:block;font:700 27px/1.05 Poppins,Manrope,sans-serif;margin:9px 0 2px;
  letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.tile span{font-size:11.5px;color:var(--mute)}
.tile.warn .ic,.tile.warn b{color:var(--wait)}

/* ── case cards ───────────────────────────────────────────────────── */
.cases{display:flex;flex-direction:column;gap:11px}
.case{background:var(--card);border:1px solid var(--line);border-radius:15px;
  overflow:hidden;transition:border-color .2s ease,transform .18s ease}
.case:hover{border-color:rgba(24,201,121,.35);transform:translateY(-1px)}
.case>.row{display:flex;align-items:center;gap:14px;padding:14px 16px;cursor:pointer;width:100%;
  background:none;border:0;color:inherit;text-align:left;font:inherit}
.case .nm{flex:1;min-width:0}
.case .nm b{display:block;font:600 15.5px/1.25 Poppins,Manrope,sans-serif;overflow-wrap:anywhere}
.case .nm span{display:block;font-size:12px;color:var(--mute);margin-top:2px}
.amt{font:700 15px/1 Manrope;font-variant-numeric:tabular-nums;white-space:nowrap}
.st{font:700 10px/1 Manrope;letter-spacing:.09em;text-transform:uppercase;border-radius:999px;
  padding:6px 10px;border:1px solid currentColor;white-space:nowrap}
.st.ok{color:var(--ok)} .st.wait{color:var(--wait)} .st.stop{color:var(--stop)}
.st.cool{color:var(--cool)}
.chev{color:var(--dim);transition:transform .22s ease;font-size:15px}
.case[open] .chev{transform:rotate(90deg)}

.body{border-top:1px solid var(--line-soft);padding:16px;background:var(--sunk);display:none}
.case[open] .body{display:block;animation:drop .26s cubic-bezier(.2,.8,.3,1) both}
@keyframes drop{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .case[open] .body{animation:none}
  .case:hover{transform:none}
}

.answer-h{font:800 10.5px/1 Manrope;letter-spacing:.14em;text-transform:uppercase;
  color:var(--brand);margin:0 0 10px}
.lenders{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:9px}
.lender{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:11px 13px;
  display:flex;align-items:center;gap:11px}
.lender .ic{font-size:17px;color:var(--brand);opacity:.8;flex:none}
.lender b{display:block;font:600 14px/1.2 Manrope}
.lender span{display:block;font-size:11.5px;color:var(--mute);margin-top:2px;
  font-variant-numeric:tabular-nums}

/* THE BOUNDARY, STATED RATHER THAN HIDDEN. A partner who notices a gap and
   is not told why assumes the worst. Told plainly, it reads as a company
   that knows what it owns. */
.wall{margin-top:14px;border:1px dashed var(--line);border-radius:12px;padding:12px 14px;
  display:flex;gap:11px;align-items:flex-start}
.wall .ic{font-size:16px;color:var(--dim);flex:none;margin-top:2px}
.wall p{margin:0;font-size:12.5px;color:var(--mute)}
.wall b{color:var(--ink);font-weight:600}

.payout{margin-top:14px;display:flex;gap:16px;flex-wrap:wrap;padding-top:13px;
  border-top:1px solid var(--line-soft)}
.payout div span{display:block;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--dim)}
.payout div b{font:700 15px/1.3 Manrope;font-variant-numeric:tabular-nums}

.note{margin-top:24px;border:1px solid var(--line);border-left:3px solid var(--brand);
  border-radius:0 14px 14px 0;background:var(--card);padding:15px 17px}
.note b{display:block;margin-bottom:5px;font:600 15px/1.3 Poppins,Manrope,sans-serif}
.note p{margin:0;font-size:13.5px;color:var(--mute)}
.note.stop{border-left-color:var(--stop)}
.note.wait{border-left-color:var(--wait)}

/* ── THE CITY PICKER ──────────────────────────────────────────────────
   field-pickers.js builds this menu and crm.css already styles it — but
   against ITS tokens (--card-bg, --border-glass, --text-muted), none of
   which exist on this page. Left alone the menu would fall through to
   light fallbacks: a white list on a dark form, which is exactly the
   failure the partner panel's flagged rows had this morning. Same rules,
   this page's tokens. */
.mn-pick{
  position:absolute; z-index:40; left:0; right:0; top:100%;
  margin-top:3px; max-height:232px; overflow-y:auto;
  background:var(--raised); color:var(--ink);
  border:1px solid var(--line); border-radius:11px;
  box-shadow:0 14px 34px -10px rgba(0,0,0,.7);
}
.mn-pick-row{
  display:flex; align-items:baseline; gap:8px; width:100%;
  padding:9px 12px; border:0; background:transparent; cursor:pointer;
  font:inherit; font-size:14px; text-align:left; color:inherit;
}
.mn-pick-row + .mn-pick-row{ box-shadow:0 -1px 0 var(--line-soft); }
.mn-pick-row b{ font-weight:700; }
.mn-pick-row span{ font-size:11.5px; color:var(--mute); }
.mn-pick-row:hover,
.mn-pick-row.is-at{ background:rgba(24,201,121,.12); }
.mn-pick-note{ margin:4px 0 0; font-size:11.5px; line-height:1.5; color:var(--mute); }
.mn-pick-note.is-ok{ color:var(--brand); }
.mn-pick-note.is-warn{ color:var(--wait); }

/* ── the door: a single centred column ────────────────────────────── */
.door{max-width:1040px;margin:0 auto;padding:30px 20px 80px}
@media (max-width:560px){.door{padding:22px 16px 60px}}
.doorhead{display:flex;align-items:center;justify-content:space-between;gap:14px;
  flex-wrap:wrap;margin-bottom:38px}
.hero h1{font:600 clamp(28px,5vw,46px)/1.08 Poppins,Manrope,sans-serif;letter-spacing:-.025em;
  margin:0 0 14px;max-width:16ch}
.hero .lede{font-size:clamp(15px,1.9vw,18px);color:var(--mute);margin:0;max-width:56ch}
.hero .lede b{color:var(--ink);font-weight:600}

.pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));gap:13px;
  margin:34px 0 10px}
.pillar{background:var(--card);border:1px solid var(--line);border-radius:15px;padding:17px 18px}
.pillar .ic{font-size:19px;color:var(--brand);opacity:.9}
.pillar b{display:block;margin:11px 0 6px;font:600 16px/1.25 Poppins,Manrope,sans-serif}
.pillar p{margin:0;font-size:13.5px;color:var(--mute)}

/* ── forms ────────────────────────────────────────────────────────── */
.panel{background:var(--card);border:1px solid var(--line);border-radius:17px;padding:22px 22px 24px;
  box-shadow:var(--glow);max-width:620px}
@media (max-width:560px){.panel{padding:18px 16px 20px}}
.panel h2{font:600 19px/1.25 Poppins,Manrope,sans-serif;margin:0 0 5px;letter-spacing:-.01em}
.panel .sub{margin:0 0 18px;font-size:13.5px;color:var(--mute)}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:13px}
@media (max-width:520px){.fields{grid-template-columns:1fr}}
.f{display:flex;flex-direction:column;gap:6px;min-width:0}
.f.wide{grid-column:1/-1}
.f label{font:600 11.5px/1 Manrope;letter-spacing:.07em;text-transform:uppercase;color:var(--dim)}
.f input,.f select,.f textarea{
  font:inherit;font-size:14.5px;padding:11px 12px;border-radius:11px;
  border:1px solid var(--line);background:var(--sunk);color:var(--ink);width:100%}
.f textarea{resize:vertical;min-height:84px}
.f input:focus,.f select:focus,.f textarea:focus{outline:2px solid var(--brand);outline-offset:-1px}
.f .hint{font-size:11.5px;color:var(--dim)}
.f .err{font-size:12px;color:var(--stop);display:none}
.f.bad input,.f.bad select,.f.bad textarea{border-color:var(--stop)}
.f.bad .err{display:block}

.btn{font:inherit;font-weight:700;font-size:14.5px;padding:12px 20px;border-radius:12px;
  border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;
  display:inline-flex;align-items:center;gap:9px}
.btn:hover:enabled{background:var(--raised)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn--go{background:var(--brand);border-color:transparent;color:#04180e}
.btn--go:hover:enabled{filter:brightness(1.07);background:var(--brand)}
.btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px;align-items:center}

.msg{margin-top:16px;border-radius:12px;padding:13px 15px;font-size:13.5px;
  border:1px solid var(--line);background:var(--sunk);color:var(--mute);display:none}
.msg.on{display:block}
.msg.bad{border-color:var(--stop);color:var(--stop)}
.msg.good{border-color:var(--brand);color:var(--ink)}
.msg b{color:var(--ink)}

.state{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--mute)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--mute);flex:none}
.dot.ok{background:var(--ok)} .dot.wait{background:var(--wait)} .dot.stop{background:var(--stop)}

.empty{border:1px dashed var(--line);border-radius:15px;padding:30px 24px;text-align:center;
  color:var(--mute)}
.empty .ic{font-size:26px;color:var(--dim);display:block;margin-bottom:10px}
.empty b{display:block;color:var(--ink);font:600 16px/1.3 Poppins,Manrope,sans-serif;margin-bottom:6px}
.empty p{margin:0 auto;max-width:46ch;font-size:13.5px}

.skel{height:72px;border-radius:15px;background:var(--card);border:1px solid var(--line);
  position:relative;overflow:hidden}
.skel::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.045),transparent);
  animation:sweep 1.25s infinite}
@keyframes sweep{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){.skel::after{animation:none}}