/* ── Moneyed site header ───────────────────────────────────────────────────
   One row on every screen. Above 1000px the links sit in the bar; below it
   they move into a drawer behind a burger, because five links plus a brand
   plus actions cannot share 375px without wrapping into the three-row,
   202px-tall block this replaces. !important is kept on the structural
   properties: this header is injected into pages that carry their own
   .mn-refresh-header layout rules. */
.moneyed-site-nav{
  --sn-bg:#f5faf7;--sn-ink:#082c24;--sn-muted:#446555;--sn-line:#c8dece;
  --sn-accent:#087443;--sn-hover:#0874430f;--sn-gutter:max(20px,calc((100vw - 1136px)/2));
  box-sizing:border-box!important;display:flex!important;align-items:center!important;
  justify-content:space-between!important;flex-wrap:nowrap!important;gap:20px!important;
  width:100%!important;max-width:none!important;margin:0!important;
  padding:14px var(--sn-gutter)!important;
  background:var(--sn-bg)!important;color:var(--sn-ink)!important;
  position:relative!important;top:auto!important;z-index:100!important;
  border-bottom:1px solid var(--sn-line);
  font:500 13px/1.5 Inter,system-ui,sans-serif;
}
[data-theme=dark] .moneyed-site-nav{--sn-bg:#10271e;--sn-ink:#f0faf4;--sn-muted:#b8d9c7;--sn-line:#42624f;--sn-accent:#5fd49a;--sn-hover:#5fd49a1a;}
.moneyed-site-nav a,.moneyed-site-nav button,.moneyed-site-nav summary{color:var(--sn-ink)!important;text-decoration:none;font:inherit;}

/* Brand */
/* flex:none here meant the brand was FORBIDDEN TO SHRINK, and that is
   what pushed this nav past the right edge of every phone. Measured at
   390px on a sub-page: back 38 + margin 8 + gap 12 + brand 227 + gap 12
   + actions 90 + padding 32 = 419 needed against 374 available, so the
   theme and burger buttons sat 29px outside the nav and 13px outside the
   screen. body{overflow-x:hidden} swallowed the sideways scroll, which
   is why nobody could see it — the buttons were simply cut off.

   The homepage escaped only by luck: it has no back button, which left
   it ending at exactly 374, with zero slack. Any page with a back arrow
   overflowed, which is every page except the homepage.

   0 1 auto lets the brand give way when the row is short. It is the
   backstop, not the fix — the fix is dropping the tagline on phones,
   below. This exists so that a longer wordmark, a wider font or one more
   button in the actions can never push the nav off screen again. */
.moneyed-site-nav .ms-brand{display:flex;gap:10px;align-items:center;flex:0 1 auto;min-width:0;font-size:24px;font-weight:800;letter-spacing:-1px;line-height:1;}
.moneyed-site-nav .ms-brand>span{min-width:0;overflow:hidden;}
.ms-brand img{display:block;flex:none;width:34px;height:34px;}
.ms-brand small{display:block;font:600 8.5px/1.4 Inter,system-ui,sans-serif;letter-spacing:.55px;text-transform:uppercase;color:var(--sn-muted);margin-top:2px;}

/* Links */
.moneyed-site-nav .ms-links{display:flex!important;align-items:center;gap:4px!important;font-size:13px!important;}
.moneyed-site-nav .ms-links>a,.moneyed-site-nav .ms-links summary{position:relative;display:flex;align-items:center;padding:9px 11px;border-radius:9px;white-space:nowrap;transition:background .18s ease;}
.moneyed-site-nav .ms-links>a::after{content:'';position:absolute;left:11px;right:11px;bottom:4px;height:2px;border-radius:2px;background:var(--sn-accent);transform:scaleX(0);transform-origin:left;transition:transform .22s cubic-bezier(.4,0,.2,1);}
.moneyed-site-nav .ms-links>a:hover::after,.moneyed-site-nav .ms-links>a[aria-current=page]::after{transform:scaleX(1);}
.moneyed-site-nav .ms-links>a:hover,.moneyed-site-nav .ms-links summary:hover{background:var(--sn-hover);}
.moneyed-site-nav .ms-links>a[aria-current=page]{font-weight:700;}
.ms-drawer-foot{display:none;}

/* Dropdowns */
.ms-menu{position:relative;}
.ms-menu summary{cursor:pointer;list-style:none;gap:7px;}
.ms-menu summary::-webkit-details-marker{display:none;}
.ms-chev{flex:none;width:10px;height:10px;transition:transform .2s ease;}
.ms-menu[open] .ms-chev{transform:rotate(180deg);}
.ms-menu-panel{position:absolute;top:calc(100% + 8px);left:0;min-width:240px;padding:8px;border:1px solid var(--sn-line);border-radius:14px;background:var(--sn-bg);box-shadow:0 18px 44px #0b2a1e22,0 2px 6px #0b2a1e14;display:grid;gap:1px;z-index:101;animation:ms-pop .18s cubic-bezier(.3,.9,.4,1);}
@keyframes ms-pop{from{opacity:0;transform:translateY(-6px);}}
.ms-menu-panel a,.ms-menu-panel button{display:block;width:100%;padding:9px 11px;text-align:left;border:0;border-radius:8px;background:transparent;cursor:pointer;font-size:13px;}
.ms-menu-panel a:hover,.ms-menu-panel button:hover{background:var(--sn-hover);}
/* The line above sets display:block on every link in this panel, and a
   bare [hidden] attribute loses to it — the element goes on rendering
   while JavaScript believes it is gone. That exact collision has already
   cost this project one shipped bug, so the rule is written out. */
.ms-menu-panel a[hidden],.ms-menu-panel button[hidden]{display:none!important;}

/* ── A LINE UNDER THE NAME, IN THE PHONE DRAWER ONLY ──────────────────────
   Added 24 Oct 2026. Purely additive: it styles an element that did not
   exist before and touches no existing rule.

   Hidden here, shown inside the max-width:1199px block further down. On a
   wide screen .ms-links is a horizontal bar and a second line would either
   stretch it or wrap it — the desktop header must stay exactly as it is.
   Below 999px the same links become a stacked drawer with room to spare. */
.moneyed-site-nav .ms-links>a.ms-has-sub small{display:none;}

/* The dropdown's own sublabels already had a style (.ms-menu-panel small,
   written for the login menu). On a PHONE that panel paints every link in
   --sn-muted, so a muted line under a muted name reads as one grey block.
   This lifts the name back, and only there. */
@media(max-width:1199px){
  .ms-links .ms-menu-panel a{line-height:1.35;}
  .ms-links .ms-menu-panel a small{color:var(--sn-muted);opacity:.85;}
}
.ms-menu-panel small{display:block;font-size:10.5px;color:var(--sn-muted);margin-top:3px;font-weight:500;}
.ms-login{left:auto;right:0;width:258px;}

/* Actions */
.ms-actions{display:flex;gap:10px;align-items:center;flex:none;}
.ms-actions>.ms-menu>summary{border:1px solid var(--sn-line);border-radius:10px;padding:9px 13px;min-height:40px;box-sizing:border-box;display:flex;align-items:center;gap:7px;transition:border-color .18s ease,background .18s ease;}
.ms-actions>.ms-menu>summary:hover{border-color:var(--sn-accent);background:var(--sn-hover);}
.ms-theme,.ms-burger{display:flex;align-items:center;justify-content:center;flex:none;width:40px;height:40px;padding:0;border:1px solid var(--sn-line);border-radius:50%;background:transparent;cursor:pointer;transition:border-color .18s ease,background .18s ease;}
.ms-theme:hover,.ms-burger:hover{border-color:var(--sn-accent);background:var(--sn-hover);}
.ms-theme svg{width:17px;height:17px;}

/* Burger — three bars that fold into a cross */
.ms-burger{display:none;border-radius:12px;}
.ms-burger i{position:relative;display:block;width:17px;height:1.8px;border-radius:2px;background:currentColor;transition:transform .26s cubic-bezier(.4,0,.2,1),opacity .18s ease;}
.ms-burger i::before,.ms-burger i::after{content:'';position:absolute;left:0;width:17px;height:1.8px;border-radius:2px;background:currentColor;transition:transform .26s cubic-bezier(.4,0,.2,1);}
.ms-burger i::before{top:-5.5px;}.ms-burger i::after{top:5.5px;}
.ms-burger[aria-expanded=true] i{transform:rotate(45deg);}
.ms-burger[aria-expanded=true] i::before{transform:translateY(5.5px) rotate(-90deg);}
.ms-burger[aria-expanded=true] i::after{transform:translateY(-5.5px) rotate(-90deg);opacity:0;}

.moneyed-site-nav :focus-visible{outline:3px solid var(--sn-accent);outline-offset:3px;}

/* ── Drawer: phone and tablet ─────────────────────────────────────────── */
@media(max-width:1199px){
  .moneyed-site-nav{padding:11px max(16px,env(safe-area-inset-left))!important;gap:12px!important;}
  .ms-brand{font-size:21px;}
  .ms-brand img{width:30px;height:30px;}
  .ms-burger{display:flex;}
  .ms-actions>.ms-menu{display:none;}
  .moneyed-site-nav .ms-links{
    position:absolute;top:100%;left:0;right:0;z-index:102;
    display:block!important;padding:6px 16px calc(96px + env(safe-area-inset-bottom));
    background:var(--sn-bg);border-bottom:1px solid var(--sn-line);
    box-shadow:0 22px 40px #0b2a1e1f;
    max-height:calc(100dvh - var(--sn-h,62px));overflow-y:auto;overscroll-behavior:contain;
    opacity:0;visibility:hidden;transform:translateY(-10px);
    transition:opacity .22s ease,transform .26s cubic-bezier(.4,0,.2,1),visibility .22s;
  }
  .moneyed-site-nav.ms-open .ms-links{opacity:1;visibility:visible;transform:none;}
  .moneyed-site-nav .ms-links>a,.moneyed-site-nav .ms-links summary{
    display:flex;justify-content:space-between;padding:14px 4px;border-radius:0;
    border-bottom:1px solid var(--sn-line);font-size:15px;font-weight:600;white-space:normal;
  }
  .moneyed-site-nav .ms-links>a::after{display:none;}
  .moneyed-site-nav .ms-links>a[aria-current=page]{color:var(--sn-accent)!important;}
  /* The drawer link is a flex row with space-between, so a <small> child
     would sit to the RIGHT of the name on the same line. Only the links
     that carry one become a column; the rest keep the row they have. */
  .moneyed-site-nav .ms-links>a.ms-has-sub{
    flex-direction:column;align-items:flex-start;gap:3px;
  }
  .moneyed-site-nav .ms-links>a.ms-has-sub small{
    display:block;font-size:11.5px;font-weight:500;line-height:1.45;
    color:var(--sn-muted);white-space:normal;
  }
  .ms-links .ms-menu{position:static;}
  .ms-links .ms-menu-panel{position:static;min-width:0;width:auto;padding:4px 0 10px 12px;border:0;border-bottom:1px solid var(--sn-line);border-radius:0;background:transparent;box-shadow:none;animation:none;}
  .ms-links .ms-menu-panel a{padding:11px 8px;font-size:14px;color:var(--sn-muted)!important;}
  .ms-drawer-foot{display:grid;gap:8px;margin-top:18px;}
  .ms-drawer-foot a,.ms-drawer-foot button{display:block;width:100%;box-sizing:border-box;padding:13px 16px;border:1px solid var(--sn-line);border-radius:12px;background:transparent;text-align:left;font:600 14px/1.4 Inter,system-ui,sans-serif;cursor:pointer;}
  .ms-drawer-foot a{background:var(--sn-accent);border-color:var(--sn-accent);color:#fff!important;}
  .ms-drawer-foot small{display:block;margin-top:3px;font-size:11px;font-weight:500;opacity:.85;}
}
/* THE TAGLINE IS THE WIDEST THING IN THIS NAV. "Your Money, Your Future"
   sets at 187px — wider than the wordmark above it, so it alone decides
   how much room the brand takes. Dropping it returns about 87px, against
   the 29px the row was short by.

   This rule already existed at max-width:360px. Somebody had found the
   same culprit and set the threshold at an iPhone SE. But the nav needs
   419px to hold the tagline, so EVERY phone was over: 390 (iPhone 15),
   393 (Pixel), 412, 414, 430 (Pro Max). The rule was right and it was
   simply reaching too few screens to ever fire.

   560px is this file's own phone breakpoint, used by the drawer footer
   below. The wordmark stays at every width; only the sub-line goes, and
   only where it does not fit. */
@media(max-width:560px){.ms-brand small{display:none;}}
@media(prefers-reduced-motion:reduce){.moneyed-site-nav *,.moneyed-site-nav *::before,.moneyed-site-nav *::after{transition-duration:.01ms!important;animation-duration:.01ms!important;}}

/* Employee-access dialog */
.ms-dialog{max-width:440px;width:calc(100% - 40px);border:1px solid #c8dece;border-radius:20px;padding:32px;color:#082c24;background:#f5faf7;box-sizing:border-box;}
.ms-dialog::backdrop{background:#041910aa;}
.ms-dialog p{font:14px/1.7 system-ui;}
.ms-dialog h2{font:700 28px system-ui;}
.ms-dialog-close{position:absolute;right:15px;top:10px;border:0;background:none;font-size:25px;cursor:pointer;}
.ms-dialog-done{padding:12px 20px;background:#087443;color:white;border:0;border-radius:8px;cursor:pointer;}
.ms-kicker{font-size:10px!important;letter-spacing:2px;}

/* Back, on the standalone tool pages. Sits before the brand because that is
   where a reader's eye already goes to leave. It ships as a <button> when
   there is a same-origin page to return to and as an <a> to the home page
   otherwise, so this rule has to dress both — see site-navigation.js. */
.moneyed-site-nav .ms-back{
  display:flex;align-items:center;gap:6px;flex:none;
  margin-right:10px;padding:8px 12px 8px 9px;border-radius:9px;
  border:1px solid var(--sn-line);background:transparent;color:var(--sn-ink);
  font:700 13px/1 inherit;font-family:inherit;cursor:pointer;
  text-decoration:none;                 /* the <a> form must not underline */
  transition:background .18s ease,border-color .18s ease;
}
.moneyed-site-nav .ms-back:hover{background:var(--sn-hover);border-color:var(--sn-accent);}
.moneyed-site-nav .ms-back:focus-visible{outline:2px solid var(--sn-accent);outline-offset:2px;}
.moneyed-site-nav .ms-back svg{width:15px;height:15px;flex:none;}
@media (max-width:560px){
  /* The word goes, the target does not: 38px square still clears a thumb. */
  .moneyed-site-nav .ms-back span{display:none;}
  .moneyed-site-nav .ms-back{padding:0;width:38px;height:38px;justify-content:center;margin-right:8px;}
}

/* ── BACK TO THE TOP ──────────────────────────────────────────────────────
   Added 24 Oct 2026. Stacked directly ABOVE the WhatsApp button rather than
   beside it, using that button's own offsets so the two always move
   together — style.css puts it at bottom:26px/right:22px on a wide screen
   and bottom:calc(92px + safe-area)/right:12px once the bottom bar appears.
   If those ever change, these must change with them.

   z-index 60 is the WhatsApp button's own layer: above the page, below the
   bottom nav (1000) and far below any dialog. */
.ms-top{
  position:fixed; right:22px; bottom:calc(26px + 56px + 12px);
  width:46px; height:46px; z-index:60;
  display:grid; place-items:center;
  border:1px solid var(--sn-line, #c8dece); border-radius:50%;
  background:var(--sn-bg, #f5faf7); color:var(--sn-accent, #087443);
  box-shadow:0 6px 18px #0b2a1e1f;
  cursor:pointer; padding:0;
  opacity:0; visibility:hidden; transform:translateY(8px) scale(.94);
  transition:opacity .22s ease, transform .26s cubic-bezier(.4,0,.2,1), visibility .22s;
}
.ms-top.is-on{ opacity:1; visibility:visible; transform:none; }
.ms-top svg{ width:21px; height:21px; display:block; }
.ms-top:hover{ border-color:var(--sn-accent, #087443); background:var(--sn-hover, #0874430f); }
.ms-top:active{ transform:scale(.95); }
.ms-top:focus-visible{ outline:2px solid var(--sn-accent, #087443); outline-offset:3px; }
[data-theme=dark] .ms-top{
  background:#10271e; border-color:#42624f; color:#5fd49a; box-shadow:0 6px 18px #0006;
}
@media(max-width:1199px){
  /* Clears the bottom nav AND the WhatsApp button that sits on top of it. */
  .ms-top{ right:12px; bottom:calc(92px + 46px + 10px + env(safe-area-inset-bottom, 0px)); }
}
@media(prefers-reduced-motion:reduce){
  .ms-top{ transition:opacity .01ms; transform:none; }
  .ms-top.is-on{ transform:none; }
}

/* ── WHO IS SIGNED IN, AND WHICH DOOR IS THEIRS ───────────────────────────
   Nakul, 30 Oct 2026. The Login button used to say "Login" to somebody who
   already was. It now carries their first name and which realm they are in,
   and the menu beneath it drops the two doors that are not theirs. */
.ms-realm{font-size:10.5px;font-weight:700;letter-spacing:.055em;text-transform:uppercase;
  padding:2px 7px;border-radius:999px;background:var(--sn-hover);color:var(--sn-accent);
  line-height:1.5;}
.ms-whoami{display:block;padding:11px 14px 10px;border-bottom:1px solid var(--sn-line);
  font-weight:650;font-size:14px;line-height:1.3;}
.ms-whoami small{display:block;font-weight:400;font-size:12px;color:var(--sn-muted);
  margin-top:2px;overflow:hidden;text-overflow:ellipsis;}
.ms-signout{display:block;width:100%;text-align:left;font:inherit;font-size:14px;
  padding:11px 14px;border:0;border-top:1px solid var(--sn-line);background:transparent;
  color:var(--sn-ink);cursor:pointer;}
.ms-signout:hover{background:var(--sn-hover);}
/* A door that is not open yet still has to look like a door, or people keep
   pressing it. Dimmed, not hidden: hiding it would read as "there is no
   partner programme", and there is — it is coming. */
.ms-soon{display:block;padding:11px 14px;font-size:14px;color:var(--sn-muted);cursor:default;}
.ms-soon small{display:block;font-size:12px;margin-top:2px;color:var(--sn-accent);
  font-weight:600;}

/* ── [hidden] HAS TO ACTUALLY HIDE, EVERYWHERE IN THIS HEADER ─────────────
   5 Nov 2026. Measured on the live site: "Employee portal" was visible to
   every signed-out visitor, on the phone and on the desktop. The script
   sets el.hidden=true and believes it is done, but the UA sheet's
   [hidden]{display:none} is one class less specific than our own
   .ms-links>a{display:flex}, so the link went on rendering.
   It ran the other way too: Membership is customer material and is meant
   to disappear for staff. It never did.
   The two <details> menus DID hide, which is why this looked like a script
   bug rather than a stylesheet one — they hide only because nothing here
   styles a bare <details>. Of the four things this header hides, the two
   with a display rule on them were both broken and the two without were
   both fine.
   The .ms-menu-panel rule further up was the same fix made narrow, for one
   panel. Written once for the whole header instead: anything in this nav
   carrying the attribute is gone, whatever else claims a display. */
.moneyed-site-nav[hidden],.moneyed-site-nav [hidden]{display:none!important;}

/* ── THE QUIET ROW BESIDE THE FOUR DOORS ──────────────────────────────────
   9 Nov 2026, with the four-door header. About us, Contact, Membership,
   Book a call and Your overview are not doors — nobody arrives at a
   lending site looking for "About us" — so they are smaller, muted, and
   fenced off by a hairline instead of sitting in the same row at the same
   weight. Five more names at door weight is the clutter he asked me to
   take out.

   NOT .ms-drawer-foot, which is still above in this file. That class
   paints its links as solid accent buttons because it was the login CTA's
   styling, and nothing has emitted it since the login doors came off on
   9 Nov 2026. Five green buttons would shout over the four doors.

   The colour needs !important because line 21 of this file sets
   .moneyed-site-nav a{color:var(--sn-ink)!important} on every link here.

   These links are NOT direct children of .ms-links, so the underline
   sweep on .ms-links>a::after does not reach them. That is deliberate:
   the sweep is what marks a door. */
.moneyed-site-nav .ms-utility{
  display:flex;align-items:center;gap:0;
  margin-left:4px;padding-left:9px;border-left:1px solid var(--sn-line);
}
.moneyed-site-nav .ms-utility a{
  padding:8px 8px;border-radius:8px;white-space:nowrap;
  font-size:12px;font-weight:500;color:var(--sn-muted)!important;
  transition:background .18s ease,color .18s ease;
}
.moneyed-site-nav .ms-utility a:hover{background:var(--sn-hover);color:var(--sn-ink)!important;}
.moneyed-site-nav .ms-utility a[aria-current=page]{color:var(--sn-ink)!important;font-weight:700;}
/* These carry a <small> in the tools array; the quiet row has no room for
   it and toolBare() already omits it. Belt and braces, in case a future
   entry is added with link(...t) by habit. */
.moneyed-site-nav .ms-utility a small{display:none;}

/* In the drawer the row stops being a row: it stacks under the four doors
   as a plainer list, so a thumb gets the same 48px target as everything
   else and the four doors still read as the headline. */
@media(max-width:1199px){
  .moneyed-site-nav .ms-utility{
    display:grid;gap:0;margin:2px 0 0;padding:0;border-left:0;
  }
  .moneyed-site-nav .ms-utility a{
    padding:14px 4px;border-radius:0;font-size:14px;
    border-bottom:1px solid var(--sn-line);
  }
  .moneyed-site-nav .ms-utility a:last-child{border-bottom:0;}
}

/* The Book a call control in .ms-actions. Same box as the dropdown summary
   that used to live in this row, so the bar's right-hand side keeps the
   height and radius it has always had. Bordered rather than filled, on
   purpose — see the comment at its emit site. */
.moneyed-site-nav .ms-cta{
  display:flex;align-items:center;flex:none;min-height:40px;box-sizing:border-box;
  padding:9px 15px;border:1px solid var(--sn-line);border-radius:10px;
  font-size:13px;font-weight:700;white-space:nowrap;
  transition:border-color .18s ease,background .18s ease;
}
.moneyed-site-nav .ms-cta:hover{border-color:var(--sn-accent);background:var(--sn-hover);}

/* ── THE WORDMARK IS NOT NEGOTIABLE, THE TAGLINE IS ───────────────────
   9 Nov 2026. .ms-brand was flex:0 1 auto with overflow:hidden on its
   text, so whenever the bar ran short the BRAND paid for it. Measured on
   the live moneyed.co.in, before any of today's work: the name rendered
   as "mone" at 1280px and the tagline wrapped to three lines, 78px of
   clip at 1280 and 147px at 1000. That is the squash I failed to explain
   earlier today when I was looking at the logo image; the image was never
   the problem, the flex basis of the text beside it was.

   The rule above this one already knew the culprit — "THE TAGLINE IS THE
   WIDEST THING IN THIS NAV", 187px against a 110px wordmark — and hid it
   at max-width:560px. The threshold was simply far too low: the bar is
   short of room on a 1280px laptop, not only on a phone.

   So: the brand never shrinks, and the tagline appears only where it
   genuinely fits. 1500px is measured, not chosen — below it the four
   doors, the quiet row and Book a call leave less than 187px over. */
.moneyed-site-nav .ms-brand{flex:none;}
.moneyed-site-nav .ms-brand small{display:none;}
@media(min-width:1500px){.moneyed-site-nav .ms-brand small{display:block;}}

/* And the bar's own side padding gives way before anything else does.
   72px a side is 144px of the row spent on nothing; on a wide screen it
   is the margin that makes the header look composed, and between 1200
   and 1400 it is the difference between fitting and clipping. */
@media(max-width:1399px){
  .moneyed-site-nav{padding-left:max(28px,env(safe-area-inset-left))!important;
                    padding-right:max(28px,env(safe-area-inset-right))!important;}
}

/* The drawer's own Book a call — see the comment at its emit site. These
   two rules are a pair: whichever width you are at, exactly one of the
   two controls is on screen, never both and never neither. */
.moneyed-site-nav .ms-drawer-only{display:none!important;}
@media(max-width:560px){
  .moneyed-site-nav .ms-cta{display:none;}
  .moneyed-site-nav .ms-utility a.ms-drawer-only{display:block!important;}
}

/* A door opens onto a named list, so the list has to be readable. At the
   240px this panel has always been, "Every lender's rates, each linked to
   the source" wrapped to three lines and the Loans & cards panel stood
   392px tall. 300px holds every subline in this menu in one or two.

   Desktop only — in the drawer the panel is full width already, and
   min-width there would push the page sideways. Measured: the rightmost
   door (Learn) opens at x=752 on a 1280px screen, so 300px of panel ends
   at 1052 with room to spare. */
@media(min-width:1200px){
  .moneyed-site-nav .ms-links .ms-menu-panel{min-width:300px;}
}