/* gw-chrome.css — GENERATED. Do not edit this file.

   Source of truth: `_GWE_CHROME_CSS` in galaxywarden_full/templates/shared.py.
   Regenerate:      python3 scripts/build_gw_chrome.py
   Guard:           tests/test_gw_chrome_css_is_the_generated_artefact.py

   Every value below is the RESOLVED gw-editorial.css :root variable rather
   than a var(), because --gw-* is undefined on .sx pages and this copy IS the
   masthead styling there. Do not rewrite them to var() without measuring a .sx
   route.
   ------------------------------------------------------------------------ */

/* --gw-focus is declared HERE as well as in gw-editorial.css's dark-surface
   block: this copy is what makes the ring survive on .sx pages, which never
   load that stylesheet. Without it the bar's own tab stops keep the paper
   ring (#111316 on #2E2D2E = 1.36:1). */
/* WS-2026-08-08 (Brandon) — was rgba(10,10,11,.85)+blur, matching the old
   gw-editorial.css value. On .sx pages (terms, executive, vs/*, this copy
   IS the styling — see the block comment above) that translucent tint had
   nothing to blend with above the fold, so the bar read as a solid white
   band instead of black, same as the .gwe pages. Now opaque: #0a0a0b, same
   base colour as before. MUST MATCH `.gwe .masthead` in gw-editorial.css —
   the WS42 note below is the reason this pair has to move together. */
/* No backdrop-filter here. The band paints #0a0a0b at alpha 1, so the blur
   had nothing to blur: it covered its own backdrop completely and only cost a
   compositing layer. It was not free, either — a backdrop-filter promotes the
   sticky header to its own layer, and the impeccable detector reads any
   backdrop-filter ancestor as "this text sits on a composited surface" and
   moves the wordmark onto the screenshot contrast path, where the sticky
   header + captureBeyondViewport geometry measured "Warden" at 1.2:1. Measured
   directly at the real pixels it is 18.96:1 (#fafafa on #0a0a0b, 561 glyph
   pixels, single background value). Deleting the no-op removes the layer and
   the mismeasurement at once. If this band ever becomes translucent, the blur
   comes back WITH the alpha, not before it. */
.masthead{background:#0a0a0b;border-bottom:1px solid #26262d;position:sticky;top:0;z-index:50;--gw-focus:#F3F4F6;--gw-sys-color-focus:#F3F4F6;}
.masthead .wrap{max-width:1120px;margin:0 auto;padding:0 22px;}
.masthead .row{display:flex;align-items:center;gap:1.4rem;height:60px;}
/* WS42 — the masthead lockup overflowed the viewport on every route.
   Measured before the fix (Chromium, exact-width iframe, viewport width
   asserted): at 320px the row's content box is 240px wide while brand
   (146) + gap (8.8) + hamburger (44) + gap (8.8) + 'Run a free scan'
   (119) needs 327px. The CTA's right edge landed at 349-367px — clipped
   on seven pages, and on /executive + /vs/* (which are NOT .gwe pages, so
   sentinel.css's generic `.sx .row{padding:14px 18px}` also applied) it
   pushed the document itself to 366px: a horizontally scrollable page
   before a word had been read.
   Three cuts, smallest first: the row stops inheriting that stray 18px
   side padding, the wrap gutter tightens 22->12px below 430px, and the
   CTA takes a short label on phones. `min-width:0` on the row and brand
   is the guarantee — flex items default to min-width:auto and refuse to
   shrink below their content, which is what turned a tight fit into an
   overflow rather than a squeeze. After: 12px clearance at 320/360/390
   on every page family, zero page overflow, zero offenders. */
header.masthead .row{padding-left:0;padding-right:0;min-width:0;}
header.masthead .brand{min-width:0;}
.masthead .mcta-s{display:none;}
/* WS41 — the wordmark was the one piece of type on the page still set in the
   UI sans. Inter 800 at 18px reads as an app chrome label, not as a brand, and
   it sat next to a drawn mark that had clearly been considered — which is
   exactly the mismatch that got reported.
   It now uses --gw-disp (Space Grotesk), the same display face every heading
   on this surface already uses, at 500 rather than 800. The font is already
   self-hosted and already loaded here, so this costs no extra request.
   Mixed case is deliberate and load-bearing: the DRAWN lockup in
   static/brand/logo/ is all-caps ("GALAXYWARDEN"), so adopting it would change
   what the brand is called in the nav on every page. That is a brand decision,
   not a typographic one, and it is not this commit's to make. */
.masthead .brand{display:flex;align-items:center;gap:.6rem;font-family:var(--gw-disp,'Space Grotesk','Space Grotesk Fallback',sans-serif);font-weight:500;font-size:var(--gw-sys-type-lead-size,1.13rem);color:#fafafa;letter-spacing:-.02em;font-optical-sizing:auto;text-decoration:none;}
.masthead .brand:hover{text-decoration:none;}
.masthead .brand b{font-weight:500;color:#fafafa;}
/* WS40 — 'Warden' was the retired green-ink (lime-800). The wordmark is a
   name, not a datapoint, so it takes the surface's high ink and lets the
   weight carry the emphasis. WS39: the mark beside it IS now swapped — THE
   BREAK, owner-approved 31 July 2026. The explicit -white cut, not
   gw-mark.svg: that one is currentColor, which an <img> resolves to BLACK.
   2026-08-04, owner-approved: same drawing, but the SQUARE cut
   (gw-mark-square-white.svg, 200x166, aspect 1.20) rather than the wide one
   (gw-mark-white.svg, 199x118, aspect 1.69). The wide cut in a square 32px
   tile could only be 14px tall — 44% of the tile's height — so most of the
   tile was empty ink and the box read as the logo. The square cut exists for
   exactly this container; 18px fills 68% w / 56% h, in line with the brand's
   own gw-mark-tile.svg (mark at 76.8% of a 240px square).
   The ring and the shadow went with it. rgba(244,245,246,.22) rendered
   nothing against the rgba(255,255,255,.86) masthead this was written for.
   (2026-08-04, later: the bar inverted to ink — see the masthead rule. The
   ring stays gone; on a dark bar it is a visible halo, which is the app-icon
   cue. The tile is now the LIGHT plate and the mark the INK cut.) The 0 2px 8px lift was
   one of only two blurred shadows in a system whose other 21 are hard
   zero-blur offsets, and it was what made the tile read as stuck ONTO the
   bar. Mirrored in gw-editorial.css — equal specificity, both must agree. */
.masthead .brand .btile{width:32px;height:32px;border-radius:9px;background:#f3f4f6;display:grid;place-items:center;}
.masthead .brand .btile img{width:auto;height:18px;display:block;}
/* WS-2026-08-08 (F-14) — #6b7080 -> #474b55. The old grey measured 4.89:1 and
   PASSES WCAG AA, which is why an earlier contrast sweep reported zero
   failures here. The roadmap's target is >=8:1 for nav specifically, and the
   reason is not accessibility — it is that nav sitting at 4.89 beside a
   16.4:1 wordmark reads as DISABLED rather than secondary. #474b55 is the
   first value down the same hue that clears the bar, so this is the minimum
   change that meets the criterion rather than a re-tone.

   The background is rgb(247,246,244), MEASURED in a browser off the painted
   masthead — not the rgb(254,254,253) an earlier pass assumed. That
   difference is not cosmetic: against the assumed value #4b4f5a computes to
   8.11:1 and against the real one it is 7.58:1, so arithmetic on the wrong
   background would have shipped a miss and recorded it as a pass. Most .mnav
   links actually sit on the dark utility strip at 14.9:1 already; only
   Pricing and Log in sit on this light band. */
.masthead .mnav{display:flex;gap:1.15rem;font-size:var(--gw-sys-type-body-s-size,.86rem);font-weight:600;color:#a1a1aa;margin-left:auto;align-items:center;}
.masthead .mnav a{color:#a1a1aa;text-decoration:none;}
.masthead .mnav a:hover{color:#fafafa;text-decoration:none;}
/* WS-nav (2026-08-03) — grouped submenus. Same concrete-hex discipline as the
   rest of this block: these rules ship inline and must render identically on
   .gwe and .sx pages, where the --gw-* vars may be undefined.
   WS-nav-polish — the panel/row values now come from the shared NAV_*_CSS
   constants above sx_nav(), which the Sentinel nav concatenates too. Do not
   retype them here: identical strings in both blocks is the whole mechanism
   keeping these two dropdowns from looking like two products again. */
.masthead .mnav .mnav-g{position:relative;display:inline-flex;}
.masthead .mnav .mnav-t{display:inline-flex;align-items:center;gap:5px;
font-family:var(--gw-sys-type-font-sans,'Public Sans','Public Sans Fallback',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif);
font-size:var(--gw-sys-type-body-s-size,.9rem);font-weight:500;letter-spacing:-.01em;color:#a1a1aa;
background:transparent;border:0;padding:0;margin:0;cursor:pointer;line-height:inherit;}
.masthead .mnav .mnav-t:hover,.masthead .mnav .mnav-t[aria-expanded="true"]{color:#fafafa;}
.masthead .mnav .mnav-t.is-active{color:#fafafa;font-weight:700;}
/* Direct top-level links (Pricing, Log in) match the group toggles beside
   them — `>` so this never reaches the items inside an open panel. */
.masthead .mnav > a{font-family:var(--gw-sys-type-font-sans,'Public Sans','Public Sans Fallback',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif);
font-size:var(--gw-sys-type-body-s-size,.9rem);font-weight:500;letter-spacing:-.01em;}
.masthead .mnav .mnav-chev{transition:transform 180ms cubic-bezier(.16,1,.3,1);}
.masthead .mnav .mnav-t[aria-expanded="true"] .mnav-chev{transform:rotate(180deg);}
/* Hidden by VISIBILITY, not by display. Two reasons, one of them measurable:
   (1) a display:none panel has no box, so `getComputedStyle().top` stays the
   authored `calc(100% + 10px)` and its rect is null. Under any ancestor that
   clips overflow, a design audit can then only conclude "a clipping
   container wraps a positioned child whose inset implies it escapes" — it
   has no geometry to check the claim against, and that is what
   clipped-overflow-container reported here. With the panel laid out, `top`
   resolves to px and the geometry answers the question: it sits inside the
   page box and clips nothing.
   (2) visibility:hidden keeps the panel out of the tab order and out of the
   accessibility tree exactly as display:none did, so nothing about keyboard
   or screen-reader behaviour changes — the JS still only toggles .is-open. */
.masthead .mnav .mnav-m{display:flex;visibility:hidden;opacity:0;pointer-events:none;
position:absolute;left:0;top:calc(100% + 10px);
flex-direction:column;padding:.35rem;z-index:60;min-width:292px;background:rgba(16,17,20,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid #26262d;border-radius:10px;box-shadow:0 18px 44px rgba(0,0,0,.55);}
.masthead .mnav .mnav-m.is-open{visibility:visible;opacity:1;pointer-events:auto;}
.masthead .mnav .mnav-m a{display:grid;grid-template-columns:20px 1fr;column-gap:.7rem;align-items:start;padding:.55rem .7rem;border-radius:7px;text-decoration:none;color:#e8eaee;}
.masthead .mnav .mnav-m a + a{border-top:1px solid rgba(232,234,238,.09);}
.masthead .mnav .mnav-m a .ni-i{grid-row:1 / span 2;width:20px;height:20px;color:#a7adb8;margin-top:1px;transition:color 180ms cubic-bezier(.16,1,.3,1);}
.masthead .mnav .mnav-m a .ni-t{font-family:var(--gw-sys-type-font-sans,'Public Sans','Public Sans Fallback',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif);font-size:var(--gw-sys-type-body-s-size,.92rem);font-weight:600;letter-spacing:-.01em;line-height:1.25;color:#e8eaee;white-space:nowrap;}
.masthead .mnav .mnav-m a .ni-d{font-family:var(--gw-sys-type-font-sans,'Public Sans','Public Sans Fallback',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif);grid-column:2;font-size:var(--gw-sys-type-micro-size,.735rem);font-weight:500;line-height:1.35;color:#a7adb8;margin-top:2px;}
.masthead .mnav .mnav-m a:hover,.masthead .mnav .mnav-m a:focus{background:rgba(255,255,255,.07);}
.masthead .mnav .mnav-m a:hover .ni-i,.masthead .mnav .mnav-m a:focus .ni-i{color:#e8eaee;}
.masthead .mnav .mnav-m a[aria-current="page"] .ni-t{color:#F3F4F6;font-weight:700;text-decoration:underline;text-decoration-color:#D9703F;text-underline-offset:4px;text-decoration-thickness:2px;}
.masthead .mcta{background:#f3f4f6;color:#08090a;font-weight:700;font-size:var(--gw-sys-type-body-s-size,.85rem);padding:.5rem .95rem;border-radius:7px;border:2px solid #f3f4f6;box-shadow:none;transition:background 180ms cubic-bezier(.16,1,.3,1);text-decoration:none;white-space:nowrap;}
.masthead .mcta:hover{opacity:.88;text-decoration:none;}
.masthead details.mnav-d{background:transparent;border:0;box-shadow:none;padding:0;margin:0;max-width:none;border-radius:0;display:none;}
.masthead details.mnav-d > summary{color:#a1a1aa;font-size:var(--gw-sys-type-body-s-size,.85rem);}
@media(max-width:768px){.masthead .mcta{display:inline-flex;align-items:center;min-height:44px;}}
@media(max-width:760px){
.masthead .mnav{display:none;}
.masthead .mnav .mnav-m{position:static;top:auto;}
.masthead .row{gap:.6rem;justify-content:space-between;height:56px;}
.masthead .brand{font-size:var(--gw-sys-type-body-size,1rem);flex-shrink:0;gap:.45rem;}
/* Height-driven like the desktop rule, never both axes: this was
   width:26px;height:26px, and since object-fit defaults to `fill` the mark was
   stretched to aspect 1.00 on every phone. 19px of the square cut is 22.9px
   wide — still bigger than desktop, which is what the 26 was reaching for.
   Stated in gw-editorial.css too — equal specificity, both copies must
   agree. */
.masthead .brand .btile img{width:auto;height:19px;}
.masthead .mcta{font-size:var(--gw-sys-type-caption-size,.76rem);padding:.4rem .7rem;white-space:nowrap;min-height:40px;box-shadow:none;}
/* WS-nav-polish — position:static, and the ROW becomes the positioning
   context instead. The drawer used to hang off the hamburger's right edge,
   which put its left edge at (hamburger right - panel width): fine for the
   216px panel of bare labels, 7px off the left of a 390px screen once the
   panel grew to hold descriptions, and further off at 360/320 where the CTA
   beside it is wider relative to the viewport. Anchored to the row it simply
   spans the gutters, which is also what the Sentinel drawer already does
   (.sx .navmenu is left:0;right:0) — so both mobile drawers now sit the
   same way as well as look the same. */
.masthead .row{position:relative;}
.masthead details.mnav-d{display:block;position:static;margin-left:auto;flex-shrink:0;}
.masthead details.mnav-d > summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:.4rem;min-height:44px;min-width:44px;padding:.4rem .6rem;border:1px solid transparent;border-radius:7px;background:transparent;box-shadow:none;color:#a1a1aa;font-size:var(--gw-sys-type-caption-size,.82rem);font-weight:600;-webkit-user-select:none;user-select:none;}
.masthead details.mnav-d > summary::-webkit-details-marker{display:none;}
.masthead details.mnav-d > summary::marker{content:"";}
.masthead .mnav-d .mn-i{width:14px;height:10px;flex:0 0 auto;background:linear-gradient(#fafafa 0 2px,transparent 2px 4px,#fafafa 4px 6px,transparent 6px 8px,#fafafa 8px 10px);}
.masthead details.mnav-d[open] > summary{background:#26262d;}
/* WS-nav-polish — the drawer IS the dropdown at this breakpoint (same overlay,
   same items, same trigger), so it takes the same panel recipe rather than the
   light card it used to be. The clamp keeps a 292px panel inside a 320px
   viewport. */
.masthead .mnav-d .mnav-dl{position:absolute;left:0;right:0;top:calc(100% + 8px);min-width:0;max-width:none;padding:.35rem;z-index:60;display:flex;flex-direction:column;background:rgba(16,17,20,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid #26262d;border-radius:10px;box-shadow:0 18px 44px rgba(0,0,0,.55);}
/* A CLOSED <details> does not stop this panel being laid out. Chrome hides a
   closed details' content with `content-visibility:hidden` on the
   ::details-content slot, which also gives that slot paint containment — so it
   becomes the containing block for this position:absolute panel, and the panel
   resolves against a 0-height, 44px-wide box instead of the row. Measured at
   390x844 with the drawer closed: nav.mnav-dl reported a live 44x212 rect at
   (206,89), on top of the hero, with computed content-visibility "visible" —
   every drawer row had a real box, "Resources" overflowed its 31px column by
   73px, and the impeccable detector read 16 nav labels as text buried under
   the H1 plus 3 overflowing rows. Nobody SEES any of it (the slot is not
   painted), which is exactly why it went unnoticed: it is a geometry ghost.
   display:none on the closed state removes the ghost and changes nothing a
   visitor can observe. Do not "simplify" this away because <details> looks
   like it should already do it. */
.masthead details.mnav-d:not([open]) > .mnav-dl{display:none;position:static;top:auto;}
.masthead .mnav-d .mnav-dl a{display:flex;align-items:center;min-height:44px;padding:.55rem .8rem;color:#e8eaee;font-family:'Space Grotesk','Space Grotesk Fallback',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:var(--gw-sys-type-body-s-size,.92rem);font-weight:600;letter-spacing:-.01em;border-radius:6px;text-decoration:none;}
.masthead .mnav-d .mnav-dl a:hover{background:rgba(255,255,255,.07);text-decoration:none;}
/* Dividers between the drawer's top-level groups — Product / Pricing /
   Resources read as three things, not one run-on list. */
.masthead .mnav-d .mnav-dl > * + *{border-top:1px solid rgba(232,234,238,.09);}
/* WS-nav (2026-08-03) — the same groups as native <details> accordions inside
   the hamburger disclosure. No script and no role=menu here on purpose: the
   desktop popup's keyboard model assumes a pointer/tab context a phone drawer
   does not have, and <details> is already correct for touch AND VoiceOver.
   44px minimums throughout — these are the tap targets. */
.masthead .mnav-d .mnav-dl details.mnav-acc{display:block;background:transparent;
border:0;box-shadow:none;padding:0;margin:0;border-radius:0;max-width:none;}
/* The background/border/box-shadow resets here are load-bearing, not
   tidiness. gw-editorial.css styles the HAMBURGER's own summary as a chip —
   `.gwe .mnav-d summary{border:2px solid --gw-edge;box-shadow:2px 2px 0;
   background:--gw-paper}` plus `.gwe .mnav-d[open] summary{background:
   var(--gw-cta)}` — with DESCENDANT selectors that also reach these accordion
   summaries. Inside the accordion `.gwe details:not(.mnav-d)` has flipped
   --gw-cta to the dark-surface value, so the plate painted #F3F4F6 under
   #F3F4F6 text: a group header that was there and unreadable. (Screenshot-
   verified, both before and after — it does not show up in the markup at
   all.) Scoping the stylesheet's rules to `> summary` is the tidier
   fix and is deliberately not taken: gw-editorial.css is cache-busted by a
   ?v= query string every <link> in the codebase would have to be bumped in
   lockstep, and a nav that renders wrong for the length of a stale CDN cache
   is the failure this whole inline block exists to avoid. Declaring the
   background here wins on specificity (0,5,2 vs 0,3,2) and ships with the
   markup. */
.masthead .mnav-d .mnav-dl details.mnav-acc summary,
.masthead .mnav-d .mnav-dl details.mnav-acc[open] summary{display:flex;align-items:center;
justify-content:space-between;gap:.5rem;min-height:44px;padding:.55rem .8rem;
background:transparent;border:0;box-shadow:none;
color:#e8eaee;font-family:'Space Grotesk','Space Grotesk Fallback',-apple-system,
BlinkMacSystemFont,'Segoe UI',sans-serif;
font-size:var(--gw-sys-type-body-s-size,.92rem);font-weight:600;letter-spacing:-.01em;border-radius:6px;cursor:pointer;
list-style:none;-webkit-user-select:none;user-select:none;}
.masthead .mnav-d .mnav-dl details.mnav-acc summary::-webkit-details-marker{display:none;}
.masthead .mnav-d .mnav-dl details.mnav-acc summary::marker{content:"";}
.masthead .mnav-d .mnav-dl details.mnav-acc summary:hover{background:rgba(255,255,255,.07);}
.masthead .mnav-d .mnav-dl details.mnav-acc[open] summary{color:#F3F4F6;}
.masthead .mnav-d .mnav-dl details.mnav-acc[open] summary .mnav-acc-c{transform:rotate(180deg);}
.masthead .mnav-d .mnav-dl details.mnav-acc .mnav-acc-c{transition:transform 180ms cubic-bezier(.16,1,.3,1);flex:0 0 auto;color:#a7adb8;}
.masthead .mnav-d .mnav-dl details.mnav-acc .mnav-acc-b{display:flex;flex-direction:column;border-top:1px solid rgba(232,234,238,.09);}
.masthead .mnav-d .mnav-dl details.mnav-acc .mnav-acc-b a{min-height:44px;display:grid;grid-template-columns:20px 1fr;column-gap:.7rem;align-items:start;padding:.55rem .7rem;border-radius:7px;text-decoration:none;color:#e8eaee;}
.masthead .mnav-d .mnav-dl details.mnav-acc .mnav-acc-b a + a{border-top:1px solid rgba(232,234,238,.09);}
.masthead .mnav-d .mnav-dl details.mnav-acc .mnav-acc-b a .ni-i{grid-row:1 / span 2;width:20px;height:20px;color:#a7adb8;margin-top:1px;transition:color 180ms cubic-bezier(.16,1,.3,1);}
.masthead .mnav-d .mnav-dl details.mnav-acc .mnav-acc-b a .ni-t{font-family:var(--gw-sys-type-font-sans,'Public Sans','Public Sans Fallback',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif);font-size:var(--gw-sys-type-body-s-size,.92rem);font-weight:600;letter-spacing:-.01em;line-height:1.25;color:#e8eaee;white-space:nowrap;}
.masthead .mnav-d .mnav-dl details.mnav-acc .mnav-acc-b a .ni-d{font-family:var(--gw-sys-type-font-sans,'Public Sans','Public Sans Fallback',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif);grid-column:2;font-size:var(--gw-sys-type-micro-size,.735rem);font-weight:500;line-height:1.35;color:#a7adb8;margin-top:2px;}
.masthead .mnav-d .mnav-dl details.mnav-acc .mnav-acc-b a[aria-current="page"] .ni-t{color:#F3F4F6;font-weight:700;text-decoration:underline;text-decoration-color:#D9703F;text-underline-offset:4px;text-decoration-thickness:2px;}
}
@media(max-width:430px){
.masthead .row{gap:.55rem;}
.masthead .mcta{font-size:var(--gw-sys-type-caption-size,.78rem);padding:.45rem .65rem;white-space:nowrap;}
.masthead details.mnav-d > summary{padding:.4rem .55rem;}
.masthead .mnav-d .mn-t{display:none;}
/* WS42 — see the note above .masthead .row. 22px gutters cost 44px of a
   320px screen; 12px is still a gutter and buys back 20px. The label
   swap buys 35px more: both strings ship in the markup and CSS picks
   one, so the anchor keeps a real text node either way and the full
   phrase stays on the element as aria-label for screen readers. */
.masthead .wrap{padding-left:12px;padding-right:12px;}
.masthead .mcta-l{display:none;}
.masthead .mcta-s{display:inline;}
/* The same 5px -> 3px offset step gw-editorial.css takes on --gw-off below
   430px, so the drawer's hard shadow does not crowd a 320px screen. */
/* WS-2026-08-08 — d1fe6d53 moved the drawer to the bar's glass material
   (NAV_PANEL_CSS) but this NARROW-SCREEN override kept a hard offset, so
   the panel reverted to the sticker treatment under ~430px. Mine, missed
   because I checked the base rule and not the breakpoint. */
.masthead .mnav-d .mnav-dl{box-shadow:0 18px 44px rgba(0,0,0,.55);}
}