@charset "UTF-8";@import url(//fonts.googleapis.com/css2?family=Material+Icons+Round);:root {
    --devsite-gm3-ref-palette--black: #000;
    --devsite-gm3-ref-palette--blue-variant0: #000;
    --devsite-gm3-ref-palette--blue-variant10: #001f2d;
    --devsite-gm3-ref-palette--blue-variant100: #fff;
    --devsite-gm3-ref-palette--blue-variant20: #003549;
    --devsite-gm3-ref-palette--blue-variant30: #004d68;
    --devsite-gm3-ref-palette--blue-variant40: #006788;
    --devsite-gm3-ref-palette--blue-variant50: #0081a8;
    --devsite-gm3-ref-palette--blue-variant60: #009dc9;
    --devsite-gm3-ref-palette--blue-variant70: #00bbea;
    --devsite-gm3-ref-palette--blue-variant80: #67d4ff;
    --devsite-gm3-ref-palette--blue-variant90: #bde9ff;
    --devsite-gm3-ref-palette--blue-variant95: #e0f4ff;
    --devsite-gm3-ref-palette--blue-variant98: #f4faff;
    --devsite-gm3-ref-palette--blue0: #000;
    --devsite-gm3-ref-palette--blue10: #001944;
    --devsite-gm3-ref-palette--blue100: #fff;
    --devsite-gm3-ref-palette--blue20: #012c6f;
    --devsite-gm3-ref-palette--blue30: #04409f;
    --devsite-gm3-ref-palette--blue40: #1157ce;
    --devsite-gm3-ref-palette--blue50: #3271ea;
    --devsite-gm3-ref-palette--blue60: #4e8ff8;
    --devsite-gm3-ref-palette--blue70: #76acff;
    --devsite-gm3-ref-palette--blue80: #a1c9ff;
    --devsite-gm3-ref-palette--blue90: #d0e4ff;
    --devsite-gm3-ref-palette--blue95: #e7f2ff;
    --devsite-gm3-ref-palette--blue98: #f5faff;
    --devsite-gm3-ref-palette--cyan0: #000;
    --devsite-gm3-ref-palette--cyan10: #001f26;
    --devsite-gm3-ref-palette--cyan100: #fff;
    --devsite-gm3-ref-palette--cyan20: #003641;
    --devsite-gm3-ref-palette--cyan30: #004e5d;
    --devsite-gm3-ref-palette--cyan40: #00687c;
    --devsite-gm3-ref-palette--cyan50: #00839b;
    --devsite-gm3-ref-palette--cyan60: #009ebb;
    --devsite-gm3-ref-palette--cyan70: #00bbdf;
    --devsite-gm3-ref-palette--cyan80: #60d5f3;
    --devsite-gm3-ref-palette--cyan90: #acedff;
    --devsite-gm3-ref-palette--cyan95: #d8f6ff;
    --devsite-gm3-ref-palette--cyan98: #f0fbff;
    --devsite-gm3-ref-palette--error0: #000;
    --devsite-gm3-ref-palette--error10: #410e0b;
    --devsite-gm3-ref-palette--error100: #fff;
    --devsite-gm3-ref-palette--error20: #601410;
    --devsite-gm3-ref-palette--error30: #8c1d18;
    --devsite-gm3-ref-palette--error40: #b3261e;
    --devsite-gm3-ref-palette--error50: #dc362e;
    --devsite-gm3-ref-palette--error60: #e46962;
    --devsite-gm3-ref-palette--error70: #ec928e;
    --devsite-gm3-ref-palette--error80: #f2b8b5;
    --devsite-gm3-ref-palette--error90: #f9dedc;
    --devsite-gm3-ref-palette--error95: #fceeee;
    --devsite-gm3-ref-palette--error98: #fff8f7;
    --devsite-gm3-ref-palette--error99: #fffbf9;
    --devsite-gm3-ref-palette--green0: #000;
    --devsite-gm3-ref-palette--green10: #002110;
    --devsite-gm3-ref-palette--green100: #fff;
    --devsite-gm3-ref-palette--green20: #00381f;
    --devsite-gm3-ref-palette--green30: #00522c;
    --devsite-gm3-ref-palette--green40: #006c35;
    --devsite-gm3-ref-palette--green50: #128937;
    --devsite-gm3-ref-palette--green60: #1aa64a;
    --devsite-gm3-ref-palette--green70: #44c265;
    --devsite-gm3-ref-palette--green80: #80da88;
    --devsite-gm3-ref-palette--green90: #beefbb;
    --devsite-gm3-ref-palette--green95: #ddf8d8;
    --devsite-gm3-ref-palette--green98: #f2fcef;
    --devsite-gm3-ref-palette--grey-variant0: #000;
    --devsite-gm3-ref-palette--grey-variant10: #191d1c;
    --devsite-gm3-ref-palette--grey-variant100: #fff;
    --devsite-gm3-ref-palette--grey-variant20: #2d312f;
    --devsite-gm3-ref-palette--grey-variant30: #444746;
    --devsite-gm3-ref-palette--grey-variant40: #5c5f5e;
    --devsite-gm3-ref-palette--grey-variant50: #747775;
    --devsite-gm3-ref-palette--grey-variant60: #8e918f;
    --devsite-gm3-ref-palette--grey-variant70: #a9acaa;
    --devsite-gm3-ref-palette--grey-variant80: #c4c7c5;
    --devsite-gm3-ref-palette--grey-variant90: #e1e3e1;
    --devsite-gm3-ref-palette--grey-variant95: #eff2ef;
    --devsite-gm3-ref-palette--grey-variant98: #f7faf7;
    --devsite-gm3-ref-palette--grey0: #000;
    --devsite-gm3-ref-palette--grey10: #1b1b1c;
    --devsite-gm3-ref-palette--grey100: #fff;
    --devsite-gm3-ref-palette--grey20: #303030;
    --devsite-gm3-ref-palette--grey30: #474747;
    --devsite-gm3-ref-palette--grey40: #5e5e5e;
    --devsite-gm3-ref-palette--grey50: #777;
    --devsite-gm3-ref-palette--grey60: #919191;
    --devsite-gm3-ref-palette--grey70: #ababab;
    --devsite-gm3-ref-palette--grey80: #c7c7c7;
    --devsite-gm3-ref-palette--grey90: #e3e3e3;
    --devsite-gm3-ref-palette--grey95: #f2f2f2;
    --devsite-gm3-ref-palette--grey98: #f9f9f9;
    --devsite-gm3-ref-palette--neutral-variant0: #000;
    --devsite-gm3-ref-palette--neutral-variant10: #191d1c;
    --devsite-gm3-ref-palette--neutral-variant100: #fff;
    --devsite-gm3-ref-palette--neutral-variant20: #2d312f;
    --devsite-gm3-ref-palette--neutral-variant30: #444746;
    --devsite-gm3-ref-palette--neutral-variant40: #5c5f5e;
    --devsite-gm3-ref-palette--neutral-variant50: #747775;
    --devsite-gm3-ref-palette--neutral-variant60: #8e918f;
    --devsite-gm3-ref-palette--neutral-variant70: #a9acaa;
    --devsite-gm3-ref-palette--neutral-variant80: #c4c7c5;
    --devsite-gm3-ref-palette--neutral-variant90: #e1e3e1;
    --devsite-gm3-ref-palette--neutral-variant95: #eff2ef;
    --devsite-gm3-ref-palette--neutral-variant98: #f7faf7;
    --devsite-gm3-ref-palette--neutral-variant99: #fafdfb;
    --devsite-gm3-ref-palette--neutral0: #000;
    --devsite-gm3-ref-palette--neutral10: #1f1f1f;
    --devsite-gm3-ref-palette--neutral100: #fff;
    --devsite-gm3-ref-palette--neutral12: #1f2020;
    --devsite-gm3-ref-palette--neutral17: #2a2a2a;
    --devsite-gm3-ref-palette--neutral20: #303030;
    --devsite-gm3-ref-palette--neutral22: #343535;
    --devsite-gm3-ref-palette--neutral24: #393939;
    --devsite-gm3-ref-palette--neutral30: #474747;
    --devsite-gm3-ref-palette--neutral4: #0e0e0f;
    --devsite-gm3-ref-palette--neutral40: #5e5e5e;
    --devsite-gm3-ref-palette--neutral50: #757575;
    --devsite-gm3-ref-palette--neutral6: #131314;
    --devsite-gm3-ref-palette--neutral60: #8f8f8f;
    --devsite-gm3-ref-palette--neutral70: #ababab;
    --devsite-gm3-ref-palette--neutral80: #c7c7c7;
    --devsite-gm3-ref-palette--neutral87: #dadada;
    --devsite-gm3-ref-palette--neutral90: #e3e3e3;
    --devsite-gm3-ref-palette--neutral92: #e9e8e8;
    --devsite-gm3-ref-palette--neutral94: #efeded;
    --devsite-gm3-ref-palette--neutral95: #f2f2f2;
    --devsite-gm3-ref-palette--neutral96: #f4f3f2;
    --devsite-gm3-ref-palette--neutral98: #faf9f8;
    --devsite-gm3-ref-palette--neutral99: #fdfcfb;
    --devsite-gm3-ref-palette--orange0: #000;
    --devsite-gm3-ref-palette--orange10: #321200;
    --devsite-gm3-ref-palette--orange100: #fff;
    --devsite-gm3-ref-palette--orange20: #522302;
    --devsite-gm3-ref-palette--orange30: #753403;
    --devsite-gm3-ref-palette--orange40: #9a4600;
    --devsite-gm3-ref-palette--orange50: #c05a01;
    --devsite-gm3-ref-palette--orange60: #e86e00;
    --devsite-gm3-ref-palette--orange70: #ff8d41;
    --devsite-gm3-ref-palette--orange80: #ffb683;
    --devsite-gm3-ref-palette--orange90: #ffdcc3;
    --devsite-gm3-ref-palette--orange95: #ffede1;
    --devsite-gm3-ref-palette--orange98: #fff8f4;
    --devsite-gm3-ref-palette--pink0: #000;
    --devsite-gm3-ref-palette--pink10: #3d0023;
    --devsite-gm3-ref-palette--pink100: #fff;
    --devsite-gm3-ref-palette--pink20: #620438;
    --devsite-gm3-ref-palette--pink30: #8d0053;
    --devsite-gm3-ref-palette--pink40: #b60d6e;
    --devsite-gm3-ref-palette--pink50: #dc258d;
    --devsite-gm3-ref-palette--pink60: #f94aab;
    --devsite-gm3-ref-palette--pink70: #ff7dd2;
    --devsite-gm3-ref-palette--pink80: #ffaee4;
    --devsite-gm3-ref-palette--pink90: #ffd8ef;
    --devsite-gm3-ref-palette--pink95: #ffecf6;
    --devsite-gm3-ref-palette--pink98: #fff7fc;
    --devsite-gm3-ref-palette--primary0: #000;
    --devsite-gm3-ref-palette--primary10: #041e49;
    --devsite-gm3-ref-palette--primary100: #fff;
    --devsite-gm3-ref-palette--primary20: #062e6f;
    --devsite-gm3-ref-palette--primary30: #0842a0;
    --devsite-gm3-ref-palette--primary40: #0b57d0;
    --devsite-gm3-ref-palette--primary50: #1b6ef3;
    --devsite-gm3-ref-palette--primary60: #4c8df6;
    --devsite-gm3-ref-palette--primary70: #7cacf8;
    --devsite-gm3-ref-palette--primary80: #a8c7fa;
    --devsite-gm3-ref-palette--primary90: #d3e3fd;
    --devsite-gm3-ref-palette--primary95: #ecf3fe;
    --devsite-gm3-ref-palette--primary98: #f7f9ff;
    --devsite-gm3-ref-palette--primary99: #fafbff;
    --devsite-gm3-ref-palette--purple0: #000;
    --devsite-gm3-ref-palette--purple10: #280255;
    --devsite-gm3-ref-palette--purple100: #fff;
    --devsite-gm3-ref-palette--purple20: #400b84;
    --devsite-gm3-ref-palette--purple30: #5629a4;
    --devsite-gm3-ref-palette--purple40: #7438d2;
    --devsite-gm3-ref-palette--purple50: #9254ea;
    --devsite-gm3-ref-palette--purple60: #ad72ff;
    --devsite-gm3-ref-palette--purple70: #c597ff;
    --devsite-gm3-ref-palette--purple80: #d9bafd;
    --devsite-gm3-ref-palette--purple90: #eedcfe;
    --devsite-gm3-ref-palette--purple95: #f7ecfe;
    --devsite-gm3-ref-palette--purple98: #fdf8ff;
    --devsite-gm3-ref-palette--red0: #000;
    --devsite-gm3-ref-palette--red10: #3a0907;
    --devsite-gm3-ref-palette--red100: #fff;
    --devsite-gm3-ref-palette--red20: #60150f;
    --devsite-gm3-ref-palette--red30: #8a1a16;
    --devsite-gm3-ref-palette--red40: #b3251e;
    --devsite-gm3-ref-palette--red50: #db372d;
    --devsite-gm3-ref-palette--red60: #f55e57;
    --devsite-gm3-ref-palette--red70: #ff8983;
    --devsite-gm3-ref-palette--red80: #ffb3ae;
    --devsite-gm3-ref-palette--red90: #ffdadc;
    --devsite-gm3-ref-palette--red95: #ffecee;
    --devsite-gm3-ref-palette--red98: #fff8f8;
    --devsite-gm3-ref-palette--secondary0: #000;
    --devsite-gm3-ref-palette--secondary10: #001d35;
    --devsite-gm3-ref-palette--secondary100: #fff;
    --devsite-gm3-ref-palette--secondary20: #035;
    --devsite-gm3-ref-palette--secondary30: #004a77;
    --devsite-gm3-ref-palette--secondary40: #00639b;
    --devsite-gm3-ref-palette--secondary50: #047db7;
    --devsite-gm3-ref-palette--secondary60: #3998d3;
    --devsite-gm3-ref-palette--secondary70: #5ab3f0;
    --devsite-gm3-ref-palette--secondary80: #7fcfff;
    --devsite-gm3-ref-palette--secondary90: #c2e7ff;
    --devsite-gm3-ref-palette--secondary95: #dff3ff;
    --devsite-gm3-ref-palette--secondary98: #f4faff;
    --devsite-gm3-ref-palette--secondary99: #f7fcff;
    --devsite-gm3-ref-palette--tertiary0: #000;
    --devsite-gm3-ref-palette--tertiary10: #072711;
    --devsite-gm3-ref-palette--tertiary100: #fff;
    --devsite-gm3-ref-palette--tertiary20: #0a3818;
    --devsite-gm3-ref-palette--tertiary30: #0f5223;
    --devsite-gm3-ref-palette--tertiary40: #146c2e;
    --devsite-gm3-ref-palette--tertiary50: #198639;
    --devsite-gm3-ref-palette--tertiary60: #1ea446;
    --devsite-gm3-ref-palette--tertiary70: #37be5f;
    --devsite-gm3-ref-palette--tertiary80: #6dd58c;
    --devsite-gm3-ref-palette--tertiary90: #c4eed0;
    --devsite-gm3-ref-palette--tertiary95: #e7f8ed;
    --devsite-gm3-ref-palette--tertiary98: #ecfef2;
    --devsite-gm3-ref-palette--tertiary99: #f2ffee;
    --devsite-gm3-ref-palette--white: #fff;
    --devsite-gm3-ref-palette--yellow0: #000;
    --devsite-gm3-ref-palette--yellow10: #2f1400;
    --devsite-gm3-ref-palette--yellow100: #fff;
    --devsite-gm3-ref-palette--yellow20: #4d2600;
    --devsite-gm3-ref-palette--yellow30: #6d3a01;
    --devsite-gm3-ref-palette--yellow40: #8f4e06;
    --devsite-gm3-ref-palette--yellow50: #b16300;
    --devsite-gm3-ref-palette--yellow60: #d37b00;
    --devsite-gm3-ref-palette--yellow70: #ef9800;
    --devsite-gm3-ref-palette--yellow80: #fcbd00;
    --devsite-gm3-ref-palette--yellow90: #ffe07c;
    --devsite-gm3-ref-palette--yellow95: #fff2b4;
    --devsite-gm3-ref-palette--yellow98: #fffade;
    --devsite-gm3-sys-color--background: #fff;
    --devsite-gm3-sys-color--error: #b3261e;
    --devsite-gm3-sys-color--error-container: #f9dedc;
    --devsite-gm3-sys-color--inverse-on-surface: #f2f2f2;
    --devsite-gm3-sys-color--inverse-primary: #a8c7fa;
    --devsite-gm3-sys-color--inverse-surface: #303030;
    --devsite-gm3-sys-color--on-background: #1f1f1f;
    --devsite-gm3-sys-color--on-error: #fff;
    --devsite-gm3-sys-color--on-error-container: #8c1d18;
    --devsite-gm3-sys-color--on-primary: #fff;
    --devsite-gm3-sys-color--on-primary-container: #0842a0;
    --devsite-gm3-sys-color--on-primary-fixed: #041e49;
    --devsite-gm3-sys-color--on-primary-fixed-variant: #0842a0;
    --devsite-gm3-sys-color--on-secondary: #fff;
    --devsite-gm3-sys-color--on-secondary-container: #004a77;
    --devsite-gm3-sys-color--on-secondary-fixed: #001d35;
    --devsite-gm3-sys-color--on-secondary-fixed-variant: #004a77;
    --devsite-gm3-sys-color--on-surface: #1f1f1f;
    --devsite-gm3-sys-color--on-surface-variant: #444746;
    --devsite-gm3-sys-color--on-tertiary: #fff;
    --devsite-gm3-sys-color--on-tertiary-container: #0f5223;
    --devsite-gm3-sys-color--on-tertiary-fixed: #072711;
    --devsite-gm3-sys-color--on-tertiary-fixed-variant: #0f5223;
    --devsite-gm3-sys-color--outline: #747775;
    --devsite-gm3-sys-color--outline-variant: #c4c7c5;
    --devsite-gm3-sys-color--primary: #0b57d0;
    --devsite-gm3-sys-color--primary-container: #d3e3fd;
    --devsite-gm3-sys-color--primary-fixed: #d3e3fd;
    --devsite-gm3-sys-color--primary-fixed-dim: #a8c7fa;
    --devsite-gm3-sys-color--scrim: #000;
    --devsite-gm3-sys-color--secondary: #00639b;
    --devsite-gm3-sys-color--secondary-container: #c2e7ff;
    --devsite-gm3-sys-color--secondary-fixed: #c2e7ff;
    --devsite-gm3-sys-color--secondary-fixed-dim: #7fcfff;
    --devsite-gm3-sys-color--shadow: #000;
    --devsite-gm3-sys-color--surface: #fff;
    --devsite-gm3-sys-color--surface-bright: #fff;
    --devsite-gm3-sys-color--surface-container: #f0f4f9;
    --devsite-gm3-sys-color--surface-container-high: #e9eef6;
    --devsite-gm3-sys-color--surface-container-highest: #dde3ea;
    --devsite-gm3-sys-color--surface-container-low: #f8fafd;
    --devsite-gm3-sys-color--surface-container-lowest: #fff;
    --devsite-gm3-sys-color--surface-dim: #d3dbe5;
    --devsite-gm3-sys-color--surface-variant: #e1e3e1;
    --devsite-gm3-sys-color--tertiary: #146c2e;
    --devsite-gm3-sys-color--tertiary-container: #c4eed0;
    --devsite-gm3-sys-color--tertiary-fixed: #c4eed0;
    --devsite-gm3-sys-color--tertiary-fixed-dim: #6dd58c;
    --devsite-ref-measurement--px-0: 0px;
    --devsite-ref-measurement--px-1: 1px;
    --devsite-ref-measurement--px-104: 104px;
    --devsite-ref-measurement--px-108: 108px;
    --devsite-ref-measurement--px-112: 112px;
    --devsite-ref-measurement--px-12: 12px;
    --devsite-ref-measurement--px-128: 128px;
    --devsite-ref-measurement--px-14: 14px;
    --devsite-ref-measurement--px-144: 144px;
    --devsite-ref-measurement--px-15: 15px;
    --devsite-ref-measurement--px-16: 16px;
    --devsite-ref-measurement--px-168: 168px;
    --devsite-ref-measurement--px-17: 17px;
    --devsite-ref-measurement--px-172: 172px;
    --devsite-ref-measurement--px-18: 18px;
    --devsite-ref-measurement--px-190: 190px;
    --devsite-ref-measurement--px-192: 192px;
    --devsite-ref-measurement--px-2: 2px;
    --devsite-ref-measurement--px-20: 20px;
    --devsite-ref-measurement--px-24: 24px;
    --devsite-ref-measurement--px-25: 25px;
    --devsite-ref-measurement--px-26: 26px;
    --devsite-ref-measurement--px-28: 28px;
    --devsite-ref-measurement--px-3: 3px;
    --devsite-ref-measurement--px-32: 32px;
    --devsite-ref-measurement--px-36: 36px;
    --devsite-ref-measurement--px-4: 4px;
    --devsite-ref-measurement--px-40: 40px;
    --devsite-ref-measurement--px-45: 45px;
    --devsite-ref-measurement--px-48: 48px;
    --devsite-ref-measurement--px-5: 5px;
    --devsite-ref-measurement--px-50: 50px;
    --devsite-ref-measurement--px-52: 52px;
    --devsite-ref-measurement--px-56: 56px;
    --devsite-ref-measurement--px-6: 6px;
    --devsite-ref-measurement--px-60: 60px;
    --devsite-ref-measurement--px-64: 64px;
    --devsite-ref-measurement--px-65: 65px;
    --devsite-ref-measurement--px-72: 72px;
    --devsite-ref-measurement--px-8: 8px;
    --devsite-ref-measurement--px-80: 80px;
    --devsite-ref-measurement--px-88: 88px;
    --devsite-ref-measurement--px-90: 90px;
    --devsite-ref-opacity--alpha-00: 0;
    --devsite-ref-opacity--alpha-03: 0.03;
    --devsite-ref-opacity--alpha-04: 0.04;
    --devsite-ref-opacity--alpha-05: 0.05;
    --devsite-ref-opacity--alpha-06: 0.06;
    --devsite-ref-opacity--alpha-08: 0.08;
    --devsite-ref-opacity--alpha-09: 0.09;
    --devsite-ref-opacity--alpha-10: 0.1;
    --devsite-ref-opacity--alpha-100: 1;
    --devsite-ref-opacity--alpha-11: 0.11;
    --devsite-ref-opacity--alpha-12: 0.12;
    --devsite-ref-opacity--alpha-14: 0.14;
    --devsite-ref-opacity--alpha-15: 0.15;
    --devsite-ref-opacity--alpha-16: 0.16;
    --devsite-ref-opacity--alpha-20: 0.2;
    --devsite-ref-opacity--alpha-21: 0.21;
    --devsite-ref-opacity--alpha-22: 0.22;
    --devsite-ref-opacity--alpha-23: 0.23;
    --devsite-ref-opacity--alpha-24: 0.24;
    --devsite-ref-opacity--alpha-25: 0.25;
    --devsite-ref-opacity--alpha-26: 0.26;
    --devsite-ref-opacity--alpha-28: 0.28;
    --devsite-ref-opacity--alpha-30: 0.3;
    --devsite-ref-opacity--alpha-36: 0.36;
    --devsite-ref-opacity--alpha-38: 0.38;
    --devsite-ref-opacity--alpha-40: 0.4;
    --devsite-ref-opacity--alpha-43: 0.43;
    --devsite-ref-opacity--alpha-50: 0.5;
    --devsite-ref-opacity--alpha-54: 0.54;
    --devsite-ref-opacity--alpha-55: 0.55;
    --devsite-ref-opacity--alpha-60: 0.6;
    --devsite-ref-opacity--alpha-65: 0.65;
    --devsite-ref-opacity--alpha-70: 0.7;
    --devsite-ref-opacity--alpha-73: 0.73;
    --devsite-ref-opacity--alpha-75: 0.75;
    --devsite-ref-opacity--alpha-80: 0.8;
    --devsite-ref-opacity--alpha-85: 0.85;
    --devsite-ref-opacity--alpha-87: 0.87;
    --devsite-ref-opacity--alpha-88: 0.88;
    --devsite-ref-opacity--alpha-90: 0.9;
    --devsite-ref-opacity--alpha-92: 0.92;
    --devsite-ref-opacity--alpha-95: 0.95;
    --devsite-ref-opacity--alpha-96: 0.96;
    --devsite-ref-opacity--alpha-98: 0.98;
    --devsite-ref-opacity--alpha-99: 0.99;
    --devsite-ref-palette--ai-analog: #a7edff;
    --devsite-ref-palette--ai-blue: #076eff;
    --devsite-ref-palette--ai-cyan: #4fabff;
    --devsite-ref-palette--ai-lightblue: #b1c5ff;
    --devsite-ref-palette--ai-main: #d7f6ff;
    --devsite-ref-palette--ai-peach: #ffddb7;
    --devsite-ref-palette--black: #000;
    --devsite-ref-palette--blue-grey200: #b0bec5;
    --devsite-ref-palette--blue-grey300: #90a4ae;
    --devsite-ref-palette--blue-grey400: #78909c;
    --devsite-ref-palette--blue-grey500: #607d8b;
    --devsite-ref-palette--blue-grey600: #546e7a;
    --devsite-ref-palette--blue-grey700: #455a64;
    --devsite-ref-palette--blue-grey800: #37474f;
    --devsite-ref-palette--blue-grey900: #263238;
    --devsite-ref-palette--blue100: #d2e3fc;
    --devsite-ref-palette--blue200: #aecbfa;
    --devsite-ref-palette--blue300: #8ab4f8;
    --devsite-ref-palette--blue400: #669df6;
    --devsite-ref-palette--blue50: #e8f0fe;
    --devsite-ref-palette--blue500: #4285f4;
    --devsite-ref-palette--blue600: #1a73e8;
    --devsite-ref-palette--blue700: #1967d2;
    --devsite-ref-palette--blue800: #185abc;
    --devsite-ref-palette--blue900: #174ea6;
    --devsite-ref-palette--cyan100: #cbf0f8;
    --devsite-ref-palette--cyan200: #a1e4f2;
    --devsite-ref-palette--cyan300: #78d9ec;
    --devsite-ref-palette--cyan400: #4ecde6;
    --devsite-ref-palette--cyan50: #e4f7fb;
    --devsite-ref-palette--cyan500: #24c1e0;
    --devsite-ref-palette--cyan600: #12b5cb;
    --devsite-ref-palette--cyan700: #129eaf;
    --devsite-ref-palette--cyan800: #098591;
    --devsite-ref-palette--cyan900: #007b83;
    --devsite-ref-palette--dark-grey: #2a2b2e;
    --devsite-ref-palette--green100: #ceead6;
    --devsite-ref-palette--green200: #a8dab5;
    --devsite-ref-palette--green300: #81c995;
    --devsite-ref-palette--green400: #5bb974;
    --devsite-ref-palette--green50: #e6f4ea;
    --devsite-ref-palette--green500: #34a853;
    --devsite-ref-palette--green600: #1e8e3e;
    --devsite-ref-palette--green700: #188038;
    --devsite-ref-palette--green800: #137333;
    --devsite-ref-palette--green900: #0d652d;
    --devsite-ref-palette--grey100: #f1f3f4;
    --devsite-ref-palette--grey200: #e8eaed;
    --devsite-ref-palette--grey300: #dadce0;
    --devsite-ref-palette--grey400: #bdc1c6;
    --devsite-ref-palette--grey50: #f8f9fa;
    --devsite-ref-palette--grey500: #9aa0a6;
    --devsite-ref-palette--grey600: #80868b;
    --devsite-ref-palette--grey700: #5f6368;
    --devsite-ref-palette--grey800: #3c4043;
    --devsite-ref-palette--grey900: #202124;
    --devsite-ref-palette--indigo100: #c5cae9;
    --devsite-ref-palette--indigo200: #9fa8da;
    --devsite-ref-palette--indigo300: #7986cb;
    --devsite-ref-palette--indigo400: #5c6bc0;
    --devsite-ref-palette--indigo50: #e8eaf6;
    --devsite-ref-palette--indigo500: #3f51b5;
    --devsite-ref-palette--indigo700: #303f9f;
    --devsite-ref-palette--orange100: #fedfc8;
    --devsite-ref-palette--orange200: #fdc69c;
    --devsite-ref-palette--orange300: #fcad70;
    --devsite-ref-palette--orange400: #fa903e;
    --devsite-ref-palette--orange50: #feefe3;
    --devsite-ref-palette--orange500: #fa7b17;
    --devsite-ref-palette--orange600: #e8710a;
    --devsite-ref-palette--orange700: #d56e0c;
    --devsite-ref-palette--orange800: #c26401;
    --devsite-ref-palette--orange900: #b06000;
    --devsite-ref-palette--pink100: #fdcfe8;
    --devsite-ref-palette--pink200: #fba9d6;
    --devsite-ref-palette--pink300: #ff8bcb;
    --devsite-ref-palette--pink400: #ff63b8;
    --devsite-ref-palette--pink50: #fde7f3;
    --devsite-ref-palette--pink500: #f439a0;
    --devsite-ref-palette--pink600: #e52592;
    --devsite-ref-palette--pink700: #d01884;
    --devsite-ref-palette--pink800: #b80672;
    --devsite-ref-palette--pink900: #9c166b;
    --devsite-ref-palette--primary-40: #0b57d0;
    --devsite-ref-palette--primary-80: #a8c7fa;
    --devsite-ref-palette--primary-90: #d3e3fd;
    --devsite-ref-palette--purple100: #e9d2fd;
    --devsite-ref-palette--purple200: #d7aefb;
    --devsite-ref-palette--purple300: #c58af9;
    --devsite-ref-palette--purple400: #af5cf7;
    --devsite-ref-palette--purple50: #f3e8fd;
    --devsite-ref-palette--purple500: #a142f4;
    --devsite-ref-palette--purple600: #9334e6;
    --devsite-ref-palette--purple700: #8430ce;
    --devsite-ref-palette--purple800: #7627bb;
    --devsite-ref-palette--purple900: #681da8;
    --devsite-ref-palette--red100: #fad2cf;
    --devsite-ref-palette--red200: #f6aea9;
    --devsite-ref-palette--red300: #f28b82;
    --devsite-ref-palette--red400: #ee675c;
    --devsite-ref-palette--red50: #fce8e6;
    --devsite-ref-palette--red500: #ea4335;
    --devsite-ref-palette--red600: #d93025;
    --devsite-ref-palette--red700: #c5221f;
    --devsite-ref-palette--red800: #b31412;
    --devsite-ref-palette--red900: #a50e0e;
    --devsite-ref-palette--secondary-10: #001d35;
    --devsite-ref-palette--secondary-90: #c2e7ff;
    --devsite-ref-palette--teal100: #b2dfdb;
    --devsite-ref-palette--teal200: #80cbc4;
    --devsite-ref-palette--teal300: #4db6ac;
    --devsite-ref-palette--teal400: #26a69a;
    --devsite-ref-palette--teal50: #e0f2f1;
    --devsite-ref-palette--teal500: #009688;
    --devsite-ref-palette--teal600: #00897b;
    --devsite-ref-palette--teal700: #00796b;
    --devsite-ref-palette--white: #fff;
    --devsite-ref-palette--yellow100: #feefc3;
    --devsite-ref-palette--yellow200: #fde293;
    --devsite-ref-palette--yellow300: #fdd663;
    --devsite-ref-palette--yellow400: #fcc934;
    --devsite-ref-palette--yellow50: #fef7e0;
    --devsite-ref-palette--yellow500: #fbbc04;
    --devsite-ref-palette--yellow600: #f9ab00;
    --devsite-ref-palette--yellow700: #f29900;
    --devsite-ref-palette--yellow800: #ea8600;
    --devsite-ref-palette--yellow900: #e37400;
    --devsite-ref-palette-non-endorsed--alice-blue: #5fc8f8;
    --devsite-ref-palette-non-endorsed--amber-orange: #ffa000;
    --devsite-ref-palette-non-endorsed--bright-pink: #e20074;
    --devsite-ref-palette-non-endorsed--bright-red: red;
    --devsite-ref-palette-non-endorsed--bright-yellow: #fcd637;
    --devsite-ref-palette-non-endorsed--burnt-orange: #d15337;
    --devsite-ref-palette-non-endorsed--dark-brown: #40251f;
    --devsite-ref-palette-non-endorsed--dark-cyan: #283142;
    --devsite-ref-palette-non-endorsed--dark-web-orange: #fd8c09;
    --devsite-ref-palette-non-endorsed--darkblue800: #0b2e59;
    --devsite-ref-palette-non-endorsed--deep-orange200: #ffab91;
    --devsite-ref-palette-non-endorsed--deep-orange500: #ff5722;
    --devsite-ref-palette-non-endorsed--deep-orange700: #e64a19;
    --devsite-ref-palette-non-endorsed--deep-purple200: #e1bee7;
    --devsite-ref-palette-non-endorsed--deep-purple400: #7e57c2;
    --devsite-ref-palette-non-endorsed--deep-purple700: #512da8;
    --devsite-ref-palette-non-endorsed--deep-purple900: #50157f;
    --devsite-ref-palette-non-endorsed--deepsky-blue: #00b0ff;
    --devsite-ref-palette-non-endorsed--dusk-grey: #979797;
    --devsite-ref-palette-non-endorsed--dust-purple700: #9d75ab;
    --devsite-ref-palette-non-endorsed--fuscia-pink: #e91e63;
    --devsite-ref-palette-non-endorsed--green600: #43a047;
    --devsite-ref-palette-non-endorsed--grey350: #ddd;
    --devsite-ref-palette-non-endorsed--grey750: #4e5256;
    --devsite-ref-palette-non-endorsed--grey850: #36373a;
    --devsite-ref-palette-non-endorsed--light-blue400: #29b6f6;
    --devsite-ref-palette-non-endorsed--light-blue500: #03a9f4;
    --devsite-ref-palette-non-endorsed--light-blue600: #039be5;
    --devsite-ref-palette-non-endorsed--light-blue700: #0288d1;
    --devsite-ref-palette-non-endorsed--light-blue800: #0277bd;
    --devsite-ref-palette-non-endorsed--light-green200: #c5e1a5;
    --devsite-ref-palette-non-endorsed--light-green400: #9ccc65;
    --devsite-ref-palette-non-endorsed--light-green500: #8bc34a;
    --devsite-ref-palette-non-endorsed--light-green700: #689f38;
    --devsite-ref-palette-non-endorsed--light-red: #ff8080;
    --devsite-ref-palette-non-endorsed--lime-bright: #eeff41;
    --devsite-ref-palette-non-endorsed--lime-green: #aed581;
    --devsite-ref-palette-non-endorsed--lite-slate-blue: #a5c1d4;
    --devsite-ref-palette-non-endorsed--node-green: #00c853;
    --devsite-ref-palette-non-endorsed--orange-burst: #ff6e40;
    --devsite-ref-palette-non-endorsed--pacific-cyan: #16aaca;
    --devsite-ref-palette-non-endorsed--rose-red: #c52062;
    --devsite-ref-palette-non-endorsed--slate-lite: #f5f6f7;
    --devsite-ref-palette-non-endorsed--soft-blue: #458ae5;
    --devsite-ref-palette-non-endorsed--vivid-orange: #ff9100;
    --devsite-ref-palette-non-endorsed--yellow-highlight: #ffe168;
    --devsite-ref-palette-tenant--actifio-orange200: #eba495;
    --devsite-ref-palette-tenant--actifio-orange500: #d6492a;
    --devsite-ref-palette-tenant--actifio-orange800: #c63119;
    --devsite-ref-palette-tenant--actifio-theme: #e96d1f;
    --devsite-ref-palette-tenant--android-accent100: #efffc3;
    --devsite-ref-palette-tenant--android-accent500: #c6ff00;
    --devsite-ref-palette-tenant--android-accessible-blue: #1769e0;
    --devsite-ref-palette-tenant--android-black: #000;
    --devsite-ref-palette-tenant--android-blue-100: #d2e3fc;
    --devsite-ref-palette-tenant--android-blue-200: #aecbfa;
    --devsite-ref-palette-tenant--android-blue-25: #f6fbff;
    --devsite-ref-palette-tenant--android-blue-300: #4285f4;
    --devsite-ref-palette-tenant--android-blue-400: #356ac3;
    --devsite-ref-palette-tenant--android-blue-50: #e8f0fe;
    --devsite-ref-palette-tenant--android-blue-500: #174ea6;
    --devsite-ref-palette-tenant--android-blue-600: #164590;
    --devsite-ref-palette-tenant--android-blue-700: #15305c;
    --devsite-ref-palette-tenant--android-blue-800: #132137;
    --devsite-ref-palette-tenant--android-blue-900: #131924;
    --devsite-ref-palette-tenant--android-blue-dark: #1156d8;
    --devsite-ref-palette-tenant--android-blue-dark-theme: #152949;
    --devsite-ref-palette-tenant--android-chartreuse-100: #efffc3;
    --devsite-ref-palette-tenant--android-chartreuse-500: #c6ff00;
    --devsite-ref-palette-tenant--android-chartreuse-600: #a2d004;
    --devsite-ref-palette-tenant--android-chartreuse-900: #323d0f;
    --devsite-ref-palette-tenant--android-coral: #eb837d;
    --devsite-ref-palette-tenant--android-dark-green: #00a956;
    --devsite-ref-palette-tenant--android-green: #3ddc84;
    --devsite-ref-palette-tenant--android-green-100: #ceead6;
    --devsite-ref-palette-tenant--android-green-200: #a8dab5;
    --devsite-ref-palette-tenant--android-green-25: #f4f9f5;
    --devsite-ref-palette-tenant--android-green-300: #34a853;
    --devsite-ref-palette-tenant--android-green-50: #e6f4ea;
    --devsite-ref-palette-tenant--android-green-500: #2a8642;
    --devsite-ref-palette-tenant--android-green-600: #0d652d;
    --devsite-ref-palette-tenant--android-green-700: #103c20;
    --devsite-ref-palette-tenant--android-green-800: #112719;
    --devsite-ref-palette-tenant--android-green-900: #111c15;
    --devsite-ref-palette-tenant--android-green-dark-theme: #134229;
    --devsite-ref-palette-tenant--android-green-light: #8cd9ae;
    --devsite-ref-palette-tenant--android-grey-100: #f1f3f4;
    --devsite-ref-palette-tenant--android-grey-1000: #121212;
    --devsite-ref-palette-tenant--android-grey-200: #e8eaed;
    --devsite-ref-palette-tenant--android-grey-300: #dadce0;
    --devsite-ref-palette-tenant--android-grey-50: #f8f9fa;
    --devsite-ref-palette-tenant--android-grey-600: #80868b;
    --devsite-ref-palette-tenant--android-grey-700: #5f6368;
    --devsite-ref-palette-tenant--android-grey-800: #3c4043;
    --devsite-ref-palette-tenant--android-grey-900: #202124;
    --devsite-ref-palette-tenant--android-grey900: #2b2b2b;
    --devsite-ref-palette-tenant--android-hunter-green: #6a8759;
    --devsite-ref-palette-tenant--android-illustration-green: #00b975;
    --devsite-ref-palette-tenant--android-light-blue: #d7effe;
    --devsite-ref-palette-tenant--android-light-blue-dark: #cdebfe;
    --devsite-ref-palette-tenant--android-light-blue-dark-theme: #1d2532;
    --devsite-ref-palette-tenant--android-light-green: #eff7cf;
    --devsite-ref-palette-tenant--android-light-green-dark: #ebf5c3;
    --devsite-ref-palette-tenant--android-light-green-dark-theme: #363637;
    --devsite-ref-palette-tenant--android-light-navy: #0d4c67;
    --devsite-ref-palette-tenant--android-medium-green: #bbb529;
    --devsite-ref-palette-tenant--android-medium-grey: #a59d97;
    --devsite-ref-palette-tenant--android-medium-slate-blue: #6897bb;
    --devsite-ref-palette-tenant--android-navy: #073042;
    --devsite-ref-palette-tenant--android-orange: #ea5426;
    --devsite-ref-palette-tenant--android-pale-blue: #ebf7fe;
    --devsite-ref-palette-tenant--android-pale-blue-dark: #e5f5fe;
    --devsite-ref-palette-tenant--android-pale-blue-dark-theme: #162031;
    --devsite-ref-palette-tenant--android-pale-blue50: #f6fbff;
    --devsite-ref-palette-tenant--android-pale-green50: #f4f9f5;
    --devsite-ref-palette-tenant--android-white: #fff;
    --devsite-ref-palette-tenant--android-yellow-800: #ff9d0a;
    --devsite-ref-palette-tenant--android-yellow400: #ffc66d;
    --devsite-ref-palette-tenant--apigee-blue200: #8ab4dd;
    --devsite-ref-palette-tenant--apigee-blue500: #1568ba;
    --devsite-ref-palette-tenant--apigee-orange200: #ee9981;
    --devsite-ref-palette-tenant--apigee-orange400: #e25229;
    --devsite-ref-palette-tenant--apigee-orange500: #dd3303;
    --devsite-ref-palette-tenant--apigee-orange700: #d42702;
    --devsite-ref-palette-tenant--bazel-green300: #44a147;
    --devsite-ref-palette-tenant--bazel-green500: #0c713a;
    --devsite-ref-palette-tenant--bazel-green800: #1e431e;
    --devsite-ref-palette-tenant--cel-blue300: #394457;
    --devsite-ref-palette-tenant--cel-blue400: #465670;
    --devsite-ref-palette-tenant--cel-mauve25: #f0eded;
    --devsite-ref-palette-tenant--cel-mauve300: #948cc2;
    --devsite-ref-palette-tenant--cel-mauve400: #c3bbf2;
    --devsite-ref-palette-tenant--cel-mauve50: #e8e6e6;
    --devsite-ref-palette-tenant--cel-mauve500: #d1cbf5;
    --devsite-ref-palette-tenant--cel-mauve600: #674049;
    --devsite-ref-palette-tenant--cel-mauve700: #59373f;
    --devsite-ref-palette-tenant--cel-mauve800: #4d2f36;
    --devsite-ref-palette-tenant--chrome-blue: #006bee;
    --devsite-ref-palette-tenant--chrome-blue-light: #83bbff;
    --devsite-ref-palette-tenant--chrome-green: #4da949;
    --devsite-ref-palette-tenant--chrome-grey-light: #e1e9f6;
    --devsite-ref-palette-tenant--chrome-grey-medium: #afb2b6;
    --devsite-ref-palette-tenant--chrome-lime-green: #16d867;
    --devsite-ref-palette-tenant--chrome-primary-dark: #70b1ff;
    --devsite-ref-palette-tenant--chrome-red: #ea3323;
    --devsite-ref-palette-tenant--chrome-yellow: #f5b840;
    --devsite-ref-palette-tenant--cloud-facebook: #3b5998;
    --devsite-ref-palette-tenant--cloud-legacy-grey400: #afbec5;
    --devsite-ref-palette-tenant--cloud-linkedin: #007bb6;
    --devsite-ref-palette-tenant--cloud-orange-905: #b05a00;
    --devsite-ref-palette-tenant--cloud-sky: #0143a3;
    --devsite-ref-palette-tenant--cloud-twitter: #4099ff;
    --devsite-ref-palette-tenant--firebase-vivid-orange-dark: #e88000;
    --devsite-ref-palette-tenant--firebase-vivid-orange-darker: #9e5700;
    --devsite-ref-palette-tenant--firebase-vivid-orange-light: #ffe9cd;
    --devsite-ref-palette-tenant--firebase-coral: #ff8a65;
    --devsite-ref-palette-tenant--firebase-grey: #e5eaf0;
    --devsite-ref-palette-tenant--firebase-icy: #a8c7fa;
    --devsite-ref-palette-tenant--firebase-lite-orange: #ffc4b1;
    --devsite-ref-palette-tenant--firebase-navy600: #1b3a57;
    --devsite-ref-palette-tenant--firebase-navy700: #0c2d48;
    --devsite-ref-palette-tenant--firebase-navy900: #031525;
    --devsite-ref-palette-tenant--firebase-orange: #f57c00;
    --devsite-ref-palette-tenant--firebase-primary30: #0842a0;
    --devsite-ref-palette-tenant--firebase-red600: #e03600;
    --devsite-ref-palette-tenant--firebase-silver: #cecece;
    --devsite-ref-palette-tenant--firebase-vivid-orange200: #ff9200;
    --devsite-ref-palette-tenant--firebase-yellow-900: #d97917;
    --devsite-ref-palette-tenant--firebase-yellow400: #ffc400;
    --devsite-ref-palette-tenant--firebase-yellow500: #ffaf01;
    --devsite-ref-palette-tenant--fuchsia-black: #283238;
    --devsite-ref-palette-tenant--fuchsia-green: #13b294;
    --devsite-ref-palette-tenant--fuchsia-green02: #0a7965;
    --devsite-ref-palette-tenant--fuchsia-green03: #269580;
    --devsite-ref-palette-tenant--fuchsia-teal: #e0f8f3;
    --devsite-ref-palette-tenant--home-blue200: #cae8ef;
    --devsite-ref-palette-tenant--home-blue50: #eaf6f9;
    --devsite-ref-palette-tenant--home-blue500: #86c9ef;
    --devsite-ref-palette-tenant--home-blue700: #1d7db3;
    --devsite-ref-palette-tenant--home-blue800: #00639b;
    --devsite-ref-palette-tenant--home-blue900: #0c333c;
    --devsite-ref-palette-tenant--home-green200: #cfebda;
    --devsite-ref-palette-tenant--home-green50: #e2f1ea;
    --devsite-ref-palette-tenant--home-green500: #60c0b2;
    --devsite-ref-palette-tenant--home-green700: #3e766d;
    --devsite-ref-palette-tenant--home-green900: #1f302d;
    --devsite-ref-palette-tenant--home-orange200: #ffecd8;
    --devsite-ref-palette-tenant--home-orange50: #fbefec;
    --devsite-ref-palette-tenant--home-orange500: #ffcbaa;
    --devsite-ref-palette-tenant--home-orange700: #ff8569;
    --devsite-ref-palette-tenant--home-orange900: #301915;
    --devsite-ref-palette-tenant--home-purple200: #e4c9e0;
    --devsite-ref-palette-tenant--home-purple50: #f9e9f6;
    --devsite-ref-palette-tenant--home-purple500: #c798d6;
    --devsite-ref-palette-tenant--home-purple900: #3b2c41;
    --devsite-ref-palette-tenant--home-yellow200: #ffedbd;
    --devsite-ref-palette-tenant--home-yellow50: #fffaf0;
    --devsite-ref-palette-tenant--home-yellow500: #f2bd69;
    --devsite-ref-palette-tenant--home-yellow700: #e59849;
    --devsite-ref-palette-tenant--home-yellow900: #341811;
    --devsite-ref-palette-tenant--intrinsic-dark-purple: #5431a8;
    --devsite-ref-palette-tenant--intrinsic-light-grey: #eee;
    --devsite-ref-palette-tenant--intrinsic-light-purple: #a986fd;
    --devsite-ref-palette-tenant--intrinsic-purple: #7e4afc;
    --devsite-ref-palette-tenant--nest-blue200: #80d7ec;
    --devsite-ref-palette-tenant--nest-blue500: #00afd8;
    --devsite-ref-palette-tenant--nest-blue800: #0096c8;
    --devsite-ref-palette-tenant--openthread-blue200: #89a2bb;
    --devsite-ref-palette-tenant--openthread-blue400: #36618b;
    --devsite-ref-palette-tenant--openthread-blue500: #134576;
    --devsite-ref-palette-tenant--openweave-blue: #04adc9;
    --devsite-ref-palette-tenant--openweave-blue400: #4fc6d9;
    --devsite-ref-palette-tenant--openweave-blue800: #0293b5;
    --devsite-ref-palette-tenant--openweave-blue200: #82d6e4;
    --devsite-ref-palette-tenant--openxla-blue02: #6fb6e0;
    --devsite-ref-palette-tenant--openxla-navy: #1a344c;
    --devsite-ref-palette-tenant--quantum-yellow200: #fff9e4;
    --devsite-ref-palette-tenant--quantum-yellow500: #fff2c8;
    --devsite-ref-palette-tenant--stadia-plum200: #cd80b1;
    --devsite-ref-palette-tenant--stadia-plum300: #d04791;
    --devsite-ref-palette-tenant--stadia-plum500: #9b0063;
    --devsite-ref-palette-tenant--stadia-plum700: #680039;
    --devsite-ref-palette-tenant--tensorflow-amber200: #ffb780;
    --devsite-ref-palette-tenant--tensorflow-amber500: #ff6f00;
    --devsite-ref-palette-tenant--tensorflow-gray-light: #e6e6e6;
    --devsite-ref-palette-tenant--tensorflow-slate: #425066;
    --devsite-ref-palette-tenant--tensorflow-slate-dark: #293241;
    --devsite-ref-palette-tenant--tensorflow-slate-medium: #677282;
    --devsite-ref-palette-tenant--waymo-dark: #00b46e;
    --devsite-ref-palette-tenant--waymo-light: #66ffce;
    --devsite-ref-palette-tenant--waymo-primary: #00e89d;
    --devsite-ref-palette-tenant--webdev-primary: #3740ff;
    --devsite-ref-palette-tenant--webdev-primary-dark: #9ba0ff;
    --devsite-ref-palette-tenant--webdev-secondary: #e51661;
    --devsite-ref-palette-tenant--webdev-stroke: #d2d3d7;
    --devsite-ref-palette-tenant--webdev-tertiary: #6001ff;
    --devsite-ref-palette-tenant--wing-dusk: #3c3c3c;
    --devsite-ref-palette-tenant--wing-yellow-accent: #fff562;
    --devsite-ref-palette-tenant--wing-yellow-dark-theme: #feeb9b;
    --devsite-ref-palette-tenant--youtube-red700: #c20000;
    --devsite-ref-palette-tenant--chrome-primary: var(--devsite-ref-palette--blue600);
    --devsite-ref-palette-tenant--firebase-amber: var(--devsite-ref-palette-non-endorsed--amber-orange);
    --devsite-ref-palette-tenant--firebase-vivid-orange100: var(--devsite-ref-palette-non-endorsed--vivid-orange);
    --devsite-ref-palette-tenant--home-purple700: var(--devsite-ref-palette-non-endorsed--dust-purple700);
    --devsite-ref-palette-tenant--openthread-blue800: var(--devsite-ref-palette-non-endorsed--darkblue800);
    --devsite-ref-palette-tenant--openxla-blue01: var(--devsite-ref-palette-non-endorsed--soft-blue);
    --devsite-ref-palette-tenant--tensorflow-orange: var(--devsite-ref-palette-non-endorsed--vivid-orange);
    --devsite-ref-palette-tenant--tensorflow-slate-lightest: var(--devsite-ref-palette-non-endorsed--slate-lite);
    --devsite-ref-palette-tenant--wing-dusk-accent: var(--devsite-ref-palette-non-endorsed--dusk-grey);
    --devsite-ref-palette-tenant--wing-yellow: var(--devsite-ref-palette-non-endorsed--bright-yellow);
    --devsite-ref-palette-tenant--youtube-red200: var(--devsite-ref-palette-non-endorsed--light-red);
    --devsite-ref-palette-tenant--youtube-red500: var(--devsite-ref-palette-non-endorsed--bright-red);
    --devsite-ref-shape--radius-small: 4px;
    --devsite-ref-shape--radius-x-small: 1.5px;
    --devsite-ref-typeface--accessibility: Poppins;
    --devsite-ref-typeface--bold: 700;
    --devsite-ref-typeface--brand-regular: "Google Sans",Roboto,Arial,sans-serif;
    --devsite-ref-typeface--brand-text: "Google Sans Text","Google Sans",Roboto,Arial,sans-serif;
    --devsite-ref-typeface--code: "Roboto Mono";
    --devsite-ref-typeface--decoration-none: none;
    --devsite-ref-typeface--decoration-underline: underline;
    --devsite-ref-typeface--italic: italic;
    --devsite-ref-typeface--letter-spacing-0: 0;
    --devsite-ref-typeface--letter-spacing-0-06: 0.06px;
    --devsite-ref-typeface--letter-spacing-0-1: 0.1px;
    --devsite-ref-typeface--letter-spacing-0-15: 0.15px;
    --devsite-ref-typeface--letter-spacing-0-2: 0.2px;
    --devsite-ref-typeface--letter-spacing-0-25: 0.25px;
    --devsite-ref-typeface--letter-spacing-0-3: 0.3px;
    --devsite-ref-typeface--letter-spacing-0-4: 0.4px;
    --devsite-ref-typeface--letter-spacing-0-5: 0.5px;
    --devsite-ref-typeface--letter-spacing-1: 1px;
    --devsite-ref-typeface--letter-spacing-1-5: 1.5px;
    --devsite-ref-typeface--letter-spacing-neg-0-25: -0.25px;
    --devsite-ref-typeface--letter-spacing-neg-0-5: -0.5px;
    --devsite-ref-typeface--light: 300;
    --devsite-ref-typeface--line-height-10: 10px;
    --devsite-ref-typeface--line-height-110: 110px;
    --devsite-ref-typeface--line-height-14: 14px;
    --devsite-ref-typeface--line-height-16: 16px;
    --devsite-ref-typeface--line-height-18: 18px;
    --devsite-ref-typeface--line-height-2: 200%;
    --devsite-ref-typeface--line-height-20: 20px;
    --devsite-ref-typeface--line-height-22: 22px;
    --devsite-ref-typeface--line-height-23: 23px;
    --devsite-ref-typeface--line-height-24: 24px;
    --devsite-ref-typeface--line-height-26: 26px;
    --devsite-ref-typeface--line-height-28: 28px;
    --devsite-ref-typeface--line-height-30: 30px;
    --devsite-ref-typeface--line-height-32: 32px;
    --devsite-ref-typeface--line-height-34: 34px;
    --devsite-ref-typeface--line-height-36: 36px;
    --devsite-ref-typeface--line-height-39: 39px;
    --devsite-ref-typeface--line-height-40: 40px;
    --devsite-ref-typeface--line-height-42: 42px;
    --devsite-ref-typeface--line-height-46: 46px;
    --devsite-ref-typeface--line-height-48: 48px;
    --devsite-ref-typeface--line-height-50: 50px;
    --devsite-ref-typeface--line-height-52: 52px;
    --devsite-ref-typeface--line-height-56: 56px;
    --devsite-ref-typeface--line-height-57: 57px;
    --devsite-ref-typeface--line-height-62: 62px;
    --devsite-ref-typeface--line-height-64: 64px;
    --devsite-ref-typeface--line-height-66: 66px;
    --devsite-ref-typeface--line-height-68: 68px;
    --devsite-ref-typeface--line-height-72: 72px;
    --devsite-ref-typeface--line-height-76: 76px;
    --devsite-ref-typeface--line-height-82: 82px;
    --devsite-ref-typeface--line-height-84: 84px;
    --devsite-ref-typeface--medium: 500;
    --devsite-ref-typeface--monospace: monospace;
    --devsite-ref-typeface--noto-naskh-arabic: "Noto Naskh Arabic";
    --devsite-ref-typeface--noto-sans: "Noto Sans";
    --devsite-ref-typeface--noto-sans-jp: "Noto Sans JP";
    --devsite-ref-typeface--noto-sans-kr: "Noto Sans KR";
    --devsite-ref-typeface--percentage-100: 100%;
    --devsite-ref-typeface--percentage-90: 90%;
    --devsite-ref-typeface--plain-regular: Roboto;
    --devsite-ref-typeface--regular: 400;
    --devsite-ref-typeface--sans-serif: sans-serif;
    --devsite-ref-typeface--semibold: 600;
    --devsite-ref-typeface--size-10: 10px;
    --devsite-ref-typeface--size-100: 100px;
    --devsite-ref-typeface--size-11: 11px;
    --devsite-ref-typeface--size-12: 12px;
    --devsite-ref-typeface--size-13: 13px;
    --devsite-ref-typeface--size-14: 14px;
    --devsite-ref-typeface--size-16: 16px;
    --devsite-ref-typeface--size-18: 18px;
    --devsite-ref-typeface--size-20: 20px;
    --devsite-ref-typeface--size-22: 22px;
    --devsite-ref-typeface--size-24: 24px;
    --devsite-ref-typeface--size-26: 26px;
    --devsite-ref-typeface--size-30: 30px;
    --devsite-ref-typeface--size-32: 32px;
    --devsite-ref-typeface--size-34: 34px;
    --devsite-ref-typeface--size-38: 38px;
    --devsite-ref-typeface--size-40: 40px;
    --devsite-ref-typeface--size-44: 44px;
    --devsite-ref-typeface--size-48: 48px;
    --devsite-ref-typeface--size-50: 50px;
    --devsite-ref-typeface--size-56: 56px;
    --devsite-ref-typeface--size-58: 58px;
    --devsite-ref-typeface--size-60: 60px;
    --devsite-ref-typeface--size-62: 62px;
    --devsite-ref-typeface--size-64: 64px;
    --devsite-ref-typeface--size-96: 96px;
    --devsite-ref-typeface--transform-capitalize: capitalize;
    --devsite-ref-typeface--transform-lowercase: lowercase;
    --devsite-ref-typeface--transform-none: none;
    --devsite-ref-typeface--transform-uppercase: uppercase;
    --devsite-ref-typeface--very-light: 200;
    --devsite-ref-typeface--vw-1-1: 1.1vw;
    --devsite-ref-typeface--vw-1-2: 1.2vw;
    --devsite-ref-typeface--vw-1-9: 1.9vw;
    --devsite-ref-typeface--vw-10: 10vw;
    --devsite-ref-typeface--vw-3-5: 3.5vw;
    --devsite-sys-color--android-core-blue-25: var(--devsite-ref-palette-tenant--android-blue-25);
    --devsite-sys-color--android-core-blue-50: var(--devsite-ref-palette-tenant--android-blue-50);
    --devsite-sys-color--android-core-green-25: var(--devsite-ref-palette-tenant--android-green-25);
    --devsite-sys-color--android-core-green-50: var(--devsite-ref-palette-tenant--android-green-50);
    --devsite-sys-color--android-error: var(--devsite-ref-palette-tenant--android-orange);
    --devsite-sys-color--android-grey-scale-grey-200: var(--devsite-ref-palette-tenant--android-grey-200);
    --devsite-sys-color--android-grey-scale-grey-50: var(--devsite-ref-palette-tenant--android-grey-50);
    --devsite-sys-color--android-grey-scale-grey-600: var(--devsite-ref-palette-tenant--android-grey-600);
    --devsite-sys-color--android-grey-scale-grey-800: var(--devsite-ref-palette-tenant--android-grey-800);
    --devsite-sys-color--android-primary: var(--devsite-ref-palette-tenant--android-green-300);
    --devsite-sys-color--android-primary-container: var(--devsite-ref-palette-tenant--android-black);
    --devsite-sys-color--android-secondary: var(--devsite-ref-palette-tenant--android-blue-500);
    --devsite-sys-color--android-surface-border: var(--devsite-ref-palette-tenant--android-grey-300);
    --devsite-sys-color--android-surface-bright: var(--devsite-ref-palette-tenant--android-blue-25);
    --devsite-sys-color--android-surface-brighter: var(--devsite-ref-palette-tenant--android-green-25);
    --devsite-sys-color--android-surface-container-default: var(--devsite-ref-palette-tenant--android-white);
    --devsite-sys-color--android-surface-container-high: var(--devsite-ref-palette-tenant--android-blue-100);
    --devsite-sys-color--android-surface-container-highest: var(--devsite-ref-palette-tenant--android-green-100);
    --devsite-sys-color--android-surface-container-low: var(--devsite-ref-palette-tenant--android-chartreuse-100);
    --devsite-sys-color--android-surface-container-lowest: var(--devsite-ref-palette-tenant--android-grey-100);
    --devsite-sys-color--android-surface-default: var(--devsite-ref-palette-tenant--android-white);
    --devsite-sys-color--android-surface-dim: var(--devsite-ref-palette-tenant--android-grey-50);
    --devsite-sys-color--android-surface-inverse: var(--devsite-ref-palette-tenant--android-grey-900);
    --devsite-sys-color--android-surface-on-default: var(--devsite-ref-palette-tenant--android-grey-900);
    --devsite-sys-color--android-surface-on-low: var(--devsite-ref-palette-tenant--android-grey-700);
    --devsite-sys-color--android-warning: var(--devsite-ref-palette-tenant--android-yellow-800);
    --devsite-sys-color--on-primary: var(--devsite-ref-palette--white);
    --devsite-sys-color--on-surface: var(--devsite-ref-palette--grey900);
    --devsite-sys-color--on-surface-variant: var(--devsite-ref-palette--grey700);
    --devsite-sys-color--primary: var(--devsite-ref-palette--blue600);
    --devsite-sys-color--surface: var(--devsite-ref-palette--white);
    --devsite-sys-measurement--canvas-x-large: 168px;
    --devsite-sys-measurement--tenant-home-medium: 88px;
    --devsite-sys-measurement--canvas-large: var(--devsite-ref-measurement--px-112);
    --devsite-sys-measurement--canvas-medium: var(--devsite-ref-measurement--px-56);
    --devsite-sys-measurement--canvas-small: var(--devsite-ref-measurement--px-28);
    --devsite-sys-measurement--canvas-tenant-home-medium-2: var(--devsite-ref-measurement--px-80);
    --devsite-sys-measurement--header-icon-tenant-home: var(--devsite-ref-measurement--px-60);
    --devsite-sys-measurement--icon-large: var(--devsite-ref-measurement--px-72);
    --devsite-sys-measurement--icon-medium: var(--devsite-ref-measurement--px-36);
    --devsite-sys-measurement--icon-small: var(--devsite-ref-measurement--px-18);
    --devsite-sys-measurement--icon-tenant-home-medium: var(--devsite-ref-measurement--px-80);
    --devsite-sys-measurement--icon-x-large: var(--devsite-ref-measurement--px-108);
    --devsite-sys-measurement--tenant-android-large: var(--devsite-ref-measurement--px-80);
    --devsite-sys-measurement--tenant-android-medium: var(--devsite-ref-measurement--px-56);
    --devsite-sys-measurement--tenant-android-small: var(--devsite-ref-measurement--px-48);
    --devsite-sys-measurement--tenant-android-x-large: var(--devsite-ref-measurement--px-104);
    --devsite-sys-measurement--tenant-home-small: var(--devsite-ref-measurement--px-64);
    --devsite-sys-measurement--tenant-home-x-large: var(--devsite-ref-measurement--px-172);
    --devsite-sys-typeface--tenant-accessibility-large: var(--devsite-ref-typeface--size-18);
    --devsite-sys-typeface--tenant-accessibility-medium: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typeface--tenant-accessibility-small: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typeface--body-primary--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typeface--body-primary--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typeface--body-primary--line-height: var(--devsite-ref-typeface--line-height-24);
    --devsite-sys-typeface--body-secondary--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typeface--body-secondary--font-size: var(--devsite-ref-typeface--size-12);
    --devsite-sys-typeface--body-secondary--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typeface--body-tertiary--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typeface--body-tertiary--font-size: var(--devsite-ref-typeface--size-13);
    --devsite-sys-typeface--body-tertiary--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typeface--body-tertiary--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale--body-l--font-names: var(--devsite-sys-typeface--body-primary--font-names);
    --devsite-sys-typescale--body-l--font-size: var(--devsite-sys-typeface--body-primary--font-size);
    --devsite-sys-typescale--body-l--line-height: var(--devsite-sys-typeface--body-primary--line-height);
    --devsite-sys-typescale--body-m--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--body-m--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale--body-m--font-tracking: var(--devsite-ref-typeface--letter-spacing-0-2);
    --devsite-sys-typescale--body-m--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale--body-m-brand--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--body-m-brand--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale--body-m-brand--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale--body-s--font-names: var(--devsite-sys-typeface--body-secondary--font-names);
    --devsite-sys-typescale--body-s--font-size: var(--devsite-sys-typeface--body-secondary--font-size);
    --devsite-sys-typescale--body-s--line-height: var(--devsite-sys-typeface--body-secondary--line-height);
    --devsite-sys-typescale--button-brand--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--button-brand--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale--button-brand--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--button-brand--line-height: var(--devsite-ref-typeface--line-height-36);
    --devsite-sys-typescale--button-plain--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--button-plain--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale--button-plain--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--button-plain--line-height: var(--devsite-ref-typeface--line-height-36);
    --devsite-sys-typescale--caption--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--caption--font-size: var(--devsite-ref-typeface--size-12);
    --devsite-sys-typescale--caption--font-tracking: var(--devsite-ref-typeface--letter-spacing-0-3);
    --devsite-sys-typescale--caption--line-height: var(--devsite-ref-typeface--line-height-16);
    --devsite-sys-typescale--display-heading--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--display-heading--font-size: var(--devsite-ref-typeface--size-48);
    --devsite-sys-typescale--display-heading--font-weight: var(--devsite-ref-typeface--light);
    --devsite-sys-typescale--display-heading--line-height: var(--devsite-ref-typeface--line-height-56);
    --devsite-sys-typescale--h1--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--h1--font-size: var(--devsite-ref-typeface--size-34);
    --devsite-sys-typescale--h1--font-weight: var(--devsite-ref-typeface--light);
    --devsite-sys-typescale--h1--line-height: var(--devsite-ref-typeface--line-height-40);
    --devsite-sys-typescale--h2--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--h2--font-size: var(--devsite-ref-typeface--size-24);
    --devsite-sys-typescale--h2--font-weight: var(--devsite-ref-typeface--light);
    --devsite-sys-typescale--h2--line-height: var(--devsite-ref-typeface--line-height-32);
    --devsite-sys-typescale--h3--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--h3--font-size: var(--devsite-ref-typeface--size-20);
    --devsite-sys-typescale--h3--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale--h3--line-height: var(--devsite-ref-typeface--line-height-32);
    --devsite-sys-typescale--h4--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--h4--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale--h4--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--h4--line-height: var(--devsite-ref-typeface--line-height-24);
    --devsite-sys-typescale--h5--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--h5--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale--h5--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale--h5--line-height: var(--devsite-ref-typeface--line-height-24);
    --devsite-sys-typescale--h6--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--h6--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale--h6--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--h6--line-height: var(--devsite-ref-typeface--line-height-24);
    --devsite-sys-typescale--headline-1--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--headline-1--font-size: var(--devsite-ref-typeface--size-56);
    --devsite-sys-typescale--headline-1--font-tracking: var(--devsite-ref-typeface--letter-spacing-neg-0-5);
    --devsite-sys-typescale--headline-1--line-height: var(--devsite-ref-typeface--line-height-64);
    --devsite-sys-typescale--headline-2--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--headline-2--font-size: var(--devsite-ref-typeface--size-44);
    --devsite-sys-typescale--headline-2--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale--headline-2--line-height: var(--devsite-ref-typeface--line-height-52);
    --devsite-sys-typescale--headline-3--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--headline-3--font-size: var(--devsite-ref-typeface--size-32);
    --devsite-sys-typescale--headline-3--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale--headline-3--line-height: var(--devsite-ref-typeface--line-height-40);
    --devsite-sys-typescale--headline-4--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--headline-4--font-size: var(--devsite-ref-typeface--size-24);
    --devsite-sys-typescale--headline-4--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale--headline-4--line-height: var(--devsite-ref-typeface--line-height-32);
    --devsite-sys-typescale--input--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--input--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale--input--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale--label-l--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--label-l--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale--label-l--line-height: var(--devsite-ref-typeface--line-height-16);
    --devsite-sys-typescale--label-l-500--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--label-l-500--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale--label-l-500--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--label-l-500--line-height: var(--devsite-ref-typeface--line-height-16);
    --devsite-sys-typescale--label-m-500--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--label-m-500--font-size: var(--devsite-ref-typeface--size-12);
    --devsite-sys-typescale--label-m-500--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--label-m-500--line-height: var(--devsite-ref-typeface--line-height-22);
    --devsite-sys-typescale--label-m-700--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--label-m-700--font-size: var(--devsite-ref-typeface--size-12);
    --devsite-sys-typescale--label-m-700--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale--label-m-700--line-height: var(--devsite-ref-typeface--line-height-22);
    --devsite-sys-typescale--landing-h1--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--landing-h1--font-size: var(--devsite-ref-typeface--size-64);
    --devsite-sys-typescale--landing-h1--font-tracking: var(--devsite-ref-typeface--letter-spacing-neg-0-5);
    --devsite-sys-typescale--landing-h1--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale--landing-h1--line-height: var(--devsite-ref-typeface--line-height-72);
    --devsite-sys-typescale--landing-heading--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--landing-heading--font-size: var(--devsite-ref-typeface--size-100);
    --devsite-sys-typescale--landing-heading--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale--landing-heading--line-height: var(--devsite-ref-typeface--line-height-110);
    --devsite-sys-typescale--overline-m--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--overline-m--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale--overline-m--font-tracking: var(--devsite-ref-typeface--letter-spacing-1-5);
    --devsite-sys-typescale--overline-m--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--overline-m--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale--overline-m--text-transform: uppercase;
    --devsite-sys-typescale--overline-s--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--overline-s--font-size: var(--devsite-ref-typeface--size-11);
    --devsite-sys-typescale--overline-s--font-tracking: 0.05rem;
    --devsite-sys-typescale--overline-s--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--overline-s--line-height: var(--devsite-ref-typeface--line-height-16);
    --devsite-sys-typescale--overline-s--text-transform: uppercase;
    --devsite-sys-typescale--subhead-l--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--subhead-l--font-size: var(--devsite-ref-typeface--size-20);
    --devsite-sys-typescale--subhead-l--font-tracking: var(--devsite-ref-typeface--letter-spacing-0-25);
    --devsite-sys-typescale--subhead-l--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale--subhead-l--line-height: var(--devsite-ref-typeface--line-height-32);
    --devsite-sys-typescale--subhead-m--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--subhead-m--font-size: var(--devsite-ref-typeface--size-18);
    --devsite-sys-typescale--subhead-m--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale--subhead-m--line-height: var(--devsite-ref-typeface--line-height-30);
    --devsite-sys-typescale--tag--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--tag--font-size: var(--devsite-ref-typeface--size-12);
    --devsite-sys-typescale--tag--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--tag--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale--title-l--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--title-l--font-size: var(--devsite-ref-typeface--size-18);
    --devsite-sys-typescale--title-l--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--title-l--line-height: var(--devsite-ref-typeface--line-height-24);
    --devsite-sys-typescale--title-m--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--title-m--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale--title-m--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--title-s--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--title-s--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale--title-s--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--title-s--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale--title-s-brand--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--title-s-brand--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale--title-s-brand--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--title-s-brand--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale--title-s-brandtext--font-names: var(--devsite-ref-typeface--brand-text);
    --devsite-sys-typescale--title-s-brandtext--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale--title-s-brandtext--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale--title-s-brandtext--line-height: var(--devsite-ref-typeface--line-height-18);
    --devsite-sys-typescale--title-s-brandtext-700--font-names: var(--devsite-ref-typeface--brand-text);
    --devsite-sys-typescale--title-s-brandtext-700--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale--title-s-brandtext-700--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale--title-s-brandtext-700--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale-tenant--accessibility-body-s--font-names: var(--devsite-ref-typeface--accessibility);
    --devsite-sys-typescale-tenant--accessibility-body-s--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale-tenant--accessibility-body-s--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--accessibility-body-s--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale-tenant--accessibility-display-heading--font-names: var(--devsite-ref-typeface--accessibility);
    --devsite-sys-typescale-tenant--accessibility-display-heading--font-size: var(--devsite-ref-typeface--size-64);
    --devsite-sys-typescale-tenant--accessibility-display-heading--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--accessibility-display-heading--line-height: var(--devsite-ref-typeface--line-height-84);
    --devsite-sys-typescale-tenant--accessibility-docs-headline-1--font-names: var(--devsite-ref-typeface--accessibility);
    --devsite-sys-typescale-tenant--accessibility-docs-headline-1--font-size: var(--devsite-ref-typeface--size-40);
    --devsite-sys-typescale-tenant--accessibility-docs-headline-1--font-weight: var(--devsite-ref-typeface--semibold);
    --devsite-sys-typescale-tenant--accessibility-docs-headline-1--line-height: var(--devsite-ref-typeface--line-height-48);
    --devsite-sys-typescale-tenant--accessibility-h1--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--accessibility-h1--font-size: var(--devsite-ref-typeface--size-48);
    --devsite-sys-typescale-tenant--accessibility-h1--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--accessibility-h1--line-height: var(--devsite-ref-typeface--line-height-68);
    --devsite-sys-typescale-tenant--accessibility-h2--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--accessibility-h2--font-size: var(--devsite-ref-typeface--size-38);
    --devsite-sys-typescale-tenant--accessibility-h2--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--accessibility-h2--line-height: var(--devsite-ref-typeface--line-height-56);
    --devsite-sys-typescale-tenant--accessibility-h3--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--accessibility-h3--font-size: var(--devsite-ref-typeface--size-30);
    --devsite-sys-typescale-tenant--accessibility-h3--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--accessibility-h3--line-height: var(--devsite-ref-typeface--line-height-32);
    --devsite-sys-typescale-tenant--accessibility-h4--font-names: var(--devsite-ref-typeface--accessibility);
    --devsite-sys-typescale-tenant--accessibility-h4--font-size: var(--devsite-ref-typeface--size-24);
    --devsite-sys-typescale-tenant--accessibility-h4--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--accessibility-h4--line-height: var(--devsite-ref-typeface--line-height-32);
    --devsite-sys-typescale-tenant--accessibility-h5--font-names: var(--devsite-ref-typeface--accessibility);
    --devsite-sys-typescale-tenant--accessibility-h5--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale-tenant--accessibility-h5--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--accessibility-h5--line-height: var(--devsite-ref-typeface--line-height-22);
    --devsite-sys-typescale-tenant--accessibility-headline-1--font-names: var(--devsite-ref-typeface--accessibility);
    --devsite-sys-typescale-tenant--accessibility-headline-1--font-size: var(--devsite-ref-typeface--size-32);
    --devsite-sys-typescale-tenant--accessibility-headline-1--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--accessibility-headline-1--line-height: var(--devsite-ref-typeface--line-height-40);
    --devsite-sys-typescale-tenant--accessibility-headline-3--font-names: var(--devsite-ref-typeface--accessibility);
    --devsite-sys-typescale-tenant--accessibility-headline-3--font-size: var(--devsite-ref-typeface--size-32);
    --devsite-sys-typescale-tenant--accessibility-headline-3--font-weight: var(--devsite-ref-typeface--semibold);
    --devsite-sys-typescale-tenant--accessibility-headline-3--line-height: var(--devsite-ref-typeface--line-height-40);
    --devsite-sys-typescale-tenant--accessibility-title-s--font-names: var(--devsite-ref-typeface--accessibility);
    --devsite-sys-typescale-tenant--accessibility-title-s--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale-tenant--accessibility-title-s--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--accessibility-title-s--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale-tenant--android-body-m--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-body-m--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale-tenant--android-body-m--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--android-body-m--line-height: var(--devsite-ref-typeface--line-height-24);
    --devsite-sys-typescale-tenant--android-body-s--font-names: var(--devsite-ref-typeface--brand-text);
    --devsite-sys-typescale-tenant--android-body-s--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale-tenant--android-body-s--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--android-body-s--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale-tenant--android-button--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-button--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale-tenant--android-button--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--android-button--line-height: var(--devsite-ref-typeface--line-height-48);
    --devsite-sys-typescale-tenant--android-detail--font-names: var(--devsite-ref-typeface--brand-text);
    --devsite-sys-typescale-tenant--android-detail--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale-tenant--android-detail--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--android-detail--line-height: var(--devsite-ref-typeface--line-height-24);
    --devsite-sys-typescale-tenant--android-docs-headline-1--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-docs-headline-1--font-size: var(--devsite-ref-typeface--size-40);
    --devsite-sys-typescale-tenant--android-docs-headline-1--font-tracking: var(--devsite-ref-typeface--letter-spacing-neg-0-5);
    --devsite-sys-typescale-tenant--android-docs-headline-1--font-weight: var(--devsite-ref-typeface--semibold);
    --devsite-sys-typescale-tenant--android-docs-headline-1--line-height: var(--devsite-ref-typeface--line-height-48);
    --devsite-sys-typescale-tenant--android-docs-headline-2--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-docs-headline-2--font-size: var(--devsite-ref-typeface--size-24);
    --devsite-sys-typescale-tenant--android-docs-headline-2--font-tracking: var(--devsite-ref-typeface--letter-spacing-0);
    --devsite-sys-typescale-tenant--android-docs-headline-2--font-weight: var(--devsite-ref-typeface--semibold);
    --devsite-sys-typescale-tenant--android-docs-headline-2--line-height: var(--devsite-ref-typeface--line-height-32);
    --devsite-sys-typescale-tenant--android-docs-headline-3--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-docs-headline-3--font-size: var(--devsite-ref-typeface--size-20);
    --devsite-sys-typescale-tenant--android-docs-headline-3--font-tracking: var(--devsite-ref-typeface--letter-spacing-0);
    --devsite-sys-typescale-tenant--android-docs-headline-3--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--android-docs-headline-3--line-height: var(--devsite-ref-typeface--line-height-28);
    --devsite-sys-typescale-tenant--android-docs-headline-4--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-docs-headline-4--font-size: var(--devsite-ref-typeface--size-18);
    --devsite-sys-typescale-tenant--android-docs-headline-4--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--android-docs-headline-4--line-height: var(--devsite-ref-typeface--line-height-28);
    --devsite-sys-typescale-tenant--android-docs-headline-5--font-names: var(--devsite-ref-typeface--brand-text);
    --devsite-sys-typescale-tenant--android-docs-headline-5--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale-tenant--android-docs-headline-5--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--android-docs-headline-5--line-height: var(--devsite-ref-typeface--line-height-24);
    --devsite-sys-typescale-tenant--android-docs-headline-6--font-names: var(--devsite-ref-typeface--brand-text);
    --devsite-sys-typescale-tenant--android-docs-headline-6--font-size: var(--devsite-ref-typeface--size-22);
    --devsite-sys-typescale-tenant--android-docs-headline-6--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--android-docs-headline-6--line-height: var(--devsite-ref-typeface--line-height-28);
    --devsite-sys-typescale-tenant--android-docs-headline-7--font-names: var(--devsite-ref-typeface--brand-text);
    --devsite-sys-typescale-tenant--android-docs-headline-7--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale-tenant--android-docs-headline-7--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--android-docs-headline-7--line-height: var(--devsite-ref-typeface--line-height-28);
    --devsite-sys-typescale-tenant--android-headline-1--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-headline-1--font-size: var(--devsite-ref-typeface--size-64);
    --devsite-sys-typescale-tenant--android-headline-1--font-tracking: var(--devsite-ref-typeface--letter-spacing-neg-0-5);
    --devsite-sys-typescale-tenant--android-headline-1--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--android-headline-1--line-height: var(--devsite-ref-typeface--line-height-72);
    --devsite-sys-typescale-tenant--android-headline-2--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-headline-2--font-size: var(--devsite-ref-typeface--size-48);
    --devsite-sys-typescale-tenant--android-headline-2--font-tracking: var(--devsite-ref-typeface--letter-spacing-neg-0-5);
    --devsite-sys-typescale-tenant--android-headline-2--font-weight: var(--devsite-ref-typeface--semibold);
    --devsite-sys-typescale-tenant--android-headline-2--line-height: var(--devsite-ref-typeface--line-height-56);
    --devsite-sys-typescale-tenant--android-headline-4--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-headline-4--font-size: var(--devsite-ref-typeface--size-32);
    --devsite-sys-typescale-tenant--android-headline-4--font-tracking: var(--devsite-ref-typeface--letter-spacing-neg-0-25);
    --devsite-sys-typescale-tenant--android-headline-4--font-weight: var(--devsite-ref-typeface--semibold);
    --devsite-sys-typescale-tenant--android-headline-4--line-height: var(--devsite-ref-typeface--line-height-40);
    --devsite-sys-typescale-tenant--android-headline-5--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-headline-5--font-size: var(--devsite-ref-typeface--size-24);
    --devsite-sys-typescale-tenant--android-headline-5--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--android-headline-5--line-height: var(--devsite-ref-typeface--line-height-32);
    --devsite-sys-typescale-tenant--android-headline-6--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-headline-6--font-size: var(--devsite-ref-typeface--size-22);
    --devsite-sys-typescale-tenant--android-headline-6--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--android-headline-6--line-height: var(--devsite-ref-typeface--line-height-28);
    --devsite-sys-typescale-tenant--android-overline--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-overline--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale-tenant--android-overline--font-tracking: var(--devsite-ref-typeface--letter-spacing-1-5);
    --devsite-sys-typescale-tenant--android-overline--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--android-overline--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale-tenant--android-overline-s--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale-tenant--android-overline-s--font-size: var(--devsite-ref-typeface--size-11);
    --devsite-sys-typescale-tenant--android-overline-s--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--android-overline-s--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale-tenant--android-title-l--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-title-l--font-size: var(--devsite-ref-typeface--size-22);
    --devsite-sys-typescale-tenant--android-title-l--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--android-title-l--line-height: var(--devsite-ref-typeface--line-height-28);
    --devsite-sys-typescale-tenant--android-title-m--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-title-m--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale-tenant--android-title-m--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--android-title-m--line-height: var(--devsite-ref-typeface--line-height-24);
    --devsite-sys-typescale-tenant--android-title-s-400--font-names: var(--devsite-ref-typeface--brand-text);
    --devsite-sys-typescale-tenant--android-title-s-400--font-size: var(--devsite-ref-typeface--size-20);
    --devsite-sys-typescale-tenant--android-title-s-400--font-tracking: var(--devsite-ref-typeface--letter-spacing-0-25);
    --devsite-sys-typescale-tenant--android-title-s-400--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--android-title-s-400--line-height: var(--devsite-ref-typeface--line-height-32);
    --devsite-sys-typescale-tenant--android-title-s-500--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-title-s-500--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale-tenant--android-title-s-500--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--android-title-s-500--line-height: var(--devsite-ref-typeface--line-height-24);
    --devsite-sys-typescale-tenant--android-title-s-600--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-title-s-600--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale-tenant--android-title-s-600--font-weight: var(--devsite-ref-typeface--semibold);
    --devsite-sys-typescale-tenant--android-title-s-600--line-height: var(--devsite-ref-typeface--line-height-20);
    --devsite-sys-typescale-tenant--cloud-body-m--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--cloud-body-m--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale-tenant--cloud-body-m--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--cloud-body-m--line-height: var(--devsite-ref-typeface--line-height-22);
    --devsite-sys-typescale-tenant--cloud-body-xs--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--cloud-body-xs--font-size: var(--devsite-ref-typeface--size-11);
    --devsite-sys-typescale-tenant--cloud-body-xs--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--cloud-body-xs--line-height: var(--devsite-ref-typeface--line-height-14);
    --devsite-sys-typescale-tenant--cloud-title-m--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--cloud-title-m--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale-tenant--cloud-title-m--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--cloud-title-m--line-height: var(--devsite-ref-typeface--line-height-30);
    --devsite-sys-typescale-tenant--code-s--font-names: var(--devsite-ref-typeface--code);
    --devsite-sys-typescale-tenant--code-s--font-size: var(--devsite-ref-typeface--size-13);
    --devsite-sys-typescale-tenant--code-s--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--code-s--line-height: var(--devsite-ref-typeface--line-height-16);
    --devsite-sys-typescale-tenant--fuchsia-h1--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale-tenant--fuchsia-h1--font-size: var(--devsite-ref-typeface--size-34);
    --devsite-sys-typescale-tenant--fuchsia-h1--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--fuchsia-h1--line-height: var(--devsite-ref-typeface--line-height-40);
    --devsite-sys-typescale-tenant--home-display-heading--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--home-display-heading--font-size: var(--devsite-ref-typeface--size-64);
    --devsite-sys-typescale-tenant--home-display-heading--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--home-display-heading--line-height: var(--devsite-ref-typeface--line-height-76);
    --devsite-sys-typescale-tenant--home-headline-2--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--home-headline-2--font-size: var(--devsite-ref-typeface--size-40);
    --devsite-sys-typescale-tenant--home-headline-2--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--home-headline-2--line-height: var(--devsite-ref-typeface--line-height-48);
    --devsite-sys-typescale-tenant--home-headline-3--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--home-headline-3--font-size: var(--devsite-ref-typeface--size-32);
    --devsite-sys-typescale-tenant--home-headline-3--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--home-headline-3--line-height: var(--devsite-ref-typeface--line-height-40);
    --devsite-sys-typescale-tenant--home-headline-3-700--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--home-headline-3-700--font-size: var(--devsite-ref-typeface--size-32);
    --devsite-sys-typescale-tenant--home-headline-3-700--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--home-headline-3-700--line-height: var(--devsite-ref-typeface--line-height-40);
    --devsite-sys-typescale-tenant--home-headline-4--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--home-headline-4--font-size: var(--devsite-ref-typeface--size-24);
    --devsite-sys-typescale-tenant--home-headline-4--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--home-headline-4--line-height: var(--devsite-ref-typeface--line-height-32);
    --devsite-sys-typescale-tenant--home-headline-6--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--home-headline-6--font-size: var(--devsite-ref-typeface--size-18);
    --devsite-sys-typescale-tenant--home-headline-6--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--home-headline-6--line-height: var(--devsite-ref-typeface--line-height-24);
    --devsite-sys-typescale-tenant--non-endorsed-body-m--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale-tenant--non-endorsed-body-m--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale-tenant--non-endorsed-body-m--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--non-endorsed-body-m--line-height: var(--devsite-ref-typeface--line-height-24);
    --devsite-sys-typescale-tenant--non-endorsed-h2--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale-tenant--non-endorsed-h2--font-size: var(--devsite-ref-typeface--size-24);
    --devsite-sys-typescale-tenant--non-endorsed-h2--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--non-endorsed-h2--line-height: var(--devsite-ref-typeface--line-height-32);
    --devsite-sys-typescale-tenant--non-endorsed-h3--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--non-endorsed-h3--font-size: var(--devsite-ref-typeface--size-22);
    --devsite-sys-typescale-tenant--non-endorsed-h3--line-height: var(--devsite-ref-typeface--line-height-32);
    --devsite-sys-typescale-tenant--non-endorsed-h4--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale-tenant--non-endorsed-h4--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale-tenant--non-endorsed-h4--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--non-endorsed-h4--line-height: var(--devsite-ref-typeface--line-height-22);
    --devsite-sys-typescale-tenant--non-endorsed-h6--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--non-endorsed-h6--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale-tenant--non-endorsed-h6--line-height: var(--devsite-ref-typeface--line-height-24);
    --devsite-sys-typescale-tenant--non-endorsed-headline-5-5--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--non-endorsed-headline-5-5--font-size: var(--devsite-ref-typeface--size-20);
    --devsite-sys-typescale-tenant--non-endorsed-headline-5-5--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--non-endorsed-headline-5-5--line-height: var(--devsite-ref-typeface--line-height-28)
}

:root .color-scheme--dark {
    --devsite-gm3-sys-color--background: #131314;
    --devsite-gm3-sys-color--error: #f2b8b5;
    --devsite-gm3-sys-color--error-container: #8c1d18;
    --devsite-gm3-sys-color--inverse-on-surface: #303030;
    --devsite-gm3-sys-color--inverse-primary: #0b57d0;
    --devsite-gm3-sys-color--inverse-surface: #e3e3e3;
    --devsite-gm3-sys-color--on-background: #e3e3e3;
    --devsite-gm3-sys-color--on-error: #601410;
    --devsite-gm3-sys-color--on-error-container: #f9dedc;
    --devsite-gm3-sys-color--on-primary: #062e6f;
    --devsite-gm3-sys-color--on-primary-container: #d3e3fd;
    --devsite-gm3-sys-color--on-secondary: #035;
    --devsite-gm3-sys-color--on-secondary-container: #c2e7ff;
    --devsite-gm3-sys-color--on-surface: #e3e3e3;
    --devsite-gm3-sys-color--on-surface-variant: #c4c7c5;
    --devsite-gm3-sys-color--on-tertiary: #0a3818;
    --devsite-gm3-sys-color--on-tertiary-container: #c4eed0;
    --devsite-gm3-sys-color--outline: #8e918f;
    --devsite-gm3-sys-color--outline-variant: #444746;
    --devsite-gm3-sys-color--primary: #a8c7fa;
    --devsite-gm3-sys-color--primary-container: #0842a0;
    --devsite-gm3-sys-color--secondary: #7fcfff;
    --devsite-gm3-sys-color--secondary-container: #004a77;
    --devsite-gm3-sys-color--surface: #131314;
    --devsite-gm3-sys-color--surface-bright: #37393b;
    --devsite-gm3-sys-color--surface-container: #1e1f20;
    --devsite-gm3-sys-color--surface-container-high: #282a2c;
    --devsite-gm3-sys-color--surface-container-highest: #333537;
    --devsite-gm3-sys-color--surface-container-low: #1b1b1b;
    --devsite-gm3-sys-color--surface-container-lowest: #0e0e0e;
    --devsite-gm3-sys-color--surface-dim: #131314;
    --devsite-gm3-sys-color--surface-variant: #444746;
    --devsite-gm3-sys-color--tertiary: #6dd58c;
    --devsite-gm3-sys-color--tertiary-container: #0f5223
}

:root .color-scheme--dark {
    --devsite-sys-color--android-core-blue-25: var(--devsite-ref-palette-tenant--android-blue-900);
    --devsite-sys-color--android-core-blue-50: var(--devsite-ref-palette-tenant--android-blue-800);
    --devsite-sys-color--android-core-green-25: var(--devsite-ref-palette-tenant--android-green-900);
    --devsite-sys-color--android-core-green-50: var(--devsite-ref-palette-tenant--android-green-800);
    --devsite-sys-color--android-error: var(--devsite-ref-palette-tenant--android-coral);
    --devsite-sys-color--android-grey-scale-grey-200: var(--devsite-ref-palette-tenant--android-grey-700);
    --devsite-sys-color--android-grey-scale-grey-50: var(--devsite-ref-palette-tenant--android-grey-900);
    --devsite-sys-color--android-grey-scale-grey-600: var(--devsite-ref-palette-tenant--android-grey-300);
    --devsite-sys-color--android-grey-scale-grey-800: var(--devsite-ref-palette-tenant--android-grey-100);
    --devsite-sys-color--android-primary: var(--devsite-ref-palette-tenant--android-green-500);
    --devsite-sys-color--android-primary-container: var(--devsite-ref-palette-tenant--android-white);
    --devsite-sys-color--android-secondary: var(--devsite-ref-palette-tenant--android-blue-200);
    --devsite-sys-color--android-surface-border: var(--devsite-ref-palette-tenant--android-grey-600);
    --devsite-sys-color--android-surface-bright: var(--devsite-ref-palette-tenant--android-blue-800);
    --devsite-sys-color--android-surface-brighter: var(--devsite-ref-palette-tenant--android-green-800);
    --devsite-sys-color--android-surface-container-default: var(--devsite-ref-palette-tenant--android-grey-1000);
    --devsite-sys-color--android-surface-container-high: var(--devsite-ref-palette-tenant--android-blue-700);
    --devsite-sys-color--android-surface-container-highest: var(--devsite-ref-palette-tenant--android-green-700);
    --devsite-sys-color--android-surface-container-low: var(--devsite-ref-palette-tenant--android-chartreuse-900);
    --devsite-sys-color--android-surface-container-lowest: var(--devsite-ref-palette-tenant--android-grey-800);
    --devsite-sys-color--android-surface-default: var(--devsite-ref-palette-tenant--android-grey-1000);
    --devsite-sys-color--android-surface-dim: var(--devsite-ref-palette-tenant--android-grey-900);
    --devsite-sys-color--android-surface-inverse: var(--devsite-ref-palette-tenant--android-grey-50);
    --devsite-sys-color--android-surface-on-default: var(--devsite-ref-palette-tenant--android-grey-50);
    --devsite-sys-color--android-surface-on-low: var(--devsite-ref-palette-tenant--android-grey-200);
    --devsite-sys-color--on-primary: var(--devsite-ref-palette--grey900);
    --devsite-sys-color--on-surface: var(--devsite-ref-palette--grey200);
    --devsite-sys-color--on-surface-variant: var(--devsite-ref-palette--grey500);
    --devsite-sys-color--primary: var(--devsite-ref-palette--blue300);
    --devsite-sys-color--surface: var(--devsite-ref-palette--dark-grey)
}

:root .devsite-sys-typeface--body-primary {
    font-family: var(--devsite-sys-typeface--body-primary--font-names);
    font-size: var(--devsite-sys-typeface--body-primary--font-size);
    line-height: var(--devsite-sys-typeface--body-primary--line-height)
}

:root .devsite-sys-typeface--body-secondary {
    font-family: var(--devsite-sys-typeface--body-secondary--font-names);
    font-size: var(--devsite-sys-typeface--body-secondary--font-size);
    line-height: var(--devsite-sys-typeface--body-secondary--line-height)
}

:root .devsite-sys-typeface--body-tertiary {
    font-family: var(--devsite-sys-typeface--body-tertiary--font-names);
    font-size: var(--devsite-sys-typeface--body-tertiary--font-size);
    font-weight: var(--devsite-sys-typeface--body-tertiary--font-weight);
    line-height: var(--devsite-sys-typeface--body-tertiary--line-height)
}

:root .viewport--mobile {
    --devsite-sys-typescale--h1--font-names: var(--devsite-ref-typeface--plain-regular);
    --devsite-sys-typescale--h1--font-size: var(--devsite-ref-typeface--size-24);
    --devsite-sys-typescale--h1--font-weight: var(--devsite-ref-typeface--light);
    --devsite-sys-typescale--h1--line-height: var(--devsite-ref-typeface--line-height-32);
    --devsite-sys-typescale--headline-3--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--headline-3--font-size: var(--devsite-ref-typeface--size-20);
    --devsite-sys-typescale--headline-3--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale--headline-3--line-height: var(--devsite-ref-typeface--line-height-28);
    --devsite-sys-typescale--headline-4--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale--headline-4--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale--headline-4--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale--headline-4--line-height: var(--devsite-ref-typeface--line-height-26)
}

:root .devsite-sys-typescale--body-l {
    font-family: var(--devsite-sys-typescale--body-l--font-names);
    font-size: var(--devsite-sys-typescale--body-l--font-size);
    line-height: var(--devsite-sys-typescale--body-l--line-height)
}

:root .devsite-sys-typescale--body-m {
    font-family: var(--devsite-sys-typescale--body-m--font-names);
    font-size: var(--devsite-sys-typescale--body-m--font-size);
    letter-spacing: var(--devsite-sys-typescale--body-m--font-tracking);
    line-height: var(--devsite-sys-typescale--body-m--line-height)
}

:root .devsite-sys-typescale--body-m-brand {
    font-family: var(--devsite-sys-typescale--body-m-brand--font-names);
    font-size: var(--devsite-sys-typescale--body-m-brand--font-size);
    line-height: var(--devsite-sys-typescale--body-m-brand--line-height)
}

:root .devsite-sys-typescale--body-s {
    font-family: var(--devsite-sys-typescale--body-s--font-names);
    font-size: var(--devsite-sys-typescale--body-s--font-size);
    line-height: var(--devsite-sys-typescale--body-s--line-height)
}

:root .devsite-sys-typescale--button-brand {
    font-family: var(--devsite-sys-typescale--button-brand--font-names);
    font-size: var(--devsite-sys-typescale--button-brand--font-size);
    font-weight: var(--devsite-sys-typescale--button-brand--font-weight);
    line-height: var(--devsite-sys-typescale--button-brand--line-height)
}

:root .devsite-sys-typescale--button-plain {
    font-family: var(--devsite-sys-typescale--button-plain--font-names);
    font-size: var(--devsite-sys-typescale--button-plain--font-size);
    font-weight: var(--devsite-sys-typescale--button-plain--font-weight);
    line-height: var(--devsite-sys-typescale--button-plain--line-height)
}

:root .devsite-sys-typescale--caption {
    font-family: var(--devsite-sys-typescale--caption--font-names);
    font-size: var(--devsite-sys-typescale--caption--font-size);
    letter-spacing: var(--devsite-sys-typescale--caption--font-tracking);
    line-height: var(--devsite-sys-typescale--caption--line-height)
}

:root .devsite-sys-typescale--display-heading {
    font-family: var(--devsite-sys-typescale--display-heading--font-names);
    font-size: var(--devsite-sys-typescale--display-heading--font-size);
    font-weight: var(--devsite-sys-typescale--display-heading--font-weight);
    line-height: var(--devsite-sys-typescale--display-heading--line-height)
}

:root .devsite-sys-typescale--h1 {
    font-family: var(--devsite-sys-typescale--h1--font-names);
    font-size: var(--devsite-sys-typescale--h1--font-size);
    font-weight: var(--devsite-sys-typescale--h1--font-weight);
    line-height: var(--devsite-sys-typescale--h1--line-height)
}

:root .devsite-sys-typescale--h2 {
    font-family: var(--devsite-sys-typescale--h2--font-names);
    font-size: var(--devsite-sys-typescale--h2--font-size);
    font-weight: var(--devsite-sys-typescale--h2--font-weight);
    line-height: var(--devsite-sys-typescale--h2--line-height)
}

:root .devsite-sys-typescale--h3 {
    font-family: var(--devsite-sys-typescale--h3--font-names);
    font-size: var(--devsite-sys-typescale--h3--font-size);
    font-weight: var(--devsite-sys-typescale--h3--font-weight);
    line-height: var(--devsite-sys-typescale--h3--line-height)
}

:root .devsite-sys-typescale--h4 {
    font-family: var(--devsite-sys-typescale--h4--font-names);
    font-size: var(--devsite-sys-typescale--h4--font-size);
    font-weight: var(--devsite-sys-typescale--h4--font-weight);
    line-height: var(--devsite-sys-typescale--h4--line-height)
}

:root .devsite-sys-typescale--h5 {
    font-family: var(--devsite-sys-typescale--h5--font-names);
    font-size: var(--devsite-sys-typescale--h5--font-size);
    font-weight: var(--devsite-sys-typescale--h5--font-weight);
    line-height: var(--devsite-sys-typescale--h5--line-height)
}

:root .devsite-sys-typescale--h6 {
    font-family: var(--devsite-sys-typescale--h6--font-names);
    font-size: var(--devsite-sys-typescale--h6--font-size);
    font-weight: var(--devsite-sys-typescale--h6--font-weight);
    line-height: var(--devsite-sys-typescale--h6--line-height)
}

:root .devsite-sys-typescale--headline-1 {
    font-family: var(--devsite-sys-typescale--headline-1--font-names);
    font-size: var(--devsite-sys-typescale--headline-1--font-size);
    letter-spacing: var(--devsite-sys-typescale--headline-1--font-tracking);
    line-height: var(--devsite-sys-typescale--headline-1--line-height)
}

:root .devsite-sys-typescale--headline-2 {
    font-family: var(--devsite-sys-typescale--headline-2--font-names);
    font-size: var(--devsite-sys-typescale--headline-2--font-size);
    font-weight: var(--devsite-sys-typescale--headline-2--font-weight);
    line-height: var(--devsite-sys-typescale--headline-2--line-height)
}

:root .devsite-sys-typescale--headline-3 {
    font-family: var(--devsite-sys-typescale--headline-3--font-names);
    font-size: var(--devsite-sys-typescale--headline-3--font-size);
    font-weight: var(--devsite-sys-typescale--headline-3--font-weight);
    line-height: var(--devsite-sys-typescale--headline-3--line-height)
}

:root .devsite-sys-typescale--headline-4 {
    font-family: var(--devsite-sys-typescale--headline-4--font-names);
    font-size: var(--devsite-sys-typescale--headline-4--font-size);
    font-weight: var(--devsite-sys-typescale--headline-4--font-weight);
    line-height: var(--devsite-sys-typescale--headline-4--line-height)
}

:root .devsite-sys-typescale--input {
    font-family: var(--devsite-sys-typescale--input--font-names);
    font-size: var(--devsite-sys-typescale--input--font-size);
    line-height: var(--devsite-sys-typescale--input--line-height)
}

:root .devsite-sys-typescale--label-l {
    font-family: var(--devsite-sys-typescale--label-l--font-names);
    font-size: var(--devsite-sys-typescale--label-l--font-size);
    line-height: var(--devsite-sys-typescale--label-l--line-height)
}

:root .devsite-sys-typescale--label-l-500 {
    font-family: var(--devsite-sys-typescale--label-l-500--font-names);
    font-size: var(--devsite-sys-typescale--label-l-500--font-size);
    font-weight: var(--devsite-sys-typescale--label-l-500--font-weight);
    line-height: var(--devsite-sys-typescale--label-l-500--line-height)
}

:root .devsite-sys-typescale--label-m-500 {
    font-family: var(--devsite-sys-typescale--label-m-500--font-names);
    font-size: var(--devsite-sys-typescale--label-m-500--font-size);
    font-weight: var(--devsite-sys-typescale--label-m-500--font-weight);
    line-height: var(--devsite-sys-typescale--label-m-500--line-height)
}

:root .devsite-sys-typescale--label-m-700 {
    font-family: var(--devsite-sys-typescale--label-m-700--font-names);
    font-size: var(--devsite-sys-typescale--label-m-700--font-size);
    font-weight: var(--devsite-sys-typescale--label-m-700--font-weight);
    line-height: var(--devsite-sys-typescale--label-m-700--line-height)
}

:root .devsite-sys-typescale--landing-h1 {
    font-family: var(--devsite-sys-typescale--landing-h1--font-names);
    font-size: var(--devsite-sys-typescale--landing-h1--font-size);
    font-weight: var(--devsite-sys-typescale--landing-h1--font-weight);
    letter-spacing: var(--devsite-sys-typescale--landing-h1--font-tracking);
    line-height: var(--devsite-sys-typescale--landing-h1--line-height)
}

:root .devsite-sys-typescale--landing-heading {
    font-family: var(--devsite-sys-typescale--landing-heading--font-names);
    font-size: var(--devsite-sys-typescale--landing-heading--font-size);
    font-weight: var(--devsite-sys-typescale--landing-heading--font-weight);
    line-height: var(--devsite-sys-typescale--landing-heading--line-height)
}

:root .devsite-sys-typescale--overline-m {
    font-family: var(--devsite-sys-typescale--overline-m--font-names);
    font-size: var(--devsite-sys-typescale--overline-m--font-size);
    font-weight: var(--devsite-sys-typescale--overline-m--font-weight);
    letter-spacing: var(--devsite-sys-typescale--overline-m--font-tracking);
    line-height: var(--devsite-sys-typescale--overline-m--line-height);
    text-transform: var(--devsite-sys-typescale--overline-m--text-transform)
}

:root .devsite-sys-typescale--overline-s {
    font-family: var(--devsite-sys-typescale--overline-s--font-names);
    font-size: var(--devsite-sys-typescale--overline-s--font-size);
    font-weight: var(--devsite-sys-typescale--overline-s--font-weight);
    letter-spacing: var(--devsite-sys-typescale--overline-s--font-tracking);
    line-height: var(--devsite-sys-typescale--overline-s--line-height);
    text-transform: var(--devsite-sys-typescale--overline-s--text-transform)
}

:root .devsite-sys-typescale--subhead-l {
    font-family: var(--devsite-sys-typescale--subhead-l--font-names);
    font-size: var(--devsite-sys-typescale--subhead-l--font-size);
    font-weight: var(--devsite-sys-typescale--subhead-l--font-weight);
    letter-spacing: var(--devsite-sys-typescale--subhead-l--font-tracking);
    line-height: var(--devsite-sys-typescale--subhead-l--line-height)
}

:root .devsite-sys-typescale--subhead-m {
    font-family: var(--devsite-sys-typescale--subhead-m--font-names);
    font-size: var(--devsite-sys-typescale--subhead-m--font-size);
    font-weight: var(--devsite-sys-typescale--subhead-m--font-weight);
    line-height: var(--devsite-sys-typescale--subhead-m--line-height)
}

:root .devsite-sys-typescale--tag {
    font-family: var(--devsite-sys-typescale--tag--font-names);
    font-size: var(--devsite-sys-typescale--tag--font-size);
    font-weight: var(--devsite-sys-typescale--tag--font-weight);
    line-height: var(--devsite-sys-typescale--tag--line-height)
}

:root .devsite-sys-typescale--title-l {
    font-family: var(--devsite-sys-typescale--title-l--font-names);
    font-size: var(--devsite-sys-typescale--title-l--font-size);
    font-weight: var(--devsite-sys-typescale--title-l--font-weight);
    line-height: var(--devsite-sys-typescale--title-l--line-height)
}

:root .devsite-sys-typescale--title-m {
    font-family: var(--devsite-sys-typescale--title-m--font-names);
    font-size: var(--devsite-sys-typescale--title-m--font-size);
    font-weight: var(--devsite-sys-typescale--title-m--font-weight)
}

:root .devsite-sys-typescale--title-s {
    font-family: var(--devsite-sys-typescale--title-s--font-names);
    font-size: var(--devsite-sys-typescale--title-s--font-size);
    font-weight: var(--devsite-sys-typescale--title-s--font-weight);
    line-height: var(--devsite-sys-typescale--title-s--line-height)
}

:root .devsite-sys-typescale--title-s-brand {
    font-family: var(--devsite-sys-typescale--title-s-brand--font-names);
    font-size: var(--devsite-sys-typescale--title-s-brand--font-size);
    font-weight: var(--devsite-sys-typescale--title-s-brand--font-weight);
    line-height: var(--devsite-sys-typescale--title-s-brand--line-height)
}

:root .devsite-sys-typescale--title-s-brandtext {
    font-family: var(--devsite-sys-typescale--title-s-brandtext--font-names);
    font-size: var(--devsite-sys-typescale--title-s-brandtext--font-size);
    font-weight: var(--devsite-sys-typescale--title-s-brandtext--font-weight);
    line-height: var(--devsite-sys-typescale--title-s-brandtext--line-height)
}

:root .devsite-sys-typescale--title-s-brandtext-700 {
    font-family: var(--devsite-sys-typescale--title-s-brandtext-700--font-names);
    font-size: var(--devsite-sys-typescale--title-s-brandtext-700--font-size);
    font-weight: var(--devsite-sys-typescale--title-s-brandtext-700--font-weight);
    line-height: var(--devsite-sys-typescale--title-s-brandtext-700--line-height)
}

:root .viewport--mobile {
    --devsite-sys-typescale-tenant--android-detail--font-names: var(--devsite-ref-typeface--brand-text);
    --devsite-sys-typescale-tenant--android-detail--font-size: var(--devsite-ref-typeface--size-14);
    --devsite-sys-typescale-tenant--android-detail--font-weight: var(--devsite-ref-typeface--medium);
    --devsite-sys-typescale-tenant--android-detail--line-height: var(--devsite-ref-typeface--line-height-16);
    --devsite-sys-typescale-tenant--android-title-s-400--font-names: var(--devsite-ref-typeface--brand-text);
    --devsite-sys-typescale-tenant--android-title-s-400--font-size: var(--devsite-ref-typeface--size-16);
    --devsite-sys-typescale-tenant--android-title-s-400--font-tracking: var(--devsite-ref-typeface--letter-spacing-0-25);
    --devsite-sys-typescale-tenant--android-title-s-400--font-weight: var(--devsite-ref-typeface--regular);
    --devsite-sys-typescale-tenant--android-title-s-400--line-height: var(--devsite-ref-typeface--line-height-24)
}

:root .viewport--tablet {
    --devsite-sys-typescale-tenant--android-headline-1--font-names: var(--devsite-ref-typeface--brand-regular);
    --devsite-sys-typescale-tenant--android-headline-1--font-size: var(--devsite-ref-typeface--size-48);
    --devsite-sys-typescale-tenant--android-headline-1--font-tracking: var(--devsite-ref-typeface--letter-spacing-neg-0-5);
    --devsite-sys-typescale-tenant--android-headline-1--font-weight: var(--devsite-ref-typeface--bold);
    --devsite-sys-typescale-tenant--android-headline-1--line-height: var(--devsite-ref-typeface--line-height-56)
}

:root .devsite-sys-typescale-tenant--accessibility-body-s {
    font-family: var(--devsite-sys-typescale-tenant--accessibility-body-s--font-names);
    font-size: var(--devsite-sys-typescale-tenant--accessibility-body-s--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--accessibility-body-s--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--accessibility-body-s--line-height)
}

:root .devsite-sys-typescale-tenant--accessibility-display-heading {
    font-family: var(--devsite-sys-typescale-tenant--accessibility-display-heading--font-names);
    font-size: var(--devsite-sys-typescale-tenant--accessibility-display-heading--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--accessibility-display-heading--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--accessibility-display-heading--line-height)
}

:root .devsite-sys-typescale-tenant--accessibility-docs-headline-1 {
    font-family: var(--devsite-sys-typescale-tenant--accessibility-docs-headline-1--font-names);
    font-size: var(--devsite-sys-typescale-tenant--accessibility-docs-headline-1--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--accessibility-docs-headline-1--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--accessibility-docs-headline-1--line-height)
}

:root .devsite-sys-typescale-tenant--accessibility-h1 {
    font-family: var(--devsite-sys-typescale-tenant--accessibility-h1--font-names);
    font-size: var(--devsite-sys-typescale-tenant--accessibility-h1--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--accessibility-h1--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--accessibility-h1--line-height)
}

:root .devsite-sys-typescale-tenant--accessibility-h2 {
    font-family: var(--devsite-sys-typescale-tenant--accessibility-h2--font-names);
    font-size: var(--devsite-sys-typescale-tenant--accessibility-h2--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--accessibility-h2--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--accessibility-h2--line-height)
}

:root .devsite-sys-typescale-tenant--accessibility-h3 {
    font-family: var(--devsite-sys-typescale-tenant--accessibility-h3--font-names);
    font-size: var(--devsite-sys-typescale-tenant--accessibility-h3--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--accessibility-h3--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--accessibility-h3--line-height)
}

:root .devsite-sys-typescale-tenant--accessibility-h4 {
    font-family: var(--devsite-sys-typescale-tenant--accessibility-h4--font-names);
    font-size: var(--devsite-sys-typescale-tenant--accessibility-h4--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--accessibility-h4--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--accessibility-h4--line-height)
}

:root .devsite-sys-typescale-tenant--accessibility-h5 {
    font-family: var(--devsite-sys-typescale-tenant--accessibility-h5--font-names);
    font-size: var(--devsite-sys-typescale-tenant--accessibility-h5--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--accessibility-h5--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--accessibility-h5--line-height)
}

:root .devsite-sys-typescale-tenant--accessibility-headline-1 {
    font-family: var(--devsite-sys-typescale-tenant--accessibility-headline-1--font-names);
    font-size: var(--devsite-sys-typescale-tenant--accessibility-headline-1--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--accessibility-headline-1--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--accessibility-headline-1--line-height)
}

:root .devsite-sys-typescale-tenant--accessibility-headline-3 {
    font-family: var(--devsite-sys-typescale-tenant--accessibility-headline-3--font-names);
    font-size: var(--devsite-sys-typescale-tenant--accessibility-headline-3--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--accessibility-headline-3--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--accessibility-headline-3--line-height)
}

:root .devsite-sys-typescale-tenant--accessibility-title-s {
    font-family: var(--devsite-sys-typescale-tenant--accessibility-title-s--font-names);
    font-size: var(--devsite-sys-typescale-tenant--accessibility-title-s--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--accessibility-title-s--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--accessibility-title-s--line-height)
}

:root .devsite-sys-typescale-tenant--android-body-m {
    font-family: var(--devsite-sys-typescale-tenant--android-body-m--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-body-m--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-body-m--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-body-m--line-height)
}

:root .devsite-sys-typescale-tenant--android-body-s {
    font-family: var(--devsite-sys-typescale-tenant--android-body-s--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-body-s--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-body-s--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-body-s--line-height)
}

:root .devsite-sys-typescale-tenant--android-button {
    font-family: var(--devsite-sys-typescale-tenant--android-button--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-button--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-button--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-button--line-height)
}

:root .devsite-sys-typescale-tenant--android-detail {
    font-family: var(--devsite-sys-typescale-tenant--android-detail--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-detail--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-detail--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-detail--line-height)
}

:root .devsite-sys-typescale-tenant--android-docs-headline-1 {
    font-family: var(--devsite-sys-typescale-tenant--android-docs-headline-1--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-docs-headline-1--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-docs-headline-1--font-weight);
    letter-spacing: var(--devsite-sys-typescale-tenant--android-docs-headline-1--font-tracking);
    line-height: var(--devsite-sys-typescale-tenant--android-docs-headline-1--line-height)
}

:root .devsite-sys-typescale-tenant--android-docs-headline-2 {
    font-family: var(--devsite-sys-typescale-tenant--android-docs-headline-2--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-docs-headline-2--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-docs-headline-2--font-weight);
    letter-spacing: var(--devsite-sys-typescale-tenant--android-docs-headline-2--font-tracking);
    line-height: var(--devsite-sys-typescale-tenant--android-docs-headline-2--line-height)
}

:root .devsite-sys-typescale-tenant--android-docs-headline-3 {
    font-family: var(--devsite-sys-typescale-tenant--android-docs-headline-3--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-docs-headline-3--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-docs-headline-3--font-weight);
    letter-spacing: var(--devsite-sys-typescale-tenant--android-docs-headline-3--font-tracking);
    line-height: var(--devsite-sys-typescale-tenant--android-docs-headline-3--line-height)
}

:root .devsite-sys-typescale-tenant--android-docs-headline-4 {
    font-family: var(--devsite-sys-typescale-tenant--android-docs-headline-4--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-docs-headline-4--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-docs-headline-4--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-docs-headline-4--line-height)
}

:root .devsite-sys-typescale-tenant--android-docs-headline-5 {
    font-family: var(--devsite-sys-typescale-tenant--android-docs-headline-5--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-docs-headline-5--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-docs-headline-5--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-docs-headline-5--line-height)
}

:root .devsite-sys-typescale-tenant--android-docs-headline-6 {
    font-family: var(--devsite-sys-typescale-tenant--android-docs-headline-6--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-docs-headline-6--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-docs-headline-6--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-docs-headline-6--line-height)
}

:root .devsite-sys-typescale-tenant--android-docs-headline-7 {
    font-family: var(--devsite-sys-typescale-tenant--android-docs-headline-7--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-docs-headline-7--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-docs-headline-7--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-docs-headline-7--line-height)
}

:root .devsite-sys-typescale-tenant--android-headline-1 {
    font-family: var(--devsite-sys-typescale-tenant--android-headline-1--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-headline-1--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-headline-1--font-weight);
    letter-spacing: var(--devsite-sys-typescale-tenant--android-headline-1--font-tracking);
    line-height: var(--devsite-sys-typescale-tenant--android-headline-1--line-height)
}

:root .devsite-sys-typescale-tenant--android-headline-2 {
    font-family: var(--devsite-sys-typescale-tenant--android-headline-2--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-headline-2--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-headline-2--font-weight);
    letter-spacing: var(--devsite-sys-typescale-tenant--android-headline-2--font-tracking);
    line-height: var(--devsite-sys-typescale-tenant--android-headline-2--line-height)
}

:root .devsite-sys-typescale-tenant--android-headline-4 {
    font-family: var(--devsite-sys-typescale-tenant--android-headline-4--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-headline-4--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-headline-4--font-weight);
    letter-spacing: var(--devsite-sys-typescale-tenant--android-headline-4--font-tracking);
    line-height: var(--devsite-sys-typescale-tenant--android-headline-4--line-height)
}

:root .devsite-sys-typescale-tenant--android-headline-5 {
    font-family: var(--devsite-sys-typescale-tenant--android-headline-5--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-headline-5--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-headline-5--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-headline-5--line-height)
}

:root .devsite-sys-typescale-tenant--android-headline-6 {
    font-family: var(--devsite-sys-typescale-tenant--android-headline-6--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-headline-6--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-headline-6--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-headline-6--line-height)
}

:root .devsite-sys-typescale-tenant--android-overline {
    font-family: var(--devsite-sys-typescale-tenant--android-overline--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-overline--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-overline--font-weight);
    letter-spacing: var(--devsite-sys-typescale-tenant--android-overline--font-tracking);
    line-height: var(--devsite-sys-typescale-tenant--android-overline--line-height)
}

:root .devsite-sys-typescale-tenant--android-overline-s {
    font-family: var(--devsite-sys-typescale-tenant--android-overline-s--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-overline-s--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-overline-s--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-overline-s--line-height)
}

:root .devsite-sys-typescale-tenant--android-title-l {
    font-family: var(--devsite-sys-typescale-tenant--android-title-l--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-title-l--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-title-l--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-title-l--line-height)
}

:root .devsite-sys-typescale-tenant--android-title-m {
    font-family: var(--devsite-sys-typescale-tenant--android-title-m--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-title-m--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-title-m--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-title-m--line-height)
}

:root .devsite-sys-typescale-tenant--android-title-s-400 {
    font-family: var(--devsite-sys-typescale-tenant--android-title-s-400--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-title-s-400--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-title-s-400--font-weight);
    letter-spacing: var(--devsite-sys-typescale-tenant--android-title-s-400--font-tracking);
    line-height: var(--devsite-sys-typescale-tenant--android-title-s-400--line-height)
}

:root .devsite-sys-typescale-tenant--android-title-s-500 {
    font-family: var(--devsite-sys-typescale-tenant--android-title-s-500--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-title-s-500--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-title-s-500--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-title-s-500--line-height)
}

:root .devsite-sys-typescale-tenant--android-title-s-600 {
    font-family: var(--devsite-sys-typescale-tenant--android-title-s-600--font-names);
    font-size: var(--devsite-sys-typescale-tenant--android-title-s-600--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--android-title-s-600--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--android-title-s-600--line-height)
}

:root .devsite-sys-typescale-tenant--cloud-body-m {
    font-family: var(--devsite-sys-typescale-tenant--cloud-body-m--font-names);
    font-size: var(--devsite-sys-typescale-tenant--cloud-body-m--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--cloud-body-m--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--cloud-body-m--line-height)
}

:root .devsite-sys-typescale-tenant--cloud-body-xs {
    font-family: var(--devsite-sys-typescale-tenant--cloud-body-xs--font-names);
    font-size: var(--devsite-sys-typescale-tenant--cloud-body-xs--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--cloud-body-xs--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--cloud-body-xs--line-height)
}

:root .devsite-sys-typescale-tenant--cloud-title-m {
    font-family: var(--devsite-sys-typescale-tenant--cloud-title-m--font-names);
    font-size: var(--devsite-sys-typescale-tenant--cloud-title-m--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--cloud-title-m--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--cloud-title-m--line-height)
}

:root .devsite-sys-typescale-tenant--code-s {
    font-family: var(--devsite-sys-typescale-tenant--code-s--font-names);
    font-size: var(--devsite-sys-typescale-tenant--code-s--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--code-s--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--code-s--line-height)
}

:root .devsite-sys-typescale-tenant--fuchsia-h1 {
    font-family: var(--devsite-sys-typescale-tenant--fuchsia-h1--font-names);
    font-size: var(--devsite-sys-typescale-tenant--fuchsia-h1--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--fuchsia-h1--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--fuchsia-h1--line-height)
}

:root .devsite-sys-typescale-tenant--home-display-heading {
    font-family: var(--devsite-sys-typescale-tenant--home-display-heading--font-names);
    font-size: var(--devsite-sys-typescale-tenant--home-display-heading--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--home-display-heading--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--home-display-heading--line-height)
}

:root .devsite-sys-typescale-tenant--home-headline-2 {
    font-family: var(--devsite-sys-typescale-tenant--home-headline-2--font-names);
    font-size: var(--devsite-sys-typescale-tenant--home-headline-2--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--home-headline-2--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--home-headline-2--line-height)
}

:root .devsite-sys-typescale-tenant--home-headline-3 {
    font-family: var(--devsite-sys-typescale-tenant--home-headline-3--font-names);
    font-size: var(--devsite-sys-typescale-tenant--home-headline-3--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--home-headline-3--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--home-headline-3--line-height)
}

:root .devsite-sys-typescale-tenant--home-headline-3-700 {
    font-family: var(--devsite-sys-typescale-tenant--home-headline-3-700--font-names);
    font-size: var(--devsite-sys-typescale-tenant--home-headline-3-700--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--home-headline-3-700--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--home-headline-3-700--line-height)
}

:root .devsite-sys-typescale-tenant--home-headline-4 {
    font-family: var(--devsite-sys-typescale-tenant--home-headline-4--font-names);
    font-size: var(--devsite-sys-typescale-tenant--home-headline-4--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--home-headline-4--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--home-headline-4--line-height)
}

:root .devsite-sys-typescale-tenant--home-headline-6 {
    font-family: var(--devsite-sys-typescale-tenant--home-headline-6--font-names);
    font-size: var(--devsite-sys-typescale-tenant--home-headline-6--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--home-headline-6--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--home-headline-6--line-height)
}

:root .devsite-sys-typescale-tenant--non-endorsed-body-m {
    font-family: var(--devsite-sys-typescale-tenant--non-endorsed-body-m--font-names);
    font-size: var(--devsite-sys-typescale-tenant--non-endorsed-body-m--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--non-endorsed-body-m--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--non-endorsed-body-m--line-height)
}

:root .devsite-sys-typescale-tenant--non-endorsed-h2 {
    font-family: var(--devsite-sys-typescale-tenant--non-endorsed-h2--font-names);
    font-size: var(--devsite-sys-typescale-tenant--non-endorsed-h2--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--non-endorsed-h2--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--non-endorsed-h2--line-height)
}

:root .devsite-sys-typescale-tenant--non-endorsed-h3 {
    font-family: var(--devsite-sys-typescale-tenant--non-endorsed-h3--font-names);
    font-size: var(--devsite-sys-typescale-tenant--non-endorsed-h3--font-size);
    line-height: var(--devsite-sys-typescale-tenant--non-endorsed-h3--line-height)
}

:root .devsite-sys-typescale-tenant--non-endorsed-h4 {
    font-family: var(--devsite-sys-typescale-tenant--non-endorsed-h4--font-names);
    font-size: var(--devsite-sys-typescale-tenant--non-endorsed-h4--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--non-endorsed-h4--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--non-endorsed-h4--line-height)
}

:root .devsite-sys-typescale-tenant--non-endorsed-h6 {
    font-family: var(--devsite-sys-typescale-tenant--non-endorsed-h6--font-names);
    font-size: var(--devsite-sys-typescale-tenant--non-endorsed-h6--font-size);
    line-height: var(--devsite-sys-typescale-tenant--non-endorsed-h6--line-height)
}

:root .devsite-sys-typescale-tenant--non-endorsed-headline-5-5 {
    font-family: var(--devsite-sys-typescale-tenant--non-endorsed-headline-5-5--font-names);
    font-size: var(--devsite-sys-typescale-tenant--non-endorsed-headline-5-5--font-size);
    font-weight: var(--devsite-sys-typescale-tenant--non-endorsed-headline-5-5--font-weight);
    line-height: var(--devsite-sys-typescale-tenant--non-endorsed-headline-5-5--line-height)
}

[theme=android-theme] {
    --devsite-primary-color: #34a853;
    --devsite-secondary-color: #689f38
}

[theme=android-ndk-theme] {
    --devsite-primary-color: #24c1e0;
    --devsite-secondary-color: #129eaf
}

[foreground=android-ndk-theme],[theme=android-ndk-theme] [foreground=theme] {
    --devsite-foreground-color: #24c1e0;
    --devsite-foreground-button-background-hover: #e9f9fc;
    --devsite-foreground-button-border-color: #dadce0;
    --devsite-foreground-button-border-color-hover: #c8f0f7;
    --devsite-foreground-button-border-color-active: #e9f9fc;
    --devsite-foreground-button-color: #24c1e0;
    --devsite-foreground-button-primary-background: #24c1e0;
    --devsite-foreground-button-primary-background-hover: #129eaf;
    --devsite-foreground-button-primary-color: #fff
}

[theme=android-ndk-theme] {
    --devsite-background-color: #78d9ec
}

[theme=android-ndk-theme] [background=theme] {
    --devsite-text-color: #202124;
    --devsite-text-color-hover: hsla(210,6%,63%,.5)
}

body[layout=docs] .devsite-article {
    --devsite-page-border-radius: 24px;
    --devsite-banner-border-radius: 24px 24px 0 0;
    --devsite-first-row-border-radius: 24px 24px 0 0;
    --devsite-last-row-border-radius: 0 0 24px 24px
}

.devsite-header-icon-button.button-flat:hover {
    --devsite-button-white-text-decoration-hover: none
}

body,dd,div,dl,figure,form,img,input,menu {
    margin: 0;
    padding: 0
}

body[no-overflow] {
    overflow: hidden
}

iframe {
    border: 0
}

iframe:not([src]) {
    display: none
}

.beta>:first-child,.caution>:first-child,.deprecated>:first-child,.dogfood>:first-child,.experimental>:first-child,.key-point>:first-child,.key-term>:first-child,.note>:first-child,.objective>:first-child,.preview>:first-child,.quickstart-left>:first-child,.quickstart-wide>:first-child,.special>:first-child,.success>:first-child,.warning>:first-child,aside>:first-child,blockquote>:first-child,dd>:first-child,li>p:first-child,td>.devsite-table-wrapper:first-child>table,td>.expandable:first-child>:nth-child(2),td>:first-child,td>:first-child:empty+devsite-code,td>:first-child>li:first-child {
    margin-top: 0
}

.beta>:last-child,.caution>:last-child,.deprecated>:last-child,.dogfood>:last-child,.experimental>:last-child,.key-point>:last-child,.key-term>:last-child,.note>:last-child,.objective>:last-child,.preview>:last-child,.quickstart-left>:last-child,.quickstart-wide>:last-child,.special>:last-child,.success>:last-child,.warning>:last-child,aside>:last-child,blockquote>:last-child,dd>:last-child,li>p:last-child,td>.devsite-table-wrapper:last-child>table,td>.expandable:last-child>:last-child,td>:last-child,td>:last-child>li:last-child {
    margin-bottom: 0
}

html {
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

*,:after,:before {
    -moz-box-sizing: inherit;
    box-sizing: inherit
}

.clearfix:after,.quickstart-step:after {
    clear: both;
    content: "";
    display: table;
    height: 0;
    visibility: hidden
}

:root {
    --devsite-code-font-family: Roboto Mono,monospace;
    --devsite-heading-font-family: Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --devsite-primary-font-family: Roboto,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --devsite-h1-margin: 40px 0 20px;
    --devsite-h2-margin: 40px 0 20px;
    --devsite-h4-font: 500 16px/24px var(--devsite-primary-font-family);
    --devsite-h5-font: 700 14px/24px var(--devsite-primary-font-family);
    --devsite-h6-font: 500 14px/24px var(--devsite-primary-font-family);
    --devsite-background-0: #e8eaed;
    --devsite-background-1: #fff;
    --devsite-background-2: #f8f9fa;
    --devsite-background-3: #f1f3f4;
    --devsite-background-4: #e8eaed;
    --devsite-background-5: #dadce0;
    --devsite-primary-text-color: #202124;
    --devsite-primary-text-rgba: rgba(0,0,0,.87);
    --devsite-secondary-text-color: #5f6368;
    --devsite-secondary-text-rgba: rgba(0,0,0,.65);
    --devsite-tertiary-text-color: #bdc1c6;
    --devsite-tertiary-text-rgba: rgba(0,0,0,.26);
    --devsite-inverted-text-color: #fff;
    --devsite-inverted-text-color-hover: hsla(0,0%,100%,.7);
    --devsite-inverted-text-rgba: hsla(0,0%,100%,.7);
    --devsite-primary-border: 1px solid #dadce0;
    --devsite-secondary-border: 1px solid #e8eaed;
    --devsite-elevation-key-shadow-color: rgba(60,64,67,.3);
    --devsite-elevation-ambient-shadow-color: rgba(60,64,67,.15);
    --devsite-elevation-inset-shadow-color: hsla(210,6%,63%,.5);
    --tenant-background-1: #fff;
    --tenant-background-2: #f8f9fa;
    --tenant-background-3: #f1f3f4;
    --tenant-primary-text-color: #202124;
    --tenant-secondary-text-color: #5f6368;
    --tenant-inverted-text-color: #fff;
    --tenant-primary-border: 1px solid #dadce0;
    --tenant-secondary-border: 1px solid #e8eaed;
    --devsite-link-background: #d2e3fc;
    --devsite-link-background-active: #e8f0fe;
    --devsite-link-color: #1a73e8;
    --devsite-contrast-link-color: #185abc;
    --devsite-button-background-hover: #e4eefc;
    --devsite-button-background-active: #c8ddf9;
    --devsite-button-color: #1a73e8;
    --devsite-banner-archived-background: #fce8e6;
    --devsite-banner-archived-color: #a50e0e;
    --devsite-banner-confidential-background: #feefe3;
    --devsite-banner-confidential-color: #a50e0e;
    --devsite-banner-deprecated-background: #fef7e0;
    --devsite-banner-deprecated-color: #a50e0e;
    --devsite-label-cyan-background: #e4f7fb;
    --devsite-label-cyan-color: #007b83;
    --devsite-label-google-blue-background: #e8f0fe;
    --devsite-label-google-blue-color: #174ea6;
    --devsite-label-google-green-background: #e6f4ea;
    --devsite-label-google-green-color: #0d652d;
    --devsite-label-google-red-background: #fce8e6;
    --devsite-label-google-red-color: #a50e0e;
    --devsite-label-google-yellow-background: #fef7e0;
    --devsite-label-google-yellow-color: #a50e0e;
    --devsite-label-grey-background: #f8f9fa;
    --devsite-label-grey-color: #202124;
    --devsite-label-orange-background: #feefe3;
    --devsite-label-orange-color: #b06000;
    --devsite-label-pink-background: #fde7f3;
    --devsite-label-pink-color: #9c166b;
    --devsite-label-purple-background: #f3e8fd;
    --devsite-label-purple-color: #681da8;
    --devsite-label-white-background: #fff;
    --devsite-label-white-color: #202124;
    --devsite-label-youtube-red-background: #fce8e6;
    --devsite-label-youtube-red-color: #c20000;
    --devsite-button-primary-background: #1a73e8;
    --devsite-button-primary-background-hover: #1765cc;
    --devsite-button-primary-background-active: #185abc;
    --devsite-button-primary-color: #fff;
    --devsite-notice-margin: 16px 0;
    --devsite-notice-padding-block: 15px;
    --devsite-notice-padding-inline: 60px 24px;
    --devsite-book-nav-background: var(--devsite-background-1);
    --devsite-concierge-top: 48px;
    --devsite-concierge-width-closed: 54px;
    --devsite-concierge-width-open: 387px;
    --devsite-concierge-width: 0px;
    --devsite-card-background: var(--devsite-background-1);
    --devsite-card-header-background: var(--devsite-background-3);
    --devsite-checkbox-border-radius: 2px;
    --devsite-checkbox-icon-canvas-border-radius: 50%;
    --devsite-checkbox-icon-canvas-offset-x: -9px;
    --devsite-checkbox-icon-canvas-offset-y: -9px;
    --devsite-checkbox-icon-canvas-size: 36px;
    --devsite-checkbox-margin-block: -2px 2px;
    --devsite-checkbox-margin-inline: 0 8px;
    --devsite-checkbox-offset-x: 3px;
    --devsite-checkbox-offset-y: -3px;
    --devsite-checkbox-size: 18px;
    --devsite-feature-tooltip-background-color: #1a73e8;
    --devsite-feature-tooltip-offset-y: 3px;
    --devsite-input-background: var(--devsite-background-1);
    --devsite-input-border: var(--devsite-secondary-border);
    --devsite-landing-row-item-gap: 24px;
    --devsite-mdc-line-height: 56px;
    --devsite-scrollbar-thumb-background: hsla(207,5%,52%,.26);
    --devsite-select-background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="4" viewBox="0 0 20 4"><path d="M0,0l4,4l4-4H0z" fill="%23202124"/></svg>');
    --devsite-select-border-radius: 2px;
    --devsite-dropdown-toggle-padding-x: 18px
}

[lang=ar],[lang=fa] {
    --devsite-nav-item-line-height: 18px
}

devsite-appearance-selector {
    --devsite-appearance-selector-menu-transform: translate3d(-10px,0,0)
}

[dir=rtl] devsite-appearance-selector {
    --devsite-appearance-selector-menu-transform: translate3d(calc(46px - 100%),0,0)
}

devsite-bookmark {
    --devsite-bookmark-background: 0;
    --devsite-bookmark-background-focus-legacy: var(--devsite-background-4);
    --devsite-bookmark-background-hover-legacy: var(--devsite-background-3);
    --devsite-bookmark-icon-color: var(--devsite-secondary-text-color);
    --devsite-bookmark-icon-color-saved: var(--devsite-link-color);
    --devsite-bookmark-icon-color-saved-hover: #174ea6;
    --devsite-dropdown-list-toggle-background-hover: var(--devsite-background-3);
    --devsite-dropdown-list-toggle-border: var(--devsite-primary-border,0);
    --devsite-dropdown-list-toggle-border-hover: var(--devsite-primary-border);
    --devsite-dropdown-list-toggle-height: 36px
}

devsite-book-nav {
    --devsite-book-nav-input-height: 32px;
    --devsite-nav-divider-background: #f1f3f4
}

.devsite-book-nav-toggle[aria-expanded] {
    --devsite-book-nav-toggle-background: var(--devsite-background-3);
    --devsite-book-nav-toggle-background-hover: var(--devsite-background-4)
}

.devsite-book-nav-toggle:not([aria-expanded]) {
    --devsite-book-nav-toggle-background: var(--devsite-background-1);
    --devsite-book-nav-toggle-background-hover: var(--devsite-background-3)
}

devsite-carousel {
    --devsite-carousel-button-size: 40px;
    --devsite-carousel-button-icon-size: 24px;
    --devsite-carousel-gap: 16px 24px;
    --devsite-carousel-grid: 1fr var(--devsite-carousel-button-size) /var(--devsite-carousel-button-size) 1fr var(--devsite-carousel-button-size);
    --devsite-carousel-item-flex: 0 0 var(--devsite-carousel-item-width,auto);
    --devsite-carousel-marker-margin-inline: -18px 0;
    --devsite-carousel-marker-size: 12px;
    --devsite-carousel-markers-gap: 0 4px;
    --devsite-carousel-markers-grid-column: 2;
    --devsite-carousel-markers-grid-row: 2;
    --devsite-carousel-next-grid-column: 3;
    --devsite-carousel-prev-grid-column: 1;
    --devsite-carousel-prev-next-grid-row: 2;
    --devsite-carousel-slideshow-grid-column: 1/-1;
    --devsite-carousel-slideshow-grid-row: 1
}

devsite-carousel[data-items-per-slide] {
    --devsite-carousel-item-gap: 0 24px
}

devsite-carousel[data-items-per-slide=auto] {
    --devsite-carousel-item-gap: 0 8px
}

[template=page] devsite-carousel[data-full-width],[template=page] devsite-carousel[data-items-per-slide=auto] {
    --devsite-carousel-gap: 16px 40px;
    --devsite-carousel-grid: 1fr var(--devsite-carousel-button-size) /0 var(--devsite-carousel-button-size) 1fr var(--devsite-carousel-button-size) 0;
    --devsite-carousel-margin-inline: -40px;
    --devsite-carousel-markers-grid-column: 3;
    --devsite-carousel-next-grid-column: 4;
    --devsite-carousel-prev-grid-column: 2;
    --devsite-carousel-slideshow-grid-column: 1/-1;
    --devsite-carousel-slideshow-padding-inline: 40px
}

[template=page] devsite-carousel[data-items-per-slide=auto] {
    --devsite-carousel-ghost-item-width: 32px;
    --devsite-carousel-slideshow-scroll-padding: 0 40px
}

devsite-catalog {
    --devsite-button-icon-content: "cancel";
    --devsite-button-icon-margin-x-end: 8px;
    --devsite-button-icon-margin-x-start: 8px;
    --devsite-catalog-grid: "sidebar main" 1fr/1fr 3fr;
    --devsite-chips-gap: 8px;
    --devsite-dynamic-content-margin: 0;
    --devsite-catalog-sidebar-button-display: none!important;
    --devsite-input-border-radius: var(--devsite-card-border-radius);
    --devsite-input-height: 40px;
    --devsite-input-padding: 7px 16px;
    --devsite-input-width: 100%;
    --devsite-notice-margin: 16px 0;
    --devsite-notice-padding-block: 15px;
    --devsite-notice-padding-inline: 60px 24px
}

[layout=docs] devsite-catalog {
    --devsite-catalog-grid: "sidebar main" 1fr/1fr 2fr
}

[layout=docs] devsite-catalog:not([items-across]),devsite-catalog[template=activity]:not([items-across]) {
    --devsite-columns: 2
}

devsite-catalog .catalog-filter-chip {
    --devsite-button-sibling-gap-x: 0
}

[dir=ltr] devsite-catalog .catalog-filter-chip {
    --devsite-button-padding: 0 0 0 12px
}

[dir=rtl] devsite-catalog .catalog-filter-chip {
    --devsite-button-padding: 0 12px 0 0
}

devsite-code,devsite-content {
    --devsite-code-background: #f1f3f4;
    --devsite-code-color: #37474f;
    --devsite-var-color: #d01884
}

devsite-code {
    --devsite-code-buttons-toggle-dark-display: inline-block;
    --devsite-code-buttons-toggle-light-display: none;
    --devsite-code-comments-color: #b80672;
    --devsite-code-keywords-color: #1967d2;
    --devsite-code-numbers-color: #c5221f;
    --devsite-code-strings-color: #188038;
    --devsite-code-types-color: #9334e6;
    --devsite-github-link-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M9-.06A9,9,0,0,0,6.16,17.48c.44.09.59-.19.59-.43V15.38c-2.5.54-3-1.07-3-1.07a2.35,2.35,0,0,0-1-1.31c-.82-.56.06-.55.06-.55a1.89,1.89,0,0,1,1.38.93,1.92,1.92,0,0,0,2.62.75,1.91,1.91,0,0,1,.57-1.21c-2-.23-4.1-1-4.1-4.45a3.49,3.49,0,0,1,.92-2.41,3.25,3.25,0,0,1,.09-2.38S5,3.43,6.75,4.6a8.59,8.59,0,0,1,4.5,0c1.72-1.17,2.48-.92,2.48-.92a3.25,3.25,0,0,1,.09,2.38,3.49,3.49,0,0,1,.92,2.41c0,3.46-2.1,4.22-4.11,4.44a2.14,2.14,0,0,1,.62,1.67v2.47c0,.24.14.52.6.43A9,9,0,0,0,9-.06Z" fill="%231a73e8"/></svg>')
}

devsite-code[dark-code] {
    --devsite-code-background: #283142;
    --devsite-code-buttons-color: hsla(0,0%,100%,.7);
    --devsite-code-buttons-hover: #fff;
    --devsite-code-buttons-toggle-dark-display: none;
    --devsite-code-buttons-toggle-light-display: inline-block;
    --devsite-code-color: #f1f3f4;
    --devsite-code-comments-color: #ff8bcb;
    --devsite-code-keywords-color: #78d9ec;
    --devsite-code-numbers-color: #fbbc04;
    --devsite-code-strings-color: #9ccc65;
    --devsite-code-types-color: #d7aefb;
    --devsite-github-link-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M9-.06A9,9,0,0,0,6.16,17.48c.44.09.59-.19.59-.43V15.38c-2.5.54-3-1.07-3-1.07a2.35,2.35,0,0,0-1-1.31c-.82-.56.06-.55.06-.55a1.89,1.89,0,0,1,1.38.93,1.92,1.92,0,0,0,2.62.75,1.91,1.91,0,0,1,.57-1.21c-2-.23-4.1-1-4.1-4.45a3.49,3.49,0,0,1,.92-2.41,3.25,3.25,0,0,1,.09-2.38S5,3.43,6.75,4.6a8.59,8.59,0,0,1,4.5,0c1.72-1.17,2.48-.92,2.48-.92a3.25,3.25,0,0,1,.09,2.38,3.49,3.49,0,0,1,.92,2.41c0,3.46-2.1,4.22-4.11,4.44a2.14,2.14,0,0,1,.62,1.67v2.47c0,.24.14.52.6.43A9,9,0,0,0,9-.06Z" fill="%23669df6"/></svg>');
    --devsite-scrollbar-thumb-background: hsla(0,0%,100%,.7);
    --devsite-var-color: #ff8bcb;
    --devsite-button-background-hover: #2c3649;
    --devsite-button-background-active: #344158;
    --devsite-primary-border: 1px solid #3c4043;
    --devsite-secondary-border: 1px solid #202124
}

devsite-content {
    --devsite-compare-yes-color: #34a853;
    --devsite-compare-no-color: #d93025;
    --devsite-confidential-results-background: hsla(27,93%,94%,.5);
    --devsite-search-results-breadcrumb-color: #1e8e3e;
    --devsite-select-sibling-gap-x: 16px;
    --devsite-steps-title-border-focus: 1px solid #174ea6;
    --devsite-dropdown-list-border-radius: var( --devsite-dropdown-list-toggle-border-radius );
    --devsite-dropdown-list-min-width: 194px;
    --devsite-dropdown-list-toggle-background-hover: var(--devsite-background-2);
    --devsite-dropdown-list-toggle-border-radius: 4px;
    --devsite-dropdown-list-toggle-color: var(--devsite-secondary-text-color);
    --devsite-dropdown-list-toggle-color-hover: var(--devsite-primary-text-color);
    --devsite-dropdown-list-toggle-button-padding: 0 3px;
    --devsite-dropdown-list-toogle-button-justify-content: center
}

devsite-device {
    --devsite-device-border-color: #ddd
}

devsite-dynamic-content {
    --devsite-progress-background: #dadce0;
    --devsite-progress-background-2: #dadce0;
    --devsite-progress-background-4: #dadce0;
    --devsite-progress-bar-color: #f9ab00
}

devsite-dynamic-content .completed {
    --devsite-progress-bar-color: #1e8e3e
}

devsite-dynamic-hero {
    --devsite-background-text-decoration: none
}

devsite-footer-linkboxes {
    --devsite-footer-linkboxes-grid-template-columns: repeat(auto-fit,minmax(85.4px,1fr));
    --devsite-footer-linkboxes-padding: 0 24px
}

devsite-footer-utility devsite-language-selector {
    --devsite-language-selector-menu-inset-inline: auto 0;
    --devsite-language-selector-menu-transform: translate3d(0,calc(-100% - $SELECT_HEIGHT),0)
}

devsite-header devsite-language-selector {
    --devsite-select-color: var(--devsite-secondary-text-color)
}

devsite-multiple-choice {
    --devsite-multiple-choice-answer-border-bottom: var(--devsite-primary-border);
    --devsite-multiple-choice-answer-border-top: 0;
    --devsite-multiple-choice-background: var(--devsite-background-2);
    --devsite-multiple-choice-border: 0;
    --devsite-multiple-choice-border-radius: 0;
    --devsite-multiple-choice-correct-background: #f8fbf9;
    --devsite-multiple-choice-correct-color: #137333;
    --devsite-multiple-choice-incorrect-background: #fef9f8;
    --devsite-multiple-choice-incorrect-color: #d93025;
    --devsite-multiple-choice-overflow: visible;
    --devsite-multiple-choice-question-background: var( --devsite-secondary-text-color );
    --devsite-multiple-choice-question-color: var(--devsite-inverted-text-color)
}

devsite-nav-buttons {
    --devsite-button-primary-background-selected: #174ea6
}

devsite-playlist {
    --devsite-playlist-icon-color: #0d652d;
    --devsite-playlist-item-index-color: #fff;
    --devsite-playlist-max-width: 936px;
    --devsite-playlist-padding-x: 40px
}

[type=playlist] {
    --devsite-card-image-object-fit: contain
}

devsite-playlist devsite-bookmark {
    --devsite-bookmark-background-focus-legacy: rgba(138,180,248,.12);
    --devsite-bookmark-background-hover-legacy: rgba(138,180,248,.12);
    --devsite-bookmark-icon-arrow-color: #dadce0;
    --devsite-bookmark-icon-color: #dadce0;
    --devsite-bookmark-icon-color-saved: #8ab4f8;
    --devsite-bookmark-icon-color-saved-hover: #d2e3fc;
    --devsite-dropdown-list-toggle-background-hover: hsla(220,9%,87%,.24);
    --devsite-dropdown-list-toggle-border: 1px solid #5f6368;
    --devsite-dropdown-list-toggle-border-hover: 1px solid #5f6368;
    --devsite-dropdown-list-toggle-color-hover: #dadce0
}

devsite-quiz {
    --devsite-quiz-correct-background: #e6f4ea;
    --devsite-quiz-correct-border-color: #e6f4ea;
    --devsite-quiz-correct-border-color-focus: #1e8e3e;
    --devsite-quiz-correct-color: #1e8e3e;
    --devsite-quiz-error-background: #fce8e6;
    --devsite-quiz-error-border-color: #fce8e6;
    --devsite-quiz-error-border-color-focus: #d93025;
    --devsite-quiz-error-color: #d93025;
    --devsite-quiz-partially-correct-background: #feefe3;
    --devsite-quiz-partially-correct-color: #e8710a;
    --devsite-quiz-secondary-text-color: #5f6368
}

devsite-recommendations-sidebar,devsite-recommended-content {
    --devsite-recommendations-accent: #303f9f
}

devsite-recommended-content {
    --devsite-background-text-decoration: none;
    --devsite-checkbox-margin-block: 0;
    --devsite-checkbox-margin-inline: 0;
    --devsite-checkbox-size: 0;
    --devsite-h1-margin: 0;
    --devsite-h3-margin: 0;
    --devsite-recommended-content-filters-overflow: scroll hidden;
    --devsite-recommended-content-grid: "list-header" 24px "content"/1fr;
    --devsite-recommended-content-item-show-all-display: flex;
    --devsite-recommended-content-toggle-display: none
}

devsite-recommended-content[filters] {
    --devsite-recommended-content-grid: "filters-header" 24px "filters" minmax(var(--devsite-carousel-button-size),auto) "list-header" 24px "content" /1fr
}

[template=landing] devsite-carousel[data-markers-size=small] {
    --devsite-carousel-marker-size: 8px;
    --devsite-carousel-markers-gap: 0
}

[template=landing] devsite-carousel[data-markers-background=secondary],devsite-recommended-content devsite-carousel {
    --devsite-carousel-button-color: var(--devsite-secondary-text-color);
    --devsite-carousel-button-color-hover: var(--devsite-primary-text-color);
    --devsite-carousel-marker-margin-inline: -16px 0;
    --devsite-carousel-marker-size: 8px;
    --devsite-carousel-markers-background-focus: var( --devsite-secondary-text-color );
    --devsite-carousel-markers-background-hover: var( --devsite-secondary-text-color );
    --devsite-carousel-markers-gap: 0;
    --devsite-carousel-prev-next-box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color);
    --devsite-recommended-content-filters-overflow: initial
}

[template=landing] devsite-carousel[data-controls-position=center],[template=landing] devsite-recommended-content devsite-carousel,[template=page] devsite-carousel[data-controls-position=center],[template=search] devsite-carousel[data-controls-position=center] {
    --devsite-carousel-gap: 0;
    --devsite-carousel-grid: 1fr auto/24px 24px 1fr 24px 24px;
    --devsite-carousel-margin-inline: -24px;
    --devsite-carousel-markers-grid-column: 2/-2;
    --devsite-carousel-markers-grid-row: 2;
    --devsite-carousel-next-grid-column: -1/-3;
    --devsite-carousel-prev-grid-column: 1/3;
    --devsite-carousel-prev-next-grid-row: 1;
    --devsite-carousel-slideshow-grid-column: 2/-2;
    --devsite-carousel-slideshow-grid-row: 1;
    --devsite-carousel-slideshow-padding-inline: 24px
}

devsite-recommended-content devsite-carousel[data-items-per-slide=auto] {
    --devsite-carousel-gradient-background: var(--devsite-background-3);
    --devsite-carousel-gradient-display: block;
    --devsite-carousel-gradient-end-grid-column: 5;
    --devsite-carousel-gradient-grid-row: 1;
    --devsite-carousel-gradient-start-grid-column: 1;
    --devsite-carousel-markers-display: none;
    --devsite-carousel-slideshow-margin-block: -8px;
    --devsite-carousel-slideshow-padding-block: 8px
}

devsite-book-nav,devsite-search {
    --devsite-searchbox-hover: #e8eaed;
    --devsite-searchbox-inactive: var(--devsite-background-3);
    --devsite-search-border-radius: 2px;
    --devsite-search-form-background-active: var(--devsite-background-3);
    --devsite-search-height: 36px;
    --devsite-search-image-top: 6px;
    --devsite-search-image-x: 8px;
    --devsite-search-field-border: 0;
    --devsite-search-field-height: 36px;
    --devsite-search-field-padding-x-start: 40px
}

devsite-search-summary devsite-carousel {
    --devsite-carousel-markers-display: none
}

devsite-select {
    --devsite-select-display: inline-block
}

devsite-user {
    --devsite-notification-background: #1967d2;
    --devsite-ogb-link-border-color: #185abc;
    --devsite-ogb-manage-background-focus-color: rgba(25,103,210,.08)
}

google-codelab-about {
    --google-codelab-about-active-border-color: #1a73e8
}

table {
    --devsite-alt-table-cell-background: rgba(241,243,244,.75);
    --devsite-h2-border: 0;
    --devsite-responsive-table-first-column-background: #f1f3f4;
    --devsite-table-cell-background: hsla(0,0%,100%,.95);
    --devsite-table-heading-background: #e8eaed
}

table.blue {
    --devsite-alt-table-cell-background: #f6f7fb;
    --devsite-table-heading-background: 0;
    --devsite-responsive-table-first-column-background: #f6f7fb;
    --devsite-table-row-background: #e8eaf6;
    --devsite-table-row-border: 1px solid #c5cae9
}

table.blue table {
    --devsite-table-heading-background: inherit
}

table.cyan {
    --devsite-alt-table-cell-background: #f4fcfd;
    --devsite-table-heading-background: 0;
    --devsite-responsive-table-first-column-background: #f4fcfd;
    --devsite-table-row-background: #e4f7fb;
    --devsite-table-row-border: 1px solid #a1e4f2
}

table.cyan table {
    --devsite-table-heading-background: inherit
}

table.green {
    --devsite-alt-table-cell-background: #f3faf9;
    --devsite-table-heading-background: 0;
    --devsite-responsive-table-first-column-background: #f3faf9;
    --devsite-table-row-background: #e0f2f1;
    --devsite-table-row-border: 1px solid #b2dfdb
}

table.green table {
    --devsite-table-heading-background: inherit
}

table.orange {
    --devsite-alt-table-cell-background: #fff9f4;
    --devsite-table-heading-background: 0;
    --devsite-responsive-table-first-column-background: #fff9f4;
    --devsite-table-row-background: #feefe3;
    --devsite-table-row-border: 1px solid #fedfc8
}

table.orange table {
    --devsite-table-heading-background: inherit
}

table.pink {
    --devsite-alt-table-cell-background: #fef5fa;
    --devsite-table-heading-background: 0;
    --devsite-responsive-table-first-column-background: #fef5fa;
    --devsite-table-row-background: #fde7f3;
    --devsite-table-row-border: 1px solid #fdcfe8
}

table.pink table {
    --devsite-table-heading-background: inherit
}

table.purple {
    --devsite-alt-table-cell-background: #faf6fe;
    --devsite-table-heading-background: 0;
    --devsite-responsive-table-first-column-background: #faf6fe;
    --devsite-table-row-background: #f3e8fd;
    --devsite-table-row-border: 1px solid #e9d2fd
}

table.purple table {
    --devsite-table-heading-background: inherit
}

.devsite-header-billboard {
    --devsite-h1-margin: 14px 0
}

[background] {
    --devsite-background-button-border-color: transparent;
    --devsite-background-button-color-hover: var(--devsite-button-color);
    --devsite-background-button-primary-background: var(--devsite-background-1);
    --devsite-background-button-primary-background-hover: var( --devsite-link-background-active );
    --devsite-background-button-primary-color: var(--devsite-button-color);
    --devsite-background-button-primary-color-hover: var(--devsite-button-color);
    --devsite-background-button-white-background-hover: hsla(210,6%,63%,.3);
    --devsite-background-button-white-background-focus: hsla(210,6%,63%,.5);
    --devsite-heading-color: var(--devsite-inverted-text-color);
    --devsite-icon-color: var(--devsite-inverted-text-color);
    --devsite-icon-color-hover: var(--devsite-inverted-text-color-hover);
    --devsite-link-color: var(--devsite-inverted-text-color)
}

.devsite-landing-row-cta {
    --devsite-button-border: 1px solid transparent;
    --devsite-button-border-active: 1px solid transparent;
    --devsite-button-border-hover: 1px solid transparent;
    --devsite-button-primary-background: var(--devsite-background-1);
    --devsite-button-primary-background-hover: var( --devsite-link-background-active );
    --devsite-button-primary-color: var(--devsite-button-color);
    --devsite-button-primary-color-hover: var(--devsite-button-color);
    --devsite-button-raised-background: var(--devsite-background-1);
    --devsite-button-raised-background-active: var( --devsite-link-background-active );
    --devsite-button-raised-background-hover: var( --devsite-link-background-active );
    --devsite-button-white-background-focus: hsla(210,6%,63%,.5);
    --devsite-button-white-background-hover: hsla(210,6%,63%,.3);
    --devsite-button-white-color: var(--devsite-inverted-text-color)
}

[theme=cyan] .devsite-landing-row-cta,[theme=google-yellow] .devsite-landing-row-cta,[theme=orange] .devsite-landing-row-cta,[theme=pale-blue] .devsite-landing-row-cta {
    --devsite-button-white-color: #202124;
    --devsite-text-color: #202124
}

[background=theme] {
    --devsite-background-color: var(--devsite-primary-color)
}

[background=grey],[background=white] {
    --devsite-background-button-border-color: #dadce0;
    --devsite-background-button-color: #1967d2;
    --devsite-background-button-color-hover: #1967d2;
    --devsite-background-button-primary-background: var( --devsite-button-primary-background );
    --devsite-background-button-primary-background-hover: var( --devsite-button-primary-background-hover );
    --devsite-background-button-primary-color: var( --devsite-button-primary-color );
    --devsite-background-button-primary-color-hover: var( --devsite-button-primary-color-hover );
    --devsite-background-button-white-color: var(--devsite-button-color);
    --devsite-icon-color: var(--devsite-secondary-text-color);
    --devsite-icon-color-hover: var(--devsite-link-color)
}

[background=blue-grey] {
    --devsite-background-color: #607d8b
}

[background=blue-grey-dark] {
    --devsite-background-color: #455a64
}

[background=cyan] {
    --devsite-background-color: #12b5cb
}

[background=deep-orange] {
    --devsite-background-color: #e8710a
}

[background=deep-purple] {
    --devsite-background-color: #681da8
}

[background=google-blue] {
    --devsite-background-color: #1a73e8
}

[background=google-green] {
    --devsite-background-color: #1e8e3e
}

[background=google-red] {
    --devsite-background-color: #d93025
}

[background=google-yellow] {
    --devsite-background-color: #f9ab00
}

[background=indigo] {
    --devsite-background-color: #3f51b5
}

[background=orange] {
    --devsite-background-color: #e8710a
}

[background=pink] {
    --devsite-background-color: #e52592
}

[background=purple] {
    --devsite-background-color: #9334e6
}

[background=teal] {
    --devsite-background-color: #009688
}

[background=blue] {
    --devsite-background-color: #174ea6
}

[background=green] {
    --devsite-background-color: #34a853
}

[background=light-blue] {
    --devsite-background-color: #d2e3fc
}

[background=light-green] {
    --devsite-background-color: #ceead6
}

[background=navy] {
    --devsite-background-color: #202124
}

[background=pale-blue] {
    --devsite-background-color: #e8f0fe
}

[background=cyan] {
    --devsite-background-color: #4ecde6
}

[background=google-yellow] {
    --devsite-background-color: #fcc934
}

[background=orange] {
    --devsite-background-color: #fcad70
}

[background=cyan],[background=google-yellow],[background=orange],[background=pale-blue],[theme=cyan] [background=theme],[theme=google-yellow] [background=theme],[theme=orange] [background=theme],[theme=pale-blue] [background=theme] {
    --devsite-background-button-white-color: #202124;
    --devsite-heading-color: #202124;
    --devsite-icon-color: #202124;
    --devsite-icon-color-hover: #5f6368;
    --devsite-link-color: #202124;
    --devsite-text-color: #202124;
    --devsite-text-color-hover: #5f6368
}

[background=white] {
    --devsite-background-color: var(--devsite-background-1);
    --devsite-heading-color: var(--devsite-primary-text-color);
    --devsite-link-color: unset;
    --devsite-text-color: var(--devsite-primary-text-color);
    --devsite-text-color-hover: var(--devsite-secondary-text-color)
}

[foreground=cyan],[foreground=google-yellow],[foreground=orange],[foreground=pale-blue] {
    --devsite-foreground-button-primary-color: #202124
}

[foreground=theme] {
    --devsite-icon-color: var(--devsite-primary-color)
}

[foreground=theme] .devsite-heading-link {
    --devsite-icon-color: var(--devsite-secondary-text-color);
    --devsite-icon-color-hover: var(--devsite-link-color)
}

[foreground=white] {
    --devsite-icon-color: var(--devsite-inverted-text-color);
    --devsite-text-color: var(--devsite-inverted-text-color)
}

.devsite-landing-row-item-labels :not(.devsite-label)[background]:not([foreground]) {
    --devsite-label-color: var(--devsite-inverted-text-color)
}

.devsite-landing-row-item-labels :not(.devsite-label)[background=cyan]:not([foreground]),.devsite-landing-row-item-labels :not(.devsite-label)[background=google-yellow]:not([foreground]),.devsite-landing-row-item-labels :not(.devsite-label)[background=grey]:not([foreground]),.devsite-landing-row-item-labels :not(.devsite-label)[background=light-green]:not([foreground]),.devsite-landing-row-item-labels :not(.devsite-label)[background=orange]:not([foreground]),.devsite-landing-row-item-labels :not(.devsite-label)[background=pale-blue]:not([foreground]),.devsite-landing-row-item-labels :not(.devsite-label)[background=white]:not([foreground]) {
    --devsite-label-color: #202124
}

[layout=docs] {
    --devsite-banner-margin: -40px -40px 40px
}

[layout=docs],[layout=docs][template=landing] {
    --devsite-banner-message-padding: 20px 40px 19px
}

[layout=full],[template=landing] {
    --devsite-banner-message-padding: 20px 24px 19px
}

[layout=full] {
    --devsite-banner-margin: -40px calc(50% - 50vw) 40px;
    --devsite-main-content-max-width: 1600px;
    --devsite-main-content-padding: 40px 80px
}

[layout=full][concierge] {
    --devsite-banner-margin: -40px calc(50% - 50vw + var(--devsite-concierge-width)/2) 40px
}

[template="404"],[template=offline] {
    --devsite-404-links-columns: 4;
    --devsite-404-search-margin: 0 0 160px;
    --devsite-main-content-padding: 0 80px
}

[layout][template=badge],[layout][template=landing],[layout][template=playlist],[layout][template=profile],[layout][template=quiz],[layout][template=topic] {
    --devsite-banner-margin: 0;
    --devsite-main-content-max-width: none;
    --devsite-main-content-padding: 0
}

[layout][concierge=closed],[layout][concierge] {
    --devsite-concierge-width: var(--devsite-concierge-width-closed,0px)
}

[layout][concierge=open] {
    --devsite-concierge-width: var(--devsite-concierge-width-open,0px)
}

[layout][concierge=hide],[layout][concierge=modal] {
    --devsite-concierge-width: 0px
}

[layout][codelabs-content-type=paginated][concierge] {
    --devsite-concierge-top: 64px
}

[layout=full]:not([template=landing]) {
    --devsite-notice-margin: 16px calc(50% - 50vw);
    --devsite-notice-padding-block: 15px;
    --devsite-notice-padding-inline: calc(50vw - 50% + 36px) calc(50vw - 50%)
}

[layout=full] devsite-content,[template=landing] devsite-content {
    --devsite-breadcrumb-list-display: none;
    --devsite-breadcrumb-list-padding: 20px 24px
}

[layout=full][template=search] devsite-content {
    --devsite-breadcrumb-list-padding: inherit
}

.devsite-landing-row {
    --devsite-landing-group-padding: 0 24px;
    --devsite-landing-row-padding: 40px 0
}

[layout=docs] .devsite-landing-row {
    --devsite-landing-group-padding: 0 40px
}

.devsite-landing-row-padding-medium {
    --devsite-landing-row-padding: 64px 0
}

.devsite-landing-row-padding-large {
    --devsite-landing-row-padding: 96px 0
}

.devsite-landing-row-padding-xlarge {
    --devsite-landing-row-padding: 128px 0
}

.devsite-landing-row-1-up {
    --devsite-1-up-grid-template-columns: repeat(12,1fr);
    --devsite-1-up-no-media-description-grid-column: 1/span 8;
    --devsite-custom-image-icon-font-size: 256px;
    --devsite-custom-image-icon-max-height: 256px;
    --devsite-custom-image-icon-width: 256px
}

.devsite-landing-row-2-up,.devsite-landing-row-50 {
    --devsite-custom-image-icon-font-size: 192px;
    --devsite-custom-image-icon-max-height: 192px;
    --devsite-custom-image-icon-width: 192px
}

.devsite-landing-row-3-up,.devsite-landing-row-67 {
    --devsite-custom-image-icon-font-size: 128px;
    --devsite-custom-image-icon-max-height: 128px;
    --devsite-custom-image-icon-width: 128px
}

.devsite-landing-row-4-up,.devsite-landing-row-75,[layout=docs] .devsite-landing-row-2-up {
    --devsite-custom-image-icon-font-size: 96px;
    --devsite-custom-image-icon-max-height: 96px;
    --devsite-custom-image-icon-width: 96px
}

.devsite-landing-row-2-up {
    --devsite-landing-row-group-grid: auto-flow/repeat(2,1fr)
}

.devsite-landing-row-3-up {
    --devsite-landing-row-group-grid: auto-flow/repeat(3,1fr)
}

.devsite-landing-row-4-up {
    --devsite-landing-row-group-grid: auto-flow/repeat(4,1fr)
}

[header-position=left],[header-position=right] {
    --devsite-landing-row-group-grid: auto-flow/repeat(2,1fr)
}

[size=small] {
    --devsite-icon-size: 24px
}

[size=medium] {
    --devsite-icon-size: 48px
}

[size=large] {
    --devsite-icon-size: 96px
}

[size=xlarge] {
    --devsite-icon-size: 144px
}

.devsite-landing-row-logos [size] {
    --devsite-custom-image-icon-font-size: 96px;
    --devsite-custom-image-icon-max-height: 96px;
    --devsite-custom-image-icon-width: 96px;
    --devsite-icon-size: 96px
}

[background][size] {
    --devsite-icon-margin-block: 0;
    --devsite-icon-margin-inline: 0
}

[background][size=small] {
    --devsite-icon-canvas-size: 28px;
    --devsite-icon-size: 18px
}

[background][size=medium] {
    --devsite-icon-size: 36px
}

[background][size=large] {
    --devsite-icon-canvas-size: 112px;
    --devsite-icon-size: 72px
}

[background][size=xlarge] {
    --devsite-icon-canvas-size: 168px;
    --devsite-icon-size: 108px
}

[icon-position^=bottom] {
    --devsite-icon-canvas-margin-block: 8px 0
}

[icon-position=bottom] {
    --devsite-icon-canvas-margin-inline: 0;
    --devsite-icon-margin-inline: 0
}

[icon-position=bottom-right] {
    --devsite-icon-canvas-margin-inline: 20px 0;
    --devsite-icon-margin-inline: 0 4px
}

[icon-position=right] {
    --devsite-icon-canvas-margin-block: 0;
    --devsite-icon-canvas-margin-inline: 20px 0;
    --devsite-icon-margin-block: 0;
    --devsite-icon-margin-inline: 0
}

[icon-position=top] {
    --devsite-header-icon-canvas-margin-block: 0 20px;
    --devsite-header-icon-canvas-margin-inline: 0
}

[icon-position=top] [size=small] {
    --devsite-icon-canvas-margin-block: 0 12px
}

[icon-position=top] [size=medium] {
    --devsite-icon-canvas-margin-block: 0 16px
}

[icon-position=top] [size=large] {
    --devsite-icon-canvas-margin-block: 0 24px
}

[icon-position=top] [size=xlarge] {
    --devsite-icon-canvas-margin-block: 0 32px
}

.devsite-landing-row-header-centered,.devsite-landing-row-header-centered [icon-position=top] {
    --devsite-header-icon-canvas-margin-inline: auto
}

.devsite-landing-row-item-centered {
    --devsite-icon-margin-inline: auto
}

body:not([codelabs-content-type=paginated]) {
    --devsite-caution-notice-background: #feefe3;
    --devsite-caution-notice-border-color: transparent;
    --devsite-caution-notice-color: #b31412;
    --devsite-key-point-notice-background: #e8eaf6;
    --devsite-key-point-notice-border-color: transparent;
    --devsite-key-point-notice-color: #3f51b5;
    --devsite-key-term-notice-background: #f3e8fd;
    --devsite-key-term-notice-border-color: transparent;
    --devsite-key-term-notice-color: #9334e6;
    --devsite-note-notice-background: #e8f0fe;
    --devsite-note-notice-border-color: transparent;
    --devsite-note-notice-color: #303f9f;
    --devsite-status-notice-background: #f1f3f4;
    --devsite-status-notice-border-color: transparent;
    --devsite-status-notice-color: #546e7a;
    --devsite-success-notice-background: #e0f2f1;
    --devsite-success-notice-border-color: transparent;
    --devsite-success-notice-color: #00796b;
    --devsite-warning-notice-background: #fce8e6;
    --devsite-warning-notice-border-color: transparent;
    --devsite-warning-notice-color: #a50e0e
}

@media screen and (max-width: 1253px) {
    [layout] devsite-catalog {
        --devsite-catalog-grid:"main"/1fr;
        --devsite-catalog-sidebar-button-display: inline-block!important;
        --devsite-catalog-sidebar-button-margin: 0 0 16px;
        --devsite-columns: 2
    }

    devsite-recommended-content {
        --devsite-columns: 3
    }
}

@media screen and (max-width: 1440px) {
    [template] devsite-recommended-content devsite-carousel[data-items-per-slide=auto] {
        --devsite-carousel-gap:0;
        --devsite-carousel-ghost-item-width: 16px;
        --devsite-carousel-gradient-start-grid-column: 2;
        --devsite-carousel-gradient-end-grid-column: -2;
        --devsite-carousel-gradient-width: 80px;
        --devsite-carousel-grid: minmax(var(--devsite-carousel-button-size),auto) /0 48px 1fr 48px 0;
        --devsite-carousel-slideshow-scroll-padding: 0 24px
    }
}

@media screen and (max-width: 840px) {
    [template=page] devsite-carousel[data-full-width],[template=page] devsite-carousel[data-items-per-slide=auto] {
        --devsite-carousel-gap:16px 24px;
        --devsite-carousel-grid: 1fr var(--devsite-carousel-button-size) /0 var(--devsite-carousel-button-size) 1fr var(--devsite-carousel-button-size) 0;
        --devsite-carousel-margin-inline: -24px;
        --devsite-carousel-markers-grid-column: 3;
        --devsite-carousel-next-grid-column: 4;
        --devsite-carousel-prev-grid-column: 2;
        --devsite-carousel-slideshow-grid-column: 1/-1;
        --devsite-carousel-slideshow-padding-inline: 24px
    }

    [template=page] devsite-carousel[data-items-per-slide=auto] {
        --devsite-carousel-ghost-item-width: 16px;
        --devsite-carousel-slideshow-scroll-padding: 0 24px
    }

    devsite-footer-utility devsite-language-selector {
        --devsite-language-selector-menu-inset-inline: 0 auto
    }

    devsite-playlist {
        --devsite-playlist-max-width: 768px;
        --devsite-playlist-padding-x: 40px
    }

    devsite-recommended-content {
        --devsite-columns: 2;
        --devsite-recommended-content-filters-margin-inline: -24px;
        --devsite-recommended-content-filters-padding-inline: 24px;
        --devsite-recommended-content-filters-width: calc(100% + ($SITE_PADDING * 2))
    }

    [layout] {
        --devsite-banner-margin: -24px -24px 24px
    }

    [layout][template] {
        --devsite-banner-message-padding: 20px 24px 19px
    }

    [layout=full] {
        --devsite-main-content-padding: 24px
    }

    [template="404"],[template=offline] {
        --devsite-404-links-columns: 2;
        --devsite-404-search-margin: 0 0 80px;
        --devsite-main-content-padding: 0 24px
    }

    .devsite-landing-row,[class*=devsite-landing-row-padding-] {
        --devsite-landing-row-padding: 24px 0
    }

    [layout=docs] .devsite-landing-row {
        --devsite-landing-group-padding: 0 24px
    }

    .devsite-landing-row-1-up {
        --devsite-1-up-grid-template-columns: repeat(2,1fr);
        --devsite-1-up-no-media-description-grid-column: 1/span 2
    }

    .devsite-landing-row-1-up,.devsite-landing-row-2-up,.devsite-landing-row-3-up,.devsite-landing-row-4-up {
        --devsite-custom-image-icon-font-size: 128px;
        --devsite-custom-image-icon-max-height: 128px;
        --devsite-custom-image-icon-width: 128px
    }

    .devsite-landing-row-3-up,.devsite-landing-row-4-up {
        --devsite-landing-row-group-grid: auto-flow/repeat(2,1fr)
    }

    [icon-position^=bottom] {
        --devsite-icon-canvas-margin-block: 0;
        --devsite-icon-canvas-margin-inline: 20px 0;
        --devsite-icon-margin-inline: 0 4px
    }
}

@media screen and (max-width: 600px) {
    :root {
        --devsite-landing-row-item-gap:16px
    }

    [layout] {
        --devsite-banner-margin: -16px -16px 16px
    }

    [layout][template] {
        --devsite-banner-message-padding: 16px 16px 15px
    }

    [layout=full] {
        --devsite-main-content-padding: 16px;
        --devsite-notice-margin: 16px -40px;
        --devsite-notice-padding-block: 15px;
        --devsite-notice-padding-inline: 76px 40px
    }

    [layout=full] devsite-content,[template=landing] devsite-content {
        --devsite-breadcrumb-list-padding: 20px 16px
    }

    [template="404"],[template=offline] {
        --devsite-404-search-margin: 0 0 40px;
        --devsite-main-content-padding: 0 16px
    }

    [template] devsite-carousel[data-full-width],[template] devsite-carousel[data-items-per-slide=auto] {
        --devsite-carousel-gap: 16px 16px;
        --devsite-carousel-grid: 1fr var(--devsite-carousel-button-size) /0 var(--devsite-carousel-button-size) 1fr var(--devsite-carousel-button-size) 0;
        --devsite-carousel-margin-inline: -16px;
        --devsite-carousel-markers-grid-column: 3;
        --devsite-carousel-next-grid-column: 4;
        --devsite-carousel-prev-grid-column: 2;
        --devsite-carousel-slideshow-grid-column: 1/-1;
        --devsite-carousel-slideshow-padding-inline: 16px
    }

    [template] devsite-carousel[data-items-per-slide=auto] {
        --devsite-carousel-ghost-item-width: 8px;
        --devsite-carousel-slideshow-scroll-padding: 0 16px
    }

    devsite-content {
        --devsite-select-sibling-gap-x: 0;
        --devsite-select-sibling-gap-y: 16px
    }

    devsite-footer-linkboxes {
        --devsite-footer-linkboxes-grid-template-columns: 1fr;
        --devsite-footer-linkboxes-padding: 0 16px
    }

    devsite-playlist {
        --devsite-playlist-max-width: 100%;
        --devsite-playlist-padding-x: 24px
    }

    [template=landing] devsite-carousel[data-hide-mobile-controls],[template=page] devsite-carousel[data-hide-mobile-controls],[template=search] devsite-carousel[data-hide-mobile-controls] {
        --devsite-carousel-markers-display: none;
        --devsite-carousel-prev-next-display: none
    }

    [template] devsite-recommended-content devsite-carousel {
        --devsite-carousel-item-width: 70vw!important;
        --devsite-carousel-margin-inline: -16px;
        --devsite-carousel-markers-display: none;
        --devsite-carousel-prev-next-display: none;
        --devsite-carousel-slideshow-grid-column: 1/-1;
        --devsite-carousel-slideshow-padding-inline: 16px;
        --devsite-carousel-slideshow-scroll-padding: 0 16px
    }

    devsite-recommended-content devsite-carousel[data-items-per-slide=auto] {
        --devsite-carousel-gradient-display: none;
        --devsite-carousel-item-flex: initial
    }

    devsite-select {
        --devsite-select-display: block
    }

    .devsite-landing-row,[class*=devsite-landing-row-padding-] {
        --devsite-landing-group-padding: 0 16px;
        --devsite-landing-row-padding: 16px 0;
        --devsite-landing-row-group-margin: 16px 0
    }

    [layout=docs] .devsite-landing-row {
        --devsite-landing-group-padding: 0 16px
    }

    .devsite-landing-row-1-up,.devsite-landing-row-2-up,.devsite-landing-row-3-up {
        --devsite-item-display: block
    }

    .devsite-landing-row-2-up,.devsite-landing-row-3-up,.devsite-landing-row-4-up,.devsite-landing-row[header-position] {
        --devsite-landing-row-group-grid: auto-flow/1fr
    }
}

:root,[background] {
    --devsite-button-background: 0;
    --devsite-button-background-hover: #202124;
    --devsite-button-background-active: #202124;
    --devsite-button-border: 2px solid #202124;
    --devsite-button-border-hover: 2px solid #202124;
    --devsite-button-border-active: 2px solid #202124;
    --devsite-button-color: #202124;
    --devsite-button-color-hover: #fff;
    --devsite-button-color-active: #fff;
    --devsite-foreground-button-background-hover: #202124;
    --devsite-foreground-button-border-color: #202124;
    --devsite-foreground-button-color: #202124;
    --devsite-foreground-button-color-hover: #fff;
    --devsite-background-button-background: transparent;
    --devsite-background-button-background-hover: #fff;
    --devsite-background-button-border-color: #202124;
    --devsite-background-button-border-color-hover: #fff;
    --devsite-background-button-color: #202124;
    --devsite-background-button-color-hover: #202124;
    --devsite-button-primary-background: #000;
    --devsite-button-primary-background-hover: #dadce0;
    --devsite-button-primary-background-active: #dadce0;
    --devsite-button-primary-color: #fff;
    --devsite-button-primary-color-hover: #000;
    --devsite-button-primary-color-active: #000;
    --devsite-foreground-button-primary-background: #000;
    --devsite-foreground-button-primary-background-hover: #dadce0;
    --devsite-foreground-button-primary-color: #fff;
    --devsite-foreground-button-primary-color-hover: #000;
    --devsite-background-button-primary-background: #000;
    --devsite-background-button-primary-background-hover: #dadce0;
    --devsite-background-button-primary-color: #fff;
    --devsite-background-button-primary-color-hover: #000;
    --devsite-button-white-background-hover: transparent;
    --devsite-button-white-background-active: transparent;
    --devsite-button-white-text-decoration-hover: underline;
    --devsite-button-white-color: #174ea6;
    --devsite-feature-tooltip-border-radius: 8px;
    --devsite-foreground-button-white-background-hover: transparent;
    --devsite-foreground-button-white-color: #174ea6;
    --devsite-background-button-white-background-hover: transparent;
    --devsite-background-button-white-background-focus: transparent;
    --devsite-button-disabled-background: #dadce0;
    --devsite-button-disabled-color: #80868b
}

:root {
    --devsite-logo-height: 20px;
    --devsite-primary-font-family: Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --devsite-headline-font-family: Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-headline-1-font: 700 64px/72px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-headline-1-letter-spacing: -0.5px;
    --android-headline-2-font: 600 48px/56px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-headline-2-letter-spacing: -0.5px;
    --android-headline-3-font: 600 40px/48px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-headline-3-letter-spacing: -0.5px;
    --android-headline-4-font: 600 32px/40px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-headline-4-letter-spacing: -0.25px;
    --android-headline-5-font: 500 24px/32px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-headline-5-letter-spacing: normal;
    --android-headline-6-font: 500 22px/28px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-headline-6-letter-spacing: normal;
    --android-subheading-1-font: 500 20px/28px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-subheading-2-font: 500 18px/28px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-body-intro-font: 400 20px/32px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-body-intro-font-mobile: 400 16px/24px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-body-intro-letter-spacing: 0.25px;
    --android-body-font: 400 16px/24px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-body-small-font: 400 14px/20px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-docs-headline-1-font: 600 40px/48px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-docs-headline-1-letter-spacing: -0.5px;
    --android-docs-headline-2-font: 600 24px/32px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-docs-headline-2-letter-spacing: normal;
    --android-docs-headline-3-font: 500 20px/28px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-docs-headline-3-letter-spacing: normal;
    --android-docs-headline-4-font: 500 18px/28px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-docs-headline-4-letter-spacing: normal;
    --android-docs-headline-5-font: 700 16px/24px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-docs-headline-5-letter-spacing: normal;
    --android-docs-headline-6-font: 700 14px/20px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-docs-headline-6-letter-spacing: normal;
    --android-cta-font: 500 16px/24px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-cta-letter-spacing: 0.5px;
    --android-detail-font: 500 16px/24px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-eyebrow-font: 500 14px/20px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-eyebrow-letter-spacing: 1.5px;
    --android-steps-title-font: 500 16px/24px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-tab-font: 500 14px/24px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --android-tab-letter-spacing: 0.25px;
    --andorid-tag-font: 500 12px/20px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --devsite-display-font: var(--android-docs-headline-1-font);
    --devsite-display-letter-spacing: var( --android-docs-headline-1-letter-spacing );
    --devsite-h1-font: var(--android-docs-headline-1-font);
    --devsite-h1-letter-spacing: var(--android-docs-headline-1-letter-spacing);
    --devsite-h2-border: 0;
    --devsite-h2-font: var(--android-docs-headline-2-font);
    --devsite-h2-letter-spacing: var(--android-docs-headline-2-letter-spacing);
    --devsite-h2-margin: 56px 0 16px;
    --devsite-h2-padding: 0;
    --devsite-h3-font: var(--android-docs-headline-3-font);
    --devsite-h3-letter-spacing: var(--android-docs-headline-3-letter-spacing);
    --devsite-h3-margin: 32px 0 16px;
    --devsite-h4-font: var(--android-docs-headline-4-font);
    --devsite-h5-font: var(--android-docs-headline-5-font);
    --devsite-h6-font: var(--android-docs-headline-6-font);
    --devsite-button-border-radius: 96px;
    --devsite-button-box-shadow: none;
    --devsite-button-box-shadow-focus: 0 0 0 1px #fff,0 0 0 3px #174ea6;
    --devsite-button-box-shadow-active: none;
    --devsite-button-font: var(--android-cta-font);
    --devsite-button-height: 48px;
    --devsite-button-letter-spacing: var(--android-cta-letter-spacing);
    --devsite-button-line-height: 44px;
    --devsite-button-padding: 0 24px;
    --devsite-button-text-transform: none;
    --devsite-button-transform-active: scale(0.96);
    --devsite-button-disabled-line-height: 48px;
    --devsite-button-primary-box-shadow-hover: none;
    --devsite-button-primary-box-shadow-active: none;
    --devsite-button-primary-line-height: 48px;
    --devsite-button-white-line-height: 48px;
    --devsite-button-raised-line-height: 48px;
    --devsite-button-unindented-margin-x: -16px;
    --devsite-button-with-icon-padding: 0 24px;
    --devsite-button-primary-with-icon-padding: 0 24px;
    --devsite-card-attribution-border: none;
    --devsite-card-attribution-color: #202124;
    --devsite-card-attribution-font-size: 16px;
    --devsite-card-attribution-font-weight: 500;
    --devsite-card-attribution-line-height: 24px;
    --devsite-card-attribution-margin: 0 0 16px;
    --devsite-card-attribution-min-height: auto;
    --devsite-card-attribution-padding: 0;
    --devsite-card-background: transparent;
    --devsite-card-border: 0;
    --devsite-card-border-radius: 0;
    --devsite-card-box-shadow: none;
    --devsite-card-box-shadow-hover: none;
    --devsite-card-content-border-radius: 0;
    --devsite-card-content-flex: none;
    --devsite-card-content-padding: 24px 0 0;
    --devsite-card-default-image: url(../images/dynamic-content-card-default.png);
    --devsite-card-image-border-radius: 24px 24px 0 0;
    --devsite-card-image-container-border-radius: 24px 24px 0 0;
    --devsite-input-border: 1px solid #80868b;
    --devsite-input-border-bottom-focus: 2px solid #34a853;
    --devsite-input-border-radius: 0;
    --devsite-input-padding: 16px 24px;
    --devsite-input-padding-bottom-focus: 15px;
    --devsite-link-color: #174ea6;
    --devsite-link-text-decoration-hover: underline;
    --devsite-notice-border-radius: 4px;
    --devsite-hr-margin: 0;
    --android-fully-clickable-border-radius: 24px;
    --devsite-item-border-radius: 24px;
    --devsite-landing-group-border-radius: 24px;
    --devsite-item-media-container-height: max-content;
    --devsite-item-media-border-radius: 24px;
    --devsite-item-media-overflow: hidden
}

[layout=full] {
    --devsite-heading-color: #000;
    --devsite-display-font: var(--android-headline-1-font);
    --devsite-display-letter-spacing: var(--android-headline-1-letter-spacing);
    --devsite-h1-font: var(--android-headline-3-font);
    --devsite-h1-letter-spacing: var(--android-headline-3-letter-spacing);
    --devsite-h1-margin: 16px 0;
    --devsite-h2-font: var(--android-headline-4-font);
    --devsite-h2-letter-spacing: var(--android-headline-4-letter-spacing);
    --devsite-h2-margin: 16px 0;
    --devsite-h3-font: var(--android-headline-5-font);
    --devsite-h3-letter-spacing: var(--android-headline-5-letter-spacing);
    --devsite-h3-margin: 16px 0
}

[layout=full] devsite-dynamic-content {
    --devsite-h3-font: var(--android-headline-4-font);
    --devsite-h3-letter-spacing: var(--android-headline-4-letter-spacing)
}

[layout=docs] {
    --devsite-banner-border-radius: 8px 8px 0 0;
    --devsite-body-background: #fff;
    --devsite-book-nav-background: var(--devsite-body-background);
    --devsite-book-nav-box-shadow: 0 1px 2px 0 #bdc1c6;
    --devsite-first-row-border-radius: 8px 8px 0 0;
    --devsite-last-row-border-radius: 0 0 8px 8px;
    --devsite-page-border: var(--devsite-primary-border);
    --devsite-page-border-radius: 8px;
    --devsite-page-box-shadow: none;
    --devsite-heading-color: #000;
    --devsite-article-meta-margin: 0 0 36px;
    --devsite-notice-margin: 32px 0;
    --devsite-hr-margin: 32px 0;
    --devsite-table-margin: 32px 0
}

[layout=docs] .devsite-landing-row {
    --devsite-h1-font: var(--android-headline-4-font);
    --devsite-h1-letter-spacing: var(--android-headline-4-letter-spacing);
    --devsite-h2-font: var(--android-headline-5-font);
    --devsite-h2-letter-spacing: var(--android-headline-5-letter-spacing);
    --devsite-h3-font: var(--android-headline-5-font);
    --devsite-h3-letter-spacing: var(--android-headline-5-letter-spacing)
}

[template="404"] {
    --devsite-404-error-background: url(/images/page-404-android.svg) right 80px/33% no-repeat;
    --devsite-404-error-heading-display: none;
    --devsite-404-error-message-font: var(--android-headline-1-font);
    --devsite-404-error-message-letter-spacing: var( --android-headline-3-letter-spacing );
    --devsite-404-error-message-margin: 0 0 32px;
    --devsite-404-error-padding: 0 50% 0 0;
    --devsite-404-error-text-align: start;
    --devsite-404-links-border: 0;
    --devsite-404-links-columns: 1;
    --devsite-404-links-heading-font: 400 20px/32px var(--devsite-headline-font-family);
    --devsite-404-links-item-margin: 0 0 12px;
    --devsite-404-links-margin: 0 0 40px;
    --devsite-404-links-padding: 0;
    --devsite-404-max-width: 1380px;
    --devsite-404-min-height: 33vw;
    --devsite-404-search-margin: 0 0 32px
}

[template="404"] devsite-search {
    --devsite-search-active-image-color: #34a853;
    --devsite-search-field-border: 1px solid #34a853;
    --devsite-search-field-border-radius: 32px;
    --devsite-search-field-height: 52px;
    --devsite-search-field-padding-x-start: 52px;
    --devsite-search-field-placeholder-color: #80868b;
    --devsite-search-field-placeholder-font: var(--android-cta-font);
    --devsite-search-form-background-active: var(--devsite-background-1);
    --devsite-search-height: 52px;
    --devsite-search-image-color: #34a853;
    --devsite-search-image-top: 14px;
    --devsite-search-image-x: 20px;
    --devsite-searchbox-background: var(--devsite-background-1);
    --devsite-searchbox-background-active: var(--devsite-background-1)
}

blockquote {
    --devsite-blockquote-background: #f8f9fa;
    --devsite-blockquote-border-left: 8px solid #e8eaed;
    --devsite-blockquote-border-radius: 8px;
    --devsite-blockquote-margin: 32px 0;
    --devsite-blockquote-padding: 24px
}

.devsite-banner {
    --devsite-banner-background: #d2e3fc;
    --devsite-banner-font-size: 16px;
    --devsite-banner-font: var(--android-body-intro-font-mobile);
    --devsite-banner-letter-spacing: var( --android-body-intro-letter-spacing );
    --devsite-banner-message-justify-content: center;
    --devsite-banner-message-max-width: 1380px;
    --devsite-banner-message-padding: 27px 64px 28px;
    --devsite-banner-message-text-margin-x-end: 0;
    --devsite-link-color: currentColor
}

.devsite-banner-announcement:not([background]) {
    background-color: #d2e3fc
}

.devsite-banner.devsite-banner-announcement {
    background-position: 50%
}

.devsite-banner-announcement[background],.devsite-banner.devsite-banner-announcement {
    background-image: url(../images/custom/announcement-banner-dark.svg)
}

.devsite-banner-announcement[background=navy] {
    background-image: url(../images/custom/announcement-banner.svg);
    --devsite-foreground-color: #34a853
}

.devsite-banner~.devsite-article-body {
    --devsite-first-row-border-radius: 0
}

devsite-book-nav {
    --devsite-nav-color-active: #000;
    --devsite-nav-color-hover: #000;
    --devsite-nav-font-size: 14px;
    --devsite-nav-font-weight-active: 700;
    --devsite-nav-item-line-height: 20px;
    --devsite-nav-title-background-active: #d2e3fc;
    --devsite-nav-title-background-hover: #f1f3f4;
    --devsite-nav-title-color-hover: #202124;
    --devsite-nav-title-margin-x: 8px;
    --devsite-nav-title-padding: 6px 0;
    --devsite-nav-toggle-y-start: 3px
}

[dir=ltr] devsite-book-nav {
    --devsite-nav-title-border-radius: 0 16px 16px 0
}

[dir=rtl] devsite-book-nav {
    --devsite-nav-title-border-radius: 16px 0 0 16px
}

.devsite-book-nav-toggle:not([aria-expanded]),.devsite-book-nav-toggle[aria-expanded] {
    --devsite-book-nav-toggle-background: 0;
    --devsite-book-nav-toggle-background-hover: #202124;
    --devsite-book-nav-toggle-border: 2px solid #202124;
    --devsite-book-nav-toggle-border-hover: 2px solid #202124;
    --devsite-book-nav-toggle-box-shadow: none;
    --devsite-book-nav-toggle-box-shadow-hover: none;
    --devsite-book-nav-toggle-color: #202124;
    --devsite-book-nav-toggle-color-hover: #fff
}

.devsite-breadcrumb-list {
    --devsite-font-family: var(--devsite-headline-font-family)
}

.devsite-callout .devsite-callout-dismiss {
    line-height: 36px
}

devsite-catalog {
    --devsite-card-background: var(--devsite-background-1);
    --devsite-catalog-filter-bar-container-color: #34a853;
    --devsite-catalog-filter-bar-container-content: "search";
    --devsite-catalog-filter-bar-container-position: absolute;
    --devsite-catalog-filter-bar-container-top: 14px;
    --devsite-catalog-filter-bar-container-x-start: 20px;
    --devsite-catalog-filter-bar-max-width: auto;
    --devsite-catalog-label-color: #000;
    --devsite-catalog-label-font: var(--android-body-small-font);
    --devsite-catalog-subtitle-font: var(--android-subheading-1-font);
    --devsite-catalog-subtitle-padding: 12px 0;
    --devsite-catalog-title-color: #80868b;
    --devsite-catalog-title-font: var(--android-cta-font);
    --devsite-catalog-title-letter-spacing: 0;
    --devsite-catalog-title-margin: 0 0 12px;
    --devsite-catalog-title-padding: 15px 20px;
    --devsite-catalog-title-text-transform: none;
    --devsite-display-tag-border-radius: 12px;
    --devsite-display-tag-color: #3c4043;
    --devsite-display-tag-font: var(--andorid-tag-font);
    --devsite-display-tag-padding: 2px 8px;
    --devsite-input-border: 1px solid #34a853;
    --devsite-input-border-bottom-focus: 1px solid #34a853;
    --devsite-input-border-radius: 26px;
    --devsite-input-font: var(--android-cta-font);
    --devsite-input-height: 52px;
    --devsite-input-padding-bottom-focus: 0;
    --devsite-landing-row-item-gap: 32px;
    --devsite-secondary-border: 1px solid #dadce0
}

[dir=ltr] devsite-catalog {
    --devsite-input-padding: 0 26px 0 52px
}

[dir=rtl] devsite-catalog {
    --devsite-input-padding: 0 52px 0 26px
}

devsite-catalog .catalog-checkbox-controls-title {
    --devsite-catalog-text-align: center
}

devsite-catalog .catalog-filter-chips {
    --devsite-button-background-active: #202124;
    --devsite-button-border: 1px solid #e8eaed;
    --devsite-button-border-active: 1px solid #202124;
    --devsite-button-background-hover: #174ea6;
    --devsite-button-border-hover: 1px solid #174ea6;
    --devsite-button-color: #174ea6;
    --devsite-button-font: var(--android-eyebrow-font);
    --devsite-button-icon-content: "clear"
}

.android-samples .devsite-card,devsite-catalog [dynamic-card-origin=github],devsite-dynamic-content[query="origin:github"] {
    --devsite-card-api-references-color: #188038;
    --devsite-card-border: var(--devsite-secondary-border);
    --devsite-card-border-radius: 24px;
    --devsite-card-content-flex: 1 0;
    --devsite-card-content-padding: 16px;
    --devsite-card-image-container-border-bottom: var( --devsite-secondary-border );
    --devsite-card-skill-color: var(--devsite-secondary-text-color);
    --devsite-card-skill-font: var(--andorid-tag-font);
    --devsite-card-skill-justify-content: flex-end;
    --devsite-card-skill-icon-margin: 0 4px;
    --devsite-card-summary-color: var(--devsite-secondary-text-color);
    --devsite-card-summary-margin: 0;
    --devsite-h2-font: var(--android-headline-5-font);
    --devsite-h3-font: var(--android-headline-5-font);
    --devsite-heading-color: #202124;
    --devsite-link-color: #202124
}

devsite-code {
    --devsite-code-background: #f8f9fa;
    --devsite-code-border: 1px solid #dadce0;
    --devsite-code-border-radius: 8px;
    --devsite-code-margin: 32px 0
}

devsite-code[dark-code] {
    --devsite-code-background: #202124
}

devsite-content {
    --devsite-code-background: #f8f9fa;
    --devsite-inline-code-border: 1px solid #dadce0;
    --devsite-inline-code-border-radius: 4px;
    --devsite-inline-code-padding: 1px 4px;
    --devsite-inline-nested-code-border: 0;
    --android-link-color-hover: #1e8e3e;
    --devsite-link-text-decoration: underline;
    --devsite-notice-link-hover-background: rgba(0,0,0,.12);
    --devsite-steps-arrow-color: #174ea6;
    --devsite-steps-border: var(--devsite-primary-border);
    --devsite-steps-direction-color: #174ea6;
    --devsite-steps-direction-font: var(--android-eyebrow-font);
    --devsite-steps-margin: 80px 0 0;
    --devsite-steps-padding: 40px 0 80px;
    --devsite-steps-text-decoration-hover: none;
    --devsite-steps-title-border-hover: 1px solid #174ea6;
    --devsite-steps-title-color: #174ea6;
    --devsite-steps-title-font: var(--android-steps-title-font);
    --devsite-steps-arrow-x-start: -30px;
    --devsite-steps-prev-next-margin-x: 36px
}

devsite-content .devsite-breadcrumb-list {
    --devsite-link-text-decoration: none
}

devsite-content .devsite-steps {
    --devsite-link-text-decoration: none
}

devsite-dialog {
    --devsite-border-radius: 8px;
    --devsite-dialog-contents-padding: 16px;
    --devsite-dialog-padding: 24px;
    --devsite-heading-font: var(--android-headline-5-font)
}

.devsite-content-excellence-dialog.has-link {
    --devsite-content-excellence-dialog-width: 600px
}

devsite-dynamic-content {
    --devsite-card-date-color: #202124;
    --devsite-card-date-font: var(--android-detail-font);
    --devsite-card-date-letter-spacing: normal;
    --devsite-card-list-item-border: 1px solid #e8eaed;
    --devsite-card-list-item-border-radius: 8px;
    --devsite-card-list-item-margin: 0 0 16px;
    --devsite-card-list-link-background-hover: #e8f0fe;
    --devsite-card-list-link-color: #202124;
    --devsite-card-list-link-color-hover: #174ea6;
    --devsite-card-list-link-font: var(--android-subheading-1-font);
    --devsite-card-list-link-padding: 24px;
    --devsite-dynamic-content-no-results-image-display: none
}

.devsite-landing-row-item,devsite-dynamic-content {
    --devsite-label-color: var(--devsite-secondary-text-color);
    --devsite-label-font: var(--android-eyebrow-font);
    --devsite-label-letter-spacing: 1.5px;
    --devsite-label-margin: 0 0 16px
}

.devsite-landing-row-item h3 a,devsite-dynamic-content .devsite-card-content>a {
    --devsite-link-color: #202124;
    --devsite-link-text-decoration: none;
    --devsite-link-text-decoration-hover: underline
}

devsite-filter {
    --devsite-filter-results-count-color: #202124;
    --devsite-filter-results-count-font-family: Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --devsite-filter-results-count-margin: 32px 0
}

devsite-footer-linkboxes {
    --devsite-footer-color: var(--devsite-secondary-text-color);
    --devsite-footer-heading-font: var(--android-eyebrow-font);
    --devsite-footer-heading-text-transform: uppercase;
    --devsite-footer-link-color: var(--devsite-primary-text-color);
    --devsite-h3-letter-spacing: 1.5px;
    --devsite-primary-font-family: Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif
}

devsite-footer-utility {
    --devsite-language-selector-margin: math.div($BUTTON-HEIGHT-ANDROID - $BUTTON-HEIGHT,2) 0
}

devsite-googler-buttons {
    --devsite-link-text-decoration: none;
    --devsite-link-text-decoration-hover: none
}

devsite-header {
    --devsite-header-border: var(--devsite-primary-border);
    --devsite-header-color-lower: #f8f9fa;
    --devsite-header-foreground-lower: var(--devsite-secondary-text-color);
    --devsite-header-foreground-lower-active: #174ea6;
    --devsite-header-foreground-lower-hover: #000;
    --devsite-header-foreground-lower-description: var( --devsite-primary-text-color );
    --devsite-header-link-background-active: #e8f0fe;
    --devsite-header-link-border-radius: 4px;
    --devsite-header-link-color: var(--devsite-link-color);
    --devsite-header-link-color-active: var(--devsite-contrast-link-color);
    --devsite-header-link-text-decoration: none;
    --devsite-header-link-text-decoration-active: none;
    --devsite-header-lower-box-shadow: none;
    --devsite-header-lower-breadcrumb-letter-spacing: 1.5px;
    --devsite-header-lower-breadcrumb-text-transform: uppercase;
    --devsite-header-lower-description-font: var(--android-eyebrow-font);
    --devsite-header-lower-tabs-letter-spacing: 0.25px;
    --devsite-lower-tab-marker-border-radius: 1.5px;
    --devsite-lower-tab-marker-color-active: #174ea6;
    --devsite-lower-tab-marker-color-inactive: #80868b;
    --devsite-product-id-row-padding: 16px 24px 8px;
    --devsite-upper-tab-font-weight: 500;
    --devsite-upper-tab-inactive: var(--devsite-secondary-text-color);
    --devsite-upper-tab-margin-x: 8px;
    --devsite-upper-tab-marker-color: #34a853;
    --devsite-upper-tab-marker-color-inactive: #80868b
}

devsite-header .devsite-header-no-lower-tabs {
    --devsite-product-id-row-padding: 40px 24px 24px
}

devsite-header .devsite-top-button,devsite-user .devsite-top-button {
    --devsite-button-box-shadow-focus: none;
    --devsite-button-font: var(--android-tab-font);
    --devsite-button-height: 36px;
    --devsite-button-letter-spacing: var(--android-tab-letter-spacing);
    --devsite-button-line-height: 36px;
    --devsite-button-text-decoration-hover: underline
}

devsite-user .devsite-top-button {
    --devsite-button-background: 0;
    --devsite-button-background-hover: 0;
    --devsite-button-background-active: 0;
    --devsite-button-border: 0;
    --devsite-button-border-hover: 0;
    --devsite-button-border-active: 0;
    --devsite-button-color: #1a73e8;
    --devsite-button-color-hover: #185abc;
    --devsite-button-padding: 0 8px
}

devsite-header[billboard] {
    --devsite-header-color-lower: #202124
}

.devsite-header-billboard {
    --devsite-button-primary-background: #fff;
    --devsite-button-primary-color: #000;
    --devsite-header-color-lower: transparent;
    --devsite-heading-color: #fff;
    --devsite-h1-font: var(--android-headline-1-font);
    --devsite-h1-letter-spacing: var(--android-headline-1-letter-spacing);
    --devsite-h1-line-height: 72px;
    --devsite-h1-margin: 0 0 16px
}

.devsite-landing-row-item-labels {
    --devsite-link-text-decoration: none
}

devsite-nav-buttons {
    --devsite-button-background-hover: #e8f0fe;
    --devsite-button-background-selected: #e8f0fe;
    --devsite-button-border: 1px solid #e8eaed;
    --devsite-button-border-hover: 1px solid #e8eaed;
    --devsite-button-border-selected: 1px solid #e8f0fe;
    --devsite-button-color: #174ea6;
    --devsite-button-color-selected: #174ea6;
    --devsite-button-margin: 6px 0;
    --devsite-button-margin-x-end: 16px;
    --devsite-button-sibling-gap-x: 0;
    --devsite-button-primary-background: #174ea6;
    --devsite-button-primary-background-hover: #202124;
    --devsite-button-primary-background-selected: #202124;
    --devsite-button-primary-color: #fff;
    --devsite-button-primary-color-hover: #fff;
    --devsite-button-primary-color-selected: #fff;
    --devsite-button-white-background-hover: #e8f0fe;
    --devsite-button-white-background-selected: #e8f0fe;
    --devsite-button-white-box-shadow-focus: 0 0 0 1px #fff,0 0 0 3px #174ea6;
    --devsite-button-white-color-selected: #174ea6;
    --devsite-button-white-text-decoration-hover: none
}

devsite-pagination {
    --devsite-button-background: transparent;
    --devsite-button-background-active: transparent;
    --devsite-button-background-hover: transparent;
    --devsite-button-border: 0;
    --devsite-button-border-active: 0;
    --devsite-button-border-hover: 0;
    --devsite-button-box-shadow-focus: none;
    --devsite-button-color: #174ea6;
    --devsite-button-color-active: #174ea6;
    --devsite-button-color-hover: #174ea6;
    --devsite-button-text-decoration-hover: underline;
    --devsite-link-color: #174ea6;
    --devsite-link-text-decoration: none;
    --devsite-pagination-font: var(--android-cta-font);
    --devsite-pagination-letter-spacing: var(--android-cta-letter-spacing);
    --devsite-pagination-link-margin: 0 8px
}

devsite-playlist {
    --devsite-link-text-decoration: none;
    --devsite-playlist-button-color: var(--devsite-button-color);
    --devsite-playlist-button-color-hover: var(--devsite-button-color-hover);
    --devsite-playlist-button-color-active: var(--devsite-button-color-active)
}

devsite-select {
    --devsite-list-border-radius: 8px
}

devsite-selector {
    --devsite-border-radius: 8px;
    --devsite-link-hover: #000;
    --devsite-tab-marker-color: #80868b;
    --devsite-selector-margin: 32px 0
}

devsite-selector devsite-code {
    --devsite-content-border-radius: 0 0 8px 8px;
    --devsite-code-border: 0;
    --devsite-code-border-radius: 0
}

.devsite-sidebar {
    --devsite-nav-color-active: #174ea6;
    --devsite-nav-color-hover: #174ea6;
    --devsite-nav-font-size: 14px;
    --devsite-nav-heading-color: #202124;
    --devsite-nav-list-padding-x-start: 16px;
    --devsite-nav-nested-color-hover: #174ea6;
    --devsite-nav-title-color: #202124;
    --devsite-nav-title-nested-color: var(--devsite-secondary-text-color);
    --devsite-nav-title-padding: 8px 0;
    --devsite-toc-border-width: 2px;
    --devsite-toc-border: #4285f4
}

devsite-tabs {
    --devsite-link-font: var(--android-tab-font);
    --devsite-link-letter-spacing: var(--android-tab-letter-spacing);
    --devsite-link-text-decoration: none;
    --devsite-link-text-transform: none;
    --devsite-tab-marker-border-radius: 3px 3px 0 0;
    --devsite-tab-marker-height: 3px;
    --devsite-tab-marker-position-x: 24px
}

devsite-header devsite-tabs {
    --devsite-dropdown-content-padding: 0;
    --devsite-dropdown-tab-padding-x: 24px;
    --devsite-link-padding: 0 24px;
    --devsite-tab-marker-position-x: 24px
}

devsite-header devsite-tabs[dropdown--open] tab[active] {
    --devsite-upper-tab-active: #5f6368;
    --devsite-upper-tab-active-hover: #202124;
    --devsite-upper-tab-marker-color: transparent;
    --devsite-upper-tab-marker-color-hover: #80868b
}

devsite-header .lower-tabs {
    --devsite-link-padding: 0 28px;
    --devsite-tab-marker-position-x: 28px
}

devsite-header .lower-tabs tab:first-child {
    --devsite-tab-marker-position-x: 24px;
    --devsite-tab-marker-position-x-end: 28px
}

[dir=ltr] devsite-header .lower-tabs tab:first-child {
    --devsite-link-padding: 0 28px 0 24px
}

[dir=rtl] devsite-header .lower-tabs tab:first-child {
    --devsite-link-padding: 0 24px 0 28px
}

devsite-feature-tooltip {
    --devsite-button-height: 48px
}

devsite-user {
    --devsite-button-height: 36px;
    --devsite-button-primary-line-height: 36px;
    --devsite-button-white-line-height: 36px
}

table {
    --devsite-table-cell-padding: 15px 16px 16px;
    --devsite-table-code-background: #f8f9fa;
    --devsite-table-code-border: 1px solid #dadce0;
    --devsite-table-code-border-radius: 4px;
    --devsite-table-code-padding: 1px 4px;
    --devsite-table-heading-background: #f1f3f4;
    --devsite-table-heading-color: #000;
    --devsite-table-heading-padding: 16px;
    --devsite-responsive-table-first-column-background: #f8f9fa;
    --devsite-responsive-table-heading-padding: 14px 16px
}

.devsite-landing-row {
    --devsite-buttons-margin: auto 0 0;
    --devsite-buttons-padding: 16px 0 0;
    --devsite-dynamic-content-margin: 0;
    --devsite-header-icon-canvas-margin-block: 0 16px;
    --devsite-header-icon-canvas-margin-inline: 0 16px;
    --devsite-icon-canvas-margin-block: 0 16px;
    --devsite-icon-canvas-margin-inline: 0 16px;
    --devsite-icon-margin-inline: 0;
    --devsite-item-description-margin: 24px 0 0;
    --devsite-item-description-padding: 24px;
    --devsite-landing-group-max-width: 1380px;
    --devsite-landing-row-description-font-size: 16px;
    --devsite-landing-row-group-margin: 56px auto 0;
    --devsite-landing-row-item-gap: 32px;
    --devsite-landing-row-padding: 80px 0
}

[background][size=small],[size=small] {
    --devsite-icon-canvas-size: 48px;
    --devsite-icon-size: 48px
}

[background][size=medium],[size=medium] {
    --devsite-icon-canvas-size: 56px;
    --devsite-icon-size: 56px
}

[background][size=large],[size=large] {
    --devsite-icon-canvas-size: 80px;
    --devsite-icon-size: 80px
}

[background][size=xlarge],[size=xlarge] {
    --devsite-icon-canvas-size: 104px;
    --devsite-icon-size: 104px
}

.devsite-landing-row-padding-small {
    --devsite-landing-row-padding: 32px 0
}

.devsite-landing-row-padding-medium {
    --devsite-landing-row-padding: 40px 0
}

.devsite-landing-row-padding-large {
    --devsite-landing-row-padding: 56px 0
}

.devsite-landing-row-padding-xlarge {
    --devsite-landing-row-padding: 80px 0
}

.devsite-landing-row[header-position=left],.devsite-landing-row[header-position=right] {
    --devsite-landing-row-inner-grid: 1fr/repeat(12,1fr)
}

.devsite-landing-row[header-position=left] {
    --devsite-landing-row-group-grid-column: 5/span 8;
    --devsite-landing-row-header-grid-column: 1/span 3
}

.devsite-landing-row[header-position=right] {
    --devsite-landing-row-group-grid-column: 1/span 8;
    --devsite-landing-row-header-grid-column: 10/span 3
}

.devsite-landing-row-1-up {
    --devsite-media-grid-column: 6/span 7;
    --devsite-media-left-grid-column: 1/span 7;
    --devsite-row-50-media-grid-column: 8/span 5;
    --devsite-row-50-media-left-grid-column: 1/span 5;
    --devsite-row-67-media-grid-column: 10/span 3;
    --devsite-row-67-media-left-grid-column: 1/span 3;
    --devsite-row-75-media-grid-column: 11/span 2;
    --devsite-row-75-media-left-grid-column: 1/span 2
}

.devsite-landing-row-hero {
    --devsite-description-content-font: var(--android-body-intro-font)
}

.devsite-landing-row-inner {
    --devsite-landing-group-padding: 0 64px
}

[layout=docs] .devsite-landing-row-inner {
    --devsite-landing-group-padding: 0 40px
}

[layout=docs] devsite-content devsite-select {
    --devsite-item-background-selected: transparent;
    --devsite-list-font: var(--android-cta-font);
    --devsite-list-min-width: 235px;
    --devsite-list-position-y: 54px;
    --devsite-select-border-radius: 100px;
    --devsite-select-font: var(--android-cta-font);
    --devsite-select-height: 46px;
    --devsite-select-line-height: 46px;
    --devsite-select-padding-inline: 24px 48px;
    --devsite-select-toggle-icon-x: 20px
}

[layout=docs] devsite-content devsite-select[menu--open] {
    --devsite-select-background-color: #d2e3fc;
    --devsite-select-background-color-hover: #d2e3fc
}

[layout=docs] devsite-content .devsite-select-item[data-selected] {
    --devsite-item-color-selected: #174ea6
}

.devsite-landing-row-header-buttons {
    --devsite-buttons-margin: 40px 0 0
}

[background] {
    --devsite-link-text-decoration: underline;
    --devsite-link-text-decoration-hover: none
}

.devsite-landing-row-large-headings,[description-position=left] {
    --devsite-buttons-padding: 32px 0 0
}

[background] {
    --devsite-background-button-white-color: var(--devsite-inverted-text-color);
    --devsite-background-link-color: var(--devsite-text-color);
    --devsite-foreground-button-background-hover: #fff;
    --devsite-foreground-button-color-hover: #202124;
    --devsite-foreground-color: var(--devsite-text-color);
    --devsite-heading-link-color: #202124;
    --devsite-text-color: var(--devsite-inverted-text-color)
}

[background=grey],[background=white] {
    --devsite-heading-color: #000;
    --devsite-link-color: #000;
    --devsite-text-color: var(--devsite-primary-text-color);
    --devsite-text-color-hover: var(--devsite-primary-text-color)
}

[background=grey] {
    --devsite-background-color: var(--devsite-background-2);
    --devsite-foreground-color: #000
}

[background=theme] {
    --devsite-heading-color: #000;
    --devsite-icon-color: #000;
    --devsite-icon-color-hover: rgba(0,0,0,.87);
    --devsite-link-color: #000;
    --devsite-text-color: #000;
    --devsite-text-color-hover: rgba(0,0,0,.87)
}

[background=light-blue],[background=light-green],[background=pale-blue] {
    --devsite-foreground-button-primary-color: #3c4043;
    --devsite-heading-color: #000;
    --devsite-icon-color: #3c4043;
    --devsite-icon-color-hover: hsla(210,6%,63%,.5);
    --devsite-link-color: #3c4043;
    --devsite-text-color: #3c4043;
    --devsite-text-color-hover: hsla(210,6%,63%,.5)
}

[background=blue],[background=green],[background=navy] {
    --devsite-foreground-color: #fff;
    --devsite-heading-color: #fff;
    --devsite-link-color: #fff
}

[background=blue],[background=green] {
    --devsite-button-border: 2px solid #fff;
    --devsite-button-color: #fff;
    --devsite-foreground-button-border-color: #fff;
    --devsite-foreground-button-color: #fff;
    --devsite-background-button-background-hover: #fff;
    --devsite-background-button-border-color: #fff;
    --devsite-background-button-border-color-hover: #fff;
    --devsite-background-button-color: #fff;
    --devsite-button-primary-background: #202124;
    --devsite-button-primary-background-hover: #ceead6;
    --devsite-button-primary-color: #fff;
    --devsite-button-primary-color-hover: #000;
    --devsite-foreground-button-primary-background: #202124;
    --devsite-foreground-button-primary-background-hover: #ceead6;
    --devsite-foreground-button-primary-color: #fff;
    --devsite-foreground-button-primary-color-hover: #000;
    --devsite-background-button-primary-background-hover: #ceead6;
    --devsite-button-white-color: #fff;
    --devsite-foreground-button-white-color: #fff
}

[background=theme] {
    --devsite-button-primary-background: #202124;
    --devsite-button-primary-background-hover: #ceead6;
    --devsite-button-primary-color: #fff;
    --devsite-button-primary-color-hover: #000;
    --devsite-foreground-button-primary-background: #202124;
    --devsite-foreground-button-primary-background-hover: #ceead6;
    --devsite-foreground-button-primary-color: #fff;
    --devsite-foreground-button-primary-color-hover: #000;
    --devsite-background-button-primary-background: #202124;
    --devsite-background-button-primary-background-hover: #ceead6;
    --devsite-background-button-primary-color: #fff;
    --devsite-button-white-color: #202124;
    --devsite-foreground-button-white-color: #202124;
    --devsite-background-button-white-color: #202124
}

[background=grey] {
    --devsite-button-primary-background-hover: #ceead6;
    --devsite-button-primary-background-active: #ceead6;
    --devsite-button-primary-color-hover: #000;
    --devsite-foreground-button-primary-background-hover: #ceead6;
    --devsite-foreground-button-primary-color-hover: #000
}

[background=light-blue] {
    --devsite-button-primary-background: #202124;
    --devsite-button-primary-background-hover: #34a853;
    --devsite-button-primary-color: #fff;
    --devsite-button-primary-color-hover: #000;
    --devsite-foreground-button-primary-background: #202124;
    --devsite-foreground-button-primary-background-hover: #34a853;
    --devsite-foreground-button-primary-color: #fff;
    --devsite-foreground-button-primary-color-hover: #000;
    --devsite-button-white-color: #202124;
    --devsite-foreground-button-white-color: #202124;
    --devsite-background-button-white-color: #202124
}

[background=light-green] {
    --devsite-button-primary-background: #202124;
    --devsite-button-primary-background-hover: #34a853;
    --devsite-button-primary-color: #fff;
    --devsite-button-primary-color-hover: #000;
    --devsite-foreground-button-primary-background: #202124;
    --devsite-foreground-button-primary-background-hover: #34a853;
    --devsite-foreground-button-primary-color: #fff;
    --devsite-foreground-button-primary-color-hover: #000;
    --devsite-button-white-color: #174ea6;
    --devsite-foreground-button-white-color: #174ea6;
    --devsite-background-button-white-color: #174ea6
}

[background=navy] {
    --devsite-button-border: 2px solid #fff;
    --devsite-button-color: #fff;
    --devsite-foreground-button-background-hover: #fff;
    --devsite-foreground-button-border-color: #fff;
    --devsite-foreground-button-color: #fff;
    --devsite-foreground-button-color-hover: #202124;
    --devsite-background-button-background-hover: #fff;
    --devsite-background-button-border-color: #fff;
    --devsite-background-button-border-color-hover: #fff;
    --devsite-background-button-color: #fff;
    --devsite-button-primary-background: #34a853;
    --devsite-button-primary-background-hover: #ceead6;
    --devsite-button-primary-color: #000;
    --devsite-background-button-primary-background: #fff;
    --devsite-background-button-primary-background-hover: #dadce0;
    --devsite-background-button-primary-color: #000;
    --devsite-button-white-color: #d2e3fc;
    --devsite-foreground-button-white-color: #d2e3fc;
    --devsite-background-button-white-color: #d2e3fc
}

[background=grey],[background=white] {
    --devsite-background-button-background-hover: #202124;
    --devsite-background-button-background-active: #202124;
    --devsite-background-button-border-color: #202124;
    --devsite-background-button-border-color-hover: #202124;
    --devsite-background-button-color: #202124;
    --devsite-background-button-color-hover: #fff;
    --devsite-background-button-primary-background: #000;
    --devsite-background-button-primary-background-hover: #dadce0;
    --devsite-background-button-primary-color: #fff;
    --devsite-background-button-white-color: #174ea6;
    --devsite-button-primary-background: #34a853;
    --devsite-button-primary-background-hover: #ceead6;
    --devsite-button-primary-color: #000;
    --devsite-button-white-color: #174ea6;
    --devsite-foreground-button-background-hover: #202124;
    --devsite-foreground-button-color-hover: #fff;
    --devsite-foreground-button-white-color: #174ea6
}

[foreground=blue-grey],[theme=blue-grey] [foreground=theme] {
    --devsite-foreground-color: #607d8b
}

[foreground=blue-grey-dark],[theme=blue-grey-dark] [foreground=theme] {
    --devsite-foreground-color: #455a64
}

[foreground=cyan],[theme=cyan] [foreground=theme] {
    --devsite-foreground-color: #12b5cb
}

[foreground=deep-orange],[theme=deep-orange] [foreground=theme] {
    --devsite-foreground-color: #e8710a
}

[foreground=deep-purple],[theme=deep-purple] [foreground=theme] {
    --devsite-foreground-color: #681da8
}

[foreground=google-blue],[theme=google-blue] [foreground=theme] {
    --devsite-foreground-color: #1a73e8
}

[foreground=google-green],[theme=google-green] [foreground=theme] {
    --devsite-foreground-color: #1e8e3e
}

[foreground=google-red],[theme=google-red] [foreground=theme] {
    --devsite-foreground-color: #d93025
}

[foreground=google-yellow],[theme=google-yellow] [foreground=theme] {
    --devsite-foreground-color: #f9ab00
}

[foreground=indigo],[theme=indigo] [foreground=theme] {
    --devsite-foreground-color: #3f51b5
}

[foreground=orange],[theme=orange] [foreground=theme] {
    --devsite-foreground-color: #e8710a
}

[foreground=pink],[theme=pink] [foreground=theme] {
    --devsite-foreground-color: #e52592
}

[foreground=purple],[theme=purple] [foreground=theme] {
    --devsite-foreground-color: #9334e6
}

[foreground=teal],[theme=teal] [foreground=theme] {
    --devsite-foreground-color: #009688
}

[foreground=blue],[theme=blue] [foreground=theme] {
    --devsite-foreground-color: #174ea6
}

[foreground=green],[theme=green] [foreground=theme] {
    --devsite-foreground-color: #34a853
}

[foreground=light-blue],[theme=light-blue] [foreground=theme] {
    --devsite-foreground-color: #d2e3fc
}

[foreground=light-green],[theme=light-green] [foreground=theme] {
    --devsite-foreground-color: #ceead6
}

[foreground=navy],[theme=navy] [foreground=theme] {
    --devsite-foreground-color: #202124
}

[foreground=pale-blue],[theme=pale-blue] [foreground=theme] {
    --devsite-foreground-color: #e8f0fe
}

.devsite-landing-row-item[background] {
    --devsite-label-color: inherit
}

.devsite-landing-row-item[background=white] {
    --devsite-label-color: var(--devsite-secondary-text-color)
}

[icon-position] {
    --devsite-icon-margin-inline: 0
}

[icon-position^=bottom] [size=medium],[icon-position^=bottom] [size=small] {
    --devsite-icon-canvas-margin-block: 16px 0
}

[icon-position^=bottom] [size=large],[icon-position^=bottom] [size=xlarge] {
    --devsite-icon-canvas-margin-block: 24px 0;
    --devsite-icon-canvas-margin-inline: 0 24px
}

[icon-position=bottom] [size] {
    --devsite-icon-canvas-margin-inline: 0
}

[icon-position=bottom-right] [size=medium],[icon-position=bottom-right] [size=small] {
    --devsite-icon-canvas-margin-inline: 16px 0
}

[icon-position=bottom-right] [size=large],[icon-position=bottom-right] [size=xlarge] {
    --devsite-icon-canvas-margin-inline: 24px 0
}

[icon-position=top] [size=large],[icon-position=top] [size=xlarge] {
    --devsite-header-icon-canvas-margin-block: 0 24px;
    --devsite-header-icon-canvas-margin-inline: 0 24px;
    --devsite-icon-canvas-margin-block: 0 24px;
    --devsite-icon-canvas-margin-inline: 0 24px
}

.devsite-landing-row-header-centered [icon-position=top] [size],.devsite-landing-row-header-centered [size] {
    --devsite-header-icon-canvas-margin-inline: auto
}

@media screen and (max-width: 840px) {
    :root {
        --android-headline-1-font:700 48px/56px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
        --android-headline-2-font: 600 40px/48px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
        --android-headline-3-font: 600 32px/40px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
        --android-docs-headline-3-letter-spacing: -0.25px;
        --android-headline-4-font: 600 24px/32px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
        --android-docs-headline-4-letter-spacing: normal
    }

    [layout=docs] {
        --devsite-book-nav-background: var(--devsite-background-1)
    }

    [template="404"] {
        --devsite-404-error-background: 0;
        --devsite-404-error-padding: 0;
        --devsite-404-links-columns: 1
    }

    .devsite-banner {
        --devsite-banner-message-padding: 28px 24px
    }

    devsite-content {
        --devsite-steps-arrow-x-start: -24px;
        --devsite-steps-prev-next-margin-x: 32px
    }

    devsite-footer-linkboxes {
        --devsite-footer-linkboxes-grid-template-columns: repeat(3,1fr)
    }

    devsite-footer-utility {
        --devsite-language-selector-margin: unset
    }

    devsite-header {
        --devsite-product-id-row-padding: 24px 24px
    }

    .devsite-header-billboard {
        --devsite-h1-line-height: 56px
    }

    .devsite-landing-row {
        --devsite-dynamic-content-margin: 20px 0;
        --devsite-landing-row-group-margin: 40px auto 0;
        --devsite-landing-row-padding: 56px 0
    }

    .devsite-landing-row-padding-small {
        --devsite-landing-row-padding: 24px 0
    }

    .devsite-landing-row-padding-medium {
        --devsite-landing-row-padding: 32px 0
    }

    .devsite-landing-row-padding-large {
        --devsite-landing-row-padding: 40px 0
    }

    .devsite-landing-row-padding-xlarge {
        --devsite-landing-row-padding: 56px 0
    }

    .devsite-landing-row-inner {
        --devsite-landing-group-padding: 0 24px
    }

    .devsite-landing-row-header-buttons {
        --devsite-buttons-margin: 24px 0 0
    }

    [dir=ltr] .devsite-landing-row-header-buttons {
        --devsite-button-white-padding: 0 8px 0 0
    }

    [dir=rtl] .devsite-landing-row-header-buttons {
        --devsite-button-white-padding: 0 0 0 8px
    }

    .devsite-landing-row-large-headings,[description-position=left] {
        --devsite-buttons-padding: 24px 0 0
    }

    [icon-position^=bottom] [size] {
        --devsite-icon-canvas-margin-block: 0
    }

    [icon-position^=bottom] [size=medium],[icon-position^=bottom] [size=small] {
        --devsite-icon-canvas-margin-inline: 16px 0
    }

    [icon-position^=bottom] [size=large],[icon-position^=bottom] [size=xlarge] {
        --devsite-icon-canvas-margin-inline: 24px 0
    }
}

@media screen and (max-width: 600px) {
    :root {
        --android-headline-1-font:600 40px/48px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
        --android-subheading-2-font: 500 16px/24px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
        --android-body-intro-font: var(--android-body-intro-font-mobile);
        --android-detail-font: 500 14px/16px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif
    }

    [template="404"] {
        --devsite-404-search-margin: 0 0 24px
    }

    .button:not(.button-white),.button:not(.button-white)+.button-white {
        --devsite-button-max-width: 400px;
        --devsite-button-width: 100%
    }

    .devsite-banner {
        --devsite-banner-message-padding: 28px 16px
    }

    devsite-catalog .catalog-main-filter-controls .button:not(.button-white) {
        --devsite-button-width: auto
    }

    devsite-content {
        --devsite-steps-arrow-display: block;
        --devsite-steps-arrow-y-end: 2px;
        --devsite-steps-title-display: none
    }

    devsite-footer-linkboxes {
        --devsite-footer-linkboxes-grid-template-columns: 1fr
    }

    devsite-header {
        --devsite-product-id-row-padding: 24px 16px
    }

    .devsite-header-billboard {
        --devsite-h1-line-height: 48px
    }

    .devsite-landing-row {
        --devsite-landing-row-group-margin: 32px auto 0;
        --devsite-landing-row-item-gap: 16px;
        --devsite-landing-row-padding: 48px 0
    }

    .devsite-landing-row-padding-small {
        --devsite-landing-row-padding: 16px 0
    }

    .devsite-landing-row-padding-medium {
        --devsite-landing-row-padding: 24px 0
    }

    .devsite-landing-row-padding-large {
        --devsite-landing-row-padding: 32px 0
    }

    .devsite-landing-row-padding-xlarge {
        --devsite-landing-row-padding: 48px 0
    }

    .devsite-landing-row-inner {
        --devsite-landing-group-padding: 0 16px
    }
}

.android-page-banner {
    --android-link-color-hover: var(--devsite-link-color);
    --devsite-link-text-decoration: none
}

html {
    -ms-touch-action: manipulation;
    touch-action: manipulation
}

body,html {
    color: var(--devsite-primary-text-color);
    font: 400 16px/24px var(--devsite-primary-font-family);
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    height: 100%;
    margin: 0;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%
}

body {
    background-color: var(--devsite-background-1)
}

.devsite-book-nav-bg:after,body[layout=docs] {
    background-color: var(--devsite-body-background,var(--devsite-background-0))
}

body[sitemask--active] {
    overflow: hidden
}

p {
    margin: 16px 0;
    padding: 0
}

figure {
    text-align: center
}

img,video {
    border: 0;
    height: auto;
    max-width: 100%
}

img {
    border-radius: var(--devsite-image-border-radius)
}

video {
    border-radius: var(--devsite-video-border-radius)
}

table img {
    max-width: 272px
}

table :link,table :visited {
    word-break: normal
}

.devsite-toast-content :link,.devsite-toast-content :visited {
    color: #fff;
    text-decoration: underline
}

.devsite-toast-content a:focus {
    background: hsla(0,0%,100%,.3);
    border-radius: 2px;
    margin: -4px;
    padding: 4px;
    text-decoration: none
}

sup {
    line-height: 1em
}

dd,ol,ul {
    margin: 0;
    padding-left: 40px
}

td>dl>dd,td>ol,td>ul {
    padding-left: 20px
}

ol {
    list-style: decimal outside
}

ol ol {
    list-style-type: lower-alpha
}

ol ol ol {
    list-style-type: lower-roman
}

ol.upper-alpha {
    list-style-type: upper-alpha
}

ul {
    list-style: disc outside
}

li,li p {
    margin: 12px 0;
    padding: 0
}

dt {
    font: 700 16px/24px var(--devsite-primary-font-family)
}

dd,dt {
    margin: 16px 0
}

blockquote {
    background: var(--devsite-blockquote-background,var(--devsite-background-3));
    border-left: var(--devsite-blockquote-border-left,0);
    border-radius: var(--devsite-blockquote-border-radius,0);
    margin: var(--devsite-blockquote-margin,16px 0);
    padding: var(--devsite-blockquote-padding,8px);
    quotes: none
}

hr {
    border: 0;
    border-top: var(--devsite-primary-border);
    height: 0;
    margin: var(--devsite-hr-margin,16px 0);
    width: 100%
}

.devsite-page-title~.devsite-article-body>devsite-view-release-notes:first-child+p,.devsite-page-title~.devsite-article-body>p:first-child {
    margin-top: 28px
}

.devsite-article-body>hr.full-width {
    margin: 16px -40px;
    width: calc(100% + 80px)
}

@media screen and (max-width: 840px) {
    .devsite-article-body>hr.full-width {
        margin:16px -24px;
        width: calc(100% + 48px)
    }
}

@media screen and (max-width: 600px) {
    .devsite-article-body>hr.full-width {
        margin:16px -16px;
        width: calc(100% + 32px)
    }
}

abbr,acronym {
    border-bottom: 1px dotted var(--devsite-secondary-text-color);
    cursor: help
}

address,cite,dfn,em,figcaption {
    font-style: italic
}

strong {
    font-weight: 700
}

[visually-hidden] {
    opacity: 0!important;
    pointer-events: none!important;
    visibility: hidden!important
}

.hidden,[hidden] {
    display: none!important
}

[render-hidden] {
    display: inline!important;
    position: absolute!important;
    visibility: hidden!important
}

[no-scroll] {
    overflow: hidden
}

#app-progress {
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 1011
}

#app-progress .devsite-progress--indeterminate .devsite-progress--indeterminate-1,#app-progress .devsite-progress--indeterminate .devsite-progress--indeterminate-3 {
    background-color: var(--devsite-progress-background-color,var(--devsite-primary-color,var(--devsite-secondary-text-color)))
}

.devsite-article .material-icons {
    vertical-align: bottom
}

.devsite-article-body .material-icons:not(:link):not(button),[template=landing] .devsite-article .material-icons:not(:link):not(button) {
    cursor: default;
    pointer-events: none
}

.footnotes ol {
    padding-left: 16px
}

.footnotes li {
    font: 400 13px/20px var(--devsite-primary-font-family)
}

#qv-wrapper,#table-of-contents,#tb-wrapper,.inline-toc,div.toc:not(.class):not(.group):not(.type):not(.interface),h2#contents,h2.toc,h3#contents,h3.toc,ol.toc,section.toc,ul.toc {
    display: none
}

@media screen and (max-width: 840px) {
    #app-progress {
        z-index:1014
    }
}

.a11y-visually-hidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    white-space: nowrap;
    outline: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    left: 0
}

[dir=rtl] .a11y-visually-hidden {
    left: auto;
    right: 0
}

:link,:visited {
    color: var(--devsite-link-color);
    outline: 0;
    -webkit-text-decoration: var(--devsite-link-text-decoration,none);
    -moz-text-decoration: var(--devsite-link-text-decoration,none);
    text-decoration: var(--devsite-link-text-decoration,none);
    word-break: break-word
}

a:hover {
    -webkit-text-decoration: var(--devsite-link-text-decoration-hover);
    -moz-text-decoration: var(--devsite-link-text-decoration-hover);
    text-decoration: var(--devsite-link-text-decoration-hover)
}

a:focus {
    text-decoration: underline
}

a:focus img {
    -webkit-filter: brightness(75%);
    filter: brightness(75%)
}

.skip-link:focus {
    inset-block-start: var(--devsite-js-header-height);
    margin: 8px;
    position: fixed;
    z-index: 1020
}

.skip-link:not(:focus) {
    background: transparent;
    color: transparent;
    display: block;
    height: 1px;
    left: -500vw;
    overflow: hidden;
    position: absolute;
    top: -500vh;
    width: 1px;
    z-index: -1
}

.no-feedback devsite-feedback {
    display: none!important
}

.preserve-case {
    text-transform: none
}

a.external:after,a[href*="man7.org"]:after,a[href*="oracle.com"]:after {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    content: "open_in_new";
    content: "open_in_new"/"";
    font-size: 18px;
    margin-block:0;margin-inline:4px 0;vertical-align: text-bottom
}

[dir=rtl] a.external:after,[dir=rtl] a[href*="man7.org"]:after,[dir=rtl] a[href*="oracle.com"]:after {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1)
}

a.download:before {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    content: "file_download";
    display: inline-block;
    font-size: 18px;
    margin-block:0;margin-inline:0 4px;vertical-align: text-bottom
}

devsite-content {
    counter-reset: numbered-h2 numbered-h3
}

h2.numbered {
    line-height: 48px;
    margin-top: 60px;
    padding-bottom: 19px
}

h2.numbered~h3.numbered {
    line-height: 40px
}

h2.numbered:before,h2.numbered~h3.numbered:before {
    background: var(--devsite-tertiary-text-color);
    color: var(--devsite-inverted-text-color);
    display: inline-block;
    margin-block:0;text-align: center
}

h2.numbered:before {
    border-radius: 24px;
    content: counter(numbered-h2);
    counter-increment: numbered-h2;
    counter-set: numbered-h3 0;
    height: 48px;
    line-height: 48px;
    margin-inline:0 20px;width: 48px
}

h2.numbered~h3.numbered:before {
    border-radius: 20px;
    content: counter(numbered-h2) "." counter(numbered-h3);
    counter-increment: numbered-h3;
    height: 40px;
    line-height: 40px;
    margin-inline:0 16px;min-width: 40px;
    padding-inline:4px}

.compare-better,.compare-no,.compare-worse,.compare-yes {
    font-weight: 700
}

.compare-better:before,.compare-blank:before,.compare-no:before,.compare-worse:before,.compare-yes:before {
    content: "";
    display: inline-block;
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    word-wrap: normal;
    margin-block:-4px 0;margin-inline:0 4px;text-transform: none;
    vertical-align: middle;
    width: 24px
}

.compare-better:before,.compare-yes:before {
    color: var(--devsite-compare-yes-color)
}

.compare-no:before,.compare-worse:before {
    color: var(--devsite-compare-no-color)
}

.compare-better:before {
    content: "thumb_up"
}

.compare-no:before {
    content: "not_interested"
}

.compare-worse:before {
    content: "thumb_down"
}

.compare-yes:before {
    content: "check"
}

.color-scheme--dark img:not([src$=".svg"]).add-background {
    background: #5f6368
}

.color-scheme--dark img[src$=".svg"].add-background {
    background: #bdc1c6
}

.color-scheme--dark img:not([src$=".svg"]).add-light-background {
    background: #f1f3f4
}

.align-center {
    text-align: center
}

.align-right {
    text-align: right
}

.hanging-indent,.members.function td:first-child {
    -webkit-padding-start: 25px;
    -moz-padding-start: 25px;
    padding-inline-start:25px;text-indent: -17px
}

.bad-table {
    table-layout: fixed
}

.bad-table td,.bad-table tr {
    word-wrap: break-word
}

.bad-table pre {
    word-wrap: normal
}

.screenshot {
    border: var(--devsite-secondary-border);
    padding: 3px
}

.columns td,.columns th,.columns tr {
    background: 0;
    border: 0;
    font: 16px/24px var(--devsite-primary-font-family);
    padding-block:0}

.columns tr {
    padding-inline:0}

.columns td,.columns th {
    padding-inline:0 20px}

.columns th {
    color: var(--devsite-primary-text-color);
    font-weight: 500
}

.columns code,.columns pre {
    background: var(--devsite-background-3)
}

.inline:not(.expandable) {
    display: inline
}

.inline-block {
    display: inline-block
}

.block {
    display: block
}

img.inline-icon {
    height: 1.2em;
    vertical-align: sub
}

.no-select {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.wrap-code {
    white-space: normal
}

.attempt-left,.attempt-right,aside.attempt-left,aside.attempt-right {
    max-width: calc(50% - 20px)
}

.attempt-left,.video-wrapper-left,aside.attempt-left {
    margin-block:0 40px;margin-inline:0 40px}

[dir=ltr] .attempt-left,[dir=ltr] .video-wrapper-left,[dir=ltr] aside.attempt-left {
    float: left
}

[dir=rtl] .attempt-left,[dir=rtl] .video-wrapper-left,[dir=rtl] aside.attempt-left {
    float: right
}

.attempt-right,.video-wrapper,aside.attempt-right {
    margin-block:0 40px;margin-inline:40px 0}

[dir=ltr] .attempt-right,[dir=ltr] .video-wrapper,[dir=ltr] aside.attempt-right {
    float: right
}

[dir=rtl] .attempt-right,[dir=rtl] .video-wrapper,[dir=rtl] aside.attempt-right {
    float: left
}

.clear {
    clear: both
}

.attempt-left+.attempt-right,.attempt-left+.video-wrapper,.video-wrapper-left+.attempt-right,.video-wrapper-left+.video-wrapper {
    margin-inline:0}

.video-wrapper,.video-wrapper-full-width {
    overflow: hidden;
    position: relative
}

.video-wrapper,.video-wrapper-left {
    width: calc(50% - 20px)
}

.video-wrapper-full-width {
    margin: 16px 0;
    width: 100%
}

.video-wrapper embed,.video-wrapper iframe,.video-wrapper object,.video-wrapper-full-width embed,.video-wrapper-full-width iframe,.video-wrapper-full-width object,.video-wrapper-left embed,.video-wrapper-left iframe,.video-wrapper-left object {
    height: 101%;
    left: -.5%;
    position: absolute;
    top: -.5%;
    width: 101%
}

@media screen and (max-width: 840px) {
    .attempt-left,.attempt-right,aside.attempt-left,aside.attempt-right {
        display:block;
        max-width: 100%
    }

    .attempt-left,.attempt-right,.video-wrapper,.video-wrapper-left,aside.attempt-left,aside.attempt-right {
        float: none;
        margin: 16px 0;
        width: 100%
    }
}

body[pending] #gc-wrapper {
    margin-top: 0!important
}

body[ready] #gc-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 0;
    -moz-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-margin-after: var(--devsite-cookie-bar-height,0);
    margin-block-end:var(--devsite-cookie-bar-height,0)}

.devsite-wrapper {
    min-height: 100vh
}

body[ready] .devsite-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: 100%
}

.full-bleed {
    margin: 0;
    padding: 0
}

.devsite-book-nav-bg,devsite-book-nav {
    width: 269px
}

body[pending] devsite-book-nav {
    position: absolute
}

@media screen and (max-width: 840px) {
    body[devsite-book-nav--open] {
        overflow:hidden
    }

    body[devsite-book-nav--open] devsite-book-nav[fixed] {
        -webkit-transform: translateX(0)!important;
        transform: translateX(0)!important
    }
}

.devsite-sidebar {
    grid-column: 3;
    grid-row: 1;
    min-width: 0;
    width: auto
}

[has-sidebar] .devsite-sidebar {
    margin: 24px 0 0;
    -webkit-margin-end: 24px;
    -moz-margin-end: 24px;
    margin-inline-end:24px;-webkit-margin-start: -8px;
    -moz-margin-start: -8px;
    margin-inline-start:-8px}

.devsite-sidebar[fixed] .devsite-sidebar-content {
    background-color: var(--devsite-body-background,var(--devsite-background-0));
    contain: content;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-height: var(--devsite-js-sidebar-max-height);
    max-width: var(--devsite-js-sidebar-max-width);
    -webkit-padding-start: 8px;
    -moz-padding-start: 8px;
    padding-inline-start:8px;position: fixed;
    -webkit-transform: translate3d(0,var(--devsite-js-sidebar-offset),0);
    transform: translate3d(0,var(--devsite-js-sidebar-offset),0)
}

.devsite-sidebar devsite-toc.devsite-toc,.devsite-sidebar devsite-toc>.devsite-nav-list {
    width: auto
}

[concierge=open] .devsite-sidebar {
    display: none
}

devsite-recommendations-sidebar.recommendations-rendered {
    margin-top: 20px
}

body devsite-toc>.devsite-nav-list {
    width: auto
}

.devsite-main-content {
    margin: 0 auto;
    max-width: var(--devsite-main-content-max-width);
    padding: var(--devsite-main-content-padding);
    position: relative;
    width: 100%
}

#contain-402 {
    z-index: 1004!important
}

body[pending] .devsite-main-content {
    min-height: calc(100vh - 456px)
}

body[ready] .devsite-main-content {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    min-height: auto
}

body[layout=docs] .devsite-main-content {
    display: grid;
    grid-gap: 24px;
    grid-template-columns: 1fr minmax(752px,936px) 1fr;
    grid-template-rows: 1fr
}

body[layout=docs] .devsite-main-content[has-sidebar] {
    grid-template-columns: 1fr minmax(752px,936px) minmax(160px,1fr)
}

body[layout=docs] .devsite-main-content[has-book-nav] {
    grid-template-columns: minmax(269px,1fr) minmax(752px,936px) 1fr
}

body[layout=docs][concierge] .devsite-main-content {
    grid-template-columns: 1fr minmax(365px,1072px) 1fr
}

body[layout=docs][concierge] .devsite-main-content[has-book-nav],body[layout=docs][concierge] .devsite-main-content[has-book-nav][has-sidebar] {
    grid-template-columns: minmax(269px,1fr) minmax(365px,1072px) 1fr
}

body[layout=docs] .devsite-main-content[has-book-nav][has-sidebar] {
    grid-template-columns: minmax(269px,1fr) minmax(752px,936px) minmax(160px,1fr)
}

.devsite-main-content[has-book-nav]~.devsite-footer,.devsite-main-content[has-book-nav]~devsite-footer-promos,.devsite-main-content[has-book-nav]~devsite-footer-utility {
    margin-block:0;margin-inline:269px 0}

@media screen and (max-width: 1253px) {
    body[layout=docs] .devsite-main-content[has-sidebar] {
        grid-template-columns:1fr minmax(752px,936px) 1fr
    }

    body[layout=docs] .devsite-main-content[has-book-nav],body[layout=docs] .devsite-main-content[has-book-nav][has-sidebar] {
        grid-template-columns: 269px 1fr 0
    }

    [layout][concierge=closed],[layout][concierge] {
        --devsite-concierge-width: var(--devsite-concierge-width-closed,0px)
    }

    [layout][concierge=open] {
        --devsite-concierge-width: var(--devsite-concierge-width-open,0px)
    }

    [layout][concierge=hide] {
        --devsite-concierge-width: 0px
    }

    .devsite-sidebar {
        display: none
    }
}

@media screen and (max-width: 840px) {
    body[layout=docs] .devsite-main-content {
        display:block;
        min-width: 100%
    }

    devsite-content-footer {
        padding: 0 24px
    }

    .devsite-main-content[has-book-nav]~.devsite-footer,.devsite-main-content[has-book-nav]~devsite-footer-promos,.devsite-main-content[has-book-nav]~devsite-footer-utility {
        margin-inline:0}
}

@media screen and (max-width: 600px) {
    devsite-content-footer {
        padding:0 16px
    }
}

.devsite-icon:before,::part(material-icon) {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal
}

.devsite-icon-arrow-drop-down:before {
    content: "arrow_drop_down"
}

.devsite-icon-close:before {
    content: "close"
}

.devsite-icon-code:before {
    content: "code"
}

.devsite-icon-code-dark:before,.devsite-icon-code-light:before {
    content: "brightness_medium"
}

.devsite-icon-copy:before {
    content: "content_copy"
}

.devsite-icon-edit:before {
    content: "edit"
}

.devsite-icon-terminal:before {
    content: "terminal"
}

.devsite-actions {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: 8px;
    padding-inline:8px}

.beta,.caution,.deprecated,.dogfood,.experimental,.key-point,.key-term,.note,.objective,.preview,.special,.success,.tip,.warning,aside {
    border-top: 1px solid var(--devsite-notice-border-color,transparent);
    border-bottom: 1px solid var(--devsite-notice-border-color,transparent);
    border-radius: var(--devsite-notice-border-radius,0);
    display: block;
    font-size: 14px;
    margin: var(--devsite-notice-margin);
    padding-block:var(--devsite-notice-padding-block);padding-inline: var(--devsite-notice-padding-inline)
}

.beta :link,.beta :visited,.caution :link,.caution :visited,.deprecated :link,.deprecated :visited,.dogfood :link,.dogfood :visited,.experimental :link,.experimental :visited,.key-point :link,.key-point :visited,.key-term :link,.key-term :visited,.note :link,.note :visited,.objective :link,.objective :visited,.preview :link,.preview :visited,.special :link,.special :visited,.success :link,.success :visited,.tip :link,.tip :visited,.warning :link,.warning :visited,aside :link,aside :visited {
    text-decoration: underline
}

.beta a:focus,.beta a:hover,.caution a:focus,.caution a:hover,.deprecated a:focus,.deprecated a:hover,.dogfood a:focus,.dogfood a:hover,.experimental a:focus,.experimental a:hover,.key-point a:focus,.key-point a:hover,.key-term a:focus,.key-term a:hover,.note a:focus,.note a:hover,.objective a:focus,.objective a:hover,.preview a:focus,.preview a:hover,.special a:focus,.special a:hover,.success a:focus,.success a:hover,.tip a:focus,.tip a:hover,.warning a:focus,.warning a:hover,aside a:focus,aside a:hover {
    border-radius: 2px;
    margin: -4px;
    padding: 4px;
    text-decoration: none
}

.beta pre,.caution pre,.deprecated pre,.dogfood pre,.experimental pre,.key-point pre,.key-term pre,.note pre,.objective pre,.preview pre,.special pre,.success pre,.tip pre,.warning pre,aside pre {
    background: hsla(0,0%,100%,.75)
}

.beta code,.caution code,.deprecated code,.dogfood code,.experimental code,.key-point code,.key-term code,.note code,.objective code,.preview code,.special code,.success code,.tip code,.warning code,aside code {
    border: 0;
    font-weight: 700;
    padding: 0
}

.beta:before,.caution:before,.deprecated:before,.dogfood:before,.experimental:before,.key-point:before,.key-term:before,.note:before,.objective:before,.preview:before,.special:before,.success:before,.tip:before,.warning:before,aside:before {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    margin-block:0;margin-inline:-36px 0}

[dir=ltr] .beta:before,[dir=ltr] .caution:before,[dir=ltr] .deprecated:before,[dir=ltr] .dogfood:before,[dir=ltr] .experimental:before,[dir=ltr] .key-point:before,[dir=ltr] .key-term:before,[dir=ltr] .note:before,[dir=ltr] .objective:before,[dir=ltr] .preview:before,[dir=ltr] .special:before,[dir=ltr] .success:before,[dir=ltr] .tip:before,[dir=ltr] .warning:before,[dir=ltr] aside:before {
    float: left
}

[dir=rtl] .beta:before,[dir=rtl] .caution:before,[dir=rtl] .deprecated:before,[dir=rtl] .dogfood:before,[dir=rtl] .experimental:before,[dir=rtl] .key-point:before,[dir=rtl] .key-term:before,[dir=rtl] .note:before,[dir=rtl] .objective:before,[dir=rtl] .preview:before,[dir=rtl] .special:before,[dir=rtl] .success:before,[dir=rtl] .tip:before,[dir=rtl] .warning:before,[dir=rtl] aside:before {
    float: right
}

aside var {
    background: inherit;
    font-weight: 700;
    padding: 0
}

.beta,.experimental,.note,.preview,.special,.tip,aside {
    background: var(--devsite-note-notice-background);
    border-color: var(--devsite-note-notice-border-color);
    color: var(--devsite-note-notice-color)
}

.beta :link,.beta :link code,.beta :visited,.beta :visited code,.beta code,.experimental :link,.experimental :link code,.experimental :visited,.experimental :visited code,.experimental code,.note :link,.note :link code,.note :visited,.note :visited code,.note code,.preview :link,.preview :link code,.preview :visited,.preview :visited code,.preview code,.special :link,.special :link code,.special :visited,.special :visited code,.special code,.tip :link,.tip :link code,.tip :visited,.tip :visited code,.tip code,aside :link,aside :link code,aside :visited,aside :visited code,aside code {
    background: var(--devsite-note-notice-background);
    border-color: var(--devsite-note-notice-border-color);
    color: var(--devsite-note-notice-color)
}

.note:before,.special:before,.tip:before,aside:before {
    content: "star";
    content: "star"/""
}

.beta:before,.experimental:before,.preview:before {
    content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><path d='M20.21,17.64l-6.15-8.22V5.57h2.57V3H6.35v2.57h2.57v3.86l-6.3,8.4c-0.44,0.6-0.5,1.41-0.15,2.08C2.8,20.58,3.49,21,4.24,21h14.5c1.11,0,2.01-0.9,2.01-2.01C20.75,18.48,20.53,18,20.21,17.64z' fill='%2301579b'/></svg>")
}

.caution {
    background: var(--devsite-caution-notice-background);
    border-color: var(--devsite-caution-notice-border-color);
    color: var(--devsite-caution-notice-color)
}

.caution :link,.caution :link code,.caution :visited,.caution :visited code,.caution code {
    background: var(--devsite-caution-notice-background);
    border-color: var(--devsite-caution-notice-border-color);
    color: var(--devsite-caution-notice-color)
}

.caution:before {
    content: "error"
}

.deprecated {
    background: var(--devsite-status-notice-background);
    border-color: var(--devsite-status-notice-border-color);
    color: var(--devsite-status-notice-color)
}

.deprecated :link,.deprecated :link code,.deprecated :visited,.deprecated :visited code,.deprecated code {
    background: var(--devsite-status-notice-background);
    border-color: var(--devsite-status-notice-border-color);
    color: var(--devsite-status-notice-color)
}

.deprecated:before {
    content: "not_interested"
}

.dogfood {
    background: var(--devsite-status-notice-background);
    border-color: var(--devsite-status-notice-border-color);
    color: var(--devsite-status-notice-color)
}

.dogfood :link,.dogfood :link code,.dogfood :visited,.dogfood :visited code,.dogfood code {
    background: var(--devsite-status-notice-background);
    border-color: var(--devsite-status-notice-border-color);
    color: var(--devsite-status-notice-color)
}

.dogfood:before {
    content: "pets"
}

.key-point {
    background: var(--devsite-key-point-notice-background);
    border-color: var(--devsite-key-point-notice-border-color);
    color: var(--devsite-key-point-notice-color)
}

.key-point :link,.key-point :link code,.key-point :visited,.key-point :visited code,.key-point code {
    background: var(--devsite-key-point-notice-background);
    border-color: var(--devsite-key-point-notice-border-color);
    color: var(--devsite-key-point-notice-color)
}

.key-point:before {
    content: "lightbulb_outline"
}

.key-term {
    background: var(--devsite-key-term-notice-background);
    border-color: var(--devsite-key-term-notice-border-color);
    color: var(--devsite-key-term-notice-color)
}

.key-term :link,.key-term :link code,.key-term :visited,.key-term :visited code,.key-term code {
    background: var(--devsite-key-term-notice-background);
    border-color: var(--devsite-key-term-notice-border-color);
    color: var(--devsite-key-term-notice-color)
}

.key-term:before {
    content: "font_download"
}

.objective {
    background: var(--devsite-success-notice-background);
    border-color: var(--devsite-success-notice-border-color);
    color: var(--devsite-success-notice-color)
}

.objective :link,.objective :link code,.objective :visited,.objective :visited code,.objective code {
    background: var(--devsite-success-notice-background);
    border-color: var(--devsite-success-notice-border-color);
    color: var(--devsite-success-notice-color)
}

.objective:before {
    content: "school"
}

.success {
    background: var(--devsite-success-notice-background);
    border-color: var(--devsite-success-notice-border-color);
    color: var(--devsite-success-notice-color)
}

.success :link,.success :link code,.success :visited,.success :visited code,.success code {
    background: var(--devsite-success-notice-background);
    border-color: var(--devsite-success-notice-border-color);
    color: var(--devsite-success-notice-color)
}

.success:before {
    content: "check_circle"
}

.warning {
    background: var(--devsite-warning-notice-background);
    border-color: var(--devsite-warning-notice-border-color);
    color: var(--devsite-warning-notice-color)
}

.warning :link,.warning :link code,.warning :visited,.warning :visited code,.warning code {
    background: var(--devsite-warning-notice-background);
    border-color: var(--devsite-warning-notice-border-color);
    color: var(--devsite-warning-notice-color)
}

.warning:before {
    content: "warning"
}

.beta :focus code,.beta :hover code,.caution :focus code,.caution :hover code,.deprecated :focus code,.deprecated :hover code,.dogfood :focus code,.dogfood :hover code,.experimental :focus code,.experimental :hover code,.key-point :focus code,.key-point :hover code,.key-term :focus code,.key-term :hover code,.note :focus code,.note :hover code,.objective :focus code,.objective :hover code,.preview :focus code,.preview :hover code,.special :focus code,.special :hover code,.success :focus code,.success :hover code,.tip :focus code,.tip :hover code,.warning :focus code,.warning :hover code,aside :focus code,aside :hover code {
    background: transparent
}

.caution a:focus,.caution a:hover {
    background-color: var(--devsite-caution-notice-link-background-hover,var(--devsite-background-2))
}

.key-point a:focus,.key-point a:hover {
    background-color: var(--devsite-key-point-notice-link-background-hover,var(--devsite-background-2))
}

.key-term a:focus,.key-term a:hover {
    background-color: var(--devsite-key-term-notice-link-background-hover,var(--devsite-background-2))
}

.note a:focus,.note a:hover {
    background-color: var(--devsite-note-notice-link-background-hover,var(--devsite-background-2))
}

.status a:focus,.status a:hover {
    background-color: var(--devsite-status-notice-link-background-hover,var(--devsite-background-2))
}

.success a:focus,.success a:hover {
    background-color: var(--devsite-success-notice-link-background-hover,var(--devsite-background-2))
}

.warning a:focus,.warning a:hover {
    background-color: var(--devsite-warning-notice-link-background-hover,var(--devsite-background-2))
}

.aside a:focus,.aside a:hover,.beta a:focus,.beta a:hover,.experimental a:focus,.experimental a:hover,.note a:focus,.note a:hover,.preview a:focus,.preview a:hover,.special a:focus,.special a:hover,.tip a:focus,.tip a:hover {
    background-color: var(--devsite-note-notice-link-background-hover,var(--devsite-background-2))
}

.deprecated a:focus,.deprecated a:hover,.dogfood a:focus,.dogfood a:hover {
    background-color: var(--devsite-status-notice-link-background-hover,var(--devsite-background-2))
}

.objective a:focus,.objective a:hover {
    background-color: var(--devsite-success-notice-link-background-hover,var(--devsite-background-2))
}

.devsite-no-page-title>.beta:first-child,.devsite-no-page-title>.caution:first-child,.devsite-no-page-title>.deprecated:first-child,.devsite-no-page-title>.dogfood:first-child,.devsite-no-page-title>.experimental:first-child,.devsite-no-page-title>.key-point:first-child,.devsite-no-page-title>.key-term:first-child,.devsite-no-page-title>.note:first-child,.devsite-no-page-title>.objective:first-child,.devsite-no-page-title>.preview:first-child,.devsite-no-page-title>.special:first-child,.devsite-no-page-title>.success:first-child,.devsite-no-page-title>.tip:first-child,.devsite-no-page-title>.warning:first-child,.devsite-no-page-title>aside:first-child {
    clear: right
}

.devsite-banner {
    border-bottom: 1px solid var(--devsite-banner-border-color,transparent);
    font: var(--devsite-banner-font,inherit);
    font-size: var(--devsite-banner-font-size,14px);
    letter-spacing: var(--devsite-banner-letter-spacing,normal);
    margin: var(--devsite-banner-margin)
}

.devsite-banner :link:not(.button,.cloud-select-dropdown__item-link),.devsite-banner :visited:not(.button,.cloud-select-dropdown__item-link) {
    text-decoration: underline
}

.devsite-banner-message {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: var(--devsite-banner-message-justify-content,normal);
    -webkit-justify-content: var(--devsite-banner-message-justify-content,normal);
    -moz-box-pack: var(--devsite-banner-message-justify-content,normal);
    -ms-flex-pack: var(--devsite-banner-message-justify-content,normal);
    justify-content: var(--devsite-banner-message-justify-content,normal);
    margin: 0 auto;
    max-width: var(--devsite-banner-message-max-width,1488px);
    padding: var(--devsite-banner-message-padding)
}

.devsite-banner-message-text {
    -webkit-margin-end: var(--devsite-banner-message-text-margin-x-end,auto);
    -moz-margin-end: var(--devsite-banner-message-text-margin-x-end,auto);
    margin-inline-end:var(--devsite-banner-message-text-margin-x-end,auto)}

.devsite-banner a: not(.button,.cloud-select-dropdown__item-link):focus,.devsite-banner[background] a:not(.button,.cloud-select-dropdown__item-link):focus {
    background:var(--devsite-inverted-text-rgba);
    border-radius: 2px;
    margin: -4px;
    padding: 4px;
    text-decoration: none
}

.devsite-banner[background=white] {
    border-bottom: var(--devsite-primary-border)
}

.devsite-banner-announcement,.devsite-banner-announcement :link:not(.button,.cloud-select-dropdown__item-link),.devsite-banner-announcement :visited:not(.button,.cloud-select-dropdown__item-link) {
    background: var(--devsite-banner-background,var(--devsite-note-notice-background));
    border-color: var(--devsite-banner-border-color,var(--devsite-note-notice-border-color));
    color: var(--devsite-banner-color,var(--devsite-note-notice-color))
}

[layout=docs] .devsite-banner:first-of-type {
    border-radius: var(--devsite-banner-border-radius,0)
}

.devsite-banner-announcement[background] :link:not(.button,.cloud-select-dropdown__item-link),.devsite-banner-announcement[background] :visited:not(.button,.cloud-select-dropdown__item-link) {
    background: 0
}

.devsite-banner-confidential .devsite-banner-message:before,.devsite-banner-page-archived .devsite-banner-message:before,.devsite-banner-page-deprecated .devsite-banner-message:before,.devsite-banner-project-archived .devsite-banner-message:before,.devsite-banner-project-deprecated .devsite-banner-message:before {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    -webkit-margin-end: 16px;
    -moz-margin-end: 16px;
    margin-inline-end:16px}

.devsite-banner-page-archived,.devsite-banner-project-archived {
    background: var(--devsite-banner-archived-background);
    color: var(--devsite-banner-archived-color)
}

.devsite-banner-page-archived .devsite-banner-message:before,.devsite-banner-project-archived .devsite-banner-message:before {
    content: "archive"
}

.devsite-banner-confidential {
    background: var(--devsite-banner-confidential-background);
    color: var(--devsite-banner-confidential-color)
}

.devsite-banner-confidential .devsite-banner-message:before {
    content: "lock"
}

.devsite-banner-page-deprecated,.devsite-banner-project-deprecated {
    background: var(--devsite-banner-deprecated-background);
    color: var(--devsite-banner-deprecated-color)
}

.devsite-banner-page-deprecated .devsite-banner-message:before,.devsite-banner-project-deprecated .devsite-banner-message:before {
    content: "error"
}

.devsite-banner-translated {
    background: var(--devsite-background-3);
    border-color: var(--devsite-translated-notice-border-color,transparent);
    color: var(--devsite-secondary-text-rgba)
}

.devsite-banner-translated :link {
    text-decoration: none
}

.devsite-banner .button,.devsite-banner button,.devsite-banner devsite-switch-to-english-button {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin: -6px 0;
    text-decoration: none
}

.devsite-banner .button:not(:first-child),.devsite-banner button:not(:first-child),.devsite-banner devsite-switch-to-english-button:not(:first-child) {
    -webkit-margin-start: 16px;
    -moz-margin-start: 16px;
    margin-inline-start:16px}

.devsite-banner .material-icons {
    margin: -2px 0;
    vertical-align: middle
}

.devsite-banner-translated-image {
    margin: 4px 0 -4px;
    -webkit-margin-end: 24px;
    -moz-margin-end: 24px;
    margin-inline-end:24px;width: 122px
}

.devsite-banner-heading {
    font-weight: 700
}

@media screen and (max-width: 1253px) {
    .devsite-banner-translated .devsite-banner-translated-text {
        display:block
    }
}

@media screen and (max-width: 840px) {
    [layout=docs] .devsite-banner-announcement {
        border-radius:0
    }
}

@media screen and (max-width: 600px) {
    [layout][template] .devsite-banner-message {
        display:block
    }

    .devsite-banner .button,.devsite-banner button {
        margin: 12px 0 0;
        -webkit-margin-start: 0;
        -moz-margin-start: 0;
        margin-inline-start:0}
}

[items-across="1"] {
    --devsite-columns: 1
}

[items-across="2"] {
    --devsite-columns: 2
}

[items-across="3"] {
    --devsite-columns: 3
}

[items-across="4"] {
    --devsite-columns: 4
}

.devsite-card-group {
    display: grid;
    gap: var(--devsite-landing-row-item-gap,24px);
    grid: auto-flow/repeat(var(--devsite-columns,3),1fr)
}

.devsite-card-wrapper {
    min-width: 0
}

.devsite-card-wrapper[hidden] {
    display: none
}

.devsite-card h3 {
    font: var(--devsite-card-heading-font,var(--devsite-h2-font));
    letter-spacing: var(--devsite-h2-letter-spacing);
    margin: 0 0 10px
}

.devsite-card {
    background: var(--devsite-card-background);
    border: var(--devsite-card-border);
    border-radius: var(--devsite-card-border-radius);
    box-shadow: var(--devsite-card-box-shadow);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    position: relative;
    -webkit-transition: var(--devsite-card-transition,0);
    transition: var(--devsite-card-transition,0)
}

.devsite-card-image {
    border-radius: var(--devsite-card-image-border-radius);
    height: 100%;
    object-fit: var(--devsite-card-image-object-fit,cover);
    position: absolute;
    width: 100%
}

.devsite-card-image-container {
    background-image: var(--devsite-card-default-image,url(../images/dynamic-content-card-default.png));
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    border-bottom: var(--devsite-card-image-container-border-bottom,0);
    border-radius: var(--devsite-card-image-container-border-radius);
    padding: 0 0 56.25%
}

.devsite-card-image-no-background {
    background-image: none!important;
    overflow: hidden;
    position: relative
}

.devsite-card-content-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 0;
    -moz-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.devsite-card-buttons,.devsite-card-content,.devsite-card-skill {
    padding: var(--devsite-card-content-padding,16px)
}

.devsite-card-content {
    -webkit-box-flex: var(--devsite-card-content-flex,1 0);
    -webkit-flex: var(--devsite-card-content-flex,1 0);
    -moz-box-flex: var(--devsite-card-content-flex,1 0);
    -ms-flex: var(--devsite-card-content-flex,1 0);
    flex: var(--devsite-card-content-flex,1 0);
    word-break: break-word
}

.devsite-card-summary {
    color: var(--devsite-card-summary-color,inherit);
    font: var(--devsite-card-summary-font,400 16px/24px var(--devsite-primary-font-family));
    margin: var(--devsite-card-summary-margin,16px 0 0)
}

.devsite-card-attribution {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-top: var(--devsite-card-attribution-border,var(--devsite-primary-border));
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    color: var(--devsite-card-attribution-color,inherit);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: var(--devsite-card-attribution-font-size,12px);
    font-weight: var(--devsite-card-attribution-font-weight,normal);
    gap: 0 16px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    line-height: var(--devsite-card-attribution-line-height,16px);
    margin: var(--devsite-card-attribution-margin,0);
    min-height: var(--devsite-card-attribution-min-height,40px);
    padding: var(--devsite-card-attribution-padding,16px);
    position: relative
}

.devsite-card-icon-container {
    color: var(--devsite-secondary-text-color);
    display: grid;
    height: 32px;
    place-content: center;
    width: 32px
}

.devsite-card-icon-container[background] {
    background-color: var(--devsite-background-color);
    border-radius: 50%;
    overflow: hidden
}

.devsite-card-attribution-text-container {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: end
}

.devsite-card-icon-image {
    height: 32px
}

.devsite-card-icon.material-icons {
    color: var(--devsite-foreground-color);
    font-size: 32px
}

.devsite-card-icon-container[background] .devsite-card-icon {
    font-size: 24px
}

.devsite-card-attribution-author,.devsite-card-attribution-date,.devsite-card-attribution-name,.devsite-card-date,.devsite-card-duration {
    margin: 0
}

.devsite-card-attribution-author+.devsite-card-attribution-date,.devsite-card-attribution-name+.devsite-card-attribution-author {
    margin-top: 8px
}

.devsite-card-section {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.devsite-card-attribution+.devsite-card-buttons,.devsite-card-content+.devsite-card-buttons,.devsite-card-content+.devsite-card-section .activity-card-icons,.devsite-card-content+.devsite-card-section .devsite-card-buttons,.devsite-card-content+.devsite-card-skill,.devsite-card-skill+.devsite-card-attribution,.devsite-card-skill+.devsite-card-buttons {
    padding-top: 0
}

.devsite-card-date,.devsite-card-duration {
    color: var(--devsite-card-date-color,var(--devsite-secondary-text-color));
    font: var(--devsite-card-date-font,400 12px/16px var(--devsite-primary-font-family));
    letter-spacing: var(--devsite-card-date-letter-spacing,.3px)
}

.devsite-card-icons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 12px;
    padding: 12px
}

.devsite-card-icon {
    height: 32px;
    width: 32px
}

.devsite-card-api-references {
    list-style: none;
    padding: 0
}

.devsite-card-api-references {
    color: var(--devsite-card-api-references-color,var(--devsite-secondary-text-color));
    font-size: 14px;
    line-height: 18px;
    margin-top: 12px
}

.devsite-card-api-references-item {
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.devsite-card-skill {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-card-skill-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font: var(--devsite-card-skill-font,14px/20px var(--devsite-primary-font-family));
    -webkit-box-pack: var(--devsite-card-skill-justify-content);
    -webkit-justify-content: var(--devsite-card-skill-justify-content);
    -moz-box-pack: var(--devsite-card-skill-justify-content);
    -ms-flex-pack: var(--devsite-card-skill-justify-content);
    justify-content: var(--devsite-card-skill-justify-content)
}

.devsite-card-skill-icon {
    height: 24px;
    margin: var(--devsite-card-skill-icon-margin,0 4px 0 -6px);
    width: 24px
}

.devsite-card-skill-icon-filled {
    fill: currentColor
}

.devsite-card-skill-icon-unfilled {
    fill: var(--devsite-background-5)
}

.devsite-card-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -moz-box-orient: horizontal;
    -moz-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    margin: auto 0 0
}

[template=activity] .devsite-card h3 {
    margin-bottom: 4px
}

.devsite-card-list {
    border: var(--devsite-card-border);
    border-radius: var(--devsite-card-border-radius);
    list-style: none;
    overflow: var(--devsite-card-list-overflow,visible);
    padding: 0
}

.devsite-card-list-item {
    border: var(--devsite-card-list-item-border,0);
    border-radius: var(--devsite-card-list-item-border-radius,2px);
    box-shadow: var(--devsite-card-box-shadow,0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color));
    margin: var(--devsite-card-list-item-margin,0 0 20px)
}

.devsite-card-list-item:not(:last-child) {
    border-bottom: var(--devsite-card-list-item-border,var(--devsite-card-border,0))
}

.devsite-card-list-item:last-child {
    border-bottom: var(--devsite-card-list-item-border,0);
    margin: 0
}

.devsite-card-list-link {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-card-list-link-color,var(--devsite-link-color));
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font: var(--devsite-card-list-link-font,var(--devsite-h2-font));
    letter-spacing: var(--devsite-h2-letter-spacing);
    padding: var(--devsite-card-list-link-padding,16px 20px);
    -webkit-transition: background .2s,color .2s;
    transition: background .2s,color .2s;
    width: 100%
}

.devsite-card-list-link:focus,.devsite-card-list-link:hover {
    background: var(--devsite-card-list-link-background-hover,var(--devsite-link-background-hover));
    color: var(--devsite-card-list-link-color-hover,var(--devsite-link-color));
    text-decoration: none
}

.devsite-card-list-link:after {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    content: "arrow_forward";
    margin-left: auto;
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
    -webkit-transition: opacity .2s,-webkit-transform .2s;
    transition: opacity .2s,-webkit-transform .2s;
    transition: opacity .2s,transform .2s;
    transition: opacity .2s,transform .2s,-webkit-transform .2s
}

.devsite-card-list-link:focus:after,.devsite-card-list-link:hover:after {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

@media screen and (max-width: 840px) {
    .devsite-card-group,[items-across="3"],[items-across="4"] {
        --devsite-columns:2
    }
}

@media screen and (max-width: 600px) {
    .devsite-card-group {
        display:block
    }

    .devsite-card-wrapper:not(:first-of-type) {
        margin-top: 16px
    }

    .devsite-card-summary {
        font-size: 14px;
        line-height: 20px;
        max-height: 80px
    }
}

.pre-style,code,pre {
    background: var(--devsite-code-background);
    color: var(--devsite-code-color);
    direction: ltr!important;
    font: 400 100%/1em var(--devsite-code-font-family);
    padding: var(--devsite-inline-code-padding,1px 4px);
    text-align: left!important
}

code {
    border: var(--devsite-inline-code-border,0);
    border-radius: var(--devsite-inline-code-border-radius,0);
    font: 500 90%/1em var(--devsite-code-font-family);
    word-break: break-word
}

.pre-style code,pre code,table code {
    font-weight: 400;
    word-break: normal
}

.pre-style,pre {
    font: 14px/20px var(--devsite-code-font-family);
    margin: 16px 0;
    overflow-x: auto;
    padding: 24px;
    position: relative
}

.pre-style code,pre code {
    background: 0;
    border: var(--devsite-inline-nested-code-border,0);
    font-size: 14px;
    padding: 0
}

b code,strong code {
    font-weight: 700
}

cite code,em code,i code {
    font-style: italic
}

pre.devsite-code-highlight>code>span,pre.devsite-code-highlight>span {
    -webkit-filter: grayscale(1);
    filter: grayscale(1)
}

td>pre:only-child {
    padding: 0
}

td>devsite-code pre.inline-code,td>devsite-code:only-child pre,td>div:first-child:empty+devsite-code:last-child pre {
    padding: 0 64px 0 0
}

td>devsite-code pre.inline-code,td>devsite-code:not([dark-code]):only-child pre,td>div:first-child:empty+devsite-code:not([dark-code]):last-child pre {
    background: 0
}

td>devsite-code pre.inline-code~.devsite-code-buttons-container,td>devsite-code:only-child pre~.devsite-code-buttons-container,td>div:first-child:empty+devsite-code:last-child pre~.devsite-code-buttons-container {
    top: -6px
}

h1 code,h2 code,h3 code,h4 code,h5 code,h6 code {
    background: 0;
    color: var(--devsite-primary-text-color);
    padding: 0
}

h1 code {
    color: #80868b
}

:link code,:visited code,code :link,code :visited,pre :link,pre :visited,td :link code,td :visited code,td code :link,td code :visited {
    color: var(--devsite-contrast-link-color)
}

body[layout] .devsite-main-content var span,var,var code {
    color: var(--devsite-var-color);
    -moz-osx-font-smoothing: auto;
    -webkit-font-smoothing: auto;
    font-weight: 500
}

pre.clear-for-copy {
    all: initial;
    left: -100vw;
    position: absolute;
    top: -100vh;
    white-space: pre
}

pre.clear-for-copy * {
    all: unset;
    font-family: var(--devsite-code-font-family);
    white-space: pre
}

.devsite-floating-action-buttons {
    -webkit-box-align: end;
    -webkit-align-items: end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: end;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    inset-block-end: calc(var(--devsite-panel-height, 0px) + 24px);
    position: fixed;
    z-index: 1004
}

[concierge=closed] .devsite-floating-action-buttons,[concierge=open] .devsite-floating-action-buttons {
    inset-inline-end: calc(12px + var(--devsite-concierge-width));
    -webkit-transition: right .1s cubic-bezier(0,0,.2,1);
    transition: right .1s cubic-bezier(0,0,.2,1)
}

.devsite-floating-action-buttons,[concierge=modal] .devsite-floating-action-buttons {
    inset-inline-end: 24px
}

.devsite-devguide-mobile-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    display: none;
    height: 56px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0;
    width: 56px;
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color)
}

.viewport--mobile .devsite-devguide-mobile-button,.viewport--tablet .devsite-devguide-mobile-button {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.devsite-devguide-mobile-button:focus,.devsite-devguide-mobile-button:hover {
    background: #e8f0fe;
    border: 2px solid #4285f4
}

.devsite-label {
    background: var(--devsite-background-color,var(--devsite-label-google-blue-background));
    border-radius: 8px;
    color: var(--devsite-label-text-color,var(--devsite-label-google-blue-color));
    display: inline-block;
    font: 500 12px/16px var(--devsite-headline-font-family);
    margin-bottom: 8px;
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px;padding: 4px 8px
}

.devsite-release-note {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 16px 0
}

.devsite-release-note .devsite-label {
    -webkit-box-flex: 0;
    -webkit-flex: none;
    -moz-box-flex: 0;
    -ms-flex: none;
    flex: none;
    height: 24px;
    text-align: center;
    width: 100px
}

.devsite-release-note>div>:first-child {
    margin-top: 0
}

.devsite-release-note>div>:last-child {
    margin-bottom: 0
}

.devsite-label[background]:not([foreground]) {
    color: var(--devsite-label-text-color,var(--devsite-text-color,var(--devsite-inverted-text-color)))
}

.devsite-label-display-tag-api,.devsite-label[background=cyan] {
    --devsite-background-color: var(--devsite-label-cyan-background);
    --devsite-label-text-color: var(--devsite-label-cyan-color)
}

.devsite-label-display-tag-product,.devsite-label-release-fixed,.devsite-label[background=google-blue] {
    --devsite-background-color: var(--devsite-label-google-blue-background);
    --devsite-label-text-color: var(--devsite-label-google-blue-color)
}

.devsite-label-display-tag-language,.devsite-label-display-tag-org,.devsite-label-release-feature,.devsite-label[background=google-green] {
    --devsite-background-color: var(--devsite-label-google-green-background);
    --devsite-label-text-color: var(--devsite-label-google-green-color)
}

.devsite-label-display-tag-app,.devsite-label-release-breaking,.devsite-label-release-deprecated,.devsite-label-release-issue,.devsite-label[background=google-red] {
    --devsite-background-color: var(--devsite-label-google-red-background);
    --devsite-label-text-color: var(--devsite-label-google-red-color)
}

.devsite-label-display-tag-category,.devsite-label-display-tag-skill,.devsite-label-release-announcement,.devsite-label-release-changed,.devsite-label[background=google-yellow] {
    --devsite-background-color: var(--devsite-label-google-yellow-background);
    --devsite-label-text-color: var(--devsite-label-google-yellow-color)
}

.devsite-label-display-tag-programgroup,.devsite-label[background=grey] {
    --devsite-background-color: var(--devsite-label-grey-background);
    --devsite-label-text-color: var(--devsite-label-grey-color)
}

.devsite-label-blogger,.devsite-label-release-security,.devsite-label[background=orange] {
    --devsite-background-color: var(--devsite-label-orange-background);
    --devsite-label-text-color: var(--devsite-label-orange-color)
}

.devsite-label-display-tag-event,.devsite-label[background=pink] {
    --devsite-background-color: var(--devsite-label-pink-background);
    --devsite-label-text-color: var(--devsite-label-pink-color)
}

.devsite-label-display-tag-doctype,.devsite-label-release-libraries,.devsite-label[background=purple] {
    --devsite-background-color: var(--devsite-label-pink-background);
    --devsite-label-text-color: var(--devsite-label-pink-color)
}

.devsite-label[background=white] {
    --devsite-background-color: var(--devsite-label-white-background);
    --devsite-label-text-color: var(--devsite-label-white-color);
    border: var(--devsite-primary-border)
}

.devsite-label-youtube,.devsite-label[background=youtube-red],.devsite-label[background=youtube-theme] {
    --devsite-background-color: var(--devsite-label-youtube-red-background);
    --devsite-label-text-color: var(--devsite-label-youtube-red-color)
}

.devsite-label-confidential {
    background: var(--devsite-caution-notice-background);
    color: var(--devsite-caution-notice-color)
}

.devsite-landing-row-item-labels>:not(.devsite-label) {
    color: var(--devsite-label-color,inherit);
    display: inline-block;
    font: var(--devsite-label-font,500 11px/16px var(--devsite-primary-font-family));
    letter-spacing: var(--devsite-label-letter-spacing,.8px);
    text-transform: var(--devsite-label-text-transform,uppercase)
}

.devsite-landing-row-item-labels>a,.devsite-landing-row-item-labels>span {
    margin: var(--devsite-label-margin,0 8px 8px 0)
}

.devsite-landing-row-item-labels>:not(.devsite-label)[background] {
    border-radius: 4px;
    margin-bottom: 16px;
    padding: 4px 8px
}

dl.table {
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -moz-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    display: grid;
    gap: 8px 16px;
    grid-template-columns: -webkit-max-content 1fr;
    grid-template-columns: max-content 1fr
}

dl.table>dt {
    font-weight: 700;
    grid-column: 1;
    margin: 16px 0 0
}

dl.table>dd {
    grid-column: 2;
    margin: 0
}

devsite-book-nav .devsite-breadcrumb-list,devsite-content .devsite-breadcrumb-list,devsite-header .devsite-breadcrumb-list {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: var(--devsite-breadcrumb-list-display);
    padding: var(--devsite-breadcrumb-list-padding);
    white-space: nowrap
}

.devsite-search-project .devsite-breadcrumb-list,devsite-book-nav .devsite-breadcrumb-list,devsite-header .devsite-breadcrumb-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-family: var(--devsite-font-family,var(--devsite-primary-font-family))
}

devsite-header .devsite-breadcrumb-list {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    letter-spacing: var(--devsite-header-lower-breadcrumb-letter-spacing,0);
    text-transform: var(--devsite-header-lower-breadcrumb-text-transform,none)
}

devsite-content .devsite-breadcrumb-list {
    display: var(--devsite-breadcrumb-list-display,inline-flex);
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: var(--devsite-breadcrumb-list-font-size,13px);
    width: var(--devsite-breadcrumb-list-width)
}

devsite-book-nav .devsite-breadcrumb-item,devsite-content .devsite-breadcrumb-item,devsite-header .devsite-breadcrumb-item {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    padding: var(--devsite-breadcrumb-padding)
}

devsite-book-nav .devsite-breadcrumb-guillemet,devsite-book-nav .devsite-breadcrumb-link,devsite-header .devsite-breadcrumb-guillemet,devsite-header .devsite-breadcrumb-link {
    color: var(--devsite-secondary-text-rgba);
    fill: var(--devsite-secondary-text-rgba)
}

devsite-book-nav .devsite-breadcrumb-guillemet:focus,devsite-book-nav .devsite-breadcrumb-guillemet:hover,devsite-book-nav .devsite-breadcrumb-link:focus,devsite-book-nav .devsite-breadcrumb-link:hover,devsite-header .devsite-breadcrumb-guillemet:focus,devsite-header .devsite-breadcrumb-guillemet:hover,devsite-header .devsite-breadcrumb-link:focus,devsite-header .devsite-breadcrumb-link:hover {
    color: var(--devsite-primary-text-rgba)
}

devsite-book-nav .devsite-breadcrumb-guillemet:focus .devsite-google-wordmark-svg-path,devsite-book-nav .devsite-breadcrumb-guillemet:hover .devsite-google-wordmark-svg-path,devsite-book-nav .devsite-breadcrumb-link:focus .devsite-google-wordmark-svg-path,devsite-book-nav .devsite-breadcrumb-link:hover .devsite-google-wordmark-svg-path,devsite-header .devsite-breadcrumb-guillemet:focus .devsite-google-wordmark-svg-path,devsite-header .devsite-breadcrumb-guillemet:hover .devsite-google-wordmark-svg-path,devsite-header .devsite-breadcrumb-link:focus .devsite-google-wordmark-svg-path,devsite-header .devsite-breadcrumb-link:hover .devsite-google-wordmark-svg-path {
    fill: var(--devsite-primary-text-rgba)
}

devsite-book-nav .devsite-breadcrumb-guillemet,devsite-header .devsite-breadcrumb-guillemet {
    font-size: 24px;
    margin: 0 4px;
    width: 24px
}

devsite-content .devsite-breadcrumb-guillemet {
    color: var(--devsite-secondary-text-color);
    font-size: 18px;
    margin: 0 4px;
    width: 18px
}

devsite-book-nav .devsite-breadcrumb-guillemet:before,devsite-content .devsite-breadcrumb-guillemet:before,devsite-header .devsite-breadcrumb-guillemet:before {
    content: "chevron_right"
}

[dir=rtl] devsite-book-nav .devsite-breadcrumb-guillemet:before,[dir=rtl] devsite-content .devsite-breadcrumb-guillemet:before,[dir=rtl] devsite-header .devsite-breadcrumb-guillemet:before {
    content: "chevron_left"
}

devsite-book-nav .devsite-breadcrumb-link,devsite-content .devsite-breadcrumb-link,devsite-header .devsite-breadcrumb-link {
    display: inline-block;
    -webkit-transition: color .2s;
    transition: color .2s
}

devsite-header .devsite-doc-set-nav-row .devsite-breadcrumb-link,devsite-header .devsite-product-description-row .devsite-breadcrumb-guillemet,devsite-header .devsite-product-description-row .devsite-breadcrumb-link {
    color: var(--devsite-header-foreground-lower-hover,var(--devsite-inverted-text-color));
    fill: var(--devsite-header-foreground-lower-hover,var(--devsite-inverted-text-color))
}

devsite-header .devsite-doc-set-nav-row .devsite-breadcrumb-link:focus,devsite-header .devsite-doc-set-nav-row .devsite-breadcrumb-link:hover,devsite-header .devsite-product-description-row .devsite-breadcrumb-guillemet:focus,devsite-header .devsite-product-description-row .devsite-breadcrumb-guillemet:hover,devsite-header .devsite-product-description-row .devsite-breadcrumb-link:focus,devsite-header .devsite-product-description-row .devsite-breadcrumb-link:hover {
    color: var(--devsite-header-foreground-lower,var(--devsite-inverted-text-rgba));
    fill: var(--devsite-header-foreground-lower,var(--devsite-inverted-text-rgba))
}

devsite-book-nav .devsite-breadcrumb-link:focus,devsite-book-nav .devsite-breadcrumb-link:hover,devsite-header .devsite-breadcrumb-link:focus,devsite-header .devsite-breadcrumb-link:hover {
    text-decoration: none
}

devsite-content .devsite-breadcrumb-link {
    color: var(--devsite-breadcrumb-link-color,var(--devsite-secondary-text-color))
}

devsite-content .devsite-breadcrumb-link:focus,devsite-content .devsite-breadcrumb-link:hover {
    color: var(--devsite-breadcrumb-link-hover,var(--devsite-link-color));
    text-decoration: none
}

.devsite-nav {
    font-size: var(--devsite-nav-font-size,13px)
}

.devsite-nav-list,.devsite-nav-responsive-tabs,.devsite-nav-section {
    list-style-type: none;
    padding: 0
}

.devsite-nav-item {
    line-height: var(--devsite-nav-item-line-height,16px);
    margin: 0
}

.devsite-nav-title {
    color: var(--devsite-nav-title-color,var(--devsite-primary-text-color));
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: var(--devsite-nav-title-justify-content);
    -webkit-justify-content: var(--devsite-nav-title-justify-content);
    -moz-box-pack: var(--devsite-nav-title-justify-content);
    -ms-flex-pack: var(--devsite-nav-title-justify-content);
    justify-content: var(--devsite-nav-title-justify-content);
    padding: var(--devsite-nav-title-padding,4px 0);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.devsite-nav-title[href]:focus,.devsite-nav-title[href]:hover {
    color: var(--devsite-nav-color-hover,var(--devsite-link-color));
    text-decoration: none
}

.devsite-nav-heading>.devsite-nav-title {
    color: var(--devsite-nav-heading-color,var(--devsite-secondary-text-rgba));
    font-weight: 700
}

.devsite-nav-active {
    font-weight: var(--devsite-nav-font-weight-active,500)
}

@media screen and (-ms-high-contrast:active),screen and (prefers-contrast:high) {
    .devsite-nav-active {
        font-weight: 700;
        text-decoration: underline
    }
}

.devsite-nav-active,.devsite-nav-active.devsite-nav-title,.devsite-nav-active.devsite-nav-title>.devsite-nav-icon:before,.devsite-nav-deprecated .devsite-nav-active.devsite-nav-title {
    color: var(--devsite-nav-color-active,var(--devsite-link-color-active,var(--devsite-link-color)))
}

.devsite-nav-text {
    overflow-x: clip;
    text-overflow: ellipsis
}

.devsite-nav-accordion>.devsite-expandable-nav>.devsite-nav-title-no-path:focus,.devsite-nav-title-no-path:focus {
    color: var(--devsite-link-color)
}

.devsite-nav-icon {
    cursor: default;
    font-size: 18px;
    margin: var(--devsite-nav-icon-margin,-1px 0 -1px 4px)
}

[dir=rtl] .devsite-nav-icon {
    margin: -1px 4px -1px 0
}

.devsite-nav-icon:before {
    color: var(--devsite-secondary-text-color);
    content: "info"
}

.devsite-nav-icon[data-icon=alpha]:before,.devsite-nav-icon[data-icon=beta]:before,.devsite-nav-icon[data-icon=experimental]:before,.devsite-nav-icon[data-icon=preview]:before {
    content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18"><path d="M15.78,13.39L11,7V4h2V2H5v2h2v3l-4.9,6.53c-0.34,0.47-0.39,1.1-0.12,1.62C2.24,15.67,2.77,16,3.36,16h11.28 c0.86,0,1.56-0.7,1.56-1.56C16.2,14.04,16.03,13.67,15.78,13.39z" fill="%2380868b"/></svg>')
}

.color-scheme--dark .devsite-nav-icon[data-icon=alpha]:before,.color-scheme--dark .devsite-nav-icon[data-icon=beta]:before,.color-scheme--dark .devsite-nav-icon[data-icon=experimental]:before,.color-scheme--dark .devsite-nav-icon[data-icon=preview]:before {
    content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18"><path d="M15.78,13.39L11,7V4h2V2H5v2h2v3l-4.9,6.53c-0.34,0.47-0.39,1.1-0.12,1.62C2.24,15.67,2.77,16,3.36,16h11.28 c0.86,0,1.56-0.7,1.56-1.56C16.2,14.04,16.03,13.67,15.78,13.39z" fill="%239aa0a6"/></svg>')
}

.devsite-nav-deprecated .devsite-nav-title,.devsite-nav-deprecated.devsite-nav-accordion .devsite-nav-title,.devsite-nav-icon[data-icon=deprecated]:before,.devsite-nav-icon[data-icon=unsupported]:before {
    color: var(--devsite-secondary-text-color)
}

.devsite-nav-icon[data-icon=deprecated]:before,.devsite-nav-icon[data-icon=unsupported]:before {
    content: "not_interested"
}

.devsite-nav-icon[data-icon=external]:before {
    content: "open_in_new"
}

[dir=rtl] .devsite-nav-icon[data-icon=external]:before {
    display: inline-block;
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1)
}

.devsite-nav-icon[data-icon=forward]:before {
    content: "arrow_forward";
    cursor: pointer
}

[dir=rtl] .devsite-nav-icon[data-icon=forward]:before {
    content: "arrow_back"
}

.devsite-nav-icon[data-icon=limited]:before {
    content: "verified_user"
}

.devsite-nav-icon[data-icon=new]:before {
    content: "new_releases"
}

.devsite-nav-icon[data-icon=nightly]:before {
    content: "nights_stay"
}

[layout=docs] h1,[layout=docs] h2,[layout=docs] h3,[layout=docs] h4,[layout=docs] h5,[layout=docs] h6 {
    overflow-x: clip;
    text-overflow: ellipsis
}

.devsite-article h1:first-of-type {
    display: inline;
    margin-top: 0;
    vertical-align: middle
}

.devsite-article h1.devsite-page-title {
    overflow: visible
}

.devsite-article[has-bookmark] h1:first-of-type {
    -webkit-margin-end: 83px;
    -moz-margin-end: 83px;
    margin-inline-end:83px}

.devsite-page-title-meta {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 4px
}

.devsite-landing-row h2,.devsite-landing-row-item-description h3,h1 {
    color: var(--devsite-heading-color,var(--devsite-secondary-text-color))
}

.devsite-landing-row h2,.devsite-landing-row-large-headings .devsite-landing-row-item-description h3,h1 {
    font: var(--devsite-h1-font);
    letter-spacing: var(--devsite-h1-letter-spacing);
    margin: var(--devsite-h1-margin)
}

.devsite-landing-row-1-up.devsite-landing-row-hero .devsite-landing-row-item-description h3,.devsite-landing-row-large-headings h2 {
    font: var(--devsite-display-font);
    letter-spacing: var(--devsite-display-letter-spacing)
}

.devsite-landing-row .devsite-catalog-alphabet-letter-heading h2 {
    margin: 20px 0
}

[layout=docs] h2 {
    border-bottom: var(--devsite-h2-border,var(--devsite-secondary-border));
    padding: var(--devsite-h2-padding)
}

.devsite-landing-row h3,h2 {
    font: var(--devsite-h2-font);
    letter-spacing: var(--devsite-h2-letter-spacing);
    margin: var(--devsite-h2-margin)
}

h3 {
    font: var(--devsite-h3-font);
    letter-spacing: var(--devsite-h3-letter-spacing);
    margin: var(--devsite-h3-margin)
}

.devsite-landing-row h4,.devsite-landing-row-item-no-media h3 {
    font: var(--devsite-h3-font);
    margin: var(--devsite-h3-margin,32px 0 12px);
    padding: 0
}

.devsite-landing-row-large-headings .devsite-landing-row-item-list h4 {
    font: 400 20px/32px var(--devsite-primary-font-family);
    letter-spacing: -.01em
}

h4,h5,h6 {
    margin: 32px 0 16px
}

h4 {
    font: var(--devsite-h4-font);
    letter-spacing: var(--devsite-h4-letter-spacing)
}

h5 {
    font: var(--devsite-h5-font);
    letter-spacing: var(--devsite-h5-letter-spacing)
}

h6 {
    font: var(--devsite-h6-font);
    letter-spacing: var(--devsite-h6-letter-spacing)
}

h1+dl>dt:first-child,h1+h1,h1+h2,h1+h3,h1+h4,h1+h5,h1+h6,h2+dl>dt:first-child,h2+h1,h2+h2,h2+h3,h2+h4,h2+h5,h2+h6,h3+dl>dt:first-child,h3+h1,h3+h2,h3+h3,h3+h4,h3+h5,h3+h6,h4+dl>dt:first-child,h4+h1,h4+h2,h4+h3,h4+h4,h4+h5,h4+h6,h5+dl>dt:first-child,h5+h1,h5+h2,h5+h3,h5+h4,h5+h5,h5+h6,h6+dl>dt:first-child,h6+h1,h6+h2,h6+h3,h6+h4,h6+h5,h6+h6 {
    margin-top: 0
}

table {
    border: 0;
    border-collapse: collapse;
    border-spacing: 0;
    font: 14px/20px var(--devsite-primary-font-family);
    margin: 16px 0 15px;
    width: 100%
}

caption {
    background: var(--devsite-background-3);
    font-weight: 500;
    padding: 12px 8px;
    text-align: center
}

tr {
    background: var(--devsite-table-row-background,0);
    border: 0;
    border-bottom: var(--devsite-table-row-border,var(--devsite-primary-border))
}

tr:first-child {
    border-top: var(--devsite-table-row-border,var(--devsite-primary-border))
}

td,th {
    border: 0;
    margin: 0;
    text-align: left
}

[dir=rtl] td,[dir=rtl] th {
    text-align: right
}

th {
    font: var(--devsite-table-heading-font,500 16px/24px var(--devsite-primary-font-family));
    height: 48px;
    padding: var(--devsite-table-heading-padding,8px);
    vertical-align: middle
}

th>h2,th>h3 {
    border: 0;
    font: var(--devsite-table-heading-font,500 16px/24px var(--devsite-primary-font-family));
    margin: 0!important;
    padding: 0!important
}

td>.expandable>h2.showalways,td>.expandable>h3.showalways,td>h2:only-child,td>h3:only-child {
    border: 0;
    font: 500 14px/20px var(--devsite-primary-font-family);
    margin: 0;
    padding-bottom: 0
}

td>.expandable>h2.showalways,td>.expandable>h3.showalways {
    line-height: 24px
}

table h4,table h5,table h6 {
    margin-left: 0!important;
    margin-right: 0!important;
    padding-left: 0!important;
    padding-right: 0!important
}

td b,td strong,th b,th strong {
    font-weight: 500
}

td {
    padding: var(--devsite-table-cell-padding,7px 8px 8px)
}

td code,th code {
    background: var(--devsite-table-code-background,0);
    border: var(--devsite-table-code-border,0);
    border-radius: var(--devsite-table-code-border-radius);
    color: var(--devsite-table-code-color);
    font: 500 100%/1em var(--devsite-code-font-family);
    -moz-osx-font-smoothing: auto;
    -webkit-font-smoothing: auto;
    padding: var(--devsite-table-code-padding,0)
}

td pre code {
    font-weight: 400;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased
}

table.responsive td,table.responsive th {
    min-width: 214px
}

table.responsive table:not(.responsive) td,table.responsive table:not(.responsive) th {
    min-width: 120px
}

table.responsive td code,table.responsive th code {
    word-break: break-all;
    word-break: break-word
}

table.responsive td tr:not(.alt) td:first-child,table.responsive tr:not(.alt) td td:first-child,td {
    background: var(--devsite-table-cell-background);
    vertical-align: top
}

table.fixed {
    table-layout: fixed
}

table.fixed td,table.fixed td code,table.fixed th,table.fixed th code {
    word-break: break-word
}

.devsite-table-wrapper {
    margin: var(--devsite-table-margin,16px 0);
    overflow: auto
}

.devsite-table-wrapper .devsite-table-wrapper {
    margin: 0;
    overflow: visible
}

.devsite-table-wrapper table {
    margin: 0
}

.devsite-table-wrapper .devsite-table-wrapper table {
    margin: 16px 0
}

table.responsive table.responsive {
    margin: 0
}

table.responsive td tr:first-child td {
    padding-top: 0
}

table.responsive td tr:last-child td {
    padding-bottom: 0
}

[dir=ltr] table.responsive td td:first-child {
    padding-left: 0
}

[dir=rtl] table.responsive td td:first-child {
    padding-right: 0
}

table.responsive>*>tr>th:not(:first-child),table.responsive>tr>th:not(:first-child) {
    display: none
}

table.columns tr {
    border: 0
}

table table tr:first-child {
    border-top: 0
}

devsite-selector .devsite-table-wrapper:last-child tr:last-child,table table tr:last-child {
    border-bottom: 0
}

th,th code {
    background: var(--devsite-table-heading-background,#e8eaed);
    color: var(--devsite-table-heading-color,var(--devsite-primary-text-color))
}

table.vertical-rules tr>td:not(:last-child),table.vertical-rules tr>th:not(:last-child) {
    border-right: var(--devsite-table-row-border,var(--devsite-primary-border))
}

.alt td,table.alternating-even-rows tr:nth-child(2n) td,table.alternating-odd-rows tr:nth-child(odd) td,td.alt {
    background: var(--devsite-alt-table-cell-background)
}

table.responsive>*>tr:not(.alt) td:first-child,table.responsive>tr:not(.alt) td:first-child {
    background: var(--devsite-responsive-table-first-column-background)
}

.devsite-article-body>.devsite-full-width-table,.devsite-article-body>table.full-width {
    margin: 16px -40px
}

@media screen and (max-width: 840px) {
    .devsite-article-body>.devsite-full-width-table,.devsite-article-body>table.full-width {
        margin:16px -24px
    }
}

@media screen and (max-width: 600px) {
    .devsite-article-body>.devsite-full-width-table,.devsite-article-body>table.full-width {
        margin:16px -16px
    }
}

.devsite-article-body>.devsite-full-width-table td:first-child,.devsite-article-body>.devsite-full-width-table th:first-child,.devsite-article-body>table.full-width td:first-child,.devsite-article-body>table.full-width th:first-child {
    padding-left: 40px
}

@media screen and (max-width: 840px) {
    .devsite-article-body>.devsite-full-width-table td:first-child,.devsite-article-body>.devsite-full-width-table th:first-child,.devsite-article-body>table.full-width td:first-child,.devsite-article-body>table.full-width th:first-child {
        padding-left:24px
    }
}

@media screen and (max-width: 600px) {
    .devsite-article-body>.devsite-full-width-table td:first-child,.devsite-article-body>.devsite-full-width-table th:first-child,.devsite-article-body>table.full-width td:first-child,.devsite-article-body>table.full-width th:first-child {
        padding-left:16px
    }
}

.devsite-article-body>.devsite-full-width-table td:last-child,.devsite-article-body>.devsite-full-width-table th:last-child,.devsite-article-body>table.full-width td:last-child,.devsite-article-body>table.full-width th:last-child {
    padding-right: 40px
}

@media screen and (max-width: 840px) {
    .devsite-article-body>.devsite-full-width-table td:last-child,.devsite-article-body>.devsite-full-width-table th:last-child,.devsite-article-body>table.full-width td:last-child,.devsite-article-body>table.full-width th:last-child {
        padding-right:24px
    }
}

@media screen and (max-width: 600px) {
    .devsite-article-body>.devsite-full-width-table td:last-child,.devsite-article-body>.devsite-full-width-table th:last-child,.devsite-article-body>table.full-width td:last-child,.devsite-article-body>table.full-width th:last-child {
        padding-right:16px
    }
}

.devsite-full-width-table table table td:first-child,.devsite-full-width-table table table th:first-child {
    padding-left: 0
}

@media screen and (max-width: 840px) {
    .devsite-full-width-table table table td:first-child,.devsite-full-width-table table table th:first-child {
        padding-right:0
    }
}

.devsite-full-width-table table table td:last-child,.devsite-full-width-table table table th:last-child {
    padding-right: 0
}

@media screen and (max-width: 840px) {
    .devsite-full-width-table table table td:last-child,.devsite-full-width-table table table th:last-child {
        padding-left:0
    }
}

@media screen and (max-width: 840px) {
    table.responsive td,table.responsive th,table.responsive tr {
        display:block
    }

    table.responsive table:not(.responsive) tr {
        display: table-row
    }

    table.responsive table:not(.responsive) td,table.responsive table:not(.responsive) th {
        display: table-cell
    }

    table.responsive>*>th,table.responsive>th {
        height: auto;
        padding: var(--devsite-responsive-table-heading-padding,14px 8px)
    }

    table.fixed.responsive col {
        display: contents
    }
}

.devsite-book-nav::-webkit-scrollbar,.devsite-dialog::-webkit-scrollbar,.devsite-popout::-webkit-scrollbar,.devsite-table-wrapper::-webkit-scrollbar,.devsite-tabs-overflow-menu::-webkit-scrollbar,.devsite-toc::-webkit-scrollbar,[scrollbars]::-webkit-scrollbar,pre::-webkit-scrollbar {
    height: 8px;
    width: 8px
}

.devsite-book-nav::-webkit-scrollbar-thumb,.devsite-dialog::-webkit-scrollbar-thumb,.devsite-popout::-webkit-scrollbar-thumb,.devsite-table-wrapper::-webkit-scrollbar-thumb,.devsite-tabs-overflow-menu::-webkit-scrollbar-thumb,.devsite-toc::-webkit-scrollbar-thumb,[scrollbars]::-webkit-scrollbar-thumb,pre::-webkit-scrollbar-thumb {
    background: var(--devsite-scrollbar-thumb-background);
    border-radius: 8px
}

.devsite-doc-set-nav-row::-webkit-scrollbar,.devsite-header-upper-tabs::-webkit-scrollbar,[no-horizontal-scrollbars]::-webkit-scrollbar {
    height: 0;
    width: 0
}

.devsite-table-wrapper::-webkit-scrollbar-corner,[scrollbars]::-webkit-scrollbar-corner,pre::-webkit-scrollbar-corner {
    background: 0
}

.devsite-cse-confidential-results {
    background: var(--devsite-confidential-results-background);
    margin: 32px -40px;
    padding: 0 40px 0
}

.devsite-cse-confidential-results+aside {
    -webkit-margin-before: -16px!important;
    margin-block-start:-16px!important}

.devsite-cse-confidential-results .devsite-search-results {
    -webkit-padding-after: 16px;
    padding-block-end:16px}

.devsite-cse-confidential-results .devsite-cse-confidential-expand aside {
    --devsite-notice-margin: 16px -40px;
    --devsite-notice-padding-inline: 76px 40px
}

.devsite-cse-confidential-results .devsite-cse-confidential-expand aside .confidential-label,.devsite-cse-confidential-results .devsite-cse-confidential-expand aside:before {
    color: var(--devsite-caution-notice-color)
}

.devsite-cse-confidential-results .devsite-cse-confidential-expand aside.caution {
    --devsite-link-color: var(--devsite-caution-notice-color)
}

.devsite-cse-confidential-results .devsite-cse-confidential-expand aside:before {
    content: "remove_circle"
}

.devsite-cse-confidential-results .devsite-cse-confidential-expand:not([expanded]) aside:before {
    content: "add_circle"
}

.devsite-search-results-stats {
    -webkit-margin-after: 8px;
    margin-block-end:8px}

[template=search] .gsc-result.gs-webResult h3 {
    display: inline-block;
    line-height: 22px;
    margin: 0
}

.devsite-search-results .gs-title {
    font-family: var(--devsite-primary-font-family);
    font-size: 16px;
    font-weight: 500
}

.devsite-search-results .gs-title:link,.devsite-search-results .gs-title:visited {
    color: var(--devsite-link-color)
}

.devsite-search-results .gs-webResult .gs-visibleUrl {
    color: var(--devsite-search-results-breadcrumb-color);
    font-size: 14px
}

.devsite-search-results .gs-snippet {
    -webkit-margin-before: 0;
    margin-block-start:0}

.devsite-search-results .gs-webResult:not(.gs-no-results-result):not(.gs-error-result) .gs-snippet {
    color: var(--devsite-primary-text-color)
}

body[template=search] .gsc-webResult .gsc-result {
    border: none;
    margin: 24px 0;
    padding: 0
}

.devsite-search-page-controls {
    -webkit-margin-before: 8px;
    margin-block-start:8px}

.devsite-search-project {
    -webkit-border-after: var(--devsite-primary-border);
    border-block-end:var(--devsite-primary-border);-webkit-margin-after: 24px;
    margin-block-end:24px;-webkit-padding-after: 23px;
    padding-block-end:23px}

.devsite-search-project .devsite-project-scoped-results-title {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-margin-after: 8px;
    margin-block-end:8px}

.devsite-search-project .devsite-project-scoped-results-title .devsite-product-name-wrapper {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    height: 36px;
    margin: 6px 0
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-product-name-link,.devsite-search-project .devsite-project-scoped-results-title .devsite-site-logo-link {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 1;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-product-name-link:focus,.devsite-search-project .devsite-project-scoped-results-title .devsite-product-name-link:hover,.devsite-search-project .devsite-project-scoped-results-title .devsite-site-logo-link:focus {
    opacity: .7;
    text-decoration: none
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-site-logo {
    aspect-ratio: var(--devsite-logo-aspect-ratio,auto);
    height: var(--devsite-logo-height,32px)
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-has-google-wordmark>.devsite-breadcrumb-link,.devsite-search-project .devsite-project-scoped-results-title .devsite-has-google-wordmark>.devsite-product-name {
    direction: ltr
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-google-wordmark {
    height: 24px;
    margin: 0 4px 0 0;
    position: relative;
    top: 5px
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-google-wordmark-svg-path {
    -webkit-transition: fill .2s;
    transition: fill .2s
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-site-logo-link canvas {
    height: auto!important
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-site-logo-link picture {
    display: contents
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-product-logo-container {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 36px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-inline:0 4px;width: 36px
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-top-logo-row .devsite-product-logo-container {
    color: var(--devsite-primary-color,var(--devsite-primary-text-color))
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-top-logo-row .devsite-product-logo-container[background] {
    background: var(--devsite-primary-color,var(--devsite-primary-text-color));
    color: var(--devsite-inverted-text-color)
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-product-logo {
    color: inherit;
    display: block;
    font-size: 32px;
    height: 32px;
    max-width: 32px;
    min-width: 32px;
    overflow: hidden;
    white-space: nowrap
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-product-logo-container[background] .devsite-product-logo {
    font-size: 28px;
    height: 28px;
    max-width: 28px;
    min-width: 28px
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-product-name {
    font: var(--devsite-wordmark-font,400 20px/32px var(--devsite-primary-font-family));
    letter-spacing: 0;
    margin: 0;
    max-height: 32px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-transition: color .2s;
    transition: color .2s;
    white-space: nowrap
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-site-logo:not([src*=".svg"]) {
    height: auto;
    max-height: 32px
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-breadcrumb-link>.devsite-product-name {
    color: inherit
}

@media screen and (max-width: 840px) {
    .devsite-search-project .devsite-project-scoped-results-title .devsite-product-name-wrapper {
        -webkit-box-flex:0;
        -webkit-flex: 0 1 auto;
        -moz-box-flex: 0;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        min-width: 0
    }

    .devsite-search-project .devsite-project-scoped-results-title .devsite-product-name-wrapper .devsite-breadcrumb-item:not(:first-of-type),.devsite-search-project .devsite-project-scoped-results-title .devsite-product-name-wrapper .devsite-site-logo-link+.devsite-product-name {
        display: none
    }

    .devsite-search-project .devsite-project-scoped-results-title .devsite-product-name-wrapper .devsite-breadcrumb-item,.devsite-search-project .devsite-project-scoped-results-title .devsite-product-name-wrapper .devsite-breadcrumb-link,.devsite-search-project .devsite-project-scoped-results-title .devsite-product-name-wrapper .devsite-breadcrumb-list,.devsite-search-project .devsite-project-scoped-results-title .devsite-product-name-wrapper .devsite-product-name {
        width: 100%
    }

    .devsite-search-project .devsite-project-scoped-results-title .devsite-product-name-wrapper .devsite-breadcrumb-link {
        overflow: hidden;
        text-overflow: ellipsis
    }
}

.devsite-search-project .devsite-project-scoped-results-title .devsite-product-name-wrapper {
    position: relative;
    -webkit-margin-start: .3em;
    -moz-margin-start: .3em;
    margin-inline-start:.3em}

.devsite-search-project .devsite-breadcrumb-list,.devsite-search-project .devsite-project-scoped-results-title {
    font: var(--devsite-wordmark-font,400 20px/32px var(--devsite-primary-font-family))
}

.devsite-search-project .devsite-projectless-search-link {
    -webkit-margin-start: 20px;
    -moz-margin-start: 20px;
    margin-inline-start:20px}

.devsite-search-project .devsite-breadcrumb-link,.devsite-search-project .devsite-breadcrumb-link:hover {
    color: var(--devsite-primary-text-color)
}

.devsite-search-project .devsite-product-logo-container {
    color: var(--devsite-primary-color,var(--devsite-primary-text-color))
}

.devsite-search-project .devsite-product-logo-container[background] {
    background: var(--devsite-primary-color,var(--devsite-primary-text-color));
    color: var(--devsite-inverted-text-color)
}

.devsite-search-project .devsite-breadcrumb-link .devsite-google-wordmark {
    fill: currentColor
}

.devsite-search-title {
    margin: 0;
    padding: 0
}

.devsite-search-title .devsite-search-term {
    color: var(--devsite-search-term-color,var(--devsite-primary-text-color));
    font-weight: var(--devsite-search-term-weight,500)
}

.devsite-steps {
    border-top: var(--devsite-steps-border,0);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: var(--devsite-steps-margin,0);
    padding: var(--devsite-steps-padding,24px 0 40px)
}

.devsite-steps .steps-direction {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    font-weight: 500;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative
}

.devsite-steps .steps-previous {
    margin-left: var(--devsite-steps-prev-next-margin-x,40px)
}

.devsite-steps .steps-next {
    margin-right: var(--devsite-steps-prev-next-margin-x,40px);
    text-align: right
}

.devsite-steps .steps-link:hover {
    -webkit-text-decoration: var(--devsite-steps-text-decoration-hover,none);
    -moz-text-decoration: var(--devsite-steps-text-decoration-hover,none);
    text-decoration: var(--devsite-steps-text-decoration-hover,none)
}

.devsite-steps .steps-link:focus {
    text-decoration: none
}

.devsite-steps .steps-link-direction {
    color: var(--devsite-steps-direction-color,var(--devsite-link-color));
    display: block;
    font: var(--devsite-steps-direction-font,500 14px/24px var(--devsite-primary-font-family))
}

.devsite-steps .steps-link-title {
    color: var(--devsite-steps-title-color);
    display: var(--devsite-steps-title-display,inline);
    font: var(--devsite-steps-title-font,500 18px/24px var(--devsite-primary-font-family))
}

.devsite-steps .steps-link:hover .steps-link-title {
    border-bottom: var(--devsite-steps-title-border-hover,none)
}

.devsite-steps .steps-link:focus .steps-link-title {
    border-bottom: var(--devsite-steps-title-border-focus)
}

.devsite-steps .steps-link-arrow {
    color: var(--devsite-steps-arrow-color,var(--devsite-link-color));
    position: absolute
}

.devsite-steps .steps-link-arrow-left {
    left: var(--devsite-steps-arrow-x-start,-40px)
}

.devsite-steps .steps-link-arrow-right {
    right: var(--devsite-steps-arrow-x-start,-40px)
}

@media screen and (max-width: 840px) {
    .devsite-steps .steps-link-title {
        font:var(--devsite-steps-title-font,500 14px/24px var(--devsite-primary-font-family))
    }

    .devsite-steps .steps-previous {
        margin-left: var(--devsite-steps-prev-next-margin-x,24px)
    }

    .devsite-steps .steps-next {
        margin-right: var(--devsite-steps-prev-next-margin-x,24px)
    }

    .devsite-steps .steps-link-arrow-left {
        left: var(--devsite-steps-arrow-x-start,-24px)
    }

    .devsite-steps .steps-link-arrow-right {
        right: var(--devsite-steps-arrow-x-start,-24px)
    }

    .devsite-steps .steps-link-arrow {
        bottom: var(--devsite-steps-arrow-y-end,4px);
        font-size: 16px
    }
}

@media screen and (max-width: 600px) {
    .devsite-steps {
        padding:8px 0 16px
    }

    .devsite-steps .steps-previous {
        margin-left: var(--devsite-steps-prev-next-margin-x,0)
    }

    .devsite-steps .steps-next {
        margin-right: var(--devsite-steps-prev-next-margin-x,0)
    }

    .devsite-steps .steps-link-arrow {
        display: var(--devsite-steps-arrow-display,none)
    }
}

.devsite-jsfiddle-hide {
    display: none
}

html[cached] .devsite-wrapper {
    display: none
}

.devsite-dialog:not([is-upgraded]),iframe.devsite-embedded-youtube-video:not([is-upgraded]) {
    pointer-events: none;
    visibility: hidden
}

.ds-selector-tabs,.kd-tabbed-horz {
    display: none
}

.expandable {
    display: none
}

devsite-selector {
    pointer-events: none;
    visibility: hidden
}

devsite-search .devsite-searchbox {
    background: var(--devsite-searchbox-background,var(--devsite-background-3));
    border-radius: 2px
}

iframe.framebox,iframe.inherit-locale {
    display: block;
    width: 100%
}

[background] {
    background-color: var(--devsite-background-color,var(--devsite-primary-color))
}

[background],[background]:not([foreground]) {
    color: var(--devsite-text-color,var(--devsite-inverted-text-color))
}

[background] :link:not(.button):not(.devsite-label),[background] :visited:not(.button):not(.devsite-label) {
    color: var(--devsite-foreground-color,var(--devsite-link-color))
}

[background] :focus>:not(.material-icons),[background] :link>:not(.material-icons):hover,[background] p>a:not(.button) {
    -webkit-text-decoration: var(--devsite-background-text-decoration,underline);
    -moz-text-decoration: var(--devsite-background-text-decoration,underline);
    text-decoration: var(--devsite-background-text-decoration,underline)
}

[background] p>a:focus {
    background: var(--devsite-inverted-text-rgba);
    border-radius: 2px;
    margin: -4px;
    padding: 4px;
    text-decoration: none
}

[foreground] :focus>:not(.material-icons),[foreground] :link>:not(.material-icons):hover {
    color: var(--devsite-foreground-color,var(--devsite-primary-color,var(--devsite-link-color)));
    text-decoration: underline
}

[foreground] h2 a:not(.button),[foreground] h3 a:not(.button) {
    color: var(--devsite-foreground-color,var(--devsite-primary-color,var(--devsite-link-color)))
}

.devsite-landing-row-item[foreground] h2 a:not(.button),.devsite-landing-row-item[foreground] h3 a:not(.button) {
    color: var(--devsite-foreground-color,var(--devsite-primary-color,var(--devsite-link-color)))
}

devsite-content {
    display: block;
    position: relative
}

body[layout=docs] devsite-content {
    align-self: start;
    grid-column: 2;
    grid-row: 1;
    margin: 24px 0;
    max-width: 936px;
    min-width: 0
}

body[layout=docs][concierge] devsite-content {
    max-width: 1072px
}

body[layout=docs] .devsite-article {
    background-color: var(--devsite-background-1);
    border: var(--devsite-page-border,0);
    border-radius: var(--devsite-page-border-radius,2px);
    box-shadow: var(--devsite-page-box-shadow,0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color));
    padding: 40px
}

body[layout=docs][template=landing] .devsite-article {
    padding: 0
}

.devsite-article-meta {
    display: grid;
    grid-gap: 0 16px;
    grid-template-areas: "breadcrumbs ratings";
    grid-template-columns: 1fr auto;
    margin: var(--devsite-article-meta-margin,0 0 16px)
}

.devsite-article-meta .devsite-breadcrumb-list {
    grid-area: breadcrumbs
}

.devsite-article-meta devsite-thumb-rating {
    grid-area: ratings
}

.devsite-banner+.devsite-article-meta {
    margin-top: -16px
}

body[layout=full] .devsite-article-meta,body[template=landing] .devsite-article-meta {
    margin: 0
}

devsite-feedback[position=header] {
    display: block
}

[dir=ltr] devsite-feedback[position=header] {
    float: right;
    margin-left: 24px
}

[dir=rtl] devsite-feedback[position=header] {
    float: left;
    margin-right: 24px
}

body[layout=full] devsite-feedback[position=header],body[template=landing] devsite-feedback[position=header] {
    display: none
}

[template=page] .devsite-article-body {
    margin-top: 16px
}

[template=page] .devsite-article-body>:first-child,[template=page] .devsite-article-body>devsite-view-release-notes:first-child+* {
    margin-top: 0
}

@media screen and (max-width: 840px) {
    body[layout=docs] devsite-content {
        margin:0
    }

    body[layout=docs] .devsite-article {
        border: 0;
        border-radius: 0;
        box-shadow: none;
        padding: 24px
    }

    .devsite-banner+.devsite-article-meta {
        margin-top: 0
    }
}

@media screen and (max-width: 600px) {
    body[layout=docs] .devsite-article {
        padding:16px
    }

    .devsite-article-meta {
        display: block;
        margin: 0 0 12px
    }

    [dir] devsite-feedback[position=header] {
        float: none;
        margin: 0 0 12px;
        position: static
    }

    [dir] article[has-bookmark] devsite-feedback[position=header] {
        margin: 0 0 12px
    }
}

#devsite-support-form {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 0 0 -40px
}

#devsite-support-form>* {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -moz-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    padding: 0 0 0 40px
}

.devsite-support-form-error {
    color: #d93025
}

.devsite-support-form-hidden {
    display: none
}

.devsite-support-form-field {
    margin: 0 0 8px
}

.devsite-support-form-field input:not([type=checkbox]):not([type=radio]),.devsite-support-form-field select,.devsite-support-form-field textarea {
    width: 100%
}

.devsite-support-form-cc {
    color: var(--devsite-secondary-text-color);
    display: block;
    font-size: 13px
}

#devsite-support-form>.devsite-support-form-half {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -moz-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%
}

.devsite-support-quota {
    font: italic 400 12px/20px var(--devsite-primary-font-family);
    margin-bottom: 8px
}

.devsite-support-quota-help {
    font-size: 18px;
    margin-left: 4px;
    vertical-align: top
}

.devsite-support-quota-help:after {
    color: var(--devsite-tertiary-text-color);
    content: "help"
}

@media screen and (max-width: 600px) {
    #devsite-support-form {
        display:block
    }
}

.devsite-404,.devsite-offline {
    font: var(--devsite-404-font);
    letter-spacing: var(--devsite-404-letter-spacing);
    margin: var(--devsite-404-margin,120px auto 0);
    max-width: var(--devsite-404-max-width,804px);
    min-height: var(--devsite-404-min-height);
    position: relative;
    text-align: var(--devsite-404-text-align,center)
}

.devsite-404 devsite-search,.devsite-offline-reload,.devsite-offline-suggestions {
    margin: var(--devsite-404-search-margin);
    position: relative;
    z-index: 1
}

.devsite-404 devsite-search .devsite-popout-result {
    max-height: 304px
}

.devsite-404 devsite-search,.devsite-404 devsite-search .devsite-searchbox {
    width: 100%
}

.devsite-404 devsite-search .devsite-search-button {
    display: none
}

.devsite-404 h3,.devsite-offline h3 {
    color: var(--devsite-offline-heading-color,var(--devsite-secondary-text-color,var(--devsite-primary-text-color)))
}

.devsite-404 h3 {
    font: 400 64px/64px var(--devsite-code-font-family)
}

.devsite-404-error {
    background: var(--devsite-404-error-background);
    padding: var(--devsite-404-error-padding);
    text-align: var(--devsite-404-error-text-align,center)
}

.devsite-404-error-message,.devsite-404-error>h3 {
    position: relative;
    z-index: 2
}

.devsite-404-error>h3 {
    display: var(--devsite-404-error-heading-display,block)
}

.devsite-404-error-message {
    font: var(--devsite-404-error-message-font);
    letter-spacing: var(--devsite-404-error-message-letter-spacing);
    margin: var(--devsite-404-error-message-margin,0 0 20px)
}

.devsite-404-links {
    border-top: var(--devsite-404-links-border,var(--devsite-primary-border));
    margin: var(--devsite-404-links-margin,0 calc(50% - 50vw) 40px);
    padding: var(--devsite-404-links-padding,0 calc(50vw - 50%));
    text-align: start
}

.devsite-404-links h3 {
    color: var(--devsite-primary-text-color);
    font: var(--devsite-404-links-heading-font,var(--devsite-h3-font));
    margin-bottom: 28px
}

.devsite-404-links ul {
    -webkit-columns: var(--devsite-404-links-columns);
    -moz-columns: var(--devsite-404-links-columns);
    columns: var(--devsite-404-links-columns);
    -webkit-column-gap: 24px;
    -moz-column-gap: 24px;
    column-gap: 24px;
    list-style: none;
    padding: 0
}

.devsite-404-links li {
    margin: var(--devsite-404-links-item-margin,0 0 24px)
}

.devsite-offline .devsite-offline-suggestions {
    text-align: start
}

.devsite-offline .devsite-offline-suggestions h3,.devsite-offline .devsite-offline-suggestions ul {
    margin: 0
}

.devsite-offline h3 {
    font: 400 32px/48px var(--devsite-code-font-family)
}

.devsite-offline-reload {
    text-align: center
}

@media screen and (max-width: 840px) {
    .devsite-404,.devsite-offline {
        margin-top:40px
    }
}

body[embed] .devsite-book-nav-bg,body[embed] .devsite-book-nav-bg[fixed],body[embed] .devsite-book-nav-blur,body[embed] .devsite-book-nav-toggle,body[embed] .devsite-floating-action-buttons,body[embed] .devsite-sidebar,body[embed] devsite-book-nav,body[embed] devsite-feature-tooltip.devsite-page-bookmark-tooltip,body[embed] devsite-feedback[position=header],body[embed] devsite-footer-linkboxes,body[embed] devsite-footer-promos,body[embed] devsite-footer-utility,body[embed] devsite-header,body[embed] devsite-panel,body[embed] devsite-thumb-rating[position=header],body[embed] devsite-toc,body[ready][embed] .devsite-book-nav-bg,body[ready][embed] .devsite-book-nav-bg[fixed],body[ready][embed] .devsite-book-nav-blur,body[ready][embed] .devsite-book-nav-toggle,body[ready][embed] .devsite-floating-action-buttons,body[ready][embed] .devsite-sidebar,body[ready][embed] devsite-book-nav,body[ready][embed] devsite-feature-tooltip.devsite-page-bookmark-tooltip,body[ready][embed] devsite-feedback[position=header],body[ready][embed] devsite-footer-linkboxes,body[ready][embed] devsite-footer-promos,body[ready][embed] devsite-footer-utility,body[ready][embed] devsite-header,body[ready][embed] devsite-panel,body[ready][embed] devsite-thumb-rating[position=header],body[ready][embed] devsite-toc {
    display: none
}

body[layout=docs][embed] .devsite-article {
    box-shadow: none
}

body[layout=docs][embed] devsite-content {
    margin: 0
}

@media print {
    .prettyprint a,:link,:visited,a .atn,a .atv,a .com,a .dec,a .kwd,a .lit,a .pln,a .pun,a .str,a .tag,a .typ,a [class^=devsite-syntax-],a code,aside :link,aside :visited,body,code,h1,h1 code,h2,h2 code,h3,h3 code,h4,h4 code,h5,h5 code,h6,h6 code,html,pre,pre .atn,pre .atv,pre .com,pre .dec,pre .kwd,pre .lit,pre .pln,pre .pun,pre .str,pre .tag,pre .typ,pre [class^=devsite-syntax-],td,td code,th,th :link,th :visited,th code,var {
        color: #000!important;
        padding-left: 0!important;
        padding-right: 0!important
    }

    .beta,.caution,.deprecated,.dogfood,.experimental,.key-point,.key-term,.note,.objective,.preview,.special,.success,.tip,.warning,aside {
        color: #000!important;
        margin-left: 0!important;
        margin-right: 0!important;
        padding-left: 0!important;
        padding-right: 0!important
    }

    .beta a,.caution a,.deprecated a,.dogfood a,.experimental a,.key-point a,.key-term a,.note a,.objective a,.preview a,.special a,.success a,.tip a,.warning a,aside a {
        color: #000!important;
        margin-left: 0!important;
        margin-right: 0!important;
        padding-left: 0!important;
        padding-right: 0!important
    }

    #gc-wrapper {
        margin: 0!important
    }

    devsite-code {
        margin-left: 0!important;
        margin-right: 0!important;
        padding-left: 0!important;
        padding-right: 0!important
    }

    devsite-expandable>:not(.showalways):not(.exw-control):not(.exw-expanded-content):not(.expand-control) {
        display: block!important
    }

    :link,:visited {
        text-decoration: underline
    }

    .devsite-article-meta,.devsite-banner-confidential .button,.devsite-banner-translated .button,.devsite-book-nav-bg,.devsite-book-nav-blur,.devsite-book-nav-toggle,.devsite-code-buttons-container,.devsite-page-bookmark-tooltip,.devsite-sidebar,cloudx-jump-menu,devsite-book-nav,devsite-bookmark,devsite-concierge,devsite-cookie-notification-bar,devsite-feedback,devsite-footer-linkboxes,devsite-footer-promos,devsite-footer-utility,devsite-googler-buttons,devsite-header,devsite-recommendations,devsite-snackbar,devsite-thumb-rating {
        display: none!important
    }

    .devsite-article,.devsite-main-content,devsite-content {
        background: 0!important;
        border: 0!important;
        box-shadow: none!important;
        display: block!important;
        margin: 0!important;
        max-width: none!important;
        padding: 0!important;
        width: auto!important
    }

    .devsite-banner {
        margin-top: 0
    }

    .attempt-left,.attempt-right,.video-wrapper {
        float: none;
        margin: 16px 0
    }

    img,video {
        display: block!important;
        page-break-inside: avoid!important
    }

    .devsite-main-content a[href]:after {
        content: " (" attr(href) ")";
        display: inline-block;
        font: 14px/20px var(--devsite-primary-font-family);
        max-width: 100%;
        word-wrap: break-word
    }
}

@page {
    margin: .75in
}

.devsite-product-platform-row {
    margin: 8px 0;
    padding: 0 24px
}

.devsite-header-no-lower-tabs .devsite-product-platform-row {
    margin-top: -12px;
    padding-bottom: 24px
}

.devsite-platform-container {
    display: inline-block
}

.devsite-platform-container+.devsite-platform-container {
    margin-left: 16px
}

.devsite-platform-icon-container {
    background: var(--devsite-background-1);
    border-radius: 50%;
    height: 40px;
    margin: 0 auto;
    width: 40px
}

.devsite-platform-icon {
    color: var(--devsite-secondary-text-color);
    display: block;
    font-size: 24px;
    height: 24px;
    margin: 8px;
    width: 24px
}

@media screen and (max-width: 1000px) {
    div.devsite-collapsible-section,div.devsite-header-background {
        background-image:none
    }
}

@media screen and (max-width: 600px) {
    .devsite-product-platform-row {
        padding:0 16px
    }
}

.devsite-landing-row-cards .devsite-landing-row-item {
    border: var(--devsite-card-border);
    border-radius: var(--devsite-card-border-radius);
    box-shadow: var(--devsite-card-box-shadow);
    overflow: var(--devsite-card-overflow,hidden);
    position: relative
}

.devsite-landing-row-cards .devsite-landing-row-item,.devsite-landing-row-cards[background] .devsite-landing-row-item {
    --devsite-link-color: #1a73e8;
    --devsite-text-color: var(--devsite-primary-text-color)
}

.devsite-landing-row-cards .devsite-landing-row-item:not([background]) {
    background-color: var(--devsite-card-background)
}

body[theme] .devsite-landing-row-cards[background=theme] :link:not(.button),body[theme] .devsite-landing-row-cards[background=theme] :visited:not(.button) {
    color: var(--devsite-link-color)
}

.devsite-landing-row-cards .devsite-landing-row-column .devsite-landing-row-item {
    display: block
}

.devsite-landing-row-cards .devsite-landing-row-item[description-position] .devsite-landing-row-item-media+.devsite-landing-row-item-description {
    margin: 0
}

.devsite-landing-row-cards .devsite-landing-row-item-description {
    padding: 16px
}

.devsite-landing-row-cards .devsite-landing-row-item-buttons {
    padding-top: 16px
}

.devsite-landing-row-cards[background=theme] .devsite-landing-row-item-icon {
    color: var(--devsite-secondary-text-color)
}

.devsite-landing-row-cards .devsite-landing-row-item-no-media h3 {
    font: var(--devsite-h2-font);
    margin: 0 0 20px
}

.devsite-landing-row-cards.devsite-landing-row-1-up .devsite-landing-row-item-media {
    -webkit-box-flex: 1;
    -webkit-flex: 1 0;
    -moz-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    margin: 0
}

@media screen and (max-width: 840px) {
    .devsite-landing-row-cards.devsite-landing-row-1-up .devsite-landing-row-item {
        display:block
    }
}

@media screen and (max-width: 600px) {
    .devsite-landing-row-cards.devsite-landing-row-1-up .devsite-landing-row-item-media+.devsite-landing-row-item-description {
        margin:0;
        padding: 16px
    }
}

.devsite-landing-row-cta {
    text-align: center
}

.devsite-landing-row.devsite-landing-row-cta:not([background]) {
    background: var(--devsite-cta-background,var(--devsite-primary-color));
    color: var(--devsite-text-color,var(--devsite-inverted-text-color))
}

.devsite-landing-row.devsite-landing-row-cta .devsite-landing-row-item {
    display: block
}

.devsite-landing-row.devsite-landing-row-cta .devsite-landing-row-item-description {
    margin: 0 auto;
    max-width: 856px
}

.devsite-landing-row-cta.devsite-landing-row h2,.devsite-landing-row-cta.devsite-landing-row-large-headings .devsite-landing-row-item-description h3 {
    color: var(--devsite-text-color,var(--devsite-inverted-text-color))
}

.devsite-landing-row-cta h3 {
    font: var(--devsite-h1-font,400 34px/40px var(--devsite-primary-font-family));
    letter-spacing: var(--devsite-h1-letter-spacing);
    margin-bottom: 16px;
    text-decoration: inherit
}

.devsite-landing-row-cta h3 a:not(.button) {
    color: var(--devsite-text-color,var(--devsite-inverted-text-color))
}

.devsite-landing-row-cta h3+.devsite-landing-row-item-buttons {
    margin-top: 8px
}

@media screen and (max-width: 600px) {
    .devsite-landing-row-cta .devsite-landing-row-item-description {
        font:400 16px/24px var(--devsite-primary-font-family)
    }
}

.devsite-landing-row-header {
    background: var(--devsite-landing-row-header-background);
    border-radius: var(--devsite-landing-row-header-border-radius);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 auto;
    max-width: var(--devsite-landing-row-header-max-width);
    padding: var(--devsite-landing-row-header-padding)
}

.devsite-landing-row[header-position=left] .devsite-landing-row-header,.devsite-landing-row[header-position=right] .devsite-landing-row-header {
    display: block;
    margin: 0
}

.devsite-landing-row[header-position=left] .devsite-landing-row-header {
    grid-column: var(--devsite-landing-row-header-grid-column,1)
}

.devsite-landing-row[header-position=right] .devsite-landing-row-header {
    grid-column: var(--devsite-landing-row-header-grid-column,3);
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -moz-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

.devsite-landing-row[header-position=top] .devsite-landing-row-header+.devsite-landing-row-group {
    margin: var(--devsite-landing-row-group-margin,32px auto 0)
}

.devsite-landing-row-header-text {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
    -moz-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    margin: var(--devsite-landing-row-header-text-margin);
    max-width: var(--devsite-landing-row-header-text-max-width)
}

.devsite-landing-row-header-text>h2 {
    margin: 0
}

.devsite-landing-row-description {
    color: var(--devsite-text-color,var(--devsite-primary-text-color));
    font-family: var(--devsite-landing-row-description-font-family,var(--devsite-primary-font-family));
    font-size: var(--devsite-landing-row-description-font-size,18px);
    letter-spacing: var(--devsite-letter-spacing);
    line-height: var(--devsite-line-height,24px);
    max-width: var(--devsite-landing-row-description-max-width,856px)
}

[background] .devsite-landing-row-description {
    color: var(--devsite-text-color,var(--devsite-inverted-text-color))
}

.devsite-landing-row:not([background]):not([foreground]) .devsite-landing-row-description {
    color: var(--devsite-text-color,var(--devsite-heading-color,var(--devsite-secondary-text-color)))
}

h2+.devsite-landing-row-description {
    margin-top: var(--devsite-row-header-contents-gap,16px)
}

.devsite-landing-row-header-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    margin-block:0;margin-inline:0 auto}

.devsite-landing-row-header-centered .devsite-landing-row-header,.devsite-landing-row-header[icon-position=top] {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.devsite-landing-row-header-centered .devsite-landing-row-header-buttons,.devsite-landing-row-header[icon-position=top] .devsite-landing-row-header-buttons {
    margin-inline:0}

.devsite-landing-row-header-centered .devsite-landing-row-header {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

.devsite-landing-row-header-centered .devsite-landing-row-description {
    margin-left: auto;
    margin-right: auto
}

.devsite-landing-row-header-centered .devsite-landing-row-header-buttons {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.devsite-landing-row-header-centered .devsite-landing-row-header-buttons,.devsite-landing-row-header[icon-position=top] .devsite-landing-row-header-buttons,.devsite-landing-row[header-position=left] .devsite-landing-row-header-buttons,.devsite-landing-row[header-position=right] .devsite-landing-row-header-buttons {
    margin: var(--devsite-buttons-margin,24px 0 0)
}

@media screen and (max-width: 840px) {
    .devsite-landing-row-header+.devsite-landing-row-group {
        margin-top:32px
    }

    .devsite-landing-row-header {
        display: block
    }
}

@media screen and (max-width: 840px) {
    .devsite-landing-row-header-text+.devsite-landing-row-header-buttons {
        display:block;
        margin: 24px 0 0
    }
}

@media screen and (max-width: 600px) {
    .devsite-landing-row-header-text+.devsite-landing-row-header-buttons {
        margin:16px 0 0
    }
}

.devsite-landing-row-1-up .devsite-landing-row-item-description[icon-position=left],.devsite-landing-row-item-description[icon-position] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
}

.devsite-landing-row-item-description[icon-position=right] {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -moz-box-orient: horizontal;
    -moz-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.devsite-landing-row-item-description[icon-position=top] {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.devsite-landing-row-item-description[icon-position^=bottom] {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: column-reverse;
    -moz-box-orient: vertical;
    -moz-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse
}

.devsite-landing-row-header-icon-container,.devsite-landing-row-header-icon-container[background],.devsite-landing-row-item-icon-container,.devsite-landing-row-item-icon-container[background] {
    color: var(--devsite-foreground-color,var(--devsite-icon-color,var(--devsite-secondary-text-color)))
}

.devsite-landing-row-header-icon-container,.devsite-landing-row-item-icon-container {
    height: var(--devsite-icon-canvas-size);
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    -webkit-transition: background .2s,box-shadow .2s,color .2s;
    transition: background .2s,box-shadow .2s,color .2s;
    width: var(--devsite-icon-canvas-size)
}

.devsite-landing-row-header-icon-container {
    margin-block:var(--devsite-header-icon-canvas-margin-block,0 8px);margin-inline: var(--devsite-header-icon-canvas-margin-inline,0 20px)
}

.devsite-landing-row-item-icon-container {
    display: var(--devsite-icon-canvas-display,inherit);
    inset: var(--devsite-icon-canvas-inset);
    margin-block:var(--devsite-icon-canvas-margin-block,0 8px);margin-inline: var(--devsite-icon-canvas-margin-inline,0 20px);
    overflow: var(--devsite-icon-canvas-overflow);
    position: var(--devsite-icon-canvas-position)
}

.devsite-landing-row-item-description[icon-position=bottom] .devsite-landing-row-item-icon-container,.devsite-landing-row-item-description[icon-position=bottom]>a,.devsite-landing-row-item-description[icon-position=right] .devsite-landing-row-item-icon-container,.devsite-landing-row-item-description[icon-position=right]>a {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center
}

.devsite-landing-row-item-description[icon-position=bottom-right] .devsite-landing-row-item-icon-container,.devsite-landing-row-item-description[icon-position=bottom-right]>a {
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end
}

.devsite-landing-row-header-icon-container[background],.devsite-landing-row-item-icon-container[background] {
    background: var(--devsite-background-color,var(--devsite-primary-color,var(--devsite-primary-text-color)))
}

.devsite-landing-row-header-icon-container[background][foreground=theme],.devsite-landing-row-header-icon-container[foreground=theme],.devsite-landing-row-item-icon-container[background][foreground=theme],.devsite-landing-row-item-icon-container[foreground=theme] {
    color: var(--devsite-primary-color,var(--devsite-primary-text-color))
}

.devsite-landing-row :focus .devsite-landing-row-header-icon-container[background][foreground=theme],.devsite-landing-row :focus .devsite-landing-row-item-icon-container[background][foreground=theme],.devsite-landing-row :link .devsite-landing-row-header-icon-container[background][foreground=theme]:hover,.devsite-landing-row :link .devsite-landing-row-item-icon-container[background][foreground=theme]:hover {
    color: var(--devsite-primary-color,var(--devsite-primary-text-color))
}

.devsite-landing-row-header-icon,.devsite-landing-row-item-icon {
    aspect-ratio: 1;
    display: block
}

.devsite-landing-row-header-icon {
    font-size: var(--devsite-header-icon-size,var(--devsite-icon-size));
    height: var(--devsite-header-icon-size,var(--devsite-icon-size));
    margin-block:var(--devsite-header-icon-margin-block,0);margin-inline: var(--devsite-header-icon-margin-inline,0);
    width: var(--devsite-header-icon-size,var(--devsite-icon-size))
}

.devsite-landing-row-item-icon {
    font-size: var(--devsite-icon-size);
    height: var(--devsite-icon-size);
    margin-block:var(--devsite-icon-margin-block,0);margin-inline: var(--devsite-icon-margin-inline,4px 0);
    width: var(--devsite-icon-size)
}

.devsite-landing-row-item-centered [icon-position=top] .devsite-landing-row-item-icon-container,.devsite-landing-row-item-centered [icon-position=top]>a {
    margin-inline:auto}

.devsite-landing-row-header-icon-container[background],.devsite-landing-row-item-icon-container[background] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

[background] .devsite-landing-row-header-icon-container:not([foreground]),[background] .devsite-landing-row-item-icon-container:not([foreground]) {
    color: var(--devsite-icon-color,var(--devsite-inverted-text-color))
}

:focus .devsite-landing-row-header-icon-container,:focus .devsite-landing-row-item-icon-container,:link .devsite-landing-row-header-icon-container:hover,:link .devsite-landing-row-item-icon-container:hover {
    color: var(--devsite-link-color)
}

[foreground] .devsite-landing-row-item :focus .devsite-landing-row-item-icon-container,[foreground] .devsite-landing-row-item :link .devsite-landing-row-item-icon-container:hover,[foreground] :focus .devsite-landing-row-header-icon-container,[foreground] :link .devsite-landing-row-header-icon-container:hover {
    color: hsla(210,6%,63%,.5)
}

[background] .devsite-landing-row-item :focus .devsite-landing-row-item-icon-container,[background] .devsite-landing-row-item :link .devsite-landing-row-item-icon-container:hover,[background] :focus .devsite-landing-row-header-icon-container,[background] :link .devsite-landing-row-header-icon-container:hover {
    color: var(--devsite-icon-color-hover,var(--devsite-inverted-text-rgba))
}

:focus .devsite-landing-row-header-icon-container[background],:focus .devsite-landing-row-item-icon-container[background],:link .devsite-landing-row-header-icon-container[background]:hover,:link .devsite-landing-row-item-icon-container[background]:hover {
    color: var(--devsite-foreground-color,var(--devsite-icon-color,var(--devsite-secondary-text-color)));
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color)
}

[background] :focus .devsite-landing-row-header-icon-container[background],[background] :focus .devsite-landing-row-item-icon-container[background],[background] :link .devsite-landing-row-header-icon-container[background]:hover,[background] :link .devsite-landing-row-item-icon-container[background]:hover {
    color: var(--devsite-foreground-color,var(--devsite-icon-color,var(--devsite-inverted-text-color)));
    text-decoration: none
}

@media screen and (max-width: 840px) {
    .devsite-landing-row-item-description[icon-position^=bottom] {
        -webkit-box-orient:horizontal;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: row-reverse;
        -moz-box-orient: horizontal;
        -moz-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse
    }

    .devsite-landing-row-item-description[icon-position^=bottom] .devsite-landing-row-item-icon,.devsite-landing-row-item-description[icon-position^=bottom] .devsite-landing-row-item-icon-container,.devsite-landing-row-item-description[icon-position^=bottom]>a {
        -webkit-align-self: center;
        -ms-flex-item-align: center;
        align-self: center
    }
}

.devsite-landing-row-1-up .devsite-landing-row-item {
    display: var(--devsite-item-display,grid);
    grid-gap: var(--devsite-landing-row-item-gap);
    grid-template-columns: var(--devsite-1-up-grid-template-columns)
}

.devsite-landing-row-1-up.devsite-landing-row-hero .devsite-landing-row-item {
    -webkit-box-align: var(--devsite-hero-align-items,center);
    -webkit-align-items: var(--devsite-hero-align-items,center);
    -moz-box-align: var(--devsite-hero-align-items,center);
    -ms-flex-align: var(--devsite-hero-align-items,center);
    align-items: var(--devsite-hero-align-items,center)
}

.devsite-landing-row-1-up .devsite-landing-row-item-description,.devsite-landing-row-1-up .devsite-landing-row-item-media-left {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -moz-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

.devsite-landing-row-1-up .devsite-landing-row-item-media,.devsite-landing-row-1-up .devsite-landing-row-item-media-left+.devsite-landing-row-item-description {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -moz-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

.devsite-landing-row-1-up .devsite-landing-row-item-description {
    display: block;
    grid-column: 1/span 4
}

.devsite-landing-row-1-up .devsite-landing-row-item-media {
    grid-column: var(--devsite-media-grid-column,5/span 8);
    margin: 0
}

.devsite-landing-row-1-up .devsite-landing-row-item-media-left {
    grid-column: var(--devsite-media-left-grid-column,1/span 8)
}

.devsite-landing-row-1-up .devsite-landing-row-item-media-left+.devsite-landing-row-item-description {
    grid-column: 9/span 4
}

.devsite-landing-row.devsite-landing-row-1-up .devsite-landing-row-item-description {
    margin-top: 0
}

.devsite-landing-row-1-up .devsite-landing-row-item-no-media .devsite-landing-row-item-description {
    grid-column: var(--devsite-1-up-no-media-description-grid-column)
}

.devsite-landing-row-50 .devsite-landing-row-item-description {
    grid-column: 1/span 6
}

.devsite-landing-row-50 .devsite-landing-row-item-media {
    grid-column: var(--devsite-row-50-media-grid-column,7/span 6)
}

.devsite-landing-row-50 .devsite-landing-row-item-media-left {
    grid-column: var(--devsite-row-50-media-left-grid-column,1/span 6)
}

.devsite-landing-row-50 .devsite-landing-row-item-media-left+.devsite-landing-row-item-description {
    grid-column: 7/span 6
}

.devsite-landing-row-67 .devsite-landing-row-item-description {
    grid-column: var(--devsite-row-67-description-grid-column,1/span 8)
}

.devsite-landing-row-67 .devsite-landing-row-item-media {
    grid-column: var(--devsite-row-67-media-grid-column,9/span 4)
}

.devsite-landing-row-67 .devsite-landing-row-item-media-left {
    grid-column: var(--devsite-row-67-media-left-grid-column,1/span 4)
}

.devsite-landing-row-67 .devsite-landing-row-item-media-left+.devsite-landing-row-item-description {
    grid-column: var(--devsite-row-67-description-left-grid-column,5/span 8)
}

.devsite-landing-row-75 .devsite-landing-row-item-description {
    grid-column: 1/span 9
}

.devsite-landing-row-75 .devsite-landing-row-item-media {
    grid-column: var(--devsite-row-75-media-grid-column,10/span 3)
}

.devsite-landing-row-75 .devsite-landing-row-item-media-left {
    grid-column: var(--devsite-row-75-media-left-grid-column,1/span 3)
}

.devsite-landing-row-75 .devsite-landing-row-item-media-left+.devsite-landing-row-item-description {
    grid-column: 4/span 9
}

.devsite-landing-row-100 .devsite-landing-row-group,.devsite-landing-row-100 .devsite-landing-row-item-media {
    width: 100%
}

.devsite-landing-row-100 .devsite-landing-row-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.devsite-landing-row-100 .devsite-landing-row-item-media+.devsite-landing-row-item-description {
    margin-bottom: 32px
}

@media screen and (max-width: 840px) {
    .devsite-landing-row-1-up .devsite-landing-row-item-description,.devsite-landing-row-1-up .devsite-landing-row-item-media-left {
        grid-column:1;
        grid-row: 1;
        -webkit-box-ordinal-group: 2;
        -webkit-order: 1;
        -moz-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }

    .devsite-landing-row-1-up .devsite-landing-row-item-media-left+.devsite-landing-row-item-description,.devsite-landing-row-1-up .devsite-landing-row-item-media:not(.devsite-landing-row-item-media-left) {
        grid-column: 2
    }
}

@media screen and (max-width: 600px) {
    .devsite-landing-row-1-up .devsite-landing-row-item {
        display:var(--devsite-item-display,block)
    }
}

.devsite-landing-row-item-buttons {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -12px;
    padding-top: 8px
}

.devsite-landing-row-1-up.devsite-landing-row-hero .devsite-landing-row-item-buttons {
    padding-top: var(--devsite-landing-row-hero-buttons-padding-top,32px)
}

.devsite-landing-row-item-buttons .button {
    margin: 4px 4px 4px 12px
}

.devsite-landing-row-item-buttons .button>.material-icons {
    top: -1px
}

.devsite-landing-row-item-buttons .button-white:not(.button-raised),.devsite-landing-row-item-buttons .button-white:not(.button-raised)+.button-white:not(.button-raised) {
    margin: 0 4px
}

.devsite-landing-row-cta .devsite-landing-row-item-buttons {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 24px 0 0
}

p+.devsite-landing-row-item-buttons {
    margin-top: -8px
}

.devsite-landing-row-item-media {
    border-radius: var(--devsite-item-media-border-radius);
    height: var(--devsite-item-media-container-height);
    margin: var(--devsite-item-media-margin,0);
    min-width: 0;
    max-height: var(--devsite-item-media-max-height);
    overflow: var(--devsite-item-media-overflow);
    padding: var(--devsite-item-media-padding,0);
    width: var(--devsite-item-media-container-width)
}

.devsite-landing-row-item-code devsite-code {
    margin: 0
}

.devsite-landing-row-item-video {
    display: block;
    width: 100%
}

.devsite-landing-row-item-description {
    color: var(--devsite-text-color,inherit);
    max-width: var(--devsite-item-text-max-width);
    padding: var(--devsite-item-text-padding);
    text-align: var(--devsite-item-text-align)
}

.devsite-landing-row-item-media+.devsite-landing-row-item-description {
    margin: var(--devsite-item-description-margin,32px 0 0)
}

.devsite-landing-row-item[description-position=left] .devsite-landing-row-item-description,.devsite-landing-row-item[description-position=left] .devsite-landing-row-item-media,.devsite-landing-row-item[description-position=right] .devsite-landing-row-item-description,.devsite-landing-row-item[description-position=right] .devsite-landing-row-item-media {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 var(--devsite-item-media-width,calc(50% - 12px));
    -moz-box-flex: 0;
    -ms-flex: 0 0 var(--devsite-item-media-width,calc(50% - 12px));
    flex: 0 0 var(--devsite-item-media-width,calc(50% - 12px));
    margin: 0
}

.devsite-landing-row-item[description-position=left] .devsite-landing-row-item-media {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -moz-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

.devsite-landing-row-item[description-position=left] .devsite-landing-row-item-description {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -moz-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

.devsite-landing-row-item[background] .devsite-landing-row-item-description,.devsite-landing-row-item[background][description-position=left] .devsite-landing-row-item-description,.devsite-landing-row-item[background][description-position=right] .devsite-landing-row-item-description {
    padding: var(--devsite-item-description-padding,16px)
}

[dir=ltr] .devsite-landing-row-cards .devsite-landing-row-item[description-position=left] .devsite-landing-row-item-description,[dir=ltr] .devsite-landing-row-item[background][description-position=left] .devsite-landing-row-item-description {
    padding-right: 0
}

[dir=rtl] .devsite-landing-row-cards .devsite-landing-row-item[description-position=left] .devsite-landing-row-item-description,[dir=rtl] .devsite-landing-row-item[background][description-position=left] .devsite-landing-row-item-description {
    padding-left: 0
}

[dir=ltr] .devsite-landing-row-cards .devsite-landing-row-item[description-position=right] .devsite-landing-row-item-description,[dir=ltr] .devsite-landing-row-item[background][description-position=right] .devsite-landing-row-item-description {
    padding-left: 0
}

[dir=rtl] .devsite-landing-row-cards .devsite-landing-row-item[description-position=right] .devsite-landing-row-item-description,[dir=rtl] .devsite-landing-row-item[background][description-position=right] .devsite-landing-row-item-description {
    padding-right: 0
}

.devsite-landing-row-item[description-position=top] .devsite-landing-row-item-media {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -moz-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

.devsite-landing-row-item[description-position=top] .devsite-landing-row-item-description {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -moz-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

.devsite-landing-row-item[description-position=top] .devsite-landing-row-item-media+.devsite-landing-row-item-description {
    margin: var(--devsite-item-description-top-margin-override,var(--devsite-item-description-top-margin,0 0 32px))
}

.devsite-landing-row-item-body,.devsite-landing-row-item-description {
    -webkit-box-align: var(--devsite-item-description-align-items);
    -webkit-align-items: var(--devsite-item-description-align-items);
    -moz-box-align: var(--devsite-item-description-align-items);
    -ms-flex-align: var(--devsite-item-description-align-items);
    align-items: var(--devsite-item-description-align-items);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
    -moz-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: var(--devsite-item-description-height,auto);
    min-width: 0
}

.devsite-landing-row-item-body {
    display: var(--devsite-item-body-display,flex);
    grid: var(--devsite-item-body-grid);
    grid-gap: var(--devsite-item-body-grid-gap)
}

.devsite-landing-row-item-body h3 {
    grid-area: heading
}

.devsite-landing-row-item-buttons {
    grid-area: buttons;
    margin: var(--devsite-buttons-margin,auto 0 -8px);
    padding: var(--devsite-buttons-padding,8px 0 0)
}

[dir=ltr] .devsite-landing-row-item-buttons {
    margin-left: -12px
}

[dir=rtl] .devsite-landing-row-item-buttons {
    margin-right: -12px
}

.devsite-landing-row h3:first-child,.devsite-landing-row h3:first-of-type,.devsite-landing-row h4+p,.devsite-landing-row h4:first-child,.devsite-landing-row h5:first-child,.devsite-landing-row h6:first-child,.devsite-landing-row p:first-child,.devsite-landing-row-item-description h2,.devsite-landing-row-large-headings h3 {
    margin-top: 0
}

.devsite-landing-row-item-description-content {
    font: var(--devsite-description-content-font,inherit);
    grid-area: content
}

.devsite-landing-row-item-description-content>:last-child {
    margin-bottom: 0
}

.devsite-landing-row-item-centered .devsite-landing-row-item-description-content,.devsite-landing-row-item-centered h3 {
    text-align: center
}

.devsite-landing-row-item-centered .devsite-landing-row-item-buttons {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media screen and (max-width: 840px) {
    .devsite-landing-row-item[description-position] .devsite-landing-row-item-description,.devsite-landing-row-item[description-position] .devsite-landing-row-item-media {
        max-width:none
    }

    .devsite-landing-row-item[description-position] .devsite-landing-row-item-media {
        -webkit-align-self: var(--devsite-item-media-align-self);
        -ms-flex-item-align: var(--devsite-item-media-align-self);
        align-self: var(--devsite-item-media-align-self);
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -moz-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        margin: var(--devsite-item-media-margin,0);
        -webkit-box-ordinal-group: NaN;
        -webkit-order: var(--devsite-item-media-order,1);
        -moz-box-ordinal-group: NaN;
        -ms-flex-order: var(--devsite-item-media-order,1);
        order: var(--devsite-item-media-order,1);
        width: var(--devsite-item-media-width)
    }

    .devsite-landing-row-item[description-position] .devsite-landing-row-item-description {
        -webkit-box-ordinal-group: NaN;
        -webkit-order: var(--devsite-item-description-order,2);
        -moz-box-ordinal-group: NaN;
        -ms-flex-order: var(--devsite-item-description-order,2);
        order: var(--devsite-item-description-order,2)
    }

    .devsite-landing-row-item[description-position=top] .devsite-landing-row-item-media {
        -webkit-box-ordinal-group: 3;
        -webkit-order: 2;
        -moz-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }

    .devsite-landing-row-item[description-position=top] .devsite-landing-row-item-description {
        -webkit-box-ordinal-group: 2;
        -webkit-order: 1;
        -moz-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }

    [dir] .devsite-landing-row-cards .devsite-landing-row-item[description-position] .devsite-landing-row-item-description,[dir] .devsite-landing-row-item[background][description-position] .devsite-landing-row-item-description {
        padding: var(--devsite-item-description-padding,16px)
    }
}

@media screen and (max-width: 600px) {
    .devsite-landing-row-1-up .devsite-landing-row-item-media+.devsite-landing-row-item-description {
        margin:var(--devsite-item-description-margin,32px 0 0);
        padding: var(--devsite-item-description-padding,0)
    }
}

.devsite-landing-row-item-custom-image {
    aspect-ratio: 16/9
}

.devsite-landing-row-item-custom-image,.devsite-landing-row-item-custom-image-icon-wrapper {
    display: grid;
    place-content: center
}

.devsite-landing-row-item-custom-image:not([background]) {
    background-color: var(--devsite-background-color,var(--devsite-primary-color,var(--devsite-primary-text-color)))
}

.devsite-landing-row-item-custom-image[background=grey] {
    background: var(--devsite-background-color,var(--devsite-background-3))
}

.devsite-landing-row-item-custom-image[background=white] {
    background: var(--devsite-background-1)
}

.devsite-landing-row-item-custom-image-icon-container[background],.devsite-landing-row-no-image-background .devsite-landing-row-item-custom-image:not([background]) {
    background: 0
}

.devsite-landing-row-item-custom-image-icon {
    color: var(--devsite-inverted-text-color);
    font-size: var(--devsite-custom-image-icon-font-size);
    max-height: var(--devsite-custom-image-icon-max-height);
    width: var(--devsite-custom-image-icon-width)
}

.devsite-landing-row-item-custom-image[background=grey]:not([foreground]) .devsite-landing-row-item-custom-image-icon,.devsite-landing-row-item-custom-image[background=white]:not([foreground]) .devsite-landing-row-item-custom-image-icon {
    color: var(--devsite-icon-color,var(--devsite-secondary-text-color))
}

.devsite-landing-row-item-custom-image-icon.material-icons {
    opacity: .8
}

.devsite-landing-row-item-description-callout {
    font-weight: 700
}

.devsite-landing-row-item-description-feature {
    margin-top: 16px;
    position: relative
}

.devsite-landing-row-item-description-feature+.devsite-landing-row-item-description-feature {
    margin: 0
}

.devsite-landing-row-item-description-feature-link {
    border-bottom: var(--devsite-secondary-border);
    font-weight: 500;
    padding: 12px 0 11px
}

.devsite-landing-row-item-description-feature-tooltip {
    background: #455a64;
    color: hsla(0,0%,100%,.7);
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color);
    font: 14px/20px var(--devsite-primary-font-family);
    min-width: 200px;
    opacity: 0;
    padding: 24px;
    position: absolute;
    -webkit-transition: opacity .2s,visibility .2s;
    transition: opacity .2s,visibility .2s;
    visibility: hidden;
    width: 67%;
    z-index: 1020
}

.no-touch .devsite-landing-row-item-description-feature-link:hover+.devsite-landing-row-item-description-feature-tooltip {
    opacity: 1;
    visibility: visible
}

.devsite-landing-row-item-description-feature-tooltip:before {
    border-bottom: 8px solid #455a64;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    content: "";
    position: absolute;
    top: -8px
}

.devsite-landing-row-item-description-feature-tooltip h3,.devsite-landing-row-large-headings .devsite-landing-row-item-description-feature-tooltip h3 {
    color: #fff;
    font: 14px/20px var(--devsite-primary-font-family);
    margin-bottom: 8px;
    padding: 0
}

.devsite-landing-row-item-image {
    -webkit-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start;
    height: var(--devsite-item-image-container-height);
    -webkit-transform: var(--devsite-item-image-transform);
    transform: var(--devsite-item-image-transform);
    width: var(--devsite-item-image-container-width)
}

.devsite-landing-row-item-image:not([background]) {
    background: var(--devsite-background-4)
}

.devsite-landing-row-item-image img {
    min-width: var(--devsite-item-image-min-width);
    vertical-align: middle;
    width: var(--devsite-item-image-width,100%)
}

.devsite-landing-row-item-image a {
    display: block
}

.devsite-landing-row-no-image-background .devsite-landing-row-item-image:not([background]) {
    background: 0
}

.devsite-landing-row-item-list {
    padding: 0
}

.devsite-landing-row-item-description-content+.devsite-landing-row-item-list {
    margin-top: 32px
}

.devsite-landing-row-item-list-item {
    list-style: none
}

.devsite-landing-row-item-list-item-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.devsite-landing-row-item-list-item-content[icon-position=top] {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.devsite-landing-row-item-list-item-icon-container,.devsite-landing-row-item-list-item-icon-container[background] {
    color: var(--devsite-foreground-color,var(--devsite-icon-color,var(--devsite-secondary-text-color)))
}

.devsite-landing-row-item-list-item-icon-container {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    height: 40px;
    margin-block:0;margin-inline:0 20px;-webkit-transition: background .2s,box-shadow .2s,color .2s;
    transition: background .2s,box-shadow .2s,color .2s;
    width: 40px
}

.devsite-landing-row-item-list-item-icon {
    display: block;
    font-size: 32px;
    height: 32px;
    width: 32px
}

.devsite-landing-row-item-list-item-icon-container[background] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-background-color,var(--devsite-primary-color,var(--devsite-primary-text-color)));
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.devsite-landing-row-item-list-item-icon-container[background] .devsite-landing-row-item-list-item-icon {
    font-size: 24px;
    height: 24px;
    width: 24px
}

.devsite-landing-row-item-list h4 {
    font: 400 16px/20px var(--devsite-primary-font-family)
}

.devsite-landing-row .devsite-landing-row-item-list h4 {
    margin: 0 0 4px
}

.devsite-landing-row-item-list-item-description {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font: 400 14px/20px var(--devsite-primary-font-family);
    max-width: calc(100% - 40px)
}

@media screen and (max-width: 840px) {
    .devsite-landing-row-item-list-item-description {
        max-width:none
    }
}

.devsite-landing-row-item-list-item-description-content {
    padding: var(--devsite-landing-row-item-list-item-description-content-padding)
}

.devsite-landing-row-item-list-item:not(:last-child) .devsite-landing-row-item-list-item-description-content {
    margin-bottom: 24px
}

[background] :focus>.devsite-landing-row-item-list-item-icon-container,[background] :link>.devsite-landing-row-item-list-item-icon-container:hover {
    text-decoration: none
}

:focus .devsite-landing-row-item-list-item-content .devsite-landing-row-item-list-item-icon-container[foreground=theme],:link .devsite-landing-row-item-list-item-icon-container[foreground=theme]:hover {
    color: var(--devsite-icon-color-hover,var(--devsite-primary-color,var(--devsite-inverted-text-rgba)))
}

[foreground] :focus .devsite-landing-row-item-list-item-content .devsite-landing-row-item-list-item-icon-container,[foreground] :link .devsite-landing-row-item-list-item-content:hover .devsite-landing-row-item-list-item-icon-container {
    color: hsla(210,6%,63%,.5)
}

[background] :focus .devsite-landing-row-item-list-item-content .devsite-landing-row-item-list-item-icon-container,[background] :link .devsite-landing-row-item-list-item-content:hover .devsite-landing-row-item-list-item-icon-container {
    color: var(--devsite-icon-color-hover,var(--devsite-inverted-text-rgba))
}

:link .devsite-landing-row-item-list-item-description h4+p {
    color: var(--devsite-primary-text-color);
    text-decoration: none
}

[background] :link .devsite-landing-row-item-list-item-description h4+p {
    color: var(--devsite-text-color,var(--devsite-inverted-text-color))
}

:focus .devsite-landing-row-item-list-item-content .devsite-landing-row-item-list-item-icon-container[background],:link .devsite-landing-row-item-list-item-content:hover .devsite-landing-row-item-list-item-icon-container[background] {
    background: var(--devsite-inverted-text-rgba);
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color)
}

.devsite-landing-row :focus .devsite-landing-row-item-list-item-description>:first-child,[background] :link .devsite-landing-row-item-list-item-description>:first-child {
    text-decoration: underline
}

.devsite-landing-row-column>.devsite-landing-row-item:nth-of-type(n+2) {
    margin: 32px 0 0
}

.devsite-landing-row-item {
    -webkit-box-align: var(--devsite-item-align-items);
    -webkit-align-items: var(--devsite-item-align-items);
    -moz-box-align: var(--devsite-item-align-items);
    -ms-flex-align: var(--devsite-item-align-items);
    align-items: var(--devsite-item-align-items);
    border: var(--devsite-item-border);
    border-radius: var(--devsite-item-border-radius);
    display: var(--devsite-item-display,flex);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: var(--devsite-item-flex-direction,column);
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: var(--devsite-item-flex-direction,column);
    flex-direction: var(--devsite-item-flex-direction,column);
    gap: var(--devsite-item-gap);
    -webkit-box-pack: var(--devsite-item-justify-content);
    -webkit-justify-content: var(--devsite-item-justify-content);
    -moz-box-pack: var(--devsite-item-justify-content);
    -ms-flex-pack: var(--devsite-item-justify-content);
    justify-content: var(--devsite-item-justify-content);
    max-height: var(--devsite-item-max-height);
    max-width: 100%;
    position: var(--devsite-item-position,initial);
    z-index: var(--devsite-item-z-index,auto)
}

.devsite-landing-row-item[description-position=left],.devsite-landing-row-item[description-position=right] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.devsite-landing-row-column,.devsite-landing-row-item {
    -webkit-box-flex: 1;
    -webkit-flex: 1 0;
    -moz-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    min-width: 0
}

.devsite-landing-row-column>.devsite-landing-row-item {
    display: block
}

.devsite-landing-row-item-hidden {
    visibility: hidden
}

@media screen and (max-width: 840px) {
    .devsite-landing-row-item[description-position] {
        -webkit-box-orient:vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

@media screen and (max-width: 600px) {
    .devsite-landing-row-item[description-position=top] {
        display:-webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.devsite-landing-row-logos .devsite-landing-row-item-custom-image {
    aspect-ratio: unset;
    height: 96px
}

.devsite-landing-row-logos .devsite-landing-row-item-custom-image:not([background]) {
    background: 0
}

.devsite-landing-row-logos .devsite-landing-row-item-custom-image-icon {
    opacity: 1
}

.devsite-landing-row-logos .devsite-landing-row-item-description {
    margin: 0;
    text-align: center
}

@media screen and (max-width: 840px) {
    .devsite-landing-row-logos.devsite-landing-row-3-up .devsite-landing-row-group {
        grid-template-columns:repeat(3,1fr)
    }

    .devsite-landing-row-logos.devsite-landing-row-4-up .devsite-landing-row-group {
        grid-template-columns: repeat(4,1fr)
    }
}

@media screen and (max-width: 600px) {
    .devsite-landing-row-logos.devsite-landing-row-2-up .devsite-landing-row-group,.devsite-landing-row-logos.devsite-landing-row-4-up .devsite-landing-row-group,.devsite-landing-row-logos.devsite-landing-row[header-position] .devsite-landing-row-group {
        grid-template-columns:repeat(2,1fr)
    }
}

.devsite-landing-row-1-up.devsite-landing-row-marquee,.devsite-landing-row-1-up.devsite-landing-row-marquee[background] {
    padding: 0
}

.devsite-landing-row-1-up.devsite-landing-row-marquee .devsite-landing-row-header {
    margin: 0;
    padding: 40px 0 0
}

.devsite-landing-row-1-up.devsite-landing-row-marquee .devsite-landing-row-item-description,.devsite-landing-row-1-up.devsite-landing-row-marquee .devsite-landing-row-item-media {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center
}

.devsite-landing-row-1-up.devsite-landing-row-marquee .devsite-landing-row-item-media {
    margin: 0
}

.devsite-landing-row-1-up.devsite-landing-row-marquee .devsite-landing-row-item-image {
    background: 0
}

.devsite-landing-row-1-up.devsite-landing-row-marquee .devsite-landing-row-item-description {
    padding: 40px 0
}

@media screen and (max-width: 840px) {
    .devsite-landing-row-1-up.devsite-landing-row-marquee .devsite-landing-row-item {
        display:block
    }

    .devsite-landing-row-1-up.devsite-landing-row-marquee .devsite-landing-row-item-description,.devsite-landing-row-1-up.devsite-landing-row-marquee .devsite-landing-row-item-media {
        width: 100%
    }

    .devsite-landing-row-1-up.devsite-landing-row-marquee .devsite-landing-row-item-description,.devsite-landing-row-1-up.devsite-landing-row-marquee .devsite-landing-row-item-media-left+.devsite-landing-row-item-description {
        margin: 0
    }
}

.devsite-landing-row {
    color: var(--devsite-landing-row-color);
    overflow: var(--devsite-landing-row-overflow);
    margin: var(--devsite-landing-row-margin);
    max-width: var(--devsite-landing-row-max-width);
    padding: var(--devsite-landing-row-padding)
}

.devsite-landing-row:not([background]) {
    background-color: var(--devsite-background-1)
}

body[layout=docs] .devsite-landing-row:first-of-type {
    border-radius: var(--devsite-first-row-border-radius,2px 2px 0 0)
}

body[layout=docs] .devsite-landing-row:last-of-type {
    border-radius: var(--devsite-last-row-border-radius,0 0 2px 2px)
}

.devsite-landing-row:not([background]):not(.devsite-landing-row-cta)+.devsite-landing-row:not([background]):not(.devsite-landing-row-cta):not([class*=devsite-landing-row-padding-]),.devsite-landing-row[background=grey]:not(.devsite-landing-row-cta)+[background=grey]:not(.devsite-landing-row-cta):not([class*=devsite-landing-row-padding-]),.devsite-landing-row[background=theme]+[background=theme]:not(.devsite-landing-row-cta):not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=blue-grey]+[background=blue-grey]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=blue-grey-dark]+[background=blue-grey-dark]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=cyan]+[background=cyan]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=deep-orange]+[background=deep-orange]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=deep-purple]+[background=deep-purple]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=google-blue]+[background=google-blue]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=google-green]+[background=google-green]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=google-red]+[background=google-red]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=google-yellow]+[background=google-yellow]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=indigo]+[background=indigo]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=orange]+[background=orange]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=pink]+[background=pink]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=purple]+[background=purple]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=teal]+[background=teal]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=blue]+[background=blue]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=green]+[background=green]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=light-blue]+[background=light-blue]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=light-green]+[background=light-green]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=navy]+[background=navy]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row[background=pale-blue]+[background=pale-blue]:not([class*=devsite-landing-row-padding-]) {
    padding-top: 0
}

.devsite-landing-row:not([background])+.devsite-landing-row-cta:not([class*=devsite-landing-row-padding-]) {
    padding-top: 40px
}

.devsite-landing-row:not([background])+.devsite-landing-row-cta.devsite-landing-row-padding-small {
    padding-top: 32px
}

.devsite-landing-row:not([background])+.devsite-landing-row-cta.devsite-landing-row-padding-medium {
    padding-top: 64px
}

.devsite-landing-row:not([background])+.devsite-landing-row-cta.devsite-landing-row-padding-large {
    padding-top: 96px
}

.devsite-landing-row:not([background])+.devsite-landing-row-cta.devsite-landing-row-padding-xlarge {
    padding-top: 128px
}

.devsite-landing-row-inner {
    background-color: var(--devsite-landing-group-background-color);
    border-radius: var(--devsite-landing-group-border-radius);
    margin: var(--devsite-landing-group-margin,0 auto);
    max-width: var(--devsite-landing-group-max-width,1488px);
    padding: var(--devsite-landing-group-padding)
}

.devsite-landing-row-group,.devsite-landing-row-html {
    margin: 0 auto
}

.devsite-landing-row-group {
    background: var(--devsite-landing-row-group-background);
    border: var(--devsite-landing-row-group-border);
    border-radius: var(--devsite-landing-row-group-border-radius);
    display: grid;
    grid: var(--devsite-landing-row-group-grid);
    grid-auto-rows: var(--devsite-grid-auto-rows);
    grid-gap: var(--devsite-landing-row-item-gap);
    max-width: var(--devsite-landing-row-group-max-width);
    padding: var(--devsite-landing-row-group-padding)
}

.devsite-landing-row-1-up .devsite-landing-row-group {
    display: block
}

.devsite-landing-row[header-position=left] .devsite-landing-row-inner,.devsite-landing-row[header-position=right] .devsite-landing-row-inner {
    display: grid;
    grid: var(--devsite-landing-row-inner-grid,1fr/repeat(3,1fr));
    grid-gap: var(--devsite-landing-row-item-gap)
}

.devsite-landing-row[header-position=left] .devsite-landing-row-group {
    grid-column: var(--devsite-landing-row-group-grid-column,2/span 2)
}

.devsite-landing-row[header-position=right] .devsite-landing-row-group {
    grid-column: var(--devsite-landing-row-group-grid-column,1/span 2);
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -moz-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

@media screen and (max-width: 840px) {
    .devsite-landing-row[header-position] .devsite-landing-row-inner {
        display:block
    }

    .devsite-landing-row:not([background])+.devsite-landing-row-cta.devsite-landing-row-padding-large,.devsite-landing-row:not([background])+.devsite-landing-row-cta.devsite-landing-row-padding-medium,.devsite-landing-row:not([background])+.devsite-landing-row-cta.devsite-landing-row-padding-small,.devsite-landing-row:not([background])+.devsite-landing-row-cta.devsite-landing-row-padding-xlarge,.devsite-landing-row:not([background])+.devsite-landing-row-cta:not([class*=devsite-landing-row-padding-]) {
        padding-top: 24px
    }
}

@media screen and (max-width: 600px) {
    .devsite-landing-row:not([background])+.devsite-landing-row-cta.devsite-landing-row-padding-large,.devsite-landing-row:not([background])+.devsite-landing-row-cta.devsite-landing-row-padding-medium,.devsite-landing-row:not([background])+.devsite-landing-row-cta.devsite-landing-row-padding-small,.devsite-landing-row:not([background])+.devsite-landing-row-cta.devsite-landing-row-padding-xlarge,.devsite-landing-row:not([background])+.devsite-landing-row-cta:not([class*=devsite-landing-row-padding-]) {
        padding-top:16px
    }
}

@-webkit-keyframes androidAIPromptAnimatedBackground {
    0% {
        background-position: 0 0
    }

    to {
        background-position: 100% 0
    }
}

@keyframes androidAIPromptAnimatedBackground {
    0% {
        background-position: 0 0
    }

    to {
        background-position: 100% 0
    }
}

.devsite-toc .devsite-nav-title[href^="#ai-prompt__"]:after {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: url(../images/custom/android-ai-prompt-toc.svg) 50% 50%/25px 20px no-repeat;
    border-radius: 8px;
    content: "";
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 20px;
    margin: -4px 0 0 6px;
    padding: 2px 4px;
    width: 25px
}

.android-ai-prompt {
    -webkit-animation: androidAIPromptAnimatedBackground 20s linear infinite alternate;
    animation: androidAIPromptAnimatedBackground 20s linear infinite alternate;
    background: url(../images/custom/android-ai-prompt-gradient.svg) 0 0/200% 100% repeat-y;
    border-radius: 24px;
    margin: 56px 0;
    padding: 20px 4px 4px
}

.android-ai-prompt-inner {
    background-color: #fff;
    border-radius: 16px 16px 22px 22px;
    padding: 24px
}

@media screen and (max-width: 600px) {
    .android-ai-prompt-inner {
        position:relative
    }
}

.color-scheme--dark .android-ai-prompt-inner {
    background-color: #000
}

.android-ai-prompt .android-ai-prompt-section-title {
    --devsite-h2-font: 500 18px/28px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --devsite-h2-letter-spacing: 0;
    --devsite-h2-margin: 0 0 22px
}

@media screen and (max-width: 600px) {
    .android-ai-prompt-section-title {
        --devsite-h2-font:500 16px/24px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
        --devsite-h2-margin: 0 0 16px
    }
}

.android-ai-prompt .android-ai-prompt-section-title .material-icons {
    margin-right: 4px;
    vertical-align: text-bottom
}

.android-ai-prompt-title {
    --devsite-h3-font: 500 24px/32px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    -webkit-background-clip: text;
    background-clip: text;
    background-image: url(../images/custom/android-ai-prompt-gradient.svg);
    color: transparent
}

.color-scheme--dark .android-ai-prompt-title {
    background-image: none;
    color: #4fabff
}

.android-ai-prompt-buttons {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.android-ai-prompt-buttons .button {
    --devsite-button-border: 1px solid #dadce0;
    --devsite-button-border-hover: 1px solid #dadce0
}

.android-ai-prompt-buttons .icon-button {
    --devsite-button-padding: 0 11px
}

.android-ai-prompt-buttons .icon-button .material-icons {
    font-size: 24px;
    height: 24px;
    width: 24px
}

@media screen and (max-width: 600px) {
    .android-ai-prompt-help-button {
        position:absolute;
        right: 24px;
        top: 14px;
        width: auto
    }
}

.android-ai-prompt-buttons .icon-button .material-icons {
    --devsite-button-material-icon-margin-x: 0;
    margin: 0
}

.android-ai-prompt-text {
    white-space: normal
}

.android-callout.devsite-landing-row-1-up {
    --devsite-item-align-items: center
}

@media screen and (max-width: 600px) {
    .android-callout.devsite-landing-row-1-up {
        --devsite-item-description-order:1;
        --devsite-item-display: flex;
        --devsite-item-media-order: 2;
        --devsite-item-media-width: 100%
    }
}

.android-callout-centered {
    --devsite-display-font: 600 40px/48px var(--devsite-headline-font-family);
    --devsite-landing-row-description-font-size: 20px;
    --devsite-landing-row-group-margin: 40px auto 0;
    --devsite-landing-row-group-max-width: 824px;
    --devsite-landing-row-header-max-width: 824px;
    --devsite-letter-spacing: 0.25px;
    --devsite-line-height: 32px;
    --devsite-primary-font-family: Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif
}

@media screen and (max-width: 600px) {
    .android-callout-centered {
        --devsite-display-font:600 32px/40px var(--devsite-headline-font-family);
        --devsite-landing-row-description-font-size: 16px;
        --devsite-line-height: 24px
    }
}

.android-callout-centered .devsite-landing-row-header-icon-container+.devsite-landing-row-header-text {
    --devsite-landing-row-header-text-max-width: 610px;
    --devsite-landing-row-header-text-margin: auto
}

.android-case-study {
    --devsite-buttons-padding: 80px 0 0;
    --devsite-item-description-padding: 32px;
    --devsite-item-position: relative;
    --devsite-item-z-index: 0;
    --devsite-landing-row-group-grid: auto-flow/repeat(auto-fit,minmax(260px,1fr))
}

.android-case-study.devsite-landing-row-1-up {
    --devsite-description-content-font: 400 22px/28px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --devsite-h3-font: 600 32px/40px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif
}

.android-case-study.devsite-landing-row-2-up,.android-case-study.devsite-landing-row-3-up,.android-case-study.devsite-landing-row-4-up {
    --devsite-description-content-font: 400 16px/28px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --devsite-h3-font: 600 24px/32px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif
}

.android-case-study .devsite-landing-row-item:after {
    background: #d2e3fc;
    content: "";
    position: absolute;
    z-index: -1
}

.android-case-study.devsite-landing-row-1-up .devsite-landing-row-item:after,.android-case-study.devsite-landing-row-2-up .devsite-landing-row-item:after {
    border-radius: 24px 0 0 24px;
    bottom: 0;
    left: 0;
    top: 0;
    width: 104px
}

.android-case-study.devsite-landing-row-3-up .devsite-landing-row-item:after,.android-case-study.devsite-landing-row-4-up .devsite-landing-row-item:after {
    border-radius: 24px 24px 0 0;
    height: 100px;
    left: 0;
    right: 0;
    top: 0
}

.android-case-study .devsite-landing-row-item {
    background: #f8f9fa
}

.android-case-study .devsite-landing-row-item-description {
    --devsite-item-text-padding: 32px
}

.android-case-study.devsite-landing-row-3-up .devsite-landing-row-item-media,.android-case-study.devsite-landing-row-4-up .devsite-landing-row-item-media {
    border-radius: var(--devsite-item-media-border-radius) var(--devsite-item-media-border-radius) 0 0;
    height: 100px
}

.android-case-study.devsite-landing-row-3-up .devsite-landing-row-item-media+.devsite-landing-row-item-description,.android-case-study.devsite-landing-row-4-up .devsite-landing-row-item-media+.devsite-landing-row-item-description {
    margin-top: -100px
}

.android-case-study .devsite-landing-row-item-icon-container {
    --devsite-icon-canvas-size: 150px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.android-case-study.devsite-landing-row-1-up .devsite-landing-row-item-icon-container {
    --devsite-icon-canvas-margin-inline: 0 32px
}

.android-case-study.devsite-landing-row-2-up .devsite-landing-row-item-icon-container {
    --devsite-icon-canvas-margin-inline: 0 24px
}

.android-case-study.devsite-landing-row-3-up .devsite-landing-row-item-icon-container,.android-case-study.devsite-landing-row-4-up .devsite-landing-row-item-icon-container {
    --devsite-icon-canvas-margin-inline: auto
}

.android-case-study.devsite-landing-row-3-up .devsite-landing-row-item-description[icon-position],.android-case-study.devsite-landing-row-4-up .devsite-landing-row-item-description[icon-position] {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

@media screen and (min-width: 1001px) {
    .android-case-study.devsite-landing-row-1-up .devsite-landing-row-item-media,.android-case-study.devsite-landing-row-2-up .devsite-landing-row-item-media {
        --devsite-item-image-container-height:100%;
        --devsite-item-media-container-height: 100%;
        --devsite-item-media-container-width: 104px;
        border-radius: var(--devsite-item-media-border-radius) 0 0 var(--devsite-item-media-border-radius);
        bottom: 0;
        left: 0;
        position: absolute;
        top: 0;
        width: var(--devsite-item-media-container-width)
    }

    .android-case-study.devsite-landing-row-1-up .devsite-landing-row-item-media img,.android-case-study.devsite-landing-row-2-up .devsite-landing-row-item-media img {
        --devsite-item-image-min-width: auto;
        --devsite-item-image-width: auto;
        height: 100%;
        max-width: none;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    .android-case-study.devsite-landing-row-1-up .devsite-landing-row-item-description,.android-case-study.devsite-landing-row-2-up .devsite-landing-row-item-description {
        position: relative
    }
}

@media screen and (max-width: 1000px) {
    .android-case-study.devsite-landing-row-1-up .devsite-landing-row-item-media,.android-case-study.devsite-landing-row-2-up .devsite-landing-row-item-media {
        border-radius:var(--devsite-item-media-border-radius) var(--devsite-item-media-border-radius) 0 0;
        height: 100px
    }

    .android-case-study.devsite-landing-row-1-up .devsite-landing-row-item-media+.devsite-landing-row-item-description,.android-case-study.devsite-landing-row-2-up .devsite-landing-row-item-media+.devsite-landing-row-item-description {
        margin-top: -100px
    }

    .android-case-study.devsite-landing-row-2-up .devsite-landing-row-item:after {
        border-radius: 24px 24px 0 0;
        bottom: auto;
        height: 98px;
        right: 0;
        width: auto
    }

    .android-case-study.devsite-landing-row-2-up .devsite-landing-row-item-icon-container {
        --devsite-icon-canvas-margin-inline: auto
    }

    .android-case-study.devsite-landing-row-2-up .devsite-landing-row-item-description[icon-position] {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

@media screen and (max-width: 840px) {
    .android-case-study {
        --devsite-item-description-padding:24px
    }

    .android-case-study.devsite-landing-row-1-up {
        --devsite-description-content-font: 400 16px/24px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
        --devsite-h3-font: 600 24px/32px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif
    }

    .android-case-study.devsite-landing-row-1-up .devsite-landing-row-item-icon-container {
        --devsite-icon-canvas-margin-inline: 0 24px
    }
}

@media screen and (max-width: 600px) {
    .android-case-study.devsite-landing-row-1-up .devsite-landing-row-item:after {
        border-radius:24px 24px 0 0;
        bottom: auto;
        height: 98px;
        right: 0;
        width: auto
    }

    .android-case-study.devsite-landing-row-1-up .devsite-landing-row-item-icon-container {
        --devsite-icon-canvas-margin-inline: auto
    }

    .android-case-study.devsite-landing-row-1-up .devsite-landing-row-item-description[icon-position] {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .android-case-study .devsite-landing-row-item-description {
        --devsite-item-text-padding: 24px
    }
}

@media screen and (max-width: 840px) {
    .android-decorative-media .devsite-landing-row-item {
        display:block
    }

    .android-decorative-media .devsite-landing-row-item-media {
        display: none
    }

    .android-decorative-media .devsite-landing-row-item-media+.devsite-landing-row-item-description {
        margin: 0;
        padding: 16px 0 0
    }
}

.devsite-landing-row-hero.android-decorative-media {
    --devsite-item-media-margin: -18px 0
}

@media screen and (max-width: 1253px) {
    .devsite-landing-row-hero.android-decorative-media {
        --devsite-item-media-margin:0
    }
}

.android-design-system-docs .android-body-intro,.android-design-system-docs .android-body-paragraph,.android-design-system-docs .android-body-small,.android-design-system-docs .android-detail,.android-design-system-docs .android-eyebrow,.android-design-system-docs .android-headline-1,.android-design-system-docs .android-headline-2,.android-design-system-docs .android-headline-3,.android-design-system-docs .android-headline-4,.android-design-system-docs .android-headline-5,.android-design-system-docs .android-headline-6,.android-design-system-docs .android-subheading-1,.android-design-system-docs .android-subheading-2,.android-design-system-docs h1,.android-design-system-docs h2,.android-design-system-docs h3,.android-design-system-docs h4,.android-design-system-docs h5,.android-design-system-docs h6,.android-design-system-docs p {
    margin: 32px 0
}

.android-design-system-docs h1:first-of-type,.android-design-system-docs p:first-child {
    margin-top: 32px;
    top: 0
}

.android-design-system-docs .android-headline-1 {
    font: 700 64px/72px var(--devsite-headline-font-family);
    letter-spacing: -.5px
}

.android-design-system-docs .android-headline-2 {
    font: 600 48px/56px var(--devsite-headline-font-family);
    letter-spacing: -.5px
}

.android-design-system-docs .android-headline-3 {
    font: 600 40px/48px var(--devsite-headline-font-family);
    letter-spacing: -.5px
}

.android-design-system-docs .android-headline-4 {
    font: 600 32px/40px var(--devsite-headline-font-family);
    letter-spacing: -.25px
}

.android-design-system-docs .android-headline-5 {
    font: 500 24px/32px var(--devsite-headline-font-family)
}

.android-design-system-docs .android-headline-6 {
    font: 500 22px/28px var(--devsite-headline-font-family)
}

.android-design-system-docs .android-subheading-1 {
    font: 500 20px/28px var(--devsite-headline-font-family);
    letter-spacing: 0
}

.android-design-system-docs .android-subheading-2 {
    font: 500 18px/28px var(--devsite-headline-font-family);
    letter-spacing: 0
}

.android-design-system-docs .android-body-intro {
    font: 400 20px/32px var(--devsite-headline-font-family);
    letter-spacing: .25px
}

.android-design-system-docs .android-body-small {
    font: 400 14px/20px var(--devsite-primary-font-family)
}

.android-design-system-docs .android-eyebrow {
    font: 500 14px/20px var(--devsite-headline-font-family);
    letter-spacing: 1.5px;
    text-transform: uppercase
}

.android-design-system-docs .android-detail {
    font: 500 16px/24px var(--devsite-primary-font-family)
}

@media screen and (max-width: 840px) {
    .android-design-system-docs .android-headline-1 {
        font:700 48px/56px var(--devsite-headline-font-family);
        letter-spacing: -.5px
    }

    .android-design-system-docs .android-headline-2 {
        font: 600 40px/48px var(--devsite-headline-font-family);
        letter-spacing: -.5px
    }

    .android-design-system-docs .android-headline-3 {
        font: 600 32px/40px var(--devsite-headline-font-family);
        letter-spacing: -.25px
    }

    .android-design-system-docs .android-headline-4 {
        font: 600 24px/32px var(--devsite-headline-font-family);
        letter-spacing: 0
    }
}

@media screen and (max-width: 600px) {
    .android-design-system-docs .android-headline-1 {
        font:600 40px/48px var(--devsite-headline-font-family);
        letter-spacing: -.5px
    }

    .android-design-system-docs .android-subheading-2 {
        font: 500 16px/24px var(--devsite-headline-font-family)
    }

    .android-design-system-docs .android-body-intro {
        font: 400 16px/24px var(--devsite-headline-font-family)
    }

    .android-design-system-docs .android-detail {
        font: 500 14px/16px var(--devsite-primary-font-family)
    }
}

.android-docs-intro {
    border-bottom: 1px solid #dadce0;
    font: 400 20px/32px var(--devsite-headline-font-family);
    letter-spacing: .25px;
    margin-bottom: 80px;
    padding-bottom: 80px
}

@media screen and (max-width: 600px) {
    .android-docs-intro {
        font:400 16px/24px var(--devsite-headline-font-family)
    }
}

.android-dropdown-tab~.devsite-tabs-dropdown {
    --devsite-dropdown-content-display: grid;
    --devsite-dropdown-content-grid-template-columns: repeat(5,max-content);
    --devsite-dropdown-content-grid-template-rows: repeat(2,min-content)
}

.android-dropdown {
    --devsite-dropdown-column-box-sizing: content-box;
    --devsite-dropdown-column-max-width: 240px;
    --devsite-dropdown-column-padding: 32px 0 32px 32px;
    --devsite-dropdown-first-section-margin: 0;
    --devsite-dropdown-link-display: inline-block;
    --devsite-dropdown-section-padding: 0;
    --devsite-nav-description-color: #3c4043;
    --devsite-nav-description-font-size: 14px;
    --devsite-nav-description-line-height: 20px;
    --devsite-nav-description-margin: 8px 0 16px;
    --devsite-nav-description-white-space: normal;
    --devsite-nav-text-margin: 0;
    --devsite-nav-title-color: #202124;
    --devsite-nav-title-font: 18px/28px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --devsite-nav-title-font-weight: 500;
    --devsite-nav-item-title-display: inline-block;
    --devsite-nav-item-title-font: 500 16px/24px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --devsite-nav-item-title-letter-spacing: 0.5px;
    --devsite-nav-item-title-line-height: 24px;
    --devsite-nav-item-title-text-decoration-hover: underline;
    --devsite-upper-tab-dropdown-description: #3c4043;
    --devsite-upper-tab-dropdown-description-margin: 2px 0 6px;
    --devsite-upper-tab-dropdown-link: #3c4043;
    --devsite-upper-tab-dropdown-link-hover: #3c4043
}

.android-dropdown:nth-child(n+6) {
    --devsite-dropdown-column-border-top: 1px solid #dadce0
}

.android-dropdown-primary~.android-dropdown:nth-child(4n+2) {
    --devsite-dropdown-column-margin: 0 0 0 32px;
    --devsite-dropdown-column-padding: 32px 0
}

.android-dropdown-primary~.android-dropdown:nth-child(6n) {
    --devsite-dropdown-column-padding: 32px 0
}

.android-dropdown-primary:first-child:not(:last-child) {
    --devsite-dropdown-column-background: #f8f9fa;
    --devsite-dropdown-column-box-sizing: border-box;
    --devsite-dropdown-column-grid-row: 1/-1;
    --devsite-dropdown-column-max-width: 320px;
    --devsite-dropdown-column-padding: 24px;
    --devsite-nav-description-color: #000;
    --devsite-nav-description-margin: 16px 0 24px;
    --devsite-nav-title-color: #000;
    --devsite-nav-title-border-bottom: 0;
    --devsite-nav-title-font: 500 24px/32px var(--devsite-headline-font-family);
    --devsite-nav-title-font-weight: 600;
    --devsite-nav-title-padding: 0;
    --devsite-nav-title-transform: none;
    --devsite-nav-title-white-space: normal;
    --devsite-nav-item-title-font: 500 16px/24px var(--devsite-headline-font-family);
    --devsite-nav-item-title-letter-spacing: 0;
    --devsite-nav-item-title-line-height: 24px
}

.android-dropdown-primary:first-child:not(:last-child).android-dropdown-mad {
    --devsite-dropdown-column-background: url(../images/megamenu/heroes/mad.png) top center/320px 120px no-repeat #f8f9fa;
    --devsite-dropdown-column-padding: 140px 24px 24px
}

.android-dropdown-primary:first-child:not(:last-child).android-dropdown-material {
    --devsite-dropdown-column-background: url(../images/megamenu/heroes/material.svg) top center/320px 120px no-repeat #f8f9fa;
    --devsite-dropdown-column-padding: 140px 24px 24px
}

.android-dropdown-primary:first-child:not(:last-child).android-dropdown-studio {
    --devsite-dropdown-column-background: url(../images/megamenu/heroes/studio.png) top center/320px 120px no-repeat #f8f9fa;
    --devsite-dropdown-column-padding: 140px 24px 24px
}

.android-dropdown-primary:first-child:not(:last-child).android-dropdown-kit {
    --devsite-dropdown-column-background: url(../images/megamenu/heroes/kit.png) top center/320px 120px no-repeat #f8f9fa;
    --devsite-dropdown-column-padding: 140px 24px 24px
}

.android-dropdown-primary:first-child:not(:last-child).android-dropdown-ai {
    --devsite-dropdown-column-background: url(../images/megamenu/heroes/ai.svg) top center/320px 120px no-repeat #f8f9fa;
    --devsite-dropdown-column-padding: 140px 24px 24px
}

.android-dropdown-primary:first-child:not(:last-child).android-dropdown-play {
    --devsite-dropdown-column-background: url(../images/megamenu/heroes/play.svg) top center/320px 120px no-repeat #f8f9fa;
    --devsite-dropdown-column-padding: 140px 24px 24px
}

.android-dropdown-primary:first-child:not(:last-child).android-dropdown-blog {
    --devsite-dropdown-column-background: url(../images/megamenu/heroes/blog.png) top center/320px 120px no-repeat #f8f9fa;
    --devsite-dropdown-column-padding: 140px 24px 24px
}

.android-dropdown-primary:first-child:not(:last-child) .button-primary {
    --devsite-upper-tab-dropdown-link: #fff;
    --devsite-upper-tab-dropdown-link-hover: #202124;
    --devsite-nav-item-title-text-decoration-hover: none
}

.android-dropdown-primary:first-child:not(:last-child) .button-white {
    --devsite-upper-tab-dropdown-link: #174ea6;
    --devsite-upper-tab-dropdown-link-hover: #174ea6
}

.android-dropdown-primary:first-child:not(:last-child) .devsite-nav-title {
    --devsite-nav-text-margin: 0
}

.android-dropdown .devsite-nav-item {
    --devsite-nav-text-margin: 0 0 4px
}

.android-dropdown .devsite-nav-item:last-child {
    --devsite-nav-text-margin: 0
}

.android-dropdown .devsite-nav-title+.devsite-nav-item {
    --devsite-nav-text-margin: 24px 0 4px
}

.android-blog-categories-dropdown .devsite-nav-item .devsite-nav-item-title {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    padding-bottom: 8px
}

.android-blog-categories-dropdown .devsite-nav-item .devsite-nav-item-title:before {
    content: "";
    display: block;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    height: 24px;
    width: 36px
}

.android-blog-categories-dropdown .devsite-nav-item {
    --devsite-nav-text-margin: 0 0 32px
}

.android-blog-categories-dropdown .devsite-nav-title+.devsite-nav-item:has(.devsite-nav-item-description) {
    --devsite-nav-text-margin: 24px 0 32px
}

@media screen and (min-width: 1440px) {
    .android-dropdown-tab-blog~.devsite-tabs-dropdown .devsite-tabs-dropdown-content:not(:has(.android-blog-categories-dropdown:nth-child(5))) {
        --devsite-dropdown-content-grid-template-columns:repeat(4,minmax(0,350px))
    }

    .android-dropdown-tab-blog~.devsite-tabs-dropdown .devsite-tabs-dropdown-content:not(:has(.android-blog-categories-dropdown:nth-child(5))) .android-blog-categories-dropdown {
        --devsite-dropdown-column-max-width: 350px
    }

    .devsite-tabs-dropdown-column.android-dropdown-blog+.android-blog-categories-dropdown {
        --devsite-dropdown-column-margin: 0 0 0 43px
    }

    .android-blog-categories-dropdown .devsite-nav-title {
        min-height: 28px
    }

    .android-blog-categories-dropdown:not(:has(.devsite-nav-title)) .devsite-tabs-dropdown-section:before {
        content: "";
        display: block;
        margin-bottom: 24px;
        min-height: 28px
    }

    .android-blog-categories-dropdown .devsite-nav-item-description {
        height: 80px
    }
}

.android-dropdown-heading-link {
    --devsite-nav-item-title-font: 600 16px/20px var(--devsite-headline-font-family);
    --devsite-nav-item-title-letter-spacing: 0;
    --devsite-nav-item-title-margin: 0 0 8px 0;
    --devsite-upper-tab-dropdown-link: #174ea6;
    --devsite-upper-tab-dropdown-link-hover: #174ea6
}

.android-dropdown-supplementary-link {
    --devsite-nav-item-title-font: 500 14px/20px var(--devsite-headline-font-family);
    --devsite-nav-text-margin: 0 0 4px
}

.android-dropdown-section-icon {
    --devsite-nav-title-padding: 2px 0 2px 38px
}

.android-dropdown-section-icon-build-for-billions .devsite-nav-title {
    background: url(../images/megamenu/icons/build-for-billions.svg) no-repeat
}

.android-dropdown-section-icon-chat .devsite-nav-title {
    background: url(../images/megamenu/icons/chat.svg) no-repeat
}

.android-dropdown-section-icon-code .devsite-nav-title {
    background: url(../images/megamenu/icons/code.svg) no-repeat
}

.android-dropdown-section-icon-core-library .devsite-nav-title {
    background: url(../images/megamenu/icons/core-library.svg) 0 0/32px no-repeat
}

.android-dropdown-section-icon-design .devsite-nav-title {
    background: url(../images/megamenu/icons/design.svg) 0 0/32px no-repeat
}

.android-dropdown-section-icon-design-2 .devsite-nav-title {
    background: url(../images/megamenu/icons/design-2.svg) no-repeat
}

.android-dropdown-section-icon-devices .devsite-nav-title {
    background: url(../images/megamenu/icons/devices.svg) no-repeat
}

.android-dropdown-section-icon-earth .devsite-nav-title {
    background: url(../images/megamenu/icons/earth.svg) 0 0/32px no-repeat
}

.android-dropdown-section-icon-education .devsite-nav-title {
    background: url(../images/megamenu/icons/education.svg) no-repeat
}

.android-dropdown-section-icon-explore .devsite-nav-title {
    background: url(../images/megamenu/icons/explore.svg) no-repeat
}

.android-dropdown-section-icon-features-samples .devsite-nav-title {
    background: url(../images/megamenu/icons/features-samples.svg) no-repeat
}

.android-dropdown-section-icon-flag .devsite-nav-title {
    background: url(../images/megamenu/icons/flag.svg) 0 0/32px no-repeat
}

.android-dropdown-section-icon-game-controller .devsite-nav-title {
    background: url(../images/megamenu/icons/game-controller.svg) 0 0/32px no-repeat
}

.android-dropdown-section-icon-get-started .devsite-nav-title {
    background: url(../images/megamenu/icons/get-started.svg) no-repeat
}

.android-dropdown-section-icon-google-play .devsite-nav-title {
    background: url(../images/megamenu/icons/google-play.svg) 0 0/32px no-repeat
}

.android-dropdown-section-icon-guides .devsite-nav-title {
    background: url(../images/megamenu/icons/guides.svg) no-repeat
}

.android-dropdown-section-icon-idea .devsite-nav-title {
    background: url(../images/megamenu/icons/idea.svg) no-repeat
}

.android-dropdown-section-icon-launch .devsite-nav-title {
    background: url(../images/megamenu/icons/launch.svg) 0 0/32px no-repeat
}

.android-dropdown-section-icon-layout .devsite-nav-title {
    background: url(../images/megamenu/icons/layout.svg) 0 0/32px no-repeat
}

.android-dropdown-section-icon-metrics .devsite-nav-title {
    background: url(../images/megamenu/icons/metrics.svg) no-repeat
}

.android-dropdown-section-icon-multiple-screens .devsite-nav-title {
    background: url(../images/megamenu/icons/multiple-screens.svg) 0 0/32px no-repeat
}

.android-dropdown-section-icon-new .devsite-nav-title {
    background: url(../images/megamenu/icons/new.svg) no-repeat
}

.android-dropdown-section-icon-performance .devsite-nav-title {
    background: url(../images/megamenu/icons/performance.svg) no-repeat
}

.android-dropdown-section-icon-platform .devsite-nav-title {
    background: url(../images/megamenu/icons/platform.svg) 0 0/32px no-repeat
}

.android-dropdown-section-icon-play .devsite-nav-title {
    background: url(../images/megamenu/icons/play.svg) no-repeat
}

.android-dropdown-section-icon-policy .devsite-nav-title {
    background: url(../images/megamenu/icons/policy.svg) no-repeat
}

.android-dropdown-section-icon-quality .devsite-nav-title {
    background: url(../images/megamenu/icons/quality.svg) no-repeat
}

.android-dropdown-section-icon-reference .devsite-nav-title {
    background: url(../images/megamenu/icons/reference.svg) no-repeat
}

.android-dropdown-section-icon-screen .devsite-nav-title {
    background: url(../images/megamenu/icons/screen.svg) no-repeat
}

.android-dropdown-section-icon-security .devsite-nav-title {
    background: url(../images/megamenu/icons/security.svg) no-repeat
}

.android-dropdown-section-icon-security-2 .devsite-nav-title {
    background: url(../images/megamenu/icons/security-2.svg) no-repeat
}

.android-dropdown-section-icon-solutions .devsite-nav-title {
    background: url(../images/megamenu/icons/solutions.svg) no-repeat
}

.android-dropdown-section-icon-star .devsite-nav-title {
    background: url(../images/megamenu/icons/star.svg) no-repeat
}

.android-dropdown-section-icon-stars .devsite-nav-title {
    background: url(../images/megamenu/icons/stars.svg) 0 0/32px no-repeat
}

.android-dropdown-section-icon-testing .devsite-nav-title {
    background: url(../images/megamenu/icons/testing.svg) no-repeat
}

.android-dropdown-section-icon-tools-build .devsite-nav-title {
    background: url(../images/megamenu/icons/tools-build.svg) no-repeat
}

.android-dropdown-section-icon-tools .devsite-nav-title {
    background: url(../images/megamenu/icons/tools.svg) no-repeat
}

.android-dropdown-section-icon-tools-2 .devsite-nav-title {
    background: url(../images/megamenu/icons/tools-2.svg) 0 0/32px no-repeat
}

.android-dropdown-section-icon-ui-design .devsite-nav-title {
    background: url(../images/megamenu/icons/ui-design.svg) no-repeat
}

.android-dropdown-section-icon-vitals .devsite-nav-title {
    background: url(../images/megamenu/icons/vitals.svg) 0 0/32px no-repeat
}

.android-nav-icon-new-blog {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.android-nav-icon-new-blog:before {
    -webkit-animation: rotate-mask 5s linear .5s .9;
    animation: rotate-mask 5s linear .5s .9;
    background: url(../images/megamenu/icons/flower.svg) 50%/contain no-repeat;
    content: "";
    display: inline;
    height: 17px;
    width: 17px;
    -webkit-margin-end: 6px;
    -moz-margin-end: 6px;
    margin-inline-end:6px}

@-webkit-keyframes rotate-mask {
    0% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    10% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(95deg);
        transform: rotate(95deg)
    }

    15% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    25% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    35% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(185deg);
        transform: rotate(185deg)
    }

    40% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    50% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    60% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(275deg);
        transform: rotate(275deg)
    }

    65% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg)
    }

    75% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg)
    }

    85% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(365deg);
        transform: rotate(365deg)
    }

    90% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }

    to {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes rotate-mask {
    0% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    10% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(95deg);
        transform: rotate(95deg)
    }

    15% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    25% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    35% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(185deg);
        transform: rotate(185deg)
    }

    40% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    50% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    60% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(275deg);
        transform: rotate(275deg)
    }

    65% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg)
    }

    75% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg)
    }

    85% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(365deg);
        transform: rotate(365deg)
    }

    90% {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }

    to {
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

.android-nav-icon-product-news .devsite-nav-item-title:before {
    background: url(../images/megamenu/dac-blog/product-news-droid.png) 50%/contain no-repeat
}

.android-nav-icon-community .devsite-nav-item-title:before {
    background: url(../images/megamenu/dac-blog/community-droid.png) 50%/contain no-repeat
}

.android-nav-icon-how-tos .devsite-nav-item-title:before {
    background: url(../images/megamenu/dac-blog/how-tos-droid.png) 50%/contain no-repeat
}

.android-nav-icon-round-ups .devsite-nav-item-title:before {
    background: url(../images/megamenu/dac-blog/round-ups-droid.png) 50%/contain no-repeat
}

.android-nav-icon-case-studies .devsite-nav-item-title:before {
    background: url(../images/megamenu/dac-blog/case-studies-droid.png) 50%/contain no-repeat
}

.android-nav-icon-documentation .devsite-nav-item-title:before {
    background: url(../images/megamenu/dac-blog/documentation-droid.png) 50%/contain no-repeat
}

.android-nav-icon-events-and-programs .devsite-nav-item-title:before {
    background: url(../images/megamenu/dac-blog/events-and-programs-droid.png) 50%/contain no-repeat
}

.android-nav-icon-authors .devsite-nav-item-title:before {
    background: url(../images/megamenu/icons/pencils.svg) 50%/contain no-repeat
}

.android-nav-icon-latest .devsite-nav-item-title:before {
    background: url(../images/megamenu/icons/newsletter.svg) 50%/contain no-repeat
}

@media screen and (max-width: 1440px) {
    .android-dropdown-tab~.devsite-tabs-dropdown {
        --devsite-dropdown-content-grid-template-columns:1fr;
        --devsite-dropdown-content-padding: 0 0 32px;
        --devsite-dropdown-full-padding: 0 6px 6px;
        --devsite-dropdown-full-width: 260px;
        --devsite-nav-description-display: none;
        left: 0!important
    }

    .android-dropdown-tab~.devsite-tabs-dropdown .devsite-nav-title {
        --devsite-nav-text-margin: 0 0 16px
    }

    .android-dropdown,.android-dropdown-primary~.android-dropdown:nth-child(4n+2),.android-dropdown-primary~.android-dropdown:nth-child(6n) {
        --devsite-dropdown-column-margin: 0;
        --devsite-dropdown-column-padding: 32px 24px 0
    }

    .android-dropdown-primary:first-child:not(:last-child) {
        --devsite-dropdown-column-display: none
    }
}

.android-editorial-and-updates,.android-editorial-and-updates-cards {
    --devsite-item-media-border-radius: 24px 24px 0 0;
    --devsite-landing-row-item-gap: 56px 32px
}

@media screen and (max-width: 840px) {
    .android-editorial-and-updates,.android-editorial-and-updates-cards {
        --devsite-landing-row-item-gap:32px
    }
}

.android-editorial-and-updates .devsite-card-content>a,.android-editorial-and-updates h3>a,.android-editorial-and-updates-cards .devsite-card-content>a,.android-editorial-and-updates-cards h3>a {
    --devsite-heading-color: #202124;
    --devsite-link-color: #202124;
    --devsite-text-color: #202124
}

.android-editorial-and-updates .devsite-card-content>a:focus,.android-editorial-and-updates .devsite-card-content>a:hover,.android-editorial-and-updates h3>a:focus,.android-editorial-and-updates h3>a:hover,.android-editorial-and-updates-cards .devsite-card-content>a:focus,.android-editorial-and-updates-cards .devsite-card-content>a:hover,.android-editorial-and-updates-cards h3>a:focus,.android-editorial-and-updates-cards h3>a:hover {
    --devsite-background-text-decoration: none;
    --devsite-foreground-color: #174ea6;
    --devsite-heading-color: #174ea6;
    --devsite-link-color: #174ea6;
    --devsite-link-text-decoration-hover: none;
    --devsite-text-color: #174ea6
}

.android-editorial-and-updates-cards {
    --devsite-card-background: #fff;
    --devsite-card-border-radius: 24px;
    --devsite-card-border: 1px solid #dadce0;
    --devsite-card-content-padding: 24px
}

.android-editorial-and-updates-cards .devsite-landing-row-item {
    background: var(--devsite-card-background);
    border-radius: var(--devsite-card-border-radius);
    border: var(--devsite-card-border)
}

.android-editorial-and-updates-cards .devsite-landing-row-item-description {
    margin: var(--devsite-card-content-padding)
}

.android-editorial-and-updates-cards .devsite-card .android-fully-clickable {
    position: static
}

.android-editorial-and-updates-cards .devsite-card {
    position: relative;
    overflow: visible
}

.android-featured-code-2-up .devsite-landing-row-item-media,.android-featured-code-with-image-code .devsite-landing-row-item-media {
    --devsite-item-media-border-radius: 0 0 24px 24px
}

body:not([codelabs-content-type=paginated]) .android-featured-code devsite-code[dark-code],body:not([codelabs-content-type=paginated]) .android-featured-code-2-up devsite-code[dark-code],body:not([codelabs-content-type=paginated]) .android-featured-code-with-image-code devsite-code[dark-code] {
    --devsite-code-background: #2b2b2b;
    --devsite-code-comments-color: #80868b;
    --devsite-code-keywords-color: #d56e0c;
    --devsite-code-numbers-color: #6897bb;
    --devsite-code-strings-color: #6a8759;
    --devsite-code-types-color: #ffc66d
}

.android-featured-code devsite-code[dark-code] .devsite-syntax-na,.android-featured-code-2-up devsite-code[dark-code] .devsite-syntax-na,.android-featured-code-with-image-code devsite-code[dark-code] .devsite-syntax-na {
    --devsite-code-types-color: #9d75ab
}

.android-featured-code devsite-code[dark-code] .devsite-syntax-nd,.android-featured-code-2-up devsite-code[dark-code] .devsite-syntax-nd,.android-featured-code-with-image-code devsite-code[dark-code] .devsite-syntax-nd {
    --devsite-code-types-color: #bbb529
}

.android-featured-code {
    --devsite-h3-font: 600 40px/48px var(--devsite-headline-font-family);
    --devsite-landing-row-group-grid: 1fr/1fr 2fr;
    --devsite-landing-row-padding: 80px 64px 0;
    background: var(--devsite-background-1);
    margin: 0 auto;
    max-width: 1380px
}

.android-featured-code devsite-code {
    --devsite-code-border-radius: 24px
}

.android-featured-code .devsite-landing-row-item-code,.android-featured-code .devsite-landing-row-item-media,.android-featured-code devsite-code,.android-featured-code pre {
    height: 100%
}

.android-featured-code .devsite-landing-row-inner {
    --devsite-landing-group-padding: 40px;
    --devsite-background-color: #f8f9fa
}

@media screen and (max-width: 840px) {
    .android-featured-code {
        --devsite-h3-font:600 32px/40px var(--devsite-headline-font-family);
        --devsite-landing-row-group-grid: 1fr/1fr;
        --devsite-landing-row-padding: 80px 24px 0
    }

    .android-featured-code devsite-code {
        --devsite-code-border-radius: 0 0 24px 24px
    }

    .android-featured-code .devsite-landing-row-inner {
        border-radius: 24px;
        padding: 0
    }

    .android-featured-code .devsite-landing-row-item-no-media {
        padding: 32px 32px 0
    }
}

@media screen and (max-width: 600px) {
    .android-featured-code {
        --devsite-h3-font:600 32px/40px var(--devsite-headline-font-family)
    }
}

.devsite-book-nav-filter {
    --devsite-searchbox-inactive: #f1f3f4;
    --devsite-searchbox-placeholder: #5f6368
}

.android-featured-code-with-image {
    --devsite-item-description-padding: 32px;
    --devsite-item-image-width: auto;
    --devsite-landing-row-padding: 80px 0 0
}

.android-featured-code-with-image-overview {
    --devsite-card-overflow: visible;
    background: #f8f9fa
}

.android-featured-code-with-image-overview .devsite-landing-row-item-description {
    --devsite-item-text-padding: 32px
}

.android-featured-code-with-image-code devsite-code {
    --devsite-code-border-radius: 0 0 32px 32px;
    --devsite-code-padding-block: 32px;
    --devsite-code-padding-inline: 32px 360px
}

[dir=rtl] .android-featured-code-with-image-code devsite-code {
    --devsite-code-padding-inline: 360px 32px
}

.android-featured-code-with-image,.android-featured-code-with-image-overview {
    position: relative
}

.android-featured-code-with-image {
    z-index: 1
}

.android-featured-code-with-image-overview {
    border-radius: 32px 32px 0 0
}

.android-featured-code-with-image-code devsite-code pre {
    min-height: 350px
}

.android-featured-code-with-image .devsite-landing-row-item-image {
    inset-block: 32px auto;
    inset-inline: auto 32px;
    position: absolute
}

.android-featured-code-with-image .devsite-landing-row-item-image img {
    max-height: 500px
}

@media screen and (max-width: 840px) {
    .android-featured-code-with-image {
        --devsite-item-description-padding:24px;
        --devsite-item-media-padding: 24px
    }

    .android-featured-code-with-image-code devsite-code {
        --devsite-code-padding-block: 24px;
        --devsite-code-padding-inline: 24px
    }

    [dir=rtl] .android-featured-code-with-image-code devsite-code {
        --devsite-code-padding-inline: 24px
    }

    .android-featured-code-with-image,.android-featured-code-with-image-overview {
        position: static
    }

    .android-featured-code-with-image-code devsite-code pre {
        min-height: auto
    }

    .android-featured-code-with-image .devsite-landing-row-item-image {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -moz-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        position: static
    }

    .android-featured-code-with-image .devsite-landing-row-item-image img {
        max-height: 400px
    }
}

@media screen and (max-width: 600px) {
    .android-featured-code-with-image {
        --devsite-item-display:flex;
        --devsite-item-description-margin: 0;
        --devsite-item-description-order: 1;
        --devsite-item-description-padding: 24px 24px 0;
        --devsite-item-media-order: 2;
        --devsite-item-media-padding: 0 24px 24px
    }

    .android-featured-code-with-image .devsite-landing-row-item-image {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    .android-featured-code-with-image .devsite-landing-row-item-image img {
        max-height: 300px
    }
}

.android-featured-code-2-up {
    --devsite-item-border-radius: 24px;
    --devsite-item-description-top-margin: 0
}

.android-featured-code-2-up devsite-code {
    --devsite-code-border-radius: 0 0 24px 24px
}

.android-featured-code-2-up .devsite-landing-row-item {
    background: #f8f9fa
}

.android-featured-code-2-up .devsite-landing-row-item-description {
    padding: 24px
}

.android-grouped-resources {
    --devsite-grid-auto-rows: max-content
}

.android-grouped-resources [background] {
    --devsite-text-color: #fff
}

.android-grouped-resources [background=green] {
    --devsite-text-color: #000
}

.android-grouped-resources [background=light-blue],.android-grouped-resources [background=light-green],.android-grouped-resources [background=pale-blue] {
    --devsite-foreground-color: #000;
    --devsite-text-color: #000
}

.android-grouped-resources [background=light-blue]:focus-within,.android-grouped-resources [background=light-blue]:hover,.android-grouped-resources [background=light-green]:focus-within,.android-grouped-resources [background=light-green]:hover,.android-grouped-resources [background=pale-blue]:focus-within,.android-grouped-resources [background=pale-blue]:hover {
    --devsite-foreground-color: #174ea6
}

.android-grouped-resources [background=white] {
    --devsite-foreground-color: #202124;
    --devsite-text-color: #5f6368
}

.android-grouped-resources [background=white]:focus-within,.android-grouped-resources [background=white]:hover {
    --devsite-foreground-color: #174ea6
}

.android-grouped-resources .devsite-landing-row-item {
    --devsite-label-margin: 0 0 8px
}

.android-grouped-resources-item-full-width {
    grid-column: 1/span 2
}

@media screen and (max-width: 600px) {
    .android-grouped-resources-item-full-width {
        grid-column:auto
    }
}

[class*=android-grouped-resources-contained]:not([foreground]) .devsite-landing-row-header .devsite-landing-row-description {
    color: var(--devsite-primary-text-color)
}

[class*=android-grouped-resources-contained] .devsite-landing-row-item {
    --devsite-background-button-white-color: #174ea6;
    --devsite-buttons-padding: 24px 0 0;
    --devsite-h3-margin: 0 0 8px;
    --devsite-item-text-padding: 24px;
    --devsite-label-color: var(--devsite-secondary-text-color);
    --devsite-label-margin: 0 0 8px;
    --devsite-label-text-color: var(--devsite-secondary-text-color);
    --devsite-text-color: var(--devsite-secondary-text-color);
    background-color: var(--devsite-background-1)
}

[class*=android-grouped-resources-contained] .devsite-landing-row-item:hover h3 a {
    --devsite-link-color: var(--devsite-background-button-white-color);
    --devsite-link-text-decoration-hover: none
}

[class*=android-grouped-resources-uncontained]:not(.android-row-background-grey-900) .devsite-landing-row-header .devsite-landing-row-description {
    color: var(--devsite-primary-text-color)
}

[class*=android-grouped-resources-uncontained] .devsite-landing-row-item {
    --devsite-background-button-white-color: #174ea6;
    --devsite-h3-font: var(--android-headline-5-font);
    --devsite-h3-margin: 0 0 8px;
    --devsite-item-text-padding: 24px;
    --devsite-label-margin: 0 0 8px
}

[class*=android-grouped-resources-uncontained] .devsite-landing-row-item:hover h3 a {
    --devsite-link-color: var(--devsite-background-button-white-color);
    --devsite-link-text-decoration-hover: none
}

[class*=android-grouped-resources-uncontained] .devsite-landing-row-item .devsite-landing-row-item-description {
    color: var(--devsite-primary-text-color)
}

.android-guides {
    --devsite-card-border: 1px solid #e8eaed;
    --devsite-card-border-radius: 24px;
    --devsite-card-content-padding: 24px
}

.android-illustrated-resources-index {
    --devsite-h3-font: 600 32px/40px var(--devsite-headline-font-family);
    --devsite-item-border: 1px solid #dadce0;
    --devsite-item-description-padding: 40px;
    --devsite-item-text-padding: 40px;
    --devsite-landing-row-group-grid: auto-flow/repeat(auto-fit,minmax(260px,1fr))
}

@media screen and (max-width: 840px) {
    .android-illustrated-resources-index {
        --devsite-h3-font:600 24px/32px var(--devsite-headline-font-family);
        --devsite-item-description-padding: 24px;
        --devsite-item-text-padding: 24px
    }
}

.android-illustrated-resources-index [icon-position=bottom-right] [size=xlarge] {
    --devsite-icon-canvas-margin-block: 16px -16px;
    --devsite-icon-canvas-margin-inline: -16px
}

@media screen and (max-width: 840px) {
    .android-illustrated-resources-index [icon-position=bottom-right] [size=xlarge] {
        --devsite-icon-canvas-margin-block:0;
        --devsite-icon-canvas-margin-inline: 12px -12px
    }
}

.android-illustrated-resources-index .devsite-landing-row-item,.android-illustrated-resources-index .devsite-landing-row-item[background] {
    --devsite-background-button-background: transparent;
    --devsite-background-button-background-hover: #000;
    --devsite-background-button-border-color: #000;
    --devsite-background-button-border-color-hover: #000;
    --devsite-background-button-primary-background: #000;
    --devsite-background-button-primary-background-hover: #dadce0;
    --devsite-background-button-primary-color: #fff;
    --devsite-background-button-primary-color-hover: #000;
    --devsite-background-button-white-color: #174ea6;
    --devsite-background-color: #fff;
    --devsite-button-background-hover: #000;
    --devsite-button-color-hover: #fff;
    --devsite-button-primary-background-hover: #dadce0;
    --devsite-button-white-color: #174ea6;
    --devsite-foreground-button-color: #000;
    --devsite-foreground-button-color-hover: #fff;
    --devsite-foreground-button-white-color: #174ea6;
    --devsite-foreground-color: #000;
    --devsite-heading-color: #000;
    --devsite-text-color: #000
}

.android-illustrated-resources-index .devsite-landing-row-item:not([background]) {
    background-color: #fff
}

.android-grouped-resources-uncontained--primary,.android-illustrated-resources-primary {
    --devsite-buttons-padding: 24px 0 0;
    --devsite-h3-font: 600 32px/40px var(--devsite-headline-font-family);
    --devsite-item-description-padding: 32px;
    --devsite-item-text-padding: 32px;
    --devsite-landing-row-group-grid: auto-flow/repeat(auto-fit,minmax(260px,1fr))
}

@media screen and (max-width: 840px) {
    .android-grouped-resources-uncontained--primary,.android-illustrated-resources-primary {
        --devsite-item-description-padding:24px;
        --devsite-item-text-padding: 24px
    }
}

.android-grouped-resources-uncontained--primary .devsite-landing-row-item,.android-illustrated-resources-primary .devsite-landing-row-item,.android-illustrated-resources-primary .devsite-landing-row-item[background],.android-illustrated-resources-primary.android-row-background-grey-900 .devsite-landing-row-item h3 a,.android-illustrated-resources-primary.android-row-background-grey-900 .devsite-landing-row-item-description,.android-row-background-grey-900.android-grouped-resources-uncontained--primary .devsite-landing-row-item h3 a,.android-row-background-grey-900.android-grouped-resources-uncontained--primary .devsite-landing-row-item-description {
    --devsite-background-button-background: transparent;
    --devsite-background-button-background-hover: #000;
    --devsite-background-button-border-color: #000;
    --devsite-background-button-border-color-hover: #000;
    --devsite-background-button-primary-background: #000;
    --devsite-background-button-primary-background-hover: #fff;
    --devsite-background-button-primary-color: #fff;
    --devsite-background-button-primary-color-hover: #000;
    --devsite-background-button-white-color: #174ea6;
    --devsite-background-color: #d2e3fc;
    --devsite-button-background-hover: #000;
    --devsite-button-border: 2px solid #202124;
    --devsite-button-border-hover: 2px solid #202124;
    --devsite-button-color: #202124;
    --devsite-button-color-hover: #fff;
    --devsite-button-primary-background-hover: #fff;
    --devsite-button-white-color: #174ea6;
    --devsite-foreground-button-color: #000;
    --devsite-foreground-button-color-hover: #fff;
    --devsite-foreground-button-white-color: #174ea6;
    --devsite-foreground-color: #202124;
    --devsite-heading-color: #202124;
    --devsite-link-color: #202124;
    --devsite-text-color: #3c4043
}

.color-scheme--dark .android-grouped-resources-uncontained--primary .devsite-landing-row-item,.color-scheme--dark .android-illustrated-resources-primary .devsite-landing-row-item,.color-scheme--dark .android-illustrated-resources-primary .devsite-landing-row-item[background],.color-scheme--dark .android-illustrated-resources-primary.android-row-background-grey-900 .devsite-landing-row-item h3 a,.color-scheme--dark .android-illustrated-resources-primary.android-row-background-grey-900 .devsite-landing-row-item-description,.color-scheme--dark .android-row-background-grey-900.android-grouped-resources-uncontained--primary .devsite-landing-row-item h3 a,.color-scheme--dark .android-row-background-grey-900.android-grouped-resources-uncontained--primary .devsite-landing-row-item-description {
    --android-link-color-hover: #aecbfa;
    --devsite-button-background-hover: #fff;
    --devsite-button-border: 2px solid #fff;
    --devsite-button-border-hover: 2px solid #fff;
    --devsite-button-color: #fff;
    --devsite-button-white-color: #aecbfa;
    --devsite-button-color-hover: #000;
    --devsite-text-color: #f8f9fa;
    --devsite-label-color: #dadce0;
    --devsite-label-text-color: #dadce0;
    --devsite-link-color: #fff
}

.android-grouped-resources-uncontained--primary .devsite-landing-row-item:not([background]),.android-illustrated-resources-primary .devsite-landing-row-item:not([background]) {
    background-color: #d2e3fc
}

.android-grouped-resources-uncontained--secondary,.android-illustrated-resources-secondary {
    --devsite-h3-font: 600 32px/40px var(--devsite-headline-font-family);
    --devsite-item-description-padding: 32px;
    --devsite-item-text-padding: 32px;
    --devsite-landing-row-group-grid: auto-flow/repeat(auto-fit,minmax(260px,1fr))
}

@media screen and (max-width: 840px) {
    .android-grouped-resources-uncontained--secondary,.android-illustrated-resources-secondary {
        --devsite-item-description-padding:24px;
        --devsite-item-text-padding: 24px
    }
}

.android-grouped-resources-uncontained--secondary [size=medium],.android-illustrated-resources-secondary [size=medium] {
    --devsite-icon-canvas-margin-block: 0 24px
}

.android-grouped-resources-uncontained--secondary .devsite-landing-row-item,.android-illustrated-resources-secondary .devsite-landing-row-item,.android-illustrated-resources-secondary .devsite-landing-row-item[background],.android-illustrated-resources-secondary.android-row-background-grey-900 .devsite-landing-row-item h3 a,.android-illustrated-resources-secondary.android-row-background-grey-900 .devsite-landing-row-item-description,.android-row-background-grey-900.android-grouped-resources-uncontained--secondary .devsite-landing-row-item h3 a,.android-row-background-grey-900.android-grouped-resources-uncontained--secondary .devsite-landing-row-item-description {
    --devsite-background-button-background: transparent;
    --devsite-background-button-background-hover: #000;
    --devsite-background-button-border-color: #000;
    --devsite-background-button-border-color-hover: #000;
    --devsite-background-button-primary-background: #000;
    --devsite-background-button-primary-background-hover: #fff;
    --devsite-background-button-primary-color: #fff;
    --devsite-background-button-primary-color-hover: #000;
    --devsite-background-button-white-color: #174ea6;
    --devsite-background-color: #ceead6;
    --devsite-button-background-hover: #000;
    --devsite-button-border: 2px solid #202124;
    --devsite-button-border-hover: 2px solid #202124;
    --devsite-button-color: #202124;
    --devsite-button-color-hover: #fff;
    --devsite-button-primary-background-hover: #fff;
    --devsite-button-white-color: #174ea6;
    --devsite-foreground-button-color: #000;
    --devsite-foreground-button-color-hover: #fff;
    --devsite-foreground-button-white-color: #174ea6;
    --devsite-foreground-color: #202124;
    --devsite-heading-color: #202124;
    --devsite-link-color: #202124;
    --devsite-text-color: #3c4043
}

.color-scheme--dark .android-grouped-resources-uncontained--secondary .devsite-landing-row-item,.color-scheme--dark .android-illustrated-resources-secondary .devsite-landing-row-item,.color-scheme--dark .android-illustrated-resources-secondary .devsite-landing-row-item[background],.color-scheme--dark .android-illustrated-resources-secondary.android-row-background-grey-900 .devsite-landing-row-item h3 a,.color-scheme--dark .android-illustrated-resources-secondary.android-row-background-grey-900 .devsite-landing-row-item-description,.color-scheme--dark .android-row-background-grey-900.android-grouped-resources-uncontained--secondary .devsite-landing-row-item h3 a,.color-scheme--dark .android-row-background-grey-900.android-grouped-resources-uncontained--secondary .devsite-landing-row-item-description {
    --android-link-color-hover: #aecbfa;
    --devsite-button-background-hover: #fff;
    --devsite-button-border: 2px solid #fff;
    --devsite-button-border-hover: 2px solid #fff;
    --devsite-button-color: #fff;
    --devsite-button-white-color: #aecbfa;
    --devsite-button-color-hover: #000;
    --devsite-text-color: #f8f9fa;
    --devsite-label-color: #dadce0;
    --devsite-label-text-color: #dadce0;
    --devsite-link-color: #fff
}

.android-grouped-resources-uncontained--secondary .devsite-landing-row-item:not([background]),.android-illustrated-resources-secondary .devsite-landing-row-item:not([background]) {
    background-color: #ceead6
}

.android-illustrated-resources-secondary-small {
    --devsite-h3-font: 500 22px/28px var(--devsite-headline-font-family);
    --devsite-h3-margin: 0 0 8px;
    --devsite-item-description-padding: 32px;
    --devsite-item-text-padding: 32px;
    --devsite-landing-row-group-grid: auto-flow/repeat(auto-fit,minmax(260px,1fr))
}

@media screen and (max-width: 840px) {
    .android-illustrated-resources-secondary-small {
        --devsite-item-description-padding:24px;
        --devsite-item-text-padding: 24px
    }
}

.android-illustrated-resources-secondary-small .devsite-landing-row-item,.android-illustrated-resources-secondary-small .devsite-landing-row-item[background],.android-illustrated-resources-secondary-small.android-row-background-grey-900 .devsite-landing-row-item h3 a,.android-illustrated-resources-secondary-small.android-row-background-grey-900 .devsite-landing-row-item-description {
    --devsite-background-button-background: transparent;
    --devsite-background-button-background-hover: #000;
    --devsite-background-button-border-color: #000;
    --devsite-background-button-border-color-hover: #000;
    --devsite-background-button-primary-background: #000;
    --devsite-background-button-primary-background-hover: #fff;
    --devsite-background-button-primary-color: #fff;
    --devsite-background-button-primary-color-hover: #000;
    --devsite-background-button-white-color: #174ea6;
    --devsite-background-color: #ceead6;
    --devsite-button-background-hover: #000;
    --devsite-button-color-hover: #fff;
    --devsite-button-primary-background-hover: #fff;
    --devsite-button-white-color: #174ea6;
    --devsite-foreground-button-color: #000;
    --devsite-foreground-button-color-hover: #fff;
    --devsite-foreground-button-white-color: #174ea6;
    --devsite-foreground-color: #202124;
    --devsite-heading-color: #202124;
    --devsite-link-color: #202124;
    --devsite-text-color: #3c4043
}

.color-scheme--dark .android-illustrated-resources-secondary-small .devsite-landing-row-item,.color-scheme--dark .android-illustrated-resources-secondary-small .devsite-landing-row-item[background],.color-scheme--dark .android-illustrated-resources-secondary-small.android-row-background-grey-900 .devsite-landing-row-item h3 a,.color-scheme--dark .android-illustrated-resources-secondary-small.android-row-background-grey-900 .devsite-landing-row-item-description {
    --android-link-color-hover: #aecbfa;
    --devsite-text-color: #f8f9fa;
    --devsite-label-color: #dadce0;
    --devsite-label-text-color: #dadce0;
    --devsite-link-color: #fff
}

.android-illustrated-resources-secondary-small .devsite-landing-row-item:not([background]) {
    background-color: #ceead6
}

.android-illustrated-resources-secondary-small .devsite-landing-row-item a:focus,.android-illustrated-resources-secondary-small .devsite-landing-row-item a:hover,.android-illustrated-resources-secondary-small .devsite-landing-row-item[background] a:focus,.android-illustrated-resources-secondary-small .devsite-landing-row-item[background] a:hover {
    --devsite-foreground-color: #174ea6;
    --devsite-link-color: #174ea6;
    --devsite-link-text-decoration-hover: none;
    --devsite-text-color: #174ea6
}

.android-illustrated-resources-secondary-small .android-fully-clickable:focus h3 a,.android-illustrated-resources-secondary-small .android-fully-clickable:hover h3 a,.android-illustrated-resources-secondary-small .android-fully-clickable[background]:focus h3 a,.android-illustrated-resources-secondary-small .android-fully-clickable[background]:hover h3 a {
    --devsite-foreground-color: #174ea6;
    --devsite-link-color: #174ea6;
    --devsite-link-text-decoration-hover: none;
    --devsite-text-color: #174ea6
}

.color-scheme--dark .android-illustrated-resources-secondary-small .android-fully-clickable:focus h3 a,.color-scheme--dark .android-illustrated-resources-secondary-small .android-fully-clickable:hover h3 a,.color-scheme--dark .android-illustrated-resources-secondary-small .android-fully-clickable[background]:focus h3 a,.color-scheme--dark .android-illustrated-resources-secondary-small .android-fully-clickable[background]:hover h3 a {
    --devsite-link-color: #aecbfa
}

.android-grouped-resources-uncontained--tertiary,.android-illustrated-resources-tertiary {
    --devsite-h3-font: 500 24px/32px var(--devsite-headline-font-family);
    --devsite-item-description-padding: 32px;
    --devsite-item-text-padding: 32px;
    --devsite-landing-row-group-grid: auto-flow/repeat(auto-fit,minmax(260px,1fr))
}

@media screen and (max-width: 840px) {
    .android-grouped-resources-uncontained--tertiary,.android-illustrated-resources-tertiary {
        --devsite-item-description-padding:24px;
        --devsite-item-text-padding: 24px
    }
}

.android-grouped-resources-uncontained--tertiary .devsite-landing-row-item,.android-illustrated-resources-tertiary .devsite-landing-row-item,.android-illustrated-resources-tertiary .devsite-landing-row-item[background],.android-illustrated-resources-tertiary.android-row-background-grey-900 .devsite-landing-row-item h3 a,.android-illustrated-resources-tertiary.android-row-background-grey-900 .devsite-landing-row-item-description,.android-row-background-grey-900.android-grouped-resources-uncontained--tertiary .devsite-landing-row-item h3 a,.android-row-background-grey-900.android-grouped-resources-uncontained--tertiary .devsite-landing-row-item-description {
    --devsite-background-button-background: transparent;
    --devsite-background-button-background-hover: #000;
    --devsite-background-button-border-color: #000;
    --devsite-background-button-border-color-hover: #000;
    --devsite-background-button-primary-background: #000;
    --devsite-background-button-primary-background-hover: #fff;
    --devsite-background-button-primary-color: #fff;
    --devsite-background-button-primary-color-hover: #000;
    --devsite-background-button-white-color: #174ea6;
    --devsite-background-color: #efffc3;
    --devsite-button-background-hover: #000;
    --devsite-button-border: 2px solid #202124;
    --devsite-button-border-hover: 2px solid #202124;
    --devsite-button-color: #202124;
    --devsite-button-color-hover: #fff;
    --devsite-button-primary-background-hover: #fff;
    --devsite-button-white-color: #174ea6;
    --devsite-foreground-button-color: #000;
    --devsite-foreground-button-color-hover: #fff;
    --devsite-foreground-button-white-color: #174ea6;
    --devsite-foreground-color: #202124;
    --devsite-heading-color: #202124;
    --devsite-link-color: #202124;
    --devsite-text-color: #3c4043
}

.color-scheme--dark .android-grouped-resources-uncontained--tertiary .devsite-landing-row-item,.color-scheme--dark .android-illustrated-resources-tertiary .devsite-landing-row-item,.color-scheme--dark .android-illustrated-resources-tertiary .devsite-landing-row-item[background],.color-scheme--dark .android-illustrated-resources-tertiary.android-row-background-grey-900 .devsite-landing-row-item h3 a,.color-scheme--dark .android-illustrated-resources-tertiary.android-row-background-grey-900 .devsite-landing-row-item-description,.color-scheme--dark .android-row-background-grey-900.android-grouped-resources-uncontained--tertiary .devsite-landing-row-item h3 a,.color-scheme--dark .android-row-background-grey-900.android-grouped-resources-uncontained--tertiary .devsite-landing-row-item-description {
    --android-link-color-hover: #aecbfa;
    --devsite-button-background-hover: #fff;
    --devsite-button-border: 2px solid #fff;
    --devsite-button-border-hover: 2px solid #fff;
    --devsite-button-color: #fff;
    --devsite-button-white-color: #aecbfa;
    --devsite-button-color-hover: #000;
    --devsite-text-color: #f8f9fa;
    --devsite-label-color: #dadce0;
    --devsite-label-text-color: #dadce0;
    --devsite-link-color: #fff
}

.android-grouped-resources-uncontained--tertiary .devsite-landing-row-item:not([background]),.android-illustrated-resources-tertiary .devsite-landing-row-item:not([background]) {
    background-color: #efffc3
}

.android-illustrated-resources-tertiary-small {
    --devsite-h3-font: 500 22px/28px var(--devsite-headline-font-family);
    --devsite-h3-margin: 0;
    --devsite-item-description-padding: 24px;
    --devsite-item-text-padding: 24px;
    --devsite-landing-row-group-grid: auto-flow/repeat(auto-fit,minmax(260px,1fr))
}

.android-illustrated-resources-tertiary-small .devsite-landing-row-item,.android-illustrated-resources-tertiary-small .devsite-landing-row-item[background],.android-illustrated-resources-tertiary-small.android-row-background-grey-900 .devsite-landing-row-item h3 a,.android-illustrated-resources-tertiary-small.android-row-background-grey-900 .devsite-landing-row-item-description {
    --devsite-background-button-background: transparent;
    --devsite-background-button-background-hover: #000;
    --devsite-background-button-border-color: #000;
    --devsite-background-button-border-color-hover: #000;
    --devsite-background-button-primary-background: #000;
    --devsite-background-button-primary-background-hover: #fff;
    --devsite-background-button-primary-color: #fff;
    --devsite-background-button-primary-color-hover: #000;
    --devsite-background-button-white-color: #174ea6;
    --devsite-background-color: #efffc3;
    --devsite-button-background-hover: #000;
    --devsite-button-color-hover: #fff;
    --devsite-button-primary-background-hover: #fff;
    --devsite-button-white-color: #174ea6;
    --devsite-foreground-button-color: #000;
    --devsite-foreground-button-color-hover: #fff;
    --devsite-foreground-button-white-color: #174ea6;
    --devsite-foreground-color: #202124;
    --devsite-heading-color: #202124;
    --devsite-link-color: #202124;
    --devsite-text-color: #3c4043
}

.color-scheme--dark .android-illustrated-resources-tertiary-small .devsite-landing-row-item,.color-scheme--dark .android-illustrated-resources-tertiary-small .devsite-landing-row-item[background],.color-scheme--dark .android-illustrated-resources-tertiary-small.android-row-background-grey-900 .devsite-landing-row-item h3 a,.color-scheme--dark .android-illustrated-resources-tertiary-small.android-row-background-grey-900 .devsite-landing-row-item-description {
    --android-link-color-hover: #aecbfa;
    --devsite-text-color: #f8f9fa;
    --devsite-label-color: #dadce0;
    --devsite-label-text-color: #dadce0;
    --devsite-link-color: #fff
}

.android-illustrated-resources-tertiary-small .devsite-landing-row-item:not([background]) {
    background-color: #efffc3
}

.android-illustrated-resources-tertiary-small .devsite-landing-row-item a:focus,.android-illustrated-resources-tertiary-small .devsite-landing-row-item a:hover,.android-illustrated-resources-tertiary-small .devsite-landing-row-item[background] a:focus,.android-illustrated-resources-tertiary-small .devsite-landing-row-item[background] a:hover {
    --devsite-foreground-color: #174ea6;
    --devsite-link-color: #174ea6;
    --devsite-link-text-decoration-hover: none;
    --devsite-text-color: #174ea6
}

.android-illustrated-resources-tertiary-small .android-fully-clickable:focus h3 a,.android-illustrated-resources-tertiary-small .android-fully-clickable:hover h3 a,.android-illustrated-resources-tertiary-small .android-fully-clickable[background]:focus h3 a,.android-illustrated-resources-tertiary-small .android-fully-clickable[background]:hover h3 a {
    --devsite-foreground-color: #174ea6;
    --devsite-link-color: #174ea6;
    --devsite-link-text-decoration-hover: none;
    --devsite-text-color: #174ea6
}

.color-scheme--dark .android-illustrated-resources-tertiary-small .android-fully-clickable:focus h3 a,.color-scheme--dark .android-illustrated-resources-tertiary-small .android-fully-clickable:hover h3 a,.color-scheme--dark .android-illustrated-resources-tertiary-small .android-fully-clickable[background]:focus h3 a,.color-scheme--dark .android-illustrated-resources-tertiary-small .android-fully-clickable[background]:hover h3 a {
    --devsite-link-color: #aecbfa
}

.android-item-padding-none {
    --devsite-item-description-padding: 0
}

.android-item-padding-small {
    --devsite-item-description-padding: 16px
}

.android-item-padding-medium {
    --devsite-item-description-padding: 24px
}

.android-item-padding-large {
    --devsite-item-description-padding: 32px
}

.android-item-padding-xlarge {
    --devsite-item-description-padding: 40px
}

@media screen and (max-width: 840px) {
    .android-item-padding-large,.android-item-padding-xlarge {
        --devsite-item-description-padding:24px
    }
}

.android-item-background-blue-100 {
    --devsite-background-color: #d2e3fc
}

.android-item-background-green-100 {
    --devsite-background-color: #ceead6
}

.android-item-background-grey-50 {
    --devsite-background-color: #f8f9fa
}

.android-item-background-grey-900,.android-item-background-grey-900 .devsite-landing-row-item-description,.android-item-background-grey-900 h3 a {
    --devsite-background-color: #202124;
    --devsite-button-background: 0;
    --devsite-button-background-active: #fff;
    --devsite-button-background-hover: #fff;
    --devsite-button-border: 2px solid #fff;
    --devsite-button-border-active: 2px solid #fff;
    --devsite-button-border-hover: 2px solid #fff;
    --devsite-button-color: #fff;
    --devsite-button-color-active: #000;
    --devsite-button-color-hover: #000;
    --devsite-button-white-color: #d2e3fc;
    --devsite-button-primary-background: #fff;
    --devsite-button-primary-background-hover: #dadce0;
    --devsite-button-primary-color: #000;
    --devsite-foreground-color: #fff;
    --devsite-heading-color: #fff;
    --devsite-label-color: #fff;
    --devsite-label-text-color: #fff;
    --devsite-landing-row-color: #fff;
    --devsite-link-color: #fff;
    --devsite-text-color: #fff
}

.android-item-background-white {
    --devsite-background-color: #fff
}

.android-item-background-white.android-fully-clickable h3 a:focus-within,.android-item-background-white.android-fully-clickable h3 a:hover,.android-item-background-white.android-fully-clickable:focus-within,.android-item-background-white.android-fully-clickable:hover {
    --devsite-foreground-color: #174ea6;
    --devsite-link-color: #174ea6
}

[class*=android-item-background-] {
    background-color: var(--devsite-background-color)
}

[class*=android-item-background-] .devsite-landing-row-item-description {
    padding: var(--devsite-item-description-padding)
}

.android-promo {
    --devsite-image-border-radius: 24px;
    --devsite-item-border: 1px solid #dadce0;
    --devsite-item-description-height: 100%;
    --devsite-item-description-margin: 0;
    --devsite-item-description-padding: 32px;
    --devsite-item-image-min-width: 100%;
    --devsite-item-media-border-radius: 0;
    --devsite-item-media-padding: 32px;
    --devsite-item-media-width: 50%;
    --devsite-item-text-padding: 32px;
    --devsite-video-border-radius: 24px
}

.android-promo.devsite-landing-row-1-up {
    --devsite-item-media-width: 100%
}

.android-promo.devsite-landing-row-3-up {
    --devsite-item-media-padding: 0 32px 32px;
    --devsite-item-image-height: 149px
}

.android-promo.devsite-landing-row-3-up .devsite-landing-row-item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.android-promo.devsite-landing-row-3-up .devsite-landing-row-item-media {
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.android-promo.devsite-landing-row-3-up .devsite-landing-row-item-image img {
    height: var(--devsite-item-image-height);
    object-fit: contain
}

.android-promo.devsite-landing-row-3-up .devsite-landing-row-item-description {
    padding: var(--devsite-item-description-padding)
}

.android-promo .devsite-landing-row-item,.android-promo .devsite-landing-row-item[background] {
    --devsite-background-button-background: transparent;
    --devsite-background-button-background-hover: #000;
    --devsite-background-button-border-color: #000;
    --devsite-background-button-border-color-hover: #000;
    --devsite-background-button-primary-background: #000;
    --devsite-background-button-primary-background-hover: #dadce0;
    --devsite-background-button-primary-color: #fff;
    --devsite-background-button-primary-color-hover: #000;
    --devsite-background-color: #fff;
    --devsite-foreground-button-color: #000;
    --devsite-foreground-button-color-hover: #fff;
    --devsite-foreground-color: #000;
    --devsite-heading-color: #000;
    --devsite-text-color: #000
}

.android-promo .devsite-landing-row-item:not([background]) {
    background-color: #fff
}

.android-promo .devsite-landing-row-item[description-position=left] {
    --devsite-item-text-padding: 32px 0 32px 32px
}

[dir=rtl] .android-promo .devsite-landing-row-item[description-position=left] {
    --devsite-item-text-padding: 32px 32px 32px 0
}

.android-promo .devsite-landing-row-item[description-position=right] {
    --devsite-item-text-padding: 32px 32px 32px 0
}

[dir=rtl] .android-promo .devsite-landing-row-item[description-position=right] {
    --devsite-item-text-padding: 32px 0 32px 32px
}

@media screen and (max-width: 840px) {
    .android-promo {
        --devsite-item-description-height:auto;
        --devsite-item-description-order: 1;
        --devsite-item-description-padding: 24px;
        --devsite-item-media-align-self: flex-end;
        --devsite-item-media-margin: auto 0 0;
        --devsite-item-media-order: 2;
        --devsite-item-media-padding: 0 24px 24px;
        --devsite-item-text-padding: 24px
    }

    .android-promo.devsite-landing-row-1-up {
        --devsite-1-up-grid-template-columns: 2fr 1fr;
        --devsite-item-media-align-self: auto;
        --devsite-item-media-margin: 0;
        --devsite-item-media-padding: 24px
    }

    .android-promo.devsite-landing-row-3-up .devsite-landing-row-item-image img {
        --devsite-item-image-height: max-content
    }

    .android-promo .devsite-landing-row-item[description-position=left],.android-promo .devsite-landing-row-item[description-position=right] {
        --devsite-item-text-padding: 24px
    }

    [dir=rtl] .android-promo .devsite-landing-row-item[description-position=left],[dir=rtl] .android-promo .devsite-landing-row-item[description-position=right] {
        --devsite-item-text-padding: 24px
    }
}

@media screen and (max-width: 600px) {
    .android-promo {
        --devsite-item-display:flex
    }

    .android-promo.devsite-landing-row-1-up {
        --devsite-item-media-align-self: flex-end;
        --devsite-item-media-padding: 0 24px 24px;
        --devsite-item-media-width: 50%;
        --devsite-landing-row-item-gap: 0
    }
}

.android-quick-links {
    --android-fully-clickable-border-radius: 100px;
    --android-fully-clickable-opacity: 1;
    --android-fully-clickable-opacity-active: 0;
    --android-quick-link-background-hover: #f1f3f4;
    --android-quick-link-border: 1px solid #dadce0;
    --android-fully-clickable-box-shadow: 0 4px 8px 0 rgba(0,0,0,.1);
    --android-quick-link-border-radius: 100px;
    --android-quick-link-color: #000;
    --android-quick-link-icon-color: #202124;
    --android-link-color-hover: var(--android-quick-link-color);
    --devsite-link-text-decoration: none
}

.android-row-background-blue-25 {
    --devsite-background-color: #f6fbff
}

.android-grouped-resources-contained--primary,.android-row-background-blue-100 {
    --devsite-background-color: #d2e3fc
}

.android-grouped-resources-contained--tertiary,.android-row-background-chartreuse-100 {
    --devsite-background-color: #efffc3
}

.android-row-background-green-25 {
    --devsite-background-color: #f4f9f5
}

.android-grouped-resources-contained--secondary,.android-row-background-green-100 {
    --devsite-background-color: #ceead6
}

.android-row-background-grey-50 {
    --devsite-background-color: #f8f9fa
}

.android-row-background-grey-900,.android-row-background-grey-900 .devsite-landing-row-item h3 a,.android-row-background-grey-900 .devsite-landing-row-item-description {
    --android-link-color-hover: #a8dab5;
    --devsite-background-color: #202124;
    --devsite-button-background: 0;
    --devsite-button-background-active: #fff;
    --devsite-button-background-hover: #fff;
    --devsite-button-border: 2px solid #fff;
    --devsite-button-border-active: 2px solid #fff;
    --devsite-button-border-hover: 2px solid #fff;
    --devsite-button-color: #fff;
    --devsite-button-color-active: #000;
    --devsite-button-color-hover: #000;
    --devsite-button-white-color: #d2e3fc;
    --devsite-button-primary-background: #fff;
    --devsite-button-primary-background-hover: #dadce0;
    --devsite-button-primary-color: #000;
    --devsite-foreground-color: #fff;
    --devsite-heading-color: #fff;
    --devsite-label-color: #fff;
    --devsite-label-text-color: #fff;
    --devsite-landing-row-color: #fff;
    --devsite-link-color: #fff;
    --devsite-text-color: #fff
}

[class*=android-row-background-]:not([background]) {
    background-color: var(--devsite-background-color)
}

.android-grouped-resources-contained--primary,.android-grouped-resources-contained--secondary,.android-grouped-resources-contained--tertiary,.android-row-contained,.android-row-contained[class*=android-row-background-] {
    --devsite-landing-row-margin: 0 auto;
    --devsite-landing-row-max-width: 1380px;
    --devsite-landing-row-padding: 80px 64px;
    background-color: var(--devsite-background-1);
    padding-inline:64px}

@media screen and (max-width: 840px) {
    .android-grouped-resources-contained--primary,.android-grouped-resources-contained--secondary,.android-grouped-resources-contained--tertiary,.android-row-contained,.android-row-contained[class*=android-row-background-] {
        --devsite-landing-row-padding:56px 24px;
        padding-inline:24px}
}

[layout=docs] .android-grouped-resources-contained--primary,[layout=docs] .android-grouped-resources-contained--secondary,[layout=docs] .android-grouped-resources-contained--tertiary,[layout=docs] .android-row-contained,[layout=docs] .android-row-contained[class*=android-row-background-] {
    padding-inline:40px}

.android-grouped-resources-contained--primary .devsite-landing-row-inner,.android-grouped-resources-contained--secondary .devsite-landing-row-inner,.android-grouped-resources-contained--tertiary .devsite-landing-row-inner,.android-row-contained .devsite-landing-row-inner {
    background-color: var(--devsite-background-color);
    --devsite-landing-group-padding: 40px
}

@media screen and (max-width: 840px) {
    .android-grouped-resources-contained--primary .devsite-landing-row-inner,.android-grouped-resources-contained--secondary .devsite-landing-row-inner,.android-grouped-resources-contained--tertiary .devsite-landing-row-inner,.android-row-contained .devsite-landing-row-inner {
        --devsite-landing-group-padding:32px
    }
}

@media screen and (max-width: 600px) {
    .android-grouped-resources-contained--primary .devsite-landing-row-inner,.android-grouped-resources-contained--secondary .devsite-landing-row-inner,.android-grouped-resources-contained--tertiary .devsite-landing-row-inner,.android-row-contained .devsite-landing-row-inner {
        --devsite-landing-group-padding:24px
    }
}

.devsite-landing-row[class*=-contained]:not([class*=devsite-landing-row-padding-])+.devsite-landing-row:not([background])[class*=android-row-background-]:not([class*=-contained]) {
    padding-top: 80px
}

@media screen and (max-width: 840px) {
    .devsite-landing-row[class*=-contained]:not([class*=devsite-landing-row-padding-])+.devsite-landing-row:not([background])[class*=android-row-background-]:not([class*=-contained]) {
        padding-top:56px
    }
}

@media screen and (max-width: 600px) {
    .devsite-landing-row[class*=-contained]:not([class*=devsite-landing-row-padding-])+.devsite-landing-row:not([background])[class*=android-row-background-]:not([class*=-contained]) {
        padding-top:48px
    }
}

.android-row-padding-none {
    --devsite-landing-row-padding: 0
}

.android-row-padding-top-small-bottom-small {
    --devsite-landing-row-padding: 32px 0 32px
}

.android-row-padding-top-small-bottom-medium {
    --devsite-landing-row-padding: 32px 0 40px
}

.android-row-padding-top-small-bottom-large {
    --devsite-landing-row-padding: 32px 0 56px
}

.android-row-padding-top-small-bottom-xlarge {
    --devsite-landing-row-padding: 32px 0 80px
}

.android-row-padding-top-medium-bottom-small {
    --devsite-landing-row-padding: 40px 0 32px
}

.android-row-padding-top-medium-bottom-medium {
    --devsite-landing-row-padding: 40px 0 40px
}

.android-row-padding-top-medium-bottom-large {
    --devsite-landing-row-padding: 40px 0 56px
}

.android-row-padding-top-medium-bottom-xlarge {
    --devsite-landing-row-padding: 40px 0 80px
}

.android-row-padding-top-large-bottom-small {
    --devsite-landing-row-padding: 56px 0 32px
}

.android-row-padding-top-large-bottom-medium {
    --devsite-landing-row-padding: 56px 0 40px
}

.android-row-padding-top-large-bottom-large {
    --devsite-landing-row-padding: 56px 0 56px
}

.android-row-padding-top-large-bottom-xlarge {
    --devsite-landing-row-padding: 56px 0 80px
}

.android-row-padding-top-xlarge-bottom-small {
    --devsite-landing-row-padding: 80px 0 32px
}

.android-row-padding-top-xlarge-bottom-medium {
    --devsite-landing-row-padding: 80px 0 40px
}

.android-row-padding-top-xlarge-bottom-large {
    --devsite-landing-row-padding: 80px 0 56px
}

.android-row-padding-top-xlarge-bottom-xlarge {
    --devsite-landing-row-padding: 80px 0 80px
}

@media screen and (max-width: 840px) {
    .android-row-padding-top-small-bottom-small {
        --devsite-landing-row-padding:24px 0 24px
    }

    .android-row-padding-top-small-bottom-medium {
        --devsite-landing-row-padding: 24px 0 32px
    }

    .android-row-padding-top-small-bottom-large {
        --devsite-landing-row-padding: 24px 0 40px
    }

    .android-row-padding-top-small-bottom-xlarge {
        --devsite-landing-row-padding: 24px 0 56px
    }

    .android-row-padding-top-medium-bottom-small {
        --devsite-landing-row-padding: 32px 0 24px
    }

    .android-row-padding-top-medium-bottom-medium {
        --devsite-landing-row-padding: 32px 0 32px
    }

    .android-row-padding-top-medium-bottom-large {
        --devsite-landing-row-padding: 32px 0 40px
    }

    .android-row-padding-top-medium-bottom-xlarge {
        --devsite-landing-row-padding: 32px 0 56px
    }

    .android-row-padding-top-large-bottom-small {
        --devsite-landing-row-padding: 40px 0 24px
    }

    .android-row-padding-top-large-bottom-medium {
        --devsite-landing-row-padding: 40px 0 32px
    }

    .android-row-padding-top-large-bottom-large {
        --devsite-landing-row-padding: 40px 0 40px
    }

    .android-row-padding-top-large-bottom-xlarge {
        --devsite-landing-row-padding: 40px 0 56px
    }

    .android-row-padding-top-xlarge-bottom-small {
        --devsite-landing-row-padding: 56px 0 24px
    }

    .android-row-padding-top-xlarge-bottom-medium {
        --devsite-landing-row-padding: 56px 0 32px
    }

    .android-row-padding-top-xlarge-bottom-large {
        --devsite-landing-row-padding: 56px 0 40px
    }

    .android-row-padding-top-xlarge-bottom-xlarge {
        --devsite-landing-row-padding: 56px 0 56px
    }
}

@media screen and (max-width: 600px) {
    .android-row-padding-top-small-bottom-small {
        --devsite-landing-row-padding:16px 0 16px
    }

    .android-row-padding-top-small-bottom-medium {
        --devsite-landing-row-padding: 16px 0 24px
    }

    .android-row-padding-top-small-bottom-large {
        --devsite-landing-row-padding: 16px 0 32px
    }

    .android-row-padding-top-small-bottom-xlarge {
        --devsite-landing-row-padding: 16px 0 48px
    }

    .android-row-padding-top-medium-bottom-small {
        --devsite-landing-row-padding: 24px 0 16px
    }

    .android-row-padding-top-medium-bottom-medium {
        --devsite-landing-row-padding: 24px 0 24px
    }

    .android-row-padding-top-medium-bottom-large {
        --devsite-landing-row-padding: 24px 0 32px
    }

    .android-row-padding-top-medium-bottom-xlarge {
        --devsite-landing-row-padding: 24px 0 48px
    }

    .android-row-padding-top-large-bottom-small {
        --devsite-landing-row-padding: 32px 0 16px
    }

    .android-row-padding-top-large-bottom-medium {
        --devsite-landing-row-padding: 32px 0 24px
    }

    .android-row-padding-top-large-bottom-large {
        --devsite-landing-row-padding: 32px 0 32px
    }

    .android-row-padding-top-large-bottom-xlarge {
        --devsite-landing-row-padding: 32px 0 48px
    }

    .android-row-padding-top-xlarge-bottom-small {
        --devsite-landing-row-padding: 48px 0 16px
    }

    .android-row-padding-top-xlarge-bottom-medium {
        --devsite-landing-row-padding: 48px 0 24px
    }

    .android-row-padding-top-xlarge-bottom-large {
        --devsite-landing-row-padding: 48px 0 32px
    }

    .android-row-padding-top-xlarge-bottom-xlarge {
        --devsite-landing-row-padding: 48px 0 48px
    }
}

.android-samples .android-fully-clickable:focus a,.android-samples .android-fully-clickable:hover a {
    --devsite-heading-color: #174ea6;
    --devsite-link-color: #174ea6
}

.android-section-intro-full-width {
    --devsite-1-up-no-media-description-grid-column: 1/-1;
    --devsite-item-body-display: grid;
    --devsite-item-body-grid: "heading heading" "content ." "buttons ."/5fr 7fr;
    --devsite-item-body-grid-gap: 0 32px;
    --devsite-text-color: #3c4043
}

@media screen and (max-width: 840px) {
    .android-section-intro-full-width {
        --devsite-1-up-grid-template-columns:repeat(8,1fr);
        --devsite-1-up-no-media-description-grid-column: 1/-1;
        --devsite-item-body-grid: "heading heading" "content ." "buttons ."/5fr 3fr
    }
}

@media screen and (max-width: 600px) {
    .android-section-intro-full-width {
        --devsite-item-body-display:block
    }
}

.android-section-intro-full-width[background=blue],.android-section-intro-full-width[background=navy] {
    --devsite-text-color: #fff
}

.android-section-intro-sidecar-primary {
    --devsite-text-color: #3c4043
}

.android-section-intro-sidecar-primary[background=blue],.android-section-intro-sidecar-primary[background=navy] {
    --devsite-text-color: #fff
}

.android-select {
    --devsite-select-background-color: #34a853;
    --devsite-select-background-color-active: #ceead6;
    --devsite-select-background-color-hover: #ceead6;
    --devsite-select-border: 0;
    --devsite-select-border-radius: 100px;
    --devsite-select-font: 500 16px/24px var(--devsite-headline-font-family);
    --devsite-select-height: 48px;
    --devsite-select-line-height: 24px;
    --devsite-select-margin: 4px 16px 4px 0;
    --devsite-select-padding-block: 12px;
    --devsite-select-padding-inline: 24px 56px;
    --devsite-select-sibling-margin: 4px 16px 4px 0;
    --devsite-select-toggle-icon-x: 24px
}

[dir=rtl] .android-select {
    --devsite-select-margin: 4px 0 4px 16px;
    --devsite-select-sibling-margin: 4px 0 4px 16px
}

@media screen and (max-width: 600px) {
    .android-select {
        --devsite-button-width:100%;
        --devsite-select-margin: 0 0 8px;
        --devsite-select-max-width: auto;
        --devsite-select-sibling-margin: 0 0 8px
    }

    [dir=rtl] .android-select {
        --devsite-select-margin: 0 0 8px;
        --devsite-select-sibling-margin: 0 0 8px
    }
}

.android-select:only-child {
    --devsite-select-margin: 0
}

@media screen and (max-width: 600px) {
    .android-select:only-child {
        --devsite-select-margin:0 0 8px
    }
}

.android-select-outline {
    --devsite-select-background-color: transparent;
    --devsite-select-background-color-active: #202124;
    --devsite-select-background-color-hover: #202124;
    --devsite-select-border: 2px solid #202124;
    --devsite-select-color: #202124;
    --devsite-select-color-active: #fff;
    --devsite-select-color-hover: #fff;
    --devsite-select-padding-block: 10px 12px;
    --devsite-select-padding-inline: 24px 56px
}

.android-updates-box {
    border: var(--devsite-primary-border);
    border-radius: 8px;
    margin: 12px 0;
    padding: 8px 24px 0
}

.android-value-props {
    --devsite-buttons-margin: 0
}

.android-value-props:not([class*=android-row-background-]):not([background]) {
    --devsite-text-color: #3c4043;
    --devsite-heading-color: #000
}

.android-value-props .devsite-landing-row-item-description-content {
    -webkit-box-flex: 2;
    -webkit-flex-grow: 2;
    -moz-box-flex: 2;
    -ms-flex-positive: 2;
    flex-grow: 2
}

.android-xsmall-headings {
    --devsite-h3-margin: 0 0 8px;
    --devsite-label-margin: 0 0 8px
}

.android-border-radius-opt-out {
    --devsite-card-border-radius: 0;
    --devsite-image-border-radius: 0;
    --devsite-item-media-border-radius: 0;
    --devsite-video-border-radius: 0
}

.android-quote-bubble {
    background: #f1f3f4;
    border-radius: 0 24px 24px;
    padding: 32px
}

.android-quote-bubble .devsite-landing-row-item-description-content,.android-quote-bubble p,p.android-quote-bubble {
    font: var(--android-body-intro-font);
    letter-spacing: .25px
}

.android-quote-bubble .small-print {
    font: var(--android-body-font)
}

.dac-jetpack:before,.dac-rss:before {
    content: "";
    height: 40px;
    width: 40px
}

.dac-jetpack:before {
    background: url(../images/custom/jetpack-icon.svg) 50%/40px no-repeat
}

.dac-rss:before {
    background: url(../images/custom/rss-icon.png) 50%/24px no-repeat
}

.dac-jetpack a,.dac-rss a {
    text-decoration: underline
}

.dac-jetpack a:focus,.dac-jetpack a:hover,.dac-rss a:focus,.dac-rss a:hover {
    text-decoration: none
}

.dac-jetpack a:focus,.dac-rss a:focus {
    background: rgba(26,115,232,.1);
    border-radius: 2px;
    margin: -4px;
    padding: 4px
}

div.dac-jetpack,div.dac-rss,span.dac-jetpack {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #202124;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 14px;
    font-weight: 700;
    margin: 0;
    vertical-align: text-bottom
}

.color-scheme--dark div.dac-jetpack,.color-scheme--dark div.dac-rss,.color-scheme--dark span.dac-jetpack {
    color: #fff
}

[dir=ltr] div.dac-jetpack:before,[dir=ltr] div.dac-rss:before,[dir=ltr] span.dac-jetpack:before {
    margin-right: 4px
}

[dir=rtl] div.dac-jetpack:before,[dir=rtl] div.dac-rss:before,[dir=rtl] span.dac-jetpack:before {
    margin-left: 4px
}

[dir=ltr] div.dac-jetpack,[dir=ltr] div.dac-rss {
    padding-left: 16px
}

[dir=rtl] div.dac-jetpack,[dir=rtl] div.dac-rss {
    padding-right: 16px
}

span.dac-jetpack {
    position: relative
}

[dir=ltr] span.dac-jetpack {
    padding-left: 12px
}

[dir=rtl] span.dac-jetpack {
    padding-right: 12px
}

span.dac-jetpack:after {
    background: #202124;
    content: "";
    display: block;
    height: 70%;
    margin: 0;
    position: absolute;
    top: 15%;
    width: 2px
}

[dir=ltr] span.dac-jetpack:after {
    left: 0
}

[dir=rtl] span.dac-jetpack:after {
    right: 0
}

.color-scheme--dark span.dac-jetpack:after {
    background: #fff
}

h2 span.dac-jetpack {
    margin-bottom: -6px
}

h3 span.dac-jetpack,h4 span.dac-jetpack {
    margin-bottom: -8px
}

h4 span.dac-jetpack>span {
    position: relative;
    top: 3px
}

aside.dac-jetpack,aside.dac-jetpack :link,aside.dac-jetpack :visited,aside.dac-rss,aside.dac-rss :link,aside.dac-rss :visited {
    background: #e0f2f1;
    color: #00796b
}

aside.dac-jetpack :focus,aside.dac-jetpack :hover,aside.dac-rss :focus,aside.dac-rss :hover {
    background: hsla(0,0%,100%,.7)
}

aside.dac-jetpack code,aside.dac-rss code {
    background: 0;
    color: #00796b
}

aside.dac-jetpack:before,aside.dac-rss:before {
    margin: -8px 0 0
}

[dir=ltr] aside.dac-jetpack:before,[dir=ltr] aside.dac-rss:before {
    margin-left: -44px
}

[dir=rtl] aside.dac-jetpack:before,[dir=rtl] aside.dac-rss:before {
    margin-right: -44px
}

body[layout=full] .devsite-landing-row devsite-code {
    overflow: hidden
}

body[layout=full] .devsite-landing-row devsite-code:after {
    content: none
}

[layout=full] .android-caption {
    --android-caption-margin: 0
}

.android-caption-image-background,.android-caption-media-small {
    --android-caption-image-container-background: var(--devsite-background-3);
    --android-caption-image-container-padding: 32px
}

.android-caption-image-centered,.android-caption-media-small {
    --android-caption-image-margin: auto
}

.android-caption devsite-code {
    --devsite-code-margin: 0
}

.android-caption {
    margin: var(--android-caption-margin,32px 0 80px)
}

.android-caption.attempt-left {
    -webkit-margin-end: 32px;
    -moz-margin-end: 32px;
    margin-inline-end:32px}

.android-caption.attempt-right {
    -webkit-margin-start: 32px;
    -moz-margin-start: 32px;
    margin-inline-start:32px}

.android-caption-description {
    color: var(--devsite-secondary-text-color);
    margin: 16px 0 0
}

.android-caption-grid {
    display: grid;
    grid-gap: 32px;
    grid-template-columns: repeat(2,calc(50% - 16px))
}

@media screen and (max-width: 600px) {
    .android-caption-grid {
        grid-template-columns:100%
    }
}

.android-caption-icon {
    font-size: 28px
}

.android-caption-icon+.android-caption-label-text,.devsite-landing-row .android-caption-icon+.android-caption-label-text {
    -webkit-margin-start: 6px;
    -moz-margin-start: 6px;
    margin-inline-start:6px}

.android-caption-icon-bad {
    color: #ea4335
}

.android-caption-icon-caution {
    color: #fa903e
}

.android-caption-icon-good {
    color: #5bb974
}

.android-caption-image {
    display: block;
    margin: var(--android-caption-image-margin)
}

.android-caption-image-container {
    background: var(--android-caption-image-container-background);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: var(--android-caption-image-container-padding)
}

.android-caption-label {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 16px 0 0
}

.android-caption-label-caution {
    color: var(--android-caption-label-caution-color,#e8710a)
}

.android-caption-label-text,.devsite-landing-row .android-caption-label-text {
    font: 400 20px/28px var(--devsite-headline-font-family);
    padding: 0;
    margin: 0
}

.android-caption-label-bad {
    color: var(--android-caption-label-bad-color,#ea4335)
}

.android-caption-label-good {
    color: var(--android-caption-label-good-color,#137333)
}

.android-caption-paragraph>h1,.android-caption-paragraph>h2,.android-caption-paragraph>h3,.android-caption-paragraph>h4,.android-caption-paragraph>h5,.android-caption-paragraph>h6 {
    margin-top: 0
}

.android-component-overview {
    --devsite-heading-color: #ebf7fe;
    --devsite-hr-margin: 32px 0;
    --devsite-label-color: var(--devsite-secondary-text-color);
    --devsite-landing-row-description-font-size: 20px;
    --devsite-landing-row-group-background: linear-gradient(to right,var(--devsite-background-3),var(--devsite-background-3) calc(40% + 72px),var(--devsite-background-2) 0,var(--devsite-background-2));
    --devsite-landing-row-group-border: 2px solid #80868b;
    --devsite-landing-row-group-border-radius: 0 0 16px 16px;
    --devsite-landing-row-group-margin: 0;
    --devsite-landing-row-group-padding: 40px 32px;
    --devsite-landing-row-header-background: #0d4c67;
    --devsite-landing-row-header-border-radius: 16px 16px 0 0;
    --devsite-landing-row-header-padding: 40px 32px;
    --devsite-overflow-menu-background: #fff;
    --devsite-selector-background: transparent;
    --devsite-selector-content-margin-y: 0;
    --devsite-selector-icon-font-size: 24px;
    --devsite-selector-tab-line-height: 28px;
    --devsite-tabs-height: 28px;
    --devsite-tabs-margin: 4px 8px 32px;
    --devsite-tabs-width: calc(40% + 64px)
}

.android-component-overview .devsite-landing-row-description {
    --devsite-letter-spacing: 0.25px;
    --devsite-line-height: 32px;
    --devsite-primary-font-family: Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --devsite-text-color: #ebf7fe
}

.android-component-overview devsite-selector {
    --devsite-border: 0;
    --devsite-link-color: var(--devsite-button-color);
    --devsite-link-hover: var(--devsite-secondary-text-color);
    --devsite-selector-margin: 0 -24px
}

.android-component-overview devsite-tabs {
    --devsite-link-font: var(--android-cta-font);
    --devsite-tab-marker-border-radius: 0;
    --devsite-tab-marker-height: 2px;
    --devsite-tab-marker-position-x: 16px
}

.android-component-overview devsite-tabs tab>a {
    --devsite-link-padding: 0 16px
}

.android-component-overview-content {
    display: grid;
    grid-gap: 64px;
    grid-template-columns: calc(40% + 32px) 1fr
}

.android-component-overview-description p:last-of-type {
    margin-bottom: 0
}

.android-component-overview-small-print {
    color: var(--devsite-secondary-text-color);
    display: block;
    margin-top: 4px
}

.android-component-overview-usage-details {
    color: var(--devsite-card-attribution-color);
    font-weight: 500;
    margin-bottom: 32px;
    -webkit-padding-start: 32px;
    -moz-padding-start: 32px;
    padding-inline-start:32px;position: relative
}

.android-component-overview-usage-details .material-icons {
    left: 0;
    position: absolute;
    top: 0
}

.android-component-overview-preview {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: -100px
}

.android-component-overview-preview:focus .android-component-overview-wireframe,.android-component-overview-preview:hover .android-component-overview-wireframe,.android-component-overview-screenshot {
    display: none
}

.android-component-overview-preview:focus .android-component-overview-screenshot,.android-component-overview-preview:hover .android-component-overview-screenshot {
    display: block
}

.android-cta-with-arrow {
    background: rgba(0,0,0,.06);
    border: none;
    color: #202124;
    padding: 0 24px
}

.android-cta-with-arrow:focus,.android-cta-with-arrow:hover {
    background: rgba(0,0,0,.2);
    border: none;
    color: #202124;
    text-decoration: none
}

.color-scheme--dark .android-cta-with-arrow {
    background: hsla(0,0%,100%,.06);
    color: #fff
}

.color-scheme--dark .android-cta-with-arrow:focus,.color-scheme--dark .android-cta-with-arrow:hover {
    background: hsla(0,0%,100%,.2);
    color: #fff
}

.android-fully-clickable {
    position: relative
}

.android-fully-clickable:before {
    border-radius: var(--android-fully-clickable-border-radius);
    box-shadow: var(--android-fully-clickable-box-shadow,0 14px 25px 0 rgba(60,64,67,.08),0 4px 13px 0 rgba(60,64,67,.12));
    content: "";
    display: block;
    height: 100%;
    left: 0;
    opacity: var(--android-fully-clickable-opacity,0);
    pointer-events: none;
    position: absolute;
    top: 0;
    -webkit-transition: opacity .2s ease-out;
    transition: opacity .2s ease-out;
    width: 100%
}

.android-fully-clickable:focus-within:before,.android-fully-clickable:hover:before {
    opacity: var(--android-fully-clickable-opacity-hover,1)
}

.android-fully-clickable:active:before {
    opacity: var(--android-fully-clickable-opacity-active,.4)
}

:root {
    --gemini-gradient: linear-gradient(77deg,#3186ff 6.99%,#346bf1 45.46%,#4fabff 88.2%)
}

.button.android-gemini-button {
    --devsite-button-line-height: 48px;
    background: var(--gemini-gradient);
    border: none;
    color: #fff;
    overflow: hidden;
    position: relative;
    -webkit-transition: color .3s ease-out;
    transition: color .3s ease-out;
    z-index: 1
}

.button.android-gemini-button:before {
    background: #000;
    border-radius: inherit;
    content: "";
    inset: 0;
    opacity: 0;
    position: absolute;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: opacity .3s ease-out,-webkit-transform .3s ease-out;
    transition: opacity .3s ease-out,-webkit-transform .3s ease-out;
    transition: transform .3s ease-out,opacity .3s ease-out;
    transition: transform .3s ease-out,opacity .3s ease-out,-webkit-transform .3s ease-out;
    z-index: -1
}

.button.android-gemini-button:focus,.button.android-gemini-button:hover {
    background: var(--gemini-gradient);
    border: none;
    color: #fff
}

.button.android-gemini-button:focus:before,.button.android-gemini-button:hover:before {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

.android-row-background-grey-900 .button.android-gemini-button:before,.color-scheme--dark .button.android-gemini-button:before {
    background: #fff
}

.android-row-background-grey-900 .button.android-gemini-button:focus,.android-row-background-grey-900 .button.android-gemini-button:hover,.color-scheme--dark .button.android-gemini-button:focus,.color-scheme--dark .button.android-gemini-button:hover {
    color: #000
}

@media (prefers-reduced-motion:reduce) {
    .button.android-gemini-button {
        -webkit-transition: none;
        transition: none
    }

    .button.android-gemini-button:before {
        -webkit-transition: none;
        transition: none
    }
}

.android-guide-cards {
    --devsite-buttons-padding: 24px 0 0;
    --devsite-h3-font: 600 32px/40px var(--devsite-headline-font-family);
    --devsite-item-description-padding: 32px;
    --devsite-item-text-padding: 32px
}

@media screen and (max-width: 840px) {
    .android-guide-cards {
        --devsite-item-description-padding:24px;
        --devsite-item-text-padding: 24px
    }
}

.android-guide-cards.devsite-landing-row-auto {
    --devsite-landing-row-group-grid: auto-flow/repeat(auto-fit,minmax(301px,1fr))
}

.android-guide-cards-no-color.devsite-landing-row:not([background]),.android-guide-cards-no-color[class*=android-item-background-] {
    --devsite-background-1: var(--devsite-background-color)
}

.android-guide-cards .devsite-landing-row-item,.android-guide-cards .devsite-landing-row-item[background],.android-guide-cards.android-row-background-grey-900 .devsite-landing-row-item-description,.android-guide-cards.android-row-background-grey-900 h3 a {
    --devsite-background-button-background: transparent;
    --devsite-background-button-background-hover: #000;
    --devsite-background-button-border-color: #000;
    --devsite-background-button-border-color-hover: #000;
    --devsite-background-button-primary-background: #000;
    --devsite-background-button-primary-background-hover: #fff;
    --devsite-background-button-primary-color: #fff;
    --devsite-background-button-primary-color-hover: #000;
    --devsite-background-button-white-color: #174ea6;
    --devsite-background-color: #d2e3fc;
    --devsite-button-background-hover: #000;
    --devsite-button-color-hover: #fff;
    --devsite-button-primary-background-hover: #fff;
    --devsite-button-white-color: #174ea6;
    --devsite-foreground-button-color: #000;
    --devsite-foreground-button-color-hover: #fff;
    --devsite-foreground-button-white-color: #174ea6;
    --devsite-foreground-color: #202124;
    --devsite-heading-color: #202124;
    --devsite-label-color: #5f6368;
    --devsite-link-color: #202124;
    --devsite-text-color: #5f6368
}

.color-scheme--dark .android-guide-cards .devsite-landing-row-item,.color-scheme--dark .android-guide-cards .devsite-landing-row-item[background],.color-scheme--dark .android-guide-cards.android-row-background-grey-900 .devsite-landing-row-item-description,.color-scheme--dark .android-guide-cards.android-row-background-grey-900 h3 a {
    --devsite-background-button-white-color: #d2e3fc;
    --devsite-button-white-color: #d2e3fc;
    --devsite-text-color: #f8f9fa;
    --devsite-label-color: #dadce0;
    --devsite-link-color: #fff
}

.android-guide-cards .devsite-landing-row-item:not([background]) {
    background-color: #d2e3fc
}

.color-scheme--dark .android-guide-cards .devsite-landing-row-item:not([background]) {
    background-color: #15305c
}

.android-guide-cards-no-color .devsite-landing-row-item:not([background]),.android-guide-cards-no-color .devsite-landing-row-item[background] {
    background-color: #fff
}

.color-scheme--dark .android-guide-cards-no-color .devsite-landing-row-item:not([background]),.color-scheme--dark .android-guide-cards-no-color .devsite-landing-row-item[background] {
    background-color: #000
}

.android-guide-cards .devsite-landing-row-item-description h3 {
    color: #000
}

.color-scheme--dark .android-guide-cards .devsite-landing-row-item-description h3 {
    color: #fff
}

.android-guide-cards .devsite-landing-row-item-description {
    color: var(--devsite-text-color)
}

.android-spotlight-hero:not(.devsite-landing-row-hero) {
    padding-bottom: 0
}

.android-spotlight-hero+.android-spotlight-hero.devsite-landing-row-hero {
    padding-top: 0
}

.android-spotlight-hero .devsite-landing-row-item {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.android-parallax-hero:not(.android-row-background-grey-900) .devsite-landing-row-item-labels,.android-split-hero:not(.android-row-background-grey-900) .devsite-landing-row-item-labels,.android-spotlight-hero:not(.android-row-background-grey-900) .devsite-landing-row-item-labels {
    --devsite-label-color: #000
}

.android-parallax-hero .devsite-landing-row-item-labels,.android-split-hero .devsite-landing-row-item-labels,.android-spotlight-hero .devsite-landing-row-item-labels {
    --devsite-label-margin: 0 0 56px
}

.color-scheme--dark .android-parallax-hero .devsite-landing-row-item-labels,.color-scheme--dark .android-split-hero .devsite-landing-row-item-labels,.color-scheme--dark .android-spotlight-hero .devsite-landing-row-item-labels {
    --devsite-label-color: #fff
}

.android-parallax-hero .devsite-landing-row-item-labels>span,.android-split-hero .devsite-landing-row-item-labels>span,.android-spotlight-hero .devsite-landing-row-item-labels>span {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 8px;
    border: 1px solid var(--devsite-label-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 8px;
    white-space: nowrap;
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content
}

.android-parallax-hero .devsite-landing-row-item-labels>span span,.android-split-hero .devsite-landing-row-item-labels>span span,.android-spotlight-hero .devsite-landing-row-item-labels>span span {
    margin: 0 8px 0 0
}

.android-parallax-hero .devsite-landing-row-item-labels>span picture,.android-split-hero .devsite-landing-row-item-labels>span picture,.android-spotlight-hero .devsite-landing-row-item-labels>span picture {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 12px
}

.android-parallax-hero .devsite-landing-row-item-labels>span picture img,.android-split-hero .devsite-landing-row-item-labels>span picture img,.android-spotlight-hero .devsite-landing-row-item-labels>span picture img {
    height: 24px;
    margin: 0 8px 0 0;
    width: 24px
}

@media screen and (max-width: 840px) {
    .android-parallax-hero .devsite-landing-row-item-labels,.android-split-hero .devsite-landing-row-item-labels,.android-spotlight-hero .devsite-landing-row-item-labels {
        --devsite-label-margin:0 0 40px
    }
}

.android-spotlight-hero {
    --devsite-h1-font: 700 64px/72px var(--devsite-headline-font-family);
    --devsite-item-description-margin: 0;
    --devsite-landing-row-description-font-size: 20px;
    --devsite-landing-row-description-max-width: 888px;
    --devsite-landing-row-item-gap: 40px;
    --devsite-item-description-margin: 0 auto;
    --devsite-landing-row-group-max-width: 1038px;
    --devsite-landing-row-group-margin: 0 auto;
    --devsite-landing-row-header-max-width: 888px;
    --devsite-landing-row-hero-buttons-padding-top: 0;
    --devsite-letter-spacing: 0.25px;
    --devsite-line-height: 32px;
    --devsite-primary-font-family: Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --devsite-row-header-contents-gap: 32px
}

.android-spotlight-hero:not(.android-video-spotlight-hero) .devsite-landing-row-item-media+.devsite-landing-row-item-description {
    margin-bottom: 0;
    margin-top: 32px
}

.android-spotlight-hero.devsite-landing-row-100 .devsite-landing-row-item-media {
    width: auto
}

.android-spotlight-hero.devsite-landing-row-1-up .devsite-landing-row-item-media figure {
    background: none
}

.android-spotlight-hero.devsite-landing-row-1-up .devsite-landing-row-item-media img {
    width: 100%;
    height: auto;
    max-height: 450px;
    object-fit: contain
}

.android-spotlight-hero.android-video-spotlight-hero .devsite-landing-row-item-media {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -moz-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: 100%
}

.android-video-spotlight-hero .devsite-landing-row-item-media {
    margin: 0 auto;
    max-width: 824px
}

.android-video-spotlight-hero devsite-video {
    border-radius: 24px
}

.android-spotlight-hero.android-video-spotlight-hero .devsite-landing-row-item-media+.devsite-landing-row-item-description {
    margin-top: 0;
    margin-bottom: 0
}

.android-spotlight-hero.android-video-spotlight-hero .devsite-landing-row-description {
    margin-bottom: 40px
}

@media screen and (max-width: 840px) {
    .android-spotlight-hero {
        --devsite-h1-font:700 48px/56px var(--devsite-headline-font-family)
    }

    .android-spotlight-hero:not(.android-video-spotlight-hero) .devsite-landing-row-item-media {
        -webkit-box-ordinal-group: 4;
        -webkit-order: 3;
        -moz-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3
    }
}

@media screen and (max-width: 600px) {
    .android-spotlight-hero.devsite-landing-row-100 {
        --devsite-h1-font:600 40px/48px var(--devsite-headline-font-family);
        --devsite-item-description-margin: 16px 0 0;
        --devsite-item-description-padding: 0;
        --devsite-landing-row-description-font-size: 16px;
        --devsite-landing-row-item-gap: 24px;
        --devsite-line-height: 24px;
        --devsite-row-header-contents-gap: 16px
    }

    .android-spotlight-hero:not(.android-video-spotlight-hero) .devsite-landing-row-item-media+.devsite-landing-row-item-description {
        margin-top: 16px
    }

    .android-video-spotlight-hero {
        --devsite-item-description-margin: 0;
        --devsite-item-description-padding: 16px 0 24px 0
    }

    .android-spotlight-hero .devsite-landing-row-item-description {
        width: 100%
    }

    .android-spotlight-hero .devsite-landing-row-item-body {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    .android-spotlight-hero .devsite-landing-row-item-buttons {
        width: 100%
    }

    .android-spotlight-hero .button {
        --devsite-button-max-width: 100%
    }
}

.android-split-hero.devsite-landing-row-hero .devsite-landing-row-item-buttons {
    padding-top: 56px
}

.android-split-hero.devsite-landing-row-50 .devsite-landing-row-item-description {
    grid-column: 1/span 7
}

.android-split-hero.devsite-landing-row-50 .devsite-landing-row-item-media-left+.devsite-landing-row-item-description {
    grid-column: 6/span 7
}

@media screen and (max-width: 840px) {
    .android-split-hero.devsite-landing-row-hero .devsite-landing-row-item-description h3 {
        font:600 40px/48px var(--devsite-headline-font-family)
    }

    .android-split-hero.devsite-landing-row-hero .devsite-landing-row-item-buttons {
        padding-top: 40px
    }

    .android-split-hero.devsite-landing-row-1-up .devsite-landing-row-item {
        grid-gap: 24px
    }

    .android-split-hero.devsite-landing-row-50 .devsite-landing-row-item-description {
        grid-column: 1
    }

    .android-split-hero.devsite-landing-row-50 .devsite-landing-row-item-media-left+.devsite-landing-row-item-description {
        grid-column: 2
    }
}

@media screen and (max-width: 600px) {
    .android-split-hero.devsite-landing-row-hero .devsite-landing-row-item-buttons {
        padding-top:32px
    }

    .android-split-hero .devsite-landing-row-item-media+.devsite-landing-row-item-description {
        margin: 0
    }

    .android-split-hero.devsite-landing-row-1-up .devsite-landing-row-item {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex
    }

    .android-split-hero.devsite-landing-row-1-up .devsite-landing-row-item-media+.devsite-landing-row-item-description {
        padding: 24px 0
    }

    .android-split-hero .devsite-landing-row-item-body {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .android-split-hero .devsite-landing-row-item-description {
        text-align: center
    }

    .android-split-hero .devsite-landing-row-item-buttons {
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    .android-split-hero .devsite-landing-row-item[description-position] .devsite-landing-row-item-media {
        width: 50%
    }

    .android-split-hero .devsite-landing-row-item[description-position] .devsite-landing-row-item-media:not(.devsite-landing-row-item-media-left) {
        -webkit-box-ordinal-group: 4;
        -webkit-order: 3;
        -moz-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3
    }
}

.android-parallax-hero {
    --devsite-item-display: flex;
    --devsite-item-flex-direction: row;
    --devsite-item-gap: 32px;
    --devsite-item-image-container-height: 220%;
    --devsite-item-image-container-width: 700px;
    --devsite-item-justify-content: center;
    --devsite-item-max-height: 700px;
    --devsite-item-text-max-width: 400px;
    --devsite-landing-group-margin: 0;
    --devsite-landing-group-max-width: none;
    --devsite-landing-group-padding: 0;
    --devsite-landing-row-overflow: hidden;
    --devsite-landing-row-padding: 0
}

@media (max-width: 1200px) {
    .android-parallax-hero {
        --devsite-item-gap:0px;
        --devsite-item-image-container-width: 500px
    }
}

@media screen and (max-width: 840px) {
    .android-parallax-hero {
        --devsite-item-description-align-items:center;
        --devsite-item-description-top-margin-override: 0;
        --devsite-item-image-container-width: 100%;
        --devsite-item-max-height: none;
        --devsite-item-media-container-width: 100%;
        --devsite-item-media-max-height: none;
        --devsite-item-media-overflow: hidden;
        --devsite-item-media-width: 100%;
        --devsite-item-text-align: left;
        --devsite-item-text-max-width: none;
        --devsite-item-text-padding: 0
    }
}

@media screen and (max-width: 600px) {
    .android-parallax-hero {
        --devsite-item-description-top-margin-override:32px 0;
        --devsite-item-media-max-height: 256px;
        --devsite-item-text-align: center
    }
}

.android-parallax-hero .devsite-landing-row-item-body {
    -webkit-box-align: start;
    -webkit-align-items: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: start
}

.android-parallax-hero .devsite-landing-row-item[description-position] .devsite-landing-row-item-media {
    border-radius: 0
}

@media screen and (max-width: 840px) {
    .android-parallax-hero .devsite-landing-row-item[description-position] {
        -webkit-box-orient:horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -moz-box-orient: horizontal;
        -moz-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        min-height: 700px
    }

    .android-parallax-hero .devsite-landing-row-item[description-position] .devsite-landing-row-item-media {
        -webkit-align-self: end;
        -ms-flex-item-align: end;
        align-self: end;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 50%;
        -moz-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        min-height: 100%
    }

    .android-parallax-hero .devsite-landing-row-item[description-position=top] .devsite-landing-row-item-media+.devsite-landing-row-item-description {
        padding: 32px 0
    }

    .android-parallax-hero .devsite-landing-row-item-image img {
        height: 100%
    }
}

@media screen and (max-width: 600px) {
    .android-parallax-hero .devsite-landing-row-item {
        grid-gap:0
    }

    .android-parallax-hero .devsite-landing-row-item[description-position] {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        min-height: unset
    }

    .android-parallax-hero .devsite-landing-row-item[description-position] .devsite-landing-row-item-media {
        -webkit-align-self: center;
        -ms-flex-item-align: center;
        align-self: center;
        min-height: unset;
        width: 50%
    }

    .android-parallax-hero .devsite-landing-row-item[description-position=top] .devsite-landing-row-item-media+.devsite-landing-row-item-description {
        margin-bottom: 0;
        padding: 32px 16px 0
    }

    .android-parallax-hero .devsite-landing-row-item-body {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }
}

.android-billboard h1,.android-billboard p {
    color: #000
}

.color-scheme--dark .android-billboard h1,.color-scheme--dark .android-billboard p {
    color: #fff
}

.android-billboard h1 {
    font: 600 64px/72px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif
}

.android-billboard p {
    font: 400 20px/32px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    letter-spacing: .25px;
    max-width: 717px
}

.android-search-hero .devsite-header-billboard {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin: 0;
    padding: 80px 0 48px;
    width: 57%
}

.android-search-hero .devsite-header-background {
    height: 100%;
    margin: 0 auto;
    max-width: 1440px;
    padding: 0 94px
}

.android-search-hero .devsite-header-billboard-search {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    max-width: 717px;
    padding-bottom: 76px;
    width: 54%
}

@media screen and (max-width: 1200px) {
    .android-billboard h1 {
        font-size:48px;
        min-width: 441px
    }
}

@media screen and (max-width: 840px) {
    .android-billboard {
        max-width:800px
    }

    .android-search-hero .devsite-header-background {
        padding: 0 24px
    }
}

@media screen and (max-width: 600px) {
    .android-search-hero .devsite-header-background {
        padding-bottom:200px
    }

    .android-search-hero .devsite-header-billboard {
        padding-bottom: 36px;
        width: 100%
    }

    .android-billboard {
        text-align: center
    }

    .android-billboard p {
        font-size: 16px;
        line-height: 24px
    }

    .android-billboard h1 {
        min-width: 0
    }

    .android-search-hero .devsite-header-billboard-search {
        padding-bottom: 0;
        width: 100%
    }
}

.android-search-hero devsite-header {
    --devsite-primary-color: #f8f9fa;
    --devsite-header-color-lower: #f8f9fa
}

.android-search-hero devsite-header[billboard] .devsite-header-billboard-search devsite-search {
    --devsite-search-field-border: 1px solid #5f6368;
    --devsite-search-field-border-radius: 24px;
    --devsite-search-border-radius: 24px;
    --devsite-searchbox-background-active: transparent;
    --devsite-searchbox-before-display: none;
    --devsite-popout-transition: none
}

devsite-search .devsite-searchbox {
    border-radius: 24px
}

.android-inline-link {
    background: var(--android-inline-link-background,var(--devsite-background-3));
    border-radius: 24px;
    color: var(--android-inline-link-color,#3c4043);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: 24px;
    line-height: 24px;
    margin: 32px 0;
    padding: 16px 24px;
    text-decoration: none;
    -webkit-transition: background .2s,color .2s;
    transition: background .2s,color .2s
}

.android-inline-link:hover {
    background: var(--android-inline-link-background-hover,var(--devsite-background-5));
    color: var(--android-inline-link-color-hover,#000);
    text-decoration: none
}

[template=landing] .android-inline-link {
    margin: 0
}

.android-inline-link-text-container {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.android-inline-link-title {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    font: 500 14px/18px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    letter-spacing: 1.5px;
    text-transform: uppercase
}

.android-inline-link-horizontal-divider {
    border-left: 2px solid var(--android-inline-link-horizontal-divider-color,#dadce0);
    height: auto;
    margin-inline:8px;-webkit-transition: border-color .2s;
    transition: border-color .2s;
    width: 0
}

.android-inline-link:hover .android-inline-link-horizontal-divider {
    border-color: var(--android-inline-link-horizontal-divider-color-hover,#80868b)
}

.android-inline-link-copy {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font: 500 14px/18px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif
}

.android-inline-link-arrow-icon {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    -webkit-margin-start: auto;
    -moz-margin-start: auto;
    margin-inline-start:auto}

.android-inline-link-icon-title-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
}

.android-inline-link-left-icon {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    height: 24px;
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px;width: 24px
}

@media screen and (max-width: 600px) {
    .android-inline-link-text-container {
        -webkit-box-orient:vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .android-inline-link-icon-title-container {
        margin-bottom: 8px
    }

    .android-inline-link-horizontal-divider {
        display: none
    }
}

:root {
    --android-label-text-color: #5f6368;
    --android-label-background-color: #f1f3f4
}

.color-scheme--dark {
    --android-label-text-color: #e8eaed;
    --android-label-background-color: #3c4043
}

.android-editorial-and-updates .devsite-label:not(.devsite-label-confidential),.android-editorial-and-updates-cards .devsite-label:not(.devsite-label-confidential),.android-guide-cards .devsite-label:not(.devsite-label-confidential),.android-promo .devsite-label:not(.devsite-label-confidential),[class*=android-].devsite-landing-row-hero .devsite-label:not(.devsite-label-confidential),[class*=android-grouped-resources-] .devsite-label:not(.devsite-label-confidential),[class*=android-image-first-promo] .devsite-label:not(.devsite-label-confidential) {
    background: none;
    color: var(--android-label-text-color);
    display: inline-block;
    font: var(--android-eyebrow-font);
    letter-spacing: var(--android-eyebrow-letter-spacing);
    padding: 0;
    text-transform: uppercase
}

[class*=tenant--android] [class*=android-].devsite-landing-row-hero .devsite-label:not(.devsite-label-confidential) {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    color: var(--devsite-text-color);
    padding: 4px 8px
}

[class*=tenant--android] .android-editorial-and-updates .devsite-label[class*=devsite-label-display-tag],[class*=tenant--android] .android-editorial-and-updates-cards .devsite-label[class*=devsite-label-display-tag],[class*=tenant--android] .android-samples .devsite-label[class*=devsite-label-display-tag] {
    background: var(--android-label-background-color);
    border-radius: var(--devsite-display-tag-border-radius,12px);
    color: var(--devsite-display-tag-color);
    font: var(--andorid-tag-font);
    letter-spacing: normal;
    padding: 0 8px;
    text-transform: none
}

ol.callouts {
    counter-reset: item;
    list-style-type: none;
    margin-left: 30px;
    padding-left: 0
}

ol.callouts>li:before {
    background: url(../images/custom/callout-bg_2x.png) 1px 2px/20px no-repeat;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    content: counter(item);
    counter-increment: item;
    margin-left: -30px;
    padding-left: 8px;
    position: absolute;
    width: 16px
}

.callout {
    background: url(../images/custom/callout-bg_2x.png) 0 2px/20px no-repeat;
    display: inline-block;
    height: 22px;
    text-align: center;
    width: 20px
}

.callout,ol.callouts>li:before {
    color: #fff;
    font-size: 12px;
    font-weight: 500
}

.img-caption,figcaption {
    font-size: 14px;
    margin-top: -4px
}

p+.img-caption {
    margin-top: -20px
}

li p+.img-caption {
    margin-top: -12px
}

.table-caption {
    clear: both;
    font-size: 14px;
    margin: 0 0 4px
}

.table-caption+.devsite-table-wrapper,.table-caption+table {
    margin-top: 0
}

.code-caption {
    font: 14px/1.5 monospace;
    margin-bottom: 4px
}

a.external-link:after {
    content: "open_in_new";
    font: normal normal normal 24px/1 Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    word-wrap: normal;
    font-size: 18px;
    margin-left: 4px;
    vertical-align: text-bottom
}

.sidebox {
    background: var(--devsite-background-3);
    padding: 12px 24px
}

.sidebox a.bug {
    padding-right: 25px;
    background: transparent url(../images/custom/bug.png) no-repeat 100%
}

.sidebox a.g-plus {
    padding-right: 25px;
    background: transparent url(../images/custom/g+.ico) no-repeat 100%
}

.sidebox a.codelab {
    padding-right: 40px;
    background: transparent url(../images/custom/favicon.png) no-repeat 100%
}

.sidebox p {
    margin-top: 0
}

.wrap {
    margin: 0 auto;
    clear: both
}

.cols {
    margin-left: -10px;
    margin-right: -10px
}

.cols:after,.cols:before {
    content: " ";
    display: table
}

.cols:after {
    clear: both
}

[class*=col-] {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float: left;
    min-height: 1px;
    padding-left: 10px;
    padding-right: 10px;
    position: relative
}

.col-1 {
    width: 6.25%
}

.col-2 {
    width: 12.5%
}

.col-3 {
    width: 18.75%
}

.col-4 {
    width: 25%
}

.col-5 {
    width: 31.25%
}

.col-6 {
    width: 37.5%
}

.col-7 {
    width: 43.75%
}

.col-8 {
    width: 50%
}

.col-9 {
    width: 56.25%
}

.col-10 {
    width: 62.5%
}

.col-11 {
    width: 68.75%
}

.col-12 {
    width: 75%
}

.col-13 {
    width: 81.25%
}

.col-14 {
    width: 87.5%
}

.col-15 {
    width: 93.75%
}

.col-16 {
    width: 100%
}

.col-13 .col-1 {
    width: 7.69230769%
}

.col-13 .col-2 {
    width: 15.38461538%
}

.col-13 .col-3 {
    width: 23.07692308%
}

.col-13 .col-4 {
    width: 30.76923077%
}

.col-13 .col-5 {
    width: 38.46153846%
}

.col-13 .col-6 {
    width: 46.15384615%
}

.col-13 .col-7 {
    width: 53.84615385%
}

.col-13 .col-8 {
    width: 61.53846154%
}

.col-13 .col-9 {
    width: 69.23076923%
}

.col-13 .col-10 {
    width: 76.92307692%
}

.col-13 .col-11 {
    width: 84.61538462%
}

.col-13 .col-12 {
    width: 92.30769231%
}

.col-13 .col-13 {
    width: 100%
}

.col-12 .col-1 {
    width: 8.33333333%
}

.col-12 .col-2 {
    width: 16.66666667%
}

.col-12 .col-3 {
    width: 25%
}

.col-12 .col-4 {
    width: 33.33333333%
}

.col-12 .col-5 {
    width: 41.66666667%
}

.col-12 .col-6 {
    width: 50%
}

.col-12 .col-7 {
    width: 58.33333333%
}

.col-12 .col-8 {
    width: 66.66666667%
}

.col-12 .col-9 {
    width: 75%
}

.col-12 .col-10 {
    width: 83.33333333%
}

.col-12 .col-11 {
    width: 91.66666667%
}

.col-12 .col-12 {
    width: 100%
}

.col-10of10,.col-12of12,.col-16of16,.col-1of1,.col-2of2,.col-3of3,.col-4of4,.col-5of5,.col-6of6,.col-8of8 {
    width: 100%
}

.col-1of2,.col-2of4,.col-3of6,.col-4of8,.col-5of10,.col-6of12,.col-8of16 {
    width: 50%
}

.col-1of3,.col-2of6,.col-4of12 {
    width: 33.33333333%
}

.col-2of3,.col-4of6,.col-8of12 {
    width: 66.66666667%
}

.col-1of4,.col-2of8,.col-3of12,.col-4of16 {
    width: 25%
}

.col-12of16,.col-3of4,.col-6of8,.col-9of12 {
    width: 75%
}

.col-1of5,.col-2of10 {
    width: 20%
}

.col-2of5,.col-4of10 {
    width: 40%
}

.col-3of5,.col-6of10 {
    width: 60%
}

.col-4of5,.col-8of10 {
    width: 80%
}

.col-1of6,.col-2of12 {
    width: 16.66666667%
}

.col-10of12,.col-5of6 {
    width: 83.33333333%
}

.col-1of8,.col-2of16 {
    width: 12.5%
}

.col-3of8,.col-6of16 {
    width: 37.5%
}

.col-10of16,.col-5of8 {
    width: 62.5%
}

.col-14of16,.col-7of8 {
    width: 87.5%
}

.col-1of10 {
    width: 10%
}

.col-3of10 {
    width: 30%
}

.col-7of10 {
    width: 70%
}

.col-9of10 {
    width: 90%
}

.col-1of12 {
    width: 8.33333333%
}

.col-5of12 {
    width: 41.66666667%
}

.col-7of12 {
    width: 58.33333333%
}

.col-11of12 {
    width: 91.66666667%
}

.col-1of16 {
    width: 6.25%
}

.col-3of16 {
    width: 18.75%
}

.col-5of16 {
    width: 31.25%
}

.col-7of16 {
    width: 43.75%
}

.col-9of16 {
    width: 56.25%
}

.col-11of16 {
    width: 68.75%
}

.col-13of16 {
    width: 81.25%
}

.col-15of16 {
    width: 93.75%
}

.col-pull-10of10,.col-pull-12of12,.col-pull-16of16,.col-pull-1of1,.col-pull-2of2,.col-pull-3of3,.col-pull-4of4,.col-pull-5of5,.col-pull-6of6,.col-pull-8of8 {
    left: -100%
}

.col-pull-1of2,.col-pull-2of4,.col-pull-3of6,.col-pull-4of8,.col-pull-5of10,.col-pull-6of12,.col-pull-8of16 {
    left: -50%
}

.col-pull-1of3,.col-pull-2of6,.col-pull-4of12 {
    left: -33.33333333%
}

.col-pull-2of3,.col-pull-4of6,.col-pull-8of12 {
    left: -66.66666667%
}

.col-pull-1of4,.col-pull-2of8,.col-pull-3of12,.col-pull-4of16 {
    left: -25%
}

.col-pull-12of16,.col-pull-3of4,.col-pull-6of8,.col-pull-9of12 {
    left: -75%
}

.col-pull-1of5,.col-pull-2of10 {
    left: -20%
}

.col-pull-2of5,.col-pull-4of10 {
    left: -40%
}

.col-pull-3of5,.col-pull-6of10 {
    left: -60%
}

.col-pull-4of5,.col-pull-8of10 {
    left: -80%
}

.col-pull-1of6,.col-pull-2of12 {
    left: -16.66666667%
}

.col-pull-10of12,.col-pull-5of6 {
    left: -83.33333333%
}

.col-pull-1of8,.col-pull-2of16 {
    left: -12.5%
}

.col-pull-3of8,.col-pull-6of16 {
    left: -37.5%
}

.col-pull-10of16,.col-pull-5of8 {
    left: -62.5%
}

.col-pull-14of16,.col-pull-7of8 {
    left: -87.5%
}

.col-pull-1of10 {
    left: -10%
}

.col-pull-3of10 {
    left: -30%
}

.col-pull-7of10 {
    left: -70%
}

.col-pull-9of10 {
    left: -90%
}

.col-pull-1of12 {
    left: -8.33333333%
}

.col-pull-5of12 {
    left: -41.66666667%
}

.col-pull-7of12 {
    left: -58.33333333%
}

.col-pull-11of12 {
    left: -91.66666667%
}

.col-pull-1of16 {
    left: -6.25%
}

.col-pull-3of16 {
    left: -18.75%
}

.col-pull-5of16 {
    left: -31.25%
}

.col-pull-7of16 {
    left: -43.75%
}

.col-pull-9of16 {
    left: -56.25%
}

.col-pull-11of16 {
    left: -68.75%
}

.col-pull-13of16 {
    left: -81.25%
}

.col-pull-15of16 {
    left: -93.75%
}

.col-push-10of10,.col-push-12of12,.col-push-16of16,.col-push-1of1,.col-push-2of2,.col-push-3of3,.col-push-4of4,.col-push-5of5,.col-push-6of6,.col-push-8of8 {
    left: 100%
}

.col-push-1of2,.col-push-2of4,.col-push-3of6,.col-push-4of8,.col-push-5of10,.col-push-6of12,.col-push-8of16 {
    left: 50%
}

.col-push-1of3,.col-push-2of6,.col-push-4of12 {
    left: 33.33333333%
}

.col-push-2of3,.col-push-4of6,.col-push-8of12 {
    left: 66.66666667%
}

.col-push-1of4,.col-push-2of8,.col-push-3of12,.col-push-4of16 {
    left: 25%
}

.col-push-12of16,.col-push-3of4,.col-push-6of8,.col-push-9of12 {
    left: 75%
}

.col-push-1of5,.col-push-2of10 {
    left: 20%
}

.col-push-2of5,.col-push-4of10 {
    left: 40%
}

.col-push-3of5,.col-push-6of10 {
    left: 60%
}

.col-push-4of5,.col-push-8of10 {
    left: 80%
}

.col-push-1of6,.col-push-2of12 {
    left: 16.66666667%
}

.col-push-10of12,.col-push-5of6 {
    left: 83.33333333%
}

.col-push-1of8,.col-push-2of16 {
    left: 12.5%
}

.col-push-3of8,.col-push-6of16 {
    left: 37.5%
}

.col-push-10of16,.col-push-5of8 {
    left: 62.5%
}

.col-push-14of16,.col-push-7of8 {
    left: 87.5%
}

.col-push-1of10 {
    left: 10%
}

.col-push-3of10 {
    left: 30%
}

.col-push-7of10 {
    left: 70%
}

.col-push-9of10 {
    left: 90%
}

.col-push-1of12 {
    left: 8.33333333%
}

.col-push-5of12 {
    left: 41.66666667%
}

.col-push-7of12 {
    left: 58.33333333%
}

.col-push-11of12 {
    left: 91.66666667%
}

.col-push-1of16 {
    left: 6.25%
}

.col-push-3of16 {
    left: 18.75%
}

.col-push-5of16 {
    left: 31.25%
}

.col-push-7of16 {
    left: 43.75%
}

.col-push-9of16 {
    left: 56.25%
}

.col-push-11of16 {
    left: 68.75%
}

.col-push-13of16 {
    left: 81.25%
}

.col-push-15of16 {
    left: 93.75%
}

a:hover,a:hover code {
    color: var(--android-link-color-hover)
}

a:focus-visible {
    outline: 1px solid var(--devsite-link-color)
}

a:active {
    outline: none;
    color: var(--android-link-color-hover)
}

a:has(>code),code a {
    --devsite-link-text-decoration: none
}

a:has(h3),h3 a {
    --android-link-color-hover: var(--devsite-link-color)
}

a:has(h3):focus-visible,h3 a:focus-visible {
    outline: none
}

a.button:focus-visible,a:has(img):focus-visible,tab a:focus-visible {
    outline: none
}

a.external-link:after,a.external-link:before,a.external:after,a.external:before {
    display: inline-block;
    text-decoration: none
}

.beta a:focus,.beta a:focus-visible,.beta a:hover,.caution a:focus,.caution a:focus-visible,.caution a:hover,.deprecated a:focus,.deprecated a:focus-visible,.deprecated a:hover,.dogfood a:focus,.dogfood a:focus-visible,.dogfood a:hover,.experimental a:focus,.experimental a:focus-visible,.experimental a:hover,.key-point a:focus,.key-point a:focus-visible,.key-point a:hover,.key-term a:focus,.key-term a:focus-visible,.key-term a:hover,.note a:focus,.note a:focus-visible,.note a:hover,.objective a:focus,.objective a:focus-visible,.objective a:hover,.preview a:focus,.preview a:focus-visible,.preview a:hover,.special a:focus,.special a:focus-visible,.special a:hover,.success a:focus,.success a:focus-visible,.success a:hover,.tip a:focus,.tip a:focus-visible,.tip a:hover,.warning a:focus,.warning a:focus-visible,.warning a:hover,aside a:focus,aside a:focus-visible,aside a:hover {
    background: var(--devsite-notice-link-hover-background);
    text-decoration: underline
}

.beta a:focus-visible,.caution a:focus-visible,.deprecated a:focus-visible,.dogfood a:focus-visible,.experimental a:focus-visible,.key-point a:focus-visible,.key-term a:focus-visible,.note a:focus-visible,.objective a:focus-visible,.preview a:focus-visible,.special a:focus-visible,.success a:focus-visible,.tip a:focus-visible,.warning a:focus-visible,aside a:focus-visible {
    outline: none
}

.android-md-multi-column {
    display: grid;
    grid-gap: 32px;
    grid-template-columns: repeat(6,1fr)
}

.android-md-multi-column-2-up .android-md-column-item {
    grid-column: span 3
}

@media screen and (max-width: 600px) {
    .android-md-multi-column-2-up .android-md-column-item {
        grid-column:span 6
    }
}

.android-md-multi-column-2-up.android-md-multi-column-align-right .android-md-column-item:nth-child(odd) {
    grid-column: span 2
}

@media screen and (max-width: 840px) {
    .android-md-multi-column-2-up.android-md-multi-column-align-right .android-md-column-item:nth-child(odd) {
        grid-column:span 3
    }
}

@media screen and (max-width: 600px) {
    .android-md-multi-column-2-up.android-md-multi-column-align-right .android-md-column-item:nth-child(odd) {
        grid-column:span 6
    }
}

.android-md-multi-column-2-up.android-md-multi-column-align-right .android-md-column-item:nth-child(2n) {
    grid-column: span 4
}

@media screen and (max-width: 840px) {
    .android-md-multi-column-2-up.android-md-multi-column-align-right .android-md-column-item:nth-child(2n) {
        grid-column:span 6
    }
}

.android-md-multi-column-2-up.android-md-multi-column-align-left .android-md-column-item:nth-child(odd) {
    grid-column: span 4
}

@media screen and (max-width: 840px) {
    .android-md-multi-column-2-up.android-md-multi-column-align-left .android-md-column-item:nth-child(odd) {
        grid-column:span 6
    }
}

.android-md-multi-column-2-up.android-md-multi-column-align-left .android-md-column-item:nth-child(2n) {
    grid-column: span 2
}

@media screen and (max-width: 840px) {
    .android-md-multi-column-2-up.android-md-multi-column-align-left .android-md-column-item:nth-child(2n) {
        grid-column:span 3
    }
}

@media screen and (max-width: 600px) {
    .android-md-multi-column-2-up.android-md-multi-column-align-left .android-md-column-item:nth-child(2n) {
        grid-column:span 6
    }
}

.android-md-multi-column-3-up .android-md-column-item {
    grid-column: span 2
}

@media screen and (max-width: 840px) {
    .android-md-multi-column-3-up .android-md-column-item {
        grid-column:span 3
    }
}

@media screen and (max-width: 600px) {
    .android-md-multi-column-3-up .android-md-column-item {
        grid-column:span 6
    }
}

.devsite-landing-row-cards .android-modal-dialog-card:not([background]) {
    background-color: var(--devsite-background-1)
}

.android-modal-dialog-card .devsite-landing-row-item-description h3 {
    font: var(--android-headline-4-font)
}

.android-modal-dialog-card-device-thumbnail.devsite-landing-row-item-media:not([background]) {
    background-image: url(../images/custom/mobile-device-frame-thumbnail.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    height: 222px
}

.color-scheme--dark .android-modal-dialog-card-device-thumbnail.devsite-landing-row-item-media:not([background]) {
    background-image: url(../images/custom/mobile-device-frame-thumbnail_dt.svg)
}

.android-modal-dialog-card-device-thumbnail .devsite-landing-row-item-image {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.android-modal-dialog-card-device-thumbnail img {
    height: 96px;
    width: 96px;
    margin-top: 8px
}

devsite-dialog.android-modal-dialog {
    border-radius: var(--devsite-item-border-radius);
    max-width: 850px;
    padding: 40px;
    position: relative;
    width: auto
}

.android-modal-dialog .devsite-dialog-contents {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 40px
}

.android-modal-dialog .devsite-dialog-contents .devsite-landing-row-item-labels>span {
    font: var(--android-eyebrow-font);
    margin: 0
}

.android-modal-dialog .devsite-dialog-contents .devsite-landing-row-item-header {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    max-width: 56%
}

.android-modal-dialog .devsite-dialog-contents .devsite-landing-row-item-description-content {
    max-width: 427px
}

.android-modal-dialog .devsite-dialog-media {
    max-width: 285px;
    min-width: 200px
}

.android-modal-dialog .devsite-dialog-media img,.android-modal-dialog .devsite-dialog-media video {
    border-radius: var(--devsite-item-border-radius);
    display: block;
    margin: 0 auto;
    max-height: 315px;
    object-fit: contain
}

.android-modal-dialog .devsite-dialog-buttons {
    -webkit-box-pack: start;
    -webkit-justify-content: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: start
}

.android-modal-dialog .devsite-dialog-buttons .button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px
}

.android-modal-dialog .devsite-dialog-close {
    color: var(--devsite-primary-text-color);
    position: absolute;
    right: 4px;
    top: 12px
}

.android-modal-dialog .devsite-dialog-close span {
    border-radius: 50%;
    border: var(--devsite-button-border);
    padding: 8px
}

@media screen and (max-width: 841px) {
    .android-modal-dialog .devsite-dialog-contents {
        -webkit-box-orient:vertical;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: column-reverse;
        -moz-box-orient: vertical;
        -moz-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        gap: 32px
    }
}

.android-page-banner {
    background: var(--devsite-background-2);
    border: 1px solid var(--devsite-background-5);
    border-radius: 24px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 32px 0;
    overflow: hidden
}

[template=landing] .android-page-banner {
    margin: 0
}

.android-page-banner-content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 32px
}

.android-page-banner-title {
    font: 600 24px/32px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    margin-bottom: 8px
}

.android-page-banner-description {
    margin-bottom: 18px
}

.android-page-banner-cta {
    font: 600 16px/20px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif
}

.android-page-banner-media {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-margin-start: auto;
    -moz-margin-start: auto;
    margin-inline-start:auto}

.android-page-banner-image {
    vertical-align: middle
}

.android-page-banner-image-bottom .android-page-banner-media {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.android-page-banner-image-bottom-left .android-page-banner-media {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.android-page-banner-image-bottom-right .android-page-banner-media {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.android-page-banner-image-left .android-page-banner-media {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.android-page-banner-image-right .android-page-banner-media {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.android-page-banner-image-top .android-page-banner-media {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.android-page-banner-image-top-left .android-page-banner-media {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.android-page-banner-image-top-right .android-page-banner-media {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

@media screen and (max-width: 600px) {
    .android-page-banner-content {
        padding:24px
    }

    .android-page-banner-title {
        font: 500 22px/28px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
        margin-bottom: 16px
    }

    .android-page-banner-description {
        font: 400 14px/20px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif
    }

    .android-page-banner-cta {
        font: 500 14px/20px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
        letter-spacing: .25px
    }

    .android-page-banner-media {
        display: none
    }
}

.android-page-preview-link {
    --devsite-item-media-border-radius: 12px;
    --devsite-item-media-overflow: clip;
    --devsite-item-image-container-width: 100%
}

.android-page-preview-link .devsite-landing-row-item-media {
    aspect-ratio: 467/306;
    background-color: #fff;
    border: 6px solid #202124;
    box-shadow: -20px 20px 8px 0 rgba(0,0,0,.2);
    position: relative
}

.color-scheme--dark .android-page-preview-link .devsite-landing-row-item-media {
    background-color: #5f6368
}

.android-page-preview-link .devsite-landing-row-item-media .devsite-landing-row-item-image {
    left: 0;
    position: absolute;
    top: 0
}

@supports (animation-timeline:view(block)) {
    .android-page-preview-link .devsite-landing-row-item-media .devsite-landing-row-item-image {
        -webkit-animation: scrollpreview linear both;
        animation: scrollpreview linear both;
        animation-timeline: view(block 25%);
        animation-range: cover 0 cover 100%
    }
}

@-webkit-keyframes scrollpreview {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    to {
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

@keyframes scrollpreview {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    to {
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

.android-full-width-promo {
    --devsite-landing-row-group-margin-top: 40px
}

@media screen and (max-width: 600px) {
    .android-full-width-promo {
        --devsite-button-sibling-gap-x:0
    }

    .android-full-width-promo .devsite-landing-row-header-buttons {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 16px;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.android-image-first-promo:hover .devsite-landing-row-item-description h3 a {
    --devsite-link-color: #174ea6
}

.android-image-first-promo.android-fully-clickable:hover .devsite-landing-row-item-media {
    box-shadow: 0 5px 15px 0 rgba(0,0,0,.1);
    -webkit-transition: box-shadow .2s ease-in-out;
    transition: box-shadow .2s ease-in-out
}

.android-image-first-promo.android-fully-clickable:before {
    display: none
}

.android-image-first-promo-card,.android-modal-dialog-card {
    --devsite-card-border: 1px solid #dadce0;
    --devsite-card-border-radius: 24px;
    --devsite-item-media-border-radius: 24px 0 0
}

.android-image-first-promo-card:hover,.android-modal-dialog-card:hover {
    box-shadow: 0 5px 15px 0 rgba(0,0,0,.1)
}

.android-fully-clickable.android-modal-dialog-card:before,.android-image-first-promo-card.android-fully-clickable:before {
    display: none
}

.android-quick-links {
    --android-quick-links-gap: 32px;
    --android-quick-links-flex-direction: row
}

@media screen and (max-width: 840px) {
    .android-quick-links {
        --android-quick-links-gap:24px;
        --android-quick-links-flex-direction: column
    }
}

@media screen and (max-width: 600px) {
    .android-quick-links {
        --android-quick-links-gap:16px
    }
}

.android-quick-link {
    --android-quick-link-font: 500 20px/28px var(--devsite-headline-font-family);
    --android-quick-link-padding: 20px
}

@media screen and (max-width: 840px) {
    .android-quick-link {
        --android-quick-link-font:500 18px/28px var(--devsite-headline-font-family);
        --android-quick-link-padding: 14px 18px
    }
}

@media screen and (max-width: 600px) {
    .android-quick-link {
        --android-quick-link-font:500 16px/24px var(--devsite-headline-font-family)
    }
}

.android-quick-links {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: var(--android-quick-links-flex-direction);
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: var(--android-quick-links-flex-direction);
    flex-direction: var(--android-quick-links-flex-direction);
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: var(--android-quick-links-gap);
    list-style: none;
    margin: 0;
    padding: 0
}

.android-quick-links li {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    width: 100%
}

.android-quick-links+.android-quick-links {
    -webkit-padding-before: var(--android-quick-links-gap);
    padding-block-start:var(--android-quick-links-gap)}

.android-quick-link {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--devsite-background-1);
    border: var(--android-quick-link-border);
    border-radius: var(--android-quick-link-border-radius);
    color: var(--android-quick-link-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font: var(--android-quick-link-font);
    padding: var(--android-quick-link-padding);
    width: 100%
}

.android-quick-link:active,.android-quick-link:focus,.android-quick-link:hover {
    background-color: var(--android-quick-link-background-hover);
    text-decoration: none
}

.android-quick-link-image {
    aspect-ratio: 48px/48px;
    height: 48px;
    margin-right: 20px;
    width: 48px
}

.android-quick-link-label {
    margin-right: auto
}

.android-quick-link-icon {
    color: var(--android-quick-link-icon-color);
    display: inline-block
}

[dir=ltr] .android-quick-link-icon {
    margin-left: 8px
}

[dir=rtl] .android-quick-link-icon {
    margin-right: 8px
}

.android-testimonial {
    background: var(--android-testimonial-background,#f1f3f4);
    border-radius: 0 24px 24px;
    color: var(--android-testimonial-color,var(--devsite-primary-text-color));
    margin: 32px 0
}

.devsite-landing-row-1-up .android-testimonial-with-photo {
    min-height: 396px;
    padding-left: 396px;
    position: relative
}

.android-testimonial-photo {
    overflow: hidden
}

.devsite-landing-row-1-up .android-testimonial-photo {
    border-radius: 0 0 0 24px;
    bottom: 0;
    height: 396px;
    left: 0;
    position: absolute;
    width: 396px
}

.devsite-landing-row-2-up .android-testimonial-photo {
    border-radius: 0 0 24px 24px
}

.android-testimonial-photo-image {
    width: 100%
}

.android-testimonial-quote {
    font: 400 20px/32px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    letter-spacing: .25px;
    margin: 0;
    padding: 32px;
    word-wrap: break-word
}

.devsite-landing-row-1-up .android-testimonial-with-photo .android-testimonial-quote {
    padding-top: 68px
}

.android-testimonial-quote b,.android-testimonial-quote strong {
    font-weight: 700
}

.android-testimonial-author-name {
    color: var(--android-testimonial-author-name-color,#5f6368);
    display: block;
    font: 500 20px/28px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif
}

.android-testimonial-author-company-info {
    color: var(--android-testimonial-author-company-info-color,#5f6368);
    font: 500 16px/24px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    padding: 0 32px 32px
}

.android-testimonial-company-logo,.android-testimonial-photo {
    line-height: 0
}

@media screen and (max-width: 840px) {
    .devsite-landing-row-1-up .android-testimonial-with-photo {
        min-height:0;
        padding-left: 0;
        padding-bottom: 174px
    }

    .devsite-landing-row-1-up .android-testimonial-photo {
        border-radius: 0 0 0 24px;
        height: 174px;
        width: 174px
    }

    .android-testimonial-quote {
        padding: 24px
    }

    .devsite-landing-row-1-up .android-testimonial-with-photo .android-testimonial-quote {
        padding-top: 24px
    }

    .android-testimonial-author-company-info {
        padding: 0 24px 24px
    }

    .android-testimonial-attribution {
        position: relative
    }

    .devsite-landing-row-1-up .android-testimonial-with-photo .android-testimonial-attribution {
        bottom: 0;
        height: 174px;
        left: 0;
        padding-left: 174px;
        position: absolute
    }
}

@media screen and (max-width: 600px) {
    .devsite-landing-row-1-up .android-testimonial-with-photo {
        padding-bottom:0
    }

    .devsite-landing-row-1-up .android-testimonial-photo {
        border-radius: 0 0 24px 24px;
        height: auto;
        position: static;
        width: 100%
    }

    .android-testimonial-quote {
        font: 400 16px/24px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
        padding: 16px
    }

    .devsite-landing-row-1-up .android-testimonial-with-photo .android-testimonial-quote {
        padding-top: 16px
    }

    .android-testimonial-author-company-info {
        font: 500 14px/16px Google Sans Text,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
        padding: 0 16px 16px
    }

    .devsite-landing-row-1-up .android-testimonial-with-photo .android-testimonial-attribution {
        height: auto;
        padding-left: 0;
        position: static
    }
}

@media screen and (max-width: 840px) {
    .devsite-footer-promos .devsite-footer-promos-list,.devsite-main-content[has-book-nav]~devsite-footer-promos .devsite-footer-promos .devsite-footer-promos-list {
        display:-webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around
    }

    .devsite-footer-promos-list .devsite-footer-promo,.devsite-main-content[has-book-nav]~devsite-footer-promos .devsite-footer-promos-list .devsite-footer-promo {
        -webkit-box-flex: 0;
        -webkit-flex: 0 1 192px;
        -moz-box-flex: 0;
        -ms-flex: 0 1 192px;
        flex: 0 1 192px
    }

    .devsite-footer-promo .devsite-footer-promo-title {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .devsite-footer-promo-title .devsite-footer-promo-icon {
        margin-inline:0}

    .devsite-footer-promo-label {
        display: none
    }
}

.android-fully-clickable-link:active,.android-fully-clickable-link:focus,.android-fully-clickable-link:hover {
    -webkit-transform: none!important;
    transform: none!important
}

.android-fully-clickable-link:not(.button):active,.android-fully-clickable-link:not(.button):focus,.android-fully-clickable-link:not(.button):hover {
    text-decoration: none!important
}

.android-fully-clickable-link:before {
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

cloud-shell-button span {
    padding: 0 0 0 5px
}

cloud-shell-button svg {
    padding: 0 0 2px;
    vertical-align: middle
}

cloud-shell-pane {
    --pane-resizer-height: 24px;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column nowrap;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    height: 284px;
    max-height: inherit;
    min-height: 72px
}

cloud-shell-pane.opened {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

cloud-shell-pane[devsite-size=content-area] {
    padding-top: 13px
}

cloud-shell-pane[devsite-size=content-area][cr-os] {
    padding-top: 20px
}

cloud-shell-pane[devsite-size=content-area]>.resizer {
    display: none
}

cloud-shell-pane[devsite-size=content-area]>devsite-shell {
    outline: initial
}

cloud-shell-pane[is-resizing] {
    --cloudshell-active-border: 1px solid var(--devsite-link-color)
}

cloud-shell-pane[is-resizing]>devsite-shell {
    outline: var(--cloudshell-active-border)
}

cloud-shell-pane[is-resizing]>.resizer>.grabber-focus {
    border-left: var(--cloudshell-active-border);
    border-right: var(--cloudshell-active-border);
    border-top: var(--cloudshell-active-border)
}

cloud-shell-pane[is-resizing]>.resizer>.grabber-focus>.grabber {
    background: var(--devsite-link-color)
}

cloud-shell-pane>.resizer {
    background: transparent;
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 content;
    -moz-box-flex: 0;
    -ms-flex: 0 1 content;
    flex: 0 1 content;
    pointer-events: auto;
    -ms-touch-action: none;
    touch-action: none;
    width: 100%;
    z-index: 1
}

cloud-shell-pane>.resizer:hover {
    cursor: row-resize
}

cloud-shell-pane>.resizer:hover .grabber-focus .grabber {
    background: var(--devsite-link-color)
}

cloud-shell-pane>.resizer>.grabber-focus {
    background: var(--devsite-primary-color);
    border-left: var(--devsite-primary-border);
    border-radius: 5px 5px 0 0;
    border-right: var(--devsite-primary-border);
    border-top: var(--devsite-primary-border);
    height: var(--pane-resizer-height);
    margin: 0 auto;
    width: 48px
}

cloud-shell-pane>.resizer>.grabber-focus>.grabber {
    background: #fff;
    height: 3px;
    margin: 11px auto 10px;
    width: 22px
}

cloud-shell-pane>.free-trial-banner {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-background-0);
    display: none;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    height: calc(100% - var(--pane-resizer-height));
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    position: absolute;
    top: var(--pane-resizer-height);
    width: 100%;
    z-index: 2
}

cloud-shell-pane>.free-trial-banner>.close-btn {
    color: initial;
    position: absolute;
    right: 10px;
    top: 10px
}

cloud-shell-pane>.free-trial-banner>.banner-text {
    display: inline-block;
    margin: 20px 0
}

cloud-shell-pane>.free-trial-banner>.banner-text>h3 {
    margin: initial
}

cloud-shell-pane>.free-trial-banner>.banner-text>p {
    color: var(--devsite-primary-text-color);
    margin: 16px 0 8px
}

cloud-shell-pane>.free-trial-banner>.banner-text>ul>li {
    margin: initial
}

cloud-shell-pane>.free-trial-banner>.banner-text>div.row {
    margin: 20px 0 0
}

cloud-shell-pane devsite-shell {
    background: var(--devsite-primary-color);
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
    -moz-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    height: 48px;
    outline: var(--devsite-primary-border)
}

body[free-trial] cloud-shell-pane[enable-fte-user-flow] .free-trial-banner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

cloudx-demo {
    display: block
}

cloudx-demo>iframe {
    border: 0;
    display: block;
    overflow: hidden;
    min-width: 100%;
    width: 1px
}

body:not([free-trial]) .cloud-free-trial-button,body:not([free-trial]) .cloud-free-trial>.eligible,body:not([free-trial]) cloud-free-trial>.eligible,body[free-trial] .cloud-free-trial>.ineligible,body[free-trial] cloud-free-trial>.ineligible {
    display: none
}

cloudx-select-dropdown {
    display: inline-block
}

cloudx-select-dropdown .cloud-select-dropdown__icon {
    margin-top: 1px;
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s,-webkit-transform .2s
}

cloudx-select-dropdown .cloud-select-dropdown__icon--active {
    -webkit-transform: scale(-1);
    transform: scale(-1)
}

cloudx-select-dropdown .cloud-select-dropdown__items {
    background-color: var(--devsite-background-1);
    border: var(--devsite-primary-border);
    border-radius: 4px;
    display: none;
    font: 500 14px/16px var(--devsite-primary-font-family);
    list-style: none;
    margin: 8px 0 0;
    max-width: 220px;
    padding: 9px 0;
    position: absolute;
    z-index: 2
}

cloudx-select-dropdown .cloud-select-dropdown__items--active {
    display: block
}

cloudx-select-dropdown .cloud-select-dropdown__item {
    color: var(--devsite-secondary-text-color);
    display: block;
    margin: 0;
    text-decoration: none
}

cloudx-select-dropdown .cloud-select-dropdown__item--disabled,cloudx-select-dropdown .cloud-select-dropdown__item-link,cloudx-select-dropdown .cloud-select-dropdown__item-text {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 9px 24px
}

cloudx-select-dropdown .cloud-select-dropdown__item-link {
    color: var(--devsite-secondary-text-color)
}

cloudx-select-dropdown .cloud-select-dropdown__item-link:focus {
    text-decoration: none
}

cloudx-select-dropdown .cloud-select-dropdown__item-text {
    display: inline-block;
    -webkit-margin-start: 30px;
    -moz-margin-start: 30px;
    margin-inline-start:30px}

cloudx-select-dropdown .cloud-select-dropdown__item:hover {
    background: var(--devsite-button-background-hover)
}

cloudx-select-dropdown .cloud-select-dropdown__item:focus,cloudx-select-dropdown .cloud-select-dropdown__item:focus-within {
    background: var(--devsite-button-background-active);
    text-decoration: none
}

devsite-a11y-announce {
    background: transparent;
    color: transparent;
    display: block;
    height: 1px;
    left: -500vw;
    overflow: hidden;
    position: absolute;
    top: -500vh;
    width: 1px;
    z-index: -1
}

.button,.devsite-footer-utility-button>a,button,input[type=button],input[type=file],input[type=image],input[type=reset],input[type=submit] {
    -moz-appearance: none;
    -webkit-appearance: none;
    -webkit-align-self: var(--devsite-button-align-self);
    -ms-flex-item-align: var(--devsite-button-align-self);
    align-self: var(--devsite-button-align-self);
    background: var(--devsite-button-background,var(--devsite-background-1));
    border: var(--devsite-button-border,0);
    border-radius: var(--devsite-button-border-radius,2px);
    box-shadow: var(--devsite-button-box-shadow,0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color));
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: var(--devsite-button-color);
    cursor: pointer;
    display: inline-block;
    font: var(--devsite-button-font,500 14px/36px var(--devsite-primary-font-family));
    height: var(--devsite-button-height,36px);
    letter-spacing: var(--devsite-button-letter-spacing,0);
    line-height: var(--devsite-button-line-height,36px);
    margin: var(--devsite-button-margin,0);
    -webkit-margin-end: var(--devsite-button-margin-x-end);
    -moz-margin-end: var(--devsite-button-margin-x-end);
    margin-inline-end:var(--devsite-button-margin-x-end);max-width: var(--devsite-button-max-width,none);
    min-width: 36px;
    outline: 0;
    overflow: hidden;
    padding: var(--devsite-button-padding,0 16px);
    text-align: center;
    text-decoration: none;
    text-overflow: ellipsis;
    text-transform: var(--devsite-button-text-transform,uppercase);
    -webkit-transition: background-color .2s,border .2s,box-shadow .2s;
    transition: background-color .2s,border .2s,box-shadow .2s;
    vertical-align: middle;
    white-space: nowrap;
    width: var(--devsite-button-width,auto)
}

.button:focus,.button:hover,.devsite-footer-utility-button>a:focus,.devsite-footer-utility-button>a:hover,button:focus,button:hover,input[type=button]:focus,input[type=button]:hover,input[type=file]:focus,input[type=file]:hover,input[type=image]:focus,input[type=image]:hover,input[type=reset]:focus,input[type=reset]:hover,input[type=submit]:focus,input[type=submit]:hover {
    background: var(--devsite-button-background-hover);
    border: var(--devsite-button-border-hover,0);
    color: var(--devsite-button-color-hover,var(--devsite-button-color));
    font-weight: 500;
    -webkit-text-decoration: var(--devsite-button-text-decoration-hover,none);
    -moz-text-decoration: var(--devsite-button-text-decoration-hover,none);
    text-decoration: var(--devsite-button-text-decoration-hover,none)
}

.button:focus,.devsite-footer-utility-button>a:focus,button:focus,input[type=button]:focus,input[type=file]:focus,input[type=image]:focus,input[type=reset]:focus,input[type=submit]:focus {
    box-shadow: var(--devsite-button-box-shadow-focus,none)
}

.button:active,.devsite-footer-utility-button>a:active,button:active,input[type=button]:active,input[type=file]:active,input[type=image]:active,input[type=reset]:active,input[type=submit]:active {
    background: var(--devsite-button-background-active);
    border: var(--devsite-button-border-active,0);
    box-shadow: var(--devsite-button-box-shadow-active,0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color));
    -webkit-transform: var(--devsite-button-transform-active,none);
    transform: var(--devsite-button-transform-active,none)
}

[foreground] .button,[foreground][background] .button {
    border-color: var(--devsite-foreground-button-border-color,transparent)
}

[foreground] .button,[foreground] .button:active,[foreground] .button:focus,[foreground] .button:hover,[foreground][background] .button,[foreground][background] .button:active,[foreground][background] .button:focus,[foreground][background] .button:hover {
    color: var(--devsite-foreground-button-color,var(--devsite-foreground-color,var(--devsite-primary-color,var(--devsite-button-color))))
}

[foreground] .button:active,[foreground] .button:focus,[foreground] .button:hover,[foreground][background] .button:active,[foreground][background] .button:focus,[foreground][background] .button:hover {
    background: var(--devsite-foreground-button-background-hover);
    border-color: var(--devsite-foreground-button-border-color-hover,transparent);
    color: var(--devsite-foreground-button-color-hover,var(--devsite-foreground-color,var(--devsite-primary-color,var(--devsite-button-color))))
}

[foreground] .button:active,[foreground][background] .button:active {
    background: var(--devsite-foreground-button-background-active,var(--devsite-foreground-button-background-hover));
    border-color: var(--devsite-foreground-button-border-color-active,transparent)
}

[background]:not(.devsite-landing-row-cards) .button:not([disabled]) {
    background: var(--devsite-background-button-background,var(--devsite-background-1));
    border-color: var(--devsite-background-button-border-color,transparent);
    color: var(--devsite-foreground-button-color,var(--devsite-background-button-color,var(--devsite-button-color)))
}

[background]:not(.devsite-landing-row-cards) .button:not([disabled]):active,[background]:not(.devsite-landing-row-cards) .button:not([disabled]):focus,[background]:not(.devsite-landing-row-cards) .button:not([disabled]):hover {
    background: var(--devsite-background-button-background-hover,var(--devsite-button-background-hover));
    border-color: var(--devsite-background-button-border-color-hover,transparent);
    color: var(--devsite-foreground-button-color-hover,var(--devsite-foreground-button-color,var(--devsite-background-button-color-hover,var(--devsite-button-color))))
}

[background]:not(.devsite-landing-row-cards) .button:not([disabled]):active {
    border-color: var(--devsite-background-button-border-color-active,transparent)
}

.button.button-disabled,.button.button-disabled:active,.button.button-disabled:focus,.button.button-disabled:hover,[background] .button.button-disabled,[background] .button.button-disabled:active,[background] .button.button-disabled:focus,[background] .button.button-disabled:hover,[foreground] .button.button-disabled,[foreground] .button.button-disabled:active,[foreground] .button.button-disabled:focus,[foreground] .button.button-disabled:hover,body[theme] [background] .button.button-disabled,body[theme] [background] .button.button-disabled:active,body[theme] [background] .button.button-disabled:focus,body[theme] [background] .button.button-disabled:hover,body[theme] [foreground] .button.button-disabled,body[theme] [foreground] .button.button-disabled:active,body[theme] [foreground] .button.button-disabled:focus,body[theme] [foreground] .button.button-disabled:hover,button[disabled],button[disabled]:active,button[disabled]:focus,button[disabled]:hover,input[type=button][disabled],input[type=button][disabled]:active,input[type=button][disabled]:focus,input[type=button][disabled]:hover,input[type=file][disabled],input[type=file][disabled]:active,input[type=file][disabled]:focus,input[type=file][disabled]:hover,input[type=image][disabled],input[type=image][disabled]:active,input[type=image][disabled]:focus,input[type=image][disabled]:hover,input[type=reset][disabled],input[type=reset][disabled]:active,input[type=reset][disabled]:focus,input[type=reset][disabled]:hover,input[type=submit][disabled],input[type=submit][disabled]:active,input[type=submit][disabled]:focus,input[type=submit][disabled]:hover {
    background: var(--devsite-button-disabled-background,#ddd);
    border: var(--devsite-button-disabled-border,0);
    box-shadow: none;
    color: var(--devsite-button-disabled-color,var(--devsite-tertiary-text-rgba));
    cursor: default;
    line-height: var(--devsite-button-disabled-line-height,36px);
    pointer-events: none
}

.button-blue,.button-green,.button-primary,.button-red,body devsite-footer-utility .devsite-footer-utility-button>a {
    background: var(--devsite-button-primary-background,var(--devsite-button-color));
    color: var(--devsite-button-primary-color,var(--devsite-inverted-text-color));
    line-height: var(--devsite-button-primary-line-height,36px);
    border: 0
}

@media (forced-colors:active) {
    .button-blue,.button-green,.button-primary,.button-red,body devsite-footer-utility .devsite-footer-utility-button>a {
        border: 1px solid ButtonText;
        border-radius: 4px
    }
}

.button-blue:active,.button-blue:focus,.button-blue:hover,.button-green:active,.button-green:focus,.button-green:hover,.button-primary:active,.button-primary:focus,.button-primary:hover,.button-red:active,.button-red:focus,.button-red:hover,body devsite-footer-utility .devsite-footer-utility-button>a:active,body devsite-footer-utility .devsite-footer-utility-button>a:focus,body devsite-footer-utility .devsite-footer-utility-button>a:hover {
    border: 0
}

.button-blue:hover,.button-green:hover,.button-primary:hover,.button-red:hover,body devsite-footer-utility .devsite-footer-utility-button>a:hover {
    box-shadow: var(--devsite-button-primary-box-shadow-hover,0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color))
}

.button-blue:focus,.button-blue:hover,.button-green:focus,.button-green:hover,.button-primary:focus,.button-primary:hover,.button-red:focus,.button-red:hover,body devsite-footer-utility .devsite-footer-utility-button>a:focus,body devsite-footer-utility .devsite-footer-utility-button>a:hover {
    background: var(--devsite-button-primary-background-hover);
    border: var(--devsite-button-primary-border-hover);
    color: var(--devsite-button-primary-color-hover,var(--devsite-button-primary-color,var(--devsite-inverted-text-color)))
}

@media (forced-colors:active) {
    .button-blue:focus,.button-blue:hover,.button-green:focus,.button-green:hover,.button-primary:focus,.button-primary:hover,.button-red:focus,.button-red:hover,body devsite-footer-utility .devsite-footer-utility-button>a:focus,body devsite-footer-utility .devsite-footer-utility-button>a:hover {
        border: 1px solid Highlight
    }
}

.button-blue:active,.button-green:active,.button-primary:active,.button-red:active,body devsite-footer-utility .devsite-footer-utility-button>a:active {
    background: var(--devsite-button-primary-background-active);
    box-shadow: var(--devsite-button-primary-box-shadow-active,0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color));
    color: var(--devsite-button-primary-color-active,var(--devsite-button-primary-color,var(--devsite-inverted-text-color)))
}

[background]:not(.devsite-landing-row-cards) .button-primary:not([disabled]) {
    background: var(--devsite-background-button-primary-background,var(--devsite-background-1));
    color: var(--devsite-background-button-primary-color,var(--devsite-button-color))
}

[background]:not(.devsite-landing-row-cards) .button-primary:not([disabled]):active,[background]:not(.devsite-landing-row-cards) .button-primary:not([disabled]):focus,[background]:not(.devsite-landing-row-cards) .button-primary:not([disabled]):hover {
    color: var(--devsite-background-button-primary-color-hover,var(--devsite-background-button-primary-color,var(--devsite-button-color)))
}

[background]:not(.devsite-landing-row-cards) .button-primary:not([disabled]):focus,[background]:not(.devsite-landing-row-cards) .button-primary:not([disabled]):hover {
    background: var(--devsite-background-button-primary-background-hover)
}

[background]:not(.devsite-landing-row-cards) .button-primary:not([disabled]):active {
    background: var(--devsite-background-button-primary-background-hover)
}

[foreground] .button-primary,[foreground][background] .button-primary {
    background: var(--devsite-foreground-button-primary-background);
    color: var(--devsite-foreground-button-primary-color,var(--devsite-inverted-text-color))
}

[foreground] .button-primary:active,[foreground] .button-primary:focus,[foreground] .button-primary:hover,[foreground][background] .button-primary:active,[foreground][background] .button-primary:focus,[foreground][background] .button-primary:hover {
    background: var(--devsite-foreground-button-primary-background-hover);
    color: var(--devsite-foreground-button-primary-color-hover,var(--devsite-foreground-button-primary-color,var(--devsite-inverted-text-color)))
}

.button-flat,.button-white {
    background: var(--devsite-button-white-background,0);
    color: var(--devsite-button-white-color,var(--devsite-button-color));
    line-height: var(--devsite-button-white-line-height,36px);
    padding-inline:8px}

.button-flat,.button-flat:active,.button-flat:focus,.button-flat:hover,.button-white,.button-white:active,.button-white:focus,.button-white:hover {
    border: 0
}

.button-flat,.button-flat:hover,.button-white,.button-white:hover {
    box-shadow: var(--devsite-button-white-box-shadow-hover,none)
}

.button-flat:active,.button-flat:focus,.button-flat:hover,.button-white:active,.button-white:focus,.button-white:hover {
    color: var(--devsite-button-white-color-hover,var(--devsite-button-white-color,var(--devsite-button-color)));
    -webkit-text-decoration: var(--devsite-button-white-text-decoration-hover,none);
    -moz-text-decoration: var(--devsite-button-white-text-decoration-hover,none);
    text-decoration: var(--devsite-button-white-text-decoration-hover,none)
}

.button-flat:focus,.button-flat:hover,.button-white:focus,.button-white:hover {
    background: var(--devsite-button-white-background-hover,var(--devsite-button-background-hover))
}

.button-flat:focus,.button-white:focus {
    box-shadow: var(--devsite-button-white-box-shadow-focus,none)
}

.button-flat:active,.button-white:active {
    background: var(--devsite-button-white-background-active,var(--devsite-button-background-active));
    box-shadow: var(--devsite-button-white-box-shadow-active,none)
}

[background]:not(.devsite-landing-row-cards) .button-white:not([disabled]) {
    background: transparent
}

[background]:not(.devsite-landing-row-cards) .button-white:not([disabled]),[background]:not(.devsite-landing-row-cards) .button-white:not([disabled]):active,[background]:not(.devsite-landing-row-cards) .button-white:not([disabled]):focus,[background]:not(.devsite-landing-row-cards) .button-white:not([disabled]):hover {
    color: var(--devsite-background-button-white-color,var(--devsite-inverted-text-color))
}

[background]:not(.devsite-landing-row-cards) .button-white:not([disabled]):hover {
    background: var(--devsite-background-button-white-background-hover)
}

[background]:not(.devsite-landing-row-cards) .button-white:not([disabled]):focus {
    background: var(--devsite-background-button-white-background-focus)
}

[background][foreground] .button-white,[background][foreground] .button-white:active,[background][foreground] .button-white:focus,[background][foreground] .button-white:hover,[foreground] .button-white,[foreground] .button-white:active,[foreground] .button-white:focus,[foreground] .button-white:hover {
    color: var(--devsite-foreground-button-white-color,var(--devsite-foreground-button-color,var(--devsite-foreground-color)))
}

[background][foreground] .button-white:focus,[background][foreground] .button-white:hover,[foreground] .button-white:focus,[foreground] .button-white:hover {
    background: var(--devsite-foreground-button-white-background-hover,var(--devsite-foreground-button-background-hover))
}

[background][foreground] .button-white:active,[foreground] .button-white:active {
    background: var(--devsite-foreground-button-white-background-active,var(--devsite-foreground-button-background-active,var(--devsite-foreground-button-background-hover)))
}

[background=theme]:not(.devsite-landing-row-cards) .button-white {
    color: var(--devsite-text-color,var(--devsite-inverted-text-color))
}

.button-white.button-disabled,.button-white[disabled] {
    background: 0
}

.button-raised {
    background: var(--devsite-button-raised-background,var(--devsite-background-1));
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color);
    line-height: var(--devsite-button-raised-line-height,36px)
}

.button-raised,.button-raised:active,.button-raised:focus,.button-raised:hover {
    border: 0;
    color: var(--devsite-button-raised-color,var(--devsite-button-color))
}

.button-raised:focus,.button-raised:hover {
    background: var(--devsite-button-raised-background-hover,var(--devsite-button-background-hover));
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color)
}

.button-raised:active {
    background: var(--devsite-button-raised-background-active,var(--devsite-button-background-active));
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color)
}

[background]:not(.devsite-landing-row-cards) .button-raised {
    background: var(--devsite-background-1)
}

.button+.button,button+button,input[type=button]+input[type=button],input[type=file]+input[type=file],input[type=image]+input[type=image],input[type=reset]+input[type=reset],input[type=submit]+input[type=submit] {
    -webkit-margin-start: var(--devsite-button-sibling-gap-x,16px);
    -moz-margin-start: var(--devsite-button-sibling-gap-x,16px);
    margin-inline-start:var(--devsite-button-sibling-gap-x,16px)}

.button-flat+.button-flat,.button-white+.button-white,button+.button {
    -webkit-margin-start: 8px;
    -moz-margin-start: 8px;
    margin-inline-start:8px}

[foreground] .button-primary:active,[foreground] .button-primary:focus,[foreground] .button-primary:hover,[foreground] .button-raised:active,[foreground] .button-raised:focus,[foreground] .button-raised:hover,[foreground] .button-white:active,[foreground] .button-white:focus,[foreground] .button-white:hover {
    border: 0
}

.button-transparent {
    padding-inline:8px}

.button-transparent,.button-transparent:focus,.button-transparent:hover {
    background-color: transparent;
    border: 0;
    box-shadow: none
}

.button-text-white {
    color: var(--devsite-inverted-text-color)
}

.button-text-blue {
    color: var(--devsite-link-color)
}

.button-lowercase {
    text-transform: none
}

.button-unindented {
    -webkit-margin-start: var(--devsite-button-unindented-margin-x,-8px);
    -moz-margin-start: var(--devsite-button-unindented-margin-x,-8px);
    margin-inline-start:var(--devsite-button-unindented-margin-x,-8px)}

.button-icon,.button>.material-icons,button>.material-icons {
    font-size: 18px;
    height: 18px;
    width: 18px
}

.button.button-with-icon,.button.external {
    padding: var(--devsite-button-with-icon-padding,0 16px)
}

.button-primary.button-with-icon,.button-primary.external,.button-raised.button-with-icon,.button-raised.external {
    padding: var(--devsite-button-primary-with-icon-padding,0 16px)
}

.button-white.button-with-icon,.button-white.external {
    padding-inline:16px}

.button>.material-icons,button>.material-icons {
    direction: unset;
    margin-inline:8px;position: relative;
    top: -2px;
    vertical-align: middle
}

.button>.button-icon,button>.button-icon {
    margin-inline:8px}

.button-with-icon>.button-icon,.button-with-icon>.material-icons {
    margin-inline:-4px 8px}

.button-with-icon>.icon-after,.button.external:not(.button-with-icon):after,button.external:not(.button-with-icon):after {
    margin-inline:8px -4px}

.button:not(.button-with-icon)>.material-icons:not(.icon-after) {
    -webkit-margin-start: var(--devsite-button-material-icon-margin-x,-4px);
    -moz-margin-start: var(--devsite-button-material-icon-margin-x,-4px);
    margin-inline-start:var(--devsite-button-material-icon-margin-x,-4px)}

.button: not(.button-with-icon)>.icon-after {
    -webkit-margin-end:var(--devsite-button-material-icon-margin-x,-4px);
    -moz-margin-end: var(--devsite-button-material-icon-margin-x,-4px);
    margin-inline-end:var(--devsite-button-material-icon-margin-x,-4px)}

.button-white: not(.button-with-icon)>.material-icons:not(.icon-after) {
    -webkit-margin-start:var(--devsite-button-white-material-icon-margin-x,4px);
    -moz-margin-start: var(--devsite-button-white-material-icon-margin-x,4px);
    margin-inline-start:var(--devsite-button-white-material-icon-margin-x,4px)}

.button-white: not(.button-with-icon)>.icon-after {
    -webkit-margin-end:var(--devsite-button-white-material-icon-margin-x,4px);
    -moz-margin-end: var(--devsite-button-white-material-icon-margin-x,4px);
    margin-inline-end:var(--devsite-button-white-material-icon-margin-x,4px)}

.devsite-landing-row-item[foreground=grey] .button,[foreground=grey] .button {
    background: var(--devsite-secondary-text-color)
}

.devsite-landing-row-item[foreground=grey] .button:active,.devsite-landing-row-item[foreground=grey] .button:focus,.devsite-landing-row-item[foreground=grey] .button:hover,[foreground=grey] .button:active,[foreground=grey] .button:focus,[foreground=grey] .button:hover {
    background: #3c4043
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0
}

input[type=radio] {
    -webkit-appearance: none;
    background: var(--devsite-background-1);
    border-radius: 2px;
    cursor: pointer;
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    height: 18px;
    margin-block:-2px 2px;margin-inline:0 8px;outline: 0;
    position: relative;
    -webkit-transition: color .2s;
    transition: color .2s;
    vertical-align: middle;
    width: 18px
}

input[type=radio] {
    color: var(--devsite-secondary-text-color)
}

input[type=radio] {
    border-radius: 50%;
    -webkit-transition: none;
    transition: none
}

input[type=radio]:focus:before {
    background: var(--devsite-background-4)
}

input[type=radio]:checked {
    color: var(--devsite-link-color)
}

input[type=radio]:focus:before {
    background: var(--devsite-input-background-focus,var(--devsite-link-background))
}

input[type=radio]:after {
    content: "check_box_outline_blank";
    position: relative;
    top: -3px;
    z-index: 1
}

[dir=ltr] input[type=radio]:after {
    right: 3px
}

[dir=rtl] input[type=radio]:after {
    left: 3px
}

input[type=radio]:after {
    content: "radio_button_unchecked"
}

input[type=radio]:checked:after {
    content: "radio_button_checked"
}

input[type=radio]:before {
    border-radius: 50%;
    content: "";
    display: block;
    height: 36px;
    position: absolute;
    top: -9px;
    -webkit-transition: background .2s;
    transition: background .2s;
    width: 36px
}

[dir=ltr] input[type=radio]:before {
    left: -9px
}

[dir=rtl] input[type=radio]:before {
    right: -9px
}

input[type=radio]:disabled {
    color: var(--devsite-input-color-disabled,var(--devsite-tertiary-text-color));
    cursor: default
}

input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select[multiple],select[size],textarea {
    background: var(--devsite-input-background);
    border: var(--devsite-input-border);
    border-radius: var(--devsite-input-border-radius,2px);
    color: var(--devsite-input-color,var(--devsite-primary-text-color));
    font: var(--devsite-input-font,16px/20px var(--devsite-primary-font-family));
    height: var(--devsite-input-height,auto);
    margin: var(--devsite-input-margin,0);
    max-width: 100%;
    outline: 0;
    padding: var(--devsite-input-padding,7px);
    -webkit-transition: border-color .2s;
    transition: border-color .2s;
    vertical-align: middle;
    width: var(--devsite-input-width,auto)
}

input[type=date]:focus,input[type=datetime-local]:focus,input[type=datetime]:focus,input[type=email]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=time]:focus,input[type=url]:focus,input[type=week]:focus,select[multiple]:focus,select[size]:focus,textarea:focus {
    border-bottom: var(--devsite-input-border-bottom-focus,2px solid var(--devsite-link-color));
    padding-bottom: var(--devsite-input-padding-bottom-focus,6px)
}

input[type=date]:disabled,input[type=datetime-local]:disabled,input[type=datetime]:disabled,input[type=email]:disabled,input[type=month]:disabled,input[type=number]:disabled,input[type=password]:disabled,input[type=search]:disabled,input[type=tel]:disabled,input[type=text]:disabled,input[type=time]:disabled,input[type=url]:disabled,input[type=week]:disabled,select[multiple]:disabled,select[size]:disabled,textarea:disabled {
    background: var(--devsite-background-3)
}

body input[type=file] {
    height: auto;
    line-height: 1em;
    padding: var(--devsite-input-file-padding,8px 16px)
}

select {
    -moz-appearance: none;
    -webkit-appearance: none;
    background-color: var(--devsite-select-background-color);
    border: var(--devsite-select-border,var(--devsite-secondary-border));
    border-radius: var(--devsite-select-border-radius);
    box-shadow: none;
    color: var(--devsite-select-color,var(--devsite-primary-text-color));
    cursor: pointer;
    display: inline-block;
    font: var(--devsite-select-font,500 14px/36px var(--devsite-primary-font-family));
    height: var(--devsite-select-height,36px);
    line-height: var(--devsite-select-line-height,34px);
    max-width: var(--devsite-select-max-width,340px);
    min-width: 72px;
    outline: 0;
    overflow: hidden;
    padding-block:var(--devsite-select-padding-block,0);padding-inline: var(--devsite-select-padding-inline,7px 27px);
    text-align: left;
    text-indent: .01px;
    text-overflow: ellipsis;
    -webkit-transition: background-color .2s;
    transition: background-color .2s;
    vertical-align: middle;
    white-space: nowrap;
    background-image: var(--devsite-select-background-image);
    background-position: 100%;
    background-repeat: no-repeat
}

select:focus,select:hover {
    background-color: var(--devsite-select-background-color-hover,var(--devsite-background-3));
    border: var(--devsite-select-border-hover,var(--devsite-select-border,var(--devsite-secondary-border)));
    color: var(--devsite-select-color-hover)
}

select:active {
    background-color: var(--devsite-select-background-color-active,var(--devsite-background-4));
    color: var(--devsite-select-color-active)
}

select:disabled {
    background-color: var(--devsite-background-3);
    border-color: transparent;
    color: var(--devsite-tertiary-text-color);
    cursor: default
}

select:disabled {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="4" viewBox="0 0 20 4"><path d="M0,0l4,4l4-4H0z" fill="%23bdc1c6"/></svg>')
}

input[type=checkbox] {
    -webkit-appearance: none;
    background: var(--devsite-background-1);
    border-radius: var(--devsite-checkbox-border-radius);
    cursor: pointer;
    height: var(--devsite-checkbox-size);
    margin-block:var(--devsite-checkbox-margin-block);margin-inline: var(--devsite-checkbox-margin-inline);
    outline: 0;
    position: relative;
    -webkit-transition: color .2s;
    transition: color .2s;
    vertical-align: middle;
    width: var(--devsite-checkbox-size)
}

input[type=checkbox] {
    color: var(--devsite-secondary-text-color)
}

input[type=checkbox]:focus:before {
    background: var(--devsite-background-4)
}

input[type=checkbox]:checked,input[type=checkbox]:indeterminate {
    color: var(--devsite-link-color)
}

input[type=checkbox]:checked:focus:before,input[type=checkbox]:indeterminate:focus:before {
    background: var(--devsite-input-background-focus,var(--devsite-link-background))
}

input[type=checkbox]:after {
    content: "check_box_outline_blank";
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    position: relative;
    right: var(--devsite-checkbox-offset-x);
    top: var(--devsite-checkbox-offset-y);
    z-index: 1
}

:host-context([dir=rtl]) input[type=checkbox]:after,[dir=rtl] input[type=checkbox]:after {
    left: var(--devsite-checkbox-offset-x);
    right: auto
}

input[type=checkbox]:checked:after {
    content: "check_box"
}

input[type=checkbox]:indeterminate:after {
    content: "indeterminate_check_box"
}

input[type=checkbox]:before {
    border-radius: var(--devsite-checkbox-icon-canvas-border-radius);
    content: "";
    display: block;
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    height: var(--devsite-checkbox-icon-canvas-size);
    position: absolute;
    top: var(--devsite-checkbox-icon-canvas-offset-y);
    -webkit-transition: background .2s;
    transition: background .2s;
    width: var(--devsite-checkbox-icon-canvas-size)
}

:host-context([dir=ltr]) input[type=checkbox]:before,[dir=ltr] input[type=checkbox]:before {
    left: var(--devsite-checkbox-icon-canvas-offset-x)
}

:host-context([dir=rtl]) input[type=checkbox]:before,[dir=rtl] input[type=checkbox]:before {
    right: var(--devsite-checkbox-icon-canvas-offset-x)
}

input[type=checkbox]:disabled {
    color: var(--devsite-input-color-disabled,var(--devsite-tertiary-text-color));
    cursor: default
}

label {
    color: var(--devsite-secondary-text-color);
    display: block;
    font-size: 12px
}

input+label {
    color: var(--devsite-primary-text-color);
    display: inline;
    font-size: 16px
}

label[for] {
    cursor: pointer
}

input:disabled+label {
    color: var(--devsite-input-color-disabled,var(--devsite-tertiary-text-color));
    cursor: default
}

devsite-access-pass-builder .main-content {
    --pass-preview-width: 270px;
    display: grid;
    grid-gap: 30px;
    grid-template-columns: minmax(752px,936px) minmax(var(--pass-preview-width),330px);
    grid-template-rows: 1fr
}

devsite-access-pass-builder .devsite-article-frame {
    min-width: 0;
    max-width: 936px;
    position: relative;
    grid-column: 1;
    grid-row: 1;
    margin: 24px 0 0 24px;
    background-color: #fff;
    border-radius: 2px;
    box-shadow: 0 1px 2px 0 rgba(60,64,67,.298),0 1px 3px 1px rgba(60,64,67,.149);
    overflow: hidden
}

devsite-access-pass-builder .spacer-large {
    height: 30px
}

devsite-access-pass-builder .spacer-small {
    height: 15px
}

devsite-access-pass-builder .pass-form {
    height: 100%;
    display: block;
    font-family: Roboto,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    color: #202124;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    padding: 40px
}

devsite-access-pass-builder .pass-form var {
    color: #d01884;
    font-weight: 500;
    font-style: italic;
    -webkit-font-smoothing: auto
}

devsite-access-pass-builder .pass-form .material-icons {
    font-family: Material Icons;
    font-weight: 400;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr
}

devsite-access-pass-builder .pass-form ul {
    list-style: disc outside;
    margin: 0;
    padding-left: 40px
}

devsite-access-pass-builder .pass-form li,devsite-access-pass-builder .pass-form li p {
    margin: 12px 0;
    padding: 0
}

devsite-access-pass-builder .pass-form h1 {
    font-family: Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    font-size: 32px;
    color: #202124;
    line-height: 40px;
    font-weight: 400;
    letter-spacing: normal;
    margin: 48px 0 24px
}

devsite-access-pass-builder .pass-form h1:first-of-type {
    display: inline;
    margin-top: 0;
    vertical-align: middle;
    -webkit-margin-end: 83px;
    -moz-margin-end: 83px;
    margin-inline-end:83px}

devsite-access-pass-builder .pass-form .pass-form a.button-with-icon {
    margin-top: 10px;
    padding: 0 12px
}

devsite-access-pass-builder .pass-form .pass-form a.button-with-icon.remove {
    color: #d50000;
    margin-left: 0
}

devsite-access-pass-builder .pass-form h2 {
    font: 400 20px/30px Roboto;
    letter-spacing: normal;
    margin: 30px 0 15px
}

devsite-access-pass-builder .pass-form .pass-form h2+[id^=row-]>h3,devsite-access-pass-builder .pass-form .pass-form h2+a.button {
    margin-top: 0
}

devsite-access-pass-builder .pass-form div[id^=row-]>h3 {
    margin-top: 24px
}

devsite-access-pass-builder .pass-form .tabs-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-access-pass-builder .pass-form .tabs-wrapper .tab {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font: 500 14px/20px Google Sans,Roboto,Arial,sans-serif;
    color: #5f6368
}

devsite-access-pass-builder .pass-form .tabs-wrapper .tab:visited {
    color: inherit
}

devsite-access-pass-builder .pass-form .tabs-wrapper .tab>button {
    margin: 0 2px;
    padding: 0 14px;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    color: #5f6368;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    line-height: 48px;
    max-width: 200px;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    -webkit-transition: color .2s;
    transition: color .2s;
    white-space: nowrap;
    text-decoration: none;
    word-break: break-word;
    outline: 0;
    border: none;
    border-radius: 0
}

devsite-access-pass-builder .pass-form .tabs-wrapper .tab>button:hover {
    background: none;
    border-bottom: 2px solid #78797c
}

devsite-access-pass-builder .pass-form .tabs-wrapper .tab>button span.icon {
    font-family: Material Icons;
    margin-right: 12px;
    font-size: 20px;
    line-height: 1;
    letter-spacing: normal;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr
}

devsite-access-pass-builder .pass-form .tabs-wrapper .tab[active]>button {
    color: #1a73e8;
    border-bottom: 2px solid #1a73e8
}

devsite-access-pass-builder .pass-form .tabs-separator {
    background-color: #e8eaed;
    margin: 0 -40px
}

devsite-access-pass-builder .pass-form label {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    color: #5f6368;
    display: block;
    font-size: 13px;
    margin: 16px 0
}

devsite-access-pass-builder .pass-form label>span {
    display: block;
    margin-right: 5px
}

devsite-access-pass-builder .pass-form .info-row-container {
    display: grid;
    grid-gap: 50px;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr;
    margin-right: 10px
}

devsite-access-pass-builder .pass-form .info-row-container label {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

devsite-access-pass-builder .pass-form .info-row-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

devsite-access-pass-builder .pass-form .info-row-item input {
    width: auto
}

devsite-access-pass-builder .pass-form input {
    width: 25em;
    border: 1px solid #dadce0;
    border-radius: 2px;
    color: #202124;
    font-size: 16px;
    line-height: 20px;
    height: auto;
    margin: 0;
    outline: 0;
    padding: 7px;
    -webkit-transition: border-color .2s;
    transition: border-color .2s;
    vertical-align: middle
}

devsite-access-pass-builder .pass-form input:focus {
    border-bottom: 2px solid #1a73e8;
    padding-bottom: 6px
}

devsite-access-pass-builder .pass-form input.url {
    width: 40em
}

devsite-access-pass-builder .pass-form input.barcode {
    width: 30em
}

devsite-access-pass-builder .pass-form .background-color-selector-wrapper:focus-within {
    border: 2px solid #1a73e8
}

devsite-access-pass-builder .pass-form .background-color-selector-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 10px
}

devsite-access-pass-builder .pass-form .background-color-selector-wrapper {
    position: relative;
    overflow: hidden;
    width: 28px;
    height: 28px;
    border: 1px solid #9c9c9c;
    border-radius: 14px
}

devsite-access-pass-builder .pass-form input.background-color-selector {
    position: absolute;
    right: -5px;
    top: -5px;
    width: 38px;
    height: 38px;
    border: 0;
    padding: 0;
    cursor: pointer
}

devsite-access-pass-builder .pass-form .background-color-text {
    margin: 0 10px
}

devsite-access-pass-builder .pass-form .emergency-contacts-input {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 10px 0 0 0;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

devsite-access-pass-builder .pass-form .json-definitions div[pass-property].active {
    background-color: #fff;
    margin: 0 -40px;
    padding: 0 40px
}

devsite-access-pass-builder .pass-form .code-box {
    position: relative;
    font: 14px Roboto Mono,monospace;
    background: #f1f3f4;
    margin: 0 -40px;
    padding: 30px 40px
}

devsite-access-pass-builder .pass-form .code-box>.code-buttons-container {
    position: absolute;
    right: 0;
    top: 0;
    margin: 10px 15px
}

devsite-access-pass-builder .pass-form .code-box>.code-buttons-container button {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 24px;
    width: 24px;
    color: #202124;
    font-size: 18px;
    padding: 20px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0;
    min-width: auto;
    background: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    -webkit-transition: background-color .1s;
    transition: background-color .1s
}

devsite-access-pass-builder .pass-form .code-box>.code-buttons-container button:hover {
    background: #fff;
    border-radius: 5px
}

devsite-access-pass-builder .pass-form .code-box .jwt-link {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 10px;
    font-size: 12px
}

devsite-access-pass-builder .pass-form .code-box .button-copy:before {
    content: "content_copy"
}

devsite-access-pass-builder .pass-form .code-box pre {
    white-space: normal
}

devsite-access-pass-builder .pass-preview {
    background-color: transparent;
    font-family: Google Sans,Roboto,Arial,sans-serif;
    line-height: normal;
    color: #202124;
    font-size: 13px;
    -webkit-font-smoothing: antialiased;
    width: var(--pass-preview-width);
    justify-self: center;
    grid-column: 2;
    grid-row: 1
}

devsite-access-pass-builder .pass-preview .material-icons {
    font-family: Material Icons;
    font-weight: 400;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr
}

devsite-access-pass-builder .pass-preview .pass-view-group {
    position: relative;
    margin-top: 24px;
    color: var(--passview-font-color,#fff);
    width: 270px;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 4px 7px 1px rgba(0,0,0,.14),0 3px 9px 2px rgba(0,0,0,.12),0 4px 4px -3px rgba(0,0,0,.2)
}

devsite-access-pass-builder .pass-preview .pass-view-group.generic-private {
    color: var(--passview-font-color,#202124)
}

devsite-access-pass-builder .pass-preview .pass-view-group.light {
    color: var(--passview-font-color,#fff)
}

devsite-access-pass-builder .pass-preview .pass-view-group * {
    position: relative
}

devsite-access-pass-builder .pass-preview .pass-view-group .active {
    z-index: 2;
    background-color: var(--passview-background-color,#4285f4)
}

devsite-access-pass-builder .pass-preview .pass-view-group.generic-private .active {
    background-color: var(--passview-background-color,#90f2f9)
}

devsite-access-pass-builder .pass-preview .pass-view-group.access-details .active {
    background-color: var(--passview-background-color,#f9f9ff)
}

devsite-access-pass-builder .pass-preview .pass-view-group.access-pass .active {
    background-color: var(--passview-background-color,#f9f9ff)
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    pointer-events: none;
    z-index: 1
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-overlay.dark {
    background-color: rgba(0,0,0,.267)
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    border-radius: 24px 24px 0 0;
    box-shadow: inset 0 0 0 1px hsla(0,0%,100%,.2);
    background-color: var(--passview-background-color,#4285f4);
    cursor: default
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view.generic-private {
    background-color: var(--passview-background-color,#90f2f9)
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view.access-details {
    color: var(--passview-font-color,#191b21);
    background-color: var(--passview-background-color,#f9f9ff);
    min-height: 600px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view.access-pass {
    height: 169px;
    background-color: var(--card-background-color,#191b21)
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .background-image-container {
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50%
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .head {
    font-weight: 500;
    text-align: left;
    margin-top: 3px;
    border-radius: 24px 24px 6px 6px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .title-bar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 24px 24px 6px 6px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .logo-wrapper {
    padding: 6px;
    margin: 6px 0 6px 6px;
    border-radius: 100%
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .logo-wrapper.access-details {
    padding: 10px;
    margin: 6px 0 6px 6px;
    border-radius: 8%
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .logo {
    height: 24px;
    width: 24px;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    background-color: hsla(0,0%,100%,.867);
    overflow: hidden;
    border-radius: 100%
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .logo.access-details {
    width: 42px;
    height: 28px;
    border-radius: 8%;
    background-color: #000;
    justify-items: center
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .logo p {
    margin: 0;
    color: #5f6368;
    font-size: 14px;
    font-weight: 500;
    line-height: 24px;
    text-align: center
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .logo-image {
    object-fit: cover;
    border: 0;
    height: 100%;
    max-width: 100%
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .back-button {
    margin: 10px 10px 0 5px;
    width: 25px;
    height: 25px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .card-meta,devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .card-title {
    -webkit-box-flex: 1;
    -webkit-flex: auto;
    -moz-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    padding: 6px;
    margin-right: 12px;
    font-size: 14px;
    letter-spacing: .015em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-radius: 6px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .card-meta {
    text-align: right;
    text-overflow: unset;
    overflow: visible
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .dim-divider {
    background-color: hsla(0,0%,100%,.082)
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .row-dim-divider {
    background-color: hsla(0,0%,100%,.082);
    margin: 6px 9px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .sub-header {
    padding: 1px 12px;
    font-size: 14px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .sub-header.access-details {
    font-size: 11px;
    font-weight: 400;
    line-height: 16px;
    padding: 10px 16px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .main-header {
    font-size: 20px;
    padding: 1px 12px;
    letter-spacing: 0;
    font-weight: 400;
    line-height: 30px;
    word-break: break-word;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .main-header.access-details {
    font-size: 21px;
    letter-spacing: 0;
    font-weight: 500;
    line-height: 24px;
    padding: 1px 16px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .main-header.boarding-pass {
    font-size: 24px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .body {
    padding: 15px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .row.access-details {
    display: block
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .row-item {
    font-weight: 500;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow: hidden;
    border-radius: 6px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .start-item {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 0;
    -moz-box-flex: 1;
    -ms-flex: 1 1 0px;
    flex: 1 1 0;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    text-align: left
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .middle-item {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .middle-item .row-label,devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .middle-item .row-label-value {
    width: 90px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .middle-item .row-label-value:empty,devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .middle-item .row-label:empty {
    width: 0
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .end-item {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 0;
    -moz-box-flex: 1;
    -ms-flex: 1 1 0px;
    flex: 1 1 0;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    text-align: right
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .row-label {
    width: 100%;
    -webkit-box-flex: 1;
    -webkit-flex: 1 0 50%;
    -moz-box-flex: 1;
    -ms-flex: 1 0 50%;
    flex: 1 0 50%;
    padding: 6px 12px 0 12px;
    font-size: 11px;
    letter-spacing: 0;
    white-space: nowrap;
    overflow: hidden
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .row-label.access-details {
    font-size: 11px;
    font-weight: 600;
    padding: 0 0 0 16px;
    width: 90%
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .row-label.emergency-list {
    font-weight: 600;
    padding: 0
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .row-label-value {
    width: 100%;
    -webkit-box-flex: 1;
    -webkit-flex: 1 0 50%;
    -moz-box-flex: 1;
    -ms-flex: 1 0 50%;
    flex: 1 0 50%;
    padding: 0 12px 6px 12px;
    font-size: 14px;
    letter-spacing: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .row-label-value.access-details {
    font-size: 9.5px;
    font-weight: 400;
    padding: 3px 0 0 16px;
    white-space: normal;
    overflow-wrap: break-word
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .card-meta:after,devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .card-title:after,devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .main-header:after,devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .row-label-value:after,devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .row-label:after {
    display: inline-block;
    content: ""
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .barcode {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 5px 0;
    overflow: hidden
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .barcode-wrapper {
    margin: 0 30px;
    background-color: #fff;
    border-radius: 12px;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .barcode-img {
    display: none;
    margin: 14px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .barcode-img.text {
    margin: 20px;
    color: #212121;
    font-size: 15px;
    font-weight: 300;
    text-align: center
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .barcode-img.qr {
    width: 110px;
    height: 110px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .barcode-img.bar {
    width: 160px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .barcode-img.pdf {
    width: 190px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .barcode-alternate-text {
    text-align: center;
    padding: 4px 25px;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .material-icons.flight {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    font-size: 14px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .hero-image {
    width: 270px;
    height: 87.9px;
    object-fit: cover;
    margin-top: -1px;
    border-radius: 0 0 24px 24px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 42px;
    width: 238px;
    padding: 10px 0;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    background-color: var(--details-background,#ededf4);
    border-radius: 15px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .container.icon {
    padding: 0 0 0 15px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .emergency-icon-container {
    padding: 6px 14px 0 0
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    border-radius: 15px;
    overflow: hidden
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .list-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 42px;
    width: 238px;
    background-color: var(--details-background,#ededf4);
    border-radius: 3px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 1px;
    padding: 0 15px;
    cursor: pointer
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .list-item:hover {
    background-color: #d5d5db
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .corporate-badge-info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    place-self: center center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 90%;
    height: 100%
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .card-owner-name {
    font-size: 16px;
    font-weight: 500;
    color: var(--name-font-color,#fff);
    margin: 0 0 10px 0;
    display: block;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    width: 150px;
    height: 60px;
    text-overflow: ellipsis;
    overflow: hidden
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .card-owner-photo-container {
    width: 85px;
    border-radius: 100%
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .card-owner-photo {
    width: 100%;
    aspect-ratio: 1/1;
    border-radius: 100%
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .detail-view {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font-family: Google Sans,Roboto,Arial,sans-serif;
    font-size: 13px;
    min-height: 200px;
    max-width: 310px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .detail-view .detail-image-container {
    width: 100%;
    padding: 8px 8px 18px 8px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .detail-view .detail-image {
    width: 100%;
    border-radius: 3px;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2)
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .detail-view .detail-text {
    padding: 9px 12px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .detail-view .detail-text-header {
    letter-spacing: 0;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    color: #1f1f1f
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .detail-view .detail-text-body {
    font-weight: 400;
    letter-spacing: 0;
    font-size: 12px;
    line-height: 18px;
    color: #444746;
    word-break: break-word
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .detail-view .detail-link {
    letter-spacing: .00625em;
    font-family: Roboto,Arial,sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.5rem;
    color: #212121;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 12px;
    text-decoration: none
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .detail-view .detail-link-icon {
    width: 20px;
    height: 20px
}

devsite-access-pass-builder .pass-preview .pass-view-group .pass-view .detail-view .detail-link-text {
    display: inline-block;
    line-height: 18px;
    margin-left: 18px;
    word-break: break-all
}

devsite-actions {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: 8px;
    padding-inline:8px}

devsite-activity-tracker .devsite-activity-tracker-heading {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: var(--devsite-h3-margin)
}

.viewport--mobile devsite-activity-tracker .devsite-activity-tracker-heading {
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -moz-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px
}

devsite-activity-tracker .devsite-activity-tracker-heading h3 {
    font-family: var(--devsite-sys-typescale--headline-4--font-names);
    font-size: var(--devsite-sys-typescale--headline-4--font-size);
    font-weight: var(--devsite-sys-typescale--headline-4--font-weight);
    line-height: var(--devsite-sys-typescale--headline-4--line-height);
    margin-block:0}

devsite-activity-tracker .devsite-activity-tracker-heading p {
    font-family: var(--devsite-sys-typescale--body-m--font-names);
    font-size: var(--devsite-sys-typescale--body-m--font-size);
    letter-spacing: var(--devsite-sys-typescale--body-m--font-tracking);
    line-height: var(--devsite-sys-typescale--body-m--line-height);
    margin-block:8px 0}

devsite-activity-tracker .devsite-activity-tracker-heading devsite-info-popout .devsite-activity-tracker-popup-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 20px
}

devsite-activity-tracker .devsite-activity-tracker-heading devsite-info-popout .devsite-activity-tracker-popup-section {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 8px
}

devsite-activity-tracker .devsite-activity-tracker-heading devsite-info-popout .devsite-activity-tracker-popup-header {
    font-family: var(--devsite-sys-typescale--title-s--font-names);
    font-size: var(--devsite-sys-typescale--title-s--font-size);
    font-weight: var(--devsite-sys-typescale--title-s--font-weight);
    line-height: var(--devsite-sys-typescale--title-s--line-height)
}

devsite-activity-tracker .devsite-activity-tracker-heading devsite-info-popout .devsite-activity-tracker-popup-description {
    font-family: var(--devsite-sys-typescale--body-m--font-names);
    font-size: var(--devsite-sys-typescale--body-m--font-size);
    letter-spacing: var(--devsite-sys-typescale--body-m--font-tracking);
    line-height: var(--devsite-sys-typescale--body-m--line-height)
}

devsite-activity-tracker .devsite-activity-tracker-heading devsite-info-popout .devsite-activity-tracker-popup-privacy-description {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px
}

devsite-activity-tracker .devsite-activity-tracker-heading devsite-info-popout .devsite-activity-tracker-popup-privacy-setting-icon {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #f1f3f4;
    color: #5f6368;
    border-radius: 4px;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: 2px;
    padding: 2px 8px
}

devsite-activity-tracker .devsite-activity-tracker-heading devsite-info-popout .devsite-activity-tracker-popup-privacy-setting-icon .material-symbols-outlined {
    font-size: 14px
}

devsite-activity-tracker .devsite-activity-tracker-heading devsite-info-popout .devsite-activity-tracker-popup-privacy-setting-icon .devsite-activity-tracker-popup-privacy-setting-icon-text {
    font-weight: 500
}

devsite-activity-tracker .devsite-activity-tracker-heading devsite-info-popout .devsite-activity-tracker-legend-content {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 6px
}

devsite-activity-tracker .devsite-activity-tracker-heading devsite-info-popout .devsite-activity-tracker-legend-content .devsite-activity-tracker-legend-text {
    font-family: var(--devsite-sys-typescale--body-m--font-names);
    font-size: var(--devsite-sys-typescale--body-m--font-size);
    letter-spacing: var(--devsite-sys-typescale--body-m--font-tracking);
    line-height: var(--devsite-sys-typescale--body-m--line-height)
}

devsite-activity-tracker .devsite-activity-tracker-heading devsite-info-popout .devsite-activity-tracker-legend-content .devsite-activity-tracker-legend-indicator {
    border-radius: 8px;
    height: 16px;
    width: 16px
}

devsite-activity-tracker .devsite-activity-tracker-heading devsite-dropdown-list {
    border: 1px solid #dadce0;
    border-radius: 4px;
    padding-inline:6px}

devsite-activity-tracker .devsite-activity-tracker-heading .devsite-activity-tracker-selected-year {
    margin-inline:6px}

devsite-activity-tracker .devsite-activity-tracker-loading-spinner {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 96px 0
}

devsite-activity-tracker .devsite-activity-tracker-months {
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    overflow-x: auto;
    position: relative
}

.viewport--mobile devsite-activity-tracker .devsite-activity-tracker-months {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

devsite-activity-tracker .devsite-activity-tracker-months .devsite-activity-tracker-month {
    border: var(--devsite-primary-border);
    border-radius: 4px;
    padding: 20px
}

devsite-activity-tracker .devsite-activity-tracker-months .devsite-activity-tracker-month .devsite-activity-tracker-month-header {
    font-family: var(--devsite-sys-typescale--title-s-brand--font-names);
    font-size: var(--devsite-sys-typescale--title-s-brand--font-size);
    font-weight: var(--devsite-sys-typescale--title-s-brand--font-weight);
    line-height: var(--devsite-sys-typescale--title-s-brand--line-height);
    color: #5f6368;
    margin-block:0 10px}

.color-scheme--dark devsite-activity-tracker .devsite-activity-tracker-months .devsite-activity-tracker-month .devsite-activity-tracker-month-header {
    color: #9aa0a6
}

devsite-activity-tracker .devsite-activity-tracker-pagination-buttons {
    -webkit-margin-before: 4px;
    margin-block-start:4px;-webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

devsite-activity-tracker .devsite-activity-tracker-pagination-buttons .devsite-activity-tracker-pagination-button {
    border-radius: 20px;
    cursor: pointer;
    padding: 8px
}

devsite-activity-tracker .devsite-activity-tracker-pagination-buttons .devsite-activity-tracker-pagination-button:hover {
    background-color: #f1f3f4
}

.color-scheme--dark devsite-activity-tracker .devsite-activity-tracker-pagination-buttons .devsite-activity-tracker-pagination-button:hover {
    background-color: #3c4043
}

devsite-activity-tracker .devsite-activity-tracker-calendar {
    display: grid;
    grid-template-columns: repeat(7,1fr);
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    justify-items: center;
    margin: auto
}

devsite-activity-tracker .devsite-activity-tracker-calendar .devsite-activity-tracker-day,devsite-activity-tracker .devsite-activity-tracker-calendar .devsite-activity-tracker-weekday-initial {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    aspect-ratio: 1/1;
    border-radius: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 2px;
    width: 40px
}

@media screen and (max-width: 400px) {
    devsite-activity-tracker .devsite-activity-tracker-calendar .devsite-activity-tracker-day,devsite-activity-tracker .devsite-activity-tracker-calendar .devsite-activity-tracker-weekday-initial {
        width:10vw
    }
}

devsite-activity-tracker .devsite-activity-tracker-calendar .devsite-activity-tracker-weekday-initial {
    font-family: var(--devsite-sys-typescale--caption--font-names);
    font-size: var(--devsite-sys-typescale--caption--font-size);
    letter-spacing: var(--devsite-sys-typescale--caption--font-tracking);
    line-height: var(--devsite-sys-typescale--caption--line-height);
    color: #5f6368
}

.color-scheme--dark devsite-activity-tracker .devsite-activity-tracker-calendar .devsite-activity-tracker-weekday-initial {
    color: #9aa0a6
}

devsite-activity-tracker .devsite-activity-tracker-density-1 {
    background-color: #d2e3fc;
    color: #202124
}

devsite-activity-tracker .devsite-activity-tracker-density-2 {
    background-color: #aecbfa;
    color: #202124
}

devsite-activity-tracker .devsite-activity-tracker-density-3 {
    background-color: #8ab4f8;
    color: #202124
}

devsite-activity-tracker .devsite-activity-tracker-density-4 {
    background-color: #669df6;
    color: #202124
}

devsite-activity-tracker .devsite-activity-tracker-density-5 {
    background-color: #1a73e8;
    color: #fff
}

devsite-activity-tracker .devsite-activity-tracker-show-more-less-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.viewport--mobile devsite-activity-tracker .devsite-activity-tracker-show-more-less-container {
    margin-top: 16px
}

.devsite-activity-tracker-welcome-dialog {
    --devsite-heading-text-align: start;
    --devsite-dialog-padding: 24px
}

.devsite-activity-tracker-welcome-dialog-illustration {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-analytics>iframe {
    display: none
}

devsite-anselm {
    display: block;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

devsite-anselm .anselm-loading {
    display: none
}

devsite-anselm .anselm-loading devsite-spinner {
    margin: 0 auto
}

devsite-anselm[loading] .anselm-loading {
    display: block
}

devsite-anselm[type=playlist] .anselm-results {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin: 0 -12px
}

devsite-anselm h3:first-child {
    margin-bottom: 4px
}

devsite-anselm[active] .anselm-suggest-container input {
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color)
}

devsite-anselm[pending-suggestions] .anselm-suggest-container .anselm-suggest-search-icon {
    opacity: 0
}

devsite-anselm[pending-suggestions] .anselm-suggest-container .anselm-suggest-spinner {
    opacity: 1
}

devsite-anselm[has-query] .anselm-suggest-container .anselm-suggest-close-icon {
    opacity: 1;
    pointer-events: all
}

devsite-anselm[has-suggestions][active] .anselm-suggest-container input {
    border-radius: 2px 2px 0
}

devsite-anselm .anselm-suggest-container {
    max-width: 492px;
    margin-bottom: 36px
}

devsite-anselm .anselm-suggest-container form {
    position: relative
}

devsite-anselm .anselm-suggest-container input {
    border: 0!important;
    border-radius: 4px;
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color);
    color: #3c4043;
    line-height: 26px;
    padding: 8px 46px;
    width: 100%
}

devsite-anselm .anselm-suggest-container input:hover {
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color)
}

devsite-anselm .anselm-suggest-container input:focus {
    border: 0!important;
    padding-bottom: 8px
}

devsite-anselm .anselm-suggest-container .anselm-suggestions {
    background: var(--devsite-background-1);
    border-top: 1px solid #fff;
    border-radius: 0 0 4px 4px;
    box-shadow: 0 2px 3px 0 var(--devsite-elevation-key-shadow-color),0 6px 10px 4px var(--devsite-elevation-ambient-shadow-color);
    position: absolute;
    width: 100%;
    z-index: 100
}

devsite-anselm .anselm-suggest-container .anselm-suggestions:empty {
    box-shadow: none
}

devsite-anselm .anselm-suggest-container .anselm-suggest-result {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    line-height: 56px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-anselm .anselm-suggest-container .anselm-suggest-result a {
    color: #3c4043;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 0 16px
}

devsite-anselm .anselm-suggest-container .anselm-suggest-result a:focus,devsite-anselm .anselm-suggest-container .anselm-suggest-result a:hover,devsite-anselm .anselm-suggest-container .anselm-suggest-result.highlight a {
    text-decoration: none;
    background: #f1f3f4
}

devsite-anselm .anselm-suggest-input-container {
    position: relative
}

devsite-anselm .anselm-suggest-input-container .anselm-suggest-close-icon,devsite-anselm .anselm-suggest-input-container .anselm-suggest-search-icon,devsite-anselm .anselm-suggest-input-container .anselm-suggest-spinner {
    color: #5f6368;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    -webkit-transition: opacity .3s cubic-bezier(0,.795,0,1);
    transition: opacity .3s cubic-bezier(0,.795,0,1)
}

devsite-anselm .anselm-suggest-input-container .anselm-suggest-close-icon,devsite-anselm .anselm-suggest-input-container .anselm-suggest-close-icon:focus {
    text-decoration: none
}

devsite-anselm .anselm-suggest-input-container .anselm-suggest-search-icon {
    opacity: 1
}

devsite-anselm .anselm-suggest-input-container .anselm-suggest-search-icon,devsite-anselm .anselm-suggest-input-container .anselm-suggest-spinner {
    top: 8px;
    left: 16px
}

devsite-anselm .anselm-suggest-input-container .anselm-suggest-close-icon {
    top: 8px;
    right: 16px
}

devsite-anselm .anselm-more {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 20px 0 32px
}

devsite-anselm .anselm-cell {
    opacity: 0;
    -webkit-transition: opacity .3s cubic-bezier(.4,0,1,1);
    transition: opacity .3s cubic-bezier(.4,0,1,1)
}

devsite-anselm .anselm-cell[show] {
    opacity: 1
}

devsite-anselm .anselm-cell .bull {
    padding: 0 4px
}

devsite-anselm .anselm-cell .anselm-meta {
    font-family: var(--devsite-primary-font-family);
    font-size: 12px;
    color: #5f6368;
    letter-spacing: .3px;
    text-align: left;
    line-height: 16px
}

devsite-anselm .anselm-cell .anselm--tags span {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-family: var(--devsite-primary-font-family);
    font-size: 12px;
    color: #5f6368;
    letter-spacing: .3px;
    text-align: left;
    line-height: 16px;
    border: var(--devsite-primary-border);
    border-radius: 16px;
    height: 30px;
    padding: 12px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-anselm .anselm-cell--list p {
    font-family: var(--devsite-primary-font-family);
    font-size: 14px;
    color: #3c4043;
    letter-spacing: .2px;
    line-height: 20px;
    margin: 8px 0;
    text-align: left
}

devsite-anselm .anselm-card {
    background: var(--devsite-card-background);
    border: var(--devsite-card-border);
    border-radius: var(--devsite-card-border-radius);
    box-shadow: var(--devsite-card-box-shadow);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%
}

devsite-anselm .anselm-card .anselm-card--top {
    border-radius: var(--devsite-card-content-border-radius,1px 1px 0 0);
    height: 158px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative
}

devsite-anselm .anselm-card .anselm-card--top .badge-icon {
    width: 110px;
    height: 110px;
    position: relative;
    z-index: 2;
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0)
}

@-webkit-keyframes bounce {
    0% {
        opacity: 0;
        -webkit-transform: scale(.2);
        transform: scale(.2)
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
}

@keyframes bounce {
    0% {
        opacity: 0;
        -webkit-transform: scale(.2);
        transform: scale(.2)
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
}

devsite-anselm .anselm-card .anselm-card--top .badge-icon.bounce {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-name: bounce;
    animation-name: bounce;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

devsite-anselm .anselm-card devsite-progress .devsite-progress--indeterminate .devsite-progress--indeterminate-2,devsite-anselm .anselm-card devsite-progress .devsite-progress--indeterminate .devsite-progress--indeterminate-4 {
    background: #dadce0
}

devsite-anselm .anselm-card .anselm-card--progress {
    overflow: hidden;
    height: 2px;
    background: #dadce0
}

devsite-anselm .anselm-card .anselm-card--progress .anselm-card--progress--bar {
    background: #fbbc04;
    height: 2px;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
    -webkit-transition: background .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1);
    transition: background .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1);
    transition: transform .213s cubic-bezier(0,0,.2,1),background .213s cubic-bezier(0,0,.2,1);
    transition: transform .213s cubic-bezier(0,0,.2,1),background .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1)
}

devsite-anselm .anselm-card .anselm-card--progress .anselm-card--progress--bar.completed {
    background: #34a853
}

devsite-anselm .anselm-card .anselm-card--progress--info:empty:before {
    content: " "
}

devsite-anselm .anselm-card .anselm-card--progress--info {
    font-size: 12px;
    font-weight: 700;
    color: #3c4043;
    padding: 0 16px;
    opacity: 0;
    -webkit-transform: translateY(12px);
    transform: translateY(12px);
    -webkit-transition: opacity .213s cubic-bezier(.4,0,1,1),-webkit-transform .213s cubic-bezier(.4,0,1,1);
    transition: opacity .213s cubic-bezier(.4,0,1,1),-webkit-transform .213s cubic-bezier(.4,0,1,1);
    transition: transform .213s cubic-bezier(.4,0,1,1),opacity .213s cubic-bezier(.4,0,1,1);
    transition: transform .213s cubic-bezier(.4,0,1,1),opacity .213s cubic-bezier(.4,0,1,1),-webkit-transform .213s cubic-bezier(.4,0,1,1)
}

devsite-anselm .anselm-card .anselm-card--progress--info.show {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: opacity .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1);
    transition: opacity .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1);
    transition: transform .213s cubic-bezier(0,0,.2,1),opacity .213s cubic-bezier(0,0,.2,1);
    transition: transform .213s cubic-bezier(0,0,.2,1),opacity .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1)
}

devsite-anselm .anselm-card .anselm-card--body {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 0 16px
}

devsite-anselm .anselm-card .anselm--tags:not(:empty) {
    border-bottom: var(--devsite-primary-border);
    margin: 0 16px;
    padding: 0 0 16px
}

devsite-anselm .anselm-card .anselm-card--bottom {
    margin: 16px
}

devsite-anselm .anselm-card .anselm-card--summary {
    font-family: var(--devsite-primary-font-family);
    font-size: 12px;
    color: #5f6368;
    letter-spacing: .3px;
    text-align: left;
    line-height: 16px
}

devsite-anselm .anselm-card .anselm-card--actions {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

devsite-anselm .anselm-cell--card {
    -webkit-flex-basis: calc(33.33% - 24px);
    -ms-flex-preferred-size: calc(33.33% - 24px);
    flex-basis: calc(33.33% - 24px);
    margin: 12px
}

devsite-anselm .anselm-cell--list {
    margin-bottom: 32px
}

devsite-anselm .anselm-cell--list a {
    color: #1a73e8
}

devsite-anselm .anselm-no-results-found {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-top: 36px
}

devsite-anselm .anselm-no-results-found .no-results-text {
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    padding: 0 12px
}

devsite-anselm .anselm-no-results-found .no-results-text h3 {
    font-size: 28px;
    color: #3c4043;
    line-height: 36px;
    margin: 0
}

devsite-anselm .anselm-no-results-found .no-results-text p {
    margin: 0;
    padding: 8px 0 0;
    font-size: 14px;
    color: #5f6368;
    line-height: 20px
}

devsite-anselm .anselm-no-results-found .no-results-img {
    margin: 0 12px;
    padding: 0 12px;
    -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    background-image: url(../../images/not-found.svg);
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 50% 50%;
    height: 206px
}

devsite-anselm .anselm-results-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

devsite-anselm .anselm-results-container .anselm-results-cell {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

devsite-anselm .anselm-results-container .anselm-featured-cell {
    display: none;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 292px;
    padding-left: 18px
}

devsite-anselm .anselm-results-container .anselm-featured-cell h4 {
    font-size: 10px;
    font-weight: 500;
    color: #5f6368;
    line-height: 16px;
    text-transform: uppercase
}

devsite-anselm.has-featured .anselm-no-results-found {
    display: block
}

devsite-anselm.has-featured .anselm-no-results-found .no-results-img {
    margin: 48px 12px;
    height: 295px
}

devsite-anselm.has-featured .anselm-no-results-found .no-results-text {
    text-align: center
}

devsite-anselm.has-featured .anselm-results-container .anselm-results-cell {
    max-width: 491px
}

devsite-anselm.has-featured .anselm-results-container .anselm-featured-cell {
    display: block
}

devsite-anselm .anselm--featured {
    border: var(--devsite-card-border);
    border-radius: var(--devsite-card-border-radius);
    box-shadow: var(--devsite-card-box-shadow);
    margin-bottom: 12px;
    padding: 16px
}

devsite-anselm .anselm--featured .topic__meta {
    border-top: 1px solid #dadce0;
    color: #3c4043;
    font-size: 12px;
    line-height: 16px;
    margin: 16px 0 8px;
    padding: 16px 0 0
}

devsite-anselm .anselm--featured .topic__updated {
    padding-top: 4px
}

@media screen and (max-width: 840px) {
    devsite-anselm .anselm-cell--card {
        -webkit-flex-basis:calc(50% - 24px);
        -ms-flex-preferred-size: calc(50% - 24px);
        flex-basis: calc(50% - 24px)
    }

    devsite-anselm.has-featured .anselm-results-container .anselm-featured-cell {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex
    }

    devsite-anselm .anselm-results-container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: column-reverse;
        -moz-box-orient: vertical;
        -moz-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse
    }

    devsite-anselm .anselm-results-container .anselm-featured-cell {
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        overflow-x: auto;
        min-width: 100%;
        margin: 0 0 24px;
        padding: 24px 0 0;
        position: relative
    }

    devsite-anselm .anselm-results-container .anselm-featured-cell h4 {
        position: absolute;
        top: 0;
        left: 0
    }

    devsite-anselm .anselm-results-container .anselm--featured {
        min-width: 200px;
        margin-right: 8px;
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        max-width: 300px
    }

    devsite-anselm .anselm-results-container .anselm--featured .devsite-landing-row-item-description {
        position: relative
    }

    devsite-anselm .anselm-results-container .anselm--featured a {
        position: absolute;
        right: 8px;
        top: 8px;
        padding: 0;
        height: 30px;
        width: 30px
    }

    devsite-anselm .anselm-results-container .anselm--featured a .devsite-landing-row-item-icon-container {
        width: 30px;
        height: 30px
    }

    devsite-anselm .anselm-results-container .anselm--featured a .devsite-landing-row-item-icon-container img {
        width: 30px;
        height: 30px;
        margin: 0
    }

    devsite-anselm .anselm-results-container .anselm--featured h3 {
        margin: 0
    }

    devsite-anselm .anselm-results-container .anselm--featured .devsite-landing-row-item-body a {
        position: static;
        margin: 12px;
        text-overflow: ellipsis;
        margin-right: 54px;
        width: auto;
        height: auto
    }

    devsite-anselm .anselm-results-container .anselm--featured .devsite-landing-row-item-body .topic__meta {
        margin-top: 0
    }

    devsite-anselm .anselm-results-container .anselm--featured .devsite-landing-row-item-body .devsite-landing-row-item-buttons,devsite-anselm .anselm-results-container .anselm--featured .devsite-landing-row-item-body p {
        display: none
    }
}

@media screen and (max-width: 600px) {
    devsite-anselm .anselm-cell--card {
        -webkit-flex-basis:calc(100% - 24px);
        -ms-flex-preferred-size: calc(100% - 24px);
        flex-basis: calc(100% - 24px)
    }

    devsite-anselm .anselm-no-results-found {
        margin-top: 12px;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

    devsite-anselm .anselm-no-results-found .no-results-img,devsite-anselm .anselm-no-results-found .no-results-text {
        -webkit-flex-basis: 100%;
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%
    }

    devsite-anselm .anselm-no-results-found .no-results-img {
        margin-top: 32px;
        height: 163px
    }
}

devsite-dialog[open].devsite-henhouse-dialog {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0
}

.devsite-henhouse-inner {
    background: var(--devsite-background-1);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 2px;
    overflow: hidden
}

.devsite-henhouse-spinner-container {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 240px
}

.devsite-credentials-spinner-region {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.devsite-henhouse-cross-container {
    height: 160px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -webkit-align-items: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.devsite-henhouse-cross {
    margin: 16px;
    float: right;
    cursor: pointer
}

.devsite-apix-error {
    padding: 32px
}

.devsite-apix-controls {
    position: absolute;
    right: 8px;
    z-index: 1001
}

.devsite-apix-controls .button-flat {
    cursor: pointer!important
}

.devsite-apix-controls .devsite-dock-apix:before,.devsite-apix-controls .devsite-fullscreen-apix:before,.devsite-apix-controls .devsite-hide-apix:before {
    color: var(--devsite-primary-text-color)
}

.devsite-apix-controls .devsite-hide-apix:before {
    content: "close"
}

.devsite-apix-controls .devsite-fullscreen-apix:before {
    content: "fullscreen"
}

.devsite-apix-controls .devsite-dock-apix:before {
    content: "fullscreen_exit"
}

.apis-explorer {
    background: var(--devsite-background-3)
}

.devsite-apix {
    background: var(--devsite-background-3);
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    will-change: height,transform
}

.devsite-apix:not(.dialog) .devsite-apix-controls {
    top: 24px
}

.devsite-apix:not(.dialog) .devsite-apix-controls .devsite-dock-apix {
    display: none
}

.devsite-apix.dialog {
    border-radius: 2px;
    box-shadow: 0 17px 17px rgba(0,0,0,.15),0 27px 55px rgba(0,0,0,.3);
    font: 14px/20px var(--devsite-primary-font-family);
    max-width: calc(100% - 48px);
    overflow: auto;
    padding: 8px;
    position: fixed;
    z-index: 10012;
    max-height: none!important
}

.devsite-apix.dialog .apis-explorer {
    height: 100%;
    min-height: 100%
}

.devsite-apix.dialog .devsite-fullscreen-apix,.devsite-apix.dialog .devsite-hide-apix {
    display: none
}

.devsite-has-apix .devsite-main-content {
    z-index: auto
}

.devsite-has-apix .devsite-main-content devsite-googler-buttons {
    z-index: 1003
}

@media screen and (min-width: 1201px) {
    .devsite-apix:not(.dialog) {
        box-shadow:0 0 4px rgba(0,0,0,.14),0 4px 8px rgba(0,0,0,.28);
        display: none;
        max-height: 100vh;
        overflow: auto;
        position: fixed;
        right: var(--devsite-concierge-width,0);
        top: 96px;
        width: 400px;
        z-index: 1001
    }

    .devsite-apix.dialog {
        bottom: 20px;
        left: calc(50% - 576px);
        margin: 0;
        top: 50px;
        width: 1152px
    }

    .devsite-has-apix .devsite-apix {
        display: block
    }
}

@media screen and (max-width: 1200px) {
    .devsite-apix {
        display:block
    }

    .devsite-apix:not(.dialog) {
        margin-top: 32px;
        max-height: none!important;
        position: relative;
        -webkit-transform: none!important;
        transform: none!important;
        top: auto!important;
        height: auto!important
    }

    .devsite-apix.dialog {
        bottom: 20px;
        left: 24px;
        margin: 0;
        top: 50px;
        width: calc(100% - 48px)
    }

    .devsite-hide-apix {
        display: none
    }
}

.devsite-page-insights-dialog.has-dashboard {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    padding: 0;
    width: 100%
}

.devsite-page-insights-dialog.has-dashboard .devsite-dialog-contents {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    padding: 0
}

.devsite-page-insights-dialog.has-dashboard .dialog-title {
    -webkit-border-after: 1px solid #dadce0;
    border-block-end:1px solid #dadce0;display: grid;
    gap: 12px;
    grid-gap: 12px;
    grid-template-areas: "title message close";
    grid-template-columns: auto 1fr auto;
    -webkit-margin-after: 8px;
    margin-block-end:8px;padding-block:20px;padding-inline:24px;width: 100%
}

.devsite-page-insights-dialog.has-dashboard h3 {
    font: 400 18px/30px var(--devsite-headline-font-family);
    grid-area: title;
    text-align: initial
}

.devsite-page-insights-dialog.has-dashboard p {
    font: 14px/20px var(--devsite-primary-font-family);
    grid-area: message
}

.devsite-page-insights-dialog.has-dashboard h3,.devsite-page-insights-dialog.has-dashboard p {
    -webkit-align-self: baseline;
    -ms-flex-item-align: baseline;
    align-self: baseline;
    margin: 0
}

.devsite-page-insights-dialog.has-dashboard .devsite-dialog-close {
    align-self: flex-start;
    grid-area: close;
    margin: -4px
}

.devsite-page-insights-dialog.has-dashboard aside {
    display: grid;
    grid-template-columns: auto 1fr auto;
    -webkit-margin-after: 12px;
    margin-block-end:12px;-webkit-margin-before: 16px;
    margin-block-start:16px;margin-inline:auto;max-width: 800px
}

.devsite-page-insights-dialog.has-dashboard .dismiss-aside {
    background: var(--devsite-note-notice-background)
}

.devsite-page-insights-dialog.has-dashboard .dashboard-embed {
    height: 100%;
    width: 100%
}

.devsite-page-insights-dialog.has-link aside {
    -webkit-margin-after: 0;
    margin-block-end:0}

.devsite-page-insights-dialog.has-link .devsite-dialog-buttons {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-padding-after: 16px;
    padding-block-end:16px;-webkit-padding-before: 8px;
    padding-block-start:8px;padding-inline:16px}

@-webkit-keyframes badgeGrowIn {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    to {
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }
}

@-webkit-keyframes badgeGrowOut {
    0% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@-webkit-keyframes badgeFadeIn {
    0% {
        opacity: 0
    }

    12% {
        opacity: 0
    }

    87% {
        opacity: 100%
    }
}

@-webkit-keyframes counterHide {
    0% {
        opacity: 0
    }

    to {
        opacity: 0
    }
}

.devsite-claim-badge-dialog.devsite-claim-badge-dialog,devsite-badge-awarded.devsite-claim-badge-dialog {
    padding: 0
}

.devsite-claim-badge-dialog .card,devsite-badge-awarded .card {
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color);
    border-radius: 5px;
    background: var(--devsite-claim-badge-dialog-background,var(--devsite-background-1));
    display: block;
    max-width: 856px;
    border-top: 5px var(--devsite-link-color) solid;
    position: relative;
    overflow: hidden;
    margin: 0 auto
}

.devsite-claim-badge-dialog .card .card-content,devsite-badge-awarded .card .card-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-height: calc(100vh - 32px);
    overflow: visible
}

.devsite-claim-badge-dialog .card .illustration-container,.devsite-claim-badge-dialog .card .text-container,devsite-badge-awarded .card .illustration-container,devsite-badge-awarded .card .text-container {
    width: 50%
}

@media screen and (max-width: 600px) {
    .devsite-claim-badge-dialog .card .illustration-container,.devsite-claim-badge-dialog .card .text-container,devsite-badge-awarded .card .illustration-container,devsite-badge-awarded .card .text-container {
        width:100%
    }
}

.devsite-claim-badge-dialog .card .profile-creation-container,devsite-badge-awarded .card .profile-creation-container {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: auto;
    max-height: 50vh;
    border-top: 1px solid #e8eaed;
    padding: 16px 24px
}

.devsite-claim-badge-dialog .card .profile-creation-container p,devsite-badge-awarded .card .profile-creation-container p {
    margin: 8px 0;
    color: var(--devsite-claim-badge-dialog-paragraph-color,#3c4043);
    font-size: 14px;
    line-height: 22px
}

.devsite-claim-badge-dialog .card .profile-creation-container-email-options,devsite-badge-awarded .card .profile-creation-container-email-options {
    margin-top: 8px
}

.devsite-claim-badge-dialog .card .profile-creation-container-email-options .profile-creation-container-email-option,devsite-badge-awarded .card .profile-creation-container-email-options .profile-creation-container-email-option {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.devsite-claim-badge-dialog .card .profile-creation-container-email-options .profile-creation-container-email-option input,devsite-badge-awarded .card .profile-creation-container-email-options .profile-creation-container-email-option input {
    margin-top: 0
}

.devsite-claim-badge-dialog .card .profile-creation-container-email-options .profile-creation-container-email-option label,devsite-badge-awarded .card .profile-creation-container-email-options .profile-creation-container-email-option label {
    font-size: 14px
}

.devsite-claim-badge-dialog .card .spinner-container,devsite-badge-awarded .card .spinner-container {
    position: absolute;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: hsla(0,0%,100%,.8);
    z-index: 100;
    pointer-events: none;
    opacity: 0;
    -webkit-transition: opacity .3s cubic-bezier(.4,0,.2,1);
    transition: opacity .3s cubic-bezier(.4,0,.2,1)
}

.devsite-claim-badge-dialog .card .content-container,devsite-badge-awarded .card .content-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

@media screen and (max-width: 600px) {
    .devsite-claim-badge-dialog .card .content-container,devsite-badge-awarded .card .content-container {
        -webkit-box-orient:vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.devsite-claim-badge-dialog .card .text-container,devsite-badge-awarded .card .text-container {
    padding: 36px 24px;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

@media screen and (max-width: 600px) {
    .devsite-claim-badge-dialog .card .text-container,devsite-badge-awarded .card .text-container {
        padding:24px
    }
}

.devsite-claim-badge-dialog .illustration-container,devsite-badge-awarded .illustration-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 164px;
    min-width: 303px;
    height: 164px;
    width: 303px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    background-image: url(../images/badge-award-background.svg);
    background-size: 100% calc(100% + 2px);
    background-position: 1px -1px;
    background-repeat: no-repeat
}

.devsite-claim-badge-dialog .illustration-container.show .badge-icon,devsite-badge-awarded .illustration-container.show .badge-icon {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.devsite-claim-badge-dialog .illustration-container.animate .badge-icon,devsite-badge-awarded .illustration-container.animate .badge-icon {
    -webkit-animation: badgeGrowIn .33s cubic-bezier(.75,0,.71,.97),badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) .33s,badgeFadeIn .5s linear;
    animation: badgeGrowIn .33s cubic-bezier(.75,0,.71,.97),badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) .33s,badgeFadeIn .5s linear
}

.devsite-claim-badge-dialog .illustration-container .badge-icon,devsite-badge-awarded .illustration-container .badge-icon {
    width: 124px;
    height: 124px;
    z-index: 1000;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

.devsite-claim-badge-dialog .illustration-container .badge-icon.incomplete,devsite-badge-awarded .illustration-container .badge-icon.incomplete {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%)
}

.devsite-claim-badge-dialog .illustration-container .badge-animation,devsite-badge-awarded .illustration-container .badge-animation {
    position: absolute;
    width: 195px;
    height: 170px;
    background-image: url(../images/badge-award-animation.gif);
    background-size: 100% 100%
}

.devsite-claim-badge-dialog .completed-title,devsite-badge-awarded .completed-title {
    font-size: 20px;
    margin-bottom: 8px;
    line-height: 28px;
    color: var(--devsite-claim-badge-dialog-title-color,var(--devsite-primary-text-color));
    font-family: var(--devsite-headline-font-family)
}

.devsite-claim-badge-dialog .claim-badge-text,.devsite-claim-badge-dialog .completed-text,.devsite-claim-badge-dialog .create-profile-text,.devsite-claim-badge-dialog .error-text,.devsite-claim-badge-dialog .not-eligible-text,.devsite-claim-badge-dialog .sign-in-text,devsite-badge-awarded .claim-badge-text,devsite-badge-awarded .completed-text,devsite-badge-awarded .create-profile-text,devsite-badge-awarded .error-text,devsite-badge-awarded .not-eligible-text,devsite-badge-awarded .sign-in-text {
    font-size: 14px
}

.devsite-claim-badge-dialog .buttons-container,devsite-badge-awarded .buttons-container {
    border-top: 1px solid #e8eaed;
    padding: 0 8px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.devsite-claim-badge-dialog .buttons-container .buttons,devsite-badge-awarded .buttons-container .buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.devsite-claim-badge-dialog .buttons-container .dismiss,devsite-badge-awarded .buttons-container .dismiss {
    position: relative;
    overflow: visible
}

@media screen and (max-width: 600px) {
    .devsite-claim-badge-dialog .buttons-container,devsite-badge-awarded .buttons-container {
        -webkit-box-orient:vertical;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: column-reverse;
        -moz-box-orient: vertical;
        -moz-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        padding-top: 0;
        text-align: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .devsite-claim-badge-dialog .buttons-container .button,devsite-badge-awarded .buttons-container .button {
        margin: 10px auto 0
    }

    .devsite-claim-badge-dialog .buttons-container .buttons,devsite-badge-awarded .buttons-container .buttons {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -moz-box-orient: horizontal;
        -moz-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        margin-top: 5px
    }
}

.devsite-claim-badge-dialog[loading] .card .spinner-container,devsite-badge-awarded[loading] .card .spinner-container {
    opacity: 1;
    pointer-events: all
}

.devsite-claim-badge-dialog .qr-code-container,devsite-badge-awarded .qr-code-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 225px;
    background-image: url(../images/claim-badge-dialog-background.png);
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-position: 50%;
    background-size: 700px
}

.devsite-claim-badge-dialog .qr-code-container canvas,devsite-badge-awarded .qr-code-container canvas {
    display: none
}

.devsite-claim-badge-dialog .qr-code-container img,devsite-badge-awarded .qr-code-container img {
    height: 150px;
    width: 150px;
    padding: 10px;
    background: var(--devsite-background-1)
}

.devsite-claim-badge-dialog .redeem-code-section,devsite-badge-awarded .redeem-code-section {
    padding: 18px 24px 0;
    margin-bottom: -15px
}

.devsite-claim-badge-dialog .redeem-code-title,devsite-badge-awarded .redeem-code-title {
    text-transform: uppercase;
    font-size: 10.5px;
    font-weight: 600;
    color: var(--devsite-secondary-text-color);
    margin-bottom: 3px
}

.devsite-claim-badge-dialog .redeem-code,devsite-badge-awarded .redeem-code {
    display: inline-block;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 12px;
    color: var(--devsite-primary-text-color);
    padding: 8px 2px 8px 12px;
    border: 2px solid var(--devsite-link-color);
    border-radius: 4px;
    background-color: rgba(232,240,254,.6)
}

.devsite-claim-badge-dialog .illustration-container.animate .badge-icon-counter,devsite-badge-awarded .illustration-container.animate .badge-icon-counter {
    -webkit-animation: counterHide 1s,badgeGrowIn .33s cubic-bezier(.75,0,.71,.97) 1s,badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) 1.33s,badgeFadeIn .5s linear 1s;
    animation: counterHide 1s,badgeGrowIn .33s cubic-bezier(.75,0,.71,.97) 1s,badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) 1.33s,badgeFadeIn .5s linear 1s;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.devsite-claim-badge-dialog .illustration-container .badge-icon-counter,devsite-badge-awarded .illustration-container .badge-icon-counter {
    padding: 3px 10px;
    font-size: 14px;
    border-radius: 19px;
    color: #fff;
    font-weight: 500;
    background-color: #1a73e8;
    position: absolute;
    bottom: 17px;
    z-index: 10001;
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color)
}

.devsite-claim-badge-dialog .badge-name,devsite-badge-awarded .badge-name {
    font-weight: 500
}

.devsite-claim-badge-dialog .buttons-container .more-badges-marker,devsite-badge-awarded .buttons-container .more-badges-marker {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    top: -12px;
    right: -12px;
    background: #ea4335;
    min-width: 24px;
    min-height: 24px;
    border-radius: 50px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    font-weight: 700;
    max-height: 24px;
    max-width: 24px;
    line-height: 24px;
    font-size: 12px
}

@media screen and (max-width: 600px) {
    .devsite-claim-badge-dialog .buttons-container .sharing,devsite-badge-awarded .buttons-container .sharing {
        -webkit-box-orient:horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -moz-box-orient: horizontal;
        -moz-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        padding: 2px 0 20px
    }
}

.devsite-claim-badge-dialog .buttons-container .actions .button,.devsite-claim-badge-dialog .buttons-container .actions button,devsite-badge-awarded .buttons-container .actions .button,devsite-badge-awarded .buttons-container .actions button {
    margin: 8px
}

.devsite-claim-badge-dialog .buttons-container .sharing,devsite-badge-awarded .buttons-container .sharing {
    font-size: 14px;
    color: var(--devsite-secondary-text-color);
    padding-left: 16px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.devsite-claim-badge-dialog .buttons-container .sharing .share-buttons-container,devsite-badge-awarded .buttons-container .sharing .share-buttons-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.devsite-claim-badge-dialog .buttons-container .sharing .share-buttons-container button,devsite-badge-awarded .buttons-container .sharing .share-buttons-container button {
    border-radius: 0
}

.devsite-claim-badge-dialog .buttons-container .sharing span,devsite-badge-awarded .buttons-container .sharing span {
    margin: 0 8px
}

.devsite-claim-badge-dialog .buttons-container .sharing .button,.devsite-claim-badge-dialog .buttons-container .sharing button,devsite-badge-awarded .buttons-container .sharing .button,devsite-badge-awarded .buttons-container .sharing button {
    box-shadow: none;
    margin: 0 8px;
    padding: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 0;
    height: auto;
    min-width: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.devsite-claim-badge-dialog .buttons-container .sharing .button:focus,.devsite-claim-badge-dialog .buttons-container .sharing .button:hover,.devsite-claim-badge-dialog .buttons-container .sharing button:focus,.devsite-claim-badge-dialog .buttons-container .sharing button:hover,devsite-badge-awarded .buttons-container .sharing .button:focus,devsite-badge-awarded .buttons-container .sharing .button:hover,devsite-badge-awarded .buttons-container .sharing button:focus,devsite-badge-awarded .buttons-container .sharing button:hover {
    background: none
}

.devsite-claim-badge-dialog .buttons-container .sharing .button:active,.devsite-claim-badge-dialog .buttons-container .sharing button:active,devsite-badge-awarded .buttons-container .sharing .button:active,devsite-badge-awarded .buttons-container .sharing button:active {
    box-shadow: none
}

.devsite-claim-badge-dialog .buttons-container .sharing a:active,.devsite-claim-badge-dialog .buttons-container .sharing a:focus,.devsite-claim-badge-dialog .buttons-container .sharing a:hover,devsite-badge-awarded .buttons-container .sharing a:active,devsite-badge-awarded .buttons-container .sharing a:focus,devsite-badge-awarded .buttons-container .sharing a:hover {
    text-decoration: none
}

.devsite-claim-badge-dialog .buttons-container .sharing .material-icons,devsite-badge-awarded .buttons-container .sharing .material-icons {
    color: var(--devsite-secondary-text-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 8px
}

devsite-badge-redeemer {
    display: block;
    opacity: 1;
    -webkit-transition: opacity .7s ease-in;
    transition: opacity .7s ease-in
}

devsite-badge-redeemer .redeem-code-page-subtitle {
    margin-bottom: 50px;
    margin-top: -28px;
    font-size: 18px;
    color: #202124;
    font-family: var(--devsite-headline-font-family)
}

devsite-badge-redeemer devsite-badge-awarded {
    display: block
}

devsite-badge-redeemer.redeem-success {
    opacity: 0
}

devsite-badge-redeemer .waiting-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

devsite-badge-redeemer .waiting-container devsite-spinner {
    margin-top: 15px;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center
}

devsite-badge-redeemer .change-account-button,devsite-badge-redeemer .create-profile-button,devsite-badge-redeemer .sign-in-button {
    margin-top: 10px
}

devsite-badge-redeemer .enter-button {
    margin-top: 15px
}

devsite-badge-redeemer .redeem-code-title {
    text-transform: uppercase;
    font-size: 10.5px;
    font-weight: 600;
    color: #80868b;
    letter-spacing: 1px
}

devsite-badge-redeemer .redeem-code-error-icon,devsite-badge-redeemer .redeem-code-error-message,devsite-badge-redeemer .redeem-code-success-icon {
    display: none
}

devsite-badge-redeemer.redeem-success .redeem-code-input {
    border-color: #1e8e3e!important
}

devsite-badge-redeemer.redeem-success .redeem-code-success-icon {
    display: inline;
    font-size: 25px;
    color: #1e8e3e;
    margin-left: 10px;
    line-height: 44px
}

devsite-badge-redeemer.redeem-error .redeem-code-input {
    border-color: #d93025
}

devsite-badge-redeemer.redeem-error .redeem-code-error-message {
    display: block;
    font-size: 12px;
    color: #80868b;
    font-style: italic;
    font-weight: 600
}

devsite-badge-redeemer.redeem-error .redeem-code-error-icon {
    display: inline;
    font-size: 25px;
    color: #d93025;
    margin-left: 10px;
    line-height: 44px
}

devsite-badge-redeemer .redeem-code-spinner {
    display: inline-block;
    margin-left: 10px;
    top: 6px
}

devsite-badge-redeemer .redeem-code-input {
    display: inline-block;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 12px;
    color: #000;
    padding: 8px 2px 8px 12px;
    border: 2px solid #1a73e8;
    border-radius: 4px;
    background-color: rgba(232,240,254,.6);
    width: 450px;
    height: 45px
}

devsite-badge-redeemer .redeem-code-input:disabled {
    border-color: #80868b;
    color: #80868b
}

devsite-badger {
    display: none
}

.static-badge-awarded-container .devsite-badger-award-inner {
    padding: 10px
}

.devsite-badger-award {
    bottom: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    left: 0;
    pointer-events: none;
    position: fixed;
    right: 0;
    z-index: 99999
}

.devsite-badger-award .devsite-badger-award-inner {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 670px;
    width: 670px;
    margin-bottom: 16px;
    pointer-events: all;
    position: absolute;
    -webkit-transform: translateY(150%);
    transform: translateY(150%);
    -webkit-transition: bottom .2s,margin-right .2s,-webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: bottom .2s,margin-right .2s,-webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: bottom .2s,margin-right .2s,transform .2s cubic-bezier(.4,0,1,1);
    transition: bottom .2s,margin-right .2s,transform .2s cubic-bezier(.4,0,1,1),-webkit-transform .2s cubic-bezier(.4,0,1,1)
}

@media screen and (max-width: 600px) {
    .devsite-badger-award .devsite-badger-award-inner {
        width:calc(100% - 20px);
        margin-bottom: 10px
    }
}

.devsite-badger-award .devsite-badger-award-inner[show] {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: bottom .2s,margin-right .2s,-webkit-transform .2s cubic-bezier(0,0,.2,1);
    transition: bottom .2s,margin-right .2s,-webkit-transform .2s cubic-bezier(0,0,.2,1);
    transition: bottom .2s,margin-right .2s,transform .2s cubic-bezier(0,0,.2,1);
    transition: bottom .2s,margin-right .2s,transform .2s cubic-bezier(0,0,.2,1),-webkit-transform .2s cubic-bezier(0,0,.2,1)
}

.devsite-badger-award .devsite-badger-award-inner[show] .devsite-badger-award-actions,.devsite-badger-award .devsite-badger-award-inner[show] .devsite-badger-award-details {
    opacity: 1
}

.devsite-badger-award .devsite-badger-award-inner:first-child {
    bottom: 10px;
    z-index: 15
}

.devsite-badger-award .devsite-badger-award-inner:nth-child(2) {
    bottom: 5px;
    margin-right: -10px;
    z-index: 14;
    -webkit-filter: grayscale(100%) brightness(110%);
    filter: grayscale(100%) brightness(110%)
}

.devsite-badger-award .devsite-badger-award-inner:nth-child(3) {
    bottom: 0;
    margin-right: -20px;
    z-index: 13;
    -webkit-filter: grayscale(100%) brightness(110%);
    filter: grayscale(100%) brightness(110%)
}

.devsite-badger-award .devsite-badger-award-inner:nth-child(4) {
    bottom: -5px;
    margin-right: -30px;
    z-index: 12;
    -webkit-filter: grayscale(100%) brightness(110%);
    filter: grayscale(100%) brightness(110%)
}

.devsite-badger-award .devsite-badger-award-inner:nth-child(n+5) {
    bottom: -5px;
    margin-right: -30px;
    display: none
}

@media screen and (max-width: 600px) {
    .devsite-badger-award .devsite-badger-award-inner:first-child {
        bottom:0;
        z-index: 15
    }

    .devsite-badger-award .devsite-badger-award-inner:nth-child(2) {
        bottom: 0;
        margin-right: 0
    }

    .devsite-badger-award .devsite-badger-award-inner:nth-child(n+3) {
        display: none
    }
}

.devsite-badger-award .devsite-badger-award-actions {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    opacity: 0;
    -webkit-transition: opacity .3s cubic-bezier(.4,0,.2,1);
    transition: opacity .3s cubic-bezier(.4,0,.2,1);
    border-top: 1px solid #dadce0;
    padding: 8px
}

devsite-book-nav {
    max-height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
    position: relative;
    z-index: 1004
}

.devsite-book-nav-bg,body[pending] devsite-book-nav {
    background: var(--devsite-book-nav-background);
    box-shadow: var(--devsite-book-nav-box-shadow,0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color))
}

body[pending] devsite-book-nav {
    height: 100vh
}

body[ready] devsite-book-nav[fixed] {
    box-shadow: none;
    contain: content;
    max-height: calc(var(--devsite-book-nav-max-height, 100%) - var(--devsite-cookie-bar-height, 0px));
    position: fixed;
    -webkit-transform: translateY(var(--devsite-js-book-nav-y-offset,0));
    transform: translateY(var(--devsite-js-book-nav-y-offset,0));
    will-change: top,max-height,transform
}

.devsite-book-nav-bg[fixed],.devsite-book-nav-blur,.devsite-book-nav-toggle,devsite-book-nav[fixed] {
    -webkit-margin-after: var(--devsite-cookie-bar-height,0);
    margin-block-end:var(--devsite-cookie-bar-height,0)}

body[ready] .devsite-book-nav-bg[fixed] {
    bottom: 0;
    display: block;
    position: fixed;
    top: 0;
    z-index: 1
}

body[ready] .devsite-book-nav-bg[animatable],body[ready] devsite-book-nav[animatable] {
    -webkit-transition: -webkit-transform .2s cubic-bezier(.4,0,.2,1);
    transition: -webkit-transform .2s cubic-bezier(.4,0,.2,1);
    transition: transform .2s cubic-bezier(.4,0,.2,1);
    transition: transform .2s cubic-bezier(.4,0,.2,1),-webkit-transform .2s cubic-bezier(.4,0,.2,1)
}

.devsite-book-nav-bg:after {
    bottom: -10px;
    content: "";
    display: block;
    height: 10px;
    position: fixed;
    width: 279px
}

[dir=ltr] .devsite-book-nav-bg:after {
    left: 0
}

[dir=rtl] .devsite-book-nav-bg:after {
    right: 0
}

devsite-book-nav .devsite-book-nav-filter {
    background: var(--devsite-book-nav-background);
    border-bottom: var(--devsite-primary-border);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 12px;
    padding: 24px 24px;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 2
}

devsite-book-nav input[type=text] {
    background: var(--devsite-searchbox-inactive);
    border: 0;
    border-radius: 4px;
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color));
    font-size: var(--devsite-nav-font-size,13px);
    height: var(--devsite-book-nav-input-height);
    padding-inline:var(--devsite-book-nav-input-height);width: 100%
}

devsite-book-nav input[type=text]::-webkit-input-placeholder {
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color))
}

devsite-book-nav input[type=text]::-moz-placeholder {
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color))
}

devsite-book-nav input[type=text]:-ms-input-placeholder {
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color))
}

devsite-book-nav input[type=text]::-ms-input-placeholder {
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color))
}

devsite-book-nav input[type=text]::placeholder {
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color))
}

devsite-book-nav input[type=text]:hover {
    background: var(--devsite-searchbox-hover)
}

devsite-book-nav input[type=text]:focus {
    background: var(--devsite-search-form-background-active);
    border: 0;
    box-shadow: var(--devsite-search-active-box-shadow,none);
    color: var(--devsite-search-form-text-active,var(--devsite-primary-text-color));
    padding: 16px var(--devsite-book-nav-input-height)
}

devsite-book-nav .devsite-nav-list {
    padding-bottom: 64px
}

devsite-book-nav .devsite-nav-list>.devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-divider):first-child {
    border-top: 0;
    margin-top: 20px;
    padding-top: 0
}

devsite-book-nav .devsite-book-nav-filter:not([hidden])+.devsite-book-nav .devsite-nav-list>.devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-divider):first-child {
    margin-top: 0
}

devsite-book-nav .filter-clear-button,devsite-book-nav .filter-list-icon:before {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color));
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font: normal normal normal 14px/14px Material Icons;
    height: var(--devsite-book-nav-input-height);
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: 24px;
    width: var(--devsite-book-nav-input-height)
}

devsite-book-nav .filter-list-icon:before {
    content: "filter_list";
    inset-inline: 24px auto
}

devsite-book-nav .filter-clear-button {
    cursor: pointer;
    inset-inline: auto 24px;
    outline: 0
}

devsite-book-nav .filter-clear-button:before {
    content: "close"
}

devsite-book-nav .filter-clear-button:focus:before,devsite-book-nav .filter-clear-button:hover:before {
    background: var(--devsite-background-5);
    border-radius: 50%;
    padding: 4px
}

devsite-book-nav .devsite-nav-text mark {
    background: #feefc3;
    border-radius: 4px
}

[dir=ltr] devsite-book-nav li .devsite-nav-title {
    padding-left: 24px
}

[dir=rtl] devsite-book-nav li .devsite-nav-title {
    padding-left: 8px;
    padding-right: 24px
}

[dir=ltr] devsite-book-nav .devsite-expandable-nav li .devsite-nav-title {
    padding-left: 40px
}

[dir=rtl] devsite-book-nav .devsite-expandable-nav li .devsite-nav-title {
    padding-right: 40px
}

[dir=ltr] devsite-book-nav .devsite-expandable-nav li li .devsite-nav-title {
    padding-left: 56px
}

[dir=rtl] devsite-book-nav .devsite-expandable-nav li li .devsite-nav-title {
    padding-right: 56px
}

[dir=ltr] devsite-book-nav .devsite-expandable-nav li li li .devsite-nav-title {
    padding-left: 72px
}

[dir=rtl] devsite-book-nav .devsite-expandable-nav li li li .devsite-nav-title {
    padding-right: 72px
}

[dir=ltr] devsite-book-nav .devsite-expandable-nav li li li li .devsite-nav-title {
    padding-left: 88px
}

[dir=rtl] devsite-book-nav .devsite-expandable-nav li li li li .devsite-nav-title {
    padding-right: 88px
}

[dir=ltr] devsite-book-nav .devsite-expandable-nav li li li li li .devsite-nav-title {
    padding-left: 104px
}

[dir=rtl] devsite-book-nav .devsite-expandable-nav li li li li li .devsite-nav-title {
    padding-right: 104px
}

[dir=ltr] devsite-book-nav .devsite-expandable-nav li li li li li li .devsite-nav-title {
    padding-left: 120px
}

[dir=rtl] devsite-book-nav .devsite-expandable-nav li li li li li li .devsite-nav-title {
    padding-right: 120px
}

[dir=ltr] devsite-book-nav li.devsite-nav-divider .devsite-nav-title {
    padding-left: 0
}

[dir=rtl] devsite-book-nav li.devsite-nav-divider .devsite-nav-title {
    padding-right: 0
}

[dir=ltr] devsite-book-nav .devsite-nav-title {
    margin-right: var(--devsite-nav-title-margin-x,0);
    padding-right: var(--devsite-nav-title-padding-x,8px)
}

[dir=rtl] devsite-book-nav .devsite-nav-title {
    margin-left: var(--devsite-nav-title-margin-x,0);
    padding-left: 8px
}

devsite-book-nav .devsite-nav-title.devsite-nav-active {
    background: var(--devsite-nav-title-background-active,0)
}

[dir=ltr] devsite-book-nav .devsite-nav-title.devsite-nav-active {
    border-radius: var(--devsite-nav-title-border-radius,0 12px 12px 0)
}

[dir=rtl] devsite-book-nav .devsite-nav-title.devsite-nav-active {
    border-radius: var(--devsite-nav-title-border-radius,12px 0 0 12px)
}

[dir=ltr] devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-heading)>.devsite-nav-title:not(.devsite-nav-active),[dir=ltr] devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion)>.devsite-expandable-nav>.devsite-nav-title-no-path {
    border-radius: var(--devsite-nav-title-border-radius,0 12px 12px 0)
}

[dir=rtl] devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-heading)>.devsite-nav-title:not(.devsite-nav-active),[dir=rtl] devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion)>.devsite-expandable-nav>.devsite-nav-title-no-path {
    border-radius: var(--devsite-nav-title-border-radius,12px 0 0 12px)
}

devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-heading)>.devsite-nav-title:not(.devsite-nav-active):focus,devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-heading)>.devsite-nav-title:not(.devsite-nav-active):hover,devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion)>.devsite-expandable-nav>.devsite-nav-title-no-path:focus,devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion)>.devsite-expandable-nav>.devsite-nav-title-no-path:hover {
    background: var(--devsite-nav-title-background-hover,0)
}

devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-heading)>.devsite-nav-title:not(.devsite-nav-active):focus,devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-heading)>.devsite-nav-title:not(.devsite-nav-active):hover {
    color: var(--devsite-nav-title-color-hover,var(--devsite-link-color))
}

devsite-book-nav .devsite-nav-list>.devsite-nav-heading:not(.devsite-nav-divider) {
    border-top: var(--devsite-primary-border);
    padding-top: 11px
}

devsite-book-nav .devsite-nav-heading:not(.devsite-nav-divider) {
    margin-top: 12px
}

[dir=ltr] devsite-book-nav .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-left: 24px
}

[dir=rtl] devsite-book-nav .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-right: 24px
}

[dir=ltr] devsite-book-nav .devsite-expandable-nav .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-left: 40px
}

[dir=rtl] devsite-book-nav .devsite-expandable-nav .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-right: 40px
}

[dir=ltr] devsite-book-nav .devsite-expandable-nav li .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-left: 56px
}

[dir=rtl] devsite-book-nav .devsite-expandable-nav li .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-right: 56px
}

[dir=ltr] devsite-book-nav .devsite-expandable-nav li li .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-left: 72px
}

[dir=rtl] devsite-book-nav .devsite-expandable-nav li li .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-right: 72px
}

[dir=ltr] devsite-book-nav .devsite-expandable-nav li li li .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-left: 88px
}

[dir=rtl] devsite-book-nav .devsite-expandable-nav li li li .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-right: 88px
}

[dir=ltr] devsite-book-nav .devsite-expandable-nav li li li li .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-left: 104px
}

[dir=rtl] devsite-book-nav .devsite-expandable-nav li li li li .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-right: 104px
}

[dir=ltr] devsite-book-nav .devsite-expandable-nav li li li li li .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-left: 120px
}

[dir=rtl] devsite-book-nav .devsite-expandable-nav li li li li li .devsite-nav-heading:not(.devsite-nav-divider) .devsite-nav-title-no-path {
    padding-right: 120px
}

[dir=ltr] devsite-book-nav .devsite-nav-accordion>.devsite-expandable-nav>.devsite-nav-title-no-path {
    margin-right: 0
}

[dir=rtl] devsite-book-nav .devsite-nav-accordion>.devsite-expandable-nav>.devsite-nav-title-no-path {
    margin-left: 0
}

devsite-book-nav .devsite-nav-heading.devsite-nav-divider {
    background: var(--devsite-nav-divider-background);
    border-bottom: var(--devsite-primary-border);
    border-top: var(--devsite-primary-border);
    padding: 4px 24px 2px
}

devsite-book-nav .devsite-nav-heading.devsite-nav-divider:first-child {
    padding-top: 4px
}

devsite-book-nav .devsite-nav-divider>.devsite-nav-title {
    font: 500 11px/16px var(--devsite-primary-font-family);
    letter-spacing: .8px;
    text-transform: uppercase
}

devsite-book-nav .devsite-nav-accordion+.devsite-nav-accordion,devsite-book-nav .devsite-nav-divider+.devsite-nav-accordion {
    border-top: 0;
    padding-top: 12px
}

devsite-book-nav .devsite-nav-accordion+.devsite-nav-divider {
    border-top: 0;
    padding-top: 4px
}

devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion) .devsite-nav-heading>.devsite-nav-title-no-path {
    border-radius: 0;
    cursor: default
}

devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion) .devsite-nav-heading>.devsite-nav-title-no-path:focus,devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion) .devsite-nav-heading>.devsite-nav-title-no-path:hover {
    background: 0
}

devsite-book-nav .devsite-nav-item.devsite-nav-deprecated:not(.devsite-nav-accordion) .devsite-nav-heading>.devsite-nav-title-no-path:focus,devsite-book-nav .devsite-nav-item.devsite-nav-deprecated:not(.devsite-nav-accordion) .devsite-nav-heading>.devsite-nav-title-no-path:hover {
    color: var(--devsite-nav-title-no-path-color-hover,var(--devsite-link-color))
}

devsite-book-nav .devsite-nav-accordion+.devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-divider),devsite-book-nav .devsite-nav-divider+.devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-divider),devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-divider)+.devsite-nav-accordion,devsite-book-nav .devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-divider)+.devsite-nav-divider {
    margin-top: 12px
}

devsite-book-nav .devsite-nav-break {
    height: 24px
}

#devsite-hamburger-menu,devsite-book-nav .devsite-mobile-header,devsite-book-nav .devsite-mobile-nav-top {
    display: none
}

devsite-book-nav .devsite-mobile-header {
    background: var(--devsite-header-color-upper,var(--devsite-background-1));
    border-bottom: var(--devsite-header-border,var(--devsite-primary-border))
}

#devsite-hamburger-menu:before,devsite-book-nav #devsite-close-nav:before {
    border-radius: 50%;
    padding: 8px;
    -webkit-transition: background .2s;
    transition: background .2s
}

#devsite-hamburger-menu:focus:before,#devsite-hamburger-menu:hover:before,devsite-book-nav #devsite-close-nav:focus:before,devsite-book-nav #devsite-close-nav:hover:before {
    background: var(--devsite-background-3)
}

#devsite-hamburger-menu:before {
    content: "menu"
}

[dir=ltr] devsite-book-nav #devsite-close-nav:before {
    content: "arrow_back"
}

[dir=rtl] devsite-book-nav #devsite-close-nav:before {
    content: "arrow_forward"
}

devsite-book-nav[top-level-nav] #devsite-close-nav:before {
    content: "close"
}

.devsite-book-nav-toggle {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--devsite-book-nav-toggle-background);
    border: var(--devsite-book-nav-toggle-border,0);
    bottom: 16px;
    box-shadow: var(--devsite-book-nav-toggle-box-shadow,0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color));
    color: var(--devsite-book-nav-toggle-color,var(--devsite-secondary-text-color));
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-width: 24px;
    padding: 0;
    position: fixed;
    text-decoration: none;
    -webkit-transform: translateX(calc(var(--devsite-js-book-nav-scrollbar-width, 0px) - var(--devsite-nav-title-margin-x, 8px)));
    transform: translateX(calc(var(--devsite-js-book-nav-scrollbar-width, 0px) - var(--devsite-nav-title-margin-x, 8px)));
    -webkit-transition: border-radius .2s ease,-webkit-transform .2s cubic-bezier(.4,0,.2,1);
    transition: border-radius .2s ease,-webkit-transform .2s cubic-bezier(.4,0,.2,1);
    transition: transform .2s cubic-bezier(.4,0,.2,1),border-radius .2s ease;
    transition: transform .2s cubic-bezier(.4,0,.2,1),border-radius .2s ease,-webkit-transform .2s cubic-bezier(.4,0,.2,1);
    z-index: 1004
}

.devsite-book-nav-toggle:focus,.devsite-book-nav-toggle:hover {
    background-color: var(--devsite-book-nav-toggle-background-hover);
    border: var(--devsite-book-nav-toggle-border-hover,0);
    box-shadow: var(--devsite-book-nav-toggle-box-shadow-hover,0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color));
    color: var(--devsite-book-nav-toggle-color-hover,var(--devsite-secondary-text-color))
}

.devsite-book-nav-toggle[aria-expanded=true] {
    border-radius: 50%;
    width: 40px
}

[dir=ltr] .devsite-book-nav-toggle[aria-expanded=true] {
    -webkit-transform: translateX(calc(229px - var(--devsite-js-book-nav-scrollbar-width, 0px) - var(--devsite-nav-title-margin-x, 8px)));
    transform: translateX(calc(229px - var(--devsite-js-book-nav-scrollbar-width, 0px) - var(--devsite-nav-title-margin-x, 8px)))
}

[dir=rtl] .devsite-book-nav-toggle[aria-expanded=true] {
    -webkit-transform: translateX(calc(-229px + var(--devsite-js-book-nav-scrollbar-width, 0px) + var(--devsite-nav-title-margin-x, 8px)));
    transform: translateX(calc(-229px + var(--devsite-js-book-nav-scrollbar-width, 0px) + var(--devsite-nav-title-margin-x, 8px)))
}

.devsite-book-nav-toggle[aria-expanded=false] {
    -webkit-border-start: 0;
    -moz-border-start: 0;
    border-inline-start:0;-webkit-transition: width .2s ease,border-radius .2s ease,-webkit-transform .15s cubic-bezier(.4,0,.2,1);
    transition: width .2s ease,border-radius .2s ease,-webkit-transform .15s cubic-bezier(.4,0,.2,1);
    transition: width .2s ease,transform .15s cubic-bezier(.4,0,.2,1),border-radius .2s ease;
    transition: width .2s ease,transform .15s cubic-bezier(.4,0,.2,1),border-radius .2s ease,-webkit-transform .15s cubic-bezier(.4,0,.2,1);
    width: 24px
}

[dir=ltr] .devsite-book-nav-toggle[aria-expanded=false] {
    border-radius: 0 20px 20px 0
}

[dir=rtl] .devsite-book-nav-toggle[aria-expanded=false] {
    border-radius: 20px 0 0 20px
}

.devsite-book-nav-toggle[aria-expanded=false]:focus,.devsite-book-nav-toggle[aria-expanded=false]:hover {
    width: 40px
}

[dir=ltr] body[ready] .devsite-book-nav-bg[collapsed] {
    -webkit-transform: translate(-279px);
    transform: translate(-279px)
}

[dir=rtl] body[ready] .devsite-book-nav-bg[collapsed] {
    -webkit-transform: translate(279px);
    transform: translate(279px)
}

[dir=ltr] body[ready] devsite-book-nav[collapsed] {
    -webkit-transform: translate(-279px,var(--devsite-js-book-nav-y-offset,0));
    transform: translate(-279px,var(--devsite-js-book-nav-y-offset,0))
}

[dir=rtl] body[ready] devsite-book-nav[collapsed] {
    -webkit-transform: translate(279px,var(--devsite-js-book-nav-y-offset,0));
    transform: translate(279px,var(--devsite-js-book-nav-y-offset,0))
}

body[ready] devsite-book-nav.hide-collapsed-panel {
    display: none
}

.devsite-book-nav-toggle .devsite-book-nav-toggle-icon {
    font-size: 20px;
    height: 20px;
    position: static;
    width: 20px
}

.devsite-book-nav-toggle .devsite-book-nav-toggle-icon:before {
    content: var(--devsite-book-nav-toggle-icon)
}

[dir=ltr] .devsite-book-nav-toggle,[dir=rtl] .devsite-book-nav-toggle[aria-expanded=true] {
    --devsite-book-nav-toggle-icon: "chevron_right"
}

[dir=ltr] .devsite-book-nav-toggle[aria-expanded=true],[dir=rtl] .devsite-book-nav-toggle {
    --devsite-book-nav-toggle-icon: "chevron_left"
}

devsite-book-nav~.devsite-book-nav-blur {
    background-color: var(--devsite-book-nav-background);
    bottom: 0;
    height: 64px;
    -webkit-mask-image: -webkit-linear-gradient(transparent,#000 28px);
    mask-image: linear-gradient(transparent,#000 28px);
    pointer-events: none;
    position: fixed;
    width: calc(269px - var(--devsite-js-book-nav-scrollbar-width, 0px));
    z-index: 1004;
    -webkit-transition: -webkit-transform .2s cubic-bezier(.4,0,.2,1);
    transition: -webkit-transform .2s cubic-bezier(.4,0,.2,1);
    transition: transform .2s cubic-bezier(.4,0,.2,1);
    transition: transform .2s cubic-bezier(.4,0,.2,1),-webkit-transform .2s cubic-bezier(.4,0,.2,1);
    -webkit-transform: translate(0);
    transform: translate(0)
}

[dir=ltr] devsite-book-nav~.devsite-book-nav-blur {
    left: 0
}

[dir=rtl] devsite-book-nav~.devsite-book-nav-blur {
    right: 0
}

[dir=ltr] devsite-book-nav~.devsite-book-nav-blur[collapsed] {
    left: 0;
    -webkit-transform: translate(-281px,var(--devsite-js-book-nav-y-offset,0));
    transform: translate(-281px,var(--devsite-js-book-nav-y-offset,0))
}

[dir=rtl] devsite-book-nav~.devsite-book-nav-blur[collapsed] {
    right: 0;
    -webkit-transform: translate(281px,var(--devsite-js-book-nav-y-offset,0));
    transform: translate(281px,var(--devsite-js-book-nav-y-offset,0))
}

@media screen and (max-width: 840px) {
    devsite-book-nav {
        display:none;
        height: 100vh;
        max-height: 100vh!important;
        top: 0!important;
        z-index: 1013
    }

    body[ready] .devsite-book-nav-bg,body[ready] devsite-book-nav {
        -webkit-transition: -webkit-transform .2s cubic-bezier(.4,0,.2,1);
        transition: -webkit-transform .2s cubic-bezier(.4,0,.2,1);
        transition: transform .2s cubic-bezier(.4,0,.2,1);
        transition: transform .2s cubic-bezier(.4,0,.2,1),-webkit-transform .2s cubic-bezier(.4,0,.2,1)
    }

    [dir=ltr] body[ready] devsite-book-nav {
        -webkit-transform: translate(-281px);
        transform: translate(-281px)
    }

    [dir=rtl] body[ready] devsite-book-nav {
        -webkit-transform: translate(281px);
        transform: translate(281px)
    }

    .devsite-book-nav-blur {
        display: none
    }

    body[ready] .devsite-book-nav-bg[fixed] {
        display: none
    }

    body[ready] devsite-book-nav[fixed] {
        background: var(--devsite-book-nav-background);
        display: block!important;
        box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color)
    }

    devsite-book-nav[visually-hidden] {
        opacity: 1!important;
        pointer-events: auto!important;
        visibility: visible!important
    }

    #devsite-hamburger-menu,devsite-book-nav #devsite-close-nav {
        --devsite-button-white-background-active: none;
        --devsite-button-white-background-hover: none;
        --devsite-button-white-box-shadow-active: none;
        --devsite-button-white-box-shadow-hover: none;
        height: 100%;
        position: relative;
        width: auto;
        z-index: 20
    }

    #devsite-hamburger-menu {
        display: block;
        width: 40px
    }

    [dir=ltr] #devsite-hamburger-menu {
        margin: 0 0 0 -4px
    }

    [dir=rtl] #devsite-hamburger-menu {
        margin: 0 -4px 0 0
    }

    devsite-book-nav #devsite-close-nav {
        color: var(--devsite-secondary-text-color);
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0
    }

    [dir=ltr] devsite-book-nav #devsite-close-nav {
        margin: 0 0 0 -12px
    }

    [dir=rtl] devsite-book-nav #devsite-close-nav {
        margin: 0 -12px 0 0
    }

    devsite-book-nav .devsite-mobile-nav-top {
        display: block
    }

    devsite-book-nav .devsite-book-nav-wrapper {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-transition: -webkit-transform .2s cubic-bezier(.4,0,.2,1);
        transition: -webkit-transform .2s cubic-bezier(.4,0,.2,1);
        transition: transform .2s cubic-bezier(.4,0,.2,1);
        transition: transform .2s cubic-bezier(.4,0,.2,1),-webkit-transform .2s cubic-bezier(.4,0,.2,1)
    }

    [dir=ltr] devsite-book-nav .devsite-book-nav-wrapper {
        -webkit-transform: translateX(-269px);
        transform: translateX(-269px)
    }

    [dir=rtl] devsite-book-nav .devsite-book-nav-wrapper {
        -webkit-transform: translateX(269px);
        transform: translateX(269px)
    }

    devsite-book-nav .devsite-nav-list {
        padding-bottom: 120px
    }

    devsite-book-nav .devsite-nav-list>.devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-divider):first-child {
        margin-top: 0
    }

    devsite-book-nav .devsite-mobile-nav-bottom .devsite-nav-list>.devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-divider):first-child {
        margin-top: 13px
    }

    devsite-book-nav .devsite-mobile-nav-top .devsite-nav-text {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1
    }

    devsite-book-nav[top-level-nav] .devsite-book-nav-wrapper {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    devsite-book-nav:not([top-level-nav]) .devsite-mobile-nav-top,devsite-book-nav[top-level-nav] .devsite-mobile-nav-bottom {
        height: calc(100vh - 64px);
        overflow: hidden
    }

    devsite-book-nav .devsite-mobile-nav-top>.devsite-nav-list>.devsite-nav-item {
        border-bottom: var(--devsite-primary-border)
    }

    devsite-book-nav .devsite-mobile-nav-top>.devsite-nav-list>.devsite-nav-item>.devsite-nav-title {
        font-weight: 700;
        padding-bottom: 15px;
        padding-top: 16px
    }

    devsite-book-nav .devsite-mobile-nav-top>.devsite-nav-list>.devsite-nav-item>.devsite-nav-active {
        background: 0
    }

    devsite-book-nav .devsite-mobile-nav-top>.devsite-nav-list>.devsite-nav-item>.devsite-nav-title:not(.devsite-nav-active) {
        color: var(--devsite-secondary-text-color)
    }

    devsite-book-nav .devsite-mobile-nav-top>.devsite-nav-list>.devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-heading)>.devsite-nav-title {
        border-radius: 0
    }

    devsite-book-nav .devsite-mobile-nav-top>.devsite-nav-list>.devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-heading)>.devsite-nav-title:focus,devsite-book-nav .devsite-mobile-nav-top>.devsite-nav-list>.devsite-nav-item:not(.devsite-nav-accordion):not(.devsite-nav-heading)>.devsite-nav-title:hover {
        background: 0
    }

    devsite-book-nav .devsite-mobile-nav-bottom,devsite-book-nav .devsite-mobile-nav-top {
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        width: 269px
    }

    devsite-book-nav .devsite-mobile-header {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        height: 49px;
        padding: 0 16px;
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 100
    }

    devsite-book-nav .devsite-mobile-header .devsite-nav-active {
        font-weight: 400
    }

    devsite-book-nav .devsite-nav-responsive-tabs {
        margin-bottom: 12px;
        margin-top: -11px
    }

    devsite-book-nav .devsite-lower-tab-item {
        margin: 0
    }

    devsite-book-nav .devsite-nav-responsive-tabs>.devsite-nav-item:last-child {
        margin-bottom: 8px
    }

    devsite-book-nav~.devsite-book-nav-toggle {
        display: none
    }

    devsite-book-nav .devsite-book-nav-filter {
        display: none
    }
}

@media screen and (max-width: 600px) {
    #devsite-hamburger-menu,devsite-book-nav #devsite-close-nav {
        margin:0 4px 0 -12px
    }
}

.devsite-expandable-nav {
    display: block;
    position: relative
}

.devsite-expandable-nav>.devsite-nav-section {
    max-width: 100%;
    overflow-y: hidden;
    -webkit-transition: height .2s;
    transition: height .2s;
    width: 100%;
    will-change: height
}

.devsite-expandable-nav:not([animatable])>.devsite-nav-section {
    -webkit-transition: height 1ms;
    transition: height 1ms
}

.devsite-expandable-nav>.devsite-nav-section .devsite-nav-heading:not(.devsite-nav-divider):first-child {
    margin-top: 0
}

.devsite-expandable-nav:not(.expanded)>.devsite-nav-section {
    display: none
}

.devsite-expandable-nav:not(.expanded)>.devsite-nav-section {
    height: 0
}

.devsite-expandable-nav>.devsite-nav-title-no-path {
    cursor: pointer;
    outline: 0
}

.devsite-expandable-nav>.devsite-nav-title {
    -webkit-padding-start: 24px;
    -moz-padding-start: 24px;
    padding-inline-start:24px}

.devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-title {
    -webkit-padding-start: 40px;
    -moz-padding-start: 40px;
    padding-inline-start:40px}

.devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-title {
    -webkit-padding-start: 56px;
    -moz-padding-start: 56px;
    padding-inline-start:56px}

.devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-title {
    -webkit-padding-start: 72px;
    -moz-padding-start: 72px;
    padding-inline-start:72px}

.devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-title {
    -webkit-padding-start: 88px;
    -moz-padding-start: 88px;
    padding-inline-start:88px}

.devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-title {
    -webkit-padding-start: 104px;
    -moz-padding-start: 104px;
    padding-inline-start:104px}

.devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-title {
    -webkit-padding-start: 120px;
    -moz-padding-start: 120px;
    padding-inline-start:120px}

.devsite-expandable-nav>.devsite-nav-toggle {
    cursor: pointer;
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    text-decoration: none
}

.devsite-nav-item:not(.devsite-nav-accordion)>.devsite-expandable-nav>.devsite-nav-toggle {
    font-size: 18px;
    position: absolute;
    top: var(--devsite-nav-toggle-y-start,0);
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transition: -webkit-transform .2s ease;
    transition: -webkit-transform .2s ease;
    transition: transform .2s ease;
    transition: transform .2s ease,-webkit-transform .2s ease;
    will-change: transform
}

.devsite-nav-item:not(.devsite-nav-accordion)>.devsite-expandable-nav:not([animatable])>.devsite-nav-toggle {
    -webkit-transition: -webkit-transform 1ms;
    transition: -webkit-transform 1ms;
    transition: transform 1ms;
    transition: transform 1ms,-webkit-transform 1ms
}

[dir=ltr] .devsite-expandable-nav>.devsite-nav-toggle {
    left: 4px
}

[dir=rtl] .devsite-expandable-nav>.devsite-nav-toggle {
    right: 4px
}

[dir=ltr] .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-toggle {
    left: 20px
}

[dir=rtl] .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-toggle {
    right: 20px
}

[dir=ltr] .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-toggle {
    left: 36px
}

[dir=rtl] .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-toggle {
    right: 36px
}

[dir=ltr] .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-toggle {
    left: 52px
}

[dir=rtl] .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-toggle {
    right: 52px
}

[dir=ltr] .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-toggle {
    left: 68px
}

[dir=rtl] .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-toggle {
    right: 68px
}

[dir=ltr] .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-toggle {
    left: 84px
}

[dir=rtl] .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-toggle {
    right: 84px
}

[dir=ltr] .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-toggle {
    left: 100px
}

[dir=rtl] .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav .devsite-expandable-nav>.devsite-nav-toggle {
    right: 100px
}

.devsite-nav-item:not(.devsite-nav-accordion)>.devsite-expandable-nav:not(.expanded)>.devsite-nav-toggle {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

[dir=rtl] .devsite-nav-item:not(.devsite-nav-accordion)>.devsite-expandable-nav:not(.expanded)>.devsite-nav-toggle {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.devsite-expandable-nav>.devsite-nav-toggle:before {
    content: "arrow_drop_down"
}

.devsite-nav-accordion {
    border-bottom: var(--devsite-primary-border);
    border-top: var(--devsite-primary-border);
    padding: 11px 0
}

.devsite-nav-accordion>.devsite-expandable-nav {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.devsite-nav-accordion>.devsite-expandable-nav>.devsite-nav-title {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-secondary-text-rgba);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 0 196px;
    -moz-box-flex: 1;
    -ms-flex: 1 0 196px;
    flex: 1 0 196px;
    font-weight: var(--devsite-nav-accordion-title-font-weight,700);
    overflow: hidden
}

.devsite-nav-accordion>.devsite-expandable-nav>.devsite-nav-toggle {
    color: var(--devsite-secondary-text-color);
    font-size: 24px;
    margin-block:0;margin-inline:0 8px;-webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -moz-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    -webkit-transition: -webkit-transform .5s;
    transition: -webkit-transform .5s;
    transition: transform .5s;
    transition: transform .5s,-webkit-transform .5s
}

.devsite-nav-accordion>.devsite-expandable-nav:not([animatable])>.devsite-nav-toggle {
    -webkit-transition: -webkit-transform 1ms;
    transition: -webkit-transform 1ms;
    transition: transform 1ms;
    transition: transform 1ms,-webkit-transform 1ms
}

.devsite-nav-accordion>.devsite-expandable-nav:not(.expanded)>.devsite-nav-toggle {
    -webkit-transform: rotateX(180deg);
    transform: rotateX(180deg)
}

.devsite-nav-accordion>.devsite-expandable-nav>.devsite-nav-toggle:before {
    content: "expand_less"
}

.devsite-nav-accordion>.devsite-expandable-nav>.devsite-nav-section {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -moz-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

devsite-book-nav .devsite-product-id-row {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    min-height: 56px;
    padding: var(--devsite-product-id-row-padding,20px 24px 0)
}

devsite-book-nav .devsite-header-no-lower-tabs .devsite-product-id-row {
    min-height: 76px;
    padding: var(--devsite-product-id-row-padding,20px 24px)
}

devsite-book-nav .devsite-product-description-row {
    color: var(--devsite-header-foreground-lower-description,var(--devsite-header-foreground-lower-hover,var(--devsite-inverted-text-color)));
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font: var(--devsite-header-lower-description-font,400 20px/32px var(--devsite-primary-font-family));
    gap: 8px
}

devsite-book-nav .devsite-product-description-row .devsite-breadcrumb-item .devsite-breadcrumb-peers {
    --devsite-select-background-color-active: transparent;
    --devsite-select-background-color-hover: transparent;
    --devsite-select-border: 1px solid transparent;
    --devsite-select-border-hover: 1px solid var(--devsite-link-color);
    --devsite-select-font: none;
    --devsite-select-toggle-icon-size: 24px;
    --devsite-select-padding-inline: 7px 31px;
    --devsite-select-toggle-icon-x: 4px;
    margin-inline:-4px}

devsite-book-nav .devsite-product-description-row .devsite-breadcrumb-item:first-of-type .devsite-breadcrumb-peers {
    margin-inline:-8px -4px}

devsite-book-nav .devsite-product-id {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-book-nav .devsite-product-description {
    font: 16px/24px var(--devsite-primary-font-family);
    margin-block:0;margin-inline:0 180px}

devsite-book-nav .devsite-product-button-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin-block:0;margin-inline:24px 0;z-index: 1
}

@media screen and (max-width: 840px) {
    devsite-book-nav .devsite-product-id-row {
        min-height:76px;
        padding: var(--devsite-product-id-row-padding,20px 24px)
    }

    devsite-book-nav .devsite-product-description {
        margin-inline:0}
}

@media screen and (max-width: 600px) {
    devsite-book-nav .devsite-header-no-lower-tabs .devsite-product-id-row,devsite-book-nav .devsite-product-id-row {
        -webkit-flex-wrap:wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: var(--devsite-product-id-row-padding,20px 16px)
    }

    devsite-book-nav .devsite-product-button-row {
        -webkit-flex-basis: 100%;
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        margin-block:16px 0;margin-inline:0}
}

devsite-book-nav .devsite-product-name-wrapper {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    height: 36px;
    margin: 6px 0
}

devsite-book-nav .devsite-product-name-link,devsite-book-nav .devsite-site-logo-link {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 1;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

devsite-book-nav .devsite-product-name-link:focus,devsite-book-nav .devsite-product-name-link:hover,devsite-book-nav .devsite-site-logo-link:focus {
    opacity: .7;
    text-decoration: none
}

devsite-book-nav .devsite-site-logo {
    aspect-ratio: var(--devsite-logo-aspect-ratio,auto);
    height: var(--devsite-logo-height,32px)
}

devsite-book-nav .devsite-has-google-wordmark>.devsite-breadcrumb-link,devsite-book-nav .devsite-has-google-wordmark>.devsite-product-name {
    direction: ltr
}

devsite-book-nav .devsite-google-wordmark {
    height: 24px;
    margin: 0 4px 0 0;
    position: relative;
    top: 5px
}

devsite-book-nav .devsite-google-wordmark-svg-path {
    -webkit-transition: fill .2s;
    transition: fill .2s
}

devsite-book-nav .devsite-site-logo-link canvas {
    height: auto!important
}

devsite-book-nav .devsite-site-logo-link picture {
    display: contents
}

devsite-book-nav .devsite-product-logo-container {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 36px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-inline:0 4px;width: 36px
}

devsite-book-nav .devsite-top-logo-row .devsite-product-logo-container {
    color: var(--devsite-primary-color,var(--devsite-primary-text-color))
}

devsite-book-nav .devsite-top-logo-row .devsite-product-logo-container[background] {
    background: var(--devsite-primary-color,var(--devsite-primary-text-color));
    color: var(--devsite-inverted-text-color)
}

devsite-book-nav .devsite-product-logo {
    color: inherit;
    display: block;
    font-size: 32px;
    height: 32px;
    max-width: 32px;
    min-width: 32px;
    overflow: hidden;
    white-space: nowrap
}

devsite-book-nav .devsite-product-logo-container[background] .devsite-product-logo {
    font-size: 28px;
    height: 28px;
    max-width: 28px;
    min-width: 28px
}

devsite-book-nav .devsite-product-name {
    font: var(--devsite-wordmark-font,400 20px/32px var(--devsite-primary-font-family));
    letter-spacing: 0;
    margin: 0;
    max-height: 32px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-transition: color .2s;
    transition: color .2s;
    white-space: nowrap
}

devsite-book-nav .devsite-site-logo:not([src*=".svg"]) {
    height: auto;
    max-height: 32px
}

devsite-book-nav .devsite-breadcrumb-link>.devsite-product-name {
    color: inherit
}

@media screen and (max-width: 840px) {
    devsite-book-nav .devsite-product-name-wrapper {
        -webkit-box-flex:0;
        -webkit-flex: 0 1 auto;
        -moz-box-flex: 0;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        min-width: 0
    }

    devsite-book-nav .devsite-product-name-wrapper .devsite-breadcrumb-item:not(:first-of-type),devsite-book-nav .devsite-product-name-wrapper .devsite-site-logo-link+.devsite-product-name {
        display: none
    }

    devsite-book-nav .devsite-product-name-wrapper .devsite-breadcrumb-item,devsite-book-nav .devsite-product-name-wrapper .devsite-breadcrumb-link,devsite-book-nav .devsite-product-name-wrapper .devsite-breadcrumb-list,devsite-book-nav .devsite-product-name-wrapper .devsite-product-name {
        width: 100%
    }

    devsite-book-nav .devsite-product-name-wrapper .devsite-breadcrumb-link {
        overflow: hidden;
        text-overflow: ellipsis
    }
}

devsite-bookmark {
    display: none
}

devsite-bookmark.show {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-bookmark-background);
    border: 0;
    box-shadow: none;
    cursor: pointer;
    height: 36px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0;
    padding: 0;
    vertical-align: middle
}

.devsite-article[has-bookmark] devsite-bookmark.show {
    min-width: 66px;
    width: 66px
}

devsite-bookmark.show.devsite-legacy-bookmark {
    border-radius: 18px;
    min-width: 36px;
    width: 36px
}

devsite-bookmark.show.devsite-legacy-bookmark:focus,devsite-bookmark.show.devsite-legacy-bookmark:hover {
    background: var(--devsite-bookmark-background-hover-legacy)
}

.devsite-article[has-bookmark] devsite-bookmark.show.devsite-page-bookmark,.devsite-article[has-bookmark] devsite-feature-tooltip.devsite-page-bookmark-tooltip {
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px;-webkit-margin-start: -74px;
    -moz-margin-start: -74px;
    margin-inline-start:-74px}

devsite-bookmark input.bookmark-checkbox {
    background: var(--devsite-bookmark-background);
    color: var(--devsite-bookmark-icon-color);
    margin: 0
}

devsite-bookmark devsite-dropdown-list {
    --devsite-button-box-shadow: none
}

devsite-bookmark devsite-dropdown-list .bookmark-icon {
    color: var(--devsite-bookmark-icon-color);
    -webkit-transition: color .2s;
    transition: color .2s
}

devsite-bookmark devsite-dropdown-list .bookmark-icon.bookmark-action:before {
    content: "bookmark_border"
}

devsite-bookmark devsite-dropdown-list .bookmark-icon.unbookmark-action:before {
    content: "bookmark"
}

devsite-bookmark devsite-dropdown-list:where(:hover,:focus,:active) .bookmark-icon {
    color: var(--devsite-dropdown-list-toggle-color-hover)
}

devsite-bookmark devsite-dropdown-list .bookmark-icon.toggled {
    color: var(--devsite-bookmark-icon-color-saved)
}

devsite-bookmark devsite-dropdown-list:where(:hover,:focus,:active) .bookmark-icon.toggled {
    color: var(--devsite-bookmark-icon-color-saved-hover)
}

devsite-bookmark input.bookmark-checkbox:after {
    content: "bookmark_border"
}

devsite-bookmark input.bookmark-checkbox:checked:after {
    content: "bookmark"
}

devsite-bookmark input.bookmark-checkbox:checked:focus:before,devsite-bookmark input.bookmark-checkbox:focus:before {
    background: var(--devsite-bookmark-background-focus-legacy)
}

devsite-bookmark input.bookmark-checkbox:checked,devsite-bookmark[saved] input.bookmark-checkbox,devsite-bookmark[saved] input.bookmark-checkbox:checked {
    color: var(--devsite-bookmark-icon-color-saved)
}

.devsite-bookmark-dialog .create-profile-spinner {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: hsla(0,0%,100%,.8);
    bottom: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: opacity .3s cubic-bezier(.4,0,.2,1);
    transition: opacity .3s cubic-bezier(.4,0,.2,1);
    z-index: 10
}

.devsite-bookmark-dialog.loading .create-profile-spinner {
    opacity: 1
}

.devsite-receive-updates-dialog {
    padding: 24px
}

.devsite-receive-updates-dialog .devsite-dialog-contents {
    padding: 0
}

.devsite-receive-updates-dialog .no-link {
    text-align: left
}

.devsite-receive-updates-dialog .devsite-dialog-buttons {
    -webkit-box-pack: left;
    -webkit-justify-content: left;
    -moz-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left;
    padding: 0
}

.devsite-receive-updates-dialog .devsite-dialog-buttons .devsite-dialog-close {
    -webkit-margin-start: 16px;
    -moz-margin-start: 16px;
    margin-inline-start:16px}

.devsite-callout {
    background-color: var(--devsite-background-1);
    border-radius: 8px;
    border: none;
    box-shadow: 0 1px 2px rgba(60,64,67,.3),0 2px 6px 2px rgba(60,64,67,.15);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    inset-block-start: 48px;
    inset-block-start: anchor(end,48px);
    inset-inline-end: 16px;
    inset-inline-end: anchor(inside,16px);
    -webkit-margin-before: 6px;
    margin-block-start:6px;margin-inline:auto 0;max-width: 378px;
    padding: 20px 24px 24px;
    position-anchor: --devsite-user-button;
    position: fixed;
    -webkit-transition: opacity .15s cubic-bezier(.2,0,0,1),display allow-discrete .15s,-webkit-transform .15s cubic-bezier(.2,0,0,1);
    transition: opacity .15s cubic-bezier(.2,0,0,1),display allow-discrete .15s,-webkit-transform .15s cubic-bezier(.2,0,0,1);
    transition: opacity .15s cubic-bezier(.2,0,0,1),transform .15s cubic-bezier(.2,0,0,1),display allow-discrete .15s;
    transition: opacity .15s cubic-bezier(.2,0,0,1),transform .15s cubic-bezier(.2,0,0,1),display allow-discrete .15s,-webkit-transform .15s cubic-bezier(.2,0,0,1);
    width: 100%;
    z-index: 1007
}

[dir=ltr] .devsite-callout {
    -webkit-transform-origin: top right;
    transform-origin: top right
}

[dir=rtl] .devsite-callout {
    -webkit-transform-origin: top left;
    transform-origin: top left
}

.devsite-callout[open] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.devsite-callout:not([open]) {
    display: none;
    opacity: 0;
    -webkit-transform: scale(.8);
    transform: scale(.8)
}

.devsite-callout .devsite-callout-branding {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.devsite-callout .devsite-callout-branding-image {
    max-height: 18px
}

.devsite-callout hr {
    margin-block:16px}

.devsite-callout .devsite-callout-hero {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-margin-after: 16px;
    margin-block-end:16px;width: 100%
}

.devsite-callout .devsite-callout-hero-image {
    border-radius: 6px;
    max-height: 200px;
    max-width: 100%
}

.devsite-callout .devsite-callout-header {
    -webkit-align-self: self-start;
    -ms-flex-item-align: self-start;
    align-self: self-start;
    -webkit-margin-after: 4px;
    margin-block-end:4px}

.devsite-callout h2 {
    color: var(--devsite-primary-text-color);
    letter-spacing: .1px;
    line-height: 24px;
    margin: 0;
    font-family: Roboto;
    font-size: 16px;
    font-weight: 500
}

.devsite-callout .devsite-callout-body {
    font-family: Roboto;
    font-size: 14px;
    letter-spacing: .2px;
    line-height: 20px
}

.devsite-callout .devsite-callout-body p {
    margin: 0
}

.devsite-callout .devsite-callout-body:has(devsite-spinner) {
    padding-block:24px;place-items: center
}

.devsite-callout .devsite-callout-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-margin-before: 20px;
    margin-block-start:20px;width: 100%
}

.viewport--mobile .devsite-callout .devsite-callout-buttons {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.devsite-callout .devsite-callout-buttons .button+.button {
    margin: 0
}

@media screen and (width < 520px) {
    .devsite-callout {
        inset-block-start: 48px;
        inset-inline-end: 0;
        margin: auto
    }
}

@media screen and (width < 400px) {
    .devsite-callout {
        margin-inline: 8px;
        width: calc(100% - 16px)
    }
}

devsite-callout-notification .devsite-callout-notification-input {
    margin-block:16px 4px}

devsite-callout-notification .devsite-callout-notification-error {
    color: #ea4335;
    display: none;
    font-size: 12px;
    margin: 2px 0 0 14px
}

devsite-callout-notification devsite-mwc[data-incorrect]~.devsite-callout-notification-error-incorrect,devsite-callout-notification devsite-mwc[data-missing]~.devsite-callout-notification-error-missing {
    display: inline-block
}

devsite-carousel>:where(ul,ol,[role=list]) {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: var(--devsite-carousel-item-gap);
    list-style: none;
    padding: 0
}

devsite-carousel ul {
    padding-left: 0
}

devsite-carousel:not(:defined) :where(ul,ol,[role=list]) {
    display: none
}

devsite-carousel>:where(ul,ol,[role=list])>:where(li,[role=listitem]) {
    list-style: none;
    -webkit-box-align: start;
    -webkit-align-items: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-flex: var(--devsite-carousel-item-flex);
    -webkit-flex: var(--devsite-carousel-item-flex);
    -moz-box-flex: var(--devsite-carousel-item-flex);
    -ms-flex: var(--devsite-carousel-item-flex);
    flex: var(--devsite-carousel-item-flex);
    margin: 0;
    scroll-snap-align: start
}

devsite-carousel[data-items-per-slide=auto]>:is(ul,ol,[role=list])>:is(li,[role=listitem]):last-child:empty {
    border: 0;
    padding: 0;
    padding-block:0;padding-inline:0;visibility: hidden;
    width: var(--devsite-carousel-ghost-item-width)
}

devsite-catalog {
    display: block;
    margin: 20px 0;
    width: 100%
}

devsite-catalog:not(:defined)>* {
    display: none
}

devsite-catalog>.catalog-container {
    -webkit-box-align: start;
    -webkit-align-items: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    display: grid;
    gap: 30px;
    grid: var(--devsite-catalog-grid)
}

devsite-catalog>.catalog-no-sidebar {
    --devsite-catalog-grid: "main main" 1fr/1fr 3fr
}

devsite-catalog .catalog-sidebar {
    grid-area: sidebar
}

devsite-catalog .catalog-main {
    grid-area: main
}

devsite-catalog .catalog-checkbox-controls-container,devsite-catalog .catalog-checkbox-controls-group,devsite-catalog .catalog-main-filter-controls {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-catalog .catalog-checkbox-controls-container,devsite-catalog .catalog-checkbox-controls-group {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

devsite-catalog .catalog-checkbox-controls-group,devsite-catalog .catalog-checkbox-controls-subtitle,devsite-catalog .catalog-checkbox-controls-title,devsite-catalog .catalog-checkbox-label,devsite-catalog .catalog-filter-bar {
    text-align: var(--devsite-catalog-text-align,start);
    width: 100%
}

devsite-catalog .catalog-checkbox-controls-container {
    border: var(--devsite-primary-border);
    border-radius: var(--devsite-card-border-radius);
    color: var(--devsite-secondary-text-color)
}

devsite-catalog .catalog-filter-chips {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: var(--devsite-chips-gap)
}

devsite-catalog .catalog-checkbox-controls-filter-chips-container {
    display: none
}

devsite-catalog .catalog-main-filter-chips>:only-child {
    margin-bottom: 24px
}

devsite-catalog .catalog-main-filter-chips>div {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 16px 8px
}

devsite-catalog .catalog-main-filter-chips>div:empty {
    display: none
}

devsite-catalog .catalog-filter-chip {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 16px;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 32px
}

devsite-catalog .catalog-filter-chip:after {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    content: var(--devsite-button-icon-content);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 18px;
    height: 18px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-margin-end: var(--devsite-button-icon-margin-x-end);
    -moz-margin-end: var(--devsite-button-icon-margin-x-end);
    margin-inline-end:var(--devsite-button-icon-margin-x-end);-webkit-margin-start: var(--devsite-button-icon-margin-x-start);
    -moz-margin-start: var(--devsite-button-icon-margin-x-start);
    margin-inline-start:var(--devsite-button-icon-margin-x-start);width: 18px
}

devsite-catalog .catalog-checkbox-controls-group {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 0 20px 20px
}

devsite-catalog .catalog-container .catalog-clear-group-checkboxes-button,devsite-catalog .catalog-container .catalog-select-group-checkboxes-button {
    -webkit-margin-start: -8px;
    -moz-margin-start: -8px;
    margin-inline-start:-8px}

devsite-catalog .catalog-checkbox-controls-group>devsite-pagination {
    margin: 0
}

devsite-catalog .catalog-checkbox-controls-group>devsite-pagination .button {
    border: 0;
    -webkit-margin-start: -10px;
    -moz-margin-start: -10px;
    margin-inline-start:-10px}

devsite-catalog .catalog-checkbox-controls-buttons-container {
    display: none
}

devsite-catalog .catalog-checkbox-controls-title {
    border-bottom: var(--devsite-primary-border);
    color: var(--devsite-catalog-title-color);
    font: var(--devsite-catalog-title-font,500 13px/20px var(--devsite-primary-font-family));
    letter-spacing: var(--devsite-catalog-title-letter-spacing,1.5px);
    margin: var(--devsite-catalog-title-margin,0 0 20px);
    padding: var(--devsite-catalog-title-padding,15px 20px 11px);
    text-transform: var(--devsite-catalog-title-text-transform,uppercase)
}

devsite-catalog .catalog-checkbox-controls-subtitle {
    color: var(--devsite-primary-text-color);
    font: var(--devsite-catalog-subtitle-font,16px/24px var(--devsite-headline-font-family));
    padding: var(--devsite-catalog-subtitle-padding)
}

devsite-catalog .catalog-checkbox-container {
    margin: 6px 0
}

devsite-catalog .catalog-checkbox-label {
    color: var(--devsite-catalog-label-color,--devsite-secondary-text-color);
    font: var(--devsite-catalog-label-font,500 14px/20px var(--devsite-primary-font-family))
}

devsite-catalog .catalog-main-filter-controls {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 24px;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

devsite-catalog .catalog-filter-bar-container {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative;
    width: 100%
}

devsite-catalog .catalog-filter-bar-container:before {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    color: var(--devsite-catalog-filter-bar-container-color);
    content: var(--devsite-catalog-filter-bar-container-content);
    position: var(--devsite-catalog-filter-bar-container-position);
    top: var(--devsite-catalog-filter-bar-container-top)
}

[dir=ltr] devsite-catalog .catalog-filter-bar-container:before {
    left: var(--devsite-catalog-filter-bar-container-x-start)
}

[dir=rtl] devsite-catalog .catalog-filter-bar-container:before {
    right: var(--devsite-catalog-filter-bar-container-x-start)
}

devsite-catalog .catalog-filter-bar {
    margin: 0 0 24px;
    max-width: var(--devsite-catalog-filter-bar-max-width,725px);
    min-width: 150px
}

devsite-catalog .catalog-show-sidebar-button {
    display: var(--devsite-catalog-sidebar-button-display);
    margin: var(--devsite-catalog-sidebar-button-margin,0)
}

devsite-catalog .catalog-filter-bar-container+.catalog-show-sidebar-button {
    margin: 4px 0 auto
}

devsite-catalog devsite-pagination {
    margin-top: 20px
}

devsite-catalog devsite-dynamic-content .devsite-dynamic-content-no-results {
    border: 0;
    padding: 0;
    width: auto
}

devsite-catalog devsite-dynamic-content .devsite-dynamic-content-no-results-image {
    width: 425px
}

devsite-catalog[layout=filter-right] {
    --devsite-catalog-grid: "main"/1fr
}

devsite-catalog[layout=filter-right] .catalog-show-sidebar-button {
    display: inline-block
}

devsite-catalog[layout=filter-right] .catalog-main {
    width: 60%;
    margin: 0 auto
}

devsite-catalog[layout=filter-right] .catalog-sidebar {
    border-radius: var(--devsite-catalog-sidebar-border-radius);
    box-shadow: var(--devsite-card-box-shadow);
    height: calc(100vh - var(--devsite-js-header-height, 0) - 4px);
    margin-block:calc(var(--devsite-js-header-height, 0) + 4px) 0;-webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0;position: fixed;
    top: 0;
    -webkit-transition: width .2s;
    transition: width .2s;
    visibility: hidden;
    width: 0;
    z-index: 1007
}

[dir=ltr] devsite-catalog[layout=filter-right] .catalog-sidebar {
    right: 0
}

[dir=rtl] devsite-catalog[layout=filter-right] .catalog-sidebar {
    left: 0
}

devsite-catalog[layout=filter-right] .catalog-sidebar[expanded] {
    visibility: visible;
    width: 340px
}

devsite-catalog[layout=filter-right] .catalog-checkbox-controls-container {
    background: var(--devsite-card-background,var(--devsite-background-1));
    height: 90%;
    overflow-y: scroll
}

devsite-catalog[layout=filter-right] .catalog-checkbox-controls-buttons-container {
    border-top: var(--devsite-primary-border);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-top: auto;
    padding: 15px
}

@media screen and (max-width: 1253px) {
    devsite-catalog .catalog-sidebar {
        border-radius:var(--devsite-catalog-sidebar-border-radius);
        box-shadow: var(--devsite-card-box-shadow);
        height: calc(100vh - var(--devsite-js-header-height, 0) - 4px);
        margin-block:calc(var(--devsite-js-header-height, 0) + 4px) 0;-webkit-margin-end: 0;
        -moz-margin-end: 0;
        margin-inline-end:0;position: fixed;
        top: 0;
        -webkit-transition: width .2s;
        transition: width .2s;
        visibility: hidden;
        width: 0;
        z-index: 1007
    }

    [dir=ltr] devsite-catalog .catalog-sidebar {
        right: 0
    }

    [dir=rtl] devsite-catalog .catalog-sidebar {
        left: 0
    }

    devsite-catalog .catalog-sidebar[expanded] {
        max-width: 90%;
        visibility: visible;
        width: 340px
    }

    devsite-catalog .catalog-sidebar:before {
        background-color: rgba(0,0,0,.4);
        bottom: 0;
        content: "";
        left: 0;
        margin: -200px;
        opacity: 0;
        pointer-events: none;
        position: fixed;
        right: 0;
        -webkit-tap-highlight-color: transparent;
        top: 0;
        -webkit-transition: opacity .2s cubic-bezier(.4,0,.2,1),visibility .2s linear;
        transition: opacity .2s cubic-bezier(.4,0,.2,1),visibility .2s linear;
        visibility: hidden;
        z-index: -1
    }

    devsite-catalog .catalog-sidebar[expanded]:before {
        content: "";
        cursor: pointer;
        opacity: 1;
        pointer-events: auto;
        -webkit-transition: opacity .2s ease;
        transition: opacity .2s ease;
        visibility: visible
    }

    devsite-catalog .catalog-checkbox-controls-title {
        margin-bottom: 10px
    }

    devsite-catalog .catalog-checkbox-controls-buttons-container {
        border-top: var(--devsite-primary-border);
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -moz-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        margin-top: auto;
        padding: 16px 20px
    }

    devsite-catalog .catalog-checkbox-controls-container {
        background: var(--devsite-card-background,var(--devsite-background-1));
        height: 100%;
        overflow-y: scroll
    }

    devsite-catalog .catalog-checkbox-controls-filter-chips-container {
        display: block;
        margin-block:0 2px;margin-inline:16px 12px}

    devsite-catalog .catalog-main {
        width: 100%
    }
}

@-webkit-keyframes skeleton-loader-pulse {
    0% {
        opacity: 1;
        -webkit-animation-timing-function: cubic-bezier(.3,0,.8,.15);
        animation-timing-function: cubic-bezier(.3,0,.8,.15)
    }

    50% {
        opacity: .5;
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear
    }

    to {
        opacity: 1
    }
}

devsite-catalog-body-badges .skeleton-loading {
    background: #e8eaed;
    border-radius: 4px;
    -webkit-animation: skeleton-loader-pulse 1s infinite;
    animation: skeleton-loader-pulse 1s infinite
}

devsite-catalog-body-badges .skeleton-loading:after {
    content: " ";
    display: inline-block;
    width: var(--skeleton-width,auto);
    height: var(--skeleton-height,auto);
    max-width: 80vw
}

devsite-catalog-body-badges .loading {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 36px 0
}

devsite-catalog-body-badges p {
    margin: 0
}

devsite-catalog-body-badges .no-results {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 64px 0;
    gap: 8px;
    opacity: .5
}

devsite-catalog-body-badges .profile-cards-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 22px
}

devsite-catalog-body-badges .profile-cards-controls {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 8px;
    margin-top: 20px
}

@media screen and (max-width: 1253px) {
    devsite-catalog-body-badges .profile-cards-grid {
        grid-template-columns:1fr 1fr
    }
}

@media screen and (max-width: 600px) {
    devsite-catalog-body-badges .profile-cards-grid {
        grid-template-columns:1fr
    }
}

devsite-catalog-body-badges .transparent {
    opacity: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

devsite-catalog-body-badges .profile-card {
    border-radius: 8px;
    border: var(--devsite-primary-border);
    padding: 32px 16px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

devsite-catalog-body-badges .profile-card-image,devsite-catalog-body-badges .profile-card-image-placeholder {
    width: 118px;
    height: 118px;
    min-width: 118px;
    min-height: 118px;
    border-radius: 118px
}

devsite-catalog-body-badges .profile-card-image-placeholder {
    background: var(--devsite-background-5)
}

devsite-catalog-body-badges .profile-card-name {
    font-family: var(--devsite-headline-font-family);
    font-size: 24px;
    line-height: 32px;
    color: var(--devsite-secondary-color);
    margin-top: 20px
}

devsite-catalog-body-badges .profile-card-details,devsite-catalog-body-badges .profile-card-location {
    font-family: var(--devsite-primary-font-family);
    font-size: 16px;
    line-height: 24px
}

devsite-catalog-body-badges .profile-card-location {
    color: #3c4043;
    margin-top: 8px
}

devsite-catalog-body-badges .profile-card-details {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 2px;
    color: var(--devsite-secondary-color);
    margin-top: 8px;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

devsite-catalog-body-badges .profile-card-button {
    margin-top: 20px
}

.devsite-chat-launcher__wrapper {
    display: none;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

body[concierge]:not([concierge=hide]) .devsite-chat-launcher__wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.devsite-chat-launcher__wrapper .devsite-chat-launcher__button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 50%;
    color: var(--devsite-header-icon-color,var(--devsite-secondary-text-rgba));
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0;
    position: relative;
    padding: 0;
    outline: none;
    -webkit-transition: background .15s;
    transition: background .15s;
    width: 40px;
    overflow: hidden;
    z-index: 20
}

.devsite-chat-launcher__wrapper .devsite-chat-launcher__button:before {
    content: "";
    -webkit-clip-path: shape(evenodd from 50% 24.787%,curve by 7.143% 18.016% with 0 0/2.9725% 13.814%,curve by 17.882% 7.197% with 4.171% 4.2025%/17.882% 7.197%,curve by -17.882% 8.6765% with 0 0/-13.711% 4.474%,curve by -7.143% 16.5365% with -4.1705% 4.202%/-7.143% 16.5365%,curve by -8.6115% -16.5365% with 0 0/-4.441% -12.3345%,curve by -16.4135% -8.6765% with -4.171% -4.2025%/-16.4135% -8.6765%,curve by 16.4135% -7.197% with 0 0/12.2425% -2.9945%,curve by 8.6115% -18.016% with 4.1705% -4.202%/8.6115% -18.016%,close);
    clip-path: shape(evenodd from 50% 24.787%,curve by 7.143% 18.016% with 0 0/2.9725% 13.814%,curve by 17.882% 7.197% with 4.171% 4.2025%/17.882% 7.197%,curve by -17.882% 8.6765% with 0 0/-13.711% 4.474%,curve by -7.143% 16.5365% with -4.1705% 4.202%/-7.143% 16.5365%,curve by -8.6115% -16.5365% with 0 0/-4.441% -12.3345%,curve by -16.4135% -8.6765% with -4.171% -4.2025%/-16.4135% -8.6765%,curve by 16.4135% -7.197% with 0 0/12.2425% -2.9945%,curve by 8.6115% -18.016% with 4.1705% -4.202%/8.6115% -18.016%,close);
    width: 40px;
    height: 40px;
    position: absolute;
    background-color: currentColor;
    z-index: 2;
    -webkit-transition: opacity .5s ease,background-color .5s ease,-webkit-transform .5s ease-in-out;
    transition: opacity .5s ease,background-color .5s ease,-webkit-transform .5s ease-in-out;
    transition: transform .5s ease-in-out,opacity .5s ease,background-color .5s ease;
    transition: transform .5s ease-in-out,opacity .5s ease,background-color .5s ease,-webkit-transform .5s ease-in-out
}

.devsite-chat-launcher__wrapper .devsite-chat-launcher__button .gemini-morph-element {
    width: 100%;
    height: 100%;
    scale: 0;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    -webkit-clip-path: shape(evenodd from 13.482% 79.505%,curve by -7.1945% -12.47% with -1.4985% -1.8575%/-6.328% -10.225%,curve by .0985% -33.8965% with -4.1645% -10.7945%/-4.1685% -23.0235%,curve by 6.9955% -12.101% with 1.72% -4.3825%/4.0845% -8.458%,curve by 30.125% -17.119% with 7.339% -9.1825%/18.4775% -15.5135%,curve by 13.4165% .095% with 4.432% -.6105%/8.9505% -.5855%,curve by 29.364% 16.9% with 11.6215% 1.77%/22.102% 7.9015%,curve by 7.176% 12.4145% with 3.002% 3.7195%/5.453% 7.968%,curve by -.0475% 33.8925% with 4.168% 10.756%/4.2305% 22.942%,curve by -7.1135% 12.2825% with -1.74% 4.4535%/-4.1455% 8.592%,curve by -29.404% 16.9075% with -7.202% 8.954%/-18.019% 15.137%,curve by -14.19% -.018% with -4.6635% .7255%/-9.4575% .7205%,curve by -29.226% -16.8875% with -11.573% -1.8065%/-21.9955% -7.9235%,close);
    clip-path: shape(evenodd from 13.482% 79.505%,curve by -7.1945% -12.47% with -1.4985% -1.8575%/-6.328% -10.225%,curve by .0985% -33.8965% with -4.1645% -10.7945%/-4.1685% -23.0235%,curve by 6.9955% -12.101% with 1.72% -4.3825%/4.0845% -8.458%,curve by 30.125% -17.119% with 7.339% -9.1825%/18.4775% -15.5135%,curve by 13.4165% .095% with 4.432% -.6105%/8.9505% -.5855%,curve by 29.364% 16.9% with 11.6215% 1.77%/22.102% 7.9015%,curve by 7.176% 12.4145% with 3.002% 3.7195%/5.453% 7.968%,curve by -.0475% 33.8925% with 4.168% 10.756%/4.2305% 22.942%,curve by -7.1135% 12.2825% with -1.74% 4.4535%/-4.1455% 8.592%,curve by -29.404% 16.9075% with -7.202% 8.954%/-18.019% 15.137%,curve by -14.19% -.018% with -4.6635% .7255%/-9.4575% .7205%,curve by -29.226% -16.8875% with -11.573% -1.8065%/-21.9955% -7.9235%,close);
    position: absolute
}

.devsite-chat-launcher__wrapper .devsite-chat-launcher__button .gemini-morph-element:after {
    content: "";
    background: -webkit-linear-gradient(315deg,var(--devsite-ref-palette--ai-blue),var(--devsite-gm3-ref-palette--purple60),var(--devsite-ref-palette--ai-blue),var(--devsite-gm3-ref-palette--purple60));
    background: linear-gradient(135deg,var(--devsite-ref-palette--ai-blue),var(--devsite-gm3-ref-palette--purple60),var(--devsite-ref-palette--ai-blue),var(--devsite-gm3-ref-palette--purple60));
    width: 400%;
    height: 400%;
    position: absolute;
    top: 0;
    left: 0
}

.devsite-chat-launcher__wrapper .devsite-chat-launcher__button:active,.devsite-chat-launcher__wrapper .devsite-chat-launcher__button:focus,.devsite-chat-launcher__wrapper .devsite-chat-launcher__button:hover {
    background: transparent
}

.devsite-chat-launcher__wrapper .devsite-chat-launcher__button:active:before,.devsite-chat-launcher__wrapper .devsite-chat-launcher__button:focus:before,.devsite-chat-launcher__wrapper .devsite-chat-launcher__button:hover:before {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    background-color: var(--devsite-sys-color--surface)
}

.devsite-chat-launcher__wrapper .devsite-chat-launcher__button:active .gemini-morph-element,.devsite-chat-launcher__wrapper .devsite-chat-launcher__button:focus .gemini-morph-element,.devsite-chat-launcher__wrapper .devsite-chat-launcher__button:hover .gemini-morph-element {
    scale: 1;
    opacity: 1;
    -webkit-animation: shapeshift 4s ease-in-out infinite forwards;
    animation: shapeshift 4s ease-in-out infinite forwards
}

.devsite-chat-launcher__wrapper .devsite-chat-launcher__button:active .gemini-morph-element:after,.devsite-chat-launcher__wrapper .devsite-chat-launcher__button:focus .gemini-morph-element:after,.devsite-chat-launcher__wrapper .devsite-chat-launcher__button:hover .gemini-morph-element:after {
    -webkit-animation: gradientMove 3s ease-in-out infinite alternate;
    animation: gradientMove 3s ease-in-out infinite alternate
}

@-webkit-keyframes shapeshift {
    0% {
        -webkit-clip-path: shape(evenodd from 13.482% 79.505%,curve by -7.1945% -12.47% with -1.4985% -1.8575%/-6.328% -10.225%,curve by .0985% -33.8965% with -4.1645% -10.7945%/-4.1685% -23.0235%,curve by 6.9955% -12.101% with 1.72% -4.3825%/4.0845% -8.458%,curve by 30.125% -17.119% with 7.339% -9.1825%/18.4775% -15.5135%,curve by 13.4165% .095% with 4.432% -.6105%/8.9505% -.5855%,curve by 29.364% 16.9% with 11.6215% 1.77%/22.102% 7.9015%,curve by 7.176% 12.4145% with 3.002% 3.7195%/5.453% 7.968%,curve by -.0475% 33.8925% with 4.168% 10.756%/4.2305% 22.942%,curve by -7.1135% 12.2825% with -1.74% 4.4535%/-4.1455% 8.592%,curve by -29.404% 16.9075% with -7.202% 8.954%/-18.019% 15.137%,curve by -14.19% -.018% with -4.6635% .7255%/-9.4575% .7205%,curve by -29.226% -16.8875% with -11.573% -1.8065%/-21.9955% -7.9235%,close);
        clip-path: shape(evenodd from 13.482% 79.505%,curve by -7.1945% -12.47% with -1.4985% -1.8575%/-6.328% -10.225%,curve by .0985% -33.8965% with -4.1645% -10.7945%/-4.1685% -23.0235%,curve by 6.9955% -12.101% with 1.72% -4.3825%/4.0845% -8.458%,curve by 30.125% -17.119% with 7.339% -9.1825%/18.4775% -15.5135%,curve by 13.4165% .095% with 4.432% -.6105%/8.9505% -.5855%,curve by 29.364% 16.9% with 11.6215% 1.77%/22.102% 7.9015%,curve by 7.176% 12.4145% with 3.002% 3.7195%/5.453% 7.968%,curve by -.0475% 33.8925% with 4.168% 10.756%/4.2305% 22.942%,curve by -7.1135% 12.2825% with -1.74% 4.4535%/-4.1455% 8.592%,curve by -29.404% 16.9075% with -7.202% 8.954%/-18.019% 15.137%,curve by -14.19% -.018% with -4.6635% .7255%/-9.4575% .7205%,curve by -29.226% -16.8875% with -11.573% -1.8065%/-21.9955% -7.9235%,close);
        rotate: 0turn
    }

    25% {
        -webkit-clip-path: shape(evenodd from 17.9665% 82.0335%,curve by -12.349% -32.0335% with -13.239% -5.129%/-18.021% -15.402%,curve by -.0275% -22.203% with -3.1825% -9.331%/-3.074% -16.6605%,curve by 12.3765% -9.8305% with 2.3835% -4.3365%/6.565% -7.579%,curve by 32.0335% -12.349% with 5.129% -13.239%/15.402% -18.021%,curve by 20.4535% -.8665% with 8.3805% -2.858%/15.1465% -3.062%,curve by 11.58% 13.2155% with 5.225% 2.161%/9.0355% 6.6475%,curve by 12.349% 32.0335% with 13.239% 5.129%/18.021% 15.402%,curve by .5715% 21.1275% with 2.9805% 8.7395%/3.0745% 15.723%,curve by -12.9205% 10.906% with -2.26% 4.88%/-6.638% 8.472%,curve by -32.0335% 12.349% with -5.129% 13.239%/-15.402% 18.021%,curve by -21.1215% .5745% with -8.736% 2.9795%/-15.718% 3.0745%,curve by -10.912% -12.9235% with -4.883% -2.2595%/-8.477% -6.6385%,close);
        clip-path: shape(evenodd from 17.9665% 82.0335%,curve by -12.349% -32.0335% with -13.239% -5.129%/-18.021% -15.402%,curve by -.0275% -22.203% with -3.1825% -9.331%/-3.074% -16.6605%,curve by 12.3765% -9.8305% with 2.3835% -4.3365%/6.565% -7.579%,curve by 32.0335% -12.349% with 5.129% -13.239%/15.402% -18.021%,curve by 20.4535% -.8665% with 8.3805% -2.858%/15.1465% -3.062%,curve by 11.58% 13.2155% with 5.225% 2.161%/9.0355% 6.6475%,curve by 12.349% 32.0335% with 13.239% 5.129%/18.021% 15.402%,curve by .5715% 21.1275% with 2.9805% 8.7395%/3.0745% 15.723%,curve by -12.9205% 10.906% with -2.26% 4.88%/-6.638% 8.472%,curve by -32.0335% 12.349% with -5.129% 13.239%/-15.402% 18.021%,curve by -21.1215% .5745% with -8.736% 2.9795%/-15.718% 3.0745%,curve by -10.912% -12.9235% with -4.883% -2.2595%/-8.477% -6.6385%,close)
    }

    50% {
        -webkit-clip-path: shape(evenodd from 10.5845% 59.7305%,curve by 0 -19.461% with -.113% -1.7525%/-.11% -18.14%,curve by 10.098% -26.213% with .837% -10.0375%/3.821% -19.2625%,curve by 29.3175% -13.0215% with 7.2175% -7.992%/17.682% -13.0215%,curve by 19.5845% 5.185% with 7.1265% 0/13.8135% 1.887%,curve by 9.8595% 7.9775% with 3.7065% 2.1185%/7.035% 4.8195%,curve by 9.9715% 26.072% with 6.2015% 6.933%/9.4345% 16.082%,curve by 0 19.461% with .074% 1.384%/.0745% 17.7715%,curve by -13.0065% 29.1155% with -.511% 11.5345%/-5.021% 21.933%,curve by -26.409% 10.119% with -6.991% 6.288%/-16.254% 10.119%,curve by -20.945% -5.9995% with -7.6935% 0/-14.8755% -2.199%,curve by -8.713% -7.404% with -3.255% -2.0385%/-6.1905% -4.537%,curve by -9.7575% -25.831% with -6.074% -6.9035%/-9.1205% -15.963%,close);
        clip-path: shape(evenodd from 10.5845% 59.7305%,curve by 0 -19.461% with -.113% -1.7525%/-.11% -18.14%,curve by 10.098% -26.213% with .837% -10.0375%/3.821% -19.2625%,curve by 29.3175% -13.0215% with 7.2175% -7.992%/17.682% -13.0215%,curve by 19.5845% 5.185% with 7.1265% 0/13.8135% 1.887%,curve by 9.8595% 7.9775% with 3.7065% 2.1185%/7.035% 4.8195%,curve by 9.9715% 26.072% with 6.2015% 6.933%/9.4345% 16.082%,curve by 0 19.461% with .074% 1.384%/.0745% 17.7715%,curve by -13.0065% 29.1155% with -.511% 11.5345%/-5.021% 21.933%,curve by -26.409% 10.119% with -6.991% 6.288%/-16.254% 10.119%,curve by -20.945% -5.9995% with -7.6935% 0/-14.8755% -2.199%,curve by -8.713% -7.404% with -3.255% -2.0385%/-6.1905% -4.537%,curve by -9.7575% -25.831% with -6.074% -6.9035%/-9.1205% -15.963%,close)
    }

    75% {
        -webkit-clip-path: shape(evenodd from 6.47% 67.001%,curve by 0 -34.002% with -1.1735% -7.7%/-1.1735% -26.302%,curve by 7.0415% -12.1965% with .7075% -4.641%/3.3765% -9.2635%,curve by 29.447% -17.001% with 6.0815% -4.8665%/22.192% -14.1675%,curve by 14.083% 0 with 4.3725% -1.708%/9.7105% -1.708%,curve by 29.447% 17.001% with 7.255% 2.8335%/23.3655% 12.1345%,curve by 7.0415% 12.1965% with 3.665% 2.933%/6.334% 7.5555%,curve by 0 34.002% with 1.1735% 7.7%/1.1735% 26.302%,curve by -7.0415% 12.1965% with -.7075% 4.641%/-3.3765% 9.2635%,curve by -29.447% 17.001% with -6.0815% 4.8665%/-22.192% 14.1675%,curve by -14.083% 0 with -4.3725% 1.708%/-9.7105% 1.708%,curve by -29.447% -17.001% with -7.255% -2.8335%/-23.3655% -12.1345%,curve by -7.0415% -12.1965% with -3.665% -2.933%/-6.334% -7.5555%,close);
        clip-path: shape(evenodd from 6.47% 67.001%,curve by 0 -34.002% with -1.1735% -7.7%/-1.1735% -26.302%,curve by 7.0415% -12.1965% with .7075% -4.641%/3.3765% -9.2635%,curve by 29.447% -17.001% with 6.0815% -4.8665%/22.192% -14.1675%,curve by 14.083% 0 with 4.3725% -1.708%/9.7105% -1.708%,curve by 29.447% 17.001% with 7.255% 2.8335%/23.3655% 12.1345%,curve by 7.0415% 12.1965% with 3.665% 2.933%/6.334% 7.5555%,curve by 0 34.002% with 1.1735% 7.7%/1.1735% 26.302%,curve by -7.0415% 12.1965% with -.7075% 4.641%/-3.3765% 9.2635%,curve by -29.447% 17.001% with -6.0815% 4.8665%/-22.192% 14.1675%,curve by -14.083% 0 with -4.3725% 1.708%/-9.7105% 1.708%,curve by -29.447% -17.001% with -7.255% -2.8335%/-23.3655% -12.1345%,curve by -7.0415% -12.1965% with -3.665% -2.933%/-6.334% -7.5555%,close)
    }

    to {
        -webkit-clip-path: shape(evenodd from 13.482% 79.505%,curve by -7.1945% -12.47% with -1.4985% -1.8575%/-6.328% -10.225%,curve by .0985% -33.8965% with -4.1645% -10.7945%/-4.1685% -23.0235%,curve by 6.9955% -12.101% with 1.72% -4.3825%/4.0845% -8.458%,curve by 30.125% -17.119% with 7.339% -9.1825%/18.4775% -15.5135%,curve by 13.4165% .095% with 4.432% -.6105%/8.9505% -.5855%,curve by 29.364% 16.9% with 11.6215% 1.77%/22.102% 7.9015%,curve by 7.176% 12.4145% with 3.002% 3.7195%/5.453% 7.968%,curve by -.0475% 33.8925% with 4.168% 10.756%/4.2305% 22.942%,curve by -7.1135% 12.2825% with -1.74% 4.4535%/-4.1455% 8.592%,curve by -29.404% 16.9075% with -7.202% 8.954%/-18.019% 15.137%,curve by -14.19% -.018% with -4.6635% .7255%/-9.4575% .7205%,curve by -29.226% -16.8875% with -11.573% -1.8065%/-21.9955% -7.9235%,close);
        clip-path: shape(evenodd from 13.482% 79.505%,curve by -7.1945% -12.47% with -1.4985% -1.8575%/-6.328% -10.225%,curve by .0985% -33.8965% with -4.1645% -10.7945%/-4.1685% -23.0235%,curve by 6.9955% -12.101% with 1.72% -4.3825%/4.0845% -8.458%,curve by 30.125% -17.119% with 7.339% -9.1825%/18.4775% -15.5135%,curve by 13.4165% .095% with 4.432% -.6105%/8.9505% -.5855%,curve by 29.364% 16.9% with 11.6215% 1.77%/22.102% 7.9015%,curve by 7.176% 12.4145% with 3.002% 3.7195%/5.453% 7.968%,curve by -.0475% 33.8925% with 4.168% 10.756%/4.2305% 22.942%,curve by -7.1135% 12.2825% with -1.74% 4.4535%/-4.1455% 8.592%,curve by -29.404% 16.9075% with -7.202% 8.954%/-18.019% 15.137%,curve by -14.19% -.018% with -4.6635% .7255%/-9.4575% .7205%,curve by -29.226% -16.8875% with -11.573% -1.8065%/-21.9955% -7.9235%,close);
        rotate: 1turn
    }
}

@keyframes shapeshift {
    0% {
        -webkit-clip-path: shape(evenodd from 13.482% 79.505%,curve by -7.1945% -12.47% with -1.4985% -1.8575%/-6.328% -10.225%,curve by .0985% -33.8965% with -4.1645% -10.7945%/-4.1685% -23.0235%,curve by 6.9955% -12.101% with 1.72% -4.3825%/4.0845% -8.458%,curve by 30.125% -17.119% with 7.339% -9.1825%/18.4775% -15.5135%,curve by 13.4165% .095% with 4.432% -.6105%/8.9505% -.5855%,curve by 29.364% 16.9% with 11.6215% 1.77%/22.102% 7.9015%,curve by 7.176% 12.4145% with 3.002% 3.7195%/5.453% 7.968%,curve by -.0475% 33.8925% with 4.168% 10.756%/4.2305% 22.942%,curve by -7.1135% 12.2825% with -1.74% 4.4535%/-4.1455% 8.592%,curve by -29.404% 16.9075% with -7.202% 8.954%/-18.019% 15.137%,curve by -14.19% -.018% with -4.6635% .7255%/-9.4575% .7205%,curve by -29.226% -16.8875% with -11.573% -1.8065%/-21.9955% -7.9235%,close);
        clip-path: shape(evenodd from 13.482% 79.505%,curve by -7.1945% -12.47% with -1.4985% -1.8575%/-6.328% -10.225%,curve by .0985% -33.8965% with -4.1645% -10.7945%/-4.1685% -23.0235%,curve by 6.9955% -12.101% with 1.72% -4.3825%/4.0845% -8.458%,curve by 30.125% -17.119% with 7.339% -9.1825%/18.4775% -15.5135%,curve by 13.4165% .095% with 4.432% -.6105%/8.9505% -.5855%,curve by 29.364% 16.9% with 11.6215% 1.77%/22.102% 7.9015%,curve by 7.176% 12.4145% with 3.002% 3.7195%/5.453% 7.968%,curve by -.0475% 33.8925% with 4.168% 10.756%/4.2305% 22.942%,curve by -7.1135% 12.2825% with -1.74% 4.4535%/-4.1455% 8.592%,curve by -29.404% 16.9075% with -7.202% 8.954%/-18.019% 15.137%,curve by -14.19% -.018% with -4.6635% .7255%/-9.4575% .7205%,curve by -29.226% -16.8875% with -11.573% -1.8065%/-21.9955% -7.9235%,close);
        rotate: 0turn
    }

    25% {
        -webkit-clip-path: shape(evenodd from 17.9665% 82.0335%,curve by -12.349% -32.0335% with -13.239% -5.129%/-18.021% -15.402%,curve by -.0275% -22.203% with -3.1825% -9.331%/-3.074% -16.6605%,curve by 12.3765% -9.8305% with 2.3835% -4.3365%/6.565% -7.579%,curve by 32.0335% -12.349% with 5.129% -13.239%/15.402% -18.021%,curve by 20.4535% -.8665% with 8.3805% -2.858%/15.1465% -3.062%,curve by 11.58% 13.2155% with 5.225% 2.161%/9.0355% 6.6475%,curve by 12.349% 32.0335% with 13.239% 5.129%/18.021% 15.402%,curve by .5715% 21.1275% with 2.9805% 8.7395%/3.0745% 15.723%,curve by -12.9205% 10.906% with -2.26% 4.88%/-6.638% 8.472%,curve by -32.0335% 12.349% with -5.129% 13.239%/-15.402% 18.021%,curve by -21.1215% .5745% with -8.736% 2.9795%/-15.718% 3.0745%,curve by -10.912% -12.9235% with -4.883% -2.2595%/-8.477% -6.6385%,close);
        clip-path: shape(evenodd from 17.9665% 82.0335%,curve by -12.349% -32.0335% with -13.239% -5.129%/-18.021% -15.402%,curve by -.0275% -22.203% with -3.1825% -9.331%/-3.074% -16.6605%,curve by 12.3765% -9.8305% with 2.3835% -4.3365%/6.565% -7.579%,curve by 32.0335% -12.349% with 5.129% -13.239%/15.402% -18.021%,curve by 20.4535% -.8665% with 8.3805% -2.858%/15.1465% -3.062%,curve by 11.58% 13.2155% with 5.225% 2.161%/9.0355% 6.6475%,curve by 12.349% 32.0335% with 13.239% 5.129%/18.021% 15.402%,curve by .5715% 21.1275% with 2.9805% 8.7395%/3.0745% 15.723%,curve by -12.9205% 10.906% with -2.26% 4.88%/-6.638% 8.472%,curve by -32.0335% 12.349% with -5.129% 13.239%/-15.402% 18.021%,curve by -21.1215% .5745% with -8.736% 2.9795%/-15.718% 3.0745%,curve by -10.912% -12.9235% with -4.883% -2.2595%/-8.477% -6.6385%,close)
    }

    50% {
        -webkit-clip-path: shape(evenodd from 10.5845% 59.7305%,curve by 0 -19.461% with -.113% -1.7525%/-.11% -18.14%,curve by 10.098% -26.213% with .837% -10.0375%/3.821% -19.2625%,curve by 29.3175% -13.0215% with 7.2175% -7.992%/17.682% -13.0215%,curve by 19.5845% 5.185% with 7.1265% 0/13.8135% 1.887%,curve by 9.8595% 7.9775% with 3.7065% 2.1185%/7.035% 4.8195%,curve by 9.9715% 26.072% with 6.2015% 6.933%/9.4345% 16.082%,curve by 0 19.461% with .074% 1.384%/.0745% 17.7715%,curve by -13.0065% 29.1155% with -.511% 11.5345%/-5.021% 21.933%,curve by -26.409% 10.119% with -6.991% 6.288%/-16.254% 10.119%,curve by -20.945% -5.9995% with -7.6935% 0/-14.8755% -2.199%,curve by -8.713% -7.404% with -3.255% -2.0385%/-6.1905% -4.537%,curve by -9.7575% -25.831% with -6.074% -6.9035%/-9.1205% -15.963%,close);
        clip-path: shape(evenodd from 10.5845% 59.7305%,curve by 0 -19.461% with -.113% -1.7525%/-.11% -18.14%,curve by 10.098% -26.213% with .837% -10.0375%/3.821% -19.2625%,curve by 29.3175% -13.0215% with 7.2175% -7.992%/17.682% -13.0215%,curve by 19.5845% 5.185% with 7.1265% 0/13.8135% 1.887%,curve by 9.8595% 7.9775% with 3.7065% 2.1185%/7.035% 4.8195%,curve by 9.9715% 26.072% with 6.2015% 6.933%/9.4345% 16.082%,curve by 0 19.461% with .074% 1.384%/.0745% 17.7715%,curve by -13.0065% 29.1155% with -.511% 11.5345%/-5.021% 21.933%,curve by -26.409% 10.119% with -6.991% 6.288%/-16.254% 10.119%,curve by -20.945% -5.9995% with -7.6935% 0/-14.8755% -2.199%,curve by -8.713% -7.404% with -3.255% -2.0385%/-6.1905% -4.537%,curve by -9.7575% -25.831% with -6.074% -6.9035%/-9.1205% -15.963%,close)
    }

    75% {
        -webkit-clip-path: shape(evenodd from 6.47% 67.001%,curve by 0 -34.002% with -1.1735% -7.7%/-1.1735% -26.302%,curve by 7.0415% -12.1965% with .7075% -4.641%/3.3765% -9.2635%,curve by 29.447% -17.001% with 6.0815% -4.8665%/22.192% -14.1675%,curve by 14.083% 0 with 4.3725% -1.708%/9.7105% -1.708%,curve by 29.447% 17.001% with 7.255% 2.8335%/23.3655% 12.1345%,curve by 7.0415% 12.1965% with 3.665% 2.933%/6.334% 7.5555%,curve by 0 34.002% with 1.1735% 7.7%/1.1735% 26.302%,curve by -7.0415% 12.1965% with -.7075% 4.641%/-3.3765% 9.2635%,curve by -29.447% 17.001% with -6.0815% 4.8665%/-22.192% 14.1675%,curve by -14.083% 0 with -4.3725% 1.708%/-9.7105% 1.708%,curve by -29.447% -17.001% with -7.255% -2.8335%/-23.3655% -12.1345%,curve by -7.0415% -12.1965% with -3.665% -2.933%/-6.334% -7.5555%,close);
        clip-path: shape(evenodd from 6.47% 67.001%,curve by 0 -34.002% with -1.1735% -7.7%/-1.1735% -26.302%,curve by 7.0415% -12.1965% with .7075% -4.641%/3.3765% -9.2635%,curve by 29.447% -17.001% with 6.0815% -4.8665%/22.192% -14.1675%,curve by 14.083% 0 with 4.3725% -1.708%/9.7105% -1.708%,curve by 29.447% 17.001% with 7.255% 2.8335%/23.3655% 12.1345%,curve by 7.0415% 12.1965% with 3.665% 2.933%/6.334% 7.5555%,curve by 0 34.002% with 1.1735% 7.7%/1.1735% 26.302%,curve by -7.0415% 12.1965% with -.7075% 4.641%/-3.3765% 9.2635%,curve by -29.447% 17.001% with -6.0815% 4.8665%/-22.192% 14.1675%,curve by -14.083% 0 with -4.3725% 1.708%/-9.7105% 1.708%,curve by -29.447% -17.001% with -7.255% -2.8335%/-23.3655% -12.1345%,curve by -7.0415% -12.1965% with -3.665% -2.933%/-6.334% -7.5555%,close)
    }

    to {
        -webkit-clip-path: shape(evenodd from 13.482% 79.505%,curve by -7.1945% -12.47% with -1.4985% -1.8575%/-6.328% -10.225%,curve by .0985% -33.8965% with -4.1645% -10.7945%/-4.1685% -23.0235%,curve by 6.9955% -12.101% with 1.72% -4.3825%/4.0845% -8.458%,curve by 30.125% -17.119% with 7.339% -9.1825%/18.4775% -15.5135%,curve by 13.4165% .095% with 4.432% -.6105%/8.9505% -.5855%,curve by 29.364% 16.9% with 11.6215% 1.77%/22.102% 7.9015%,curve by 7.176% 12.4145% with 3.002% 3.7195%/5.453% 7.968%,curve by -.0475% 33.8925% with 4.168% 10.756%/4.2305% 22.942%,curve by -7.1135% 12.2825% with -1.74% 4.4535%/-4.1455% 8.592%,curve by -29.404% 16.9075% with -7.202% 8.954%/-18.019% 15.137%,curve by -14.19% -.018% with -4.6635% .7255%/-9.4575% .7205%,curve by -29.226% -16.8875% with -11.573% -1.8065%/-21.9955% -7.9235%,close);
        clip-path: shape(evenodd from 13.482% 79.505%,curve by -7.1945% -12.47% with -1.4985% -1.8575%/-6.328% -10.225%,curve by .0985% -33.8965% with -4.1645% -10.7945%/-4.1685% -23.0235%,curve by 6.9955% -12.101% with 1.72% -4.3825%/4.0845% -8.458%,curve by 30.125% -17.119% with 7.339% -9.1825%/18.4775% -15.5135%,curve by 13.4165% .095% with 4.432% -.6105%/8.9505% -.5855%,curve by 29.364% 16.9% with 11.6215% 1.77%/22.102% 7.9015%,curve by 7.176% 12.4145% with 3.002% 3.7195%/5.453% 7.968%,curve by -.0475% 33.8925% with 4.168% 10.756%/4.2305% 22.942%,curve by -7.1135% 12.2825% with -1.74% 4.4535%/-4.1455% 8.592%,curve by -29.404% 16.9075% with -7.202% 8.954%/-18.019% 15.137%,curve by -14.19% -.018% with -4.6635% .7255%/-9.4575% .7205%,curve by -29.226% -16.8875% with -11.573% -1.8065%/-21.9955% -7.9235%,close);
        rotate: 1turn
    }
}

@-webkit-keyframes gradientMove {
    0% {
        -webkit-transform: translate(0);
        transform: translate(0)
    }

    to {
        -webkit-transform: translate(-75%,-75%);
        transform: translate(-75%,-75%)
    }
}

@keyframes gradientMove {
    0% {
        -webkit-transform: translate(0);
        transform: translate(0)
    }

    to {
        -webkit-transform: translate(-75%,-75%);
        transform: translate(-75%,-75%)
    }
}

devsite-checkbox:not([rendered]) {
    background: 0;
    visibility: hidden
}

devsite-checkbox[rendered] {
    visibility: visible
}

devsite-chip {
    position: relative
}

devsite-chip .devsite-chip-button {
    --devsite-button-box-shadow: none;
    --devsite-button-border-radius: 8px;
    --devsite-button-font: 400 14px/20px var(--devsite-headline-font-family);
    --devsite-button-letter-spacing: 0.25px;
    --devsite-button-padding: 6px 0;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-transition: background-color .2s,color .2s,box-shadow .2s,border-color .2s;
    transition: background-color .2s,color .2s,box-shadow .2s,border-color .2s
}

devsite-chip .devsite-chip-button:active,devsite-chip .devsite-chip-button:focus,devsite-chip .devsite-chip-button:hover {
    font-weight: 400
}

devsite-chip .devsite-chip-unselected {
    --devsite-button-background: #fff;
    --devsite-button-border: var(--devsite-primary-border);
    --devsite-button-color: var(--devsite-secondary-text-color);
    --devsite-button-background-hover: rgba(60,64,67,.04)
}

devsite-chip .devsite-chip-unselected:hover {
    color: var(--devsite-primary-text-color);
    border: 1px solid #dadce0
}

devsite-chip .devsite-chip-unselected:active {
    background-color: #e8eaed;
    color: #202124;
    box-shadow: none
}

.color-scheme--dark devsite-chip .devsite-chip-button {
    --devsite-button-background: transparent;
    color: #9aa0a6;
    border-color: #5f6368
}

.color-scheme--dark devsite-chip .devsite-chip-button:active,.color-scheme--dark devsite-chip .devsite-chip-button:focus,.color-scheme--dark devsite-chip .devsite-chip-button:hover {
    color: #e8eaed
}

.color-scheme--dark devsite-chip .devsite-chip-button:active,.color-scheme--dark devsite-chip .devsite-chip-button:focus {
    background-color: color-mix(in srgb,#fff 12%,#202124 100%)
}

.color-scheme--dark devsite-chip .devsite-chip-button:hover {
    background-color: color-mix(in srgb,#fff 8%,#202124 100%)
}

.color-scheme--dark devsite-chip .devsite-chip-button:disabled {
    color: color-mix(in srgb,#e8eaed 38%,transparent);
    border-color: color-mix(in srgb,#e8eaed 12%,transparent)
}

devsite-chip .devsite-chip-pad-left {
    padding-left: 16px
}

devsite-chip .devsite-chip-pad-right {
    padding-right: 16px
}

devsite-chip .devsite-chip-right-action-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 4px
}

devsite-chip .devsite-chip-right-action {
    -webkit-align-self: end;
    -ms-flex-item-align: end;
    align-self: end;
    border-radius: 50%;
    padding: 4px
}

devsite-chip .devsite-chip-right-action:hover {
    background-color: var(--devsite-background-4);
    cursor: pointer
}

.color-scheme--dark devsite-chip .devsite-chip-right-action:hover {
    background-color: color-mix(in srgb,#e8eaed 24%,transparent)
}

devsite-chip .devsite-chip-selected .devsite-chip-right-action:hover {
    background-color: #d2e3fc
}

devsite-chip .devsite-chip-selected {
    background-color: #e8f0fe;
    box-shadow: none;
    border-color: transparent;
    color: #1967d2
}

devsite-chip .devsite-chip-selected:hover {
    box-shadow: 0 1px 2px rgba(60,64,67,.3),0 1px 3px 1px rgba(60,64,67,.15);
    background-color: #e8f0fe;
    color: #174ea6
}

devsite-chip .devsite-chip-selected:focus {
    background-color: #e8f0fe;
    color: #174ea6
}

devsite-chip .devsite-chip-selected:active {
    background-color: #d2e3fc;
    color: #174ea6
}

devsite-chip .devsite-chip-selected:disabled {
    background-color: #e8eaed;
    color: #9aa0a6
}

.color-scheme--dark devsite-chip .devsite-chip-selected {
    background-color: color-mix(in srgb,#d2e3fc 28%,#202124 100%);
    box-shadow: none;
    border-color: transparent;
    color: #d2e3fc
}

.color-scheme--dark devsite-chip .devsite-chip-selected:hover {
    box-shadow: 0 1px 2px rgba(60,64,67,.3),0 1px 3px 1px rgba(60,64,67,.15);
    background-color: color-mix(in srgb,#d2e3fc 40%,#202124 100%);
    color: #fff
}

.color-scheme--dark devsite-chip .devsite-chip-selected:active,.color-scheme--dark devsite-chip .devsite-chip-selected:focus {
    background-color: color-mix(in srgb,#d2e3fc 70%,#202124 100%);
    color: #fff
}

.color-scheme--dark devsite-chip .devsite-chip-selected:disabled {
    background-color: color-mix(in srgb,#e8eaed 12%,transparent);
    color: color-mix(in srgb,#e8eaed 38%,transparent)
}

.color-scheme--dark devsite-chip .devsite-chip-selected .devsite-chip-right-action:hover {
    background-color: color-mix(in srgb,#d2e3fc 70%,#202124 100%)
}

devsite-chip .devsite-chip-dropdown-popout {
    border-radius: 6px;
    background-color: #fff;
    position: absolute;
    min-width: 100%;
    font-size: 14px;
    z-index: 10;
    box-shadow: 0 1px 1px rgba(60,64,67,.3),0 1px 2px 1px rgba(60,64,67,.15)
}

devsite-chip .devsite-chip-dropdown-title {
    display: inline-block;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    font-weight: 500;
    padding: 8px 16px
}

.color-scheme--dark devsite-chip .devsite-chip-dropdown-popout {
    border-radius: 6px;
    color: #e8eaed;
    background: var(--devsite-background-1);
    box-shadow: 0 1px 2px color-mix(in srgb,var(--devsite-elevation-key-shadow-color),rgba(60,64,67,.3)),0 2px 6px 2px color-mix(in srgb,var(--devsite-elevation-ambient-shadow-color),rgba(60,64,67,.15))
}

.color-scheme--dark devsite-chip .devsite-chip-dropdown-menuitem {
    color: #e8eaed
}

.color-scheme--dark devsite-chip .devsite-chip-dropdown-menuitem:hover {
    color: #e8eaed;
    background-color: color-mix(in srgb,#d2e3fc 40%,#202124 100%)
}

devsite-chip .devsite-chip-dropdown-list {
    list-style-type: none;
    padding: 0
}

devsite-chip .devsite-chip-dropdown-menuitem {
    min-width: -webkit-max-content;
    min-width: -moz-max-content;
    min-width: max-content;
    width: 100%;
    color: #5f6368;
    padding: 8px 16px;
    margin: 0;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-chip .devsite-chip-dropdown-menuitem:hover {
    background-color: rgba(60,64,67,.04);
    color: #202124
}

devsite-chip .material-icons {
    top: 0
}

devsite-chip .devsite-chip-dropdown-menuitem .material-icons {
    font-size: 20px;
    padding-right: 10px
}

devsite-code {
    border: var(--devsite-code-border,0);
    border-radius: var(--devsite-code-border-radius,0);
    clear: both;
    direction: ltr!important;
    display: block;
    margin: var(--devsite-code-margin,16px 0);
    min-height: var(--devsite-code-button-size);
    overflow: hidden;
    position: relative
}

devsite-code .devsite-code-buttons-container {
    position: absolute;
    right: var(--devsite-code-buttons-container-right,0);
    top: 0;
    z-index: 1
}

devsite-code .devsite-code-buttons-container :link {
    text-decoration: none
}

devsite-code .devsite-code-buttons-container button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    color: #202124;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 18px;
    height: var(--devsite-code-button-size,24px);
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0;
    min-width: auto;
    padding: 0;
    -webkit-transition: color .2s;
    transition: color .2s;
    width: var(--devsite-code-button-size,24px)
}

devsite-code .devsite-code-buttons-container button:focus,devsite-code .devsite-code-buttons-container button:hover {
    color: #5f6368
}

devsite-code .devsite-code-buttons-container button.material-icons,devsite-code .devsite-code-buttons-container button.material-icons:hover {
    cursor: pointer
}

devsite-code .devsite-code-buttons-container button {
    color: var(--devsite-code-buttons-color,#202124)
}

devsite-code .devsite-code-buttons-container button:focus,devsite-code .devsite-code-buttons-container button:hover {
    color: var(--devsite-code-buttons-hover,#5f6368)
}

devsite-code .devsite-code-buttons-container .devsite-explain-code svg {
    width: 20px;
    height: 20px
}

devsite-code .devsite-code-buttons-container .devsite-explain-code svg path {
    fill: var(--devsite-code-buttons-color,#202124)
}

devsite-code .devsite-code-buttons-container .devsite-explain-code:focus svg path,devsite-code .devsite-code-buttons-container .devsite-explain-code:hover svg path {
    fill: var(--devsite-code-buttons-hover,#5f6368)
}

devsite-code .devsite-code-buttons-container .devsite-toggle-dark {
    display: var(--devsite-code-buttons-toggle-dark-display)
}

devsite-code .devsite-code-buttons-container .devsite-toggle-light {
    display: var(--devsite-code-buttons-toggle-light-display)
}

devsite-code pre {
    margin: 0;
    padding-block:max(var(--devsite-code-padding-block,24px),var(--devsite-code-button-size,24px)) var(--devsite-code-padding-block,24px);padding-inline: var(--devsite-code-padding-inline,24px)
}

devsite-code pre::-webkit-scrollbar-thumb {
    background: var(--devsite-scrollbar-thumb-background)
}

devsite-code pre .com,devsite-code pre .devsite-syntax-c,devsite-code pre .devsite-syntax-c1,devsite-code pre .devsite-syntax-ch,devsite-code pre .devsite-syntax-cm,devsite-code pre .devsite-syntax-cp,devsite-code pre .devsite-syntax-cpf,devsite-code pre .devsite-syntax-cs {
    color: var(--devsite-code-comments-color)
}

devsite-code pre .dec,devsite-code pre .devsite-syntax-il,devsite-code pre .devsite-syntax-m,devsite-code pre .devsite-syntax-mb,devsite-code pre .devsite-syntax-mf,devsite-code pre .devsite-syntax-mh,devsite-code pre .devsite-syntax-mi,devsite-code pre .devsite-syntax-mo,devsite-code pre .lit {
    color: var(--devsite-code-numbers-color)
}

devsite-code pre .devsite-syntax-k,devsite-code pre .devsite-syntax-kc,devsite-code pre .devsite-syntax-kd,devsite-code pre .devsite-syntax-kn,devsite-code pre .devsite-syntax-kp,devsite-code pre .devsite-syntax-kr,devsite-code pre .devsite-syntax-kt,devsite-code pre .devsite-syntax-nt,devsite-code pre .devsite-syntax-ow,devsite-code pre .kwd,devsite-code pre .tag {
    color: var(--devsite-code-keywords-color)
}

devsite-code pre .atv,devsite-code pre .cpf,devsite-code pre .devsite-syntax-dl,devsite-code pre .devsite-syntax-s,devsite-code pre .devsite-syntax-s1,devsite-code pre .devsite-syntax-s2,devsite-code pre .devsite-syntax-sa,devsite-code pre .devsite-syntax-sb,devsite-code pre .devsite-syntax-sc,devsite-code pre .devsite-syntax-sd,devsite-code pre .devsite-syntax-se,devsite-code pre .devsite-syntax-sh,devsite-code pre .devsite-syntax-si,devsite-code pre .devsite-syntax-sr,devsite-code pre .devsite-syntax-ss,devsite-code pre .devsite-syntax-sx,devsite-code pre .str {
    color: var(--devsite-code-strings-color)
}

devsite-code pre .atn,devsite-code pre .devsite-syntax-bp,devsite-code pre .devsite-syntax-fm,devsite-code pre .devsite-syntax-gh,devsite-code pre .devsite-syntax-go,devsite-code pre .devsite-syntax-gp,devsite-code pre .devsite-syntax-gr,devsite-code pre .devsite-syntax-gt,devsite-code pre .devsite-syntax-gu,devsite-code pre .devsite-syntax-na,devsite-code pre .devsite-syntax-nb,devsite-code pre .devsite-syntax-nc,devsite-code pre .devsite-syntax-nd,devsite-code pre .devsite-syntax-ne,devsite-code pre .devsite-syntax-nf,devsite-code pre .devsite-syntax-ni,devsite-code pre .devsite-syntax-nl,devsite-code pre .devsite-syntax-nn,devsite-code pre .devsite-syntax-no,devsite-code pre .devsite-syntax-nv,devsite-code pre .devsite-syntax-vc,devsite-code pre .devsite-syntax-vg,devsite-code pre .devsite-syntax-vi,devsite-code pre .devsite-syntax-vm,devsite-code pre .typ {
    color: var(--devsite-code-types-color)
}

devsite-code :link,devsite-code :visited,devsite-code a,devsite-code a :is(.atn,.atv,.com,.dec,.kwd,.lit,.pln,.pun,.str,.tag,.typ),devsite-code a [class^=devsite-syntax-] {
    text-decoration: underline
}

devsite-code[dark-code] :link,devsite-code[dark-code] :visited,devsite-code[dark-code] a,devsite-code[dark-code] a :is(.atn,.atv,.com,.dec,.kwd,.lit,.pln,.pun,.str,.tag,.typ),devsite-code[dark-code] a [class^=devsite-syntax-] {
    color: #669df6
}

devsite-code .prettyprint a:focus,devsite-code .prettyprint a:hover,devsite-code a:focus,devsite-code a:focus :is(.atn,.atv,.com,.dec,.kwd,.lit,.pln,.pun,.str,.tag,.typ),devsite-code a:focus [class^=devsite-syntax-],devsite-code a:hover,devsite-code a:hover :is(.atn,.atv,.com,.dec,.kwd,.lit,.pln,.pun,.str,.tag,.typ),devsite-code a:hover [class^=devsite-syntax-] {
    -moz-osx-font-smoothing: auto;
    -webkit-font-smoothing: auto;
    font-weight: 700
}

devsite-code .devsite-terminal:before {
    color: #bdc1c6;
    content: "$";
    padding-right: 8px
}

devsite-code .devsite-terminal[data-terminal-prefix]:before {
    content: attr(data-terminal-prefix)
}

devsite-code .devsite-github-link {
    -moz-osx-font-smoothing: auto;
    -webkit-font-smoothing: auto;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-weight: 700;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    text-decoration: none
}

devsite-code .devsite-github-link>a {
    text-decoration: none
}

devsite-code .devsite-github-link>a:focus,devsite-code .devsite-github-link>a:hover,devsite-code a.devsite-github-link:focus,devsite-code a.devsite-github-link:hover {
    text-decoration: underline
}

devsite-code .devsite-github-link:after {
    background: no-repeat var(--devsite-github-link-icon);
    content: "";
    display: block;
    height: 18px;
    margin-left: 8px;
    width: 18px
}

devsite-code[dark-code] .devsite-github-link>a {
    color: #669df6
}

devsite-code devsite-selector pre {
    margin: 0
}

body[layout=full] devsite-code {
    overflow: visible
}

body[layout=full] devsite-code:after {
    background: var(--devsite-code-background);
    content: "";
    display: block;
    height: 100%;
    left: calc(50% - 50vw);
    position: absolute;
    top: 0;
    width: 100vw;
    z-index: -1
}

devsite-code .devsite-summarize-auto-icon {
    fill: var(--devsite-code-buttons-color,#202124);
    height: 20px;
    width: 20px
}

devsite-code .devsite-summarize-auto-icon:focus,devsite-code .devsite-summarize-auto-icon:hover {
    fill: var(--devsite-code-buttons-hover,#5f6368)
}

:is(aside,.beta,.caution,.deprecated,.dogfood,.experimental,.key-point,.key-term,.note,.objective,.preview,.special,.success,.tip,.warning) devsite-code pre {
    background: var(--devsite-code-background)
}

@media screen and (max-width: 840px) {
    body[ready] devsite-code .devsite-explain-code {
        display:none
    }
}

devsite-code:has(devsite-code-tutorial) {
    --devsite-content-border-radius: 0
}

@media (forced-colors:active) and (prefers-color-scheme: dark) {
    :root {
        --devsite-code-buttons-color:#fff
    }
}

devsite-code-tutorial {
    display: block
}

devsite-code-tutorial a:link {
    color: #1967d2
}

devsite-code-tutorial code:not(pre>code) {
    --devsite-code-background: #f1f3f4;
    --devsite-code-color: #37474f
}

.color-scheme--dark devsite-code-tutorial code:not(pre>code) {
    --devsite-code-background: #36373a;
    --devsite-code-color: #f1f3f4
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-header {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #e8f0fe;
    border-radius: 0 0 8px 8px;
    color: #1967d2;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 8px 16px
}

.color-scheme--dark devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-header {
    background-color: #2a2b2e;
    border-color: #2a2b2e;
    color: #8ab4f8
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-header .devsite-code-tutorial-header-left-group {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-header .devsite-code-tutorial-header-icon {
    padding-top: 4px
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-header .devsite-code-tutorial-header-icon svg {
    fill: #1967d2;
    height: 16px;
    width: 16px
}

.color-scheme--dark devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-header .devsite-code-tutorial-header-icon svg {
    fill: #8ab4f8
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-header .devsite-code-tutorial-toggle-button {
    background: none;
    border: none;
    margin: 0;
    padding: 0
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-header .devsite-code-tutorial-toggle-button:active,devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-header .devsite-code-tutorial-toggle-button:focus,devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-header .devsite-code-tutorial-toggle-button:hover {
    background: none;
    box-shadow: none
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-header h3 {
    margin: 0
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-header h3 {
    font-family: var(--devsite-h3-font);
    font-size: 16px;
    font-weight: 500;
    letter-spacing: var(--devsite-h3-letter-spacing);
    margin: 0;
    padding-left: 8px
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-header .devsite-code-tutorial-toggle-button {
    font-size: 24px;
    margin-top: 4px;
    -webkit-transition: -webkit-transform .3s ease;
    transition: -webkit-transform .3s ease;
    transition: transform .3s ease;
    transition: transform .3s ease,-webkit-transform .3s ease
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-content-wrapper {
    background: rgba(232,240,254,.1);
    display: none;
    -webkit-transition: display .6s ease;
    transition: display .6s ease
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-content-wrapper .devsite-code-tutorial-content-feedback {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin: 0 12px
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-content-wrapper .devsite-code-tutorial-content-feedback .devsite-code-tutorial-content-feedback-button {
    border-radius: 50%;
    border: none;
    margin: 0;
    padding: 0
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-content-wrapper {
    padding-top: 12px
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-content {
    overflow: hidden;
    -webkit-transition: padding .1s ease .5s;
    transition: padding .1s ease .5s
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-content.devsite-code-tutorial-non-gdp-user {
    height: 420px;
    position: relative
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-content.devsite-code-tutorial-content-loading {
    height: auto
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-content h4 {
    font-family: var(--devsite-h2-font);
    font-size: 20px;
    letter-spacing: var(--devsite-h2-letter-spacing);
    margin: var(--devsite-h2-margin)
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-content h4:first-of-type {
    margin-top: 0
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-content h5 {
    font-family: var(--devsite-h3-font);
    font-size: 16px;
    letter-spacing: var(--devsite-h3-letter-spacing);
    margin: var(--devsite-h3-margin)
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-signin-prompt {
    padding: 40px 20px;
    text-align: center
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-gdp-prompt {
    background: -webkit-gradient(linear,left bottom,left top,color-stop(50%,#fff),color-stop(90%,hsla(0,0%,100%,.5)),to(hsla(0,0%,100%,.3)));
    background: -webkit-linear-gradient(bottom,#fff 50%,hsla(0,0%,100%,.5) 90%,hsla(0,0%,100%,.3));
    background: linear-gradient(0deg,#fff 50%,hsla(0,0%,100%,.5) 90%,hsla(0,0%,100%,.3));
    border-radius: 0 0 8px 8px;
    bottom: 0;
    padding: 120px 40px 40px;
    position: absolute;
    right: 0;
    text-align: center;
    width: 100%;
    z-index: 2
}

devsite-code-tutorial .devsite-code-tutorial-container .devsite-code-tutorial-error {
    color: #c5221f;
    padding: 40px 20px
}

devsite-code-tutorial .devsite-code-tutorial-skeleton {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 10px
}

devsite-code-tutorial .devsite-code-tutorial-skeleton-line {
    -webkit-animation: shimmer 2s ease-in-out infinite;
    animation: shimmer 2s ease-in-out infinite;
    background: -webkit-gradient(linear,left top,right top,color-stop(10%,transparent),color-stop(70%,rgba(66,133,244,.8)),color-stop(90%,transparent));
    background: -webkit-linear-gradient(left,transparent 10%,rgba(66,133,244,.8) 70%,transparent 90%);
    background: linear-gradient(90deg,transparent 10%,rgba(66,133,244,.8) 70%,transparent 90%);
    background-size: 200% 100%;
    border-radius: 8px;
    height: 16px;
    margin-block:12px}

devsite-code-tutorial.devsite-code-tutorial-open .devsite-code-tutorial-header {
    border-radius: 0;
    border-bottom: 1px solid #e8f0fe
}

devsite-code-tutorial.devsite-code-tutorial-open .devsite-code-tutorial-toggle-button {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

devsite-code-tutorial.devsite-code-tutorial-open .devsite-code-tutorial-content-wrapper {
    display: block
}

devsite-code-tutorial.devsite-code-tutorial-open .devsite-code-tutorial-content-wrapper .devsite-code-tutorial-content {
    padding-inline:24px;-webkit-transition: padding 0s ease;
    transition: padding 0s ease
}

@-webkit-keyframes shimmer {
    0% {
        background-position: 200% 0
    }

    to {
        background-position: -200% 0
    }
}

devsite-code-tutorial .devsite-code-tutorial-skeleton-header {
    width: 30%
}

devsite-code-tutorial .devsite-code-tutorial-skeleton-line:not(.devsite-code-tutorial-skeleton-header) {
    width: 100%
}

devsite-codelab-catalog .controls {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

devsite-codelab-catalog .catalog-selector,devsite-codelab-catalog .category-selector,devsite-codelab-catalog .sort-controls {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

devsite-codelab-catalog .controls {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

devsite-codelab-catalog .catalog-selector,devsite-codelab-catalog .category-selector {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-codelab-catalog .catalog-selector {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0;
    width: auto
}

devsite-codelab-catalog .category-selector {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

devsite-codelab-catalog[sortorder=-timestamp] .button[sortorder=-timestamp],devsite-codelab-catalog[sortorder=displaytitle] .button[sortorder=displaytitle],devsite-codelab-catalog[sortorder=durationminutes] .button[sortorder=durationminutes] {
    border-bottom: 2px solid;
    border-radius: 4px 4px 0 0
}

@media screen and (max-width: 840px) {
    devsite-codelab-catalog .sort-controls {
        -webkit-box-flex:0;
        -webkit-flex: 0 1 auto;
        -moz-box-flex: 0;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        padding-bottom: 16px;
        width: 100%
    }

    devsite-codelab-catalog .catalog-selector {
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

@media screen and (max-width: 600px) {
    devsite-codelab-catalog .catalog-selector {
        padding-bottom:16px
    }

    devsite-codelab-catalog .category-selector {
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

devsite-concierge {
    --devsite-concierge-border: 1px solid #bdc1c6;
    bottom: 0;
    position: fixed;
    top: var(--devsite-concierge-top,48px);
    z-index: 1006
}

.color-scheme--dark devsite-concierge {
    --devsite-concierge-border: 1px solid #5f6368
}

body[concierge] devsite-concierge {
    inset-inline-start: calc(100% + 6px)
}

body[ready][concierge=closed] devsite-concierge,body[ready][concierge=open] devsite-concierge {
    inset-inline-start: calc(100% - var(--devsite-concierge-width, 54px))
}

body[concierge=hide] devsite-concierge {
    -webkit-transition: inset-inline-start .1s cubic-bezier(0,0,.2,1);
    transition: inset-inline-start .1s cubic-bezier(0,0,.2,1)
}

body[ready] devsite-concierge {
    bottom: var(--devsite-panel-height,0);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

body[ready][concierge=modal] devsite-concierge {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    inset: 0;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 1014
}

body[concierge=hide] #gc-wrapper {
    -webkit-transition: -webkit-margin-end .1s cubic-bezier(0,0,.2,1);
    transition: -webkit-margin-end .1s cubic-bezier(0,0,.2,1);
    transition: margin-inline-end .1s cubic-bezier(0,0,.2,1);
    transition: margin-inline-end .1s cubic-bezier(0,0,.2,1),-webkit-margin-end .1s cubic-bezier(0,0,.2,1),-moz-margin-end .1s cubic-bezier(0,0,.2,1)
}

body[ready][concierge] #gc-wrapper {
    -webkit-margin-end: var(--devsite-concierge-width,0);
    -moz-margin-end: var(--devsite-concierge-width,0);
    margin-inline-end:var(--devsite-concierge-width,0)}

.devsite-concierge-container {
    background: var(--devsite-background-1);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-padding-after: var(--devsite-cookie-bar-height,0);
    padding-block-end:var(--devsite-cookie-bar-height,0)}

.devsite-concierge-container: before {
    --devsite-elevation-key-shadow-color:rgba(0,0,0,.3);
    --devsite-elevation-ambient-shadow-color: rgba(0,0,0,.15);
    content: "";
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color);
    height: 100%;
    position: absolute;
    width: 100%;
    z-index: -1
}

[dir=ltr] .devsite-concierge-container:before {
    -webkit-clip-path: inset(0 0 0 -3px);
    clip-path: inset(0 0 0 -3px)
}

[dir=rtl] .devsite-concierge-container:before {
    -webkit-clip-path: inset(0 -3px 0 0);
    clip-path: inset(0 -3px 0 0)
}

body[ready][concierge=modal] devsite-concierge {
    pointer-events: none
}

body[ready][concierge=modal] .devsite-concierge-container {
    border-radius: 8px;
    height: 80vh;
    pointer-events: auto;
    width: 80vw;
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color)
}

body[ready][concierge=modal] .devsite-concierge-container:before {
    display: none
}

.devsite-concierge-menu {
    background-color: var(--devsite-background-1);
    border-top: 1px solid #bdc1c6;
    -webkit-padding-before: 8px;
    padding-block-start:8px;width: var(--devsite-concierge-width-closed,54px);
    z-index: 1
}

.color-scheme--dark .devsite-concierge-menu {
    border-top: 0
}

body[ready][concierge=modal] .devsite-concierge-menu {
    border-end-start-radius: 8px;
    border-start-start-radius: 8px;
    border-top: 0
}

.devsite-concierge-panel {
    background: var(--devsite-background-1);
    -webkit-border-start: var(--devsite-concierge-border,0);
    -moz-border-start: var(--devsite-concierge-border,0);
    border-inline-start:var(--devsite-concierge-border,0);border-top: 1px solid #bdc1c6;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 100%;
    overflow: hidden;
    width: calc(var(--devsite-concierge-width-open) - var(--devsite-concierge-width-closed));
    z-index: 2
}

.color-scheme--dark .devsite-concierge-panel {
    border-top: 0
}

.devsite-concierge-panel>* {
    display: none
}

.devsite-concierge-panel>[active] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

body[ready][concierge=modal] .devsite-concierge-panel {
    border-end-end-radius: 8px;
    border-start-end-radius: 8px;
    border-top: 0
}

.devsite-concierge-menu {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px;
    overflow: visible
}

.devsite-concierge-panel-open {
    width: var(--devsite-concierge-width-open,355px)
}

.devsite-concierge-panel-open .devsite-concierge-panel {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

[concierge=modal] .devsite-concierge-menu-item--selected,[concierge=modal] .devsite-concierge-menu-item--selected .devsite-concierge-menu-icon,[concierge=modal] .devsite-concierge-menu-item--selected .devsite-concierge-menu-title {
    cursor: default
}

.devsite-concierge-menu-item {
    background: none;
    border: 0;
    border-radius: 0;
    height: auto;
    margin: 0;
    min-width: auto;
    overflow: visible;
    padding: 0;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 100%
}

.devsite-concierge-menu-item:active,.devsite-concierge-menu-item:focus,.devsite-concierge-menu-item:hover {
    background: none;
    border: 0;
    box-shadow: none
}

.devsite-concierge-menu--hidden {
    display: none
}

.devsite-concierge-menu-icon {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 auto;
    -webkit-transition: background-color .3s cubic-bezier(.4,0,.2,1);
    transition: background-color .3s cubic-bezier(.4,0,.2,1);
    width: 40px;
    background-color: transparent;
    color: #5f6368
}

.devsite-concierge-menu-icon svg {
    fill: #5f6368
}

.color-scheme--dark .devsite-concierge-menu-icon {
    background-color: transparent;
    color: #9aa0a6
}

.color-scheme--dark .devsite-concierge-menu-icon svg {
    fill: #9aa0a6
}

.devsite-concierge-menu-item:focus .devsite-concierge-menu-icon,.devsite-concierge-menu-item:hover .devsite-concierge-menu-icon {
    background-color: rgba(95,99,104,.08);
    color: #5f6368
}

.devsite-concierge-menu-item:focus .devsite-concierge-menu-icon svg,.devsite-concierge-menu-item:hover .devsite-concierge-menu-icon svg {
    fill: #5f6368
}

.color-scheme--dark .devsite-concierge-menu-item:focus .devsite-concierge-menu-icon,.color-scheme--dark .devsite-concierge-menu-item:hover .devsite-concierge-menu-icon {
    background-color: #3c4043;
    color: #bdc1c6
}

.color-scheme--dark .devsite-concierge-menu-item:focus .devsite-concierge-menu-icon svg,.color-scheme--dark .devsite-concierge-menu-item:hover .devsite-concierge-menu-icon svg {
    fill: #bdc1c6
}

.devsite-concierge-menu-item:active .devsite-concierge-menu-icon {
    border-radius: 50%;
    background-color: rgba(95,99,104,.12);
    color: #5f6368
}

.devsite-concierge-menu-item:active .devsite-concierge-menu-icon svg {
    fill: #5f6368
}

.color-scheme--dark .devsite-concierge-menu-item:active .devsite-concierge-menu-icon {
    background-color: #505356;
    color: #bdc1c6
}

.color-scheme--dark .devsite-concierge-menu-item:active .devsite-concierge-menu-icon svg {
    fill: #bdc1c6
}

.devsite-concierge-menu-icon .material-icons {
    font-size: 20px
}

.devsite-concierge-menu-title {
    color: #5f6368;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0 2px
}

.color-scheme--dark .devsite-concierge-menu-title {
    color: #9aa0a6
}

.devsite-concierge-menu-item--selected .devsite-concierge-menu-icon {
    background-color: #e8f0fe
}

.color-scheme--dark .devsite-concierge-menu-item--selected .devsite-concierge-menu-icon {
    background-color: #3c4043
}

.devsite-concierge-menu-item--selected .devsite-concierge-menu-icon svg path {
    fill: #1a73e8
}

.color-scheme--dark .devsite-concierge-menu-item--selected .devsite-concierge-menu-icon svg path {
    fill: #8ab4f8
}

.devsite-concierge-menu-item--selected .devsite-concierge-menu-title {
    color: #1a73e8
}

.color-scheme--dark .devsite-concierge-menu-item--selected .devsite-concierge-menu-title {
    color: #8ab4f8
}

.devsite-concierge-menu-item--selected:after {
    background: #1967d2;
    border-radius: 0;
    border-end-start-radius: 4px;
    border-start-start-radius: 4px;
    content: "";
    height: 40px;
    inset-inline-end: 0;
    position: absolute;
    top: 0;
    width: 4px
}

.color-scheme--dark .devsite-concierge-menu-item--selected:after {
    background-color: #8ab4f8
}

.devsite-concierge-notification-dot {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-iteration-count: 3;
    animation-iteration-count: 3;
    -webkit-animation-name: notificationDotAnimation;
    animation-name: notificationDotAnimation;
    background: var(--devsite-contrast-link-color);
    border-radius: 50%;
    height: 10px;
    inset-inline-end: 8px;
    position: absolute;
    top: 2px;
    width: 10px
}

@-webkit-keyframes notificationDotAnimation {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    30% {
        -webkit-transform: scale3d(1.25,.75,1);
        transform: scale3d(1.25,.75,1)
    }

    40% {
        -webkit-transform: scale3d(.75,1.25,1);
        transform: scale3d(.75,1.25,1)
    }

    50% {
        -webkit-transform: scale3d(1.15,.85,1);
        transform: scale3d(1.15,.85,1)
    }

    65% {
        -webkit-transform: scale3d(.95,1.05,1);
        transform: scale3d(.95,1.05,1)
    }

    75% {
        -webkit-transform: scale3d(1.05,.95,1);
        transform: scale3d(1.05,.95,1)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

.devsite-concierge-notification {
    -webkit-animation: notifcationAnimation .5s ease-out .15s forwards;
    animation: notifcationAnimation .5s ease-out .15s forwards;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    background: #1967d2;
    border-radius: 12px;
    color: #fff;
    cursor: pointer;
    font-size: 12px;
    inset-inline-end: calc(100% - 8px);
    opacity: 0;
    padding: 0 12px;
    pointer-events: none;
    position: absolute;
    top: 8px;
    white-space: nowrap
}

.color-scheme--dark .devsite-concierge-notification {
    color: #fff
}

@-webkit-keyframes notifcationAnimation {
    0% {
        opacity: 1;
        -webkit-transform: translateZ(0) scaleX(1);
        transform: translateZ(0) scaleX(1)
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(12px,0,0) scale3d(.9,.9,.9);
        transform: translate3d(12px,0,0) scale3d(.9,.9,.9)
    }
}

@keyframes notifcationAnimation {
    0% {
        opacity: 1;
        -webkit-transform: translateZ(0) scaleX(1);
        transform: translateZ(0) scaleX(1)
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(12px,0,0) scale3d(.9,.9,.9);
        transform: translate3d(12px,0,0) scale3d(.9,.9,.9)
    }
}

.devsite-concierge-panel-sections-container .devsite-concierge-release-notes {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.viewport--mobile[ready][concierge=closed] #gc-wrapper,.viewport--mobile[ready][concierge=open] #gc-wrapper,.viewport--tablet[ready][concierge=closed] #gc-wrapper,.viewport--tablet[ready][concierge=open] #gc-wrapper {
    -webkit-margin-end: var(--devsite-concierge-width-closed,0);
    -moz-margin-end: var(--devsite-concierge-width-closed,0);
    margin-inline-end:var(--devsite-concierge-width-closed,0)}

.viewport--mobile[ready][concierge] .devsite-concierge-container,.viewport--tablet[ready][concierge] .devsite-concierge-container {
    background-color: transparent;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.viewport--mobile[ready][concierge] .devsite-concierge-container:before,.viewport--tablet[ready][concierge] .devsite-concierge-container:before {
    box-shadow: none
}

.viewport--mobile[ready][concierge] devsite-header[fixed] .devsite-header--inner .devsite-collapsible-section,.viewport--tablet[ready][concierge] devsite-header[fixed] .devsite-header--inner .devsite-collapsible-section {
    position: relative
}

.viewport--mobile .devsite-concierge-menu,.viewport--mobile .devsite-concierge-panel,.viewport--tablet .devsite-concierge-menu,.viewport--tablet .devsite-concierge-panel {
    display: none
}

.viewport--mobile[ready][concierge=open] .devsite-concierge-container.devsite-concierge-panel-open,.viewport--tablet[ready][concierge=open] .devsite-concierge-container.devsite-concierge-panel-open {
    margin-top: 12px
}

.viewport--mobile[ready][concierge=open] .devsite-concierge-panel,.viewport--tablet[ready][concierge=open] .devsite-concierge-panel {
    border-top-left-radius: 16px;
    border: 1px solid #bdc1c6;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    width: var(--devsite-concierge-width-open)
}

.viewport--mobile[ready][concierge=open] devsite-concierge-ai-panel,.viewport--tablet[ready][concierge=open] devsite-concierge-ai-panel {
    height: 100%
}

.viewport--mobile[ready][concierge=open] .devsite-concierge-panel-open .devsite-concierge-menu,.viewport--tablet[ready][concierge=open] .devsite-concierge-panel-open .devsite-concierge-menu {
    border-left: 1px solid #bdc1c6;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -moz-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    -webkit-padding-before: 0;
    padding-block-start:0;width: 100%
}

.viewport--mobile[ready][concierge=open] .devsite-concierge-menu-item,.viewport--tablet[ready][concierge=open] .devsite-concierge-menu-item {
    -webkit-padding-before: 8px;
    padding-block-start:8px}

.viewport--mobile[ready][concierge=open] .devsite-concierge-menu-item--selected:after,.viewport--tablet[ready][concierge=open] .devsite-concierge-menu-item--selected:after {
    border-radius: 0 0 4px 4px;
    height: 4px;
    width: 100%
}

.viewport--mobile[ready][concierge=open] .devsite-concierge-menu-icon,.viewport--tablet[ready][concierge=open] .devsite-concierge-menu-icon {
    height: 20px;
    width: 30px
}

.viewport--mobile[layout][concierge=modal] .devsite-devguide-mobile-button,.viewport--mobile[layout][concierge=open] .devsite-devguide-mobile-button,.viewport--tablet[layout][concierge=modal] .devsite-devguide-mobile-button,.viewport--tablet[layout][concierge=open] .devsite-devguide-mobile-button {
    display: none
}

.viewport--mobile[ready][concierge=modal] .devsite-concierge-container,.viewport--tablet[ready][concierge=modal] .devsite-concierge-container {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
}

.viewport--mobile[ready][concierge=modal] .devsite-concierge-panel-open .devsite-concierge-menu,.viewport--tablet[ready][concierge=modal] .devsite-concierge-panel-open .devsite-concierge-menu {
    background-color: var(--devsite-background-1);
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.viewport--mobile[ready][concierge=modal] .devsite-concierge-panel,.viewport--tablet[ready][concierge=modal] .devsite-concierge-panel {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.viewport--mobile[layout][concierge=closed],.viewport--tablet[layout][concierge=closed] {
    --devsite-concierge-width: 0px
}

.viewport--mobile[layout][concierge=closed] .devsite-wrapper #gc-wrapper,.viewport--tablet[layout][concierge=closed] .devsite-wrapper #gc-wrapper {
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0}

.viewport--mobile[ready][concierge=closed] .mobileViewNotEnabled,.viewport--mobile[ready][concierge=modal] .mobileViewNotEnabled,.viewport--mobile[ready][concierge=open] .mobileViewNotEnabled,.viewport--tablet[ready][concierge=closed] .mobileViewNotEnabled,.viewport--tablet[ready][concierge=modal] .mobileViewNotEnabled,.viewport--tablet[ready][concierge=open] .mobileViewNotEnabled {
    display: none;
    --devsite-concierge-width: 0px
}

.viewport--mobile .devsite-concierge-panel-fullscreen {
    display: none
}

.viewport--mobile[layout][concierge=open] {
    --devsite-concierge-width: 250px
}

.viewport--mobile[ready][concierge=open] devsite-concierge {
    inset-inline-start: calc(100% - var(--devsite-concierge-width, 250px))
}

.viewport--mobile[ready][concierge=open] .devsite-concierge-panel>[active] {
    max-width: var(--devsite-concierge-width,250px)
}

.viewport--mobile[ready][concierge=open] .devsite-concierge-container {
    width: var(--devsite-concierge-width,250px)
}

.viewport--mobile[layout][concierge=closed] {
    --devsite-concierge-width: 0px
}

.viewport--mobile[layout][concierge=closed] .devsite-wrapper #gc-wrapper {
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0}

.viewport--mobile[ready][concierge=closed] .mobile-view-not-enabled,.viewport--mobile[ready][concierge=modal] .mobile-view-not-enabled,.viewport--mobile[ready][concierge=open] .mobile-view-not-enabled {
    display: none;
    --devsite-concierge-width: 0px
}

.viewport--mobile[ready][concierge=open] .devsite-info-guide-view-release-notes-button {
    font-size: 10px
}

.viewport--mobile[ready][concierge=open] .devsite-concierge-panel-chat-input {
    width: 120px
}

.devsite-concierge-panel-header {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 4px 8px 4px 16px
}

.devsite-concierge-panel-header h2 {
    color: #202124;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
    margin: 0
}

.color-scheme--dark .devsite-concierge-panel-header h2 {
    color: #e8eaed
}

.devsite-concierge-panel-header-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.devsite-concierge-panel-header-buttons .devsite-material-button {
    border: none;
    color: #202124;
    padding: 4px
}

.devsite-concierge-description-more-options-menu {
    position: relative
}

.devsite-concierge-more-options-list {
    background: var(--devsite-background-1);
    border: 1px solid #dadce0;
    border-radius: 8px;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.3),0 2px 6px 2px rgba(0,0,0,.15);
    display: block;
    list-style: none;
    margin: 0;
    min-width: 170px;
    padding: 10px 0;
    position: absolute;
    right: 0;
    top: 40px;
    z-index: 2
}

.devsite-concierge-more-options-list li {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    padding: 0 16px;
    white-space: nowrap
}

.devsite-concierge-more-options-list li:hover {
    background: #f1f3f4;
    cursor: pointer
}

.devsite-concierge-more-options-list li a,.devsite-concierge-more-options-list li devsite-feedback a {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-text-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 6px 0;
    text-decoration: none;
    width: 100%
}

.devsite-concierge-more-options-list li .material-icons {
    font-size: 20px;
    margin-right: 16px
}

devsite-concierge-ai-panel .devsite-concierge-panel-header {
    padding: 12px 16px;
    border-bottom: var(--devsite-concierge-border)
}

devsite-concierge-ai-panel .devsite-concierge-panel-loading,devsite-concierge-ai-panel .devsite-concierge-tos-accept,devsite-concierge-ai-panel .devsite-concierge-tos-intro {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    gap: 12px;
    padding: 0 4px
}

devsite-concierge-ai-panel .devsite-concierge-tos-accept {
    text-align: start;
    gap: 9px
}

devsite-concierge-ai-panel .devsite-concierge-tos-accept .devsite-tos-title {
    color: #3c4043;
    font-size: 16px;
    font-weight: 500
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-tos-accept .devsite-tos-title {
    color: #e8eaed
}

devsite-concierge-ai-panel .devsite-concierge-tos-accept .devsite-tos-button-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
    -webkit-margin-before: 12px;
    margin-block-start:12px;--devsite-button-sibling-gap-x: 0;
    --devsite-button-padding: 0 15px
}

devsite-concierge-ai-panel .devsite-concierge-panel-user-button,devsite-concierge-ai-panel .devsite-concierge-tos-intro-button,devsite-concierge-ai-panel .devsite-concierge-tos-reject-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: auto;
    line-height: 1.25;
    min-height: var(--devsite-button-height,36px);
    white-space: normal
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 40px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-row h2 {
    color: var(--devsite-primary-text-color);
    --devsite-h2-margin: 0;
    --devsite-h2-font: 500 16px/24px var(--devsite-headline-font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0;overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-buttons devsite-feedback {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-button {
    background: none;
    border-radius: 50%;
    border: 0;
    height: 32px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 32px;
    background-color: transparent;
    color: #5f6368;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-header-button {
    background-color: transparent;
    color: #9aa0a6
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-button:focus,devsite-concierge-ai-panel .devsite-concierge-panel-header-button:hover {
    background-color: rgba(95,99,104,.08);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-header-button:focus,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-header-button:hover {
    background-color: #3c4043;
    color: #bdc1c6
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-button:active {
    background-color: rgba(95,99,104,.12);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-header-button:active {
    background-color: #505356;
    color: #bdc1c6
}

devsite-concierge-ai-panel .devsite-concierge-panel-sections {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    gap: 10px;
    overflow: auto;
    padding: 16px
}

[concierge=modal] devsite-concierge-ai-panel .devsite-concierge-panel-sections {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    overflow: hidden;
    -webkit-flex-basis: 40%;
    -ms-flex-preferred-size: 40%;
    flex-basis: 40%
}

devsite-concierge-ai-panel .devsite-concierge-panel-section {
    border: var(--devsite-concierge-border);
    border-radius: 8px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-section .devsite-concierge-panel-section-content {
    padding: 16px;
    overflow-wrap: anywhere
}

devsite-concierge-ai-panel .devsite-info-guide-view-release-notes-button {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 10px auto auto;
    padding: 8px 12px 8px 16px;
    gap: 8px;
    border-radius: 4px;
    background: #1a73e8;
    color: #fff;
    font-family: var(--devsite-sys-typescale--button-plain--font-names);
    font-size: var(--devsite-sys-typescale--button-plain--font-size);
    font-weight: var(--devsite-sys-typescale--button-plain--font-weight);
    line-height: var(--devsite-sys-typescale--button-plain--line-height);
    line-height: 20px
}

[concierge=modal] devsite-concierge-ai-panel .devsite-info-guide-view-release-notes-button {
    display: none
}

devsite-concierge-ai-panel .devsite-info-guide-view-release-notes-button:active,devsite-concierge-ai-panel .devsite-info-guide-view-release-notes-button:focus,devsite-concierge-ai-panel .devsite-info-guide-view-release-notes-button:hover {
    background: #185abc;
    color: #fff;
    text-decoration: none
}

devsite-concierge-ai-panel .devsite-info-guide-view-release-notes-button .material-icons {
    top: -1px
}

devsite-concierge-ai-panel .devsite-concierge-info-panel-release-notes {
    display: none
}

[concierge=modal] devsite-concierge-ai-panel .devsite-concierge-info-panel-release-notes {
    display: block;
    -webkit-flex-basis: 60%;
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%
}

[concierge=modal] devsite-concierge-ai-panel .devsite-dialog-footer {
    -webkit-flex-basis: 60%;
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%
}

[layout=docs] devsite-concierge-ai-panel .devsite-concierge-panel-section h1,[layout=docs] devsite-concierge-ai-panel .devsite-concierge-panel-section h2,[layout=docs] devsite-concierge-ai-panel .devsite-concierge-panel-section h3,[layout=docs] devsite-concierge-ai-panel .devsite-concierge-panel-section h4,[layout=docs] devsite-concierge-ai-panel .devsite-concierge-panel-section h5,[layout=docs] devsite-concierge-ai-panel .devsite-concierge-panel-section h6 {
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0;-webkit-padding-end: 0;
    -moz-padding-end: 0;
    padding-inline-end:0}

devsite-concierge-ai-panel .devsite-concierge-panel-section-header {
    border-bottom: var(--devsite-concierge-border);
    padding: 14px 16px
}

devsite-concierge-ai-panel .devsite-concierge-panel-section-fill {
    min-height: 200px;
    overflow: auto;
    -webkit-flex-shrink: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1
}

devsite-concierge-ai-panel .devsite-concierge-panel-feedback {
    place-self: flex-end;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-concierge-ai-panel .devsite-concierge-panel-section h3 {
    --devsite-h3-margin: 0;
    --devsite-h3-font: 700 13px/21px var(--devsite-headline-font-family);
    font-size: 13px;
    line-height: 21px;
    color: #5f6368
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-section h3 {
    color: #e8eaed
}

[type=article] devsite-concierge-ai-panel .devsite-concierge-panel-section p,[type=pricing] devsite-concierge-ai-panel .devsite-concierge-panel-section p,[type=product] devsite-concierge-ai-panel .devsite-concierge-panel-section p,[type=reference] devsite-concierge-ai-panel .devsite-concierge-panel-section p {
    font-weight: 400;
    font-size: 13px;
    line-height: 21px;
    margin: 0
}

[concierge=modal] devsite-concierge-ai-panel .devsite-concierge-panel-close,[concierge=modal] devsite-concierge-ai-panel .devsite-concierge-panel-fullscreen {
    display: none
}

devsite-concierge-ai-panel .devsite-concierge-panel-dock {
    display: none
}

[concierge=modal] devsite-concierge-ai-panel .devsite-concierge-panel-dock {
    display: inline
}

devsite-concierge-ai-panel .devsite-concierge-panel-section--loading {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 4px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

@-webkit-keyframes pulse {
    0%,to {
        opacity: 1
    }

    50% {
        opacity: .5
    }
}

devsite-concierge-ai-panel .devsite-concierge-panel-section--loading .devsite-concierge-panel-section-header {
    border-bottom: 1px solid transparent
}

devsite-concierge-ai-panel .devsite-concierge-panel-section--loading h2.devsite-concierge-panel-skeleton {
    height: 21px
}

devsite-concierge-ai-panel .devsite-concierge-panel-section--loading .devsite-concierge-panel-skeleton {
    background: var(--tenant-background-3);
    border-radius: 4px;
    margin: 0 0 4px;
    font-size: 13px;
    height: 21px;
    -webkit-animation: pulse 2s infinite;
    animation: pulse 2s infinite
}

devsite-concierge-ai-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:first-child {
    width: 100%
}

devsite-concierge-ai-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(2) {
    width: 50%
}

devsite-concierge-ai-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(3) {
    width: 33%
}

devsite-concierge-ai-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(4) {
    width: 66%
}

devsite-concierge-ai-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(5) {
    width: 25%
}

devsite-concierge-ai-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(6) {
    width: 44%
}

.color-scheme--dark devsite-concierge-ai-panel input[type=text] {
    --devsite-input-color: #bdc1c6
}

devsite-concierge-ai-panel.new-chat-ui .devsite-concierge-panel-header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-section {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-header {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: var(--devsite-concierge-border);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    padding: 12px 16px
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-header-titles {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-header h2 {
    color: #5f6368;
    font-size: 16px;
    font-weight: 500;
    line-height: 21px;
    margin: 0
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-header h2 {
    color: #e8eaed
}

[layout=docs] devsite-concierge-ai-panel .devsite-concierge-panel-chat-header h3,[layout=full] devsite-concierge-ai-panel .devsite-concierge-panel-chat-header h3 {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #f3e8fd;
    border-radius: 4px;
    color: #681da8;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 9px;
    font-weight: 500;
    gap: 6px;
    line-height: 16px;
    margin: 0;
    padding: 2px 6px;
    -webkit-padding-end: 8px;
    -moz-padding-end: 8px;
    padding-inline-end:8px;text-transform: uppercase
}

[layout=docs].color-scheme--dark [layout=docs] devsite-concierge-ai-panel .devsite-concierge-panel-chat-header h3,[layout=docs].color-scheme--dark [layout=full] devsite-concierge-ai-panel .devsite-concierge-panel-chat-header h3,[layout=full].color-scheme--dark [layout=docs] devsite-concierge-ai-panel .devsite-concierge-panel-chat-header h3,[layout=full].color-scheme--dark [layout=full] devsite-concierge-ai-panel .devsite-concierge-panel-chat-header h3 {
    background: #202124;
    color: #e9d2fd
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-body {
    background: #f8f9fa;
    border-radius: 0 0 8px 8px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
    -moz-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    overflow: hidden;
    gap: 8px
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-body {
    background: #36373a
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-form {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
    border-radius: 30px;
    border: 1px solid #dadce0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    grid-template-columns: 1fr 36px;
    gap: 4px;
    padding: 1px 0;
    -webkit-padding-start: 20px;
    -moz-padding-start: 20px;
    padding-inline-start:20px;margin-bottom: 8px;
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 0;
    -moz-box-flex: 1;
    -ms-flex: 1 1 0px;
    flex: 1 1 0;
    --devsite-input-border: 0;
    --devsite-input-padding: 0;
    --devsite-input-border-bottom-focus: 0;
    --devsite-input-padding-bottom-focus: 0;
    --devsite-input-height: 45px
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-form {
    background: #2a2b2e;
    border: 1px solid #5f6368
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-form[disabled] {
    --devsite-input-background: var(--devsite-background-3);
    background: var(--devsite-background-3)
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-form[disabled] {
    --devsite-input-background: #202124
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-form[disabled] .devsite-concierge-panel-chat-button {
    background: none;
    color: var(--devsite-input-color-disabled,var(--devsite-tertiary-text-color))
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-header,devsite-concierge-ai-panel .devsite-concierge-panel-chat-inputs {
    --devsite-button-border: 0;
    --devsite-button-padding: 0;
    --devsite-button-height: auto;
    --devsite-button-background-hover: 0;
    --devsite-button-border-hover: 0;
    --devsite-button-box-shadow-active: 0;
    --devsite-button-background-active: 0;
    --devsite-button-border-active: 0;
    --devsite-button-disabled-background: 0;
    --devsite-button-disabled-border: 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-inputs {
    padding: 0 16px 16px
}

devsite-concierge-ai-panel.new-chat-ui .devsite-concierge-panel-chat-inputs {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

devsite-concierge-ai-panel.new-chat-ui .devsite-concierge-panel-chat-form {
    margin-bottom: 0;
    grid-column: 1
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-input-container {
    --devsite-input-padding: 10px 0;
    --devsite-input-font-size: 13px;
    --devsite-input-line-height: 20px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 0;
    -moz-box-flex: 1;
    -ms-flex: 1 1 0px;
    flex: 1 1 0;
    outline: none
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-disclaimer {
    color: rgba(0,0,0,.55);
    font-size: 11px;
    font-weight: 400;
    line-height: 16px;
    margin: 0;
    padding: 0;
    text-align: center
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-disclaimer {
    color: #9aa0a6
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-disclaimer a {
    color: #3c4043;
    text-decoration: underline
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-disclaimer a {
    color: #e8eaed
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-disclaimer a:focus,devsite-concierge-ai-panel .devsite-concierge-panel-chat-disclaimer a:hover {
    color: #1a73e8
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-disclaimer a:focus,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-disclaimer a:hover {
    color: #8ab4f8
}

devsite-concierge-ai-panel.new-chat-ui .devsite-concierge-panel-chat-button {
    -webkit-margin-after: 0;
    margin-block-end:0;grid-column: 2;
    height: 40px
}

devsite-concierge-ai-panel.new-chat-ui .devsite-concierge-panel-chat-disclaimer {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    margin-top: 8px;
    grid-column: 1/-1
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-width: calc(var(--devsite-concierge-width-open) - 91px);
    padding: 16px 16px 0;
    position: relative;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
    -moz-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    overflow: auto
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-loading {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    width: 100%
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-row {
    -webkit-animation: fadeInChatRow .5s;
    animation: fadeInChatRow .5s;
    margin: 8px 0
}

[type=article] devsite-concierge-ai-panel .devsite-concierge-panel-chat-row p:not(:last-child),[type=pricing] devsite-concierge-ai-panel .devsite-concierge-panel-chat-row p:not(:last-child),[type=product] devsite-concierge-ai-panel .devsite-concierge-panel-chat-row p:not(:last-child),[type=reference] devsite-concierge-ai-panel .devsite-concierge-panel-chat-row p:not(:last-child) {
    margin-bottom: 12px
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-row:first-child {
    margin-top: 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-row:last-child {
    margin-bottom: 0
}

@-webkit-keyframes fadeInChatRow {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,12px,0);
        transform: translate3d(0,12px,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInChatRow {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,12px,0);
        transform: translate3d(0,12px,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-user .devsite-concierge-panel-chat-text {
    white-space: pre-wrap
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code,devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-system,devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-user,devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions {
    color: #3c4043;
    font-size: 13px;
    font-weight: 400;
    line-height: 17px;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-system,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-user,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions {
    color: #e8eaed
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code,devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-system,devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions {
    background: #fff;
    border-radius: 8px;
    padding: 16px 0
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-system,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions {
    background: #202124;
    border: 1px solid #5f6368
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    padding: 16px
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions-icon {
    padding-top: 2px
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions-icon svg {
    width: 16px;
    height: 16px;
    fill: #1a73e8
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions-icon svg {
    fill: #8ab4f8
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code dd,devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code ol,devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code p,devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code ul,devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-system dd,devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-system ol,devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-system p,devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-system ul,devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions dd,devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions ol,devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions p,devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions ul {
    padding: 0 16px
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code ol,devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code ul,devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-system ol,devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-system ul,devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions ol,devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions ul {
    -webkit-margin-start: 16px;
    -moz-margin-start: 16px;
    margin-inline-start:16px}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-references {
    padding: 16px
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-references h3 {
    color: #80868b;
    font-size: 10px;
    line-height: 14px;
    font-weight: 500;
    text-transform: uppercase
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-references ul {
    padding: 0;
    -webkit-margin-start: 0;
    -moz-margin-start: 0;
    margin-inline-start:0}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-references ul li {
    -webkit-margin-start: 0;
    -moz-margin-start: 0;
    margin-inline-start:0;overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0 0 2px;
    list-style: none
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-references ul li a {
    --devsite-link-color: #1967d2
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-references ul li a {
    --devsite-link-color: #8ab4f8
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 16px;
    list-style: none;
    margin: 8px 0 0;
    padding: 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions ul li {
    line-height: 21px;
    margin: 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-quickprompt-questions a {
    font-size: 13px
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-communicating {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 4px;
    padding: 0 16px
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-communicating span {
    -webkit-animation: devsite-concierge-panel-chat-dot-blink 1.5s infinite;
    animation: devsite-concierge-panel-chat-dot-blink 1.5s infinite;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    background-color: #1967d2;
    border-radius: 50%;
    height: 6px;
    opacity: 0;
    width: 6px
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-communicating span {
    background-color: #8ab4f8
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-communicating span:nth-child(2) {
    -webkit-animation-delay: .2s;
    animation-delay: .2s
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-communicating span:nth-child(3) {
    -webkit-animation-delay: .4s;
    animation-delay: .4s
}

@-webkit-keyframes devsite-concierge-panel-chat-dot-blink {
    0%,to {
        opacity: .1
    }

    20% {
        opacity: 1
    }
}

@keyframes devsite-concierge-panel-chat-dot-blink {
    0%,to {
        opacity: .1
    }

    20% {
        opacity: 1
    }
}

devsite-concierge-ai-panel .devsite-concierge-panel-recommendations {
    min-height: 200px
}

devsite-concierge-ai-panel .devsite-concierge-explain-code-popout pre,devsite-concierge-ai-panel devsite-code pre {
    --devsite-code-padding-inline: 16px
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-system devsite-code {
    --devsite-code-margin: 16px 0 0 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-from-system devsite-code:first-child {
    --devsite-code-margin: 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-code-disclaimer {
    color: #3c4043;
    background: #e8eaed;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 12px 14px;
    margin-bottom: 16px;
    font-size: 12px
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-code-disclaimer {
    color: hsla(0,0%,100%,.7);
    background: #2c3649
}

devsite-concierge-ai-panel pre {
    padding-block:var(--devsite-code-padding-block,24px);padding-inline: var(--devsite-code-padding-inline,24px)
}

devsite-concierge-ai-panel pre code {
    font-size: 13px
}

devsite-concierge-ai-panel pre:not([is-upgraded]) {
    margin: 16px 0 0
}

[concierge=modal] devsite-concierge-ai-panel .devsite-concierge-panel-sections {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
}

[concierge=modal] devsite-concierge-ai-panel .devsite-concierge-panel-recommendations {
    -webkit-flex-basis: 286px;
    -ms-flex-preferred-size: 286px;
    flex-basis: 286px
}

[concierge=modal] devsite-concierge-ai-panel .devsite-concierge-panel-chat-section {
    height: 100%;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-flex-shrink: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1
}

[concierge=modal] devsite-concierge-ai-panel .devsite-concierge-panel-chat-container {
    max-width: 100%
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    gap: 8px;
    padding: 16px 16px 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon {
    background: none;
    border: 1px solid #dadce0;
    border-radius: 8px;
    height: 40px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 40px;
    background-color: #fff;
    color: #1a73e8;
    border-color: #dadce0
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon {
    background-color: #2a2b2e;
    color: #8ab4f8;
    border-color: #5f6368
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon:focus,devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon:hover {
    background-color: #e8f0fe;
    color: #1a73e8
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon:focus,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon:hover {
    background-color: #2e3036;
    color: #d2e3fc
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon:active {
    background-color: #d2e3fc;
    color: #174ea6
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon:active {
    background-color: #343942;
    color: #d2e3fc
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon[disabled] {
    background-color: #e8f0fe;
    color: #1967d2;
    border-color: #dadce0
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon[disabled] {
    background-color: #2e3036;
    color: #8ab4f8;
    border-color: #5f6368
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon[disabled]:focus,devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon[disabled]:hover {
    background-color: #d2e3fc;
    color: #174ea6
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon[disabled]:focus,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon[disabled]:hover {
    background-color: #343942;
    color: #8ab4f8
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon[disabled]:active {
    background-color: #d2e3fc;
    color: #174ea6
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon[disabled]:active {
    background-color: #2a2b2e;
    color: #8ab4f8
}

[dir=rtl] devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1)
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-row .feedback-icon.clicked {
    background-color: var(--devsite-button-background-active)
}

devsite-concierge-ai-panel .devsite-concierge-chat-bug-feedback.chat-container {
    padding: 16px
}

devsite-concierge-ai-panel .devsite-concierge-chat-bug-feedback .chat-thanks {
    margin-bottom: 10px
}

devsite-concierge-ai-panel .devsite-concierge-chat-bug-feedback .chat-prompt {
    padding: 0
}

devsite-concierge-ai-panel .devsite-concierge-chat-bug-feedback .chat-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 10px
}

devsite-concierge-ai-panel .devsite-concierge-chat-bug-feedback .chat-button .button {
    --devsite-button-padding: 0 16px;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 20px
}

devsite-concierge-ai-panel .devsite-concierge-chat-bug-feedback .chat-icon {
    margin-right: 0;
    top: 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code .devsite-concierge-explain-code-heading {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 16px
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code .devsite-concierge-explain-code-heading-icon-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code .devsite-concierge-explain-code-heading-icon {
    width: 18px;
    height: 18px;
    fill: #1a73e8
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code .devsite-concierge-explain-code-heading-icon {
    fill: #8ab4f8
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-explain-code .devsite-concierge-explain-code-heading-text {
    font-size: 13px;
    font-weight: 500;
    margin-left: 4px;
    margin-bottom: 0
}

devsite-concierge-ai-panel .devsite-concierge-explain-code-popout {
    margin-top: 8px
}

devsite-concierge-ai-panel .devsite-concierge-explain-code-popout-hidden {
    display: none
}

devsite-concierge-ai-panel devsite-code .devsite-code-buttons-container .devsite-explain-code {
    display: none
}

devsite-concierge-ai-panel .devsite-concierge-explain-code-heading-toggle,devsite-concierge-ai-panel .devsite-concierge-panel-chat--reset {
    background: none;
    border-radius: 50%;
    border: 0;
    height: 32px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 32px;
    background-color: transparent;
    color: #5f6368
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-explain-code-heading-toggle,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat--reset {
    background-color: transparent;
    color: #9aa0a6
}

devsite-concierge-ai-panel .devsite-concierge-explain-code-heading-toggle:focus,devsite-concierge-ai-panel .devsite-concierge-explain-code-heading-toggle:hover,devsite-concierge-ai-panel .devsite-concierge-panel-chat--reset:focus,devsite-concierge-ai-panel .devsite-concierge-panel-chat--reset:hover {
    background-color: rgba(95,99,104,.08);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-explain-code-heading-toggle:focus,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-explain-code-heading-toggle:hover,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat--reset:focus,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat--reset:hover {
    background-color: #3c4043;
    color: #bdc1c6
}

devsite-concierge-ai-panel .devsite-concierge-explain-code-heading-toggle:active,devsite-concierge-ai-panel .devsite-concierge-panel-chat--reset:active {
    background-color: rgba(95,99,104,.12);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-explain-code-heading-toggle:active,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat--reset:active {
    background-color: #505356;
    color: #bdc1c6
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-button {
    background: none;
    border-radius: 50%;
    border: 0;
    height: 32px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 32px;
    background-color: #fff;
    color: #1a73e8;
    border-color: #dadce0;
    direction: unset;
    margin: 4px
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-button {
    background-color: #2a2b2e;
    color: #8ab4f8;
    border-color: #5f6368
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-button:focus,devsite-concierge-ai-panel .devsite-concierge-panel-chat-button:hover {
    background-color: #e8f0fe;
    color: #1a73e8
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-button:focus,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-button:hover {
    background-color: #3f454a;
    color: #8ab4f8
}

devsite-concierge-ai-panel .devsite-concierge-panel-chat-button:active {
    background-color: #e8f0fe;
    color: #1a73e8
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-chat-button:active {
    background-color: #444c55;
    color: #8ab4f8
}

[dir=rtl] devsite-concierge-ai-panel .devsite-concierge-panel-chat-button {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-padding-start: 0;
    -moz-padding-start: 0;
    padding-inline-start:0}

devsite-concierge-ai-panel .devsite-concierge-panel-github-button {
    background: none;
    border-radius: 50%;
    border: 0;
    height: 32px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 32px;
    -webkit-filter: invert(.5);
    filter: invert(.5);
    padding: 4px
}

devsite-concierge-ai-panel .devsite-concierge-panel-github-button:hover {
    cursor: pointer
}

devsite-concierge-ai-panel .devsite-concierge-panel-github-modal {
    background-color: #fff;
    padding: 12px 16px;
    border-bottom: 1px solid #bdc1c6
}

devsite-concierge-ai-panel .devsite-concierge-panel-github-modal h2 {
    font-size: 1rem;
    margin: 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-github-modal p {
    color: var(--devsite-secondary-text-color)
}

devsite-concierge-ai-panel .devsite-concierge-panel-github-modal input {
    width: 100%
}

devsite-concierge-ai-panel .devsite-concierge-panel-github-modal-heading {
    padding-bottom: .75rem
}

devsite-concierge-ai-panel .devsite-concierge-panel-github-modal-field {
    padding-bottom: .25rem
}

devsite-concierge-ai-panel .devsite-concierge-panel-github-modal-field p {
    padding-bottom: .25rem;
    color: #000
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-controls.new-chat-ui.new-chat-ui {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-controls.new-chat-ui.new-chat-ui devsite-feedback {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-controls.new-chat-ui.new-chat-ui .devsite-material-button-icon {
    background: none;
    border-radius: 50%;
    border: 0;
    margin: 0;
    min-width: auto;
    padding: 0;
    background-color: transparent;
    color: #5f6368;
    height: 32px;
    padding: 4px;
    width: 32px
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-header-controls.new-chat-ui.new-chat-ui .devsite-material-button-icon {
    background-color: transparent;
    color: #9aa0a6
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-controls.new-chat-ui.new-chat-ui .devsite-material-button-icon:focus,devsite-concierge-ai-panel .devsite-concierge-panel-header-controls.new-chat-ui.new-chat-ui .devsite-material-button-icon:hover {
    background-color: rgba(95,99,104,.08);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-header-controls.new-chat-ui.new-chat-ui .devsite-material-button-icon:focus,.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-header-controls.new-chat-ui.new-chat-ui .devsite-material-button-icon:hover {
    background-color: #3c4043;
    color: #bdc1c6
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-controls.new-chat-ui.new-chat-ui .devsite-material-button-icon:active {
    background-color: rgba(95,99,104,.12);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-ai-panel .devsite-concierge-panel-header-controls.new-chat-ui.new-chat-ui .devsite-material-button-icon:active {
    background-color: #505356;
    color: #bdc1c6
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-menu {
    position: relative
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-menu .devsite-concierge-panel-header-menu-options {
    background: var(--devsite-background-1);
    border-radius: 4px;
    box-shadow: 0 1px 2px 0 rgba(60,64,67,.3),0 2px 6px 2px rgba(60,64,67,.15);
    position: absolute;
    right: 0;
    top: 40px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    z-index: 10
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-menu .devsite-concierge-panel-header-menu-options ul {
    list-style: none;
    margin: 0;
    padding: 8px 0
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-menu .devsite-concierge-panel-header-menu-options ul li {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    padding: 8px 16px
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-menu .devsite-concierge-panel-header-menu-options ul li:hover {
    background: var(--devsite-background-3);
    cursor: pointer
}

devsite-concierge-ai-panel .devsite-concierge-panel-header-menu .devsite-concierge-panel-header-menu-options ul li a {
    color: var(--devsite-primary-text-color);
    text-decoration: none;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-header {
    padding: 12px 16px;
    border-bottom: var(--devsite-concierge-border)
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-loading,devsite-concierge-api-explorer-panel .devsite-concierge-tos-accept,devsite-concierge-api-explorer-panel .devsite-concierge-tos-intro {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    gap: 12px;
    padding: 0 4px
}

devsite-concierge-api-explorer-panel .devsite-concierge-tos-accept {
    text-align: start;
    gap: 9px
}

devsite-concierge-api-explorer-panel .devsite-concierge-tos-accept .devsite-tos-title {
    color: #3c4043;
    font-size: 16px;
    font-weight: 500
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-tos-accept .devsite-tos-title {
    color: #e8eaed
}

devsite-concierge-api-explorer-panel .devsite-concierge-tos-accept .devsite-tos-button-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
    -webkit-margin-before: 12px;
    margin-block-start:12px;--devsite-button-sibling-gap-x: 0;
    --devsite-button-padding: 0 15px
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-user-button,devsite-concierge-api-explorer-panel .devsite-concierge-tos-intro-button,devsite-concierge-api-explorer-panel .devsite-concierge-tos-reject-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: auto;
    line-height: 1.25;
    min-height: var(--devsite-button-height,36px);
    white-space: normal
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-header-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 40px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-header-row h2 {
    color: var(--devsite-primary-text-color);
    --devsite-h2-margin: 0;
    --devsite-h2-font: 500 16px/24px var(--devsite-headline-font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0;overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-header-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-header-buttons devsite-feedback {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-header-button {
    background: none;
    border-radius: 50%;
    border: 0;
    height: 32px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 32px;
    background-color: transparent;
    color: #5f6368;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-panel-header-button {
    background-color: transparent;
    color: #9aa0a6
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-header-button:focus,devsite-concierge-api-explorer-panel .devsite-concierge-panel-header-button:hover {
    background-color: rgba(95,99,104,.08);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-panel-header-button:focus,.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-panel-header-button:hover {
    background-color: #3c4043;
    color: #bdc1c6
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-header-button:active {
    background-color: rgba(95,99,104,.12);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-panel-header-button:active {
    background-color: #505356;
    color: #bdc1c6
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-sections {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    gap: 10px;
    overflow: auto;
    padding: 16px
}

[concierge=modal] devsite-concierge-api-explorer-panel .devsite-concierge-panel-sections {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    overflow: hidden;
    -webkit-flex-basis: 40%;
    -ms-flex-preferred-size: 40%;
    flex-basis: 40%
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section {
    border: var(--devsite-concierge-border);
    border-radius: 8px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section .devsite-concierge-panel-section-content {
    padding: 16px;
    overflow-wrap: anywhere
}

devsite-concierge-api-explorer-panel .devsite-info-guide-view-release-notes-button {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 10px auto auto;
    padding: 8px 12px 8px 16px;
    gap: 8px;
    border-radius: 4px;
    background: #1a73e8;
    color: #fff;
    font-family: var(--devsite-sys-typescale--button-plain--font-names);
    font-size: var(--devsite-sys-typescale--button-plain--font-size);
    font-weight: var(--devsite-sys-typescale--button-plain--font-weight);
    line-height: var(--devsite-sys-typescale--button-plain--line-height);
    line-height: 20px
}

[concierge=modal] devsite-concierge-api-explorer-panel .devsite-info-guide-view-release-notes-button {
    display: none
}

devsite-concierge-api-explorer-panel .devsite-info-guide-view-release-notes-button:active,devsite-concierge-api-explorer-panel .devsite-info-guide-view-release-notes-button:focus,devsite-concierge-api-explorer-panel .devsite-info-guide-view-release-notes-button:hover {
    background: #185abc;
    color: #fff;
    text-decoration: none
}

devsite-concierge-api-explorer-panel .devsite-info-guide-view-release-notes-button .material-icons {
    top: -1px
}

devsite-concierge-api-explorer-panel .devsite-concierge-info-panel-release-notes {
    display: none
}

[concierge=modal] devsite-concierge-api-explorer-panel .devsite-concierge-info-panel-release-notes {
    display: block;
    -webkit-flex-basis: 60%;
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%
}

[concierge=modal] devsite-concierge-api-explorer-panel .devsite-dialog-footer {
    -webkit-flex-basis: 60%;
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%
}

[layout=docs] devsite-concierge-api-explorer-panel .devsite-concierge-panel-section h1,[layout=docs] devsite-concierge-api-explorer-panel .devsite-concierge-panel-section h2,[layout=docs] devsite-concierge-api-explorer-panel .devsite-concierge-panel-section h3,[layout=docs] devsite-concierge-api-explorer-panel .devsite-concierge-panel-section h4,[layout=docs] devsite-concierge-api-explorer-panel .devsite-concierge-panel-section h5,[layout=docs] devsite-concierge-api-explorer-panel .devsite-concierge-panel-section h6 {
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0;-webkit-padding-end: 0;
    -moz-padding-end: 0;
    padding-inline-end:0}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section-header {
    border-bottom: var(--devsite-concierge-border);
    padding: 14px 16px
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section-fill {
    min-height: 200px;
    overflow: auto;
    -webkit-flex-shrink: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-feedback {
    place-self: flex-end;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section h3 {
    --devsite-h3-margin: 0;
    --devsite-h3-font: 700 13px/21px var(--devsite-headline-font-family);
    font-size: 13px;
    line-height: 21px;
    color: #5f6368
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-panel-section h3 {
    color: #e8eaed
}

[type=article] devsite-concierge-api-explorer-panel .devsite-concierge-panel-section p,[type=pricing] devsite-concierge-api-explorer-panel .devsite-concierge-panel-section p,[type=product] devsite-concierge-api-explorer-panel .devsite-concierge-panel-section p,[type=reference] devsite-concierge-api-explorer-panel .devsite-concierge-panel-section p {
    font-weight: 400;
    font-size: 13px;
    line-height: 21px;
    margin: 0
}

[concierge=modal] devsite-concierge-api-explorer-panel .devsite-concierge-panel-close,[concierge=modal] devsite-concierge-api-explorer-panel .devsite-concierge-panel-fullscreen {
    display: none
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-dock {
    display: none
}

[concierge=modal] devsite-concierge-api-explorer-panel .devsite-concierge-panel-dock {
    display: inline
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section--loading {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 4px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section--loading .devsite-concierge-panel-section-header {
    border-bottom: 1px solid transparent
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section--loading h2.devsite-concierge-panel-skeleton {
    height: 21px
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section--loading .devsite-concierge-panel-skeleton {
    background: var(--tenant-background-3);
    border-radius: 4px;
    margin: 0 0 4px;
    font-size: 13px;
    height: 21px;
    -webkit-animation: pulse 2s infinite;
    animation: pulse 2s infinite
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:first-child {
    width: 100%
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(2) {
    width: 50%
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(3) {
    width: 33%
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(4) {
    width: 66%
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(5) {
    width: 25%
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(6) {
    width: 44%
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-explorer-panel-discover-apis-section {
    --devsite-h3-margin: 0;
    --devsite-h3-font: 500 16px/24px var(--devsite-headline-font-family);
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    gap: 8px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-explorer-panel-discover-apis-section p {
    color: #5f6368;
    font-size: 14px;
    margin: 0
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-explorer-panel-discover-apis-section p {
    color: #e8eaed
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-explorer-panel-discover-apis-section a {
    margin-top: 8px
}

devsite-concierge-api-explorer-panel .devsite-discover-apis-icon {
    margin-bottom: 8px
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-sections.devsite-concierge-api-panel {
    gap: 0;
    overflow: hidden;
    padding: 0
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-panel .devsite-concierge-api-index-section {
    overflow-x: hidden
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-panel .devsite-concierge-api-index-section .devsite-concierge-api-index-no-matches {
    font-style: italic;
    margin-top: 30px;
    text-align: center
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: var(--devsite-concierge-border);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 24px
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header h3 {
    font-size: 16px;
    font-weight: 500;
    margin: 0;
    padding: 0
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-api-index-header-description {
    font-size: 14px;
    margin: 8px 0 16px;
    text-align: center
}

devsite-concierge-api-explorer-panel .devsite-concierge-panel-sections.devsite-concierge-api-panel .devsite-concierge-api-index-header p {
    margin: 0
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-api-index-header-input {
    border: var(--devsite-concierge-border);
    border-color: #dadce0;
    border-radius: var(--devsite-button-border-radius);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    -webkit-padding-start: 10px;
    -moz-padding-start: 10px;
    padding-inline-start:10px;width: 100%
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-api-index-header-input {
    border-color: #5f6368
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-api-index-header-input span {
    color: #5f6368;
    font-size: 20px;
    padding: 8px 0
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-api-index-header-input span {
    color: #e8eaed
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-api-index-header-input .cancel-search-button {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    border-radius: 50%;
    border: none;
    color: #5f6368;
    cursor: pointer;
    font-size: 20px;
    margin: 0 4px;
    padding: 4px
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-api-index-header-input .cancel-search-button {
    color: #e8eaed
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-api-index-header-input .cancel-search-button:hover {
    background-color: var(--devsite-background-3)
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-api-index-header-input input {
    border: none;
    border-radius: 10px;
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color));
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    font-size: 14px;
    padding: 0 4px
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-api-index-header-input input:focus {
    outline: none
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-api-index-header-input input {
    color: #bdc1c6;
    background: var(--devsite-background-1)
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header.devsite-concierge-selected-api-header {
    -webkit-box-align: start;
    -webkit-align-items: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    gap: 16px
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-selected-api-title {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 2px
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-selected-api-title h3 {
    font-weight: 500
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-selected-api-title h3.docked-api-title {
    max-width: 250px;
    text-overflow: ellipsis;
    white-space: nowrap
}

.viewport--mobile devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-selected-api-title h3.docked-api-title {
    max-width: 170px
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-selected-api-title span {
    border-radius: 50%;
    color: #5f6368;
    cursor: pointer;
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px;padding: 2px
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-selected-api-title span {
    color: #e8eaed
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-selected-api-title span:hover {
    background-color: var(--devsite-background-3)
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-selected-api-method-selector-container {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 16px;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    width: 100%
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-selected-api-method-selector-container a {
    font-size: 14px
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header .devsite-concierge-selected-api-method-selector-container span {
    direction: unset;
    font-size: 14px;
    -webkit-margin-start: 4px;
    -moz-margin-start: 4px;
    margin-inline-start:4px;vertical-align: middle
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown {
    border-bottom: var(--devsite-concierge-border)
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown h4 {
    font-family: var(--devsite-headline-font-family)
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown .devsite-concierge-api-index-dropdown-button {
    border-radius: 0;
    border: none;
    padding: 2px
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown .devsite-concierge-api-index-dropdown-header {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 16px
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown .devsite-concierge-api-index-dropdown-header:hover {
    background-color: var(--devsite-background-2)
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown .devsite-concierge-api-index-dropdown-header h4 {
    font-size: 14px;
    margin: 0;
    max-width: 80%
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown .devsite-concierge-api-index-dropdown-description {
    color: var(--devsite-primary-text-color);
    font-size: 14px;
    -webkit-padding-after: 16px;
    padding-block-end:16px;padding-inline:16px}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown .devsite-concierge-api-index-dropdown-description p {
    margin-top: 6px
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-back-button,devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown-toggle {
    background: none;
    border-radius: 50%;
    border: 0;
    height: 32px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 32px;
    background-color: transparent;
    color: #5f6368
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-back-button,.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown-toggle {
    background-color: transparent;
    color: #9aa0a6
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-back-button:focus,devsite-concierge-api-explorer-panel .devsite-concierge-api-back-button:hover,devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown-toggle:focus,devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown-toggle:hover {
    background-color: rgba(95,99,104,.08);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-back-button:focus,.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-back-button:hover,.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown-toggle:focus,.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown-toggle:hover {
    background-color: #3c4043;
    color: #bdc1c6
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-back-button:active,devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown-toggle:active {
    background-color: rgba(95,99,104,.12);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-back-button:active,.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown-toggle:active {
    background-color: #505356;
    color: #bdc1c6
}

[dir=rtl] devsite-concierge-api-explorer-panel .devsite-concierge-api-back-button,[dir=rtl] devsite-concierge-api-explorer-panel .devsite-concierge-api-index-dropdown-toggle {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header.devsite-concierge-selected-api-header devsite-dropdown-list {
    -webkit-align-self: end;
    -ms-flex-item-align: end;
    align-self: end;
    border-radius: 5px;
    border: var(--devsite-primary-border);
    font-family: var(--devsite-headline-font-family);
    font-weight: 500;
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
    --devsite-bookmark-icon-arrow-color: #5f6368;
    --devsite-button-width: 150px;
    --devsite-dropdown-list-border-radius: 2px;
    --devsite-dropdown-list-toggle-border-radius: 4px;
    --devsite-dropdown-list-min-width: 150px;
    --devsite-dropdown-list-toggle-background-hover: var( --devsite-background-3 );
    --devsite-dropdown-list-toogle-button-justify-content: space-between;
    --devsite-dropdown-list-toggle-button-padding: 8px 16px;
    --devsite-popout-max-width-dynamic: 300px
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header.devsite-concierge-selected-api-header devsite-dropdown-list {
    --devsite-bookmark-icon-arrow-color: #e8eaed
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header.devsite-concierge-selected-api-header devsite-dropdown-list p {
    color: #5f6368;
    font-family: var(--devsite-headline-font-family);
    line-height: 20px
}

.color-scheme--dark devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header.devsite-concierge-selected-api-header devsite-dropdown-list p {
    color: #e8eaed
}

devsite-concierge-api-explorer-panel .devsite-concierge-api-index-header.devsite-concierge-selected-api-header devsite-dropdown-list .dropdown-toggle {
    overflow-x: scroll;
    scrollbar-width: none
}

devsite-concierge-apix {
    height: 100%
}

devsite-concierge-apix .apis-explorer {
    background: inherit;
    height: 100%
}

devsite-concierge-apix .apis-explorer iframe {
    height: 100%;
    width: 100%
}

devsite-concierge-info-panel {
    --devsite-toc-border-width: 0;
    --devsite-nav-list-padding-x-start: 0
}

devsite-concierge-info-panel .devsite-concierge-panel-header {
    padding: 12px 16px;
    border-bottom: var(--devsite-concierge-border)
}

devsite-concierge-info-panel .devsite-concierge-panel-loading,devsite-concierge-info-panel .devsite-concierge-tos-accept,devsite-concierge-info-panel .devsite-concierge-tos-intro {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    gap: 12px;
    padding: 0 4px
}

devsite-concierge-info-panel .devsite-concierge-tos-accept {
    text-align: start;
    gap: 9px
}

devsite-concierge-info-panel .devsite-concierge-tos-accept .devsite-tos-title {
    color: #3c4043;
    font-size: 16px;
    font-weight: 500
}

.color-scheme--dark devsite-concierge-info-panel .devsite-concierge-tos-accept .devsite-tos-title {
    color: #e8eaed
}

devsite-concierge-info-panel .devsite-concierge-tos-accept .devsite-tos-button-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
    -webkit-margin-before: 12px;
    margin-block-start:12px;--devsite-button-sibling-gap-x: 0;
    --devsite-button-padding: 0 15px
}

devsite-concierge-info-panel .devsite-concierge-panel-user-button,devsite-concierge-info-panel .devsite-concierge-tos-intro-button,devsite-concierge-info-panel .devsite-concierge-tos-reject-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: auto;
    line-height: 1.25;
    min-height: var(--devsite-button-height,36px);
    white-space: normal
}

devsite-concierge-info-panel .devsite-concierge-panel-header-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 40px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%
}

devsite-concierge-info-panel .devsite-concierge-panel-header-row h2 {
    color: var(--devsite-primary-text-color);
    --devsite-h2-margin: 0;
    --devsite-h2-font: 500 16px/24px var(--devsite-headline-font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0;overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

devsite-concierge-info-panel .devsite-concierge-panel-header-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

devsite-concierge-info-panel .devsite-concierge-panel-header-buttons devsite-feedback {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-concierge-info-panel .devsite-concierge-panel-header-button {
    background: none;
    border-radius: 50%;
    border: 0;
    height: 32px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 32px;
    background-color: transparent;
    color: #5f6368;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.color-scheme--dark devsite-concierge-info-panel .devsite-concierge-panel-header-button {
    background-color: transparent;
    color: #9aa0a6
}

devsite-concierge-info-panel .devsite-concierge-panel-header-button:focus,devsite-concierge-info-panel .devsite-concierge-panel-header-button:hover {
    background-color: rgba(95,99,104,.08);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-info-panel .devsite-concierge-panel-header-button:focus,.color-scheme--dark devsite-concierge-info-panel .devsite-concierge-panel-header-button:hover {
    background-color: #3c4043;
    color: #bdc1c6
}

devsite-concierge-info-panel .devsite-concierge-panel-header-button:active {
    background-color: rgba(95,99,104,.12);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-info-panel .devsite-concierge-panel-header-button:active {
    background-color: #505356;
    color: #bdc1c6
}

devsite-concierge-info-panel .devsite-concierge-panel-sections {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    gap: 10px;
    overflow: auto;
    padding: 16px
}

[concierge=modal] devsite-concierge-info-panel .devsite-concierge-panel-sections {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    overflow: hidden;
    -webkit-flex-basis: 40%;
    -ms-flex-preferred-size: 40%;
    flex-basis: 40%
}

devsite-concierge-info-panel .devsite-concierge-panel-section {
    border: var(--devsite-concierge-border);
    border-radius: 8px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

devsite-concierge-info-panel .devsite-concierge-panel-section .devsite-concierge-panel-section-content {
    padding: 16px;
    overflow-wrap: anywhere
}

devsite-concierge-info-panel .devsite-info-guide-view-release-notes-button {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 10px auto auto;
    padding: 8px 12px 8px 16px;
    gap: 8px;
    border-radius: 4px;
    background: #1a73e8;
    color: #fff;
    font-family: var(--devsite-sys-typescale--button-plain--font-names);
    font-size: var(--devsite-sys-typescale--button-plain--font-size);
    font-weight: var(--devsite-sys-typescale--button-plain--font-weight);
    line-height: var(--devsite-sys-typescale--button-plain--line-height);
    line-height: 20px
}

[concierge=modal] devsite-concierge-info-panel .devsite-info-guide-view-release-notes-button {
    display: none
}

devsite-concierge-info-panel .devsite-info-guide-view-release-notes-button:active,devsite-concierge-info-panel .devsite-info-guide-view-release-notes-button:focus,devsite-concierge-info-panel .devsite-info-guide-view-release-notes-button:hover {
    background: #185abc;
    color: #fff;
    text-decoration: none
}

devsite-concierge-info-panel .devsite-info-guide-view-release-notes-button .material-icons {
    top: -1px
}

devsite-concierge-info-panel .devsite-concierge-info-panel-release-notes {
    display: none
}

[concierge=modal] devsite-concierge-info-panel .devsite-concierge-info-panel-release-notes {
    display: block;
    -webkit-flex-basis: 60%;
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%
}

[concierge=modal] devsite-concierge-info-panel .devsite-dialog-footer {
    -webkit-flex-basis: 60%;
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%
}

[layout=docs] devsite-concierge-info-panel .devsite-concierge-panel-section h1,[layout=docs] devsite-concierge-info-panel .devsite-concierge-panel-section h2,[layout=docs] devsite-concierge-info-panel .devsite-concierge-panel-section h3,[layout=docs] devsite-concierge-info-panel .devsite-concierge-panel-section h4,[layout=docs] devsite-concierge-info-panel .devsite-concierge-panel-section h5,[layout=docs] devsite-concierge-info-panel .devsite-concierge-panel-section h6 {
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0;-webkit-padding-end: 0;
    -moz-padding-end: 0;
    padding-inline-end:0}

devsite-concierge-info-panel .devsite-concierge-panel-section-header {
    border-bottom: var(--devsite-concierge-border);
    padding: 14px 16px
}

devsite-concierge-info-panel .devsite-concierge-panel-section-fill {
    min-height: 200px;
    overflow: auto;
    -webkit-flex-shrink: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1
}

devsite-concierge-info-panel .devsite-concierge-panel-feedback {
    place-self: flex-end;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-concierge-info-panel .devsite-concierge-panel-section h3 {
    --devsite-h3-margin: 0;
    --devsite-h3-font: 700 13px/21px var(--devsite-headline-font-family);
    font-size: 13px;
    line-height: 21px;
    color: #5f6368
}

.color-scheme--dark devsite-concierge-info-panel .devsite-concierge-panel-section h3 {
    color: #e8eaed
}

[type=article] devsite-concierge-info-panel .devsite-concierge-panel-section p,[type=pricing] devsite-concierge-info-panel .devsite-concierge-panel-section p,[type=product] devsite-concierge-info-panel .devsite-concierge-panel-section p,[type=reference] devsite-concierge-info-panel .devsite-concierge-panel-section p {
    font-weight: 400;
    font-size: 13px;
    line-height: 21px;
    margin: 0
}

[concierge=modal] devsite-concierge-info-panel .devsite-concierge-panel-close,[concierge=modal] devsite-concierge-info-panel .devsite-concierge-panel-fullscreen {
    display: none
}

devsite-concierge-info-panel .devsite-concierge-panel-dock {
    display: none
}

[concierge=modal] devsite-concierge-info-panel .devsite-concierge-panel-dock {
    display: inline
}

devsite-concierge-info-panel .devsite-concierge-panel-section--loading {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 4px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

devsite-concierge-info-panel .devsite-concierge-panel-section--loading .devsite-concierge-panel-section-header {
    border-bottom: 1px solid transparent
}

devsite-concierge-info-panel .devsite-concierge-panel-section--loading h2.devsite-concierge-panel-skeleton {
    height: 21px
}

devsite-concierge-info-panel .devsite-concierge-panel-section--loading .devsite-concierge-panel-skeleton {
    background: var(--tenant-background-3);
    border-radius: 4px;
    margin: 0 0 4px;
    font-size: 13px;
    height: 21px;
    -webkit-animation: pulse 2s infinite;
    animation: pulse 2s infinite
}

devsite-concierge-info-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:first-child {
    width: 100%
}

devsite-concierge-info-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(2) {
    width: 50%
}

devsite-concierge-info-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(3) {
    width: 33%
}

devsite-concierge-info-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(4) {
    width: 66%
}

devsite-concierge-info-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(5) {
    width: 25%
}

devsite-concierge-info-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(6) {
    width: 44%
}

devsite-concierge-info-panel .devsite-info-key-takeaways-list {
    font-family: var(--devsite-sys-typeface--body-tertiary--font-names);
    font-size: var(--devsite-sys-typeface--body-tertiary--font-size);
    font-weight: var(--devsite-sys-typeface--body-tertiary--font-weight);
    line-height: var(--devsite-sys-typeface--body-tertiary--line-height);
    margin: 0;
    padding: 0 8px
}

devsite-concierge-info-panel .devsite-info-guide-ai-summary-message {
    margin: 0;
    padding-bottom: 8px
}

devsite-concierge-info-panel .devsite-concierge-info-panel-tags {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-flow: row wrap;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0
}

devsite-concierge-info-panel .devsite-concierge-info-panel-tags li {
    font-family: var(--devsite-sys-typescale--body-m--font-names);
    font-size: var(--devsite-sys-typescale--body-m--font-size);
    letter-spacing: var(--devsite-sys-typescale--body-m--font-tracking);
    line-height: var(--devsite-sys-typescale--body-m--line-height);
    background: #f1f3f4;
    margin: 0;
    padding: 0 8px
}

.color-scheme--dark devsite-concierge-info-panel .devsite-concierge-info-panel-tags li {
    background: #36373a;
    color: #9aa0a6
}

[concierge=open] devsite-concierge-info-panel .devsite-concierge-panel-sections-container {
    height: 100%;
    overflow-y: scroll
}

[concierge=modal] devsite-concierge-info-panel .devsite-concierge-panel-sections-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 100%;
    overflow-y: scroll
}

[concierge=modal] devsite-concierge-info-panel .devsite-concierge-panel-sections-container .devsite-concierge-panel-sections {
    overflow-y: scroll;
    min-width: 300px
}

devsite-concierge-info-panel .devsite-concierge-panel-sections .devsite-concierge-panel-section .devsite-last-modified-status {
    font-family: var(--devsite-sys-typescale--body-m--font-names);
    font-size: var(--devsite-sys-typescale--body-m--font-size);
    letter-spacing: var(--devsite-sys-typescale--body-m--font-tracking);
    line-height: var(--devsite-sys-typescale--body-m--line-height);
    color: #5f6368;
    margin: 8px 16px 0
}

devsite-concierge-info-panel .devsite-page-status-chips {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-concierge-info-panel .devsite-page-status-chip {
    border-radius: 4px;
    margin-left: 16px;
    margin-top: 16px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

devsite-concierge-info-panel .devsite-page-status-chip:before {
    font-family: var(--devsite-sys-typescale--overline-s--font-names);
    font-size: var(--devsite-sys-typescale--overline-s--font-size);
    font-weight: var(--devsite-sys-typescale--overline-s--font-weight);
    letter-spacing: var(--devsite-sys-typescale--overline-s--font-tracking);
    line-height: var(--devsite-sys-typescale--overline-s--line-height);
    text-transform: var(--devsite-sys-typescale--overline-s--text-transform);
    display: block;
    padding: 4px 8px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

devsite-concierge-info-panel .devsite-page-status-chip-confidential {
    background: #fce8e6;
    border: 1px solid #fce8e6;
    color: #a50e0e
}

devsite-concierge-info-panel .devsite-page-status-chip-confidential:before {
    content: "confidential"
}

devsite-concierge-info-panel .devsite-page-status-chip-page-archived {
    background: #fce8e6;
    border: 1px solid #fce8e6;
    color: #a50e0e
}

devsite-concierge-info-panel .devsite-page-status-chip-page-archived:before {
    content: "archived"
}

devsite-concierge-info-panel .devsite-page-status-chip-page-deprecated {
    background: #fef7e0;
    border: 1px solid #fef7e0;
    color: #a50e0e
}

devsite-concierge-info-panel .devsite-page-status-chip-page-deprecated:before {
    content: "deprecated"
}

devsite-concierge-info-panel .devsite-page-status-chip-page-preview {
    background: #f3e8fd;
    border: 1px solid #f3e8fd;
    color: #681da8
}

devsite-concierge-info-panel .devsite-page-status-chip-page-preview:before {
    content: "preview"
}

devsite-concierge-info-panel .devsite-page-status-chip-page-beta {
    background: #f3e8fd;
    border: 1px solid #f3e8fd;
    color: #681da8
}

devsite-concierge-info-panel .devsite-page-status-chip-page-beta:before {
    content: "beta"
}

devsite-concierge-info-panel .devsite-concierge-info-panel-empty {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-top: 100px
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

devsite-concierge-info-panel .devsite-concierge-info-panel-empty svg {
    -webkit-animation: fadeIn .5s;
    animation: fadeIn .5s;
    max-width: 292px
}

devsite-concierge-info-panel .devsite-concierge-info-panel-empty p {
    font-family: var(--devsite-sys-typescale--title-s-brand--font-names);
    font-size: var(--devsite-sys-typescale--title-s-brand--font-size);
    font-weight: var(--devsite-sys-typescale--title-s-brand--font-weight);
    line-height: var(--devsite-sys-typescale--title-s-brand--line-height);
    margin: 16px 32px;
    text-align: center
}

devsite-concierge-info-panel devsite-toc .devsite-nav-heading {
    display: none
}

devsite-concierge-info-panel devsite-toc ul ul {
    --devsite-nav-list-padding-x-start: 12px
}

devsite-concierge-info-panel devsite-toc a.devsite-nav-title {
    color: var(--devsite-nav-title-color,var(--devsite-primary-text-color))
}

devsite-concierge-info-panel devsite-related-entities {
    --devsite-button-color: #5f6368;
    --devsite-button-background: #f1f3f4;
    --devsite-button-background-active: #bdc1c6;
    --devsite-button-background-hover: #dadce0;
    --devsite-button-border: 0;
    font-family: var(--devsite-sys-typeface--body-tertiary--font-names);
    font-size: var(--devsite-sys-typeface--body-tertiary--font-size);
    font-weight: var(--devsite-sys-typeface--body-tertiary--font-weight);
    line-height: var(--devsite-sys-typeface--body-tertiary--line-height)
}

@media screen and (max-width: 1253px) {
    devsite-concierge-info-panel devsite-toc.devsite-toc,devsite-concierge-info-panel devsite-toc[visible].devsite-toc {
        display:block
    }
}

devsite-concierge-info-panel .devsite-info-ai-generated-heading {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 10px
}

devsite-concierge-info-panel .devsite-info-ai-generated-heading .devsite-info-ai-generated-heading-logo {
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px}

devsite-concierge-info-panel .devsite-info-ai-generated-heading .devsite-info-ai-generated-heading-logo svg {
    fill: #3c4043;
    height: 20px;
    width: 20px
}

.color-scheme--dark devsite-concierge-info-panel .devsite-info-ai-generated-heading .devsite-info-ai-generated-heading-logo svg {
    fill: #e8eaed
}

devsite-concierge-info-panel .devsite-info-ai-generated-heading .devsite-info-ai-generated-heading-text {
    color: #3c4043;
    letter-spacing: 3px;
    font-family: Roboto;
    font-size: 9px;
    font-weight: 700;
    line-height: 20px;
    font-style: normal
}

.color-scheme--dark devsite-concierge-info-panel .devsite-info-ai-generated-heading .devsite-info-ai-generated-heading-text {
    color: #e8eaed
}

devsite-concierge-info-panel .devsite-ai-generated-feedback-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 0;
    border-radius: 50%;
    color: #5f6368;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0;
    width: 40px;
    position: relative;
    inset-inline-start: -6px
}

devsite-concierge-info-panel .devsite-ai-generated-feedback-button .material-icons {
    inset-block-start: auto;
    height: 20px;
    margin-block:0;margin-inline:4px;width: 20px
}

.color-scheme--dark devsite-concierge-info-panel .devsite-ai-generated-feedback-button .material-icons {
    color: #9aa0a6
}

devsite-concierge-info-panel .devsite-ai-generated-feedback-button:active,devsite-concierge-info-panel .devsite-ai-generated-feedback-button:hover {
    background: #f1f3f4;
    box-shadow: none
}

.color-scheme--dark devsite-concierge-info-panel .devsite-ai-generated-feedback-button:active,.color-scheme--dark devsite-concierge-info-panel .devsite-ai-generated-feedback-button:hover {
    background: #36373a
}

devsite-concierge-my-activity-panel {
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-header {
    padding: 12px 16px;
    border-bottom: var(--devsite-concierge-border)
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-loading,devsite-concierge-my-activity-panel .devsite-concierge-tos-accept,devsite-concierge-my-activity-panel .devsite-concierge-tos-intro {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    gap: 12px;
    padding: 0 4px
}

devsite-concierge-my-activity-panel .devsite-concierge-tos-accept {
    text-align: start;
    gap: 9px
}

devsite-concierge-my-activity-panel .devsite-concierge-tos-accept .devsite-tos-title {
    color: #3c4043;
    font-size: 16px;
    font-weight: 500
}

.color-scheme--dark devsite-concierge-my-activity-panel .devsite-concierge-tos-accept .devsite-tos-title {
    color: #e8eaed
}

devsite-concierge-my-activity-panel .devsite-concierge-tos-accept .devsite-tos-button-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
    -webkit-margin-before: 12px;
    margin-block-start:12px;--devsite-button-sibling-gap-x: 0;
    --devsite-button-padding: 0 15px
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-user-button,devsite-concierge-my-activity-panel .devsite-concierge-tos-intro-button,devsite-concierge-my-activity-panel .devsite-concierge-tos-reject-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: auto;
    line-height: 1.25;
    min-height: var(--devsite-button-height,36px);
    white-space: normal
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-header-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 40px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-header-row h2 {
    color: var(--devsite-primary-text-color);
    --devsite-h2-margin: 0;
    --devsite-h2-font: 500 16px/24px var(--devsite-headline-font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0;overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-header-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-header-buttons devsite-feedback {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-header-button {
    background: none;
    border-radius: 50%;
    border: 0;
    height: 32px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 32px;
    background-color: transparent;
    color: #5f6368;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.color-scheme--dark devsite-concierge-my-activity-panel .devsite-concierge-panel-header-button {
    background-color: transparent;
    color: #9aa0a6
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-header-button:focus,devsite-concierge-my-activity-panel .devsite-concierge-panel-header-button:hover {
    background-color: rgba(95,99,104,.08);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-my-activity-panel .devsite-concierge-panel-header-button:focus,.color-scheme--dark devsite-concierge-my-activity-panel .devsite-concierge-panel-header-button:hover {
    background-color: #3c4043;
    color: #bdc1c6
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-header-button:active {
    background-color: rgba(95,99,104,.12);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-my-activity-panel .devsite-concierge-panel-header-button:active {
    background-color: #505356;
    color: #bdc1c6
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-sections {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    gap: 10px;
    overflow: auto;
    padding: 16px
}

[concierge=modal] devsite-concierge-my-activity-panel .devsite-concierge-panel-sections {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    overflow: hidden;
    -webkit-flex-basis: 40%;
    -ms-flex-preferred-size: 40%;
    flex-basis: 40%
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section {
    border: var(--devsite-concierge-border);
    border-radius: 8px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section .devsite-concierge-panel-section-content {
    padding: 16px;
    overflow-wrap: anywhere
}

devsite-concierge-my-activity-panel .devsite-info-guide-view-release-notes-button {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 10px auto auto;
    padding: 8px 12px 8px 16px;
    gap: 8px;
    border-radius: 4px;
    background: #1a73e8;
    color: #fff;
    font-family: var(--devsite-sys-typescale--button-plain--font-names);
    font-size: var(--devsite-sys-typescale--button-plain--font-size);
    font-weight: var(--devsite-sys-typescale--button-plain--font-weight);
    line-height: var(--devsite-sys-typescale--button-plain--line-height);
    line-height: 20px
}

[concierge=modal] devsite-concierge-my-activity-panel .devsite-info-guide-view-release-notes-button {
    display: none
}

devsite-concierge-my-activity-panel .devsite-info-guide-view-release-notes-button:active,devsite-concierge-my-activity-panel .devsite-info-guide-view-release-notes-button:focus,devsite-concierge-my-activity-panel .devsite-info-guide-view-release-notes-button:hover {
    background: #185abc;
    color: #fff;
    text-decoration: none
}

devsite-concierge-my-activity-panel .devsite-info-guide-view-release-notes-button .material-icons {
    top: -1px
}

devsite-concierge-my-activity-panel .devsite-concierge-info-panel-release-notes {
    display: none
}

[concierge=modal] devsite-concierge-my-activity-panel .devsite-concierge-info-panel-release-notes {
    display: block;
    -webkit-flex-basis: 60%;
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%
}

[concierge=modal] devsite-concierge-my-activity-panel .devsite-dialog-footer {
    -webkit-flex-basis: 60%;
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%
}

[layout=docs] devsite-concierge-my-activity-panel .devsite-concierge-panel-section h1,[layout=docs] devsite-concierge-my-activity-panel .devsite-concierge-panel-section h2,[layout=docs] devsite-concierge-my-activity-panel .devsite-concierge-panel-section h3,[layout=docs] devsite-concierge-my-activity-panel .devsite-concierge-panel-section h4,[layout=docs] devsite-concierge-my-activity-panel .devsite-concierge-panel-section h5,[layout=docs] devsite-concierge-my-activity-panel .devsite-concierge-panel-section h6 {
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0;-webkit-padding-end: 0;
    -moz-padding-end: 0;
    padding-inline-end:0}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section-header {
    border-bottom: var(--devsite-concierge-border);
    padding: 14px 16px
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section-fill {
    min-height: 200px;
    overflow: auto;
    -webkit-flex-shrink: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-feedback {
    place-self: flex-end;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section h3 {
    --devsite-h3-margin: 0;
    --devsite-h3-font: 700 13px/21px var(--devsite-headline-font-family);
    font-size: 13px;
    line-height: 21px;
    color: #5f6368
}

.color-scheme--dark devsite-concierge-my-activity-panel .devsite-concierge-panel-section h3 {
    color: #e8eaed
}

[type=article] devsite-concierge-my-activity-panel .devsite-concierge-panel-section p,[type=pricing] devsite-concierge-my-activity-panel .devsite-concierge-panel-section p,[type=product] devsite-concierge-my-activity-panel .devsite-concierge-panel-section p,[type=reference] devsite-concierge-my-activity-panel .devsite-concierge-panel-section p {
    font-weight: 400;
    font-size: 13px;
    line-height: 21px;
    margin: 0
}

[concierge=modal] devsite-concierge-my-activity-panel .devsite-concierge-panel-close,[concierge=modal] devsite-concierge-my-activity-panel .devsite-concierge-panel-fullscreen {
    display: none
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-dock {
    display: none
}

[concierge=modal] devsite-concierge-my-activity-panel .devsite-concierge-panel-dock {
    display: inline
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section--loading {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 4px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section--loading .devsite-concierge-panel-section-header {
    border-bottom: 1px solid transparent
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section--loading h2.devsite-concierge-panel-skeleton {
    height: 21px
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section--loading .devsite-concierge-panel-skeleton {
    background: var(--tenant-background-3);
    border-radius: 4px;
    margin: 0 0 4px;
    font-size: 13px;
    height: 21px;
    -webkit-animation: pulse 2s infinite;
    animation: pulse 2s infinite
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:first-child {
    width: 100%
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(2) {
    width: 50%
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(3) {
    width: 33%
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(4) {
    width: 66%
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(5) {
    width: 25%
}

devsite-concierge-my-activity-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(6) {
    width: 44%
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-header {
    padding: 12px 16px;
    border-bottom: var(--devsite-concierge-border)
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-loading,devsite-concierge-recommendations-panel .devsite-concierge-tos-accept,devsite-concierge-recommendations-panel .devsite-concierge-tos-intro {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    gap: 12px;
    padding: 0 4px
}

devsite-concierge-recommendations-panel .devsite-concierge-tos-accept {
    text-align: start;
    gap: 9px
}

devsite-concierge-recommendations-panel .devsite-concierge-tos-accept .devsite-tos-title {
    color: #3c4043;
    font-size: 16px;
    font-weight: 500
}

.color-scheme--dark devsite-concierge-recommendations-panel .devsite-concierge-tos-accept .devsite-tos-title {
    color: #e8eaed
}

devsite-concierge-recommendations-panel .devsite-concierge-tos-accept .devsite-tos-button-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
    -webkit-margin-before: 12px;
    margin-block-start:12px;--devsite-button-sibling-gap-x: 0;
    --devsite-button-padding: 0 15px
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-user-button,devsite-concierge-recommendations-panel .devsite-concierge-tos-intro-button,devsite-concierge-recommendations-panel .devsite-concierge-tos-reject-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: auto;
    line-height: 1.25;
    min-height: var(--devsite-button-height,36px);
    white-space: normal
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-header-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 40px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-header-row h2 {
    color: var(--devsite-primary-text-color);
    --devsite-h2-margin: 0;
    --devsite-h2-font: 500 16px/24px var(--devsite-headline-font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0;overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-header-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-header-buttons devsite-feedback {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-header-button {
    background: none;
    border-radius: 50%;
    border: 0;
    height: 32px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 32px;
    background-color: transparent;
    color: #5f6368;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.color-scheme--dark devsite-concierge-recommendations-panel .devsite-concierge-panel-header-button {
    background-color: transparent;
    color: #9aa0a6
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-header-button:focus,devsite-concierge-recommendations-panel .devsite-concierge-panel-header-button:hover {
    background-color: rgba(95,99,104,.08);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-recommendations-panel .devsite-concierge-panel-header-button:focus,.color-scheme--dark devsite-concierge-recommendations-panel .devsite-concierge-panel-header-button:hover {
    background-color: #3c4043;
    color: #bdc1c6
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-header-button:active {
    background-color: rgba(95,99,104,.12);
    color: #5f6368
}

.color-scheme--dark devsite-concierge-recommendations-panel .devsite-concierge-panel-header-button:active {
    background-color: #505356;
    color: #bdc1c6
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-sections {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    gap: 10px;
    overflow: auto;
    padding: 16px
}

[concierge=modal] devsite-concierge-recommendations-panel .devsite-concierge-panel-sections {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    overflow: hidden;
    -webkit-flex-basis: 40%;
    -ms-flex-preferred-size: 40%;
    flex-basis: 40%
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section {
    border: var(--devsite-concierge-border);
    border-radius: 8px;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section .devsite-concierge-panel-section-content {
    padding: 16px;
    overflow-wrap: anywhere
}

devsite-concierge-recommendations-panel .devsite-info-guide-view-release-notes-button {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 10px auto auto;
    padding: 8px 12px 8px 16px;
    gap: 8px;
    border-radius: 4px;
    background: #1a73e8;
    color: #fff;
    font-family: var(--devsite-sys-typescale--button-plain--font-names);
    font-size: var(--devsite-sys-typescale--button-plain--font-size);
    font-weight: var(--devsite-sys-typescale--button-plain--font-weight);
    line-height: var(--devsite-sys-typescale--button-plain--line-height);
    line-height: 20px
}

[concierge=modal] devsite-concierge-recommendations-panel .devsite-info-guide-view-release-notes-button {
    display: none
}

devsite-concierge-recommendations-panel .devsite-info-guide-view-release-notes-button:active,devsite-concierge-recommendations-panel .devsite-info-guide-view-release-notes-button:focus,devsite-concierge-recommendations-panel .devsite-info-guide-view-release-notes-button:hover {
    background: #185abc;
    color: #fff;
    text-decoration: none
}

devsite-concierge-recommendations-panel .devsite-info-guide-view-release-notes-button .material-icons {
    top: -1px
}

devsite-concierge-recommendations-panel .devsite-concierge-info-panel-release-notes {
    display: none
}

[concierge=modal] devsite-concierge-recommendations-panel .devsite-concierge-info-panel-release-notes {
    display: block;
    -webkit-flex-basis: 60%;
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%
}

[concierge=modal] devsite-concierge-recommendations-panel .devsite-dialog-footer {
    -webkit-flex-basis: 60%;
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%
}

[layout=docs] devsite-concierge-recommendations-panel .devsite-concierge-panel-section h1,[layout=docs] devsite-concierge-recommendations-panel .devsite-concierge-panel-section h2,[layout=docs] devsite-concierge-recommendations-panel .devsite-concierge-panel-section h3,[layout=docs] devsite-concierge-recommendations-panel .devsite-concierge-panel-section h4,[layout=docs] devsite-concierge-recommendations-panel .devsite-concierge-panel-section h5,[layout=docs] devsite-concierge-recommendations-panel .devsite-concierge-panel-section h6 {
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0;-webkit-padding-end: 0;
    -moz-padding-end: 0;
    padding-inline-end:0}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section-header {
    border-bottom: var(--devsite-concierge-border);
    padding: 14px 16px
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section-fill {
    min-height: 200px;
    overflow: auto;
    -webkit-flex-shrink: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-feedback {
    place-self: flex-end;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section h3 {
    --devsite-h3-margin: 0;
    --devsite-h3-font: 700 13px/21px var(--devsite-headline-font-family);
    font-size: 13px;
    line-height: 21px;
    color: #5f6368
}

.color-scheme--dark devsite-concierge-recommendations-panel .devsite-concierge-panel-section h3 {
    color: #e8eaed
}

[type=article] devsite-concierge-recommendations-panel .devsite-concierge-panel-section p,[type=pricing] devsite-concierge-recommendations-panel .devsite-concierge-panel-section p,[type=product] devsite-concierge-recommendations-panel .devsite-concierge-panel-section p,[type=reference] devsite-concierge-recommendations-panel .devsite-concierge-panel-section p {
    font-weight: 400;
    font-size: 13px;
    line-height: 21px;
    margin: 0
}

[concierge=modal] devsite-concierge-recommendations-panel .devsite-concierge-panel-close,[concierge=modal] devsite-concierge-recommendations-panel .devsite-concierge-panel-fullscreen {
    display: none
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-dock {
    display: none
}

[concierge=modal] devsite-concierge-recommendations-panel .devsite-concierge-panel-dock {
    display: inline
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section--loading {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 4px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section--loading .devsite-concierge-panel-section-header {
    border-bottom: 1px solid transparent
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section--loading h2.devsite-concierge-panel-skeleton {
    height: 21px
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section--loading .devsite-concierge-panel-skeleton {
    background: var(--tenant-background-3);
    border-radius: 4px;
    margin: 0 0 4px;
    font-size: 13px;
    height: 21px;
    -webkit-animation: pulse 2s infinite;
    animation: pulse 2s infinite
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:first-child {
    width: 100%
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(2) {
    width: 50%
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(3) {
    width: 33%
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(4) {
    width: 66%
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(5) {
    width: 25%
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section--loading>.devsite-concierge-panel-skeleton:nth-child(6) {
    width: 44%
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-section {
    border: 0
}

devsite-concierge-recommendations-panel .devsite-concierge-panel-recommendations {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

devsite-concierge-recommendations-panel devsite-recommended-content {
    --devsite-card-border: var(--devsite-concierge-border)
}

devsite-concierge-recommendations-panel devsite-recommended-content .skeleton-item {
    --tenant-primary-border: var(--devsite-concierge-border)
}

devsite-concierge-recommendations-panel devsite-recommended-content .devsite-recommended-content-list {
    --devsite-columns: 1;
    --devsite-landing-row-item-gap: 10px
}

devsite-concierge-recommendations-panel devsite-recommended-content .devsite-recommended-content-item {
    padding: 16px
}

.color-scheme--dark devsite-concierge-recommendations-panel devsite-recommended-content .devsite-recommended-content-item-doc-type:before {
    color: #9aa0a6
}

devsite-concierge-recommendations-panel devsite-recommended-content h3.devsite-recommended-content-item-heading {
    min-height: auto;
    font-weight: 500
}

[layout=docs] devsite-concierge-recommendations-panel devsite-recommended-content h3.devsite-recommended-content-item-heading,[layout=full] devsite-concierge-recommendations-panel devsite-recommended-content h3.devsite-recommended-content-item-heading {
    min-height: 0;
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0;-webkit-padding-end: 0;
    -moz-padding-end: 0;
    padding-inline-end:0}

devsite-concierge-recommendations-panel devsite-recommended-content .devsite-recommended-content-item-description {
    min-height: auto
}

devsite-concierge-recommendations-panel devsite-recommended-content .skeleton-list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

devsite-concierge-recommendations-panel devsite-recommended-content .skeleton-list .skeleton-item {
    width: 100%
}

[concierge=modal] devsite-concierge-recommendations-panel .devsite-concierge-panel-sections {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
}

[concierge=modal] devsite-concierge-recommendations-panel .devsite-concierge-panel-recommendations {
    -webkit-flex-shrink: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1
}

[concierge=modal] devsite-concierge-recommendations-panel devsite-recommended-content .devsite-recommended-content-list {
    --devsite-columns: 4;
    --devsite-landing-row-item-gap: 24px
}

@media screen and (max-width: 1253px) {
    [concierge=modal] devsite-concierge-recommendations-panel devsite-recommended-content .devsite-recommended-content-list {
        --devsite-columns:3
    }
}

.devsite-content-excellence-dialog.has-dashboard {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    padding: 0;
    width: 100%
}

.devsite-content-excellence-dialog.has-dashboard .devsite-dialog-contents {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    padding: 0
}

.devsite-content-excellence-dialog.has-dashboard .dialog-title {
    -webkit-border-after: 1px solid #dadce0;
    border-block-end:1px solid #dadce0;display: grid;
    gap: 12px;
    grid-gap: 12px;
    grid-template-areas: "title message close";
    grid-template-columns: auto 1fr auto;
    -webkit-margin-after: 8px;
    margin-block-end:8px;padding-block:20px;padding-inline:24px;width: 100%
}

.devsite-content-excellence-dialog.has-dashboard h3 {
    font: 400 18px/30px var(--devsite-headline-font-family);
    grid-area: title
}

.devsite-content-excellence-dialog.has-dashboard p {
    font: 14px/20px var(--devsite-primary-font-family);
    grid-area: message
}

.devsite-content-excellence-dialog.has-dashboard h3,.devsite-content-excellence-dialog.has-dashboard p {
    -webkit-align-self: baseline;
    -ms-flex-item-align: baseline;
    align-self: baseline;
    margin: 0
}

.devsite-content-excellence-dialog.has-dashboard .devsite-dialog-close {
    align-self: flex-start;
    grid-area: close;
    margin: -4px
}

.devsite-content-excellence-dialog.has-dashboard aside {
    display: grid;
    grid-template-columns: auto 1fr auto;
    -webkit-margin-after: 12px;
    margin-block-end:12px;-webkit-margin-before: 16px;
    margin-block-start:16px;margin-inline:auto;max-width: 800px
}

.devsite-content-excellence-dialog.has-dashboard .dismiss-aside {
    background: var(--devsite-note-notice-background);
    -webkit-margin-start: 16px;
    -moz-margin-start: 16px;
    margin-inline-start:16px}

.devsite-content-excellence-dialog.has-dashboard .dashboard-embed {
    height: 100%;
    padding-inline:40px;width: 100%
}

.devsite-content-excellence-dialog.has-link h3 {
    text-align: initial
}

.devsite-content-excellence-dialog.has-link aside {
    -webkit-margin-after: 0;
    margin-block-end:0}

.devsite-content-excellence-dialog.has-link .devsite-dialog-buttons {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-padding-after: 16px;
    padding-block-end:16px;-webkit-padding-before: 8px;
    padding-block-start:8px;padding-inline:16px}

devsite-content-footer {
    clear: both;
    color: var(--devsite-secondary-text-rgba);
    display: block;
    font: 13px/20px var(--devsite-primary-font-family)
}

devsite-content-footer :link,devsite-content-footer :visited {
    color: var(--devsite-contrast-link-color)
}

.glue-cookie-notification-bar {
    box-shadow: 0 2px 3px 0 rgba(60,64,67,.3),0 6px 10px 4px rgba(60,64,67,.15);
    background: #fff;
    bottom: 0;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: grid;
    font-size: 1rem;
    grid-gap: 8px;
    grid-template-columns: auto auto;
    left: 0;
    padding: 8px;
    position: fixed;
    width: 100%;
    z-index: 1000
}

.glue-cookie-notification-bar[aria-hidden=true] {
    display: none
}

@media (min-width: 600px) {
    .glue-cookie-notification-bar {
        grid-template-columns:1fr auto;
        justify-items: flex-end
    }
}

@media (min-width: 1024px) {
    .glue-cookie-notification-bar {
        grid-template-columns:1fr auto auto
    }
}

@media (-ms-high-contrast:active),(forced-colors:active) {
    .glue-cookie-notification-bar {
        border-top: 1px solid transparent
    }
}

@media print {
    .glue-cookie-notification-bar {
        display: none
    }
}

.glue-cookie-notification-bar__text {
    font-family: Google Sans Text,Roboto,Arial,Helvetica,sans-serif;
    font-size: 1.125em;
    line-height: 1.5555555556;
    font-weight: 400;
    letter-spacing: normal;
    align-self: center;
    color: #5f6368;
    grid-column: span 2;
    justify-self: flex-start;
    margin: 0;
    padding: 4px 12px
}

[lang=ar] .glue-cookie-notification-bar__text {
    font-family: Google Sans Text,Google Sans Arabic,Roboto,Arial,Helvetica,sans-serif
}

[lang=ja] .glue-cookie-notification-bar__text {
    font-family: Google Sans Text,Google Sans Japanese,Noto Sans JP,Roboto,Arial,Helvetica,sans-serif
}

[lang=ko] .glue-cookie-notification-bar__text {
    font-family: Google Sans Text,Google Sans Korean,Noto Sans KR,Roboto,Arial,Helvetica,sans-serif
}

[lang=zh-CN] .glue-cookie-notification-bar__text {
    font-family: Google Sans Text,Google Sans Simplified Chinese,Noto Sans SC,Roboto,Arial,Helvetica,sans-serif
}

[lang=zh-TW] .glue-cookie-notification-bar__text {
    font-family: Google Sans Text,Google Sans Traditional Chinese,Noto Sans TC,Roboto,Arial,Helvetica,sans-serif
}

@media (min-width: 1024px) {
    .glue-cookie-notification-bar__text {
        grid-column:span 1
    }
}

.glue-cookie-notification-bar__text,.glue-cookie-notification-bar__text * {
    -moz-osx-font-smoothing: initial;
    -webkit-font-smoothing: initial;
    text-rendering: auto
}

.glue-cookie-notification-bar__more {
    background: transparent;
    border-radius: 4px;
    color: #1a73e8;
    display: inline;
    overflow: hidden;
    text-decoration: underline;
    -webkit-transition: background-color .2s,color .2s;
    transition: background-color .2s,color .2s;
    border-bottom: 0;
    font-weight: inherit;
    letter-spacing: inherit
}

.glue-cookie-notification-bar__more:active,.glue-cookie-notification-bar__more:focus,.glue-cookie-notification-bar__more:hover {
    color: #174ea6
}

.glue-cookie-notification-bar__more:visited {
    color: #681da8
}

.glue-cookie-notification-bar__more:active,.glue-cookie-notification-bar__more:focus,.glue-cookie-notification-bar__more:hover {
    cursor: pointer;
    outline: none
}

.glue-cookie-notification-bar__more:hover {
    background-color: rgba(26,115,232,.04)
}

.glue-cookie-notification-bar__more:focus {
    outline: 2px solid transparent;
    background-color: rgba(26,115,232,.12);
    box-shadow: 0 0 0 2px #1a73e8;
    z-index: 1
}

.glue-cookie-notification-bar__more:active {
    background-color: rgba(26,115,232,.1);
    box-shadow: none;
    outline: 2px auto Highlight;
    outline: 5px auto -webkit-focus-ring-color
}

.glue-cookie-notification-bar__more img {
    border: 0
}

.glue-cookie-notification-bar__accept,.glue-cookie-notification-bar__reject {
    font-size: 1rem;
    line-height: 1.5;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start;
    border: 1px solid transparent;
    border-radius: 48px;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-flow: row nowrap;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    font-family: Google Sans,Arial,Helvetica,sans-serif;
    font-weight: 500;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    letter-spacing: .5px;
    margin: 8px 0;
    max-width: 380px;
    min-height: 48px;
    min-width: 96px;
    overflow: hidden;
    padding: 12px 24px 12px 24px;
    text-align: center;
    text-decoration: none;
    -webkit-transition: background-color .2s,box-shadow .2s,color .2s;
    transition: background-color .2s,box-shadow .2s,color .2s;
    vertical-align: middle;
    background-color: #1a73e8;
    color: #fff;
    font-size: 1em;
    cursor: pointer;
    margin: auto 0 0;
    max-width: unset
}

[lang=ar] .glue-cookie-notification-bar__accept,[lang=ar] .glue-cookie-notification-bar__reject {
    font-family: Google Sans,Google Sans Arabic,Arial,Helvetica,sans-serif
}

[lang=ja] .glue-cookie-notification-bar__accept,[lang=ja] .glue-cookie-notification-bar__reject {
    font-family: Google Sans,Google Sans Japanese,Noto Sans JP,Arial,Helvetica,sans-serif
}

[lang=ko] .glue-cookie-notification-bar__accept,[lang=ko] .glue-cookie-notification-bar__reject {
    font-family: Google Sans,Google Sans Korean,Noto Sans KR,Arial,Helvetica,sans-serif
}

[lang=zh-CN] .glue-cookie-notification-bar__accept,[lang=zh-CN] .glue-cookie-notification-bar__reject {
    font-family: Google Sans,Google Sans Simplified Chinese,Noto Sans SC,Arial,Helvetica,sans-serif
}

[lang=zh-TW] .glue-cookie-notification-bar__accept,[lang=zh-TW] .glue-cookie-notification-bar__reject {
    font-family: Google Sans,Google Sans Traditional Chinese,Noto Sans TC,Arial,Helvetica,sans-serif
}

@media (-ms-high-contrast:active),(forced-colors:active) {
    .glue-cookie-notification-bar__accept,.glue-cookie-notification-bar__reject {
        -webkit-transition: none;
        transition: none
    }
}

.glue-cookie-notification-bar__accept:focus,.glue-cookie-notification-bar__reject:focus {
    outline: 2px solid transparent;
    -webkit-transition: none;
    transition: none
}

@media (-ms-high-contrast:active),(forced-colors:active) {
    .glue-cookie-notification-bar__accept,.glue-cookie-notification-bar__reject {
        forced-color-adjust: none;
        background: buttonText;
        border-color: buttonFace;
        color: buttonFace
    }

    .glue-cookie-notification-bar__accept svg,.glue-cookie-notification-bar__reject svg {
        fill: buttonFace
    }
}

.glue-cookie-notification-bar__accept:visited,.glue-cookie-notification-bar__reject:visited {
    background-color: #1a73e8;
    color: #fff
}

@media (-ms-high-contrast:active),(forced-colors:active) {
    .glue-cookie-notification-bar__accept:visited,.glue-cookie-notification-bar__reject:visited {
        forced-color-adjust: none;
        background: buttonText;
        border-color: buttonFace;
        color: buttonFace
    }

    .glue-cookie-notification-bar__accept:visited svg,.glue-cookie-notification-bar__reject:visited svg {
        fill: buttonFace
    }
}

.glue-cookie-notification-bar__accept:hover,.glue-cookie-notification-bar__reject:hover {
    background-color: #185abc;
    box-shadow: 0 1px 2px 0 rgba(60,64,67,.3),0 1px 3px 1px rgba(60,64,67,.15)
}

@media (-ms-high-contrast:active),(forced-colors:active) {
    .glue-cookie-notification-bar__accept:hover,.glue-cookie-notification-bar__reject:hover {
        forced-color-adjust: none;
        background: buttonFace;
        border-color: buttonText;
        color: buttonText
    }

    .glue-cookie-notification-bar__accept:hover svg,.glue-cookie-notification-bar__reject:hover svg {
        fill: buttonText
    }
}

.glue-cookie-notification-bar__accept:focus,.glue-cookie-notification-bar__reject:focus {
    background-color: #185abc;
    border-color: #fff;
    box-shadow: 0 0 0 2px #185abc
}

@media (-ms-high-contrast:active),(forced-colors:active) {
    .glue-cookie-notification-bar__accept:focus,.glue-cookie-notification-bar__reject:focus {
        forced-color-adjust: none;
        background: buttonFace;
        border-color: buttonText;
        color: buttonText;
        outline: 2px solid highlight
    }

    .glue-cookie-notification-bar__accept:focus svg,.glue-cookie-notification-bar__reject:focus svg {
        fill: buttonText
    }
}

.glue-cookie-notification-bar__accept:active,.glue-cookie-notification-bar__reject:active {
    background-color: #185abc;
    border: 1px solid transparent;
    box-shadow: 0 1px 2px 0 rgba(60,64,67,.3),0 2px 6px 2px rgba(60,64,67,.15)
}

@media (-ms-high-contrast:active),(forced-colors:active) {
    .glue-cookie-notification-bar__accept:active,.glue-cookie-notification-bar__reject:active {
        forced-color-adjust: none;
        background: buttonFace;
        border-color: buttonText;
        color: buttonText
    }

    .glue-cookie-notification-bar__accept:active svg,.glue-cookie-notification-bar__reject:active svg {
        fill: buttonText
    }
}

.glue-cookie-notification-bar__accept:last-child {
    grid-column: span 2
}

.glue-cookie-notification-bar-control[aria-hidden=true] {
    display: none
}

button.glue-cookie-notification-bar-control.glue-footer__link {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: 0;
    border-radius: 4px;
    padding: 0
}

@media (-ms-high-contrast:active),(forced-colors:active) {
    button.glue-cookie-notification-bar-control.glue-footer__link {
        color: linkText
    }

    button.glue-cookie-notification-bar-control.glue-footer__link:focus {
        outline: 2px solid transparent
    }
}

.glue-footer__global-links-list-item[aria-hidden=true],.h-c-footer__global-links-list-item[aria-hidden=true] {
    display: none
}

devsite-cookie-notification-bar {
    --devsite-cookie-bar-font-size: 16px
}

devsite-cookie-notification-bar .glue-cookie-notification-bar {
    background-color: #e8f0fe;
    font-size: var(--devsite-cookie-bar-font-size)!important;
    padding: 12px 16px;
    z-index: 1018
}

.color-scheme--dark devsite-cookie-notification-bar .glue-cookie-notification-bar {
    background-color: #202124
}

devsite-cookie-notification-bar .glue-cookie-notification-bar__text {
    color: #202124;
    font-size: var(--devsite-cookie-bar-font-size);
    padding-inline:8px}

.color-scheme--dark devsite-cookie-notification-bar .glue-cookie-notification-bar__text {
    color: #dadce0
}

devsite-cookie-notification-bar .glue-cookie-notification-bar__more {
    color: #1967d2
}

.color-scheme--dark devsite-cookie-notification-bar .glue-cookie-notification-bar__more {
    color: #8ab4f8
}

devsite-cookie-notification-bar .glue-cookie-notification-bar__accept,devsite-cookie-notification-bar .glue-cookie-notification-bar__reject {
    font-size: 14px;
    height: 40px;
    margin: auto 0;
    min-height: 40px
}

.color-scheme--dark devsite-cookie-notification-bar .glue-cookie-notification-bar__accept,.color-scheme--dark devsite-cookie-notification-bar .glue-cookie-notification-bar__reject {
    color: #202124;
    background-color: #8ab4f8
}

devsite-countdown {
    --devsite-countdown-box-height: 158px;
    --devsite-countdown-box-margin: 0 12px;
    --devsite-countdown-box-width: 220px;
    --devsite-countdown-display: flex;
    --devsite-countdown-gap: unset;
    --devsite-countdown-grid: unset;
    --devsite-countdown-label-font: 500 32px "Google Sans";
    --devsite-countdown-number-font: 700 64px/56px "Google Sans";
    --devsite-countdown-box-border: 1px solid #dadce0;
    --devsite-countdown-box-border-radius: 8px;
    --devsite-countdown-box-padding: 20px;
    --devsite-countdown-box-flex-drection: column;
    --devsite-countdown-box-align-items: center;
    --devsite-countdown-box-justify-content: center;
    --devsite-countdown-box-gap: unset
}

@media screen and (max-width: 825px) {
    devsite-countdown {
        --devsite-countdown-box-height:100px;
        --devsite-countdown-box-margin: 0;
        --devsite-countdown-box-width: 100%;
        --devsite-countdown-display: grid;
        --devsite-countdown-gap: 10px 18px;
        --devsite-countdown-grid: auto-flow/1fr 1fr;
        --devsite-countdown-label-font: 500 22px "Google Sans";
        --devsite-countdown-number-font: 700 44px/56px "Google Sans"
    }
}

devsite-countdown {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: var(--devsite-countdown-display);
    gap: var(--devsite-countdown-gap);
    grid: var(--devsite-countdown-grid);
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: var(--devsite-countdown-box-padding)
}

devsite-countdown .devsite-countdown-box {
    -webkit-box-align: var(--devsite-countdown-box-align-items);
    -webkit-align-items: var(--devsite-countdown-box-align-items);
    -moz-box-align: var(--devsite-countdown-box-align-items);
    -ms-flex-align: var(--devsite-countdown-box-align-items);
    align-items: var(--devsite-countdown-box-align-items);
    border: var(--devsite-countdown-box-border);
    border-radius: var(--devsite-countdown-box-border-radius);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: var(--devsite-countdown-box-flex-drection);
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: var(--devsite-countdown-box-flex-drection);
    flex-direction: var(--devsite-countdown-box-flex-drection);
    gap: var(--devsite-countdown-box-gap);
    height: var(--devsite-countdown-box-height);
    -webkit-box-pack: var(--devsite-countdown-box-justify-content);
    -webkit-justify-content: var(--devsite-countdown-box-justify-content);
    -moz-box-pack: var(--devsite-countdown-box-justify-content);
    -ms-flex-pack: var(--devsite-countdown-box-justify-content);
    justify-content: var(--devsite-countdown-box-justify-content);
    margin: var(--devsite-countdown-box-margin);
    width: var(--devsite-countdown-box-width)
}

devsite-countdown .devsite-countdown-number {
    font: var(--devsite-countdown-number-font)
}

devsite-countdown .devsite-countdown-label {
    font: var(--devsite-countdown-label-font)
}

devsite-credentials-dialog {
    border: 1px dashed #f439a0;
    cursor: pointer;
    padding: 2px
}

.color-scheme--dark devsite-credentials-dialog {
    border-color: #fba9d6
}

.devsite-credentials-dialog .devsite-credentials-dialog-credentials,.devsite-credentials-dialog .devsite-credentials-dialog-oauth-message,.devsite-credentials-dialog .devsite-credentials-dialog-projects {
    margin-top: 16px
}

.devsite-credentials-dialog devsite-spinner {
    margin: auto
}

.devsite-credentials-dialog .devsite-credentials-dialog-selector {
    width: 100%
}

devsite-credits-banner {
    display: block;
    margin: 16px 0;
    position: relative
}

devsite-credits-banner .devsite-credits-banner-inner {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #e6f4ea;
    border: 1px solid #ceead6;
    border-left: 5px solid #188038;
    border-radius: 4px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 16px
}

devsite-credits-banner .devsite-credits-banner-inner:before {
    content: "";
    display: none
}

devsite-credits-banner .devsite-credits-banner-inner .devsite-credits-banner-icon {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-margin-end: 16px;
    -moz-margin-end: 16px;
    margin-inline-end:16px}

devsite-credits-banner .devsite-credits-banner-inner .devsite-credits-banner-icon .material-icons {
    font-size: 24px;
    color: #188038
}

devsite-credits-banner .devsite-credits-banner-inner.devsite-credits-banner-inner .devsite-credits-banner-content {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

devsite-credits-banner .devsite-credits-banner-inner.devsite-credits-banner-inner .devsite-credits-banner-content .devsite-credits-banner-heading {
    margin: 0 0 4px;
    font-size: 16px;
    font-weight: 700;
    color: #202124;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-credits-banner .devsite-credits-banner-inner.devsite-credits-banner-inner .devsite-credits-banner-content p {
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    color: #3c4043
}

devsite-credits-banner .devsite-credits-banner-inner.devsite-credits-banner-inner .devsite-credits-banner-content p a {
    color: #185abc
}

devsite-credits-banner .devsite-credits-banner-inner.devsite-credits-banner-inner .devsite-credits-banner-content .devsite-credits-banner-tag {
    background-color: #188038;
    color: var(--devsite-inverted-text-color);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    -webkit-margin-start: 12px;
    -moz-margin-start: 12px;
    margin-inline-start:12px;display: inline-block;
    line-height: 16px;
    vertical-align: middle
}

devsite-credits-banner .devsite-credits-banner-inner.devsite-credits-banner-inner .devsite-credits-banner-content .credit-details {
    margin-top: 12px;
    font-size: 14px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px 24px
}

devsite-credits-banner .devsite-credits-banner-inner.devsite-credits-banner-inner .devsite-credits-banner-content .credit-details p {
    margin: 0;
    color: #3c4043;
    font-weight: 400
}

devsite-credits-banner .devsite-credits-banner-inner.devsite-credits-banner-inner .devsite-credits-banner-content .credit-details p strong {
    color: #202124;
    font-weight: 500;
    -webkit-margin-end: 4px;
    -moz-margin-end: 4px;
    margin-inline-end:4px}

devsite-credits-banner .devsite-credits-banner-inner button {
    -webkit-margin-start: 16px;
    -moz-margin-start: 16px;
    margin-inline-start:16px;-webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

devsite-credits-banner .devsite-credits-banner-inner.ERROR {
    border-color: #fcc934;
    background-color: #fef7e0
}

devsite-credits-banner .devsite-credits-banner-inner.ERROR .devsite-credits-banner-icon .material-icons {
    color: #e37400
}

devsite-credits-banner .devsite-credits-banner-inner.ERROR .devsite-credits-banner-content h3,devsite-credits-banner .devsite-credits-banner-inner.ERROR .devsite-credits-banner-content p {
    color: #e37400
}

devsite-credits-banner devsite-dialog .devsite-dialog-contents h3 {
    margin-top: 0;
    font-size: 20px;
    font-weight: 500
}

devsite-credits-banner devsite-dialog .devsite-dialog-contents p {
    font-size: 14px;
    color: var(--devsite-secondary-text-color);
    line-height: 20px
}

devsite-cse {
    display: block
}

devsite-cse table {
    border-collapse: inherit;
    margin: 0
}

devsite-cse tr {
    background: var(--devsite-background-1);
    border: 0
}

devsite-cse td {
    padding: 0
}

devsite-cse .gsc-control-cse,devsite-cse .gsc-control-cse .gsc-table-result {
    background: 0;
    border: 0;
    font: 400 16px/24px var(--devsite-primary-font-family);
    padding: 0
}

devsite-cse .gsc-above-wrapper-area {
    display: none
}

devsite-cse .gsc-results {
    width: 100%
}

devsite-cse .has-cse-filter .gsc-webResult.gsc-result:has(.gs-spelling) {
    display: none
}

devsite-cse .gsc-results .gsc-imageResult,devsite-cse .gsc-webResult.gsc-result,devsite-cse .gsc-webResult.gsc-result:hover {
    background: 0
}

devsite-cse .gsc-results .gsc-cursor-box {
    margin: 8px 0
}

devsite-cse .gsc-table-result,devsite-cse .gsc-thumbnail-inside,devsite-cse .gsc-url-top {
    padding-left: 0;
    padding-right: 0
}

devsite-cse .gs-error-result .gs-snippet,devsite-cse .gs-no-results-result .gs-snippet,devsite-cse .gs-webResult:not(.gs-no-results-result):not(.gs-error-result) .gs-snippet {
    color: var(--devsite-primary-text-color)
}

devsite-cse .gs-error-result .gs-snippet,devsite-cse .gs-no-results-result .gs-snippet {
    background: 0;
    border: 0;
    margin: 0;
    padding: 0
}

devsite-cse .gcsc-find-more-on-google {
    margin: 0
}

devsite-cse .has-cse-filter .gcsc-find-more-on-google {
    display: none
}

devsite-cse .gcsc-find-more-on-google,devsite-cse .gsc-control-cse .gs-imageResult a.gs-title:link,devsite-cse .gsc-control-cse .gs-imageResult a.gs-title:link b,devsite-cse .gsc-control-cse .gs-imageResult a.gs-title:visited,devsite-cse .gsc-control-cse .gs-imageResult a.gs-title:visited b,devsite-cse .gsc-control-cse .gs-result .gs-title,devsite-cse .gsc-control-cse .gs-result .gs-title *,devsite-cse .gsc-control-cse .gs-webResult.gs-result a.gs-title:link,devsite-cse .gsc-control-cse .gs-webResult.gs-result a.gs-title:link b,devsite-cse .gsc-control-cse .gs-webResult.gs-result a.gs-title:visited,devsite-cse .gsc-control-cse .gs-webResult.gs-result a.gs-title:visited b {
    color: var(--devsite-link-color);
    font: 500 16px/24px var(--devsite-primary-font-family);
    height: auto;
    text-decoration: none
}

devsite-cse .gcsc-find-more-on-google-magnifier {
    fill: var(--devsite-link-color)
}

devsite-cse .gsc-results .gsc-cursor-box .gsc-cursor-page {
    background: 0;
    border-color: transparent;
    color: var(--devsite-link-color)
}

devsite-cse .gsc-control-cse .gs-imageResult a.gs-title:focus,devsite-cse .gsc-control-cse .gs-result .gs-title:focus,devsite-cse .gsc-control-cse .gs-webResult.gs-result a.gs-title:focus {
    text-decoration: underline
}

devsite-cse .gsc-control-cse .gs-result .gs-title b {
    font-weight: 700
}

devsite-cse .gs-imageResult div.gs-visibleUrl,devsite-cse .gs-webResult div.gs-visibleUrl {
    color: var(--devsite-search-results-breadcrumb-color);
    font-size: 14px
}

devsite-cse .gcsc-branding {
    display: none
}

devsite-device {
    display: block;
    margin: 16px 0
}

devsite-device>.devsite-device-options {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 12px;
    margin: 0 0 24px
}

devsite-device .devsite-device-input {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 0 24px
}

devsite-device .devsite-device-input>input {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-inline:0 16px}

devsite-device [type=radio],devsite-device [type=radio]:after,devsite-device [type=radio]:before {
    display: none
}

devsite-device [type=radio]+label {
    border: var(--devsite-primary-border);
    box-shadow: none;
    font: 500 14px/36px var(--devsite-headline-font-family);
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 16px;
    color: var(--devsite-link-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 32px;
    padding: 0 16px;
    -webkit-transition: background .2s,border .2s,box-shadow .2s,color .2s;
    transition: background .2s,border .2s,box-shadow .2s,color .2s
}

devsite-device [type=radio]+label:focus,devsite-device [type=radio]+label:hover {
    background: var(--devsite-link-background-active)
}

devsite-device [type=radio]:checked+label {
    background: var(--devsite-link-color);
    border-color: var(--devsite-link-color);
    color: var(--devsite-inverted-text-color)
}

devsite-device>.devsite-device {
    overflow: hidden;
    position: relative
}

devsite-device[device=desktop]>.devsite-device {
    max-width: 100%;
    padding-bottom: 62.5%
}

devsite-device[device=tablet]>.devsite-device {
    max-width: 60%;
    padding-bottom: 80%
}

devsite-device[device=mobile]>.devsite-device {
    max-width: 32.109375%;
    padding-bottom: 57.109375%
}

devsite-device iframe {
    background: var(--devsite-background-1);
    border: solid var(--devsite-device-border-color);
    height: 166.6666666667%;
    position: absolute;
    -webkit-transform: scale(.6);
    transform: scale(.6);
    width: 166.6666666667%
}

[dir=ltr] devsite-device iframe {
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0
}

[dir=rtl] devsite-device iframe {
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0
}

devsite-device[device=desktop] iframe {
    border-radius: 16px;
    border-width: 32px 16px
}

devsite-device[device=tablet] iframe {
    border-radius: 24px;
    border-width: 60px 16px
}

devsite-device[device=mobile] iframe {
    border-radius: 36px;
    border-width: 60px 12px
}

devsite-dropdown-list:not([rendered]) {
    background: 0;
    visibility: hidden;
    position: relative;
    z-index: 2
}

devsite-dropdown-list[rendered] {
    visibility: visible
}

devsite-dropdown-list[icon-toggle] {
    --devsite-dropdown-list-toggle-height: 28px;
    --devsite-dropdown-list-toggle-width: 28px
}

devsite-dynamic-content {
    display: block;
    margin: var(--devsite-dynamic-content-margin,20px 0);
    width: 100%
}

.devsite-dynamic-content-display-tag-container {
    list-style: none;
    padding: 12px 0
}

.devsite-dynamic-content-display-tag-container:empty {
    display: none
}

devsite-dynamic-content .devsite-card-progress {
    background: var(--devsite-progress-background);
    height: 2px;
    margin: 0 -16px;
    overflow: hidden;
    width: auto
}

devsite-dynamic-content .devsite-card-progress-bar {
    background: var(--devsite-progress-bar-color);
    height: 2px;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
    -webkit-transition: background .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1);
    transition: background .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1);
    transition: transform .213s cubic-bezier(0,0,.2,1),background .213s cubic-bezier(0,0,.2,1);
    transition: transform .213s cubic-bezier(0,0,.2,1),background .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1)
}

devsite-dynamic-content .devsite-card-progress-info {
    font: 13px/20px var(--devsite-primary-font-family);
    margin-top: 2px;
    opacity: 0;
    -webkit-transform: translateY(12px);
    transform: translateY(12px);
    -webkit-transition: opacity .213s cubic-bezier(.4,0,1,1),-webkit-transform .213s cubic-bezier(.4,0,1,1);
    transition: opacity .213s cubic-bezier(.4,0,1,1),-webkit-transform .213s cubic-bezier(.4,0,1,1);
    transition: transform .213s cubic-bezier(.4,0,1,1),opacity .213s cubic-bezier(.4,0,1,1);
    transition: transform .213s cubic-bezier(.4,0,1,1),opacity .213s cubic-bezier(.4,0,1,1),-webkit-transform .213s cubic-bezier(.4,0,1,1)
}

devsite-dynamic-content .devsite-card-progress-info.show {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: opacity .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1);
    transition: opacity .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1);
    transition: transform .213s cubic-bezier(0,0,.2,1),opacity .213s cubic-bezier(0,0,.2,1);
    transition: transform .213s cubic-bezier(0,0,.2,1),opacity .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1)
}

devsite-dynamic-content .devsite-card-progress-info:empty:before {
    content: " "
}

devsite-dynamic-content .devsite-card-summary {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    display: -webkit-box;
    max-height: 96px;
    overflow: hidden
}

devsite-dynamic-content .devsite-dynamic-content-no-results {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-background-1);
    border: var(--devsite-secondary-border);
    border-radius: var(--devsite-card-border-radius);
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 32px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-width: 100%;
    padding: 25px 55px;
    width: 100%
}

devsite-dynamic-content .devsite-dynamic-content-no-results-image {
    display: var(--devsite-dynamic-content-no-results-image-display,block);
    max-width: 100%;
    width: 250px
}

devsite-dynamic-content devsite-pagination {
    margin-top: 20px
}

devsite-dynamic-hero {
    display: none
}

devsite-dynamic-hero img {
    object-fit: contain;
    padding: 50px
}

devsite-dynamic-hero .scale-down img {
    max-height: 180px;
    object-fit: scale-down;
    padding: 0
}

devsite-dynamic-hero a:focus {
    text-decoration: none
}

devsite-dynamic-hero .devsite-landing-row-item-description-content {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    max-width: 90%;
    overflow: hidden;
    text-overflow: ellipsis
}

devsite-dynamic-hero .devsite-landing-row-item-image .material-icons {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 190px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 55px
}

.dgc-hero.fade-in {
    -webkit-animation: dynamic-hero-fade-in 1s;
    animation: dynamic-hero-fade-in 1s;
    background: url(../images/dynamic-hero-background.svg) 100%/contain no-repeat;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.color-scheme--dark .dgc-hero.fade-in {
    background-image: url(../images/dynamic-hero-background-dark.svg)
}

.dgc-hero.fade-in devsite-dynamic-hero {
    display: block
}

.dgc-hero.fade-out {
    -webkit-animation: dynamic-hero-fade-out .5s forwards;
    animation: dynamic-hero-fade-out .5s forwards
}

.dgc-dynamic-hero {
    display: none
}

@media screen and (max-width: 840px) {
    .dgc-hero.fade-in {
        background-image:url(../images/dynamic-hero-background-cropped.svg)
    }

    .color-scheme--dark .dgc-hero.fade-in {
        background-image: url(../images/dynamic-hero-background-dark-cropped.svg)
    }

    devsite-dynamic-hero .devsite-landing-row-item-image .material-icons,devsite-dynamic-hero img {
        padding: 0 30px 0 0
    }

    devsite-dynamic-hero .devsite-landing-row-item-description-content {
        -webkit-line-clamp: 3;
        max-width: 100%
    }
}

@media screen and (max-width: 600px) {
    .dgc-hero.fade-in {
        background:unset
    }

    .color-scheme--dark .dgc-hero.fade-in {
        background: unset
    }

    devsite-dynamic-hero .devsite-landing-row-item-image .material-icons,devsite-dynamic-hero img {
        padding: 0
    }
}

@-webkit-keyframes dynamic-hero-fade-in {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes dynamic-hero-fade-in {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@-webkit-keyframes dynamic-hero-fade-out {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes dynamic-hero-fade-out {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.pac-container {
    z-index: 2000
}

devsite-edit-profile {
    display: grid;
    grid: auto/calc(50% - 12px) calc(50% - 12px);
    margin-block:0 18px;margin-inline:24px;gap: 20px
}

devsite-edit-profile .devsite-edit-profile-error-incorrect,devsite-edit-profile .devsite-edit-profile-error-missing {
    display: none;
    color: #ea4335;
    font-size: 12px;
    margin: 2px 0 0 14px
}

devsite-edit-profile .devsite-edit-profile-textarea {
    grid-column: 1/3;
    min-height: 110px
}

devsite-edit-profile .devsite-edit-profile-input {
    display: block;
    position: relative;
    min-height: 86px
}

devsite-edit-profile .devsite-edit-profile-input[incorrect] .devsite-edit-profile-error-incorrect,devsite-edit-profile .devsite-edit-profile-input[missing] .devsite-edit-profile-error-missing {
    display: inline-block
}

devsite-edit-profile .devsite-edit-profile-help-text {
    -webkit-margin-before: 3px;
    margin-block-start:3px;font-size: 12px
}

devsite-edit-profile .devsite-edit-profile-input-length,devsite-edit-profile .devsite-edit-profile-private-chip {
    color: var(--devsite-secondary-text-color);
    font-size: 12px;
    font-weight: 500;
    margin: 2px 0 0 14px;
    display: inline-block
}

devsite-edit-profile .devsite-edit-profile-input-length .material-symbols-outlined,devsite-edit-profile .devsite-edit-profile-private-chip .material-symbols-outlined {
    font-size: 12px;
    font-variation-settings: "FILL" 0,"wght" 400,"GRAD" 0,"opsz" 48;
    top: 2px;
    position: relative
}

devsite-edit-profile.devsite-edit-profile-small {
    grid: auto/auto
}

devsite-edit-profile.devsite-edit-profile-small .devsite-edit-profile-textarea {
    grid-column: unset
}

devsite-expandable {
    display: block;
    min-height: 24px
}

devsite-expandable:not([expanded])>:not(.showalways):not(.expand-control):not(.exw-control) {
    display: none
}

devsite-expandable .exw-control>h2.showalways {
    margin: 40px 0 20px;
    padding-bottom: 7px
}

devsite-expandable .exw-control>h3.showalways {
    margin: 34px 0 20px
}

devsite-expandable .exw-control>h4.showalways {
    margin: 36px 0 20px
}

devsite-expandable .expand-control:not(button):not(.button) {
    color: var(--devsite-link-color);
    cursor: pointer
}

devsite-expandable a.exw-control:active,devsite-expandable a.exw-control:focus,devsite-expandable a.exw-control:hover {
    color: var(--devsite-link-color);
    cursor: pointer;
    outline: 0;
    text-decoration: none
}

devsite-expandable a.exw-control>.showalways:before {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-secondary-text-color);
    content: "add_circle";
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    height: 20px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px;-webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: middle;
    width: 20px
}

devsite-expandable.arrow-icon a.exw-control>.showalways:before {
    content: "chevron_right"
}

[dir=rtl] devsite-expandable.arrow-icon a.exw-control>.showalways:before {
    content: "chevron_left"
}

devsite-expandable[expanded]>a.exw-control>.showalways:before {
    content: "remove_circle"
}

devsite-expandable.arrow-icon[expanded]>a.exw-control>.showalways:before {
    content: "keyboard_arrow_down"
}

devsite-expandable a.exw-control:focus>.showalways:before,devsite-expandable a.exw-control:hover>.showalways:before {
    color: var(--devsite-link-color)
}

devsite-expandable .collapse-content-msg,devsite-expandable[expanded] .expand-content-msg {
    display: none
}

devsite-expandable[expanded] .collapse-content-msg {
    display: inline
}

devsite-content devsite-expandable devsite-expandable {
    margin-left: 40px
}

devsite-extradory {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-extradory .devsite-extra-dory-iframe {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-extradory .devsite-extra-dory-iframe iframe {
    width: 100%;
    height: 100%;
    border: 0
}

devsite-extradory h2 {
    font-size: 24px;
    color: #3c4043;
    text-align: center;
    line-height: 32px;
    margin: 0;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center
}

devsite-extradory .devsite-extradory-create-profile {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center
}

devsite-extradory .devsite-extradory-step1,devsite-extradory .devsite-extradory-step2,devsite-extradory .devsite-extradory-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    width: 100%;
    padding: 20px
}

devsite-extradory .devsite-extradory-create-profile {
    margin-top: 26px
}

devsite-extradory p {
    font-size: 16px;
    color: #3c4043;
    line-height: 24px
}

devsite-extradory .devsite-extradory-cta label,devsite-extradory .devsite-extradory-cta p {
    font-size: 14px;
    color: #3c4043;
    line-height: 29px;
    margin: 0
}

devsite-extradory .devsite-extradory-buttons,devsite-extradory .devsite-extradory-join-group,devsite-extradory .devsite-extradory-try-again-buttons {
    margin-top: 36px
}

devsite-extradory .devsite-extradory-spinner {
    padding: 64px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%
}

devsite-extradory .devsite-extradory-try-again-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%
}

devsite-extradory .devsite-extradory-authorize,devsite-extradory .devsite-extradory-change-account,devsite-extradory .devsite-extradory-join-group,devsite-extradory .devsite-extradory-not-eligible,devsite-extradory .devsite-extradory-sign-in,devsite-extradory .devsite-extradory-try-again {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center
}

.devsite-fast-track-creator-dialog {
    padding: 24px
}

.devsite-fast-track-creator-dialog-label {
    font-size: 16px
}

.devsite-fast-track-creator-dialog-heading {
    margin: 0 0 10px
}

.devsite-fast-track-creator-dialog-sub-text {
    color: var(--devsite-secondary-text-color);
    font: 400 12px/16px var(--devsite-primary-font-family);
    letter-spacing: .3px;
    -webkit-padding-start: 16px;
    -moz-padding-start: 16px;
    padding-inline-start:16px;margin: 5px 0 20px
}

.devsite-fast-track-creator-dialog-tos {
    margin: 12px 0 24px
}

.devsite-fast-track-creator-dialog-buttons {
    --devsite-button-sibling-gap-x: 0;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: end;
    gap: 16px
}

devsite-feature-tooltip:not([rendered])>[slot] {
    display: none
}

devsite-feature-tooltip {
    display: block
}

devsite-feature-tooltip [slot].step {
    display: none
}

devsite-feature-tooltip [slot].step.current {
    display: block
}

devsite-dialog.devsite-feedback .devsite-dialog-contents {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0
}

devsite-dialog.devsite-feedback h1 {
    margin: 0 0 20px;
    padding: 16px 16px 0;
    font: var(--devsite-heading-font,400 20px/32px var(--devsite-primary-font-family));
    text-align: var(--devsite-heading-text-align,inherit)
}

devsite-dialog.devsite-feedback .devsite-feedback-items {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0 6px
}

devsite-dialog.devsite-feedback .devsite-feedback-item {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-secondary-text-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 0 0;
    -moz-box-flex: 1;
    -ms-flex: 1 0 0px;
    flex: 1 0 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-decoration: none
}

devsite-dialog.devsite-feedback .devsite-feedback-item-type {
    color: var(--devsite-link-color)
}

devsite-dialog.devsite-feedback .devsite-feedback-item:focus>.devsite-feedback-item-type {
    text-decoration: underline
}

devsite-dialog.devsite-feedback .devsite-feedback-item-icon-container {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 48px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 8px 0;
    width: 48px
}

devsite-dialog.devsite-feedback .devsite-feedback-item-icon-color {
    background-color: var(--devsite-feedback-icon-background,var(--devsite-primary-color,var(--devsite-primary-text-color)));
    border-radius: 50%;
    color: var(--devsite-inverted-text-color)
}

devsite-dialog.devsite-feedback .devsite-feedback-item-icon {
    font-size: 32px
}

devsite-dialog.devsite-feedback .devsite-feedback-item-icon-container img {
    max-width: 100%
}

devsite-dialog.devsite-feedback .devsite-feedback-notice,devsite-dialog.devsite-feedback .devsite-feedback-support {
    padding: 16px 16px 0;
    text-align: center
}

devsite-dialog.devsite-feedback .devsite-feedback-support-icon {
    font-size: 18px;
    margin-right: 4px;
    vertical-align: middle
}

devsite-dialog.devsite-feedback .devsite-feedback-support-icon+span {
    vertical-align: middle
}

devsite-dialog.devsite-feedback .devsite-feedback-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: var(--devsite-feedback-buttons-padding,16px 0 0)
}

devsite-filter {
    display: block
}

.devsite-filter-input,devsite-filter input[type=text] {
    --devsite-input-width: 100%
}

devsite-filter>.devsite-table-wrapper:first-child>table {
    margin-top: 0
}

devsite-filter [results-count-container] {
    color: var(--devsite-filter-results-count-color);
    font-family: var(--devsite-filter-results-count-font-family);
    margin: var(--devsite-filter-results-count-margin,16px 0)
}

devsite-filter[sortable] th:hover {
    cursor: pointer
}

devsite-filter th[sort-ascending],devsite-filter th[sort-descending] {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

devsite-filter th[sort-ascending]:after,devsite-filter th[sort-descending]:after {
    content: "arrow_drop_down";
    display: inline-block;
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    margin: -2px 0 0;
    position: absolute;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s,-webkit-transform .2s;
    vertical-align: middle
}

devsite-filter th[sort-descending]:after {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

devsite-filter[hide-if-empty][empty] {
    display: none
}

devsite-filter[highlight] mark {
    background-color: #ffe168
}

devsite-filter[highlight] mark:after,devsite-filter[highlight] mark:before {
    -webkit-clip-path: inset(100%);
    clip-path: inset(100%);
    clip: rect(1px,1px,1px,1px);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px
}

devsite-filter[highlight] mark:before {
    content: " [highlight start] "
}

devsite-filter[highlight] mark:after {
    content: " [highlight end] "
}

devsite-filter .devsite-filter-input-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    position: relative
}

devsite-filter .devsite-filter-clear-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color));
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font: normal normal normal 14px/14px Material Icons;
    height: var(--devsite-input-height,36px);
    inset-inline: auto 0;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    outline: 0;
    position: absolute;
    width: var(--devsite-input-height,36px)
}

devsite-filter .devsite-filter-clear-button:before {
    content: "close"
}

devsite-filter .devsite-filter-clear-button:focus:before,devsite-filter .devsite-filter-clear-button:hover:before {
    background: var(--devsite-background-5);
    border-radius: 50%;
    padding: 4px
}

devsite-filterable-json {
    display: block;
    min-height: 54px
}

devsite-filterable-json .devsite-filterable-json-input-wrapper {
    display: grid;
    grid-template-columns: 1fr -webkit-min-content;
    grid-template-columns: 1fr min-content;
    grid-template-rows: 1fr;
    gap: 8px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-input-background);
    padding: var(--devsite-filterable-json-input-padding,0 12px);
    border-radius: var(--devsite-filterable-json-input-border-radius,8px);
    border: var(--devsite-filterable-json-input-border,var(--devsite-input-border))
}

devsite-filterable-json .devsite-filterable-json-input-wrapper input {
    --devsite-input-border: 0;
    --devsite-input-border-bottom-focus: none;
    --devsite-input-padding: 0;
    --devsite-input-padding-bottom-focus: 0;
    color: var(--devsite-secondary-text-color);
    line-height: 52px;
    border-radius: 0
}

devsite-filterable-json .devsite-filterable-json-input-wrapper button {
    --devsite-button-background: transparent;
    --devsite-button-border: 0;
    --devsite-button-border-radius: 50%;
    --devsite-button-color: var(--devsite-secondary-text-color);
    --devsite-button-width: 32px;
    --devsite-button-height: 32px;
    --devsite-button-box-shadow: none;
    --devsite-button-padding: 0;
    --devsite-button-border-hover: 0;
    --devsite-button-color-hover: var(--devsite-secondary-text-color);
    --devsite-button-background-active: transparent;
    --devsite-button-border-active: 0;
    --devsite-button-box-shadow-active: none;
    --devsite-button-transform-active: none;
    min-width: auto
}

devsite-filterable-json .devsite-filterable-json-has-results:not(.devsite-filterable-json-popover) .devsite-filterable-json-input-wrapper {
    border-radius: var(--devsite-filterable-json-input-border-radius,8px) var(--devsite-filterable-json-input-border-radius,8px) 0 0
}

devsite-filterable-json .devsite-filterable-json-results {
    border: var(--devsite-input-border);
    border-top: 0;
    border-radius: 0 0 var(--devsite-filterable-json-input-border-radius,8px) var(--devsite-filterable-json-input-border-radius,8px);
    padding: 12px 12px 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 8px
}

devsite-filterable-json .devsite-filterable-json-results h4 {
    text-transform: uppercase;
    font-size: 12px;
    margin: 0
}

devsite-filterable-json .devsite-filterable-json-result-list {
    padding-bottom: 12px
}

devsite-filterable-json .devsite-filterable-json-result-list ul {
    list-style: none;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0;
    margin: 0
}

devsite-filterable-json .devsite-filterable-json-result-list li {
    margin: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-filterable-json .devsite-filterable-json-popover {
    position: relative
}

devsite-filterable-json .devsite-filterable-json-popover .devsite-filterable-json-results {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    background: var(--devsite-background-1);
    z-index: 100;
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color);
    max-height: 50dvh;
    overflow: auto
}

devsite-filterable-json:focus-within .devsite-filterable-json-popover .devsite-filterable-json-results {
    display: block
}

devsite-filterable-json:focus-within .devsite-filterable-json-popover.devsite-filterable-json-has-results .devsite-filterable-json-input-wrapper {
    border-radius: var(--devsite-filterable-json-input-border-radius,8px) var(--devsite-filterable-json-input-border-radius,8px) 0 0;
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color)
}

devsite-filterable-json .devsite-filterable-json-result-list a,devsite-filterable-json .devsite-filterable-json-result-list a:visited {
    color: var(--devsite-filterable-json-result-list-item-color,var(--devsite-secondary-text-color));
    padding: var(--devsite-filterable-json-result-list-item-padding,4px 8px);
    border-radius: var(--devsite-filterable-json-result-list-item-border-radius,4px);
    border: var(--devsite-filterable-json-result-list-item-border,var(--devsite-input-border));
    background: var(--devsite-filterable-json-result-list-item-background);
    -webkit-text-decoration: var(--devsite-filterable-json-result-list-item-text-decoration,none);
    -moz-text-decoration: var(--devsite-filterable-json-result-list-item-text-decoration,none);
    text-decoration: var(--devsite-filterable-json-result-list-item-text-decoration,none);
    font-size: var(--devsite-filterable-json-title-font-size,14px);
    font-weight: var(--devsite-filterable-json-title-font-weight);
    font-family: var(--devsite-filterable-json-title-font-family)
}

devsite-filterable-json .devsite-filterable-json-result-list a .devsite-filterable-json-title,devsite-filterable-json .devsite-filterable-json-result-list a:visited .devsite-filterable-json-title {
    font-size: var(--devsite-filterable-json-title-font-size,14px);
    font-weight: var(--devsite-filterable-json-title-font-weight);
    font-family: var(--devsite-filterable-json-title-font-family);
    color: var(--devsite-filterable-json-title-color);
    background: var(--devsite-filterable-json-title-background);
    padding: var(--devsite-filterable-json-title-padding)
}

devsite-filterable-json .devsite-filterable-json-result-list a .devsite-filterable-json-name,devsite-filterable-json .devsite-filterable-json-result-list a:visited .devsite-filterable-json-name {
    font-size: var(--devsite-filterable-json-name-font-size,14px);
    font-weight: var(--devsite-filterable-json-name-font-weight);
    font-family: var(--devsite-filterable-json-name-font-family,var(--devsite-code-font-family));
    color: var(--devsite-filterable-json-name-color);
    background: var(--devsite-filterable-json-name-background);
    padding: var(--devsite-filterable-json-name-padding)
}

devsite-filterable-json .devsite-filterable-json-result-list a:hover {
    color: var(--devsite-filterable-json-result-list-item-hover-color,var(--devsite-secondary-text-color));
    padding: var(--devsite-filterable-json-result-list-item-hover-padding,4px 8px);
    border-radius: var(--devsite-filterable-json-result-list-item-hover-border-radius,4px);
    border: var(--devsite-filterable-json-result-list-item-hover-border,var(--devsite-button-border-hover,0));
    background: var(--devsite-filterable-json-result-list-item-hover-background);
    -webkit-text-decoration: var(--devsite-filterable-json-result-list-item-hover-text-decoration,none);
    -moz-text-decoration: var(--devsite-filterable-json-result-list-item-hover-text-decoration,none);
    text-decoration: var(--devsite-filterable-json-result-list-item-hover-text-decoration,none);
    font-size: var(--devsite-filterable-json-title-font-size-hover,14px);
    font-weight: var(--devsite-filterable-json-title-font-weight-hover);
    font-family: var(--devsite-filterable-json-title-font-family-hover)
}

devsite-filterable-json .devsite-filterable-json-result-list a:hover .devsite-filterable-json-title {
    font-size: var(--devsite-filterable-json-title-font-size-hover,14px);
    font-weight: var(--devsite-filterable-json-title-font-weight-hover);
    font-family: var(--devsite-filterable-json-title-font-family-hover);
    color: var(--devsite-filterable-json-title-color-hover);
    background: var(--devsite-filterable-json-title-background-hover);
    padding: var(--devsite-filterable-json-title-padding-hover)
}

devsite-filterable-json .devsite-filterable-json-result-list a:hover .devsite-filterable-json-name {
    font-size: var(--devsite-filterable-json-name-font-size-hover,14px);
    font-weight: var(--devsite-filterable-json-name-font-weight-hover);
    font-family: var(--devsite-filterable-json-name-font-family-hover,var(--devsite-code-font-family));
    color: var(--devsite-filterable-json-name-color-hover);
    background: var(--devsite-filterable-json-name-background-hover);
    padding: var(--devsite-filterable-json-name-padding-hover)
}

devsite-filterable-json .devsite-filterable-json-result-list a:focus {
    color: var(--devsite-filterable-json-result-list-item-focus-color,var(--devsite-secondary-text-color));
    padding: var(--devsite-filterable-json-result-list-item-focus-padding,4px 8px);
    border-radius: var(--devsite-filterable-json-result-list-item-focus-border-radius,4px);
    border: var(--devsite-filterable-json-result-list-item-focus-border,1px solid var(--devsite-link-color));
    background: var(--devsite-filterable-json-result-list-item-focus-background,var(--devsite-button-background-hover));
    -webkit-text-decoration: var(--devsite-filterable-json-result-list-item-focus-text-decoration,none);
    -moz-text-decoration: var(--devsite-filterable-json-result-list-item-focus-text-decoration,none);
    text-decoration: var(--devsite-filterable-json-result-list-item-focus-text-decoration,none);
    font-size: var(--devsite-filterable-json-title-font-size-focus,14px);
    font-weight: var(--devsite-filterable-json-title-font-weight-focus);
    font-family: var(--devsite-filterable-json-title-font-family-focus)
}

devsite-filterable-json .devsite-filterable-json-result-list a:focus .devsite-filterable-json-title {
    font-size: var(--devsite-filterable-json-title-font-size-focus,14px);
    font-weight: var(--devsite-filterable-json-title-font-weight-focus);
    font-family: var(--devsite-filterable-json-title-font-family-focus);
    color: var(--devsite-filterable-json-title-color-focus);
    background: var(--devsite-filterable-json-title-background-focus);
    padding: var(--devsite-filterable-json-title-padding-focus)
}

devsite-filterable-json .devsite-filterable-json-result-list a:focus .devsite-filterable-json-name {
    font-size: var(--devsite-filterable-json-name-font-size-focus,14px);
    font-weight: var(--devsite-filterable-json-name-font-weight-focus);
    font-family: var(--devsite-filterable-json-name-font-family-focus,var(--devsite-code-font-family));
    color: var(--devsite-filterable-json-name-color-focus);
    background: var(--devsite-filterable-json-name-background-focus);
    padding: var(--devsite-filterable-json-name-padding-focus)
}

devsite-filterable-json .devsite-filterable-json-result-permissions a .devsite-filterable-json-title,devsite-filterable-json .devsite-filterable-json-result-permissions a:visited .devsite-filterable-json-title {
    font-size: var(--devsite-filterable-json-name-font-size,14px);
    font-weight: var(--devsite-filterable-json-name-font-weight);
    font-family: var(--devsite-filterable-json-name-font-family,var(--devsite-code-font-family));
    color: var(--devsite-filterable-json-name-color);
    background: var(--devsite-filterable-json-name-background);
    padding: var(--devsite-filterable-json-name-padding)
}

devsite-filterable-json .devsite-filterable-json-result-permissions a:hover .devsite-filterable-json-title {
    font-size: var(--devsite-filterable-json-name-font-size-hover,14px);
    font-weight: var(--devsite-filterable-json-name-font-weight-hover);
    font-family: var(--devsite-filterable-json-name-font-family-hover,var(--devsite-code-font-family));
    color: var(--devsite-filterable-json-name-color-hover);
    background: var(--devsite-filterable-json-name-background-hover);
    padding: var(--devsite-filterable-json-name-padding-hover)
}

devsite-filterable-json .devsite-filterable-json-result-permissions a:focus .devsite-filterable-json-title {
    font-size: var(--devsite-filterable-json-name-font-size-focus,14px);
    font-weight: var(--devsite-filterable-json-name-font-weight-focus);
    font-family: var(--devsite-filterable-json-name-font-family-focus,var(--devsite-code-font-family));
    color: var(--devsite-filterable-json-name-color-focus);
    background: var(--devsite-filterable-json-name-background-focus);
    padding: var(--devsite-filterable-json-name-padding-focus)
}

devsite-footer-linkboxes {
    background: var(--devsite-footer-background,var(--devsite-background-1));
    color: var(--devsite-footer-color);
    display: block;
    font: var(--devsite-footer-linkboxes-font,400 14px/16px var(--devsite-primary-font-family));
    padding: var(--devsite-footer-linkboxes-padding)
}

devsite-footer-linkboxes .devsite-footer-linkboxes-list {
    border-bottom: var(--devsite-primary-border);
    display: grid;
    grid-gap: 24px;
    grid-template-columns: var(--devsite-footer-linkboxes-grid-template-columns);
    list-style: none;
    padding: 24px 0
}

devsite-footer-linkboxes .devsite-footer-linkbox {
    margin: 0
}

devsite-footer-linkboxes .devsite-footer-linkbox-heading {
    font: var(--devsite-footer-heading-font,500 14px/16px var(--devsite-primary-font-family));
    margin: var(--devsite-footer-heading-margin,0 0 8px);
    text-transform: var(--devsite-footer-heading-text-transform)
}

devsite-footer-linkboxes .devsite-footer-linkbox-list .devsite-footer-linkbox-heading {
    margin: var(--devsite-footer-list-heading-margin,40px 0 0)
}

devsite-footer-linkboxes .devsite-footer-linkbox-list {
    list-style-type: none;
    padding: 0
}

devsite-footer-linkboxes .devsite-footer-linkbox-item {
    margin: 0
}

devsite-footer-linkboxes .devsite-footer-linkbox-link {
    color: var(--devsite-footer-link-color,var(--devsite-primary-text-color));
    display: inline-block;
    padding: 8px 0
}

devsite-footer-linkboxes .devsite-footer-linkbox-link:focus,devsite-footer-linkboxes .devsite-footer-linkbox-link:hover {
    color: var(--devsite-footer-link-hover,var(--devsite-link-color));
    font-weight: var(--devsite-footer-link-font-weight-hover)
}

devsite-footer-linkboxes .devsite-footer-linkbox-description {
    color: var(--devsite-secondary-text-color);
    font: var(--devsite-footer-description-font,14px/20px var(--devsite-primary-font-family));
    margin: 0 0 16px
}

devsite-footer-linkboxes .devsite-footer-linkbox-icon {
    margin-block:0 4px}

devsite-footer-promos {
    background: var(--devsite-footer-background,var(--devsite-background-1));
    border-top: var(--devsite-footer-border,var(--devsite-primary-border));
    color: var(--devsite-footer-color);
    display: block;
    font: 14px/20px var(--devsite-primary-font-family);
    padding: 0 24px
}

devsite-footer-promos .devsite-footer-promos-list {
    border-bottom: var(--devsite-primary-border);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 24px;
    list-style: none;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    padding: 18px 0
}

devsite-footer-promos .devsite-footer-promo {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 192px;
    -moz-box-flex: 0;
    -ms-flex: 0 1 192px;
    flex: 0 1 192px;
    margin: 20px 0;
    text-align: center
}

devsite-footer-promos .devsite-footer-promo-icon {
    color: var(--devsite-text-color,var(--devsite-primary-text-rgba));
    display: block;
    font-size: 48px;
    height: 48px;
    margin-block:0 8px;margin-inline:auto;width: 48px
}

devsite-footer-promos .devsite-footer-promo-title {
    color: var(--devsite-footer-heading-color,var(--devsite-primary-text-rgba));
    display: block;
    font: var(--devsite-footer-heading-font);
    font-weight: var(--devsite-footer-heading-font-weight,500)
}

devsite-footer-promos .devsite-footer-promo-title:focus,devsite-footer-promos .devsite-footer-promo-title:hover {
    color: var(--devsite-footer-link-hover,var(--devsite-link-color));
    font-weight: var(--devsite-footer-link-font-weight-hover);
    text-decoration: none
}

@media screen and (max-width: 1253px) {
    .devsite-main-content[has-book-nav]~devsite-footer-promos .devsite-footer-promos-list {
        -webkit-flex-wrap:wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: unset;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }

    .devsite-main-content[has-book-nav]~devsite-footer-promos .devsite-footer-promo {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 50%;
        -moz-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        padding-block:0;padding-inline:20px}
}

@media screen and (max-width: 840px) {
    .devsite-main-content[has-book-nav]~devsite-footer-promos .devsite-footer-promos-list,devsite-footer-promos .devsite-footer-promos-list {
        -webkit-flex-wrap:wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        padding: 12px 0
    }

    .devsite-main-content[has-book-nav]~devsite-footer-promos .devsite-footer-promo,devsite-footer-promos .devsite-footer-promo {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 50%;
        -moz-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        margin: 0;
        padding-block:8px;padding-inline:0;text-align: start
    }

    devsite-footer-promos .devsite-footer-promo-icon {
        height: 32px;
        margin-block:0;margin-inline:0 8px;width: 32px
    }

    devsite-footer-promos .devsite-footer-promo-title {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        font-weight: 400
    }

    devsite-footer-promos .devsite-footer-promo-description {
        display: none
    }
}

@media screen and (max-width: 600px) {
    devsite-footer-promos {
        padding:0 16px
    }

    devsite-footer-promos .devsite-footer-promos-list {
        display: block
    }
}

devsite-footer-utility {
    background: var(--devsite-footer-background,var(--devsite-background-1));
    color: var(--devsite-footer-color);
    display: block;
    font: 400 14px/16px var(--devsite-primary-font-family);
    padding: 0 24px
}

devsite-footer-utility .devsite-footer-sites-list,devsite-footer-utility .devsite-footer-sites-logo-link,devsite-footer-utility .devsite-footer-utility-button,devsite-footer-utility .devsite-footer-utility-item,devsite-footer-utility .devsite-footer-utility-list,devsite-footer-utility nav {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-footer-utility .devsite-footer-utility-button,devsite-footer-utility .devsite-footer-utility-list,devsite-footer-utility nav {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-footer-utility nav {
    gap: 16px;
    padding: 24px 0
}

devsite-footer-utility .devsite-footer-sites,devsite-footer-utility .devsite-footer-sites-list {
    gap: 0 40px
}

devsite-footer-utility .devsite-footer-sites {
    -webkit-border-after: var(--devsite-primary-border);
    border-block-end:var(--devsite-primary-border);padding: 24px 0 23px
}

devsite-footer-utility .devsite-footer-sites-list,devsite-footer-utility .devsite-footer-utility-list {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    padding: 0
}

devsite-footer-utility .devsite-footer-sites-item,devsite-footer-utility .devsite-footer-utility-item {
    margin: 0
}

devsite-footer-utility .devsite-footer-sites-link {
    color: var(--devsite-primary-text-color);
    display: block;
    padding: 8px 0
}

devsite-footer-utility .devsite-footer-sites-link:focus,devsite-footer-utility .devsite-footer-sites-link:hover {
    color: var(--devsite-link-color)
}

devsite-footer-utility .devsite-footer-sites-logo {
    height: 32px;
    margin-top: -4px;
    width: 185px
}

devsite-footer-utility .devsite-footer-utility-links,devsite-footer-utility .devsite-footer-utility-list {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

devsite-footer-utility .devsite-footer-utility-list {
    gap: 16px 8px;
    -webkit-box-flex: var(--devsite-footer-utility-list-flex,1);
    -webkit-flex: var(--devsite-footer-utility-list-flex,1);
    -moz-box-flex: var(--devsite-footer-utility-list-flex,1);
    -ms-flex: var(--devsite-footer-utility-list-flex,1);
    flex: var(--devsite-footer-utility-list-flex,1);
    min-height: 36px
}

devsite-footer-utility .devsite-footer-utility-link {
    color: var(--devsite-footer-link-color,var(--devsite-primary-text-color))
}

devsite-footer-utility .devsite-footer-utility-link:focus,devsite-footer-utility .devsite-footer-utility-link:hover {
    color: var(--devsite-footer-link-hover,var(--devsite-link-color))
}

devsite-footer-utility a:focus,devsite-footer-utility a:hover {
    font-weight: var(--devsite-footer-link-font-weight-hover)
}

devsite-footer-utility .devsite-footer-utility-item {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

devsite-footer-utility .devsite-footer-utility-item-centered {
    margin: 0 auto
}

devsite-footer-utility .devsite-footer-utility-button {
    gap: 0 16px;
    line-height: 20px;
    margin-inline:auto 0}

devsite-footer-utility .devsite-footer-utility-button>a:focus {
    text-decoration: none
}

devsite-footer-utility .devsite-footer-utility-item:before {
    content: "|";
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px}

devsite-footer-utility .devsite-footer-utility-button:before,devsite-footer-utility .devsite-footer-utility-item-centered:before,devsite-footer-utility .devsite-footer-utility-item-no-marker:before,devsite-footer-utility .devsite-footer-utility-item:first-child:before {
    content: "";
    -webkit-margin-end: 0;
    -moz-margin-end: 0;
    margin-inline-end:0}

devsite-footer-utility devsite-language-selector {
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end;
    margin: var(--devsite-language-selector-margin,0)
}

devsite-footer-utility .glue-cookie-notification-bar-control {
    color: var(--devsite-footer-link-color,var(--devsite-primary-text-color));
    cursor: pointer
}

devsite-footer-utility .glue-cookie-notification-bar-control:hover {
    color: var(--devsite-footer-link-hover,var(--devsite-link-color))
}

devsite-footer-utility .glue-cookie-notification-bar-control:hover:before {
    color: var(--devsite-primary-text-color)
}

devsite-footer-utility .glue-cookie-notification-bar-control:has([aria-hidden=true]) {
    display: none
}

@media screen and (max-width: 1253px) {
    [has-book-nav]~devsite-footer-utility .devsite-footer-sites,[has-book-nav]~devsite-footer-utility .devsite-footer-sites-list {
        -webkit-box-align:start;
        -webkit-align-items: start;
        -moz-box-align: start;
        -ms-flex-align: start;
        align-items: start;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    [has-book-nav]~devsite-footer-utility .devsite-footer-sites {
        gap: 16px 0
    }
}

@media screen and (max-width: 840px) {
    devsite-footer-utility .devsite-footer-sites,devsite-footer-utility .devsite-footer-sites-list {
        -webkit-box-align:start;
        -webkit-align-items: start;
        -moz-box-align: start;
        -ms-flex-align: start;
        align-items: start;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    devsite-footer-utility .devsite-footer-sites {
        gap: 16px 0
    }

    devsite-footer-utility .devsite-footer-utility-list {
        -webkit-box-flex: 100%;
        -webkit-flex: 100%;
        -moz-box-flex: 100%;
        -ms-flex: 100%;
        flex: 100%
    }

    devsite-footer-utility .devsite-footer-utility-button {
        -webkit-box-flex: 100%;
        -webkit-flex: 100%;
        -moz-box-flex: 100%;
        -ms-flex: 100%;
        flex: 100%;
        margin-inline:0}

    devsite-footer-utility .devsite-footer-utility-button:before {
        display: none
    }
}

@media screen and (max-width: 600px) {
    devsite-footer-utility {
        padding:0 16px
    }

    devsite-footer-utility .devsite-footer-utility-item-centered {
        margin: 12px 0
    }
}

.devsite-fully-clickable {
    background-color: var(--devsite-fully-clickable-background,var(--devsite-background-color));
    border-radius: var(--devsite-fully-clickable-border-radius);
    position: relative
}

.devsite-fully-clickable:before {
    border-radius: var(--devsite-fully-clickable-border-radius);
    box-shadow: var(--devsite-fully-clickable-box-shadow,0 14px 25px 0 rgba(60,64,67,.08),0 4px 13px 0 rgba(60,64,67,.12));
    content: "";
    display: block;
    height: 100%;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    -webkit-transition: opacity .2s ease-out;
    transition: opacity .2s ease-out;
    width: 100%
}

.devsite-fully-clickable:focus-within:before,.devsite-fully-clickable:hover:before {
    opacity: 1
}

.devsite-fully-clickable:active:before {
    opacity: .4
}

.devsite-fully-clickable-link:active,.devsite-fully-clickable-link:focus,.devsite-fully-clickable-link:hover {
    -webkit-transform: none!important;
    transform: none!important
}

.devsite-fully-clickable-link:not(.button):active,.devsite-fully-clickable-link:not(.button):focus,.devsite-fully-clickable-link:not(.button):hover {
    text-decoration: none!important
}

.devsite-fully-clickable-link:before {
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

devsite-gdg-map {
    display: block;
    min-height: 650px
}

@-webkit-keyframes mapResultFadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes mapResultFadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.devsite-gdg-map-filter-container {
    -webkit-padding-after: 10px;
    padding-block-end:10px}

.devsite-gdg-map-filter-container ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 10px
}

.devsite-gdg-map-filter-container ul li {
    margin: 0
}

.devsite-gdg-map-filter-container ul li input {
    opacity: 0;
    margin: 0;
    position: absolute
}

.devsite-gdg-map-filter-container ul li .devsite-gdg-map-filter-chip-spacer,.devsite-gdg-map-filter-container ul li label {
    font: 500 14px/20px var(--devsite-primary-font-family)
}

.devsite-gdg-map-filter-container ul li .devsite-gdg-map-filter-chip-spacer {
    display: block;
    padding: 18px 0
}

.devsite-gdg-map-filter-container ul li label {
    padding: 6px 8px;
    border-radius: 8px;
    background: var(--devsite-label-white-background,#fff);
    color: var(--devsite-label-white-color,#000);
    border: 2px solid #000;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    position: relative
}

.color-scheme--dark .devsite-gdg-map-filter-container ul li label {
    border: 2px solid #5f6368
}

.devsite-gdg-map-filter-container ul li label:active,.devsite-gdg-map-filter-container ul li label:hover {
    background: #ebf1fd
}

.devsite-gdg-map-filter-container ul li label .material-icons {
    font-size: 16px
}

.devsite-gdg-map-filter-container ul li label.devsite-gdg-map-filter-chip--selected {
    background: #e8f0fe;
    border-color: #1967d2;
    color: #1967d2
}

.devsite-gdg-map-filter-container ul li label.devsite-gdg-map-filter-chip--selected:active,.devsite-gdg-map-filter-container ul li label.devsite-gdg-map-filter-chip--selected:hover {
    background: #174ea6;
    color: #fff
}

.devsite-gdg-map-filter-chip-clear {
    --devsite-button-border: 0;
    --devsite-button-box-shadow: none;
    --devsite-button-background: none;
    --devsite-button-padding: 0;
    --devsite-button-background-hover: none;
    --devsite-button-border-hover: none;
    --devsite-button-text-decoration-hover: underline
}

.devsite-gdg-map-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    overflow: visible
}

.devsite-gdg-map--loading .devsite-gdg-map-map-container {
    -webkit-margin-before: 46px;
    margin-block-start:46px}

.devsite-gdg-map--loading .devsite-gdg-map-error,.devsite-gdg-map--loading .devsite-gdg-map-spinner {
    position: absolute;
    inset: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.devsite-gdg-map-map-container {
    position: relative;
    border: var(--devsite-gdg-map-border,2px solid #dadce0);
    border-radius: 12px;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 100%;
    -moz-box-flex: 1;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
    height: 100%;
    overflow: hidden;
    width: 100%;
    z-index: 2
}

.devsite-gdg-map-results-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 0;
    -moz-box-flex: 1;
    -ms-flex: 1 1 0px;
    flex: 1 1 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 16px;
    -webkit-transition: .3s cubic-bezier(.2,0,0,1);
    transition: .3s cubic-bezier(.2,0,0,1);
    z-index: 3;
    overflow: hidden auto
}

.devsite-gdg-map-container--has-results .devsite-gdg-map-map-container {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 calc(100% - 300px);
    -moz-box-flex: 1;
    -ms-flex: 1 1 calc(100% - 300px);
    flex: 1 1 calc(100% - 300px)
}

.devsite-gdg-map-container--has-results .devsite-gdg-map-results-container {
    -webkit-margin-start: 16px;
    -moz-margin-start: 16px;
    margin-inline-start:16px;-webkit-box-flex: 1;
    -webkit-flex: 1 1 300px;
    -moz-box-flex: 1;
    -ms-flex: 1 1 300px;
    flex: 1 1 300px;
    height: 600px
}

.devsite-gdg-map-map {
    height: 600px
}

.devsite-gdg-map-search-container {
    position: absolute;
    inset-inline-start: 10px;
    inset-block-start: 10px;
    z-index: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px
}

input.devsite-gdg-map-search-input {
    --devsite-input-padding: 7px 42px 7px 16px;
    --devsite-input-border: var(--tenant-primary-border);
    --devsite-input-border-radius: 20px;
    --devsite-input-width: 250px;
    --devsite-input-border-bottom-focus: var(--devsite-input-border);
    --devsite-input-padding-bottom-focus: 7px;
    font: 400 14px/24px var(--devsite-primary-font-family)
}

.devsite-gdg-map-filter-group-container {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-input-background,#fff);
    border-radius: 20px;
    border: var(--tenant-primary-border);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    inset: var(--map-widget-filters-inset);
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around
}

.devsite-gdg-map-filter-group-container input {
    opacity: 0;
    position: absolute;
    margin: 0
}

.devsite-gdg-map-filter-group-container label {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 20px;
    color: var(--devsite-input-color,var(--devsite-primary-text-color));
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0;
    padding: 0 16px;
    gap: 10px;
    cursor: pointer;
    border: 1px solid transparent;
    position: relative
}

.devsite-gdg-map-filter-group-container .devsite-gdg-map-filter-group-dot {
    display: inline-block;
    border-radius: 50%;
    height: 18px;
    width: 18px;
    background: #e8eaed
}

.devsite-gdg-map-filter-group-container .devsite-gdg-map-filter-group--selected {
    height: 40px;
    background: var(--devsite-button-background-active,#fff);
    border-color: var(--devsite-background-button-border-color,#dadce0);
    color: var(--devsite-input-color,var(--devsite-primary-text-color))
}

.devsite-gdg-map-filter-group-container .devsite-gdg-map-filter-group--selected.devsite-gdg-map-filter-group-devfest .devsite-gdg-map-filter-group-dot,.devsite-gdg-map-filter-group-container .devsite-gdg-map-filter-group--selected.devsite-gdg-map-filter-group-events .devsite-gdg-map-filter-group-dot {
    background: #1a73e8
}

.devsite-gdg-map-filter-group-container .devsite-gdg-map-filter-group--selected.devsite-gdg-map-filter-group-gdg .devsite-gdg-map-filter-group-dot,.devsite-gdg-map-filter-group-container .devsite-gdg-map-filter-group--selected.devsite-gdg-map-filter-group-groups .devsite-gdg-map-filter-group-dot {
    background: #34a853
}

.devsite-gdg-map-search-bar {
    position: relative
}

.devsite-gdg-map-search-bar .devsite-gdg-map-search-clear {
    position: absolute;
    inset-inline-end: 1px;
    inset-block-start: 2px;
    z-index: 1;
    --devsite-button-background: var(--devsite-input-background);
    --devsite-button-border: 0;
    --devsite-button-border-radius: 50%;
    --devsite-button-box-shadow: none;
    --devsite-button-padding: 0;
    --devsite-button-background-hover: var(--devsite-input-background);
    --devsite-button-border-hover: 0;
    --devsite-button-background-active: var(--devsite-input-background);
    --devsite-button-border-active: 0;
    --devsite-button-box-shadow-active: none
}

.devsite-gdg-map-marker {
    width: 10px;
    height: 10px;
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    border-radius: 50%;
    cursor: pointer;
    -webkit-transition: .3s cubic-bezier(.2,0,0,1);
    transition: .3s cubic-bezier(.2,0,0,1);
    position: relative
}

.devsite-gdg-map-marker--hover .devsite-gdg-map-marker {
    -webkit-transform: translateY(5px) scale(1.6);
    transform: translateY(5px) scale(1.6)
}

.devsite-gdg-map-marker--devfest-green-marker-icon {
    background: rgba(25,134,57,.8);
    border: 2px solid #198639
}

.devsite-gdg-map-marker--devfest-blue-marker-icon {
    background: rgba(25,103,210,.8);
    border: 2px solid #1967d2
}

.devsite-gdg-map-cluster-marker {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transform: translateY(18px);
    transform: translateY(18px)
}

.devsite-gdg-map-cluster-marker span {
    color: #fff;
    font-size: 12px
}

.devsite-gdg-map-cluster-marker--devfest-green-cluster-icon {
    background: rgba(25,134,57,.8);
    border: 2px solid #198639
}

.devsite-gdg-map-cluster-marker--devfest-blue-cluster-icon {
    background: rgba(25,103,210,.8);
    border: 2px solid #1967d2
}

.devsite-gdg-map-result {
    -webkit-animation: mapResultFadeIn .6s cubic-bezier(.2,0,0,1) forwards;
    animation: mapResultFadeIn .6s cubic-bezier(.2,0,0,1) forwards;
    opacity: 0;
    padding: var(--devsite-gdg-map-result-padding,16px);
    border-radius: 8px;
    border: var(--devsite-gdg-map-result-border,1px solid #dadce0);
    background: var(--devsite-background-1,#fff);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 8px
}

.devsite-gdg-map-result.devsite-gdg-map-result--selected,.devsite-gdg-map-result:hover {
    padding: var(--devsite-gdg-map-result-hover-padding,16px);
    border: var(--devsite-gdg-map-result-hover-border,1px solid #1a73e8);
    cursor: pointer
}

.devsite-gdg-map-result-type {
    font: 500 12px/16px var(--devsite-primary-font-family);
    text-transform: uppercase
}

.devsite-gdg-map-result-header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px
}

.devsite-gdg-map-result-header .devsite-gdg-map-result-icon {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.devsite-gdg-map-result-header .devsite-gdg-map-result-icon img {
    max-width: 45px
}

.devsite-gdg-map-result-split {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.devsite-gdg-map-result-header,.devsite-gdg-map-result-title {
    --devsite-h2-font: 400 18px/24px var(--devsite-headline-font-family);
    --devsite-h3-font: 400 14px/20px var(--devsite-primary-font-family);
    --devsite-h2-margin: 0;
    --devsite-h3-margin: 0;
    color: var(--devsite-primary-text-color,var(--devsite-inverted-text-color))
}

.devsite-gdg-map-result-date,.devsite-gdg-map-result-group {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 4px;
    font-size: 14px
}

.devsite-gdg-map-result-category {
    -webkit-padding-before: 16px;
    padding-block-start:16px;font-weight: 500
}

.devsite-gdg-map-result-actions {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.devsite-gdg-maps-result-actions {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.devsite-gdg-map-result-description {
    word-break: break-word
}

.viewport--mobile .devsite-gdg-map-search-container,.viewport--tablet .devsite-gdg-map-search-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.viewport--mobile .devsite-gdg-map-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.viewport--mobile .devsite-gdg-map-map {
    height: 300px
}

.viewport--mobile .devsite-gdg-map-container--has-results .devsite-gdg-map-map-container {
    width: 100%;
    height: 300px
}

.viewport--mobile .devsite-gdg-map-container--has-results .devsite-gdg-map-results-container {
    -webkit-margin-start: 0;
    -moz-margin-start: 0;
    margin-inline-start:0;-webkit-margin-before: 16px;
    margin-block-start:16px;width: 100%;
    max-height: 500px
}

.viewport--mobile devsite-gdg-map {
    min-height: 346px
}

devsite-googler-buttons {
    display: grid;
    gap: 8px;
    grid-template-rows: 1fr 56px;
    -webkit-margin-after: var(--devsite-cookie-bar-height,0);
    margin-block-end:var(--devsite-cookie-bar-height,0)}

devsite-googler-buttons ul {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column wrap;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-flow: column wrap;
    flex-flow: column wrap;
    gap: 8px;
    -webkit-box-pack: end;
    -webkit-justify-content: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: end;
    list-style: none;
    max-height: calc(100vh - 136px - var(--devsite-cookie-bar-height, 0));
    padding: 0
}

devsite-googler-buttons li {
    display: none;
    margin: 0;
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition: opacity .2s,display allow-discrete .2s,-webkit-transform .2s;
    transition: opacity .2s,display allow-discrete .2s,-webkit-transform .2s;
    transition: transform .2s,opacity .2s,display allow-discrete .2s;
    transition: transform .2s,opacity .2s,display allow-discrete .2s,-webkit-transform .2s
}

devsite-googler-buttons[active] li {
    display: block;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

devsite-googler-buttons .devsite-googler-button {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background: 0;
    border: 0;
    box-shadow: unset;
    -moz-box-sizing: unset;
    box-sizing: unset;
    color: unset;
    font: unset;
    height: unset;
    line-height: unset;
    margin: 0;
    outline: 0;
    padding: 0;
    pointer-events: unset;
    text-align: unset;
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-background-1);
    border-radius: 50%;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 40px
}

devsite-googler-buttons[active] .devsite-googler-button {
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color)
}

devsite-googler-buttons .devsite-googler-button:focus,devsite-googler-buttons .devsite-googler-button:hover {
    background: #e8f0fe;
    border: 2px solid #4285f4;
    text-decoration: none
}

devsite-googler-buttons .devsite-googler-button:active {
    background: #d2e3fc
}

devsite-googler-buttons .devsite-googler-admin:before {
    color: #80868b;
    content: "storage"
}

devsite-googler-buttons .devsite-googler-page-insights:before {
    color: #12b5cb;
    content: "bar_chart"
}

devsite-googler-buttons .devsite-googler-analytics:before {
    color: #e8710a;
    content: "timeline"
}

devsite-googler-buttons .devsite-googler-bug:before {
    color: #e52592;
    content: "bug_report"
}

devsite-googler-buttons .devsite-googler-cache {
    background: #689f38
}

devsite-googler-buttons .devsite-googler-cache:hover {
    background: #5bb974
}

devsite-googler-buttons .devsite-googler-cache:active,devsite-googler-buttons .devsite-googler-cache:focus {
    background: #8bc34a
}

devsite-googler-buttons .devsite-googler-cache[active] {
    background: #d93025
}

devsite-googler-buttons .devsite-googler-cache[active]:hover {
    background: #ea4335
}

devsite-googler-buttons .devsite-googler-cache[active]:active,devsite-googler-buttons .devsite-googler-cache[active]:focus {
    background: #ee675c
}

devsite-googler-buttons .devsite-googler-cache:before {
    color: var(--devsite-inverted-text-color);
    content: "cached"
}

devsite-googler-buttons .devsite-googler-cache[active]:after {
    background: var(--devsite-background-1);
    border-bottom: 2px solid #d93025;
    content: "";
    display: block;
    height: 4px;
    position: absolute;
    -webkit-transform: rotate(45deg) translateY(1px);
    transform: rotate(45deg) translateY(1px);
    width: 28px
}

devsite-googler-buttons .devsite-googler-cache[active]:active:after,devsite-googler-buttons .devsite-googler-cache[active]:focus:after {
    border-color: #ee675c
}

devsite-googler-buttons .devsite-googler-devrel:before {
    color: #607d8b;
    content: "build"
}

devsite-googler-buttons .devsite-googler-edit:before {
    color: #689f38;
    content: "edit"
}

devsite-googler-buttons .devsite-googler-source:before {
    color: #4285f4;
    content: "code"
}

devsite-googler-buttons .devsite-googler-env:before {
    color: #681da8;
    content: "swap_horiz"
}

.color-scheme--dark devsite-googler-buttons .devsite-googler-env:before {
    color: #c58af9
}

devsite-googler-buttons .devsite-googler-content-excellence:before {
    color: #4285f4;
    content: "local_police"
}

devsite-googler-buttons .devsite-googler-interaction-event:before {
    color: #e8710a;
    content: "touch_app"
}

devsite-googler-buttons .devsite-googler-speed-dial {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color);
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 56px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    justify-self: self-end;
    margin: 0;
    width: 56px
}

devsite-googler-buttons .devsite-googler-speed-dial:before {
    content: url(../../images/fab.svg);
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s,-webkit-transform .2s
}

devsite-googler-buttons[active] .devsite-googler-speed-dial:before {
    content: "close";
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

devsite-header {
    display: block;
    position: relative;
    z-index: 1006
}

body[ready] devsite-header[fixed] {
    contain: layout;
    pointer-events: none;
    position: fixed;
    top: 0;
    width: 100%
}

body[ready][concierge] devsite-header[fixed] {
    contain: unset;
    top: auto;
    position: static;
    z-index: unset
}

devsite-header .devsite-top-logo-row-wrapper-wrapper {
    border-bottom: var(--devsite-header-border,0);
    position: relative;
    z-index: 1
}

body[ready][concierge] devsite-header[fixed] .devsite-top-logo-row-wrapper-wrapper {
    position: fixed;
    z-index: 1007;
    left: 0;
    right: 0
}

devsite-header .devsite-top-logo-row-wrapper-wrapper,devsite-header .devsite-top-logo-row-wrapper-wrapper:before {
    background: var(--devsite-header-color-upper,var(--devsite-background-1))
}

body[ready] devsite-header[fixed] .devsite-top-logo-row-wrapper-wrapper:before {
    content: "";
    height: 400px;
    position: absolute;
    -webkit-transform: translateY(-400px);
    transform: translateY(-400px);
    width: 100%
}

devsite-header[fixed] .devsite-top-logo-row-wrapper-wrapper {
    pointer-events: all
}

devsite-header .devsite-collapsible-section {
    position: relative
}

[dir=ltr] body[concierge=hide] devsite-header .devsite-collapsible-section {
    right: 0;
    -webkit-transition: right .1s cubic-bezier(0,0,.2,1);
    transition: right .1s cubic-bezier(0,0,.2,1)
}

[dir=rtl] body[concierge=hide] devsite-header .devsite-collapsible-section {
    left: 0;
    -webkit-transition: left .1s cubic-bezier(0,0,.2,1);
    transition: left .1s cubic-bezier(0,0,.2,1)
}

body[ready][concierge] devsite-header[fixed] .devsite-collapsible-section {
    position: fixed;
    left: 0;
    right: 0;
    top: var(--devsite-js-top-row--height,49px);
    z-index: 1005
}

[dir=ltr] body[ready][concierge] devsite-header[fixed] .devsite-collapsible-section {
    right: var(--devsite-concierge-width,0)
}

[dir=rtl] body[ready][concierge] devsite-header[fixed] .devsite-collapsible-section {
    left: var(--devsite-concierge-width,0)
}

devsite-header .devsite-collapsible-section,devsite-header[no-lower-row][fixed] {
    box-shadow: var(--devsite-header-lower-box-shadow,0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color))
}

devsite-header[fixed] .devsite-collapsible-section {
    contain: style;
    pointer-events: all;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    will-change: transform
}

devsite-header .devsite-top-logo-row {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-header-color-upper,var(--devsite-background-1));
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    height: 48px;
    padding: 0 16px 0 24px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

[dir=rtl] devsite-header .devsite-top-logo-row {
    padding: 0 24px 0 16px
}

devsite-header .devsite-top-button {
    background: var(--devsite-header-link-background,0);
    border-radius: var(--devsite-header-link-border-radius,var(--devsite-button-border-radius,2px));
    color: var(--devsite-header-link-color,var(--devsite-secondary-text-rgba));
    padding: var(--devsite-header-link-padding,0 8px);
    -webkit-text-decoration: var(--devsite-header-link-text-decoration);
    -moz-text-decoration: var(--devsite-header-link-text-decoration);
    text-decoration: var(--devsite-header-link-text-decoration);
    -webkit-transition: background .2s,box-shadow .2s,color .2s;
    transition: background .2s,box-shadow .2s,color .2s
}

devsite-header .devsite-top-button,devsite-header .devsite-top-button:active,devsite-header .devsite-top-button:focus,devsite-header .devsite-top-button:hover {
    border: 0
}

devsite-header .devsite-top-button:active,devsite-header .devsite-top-button:focus,devsite-header .devsite-top-button:hover {
    color: var(--devsite-header-link-color-active,var(--devsite-primary-text-rgba));
    -webkit-text-decoration: var(--devsite-header-link-text-decoration-active);
    -moz-text-decoration: var(--devsite-header-link-text-decoration-active);
    text-decoration: var(--devsite-header-link-text-decoration-active)
}

devsite-header .devsite-top-button:focus {
    background: var(--devsite-header-link-background-focus,var(--devsite-header-link-background-hover,var(--devsite-header-link-background-active,var(--devsite-background-3))))
}

devsite-header .devsite-top-button:hover {
    background: var(--devsite-header-link-background-hover,var(--devsite-header-link-background-active,var(--devsite-background-3)))
}

devsite-header .devsite-top-button:active {
    background: var(--devsite-header-link-background-active,var(--devsite-background-3));
    box-shadow: var(--devsite-header-link-box-shadow-active,none)
}

devsite-header .devsite-header-icon-button {
    color: var(--devsite-header-icon-color,var(--devsite-secondary-text-rgba));
    display: none;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    height: 24px;
    min-width: 24px;
    padding: 0;
    -webkit-transition: color .2s;
    transition: color .2s;
    width: 24px
}

devsite-header .devsite-header-icon-button:active,devsite-header .devsite-header-icon-button:focus,devsite-header .devsite-header-icon-button:hover {
    color: var(--devsite-header-icon-color-active,var(--devsite-primary-text-rgba))
}

devsite-header .devsite-top-logo-row-middle {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    position: relative
}

devsite-header .devsite-collapsible-section {
    background-color: var(--devsite-header-color-lower,var(--devsite-primary-color,var(--devsite-secondary-text-color)))
}

@media screen and (max-width: 840px) {
    devsite-header {
        -webkit-transform:translateZ(0);
        transform: translateZ(0)
    }

    body[ready][concierge] devsite-header[fixed] {
        contain: layout;
        position: fixed;
        z-index: 1006
    }

    devsite-header .devsite-top-logo-row {
        padding: 0 16px;
        gap: 8px
    }

    devsite-header .devsite-header-upper-tabs devsite-tabs {
        margin: 0 0 0 16px
    }

    [dir=rtl] devsite-header .devsite-header-upper-tabs devsite-tabs {
        margin: 0 16px 0 0
    }

    devsite-header .devsite-header-upper-tabs .devsite-doc-set-nav {
        display: none
    }
}

devsite-header .devsite-header-billboard {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--devsite-header-color-lower,var(--devsite-primary-color,var(--devsite-background-1)));
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 40px 24px 20px;
    position: relative;
    z-index: 100
}

devsite-header .devsite-header-billboard h1 {
    line-height: var(--devsite-h1-line-height,1em);
    overflow: visible;
    padding: 0
}

devsite-header .devsite-header-billboard-logo {
    max-height: 64px
}

devsite-header .devsite-header-billboard-search {
    margin: 0 auto;
    max-width: 816px;
    padding-bottom: 48px
}

devsite-header .devsite-header-billboard-search devsite-search {
    width: 100%
}

devsite-header .devsite-header-billboard-search devsite-search .devsite-popout-result {
    max-height: 50vh
}

devsite-header .devsite-header-billboard-search .devsite-search-background,devsite-header .devsite-header-billboard-search devsite-search .devsite-searchbox:before {
    background: var(--devsite-header-color-lower,var(--devsite-primary-color,var(--devsite-background-1)))
}

@media screen and (max-width: 840px) {
    devsite-header .devsite-header-billboard-search {
        margin:0 24px
    }
}

devsite-header .devsite-doc-set-nav-row {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: var(--devsite-header-lower-tabs-border-bottom,none);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    min-height: 48px;
    padding: 0 24px 0 0
}

[dir=rtl] devsite-header .devsite-doc-set-nav-row {
    padding: 0 0 0 24px
}

[dir=ltr] devsite-header .devsite-doc-set-nav-row .devsite-breadcrumb-list {
    padding-left: 24px
}

[dir=rtl] devsite-header .devsite-doc-set-nav-row .devsite-breadcrumb-list {
    padding-right: 24px
}

@media screen and (max-width: 840px) {
    devsite-header .devsite-doc-set-nav-row {
        display:none
    }
}

@media screen and (max-width: 600px) {
    devsite-header devsite-language-selector {
        display:none
    }
}

devsite-header .devsite-header-link {
    -webkit-transition: background .2s,box-shadow .2s,color .2s;
    transition: background .2s,box-shadow .2s,color .2s
}

devsite-header .devsite-header-link,devsite-header .devsite-header-link:visited {
    color: var(--devsite-header-link-color,var(--devsite-secondary-text-rgba))
}

devsite-header .devsite-header-link:focus,devsite-header .devsite-header-link:hover {
    color: var(--devsite-header-link-color-active,var(--devsite-primary-text-rgba))
}

devsite-header .devsite-header-link+.devsite-header-link {
    margin: 0
}

@media screen and (max-width: 840px) {
    devsite-header .devsite-header-link {
        display:none
    }
}

devsite-header .devsite-product-name-wrapper {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    height: 36px;
    margin: 6px 0
}

devsite-header .devsite-product-name-link,devsite-header .devsite-site-logo-link {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 1;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

devsite-header .devsite-product-name-link:focus,devsite-header .devsite-product-name-link:hover,devsite-header .devsite-site-logo-link:focus {
    opacity: .7;
    text-decoration: none
}

devsite-header .devsite-site-logo {
    aspect-ratio: var(--devsite-logo-aspect-ratio,auto);
    height: var(--devsite-logo-height,32px)
}

devsite-header .devsite-has-google-wordmark>.devsite-breadcrumb-link,devsite-header .devsite-has-google-wordmark>.devsite-product-name {
    direction: ltr
}

devsite-header .devsite-google-wordmark {
    height: 24px;
    margin: 0 4px 0 0;
    position: relative;
    top: 5px
}

devsite-header .devsite-google-wordmark-svg-path {
    -webkit-transition: fill .2s;
    transition: fill .2s
}

devsite-header .devsite-site-logo-link canvas {
    height: auto!important
}

devsite-header .devsite-site-logo-link picture {
    display: contents
}

devsite-header .devsite-product-logo-container {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 36px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-inline:0 4px;width: 36px
}

devsite-header .devsite-top-logo-row .devsite-product-logo-container {
    color: var(--devsite-primary-color,var(--devsite-primary-text-color))
}

devsite-header .devsite-top-logo-row .devsite-product-logo-container[background] {
    background: var(--devsite-primary-color,var(--devsite-primary-text-color));
    color: var(--devsite-inverted-text-color)
}

devsite-header .devsite-product-logo {
    color: inherit;
    display: block;
    font-size: 32px;
    height: 32px;
    max-width: 32px;
    min-width: 32px;
    overflow: hidden;
    white-space: nowrap
}

devsite-header .devsite-product-logo-container[background] .devsite-product-logo {
    font-size: 28px;
    height: 28px;
    max-width: 28px;
    min-width: 28px
}

devsite-header .devsite-product-name {
    font: var(--devsite-wordmark-font,400 20px/32px var(--devsite-primary-font-family));
    letter-spacing: 0;
    margin: 0;
    max-height: 32px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-transition: color .2s;
    transition: color .2s;
    white-space: nowrap
}

devsite-header .devsite-site-logo:not([src*=".svg"]) {
    height: auto;
    max-height: 32px
}

devsite-header .devsite-breadcrumb-link>.devsite-product-name {
    color: inherit
}

@media screen and (max-width: 840px) {
    devsite-header .devsite-product-name-wrapper {
        -webkit-box-flex:0;
        -webkit-flex: 0 1 auto;
        -moz-box-flex: 0;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        min-width: 0
    }

    devsite-header .devsite-product-name-wrapper .devsite-breadcrumb-item:not(:first-of-type),devsite-header .devsite-product-name-wrapper .devsite-site-logo-link+.devsite-product-name {
        display: none
    }

    devsite-header .devsite-product-name-wrapper .devsite-breadcrumb-item,devsite-header .devsite-product-name-wrapper .devsite-breadcrumb-link,devsite-header .devsite-product-name-wrapper .devsite-breadcrumb-list,devsite-header .devsite-product-name-wrapper .devsite-product-name {
        width: 100%
    }

    devsite-header .devsite-product-name-wrapper .devsite-breadcrumb-link {
        overflow: hidden;
        text-overflow: ellipsis
    }
}

devsite-header .devsite-product-id-row {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    min-height: 56px;
    padding: var(--devsite-product-id-row-padding,20px 24px 0)
}

devsite-header .devsite-header-no-lower-tabs .devsite-product-id-row {
    min-height: 76px;
    padding: var(--devsite-product-id-row-padding,20px 24px)
}

devsite-header .devsite-product-description-row {
    color: var(--devsite-header-foreground-lower-description,var(--devsite-header-foreground-lower-hover,var(--devsite-inverted-text-color)));
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font: var(--devsite-header-lower-description-font,400 20px/32px var(--devsite-primary-font-family));
    gap: 8px
}

devsite-header .devsite-product-description-row .devsite-breadcrumb-item .devsite-breadcrumb-peers {
    --devsite-select-background-color-active: transparent;
    --devsite-select-background-color-hover: transparent;
    --devsite-select-border: 1px solid transparent;
    --devsite-select-border-hover: 1px solid var(--devsite-link-color);
    --devsite-select-font: none;
    --devsite-select-toggle-icon-size: 24px;
    --devsite-select-padding-inline: 7px 31px;
    --devsite-select-toggle-icon-x: 4px;
    margin-inline:-4px}

devsite-header .devsite-product-description-row .devsite-breadcrumb-item:first-of-type .devsite-breadcrumb-peers {
    margin-inline:-8px -4px}

devsite-header .devsite-product-id {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-header .devsite-product-description {
    font: 16px/24px var(--devsite-primary-font-family);
    margin-block:0;margin-inline:0 180px}

devsite-header .devsite-product-button-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin-block:0;margin-inline:24px 0;z-index: 1
}

@media screen and (max-width: 840px) {
    devsite-header .devsite-product-id-row {
        min-height:76px;
        padding: var(--devsite-product-id-row-padding,20px 24px)
    }

    devsite-header .devsite-product-description {
        margin-inline:0}
}

@media screen and (max-width: 600px) {
    devsite-header .devsite-header-no-lower-tabs .devsite-product-id-row,devsite-header .devsite-product-id-row {
        -webkit-flex-wrap:wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: var(--devsite-product-id-row-padding,20px 16px)
    }

    devsite-header .devsite-product-button-row {
        -webkit-flex-basis: 100%;
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        margin-block:16px 0;margin-inline:0}
}

devsite-header[search-expanded] .devsite-header-upper-tabs {
    opacity: 0;
    position: absolute
}

devsite-header[search-expanded] devsite-search {
    -webkit-box-flex: 1;
    -webkit-flex: 1 0;
    -moz-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0
}

devsite-header [transition] {
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s,-webkit-transform .2s
}

devsite-header[search-active] .devsite-search-background:after {
    background: var(--devsite-searchbox-active,var(--devsite-background-3))
}

devsite-header devsite-search[search-active] .devsite-search-field::-webkit-input-placeholder {
    color: var(--devsite-searchbox-placeholder-active,var(--devsite-secondary-text-color))
}

devsite-header devsite-search[search-active] .devsite-search-field::-moz-placeholder {
    color: var(--devsite-searchbox-placeholder-active,var(--devsite-secondary-text-color))
}

devsite-header devsite-search[search-active] .devsite-search-field:-ms-input-placeholder {
    color: var(--devsite-searchbox-placeholder-active,var(--devsite-secondary-text-color))
}

devsite-header devsite-search[search-active] .devsite-search-field::-ms-input-placeholder {
    color: var(--devsite-searchbox-placeholder-active,var(--devsite-secondary-text-color))
}

devsite-header devsite-search[search-active] .devsite-search-field::placeholder {
    color: var(--devsite-searchbox-placeholder-active,var(--devsite-secondary-text-color))
}

devsite-header devsite-search[search-active] .devsite-search-field,devsite-header devsite-search[search-active] .devsite-search-field:hover {
    background: var(--devsite-searchbox-active,var(--devsite-background-3));
    color: var(--devsite-searchbox-text-active,var(--devsite-primary-text-color))
}

devsite-header devsite-search[search-active] .devsite-search-image {
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color))
}

@media screen and (max-width: 840px) {
    devsite-header[search-active] .devsite-product-name-wrapper,devsite-header[search-active] devsite-language-selector,devsite-header[search-active] devsite-user {
        display:none
    }

    devsite-header[search-active] devsite-search {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        -webkit-transform: none!important;
        transform: none!important
    }

    devsite-header[search-active] .devsite-header-upper-tabs {
        -webkit-box-flex: 0;
        -webkit-flex: 0 1;
        -moz-box-flex: 0;
        -ms-flex: 0 1;
        flex: 0 1;
        overflow: hidden
    }

    devsite-header[search-active] .devsite-top-logo-row devsite-search {
        margin: 6px 0
    }

    devsite-header .devsite-top-logo-row devsite-search[search-active] .devsite-searchbox {
        width: 100%
    }

    devsite-header devsite-search[search-active] .devsite-search-form {
        border-radius: var(--devsite-search-border-radius,0);
        box-shadow: var(--devsite-search-active-box-shadow,none);
        left: 0;
        overflow: var(--devsite-search-active-overflow,visible);
        position: var(--devsite-search-form-position,relative);
        top: 0
    }

    [dir=ltr] devsite-header devsite-search[search-active] .devsite-search-form {
        right: var(--devsite-search-form-position-end,auto)
    }

    [dir=rtl] devsite-header devsite-search[search-active] .devsite-search-form {
        left: var(--devsite-search-form-position-end,auto)
    }

    devsite-header devsite-search[search-active] .devsite-search-field,devsite-header devsite-search[search-active] .devsite-search-field:hover {
        background: var(--devsite-search-form-background-active,var(--devsite-background-3));
        color: var(--devsite-search-form-text-active,var(--devsite-primary-text-color))
    }

    [dir=ltr] devsite-header .devsite-header-billboard-search devsite-search[search-active] .devsite-search-form {
        right: var(--devsite-search-form-position-start,auto)
    }

    [dir=rtl] devsite-header .devsite-header-billboard-search devsite-search[search-active] .devsite-search-form {
        left: var(--devsite-search-form-position-start,auto)
    }

    devsite-header .devsite-top-logo-row devsite-search[search-active] .devsite-searchbox .devsite-search-image {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex
    }

    devsite-header .devsite-top-logo-row devsite-search .devsite-searchbox:before,devsite-header .devsite-top-logo-row devsite-search[search-active] .devsite-popout {
        width: var(--devsite-popout-width,calc(100vw + 16px))
    }

    [dir=ltr] devsite-header .devsite-top-logo-row devsite-search .devsite-searchbox:before,[dir=ltr] devsite-header .devsite-top-logo-row devsite-search[search-active] .devsite-popout {
        left: var(--devsite-popout-position-start,-60px)
    }

    [dir=rtl] devsite-header .devsite-top-logo-row devsite-search .devsite-searchbox:before,[dir=rtl] devsite-header .devsite-top-logo-row devsite-search[search-active] .devsite-popout {
        right: var(--devsite-popout-position-start,-60px)
    }

    devsite-header .devsite-top-logo-row devsite-search[search-active] .devsite-search-button {
        margin-block:0;margin-inline:var(--devsite-search-button-margin-before,16px) 0}

    devsite-header .devsite-top-logo-row devsite-search[search-active] .devsite-search-button[search-open] {
        display: none
    }

    devsite-header .devsite-top-logo-row devsite-search[search-active] .devsite-search-button[search-close] {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex
    }

    devsite-header [transition] {
        -webkit-transition: none;
        transition: none
    }
}

@-webkit-keyframes smart-gradient {
    0% {
        background-position: 100% 100%
    }

    to {
        background-position: top 37.5% left 37.5%
    }
}

devsite-header .devsite-search-background {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: stretch;
    -webkit-justify-content: stretch;
    -moz-box-pack: stretch;
    -ms-flex-pack: stretch;
    justify-content: stretch;
    margin-block:0;margin-inline:24px 0;padding: 6px 0;
    pointer-events: none;
    position: absolute;
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s,-webkit-transform .2s;
    will-change: transition;
    z-index: 9
}

[dir=ltr] devsite-header .devsite-search-background {
    right: 0;
    -webkit-transform-origin: right center;
    transform-origin: right center
}

[dir=rtl] devsite-header .devsite-search-background {
    left: 0;
    -webkit-transform-origin: left center;
    transform-origin: left center
}

devsite-header .devsite-search-background,devsite-header .devsite-searchbox:before {
    background: var(--devsite-header-color-upper,var(--devsite-background-1))
}

devsite-header .devsite-search-background:after {
    content: "";
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: 100%;
    -webkit-transition: background .2s;
    transition: background .2s
}

devsite-header .devsite-search-background:after,devsite-header devsite-search input.devsite-search-field {
    background: var(--devsite-searchbox-inactive)
}

devsite-header devsite-search input.devsite-search-field::-webkit-input-placeholder {
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color))
}

devsite-header devsite-search input.devsite-search-field::-moz-placeholder {
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color))
}

devsite-header devsite-search input.devsite-search-field:-ms-input-placeholder {
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color))
}

devsite-header devsite-search input.devsite-search-field::-ms-input-placeholder {
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color))
}

devsite-header devsite-search input.devsite-search-field::placeholder {
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color))
}

devsite-header devsite-search[enable-search-summaries] .devsite-search-field:hover {
    -webkit-animation: smart-gradient 2.1s linear infinite;
    animation: smart-gradient 2.1s linear infinite;
    background: -webkit-linear-gradient(315deg,#d3e3fd,#d7f6ff,#a8c7fa,#a7edff,#d3e3fd,#d3e3fd,#d7f6ff,#a8c7fa,#a7edff,#d3e3fd);
    background: linear-gradient(135deg,#d3e3fd,#d7f6ff,#a8c7fa,#a7edff,#d3e3fd,#d3e3fd,#d7f6ff,#a8c7fa,#a7edff,#d3e3fd);
    background-size: 800% 800%
}

devsite-header devsite-search .devsite-search-image,devsite-header devsite-search input.devsite-search-field {
    color: var(--devsite-searchbox-placeholder,var(--devsite-secondary-text-color))
}

devsite-header[billboard] .devsite-search-background {
    display: none
}

devsite-header[billboard][bottom-row--hidden] .devsite-search-background {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-header[billboard] .devsite-top-logo-row devsite-search .devsite-search-form {
    opacity: 1;
    -webkit-transition: opacity .2s,-webkit-transform .2s;
    transition: opacity .2s,-webkit-transform .2s;
    transition: opacity .2s,transform .2s;
    transition: opacity .2s,transform .2s,-webkit-transform .2s
}

devsite-header[billboard][bottom-row--hidden] .devsite-top-logo-row devsite-search .devsite-search-form {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

body[template="404"] devsite-header .devsite-top-logo-row .devsite-search-form,devsite-header[billboard]:not([bottom-row--hidden]) .devsite-top-logo-row devsite-search .devsite-search-form {
    opacity: 0;
    pointer-events: none
}

[dir=ltr] body[template="404"] devsite-header .devsite-top-logo-row .devsite-search-form,[dir=ltr] devsite-header[billboard]:not([bottom-row--hidden]) .devsite-top-logo-row devsite-search .devsite-search-form {
    -webkit-transform: translate3d(200px,0,0);
    transform: translate3d(200px,0,0)
}

[dir=rtl] body[template="404"] devsite-header .devsite-top-logo-row .devsite-search-form,[dir=rtl] devsite-header[billboard]:not([bottom-row--hidden]) .devsite-top-logo-row devsite-search .devsite-search-form {
    -webkit-transform: translate3d(-200px,0,0);
    transform: translate3d(-200px,0,0)
}

devsite-header[billboard][bottom-row--hidden] .devsite-header-billboard-search devsite-search {
    opacity: 0
}

devsite-header[billboard] .devsite-header-billboard-search devsite-search {
    margin-inline:0}

devsite-header[billboard] .devsite-header-billboard-search devsite-search .devsite-popout {
    max-height: calc(100vh - 255px)
}

@media screen and (max-width: 840px) {
    devsite-header .devsite-top-logo-row devsite-search {
        width:auto
    }

    devsite-header .devsite-top-logo-row devsite-search .devsite-searchbox {
        width: 0
    }

    devsite-header .devsite-search-background,devsite-header .devsite-search-background:after,devsite-header devsite-search .devsite-search-field,devsite-header devsite-search .devsite-search-field:hover,devsite-header devsite-search[enable-search-summaries] .devsite-search-field:hover,devsite-header[search-active] .devsite-search-background:after {
        background: 0
    }

    devsite-header devsite-search[enable-search-summaries] .devsite-search-field:hover {
        -webkit-animation: none;
        animation: none
    }

    devsite-header .devsite-top-logo-row devsite-search .devsite-searchbox .devsite-search-image {
        display: none
    }

    devsite-header .devsite-top-logo-row devsite-search .devsite-search-button {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        color: var(--devsite-secondary-text-color);
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        z-index: 1
    }

    devsite-header .devsite-top-logo-row devsite-search .devsite-search-button[search-open] {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex
    }

    devsite-header .devsite-top-logo-row devsite-search .devsite-search-button[search-close] {
        display: none;
        margin-right: 6px
    }

    devsite-header .devsite-top-logo-row devsite-search .devsite-search-button[search-open]:before {
        content: "search"
    }

    devsite-header .devsite-top-logo-row devsite-search .devsite-search-button[search-close]:before {
        content: "cancel"
    }

    devsite-header .devsite-top-logo-row devsite-search .devsite-result-item a,devsite-header .devsite-top-logo-row devsite-search .devsite-result-label,devsite-header .devsite-top-logo-row devsite-search .devsite-suggest-footer,devsite-header .devsite-top-logo-row devsite-search .devsite-suggest-header {
        padding-inline:var(--devsite-search-content-padding-start,60px) 8px}
}

devsite-header .devsite-tabs-dropdown-only {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background: 0;
    border: 0;
    box-shadow: unset;
    -moz-box-sizing: unset;
    box-sizing: unset;
    color: unset;
    font: unset;
    height: unset;
    line-height: unset;
    margin: 0;
    outline: 0;
    padding: 0;
    pointer-events: unset;
    text-align: unset
}

devsite-header .devsite-header-upper-tabs {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 0;
    -moz-box-flex: 1;
    -ms-flex: 1 1 0px;
    flex: 1 1 0;
    margin-block:0;margin-inline:var(--devsite-upper-tab-margin-x,32px) 0;opacity: 1;
    position: relative;
    z-index: 8
}

devsite-header devsite-tabs tab a:focus,devsite-header devsite-tabs tab a:hover {
    text-decoration: none
}

devsite-header cloudx-tabs-nav.upper-tabs .devsite-tabs-wrapper,devsite-header devsite-tabs.upper-tabs .devsite-tabs-wrapper {
    background: var(--devsite-header-color-upper,var(--devsite-background-1))
}

devsite-header devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab>.devsite-tabs-dropdown-toggle:focus,devsite-header devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab>.devsite-tabs-dropdown-toggle:hover,devsite-header devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab>.devsite-tabs-overflow-button:focus,devsite-header devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab>.devsite-tabs-overflow-button:hover,devsite-header devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab>a:focus,devsite-header devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab>a:hover {
    color: var(--devsite-upper-tab-hover,var(--devsite-upper-tab-active,var(--devsite-primary-text-color)))
}

devsite-header devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab>a:focus:after,devsite-header devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab>a:hover:after {
    border-color: var(--devsite-upper-tab-marker-color-inactive,var(--devsite-upper-tab-inactive,var(--devsite-secondary-text-color)))
}

devsite-header cloudx-tabs-nav.lower-tabs .devsite-tabs-dropdown-toggle,devsite-header cloudx-tabs-nav.lower-tabs .devsite-tabs-overflow-button,devsite-header cloudx-tabs-nav.lower-tabs a,devsite-header devsite-tabs.lower-tabs .devsite-tabs-content,devsite-header devsite-tabs.lower-tabs .devsite-tabs-dropdown-toggle,devsite-header devsite-tabs.lower-tabs .devsite-tabs-overflow-button,devsite-header devsite-tabs.lower-tabs a {
    color: var(--devsite-header-foreground-lower,var(--devsite-inverted-text-color));
    letter-spacing: var(--devsite-header-lower-tabs-letter-spacing,0)
}

devsite-header cloudx-tabs-nav.lower-tabs .devsite-tabs-dropdown-toggle:focus,devsite-header cloudx-tabs-nav.lower-tabs .devsite-tabs-dropdown-toggle:hover,devsite-header cloudx-tabs-nav.lower-tabs .devsite-tabs-overflow-button:focus,devsite-header cloudx-tabs-nav.lower-tabs .devsite-tabs-overflow-button:hover,devsite-header cloudx-tabs-nav.lower-tabs a:focus,devsite-header cloudx-tabs-nav.lower-tabs a:hover,devsite-header devsite-tabs.lower-tabs .devsite-tabs-content:focus,devsite-header devsite-tabs.lower-tabs .devsite-tabs-content:hover,devsite-header devsite-tabs.lower-tabs .devsite-tabs-dropdown-toggle:focus,devsite-header devsite-tabs.lower-tabs .devsite-tabs-dropdown-toggle:hover,devsite-header devsite-tabs.lower-tabs .devsite-tabs-overflow-button:focus,devsite-header devsite-tabs.lower-tabs .devsite-tabs-overflow-button:hover,devsite-header devsite-tabs.lower-tabs a:focus,devsite-header devsite-tabs.lower-tabs a:hover {
    color: var(--devsite-header-foreground-lower-hover,var(--devsite-header-foreground-lower,var(--devsite-inverted-text-rgba)))
}

devsite-header cloudx-tabs-nav.lower-tabs tab.devsite-active>a,devsite-header devsite-tabs.lower-tabs tab.devsite-active>.devsite-tabs-content,devsite-header devsite-tabs.lower-tabs tab.devsite-active>a {
    color: var(--devsite-header-foreground-lower-active,var(--devsite-inverted-text-color))
}

devsite-header cloudx-tabs-nav.lower-tabs tab.devsite-active>a:focus,devsite-header devsite-tabs.lower-tabs tab.devsite-active>.devsite-tabs-content:focus,devsite-header devsite-tabs.lower-tabs tab.devsite-active>a:focus {
    color: var(--devsite-header-foreground-lower-active-focus,var(--devsite-header-foreground-lower,var(--devsite-inverted-text-rgba)))
}

@media screen and (-ms-high-contrast:active),screen and (prefers-contrast:high) {
    devsite-header cloudx-tabs-nav.lower-tabs tab.devsite-active>a,devsite-header devsite-tabs.lower-tabs tab.devsite-active>.devsite-tabs-content,devsite-header devsite-tabs.lower-tabs tab.devsite-active>a {
        color: inherit
    }
}

devsite-header cloudx-tabs-nav.lower-tabs .devsite-tabs-overflow-button:focus:before,devsite-header cloudx-tabs-nav.lower-tabs .devsite-tabs-overflow-button:hover:before,devsite-header cloudx-tabs-nav.lower-tabs tab.devsite-dropdown .devsite-tabs-dropdown-toggle:focus:before,devsite-header cloudx-tabs-nav.lower-tabs tab.devsite-dropdown .devsite-tabs-dropdown-toggle:hover:before,devsite-header devsite-tabs.lower-tabs .devsite-tabs-overflow-button:focus:before,devsite-header devsite-tabs.lower-tabs .devsite-tabs-overflow-button:hover:before,devsite-header devsite-tabs.lower-tabs tab.devsite-dropdown .devsite-tabs-dropdown-toggle:focus:before,devsite-header devsite-tabs.lower-tabs tab.devsite-dropdown .devsite-tabs-dropdown-toggle:hover:before {
    background-color: var(--devsite-header-color-lower-hover,var(--devsite-secondary-color,var(--devsite-primary-text-color)))
}

devsite-header cloudx-tabs-nav.lower-tabs>.devsite-tabs-wrapper>tab>a:after,devsite-header devsite-tabs.lower-tabs>.devsite-tabs-wrapper>tab>a:after {
    border-radius: var(--devsite-lower-tab-marker-border-radius,var(--devsite-tab-marker-border-radius,0))
}

devsite-header devsite-tabs.lower-tabs>.devsite-tabs-wrapper>tab>a:focus:after,devsite-header devsite-tabs.lower-tabs>.devsite-tabs-wrapper>tab>a:hover:after {
    border-color: var(--devsite-lower-tab-marker-color-inactive,var(--devsite-header-foreground-lower,var(--devsite-inverted-text-rgba)))
}

devsite-header cloudx-tabs-nav.lower-tabs>.devsite-tabs-wrapper>tab.devsite-active>a:after,devsite-header devsite-tabs.lower-tabs>.devsite-tabs-wrapper>tab.devsite-active>a:after {
    border-color: var(--devsite-lower-tab-marker-color-active,var(--devsite-header-foreground-lower-active,var(--devsite-background-1)))
}

devsite-header devsite-tabs.upper-tabs tab.devsite-overflow-tab:after {
    background: var(--devsite-header-color-upper,var(--devsite-background-1))
}

devsite-header cloudx-tabs-nav.upper-tabs .devsite-tabs-overflow-menu,devsite-header devsite-tabs.upper-tabs .devsite-tabs-overflow-menu {
    border-top: var(--devsite-header-border,0)
}

@media screen and (max-width: 840px) {
    [dir=ltr] devsite-header .devsite-header-upper-tabs {
        margin-left:0
    }

    [dir=rtl] devsite-header .devsite-header-upper-tabs {
        margin-right: 0
    }

    devsite-header devsite-tabs.lower-tabs,devsite-header devsite-tabs.upper-tabs {
        display: none
    }
}

.devsite-heading-link {
    --devsite-button-white-line-height: 24px;
    --devsite-button-white-background-hover: transparent
}

.devsite-heading-link.material-icons {
    color: var(--devsite-icon-color,var(--devsite-secondary-text-color));
    height: 24px;
    opacity: 0
}

.devsite-heading-link.material-icons:focus,.devsite-heading-link.material-icons:hover {
    color: var(--devsite-icon-color-hover,var(--devsite-link-color));
    cursor: pointer!important
}

.devsite-landing-row-item-list h4>.devsite-heading-link.material-icons,h1>.devsite-heading-link.material-icons,h2>.devsite-heading-link.material-icons,h3>.devsite-heading-link.material-icons {
    vertical-align: middle
}

.devsite-landing-row-item-list h4>.devsite-heading-link.material-icons,th>h2>.devsite-heading-link.material-icons,th>h3>.devsite-heading-link.material-icons {
    margin: -4px 0
}

.devsite-heading-link.material-icons:focus,.devsite-heading-link.material-icons:hover,:focus>.devsite-heading-link.material-icons,:hover>.devsite-heading-link.material-icons {
    opacity: 1
}

.devsite-heading-link:after {
    content: "link"
}

devsite-iframe {
    display: block;
    width: 100%
}

devsite-iframe+* {
    position: relative
}

devsite-iframe+devsite-iframe {
    margin-top: 16px
}

devsite-iframe iframe {
    height: 100%;
    width: 100%
}

devsite-iframe iframe[src*=".frame"] {
    height: calc(100% + 32px);
    margin: -16px;
    width: calc(100% + 32px)
}

devsite-info-popout:not(:defined) {
    visibility: hidden
}

devsite-interests .devsite-interests-container {
    border: var(--devsite-primary-border);
    border-radius: 8px;
    margin-top: 40px
}

devsite-interests .devsite-interests-header {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 26px 24px 2px
}

devsite-interests .devsite-interests-header h2 {
    font-size: 18px;
    line-height: 26px;
    margin: 0
}

devsite-interests .devsite-interests-header h3 {
    font-size: 18px;
    line-height: 26px;
    margin: 0
}

[dir=ltr] devsite-interests .devsite-interests-header .devsite-interests-clear {
    margin-left: auto
}

[dir=rtl] devsite-interests .devsite-interests-header .devsite-interests-clear {
    margin-right: auto
}

devsite-interests .devsite-interests-body {
    padding: 24px
}

devsite-interests .devsite-interests-footer {
    padding: 24px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    border-top: var(--devsite-primary-border)
}

devsite-interests .devsite-interests-chips {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: -8px;
    -webkit-box-align: start;
    -webkit-align-items: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    -webkit-align-content: start;
    -ms-flex-line-pack: start;
    align-content: start;
    overflow-y: auto
}

devsite-interests .devsite-interests-chips-container {
    width: 100%
}

devsite-interests .devsite-interests-chips-container .main-chips {
    max-height: 418px;
    min-height: 418px;
    padding-bottom: 8px
}

devsite-interests .devsite-interests-chips-container .devsite-interests-chips-suggested-container {
    margin-top: 30px
}

devsite-interests devsite-chip {
    margin: 8px 0 0
}

.close-suggested-chip-container {
    margin: 0 4px
}

devsite-interests .devsite-interests-no-results {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 32px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    max-width: 100%;
    width: 100%;
    height: 408px
}

devsite-interests .devsite-interests-no-results .devsite-interests-no-results-image {
    width: 250px
}

devsite-interests .devsite-interests-searchbox {
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    border-radius: 4px;
    border: var(--devsite-primary-border);
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 24px;
    padding: 8px 4px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
}

devsite-interests .devsite-interests-searchbox .devsite-search-image {
    color: #5f6368;
    font-size: 24px
}

[dir=ltr] devsite-interests .devsite-interests-searchbox .devsite-search-image {
    margin-left: 8px
}

[dir=rtl] devsite-interests .devsite-interests-searchbox .devsite-search-image {
    margin-right: 8px
}

devsite-interests .devsite-cancel-search-button {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background: 0;
    box-shadow: unset;
    -moz-box-sizing: unset;
    box-sizing: unset;
    color: unset;
    font: unset;
    height: unset;
    line-height: unset;
    outline: 0;
    pointer-events: unset;
    text-align: unset;
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    background: none;
    border-radius: 50%;
    border: 0;
    height: 32px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 32px;
    background-color: transparent;
    color: #5f6368
}

.color-scheme--dark devsite-interests .devsite-cancel-search-button {
    background-color: transparent;
    color: #9aa0a6
}

devsite-interests .devsite-cancel-search-button:focus,devsite-interests .devsite-cancel-search-button:hover {
    background-color: rgba(95,99,104,.08);
    color: #5f6368
}

.color-scheme--dark devsite-interests .devsite-cancel-search-button:focus,.color-scheme--dark devsite-interests .devsite-cancel-search-button:hover {
    background-color: #3c4043;
    color: #bdc1c6
}

devsite-interests .devsite-cancel-search-button:active {
    background-color: rgba(95,99,104,.12);
    color: #5f6368
}

.color-scheme--dark devsite-interests .devsite-cancel-search-button:active {
    background-color: #505356;
    color: #bdc1c6
}

devsite-interests .devsite-interests-searchbox .devsite-searchbox-input {
    border: none;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: 40px;
    outline: none;
    padding: 6px
}

devsite-interests .devsite-interests-searchbox devsite-feature-tooltip {
    left: 10px;
    top: 5px
}

devsite-interests .devsite-inferred-header-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-interests .devsite-inferred-info {
    margin-left: 6px
}

devsite-interests .devsite-profile-inferred-chips {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: -8px;
    -webkit-box-align: start;
    -webkit-align-items: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    -webkit-align-content: start;
    -ms-flex-line-pack: start;
    align-content: start
}

devsite-jump-to {
    display: block;
    margin: 40px 0 0!important;
    opacity: 0;
    padding-bottom: 96px;
    pointer-events: none;
    position: relative;
    -webkit-transition: opacity .5s;
    transition: opacity .5s
}

devsite-jump-to[visible] {
    opacity: 1;
    pointer-events: auto
}

devsite-jump-to .devsite-jump-to-link {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-link-background,var(--devsite-link-color))!important;
    border-radius: 50%;
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color);
    color: var(--devsite-link-color,var(--devsite-inverted-text-color))!important;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 24px;
    height: 56px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    position: absolute;
    -webkit-transition: background .2s,box-shadow .2s,color .2s;
    transition: background .2s,box-shadow .2s,color .2s;
    width: 56px
}

devsite-jump-to .devsite-jump-to-link:focus,devsite-jump-to .devsite-jump-to-link:hover {
    background: var(--devsite-link-background-hover,var(--devsite-background-1))!important;
    color: var(--devsite-link-color)!important;
    text-decoration: none
}

devsite-jump-to .devsite-jump-to-link:active {
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color)
}

[dir=ltr] devsite-jump-to .devsite-jump-to-link {
    right: 0
}

[dir=rtl] devsite-jump-to .devsite-jump-to-link {
    left: 0
}

devsite-jump-to[pinned] .devsite-jump-to-link {
    bottom: 40px;
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color);
    position: fixed
}

devsite-jump-to[pinned] .devsite-jump-to-link:active {
    box-shadow: 0 2px 3px 0 var(--devsite-elevation-key-shadow-color),0 6px 10px 4px var(--devsite-elevation-ambient-shadow-color)
}

devsite-jump-to .devsite-jump-to-link:before {
    content: "arrow_upward";
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal
}

@media screen and (max-width: 840px) {
    devsite-jump-to {
        margin:40px 0 0!important;
        padding-bottom: 80px
    }

    devsite-jump-to[pinned] .devsite-jump-to-link {
        bottom: 24px
    }
}

devsite-key-takeaways {
    display: inline-block;
    position: relative;
    top: 4px
}

.devsite-actions devsite-key-takeaways {
    top: 0
}

@media screen and (max-width: 840px) {
    body[ready] devsite-key-takeaways {
        display:none
    }
}

body[concierge=hide] devsite-key-takeaways {
    display: none
}

devsite-key-takeaways-panel {
    border-radius: 4px;
    border: var(--devsite-primary-border,1px solid #dadce0);
    display: block;
    margin-bottom: 16px
}

devsite-key-takeaways-panel .devsite-key-takeaways-panel-open .devsite-key-takeaways-panel-header {
    border-radius: 3px 3px 0 0;
    border-bottom: var(--devsite-primary-border,1px solid #dadce0)
}

devsite-key-takeaways-panel .devsite-key-takeaways-panel-header {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #e8f0fe;
    border-radius: 3px;
    color: #1967d2;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 8px 16px;
    cursor: pointer
}

.color-scheme--dark devsite-key-takeaways-panel .devsite-key-takeaways-panel-header {
    background-color: #5f6368;
    color: #fff
}

.color-scheme--dark devsite-key-takeaways-panel .devsite-key-takeaways-panel-header img {
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1)
}

devsite-key-takeaways-panel .devsite-key-takeaways-panel-header .devsite-key-takeaways-panel-title {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

devsite-key-takeaways-panel .devsite-key-takeaways-panel-header h2 {
    font: 500 14px/20px Google Sans,Noto Sans,Noto Sans JP,Noto Sans KR,Noto Naskh Arabic,Noto Sans Thai,Noto Sans Hebrew,Noto Sans Bengali,sans-serif;
    --devsite-h2-margin: 0 12px;
    display: inline-block
}

devsite-key-takeaways-panel .devsite-key-takeaways-panel-header .devsite-key-takeaways-panel-toggle-button:before {
    content: "expand_more"
}

devsite-key-takeaways-panel .devsite-key-takeaways-panel-content {
    display: none
}

devsite-key-takeaways-panel.devsite-key-takeaways-panel-open .devsite-key-takeaways-panel-header .devsite-key-takeaways-panel-toggle-button:before {
    content: "expand_less"
}

devsite-key-takeaways-panel.devsite-key-takeaways-panel-open .devsite-key-takeaways-panel-content {
    display: block;
    position: relative;
    padding-right: 56px
}

devsite-key-takeaways-panel.devsite-key-takeaways-panel-open ul {
    padding: 12px 0 16px 32px;
    overflow: hidden;
    position: relative
}

devsite-key-takeaways-panel.devsite-key-takeaways-panel-open ul li {
    font-family: Google Sans;
    font-size: 14px;
    line-height: 20px
}

devsite-key-takeaways-panel devsite-feedback {
    position: absolute;
    top: 4px;
    right: 4px;
    z-index: 10
}

devsite-key-takeaways-panel .devsite-key-takeaways-report-button {
    border-radius: 50%;
    color: #5f6368;
    height: 40px;
    width: 40px
}

devsite-key-takeaways-panel .devsite-key-takeaways-report-button .material-icons {
    vertical-align: middle;
    margin: 2px 0 0 2px
}

.color-scheme--dark devsite-key-takeaways-panel .devsite-key-takeaways-report-button .material-icons {
    color: #9aa0a6
}

devsite-language-selector:not(:defined) ul,devsite-language-selector:not([open]) ul {
    display: none
}

devsite-language-selector ul {
    display: block;
    list-style: none;
    padding: 0
}

devsite-language-selector li {
    font-size: 14px;
    margin: 0;
    min-width: 100%
}

devsite-language-selector a {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 48px;
    min-width: 0;
    overflow: hidden;
    padding-inline:16px;text-overflow: ellipsis;
    white-space: nowrap
}

devsite-language-selector a:is(:link,:visited) {
    color: var(--devsite-primary-text-color)
}

devsite-language-selector a:is(:hover,:focus) {
    background-color: var(--devsite-background-3);
    text-decoration: none
}

devsite-language-selector a[aria-current] {
    background-color: var(--devsite-item-background-selected,var(--devsite-background-3));
    font-weight: var(--devsite-item-font-weight-selected,500)
}

@media screen and (-ms-high-contrast:active),screen and (prefers-contrast:high) {
    devsite-language-selector a[aria-current] {
        font-weight: 700;
        text-decoration: underline
    }
}

.devsite-dialog-wrapper {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    bottom: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    left: 0;
    pointer-events: none;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 1014
}

.devsite-dialog-wrapper.below-site-mask {
    z-index: 1011
}

devsite-dialog {
    background: var(--devsite-background-1);
    border-radius: var(--devsite-border-radius,2px);
    color: var(--devsite-secondary-text-color);
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color);
    font-size: 14px;
    line-height: 20px;
    max-height: calc(100vh - 48px);
    max-width: calc(100vw - 48px);
    pointer-events: all;
    overflow: auto;
    padding: var(--devsite-dialog-padding,8px);
    width: var(--devsite-content-excellence-dialog-width,480px)
}

@media screen and (max-width: 840px) {
    devsite-dialog {
        max-height:calc(100vh - 32px);
        max-width: calc(100vw - 32px)
    }
}

@media (forced-colors:active) {
    devsite-dialog {
        border: 1px solid
    }
}

devsite-dialog:not([open]) {
    display: none
}

devsite-dialog .devsite-dialog-contents {
    color: var(--devsite-secondary-text-color);
    overflow: hidden;
    padding: var(--devsite-dialog-contents-padding,16px)
}

.devsite-dialog-close.material-icons {
    background: none;
    border-radius: 50%;
    border: 0;
    height: 32px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 32px;
    background-color: transparent;
    color: #5f6368
}

.color-scheme--dark .devsite-dialog-close.material-icons {
    background-color: transparent;
    color: #9aa0a6
}

.devsite-dialog-close.material-icons:focus,.devsite-dialog-close.material-icons:hover {
    background-color: rgba(95,99,104,.08);
    color: #5f6368
}

.color-scheme--dark .devsite-dialog-close.material-icons:focus,.color-scheme--dark .devsite-dialog-close.material-icons:hover {
    background-color: #3c4043;
    color: #bdc1c6
}

.devsite-dialog-close.material-icons:active {
    background-color: rgba(95,99,104,.12);
    color: #5f6368
}

.color-scheme--dark .devsite-dialog-close.material-icons:active {
    background-color: #505356;
    color: #bdc1c6
}

devsite-dialog .devsite-dialog-close {
    cursor: pointer
}

devsite-dialog .devsite-dialog-close:not(.button):not(button) {
    border-radius: 50%;
    height: 32px;
    width: 32px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-dialog .devsite-dialog-close:not(.button):not(button):hover {
    background-color: #f1f3f4
}

devsite-dialog .devsite-dialog-contents>p:first-child:last-child {
    margin: 0
}

devsite-dialog h2,devsite-dialog h3 {
    color: var(--devsite-heading-color,inherit)
}

devsite-dialog h3 {
    font: var(--devsite-heading-font,400 20px/32px var(--devsite-primary-font-family));
    margin: 0 0 20px;
    outline: 0;
    text-align: var(--devsite-heading-text-align,inherit)
}

devsite-dialog .devsite-dialog-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 4px 4px 0
}

devsite-lightbox {
    pointer-events: all;
    position: relative
}

devsite-lightbox:not([open]) {
    display: none
}

devsite-lightbox .devsite-dialog-contents {
    padding: 0
}

devsite-lightbox .devsite-lightbox-icon-close {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: hsla(207,5%,52%,.54);
    border: 0;
    border-radius: 0;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    outline: 0;
    padding: 0;
    position: absolute;
    top: 0;
    width: 40px;
    z-index: 1
}

[dir=ltr] devsite-lightbox .devsite-lightbox-icon-close {
    right: 0
}

[dir=rtl] devsite-lightbox .devsite-lightbox-icon-close {
    left: 0
}

devsite-lightbox .devsite-lightbox-icon-close:hover {
    background: rgba(0,0,0,.43)
}

devsite-lightbox .devsite-lightbox-icon-close:active {
    box-shadow: none
}

devsite-lightbox .devsite-lightbox-icon-close:after {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    color: #f1f3f4;
    content: "close";
    -webkit-transition: color .3s ease-in-out;
    transition: color .3s ease-in-out
}

devsite-lightbox .devsite-lightbox-icon-close:focus:after,devsite-lightbox .devsite-lightbox-icon-close:hover:after {
    color: #fff
}

devsite-lightbox img {
    max-height: 100vh
}

.devsite-lightbox-image {
    cursor: pointer;
    outline: 0
}

.devsite-lightbox-image:focus {
    -webkit-filter: brightness(75%);
    filter: brightness(75%)
}

devsite-llm-tools {
    display: inline-block;
    --devsite-dropdown-list-toggle-border-radius: 4px;
    --devsite-dropdown-list-border-radius: 2px;
    --devsite-dropdown-list-min-width: 170px;
    --devsite-dropdown-list-toggle-border: var(--devsite-primary-border,0);
    --devsite-dropdown-list-toggle-height: 36px;
    --devsite-dropdown-list-toggle-background-hover: var(--devsite-background-3);
    --devsite-dropdown-list-toggle-button-padding: 0 3px;
    --devsite-dropdown-list-toggle-color: var(--devsite-secondary-text-color);
    --devsite-button-white-material-icon-margin-x: 0
}

devsite-playlist devsite-llm-tools {
    --devsite-dropdown-list-toggle-background-hover: hsla(220,9%,87%,.24);
    --devsite-dropdown-list-toggle-border: 1px solid #5f6368;
    --devsite-dropdown-list-toggle-color: #dadce0;
    --devsite-dropdown-list-toggle-color-hover: #dadce0;
    --devsite-button-white-line-height: 36px;
    --devsite-button-height: 36px;
    --devsite-button-white-material-icon-margin-x: 0
}

devsite-llm-tools devsite-dropdown-list {
    --devsite-popout-width: min(50vw,fit-content);
    font-weight: 500;
    color: var(--devsite-primary-text-color)
}

devsite-llm-tools .devsite-llm-tools-container {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: var(--devsite-dropdown-list-toggle-border);
    border-radius: var(--devsite-dropdown-list-toggle-border-radius);
    height: var(--devsite-dropdown-list-toggle-height);
    vertical-align: middle
}

devsite-llm-tools .devsite-llm-tools-button-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    border-radius: 3px 0 0 3px;
    --devsite-dropdown-list-toggle-height: 34px
}

devsite-llm-tools .devsite-llm-tools-dropdown-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    --devsite-dropdown-list-toggle-border: none;
    --devsite-dropdown-list-toggle-border-radius: 0 3px 3px 0;
    --devsite-dropdown-list-toggle-height: 34px;
    --devsite-popout-offset-y: 2px
}

devsite-llm-tools .devsite-llm-tools-button {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-inline:0;border-radius: 3px 0 0 3px;
    --devsite-button-padding: 0;
    --devsite-button-line-height: var(--devsite-dropdown-list-toggle-height);
    --devsite-button-white-box-shadow-hover: none;
    --devsite-button-white-box-shadow-active: none;
    --devsite-button-white-text-decoration-hover: none;
    border-right: var(--devsite-dropdown-list-toggle-border);
    color: var(--devsite-dropdown-list-toggle-color);
    height: var(--devsite-dropdown-list-toggle-height);
    --devsite-button-disabled-border: 0 0 1px 0
}

devsite-llm-tools .devsite-llm-tools-button:active,devsite-llm-tools .devsite-llm-tools-button:focus,devsite-llm-tools .devsite-llm-tools-button:focus-visible,devsite-llm-tools .devsite-llm-tools-button:focus-within,devsite-llm-tools .devsite-llm-tools-button:hover {
    border-radius: 3px 0 0 3px;
    border-right: var(--devsite-dropdown-list-toggle-border);
    color: var(--devsite-dropdown-list-toggle-color-hover);
    background: var(--devsite-dropdown-list-toggle-background-hover)
}

devsite-llm-tools .devsite-llm-tools-button .material-icons {
    top: auto;
    margin-inline:0}

devsite-llm-tools .devsite-llm-tools-button .material-icons.icon-copy:before {
    content: "content_copy"
}

.MathJax_SVG_Display {
    overflow-x: auto
}

@media screen and (max-width: 600px) {
    .MathJax_SVG_Display {
        margin:1em -16px!important;
        padding: 0 16px 16px;
        width: calc(100% + 32px)!important
    }
}

devsite-multiple-choice {
    background-color: var(--devsite-multiple-choice-background);
    border: var(--devsite-multiple-choice-border);
    border-radius: var(--devsite-multiple-choice-border-radius);
    display: block;
    margin: 16px 0;
    overflow: var(--devsite-multiple-choice-overflow);
    visibility: hidden!important
}

devsite-multiple-choice[rendered] {
    visibility: visible!important
}

devsite-multiple-choice .devsite-multiple-choice-question {
    background-color: var(--devsite-multiple-choice-question-background);
    color: var(--devsite-multiple-choice-question-color);
    font: var(--devsite-table-heading-font,500 16px/24px var(--devsite-primary-font-family));
    padding: 16px 24px
}

devsite-multiple-choice .devsite-multiple-choice-answer {
    border-bottom: var(--devsite-multiple-choice-answer-border-bottom);
    border-top: var(--devsite-multiple-choice-answer-border-top)
}

devsite-multiple-choice .devsite-multiple-choice-answer,devsite-multiple-choice .devsite-multiple-choice-answer:focus,devsite-multiple-choice .devsite-multiple-choice-answer:hover {
    outline: 0
}

devsite-multiple-choice .devsite-multiple-choice-answer:not([clicked]):focus,devsite-multiple-choice .devsite-multiple-choice-answer:not([clicked]):hover {
    color: var(--devsite-link-color);
    cursor: pointer
}

devsite-multiple-choice .devsite-multiple-choice-option {
    padding: 16px 72px 16px 24px;
    position: relative
}

devsite-multiple-choice .devsite-multiple-choice-option:after {
    content: "check_box_outline_blank";
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    height: 100%;
    position: absolute;
    right: 24px;
    top: calc(50% - 12px)
}

devsite-multiple-choice [correct] {
    background-color: var(--devsite-multiple-choice-correct-background)
}

devsite-multiple-choice [incorrect] {
    background-color: var(--devsite-multiple-choice-incorrect-background)
}

devsite-multiple-choice [correct] .devsite-multiple-choice-option:after {
    color: var(--devsite-multiple-choice-correct-color);
    content: "check"
}

devsite-multiple-choice [incorrect] .devsite-multiple-choice-option:after {
    color: var(--devsite-multiple-choice-incorrect-color);
    content: "not_interested"
}

devsite-multiple-choice .devsite-multiple-choice-explanation {
    font-size: 14px;
    padding: 0 24px 16px
}

devsite-multiple-choice .devsite-multiple-choice-explanation-correctness {
    font-weight: 500;
    margin-top: 16px
}

devsite-multiple-choice [correct] .devsite-multiple-choice-explanation-correctness {
    color: var(--devsite-multiple-choice-correct-color)
}

devsite-multiple-choice [incorrect] .devsite-multiple-choice-explanation-correctness {
    color: var(--devsite-multiple-choice-incorrect-color)
}

devsite-my-activity-light.devsite-my-activity-wide-ui .activities {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: calc(100% + 20px);
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start
}

devsite-my-activity-light.devsite-my-activity-wide-ui .activity {
    width: calc(33% - 20px);
    min-width: 300px
}

devsite-my-activity-light.devsite-my-activity-wide-ui .my-activity-show-more {
    display: none
}

devsite-my-activity-light {
    --devsite-my-activity-arrow-color: #5f6368;
    --devsite-bookmark-icon-arrow-color: #5f6368;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%
}

.color-scheme--dark devsite-my-activity-light {
    --devsite-my-activity-arrow-color: #9aa0a6;
    --devsite-bookmark-icon-arrow-color: #9aa0a6
}

devsite-my-activity-light .waiting-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%
}

devsite-my-activity-light .tooltip {
    background-color: var(--devsite-link-color);
    border-radius: 10px;
    box-shadow: 0 1px 2px 0 rgba(60,64,67,.3),0 1px 3px 1px rgba(60,64,67,.15);
    color: var(--tenant-inverted-text-color);
    padding-block:20px 10px;padding-inline:20px;position: absolute;
    z-index: 1;
    inset-inline-start: 28px;
    top: 50px;
    -webkit-margin-end: 5px;
    -moz-margin-end: 5px;
    margin-inline-end:5px}

devsite-my-activity-light .tooltip .arrow {
    color: var(--devsite-link-color);
    font-size: 60px;
    inset-inline-start: 4px;
    position: absolute;
    top: -34px
}

devsite-my-activity-light .tooltip .title {
    font-weight: 500;
    font-size: 100%;
    font-family: var(--devsite-headline-font-family)
}

devsite-my-activity-light .tooltip .button {
    color: #fff;
    -webkit-margin-before: 10px;
    margin-block-start:10px}

devsite-my-activity-light .tooltip .button:hover {
    background-color: var(--devsite-link-color)
}

devsite-my-activity-light .my-activity-date-range {
    font-weight: 500;
    color: var(--tenant-secondary-text-color);
    line-height: 20px;
    font-size: 13px;
    -webkit-margin-after: 8px;
    margin-block-end:8px}

devsite-my-activity-light .my-activity-container {
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%
}

devsite-my-activity-light .activities {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 10px;
    -webkit-margin-end: -15px;
    -moz-margin-end: -15px;
    margin-inline-end:-15px;-webkit-padding-end: 15px;
    -moz-padding-end: 15px;
    padding-inline-end:15px;position: relative
}

devsite-my-activity-light .activity {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    border: var(--devsite-primary-border);
    border-radius: 8px;
    padding: 12px 8px 10px
}

devsite-my-activity-light .activity-expanded {
    border: 2px var(--devsite-link-color) solid;
    padding: 11px 7px 9px
}

devsite-my-activity-light .activity-playlist {
    padding: 11px 7px 9px
}

devsite-my-activity-light .my-activity-overview-section {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-my-activity-light .activity-icon {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 22px;
    height: 20px;
    margin: 4px;
    -webkit-margin-end: 10px;
    -moz-margin-end: 10px;
    margin-inline-end:10px;min-width: 20px;
    width: 20px;
    position: relative;
    border: var(--devsite-primary-border);
    padding: 13px;
    border-radius: 50%
}

devsite-my-activity-light .activity-icon.updated:after {
    content: " ";
    width: 8px;
    height: 8px;
    position: absolute;
    border-radius: 50%;
    background: var(--devsite-contrast-link-color);
    top: -2px;
    -webkit-margin-start: 7px;
    -moz-margin-start: 7px;
    margin-inline-start:7px;-webkit-animation-name: notificationDotAnimation;
    animation-name: notificationDotAnimation;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-iteration-count: 3;
    animation-iteration-count: 3
}

@keyframes notificationDotAnimation {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    30% {
        -webkit-transform: scale3d(1.25,.75,1);
        transform: scale3d(1.25,.75,1)
    }

    40% {
        -webkit-transform: scale3d(.75,1.25,1);
        transform: scale3d(.75,1.25,1)
    }

    50% {
        -webkit-transform: scale3d(1.15,.85,1);
        transform: scale3d(1.15,.85,1)
    }

    65% {
        -webkit-transform: scale3d(.95,1.05,1);
        transform: scale3d(.95,1.05,1)
    }

    75% {
        -webkit-transform: scale3d(1.05,.95,1);
        transform: scale3d(1.05,.95,1)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

devsite-my-activity-light .activity.badge .activity-icon {
    background-image: url(../images/activity-badge.svg)
}

devsite-my-activity-light .activity.android .activity-icon {
    background-image: url(../images/activity-android.png)
}

devsite-my-activity-light .activity.cloud .activity-icon {
    background-image: url(../images/activity-cloud.png)
}

devsite-my-activity-light .activity.bazel .activity-icon {
    background-image: url(../images/activity-bazel.svg)
}

devsite-my-activity-light .activity.io2024 .activity-icon {
    background-image: url(../images/activity-io2024.svg)
}

devsite-my-activity-light .activity.other .activity-icon {
    background-image: url(../images/activity-other.png)
}

devsite-my-activity-light .activity.firebase .activity-icon {
    background-image: url(../images/activity-firebase.svg);
    background-size: 15px
}

devsite-my-activity-light .activity-title-tags {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: hidden
}

devsite-my-activity-light .activity-link {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    font-weight: 500;
    font-size: 14px
}

devsite-my-activity-light .activity-text {
    line-height: 28px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

devsite-my-activity-light .activity-tags {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    color: var(--tenant-secondary-text-color);
    font-size: 12px;
    line-height: 20px
}

devsite-my-activity-light .activity-tag {
    position: relative;
    -webkit-margin-end: 13px;
    -moz-margin-end: 13px;
    margin-inline-end:13px}

devsite-my-activity-light .updated-tag {
    color: var(--tenant-inverted-text-color);
    border-radius: 5px;
    background: var(--devsite-contrast-link-color);
    font-weight: 500;
    padding: 0 8px
}

devsite-my-activity-light .activity-tag:after {
    content: "•";
    font-size: 14px;
    top: 1px;
    position: absolute;
    line-height: 20px;
    -webkit-margin-start: 12px;
    -moz-margin-start: 12px;
    margin-inline-start:12px;color: var(--tenant-secondary-text-color)
}

devsite-my-activity-light .activity-tag:last-child:after {
    content: ""
}

devsite-my-activity-light .activity-expand-arrow {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    cursor: pointer;
    color: var(--devsite-my-activity-arrow-color)
}

devsite-my-activity-light .activity-link-out {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 17px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    line-height: 24px;
    margin: 0 4px
}

devsite-my-activity-light .my-activity-show-more {
    border: var(--devsite-primary-border);
    border-radius: 8px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 8px;
    -webkit-padding-end: 9px;
    -moz-padding-end: 9px;
    padding-inline-end:9px;-webkit-padding-start: 16px;
    -moz-padding-start: 16px;
    padding-inline-start:16px;font-weight: 500;
    color: var(--devsite-link-color);
    font-size: 14px;
    line-height: 20px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
    cursor: pointer
}

devsite-my-activity-light .activity-details {
    border-top: var(--devsite-primary-border);
    margin: 10px -7px 0;
    padding: 0 12px
}

devsite-my-activity-light .activity-details-section {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: var(--devsite-primary-border);
    padding: 12px 0
}

devsite-my-activity-light .updated-chip {
    background-color: var(--devsite-link-background-active);
    -webkit-margin-end: 12px;
    -moz-margin-end: 12px;
    margin-inline-end:12px;color: var(--devsite-contrast-link-color);
    padding: 1px 8px;
    text-align: center;
    font-size: 13px;
    font-weight: 500;
    line-height: 21px
}

devsite-my-activity-light .my-activity-view-release-notes-container {
    line-height: 21px;
    font-size: 13px;
    font-weight: 500
}

devsite-my-activity-light .activity-details-section:last-child {
    border-bottom: none;
    -webkit-padding-after: 0;
    padding-block-end:0}

devsite-my-activity-light .activity-details-section-nomenclature {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

devsite-my-activity-light .activity-details-title {
    -webkit-margin-end: 5px;
    -moz-margin-end: 5px;
    margin-inline-end:5px;display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-my-activity-light .activity-date {
    font-size: 13px;
    line-height: 21px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--tenant-secondary-text-color)
}

devsite-my-activity-light .activity-bookmarked-container {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: end
}

devsite-my-activity-light .activity-bookmarked-container devsite-bookmark devsite-dropdown-list {
    --devsite-dropdown-list-toggle-border-radius: 4px;
    --devsite-dropdown-list-toggle-button-padding: 0 8px
}

devsite-my-activity-light .activity-bookmarked-container devsite-bookmark {
    -webkit-box-pack: end;
    -webkit-justify-content: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: end
}

devsite-my-activity-light .activity-details-title {
    font-size: 13px;
    font-weight: 700;
    line-height: 21px;
    color: var(--tenant-secondary-text-color)
}

devsite-my-activity-light .activity-nom-tags {
    -webkit-margin-before: 6px;
    margin-block-start:6px;display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

devsite-my-activity-light .activity-nom-tag {
    background-color: var(--devsite-background-3);
    color: var(--tenant-secondary-text-color);
    font-size: 14px;
    font-weight: 500;
    padding: 1px 8px;
    text-align: center
}

devsite-my-activity-light .activity-completion-container {
    font-size: 12px;
    -webkit-margin-before: 4px;
    margin-block-start:4px;-webkit-padding-start: 28px;
    -moz-padding-start: 28px;
    padding-inline-start:28px;z-index: 3
}

devsite-my-activity-light .activity-completion-container .activity-completion-color {
    background-color: #fcad70;
    height: 6px;
    inset-block-start: 0;
    position: absolute
}

devsite-my-activity-light .activity-completion-container .activity-completion-grey {
    background-color: var(--devsite-background-3);
    border-radius: 5px;
    height: 6px;
    -webkit-margin-after: 4px;
    margin-block-end:4px;overflow: hidden;
    position: relative;
    width: 210px
}

devsite-my-community {
    container-type: inline-size;
    font-size: 16px
}

devsite-my-community .devsite-my-community-feature-not-available {
    margin: 50px 0;
    text-align: center
}

devsite-my-community .waiting-container {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: auto
}

devsite-my-community .devsite-my-community-card {
    height: unset;
    margin-bottom: 24px
}

devsite-my-community .devsite-my-community-card:last-of-type {
    margin-bottom: 0
}

devsite-my-community .devsite-my-community-header {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: var(--devsite-card-border);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding: 24px
}

devsite-my-community .devsite-my-community-icon {
    -webkit-margin-end: 18px;
    -moz-margin-end: 18px;
    margin-inline-end:18px;max-height: 66px;
    max-width: 66px
}

devsite-my-community .devsite-my-community-title-container {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-my-community .devsite-my-community-title {
    color: var(--devsite-heading-color,var(--devsite-secondary-text-color));
    font: var(--devsite-h2-font);
    font-size: 28px;
    font-weight: 400;
    line-height: 36px;
    margin: 0
}

@container (width < $CONTAINER_WIDTH_SMALL) {
    devsite-my-community .devsite-my-community-title {
        font-size: 22px
    }
}

devsite-my-community .devsite-my-community-member-chip {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--devsite-success-notice-background);
    color: var(--devsite-success-notice-color);
    font-family: Roboto;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    -webkit-margin-before: 7px;
    margin-block-start:7px;padding: 1px 8px
}

devsite-my-community .devsite-my-community-description {
    padding: 0 24px 20px;
    white-space: pre-line
}

devsite-my-community .devsite-my-community-button-container {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 4px;
    padding: 0 24px 24px
}

devsite-my-community .devsite-my-community-button-container button.button {
    margin: 6px 6px 0 0
}

devsite-my-community .devsite-my-community-button-container devsite-spinner {
    margin-left: 24px
}

devsite-my-community .devsite-my-community-details-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    border-top: 1px solid transparent;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 4px;
    max-height: 0;
    -webkit-transition: border-color,max-height,.5s ease-out;
    transition: border-color,max-height,.5s ease-out
}

devsite-my-community .devsite-my-community-details-container[opened] {
    border-top: var(--devsite-card-border);
    -webkit-transition: border-color,max-height,.5s ease-in;
    transition: border-color,max-height,.5s ease-in;
    max-height: 3000px
}

devsite-my-community .devsite-my-community-missing-info-warning,devsite-my-community .devsite-my-community-profile-not-allowed {
    background-color: var(--devsite-caution-notice-background);
    color: var(--devsite-caution-notice-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    gap: 10px;
    margin-block:3px 24px;padding: 9px 24px
}

devsite-my-community .devsite-my-community-missing-info-warning .material-symbols-outlined,devsite-my-community .devsite-my-community-profile-not-allowed .material-symbols-outlined {
    font-variation-settings: "FILL" 1,"wght" 400,"GRAD" 0,"opsz" 48
}

devsite-my-community .devsite-my-community-no-profile-info {
    background-color: var(--devsite-note-notice-background);
    color: var(--devsite-note-notice-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    -webkit-margin-after: 24px;
    margin-block-end:24px;padding: 9px 24px
}

devsite-my-community .devsite-my-community-no-profile-info .material-symbols-outlined {
    -webkit-margin-end: 10px;
    -moz-margin-end: 10px;
    margin-inline-end:10px}

devsite-my-community .devsite-my-community-profile-attributes-title {
    font-family: var(--devsite-headline-font-family);
    font-size: 18px;
    margin: 0 24px 9px
}

devsite-my-community .devsite-my-community-legal-title {
    font-family: var(--devsite-headline-font-family);
    font-size: 18px;
    margin: 0 0 16px
}

devsite-my-community .devsite-my-community-profile-attributes {
    display: grid;
    font-size: 18px;
    gap: 24px;
    grid: auto/calc(50% - 12px) calc(50% - 12px);
    margin: 0 24px 18px
}

@container (width < $CONTAINER_WIDTH_SMALL) {
    devsite-my-community .devsite-my-community-profile-attributes {
        grid: auto/auto
    }
}

devsite-my-community .devsite-my-community-profile-attributes-text {
    font-size: 16px;
    grid-column: 1/3;
    margin: 0
}

@container (width < $CONTAINER_WIDTH_SMALL) {
    devsite-my-community .devsite-my-community-profile-attributes-text {
        grid-column: 1/2
    }
}

devsite-my-community .devsite-my-community-error-incorrect,devsite-my-community .devsite-my-community-error-missing {
    color: #ea4335;
    display: none;
    font-size: 12px;
    margin: 2px 0 0 14px
}

devsite-my-community .devsite-my-community-legal-container {
    margin: 0 24px 24px
}

devsite-my-community .devsite-my-community-legal-container[missing] .devsite-my-community-error-missing {
    display: inline-block
}

devsite-my-community .devsite-my-community-legal-container[missing] .devsite-my-community-legal-copy {
    border: 2px solid #ea4335
}

devsite-my-community .devsite-my-community-profile-attribute-input {
    display: block;
    min-height: 86px;
    position: relative
}

devsite-my-community .devsite-my-community-profile-attribute-input[incorrect] .devsite-my-community-error-incorrect,devsite-my-community .devsite-my-community-profile-attribute-input[missing] .devsite-my-community-error-missing {
    display: inline-block
}

devsite-my-community .devsite-my-community-email-preference {
    padding: 0 24px 24px
}

devsite-my-community .devsite-my-community-email-pref-input {
    margin-top: 8px
}

devsite-my-community .devsite-my-community-profile-title {
    font-family: var(--devsite-headline-font-family);
    font-size: 18px;
    margin: 24px 24px 16px
}

devsite-my-community .devsite-my-community-profile-text {
    margin: 0 24px 16px
}

devsite-my-community .devsite-my-community-private-explanation {
    margin: 0 24px 24px
}

devsite-my-community .devsite-my-community-private-explanation span {
    color: var(--devsite-secondary-text-color);
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 12px;
    font-weight: 500;
    line-height: 23px;
    vertical-align: bottom
}

devsite-my-community .devsite-my-community-private-explanation span:before {
    content: "lock";
    font-family: Material Symbols Outlined;
    font-size: 12px;
    font-variation-settings: "FILL" 0,"wght" 400,"GRAD" 0,"opsz" 48;
    -webkit-margin-end: 3px;
    -moz-margin-end: 3px;
    margin-inline-end:3px}

devsite-my-community .devsite-my-community-profileattribute-checkbox {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 4px;
    border: var(--devsite-input-border);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 60px
}

devsite-my-community .devsite-my-community-profileattribute-checkbox:hover input:before {
    background: var(--devsite-background-4)
}

devsite-my-community .devsite-my-community-profileattribute-checkbox input {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-padding-start: 18px;
    -moz-padding-start: 18px;
    padding-inline-start:18px;position: relative;
    top: 1px;
    width: 34px
}

devsite-my-community .devsite-my-community-profileattribute-checkbox input:before {
    -webkit-margin-start: 14px;
    -moz-margin-start: 14px;
    margin-inline-start:14px}

devsite-my-community .devsite-my-community-profileattribute-checkbox label {
    line-height: 56px;
    width: 100%
}

devsite-my-community .devsite-my-community-private-chip {
    color: var(--devsite-secondary-text-color);
    display: inline-block;
    font-size: 12px;
    font-weight: 500;
    margin: 2px 0 0 14px
}

devsite-my-community .devsite-my-community-private-chip .material-symbols-outlined {
    font-size: 12px;
    font-variation-settings: "FILL" 0,"wght" 400,"GRAD" 0,"opsz" 48;
    position: relative;
    top: 2px
}

devsite-my-community .devsite-my-community-legal-copy {
    background-color: var(--devsite-background-3);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    padding: 16px
}

devsite-my-community .devsite-my-community-legal-copy input {
    background-color: transparent;
    -webkit-margin-before: 5px;
    margin-block-start:5px;-webkit-margin-end: 11px;
    -moz-margin-end: 11px;
    margin-inline-end:11px}

devsite-my-community .devsite-my-community-legal-copy .devsite-my-community-legal-copy-text {
    color: var(--devsite-secondary-text-color);
    font-size: 14px
}

.devsite-my-community-leave-dialog .devsite-my-community-leave-title {
    color: var(--devsite-heading-color,var(--devsite-secondary-text-color));
    font-family: Google Sans;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 16px
}

.devsite-my-community-leave-dialog .devsite-my-community-leave-buttons {
    margin-top: 24px
}

devsite-nav-buttons {
    display: block
}

devsite-nav-buttons button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: var(--devsite-button-border);
    box-shadow: none;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-weight: 500;
    text-transform: none
}

devsite-nav-buttons button,devsite-nav-buttons button:focus,devsite-nav-buttons button:hover {
    color: var(--devsite-button-color)
}

devsite-nav-buttons button:focus,devsite-nav-buttons button:hover {
    background: var(--devsite-button-background-hover);
    border: var(--devsite-button-border-hover)
}

devsite-nav-buttons button,devsite-nav-buttons button[class^=button-] {
    border-radius: 16px;
    height: 32px;
    line-height: 30px;
    padding: var(--devsite-button-padding,0 12px)
}

devsite-nav-buttons button[class^=button-][selected],devsite-nav-buttons button[selected] {
    border: var(--devsite-button-border-selected);
    padding-left: 8px
}

devsite-nav-buttons button[class^=button-],devsite-nav-buttons button[class^=button-][selected] {
    border: 0
}

devsite-nav-buttons button[selected] {
    background: var(--devsite-button-background-selected);
    color: var(--devsite-button-color-selected)
}

devsite-nav-buttons button.button-white[selected] {
    background: var(--devsite-button-white-background-selected,var(--devsite-link-color));
    color: var(--devsite-button-white-color-selected,var(--devsite-inverted-text-color))
}

devsite-nav-buttons button.button-primary[selected] {
    background: var(--devsite-button-primary-background-selected);
    color: var(--devsite-button-primary-color-selected,var(--devsite-inverted-text-color))
}

devsite-nav-buttons button[selected]:before {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    content: "checked";
    margin-right: 8px;
    width: 24px
}

.devsite-claim-badge-dialog.devsite-claim-badge-dialog,devsite-openid-badge-awarded.devsite-claim-badge-dialog {
    padding: 0
}

.devsite-claim-badge-dialog .card,devsite-openid-badge-awarded .card {
    box-shadow: 0 1px 2px 0 rgba(60,64,67,.3),0 1px 3px 1px rgba(60,64,67,.15);
    border-radius: 5px;
    background: var(--devsite-claim-badge-dialog-background,var(--devsite-background-1));
    display: block;
    max-width: 856px;
    border-top: 5px solid #1a73e8;
    position: relative;
    overflow: hidden;
    margin: 0 auto
}

.devsite-claim-badge-dialog .card .card-content,devsite-openid-badge-awarded .card .card-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-height: calc(100vh - 32px);
    overflow: visible
}

.devsite-claim-badge-dialog .card .illustration-container,.devsite-claim-badge-dialog .card .text-container,devsite-openid-badge-awarded .card .illustration-container,devsite-openid-badge-awarded .card .text-container {
    width: 50%
}

@media screen and (max-width: 600px) {
    .devsite-claim-badge-dialog .card .illustration-container,.devsite-claim-badge-dialog .card .text-container,devsite-openid-badge-awarded .card .illustration-container,devsite-openid-badge-awarded .card .text-container {
        width:100%
    }
}

.devsite-claim-badge-dialog .card .spinner-container,devsite-openid-badge-awarded .card .spinner-container {
    position: absolute;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: hsla(0,0%,100%,.8);
    z-index: 100;
    pointer-events: none;
    opacity: 0;
    -webkit-transition: opacity .3s cubic-bezier(.4,0,.2,1);
    transition: opacity .3s cubic-bezier(.4,0,.2,1)
}

.devsite-claim-badge-dialog .card .content-container,devsite-openid-badge-awarded .card .content-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

@media screen and (max-width: 600px) {
    .devsite-claim-badge-dialog .card .content-container,devsite-openid-badge-awarded .card .content-container {
        -webkit-box-orient:vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.devsite-claim-badge-dialog .card .text-container,devsite-openid-badge-awarded .card .text-container {
    padding: 36px 24px;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

@media screen and (max-width: 600px) {
    .devsite-claim-badge-dialog .card .text-container,devsite-openid-badge-awarded .card .text-container {
        padding:24px
    }
}

.devsite-claim-badge-dialog .illustration-container,devsite-openid-badge-awarded .illustration-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 164px;
    min-width: 303px;
    height: 164px;
    width: 303px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    background-image: url(../images/badge-award-background.svg);
    background-size: 100% calc(100% + 2px);
    background-position: 1px -1px;
    background-repeat: no-repeat
}

.devsite-claim-badge-dialog .illustration-container.show .badge-icon,devsite-openid-badge-awarded .illustration-container.show .badge-icon {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.devsite-claim-badge-dialog .illustration-container.animate .badge-icon,devsite-openid-badge-awarded .illustration-container.animate .badge-icon {
    -webkit-animation: badgeGrowIn .33s cubic-bezier(.75,0,.71,.97),badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) .33s,badgeFadeIn .5s linear;
    animation: badgeGrowIn .33s cubic-bezier(.75,0,.71,.97),badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) .33s,badgeFadeIn .5s linear
}

.devsite-claim-badge-dialog .illustration-container .badge-icon,devsite-openid-badge-awarded .illustration-container .badge-icon {
    width: 124px;
    height: 124px;
    z-index: 1000;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

.devsite-claim-badge-dialog .illustration-container .badge-icon.incomplete,devsite-openid-badge-awarded .illustration-container .badge-icon.incomplete {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%)
}

.devsite-claim-badge-dialog .illustration-container .badge-animation,devsite-openid-badge-awarded .illustration-container .badge-animation {
    position: absolute;
    width: 195px;
    height: 170px;
    background-image: url(../images/badge-award-animation.gif);
    background-size: 100% 100%
}

.devsite-claim-badge-dialog .completed-title,devsite-openid-badge-awarded .completed-title {
    font-size: 20px;
    margin-bottom: 8px;
    line-height: 28px;
    color: var(--devsite-claim-badge-dialog-title-color,#000);
    font-family: var(--devsite-headline-font-family)
}

.devsite-claim-badge-dialog .claim-badge-text,.devsite-claim-badge-dialog .completed-text,.devsite-claim-badge-dialog .create-profile-text,.devsite-claim-badge-dialog .error-text,.devsite-claim-badge-dialog .not-eligible-text,.devsite-claim-badge-dialog .sign-in-text,devsite-openid-badge-awarded .claim-badge-text,devsite-openid-badge-awarded .completed-text,devsite-openid-badge-awarded .create-profile-text,devsite-openid-badge-awarded .error-text,devsite-openid-badge-awarded .not-eligible-text,devsite-openid-badge-awarded .sign-in-text {
    font-size: 14px
}

.devsite-claim-badge-dialog .buttons-container,devsite-openid-badge-awarded .buttons-container {
    border-top: 1px solid #e8eaed;
    padding: 0 8px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.devsite-claim-badge-dialog .buttons-container .buttons,devsite-openid-badge-awarded .buttons-container .buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.devsite-claim-badge-dialog .buttons-container .dismiss,devsite-openid-badge-awarded .buttons-container .dismiss {
    position: relative;
    overflow: visible
}

@media screen and (max-width: 600px) {
    .devsite-claim-badge-dialog .buttons-container,devsite-openid-badge-awarded .buttons-container {
        -webkit-box-orient:vertical;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: column-reverse;
        -moz-box-orient: vertical;
        -moz-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        padding-top: 0;
        text-align: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .devsite-claim-badge-dialog .buttons-container .button,devsite-openid-badge-awarded .buttons-container .button {
        margin: 10px auto 0
    }

    .devsite-claim-badge-dialog .buttons-container .buttons,devsite-openid-badge-awarded .buttons-container .buttons {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -moz-box-orient: horizontal;
        -moz-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        margin-top: 5px
    }
}

.devsite-claim-badge-dialog[loading] .card .spinner-container,devsite-openid-badge-awarded[loading] .card .spinner-container {
    opacity: 1;
    pointer-events: all
}

.devsite-claim-badge-dialog .qr-code-container,devsite-openid-badge-awarded .qr-code-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 225px;
    background-image: url(../images/claim-badge-dialog-background.png);
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-position: 50%;
    background-size: 700px
}

.devsite-claim-badge-dialog .qr-code-container canvas,devsite-openid-badge-awarded .qr-code-container canvas {
    display: none
}

.devsite-claim-badge-dialog .qr-code-container img,devsite-openid-badge-awarded .qr-code-container img {
    height: 150px;
    width: 150px;
    padding: 10px;
    background: var(--devsite-background-1)
}

.devsite-claim-badge-dialog .redeem-code-section,devsite-openid-badge-awarded .redeem-code-section {
    padding: 18px 24px 0;
    margin-bottom: -15px
}

.devsite-claim-badge-dialog .redeem-code-title,devsite-openid-badge-awarded .redeem-code-title {
    text-transform: uppercase;
    font-size: 10.5px;
    font-weight: 600;
    color: #80868b;
    margin-bottom: 3px
}

.devsite-claim-badge-dialog .redeem-code,devsite-openid-badge-awarded .redeem-code {
    display: inline-block;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 12px;
    color: #000;
    padding: 8px 2px 8px 12px;
    border: 2px solid #1a73e8;
    border-radius: 4px;
    background-color: rgba(232,240,254,.6)
}

.devsite-claim-badge-dialog .illustration-container.animate .badge-icon-counter,devsite-openid-badge-awarded .illustration-container.animate .badge-icon-counter {
    -webkit-animation: counterHide 1s,badgeGrowIn .33s cubic-bezier(.75,0,.71,.97) 1s,badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) 1.33s,badgeFadeIn .5s linear 1s;
    animation: counterHide 1s,badgeGrowIn .33s cubic-bezier(.75,0,.71,.97) 1s,badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) 1.33s,badgeFadeIn .5s linear 1s;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.devsite-claim-badge-dialog .illustration-container .badge-icon-counter,devsite-openid-badge-awarded .illustration-container .badge-icon-counter {
    padding: 3px 10px;
    font-size: 14px;
    border-radius: 19px;
    color: #fff;
    font-weight: 500;
    background-color: #1a73e8;
    position: absolute;
    bottom: 17px;
    z-index: 10001;
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
    box-shadow: 0 4px 8px 3px rgba(60,64,67,.15),0 1px 3px 0 rgba(60,64,67,.3)
}

.devsite-claim-badge-dialog .badge-name,devsite-openid-badge-awarded .badge-name {
    font-weight: 500
}

.devsite-claim-badge-dialog .buttons-container .more-badges-marker,devsite-openid-badge-awarded .buttons-container .more-badges-marker {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    top: -12px;
    right: -12px;
    background: #ea4335;
    min-width: 24px;
    min-height: 24px;
    border-radius: 50px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    font-weight: 700;
    max-height: 24px;
    max-width: 24px;
    line-height: 24px;
    font-size: 12px
}

@media screen and (max-width: 600px) {
    .devsite-claim-badge-dialog .buttons-container .sharing,devsite-openid-badge-awarded .buttons-container .sharing {
        -webkit-box-orient:horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -moz-box-orient: horizontal;
        -moz-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        padding: 2px 0 20px
    }
}

.devsite-claim-badge-dialog .buttons-container .actions .button,.devsite-claim-badge-dialog .buttons-container .actions button,devsite-openid-badge-awarded .buttons-container .actions .button,devsite-openid-badge-awarded .buttons-container .actions button {
    margin: 8px
}

.devsite-claim-badge-dialog .buttons-container .sharing,devsite-openid-badge-awarded .buttons-container .sharing {
    font-size: 14px;
    color: #3c4043;
    padding-left: 16px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.devsite-claim-badge-dialog .buttons-container .sharing .share-buttons-container,devsite-openid-badge-awarded .buttons-container .sharing .share-buttons-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.devsite-claim-badge-dialog .buttons-container .sharing .share-buttons-container button,devsite-openid-badge-awarded .buttons-container .sharing .share-buttons-container button {
    border-radius: 0
}

.devsite-claim-badge-dialog .buttons-container .sharing span,devsite-openid-badge-awarded .buttons-container .sharing span {
    margin: 0 8px
}

.devsite-claim-badge-dialog .buttons-container .sharing .button,.devsite-claim-badge-dialog .buttons-container .sharing button,devsite-openid-badge-awarded .buttons-container .sharing .button,devsite-openid-badge-awarded .buttons-container .sharing button {
    box-shadow: none;
    margin: 0 8px;
    padding: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 0;
    height: auto;
    min-width: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.devsite-claim-badge-dialog .buttons-container .sharing .button:focus,.devsite-claim-badge-dialog .buttons-container .sharing .button:hover,.devsite-claim-badge-dialog .buttons-container .sharing button:focus,.devsite-claim-badge-dialog .buttons-container .sharing button:hover,devsite-openid-badge-awarded .buttons-container .sharing .button:focus,devsite-openid-badge-awarded .buttons-container .sharing .button:hover,devsite-openid-badge-awarded .buttons-container .sharing button:focus,devsite-openid-badge-awarded .buttons-container .sharing button:hover {
    background: none
}

.devsite-claim-badge-dialog .buttons-container .sharing .button:active,.devsite-claim-badge-dialog .buttons-container .sharing button:active,devsite-openid-badge-awarded .buttons-container .sharing .button:active,devsite-openid-badge-awarded .buttons-container .sharing button:active {
    box-shadow: none
}

.devsite-claim-badge-dialog .buttons-container .sharing a:active,.devsite-claim-badge-dialog .buttons-container .sharing a:focus,.devsite-claim-badge-dialog .buttons-container .sharing a:hover,devsite-openid-badge-awarded .buttons-container .sharing a:active,devsite-openid-badge-awarded .buttons-container .sharing a:focus,devsite-openid-badge-awarded .buttons-container .sharing a:hover {
    text-decoration: none
}

.devsite-claim-badge-dialog .buttons-container .sharing .material-icons,devsite-openid-badge-awarded .buttons-container .sharing .material-icons {
    color: #5f6368;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 8px
}

devsite-openid-badger {
    display: none
}

.static-badge-awarded-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.static-badge-awarded-container .devsite-openid-badger-award-inner {
    padding: 10px
}

.static-badge-awarded-container .dismiss {
    display: none
}

.devsite-openid-badger-award {
    bottom: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    left: 0;
    pointer-events: none;
    position: fixed;
    right: 0;
    z-index: 99999
}

.devsite-openid-badger-award .devsite-openid-badger-award-inner {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 670px;
    width: 670px;
    margin-bottom: 16px;
    pointer-events: all;
    position: absolute;
    -webkit-transform: translateY(150%);
    transform: translateY(150%);
    -webkit-transition: bottom .2s,margin-right .2s,-webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: bottom .2s,margin-right .2s,-webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: bottom .2s,margin-right .2s,transform .2s cubic-bezier(.4,0,1,1);
    transition: bottom .2s,margin-right .2s,transform .2s cubic-bezier(.4,0,1,1),-webkit-transform .2s cubic-bezier(.4,0,1,1)
}

@media screen and (max-width: 600px) {
    .devsite-openid-badger-award .devsite-openid-badger-award-inner {
        width:calc(100% - 20px);
        margin-bottom: 10px
    }
}

.devsite-openid-badger-award .devsite-openid-badger-award-inner[show] {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: bottom .2s,margin-right .2s,-webkit-transform .2s cubic-bezier(0,0,.2,1);
    transition: bottom .2s,margin-right .2s,-webkit-transform .2s cubic-bezier(0,0,.2,1);
    transition: bottom .2s,margin-right .2s,transform .2s cubic-bezier(0,0,.2,1);
    transition: bottom .2s,margin-right .2s,transform .2s cubic-bezier(0,0,.2,1),-webkit-transform .2s cubic-bezier(0,0,.2,1)
}

.devsite-openid-badger-award .devsite-openid-badger-award-inner[show] .devsite-openid-badger-award-actions,.devsite-openid-badger-award .devsite-openid-badger-award-inner[show] .devsite-openid-badger-award-details {
    opacity: 1
}

.devsite-openid-badger-award .devsite-openid-badger-award-inner:first-child {
    bottom: 10px;
    z-index: 15
}

.devsite-openid-badger-award .devsite-openid-badger-award-inner:nth-child(2) {
    bottom: 5px;
    margin-right: -10px;
    z-index: 14;
    -webkit-filter: grayscale(100%) brightness(110%);
    filter: grayscale(100%) brightness(110%)
}

.devsite-openid-badger-award .devsite-openid-badger-award-inner:nth-child(3) {
    bottom: 0;
    margin-right: -20px;
    z-index: 13;
    -webkit-filter: grayscale(100%) brightness(110%);
    filter: grayscale(100%) brightness(110%)
}

.devsite-openid-badger-award .devsite-openid-badger-award-inner:nth-child(4) {
    bottom: -5px;
    margin-right: -30px;
    z-index: 12;
    -webkit-filter: grayscale(100%) brightness(110%);
    filter: grayscale(100%) brightness(110%)
}

.devsite-openid-badger-award .devsite-openid-badger-award-inner:nth-child(n+5) {
    bottom: -5px;
    margin-right: -30px;
    display: none
}

@media screen and (max-width: 600px) {
    .devsite-openid-badger-award .devsite-openid-badger-award-inner:first-child {
        bottom:0;
        z-index: 15
    }

    .devsite-openid-badger-award .devsite-openid-badger-award-inner:nth-child(2) {
        bottom: 0;
        margin-right: 0
    }

    .devsite-openid-badger-award .devsite-openid-badger-award-inner:nth-child(n+3) {
        display: none
    }
}

.devsite-openid-badger-award .devsite-openid-badger-award-actions {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    opacity: 0;
    -webkit-transition: opacity .3s cubic-bezier(.4,0,.2,1);
    transition: opacity .3s cubic-bezier(.4,0,.2,1);
    border-top: 1px solid #dadce0;
    padding: 8px
}

devsite-openid-user {
    display: block;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

devsite-openid-user[signed-in][enable-profiles] {
    min-width: 84px
}

devsite-openid-user #devsite-signin-btn {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font: 500 14px/36px var(--devsite-primary-font-family)
}

devsite-openid-user devsite-spinner {
    margin-block:4px;margin-inline:20px 8px}

devsite-openid-user devsite-spinner.hide {
    -webkit-animation-delay: .45s;
    animation-delay: .45s;
    opacity: 0;
    -webkit-transition: opacity .45s ease;
    transition: opacity .45s ease
}

devsite-openid-user .ogb-wrapper {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    opacity: 1;
    -webkit-transition: opacity .2s cubic-bezier(.4,0,.2,1);
    transition: opacity .2s cubic-bezier(.4,0,.2,1)
}

@media (forced-colors:active) {
    devsite-openid-user .ogb-wrapper {
        border: 1px solid ButtonText;
        border-radius: 4px
    }

    devsite-openid-user .ogb-wrapper:focus-within,devsite-openid-user .ogb-wrapper:hover {
        border-color: Highlight
    }
}

devsite-openid-user .ogb-pending {
    opacity: 0
}

devsite-openid-user .devsite-user-dialog {
    display: none
}

devsite-openid-user .devsite-user-dialog a:link,devsite-openid-user .devsite-user-dialog a:visited {
    text-decoration: none
}

devsite-openid-user[dialog--open] .devsite-user-dialog {
    background-color: var(--devsite-user-dialog-background,var(--devsite-background-4));
    border-radius: 28px;
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
    color: var(--devsite-user-dialog-color,var(--devsite-primary-text-color));
    display: block;
    max-height: calc(100vh - 90px);
    outline: none;
    overflow: auto;
    -webkit-padding-before: 18px;
    padding-block-start:18px;padding-inline:16px;position: absolute;
    right: 32px;
    top: 66px;
    width: 412px
}

[dir=rtl] devsite-openid-user[dialog--open] .devsite-user-dialog {
    left: 32px;
    right: auto
}

devsite-openid-user .devsite-user-dialog svg {
    fill: var(--devsite-user-dialog-color,var(--devsite-primary-text-color))
}

devsite-openid-user .devsite-user-dialog .devsite-user-dialog-exit {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: none;
    border-radius: 50%;
    border: 1px solid transparent;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0;
    position: absolute;
    top: 8px;
    width: 40px;
    inset-inline-end: 8px
}

devsite-openid-user .devsite-user-dialog .devsite-user-dialog-exit:focus,devsite-openid-user .devsite-user-dialog .devsite-user-dialog-exit:hover {
    background-color: var(--devsite-background-2)
}

devsite-openid-user .devsite-user-dialog .devsite-user-dialog-exit:active {
    background-color: var(--devsite-background-4)
}

devsite-openid-user .devsite-user-dialog .devsite-user-dialog-exit:focus {
    border-color: var(--devsite-ogb-link-border-color)
}

devsite-openid-user .devsite-user-dialog-photo,devsite-openid-user .devsite-user-dialog-photo-thumbnail,devsite-openid-user .devsite-user-dialog-toggle .devsite-user-dialog-letter {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0;
    overflow: hidden;
    padding: 0
}

devsite-openid-user .devsite-user-dialog-signin {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 4px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 48px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 2px;
    width: 48px
}

devsite-openid-user .devsite-user-dialog-signin:focus {
    background-color: var(--devsite-background-2);
    border: 1px solid #000
}

devsite-openid-user .devsite-user-dialog .devsite-user-dialog-photo,devsite-openid-user .devsite-user-dialog-signin .devsite-user-dialog-letter {
    background-color: var(--devsite-user-avatar-background,var(--devsite-background-color,var(--devsite-primary-color,var(--devsite-primary-text-color))));
    color: var(--devsite-user-avatar-color,var(--devsite-text-color,var(--devsite-inverted-text-color)))
}

devsite-openid-user .devsite-user-dialog-toggle {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 32px;
    overflow: hidden;
    padding: 4px;
    text-decoration: none;
    width: 32px
}

[dir=rtl] devsite-openid-user .devsite-user-dialog-toggle {
    margin: 0 0 0 4px
}

devsite-openid-user .devsite-user-dialog-toggle:focus {
    background-color: var(--devsite-link-background-active)
}

devsite-openid-user .devsite-user-dialog-photo-thumbnail {
    height: 32px;
    width: 32px
}

devsite-openid-user .devsite-user-dialog-toggle .devsite-user-dialog-letter {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 32px;
    -moz-box-flex: 0;
    -ms-flex: 0 0 32px;
    flex: 0 0 32px;
    font-size: 17px;
    height: 32px
}

devsite-openid-user .devsite-user-dialog-photo {
    -webkit-margin-before: 22px;
    margin-block-start:22px;margin-inline:auto;position: relative
}

devsite-openid-user .devsite-user-dialog-photo,devsite-openid-user .devsite-user-dialog-photo-portrait {
    height: 80px;
    width: 80px
}

devsite-openid-user .devsite-user-dialog-letter {
    text-transform: uppercase
}

devsite-openid-user .devsite-user-dialog-photo .devsite-user-dialog-letter {
    font-size: 52px
}

devsite-openid-user .devsite-user-dialog-name {
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--devsite-primary-text-color);
    font: 400 22px/28px var(--devsite-headline-font-family);
    letter-spacing: normal;
    margin-block:8px;margin-inline:0;text-align: center
}

devsite-openid-user .devsite-user-dialog-details {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-openid-user .devsite-user-dialog-buttons {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 30px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 2px;
    -webkit-padding-after: 24px;
    padding-block-end:24px}

devsite-openid-user .devsite-user-dialog .developer-profile:link,devsite-openid-user .devsite-user-dialog .developer-profile:visited,devsite-openid-user .devsite-user-dialog .devsite-user-developer-profile:link,devsite-openid-user .devsite-user-dialog .devsite-user-developer-profile:visited {
    color: var(--devsite-primary-text-color)
}

devsite-openid-user .devsite-user-dialog .developer-profile:focus,devsite-openid-user .devsite-user-dialog .developer-profile:hover,devsite-openid-user .devsite-user-dialog .devsite-user-developer-profile:focus,devsite-openid-user .devsite-user-dialog .devsite-user-developer-profile:hover {
    background-color: var(--devsite-background-2)
}

devsite-openid-user .devsite-user-dialog .developer-profile:active,devsite-openid-user .devsite-user-dialog .devsite-user-developer-profile:active {
    background-color: var(--devsite-background-4)
}

devsite-openid-user .devsite-user-dialog-buttons>:first-child {
    border-top: var(--devsite-secondary-border)
}

devsite-openid-user .devsite-user-dialog .devsite-user-signout {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--devsite-background-1);
    border: 1px solid transparent;
    color: var(--devsite-primary-text-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font: 500 14px/16px var(--devsite-headline-font-family);
    gap: 8px;
    height: 60px;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    letter-spacing: .15px;
    padding: 0
}

devsite-openid-user .devsite-user-dialog .devsite-user-signout:focus {
    border-color: var(--devsite-ogb-link-border-color)
}

devsite-openid-user .devsite-user-dialog .devsite-user-signout:focus,devsite-openid-user .devsite-user-dialog .devsite-user-signout:hover {
    background-color: var(--devsite-background-2)
}

devsite-openid-user .devsite-user-dialog .devsite-user-signout:active {
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color);
    background-color: var(--devsite-background-4);
    border-color: transparent
}

devsite-openid-user .devsite-user-dialog .devsite-user-signout svg {
    -webkit-margin-start: 16px;
    -moz-margin-start: 16px;
    margin-inline-start:16px}

devsite-openid-user .devsite-user-dialog .devsite-user-signout {
    border-radius: 30px
}

devsite-openid-user .devsite-user-dialog .new-notification {
    background-color: var(--devsite-notification-background);
    border-radius: 10px;
    color: var(--devsite-inverted-text-color);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .3px;
    padding-block:2px;padding-inline:8px;-webkit-margin-start: 12px;
    -moz-margin-start: 12px;
    margin-inline-start:12px}

devsite-openid-user .devsite-devprofile-wrapper {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    opacity: 0;
    position: relative
}

devsite-openid-user .devsite-devprofile-wrapper.show {
    opacity: 1;
    -webkit-transition: all .15s cubic-bezier(.4,0,.2,1) 0s;
    transition: all .15s cubic-bezier(.4,0,.2,1) 0s
}

devsite-openid-user .devsite-devprofile-wrapper devsite-spinner {
    margin: 0
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-notifications-indicator {
    background-color: #1a73e8;
    border-radius: 8px;
    height: 8px;
    position: absolute;
    right: 0;
    top: 0;
    width: 8px;
    z-index: 1
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: var(--devsite-primary-border);
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 32px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0;
    min-height: 32px;
    min-width: 32px;
    padding: 0;
    position: relative;
    width: 32px;
    --devsite-button-border-hover: none;
    --devsite-button-border-radius: 50%;
    --devsite-button-box-shadow: none;
    --devsite-button-box-shadow-active: none
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-button svg {
    fill: var(--devsite-header-icon-color,var(--devsite-secondary-text-color))
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-button:active,devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-button:focus,devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-button:hover {
    background: var(--devsite-background-3)
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-button:active svg,devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-button:focus svg,devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-button:hover svg {
    fill: var(--devsite-header-icon-color,var(--devsite-secondary-text-rgba))
}

devsite-openid-user .devsite-devprofile-wrapper.open .devsite-devprofile-button {
    background: var(--devsite-background-3);
    color: var(--devsite-header-icon-color-active,var(--devsite-primary-text-rgba))
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout,devsite-openid-user .devsite-devprofile-wrapper .devsite-user-gdp-fastrack-callout {
    max-width: 378px;
    width: 100vw
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout {
    background-color: var(--devsite-background-1);
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(60,64,67,.3),0 2px 6px 2px rgba(60,64,67,.15);
    display: none;
    font-family: var(--devsite-primary-font-family);
    -webkit-margin-end: -2px;
    -moz-margin-end: -2px;
    margin-inline-end:-2px;-webkit-margin-before: 8px;
    margin-block-start:8px;opacity: 0;
    padding-block:8px;padding-inline:0;pointer-events: none;
    position: absolute;
    right: 0;
    top: 100%;
    -webkit-transform-origin: top right;
    transform-origin: top right;
    -webkit-transform: scale(.8);
    transform: scale(.8);
    -webkit-transition: all .15s cubic-bezier(.4,0,.2,1) 0s;
    transition: all .15s cubic-bezier(.4,0,.2,1) 0s;
    z-index: 1007
}

[dir=rtl] devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout {
    left: 0;
    right: auto
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout.show {
    opacity: 1;
    pointer-events: all;
    -webkit-transform: scale(1);
    transform: scale(1)
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout.visible {
    display: block
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout .devsite-devprofile-notifications-container {
    background-color: #1a73e8;
    border-radius: 16px;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    height: 16px;
    line-height: 16px;
    -webkit-margin-start: 10px;
    -moz-margin-start: 10px;
    margin-inline-start:10px;padding-inline:4px 5px;padding-block:0}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout .profile-links-header {
    color: var(--devsite-primary-text-color);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .8px;
    line-height: 16px;
    padding-block:12px;padding-inline:14px;text-transform: uppercase
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout .profile-link {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-primary-text-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    padding-block:14px;padding-inline:16px;text-decoration: none
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout .profile-link:focus,devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout .profile-link:hover {
    background-color: var(--devsite-ogb-profile-link-hover-background,#f1f3f4)
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout ul {
    margin: 0;
    padding: 0
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout ul li {
    list-style: none;
    margin: 0;
    padding: 0
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout[popup-type=view-profile] {
    max-width: 232px
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout[popup-type=view-bookmarked-pages],devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout[popup-type=view-rated-pages] {
    background-color: var(--devsite-link-color);
    color: var(--devsite-devprofile-popout-color,var(--devsite-inverted-text-color));
    padding-block:16px;padding-inline:24px}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout[popup-type=view-bookmarked-pages] .buttons,devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout[popup-type=view-rated-pages] .buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-margin-before: 16px;
    margin-block-start:16px}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout[popup-type=view-bookmarked-pages] .buttons .button:hover,devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout[popup-type=view-rated-pages] .buttons .button:hover {
    --devsite-link-color: #4285f4
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout[popup-type=view-bookmarked-pages] .button-white,devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout[popup-type=view-rated-pages] .button-white {
    color: var(--devsite-devprofile-popout-color,var(--devsite-inverted-text-color))
}

devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout[popup-type=view-bookmarked-pages] .button-white:focus,devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout[popup-type=view-bookmarked-pages] .button-white:hover,devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout[popup-type=view-rated-pages] .button-white:focus,devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout[popup-type=view-rated-pages] .button-white:hover {
    background-color: var(--devsite-link-color);
    color: var(--devsite-button-background-hover)
}

@media screen and (max-width: 840px) {
    devsite-openid-user .devsite-devprofile-wrapper .devsite-user-gdp-fastrack-callout {
        max-width:min(378px,100vw - 80px)
    }

    devsite-openid-user .devsite-devprofile-wrapper .devsite-devprofile-popout {
        max-width: min(378px,100vw - 64px)
    }
}

@media screen and (max-width: 452px) {
    devsite-openid-user[dialog--open] .devsite-user-dialog {
        left:0;
        max-height: 210px;
        right: 0;
        top: 0;
        width: 100%;
        z-index: 21
    }
}

.devsite-openid-user-gdp-signup-callout .devsite-openid-user-gdp-tos {
    color: var(--devsite-secondary-text-color);
    font: 400 12px/16px var(--devsite-primary-font-family);
    letter-spacing: .3px
}

.devsite-openid-user-login-qr-code-container {
    position: relative;
    margin: 16px auto
}

.devsite-openid-user-login-qr-code-spinner {
    position: absolute;
    inset: 0;
    margin: auto;
    z-index: 10
}

.devsite-openid-user-service-account-qr-code-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

img.devsite-openid-user-service-account-qr-code {
    max-width: 160px;
    margin: 16px auto
}

devsite-pagination {
    display: block;
    font: var(--devsite-pagination-font,inherit);
    letter-spacing: var(--devsite-pagination-letter-spacing,normal)
}

devsite-pagination[buttons],devsite-pagination[initial-results] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-pagination button[hidden] {
    display: none
}

devsite-pagination .devsite-pagination-page-numbers-controls {
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-pagination .devsite-pagination-next-button,devsite-pagination .devsite-pagination-previous-button {
    --devsite-button-height: 24px;
    --devsite-button-line-height: 24px;
    --devsite-button-padding: 0;
    border: 0;
    min-width: 0
}

devsite-pagination .devsite-pagination-next-button:not([disabled]),devsite-pagination .devsite-pagination-previous-button:not([disabled]) {
    border: 0;
    color: var(--devsite-link-color)
}

devsite-pagination .devsite-pagination-previous-button:before {
    content: "chevron_left"
}

devsite-pagination .devsite-pagination-next-button:before {
    content: "chevron_right"
}

devsite-pagination .devsite-pagination-page-numbers {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-pagination .devsite-pagination-ellipsis,devsite-pagination .devsite-pagination-page-number {
    margin: var(--devsite-pagination-link-margin,0 8px)
}

devsite-pagination .devsite-pagination-page-number {
    font-weight: 500;
    height: 24px
}

devsite-pagination .devsite-pagination-page-number[selected] {
    border-bottom: 1px solid var(--devsite-link-color)
}

[dir] devsite-pagination .button,[dir] devsite-pagination .button+.button {
    margin-left: 10px;
    margin-right: 10px
}

devsite-panel {
    bottom: var(--devsite-cookie-bar-height,0);
    display: block;
    height: var(--devsite-panel-height,auto);
    left: 0;
    max-height: var(--devsite-panel-max-height,50vh);
    overflow: auto;
    position: fixed;
    right: 0;
    z-index: 1017
}

devsite-panel[always-on-top] {
    z-index: 1019
}

devsite-panel[devsite-size=content-area] {
    background-color: var(--devsite-background-1)
}

devsite-payments-buyflow {
    position: relative
}

devsite-payments-buyflow .devsite-payments-spinner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-block:48px}

devsite-payments-buyflow .devsite-payments-buyflow-footer {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 32px
}

devsite-payments-buyflow .modalIframeContainerElement {
    position: absolute
}

devsite-playlist {
    display: block;
    margin-bottom: 48px;
    --devsite-playlist-header-background: url(../../images/playlist_header.svg) no-repeat 0 -20px/cover;
    --devsite-playlist-expanded-background: #f1f3f4 url(../../images/playlist_active.svg) repeat-x top
}

devsite-playlist .devsite-playlist--inner {
    margin: 0 auto;
    max-width: var(--devsite-playlist-max-width);
    padding: 0 var(--devsite-playlist-padding-x)
}

devsite-playlist .devsite-playlist--header {
    background-color: #263238
}

devsite-playlist .devsite-playlist--header .devsite-playlist--inner {
    padding-bottom: 24px
}

devsite-playlist .devsite-playlist--header-details {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

devsite-playlist .devsite-playlist--header-badge-info,devsite-playlist .devsite-playlist--header-details-info {
    color: #fff;
    padding-top: 40px;
    width: calc(50% - 20px)
}

devsite-playlist .devsite-playlist--header-badge-info {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative
}

devsite-playlist .devsite-playlist--header-badge-info--bg {
    background: var(--devsite-playlist-header-background,none);
    content: "";
    height: 213px;
    inset-inline: 0;
    max-width: 510px;
    position: absolute;
    top: 0
}

devsite-playlist .devsite-playlist--header-badge-info--container {
    place-self: center;
    position: relative
}

devsite-playlist .devsite-playlist-badge-details-icon,devsite-playlist .devsite-playlist-badge-details-icon-container {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-playlist .devsite-playlist-badge-details-icon-container-signin-enabled.devsite-playlist-badge-details-icon-container {
    margin-bottom: -48px;
    position: relative;
    z-index: 1
}

devsite-playlist .devsite-playlist-badge-details-icon {
    background: var(--devsite-background-1);
    border-radius: 50%;
    height: 135px;
    padding: 7px;
    position: relative;
    width: 135px
}

devsite-playlist .devsite-playlist-badge-details-icon-container-signin-enabled .devsite-playlist-badge-details-icon {
    -webkit-transform: translate3d(0,-44px,0);
    transform: translate3d(0,-44px,0);
    -webkit-transition: -webkit-transform .2s cubic-bezier(0,0,.2,1);
    transition: -webkit-transform .2s cubic-bezier(0,0,.2,1);
    transition: transform .2s cubic-bezier(0,0,.2,1);
    transition: transform .2s cubic-bezier(0,0,.2,1),-webkit-transform .2s cubic-bezier(0,0,.2,1)
}

devsite-playlist .devsite-playlist--progress-bar--outer,devsite-playlist .devsite-playlist--progress-text,devsite-playlist .devsite-playlist-badge-details-action,devsite-playlist .devsite-playlist-badge-details-icon img,devsite-playlist .devsite-playlist-badge-details-subtext {
    opacity: 1;
    position: relative;
    -webkit-transition: opacity .2s cubic-bezier(.4,0,1,1),-webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: opacity .2s cubic-bezier(.4,0,1,1),-webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: opacity .2s cubic-bezier(.4,0,1,1),transform .2s cubic-bezier(.4,0,1,1);
    transition: opacity .2s cubic-bezier(.4,0,1,1),transform .2s cubic-bezier(.4,0,1,1),-webkit-transform .2s cubic-bezier(.4,0,1,1);
    z-index: 2
}

devsite-playlist .devsite-playlist-badge-details-icon img {
    -webkit-animation: badgeGrowIn .33s cubic-bezier(.75,0,.71,.97),badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) .33s,badgeFadeIn .5s linear;
    animation: badgeGrowIn .33s cubic-bezier(.75,0,.71,.97),badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) .33s,badgeFadeIn .5s linear;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

devsite-playlist .devsite-playlist-badge-sharing {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-top: var(--devsite-secondary-border);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 12px -16px -16px;
    padding: 8px 0;
    -webkit-padding-start: 12px;
    -moz-padding-start: 12px;
    padding-inline-start:12px}

devsite-playlist .devsite-playlist-share-buttons {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-playlist .devsite-playlist-badge-sharing span {
    color: var(--devsite-secondary-text-color);
    font-size: 14px;
    line-height: 14px
}

devsite-playlist .devsite-playlist-badge-sharing img {
    width: 18px
}

devsite-playlist .devsite-playlist-badge-sharing button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 0;
    box-shadow: none;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: auto;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-width: 0;
    padding: 4px
}

devsite-playlist .devsite-playlist-badge-sharing button:focus,devsite-playlist .devsite-playlist-badge-sharing button:hover {
    background: none
}

devsite-playlist .devsite-playlist-badge-sharing button+button {
    margin: 0 8px
}

devsite-playlist .devsite-playlist-badge-details-icon img {
    position: static
}

devsite-playlist .devsite-playlist-badge-details-icon devsite-spinner {
    opacity: 0;
    position: absolute;
    -webkit-transition: opacity .2s cubic-bezier(.4,0,1,1);
    transition: opacity .2s cubic-bezier(.4,0,1,1)
}

devsite-playlist .devsite-playlist--progress-text {
    color: var(--devsite-primary-text-color);
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    text-align: center
}

devsite-playlist .devsite-playlist--progress-bar {
    -webkit-transition: opacity .2s cubic-bezier(.4,0,1,1);
    transition: opacity .2s cubic-bezier(.4,0,1,1)
}

devsite-playlist .devsite-playlist--progress-bar.hide {
    opacity: 0
}

devsite-playlist .devsite-playlist--progress-bar--outer {
    background: var(--devsite-link-background-active);
    border-radius: 24px;
    height: 10px;
    margin: 14px 0 0;
    position: relative
}

devsite-playlist .devsite-playlist--progress-bar--inner {
    background: var(--devsite-link-color);
    border-radius: 24px;
    display: inline-block;
    height: 100%;
    position: absolute;
    -webkit-transition: width .3s cubic-bezier(0,0,.2,1);
    transition: width .3s cubic-bezier(0,0,.2,1);
    white-space: nowrap;
    width: 0
}

devsite-playlist .devsite-playlist-badge-details-action,devsite-playlist .devsite-playlist-badge-details-subtext {
    font-size: 14px;
    line-height: 16px;
    text-align: center
}

devsite-playlist .devsite-playlist-badge-details-subtext {
    color: var(--devsite-secondary-text-color);
    padding: 28px 0 0
}

devsite-playlist .devsite-playlist-badge-details-action {
    font-weight: 700;
    padding: 4px 0 0
}

devsite-playlist .no-badge .devsite-playlist-badge-details-icon-container {
    display: none
}

devsite-playlist .badge-earned .devsite-playlist-badge-details-subtext {
    padding: 0 0 12px
}

devsite-playlist .not-eligible .devsite-playlist--progress-bar,devsite-playlist .not-eligible .devsite-playlist--progress-text {
    display: none
}

devsite-playlist .not-eligible.no-badge .devsite-playlist-badge-details-subtext {
    padding-top: 0
}

devsite-playlist .loading {
    pointer-events: none
}

devsite-playlist .loading .devsite-playlist-badge-details-icon-container {
    margin-bottom: 0;
    position: absolute;
    inset: 0
}

devsite-playlist .loading .devsite-playlist-badge-details-icon {
    background: 0;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

devsite-playlist .loading .devsite-playlist--progress-bar--outer,devsite-playlist .loading .devsite-playlist--progress-text,devsite-playlist .loading .devsite-playlist-badge-details-action,devsite-playlist .loading .devsite-playlist-badge-details-subtext {
    opacity: 0
}

devsite-playlist .loading .devsite-playlist-badge-details-icon img {
    opacity: 0;
    position: absolute
}

devsite-playlist .loading .devsite-playlist-badge-details-icon devsite-spinner {
    opacity: 1
}

devsite-playlist .devsite-playlist--header h1:first-of-type {
    color: #fff;
    font: var(--devsite-h1-font)
}

devsite-playlist .devsite-playlist-details {
    color: var(--devsite-secondary-text-color);
    font-size: 12px;
    line-height: 16px
}

devsite-playlist .devsite-playlist--header p {
    line-height: 24px;
    margin: 22px 0;
    padding: 0
}

devsite-playlist .devsite-playlist-return-button {
    margin-top: 24px
}

devsite-playlist .devsite-playlist-summary {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font: normal 700 12px/24px var(--devsite-primary-font-family)
}

devsite-playlist .devsite-playlist-badge-details {
    background: var(--devsite-background-1);
    border-radius: 8px;
    height: auto;
    max-width: 213px;
    padding: 16px;
    width: 100%;
    min-width: 64px;
    min-height: 64px
}

devsite-playlist .profile-notification {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-playlist .profile-notification--inner {
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color);
    border-radius: 4px;
    color: var(--devsite-secondary-text-color);
    margin: 0 auto;
    padding: 16px
}

devsite-playlist .devsite-playlist--section {
    padding: 24px 0;
    position: relative
}

devsite-playlist .devsite-playlist--section .arrow--up,devsite-playlist[not-signed-in] .devsite-playlist--item--meta em,devsite-playlist[not-signed-in] .devsite-playlist--section .playlist-skip {
    display: none
}

devsite-playlist .devsite-playlist--item-top {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-playlist .devsite-playlist--item-top:before {
    background: var(--devsite-background-5);
    content: "";
    display: block;
    height: 0;
    -webkit-margin-start: 15px;
    -moz-margin-start: 15px;
    margin-inline-start:15px;margin-top: 2px;
    position: absolute;
    top: 54px;
    -webkit-transition: height .2s cubic-bezier(.4,0,1,1),opacity .2s cubic-bezier(.4,0,1,1);
    transition: height .2s cubic-bezier(.4,0,1,1),opacity .2s cubic-bezier(.4,0,1,1);
    width: 1px;
    z-index: 1
}

devsite-playlist .devsite-playlist--item-top-index {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0;
    -moz-box-flex: 0;
    -ms-flex: 0 0;
    flex: 0 0;
    position: relative;
    width: 30px
}

devsite-playlist .devsite-playlist--item-top-index span {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-primary-text-color);
    border-radius: 50%;
    color: var(--devsite-playlist-item-index-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 30px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 2px;
    opacity: 1;
    width: 30px
}

devsite-playlist .devsite-playlist--item-top-index i {
    color: var(--devsite-playlist-icon-color);
    font-size: 36px;
    height: 36px;
    left: -3px;
    opacity: 0;
    position: absolute;
    top: -1px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 36px
}

devsite-playlist .devsite-playlist--item-top-index devsite-spinner {
    opacity: 0;
    position: absolute;
    top: 2px
}

devsite-playlist .devsite-playlist--item-top-index devsite-spinner,devsite-playlist .devsite-playlist--item-top-index i,devsite-playlist .devsite-playlist--item-top-index span {
    -webkit-transition: background .2s cubic-bezier(.4,0,1,1),opacity .2s cubic-bezier(.4,0,1,1);
    transition: background .2s cubic-bezier(.4,0,1,1),opacity .2s cubic-bezier(.4,0,1,1)
}

devsite-playlist .devsite-playlist--item-top-controls {
    width: 32px
}

devsite-playlist .devsite-playlist--item-top-controls button {
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color);
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    color: var(--devsite-playlist-button-color,var(--devsite-primary-text-color));
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 32px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-width: 0;
    padding: 0;
    width: 32px
}

devsite-playlist .devsite-playlist--item-top-controls button:focus,devsite-playlist .devsite-playlist--item-top-controls button:hover {
    color: var(--devsite-playlist-button-color-hover)
}

devsite-playlist .devsite-playlist--item-top-controls button:active {
    color: var(--devsite-playlist-button-color-active)
}

devsite-playlist .devsite-playlist--item-top-controls button .material-icons {
    cursor: pointer;
    font-size: 24px;
    height: 24px;
    margin: 0;
    position: static;
    top: auto;
    width: 24px
}

devsite-playlist .devsite-playlist--item-top-title {
    cursor: pointer;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 0 18px
}

devsite-playlist .devsite-playlist--item-top-title h2 {
    font-size: 28px;
    line-height: 36px;
    margin: 0;
    padding: 0
}

devsite-playlist .devsite-playlist--item--content,devsite-playlist .devsite-playlist--item--meta {
    padding: 0 48px
}

devsite-playlist .devsite-playlist--item--meta {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-secondary-text-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 12px;
    line-height: 16px;
    margin: 4px 0
}

devsite-playlist .devsite-playlist--item--meta em {
    -webkit-padding-start: 16px;
    -moz-padding-start: 16px;
    padding-inline-start:16px}

devsite-playlist .devsite-playlist--item--meta .material-icons {
    font-size: 18px;
    height: 18px;
    -webkit-margin-end: 4px;
    -moz-margin-end: 4px;
    margin-inline-end:4px;width: 18px
}

devsite-playlist .devsite-playlist--item--actions,devsite-playlist .devsite-playlist--item--content {
    display: none
}

devsite-playlist .devsite-playlist--item--actions {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 8px 0 32px;
    -webkit-padding-start: 48px;
    -moz-padding-start: 48px;
    padding-inline-start:48px}

devsite-playlist [rendered] .devsite-playlist--item-top:before {
    height: calc(100% - 30px)
}

devsite-playlist [expanded] {
    background: var(--devsite-playlist-expanded-background,none)
}

devsite-playlist [expanded] .arrow--down {
    display: none
}

devsite-playlist [expanded] .arrow--up {
    display: block
}

devsite-playlist [expanded] .devsite-playlist--item-top-index span {
    background: var(--devsite-link-color)
}

devsite-playlist [expanded] .devsite-playlist--item--content {
    display: block
}

devsite-playlist [expanded] .devsite-playlist--item--actions {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-playlist [type=game] .devsite-playlist--item--content,devsite-playlist [type=video] .devsite-playlist--item--content {
    padding: 12px 48px
}

devsite-playlist .devsite-playlist--section devsite-spinner {
    --devsite-spinner-animation-play-state: paused
}

devsite-playlist .devsite-playlist--section[completing] devsite-spinner {
    opacity: 1;
    --devsite-spinner-animation-play-state: playing
}

devsite-playlist .devsite-playlist--section[completed] .devsite-playlist--item-top-index span {
    opacity: 0
}

devsite-playlist .devsite-playlist--section[completed] .devsite-playlist--item-top-index i {
    opacity: 1;
    -webkit-transform: rotate(0);
    transform: rotate(0)
}

devsite-playlist .devsite-playlist--section[completed] .playlist-skip {
    display: none
}

devsite-playlist .devsite-playlist--section[completed][expanded] .devsite-playlist--item-top-index i {
    background-color: rgba(232,240,254,.24)
}

devsite-playlist .devsite-playlist--section[last] .devsite-playlist--item-top:before {
    display: none
}

devsite-playlist .devsite-playlist--section-quiz {
    border: var(--devsite-primary-border);
    border-radius: 4px;
    padding: 24px
}

devsite-playlist .devsite-playlist--section-quiz h2 {
    margin: 0;
    padding: 0
}

devsite-playlist .devsite-playlist--section-project-header {
    -webkit-box-align: start;
    -webkit-align-items: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 0 8px
}

devsite-playlist .devsite-playlist--project--status {
    background: var(--devsite-background-3);
    border-radius: 4px;
    font: 500 11px/16px var(--devsite-primary-font-family);
    letter-spacing: .8px;
    padding-block:4px;padding-inline:8px;text-transform: uppercase
}

devsite-playlist .devsite-playlist--footer,devsite-playlist .devsite-playlist--section-quiz .devsite-playlist--item--actions {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-playlist .devsite-playlist--footer {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 20px;
    padding: 4px 0
}

.devsite-playlist-dialog {
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color);
    background: var(--devsite-background-1);
    border-radius: 8px;
    padding: 24px;
    position: relative
}

.devsite-playlist-dialog .devsite-playlist-dialog-spinner {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-background-1);
    bottom: 0;
    display: none;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 100
}

.devsite-playlist-dialog.loading .devsite-playlist-dialog-spinner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.devsite-playlist-dialog .devsite-playlist-dialog-inner {
    color: var(--devsite-secondary-text-color);
    position: relative
}

.devsite-playlist-dialog .devsite-playlist-dialog-inner h4 {
    font-family: var(--devsite-headline-font-family);
    font-size: 16px;
    line-height: 24px;
    margin: 0 0 16px
}

.devsite-playlist-dialog .devsite-playlist-dialog-inner label {
    font-size: 14px;
    line-height: 22px
}

.devsite-playlist-dialog .devsite-playlist-dialog-inner p {
    color: var(--devsite-secondary-text-color);
    font-size: 12px;
    line-height: 16px
}

@media screen and (max-width: 600px) {
    devsite-playlist .devsite-playlist--header-details {
        -webkit-box-align:center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    devsite-playlist .devsite-playlist--header-badge-info,devsite-playlist .devsite-playlist--header-details-info {
        width: 100%
    }

    devsite-playlist .devsite-playlist--header-badge-info--bg {
        background-position: 0;
        top: 84px
    }
}

devsite-playlist .community-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 24px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-width: var(--devsite-playlist-max-width);
    padding: 0 var(--devsite-playlist-padding-x);
    margin: 48px auto
}

devsite-playlist .community-details {
    border: 1px solid var(--devsite-grey-300);
    border-radius: 8px;
    padding: 24px
}

devsite-playlist .community-title {
    font-size: 22px;
    font-weight: 500;
    text-align: center;
    --devsite-h2-margin: 0
}

devsite-playlist .community-subtitle {
    font-size: 16px;
    color: var(--devsite-secondary-text-color);
    text-align: center;
    margin: 0
}

devsite-playlist-earnable-badges {
    display: block
}

devsite-playlist-earnable-badges.loading {
    position: relative
}

devsite-playlist-earnable-badges .spinner-container {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-playlist-summary {
    display: block
}

devsite-playlist-summary.loading {
    position: relative
}

devsite-playlist-summary .progress-container {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1000
}

devsite-playlist-summary .devsite-playlist-summary-image.hide,devsite-playlist-summary .devsite-playlist-summary-info.hide {
    opacity: 0;
    -webkit-transform: translateY(12px);
    transform: translateY(12px);
    -webkit-transition: opacity .213s cubic-bezier(.4,0,1,1),-webkit-transform .213s cubic-bezier(.4,0,1,1);
    transition: opacity .213s cubic-bezier(.4,0,1,1),-webkit-transform .213s cubic-bezier(.4,0,1,1);
    transition: transform .213s cubic-bezier(.4,0,1,1),opacity .213s cubic-bezier(.4,0,1,1);
    transition: transform .213s cubic-bezier(.4,0,1,1),opacity .213s cubic-bezier(.4,0,1,1),-webkit-transform .213s cubic-bezier(.4,0,1,1)
}

devsite-playlist-summary .devsite-playlist-summary-image,devsite-playlist-summary .devsite-playlist-summary-info {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: opacity .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1);
    transition: opacity .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1);
    transition: transform .213s cubic-bezier(0,0,.2,1),opacity .213s cubic-bezier(0,0,.2,1);
    transition: transform .213s cubic-bezier(0,0,.2,1),opacity .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1)
}

devsite-playlist-summary .devsite-playlist-summary-progress-background {
    overflow: hidden
}

devsite-playlist-summary.not-signed-in .devsite-playlist-summary-progress-background {
    margin-right: 0
}

devsite-playlist-summary.not-signed-in .devsite-playlist-summary-progress-bar-value {
    display: none
}

devsite-playlist-summary .devsite-playlist-summary-progress-bar {
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
    -webkit-transition: -webkit-transform .213s cubic-bezier(0,0,.2,1);
    transition: -webkit-transform .213s cubic-bezier(0,0,.2,1);
    transition: transform .213s cubic-bezier(0,0,.2,1);
    transition: transform .213s cubic-bezier(0,0,.2,1),-webkit-transform .213s cubic-bezier(0,0,.2,1)
}

devsite-playlist-summary .devsite-playlist-summary-progress-bar-value:empty:before,devsite-playlist-summary .devsite-playlist-summary-status:empty:before {
    content: " "
}

devsite-pricing-plans {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 24px
}

devsite-pricing-plans[data-embed] {
    padding: 24px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-pricing-plans .devsite-pricing-plans--loading {
    padding: 96px 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@-webkit-keyframes fade-in {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes fade-in {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes skeleton-loader-pulse {
    0% {
        opacity: 1;
        -webkit-animation-timing-function: cubic-bezier(.3,0,.8,.15);
        animation-timing-function: cubic-bezier(.3,0,.8,.15)
    }

    50% {
        opacity: .5;
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear
    }

    to {
        opacity: 1
    }
}

devsite-pricing-plans .devsite-pricing-plan-skeleton-loading:after {
    background: #e8eaed;
    border-radius: 4px;
    -webkit-animation: skeleton-loader-pulse 1s infinite;
    animation: skeleton-loader-pulse 1s infinite;
    content: ".";
    color: transparent;
    display: inline-block;
    width: var(--skeleton-width,100%);
    height: var(--skeleton-height,100%);
    max-width: 100%;
    max-height: 100%
}

devsite-pricing-plans .devsite-pricing-plan-skeleton-loading+.devsite-pricing-plan-skeleton-loading:after {
    margin-block:2px}

devsite-pricing-plans .devsite-pricing-plans-header {
    font-family: var(--devsite-sys-typescale--headline-4--font-names);
    font-size: var(--devsite-sys-typescale--headline-4--font-size);
    font-weight: var(--devsite-sys-typescale--headline-4--font-weight);
    line-height: var(--devsite-sys-typescale--headline-4--line-height);
    color: #202124;
    margin: 0
}

devsite-pricing-plans .devsite-pricing-plans-container {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: repeat(6,auto);
    grid-gap: 12px 24px;
    max-width: 952px;
    margin: 0 auto;
    width: 100%
}

devsite-pricing-plans .devsite-pricing-plans-container-enterprise {
    grid-template-columns: repeat(3,1fr);
    max-width: 1200px
}

devsite-pricing-plans .devsite-pricing-plans-confetti-container-col-1 {
    grid-area: 1/1/2/2
}

devsite-pricing-plans .devsite-pricing-plans-confetti-container-col-2 {
    grid-area: 1/2/2/3
}

devsite-pricing-plans .devsite-pricing-plans-confetti-container-col-1,devsite-pricing-plans .devsite-pricing-plans-confetti-container-col-2 {
    position: relative
}

devsite-pricing-plans .devsite-pricing-plans-border-col-1 {
    grid-area: 1/1/7/2;
    border: 1px solid #dadce0
}

devsite-pricing-plans .devsite-pricing-plans-border-col-2 {
    grid-area: 1/2/7/3;
    border: 4px solid #34a853
}

devsite-pricing-plans .devsite-pricing-plans-container-enterprise .devsite-pricing-plans-border-col-2 {
    border: 0;
    position: relative;
    pointer-events: none
}

devsite-pricing-plans .devsite-pricing-plans-container-enterprise .devsite-pricing-plans-border-col-2:before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 16px;
    border: 4px solid transparent;
    background: -webkit-linear-gradient(left,#fff,#fff),-webkit-linear-gradient(13deg,#4285f4,#34a853);
    background: linear-gradient(90deg,#fff,#fff),linear-gradient(77deg,#4285f4,#34a853);
    background-clip: padding-box,border-box;
    background-origin: padding-box,border-box;
    z-index: -1
}

devsite-pricing-plans .devsite-pricing-plans-border-col-3 {
    grid-area: 1/3/7/4;
    border: 4px solid #1a73e8
}

devsite-pricing-plans .devsite-pricing-plans-loading .devsite-pricing-plans-border-col-2 {
    border: 1px solid #dadce0
}

devsite-pricing-plans .devsite-pricing-plans-loading .devsite-pricing-plans-border-col-2:before {
    display: none
}

devsite-pricing-plans .devsite-pricing-plans-loading .devsite-pricing-plans-border-col-3 {
    border: 1px solid #dadce0
}

devsite-pricing-plans .devsite-pricing-plans-border-col-1,devsite-pricing-plans .devsite-pricing-plans-border-col-2,devsite-pricing-plans .devsite-pricing-plans-border-col-3 {
    border-radius: 16px
}

devsite-pricing-plans .devsite-pricing-plans-chip {
    position: relative
}

devsite-pricing-plans .devsite-pricing-plans-chip-col-1 {
    grid-area: 1/1/2/2
}

devsite-pricing-plans .devsite-pricing-plans-chip-col-2 {
    grid-area: 1/2/2/3
}

devsite-pricing-plans .devsite-pricing-plans-chip-col-3 {
    grid-area: 1/3/2/4
}

devsite-pricing-plans .devsite-pricing-plans-chip-col-1,devsite-pricing-plans .devsite-pricing-plans-chip-col-2,devsite-pricing-plans .devsite-pricing-plans-chip-col-3 {
    padding: 16px 32px 0;
    text-align: center
}

devsite-pricing-plans .devsite-pricing-plan-title-col-1 {
    grid-area: 2/1/3/2
}

devsite-pricing-plans .devsite-pricing-plan-title-col-2 {
    grid-area: 2/2/3/3
}

devsite-pricing-plans .devsite-pricing-plan-title-col-3 {
    grid-area: 2/3/3/4
}

devsite-pricing-plans .devsite-pricing-plan-title-col-1,devsite-pricing-plans .devsite-pricing-plan-title-col-2,devsite-pricing-plans .devsite-pricing-plan-title-col-3 {
    margin: 4px 32px;
    text-align: center
}

devsite-pricing-plans .devsite-pricing-plan-cta-col-1 {
    grid-area: 3/1/4/2
}

devsite-pricing-plans .devsite-pricing-plan-cta-col-2 {
    grid-area: 3/2/4/3
}

devsite-pricing-plans .devsite-pricing-plan-cta-col-3 {
    grid-area: 3/3/4/4
}

devsite-pricing-plans .devsite-pricing-plan-cta-col-1,devsite-pricing-plans .devsite-pricing-plan-cta-col-2,devsite-pricing-plans .devsite-pricing-plan-cta-col-3 {
    padding: 0 32px;
    text-align: center
}

devsite-pricing-plans .devsite-pricing-plan-action-container-col-1 {
    grid-area: 4/1/5/2
}

devsite-pricing-plans .devsite-pricing-plan-action-container-col-2 {
    grid-area: 4/2/5/3
}

devsite-pricing-plans .devsite-pricing-plan-action-container-col-3 {
    grid-area: 4/3/5/4
}

devsite-pricing-plans .devsite-pricing-plan-action-container-col-1,devsite-pricing-plans .devsite-pricing-plan-action-container-col-2,devsite-pricing-plans .devsite-pricing-plan-action-container-col-3 {
    padding: 0 32px;
    text-align: center
}

devsite-pricing-plans .devsite-pricing-plan-features-col-1 {
    grid-area: 5/1/6/2
}

devsite-pricing-plans .devsite-pricing-plan-features-col-2 {
    grid-area: 5/2/6/3
}

devsite-pricing-plans .devsite-pricing-plan-features-col-3 {
    grid-area: 5/3/6/4
}

devsite-pricing-plans .devsite-pricing-plan-features-col-1,devsite-pricing-plans .devsite-pricing-plan-features-col-2,devsite-pricing-plans .devsite-pricing-plan-features-col-3 {
    padding: 0 32px
}

devsite-pricing-plans .devsite-pricing-plan-features-buttons-col-1 {
    grid-area: 6/1/7/2
}

devsite-pricing-plans .devsite-pricing-plan-features-buttons-col-2 {
    grid-area: 6/2/7/3
}

devsite-pricing-plans .devsite-pricing-plan-features-buttons-col-3 {
    grid-area: 6/3/7/4
}

devsite-pricing-plans .devsite-pricing-plan-features-buttons {
    text-align: center;
    margin-bottom: 8px
}

devsite-pricing-plans .devsite-pricing-plan-features-buttons hr {
    margin: 16px 0
}

devsite-pricing-plans .devsite-pricing-plan-features-buttons-col-1 .devsite-pricing-plan-features-buttons,devsite-pricing-plans .devsite-pricing-plan-features-buttons-col-2 .devsite-pricing-plan-features-buttons,devsite-pricing-plans .devsite-pricing-plan-features-buttons-col-3 .devsite-pricing-plan-features-buttons {
    padding: 0 32px 8px
}

@media screen and (max-width: 840px) {
    devsite-pricing-plans .devsite-pricing-plans-container {
        grid-template-columns:100%;
        grid-template-rows: repeat(23,auto)
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plans-confetti-container-col-1,devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plans-confetti-container-col-2 {
        display: none
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plans-border-col-2 {
        grid-area: 1/1/7/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plans-border-col-3 {
        grid-area: 9/1/15/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plans-border-col-1 {
        grid-area: 17/1/23/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plans-chip-col-2 {
        grid-area: 1/1/1/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plans-chip-col-3 {
        grid-area: 9/1/9/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plans-chip-col-1 {
        grid-area: 17/1/17/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-title-col-2 {
        grid-area: 2/1/2/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-title-col-3 {
        grid-area: 10/1/10/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-title-col-1 {
        grid-area: 18/1/18/2
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-cta-col-2 {
        grid-area: 3/1/3/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-cta-col-3 {
        grid-area: 11/1/11/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-cta-col-1 {
        grid-area: 19/1/19/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-action-container-col-2 {
        grid-area: 4/1/4/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-action-container-col-3 {
        grid-area: 12/1/12/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-action-container-col-1 {
        grid-area: 20/1/20/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-features-col-2 {
        grid-area: 5/1/5/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-features-col-3 {
        grid-area: 13/1/13/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-features-col-1 {
        grid-area: 21/1/21/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-features-buttons-col-2 {
        grid-area: 6/1/6/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-features-buttons-col-3 {
        grid-area: 14/1/14/1
    }

    devsite-pricing-plans .devsite-pricing-plans-container .devsite-pricing-plan-features-buttons-col-1 {
        grid-area: 22/1/22/1
    }
}

devsite-pricing-plans .devsite-confetti {
    pointer-events: none;
    position: absolute;
    width: 240px;
    height: 240px
}

devsite-pricing-plans .devsite-confetti img {
    width: 100%;
    height: 100%
}

devsite-pricing-plans .devsite-pricing-plans-container {
    -webkit-animation: fade-in .2s linear;
    animation: fade-in .2s linear;
    position: relative
}

devsite-pricing-plans .devsite-pricing-plans-container .devsite-confetti-1 {
    top: -52px;
    left: -42px
}

devsite-pricing-plans .devsite-pricing-plans-container .devsite-confetti-2 {
    top: 24px;
    right: -42px
}

devsite-pricing-plans .devsite-pricing-plans-container .button,devsite-pricing-plans .devsite-pricing-plans-container .button-primary {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
    --devsite-button-material-icon-margin-x: 0;
    --devsite-button-padding: 0 16px
}

devsite-pricing-plans .devsite-pricing-plans-container .button .material-icons,devsite-pricing-plans .devsite-pricing-plans-container .button-primary .material-icons {
    top: auto;
    margin-inline:0}

devsite-pricing-plans .devsite-pricing-plans-container .button .material-symbols-outlined,devsite-pricing-plans .devsite-pricing-plans-container .button-primary .material-symbols-outlined {
    font-size: 18px
}

devsite-pricing-plans .devsite-pricing-plan-features {
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    list-style-type: none;
    padding: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 16px
}

devsite-pricing-plans .devsite-pricing-plan-features li {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    margin: 0
}

devsite-pricing-plans .devsite-pricing-plan-features li .devsite-pricing-plan-icon {
    width: 24px;
    color: #5f6368;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

devsite-pricing-plans .devsite-pricing-plan-features li .devsite-pricing-plan-icon-smart_assistant img,devsite-pricing-plans .devsite-pricing-plan-features li .devsite-pricing-plan-icon-smart_assistant_gradient img {
    max-width: 20px
}

devsite-pricing-plans .devsite-pricing-plan-features li .devsite-pricing-plan-icon-checkmark {
    color: #188038
}

devsite-pricing-plans .devsite-pricing-plan-features li .devsite-pricing-plan-feature-description {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

devsite-pricing-plans .devsite-pricing-plan-features li h4 {
    margin: 2px 0 4px;
    font-family: var(--devsite-sys-typescale--title-s-brand--font-names);
    font-size: var(--devsite-sys-typescale--title-s-brand--font-size);
    font-weight: var(--devsite-sys-typescale--title-s-brand--font-weight);
    line-height: var(--devsite-sys-typescale--title-s-brand--line-height);
    color: #202124
}

devsite-pricing-plans .devsite-pricing-plan-features li p {
    color: #3c4043;
    display: none;
    font-size: 14px;
    line-height: 20px;
    margin: 0
}

devsite-pricing-plans .devsite-pricing-plan-features.devsite-pricing-plan-features--expanded li p {
    display: block
}

devsite-pricing-plans .devsite-pricing-plan-description {
    color: #202124;
    font: normal 500 14px/20px Google Sans;
    margin: 0 0 16px
}

devsite-pricing-plans .devsite-pricing-plan-payment-container {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 200px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-pricing-plans .devsite-chip-current,devsite-pricing-plans .devsite-chip-recommended,devsite-pricing-plans .devsite-chip-recommended-teams {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 4px 16px;
    border-radius: 24px;
    font: normal 500 14px/20px Google Sans;
    text-align: center
}

devsite-pricing-plans .devsite-chip-current {
    background-color: #e8eaed;
    color: #202124
}

devsite-pricing-plans .devsite-chip-recommended {
    background-color: #e6f4ea;
    color: #0d652d
}

devsite-pricing-plans .devsite-chip-recommended-teams {
    background-color: #e8f0fe;
    color: #174ea6
}

devsite-pricing-plans .devsite-pricing-plan-title {
    margin: 0;
    color: #202124;
    --devsite-h3-font: normal 500 20px/32px "Google Sans"
}

devsite-pricing-plans .devsite-pricing-plan-price {
    font: normal 500 18px/28px Google Sans;
    color: #202124;
    max-width: 290px;
    margin: 0 auto
}

devsite-pricing-plans hr {
    border: 0;
    border-top: 1px solid #dadce0;
    margin: 12px 0 24px
}

devsite-pricing-plans .devsite-pricing-plans-footer {
    font-size: 14px
}

devsite-pricing-plans .devsite-pricing-plans-payment-modal {
    border: 0;
    background: #fff;
    border-radius: 16px;
    padding: 0;
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color);
    z-index: 10;
    overflow: visible;
    width: 100%;
    max-width: 560px;
    max-height: calc(100vh - 38px)
}

devsite-pricing-plans .devsite-pricing-plans-payment-modal::-webkit-backdrop {
    -webkit-transition: background-color .2s cubic-bezier(.3,0,.8,.15);
    transition: background-color .2s cubic-bezier(.3,0,.8,.15);
    background-color: transparent
}

devsite-pricing-plans .devsite-pricing-plans-payment-modal::backdrop {
    -webkit-transition: background-color .2s cubic-bezier(.3,0,.8,.15);
    transition: background-color .2s cubic-bezier(.3,0,.8,.15);
    background-color: transparent
}

devsite-pricing-plans .devsite-pricing-plans-payment-modal[open]::-webkit-backdrop {
    background-color: rgba(32,33,36,.46)
}

devsite-pricing-plans .devsite-pricing-plans-payment-modal[open]::backdrop {
    background-color: rgba(32,33,36,.46)
}

devsite-pricing-plans .devsite-pricing-plans-payment-modal-container {
    background: #fff;
    border-radius: 16px;
    overflow: auto;
    max-height: calc(100vh - 38px)
}

devsite-pricing-plans .devsite-payment-modal-header {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 24px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 24px 16px 0 24px;
    position: -webkit-sticky;
    position: sticky;
    top: 0
}

devsite-pricing-plans .devsite-pricing-plans-modal-stripe-container {
    padding: 0 24px 24px
}

devsite-pricing-plans .devsite-pricing-plans-modal-gpp-container {
    padding: 0
}

devsite-pricing-plans .devsite-payment-complete {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow: auto
}

devsite-pricing-plans .devsite-payment-complete-purchased {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: 12px
}

devsite-pricing-plans .devsite-payment-complete-purchased p {
    margin: 2px;
    font: normal 500 20px Google Sans
}

devsite-pricing-plans .devsite-payment-complete-plan-price,devsite-pricing-plans .devsite-payment-complete-plan-title {
    font: normal 500 16px/24px var(--devsite-headline-font-family)
}

devsite-pricing-plans .devsite-payment-complete-plan-title {
    margin-bottom: 6px
}

devsite-pricing-plans .devsite-payment-complete-plan-renewal-date {
    font: normal 400 14px/20px var(--devsite-headline-font-family)
}

devsite-pricing-plans .devsite-payment-complete-summary {
    color: #202124;
    margin: 16px 0 0;
    background: #f8f9fa;
    border-radius: 16px;
    padding: 20px 16px;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: 2px
}

devsite-pricing-plans .devsite-confetti-1 {
    left: -70px;
    top: -40px
}

devsite-pricing-plans .devsite-confetti-2 {
    right: -80px;
    top: 30px
}

devsite-pricing-plans .devsite-confetti-3 {
    left: -40px;
    bottom: 30px
}

devsite-pricing-plans .devsite-confetti-4 {
    right: -20px;
    bottom: -40px
}

devsite-pricing-plans .devsite-payment-complete-header,devsite-pricing-plans .devsite-payment-modal-header {
    --devsite-h2-font: normal 400 20px/28px var(--devsite-headline-font-family);
    --devsite-h2-margin: 0;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 24px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 24px 8px 0 24px;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    width: 100%;
    --devsite-h3-margin: 0;
    --devsite-h3-font: 500 16px/24px var(--devsite-headline-font-family);
    --devsite-button-padding: 0;
    --devsite-button-border-radius: 50%;
    --devsite-button-border: 0;
    --devsite-button-border-hover: 0;
    --devsite-button-color-hover: #202124;
    --devsite-button-color: #5f6368;
    --devsite-button-box-shadow: none;
    --devsite-button-height: 48px;
    --devsite-button-width: 48px;
    --devsite-button-background-hover: #dadce0;
    --devsite-button-background-active: #dadce0;
    --devsite-button-border-active: 0;
    --devsite-button-box-shadow-active: 0
}

devsite-pricing-plans .devsite-payment-complete-logo {
    padding: 0 24px 24px
}

devsite-pricing-plans .devsite-payment-complete-logo img {
    max-width: 330px
}

devsite-pricing-plans .devsite-payment-complete-body {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    text-align: left;
    padding: 0 24px;
    gap: 8px;
    color: #000
}

devsite-pricing-plans .devsite-payment-complete-body h2 {
    --devsite-h2-margin: 0;
    --devsite-h2-font: 500 20px/32px var(--devsite-headline-font-family)
}

devsite-pricing-plans .devsite-payment-complete-body p {
    margin: 0;
    font-size: 16px;
    line-height: 24px
}

devsite-pricing-plans .devsite-pricing-plans-modal-content {
    padding: 12px 24px;
    font-size: 14px
}

devsite-pricing-plans .devsite-pricing-plans-embed-loading {
    padding: 56px 24px
}

devsite-pricing-plans .devsite-pricing-plans-modal-form {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 16px
}

devsite-pricing-plans .devsite-pricing-plans-modal-form label {
    cursor: pointer;
    font: normal 400 14px/20px Roboto
}

devsite-pricing-plans .devsite-pricing-plans-modal-spinner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-block:36px}

devsite-pricing-plans .devsite-pricing-plans-modal-footer {
    padding: 12px 24px 24px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

devsite-pricing-plans .devsite-payment-complete-footer {
    padding: 24px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

devsite-pricing-plans .devsite-payment-complete-footer .button {
    font-size: 16px;
    --devsite-button-height: 40px;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-pricing-plans .devsite-pricing-plans-embed-profile-creation {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

devsite-pricing-plans .devsite-pricing-plans-embed-profile-creation .devsite-payment-complete-header h2 {
    text-align: left
}

devsite-pricing-plans .devsite-pricing-plans-embed-profile-creation h2 {
    text-align: left
}

devsite-pricing-plans[data-embed] .devsite-pricing-plans-payment-modal {
    max-width: none;
    max-height: none
}

devsite-pricing-plans[data-embed] .devsite-pricing-plans-payment-modal-container {
    -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-height: none
}

devsite-pricing-plans[data-embed] .devsite-payment-complete-header {
    background-size: cover
}

.devsite-pricing-plan-promo-ribbon {
    --padding: 8px;
    position: absolute;
    top: 0;
    right: 0;
    padding-bottom: var(--padding);
    -webkit-clip-path: polygon(100% calc(100% - var(--padding)),100% 100%,calc(100% - var(--padding)) calc(100% - var(--padding)),var(--padding) calc(100% - var(--padding)),0 100%,0 calc(100% - var(--padding)),999px calc(100% - var(--padding) - 999px),calc(100% - 999px) calc(100% - var(--padding) - 999px));
    clip-path: polygon(100% calc(100% - var(--padding)),100% 100%,calc(100% - var(--padding)) calc(100% - var(--padding)),var(--padding) calc(100% - var(--padding)),0 100%,0 calc(100% - var(--padding)),999px calc(100% - var(--padding) - 999px),calc(100% - 999px) calc(100% - var(--padding) - 999px));
    -webkit-transform: translate(29.2893218813%,-100%) rotate(45deg);
    transform: translate(29.2893218813%,-100%) rotate(45deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    background-color: #e8f0fe;
    color: #174ea6
}

.devsite-pricing-plan-promo-ribbon div {
    width: 210px;
    padding: 0 48px;
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color);
    border-bottom: 1px solid var(--devsite-elevation-key-shadow-color);
    font: normal 500 14px/20px Google Sans;
    text-align: center
}

@starting-style {
    devsite-pricing-plans .devsite-pricing-plans-payment-modal[open]: :-webkit-backdrop {
        background-color:transparent
    }

    devsite-pricing-plans .devsite-pricing-plans-payment-modal[open]: :backdrop {
        background-color:transparent
    }
}

devsite-product-catalog .devsite-product-catalog-alphabet {
    border-bottom: var(--devsite-primary-border);
    border-top: var(--devsite-primary-border);
    color: var(--devsite-secondary-text-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 20px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 16px 0
}

devsite-product-catalog .devsite-product-catalog-alphabet-link,devsite-product-catalog .devsite-product-catalog-alphabet-link-disabled {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 auto;
    -moz-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 10px 0
}

devsite-product-catalog .devsite-product-catalog-alphabet-letter:not(:last-child) {
    border-bottom: var(--devsite-primary-border)
}

devsite-product-catalog .devsite-product-catalog-alphabet-letter-heading {
    margin: 20px 0
}

devsite-product-catalog .devsite-product-catalog-alphabet-letter-list {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    column-gap: 40px;
    list-style: none;
    margin: 0 0 40px;
    padding: 0
}

devsite-product-catalog .devsite-product-catalog-alphabet-letter-list-item {
    -webkit-column-break-inside: avoid;
    break-inside: avoid;
    margin: 0 0 16px
}

devsite-product-catalog .devsite-product-catalog-alphabet-letter-link {
    display: block;
    padding: 8px 0
}

devsite-product-catalog .devsite-product-catalog-item-name {
    margin: 0
}

devsite-product-catalog devsite-filter:not(:first-of-type) {
    border-top: var(--devsite-primary-border)
}

devsite-product-catalog .devsite-filter-input+.devsite-product-catalog-alphabet {
    margin-top: 32px
}

devsite-product-catalog .devsite-filter-input:valid+.devsite-product-catalog-alphabet {
    display: none
}

@media screen and (max-width: 840px) {
    devsite-product-catalog .devsite-product-catalog-alphabet {
        -webkit-flex-wrap:wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -moz-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }

    devsite-product-catalog .devsite-product-catalog-alphabet-letter-list {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2
    }

    devsite-product-catalog .devsite-product-catalog-alphabet-link,devsite-product-catalog .devsite-product-catalog-alphabet-link-disabled {
        display: block;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 44px;
        -moz-box-flex: 0;
        -ms-flex: 0 0 44px;
        flex: 0 0 44px;
        text-align: center
    }
}

@media screen and (max-width: 600px) {
    devsite-product-catalog .devsite-product-catalog-alphabet {
        padding:0 0 20px
    }

    devsite-product-catalog .devsite-product-catalog-alphabet-letter-list {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1
    }
}

devsite-profile-subscription-status .devsite-profile-subscriptions-subscribed {
    border-radius: 8px;
    background: #e8eaed;
    padding: 20px;
    margin-block:16px}

devsite-profile-subscription-status .devsite-profile-subscriptions-state {
    border-radius: 4px;
    margin-right: 10px;
    font-family: Roboto;
    font-size: 11px;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .8px;
    line-height: 16px;
    padding: 4px 8px;
    text-transform: uppercase;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

devsite-profile-subscription-status .devsite-profile-subscriptions-expired {
    background: #dadce0;
    color: #3c4043
}

devsite-profile-subscription-status .devsite-profile-subscriptions-active {
    background: #1e8e3e;
    color: #fff
}

devsite-profile-subscription-status .devsite-profile-subscriptions-fix-required {
    background: #e8710a;
    color: #fff
}

devsite-profile-subscription-status .devsite-profile-subscriptions-account-on-hold {
    background: #d93025;
    color: #fff
}

devsite-profile-subscription-status .devsite-profile-subscriptions-date {
    font-family: Roboto;
    font-size: 14px;
    font-style: normal;
    letter-spacing: .8px;
    line-height: 16px
}

devsite-profile-subscription-status .devsite-profile-upgrade-button-container {
    margin-bottom: 16px
}

devsite-program-benefits {
    display: block
}

devsite-progress {
    pointer-events: none;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transition: -webkit-transform .2s ease;
    transition: -webkit-transform .2s ease;
    transition: transform .2s ease;
    transition: transform .2s ease,-webkit-transform .2s ease
}

devsite-progress[type=indeterminate] {
    height: 2px;
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    contain: size layout style paint
}

devsite-progress .devsite-progress--indeterminate {
    position: relative;
    height: 2px
}

devsite-progress .devsite-progress--indeterminate-1,devsite-progress .devsite-progress--indeterminate-2,devsite-progress .devsite-progress--indeterminate-3,devsite-progress .devsite-progress--indeterminate-4 {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0)
}

devsite-progress .devsite-progress--indeterminate-1 {
    -webkit-animation: progress-indeterminate-1 2.5s linear infinite;
    animation: progress-indeterminate-1 2.5s linear infinite;
    background: var(--devsite-progress-background-1,var(--devsite-background-1));
    z-index: 1
}

devsite-progress .devsite-progress--indeterminate-2 {
    -webkit-animation: progress-indeterminate-2 2.5s ease-in infinite;
    animation: progress-indeterminate-2 2.5s ease-in infinite;
    background: var(--devsite-progress-background-2,var(--devsite-background-1));
    z-index: 2
}

devsite-progress .devsite-progress--indeterminate-3 {
    -webkit-animation: progress-indeterminate-3 2.5s ease-out infinite;
    animation: progress-indeterminate-3 2.5s ease-out infinite;
    background: var(--devsite-progress-background-3,var(--devsite-background-1));
    z-index: 3
}

devsite-progress .devsite-progress--indeterminate-4 {
    -webkit-animation: progress-indeterminate-4 2.5s ease-out infinite;
    animation: progress-indeterminate-4 2.5s ease-out infinite;
    background: var(--devsite-progress-background-4,var(--devsite-background-1));
    z-index: 4
}

devsite-progress .devsite-progress--indeterminate-1,devsite-progress .devsite-progress--indeterminate-2,devsite-progress .devsite-progress--indeterminate-3,devsite-progress .devsite-progress--indeterminate-4 {
    -webkit-animation-play-state: var(--devsite-progress-animation-play-state);
    animation-play-state: var(--devsite-progress-animation-play-state)
}

@-webkit-keyframes progress-indeterminate-1 {
    0% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0)
    }

    50%,to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes progress-indeterminate-1 {
    0% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0)
    }

    50%,to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@-webkit-keyframes progress-indeterminate-2 {
    0%,20% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0)
    }

    70%,to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes progress-indeterminate-2 {
    0%,20% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0)
    }

    70%,to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@-webkit-keyframes progress-indeterminate-3 {
    0%,60% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0)
    }

    90%,to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes progress-indeterminate-3 {
    0%,60% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0)
    }

    90%,to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@-webkit-keyframes progress-indeterminate-4 {
    0%,75% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes progress-indeterminate-4 {
    0%,75% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

devsite-quiz {
    display: block;
    font-size: 14px
}

devsite-quiz input[type=checkbox],devsite-quiz input[type=radio] {
    margin-top: 0;
    position: relative;
    top: 3px
}

devsite-quiz devsite-bookmark input.bookmark-checkbox {
    top: 0
}

devsite-quiz input+label {
    font-size: 14px;
    vertical-align: middle
}

devsite-quiz devsite-select .devsite-select-toggle {
    min-width: 200px
}

devsite-quiz [answered] .variant-success:checked {
    color: var(--devsite-quiz-correct-color)
}

devsite-quiz [answered] .variant-success:checked:focus:before {
    background: var(--devsite-quiz-correct-background)
}

devsite-quiz [answered] input[type=text].variant-success {
    background-color: var(--devsite-quiz-correct-background);
    border-color: var(--devsite-quiz-correct-border-color)
}

devsite-quiz [answered] input[type=text]:focus.variant-success {
    border-bottom-color: var(--devsite-quiz-correct-border-color-focus)
}

devsite-quiz [answered] .variant-error:checked {
    color: var(--devsite-quiz-error-color)
}

devsite-quiz [answered] .variant-error:checked:focus:before {
    background: var(--devsite-quiz-error-background)
}

devsite-quiz [answered] input[type=text].variant-error {
    background-color: var(--devsite-quiz-error-background);
    border-color: var(--devsite-quiz-error-border-color)
}

devsite-quiz [answered] input[type=text]:focus.variant-error {
    border-bottom-color: var(--devsite-quiz-error-color)
}

devsite-quiz .devsite-quiz-header {
    background: var(--devsite-background-2);
    border-bottom: var(--devsite-primary-border)
}

devsite-quiz .devsite-quiz-header-content {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0 auto;
    padding: 48px 16px
}

devsite-quiz .devsite-quiz-title {
    margin-bottom: 8px;
    padding: 0;
    top: 0
}

devsite-quiz .devsite-quiz-tagline {
    color: var(--devsite-quiz-secondary-text-color);
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    margin: 0
}

devsite-quiz .devsite-quiz-tagline:empty {
    min-height: 40px
}

devsite-quiz .devsite-quiz-return-button {
    margin-top: 15px
}

devsite-quiz .devsite-quiz-badge {
    display: none
}

devsite-quiz .devsite-quiz-body {
    margin: 0 auto;
    padding: 48px 16px 0
}

devsite-quiz [answered] .devsite-quiz-feedback {
    margin-bottom: 18px;
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: opacity .2s cubic-bezier(0,0,.2,1),-webkit-transform .2s cubic-bezier(0,0,.2,1);
    transition: opacity .2s cubic-bezier(0,0,.2,1),-webkit-transform .2s cubic-bezier(0,0,.2,1);
    transition: opacity .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);
    transition: opacity .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1),-webkit-transform .2s cubic-bezier(0,0,.2,1)
}

devsite-quiz .devsite-quiz-submit-error {
    background: var(--devsite-quiz-error-background);
    border-radius: 4px;
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    padding: 6px 12px
}

devsite-quiz .devsite-quiz-submit-error i {
    color: var(--devsite-quiz-error-color);
    line-height: 30px;
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px}

devsite-quiz .devsite-quiz-submit-button {
    margin-top: 64px
}

devsite-quiz .devsite-quiz-submit-button devsite-spinner {
    display: inline-block;
    -webkit-margin-start: 15px;
    -moz-margin-start: 15px;
    margin-inline-start:15px;top: 5px
}

devsite-quiz .devsite-quiz-question-list {
    font: 400 18px/30px var(--devsite-headline-font-family);
    font-weight: 500;
    list-style-position: inside;
    -webkit-padding-start: 0;
    -moz-padding-start: 0;
    padding-inline-start:0}

devsite-quiz .devsite-quiz-question {
    margin: 0 0 64px
}

devsite-quiz .devsite-quiz-question:last-child {
    margin-bottom: 0
}

devsite-quiz .devsite-quiz-question-header {
    font: 400 18px/30px var(--devsite-headline-font-family);
    font-weight: 500;
    margin: 0
}

devsite-quiz h2.devsite-quiz-question-header {
    display: inline
}

devsite-quiz .devsite-quiz-question-sub-header {
    color: var(--devsite-quiz-secondary-text-color);
    font-size: 12px;
    font-style: italic;
    line-height: 16px;
    margin: 0
}

devsite-quiz .devsite-quiz-answer {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 16px 0;
    position: relative
}

devsite-quiz .devsite-quiz-answer label {
    font-family: var(--devsite-primary-font-family);
    font-weight: 400;
    line-height: 24px;
    -webkit-margin-end: 15px;
    -moz-margin-end: 15px;
    margin-inline-end:15px}

devsite-quiz .devsite-quiz-answer .devsite-landing-row-item-media {
    -webkit-margin-end: 15px;
    -moz-margin-end: 15px;
    margin-inline-end:15px;min-width: auto
}

devsite-quiz .devsite-quiz-match-question {
    border-top: var(--devsite-primary-border);
    margin: 24px 0 0
}

devsite-quiz .devsite-quiz-match-question-row {
    border-bottom: var(--devsite-primary-border);
    display: block
}

devsite-quiz .devsite-quiz-feedback,devsite-quiz .devsite-quiz-match-question-row-element {
    margin: 24px 0
}

devsite-quiz .devsite-quiz-problem-item {
    font-size: 14px;
    line-height: 20px;
    margin: 0
}

devsite-quiz .devsite-quiz-fill-in-the-blank-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 14px;
    margin: 8px 0 0
}

devsite-quiz .devsite-quiz-fill-in-the-blank-question {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: block;
    line-height: 32px;
    margin-bottom: 0
}

devsite-quiz .devsite-quiz-fill-in-the-blank-question+.devsite-quiz-feedback {
    margin-top: 8px
}

devsite-quiz .devsite-quiz-text-input {
    font-family: var(--devsite-primary-font-family);
    font-size: 14px;
    font-weight: 400;
    -webkit-margin-start: 0;
    -moz-margin-start: 0;
    margin-inline-start:0;padding: 3px 7px
}

devsite-quiz .devsite-quiz-text-input::-webkit-input-placeholder {
    font-size: 14px;
    font-style: italic;
    line-height: 20px
}

devsite-quiz .devsite-quiz-text-input::-moz-placeholder {
    font-size: 14px;
    font-style: italic;
    line-height: 20px
}

devsite-quiz .devsite-quiz-text-input:-ms-input-placeholder {
    font-size: 14px;
    font-style: italic;
    line-height: 20px
}

devsite-quiz .devsite-quiz-text-input::-ms-input-placeholder {
    font-size: 14px;
    font-style: italic;
    line-height: 20px
}

devsite-quiz .devsite-quiz-text-input::placeholder {
    font-size: 14px;
    font-style: italic;
    line-height: 20px
}

devsite-quiz .devsite-quiz-footer {
    background: transparent;
    min-height: 48px;
    -webkit-transition: background .2s cubic-bezier(.4,0,1,1);
    transition: background .2s cubic-bezier(.4,0,1,1);
    margin: 64px 0 -68px
}

devsite-quiz devsite-badge-awarded {
    max-width: 720px;
    display: block;
    margin: 0 auto
}

devsite-quiz [show] {
    background: var(--devsite-background-2);
    -webkit-transition: background .2s cubic-bezier(0,0,.2,1);
    transition: background .2s cubic-bezier(0,0,.2,1)
}

devsite-quiz [show] .devsite-quiz-footer-content {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: opacity .2s cubic-bezier(0,0,.2,1),-webkit-transform .2s cubic-bezier(0,0,.2,1);
    transition: opacity .2s cubic-bezier(0,0,.2,1),-webkit-transform .2s cubic-bezier(0,0,.2,1);
    transition: opacity .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);
    transition: opacity .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1),-webkit-transform .2s cubic-bezier(0,0,.2,1)
}

devsite-quiz .devsite-quiz-footer-content {
    opacity: 0;
    padding: 48px 16px;
    -webkit-transform: translateY(24px);
    transform: translateY(24px);
    -webkit-transition: opacity .2s cubic-bezier(.4,0,1,1),-webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: opacity .2s cubic-bezier(.4,0,1,1),-webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: opacity .2s cubic-bezier(.4,0,1,1),transform .2s cubic-bezier(.4,0,1,1);
    transition: opacity .2s cubic-bezier(.4,0,1,1),transform .2s cubic-bezier(.4,0,1,1),-webkit-transform .2s cubic-bezier(.4,0,1,1)
}

devsite-quiz .static-badge-awarded-container {
    min-height: 68px;
    background: var(--devsite-background-2)
}

devsite-quiz .static-badge-awarded-container .devsite-badger-award-inner:first-child {
    padding-top: 30px
}

devsite-quiz .static-badge-awarded-container .devsite-badger-award-inner:last-child {
    padding-bottom: 30px
}

devsite-quiz .devsite-quiz-results-container {
    width: 100%
}

devsite-quiz .devsite-quiz-footer-header {
    font: 400 32px/40px var(--devsite-headline-font-family)
}

devsite-quiz .devsite-quiz-score {
    font-weight: 500
}

devsite-quiz .devsite-quiz-score-copy {
    font: 400 24px/32px var(--devsite-headline-font-family);
    margin-bottom: 8px
}

devsite-quiz .devsite-quiz-score-success {
    font-size: 20px;
    margin-bottom: 20px
}

devsite-quiz .devsite-quiz-score-fail .devsite-quiz-score {
    color: var(--devsite-quiz-error-color)
}

devsite-quiz .devsite-quiz-score-success .devsite-quiz-score {
    color: var(--devsite-quiz-correct-color)
}

devsite-quiz .devsite-quiz-score-subtext {
    color: var(--devsite-quiz-secondary-text-color);
    margin-top: 8px
}

devsite-quiz .devsite-quiz-action-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-quiz .devsite-quiz-rating {
    border-top: var(--devsite-primary-border);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 32px 0
}

devsite-quiz .devsite-quiz-feedback {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-primary-text-color);
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin: 0;
    opacity: 0;
    position: relative;
    -webkit-transform: translateX(-24px);
    transform: translateX(-24px);
    -webkit-transition: opacity .2s cubic-bezier(.4,0,1,1),-webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: opacity .2s cubic-bezier(.4,0,1,1),-webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: opacity .2s cubic-bezier(.4,0,1,1),transform .2s cubic-bezier(.4,0,1,1);
    transition: opacity .2s cubic-bezier(.4,0,1,1),transform .2s cubic-bezier(.4,0,1,1),-webkit-transform .2s cubic-bezier(.4,0,1,1)
}

devsite-quiz .devsite-quiz-feedback-container {
    border-radius: 4px;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin: -9px 0;
    padding: 4px 12px
}

devsite-quiz .devsite-quiz-feedback-icon {
    line-height: inherit;
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px}

devsite-quiz .correct {
    background: var(--devsite-quiz-correct-background)
}

devsite-quiz .correct .devsite-quiz-feedback-icon {
    color: var(--devsite-quiz-correct-color)
}

devsite-quiz .partially-correct {
    background: var(--devsite-quiz-partially-correct-background);
    margin: 15px 0 0
}

devsite-quiz .partially-correct .devsite-quiz-feedback-icon {
    color: var(--devsite-quiz-partially-correct-color)
}

devsite-quiz .incorrect {
    background: var(--devsite-quiz-error-background)
}

devsite-quiz .incorrect .devsite-quiz-feedback-icon {
    color: var(--devsite-quiz-error-color)
}

devsite-quiz .devsite-quiz-feedback-text {
    font-family: var(--devsite-headline-font-family);
    font-size: 14px;
    line-height: 20px;
    margin: 5px 0
}

devsite-quiz .devsite-quiz-feedback-title {
    font-family: var(--devsite-headline-font-family);
    font-size: 16px;
    font-weight: 500
}

devsite-quiz .devsite-quiz-feedback-message {
    font-family: var(--devsite-primary-font-family)
}

@media screen and (max-width: 600px) {
    devsite-quiz .devsite-quiz-question {
        margin-bottom:36px
    }

    devsite-quiz .devsite-quiz-match-question-row-element {
        margin: 12px 0
    }

    devsite-quiz .devsite-quiz-feedback {
        margin: 0 0 12px;
        top: 0
    }
}

@media screen and (min-width: 601px) {
    devsite-quiz .devsite-quiz-body,devsite-quiz .devsite-quiz-footer-content,devsite-quiz .devsite-quiz-header-content {
        -webkit-padding-start:24px;
        -moz-padding-start: 24px;
        padding-inline-start:24px;-webkit-padding-end: 24px;
        -moz-padding-end: 24px;
        padding-inline-end:24px}

    devsite-quiz .devsite-quiz-badge {
        display: block;
        height: 122px;
        min-width: 122px;
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1);
        width: 122px
    }

    devsite-quiz .devsite-quiz-badge.show {
        -webkit-animation: badgeGrowIn .33s cubic-bezier(.75,0,.71,.97),badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) .33s,badgeFadeIn .5s linear;
        animation: badgeGrowIn .33s cubic-bezier(.75,0,.71,.97),badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) .33s,badgeFadeIn .5s linear;
        -webkit-margin-start: 48px;
        -moz-margin-start: 48px;
        margin-inline-start:48px;opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    devsite-quiz .devsite-quiz-badge img {
        height: 120px;
        width: 120px
    }

    devsite-quiz .devsite-quiz-match-question {
        border: 0;
        display: table;
        max-width: 600px;
        width: 100%
    }

    devsite-quiz .devsite-quiz-match-question-row {
        border: 0;
        display: table-row
    }

    devsite-quiz .devsite-quiz-match-question-row-element,devsite-quiz .devsite-quiz-match-question-row>.devsite-quiz-feedback {
        display: table-cell;
        margin: 0;
        padding: 24px;
        position: relative;
        top: 0;
        vertical-align: middle
    }

    devsite-quiz .devsite-quiz-match-question-row-element {
        border-top: var(--devsite-primary-border)
    }

    devsite-quiz .devsite-quiz-match-question-row:last-child>.devsite-quiz-match-question-row-element {
        border-bottom: var(--devsite-primary-border)
    }

    devsite-quiz .devsite-quiz-problem {
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-padding-start: 0;
        -moz-padding-start: 0;
        padding-inline-start:0;width: 100%
    }

    devsite-quiz .devsite-quiz-answer {
        -webkit-padding-end: 0;
        -moz-padding-end: 0;
        padding-inline-end:0}

    devsite-quiz .devsite-quiz-feedback-container {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex
    }
}

@media screen and (min-width: 841px) {
    devsite-quiz .devsite-quiz-body,devsite-quiz .devsite-quiz-footer-content,devsite-quiz .devsite-quiz-header-content {
        max-width:768px
    }

    devsite-quiz .devsite-quiz-header-text {
        max-width: 488px
    }

    devsite-quiz .devsite-quiz-footer {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    devsite-quiz .devsite-quiz-footer-content {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%
    }

    devsite-quiz .devsite-quiz-footer-content+.devsite-quiz-footer-content {
        margin-top: 0
    }

    devsite-quiz .devsite-quiz-footer-content:nth-last-child(2),devsite-quiz .devsite-quiz-footer-content:nth-last-child(2)+.devsite-quiz-footer-content {
        max-width: 384px
    }

    devsite-quiz .devsite-quiz-footer-content:nth-last-child(2) {
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -moz-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end
    }
}

devsite-recommendations {
    border-top: var(--devsite-primary-border);
    display: block;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 40px -40px -40px;
    padding: 20px 40px 40px
}

body[layout=full] devsite-recommendations {
    padding: 12px 0
}

body[layout=docs][template=landing] devsite-recommendations {
    margin: 0;
    padding: 12px 40px
}

devsite-recommendations .significatio-overview {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: relative
}

body[layout=full] devsite-recommendations .significatio-overview {
    margin: 0 auto
}

body[layout=full] devsite-recommendations .significatio-body,body[layout=full] devsite-recommendations .significatio-overview {
    max-width: 1488px;
    padding: 0 24px
}

devsite-recommendations .significatio-heading {
    font: var(--devsite-h2-font);
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    padding-right: 4px
}

devsite-recommendations .significatio-body {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 12px 0 0;
    width: 100%
}

body[layout=full] devsite-recommendations .significatio-body {
    margin: 16px auto 0
}

devsite-recommendations .significatio-heading-icon {
    fill: currentColor;
    margin-inline:0 4px;width: 24px
}

devsite-recommendations .significatio-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
}

devsite-recommendations .significatio-buttons button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 20px;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0;
    -webkit-transition: background .2s;
    transition: background .2s;
    width: 40px
}

devsite-recommendations .significatio-buttons button:focus,devsite-recommendations .significatio-buttons button:hover {
    background-color: #aecbfa
}

devsite-recommendations .significatio-buttons .material-icons {
    top: auto
}

devsite-recommendations .significatio-buttons .material-icons:not(:link) {
    pointer-events: none
}

devsite-recommendations .significatio-loading {
    display: none
}

devsite-recommendations[loading] .significatio-loading {
    display: block;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

devsite-recommendations .significatio-loading devsite-spinner {
    margin: 0 auto
}

devsite-recommendations .significatio-recommendations {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 24px
}

devsite-recommendations:not([loading]) .significatio-recommendations {
    width: 100%
}

devsite-recommendations .significatio-card {
    background: var(--devsite-card-background);
    border: var(--devsite-card-border);
    border-radius: var(--devsite-card-border-radius);
    box-shadow: var(--devsite-card-box-shadow);
    color: var(--devsite-primary-text-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1;
    -moz-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-width: calc(33.3333333333% - 16px);
    min-width: 0;
    opacity: 0;
    padding: 18px 20px 20px;
    -webkit-transition: opacity .2s cubic-bezier(.4,0,1,1);
    transition: opacity .2s cubic-bezier(.4,0,1,1)
}

devsite-recommendations .significatio-card:hover {
    box-shadow: var(--devsite-card-box-shadow-hover,0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color))
}

devsite-recommendations .significatio-card.error {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-recommendations .significatio-card[show] {
    opacity: 1
}

devsite-recommendations .significatio-card-heading {
    font: 500 16px/24px var(--devsite-primary-font-family);
    margin: 0 0 8px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--devsite-link-color)
}

devsite-recommendations .significatio-card-description {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    font-size: 14px;
    -webkit-line-clamp: 2;
    margin: 0 0 20px;
    max-height: 48px;
    overflow: hidden
}

devsite-recommendations .significatio-card.error .significatio-card-description {
    color: #80868b;
    font: 400 12px/16px var(--devsite-primary-font-family);
    letter-spacing: 0;
    -webkit-line-clamp: 3;
    margin: 12px 0;
    text-align: center
}

devsite-recommendations .significatio-card.error .significatio-card-description+.significatio-card-description {
    margin-top: 0
}

devsite-recommendations .significatio-card-meta {
    font: 400 14px/16px var(--devsite-primary-font-family);
    color: var(--devsite-secondary-text-color);
    margin: auto 0 0
}

devsite-recommendations .info-container,devsite-recommendations .significatio-popout-container,devsite-recommendations .significatio-recommend-popout-container {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    position: relative
}

devsite-recommendations .info-button,devsite-recommendations .significatio-popout-toggle {
    color: #5f6368
}

devsite-recommendations .significatio-attr-toggle {
    height: 16px;
    color: #80868b;
    padding: 0 5px;
    min-width: 0;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: visible
}

devsite-recommendations .significatio-attr-toggle .significatio-attr-info {
    height: 16px;
    width: 16px;
    fill: #80868b;
    position: relative;
    top: -2px;
    margin: 0
}

devsite-recommendations .significatio-attr h4 {
    font: 500 14px/16px var(--devsite-primary-font-family);
    color: #3c4043;
    line-height: 20px
}

devsite-recommendations .significatio-attr p {
    font: 400 14px/16px var(--devsite-primary-font-family);
    color: #3c4043;
    line-height: 20px
}

devsite-recommendations .significatio-info-container {
    border-radius: 50%;
    height: 36px;
    -webkit-transition: opacity .2s,-webkit-transform .2s;
    transition: opacity .2s,-webkit-transform .2s;
    transition: opacity .2s,transform .2s;
    transition: opacity .2s,transform .2s,-webkit-transform .2s
}

devsite-recommendations .significatio-info-container:hover {
    background-color: var(--devsite-background-4)
}

devsite-recommendations .significatio-error-icon,devsite-recommendations .significatio-icon-info {
    fill: currentColor;
    vertical-align: text-bottom;
    width: 18px;
    height: 36px
}

devsite-recommendations .significatio-popout {
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color);
    background: var(--devsite-background-1);
    max-width: 400px;
    opacity: 0;
    padding: 20px 24px;
    position: absolute;
    top: calc(100% + 8px);
    -webkit-transform: translateY(-12px);
    transform: translateY(-12px);
    -webkit-transition: opacity .2s,-webkit-transform .2s;
    transition: opacity .2s,-webkit-transform .2s;
    transition: opacity .2s,transform .2s;
    transition: opacity .2s,transform .2s,-webkit-transform .2s
}

[dir=ltr] devsite-recommendations .significatio-popout {
    left: -12px
}

[dir=rtl] devsite-recommendations .significatio-popout {
    right: -12px
}

devsite-recommendations .significatio-popout.significatio-attr {
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color);
    border-radius: 4px;
    padding: 16px 17px;
    width: 150px
}

[dir=ltr] devsite-recommendations .significatio-popout.significatio-attr {
    left: calc(-75px + 50%)
}

[dir=rtl] devsite-recommendations .significatio-popout.significatio-attr {
    right: calc(-75px + 50%)
}

devsite-recommendations .significatio-popout.significatio-attr h4 {
    margin-bottom: 8px
}

devsite-recommendations .significatio-popout.significatio-attr p {
    margin-bottom: 0
}

devsite-recommendations .significatio-popout-heading {
    margin-top: 0
}

[dir=ltr] body[layout=full] devsite-recommendations .significatio-popout {
    right: 32px
}

[dir=rtl] body[layout=full] devsite-recommendations .significatio-popout {
    left: 32px
}

devsite-recommendations .significatio-popout[active] {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

devsite-recommendations .significatio-popout p {
    margin-top: 0
}

devsite-recommendations .significatio-interaction-container {
    height: 36px
}

devsite-recommendations .significatio-internal-only {
    line-height: 12px;
    size: 12px;
    margin: 14px 0;
    color: #a50e0e
}

@media screen and (max-width: 1253px) {
    body[layout] devsite-recommendations .significatio-recommendations {
        display:block
    }

    body[layout] devsite-recommendations .significatio-card {
        max-width: none
    }

    [dir] body[layout] devsite-recommendations .significatio-card:not(:first-child) {
        margin: 24px 0 0
    }
}

@media screen and (max-width: 840px) {
    body[layout][template] devsite-recommendations {
        margin:24px -24px -24px;
        padding: 24px
    }

    body[layout=full] devsite-recommendations .significatio-body,body[layout=full] devsite-recommendations .significatio-overview {
        padding: 0
    }

    [dir=ltr] body[layout=full] devsite-recommendations .significatio-popout {
        right: -8px
    }

    [dir=rtl] body[layout=full] devsite-recommendations .significatio-popout {
        left: -8px
    }
}

@media screen and (max-width: 600px) {
    body[layout][template] devsite-recommendations {
        margin:32px -16px -16px;
        padding: 16px
    }

    [dir] body[layout] devsite-recommendations .significatio-card:not(:first-child) {
        margin: 16px 0 0
    }
}

devsite-recommendations-dropdown {
    display: block;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.devsite-recommendations-dropdown-toggle {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.devsite-recommendations-dropdown-icon {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    pointer-events: none;
    top: 0
}

[dir=ltr] .devsite-recommendations-dropdown-icon {
    right: 8px
}

[dir=rtl] .devsite-recommendations-dropdown-icon {
    left: 8px
}

.devsite-recommendations-dropdown-icon:before {
    font-size: 18px;
    content: "keyboard_arrow_down"
}

.devsite-recommendations-dropdown-toggle.active>.devsite-recommendations-dropdown-icon:before {
    content: "keyboard_arrow_up"
}

.devsite-recommendations-dropdown-list {
    background: var(--devsite-background-1);
    border: var(--devsite-list-border,var(--devsite-secondary-border));
    border-radius: var(--devsite-list-border-radius,2px);
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color);
    display: none;
    font: 400 14px/20px var(--devsite-primary-font-family);
    opacity: 0;
    outline: 0;
    overflow-y: auto;
    pointer-events: none;
    position: absolute;
    -webkit-transition: opacity .2s,visibility .2s;
    transition: opacity .2s,visibility .2s;
    z-index: 1005;
    list-style-type: none;
    padding: 0 14px
}

.devsite-recommendations-dropdown-list.active {
    display: block;
    opacity: 1;
    pointer-events: auto
}

devsite-recommendations-dropdown .devsite-select-item {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0;
    min-height: 48px;
    min-width: 100%;
    white-space: nowrap;
    border-bottom: 1px solid #dadce0;
    padding: 14px 0
}

devsite-recommendations-dropdown .devsite-select-item:hover {
    background-color: var(--devsite-background-3);
    cursor: pointer
}

devsite-recommendations-dropdown .devsite-select-item>.significatio-card-heading {
    margin: 0
}

devsite-recommendations-sidebar {
    display: var(--devsite-js-recommendations-sidebar-display,block);
    position: relative
}

devsite-recommendations-sidebar .devsite-recommendations-sidebar-heading {
    font-weight: 700;
    margin-bottom: 8px;
    -webkit-margin-start: -8px;
    -moz-margin-start: -8px;
    margin-inline-start:-8px}

devsite-recommendations-sidebar .devsite-recommendations-sidebar-heading-link {
    color: var(--devsite-recommendations-accent);
    padding: 0
}

devsite-recommendations-sidebar .devsite-nav-text,devsite-recommendations-sidebar .devsite-recommendations-sidebar-icon {
    pointer-events: none
}

devsite-recommendations-sidebar .devsite-recommendations-sidebar-icon {
    fill: var(--devsite-recommendations-accent);
    height: 24px;
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px;width: 24px
}

devsite-recommendations-sidebar .devsite-nav-active .devsite-recommendations-sidebar-icon,devsite-recommendations-sidebar .devsite-recommendations-sidebar-heading-link:focus .devsite-recommendations-sidebar-icon,devsite-recommendations-sidebar .devsite-recommendations-sidebar-heading-link:hover .devsite-recommendations-sidebar-icon {
    fill: var(--devsite-nav-color-hover,var(--devsite-link-color))
}

devsite-recommendations-sidebar>.devsite-nav-list {
    -webkit-border-start: var(--devsite-toc-border-width,4px) solid var(--devsite-recommendations-accent);
    -moz-border-start: var(--devsite-toc-border-width,4px) solid var(--devsite-recommendations-accent);
    border-inline-start:var(--devsite-toc-border-width,4px) solid var(--devsite-recommendations-accent);-webkit-padding-start: var(--devsite-nav-list-padding-x-start,12px);
    -moz-padding-start: var(--devsite-nav-list-padding-x-start,12px);
    padding-inline-start:var(--devsite-nav-list-padding-x-start,12px)}

devsite-recommendations-sidebar .devsite-nav-item {
    padding: var(--devsite-nav-title-padding,4px 0)
}

devsite-recommendations-sidebar .devsite-nav-item:first-of-type,devsite-recommendations-sidebar .devsite-nav-title:first-of-type {
    padding-top: 0
}

devsite-recommendations-sidebar .devsite-nav-title {
    padding-bottom: 0;
    text-decoration: none
}

devsite-recommendations-sidebar .significatio-card-meta {
    color: var(--devsite-secondary-text-color);
    font-size: 11px;
    line-height: 14px;
    margin: 4px 0 0
}

devsite-recommended-content:not(:defined) {
    min-height: 354px
}

@keyframes pulse {
    0%,to {
        opacity: 1
    }

    50% {
        opacity: .5
    }
}

devsite-recommended-content .skeleton-filters,devsite-recommended-content .skeleton-list {
    -webkit-animation: fadeIn .5s;
    animation: fadeIn .5s;
    list-style: none;
    padding: 0
}

devsite-recommended-content .skeleton-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: var(--devsite-landing-row-item-gap,24px);
    -webkit-flex-wrap: var(--devsite-recommended-content-filters-flex-wrap);
    -ms-flex-wrap: var(--devsite-recommended-content-filters-flex-wrap);
    flex-wrap: var(--devsite-recommended-content-filters-flex-wrap);
    padding-bottom: 38px
}

devsite-recommended-content .skeleton-filters {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    -webkit-flex-wrap: var(--devsite-recommended-content-filters-flex-wrap);
    -ms-flex-wrap: var(--devsite-recommended-content-filters-flex-wrap);
    flex-wrap: var(--devsite-recommended-content-filters-flex-wrap);
    overflow: hidden;
    padding-bottom: 2px
}

devsite-recommended-content .skeleton-header {
    grid-area: header
}

devsite-recommended-content .skeleton-item {
    align-self: start;
    background: var(--tenant-background-1);
    border: var(--tenant-primary-border);
    border-radius: 8px;
    display: grid;
    grid: var(--skeleton-item-grid);
    margin: 0;
    padding: 16px
}

devsite-recommended-content .skeleton-filters .skeleton-item {
    gap: 8px 0;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

devsite-recommended-content .skeleton-list .skeleton-item {
    gap: 8px 0;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

devsite-recommended-content .skeleton-filters,devsite-recommended-content .skeleton-filters-header,devsite-recommended-content .skeleton-item-heading,devsite-recommended-content .skeleton-item-icon,devsite-recommended-content .skeleton-item-meta,devsite-recommended-content .skeleton-item-text {
    -webkit-animation: pulse 2s infinite;
    animation: pulse 2s infinite
}

devsite-recommended-content .skeleton-filters-header>div,devsite-recommended-content .skeleton-item-heading>div,devsite-recommended-content .skeleton-item-icon,devsite-recommended-content .skeleton-item-meta,devsite-recommended-content .skeleton-item-text>div {
    background: var(--tenant-background-3);
    border-radius: 4px
}

devsite-recommended-content .skeleton-filters-header {
    height: 40px;
    padding-top: 6px
}

devsite-recommended-content .skeleton-filters-header>div {
    border: var(--tenant-primary-border);
    background: var(--tenant-background-1);
    width: 20%;
    height: 24px
}

devsite-recommended-content .skeleton-item-heading>div {
    height: 26px
}

devsite-recommended-content .skeleton-item-heading>div:first-child {
    margin-block:4px 0;width: 95%
}

devsite-recommended-content .skeleton-item-heading>div:nth-child(2) {
    margin-block:8px 0;width: 55%
}

devsite-recommended-content .skeleton-item-meta,devsite-recommended-content .skeleton-item-text {
    margin-block:4px 0}

devsite-recommended-content .skeleton-item-meta {
    height: 14px;
    width: 45%
}

devsite-recommended-content .skeleton-item-text>div {
    height: 14px
}

devsite-recommended-content .skeleton-item-text>div:first-child {
    width: 100%
}

devsite-recommended-content .skeleton-item-text>div:nth-child(2) {
    margin-block:8px 0;width: 70%
}

devsite-recommended-content .skeleton-item-text>div:nth-child(3) {
    margin-block:8px 0;width: 60%
}

devsite-recommended-content .skeleton-item-icon {
    height: 32px;
    width: 32px
}

@media (max-width: 1128px) {
    devsite-recommended-content:not(:defined) {
        min-height:496px
    }

    devsite-recommended-content .skeleton-filters-header {
        height: 114px
    }

    devsite-recommended-content .skeleton-filters {
        padding-bottom: 6px
    }

    devsite-recommended-content .skeleton-list .skeleton-item:nth-child(4) {
        display: none
    }
}

@media (max-width: 820px) {
    devsite-recommended-content .skeleton-list .skeleton-item:nth-child(3) {
        display:none
    }
}

@media (max-width: 600px) {
    devsite-recommended-content:not(:defined) {
        min-height:334px
    }

    devsite-recommended-content .skeleton-list .skeleton-item:nth-child(2) {
        display: none
    }

    devsite-recommended-content .skeleton-list {
        padding-bottom: 18px
    }

    devsite-recommended-content .skeleton-list .skeleton-item {
        max-width: 85%
    }

    devsite-recommended-content .skeleton-filters {
        padding-bottom: 2px
    }

    devsite-recommended-content .skeleton-filters-header {
        height: 40px
    }
}

devsite-recommended-content .devsite-recommended-content-filters-spacer {
    min-height: 100px
}

devsite-recommended-content .devsite-recommended-content-profile-cta {
    min-height: 46px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 16px;
    -webkit-animation: fadeIn .5s;
    animation: fadeIn .5s;
    --devsite-background-button-background: transparent;
    --devsite-background-button-background-hover: transparent;
    --devsite-background-button-border-color-hover: var( --devsite-background-button-border-color )
}

devsite-recommended-content .devsite-recommended-content-profile-cta .devsite-recommended-content-profile-cta-badge {
    height: 46px;
    width: 190px;
    border-bottom: 1px solid #dadce0
}

devsite-recommended-content .devsite-recommended-content-profile-cta .button {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

devsite-recommended-content .devsite-recommended-content-profile-cta .text {
    color: #1a73e8;
    line-height: 1em
}

@media (max-width: 820px) {
    devsite-recommended-content .devsite-recommended-content-profile-cta .devsite-recommended-content-profile-cta-badge {
        display:none
    }
}

@media (max-width: 600px) {
    devsite-recommended-content .devsite-recommended-content-profile-cta {
        -webkit-box-orient:vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding-top: 18px;
        text-align: center
    }

    devsite-recommended-content .devsite-recommended-content-profile-cta .text {
        line-height: 20px
    }
}

devsite-recommended-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

devsite-recommended-content .devsite-recommended-content-header {
    -webkit-animation: fadeIn .5s;
    animation: fadeIn .5s;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media (max-width: 600px) {
    devsite-recommended-content .devsite-recommended-content-header {
        -webkit-box-orient:vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -moz-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }
}

devsite-recommended-content .devsite-recommended-content-heading {
    -webkit-animation: fadeIn .5s;
    animation: fadeIn .5s;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    line-height: 24px
}

devsite-recommended-content .devsite-recommended-content-heading-message,devsite-recommended-content .devsite-recommended-content-item-updated {
    color: var(--devsite-secondary-text-color);
    font-size: 14px
}

devsite-recommended-content .devsite-recommended-content-heading-label {
    font-size: 16px;
    line-height: 36px
}

devsite-recommended-content devsite-rich-tooltip {
    font: 14px/20px var(--devsite-primary-font-family)
}

devsite-recommended-content .devsite-recommended-content-heading-message {
    font-style: italic
}

devsite-recommended-content .devsite-recommended-content-toggle {
    display: var(--devsite-recommended-content-toggle-display)
}

devsite-recommended-content .devsite-recommended-content-filters-wrapper {
    position: relative
}

devsite-recommended-content devsite-feature-tooltip {
    top: 24px
}

devsite-recommended-content .devsite-recommended-content-filters {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    -webkit-flex-wrap: var(--devsite-recommended-content-filters-flex-wrap);
    -ms-flex-wrap: var(--devsite-recommended-content-filters-flex-wrap);
    flex-wrap: var(--devsite-recommended-content-filters-flex-wrap);
    grid-area: filters;
    margin-block:var(--devsite-recommended-content-filters-margin-block,-8px);margin-inline: var(--devsite-recommended-content-filters-margin-inline,0);
    overflow: var(--devsite-recommended-content-filters-overflow);
    padding-block:var(--devsite-recommended-content-filters-padding-block,8px);padding-inline: var(--devsite-recommended-content-filters-padding-inline,0);
    -webkit-transition: opacity .5s;
    transition: opacity .5s;
    width: var(--devsite-recommended-content-filters-width,100%)
}

devsite-recommended-content .devsite-recommended-content-filters::-webkit-scrollbar {
    background: 0;
    height: 0;
    width: 0
}

devsite-recommended-content .devsite-recommended-content-filters-item {
    position: relative
}

devsite-recommended-content .devsite-recommended-content-filters-item input[type=checkbox] {
    position: absolute;
    display: inline
}

devsite-recommended-content .devsite-recommended-content-filters-item input[type=checkbox]:after,devsite-recommended-content .devsite-recommended-content-filters-item input[type=checkbox]:before {
    display: none
}

devsite-recommended-content .devsite-recommended-content-filters-item label {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-background-1);
    border: var(--devsite-primary-border);
    border-radius: 8px;
    color: var(--devsite-primary-text-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font: var(--devsite-button-font,500 14px/36px var(--devsite-primary-font-family));
    height: 32px;
    padding: 0 16px;
    -webkit-transition: background .2s,border .2s,box-shadow .2s,color .2s;
    transition: background .2s,border .2s,box-shadow .2s,color .2s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap
}

devsite-recommended-content .devsite-recommended-content-filters-item label:hover {
    background: var(--devsite-background-2)
}

devsite-recommended-content .devsite-recommended-content-filters-item input:disabled+label:hover {
    background: var(--devsite-background-1)
}

devsite-recommended-content .devsite-recommended-content-filters-item input[type=checkbox]:focus+label {
    background: var(--devsite-background-3);
    border-color: var(--devsite-primary-text-color)
}

devsite-recommended-content .devsite-recommended-content-filters-item input[type=checkbox]:checked+label {
    background: var(--devsite-link-background-hover);
    border-color: transparent;
    color: var(--devsite-link-color)
}

[background=grey] devsite-recommended-content .devsite-recommended-content-filters-item input[type=checkbox]:checked+label {
    border-color: var(--devsite-link-color)
}

devsite-recommended-content .devsite-recommended-content-filters-item input[type=checkbox]:checked+label:hover {
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color)
}

devsite-recommended-content .devsite-recommended-content-filters-item input[type=checkbox]:checked:disabled+label:hover {
    box-shadow: revert
}

devsite-recommended-content .devsite-recommended-content-filters-item input[type=checkbox]:checked:focus+label {
    color: var(--devsite-contrast-link-color)
}

.devsite-recommended-content-filters-item input[type=checkbox]:disabled {
    pointer-events: none
}

devsite-recommended-content .devsite-recommended-content-list-header {
    grid-area: list-header
}

devsite-recommended-content .devsite-recommended-content-list {
    -webkit-animation: fadeIn .5s;
    animation: fadeIn .5s;
    display: grid;
    gap: var(--devsite-landing-row-item-gap,24px);
    grid: auto-flow/repeat(var(--devsite-columns,4),1fr);
    grid-area: content
}

devsite-recommended-content devsite-carousel .devsite-recommended-content-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-recommended-content .devsite-recommended-content-item {
    background: var(--devsite-card-background);
    border: var(--devsite-card-border);
    border-radius: var(--devsite-card-border-radius);
    box-shadow: var(--devsite-card-box-shadow);
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
    padding: 16px
}

devsite-recommended-content .devsite-recommended-content-item:nth-child(n+5) {
    display: var(--devsite-recommended-content-item-show-all-display)
}

devsite-recommended-content .devsite-recommended-content-item-doc-type {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 12px;
    font-weight: 500;
    gap: 4px;
    line-height: 16px;
    margin-bottom: 0;
    text-transform: uppercase
}

devsite-recommended-content .devsite-recommended-content-item-doc-type-icon:before {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    color: #5f6368;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px
}

devsite-recommended-content .devsite-recommended-content-item-doc-type-article:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-blog:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-case_study:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-concept:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-course:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-guide:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-marketing:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-pathway:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-quickstart:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-release_notes:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-support:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-topic:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-troubleshooting:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-tutorial:before {
    content: "article"
}

devsite-recommended-content .devsite-recommended-content-item-doc-type-best_practices:before {
    content: "check_circle"
}

devsite-recommended-content .devsite-recommended-content-item-doc-type-api_reference:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-reference:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-sample:before {
    content: "code"
}

devsite-recommended-content .devsite-recommended-content-item-doc-type-playlist:before {
    content: "format_list_numbered"
}

devsite-recommended-content .devsite-recommended-content-item-doc-type-pricing:before {
    content: "monetization_on"
}

devsite-recommended-content .devsite-recommended-content-item-doc-type-podcast:before {
    content: "podcasts"
}

devsite-recommended-content .devsite-recommended-content-item-doc-type-quiz:before {
    content: "quiz"
}

devsite-recommended-content .devsite-recommended-content-item-doc-type-codelab:before {
    content: "science"
}

devsite-recommended-content .devsite-recommended-content-item-doc-type-media:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-video:before {
    content: "smart_display"
}

devsite-recommended-content .devsite-recommended-content-item-doc-type-content_navigator:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-landing:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-landing_page:before,devsite-recommended-content .devsite-recommended-content-item-doc-type-product:before {
    content: "web"
}

devsite-recommended-content .devsite-recommended-content-item-heading {
    -webkit-box-orient: vertical;
    color: var(--devsite-link-color);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-height: 28px;
    min-height: 56px;
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -moz-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    overflow: hidden
}

devsite-recommended-content[truncate] .devsite-recommended-content-item-heading {
    display: initial;
    max-width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap
}

devsite-recommended-content .devsite-recommended-content-item-description,devsite-recommended-content .devsite-recommended-content-item-updated {
    margin: 0
}

devsite-recommended-content .devsite-recommended-content-item-description {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-height: 24px;
    min-height: 72px;
    -webkit-box-ordinal-group: 4;
    -webkit-order: 3;
    -moz-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    overflow: hidden;
    word-break: break-word
}

devsite-recommended-content .devsite-recommended-content-item-updated {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -moz-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

devsite-recommended-content .devsite-recommended-content-item-products {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-ordinal-group: 5;
    -webkit-order: 4;
    -moz-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4
}

devsite-recommended-content .devsite-recommended-content-item-icon {
    display: grid;
    margin-block:auto 0;-webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px;place-content: center;
    width: 32px
}

devsite-recommended-content .devsite-recommended-content-item-icon img,devsite-recommended-content .devsite-recommended-content-item-icon picture {
    height: 32px
}

devsite-recommended-content .devsite-recommended-content-item-icon .material-icons {
    color: var(--devsite-foreground-color,var(--devsite-secondary-text-color));
    font-size: 32px
}

devsite-recommended-content .devsite-recommended-content-item-product-tag {
    background: var(--devsite-background-3);
    color: var(--devsite-display-tag-color,var(--devsite-secondary-text-color));
    display: inline-block;
    font: var(--devsite-display-tag-font,500 14px/20px var(--devsite-primary-font-family));
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px;padding: 2px 4px
}

devsite-recommended-content devsite-rich-tooltip {
    --devsite-rich-tooltip-button-size: 24px;
    --devsite-rich-tooltip-button-hover-background: 0;
    --devsite-rich-tooltip-padding-block: 8px;
    --devsite-rich-tooltip-padding-inline: 16px;
    --devsite-rich-tooltip-width: auto;
    --devsite-rich-tooltip-min-width: 200px;
    height: var(--devsite-rich-tooltip-button-size);
    width: var(--devsite-rich-tooltip-button-size)
}

devsite-recommended-content devsite-rich-tooltip:defined {
    background: var(--devsite-background-3);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-recommended-content devsite-rich-tooltip button[label-type=icon]:is(:hover,:focus) {
    background: 0
}

devsite-recommended-content .devsite-recommended-content-cta {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    letter-spacing: .25px;
    --devsite-button-border: 0;
    --devsite-button-border-hover: 0;
    --devsite-button-disabled-border: 0;
    --devsite-background-button-background: transparent;
    --devsite-button-border-active: 0;
    --devsite-button-box-shadow-active: 0
}

devsite-recommended-content .devsite-recommended-content-cta .material-icons {
    top: auto;
    font-size: 20px
}

devsite-recommended-content .devsite-recommended-content-cta devsite-spinner {
    margin-right: 7px
}

devsite-recommended-content .ctable {
    display: none
}

devsite-recommended-content .devsite-table-wrapper {
    display: none
}

devsite-reference-results {
    background: var(--devsite-background-1);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color);
    max-height: 305px;
    padding: 20px 10px 20px 28px;
    margin: 16px 0
}

devsite-reference-results:empty {
    display: none
}

devsite-reference-results .devsite-reference-results {
    height: auto;
    width: 100%
}

devsite-reference-results .devsite-reference-results h3 {
    margin-top: 0
}

devsite-reference-results .devsite-reference-results-list {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    padding-left: 0
}

devsite-reference-results .devsite-reference-results-list-item {
    -webkit-column-break-inside: avoid;
    break-inside: avoid;
    margin: 0 0 0 -8px;
    outline: 0;
    overflow: hidden;
    padding: 10px 8px;
    text-decoration: none;
    text-overflow: ellipsis;
    -webkit-transition: background .2s;
    transition: background .2s;
    white-space: nowrap
}

devsite-reference-results .devsite-reference-results-list-item:focus,devsite-reference-results .devsite-reference-results-list-item:hover {
    background: var(--devsite-background-3)
}

devsite-reference-results .devsite-reference-results-list-link {
    color: var(--devsite-primary-text-color);
    font: 13px/20px var(--devsite-primary-font-family)
}

@media screen and (max-width: 600px) {
    devsite-reference-results {
        overflow-y:scroll
    }

    devsite-reference-results .devsite-reference-results-list {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding-bottom: 20px
    }

    devsite-reference-results .devsite-reference-results {
        width: auto
    }
}

devsite-related-entities {
    --devsite-chips-gap: 8px;
    --devsite-button-background-active: var(--devsite-background-2);
    --devsite-button-background-hover: rgba(var(--devsite-primary-text-color),0.1);
    --devsite-button-border-hover: var(--devsite-button-border,0);
    --devsite-button-color: var(--devsite-primary-text-color)
}

devsite-rich-tooltip {
    display: none;
    position: relative;
    z-index: 2
}

devsite-rich-tooltip:defined {
    background: 0;
    display: revert
}

devsite-rich-tooltip>[slot] {
    margin: 0!important;
    padding: 0!important
}

devsite-rich-tooltip ul {
    list-style: none
}

devsite-rich-tooltip li {
    margin-block:2px}

devsite-search {
    border-radius: var(--devsite-search-border-radius);
    display: inline-block;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    height: var(--devsite-search-height);
    margin: 6px 0 6px 24px;
    overflow: hidden;
    position: relative;
    text-align: left;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    vertical-align: top;
    width: 200px;
    will-change: transition;
    z-index: 10
}

[dir=rtl] devsite-search {
    margin: 6px 24px 6px 0;
    text-align: right
}

body[pending] devsite-search {
    visibility: hidden!important
}

devsite-search .devsite-search-image {
    color: var(--devsite-search-image-color,var(--devsite-secondary-text-color));
    position: absolute;
    top: var(--devsite-search-image-top);
    -webkit-transition: color .2s;
    transition: color .2s
}

[dir=ltr] devsite-search .devsite-search-image {
    left: var(--devsite-search-image-x)
}

[dir=rtl] devsite-search .devsite-search-image {
    right: var(--devsite-search-image-x)
}

devsite-search:not([enable-search-summaries]) .devsite-search-image:before {
    content: "search"
}

devsite-search:not([enable-search-summaries]) .devsite-search-ai-image {
    display: none
}

devsite-search .devsite-search-container {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-search .devsite-suggest-results-container {
    border-top: var(--devsite-primary-border)
}

devsite-search input.devsite-search-field {
    background: none;
    border: var(--devsite-search-field-border);
    border-radius: var(--devsite-search-field-border-radius);
    color: var(--devsite-secondary-text-color);
    height: var(--devsite-search-field-height);
    outline: 0;
    padding: 8px;
    -webkit-padding-start: var(--devsite-search-field-padding-x-start);
    -moz-padding-start: var(--devsite-search-field-padding-x-start);
    padding-inline-start:var(--devsite-search-field-padding-x-start);-webkit-transition: background .2s,color .2s;
    transition: background .2s,color .2s;
    width: 100%
}

devsite-search input.devsite-search-field::-webkit-input-placeholder {
    color: var(--devsite-search-field-placeholder-color,var(--devsite-secondary-text-color));
    font: var(--devsite-search-field-placeholder-font);
    -webkit-transition: color .2s;
    transition: color .2s
}

devsite-search input.devsite-search-field::-moz-placeholder {
    color: var(--devsite-search-field-placeholder-color,var(--devsite-secondary-text-color));
    font: var(--devsite-search-field-placeholder-font);
    -moz-transition: color .2s;
    transition: color .2s
}

devsite-search input.devsite-search-field:-ms-input-placeholder {
    color: var(--devsite-search-field-placeholder-color,var(--devsite-secondary-text-color));
    font: var(--devsite-search-field-placeholder-font);
    -ms-transition: color .2s;
    transition: color .2s
}

devsite-search input.devsite-search-field::-ms-input-placeholder {
    color: var(--devsite-search-field-placeholder-color,var(--devsite-secondary-text-color));
    font: var(--devsite-search-field-placeholder-font);
    -ms-transition: color .2s;
    transition: color .2s
}

devsite-search input.devsite-search-field::placeholder {
    color: var(--devsite-search-field-placeholder-color,var(--devsite-secondary-text-color));
    font: var(--devsite-search-field-placeholder-font);
    -webkit-transition: color .2s;
    transition: color .2s
}

devsite-search input.devsite-search-field:focus {
    border: var(--devsite-search-field-border);
    padding-bottom: 8px
}

devsite-search .devsite-searchbox {
    width: 100%
}

devsite-search .devsite-searchbox:before {
    background: var(--devsite-popout-background,var(--devsite-background-1));
    content: "";
    display: var(--devsite-searchbox-before-display,block);
    height: 500px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: -458px;
    -webkit-transition: opacity 1ms .2s;
    transition: opacity 1ms .2s;
    width: calc(100% + 12px);
    will-change: opacity;
    z-index: -1
}

[dir=ltr] devsite-search .devsite-searchbox:before {
    left: -6px
}

[dir=rtl] devsite-search .devsite-searchbox:before {
    right: -6px
}

devsite-search[search-active] {
    overflow: visible
}

devsite-search[search-active] .devsite-searchbox:before {
    opacity: 1
}

devsite-search[search-active] .devsite-searchbox:hover {
    background: var(--devsite-searchbox-background-active,var(--devsite-background-3))
}

.devsite-header-billboard-search devsite-search[search-active] .devsite-search-form,body[template="404"] devsite-search[search-active] .devsite-search-form,devsite-header[search-expanded] .devsite-search-form {
    border-radius: var(--devsite-search-border-radius,0);
    box-shadow: var(--devsite-search-active-box-shadow,none);
    overflow: var(--devsite-search-active-overflow,visible)
}

.devsite-header-billboard-search devsite-search[search-active] .devsite-popout,body[template="404"] devsite-search[search-active] .devsite-popout,devsite-header[search-expanded] devsite-search .devsite-popout {
    display: var(--devsite-popout-active-display,block)
}

.devsite-header-billboard-search devsite-search[search-active] .devsite-search-field,.devsite-header-billboard-search devsite-search[search-active] .devsite-search-field:hover,body[template="404"] devsite-search[search-active] .devsite-search-field,body[template="404"] devsite-search[search-active] .devsite-search-field:hover,devsite-header[search-expanded] devsite-search[search-active] .devsite-search-field,devsite-header[search-expanded] devsite-search[search-active] .devsite-search-field:hover {
    background: var(--devsite-search-form-background-active);
    color: var(--devsite-search-form-text-active,var(--devsite-primary-text-color))
}

devsite-search[search-active] .devsite-search-field {
    color: var(--devsite-primary-text-color)
}

devsite-search[search-active] .devsite-search-field::-webkit-input-placeholder {
    color: var(--devsite-secondary-text-color)
}

devsite-search[search-active] .devsite-search-field::-moz-placeholder {
    color: var(--devsite-secondary-text-color)
}

devsite-search[search-active] .devsite-search-field:-ms-input-placeholder {
    color: var(--devsite-secondary-text-color)
}

devsite-search[search-active] .devsite-search-field::-ms-input-placeholder {
    color: var(--devsite-secondary-text-color)
}

devsite-search[search-active] .devsite-search-field::placeholder {
    color: var(--devsite-secondary-text-color)
}

devsite-search[search-active] .devsite-search-image {
    color: var(--devsite-search-active-image-color,var(--devsite-secondary-text-color))
}

devsite-search .devsite-popout,devsite-search[search-active] .devsite-popout {
    display: var(--devsite-popout-display,block)
}

devsite-search .devsite-popout {
    margin-top: var(--devsite-popout-margin-top,6px);
    position: var(--devsite-popout-position,absolute);
    -webkit-transform: var(--devsite-popout-transform,translateY(-100vh));
    transform: var(--devsite-popout-transform,translateY(-100vh));
    -webkit-transition: var(--devsite-popout-transition,transform .2s);
    transition: var(--devsite-popout-transition,transform .2s);
    visibility: hidden;
    width: 100%;
    z-index: var(--devsite-popout-z-index,-2)
}

devsite-search[search-active] .devsite-popout {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition-delay: .2s;
    transition-delay: .2s;
    visibility: visible;
    will-change: transform
}

devsite-search .devsite-popout-result {
    background: var(--devsite-popout-background,var(--devsite-background-1));
    box-shadow: var(--devsite-popout-box-shadow,0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color));
    max-height: calc(100vh - 56px);
    overflow-y: auto
}

devsite-search .devsite-popout-result:empty,devsite-search[search-active][no-suggest] .devsite-popout {
    display: none
}

devsite-search .devsite-suggest-wrapper {
    padding: 16px 0 0;
    font-size: 14px
}

devsite-search .devsite-result-item,devsite-search .devsite-result-label {
    font: 13px/20px var(--devsite-primary-font-family);
    margin: 0
}

devsite-search .devsite-result-label {
    padding-left: 40px
}

[dir=rtl] devsite-search .devsite-result-label {
    padding-left: 0;
    padding-right: 40px
}

devsite-search .devsite-result-item a {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-primary-text-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
    outline: 0;
    padding: 8px;
    text-decoration: none;
    -webkit-transition: background .2s;
    transition: background .2s;
    will-change: transition
}

[dir=ltr] devsite-search .devsite-result-item a {
    padding-left: 40px
}

[dir=rtl] devsite-search .devsite-result-item a {
    padding-right: 40px
}

devsite-search .devsite-result-item a:focus,devsite-search .devsite-result-item a:hover,devsite-search .devsite-result-item.highlight a {
    background: var(--devsite-background-3)
}

devsite-search .devsite-label {
    margin: 0
}

devsite-search .devsite-result-item b {
    font-weight: 500
}

devsite-search .devsite-suggest-footer {
    border-top: var(--devsite-primary-border);
    margin: 8px 0 0;
    padding: 7px 0 8px 40px
}

[dir=rtl] devsite-search .devsite-suggest-footer {
    padding: 7px 40px 8px 0
}

devsite-search .devsite-suggest-footer>.button {
    display: inline-block;
    margin: 6px 0;
    max-width: calc(100% - 16px)
}

[dir=ltr] devsite-search .devsite-suggest-footer>.button {
    margin-right: 16px
}

[dir=rtl] devsite-search .devsite-suggest-footer>.button {
    margin-left: 16px
}

devsite-search .devsite-suggest-footer>.button-white {
    max-width: 100%
}

[dir=ltr] devsite-search .devsite-suggest-footer>.button-white {
    margin-left: -8px
}

[dir=rtl] devsite-search .devsite-suggest-footer>.button-white {
    margin-right: -8px
}

devsite-search .devsite-suggest-header {
    font: 500 11px/16px var(--devsite-primary-font-family);
    letter-spacing: .8px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
    margin: 12px 0;
    padding-left: 40px;
    text-transform: uppercase
}

[dir=rtl] devsite-search .devsite-suggest-header {
    padding-left: 0;
    padding-right: 40px
}

devsite-search hr+.devsite-suggest-sub-section>.devsite-suggest-header {
    margin-top: 24px
}

devsite-search .devsite-suggest-header .devsite-suggest-project:before {
    content: "|";
    content: "|"/"";
    margin: 0 8px 0 0
}

devsite-search hr {
    margin: 8px 0
}

devsite-search .devsite-suggestion-fragment+.devsite-suggestion-fragment:before {
    content: "|";
    content: "|"/"";
    margin: 0 8px 0 0
}

devsite-search .devsite-search-disabled {
    padding-bottom: 16px
}

devsite-header[search-expanded] .devsite-search-shortcut-icon-container {
    display: none
}

devsite-search .devsite-search-shortcut-icon-container {
    position: absolute;
    right: var(--devsite-search-image-x);
    top: var(--devsite-search-image-top)
}

devsite-search .devsite-search-shortcut-icon {
    background: var(--devsite-input-background);
    border-radius: 8px;
    color: var(--devsite-search-image-color,var(--devsite-secondary-text-color));
    font-family: var(--devsite-ref-typeface--brand-regular);
    font-size: 14px;
    font-weight: 500;
    position: absolute;
    right: 0;
    text-align: center;
    width: 24px
}

devsite-search[compact] {
    width: auto
}

devsite-search[compact] .devsite-search-field,devsite-search[compact] .devsite-searchbox {
    background-color: transparent
}

devsite-search[compact] input.devsite-search-field {
    width: 0
}

devsite-search[compact] .devsite-search-image {
    left: calc(50% - 12px);
    pointer-events: none
}

[dir=ltr] devsite-search[compact][search-active] .devsite-search-image {
    left: 8px;
    right: auto
}

[dir=rtl] devsite-search[compact][search-active] .devsite-search-image {
    right: 8px;
    left: auto
}

devsite-search[compact][search-active] input.devsite-search-field {
    width: 100%
}

@media screen and (max-width: 840px) {
    devsite-search input.devsite-search-field {
        padding-left:40px
    }

    [dir=rtl] devsite-search input.devsite-search-field {
        padding-left: 0;
        padding-right: 40px
    }

    .devsite-search-background,.devsite-search-background:after,[search-active] .devsite-search-background:after,devsite-search .devsite-search-field,devsite-search .devsite-search-field:hover {
        -webkit-transition: none;
        transition: none
    }

    devsite-search .devsite-search-image:before {
        content: "search"
    }

    devsite-search .devsite-search-ai-image {
        display: none
    }

    devsite-search .devsite-search-image {
        left: 8px
    }

    [dir=rtl] devsite-search .devsite-search-image {
        left: auto;
        right: 8px
    }

    devsite-header devsite-search {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        margin-left: 8px;
        overflow: visible
    }

    [dir=rtl] devsite-header devsite-search {
        margin-left: 0;
        margin-right: 8px
    }

    devsite-header devsite-search .devsite-search-form {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -moz-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1
    }

    devsite-header .devsite-top-logo-row devsite-search:not([search-active]) input.devsite-search-field {
        padding: 0
    }

    devsite-search .devsite-search-shortcut-icon-container {
        display: none
    }
}

@keyframes smart-gradient {
    0% {
        background-position: 100% 100%
    }

    to {
        background-position: top 37.5% left 37.5%
    }
}

@-webkit-keyframes text-loading {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }

    to {
        -webkit-transform: translateX(38%);
        transform: translateX(38%)
    }
}

@keyframes text-loading {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }

    to {
        -webkit-transform: translateX(38%);
        transform: translateX(38%)
    }
}

:root {
    --devsite-comp-search-summary--background: var(--devsite-ref-palette--ai-main)
}

:root .color-scheme--dark {
    --devsite-comp-search-summary--background: var(--devsite-ref-palette-non-endorsed--grey850)
}

devsite-search-summary {
    background-color: var(--devsite-comp-search-summary--background);
    border-radius: 12px;
    display: block;
    padding: 20px 24px 18px;
    opacity: 1
}

devsite-search-summary:not([rendered]) {
    opacity: 0;
    min-height: min(18vw,246px)
}

.devsite-search-summary-header {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 36px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.devsite-search-summary-header .devsite-search-summary-collapse-content-button,.devsite-search-summary-header .devsite-search-summary-expand-content-button {
    background: none;
    border-radius: 50%;
    border: 0;
    height: 32px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 32px;
    background-color: transparent;
    color: #5f6368
}

.color-scheme--dark .devsite-search-summary-header .devsite-search-summary-collapse-content-button,.color-scheme--dark .devsite-search-summary-header .devsite-search-summary-expand-content-button {
    background-color: transparent;
    color: #9aa0a6
}

.devsite-search-summary-header .devsite-search-summary-collapse-content-button:focus,.devsite-search-summary-header .devsite-search-summary-collapse-content-button:hover,.devsite-search-summary-header .devsite-search-summary-expand-content-button:focus,.devsite-search-summary-header .devsite-search-summary-expand-content-button:hover {
    background-color: #c6e5ef;
    color: #5f6368
}

.color-scheme--dark .devsite-search-summary-header .devsite-search-summary-collapse-content-button:focus,.color-scheme--dark .devsite-search-summary-header .devsite-search-summary-collapse-content-button:hover,.color-scheme--dark .devsite-search-summary-header .devsite-search-summary-expand-content-button:focus,.color-scheme--dark .devsite-search-summary-header .devsite-search-summary-expand-content-button:hover {
    background-color: #3c4043;
    color: #bdc1c6
}

.devsite-search-summary-header .devsite-search-summary-collapse-content-button:active,.devsite-search-summary-header .devsite-search-summary-expand-content-button:active {
    background-color: #bddce7;
    color: #5f6368
}

.color-scheme--dark .devsite-search-summary-header .devsite-search-summary-collapse-content-button:active,.color-scheme--dark .devsite-search-summary-header .devsite-search-summary-expand-content-button:active {
    background-color: #505356;
    color: #bdc1c6
}

.devsite-search-summary-chat-disclaimer {
    font-size: 14px;
    line-height: 22px;
    margin-block:16px 0;text-align: center
}

.devsite-search-summary-chat-disclaimer a {
    color: #202124;
    text-decoration: underline
}

.color-scheme--dark .devsite-search-summary-chat-disclaimer a {
    color: #f1f3f4
}

.devsite-search-summary-chat-disclaimer a:focus,.devsite-search-summary-chat-disclaimer a:hover {
    color: #185abc
}

.color-scheme--dark .devsite-search-summary-chat-disclaimer a:focus,.color-scheme--dark .devsite-search-summary-chat-disclaimer a:hover {
    color: #8ab4f8
}

.devsite-search-summary-generate-summary-header {
    margin: 0
}

.devsite-search-summary-generate-summary-button {
    -webkit-margin-start: 24px;
    -moz-margin-start: 24px;
    margin-inline-start:24px}

.devsite-search-summary-chat-body {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    -webkit-margin-before: 12px;
    margin-block-start:12px}

.color-scheme--dark .devsite-search-summary-chat-body {
    background: #2a2b2e
}

.devsite-search-summary-chat-body:has(.devsite-search-summary-signin,.devsite-search-summary-tos-intro) {
    background: url(../images/search-summaries-loading.svg) no-repeat 100% #fff
}

.color-scheme--dark .devsite-search-summary-chat-body:has(.devsite-search-summary-signin,.devsite-search-summary-tos-intro) {
    background: url(../images/search-summaries-loading-dark.svg) no-repeat 100% #2a2b2e
}

.devsite-search-summary-chat-body a {
    color: #1a73e8
}

.color-scheme--dark .devsite-search-summary-chat-body a {
    color: #8ab4f8
}

.devsite-search-summary-chat-container {
    position: relative
}

.devsite-search-summary-heading {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

.devsite-tos-title {
    margin-top: 0
}

.devsite-tos-button-container {
    text-align: right
}

.devsite-search-summary-tos-reject-button {
    border-radius: 40px;
    padding-inline:12px;background-color: transparent;
    color: #0b57d0
}

.color-scheme--dark .devsite-search-summary-tos-reject-button {
    background-color: transparent;
    color: #aecbfa
}

.devsite-search-summary-tos-reject-button:focus,.devsite-search-summary-tos-reject-button:hover {
    background-color: rgba(11,87,208,.08);
    color: #0b57d0
}

.color-scheme--dark .devsite-search-summary-tos-reject-button:focus,.color-scheme--dark .devsite-search-summary-tos-reject-button:hover {
    background-color: rgba(138,180,248,.04);
    color: #d2e3fc
}

.devsite-search-summary-tos-reject-button:active {
    background-color: rgba(11,87,208,.12);
    color: #0b57d0
}

.color-scheme--dark .devsite-search-summary-tos-reject-button:active {
    background-color: rgba(138,180,248,.1);
    color: #d2e3fc
}

.devsite-search-summary-heading-logo {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px}

.devsite-search-summary-heading-logo svg {
    fill: #202124;
    height: 24px;
    width: 24px
}

.color-scheme--dark .devsite-search-summary-heading-logo svg {
    fill: #e8eaed
}

.devsite-search-summary-heading-prefix {
    font-size: 14px;
    -webkit-margin-end: 3px;
    -moz-margin-end: 3px;
    margin-inline-end:3px;font-weight: 500
}

.devsite-search-summary-heading-content {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    font-size: 18px;
    font-weight: 500
}

.devsite-search-summary-heading-beta-text {
    background: #f3e8fd;
    border-radius: 4px;
    color: #681da8;
    font-size: 9px;
    font-weight: 500;
    line-height: 16px;
    letter-spacing: .8px;
    padding: 2px 6px;
    text-transform: uppercase
}

.color-scheme--dark .devsite-search-summary-heading-beta-text {
    background: #202124;
    color: #e9d2fd
}

.devsite-search-summary-generate-summary-heading {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-margin-after: 0;
    margin-block-end:0}

.devsite-search-summary-signin {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.devsite-search-summary-change-profile,.devsite-search-summary-dev-profile-container,.devsite-search-summary-signin-container,.devsite-search-summary-tos-intro {
    min-height: min(18vw,200px);
    font-family: Google Sans;
    font-size: 24px;
    max-width: 50%;
    line-height: 32px
}

.devsite-search-summary-dev-profile-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    max-width: revert;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.devsite-search-summary-dev-profile-button-container,.devsite-search-summary-preview-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 16px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.devsite-search-summary-preview-header {
    background-color: #f1f3f4;
    border-radius: 25px;
    -webkit-margin-end: 200px;
    -moz-margin-end: 200px;
    margin-inline-end:200px;min-width: 150px;
    padding: 16px
}

.devsite-search-summary-preview-content {
    font-size: 18px;
    line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.legacy .devsite-search-summary-preview-content {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-top: auto;
    overflow: hidden;
    text-overflow: ellipsis
}

.devsite-search-summary-preview-header .devsite-search-summary-preview-content {
    line-clamp: 1;
    -webkit-line-clamp: 1;
    font-size: 20px
}

.devsite-search-summary-preview-content-container {
    background-image: -webkit-gradient(linear,left top,right top,from(#f3e8fd),to(#e8eaf6));
    background-image: -webkit-linear-gradient(left,#f3e8fd,#e8eaf6);
    background-image: linear-gradient(90deg,#f3e8fd,#e8eaf6);
    border-radius: 25px;
    min-height: 56px;
    padding: 16px
}

.devsite-search-summary-change-profile {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 11px;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0 35px;
    text-align: center;
    width: 100%
}

.devsite-search-summary-loading {
    width: 100%
}

.devsite-search-summary-loading-text-outer {
    border-radius: 12px;
    -webkit-margin-after: 8px;
    margin-block-end:8px;overflow: hidden;
    width: 100%
}

.devsite-search-summary-loading-text-outer:nth-of-type(2) {
    width: 80%
}

.devsite-search-summary-loading-text-outer:nth-of-type(3) {
    width: 78%
}

.devsite-search-summary-loading-text-outer:nth-of-type(4) {
    width: 60%
}

.devsite-search-summary-preview-content-container.devsite-search-summary-loading-text-outer:nth-of-type(2) {
    width: 60%
}

.devsite-search-summary-loading-text-inner {
    -webkit-animation: text-loading 3.5s cubic-bezier(.1,0,.2,1) 0s infinite normal both running;
    animation: text-loading 3.5s cubic-bezier(.1,0,.2,1) 0s infinite normal both running;
    background: -webkit-gradient(linear,left top,right top,color-stop(10%,transparent),color-stop(70%,#8ab4f8),color-stop(90%,transparent));
    background: -webkit-linear-gradient(left,transparent 10%,#8ab4f8 70%,transparent 90%);
    background: linear-gradient(90deg,transparent 10%,#8ab4f8 70%,transparent 90%);
    height: 20px;
    width: 190%
}

.color-scheme--dark .devsite-search-summary-loading-text-inner {
    background: -webkit-gradient(linear,left top,right top,color-stop(10%,transparent),color-stop(70%,#1967d2),color-stop(90%,transparent));
    background: -webkit-linear-gradient(left,transparent 10%,#1967d2 70%,transparent 90%);
    background: linear-gradient(90deg,transparent 10%,#1967d2 70%,transparent 90%)
}

.devsite-search-summary-results-container:not([content-expanded]) {
    max-height: 240px
}

.devsite-search-summary-results-container[content-overflows] {
    -webkit-mask-image: -webkit-gradient(linear,left bottom,left top,from(hsla(0,0%,100%,0)),color-stop(15%,hsla(0,0%,100%,0)),to(#fff));
    -webkit-mask-image: -webkit-linear-gradient(bottom,hsla(0,0%,100%,0),hsla(0,0%,100%,0) 15%,#fff);
    mask-image: -webkit-gradient(linear,left bottom,left top,from(hsla(0,0%,100%,0)),color-stop(15%,hsla(0,0%,100%,0)),to(#fff));
    mask-image: linear-gradient(0deg,hsla(0,0%,100%,0),hsla(0,0%,100%,0) 15%,#fff)
}

.devsite-search-summary-results-container>p:first-child {
    -webkit-margin-before: 0;
    margin-block-start:0}

.devsite-search-summary-dev-profile-button,.devsite-search-summary-sign-in-button,.devsite-search-summary-tos-intro-button {
    border-radius: 40px;
    background-color: #0b57d0;
    color: #fff
}

.color-scheme--dark .devsite-search-summary-dev-profile-button,.color-scheme--dark .devsite-search-summary-sign-in-button,.color-scheme--dark .devsite-search-summary-tos-intro-button {
    background-color: #a8c7fa;
    color: #202124
}

.devsite-search-summary-dev-profile-button:focus,.devsite-search-summary-dev-profile-button:hover,.devsite-search-summary-sign-in-button:focus,.devsite-search-summary-sign-in-button:hover,.devsite-search-summary-tos-intro-button:focus,.devsite-search-summary-tos-intro-button:hover {
    background-color: #1f64d4;
    color: #fff
}

.color-scheme--dark .devsite-search-summary-dev-profile-button:focus,.color-scheme--dark .devsite-search-summary-dev-profile-button:hover,.color-scheme--dark .devsite-search-summary-sign-in-button:focus,.color-scheme--dark .devsite-search-summary-sign-in-button:hover,.color-scheme--dark .devsite-search-summary-tos-intro-button:focus,.color-scheme--dark .devsite-search-summary-tos-intro-button:hover {
    background-color: #9dbae9;
    color: #202124
}

.devsite-search-summary-dev-profile-button:active,.devsite-search-summary-sign-in-button:active,.devsite-search-summary-tos-intro-button:active {
    background-color: #286bd6;
    color: #fff
}

.color-scheme--dark .devsite-search-summary-dev-profile-button:active,.color-scheme--dark .devsite-search-summary-sign-in-button:active,.color-scheme--dark .devsite-search-summary-tos-intro-button:active {
    background-color: #9ab6e5;
    color: #202124
}

.devsite-search-summary-tos-accept-button {
    border-radius: 40px;
    background-color: #c2e7ff;
    color: #202124
}

.color-scheme--dark .devsite-search-summary-tos-accept-button {
    background-color: #aecbfa;
    color: #202124
}

.devsite-search-summary-tos-accept-button:focus,.devsite-search-summary-tos-accept-button:hover {
    background-color: #b2d7ef;
    color: #202124
}

.color-scheme--dark .devsite-search-summary-tos-accept-button:focus,.color-scheme--dark .devsite-search-summary-tos-accept-button:hover {
    background-color: #b4cffa;
    color: #202124
}

.devsite-search-summary-tos-accept-button:active {
    background-color: #abcfe7;
    color: #202124
}

.color-scheme--dark .devsite-search-summary-tos-accept-button:active {
    background-color: #b6d0fb;
    color: #202124
}

.devsite-search-summary-follow-up-question,.devsite-search-summary-show-more-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 40px;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    --devsite-button-box-shadow: none;
    --devsite-button-primary-box-shadow-hover: none;
    --devsite-button-primary-box-shadow-active: none;
    --devsite-button-primary-background: var( --devsite-search-summary-follow-up-button-background-color,#c2e7ff );
    --devsite-button-primary-color: var( --devsite-search-summary-follow-up-button-color,#202124 );
    background-color: var(--devsite-button-primary-background);
    color: var(--devsite-button-primary-color)
}

.devsite-search-summary-follow-up-question svg,.devsite-search-summary-show-more-button svg {
    fill: var(--devsite-search-summary-follow-up-button-svg-fill,#202124)
}

.color-scheme--dark .devsite-search-summary-follow-up-question,.color-scheme--dark .devsite-search-summary-show-more-button {
    --devsite-button-primary-background: var( --devsite-search-summary-follow-up-button-background-color-dark,#aecbfa );
    --devsite-button-primary-color: var( --devsite-search-summary-follow-up-button-color-dark,#202124 )
}

.color-scheme--dark .devsite-search-summary-follow-up-question svg,.color-scheme--dark .devsite-search-summary-show-more-button svg {
    fill: var(--devsite-search-summary-follow-up-button-svg-fill-dark,#202124)
}

.devsite-search-summary-follow-up-question:focus,.devsite-search-summary-follow-up-question:hover,.devsite-search-summary-show-more-button:focus,.devsite-search-summary-show-more-button:hover {
    --devsite-button-primary-background-hover: var( --devsite-search-summary-follow-up-button-background-color--hover,#b2d7ef );
    --devsite-button-primary-color-hover: var( --devsite-search-summary-follow-up-button-color--hover,#202124 );
    background-color: var(--devsite-button-primary-background-hover);
    color: var(--devsite-button-primary-color-hover)
}

.devsite-search-summary-follow-up-question:focus svg,.devsite-search-summary-follow-up-question:hover svg,.devsite-search-summary-show-more-button:focus svg,.devsite-search-summary-show-more-button:hover svg {
    fill: var(--devsite-search-summary-follow-up-button-svg-fill--hover,#202124)
}

.color-scheme--dark .devsite-search-summary-follow-up-question:focus,.color-scheme--dark .devsite-search-summary-follow-up-question:hover,.color-scheme--dark .devsite-search-summary-show-more-button:focus,.color-scheme--dark .devsite-search-summary-show-more-button:hover {
    --devsite-button-primary-background-hover: var( --devsite-search-summary-follow-up-button-background-color-dark--hover,#b4cffa );
    --devsite-button-primary-color-hover: var( --devsite-search-summary-follow-up-button-color--dark-hover,#202124 )
}

.color-scheme--dark .devsite-search-summary-follow-up-question:focus svg,.color-scheme--dark .devsite-search-summary-follow-up-question:hover svg,.color-scheme--dark .devsite-search-summary-show-more-button:focus svg,.color-scheme--dark .devsite-search-summary-show-more-button:hover svg {
    fill: var(--devsite-search-summary-follow-up-button-svg-fill-dark--hover,#202124)
}

.devsite-search-summary-follow-up-question:active,.devsite-search-summary-show-more-button:active {
    --devsite-button-primary-background-active: var( --devsite-search-summary-follow-up-button-background-color--active,#abcfe7 );
    --devsite-button-primary-color-active: var( --devsite-search-summary-follow-up-button-color--active,#202124 );
    background-color: var(--devsite-button-primary-background-active);
    color: var(--devsite-button-primary-color-active)
}

.devsite-search-summary-follow-up-question:active svg,.devsite-search-summary-show-more-button:active svg {
    fill: var(--devsite-search-summary-follow-up-button-svg-fill--active,#202124)
}

.color-scheme--dark .devsite-search-summary-follow-up-question:active,.color-scheme--dark .devsite-search-summary-show-more-button:active {
    --devsite-button-primary-background-active: var( --devsite-search-summary-follow-up-button-background-color-dark--active,#b6d0fb );
    --devsite-button-primary-color-active: var( --devsite-search-summary-follow-up-button-color-dark--active,#202124 )
}

.color-scheme--dark .devsite-search-summary-follow-up-question:active svg,.color-scheme--dark .devsite-search-summary-show-more-button:active svg {
    fill: var(--devsite-search-summary-follow-up-button-svg-fill-dark--active,#202124)
}

.devsite-search-summary-follow-up-question .material-icons,.devsite-search-summary-show-more-button .material-icons {
    margin-inline:0!important;top: auto;
    font-size: 24px;
    height: 24px;
    vertical-align: middle;
    width: 24px
}

.devsite-search-summary-follow-up-question-icon {
    height: 13px;
    -webkit-margin-end: 10px;
    -moz-margin-end: 10px;
    margin-inline-end:10px;width: 16px
}

.devsite-search-summary-show-more-container {
    bottom: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    left: 0;
    position: absolute;
    width: 100%
}

.devsite-search-summary-footer-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 4px;
    -webkit-margin-before: 24px;
    margin-block-start:24px}

.devsite-search-summary-up-down-vote {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    gap: 10px
}

.devsite-search-summary-up-down-vote-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    gap: 10px
}

.devsite-search-summary-feedback-button {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 4px
}

.devsite-search-summary-feedback-button .material-icons {
    --devsite-button-material-icon-margin-x: 0;
    margin: 0;
    top: 0
}

.devsite-search-summary-down-vote,.devsite-search-summary-up-vote {
    background: none;
    border: 1px solid #dadce0;
    border-radius: 8px;
    height: 40px;
    margin: 0;
    min-width: auto;
    padding: 0;
    width: 40px;
    background-color: #fff;
    color: #1a73e8;
    border-color: #dadce0
}

.color-scheme--dark .devsite-search-summary-down-vote,.color-scheme--dark .devsite-search-summary-up-vote {
    background-color: #2a2b2e;
    color: #8ab4f8;
    border-color: #5f6368
}

.devsite-search-summary-down-vote:focus,.devsite-search-summary-down-vote:hover,.devsite-search-summary-up-vote:focus,.devsite-search-summary-up-vote:hover {
    background-color: #e8f0fe;
    color: #1a73e8
}

.color-scheme--dark .devsite-search-summary-down-vote:focus,.color-scheme--dark .devsite-search-summary-down-vote:hover,.color-scheme--dark .devsite-search-summary-up-vote:focus,.color-scheme--dark .devsite-search-summary-up-vote:hover {
    background-color: #2e3036;
    color: #d2e3fc
}

.devsite-search-summary-down-vote:active,.devsite-search-summary-up-vote:active {
    background-color: #d2e3fc;
    color: #174ea6
}

.color-scheme--dark .devsite-search-summary-down-vote:active,.color-scheme--dark .devsite-search-summary-up-vote:active {
    background-color: #343942;
    color: #d2e3fc
}

.devsite-search-summary-down-vote[disabled],.devsite-search-summary-up-vote[disabled] {
    background-color: #e8f0fe;
    color: #1967d2;
    border-color: #dadce0
}

.color-scheme--dark .devsite-search-summary-down-vote[disabled],.color-scheme--dark .devsite-search-summary-up-vote[disabled] {
    background-color: #2e3036;
    color: #8ab4f8;
    border-color: #5f6368
}

.devsite-search-summary-down-vote[disabled]:focus,.devsite-search-summary-down-vote[disabled]:hover,.devsite-search-summary-up-vote[disabled]:focus,.devsite-search-summary-up-vote[disabled]:hover {
    background-color: #d2e3fc;
    color: #174ea6
}

.color-scheme--dark .devsite-search-summary-down-vote[disabled]:focus,.color-scheme--dark .devsite-search-summary-down-vote[disabled]:hover,.color-scheme--dark .devsite-search-summary-up-vote[disabled]:focus,.color-scheme--dark .devsite-search-summary-up-vote[disabled]:hover {
    background-color: #343942;
    color: #8ab4f8
}

.devsite-search-summary-down-vote[disabled]:active,.devsite-search-summary-up-vote[disabled]:active {
    background-color: #d2e3fc;
    color: #174ea6
}

.color-scheme--dark .devsite-search-summary-down-vote[disabled]:active,.color-scheme--dark .devsite-search-summary-up-vote[disabled]:active {
    background-color: #2a2b2e;
    color: #8ab4f8
}

[dir=rtl] .devsite-search-summary-down-vote,[dir=rtl] .devsite-search-summary-up-vote {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1)
}

.devsite-search-summary-carousel-container {
    -webkit-box-flex: 100000;
    -webkit-flex: 100000;
    -moz-box-flex: 100000;
    -ms-flex: 100000;
    flex: 100000
}

.devsite-search-summary-carousel-container+.devsite-search-summary-up-down-vote {
    -webkit-margin-start: 28px;
    -moz-margin-start: 28px;
    margin-inline-start:28px}

@media screen and (max-width: 840px) {
    devsite-search-summary {
        display:none
    }
}

devsite-select {
    display: var(--devsite-select-display);
    margin: var(--devsite-select-margin);
    position: relative
}

devsite-select+devsite-select,devsite-select~.button,devsite-select~button {
    -webkit-margin-before: var(--devsite-select-sibling-gap-y);
    margin-block-start:var(--devsite-select-sibling-gap-y);-webkit-margin-start: var(--devsite-select-sibling-gap-x);
    -moz-margin-start: var(--devsite-select-sibling-gap-x);
    margin-inline-start:var(--devsite-select-sibling-gap-x)}

devsite-select select {
    display: none!important;
    pointer-events: none!important;
    position: absolute;
    z-index: -1
}

devsite-select .devsite-select {
    position: relative
}

devsite-select .devsite-select-toggle {
    -moz-appearance: none;
    -webkit-appearance: none;
    background-color: var(--devsite-select-background-color);
    border: var(--devsite-select-border,var(--devsite-secondary-border));
    border-radius: var(--devsite-select-border-radius);
    box-shadow: none;
    color: var(--devsite-select-color,var(--devsite-primary-text-color));
    cursor: pointer;
    display: inline-block;
    font: var(--devsite-select-font,500 14px/36px var(--devsite-primary-font-family));
    height: var(--devsite-select-height,36px);
    line-height: var(--devsite-select-line-height,34px);
    max-width: var(--devsite-select-max-width,340px);
    min-width: 72px;
    outline: 0;
    overflow: hidden;
    padding-block:var(--devsite-select-padding-block,0);padding-inline: var(--devsite-select-padding-inline,7px 27px);
    text-align: left;
    text-indent: .01px;
    text-overflow: ellipsis;
    -webkit-transition: background-color .2s;
    transition: background-color .2s;
    vertical-align: middle;
    white-space: nowrap;
    position: relative
}

devsite-select .devsite-select-toggle:focus,devsite-select .devsite-select-toggle:hover {
    background-color: var(--devsite-select-background-color-hover,var(--devsite-background-3));
    border: var(--devsite-select-border-hover,var(--devsite-select-border,var(--devsite-secondary-border)));
    color: var(--devsite-select-color-hover)
}

devsite-select .devsite-select-toggle:active {
    background-color: var(--devsite-select-background-color-active,var(--devsite-background-4));
    color: var(--devsite-select-color-active)
}

devsite-select .devsite-select-toggle:disabled {
    background-color: var(--devsite-background-3);
    border-color: transparent;
    color: var(--devsite-tertiary-text-color);
    cursor: default
}

devsite-select .devsite-select-toggle-icon {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    pointer-events: none;
    position: absolute;
    top: 0
}

[dir=ltr] devsite-select .devsite-select-toggle-icon {
    right: var(--devsite-select-toggle-icon-x,8px)
}

[dir=rtl] devsite-select .devsite-select-toggle-icon {
    left: var(--devsite-select-toggle-icon-x,8px)
}

devsite-select .devsite-select-toggle-icon:before {
    font-size: var(--devsite-select-toggle-icon-size,18px)
}

devsite-select .devsite-select-toggle-count {
    -webkit-margin-start: var(--devsite-select-count-margin-inline-start,6px);
    -moz-margin-start: var(--devsite-select-count-margin-inline-start,6px);
    margin-inline-start:var(--devsite-select-count-margin-inline-start,6px)}

devsite-select .devsite-select-toggle-count[parens]: not(:empty):before {
    content:"("
}

devsite-select .devsite-select-toggle-count[parens]:not(:empty):after {
    content: ")"
}

devsite-select .devsite-select-list {
    background: var(--devsite-background-1);
    border: var(--devsite-list-border,var(--devsite-secondary-border));
    border-radius: var(--devsite-list-border-radius,2px);
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color);
    display: none;
    font: var(--devsite-list-font,400 14px/20px var(--devsite-primary-font-family));
    max-height: 304px;
    min-width: var(--devsite-list-min-width);
    opacity: 0;
    outline: 0;
    overflow-y: auto;
    padding: 8px 0;
    pointer-events: none;
    position: absolute;
    -webkit-transition: opacity .2s,visibility .2s;
    transition: opacity .2s,visibility .2s;
    z-index: 1005
}

devsite-dialog devsite-select .devsite-select-list {
    z-index: 1015
}

devsite-select[menu--open] .devsite-select-list {
    display: block;
    pointer-events: auto
}

devsite-select[menu--show] .devsite-select-list {
    opacity: 1
}

devsite-select[menu-position=above] .devsite-select-list {
    bottom: var(--devsite-list-position-y,36px)
}

devsite-select[menu-position=below] .devsite-select-list {
    top: var(--devsite-list-position-y,36px)
}

devsite-select .devsite-select-item {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    min-height: 48px;
    min-width: 100%;
    padding: 8px 16px;
    white-space: nowrap
}

devsite-select .devsite-select-item.devsite-focused,devsite-select .devsite-select-item:focus,devsite-select .devsite-select-item:hover {
    background-color: var(--devsite-background-3);
    cursor: pointer
}

devsite-select .devsite-select-item-link {
    padding: 0
}

devsite-select .devsite-select-item>a {
    color: var(--devsite-primary-text-color);
    padding: 8px 16px
}

devsite-select .devsite-select-item>a:focus {
    text-decoration: none
}

devsite-select .devsite-select-item[data-selected] {
    background-color: var(--devsite-item-background-selected,var(--devsite-background-3));
    color: var(--devsite-item-color-selected);
    font-weight: var(--devsite-item-font-weight-selected,500)
}

@media screen and (-ms-high-contrast:active),screen and (prefers-contrast:high) {
    devsite-select .devsite-select-item[data-selected] {
        font-weight: 700;
        text-decoration: underline
    }
}

devsite-select.devsite-select--multiple .devsite-select-item {
    padding-left: 48px;
    position: relative
}

devsite-select.devsite-select--multiple .devsite-select-item:before {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    color: #80868b;
    content: "check_box_outline_blank";
    display: block;
    font-size: 24px;
    left: 16px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

devsite-select.devsite-select--multiple .devsite-select-item[data-selected]:before {
    color: var(--devsite-item-color-selected,#1a73e8);
    content: "check_box"
}

devsite-selector {
    background: var(--devsite-selector-background,var(--devsite-background-1));
    border: var(--devsite-border,var(--devsite-secondary-border));
    border-radius: var(--devsite-border-radius,0);
    display: block;
    margin: var(--devsite-selector-margin,16px 0)
}

devsite-selector devsite-tabs {
    display: none
}

devsite-selector devsite-tabs[connected] {
    border-bottom: var(--devsite-border,var(--devsite-secondary-border));
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-selector devsite-tabs tab .devsite-tabs-dropdown-only,devsite-selector devsite-tabs tab .devsite-tabs-overflow-button,devsite-selector devsite-tabs tab a {
    color: var(--devsite-secondary-text-color);
    display: inline-block;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    line-height: var(--devsite-selector-tab-line-height,48px);
    margin: 0;
    max-width: 200px;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    -webkit-transition: color .2s;
    transition: color .2s;
    white-space: nowrap
}

devsite-selector devsite-tabs tab .devsite-tabs-dropdown-only:focus,devsite-selector devsite-tabs tab .devsite-tabs-dropdown-only:hover,devsite-selector devsite-tabs tab .devsite-tabs-overflow-button:focus,devsite-selector devsite-tabs tab .devsite-tabs-overflow-button:hover,devsite-selector devsite-tabs tab a:focus,devsite-selector devsite-tabs tab a:hover {
    color: var(--devsite-link-hover,var(--devsite-link-color))
}

devsite-selector devsite-tabs tab a:link,devsite-selector devsite-tabs tab a:visited {
    color: var(--devsite-secondary-text-color)
}

devsite-selector devsite-tabs tab.devsite-active a:link,devsite-selector devsite-tabs tab.devsite-active a:visited {
    color: var(--devsite-link-color)
}

@media screen and (-ms-high-contrast:active),screen and (prefers-contrast:high) {
    devsite-selector devsite-tabs tab.devsite-active a:link,devsite-selector devsite-tabs tab.devsite-active a:visited {
        color: inherit
    }
}

devsite-selector devsite-tabs>div>tab .devsite-tabs-content.devsite-tabs-dropdown-only:focus:after,devsite-selector devsite-tabs>div>tab .devsite-tabs-content.devsite-tabs-dropdown-only:hover:after,devsite-selector devsite-tabs>div>tab .devsite-tabs-overflow-button:focus:after,devsite-selector devsite-tabs>div>tab .devsite-tabs-overflow-button:hover:after,devsite-selector devsite-tabs>div>tab[data-tab] a:focus:after,devsite-selector devsite-tabs>div>tab[data-tab] a:hover:after {
    border-color: var(--devsite-tab-marker-color,transparent)
}

devsite-selector devsite-tabs>div>tab.devsite-active .devsite-tabs-dropdown-only:after,devsite-selector devsite-tabs>div>tab.devsite-active .devsite-tabs-dropdown-only:focus:after,devsite-selector devsite-tabs>div>tab.devsite-active .devsite-tabs-dropdown-only:hover:after,devsite-selector devsite-tabs>div>tab.devsite-active .devsite-tabs-overflow-button:after,devsite-selector devsite-tabs>div>tab.devsite-active .devsite-tabs-overflow-button:focus:after,devsite-selector devsite-tabs>div>tab.devsite-active .devsite-tabs-overflow-button:hover:after,devsite-selector devsite-tabs>div>tab.devsite-active a:after,devsite-selector devsite-tabs>div>tab.devsite-active a:focus:after,devsite-selector devsite-tabs>div>tab.devsite-active a:hover:after {
    border-color: var(--devsite-link-color)
}

devsite-selector devsite-tabs tab.devsite-two-line a {
    line-height: 20px;
    padding-top: 4px;
    white-space: normal
}

devsite-selector tab.devsite-two-line [data-tab-label]:after {
    content: attr(data-tab-label);
    display: block;
    font-size: 12px
}

body devsite-selector devsite-tabs tab.devsite-overflow-tab .devsite-tabs-overflow-menu tab a {
    height: auto;
    min-height: 48px;
    width: 100%
}

devsite-selector devsite-tabs.devsite-overflow-menu--open tab.devsite-overflow-tab {
    border-radius: var(--devsite-overflow-tab-border-radius,0)
}

body devsite-selector devsite-tabs tab.devsite-overflow-tab .devsite-tabs-overflow-menu tab a:focus,body devsite-selector devsite-tabs tab.devsite-overflow-tab .devsite-tabs-overflow-menu tab a:hover {
    background: var(--devsite-overflow-link-background-hover,var(--devsite-background-3))
}

devsite-selector>section {
    display: none;
    outline: 0
}

devsite-selector>section.devsite-active {
    display: block;
    padding: 0 23px
}

devsite-selector>section pre:not([is-upgraded]) {
    --devsite-selector-content-margin-y: 0;
    margin: 0 -23px;
    padding-block:var(--devsite-code-padding-block,24px);padding-inline: var(--devsite-code-padding-inline,24px);
    padding-left: 23px
}

devsite-selector>section .devsite-table-wrapper:first-child tbody tr:first-child,devsite-selector>section .devsite-table-wrapper:first-child thead tr {
    border-top: 0
}

devsite-selector>section>.devsite-table-wrapper,devsite-selector>section>.github-docwidget-gitinclude-code>devsite-code,devsite-selector>section>.github-docwidget-include,devsite-selector>section>aside.beta,devsite-selector>section>aside.caution,devsite-selector>section>aside.deprecated,devsite-selector>section>aside.dogfood,devsite-selector>section>aside.experimental,devsite-selector>section>aside.key-objective,devsite-selector>section>aside.key-point,devsite-selector>section>aside.key-term,devsite-selector>section>aside.note,devsite-selector>section>aside.preview,devsite-selector>section>aside.success,devsite-selector>section>aside.warning,devsite-selector>section>devsite-code,devsite-selector>section>table {
    margin: 0 -23px
}

devsite-selector>section>:first-child:not(:empty):not(aside):not(devsite-code):not(table):not(.devsite-table-wrapper):not([class^=github-]) {
    margin-top: var(--devsite-selector-content-margin-y,15px)
}

devsite-selector>section>:last-child:not(aside):not(devsite-code):not(table):not(.devsite-table-wrapper):not([class^=github-]) {
    margin-bottom: var(--devsite-selector-content-margin-y,15px)
}

devsite-selector .devsite-table-wrapper:last-child,devsite-selector>section>.github-docwidget-gitinclude-code>devsite-code:last-child>pre,devsite-selector>section>aside:last-child,devsite-selector>section>devsite-code:last-child>pre {
    border-radius: var(--devsite-content-border-radius,0)
}

devsite-selector .devsite-table-wrapper+.devsite-table-wrapper {
    margin-top: 16px
}

devsite-selector>section table devsite-code {
    margin: 16px 0
}

devsite-selector>section>devsite-code pre {
    padding-left: 23px
}

.devsite-article devsite-selector .material-icons {
    font-size: var(--devsite-selector-icon-font-size,18px);
    vertical-align: text-bottom
}

devsite-selector .devsite-selector-tab-heading {
    background: transparent;
    color: transparent;
    display: block;
    height: 1px;
    left: -500vw;
    overflow: hidden;
    position: absolute;
    top: -500vh;
    width: 1px;
    z-index: -1
}

devsite-selector[rendered] {
    pointer-events: auto;
    visibility: visible
}

devsite-shell-activate-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around
}

devsite-shell-activate-button[tooltip--shown] {
    z-index: 104
}

@media screen and (max-width: 840px) {
    devsite-shell-activate-button {
        display:none
    }
}

devsite-shell-activate-button ul li {
    text-align: left
}

devsite-shell-activate-button button {
    border: none;
    color: var(--devsite-secondary-text-color);
    height: auto;
    margin: 0 0 0 11px;
    min-width: 0;
    padding: 9px 13px;
    width: auto
}

devsite-shell-activate-button button:active {
    background: var(--devsite-background-4);
    border: none
}

devsite-shell-activate-button button:focus {
    background: none;
    border: none;
    color: var(--devsite-secondary-text-color)
}

devsite-shell-activate-button button:hover {
    background: var(--devsite-background-4);
    border: none;
    color: var(--devsite-secondary-text-color)
}

devsite-shell-activate-button cloud-mdc-rich-tooltip::part(richTooltip) {
    -webkit-transform: translateX(-36px);
    transform: translateX(-36px)
}

devsite-shell-activate-button button[disabled] {
    border: none
}

devsite-shell-activate-button button svg {
    display: block;
    margin: auto;
    pointer-events: none
}

devsite-shell-activate-button .tooltip-title {
    color: var(--devsite-primary-text-color);
    font-size: 16px;
    font-weight: 500;
    margin: 2px 0 8px;
    padding: 0
}

devsite-shell-activate-button [slot=contents].tooltip-contents {
    color: var(--devsite-primary-text-color);
    font-family: var(--devsite-wordmark-font-family);
    font-size: 14px;
    font-weight: 400
}

devsite-shell-activate-button p.tooltip-contents {
    text-align: left;
    margin: 0
}

devsite-shell-activate-button ul.tooltip-contents {
    margin: 8px 0 0
}

devsite-shell-activate-button ul.tooltip-contents li {
    margin: 0
}

devsite-shell-activate-button .tooltip-buttons {
    float: left;
    margin: 24px 0 2px
}

body[free-trial] devsite-shell-activate-button[free-trial-hide] {
    display: none
}

body[free-trial] devsite-shell-activate-button[force-visibility] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-sign-in {
    display: inline
}

devsite-sitemask {
    background: rgba(0,0,0,.4);
    bottom: -200px;
    cursor: pointer;
    left: -200px;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    right: -200px;
    top: -200px;
    -webkit-transition: opacity .2s cubic-bezier(.4,0,.2,1),visibility .2s linear;
    transition: opacity .2s cubic-bezier(.4,0,.2,1),visibility .2s linear;
    visibility: hidden;
    z-index: 1012;
    -webkit-tap-highlight-color: transparent
}

devsite-sitemask[visible] {
    opacity: 1;
    pointer-events: auto;
    -webkit-transition: opacity .2s ease;
    transition: opacity .2s ease;
    visibility: visible
}

devsite-snackbar {
    bottom: 0;
    left: 0;
    -webkit-margin-end: 24px;
    -moz-margin-end: 24px;
    margin-inline-end:24px;-webkit-margin-after: var(--devsite-cookie-bar-height,0);
    margin-block-end:var(--devsite-cookie-bar-height,0);min-width: 288px;
    position: fixed;
    right: 0;
    z-index: 1018
}

devsite-snackbar .devsite-snackbar-snack {
    bottom: 0;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-width: var(--devsite-snack-max-width,none);
    min-width: var(--devsite-snack-min-width,auto);
    padding: 0 0 24px 24px;
    position: absolute;
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
    -webkit-transition: -webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: -webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: transform .2s cubic-bezier(.4,0,1,1);
    transition: transform .2s cubic-bezier(.4,0,1,1),-webkit-transform .2s cubic-bezier(.4,0,1,1);
    width: var(--devsite-snack-width,auto)
}

devsite-snackbar [show].devsite-snackbar-snack {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

devsite-snackbar .devsite-snackbar-inner {
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-snackbar-inner-background,#3c4043);
    border-radius: var(--devsite-snackbar-inner-border-radius,2px);
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color);
    color: var(--devsite-snackbar-inner-color,#fff);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-flow: row var(--devsite-snackbar-inner-flex-wrap,nowrap);
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-flow: row var(--devsite-snackbar-inner-flex-wrap,nowrap);
    flex-flow: row var(--devsite-snackbar-inner-flex-wrap,nowrap);
    font-size: 14px;
    min-height: 48px;
    padding: 0
}

devsite-snackbar .devsite-snackbar-message {
    -webkit-box-flex: var(--devsite-snackbar-message-flex,1 1);
    -webkit-flex: var(--devsite-snackbar-message-flex,1 1);
    -moz-box-flex: var(--devsite-snackbar-message-flex,1 1);
    -ms-flex: var(--devsite-snackbar-message-flex,1 1);
    flex: var(--devsite-snackbar-message-flex,1 1);
    font: var(--devsite-snackbar-message-font,inherit);
    letter-spacing: .2px;
    line-height: 20px;
    font-weight: 400;
    overflow: hidden;
    padding: var(--devsite-snackbar-message-padding,24px);
    text-overflow: ellipsis;
    word-break: break-word
}

devsite-snackbar .devsite-snackbar-message a {
    color: var(--devsite-snackbar-link-color,#669df6)
}

devsite-snackbar .devsite-snackbar-action,devsite-snackbar .devsite-snackbar-link {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
    color: var(--devsite-snackbar-link-color,#eeff41);
    cursor: pointer;
    display: inline-block;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0;
    -moz-box-flex: 0;
    -ms-flex: 0 0;
    flex: 0 0;
    float: right;
    font: var(--devsite-snackbar-action-font,inherit);
    height: auto;
    letter-spacing: .25px;
    line-height: 20px;
    -webkit-margin-start: 0;
    -moz-margin-start: 0;
    margin-inline-start:0;-webkit-margin-end: var(--devsite-snackbar-action-margin-right,0);
    -moz-margin-end: var(--devsite-snackbar-action-margin-right,0);
    margin-inline-end:var(--devsite-snackbar-action-margin-right,0);min-width: -webkit-fit-content;
    min-width: -moz-fit-content;
    min-width: fit-content;
    outline: none;
    padding: var(--devsite-snackbar-action-padding,14px 24px);
    position: relative
}

devsite-snackbar .devsite-snackbar-action,devsite-snackbar .devsite-snackbar-action:active,devsite-snackbar .devsite-snackbar-action:focus,devsite-snackbar .devsite-snackbar-action:hover,devsite-snackbar .devsite-snackbar-link,devsite-snackbar .devsite-snackbar-link:active,devsite-snackbar .devsite-snackbar-link:focus,devsite-snackbar .devsite-snackbar-link:hover {
    background: 0;
    border: 0;
    box-shadow: none
}

devsite-snackbar .devsite-snackbar-link:focus {
    text-decoration: none
}

devsite-snackbar [type^=notification-] .devsite-snackbar-action {
    -webkit-margin-start: var(--devsite-snackbar-action-margin-left,0);
    -moz-margin-start: var(--devsite-snackbar-action-margin-left,0);
    margin-inline-start:var(--devsite-snackbar-action-margin-left,0)}

@media screen and (max-width: 840px) {
    devsite-snackbar {
        -webkit-margin-after:0;
        margin-block-end:0;max-width: 100%
    }

    devsite-snackbar [type^=notification-] .devsite-snackbar-inner {
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

    devsite-snackbar [type^=notification-] .devsite-snackbar-message {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100%;
        -moz-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        padding: var(--devsite-snackbar-message-padding,24px 24px 0)
    }

    devsite-snackbar .devsite-snackbar-inner {
        border-radius: 0
    }

    devsite-snackbar .devsite-snackbar-snack {
        left: 0;
        padding: 24px 0 0;
        right: 0
    }
}

devsite-sticky-nav {
    --devsite-sticky-nav-height: 48px;
    --devsite-sticky-nav-bottom-padding: 32px;
    display: none;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 0;
    inset-block-start: 100vh;
    left: 0;
    opacity: 0;
    position: -webkit-sticky;
    position: sticky;
    -webkit-transition: opacity .6s .3s,visibility .6s .3s;
    transition: opacity .6s .3s,visibility .6s .3s;
    visibility: hidden;
    z-index: var(--devsite-sticky-nav-zindex,100)
}

devsite-sticky-nav.devsite-sticky-nav-connected {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 1;
    visibility: visible
}

@media screen and (max-width: 840px) {
    devsite-sticky-nav,devsite-sticky-nav.devsite-sticky-nav-connected {
        display:none
    }
}

devsite-sticky-nav .devsite-sticky-nav {
    background-color: var(--devsite-sticky-nav-background-color,#5f6368);
    block-size: var(--devsite-sticky-nav-height);
    border-radius: var(--devsite-sticky-nav-border-radius,56px);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    inset-block: calc((var(--devsite-sticky-nav-height) + var(--devsite-sticky-nav-bottom-padding))*-1) 0;
    inset-inline-start: 0;
    max-width: 100%;
    padding: var(--devsite-sticky-nav-padding,6px);
    position: relative
}

devsite-sticky-nav .devsite-sticky-nav__item {
    border-radius: var(--devsite-sticky-nav-item-border-radius,56px);
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    list-style: none;
    margin: var(--devsite-sticky-nav-item-margin,0);
    padding-block:var(--devsite-sticky-nav-item-padding-block,0);padding-inline: var(--devsite-sticky-nav-item-padding-inline,24px);
    -webkit-transition: var(--devsite-sticky-nav-item-transition,background-color .2s);
    transition: var(--devsite-sticky-nav-item-transition,background-color .2s)
}

devsite-sticky-nav .devsite-sticky-nav__item a {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-sticky-nav-item-color,#bdc1c6);
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: var(--devsite-sticky-nav-item-anchor-min-height,36px);
    text-decoration: none;
    -webkit-transition: var(--devsite-sticky-nav-item-anchor-transition,color .2s);
    transition: var(--devsite-sticky-nav-item-anchor-transition,color .2s)
}

devsite-sticky-nav .devsite-sticky-nav__item a:hover {
    color: var(--devsite-sticky-nav-item-anchor-hover-color,#fff)
}

devsite-sticky-nav .devsite-sticky-nav__item.devsite-sticky-nav-item--active {
    background-color: var(--devsite-sticky-nav-item-active-background-color,#80868b)
}

devsite-sticky-nav .devsite-sticky-nav__item.devsite-sticky-nav-item--active a {
    color: var(--devsite-sticky-nav-item-anchor-active-color,#fff)
}

devsite-stripe-checkout .devsite-stripe-spinner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 15px
}

devsite-stripe-checkout iframe {
    height: 100%;
    border: 0
}

devsite-spinner.devsite-send-spinner {
    margin-left: 78px
}

#devsite-support-form-button-wrapper {
    height: 36px
}

.devsite-support-projects {
    position: relative
}

.devsite-support-projects .devsite-support-projects-placeholder {
    height: 36px;
    position: absolute
}

devsite-tabs {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: var(--devsite-tabs-height,48px);
    margin: var(--devsite-tabs-margin);
    position: relative;
    width: var(--devsite-tabs-width)
}

devsite-tabs[connected] {
    max-width: none
}

devsite-tabs .devsite-tabs-dropdown-toggle,devsite-tabs .devsite-tabs-overflow-button {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background: 0;
    border: 0;
    box-shadow: unset;
    -moz-box-sizing: unset;
    box-sizing: unset;
    color: unset;
    font: unset;
    height: unset;
    line-height: unset;
    margin: 0;
    outline: 0;
    padding: 0;
    pointer-events: unset;
    text-align: unset
}

devsite-tabs .devsite-tabs-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    inset: 0;
    overflow: hidden;
    position: absolute
}

[dir=ltr] devsite-tabs.lower-tabs .devsite-tabs-wrapper {
    left: var(--devsite-tabs-wrapper-x,0)
}

[dir=rtl] devsite-tabs.lower-tabs .devsite-tabs-wrapper {
    right: var(--devsite-tabs-wrapper-x,0)
}

devsite-tabs[no-overflow] .devsite-tabs-wrapper {
    overflow: auto
}

devsite-tabs.devsite-dropdown--open .devsite-tabs-wrapper,devsite-tabs.devsite-overflow-menu--open .devsite-tabs-wrapper {
    overflow: visible
}

devsite-tabs tab {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: relative
}

devsite-tabs tab>.devsite-tabs-content,devsite-tabs tab>.devsite-tabs-overflow-button,devsite-tabs tab>a {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font: var(--devsite-link-font,500 14px/20px var(--devsite-primary-font-family));
    letter-spacing: var(--devsite-link-letter-spacing,normal);
    margin: 0;
    padding: var(--devsite-link-padding,0 24px);
    text-transform: var(--devsite-link-text-transform,uppercase);
    -webkit-transition: color .2s;
    transition: color .2s;
    white-space: nowrap
}

devsite-tabs tab>.devsite-tabs-content,devsite-tabs tab>.devsite-tabs-content:focus,devsite-tabs tab>.devsite-tabs-content:hover,devsite-tabs tab>.devsite-tabs-overflow-button,devsite-tabs tab>.devsite-tabs-overflow-button:focus,devsite-tabs tab>.devsite-tabs-overflow-button:hover,devsite-tabs tab>a,devsite-tabs tab>a:focus,devsite-tabs tab>a:hover {
    text-decoration: none
}

devsite-tabs.upper-tabs tab a,devsite-tabs.upper-tabs tab button {
    font-weight: var(--devsite-upper-tab-font-weight,400);
    text-transform: none
}

devsite-tabs.upper-tabs tab>a,devsite-tabs.upper-tabs tab>button {
    color: var(--devsite-upper-tab-inactive,var(--devsite-secondary-text-color))
}

devsite-tabs.upper-tabs tab.devsite-active>a,devsite-tabs.upper-tabs tab.devsite-active>button {
    font-weight: 500
}

@media screen and (-ms-high-contrast:active),screen and (prefers-contrast:high) {
    devsite-tabs.upper-tabs tab.devsite-active>a,devsite-tabs.upper-tabs tab.devsite-active>button {
        color: inherit
    }
}

devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab.devsite-active>a,devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab.devsite-active>button {
    color: var(--devsite-upper-tab-active,var(--devsite-primary-text-color))
}

devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab.devsite-active>a:hover,devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab.devsite-active>button:hover {
    color: var(--devsite-upper-tab-active-hover,var(--devsite-upper-tab-active,var(--devsite-primary-text-color)))
}

devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab.devsite-active>a:focus,devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab.devsite-active>button:focus {
    color: var(--devsite-upper-tab-active-focus,var(--devsite-secondary-text-color))
}

devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab.devsite-active>a:after,devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab.devsite-active>button:after {
    border-color: var(--devsite-upper-tab-marker-color,var(--devsite-secondary-color,var(--devsite-primary-text-color)))
}

devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab.devsite-active>a:hover:after,devsite-tabs.upper-tabs>.devsite-tabs-wrapper>tab.devsite-active>button:hover:after {
    border-color: var(--devsite-upper-tab-marker-color-hover,var(--devsite-upper-tab-marker-color,var(--devsite-secondary-color,var(--devsite-primary-text-color))))
}

devsite-tabs tab.devsite-active>a:after,devsite-tabs tab>a:focus:after,devsite-tabs tab>a:hover:after {
    border-radius: var(--devsite-tab-marker-border-radius,0);
    border-top: var(--devsite-tab-marker-height,2px) solid transparent;
    bottom: 0;
    content: "";
    display: block;
    position: absolute
}

[dir=ltr] devsite-tabs tab.devsite-active>a:after,[dir=ltr] devsite-tabs tab>a:focus:after,[dir=ltr] devsite-tabs tab>a:hover:after {
    left: var(--devsite-tab-marker-position-x,0);
    right: var(--devsite-tab-marker-position-x-end,var(--devsite-tab-marker-position-x,0))
}

[dir=rtl] devsite-tabs tab.devsite-active>a:after,[dir=rtl] devsite-tabs tab>a:focus:after,[dir=rtl] devsite-tabs tab>a:hover:after {
    left: var(--devsite-tab-marker-position-x-end,var(--devsite-tab-marker-position-x,0));
    right: var(--devsite-tab-marker-position-x,0)
}

[dir=ltr] devsite-tabs tab>button:focus:after,[dir=ltr] devsite-tabs tab>button:hover:after {
    right: calc(24px + var(--devsite-tab-marker-position-x-end, var(--devsite-tab-marker-position-x, 0)))
}

[dir=rtl] devsite-tabs tab>button:focus:after,[dir=rtl] devsite-tabs tab>button:hover:after {
    left: calc(24px + var(--devsite-tab-marker-position-x-end, var(--devsite-tab-marker-position-x, 0)))
}

devsite-tabs tab .devsite-tabs-overflow-button,devsite-tabs tab.devsite-dropdown .devsite-tabs-content.devsite-tabs-dropdown-only,devsite-tabs tab.devsite-dropdown>a {
    padding-block:0;padding-inline:var(--devsite-dropdown-tab-padding-x,24px) 0;position: relative;
    z-index: 2
}

[dir=ltr] devsite-tabs tab.devsite-active.devsite-dropdown a:not(.devsite-tabs-dropdown-toggle):after,[dir=ltr] devsite-tabs tab.devsite-dropdown a:not(.devsite-tabs-dropdown-toggle):focus:after,[dir=ltr] devsite-tabs tab.devsite-dropdown a:not(.devsite-tabs-dropdown-toggle):hover:after {
    right: var(--devsite-tab-marker-inset-x,0)
}

[dir=rtl] devsite-tabs tab.devsite-active.devsite-dropdown a:not(.devsite-tabs-dropdown-toggle):after,[dir=rtl] devsite-tabs tab.devsite-dropdown a:not(.devsite-tabs-dropdown-toggle):focus:after,[dir=rtl] devsite-tabs tab.devsite-dropdown a:not(.devsite-tabs-dropdown-toggle):hover:after {
    left: var(--devsite-tab-marker-inset-x,0)
}

devsite-tabs.upper-tabs tab.devsite-dropdown .devsite-tabs-dropdown a {
    font-weight: var(--devsite-upper-tab-dropdown-link-font-weight)
}

devsite-tabs.upper-tabs tab.devsite-dropdown .devsite-tabs-dropdown a,devsite-tabs.upper-tabs tab.devsite-dropdown .devsite-tabs-dropdown a:visited {
    color: var(--devsite-upper-tab-dropdown-link,var(--devsite-primary-text-color))
}

devsite-tabs.upper-tabs tab.devsite-dropdown .devsite-tabs-dropdown a:focus,devsite-tabs.upper-tabs tab.devsite-dropdown .devsite-tabs-dropdown a:hover {
    color: var(--devsite-upper-tab-dropdown-link-hover,var(--devsite-secondary-text-color))
}

devsite-tabs.upper-tabs tab.devsite-dropdown .devsite-tabs-dropdown a:focus .devsite-nav-item-title,devsite-tabs.upper-tabs tab.devsite-dropdown .devsite-tabs-dropdown a:hover .devsite-nav-item-title {
    -webkit-text-decoration: var(--devsite-nav-item-title-text-decoration-hover,none);
    -moz-text-decoration: var(--devsite-nav-item-title-text-decoration-hover,none);
    text-decoration: var(--devsite-nav-item-title-text-decoration-hover,none)
}

devsite-tabs.upper-tabs tab.devsite-dropdown .devsite-nav-item-description {
    color: var(--devsite-upper-tab-dropdown-description,var(--devsite-secondary-text-color));
    font-weight: var(--devsite-upper-tab-dropdown-description-font-weight);
    margin: var(--devsite-upper-tab-dropdown-description-margin)
}

devsite-tabs .devsite-tabs-dropdown-content {
    border-top: var(--devsite-header-border,0)
}

devsite-tabs.lower-tabs tab.devsite-dropdown .devsite-tabs-dropdown-content,devsite-tabs.lower-tabs tab.devsite-overflow-tab .devsite-tabs-overflow-menu,devsite-tabs.upper-tabs tab.devsite-dropdown .devsite-tabs-dropdown-content,devsite-tabs.upper-tabs tab.devsite-overflow-tab .devsite-tabs-overflow-menu {
    border-radius: var(--devsite-upper-tab-dropdown-corner-radius,0)
}

devsite-tabs.upper-tabs tab.devsite-dropdown .devsite-tabs-dropdown-only:before,devsite-tabs.upper-tabs tab.devsite-dropdown .devsite-tabs-dropdown-toggle:before,devsite-tabs.upper-tabs tab.devsite-dropdown .devsite-tabs-overflow-button:before {
    color: var(--devsite-upper-tab-dropdown-inactive,var(--devsite-upper-tab-inactive,var(--devsite-secondary-text-color)))
}

devsite-tabs.upper-tabs tab.devsite-active.devsite-dropdown .devsite-tabs-dropdown-toggle:before {
    color: var(--devsite-upper-tab-dropdown-active,var(--devsite-upper-tab-active,var(--devsite-primary-text-color)))
}

devsite-tabs tab.devsite-dropdown .devsite-tabs-dropdown-toggle {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding-block:0;padding-inline:0 var(--devsite-dropdown-toggle-padding-x,0)}

devsite-tabs tab.devsite-dropdown .devsite-tabs-dropdown-toggle: before,devsite-tabs tab.devsite-dropdown .devsite-tabs-overflow-button:before,devsite-tabs.tab.devsite-dropdown .devsite-tabs-dropdown-only:before,devsite-tabs.upper-tabs .devsite-tabs-overflow-button:before {
    height:24px;
    margin: auto;
    overflow: hidden;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: background .2s,color .2s,-webkit-transform .2s;
    transition: background .2s,color .2s,-webkit-transform .2s;
    transition: background .2s,color .2s,transform .2s;
    transition: background .2s,color .2s,transform .2s,-webkit-transform .2s;
    width: 24px
}

devsite-tabs tab .devsite-tabs-overflow-button:focus:before,devsite-tabs tab .devsite-tabs-overflow-button:hover:before,devsite-tabs tab.devsite-dropdown .devsite-tabs-dropdown-only:focus:before,devsite-tabs tab.devsite-dropdown .devsite-tabs-dropdown-only:hover:before,devsite-tabs tab.devsite-dropdown .devsite-tabs-dropdown-toggle:focus:before,devsite-tabs tab.devsite-dropdown .devsite-tabs-dropdown-toggle:hover:before {
    background: var(--devsite-tab-dropdown-hover,var(--devsite-background-3));
    border-radius: 50%
}

devsite-tabs .devsite-tabs-dropdown-only:hover:before,devsite-tabs .devsite-tabs-overflow-button:hover:before,devsite-tabs tab.devsite-dropdown--open .devsite-tabs-dropdown-toggle:before {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

devsite-tabs tab.devsite-overflow-tab {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    position: relative
}

devsite-tabs tab.devsite-overflow-tab.devsite-collapsed {
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0
}

devsite-tabs.upper-tabs tab.devsite-overflow-tab:after {
    content: "";
    height: 48px;
    position: absolute;
    z-index: -1
}

[dir=ltr] devsite-tabs.upper-tabs tab.devsite-overflow-tab:after {
    left: -6px;
    right: -100%
}

[dir=rtl] devsite-tabs.upper-tabs tab.devsite-overflow-tab:after {
    left: -100%;
    right: -6px
}

devsite-tabs tab.devsite-overflow-tab tab>a {
    padding: var(--devsite-overflow-tab-padding,0 24px)
}

devsite-tabs tab.devsite-dropdown .devsite-tabs-dropdown-only,devsite-tabs tab.devsite-overflow-tab .devsite-tabs-overflow-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -moz-box-orient: horizontal;
    -moz-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    height: inherit;
    position: relative
}

devsite-tabs tab.devsite-overflow-tab tab .devsite-tabs-dropdown,devsite-tabs tab.devsite-overflow-tab tab .devsite-tabs-dropdown-toggle {
    display: none
}

devsite-tabs tab.devsite-overflow-tab .devsite-tabs-overflow-menu {
    background: var(--devsite-overflow-menu-background,var(--devsite-background-1));
    border-radius: var(--devsite-overflow-menu-border-radius,2px);
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-height: 320px;
    overflow-y: auto;
    padding: 16px 0;
    position: absolute;
    top: var(--devsite-overflow-menu-top,-16px);
    z-index: 1005
}

devsite-tabs.upper-tabs tab.devsite-overflow-tab .devsite-tabs-overflow-menu {
    border-radius: 0 0 2px 2px;
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color),inset 0 4px 6px -4px var(--devsite-elevation-inset-shadow-color);
    top: 48px;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s,-webkit-transform .2s;
    z-index: -1
}

devsite-tabs.upper-tabs .devsite-tabs-overflow-menu .devsite-tabs-dropdown-toggle {
    display: none!important
}

devsite-tabs tab.devsite-overflow-tab .devsite-tabs-overflow-menu tab a {
    background: var(--devsite-background-1);
    color: var(--devsite-secondary-text-color);
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: 48px
}

devsite-tabs tab.devsite-overflow-tab .devsite-tabs-overflow-menu tab a:focus,devsite-tabs tab.devsite-overflow-tab .devsite-tabs-overflow-menu tab a:hover {
    background: var(--devsite-background-3);
    color: var(--devsite-primary-text-color)
}

devsite-tabs .devsite-tabs-dropdown {
    display: block;
    font-size: 13px;
    left: -6px;
    min-width: calc(100% + 12px);
    outline: 0;
    overflow: hidden;
    padding: 0 6px 6px;
    position: absolute;
    top: 100%;
    z-index: -1
}

[dir=rtl] devsite-tabs .devsite-tabs-dropdown {
    right: -6px;
    left: auto
}

devsite-tabs .devsite-dropdown-full .devsite-tabs-dropdown {
    left: 0;
    padding: var(--devsite-dropdown-full-padding,0 0 6px);
    width: var(--devsite-dropdown-full-width,100vw)
}

[dir=rtl] devsite-tabs .devsite-dropdown-full .devsite-tabs-dropdown {
    left: auto;
    right: 0
}

devsite-tabs .devsite-tabs-dropdown-content {
    background-color: var(--devsite-background-1);
    display: var(--devsite-dropdown-content-display,flex);
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color),inset 0 4px 6px -4px var(--devsite-elevation-inset-shadow-color);
    grid-template-columns: var(--devsite-dropdown-content-grid-template-columns,none);
    grid-template-rows: var(--devsite-dropdown-content-grid-template-rows,none);
    overflow: auto;
    max-height: 600px;
    max-width: 100vw;
    padding: var(--devsite-dropdown-content-padding,0 12px);
    -webkit-transform: translate3d(0,-150%,0);
    transform: translate3d(0,-150%,0);
    -webkit-transition: -webkit-transform 0s;
    transition: -webkit-transform 0s;
    transition: transform 0s;
    transition: transform 0s,-webkit-transform 0s;
    white-space: nowrap
}

devsite-tabs .devsite-tabs-dropdown.devsite-dropdown-transition .devsite-tabs-dropdown-content {
    -webkit-transition: -webkit-transform .5s;
    transition: -webkit-transform .5s;
    transition: transform .5s;
    transition: transform .5s,-webkit-transform .5s
}

devsite-tabs tab.devsite-dropdown--open .devsite-tabs-dropdown-content {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

devsite-tabs .devsite-tabs-dropdown-column {
    background: var(--devsite-dropdown-column-background,none);
    border-top: var(--devsite-dropdown-column-border-top,0);
    -moz-box-sizing: var(--devsite-dropdown-column-box-sizing,inherit);
    box-sizing: var(--devsite-dropdown-column-box-sizing,inherit);
    display: var(--devsite-dropdown-column-display);
    margin: var(--devsite-dropdown-column-margin,0);
    max-width: var(--devsite-dropdown-column-max-width,none);
    min-width: var(--devsite-dropdown-column-min-width,180px);
    padding: var(--devsite-dropdown-column-padding,0)
}

devsite-tabs .devsite-dropdown-full .devsite-tabs-dropdown-column {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    grid-row: var(--devsite-dropdown-column-grid-row,auto);
    min-width: 0
}

devsite-tabs .devsite-tabs-dropdown-section {
    list-style: none;
    margin: var(--devsite-dropdown-section-margin,0);
    padding: var(--devsite-dropdown-section-padding,0 12px)
}

devsite-tabs .devsite-tabs-dropdown-section:first-child {
    margin: var(--devsite-dropdown-first-section-margin,18px 0 0)
}

devsite-tabs .devsite-tabs-dropdown-section:not(:first-child) {
    margin-top: 54px
}

devsite-tabs tab.devsite-dropdown .devsite-nav-item,devsite-tabs tab.devsite-dropdown .devsite-nav-title {
    line-height: 18px;
    margin: var(--devsite-nav-text-margin,0 0 18px)
}

devsite-tabs tab.devsite-dropdown .devsite-nav-title {
    border-bottom: var(--devsite-nav-title-border-bottom,0);
    color: var(--devsite-nav-title-color,var(--devsite-secondary-text-color));
    font: var(--devsite-nav-title-font,inherit);
    font-weight: var(--devsite-nav-title-font-weight,700);
    outline: none;
    padding: var(--devsite-nav-title-padding,0);
    text-transform: var(--devsite-nav-title-transform,none);
    white-space: var(--devsite-nav-title-white-space)
}

devsite-tabs tab.devsite-dropdown .devsite-nav-item-title {
    display: var(--devsite-nav-item-title-display,block);
    font: var(--devsite-nav-item-title-font,inherit);
    letter-spacing: var(--devsite-nav-item-title-letter-spacing,normal);
    line-height: var(--devsite-nav-item-title-line-height,inherit);
    margin: var(--devsite-nav-item-title-margin,0)
}

devsite-tabs .devsite-dropdown-full .devsite-nav-item>a,devsite-tabs .devsite-dropdown-full .devsite-nav-title {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal
}

devsite-tabs tab.devsite-dropdown .devsite-nav-description,devsite-tabs tab.devsite-dropdown .devsite-nav-item-description {
    font: var(--devsite-nav-description-font,inherit);
    font-size: var(--devsite-nav-description-font-size,inherit);
    line-height: var(--devsite-nav-description-line-height,inherit)
}

devsite-tabs tab.devsite-dropdown .devsite-nav-description {
    color: var(--devsite-nav-description-color,inherit);
    display: var(--devsite-nav-description-display,inherit);
    margin: var(--devsite-nav-description-margin,12px 0);
    white-space: var(--devsite-nav-description-white-space,inherit)
}

devsite-tabs tab.devsite-dropdown .devsite-nav-item-description {
    color: var(--devsite-secondary-text-color);
    padding: var(--devsite-padding,0);
    white-space: normal
}

body[theme] devsite-tabs .devsite-tabs-dropdown a,body[theme] devsite-tabs .devsite-tabs-dropdown a:visited {
    color: var(--devsite-primary-text-color);
    display: var(--devsite-dropdown-link-display,block);
    font-weight: 400
}

body[theme] devsite-tabs .devsite-tabs-dropdown a:focus,body[theme] devsite-tabs .devsite-tabs-dropdown a:hover {
    color: var(--devsite-link-color)
}

devsite-tabs.devsite-render-hidden {
    width: 100%
}

devsite-tabs tab.devsite-overflow-tab.devsite-render-hidden,devsite-tabs.devsite-render-hidden tab.devsite-overflow-tab {
    -webkit-box-flex: 0;
    -webkit-flex: none;
    -moz-box-flex: 0;
    -ms-flex: none;
    flex: none
}

devsite-tabs tab.devsite-dropdown .devsite-tabs-close-button {
    color: var(--devsite-primary-text-color);
    cursor: pointer;
    font-size: 18px;
    height: 30px;
    line-height: 24px;
    min-width: 24px;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
    visibility: hidden;
    z-index: 1
}

devsite-tabs tab.devsite-dropdown .devsite-tabs-close-button:focus,devsite-tabs tab.devsite-dropdown .devsite-tabs-close-button:hover {
    background: 0;
    box-shadow: none;
    color: var(--devsite-link-color)
}

devsite-tabs tab.devsite-dropdown--open .devsite-tabs-close-button {
    visibility: visible
}

devsite-targeted-hero {
    display: block;
    min-height: 24rem;
    position: relative;
    --devsite-skeleton-background-color: #e8eaed;
    --devsite-skeleton-border-radius: 4px
}

.devsite-targeted-hero .devsite-landing-row-item-body h2,devsite-targeted-hero .devsite-landing-row-item-body h2 {
    margin-bottom: 16px;
    --devsite-h1-font: 700 66px/74px "Google Sans";
    --devsite-h1-margin: 0 0 16px
}

.devsite-targeted-hero .devsite-landing-row-item-description-content,devsite-targeted-hero .devsite-landing-row-item-description-content {
    margin-bottom: 16px
}

.devsite-targeted-hero .devsite-landing-row-item-description-content p,devsite-targeted-hero .devsite-landing-row-item-description-content p {
    color: #3c4043;
    font: 400 20px/32px Google Sans;
    margin: 0 0 8px;
    max-width: 480px
}

.devsite-targeted-hero .devsite-landing-row-item-buttons,devsite-targeted-hero .devsite-landing-row-item-buttons {
    margin-top: 0;
    --devsite-landing-row-hero-buttons-padding-top: 0
}

.devsite-targeted-hero .devsite-landing-row-item-media,devsite-targeted-hero .devsite-landing-row-item-media {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 25rem
}

.devsite-targeted-hero .devsite-landing-row-item-media img,devsite-targeted-hero .devsite-landing-row-item-media img {
    display: block;
    max-width: 100%;
    height: auto;
    max-height: 24rem;
    object-fit: contain
}

.hero-dynamic-container,devsite-targeted-hero>:not(.hero-dynamic-container) {
    display: none;
    opacity: 0
}

devsite-targeted-hero.state-show-dynamic>:not(.hero-dynamic-container) {
    display: none
}

devsite-targeted-hero.state-show-dynamic .hero-dynamic-container,devsite-targeted-hero.state-show-fallback>:not(.hero-dynamic-container) {
    display: block;
    -webkit-animation: fadeIn .3s ease-in-out forwards;
    animation: fadeIn .3s ease-in-out forwards
}

devsite-targeted-hero.state-loading>:not(.hero-dynamic-container) {
    display: block;
    opacity: 1
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes shimmer {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }

    to {
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
}

devsite-targeted-hero.state-loading .devsite-landing-row-item-description-content p,devsite-targeted-hero.state-loading .devsite-landing-row-item-media img {
    visibility: hidden
}

devsite-targeted-hero.state-loading .devsite-landing-row-item-body h2,devsite-targeted-hero.state-loading .devsite-landing-row-item-buttons a.button,devsite-targeted-hero.state-loading .devsite-landing-row-item-media {
    position: relative;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none;
    color: transparent
}

devsite-targeted-hero.state-loading .devsite-landing-row-item-body h2:after,devsite-targeted-hero.state-loading .devsite-landing-row-item-buttons a.button:after,devsite-targeted-hero.state-loading .devsite-landing-row-item-media:after {
    content: "";
    position: absolute;
    inset: 0;
    background: -webkit-gradient(linear,left top,right top,from(transparent),color-stop(50%,#fff),to(transparent));
    background: -webkit-linear-gradient(left,transparent,#fff 50%,transparent);
    background: linear-gradient(90deg,transparent 0,#fff 50%,transparent);
    opacity: .6;
    -webkit-animation: shimmer 1.5s linear infinite;
    animation: shimmer 1.5s linear infinite;
    z-index: 2;
    border-radius: var(--devsite-skeleton-border-radius)
}

devsite-targeted-hero.state-loading .devsite-landing-row-item-body h2:before,devsite-targeted-hero.state-loading .devsite-landing-row-item-buttons a.button:before,devsite-targeted-hero.state-loading .devsite-landing-row-item-media:before {
    content: "";
    position: absolute;
    inset: 0;
    background-color: var(--devsite-skeleton-background-color);
    border-radius: var(--devsite-skeleton-border-radius);
    z-index: 1
}

devsite-targeted-hero.state-loading .devsite-landing-row-item-description-content {
    position: relative;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none
}

devsite-targeted-hero.state-loading .devsite-landing-row-item-description-content:after {
    content: "";
    position: absolute;
    inset: 0;
    background: -webkit-gradient(linear,left top,right top,from(transparent),color-stop(50%,#fff),to(transparent));
    background: -webkit-linear-gradient(left,transparent,#fff 50%,transparent);
    background: linear-gradient(90deg,transparent 0,#fff 50%,transparent);
    opacity: .6;
    -webkit-animation: shimmer 1.5s linear infinite;
    animation: shimmer 1.5s linear infinite;
    z-index: 2;
    border-radius: var(--devsite-skeleton-border-radius)
}

devsite-targeted-hero.state-loading .devsite-landing-row-item-description-content:before {
    content: "";
    position: absolute;
    inset: 6px 0 0 0;
    border-radius: var(--devsite-skeleton-border-radius);
    --line-height: 20px;
    --line-gap: 12px;
    background-image: -webkit-gradient(linear,left top,right top,color-stop(100%,var(--devsite-skeleton-background-color)),to(transparent)),-webkit-gradient(linear,left top,right top,color-stop(100%,var(--devsite-skeleton-background-color)),to(transparent)),-webkit-gradient(linear,left top,right top,color-stop(75%,var(--devsite-skeleton-background-color)),color-stop(75%,transparent));
    background-image: -webkit-linear-gradient(left,var(--devsite-skeleton-background-color) 100%,transparent 100%),-webkit-linear-gradient(left,var(--devsite-skeleton-background-color) 100%,transparent 100%),-webkit-linear-gradient(left,var(--devsite-skeleton-background-color) 75%,transparent 75%);
    background-image: linear-gradient(to right,var(--devsite-skeleton-background-color) 100%,transparent 100%),linear-gradient(to right,var(--devsite-skeleton-background-color) 100%,transparent 100%),linear-gradient(to right,var(--devsite-skeleton-background-color) 75%,transparent 75%);
    background-size: 100% var(--line-height);
    background-repeat: no-repeat;
    background-position: 0 0,0 calc(var(--line-height) + var(--line-gap)),0 calc((var(--line-height) + var(--line-gap))*2);
    min-height: calc(var(--line-height)*3 + var(--line-gap)*2);
    z-index: 1
}

devsite-targeted-hero.state-loading .devsite-landing-row-item-body h2:before {
    inset: 10px 0 12px 0
}

@media screen and (max-width: 1200px) {
    .devsite-targeted-hero,devsite-targeted-hero {
        min-height:20rem
    }

    .devsite-targeted-hero .devsite-landing-row-item-body h2,devsite-targeted-hero .devsite-landing-row-item-body h2 {
        --devsite-h1-font: 700 40px/45px "Google Sans"
    }

    devsite-targeted-hero.state-loading .devsite-landing-row-item-body h2:before {
        inset: 6px 0
    }

    devsite-targeted-hero.state-loading .devsite-landing-row-item-media:before {
        height: auto;
        margin-block:auto;max-height: 20rem
    }
}

@media screen and (max-width: 850px) {
    .devsite-targeted-hero,devsite-targeted-hero {
        min-height:18rem
    }

    .devsite-targeted-hero .devsite-landing-row-item-body h2,devsite-targeted-hero .devsite-landing-row-item-body h2 {
        --devsite-h1-font: 700 32px/36px "Google Sans"
    }

    devsite-targeted-hero.state-loading .devsite-landing-row-item-body h2:before {
        inset: 6px 0 4px 0
    }
}

@media screen and (max-width: 600px) {
    .devsite-targeted-hero,devsite-targeted-hero {
        min-height:30rem
    }

    .devsite-targeted-hero .devsite-landing-row-item-media,devsite-targeted-hero .devsite-landing-row-item-media {
        min-height: auto;
        -webkit-padding-before: 20px;
        padding-block-start:20px}

    devsite-targeted-hero.state-loading .devsite-landing-row-item-media:before {
        inset: 20px 0 0 0
    }

    .devsite-targeted-hero .devsite-landing-row-item-media img,devsite-targeted-hero .devsite-landing-row-item-media img {
        max-height: 20rem
    }
}

@media screen and (max-width: 320px) {
    .devsite-targeted-hero,devsite-targeted-hero {
        min-height:20rem
    }

    .devsite-targeted-hero .devsite-landing-row-item-media,devsite-targeted-hero .devsite-landing-row-item-media {
        display: none
    }
}

devsite-thumb-rating {
    display: block
}

devsite-thumb-rating[position=footer] {
    text-align: center
}

devsite-thumb-rating .devsite-thumb-rating {
    border-radius: 4px;
    display: grid;
    grid-gap: 0 8px;
    grid-template-areas: "label thumbs";
    grid-template-columns: auto 1fr
}

devsite-thumb-rating .devsite-thumb-label {
    font-size: 13px;
    grid-area: label
}

devsite-thumb-rating .devsite-thumbs {
    grid-area: thumbs
}

devsite-thumb-rating[position=header] .devsite-thumbs,devsite-thumb-rating[position=main] .devsite-thumbs {
    margin: -3px 0
}

devsite-thumb-rating .devsite-thumb {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: 0;
    border: 0;
    border-radius: 50%;
    box-shadow: none;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    fill: var(--devsite-secondary-text-color);
    height: 30px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-width: 30px;
    padding: 0;
    width: 30px
}

devsite-thumb-rating .devsite-thumb:focus,devsite-thumb-rating .devsite-thumb:hover {
    background: var(--devsite-background-3)
}

devsite-thumb-rating .devsite-thumb+.devsite-thumb {
    margin: 0
}

devsite-thumb-rating[rating=down] .devsite-thumb-down,devsite-thumb-rating[rating=up] .devsite-thumb-up {
    fill: var(--devsite-link-color)
}

devsite-thumb-rating[rating=down] .devsite-thumb-down:focus,devsite-thumb-rating[rating=down] .devsite-thumb-down:hover,devsite-thumb-rating[rating=up] .devsite-thumb-up:focus,devsite-thumb-rating[rating=up] .devsite-thumb-up:hover {
    background: var(--devsite-link-background-active)
}

devsite-thumb-rating .devsite-thumb-icon {
    -webkit-box-flex: 0;
    -webkit-flex: none;
    -moz-box-flex: 0;
    -ms-flex: none;
    flex: none;
    height: 18px;
    pointer-events: none;
    width: 18px
}

devsite-thumb-rating[position=footer] .devsite-thumb-rating {
    display: block;
    margin-top: 24px
}

.devsite-thumb-rating-dialog {
    position: relative
}

.devsite-thumb-rating-dialog .devsite-thumb-rating-categories {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.devsite-thumb-rating-dialog .devsite-thumb-rating-category {
    padding-bottom: 12px
}

[dir=ltr] .devsite-thumb-rating-dialog h3 {
    text-align: left
}

[dir=rtl] .devsite-thumb-rating-dialog h3 {
    text-align: right
}

.devsite-thumb-rating-dialog h3:only-child {
    margin-bottom: 8px
}

.devsite-thumb-rating-dialog .devsite-dialog-buttons {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: 0 16px 16px
}

.devsite-thumb-rating-dialog .devsite-feedback-icon {
    fill: currentColor;
    top: 0
}

[dir=ltr] .button+devsite-feedback[position=thumb-rating] {
    margin-left: 16px
}

[dir=rtl] .button+devsite-feedback[position=thumb-rating] {
    margin-right: 16px
}

devsite-feedback[position=header] {
    margin-top: 7px
}

devsite-feedback[position=footer] {
    display: block;
    margin-top: 8px;
    text-align: center
}

.devsite-thumb-rating-dialog .devsite-dialog-contents {
    color: var(--devsite-primary-text-color)
}

.devsite-thumb-rating-dialog input+label {
    font-size: 14px
}

.devsite-thumb-rating-dialog .account-note {
    color: var(--devsite-secondary-text-color);
    font: 400 12px/16px var(--devsite-primary-font-family);
    letter-spacing: .3px
}

.devsite-thumb-rating-dialog .create-profile-spinner {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: hsla(0,0%,100%,.8);
    bottom: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: opacity .3s cubic-bezier(.4,0,.2,1);
    transition: opacity .3s cubic-bezier(.4,0,.2,1);
    z-index: 10
}

.devsite-thumb-rating-dialog.loading .create-profile-spinner {
    opacity: 1
}

@media screen and (max-width: 600px) {
    devsite-thumb-rating[position=header] .devsite-thumb-rating {
        margin:16px 0 8px
    }

    devsite-thumb-rating[position=main] .devsite-thumb-rating {
        margin: 8px 0
    }

    devsite-thumb-rating[position=footer] .devsite-thumb-rating {
        margin-bottom: 24px
    }
}

devsite-toc.devsite-toc {
    overflow: auto;
    width: 160px
}

devsite-toc>.devsite-nav-list {
    -webkit-border-start: var(--devsite-toc-border-width,4px) solid var(--devsite-toc-border,var(--devsite-primary-color));
    -moz-border-start: var(--devsite-toc-border-width,4px) solid var(--devsite-toc-border,var(--devsite-primary-color));
    border-inline-start:var(--devsite-toc-border-width,4px) solid var(--devsite-toc-border,var(--devsite-primary-color));width: 160px
}

.devsite-sidebar[fixed] devsite-toc>.devsite-nav-list {
    -webkit-padding-end: 8px;
    -moz-padding-end: 8px;
    padding-inline-end:8px}

devsite-toc>.devsite-nav-list>:first-child>.devsite-nav-title {
    padding-top: 0
}

devsite-toc>.devsite-nav-list>:last-child>.devsite-nav-list>:last-child>.devsite-nav-title:last-child,devsite-toc>.devsite-nav-list>:last-child>.devsite-nav-title:only-child {
    padding-bottom: 0
}

devsite-toc .devsite-nav-list {
    -webkit-padding-start: var(--devsite-nav-list-padding-x-start,12px);
    -moz-padding-start: var(--devsite-nav-list-padding-x-start,12px);
    padding-inline-start:var(--devsite-nav-list-padding-x-start,12px)}

devsite-toc .devsite-nav-list .devsite-nav-list .devsite-nav-title {
    color: var(--devsite-nav-title-nested-color,var(--devsite-nav-title-color,var(--devsite-primary-text-color)))
}

devsite-toc .devsite-nav-list .devsite-nav-list .devsite-nav-title:focus,devsite-toc .devsite-nav-list .devsite-nav-list .devsite-nav-title:hover {
    color: var(--devsite-nav-nested-color-hover,var(--devsite-nav-color-hover,var(--devsite-link-color)))
}

devsite-toc .devsite-nav-list .devsite-nav-list .devsite-nav-active {
    color: var(--devsite-nav-color-active,var(--devsite-link-color-active,var(--devsite-link-color)))
}

devsite-toc.devsite-toc-embedded {
    display: none
}

devsite-toc.devsite-toc-embedded>.devsite-nav-list {
    width: auto
}

devsite-toc.devsite-toc-embedded .devsite-nav-item {
    display: none
}

devsite-toc.devsite-toc-embedded .devsite-nav-item[visible],devsite-toc.devsite-toc-embedded[expanded] .devsite-nav-item {
    display: block
}

devsite-toc.devsite-toc-embedded .devsite-nav-item.devsite-toc-toggle,devsite-toc.devsite-toc-embedded[expanded] .devsite-nav-item.devsite-toc-toggle {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-toc .devsite-nav-more-items,devsite-toc .devsite-nav-show-all {
    display: none
}

devsite-toc[expandable] .devsite-nav-more-items,devsite-toc[expandable] .devsite-nav-show-all {
    color: var(--devsite-secondary-text-color);
    display: block;
    height: 24px;
    padding: 0
}

devsite-toc .devsite-nav-show-all {
    margin: var(--devsite-nav-show-all-icon-margin,-4px 0 0 4px);
    min-width: 20px
}

devsite-toc .devsite-nav-show-all:before {
    content: "expand_more"
}

devsite-toc .devsite-nav-more-items {
    margin-bottom: -8px;
    min-width: 0
}

devsite-toc .devsite-nav-more-items:before {
    content: "more_horiz"
}

devsite-toc[expanded] .devsite-nav-more-items:before,devsite-toc[expanded] .devsite-nav-show-all:before {
    content: "expand_less"
}

devsite-toc .devsite-toc-toggle {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0
}

devsite-toc .devsite-show-apix {
    margin-top: 12px
}

@media screen and (max-width: 1253px) {
    devsite-toc.devsite-toc,devsite-toc[visible].devsite-toc {
        display:none
    }

    devsite-toc.devsite-toc-embedded:not(:empty) {
        display: block;
        margin: 28px 0 24px
    }

    devsite-toc.devsite-toc-embedded:not(:empty)~.devsite-article-body>:first-child {
        margin-top: 0
    }

    body[template=landing] devsite-toc.devsite-toc-embedded:not(:empty) {
        margin: 20px 40px 24px
    }
}

@media screen and (max-width: 1550px) {
    body[layout][concierge] .devsite-main-content[has-book-nav] devsite-toc.devsite-toc {
        display:none
    }

    body[layout][concierge][template=landing] .devsite-main-content[has-book-nav] devsite-toc.devsite-toc-embedded:not(:empty) {
        margin: 20px 40px 24px
    }

    body[layout][concierge] .devsite-main-content[has-book-nav] devsite-toc.devsite-toc-embedded:not(:empty) {
        display: block;
        margin: 28px 0 24px
    }

    body[layout][concierge] .devsite-main-content[has-book-nav] devsite-toc.devsite-toc-embedded:not(:empty)~.devsite-article-body>:first-child {
        margin-top: 0
    }

    body[layout][concierge][template=landing] devsite-toc.devsite-toc-embedded:not(:empty) {
        margin: 20px 40px 24px
    }
}

@media screen and (max-width: 1400px) {
    body[layout][concierge] .devsite-main-content devsite-toc.devsite-toc {
        display:none
    }

    body[layout][concierge] .devsite-main-content devsite-toc.devsite-toc-embedded:not(:empty) {
        display: block
    }

    body[layout][concierge][template=landing] .devsite-main-content devsite-toc.devsite-toc-embedded:not(:empty) {
        margin: 20px 40px 24px
    }
}

@media screen and (max-width: 840px) {
    body[template=landing] devsite-toc.devsite-toc-embedded:not(:empty) {
        margin:20px 24px 24px
    }
}

@media screen and (max-width: 600px) {
    body[template=landing] devsite-toc.devsite-toc-embedded:not(:empty) {
        margin:20px 16px 24px
    }
}

.devsite-tooltip-msg {
    border-radius: 2px;
    background: rgba(95,99,104,.9);
    color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font: 500 10px/10px var(--devsite-primary-font-family);
    margin: 8px 0;
    max-width: 300px;
    opacity: 1;
    padding: 6px 8px;
    position: fixed;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 1020
}

devsite-topic {
    display: block
}

devsite-topic .devsite-topic--inner {
    max-width: 936px;
    padding: 0 40px;
    margin: 0 auto
}

devsite-topic .devsite-topic--header {
    background-color: var(--devsite-background-1);
    background-image: url(../images/devsite_topics_header.svg);
    background-repeat: no-repeat;
    background-position: top;
    background-size: 1440px auto;
    margin-bottom: 40px
}

devsite-topic .devsite-topic--header .devsite-topic--inner {
    padding-top: 168px
}

devsite-topic .devsite-topic--header h1 {
    margin: 0;
    top: auto;
    font-size: 36px;
    line-height: 44px;
    color: #202124;
    font-family: var(--devsite-headline-font-family)
}

devsite-topic .devsite-topic--header p {
    margin: 0;
    padding: 0;
    color: #202124;
    font-size: 18px;
    line-height: 24px;
    font-family: var(--devsite-headline-font-family)
}

devsite-topic .devsite-topic--header .jump-links {
    border-bottom: 1px solid #ddd;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-family: Google Sans;
    font-weight: 500;
    -ms-flex-pack: distribute;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    list-style: none;
    padding: 26px 0 0;
    width: 100%
}

devsite-topic .devsite-topic--header .jump-links a:after {
    content: "arrow_downward";
    font: normal normal normal 18px/18px Material Icons;
    margin-left: 8px;
    vertical-align: text-bottom
}

devsite-topic .devsite-topic--header .jump-links a {
    text-decoration: none!important
}

devsite-topic .devsite-topic--header .jump-links a:link,devsite-topic .devsite-topic--header .jump-links a:visited {
    color: #5f6368!important
}

devsite-topic .devsite-topic--header .jump-links a:focus,devsite-topic .devsite-topic--header .jump-links a:hover {
    color: #1a73e8!important
}

devsite-topic .devsite-topic--section {
    padding: 40px 0
}

devsite-topic .devsite-topic--section:nth-child(odd) {
    background: #f8f9fa
}

devsite-topic .devsite-topic--section:first-child() {
    background: none
}

devsite-topic .devsite-topic--section h2 {
    margin: 0;
    padding: 0;
    font-size: 32px;
    color: #202124;
    line-height: 40px;
    font-family: var(--devsite-headline-font-family)
}

devsite-topic .devsite-topic--section .devsite-topic-section-description {
    margin: 0;
    padding: 0;
    font-size: 16px;
    color: #3c4043;
    line-height: 24px;
    font-family: var(--devsite-primary-font-family);
    max-width: calc(66.6666666667% - 13.3333333333px)
}

devsite-topic .devsite-topic-section--row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 -12px;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

devsite-topic .devsite-topic-section--row .devsite-topic-section--card {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    min-width: 0;
    max-width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 0 12px 24px
}

devsite-topic .devsite-topic-section--row .devsite-topic-section--card .devsite-topic-section-card--title {
    font-size: 24px;
    color: #202124;
    line-height: 32px;
    font-family: var(--devsite-primary-font-family)
}

devsite-topic .devsite-topic-section--row .devsite-topic-section--card .devsite-topic-section-card--title a {
    color: #202124
}

devsite-topic .devsite-topic-section--row .devsite-topic-section--card .devsite-topic-section-card--description {
    font-size: 16px;
    color: #3c4043;
    letter-spacing: .1px;
    line-height: 24px;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

devsite-topic .devsite-topic-section-card--label {
    padding: 16px
}

devsite-topic .devsite-topic-section-card--label span {
    border-radius: 4px;
    padding: 2px 8px;
    font-family: var(--devsite-primary-font-family);
    font-size: 12px;
    color: rgba(0,0,0,.87);
    text-transform: uppercase
}

devsite-topic .devsite-topic-section--hero {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -moz-box-orient: horizontal;
    -moz-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

devsite-topic .devsite-topic-section--hero-media {
    margin-left: 12px
}

devsite-topic .devsite-topic-section--hero-media .devsite-landing-row-item-image {
    background: none
}

devsite-topic .devsite-topic-section--hero-description {
    margin-right: 12px
}

devsite-topic .devsite-topic-section--hero-description p.devsite-topic-section-description {
    max-width: 100%
}

devsite-topic .devsite-topic-section--hero-description,devsite-topic .devsite-topic-section--hero-media {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: calc(50% - 12px)
}

devsite-topic .devsite-topic-section--cards {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 24px;
    margin: 0 -12px;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

devsite-topic .devsite-topic-section--cards .devsite-topic-section--card {
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color);
    background: var(--devsite-background-1);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    min-width: 0;
    max-width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    border-radius: 4px;
    margin: 0 12px 24px;
    width: calc(50% - 24px)
}

devsite-topic .devsite-topic-section--cards .devsite-topic-section--card .devsite-topic-section-card--title {
    padding: 0 16px
}

devsite-topic .devsite-topic-section--cards .devsite-topic-section--card .devsite-topic-section-card--title a {
    font-family: var(--devsite-headline-font-family);
    font-size: 24px;
    color: #202124;
    line-height: 32px
}

devsite-topic .devsite-topic-section--cards .devsite-topic-section--card .devsite-topic-section-card--description {
    padding: 8px 16px 24px;
    border-bottom: 1px solid #ddd;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

devsite-topic .devsite-topic-section--cards .devsite-topic-section--card .devsite-topic-section-card--description p {
    font-size: 16px;
    color: #3c4043;
    line-height: 24px
}

devsite-topic .devsite-topic-section--cards .devsite-topic-section--card .devsite-topic-section-card--meta {
    padding: 16px 16px 12px;
    font-size: 12px;
    line-height: 16px
}

devsite-topic .devsite-topic-section--cards .devsite-topic-section--card .devsite-topic-section-card--meta-byline {
    color: #202124
}

devsite-topic .devsite-topic-section--cards .devsite-topic-section--card .devsite-topic-section-card--meta-date {
    color: #3c4043
}

devsite-topic .devsite-topic-section--cards .devsite-topic-section--card .devsite-topic-section-card--buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 12px 8px 8px
}

devsite-topic .devsite-topic-section--1-up .devsite-topic-section--card {
    width: calc(100% - 24px);
    margin-bottom: 0
}

devsite-topic .devsite-topic-section--2-up .devsite-topic-section--card {
    margin-bottom: 0
}

devsite-topic .devsite-topic-section--3-up .devsite-topic-section--card {
    width: calc(33% - 24px)
}

@media screen and (max-width: 840px) {
    devsite-topic .devsite-topic--inner {
        max-width:768px;
        padding: 0 40px
    }
}

@media screen and (max-width: 600px) {
    devsite-topic .devsite-topic--inner {
        max-width:100%;
        padding: 0 24px
    }

    devsite-topic .devsite-topic--section {
        padding: 24px 0
    }

    devsite-topic .devsite-topic--section .devsite-topic-section--card {
        width: calc(100% - 24px)
    }

    devsite-topic .devsite-topic-section--hero {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    devsite-topic .devsite-topic-section--hero-description,devsite-topic .devsite-topic-section--hero-media {
        margin: 0;
        width: 100%
    }

    devsite-topic .devsite-topic-section--hero-media {
        margin-bottom: 24px
    }
}

devsite-tracking-question {
    background-color: var(--devsite-background-3);
    display: block;
    padding: 8px
}

devsite-tracking-question .devsite-tracking-question-text {
    font-weight: 700
}

devsite-tracking-question .devsite-tracking-question-hidden {
    display: none
}

devsite-tracking-question .devsite-tracking-question-choice-button {
    background: var(--devsite-background-1);
    border-radius: 2px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);
    color: var(--devsite-primary-text-color);
    cursor: pointer;
    line-height: 50px;
    margin: 8px 0;
    padding: 0 20px;
    -webkit-transition: background .2s,box-shadow .2s;
    transition: background .2s,box-shadow .2s
}

devsite-tracking-question .devsite-tracking-question-choice-button:focus,devsite-tracking-question .devsite-tracking-question-choice-button:hover {
    background: #bdc1c6;
    box-shadow: 0 4px 8px 0 hsla(210,6%,63%,.5)
}

devsite-user {
    display: block;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

devsite-user[signed-in],devsite-user[signed-in].not-eligible {
    min-width: 44px
}

devsite-user[signed-in][enable-profiles] {
    min-width: 84px
}

devsite-user[signed-in][enable-profiles].not-eligible {
    min-width: 44px
}

devsite-user[signed-in][enable-profiles][fp-auth] {
    min-width: 88px
}

devsite-user[signed-in][enable-profiles][fp-auth].not-eligible {
    min-width: 44px
}

devsite-user #devsite-signin-btn {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    anchor-name: --devsite-user-button;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font: 500 14px/36px var(--devsite-primary-font-family)
}

devsite-user devsite-spinner {
    margin: 4px 8px 4px 20px
}

devsite-user devsite-spinner.hide {
    -webkit-animation-delay: .45s;
    animation-delay: .45s;
    opacity: 0;
    -webkit-transition: opacity .45s ease;
    transition: opacity .45s ease
}

devsite-user .ogb-wrapper {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    opacity: 1;
    -webkit-transition: opacity .2s cubic-bezier(.4,0,.2,1);
    transition: opacity .2s cubic-bezier(.4,0,.2,1)
}

@media (forced-colors:active) {
    devsite-user .ogb-wrapper {
        border: 1px solid ButtonText;
        border-radius: 4px
    }

    devsite-user .ogb-wrapper:focus-within,devsite-user .ogb-wrapper:hover {
        border-color: Highlight
    }
}

devsite-user .ogb-pending {
    opacity: 0
}

devsite-user .gb_Mb>.gb_Lb,devsite-user .gb_Nb>.gb_Mb,devsite-user .gb_Pd>.gb_Za,devsite-user .gb_Rb>.gb_Qb,devsite-user .gb_Sb>.gb_Rb {
    -moz-box-sizing: content-box;
    box-sizing: content-box
}

@media (-webkit-min-device-pixel-ratio: 1.25),(min-resolution:1.25dppx),not all {
    [dir=rtl] devsite-user .gb_xa:before {
        -webkit-transform-origin:right 0;
        transform-origin: right 0
    }
}

devsite-user .devsite-user-dialog {
    display: none
}

devsite-user .devsite-user-dialog a:link,devsite-user .devsite-user-dialog a:visited {
    text-decoration: none
}

devsite-user[dialog--open] .devsite-user-dialog {
    background-color: var(--devsite-user-dialog-background,var(--devsite-background-4));
    border-radius: 28px;
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
    color: var(--devsite-user-dialog-color,var(--devsite-primary-text-color));
    display: block;
    height: 380px;
    inset-inline-end: 32px;
    max-height: calc(100vh - 90px);
    outline: none;
    overflow: auto;
    -webkit-padding-before: 18px;
    padding-block-start:18px;padding-inline:16px;position: absolute;
    top: 66px;
    width: 412px
}

devsite-user .devsite-user-dialog svg {
    fill: var(--devsite-user-dialog-color,var(--devsite-primary-text-color))
}

devsite-user .devsite-user-dialog .devsite-user-dialog-exit {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: none;
    border-radius: 50%;
    border: 1px solid transparent;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    inset-inline-end: 8px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0;
    position: absolute;
    top: 8px;
    width: 40px
}

devsite-user .devsite-user-dialog .devsite-user-dialog-exit:focus,devsite-user .devsite-user-dialog .devsite-user-dialog-exit:hover {
    background-color: var(--devsite-background-2)
}

devsite-user .devsite-user-dialog .devsite-user-dialog-exit:active {
    background-color: var(--devsite-background-4)
}

devsite-user .devsite-user-dialog .devsite-user-dialog-exit:focus {
    border-color: var(--devsite-ogb-link-border-color)
}

devsite-user .devsite-user-dialog-photo,devsite-user .devsite-user-dialog-photo-thumbnail,devsite-user .devsite-user-dialog-toggle .devsite-user-dialog-letter {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0;
    overflow: hidden;
    padding: 0
}

devsite-user .devsite-user-dialog-signin {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 4px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 48px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 2px;
    width: 48px
}

devsite-user .devsite-user-dialog-signin:focus {
    background-color: var(--devsite-background-2);
    border: 1px solid #000
}

devsite-user .devsite-user-dialog .devsite-user-dialog-photo,devsite-user .devsite-user-dialog-signin .devsite-user-dialog-letter {
    background-color: var(--devsite-user-avatar-background,var(--devsite-background-color,var(--devsite-primary-color,var(--devsite-primary-text-color))));
    color: var(--devsite-user-avatar-color,var(--devsite-text-color,var(--devsite-inverted-text-color)))
}

devsite-user .devsite-user-dialog-toggle {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 32px;
    overflow: hidden;
    padding: 4px;
    text-decoration: none;
    width: 32px
}

devsite-user .devsite-user-dialog-toggle:focus {
    background-color: var(--devsite-link-background-active)
}

devsite-user .devsite-user-dialog-photo-thumbnail {
    height: 32px;
    width: 32px
}

devsite-user[js-signin] button {
    box-shadow: none
}

devsite-user[js-signin] .devsite-user-dialog-toggle {
    opacity: 0;
    -webkit-transition: opacity .45s ease;
    transition: opacity .45s ease
}

devsite-user[js-signin] .devsite-user-dialog-toggle.show {
    opacity: 1
}

devsite-user .devsite-user-dialog-toggle .devsite-user-dialog-letter {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 32px;
    -moz-box-flex: 0;
    -ms-flex: 0 0 32px;
    flex: 0 0 32px;
    font-size: 17px;
    height: 32px
}

devsite-user .devsite-user-dialog-learn-more {
    border-radius: 4px;
    font: 12px/16px var(--devsite-primary-font-family);
    height: 20px;
    text-align: center
}

devsite-user .devsite-user-dialog-learn-more a,devsite-user .devsite-user-dialog-learn-more span {
    font-weight: 500
}

devsite-user .devsite-user-dialog-learn-more a {
    border: 1px solid transparent;
    color: var(--devsite-secondary-text-color)
}

devsite-user .devsite-user-dialog-learn-more a:focus,devsite-user .devsite-user-dialog-learn-more a:hover {
    background-color: var(--devsite-background-2)
}

devsite-user .devsite-user-dialog-learn-more a:active {
    background-color: var(--devsite-background-4)
}

devsite-user .devsite-user-dialog-learn-more a:focus {
    border-color: var(--devsite-ogb-link-border-color)
}

devsite-user .devsite-user-dialog-photo {
    -webkit-margin-before: 22px;
    margin-block-start:22px;margin-inline:auto;position: relative
}

devsite-user .devsite-user-dialog-photo,devsite-user .devsite-user-dialog-photo-portrait {
    height: 80px;
    width: 80px
}

devsite-user .devsite-user-dialog-letter {
    text-transform: uppercase
}

devsite-user .devsite-user-dialog-photo .devsite-user-dialog-letter {
    font-size: 52px
}

devsite-user .devsite-user-dialog-email,devsite-user .devsite-user-dialog-name {
    overflow: hidden;
    text-overflow: ellipsis
}

devsite-user .devsite-user-dialog-name {
    color: var(--devsite-primary-text-color);
    font: 400 22px/28px var(--devsite-headline-font-family);
    letter-spacing: normal;
    margin: 8px 0;
    text-align: center
}

devsite-user .devsite-user-dialog-email {
    color: var(--devsite-primary-text-color);
    font: 500 14px/20px var(--devsite-headline-font-family);
    letter-spacing: normal;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis
}

devsite-user .devsite-user-dialog-details {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-user .devsite-user-manage {
    border-radius: 20px;
    border: 1px solid #80868b;
    font: 500 14px/20px var(--devsite-headline-font-family);
    height: 40px;
    letter-spacing: .25px;
    -webkit-margin-after: 16px;
    margin-block-end:16px;padding: 9px 23px;
    text-align: center;
    white-space: nowrap;
    width: auto
}

devsite-user .devsite-user-manage:link,devsite-user .devsite-user-manage:visited {
    color: var(--devsite-header-link-color,var(--devsite-secondary-text-rgba))
}

devsite-user .devsite-user-manage:focus,devsite-user .devsite-user-manage:hover {
    background-color: var(--devsite-ogb-manage-background-focus-color)
}

devsite-user .devsite-user-manage:focus {
    border-color: var(--devsite-ogb-link-border-color)
}

devsite-user .devsite-user-manage:active {
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color);
    background-color: var(--devsite-background-4);
    border-color: transparent
}

devsite-user .devsite-user-dialog-buttons {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 30px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 2px
}

devsite-user .devsite-user-dialog .developer-profile:link,devsite-user .devsite-user-dialog .developer-profile:visited,devsite-user .devsite-user-dialog .devsite-user-developer-profile:link,devsite-user .devsite-user-dialog .devsite-user-developer-profile:visited {
    color: var(--devsite-primary-text-color)
}

devsite-user .devsite-user-dialog .developer-profile:focus,devsite-user .devsite-user-dialog .developer-profile:hover,devsite-user .devsite-user-dialog .devsite-user-developer-profile:focus,devsite-user .devsite-user-dialog .devsite-user-developer-profile:hover {
    background-color: var(--devsite-background-2)
}

devsite-user .devsite-user-dialog .developer-profile:active,devsite-user .devsite-user-dialog .devsite-user-developer-profile:active {
    background-color: var(--devsite-background-4)
}

devsite-user .devsite-user-dialog-buttons>:first-child {
    border-top: var(--devsite-secondary-border)
}

devsite-user .devsite-user-dialog .devsite-user-signin,devsite-user .devsite-user-dialog .devsite-user-signout {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--devsite-background-1);
    border: 1px solid transparent;
    color: var(--devsite-primary-text-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font: 500 14px/16px var(--devsite-headline-font-family);
    gap: 8px;
    height: 60px;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    letter-spacing: .15px;
    padding: 0
}

devsite-user .devsite-user-dialog .devsite-user-signin:focus,devsite-user .devsite-user-dialog .devsite-user-signout:focus {
    border-color: var(--devsite-ogb-link-border-color)
}

devsite-user .devsite-user-dialog .devsite-user-signin:focus,devsite-user .devsite-user-dialog .devsite-user-signin:hover,devsite-user .devsite-user-dialog .devsite-user-signout:focus,devsite-user .devsite-user-dialog .devsite-user-signout:hover {
    background-color: var(--devsite-background-2)
}

devsite-user .devsite-user-dialog .devsite-user-signin:active,devsite-user .devsite-user-dialog .devsite-user-signout:active {
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 2px 6px 2px var(--devsite-elevation-ambient-shadow-color);
    background-color: var(--devsite-background-4);
    border-color: transparent
}

devsite-user .devsite-user-dialog .devsite-user-signin svg,devsite-user .devsite-user-dialog .devsite-user-signout svg {
    -webkit-margin-start: 16px;
    -moz-margin-start: 16px;
    margin-inline-start:16px}

devsite-user .devsite-user-dialog .devsite-user-signin {
    border-end-start-radius: 30px;
    border-start-start-radius: 30px
}

devsite-user .devsite-user-dialog .devsite-user-signin svg {
    background-color: var(--devsite-background-4);
    border-radius: 50%;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    fill: var(--devsite-header-link-color,var(--devsite-secondary-text-rgba));
    padding: 2px
}

devsite-user .devsite-user-dialog .devsite-user-signout {
    border-end-end-radius: 30px;
    border-start-end-radius: 30px
}

devsite-user .devsite-user-dialog .new-notification {
    background-color: var(--devsite-notification-background);
    border-radius: 10px;
    color: var(--devsite-inverted-text-color);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .3px;
    -webkit-margin-start: 12px;
    -moz-margin-start: 12px;
    margin-inline-start:12px;padding: 2px 8px
}

devsite-user .devsite-user-dialog-footer {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 60px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

devsite-user .devsite-user-dialog-footer-link {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin: 0
}

devsite-user .devsite-user-dialog-footer-link:not(:first-child):before {
    color: var(--devsite-secondary-text-color);
    content: "●";
    font-size: 6px;
    margin-inline:8px}

devsite-user .devsite-user-dialog-footer-link>a {
    border: 1px solid transparent;
    border-radius: 4px;
    display: inline-block;
    font: 400 12px/16px var(--devsite-headline-font-family);
    letter-spacing: .1px;
    padding: 5px 4px
}

devsite-user .devsite-user-dialog-footer-link>a:link,devsite-user .devsite-user-dialog-footer-link>a:visited {
    color: var(--devsite-primary-text-color)
}

devsite-user .devsite-user-dialog-footer-link>a:focus {
    border-color: var(--devsite-ogb-link-border-color)
}

devsite-user .devsite-user-dialog-footer-link>a:focus,devsite-user .devsite-user-dialog-footer-link>a:hover {
    background-color: var(--devsite-background-2)
}

devsite-user .devsite-user-dialog-footer-link>a:active {
    background-color: var(--devsite-background-4)
}

devsite-user .devsite-devprofile-wrapper {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    anchor-name: --devsite-user-button;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    height: 32px;
    opacity: 0;
    position: relative
}

devsite-user .devsite-devprofile-wrapper.show {
    opacity: 1;
    -webkit-transition: all .15s cubic-bezier(.4,0,.2,1) 0s;
    transition: all .15s cubic-bezier(.4,0,.2,1) 0s
}

devsite-user .devsite-devprofile-wrapper devsite-spinner {
    margin: 0
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-notifications-indicator {
    background-color: #1a73e8;
    border-radius: 8px;
    height: 8px;
    position: absolute;
    right: 0;
    top: 0;
    width: 8px;
    z-index: 1
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: var(--devsite-primary-border);
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 32px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0;
    min-height: 32px;
    min-width: 32px;
    padding: 0;
    position: relative;
    width: 32px;
    --devsite-button-border-hover: none;
    --devsite-button-border-radius: 50%;
    --devsite-button-box-shadow: none;
    --devsite-button-box-shadow-active: none
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-button svg {
    fill: var(--devsite-header-icon-color,var(--devsite-secondary-text-color))
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-button:active,devsite-user .devsite-devprofile-wrapper .devsite-devprofile-button:focus,devsite-user .devsite-devprofile-wrapper .devsite-devprofile-button:hover {
    background: var(--devsite-background-3)
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-button:active svg,devsite-user .devsite-devprofile-wrapper .devsite-devprofile-button:focus svg,devsite-user .devsite-devprofile-wrapper .devsite-devprofile-button:hover svg {
    fill: var(--devsite-header-icon-color,var(--devsite-secondary-text-rgba))
}

devsite-user .devsite-devprofile-wrapper.open .devsite-devprofile-button {
    background: var(--devsite-background-3);
    color: var(--devsite-header-icon-color-active,var(--devsite-primary-text-rgba))
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-popout {
    background-color: var(--devsite-background-1);
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(60,64,67,.3),0 2px 6px 2px rgba(60,64,67,.15);
    display: none;
    font-family: var(--devsite-primary-font-family);
    margin-right: -2px;
    margin-top: 8px;
    max-width: 232px;
    opacity: 0;
    padding: 8px 0;
    pointer-events: none;
    position: absolute;
    inset-inline-end: 0;
    top: 100%;
    -webkit-transform-origin: top right;
    transform-origin: top right;
    -webkit-transform: scale(.8);
    transform: scale(.8);
    -webkit-transition: all .15s cubic-bezier(.4,0,.2,1) 0s;
    transition: all .15s cubic-bezier(.4,0,.2,1) 0s;
    width: 100vw;
    z-index: 1007
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-popout.show {
    opacity: 1;
    pointer-events: all;
    -webkit-transform: scale(1);
    transform: scale(1)
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-popout.visible {
    display: block
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-popout .devsite-devprofile-notifications-container {
    background-color: #1a73e8;
    border-radius: 16px;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    height: 16px;
    line-height: 16px;
    -webkit-margin-start: 10px;
    -moz-margin-start: 10px;
    margin-inline-start:10px;padding: 0 5px 0 4px
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-popout .profile-links-header {
    color: var(--devsite-primary-text-color);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .8px;
    line-height: 16px;
    padding: 12px 14px;
    text-transform: uppercase
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-popout .profile-link {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-primary-text-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    padding: 14px 16px;
    text-decoration: none
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-popout .profile-link:focus,devsite-user .devsite-devprofile-wrapper .devsite-devprofile-popout .profile-link:hover {
    background-color: var(--devsite-ogb-profile-link-hover-background,#f1f3f4)
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-popout ul {
    margin: 0;
    padding: 0
}

devsite-user .devsite-devprofile-wrapper .devsite-devprofile-popout ul li {
    list-style: none;
    margin: 0;
    padding: 0
}

.devsite-user-callout-container {
    position: absolute
}

.devsite-user-gdp-fastrack-callout .devsite-user-gdp-fastrack-callout-heading {
    font-family: var(--devsite-heading-font-family);
    margin: 8px 0
}

.devsite-user-gdp-fastrack-callout .devsite-user-gdp-fastrack-callout-sub-text,.devsite-user-gdp-fastrack-callout .devsite-user-gdp-fastrack-callout-tos {
    color: var(--devsite-secondary-text-color);
    font: 400 12px/16px var(--devsite-primary-font-family);
    letter-spacing: .3px
}

.devsite-user-gdp-fastrack-callout .devsite-user-gdp-fastrack-callout-sub-text,.devsite-user-gdp-fastrack-callout .devsite-user-gdp-fastrack-callout-tos {
    font-size: 14px
}

.devsite-user-gdp-fastrack-callout .devsite-user-gdp-fastrack-callout-sub-text {
    -webkit-padding-start: 16px;
    -moz-padding-start: 16px;
    padding-inline-start:16px}

.devsite-user-gdp-fastrack-callout .devsite-user-gdp-fastrack-callout-newsletter {
    margin-bottom: 16px
}

.devsite-user-gdp-fastrack-callout .devsite-user-gdp-fastrack-callout-occupation {
    font-size: 16px;
    margin-bottom: 24px
}

.devsite-user-gdp-fastrack-callout .devsite-user-gdp-fastrack-callout-newsletter,.devsite-user-gdp-fastrack-callout .devsite-user-gdp-fastrack-callout-occupation {
    width: 100%
}

.devsite-user-gdp-fastrack-callout .devsite-user-gdp-fastrack-callout-label {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--devsite-primary-text-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    letter-spacing: .25px;
    line-height: 16px
}

@media screen and (max-width: 840px) {
    devsite-user .devsite-devprofile-wrapper .devsite-user-gdp-fastrack-callout {
        max-width:min(378px,100vw - 80px)
    }

    devsite-user .devsite-devprofile-wrapper .devsite-devprofile-popout {
        max-width: min(378px,100vw - 64px)
    }
}

@media screen and (max-width: 452px) {
    devsite-user[dialog--open] .devsite-user-dialog {
        inset-inline:0;
        max-height: 210px;
        top: 0;
        width: 100%;
        z-index: 21
    }
}

devsite-var {
    position: relative;
    white-space: nowrap
}

devsite-var .devsite-var-input-wrapper {
    bottom: -2px;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    display: none;
    left: -4px;
    position: absolute;
    width: 100%
}

devsite-var[active] .devsite-var-input-wrapper {
    display: inline-block
}

devsite-selector devsite-var .devsite-var-input-wrapper {
    bottom: -3px
}

table devsite-var .devsite-var-input-wrapper {
    bottom: -3px
}

devsite-code devsite-var .devsite-var-input-wrapper {
    bottom: -2px
}

devsite-var .devsite-var-input-wrapper+var {
    border-bottom: 1px dotted var(--devsite-var-color);
    cursor: pointer
}

devsite-var input.devsite-var-input {
    border: 1px solid #80868b;
    font-family: inherit;
    font-size: inherit;
    padding: 1px 3px 0;
    width: inherit
}

devsite-var input.devsite-var-input:focus {
    border-bottom: 1px solid #80868b;
    padding-bottom: 0
}

devsite-var button.devsite-icon-edit {
    color: var(--devsite-var-color);
    margin: 0 0 2px 5px
}

devsite-var .material-icons.devsite-icon-edit {
    vertical-align: middle
}

devsite-var .devsite-icon-close {
    bottom: 0;
    position: absolute;
    right: -4px;
    top: 0
}

devsite-var .devsite-icon-close,devsite-var .devsite-icon-close:hover {
    color: #202124
}

devsite-var .devsite-var-wrapper .material-icons {
    background: none;
    border: none;
    font-size: inherit;
    height: inherit;
    min-width: inherit;
    padding: 0
}

devsite-var .devsite-var-wrapper .material-icons:active {
    box-shadow: none
}

devsite-var .devsite-var-wrapper .material-icons:hover {
    cursor: pointer
}

devsite-version-selector {
    display: block;
    padding: 0 24px
}

devsite-version-selector .devsite-version-selector-select {
    width: 100%
}

.devsite-future-version,.devsite-future-version * {
    color: var(--devsite-tertiary-text-rgba);
    text-decoration: none
}

devsite-video {
    aspect-ratio: 16/9;
    display: block;
    overflow: hidden;
    position: relative;
    width: 100%
}

devsite-video.vertical {
    aspect-ratio: 9/16
}

devsite-video .devsite-video-placeholder img,devsite-video .devsite-video-placeholder span,devsite-video iframe {
    position: absolute
}

devsite-video iframe {
    height: 101%;
    left: -.5%;
    top: -.5%;
    width: 101%
}

devsite-video .devsite-video-placeholder span {
    color: var(--devsite-primary-text-color);
    padding: 8px
}

devsite-video .devsite-basic-video-player {
    border: 0;
    height: 100%;
    position: absolute;
    width: 100%;
    left: 0;
    top: 0
}

.devsite-view-release-notes-dialog-container {
    height: 80%;
    width: 720px
}

devsite-view-release-notes {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-view-release-notes .view-notes-button {
    font: 14px/20px var(--devsite-primary-font-family);
    background: none;
    border: none;
    padding: 0;
    color: #1a73e8
}

devsite-view-release-notes .view-notes-button:active,devsite-view-release-notes .view-notes-button:focus,devsite-view-release-notes .view-notes-button:hover {
    color: #174ea6;
    text-decoration: underline;
    background: none;
    border: none;
    font-weight: 400;
    box-shadow: none
}

.devsite-page-date+devsite-view-release-notes[data-shown]:before {
    color: #5f6368;
    content: "|";
    margin-inline:8px}

devsite-view-release-notes-dialog {
    color: #000;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    padding: 15px
}

.color-scheme--dark devsite-view-release-notes-dialog {
    color: #fff
}

devsite-view-release-notes-dialog .devsite-dialog-header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 10px
}

devsite-view-release-notes-dialog .devsite-dialog-header .title {
    text-align: initial
}

devsite-view-release-notes-dialog .devsite-dialog-header devsite-dropdown-list {
    -webkit-align-self: end;
    -ms-flex-item-align: end;
    align-self: end;
    border: var(--devsite-primary-border);
    border-radius: 5px;
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
    font-weight: 500;
    --devsite-bookmark-icon-arrow-color: #5f6368;
    --devsite-button-width: 144px;
    --devsite-dropdown-list-border-radius: 2px;
    --devsite-dropdown-list-toggle-border-radius: 4px;
    --devsite-dropdown-list-min-width: 144px;
    --devsite-dropdown-list-toggle-background-hover: var(--devsite-background-3);
    --devsite-dropdown-list-toogle-button-justify-content: space-between;
    --devsite-dropdown-list-toggle-button-padding: 8px 16px
}

devsite-view-release-notes-dialog .devsite-dialog-header .chip-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 4px
}

devsite-view-release-notes-dialog .devsite-dialog-header .selected-date-toggle {
    color: #1a73e8;
    line-height: 10px;
    margin: 0;
    margin-right: 8px
}

.color-scheme--dark devsite-view-release-notes-dialog .devsite-dialog-header .selected-date-toggle {
    color: #8ab4f8
}

devsite-view-release-notes-dialog .devsite-dialog-contents {
    border: var(--devsite-primary-border);
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    overflow-y: scroll
}

devsite-view-release-notes-dialog .devsite-dialog-contents .release-note-date-section {
    margin-bottom: 24px
}

devsite-view-release-notes-dialog .devsite-dialog-contents .release-note-date-section .release-note-date-header {
    text-align: left;
    font-size: 18px;
    margin-bottom: 12px;
    margin-top: 0
}

devsite-view-release-notes-dialog .devsite-dialog-contents .release-note-date-section .release-note {
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -moz-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-view-release-notes-dialog .devsite-dialog-contents .release-note .release-note-content {
    color: #000;
    padding: 0 8px
}

.color-scheme--dark devsite-view-release-notes-dialog .devsite-dialog-contents .release-note .release-note-content {
    color: #fff
}

devsite-view-release-notes-dialog .release-note-type-chip {
    border-radius: 20px;
    font-weight: 700
}

devsite-view-release-notes-dialog .release-note-type-chip.large {
    font-size: 12px;
    padding: 4px 14px;
    text-transform: uppercase
}

devsite-view-release-notes-dialog .release-note-type-chip.large.green {
    background: #137333;
    color: #fff
}

devsite-view-release-notes-dialog .release-note-type-chip.large.yellow {
    background: #ea8600;
    color: #fff
}

devsite-view-release-notes-dialog .release-note-type-chip.large.blue {
    background: #185abc;
    color: #fff
}

devsite-view-release-notes-dialog .release-note-type-chip.large.red {
    background: #b31412;
    color: #fff
}

devsite-view-release-notes-dialog .release-note-type-chip.large.orange {
    background: #c26401;
    color: #fff
}

devsite-view-release-notes-dialog .release-note-type-chip.large.grey {
    background: #3c4043;
    color: #fff
}

devsite-view-release-notes-dialog .release-note-type-chip.small {
    font-size: 12px;
    padding: 0 8px
}

devsite-view-release-notes-dialog .release-note-type-chip.small.green {
    background: #e6f4ea;
    color: #137333
}

devsite-view-release-notes-dialog .release-note-type-chip.small.yellow {
    background: #fef7e0;
    color: #ea8600
}

devsite-view-release-notes-dialog .release-note-type-chip.small.blue {
    background: #e8f0fe;
    color: #185abc
}

devsite-view-release-notes-dialog .release-note-type-chip.small.red {
    background: #fce8e6;
    color: #b31412
}

devsite-view-release-notes-dialog .release-note-type-chip.small.orange {
    background: #feefe3;
    color: #c26401
}

devsite-view-release-notes-dialog .release-note-type-chip.small.grey {
    background: #f8f9fa;
    color: #3c4043
}

devsite-view-release-notes-dialog .devsite-dialog-footer {
    padding: 10px 0 0
}

devsite-view-release-notes-dialog .devsite-dialog-footer .devsite-dialog-close {
    color: #4285f4
}

devsite-visibility-analytics[counterfactual] {
    display: block;
    height: 1px;
    opacity: 0
}

devsite-visibility-analytics[counterfactual] * {
    display: none
}

devsite-vplus .devsite-vplus-content-container {
    border: 1px solid #000;
    height: 0;
    padding-bottom: 56.25%;
    position: relative;
    visibility: hidden
}

devsite-vplus .devsite-vplus-slide-frame {
    height: 100%;
    left: 0;
    overflow: auto;
    position: absolute;
    top: 0;
    width: 100%
}

devsite-vplus .devsite-vplus-video {
    bottom: 0;
    height: 26%;
    position: absolute;
    right: 0;
    -webkit-transition: width 1.3s ease,height 1.3s ease,position 1.3s ease;
    transition: width 1.3s ease,height 1.3s ease,position 1.3s ease;
    width: 26%;
    z-index: 1
}

devsite-vplus .devsite-vplus-video.devsite-vplus-large {
    height: 100%;
    width: 100%
}

devsite-vplus .devsite-vplus-video-container {
    bottom: 0;
    cursor: pointer;
    height: 26%;
    position: absolute;
    right: 0;
    -webkit-transition: width 1.3s ease,height 1.3s ease,position 1.3s ease;
    transition: width 1.3s ease,height 1.3s ease,position 1.3s ease;
    width: 26%;
    z-index: 1
}

devsite-vplus .devsite-vplus-video-container.devsite-vplus-large {
    height: 100%;
    width: 100%
}

devsite-vplus .devsite-vplus-video-container>video {
    width: 100%
}

@media (max-width: 1049px) {
    #video-caption-container span {
        font-size:1.9vw
    }
}

@media (min-width: 1050px) {
    #video-caption-container span {
        font-size:1.1vw
    }
}

devsite-vplus .devsite-vplus-controls {
    background-color: #fff;
    border-radius: 6px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    margin: 0 auto;
    max-width: 490px;
    padding: 6px;
    text-align: center
}

devsite-vplus .devsite-vplus-controls-text {
    font-size: 16px;
    font-style: normal;
    font-weight: 700
}

devsite-vplus .devsite-vplus-slide-status {
    margin: auto
}

devsite-vplus .devsite-vplus-slide-status span {
    font-size: 18px
}

devsite-vplus .devsite-vplus-slide-status span:not(:first-of-type) {
    padding-left: 5px
}

devsite-vplus .devsite-vplus-player-controls {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: 8px 16px
}

devsite-vplus .devsite-vplus-control-button {
    cursor: pointer;
    box-shadow: none;
    height: 43px;
    padding-top: 0;
    width: 50px
}

devsite-vplus .devsite-vplus-control-button:hover {
    box-shadow: 0 2px 4px #9aa0a6;
    border-radius: 4px
}

devsite-vplus .devsite-vplus-video-controls-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

devsite-vplus .devsite-vplus-play-icon {
    margin-left: 0
}

devsite-vplus .devsite-vplus-pause-icon {
    margin-left: 0
}

devsite-vplus .devsite-vplus-play-button {
    padding-left: 0;
    margin-left: 16px;
    width: 50px
}

devsite-vplus .devsite-vplus-next-button {
    padding-left: 0;
    margin-left: 16px;
    width: 50px
}

devsite-vplus .devsite-vplus-triangle {
    border-style: solid;
    height: 0;
    margin: auto;
    position: relative;
    width: 0
}

devsite-vplus .devsite-vplus-back {
    border-color: transparent #174ea6 transparent transparent;
    border-width: 8px 16px 8px 0
}

devsite-vplus .devsite-vplus-back-triangle-1 {
    left: -8px;
    top: 15px
}

devsite-vplus .devsite-vplus-back-triangle-2 {
    left: 8px;
    top: -1px
}

devsite-vplus .devsite-vplus-forward-single {
    border-color: transparent transparent transparent #174ea6;
    border-width: 16px 0 16px 25px;
    top: 5px
}

devsite-vplus .devsite-vplus-forward {
    border-color: transparent transparent transparent #174ea6;
    border-width: 8px 0 8px 16px;
    top: 5px
}

devsite-vplus .devsite-vplus-forward-triangle-1 {
    left: -8px;
    top: 15px
}

devsite-vplus .devsite-vplus-forward-triangle-2 {
    left: 8px;
    top: -1px
}

devsite-vplus .devsite-vplus-pause {
    background-color: #174ea6;
    height: 30px;
    width: 9px
}

devsite-vplus .devsite-vplus-rect-1 {
    left: 12px;
    position: relative;
    top: 6px
}

devsite-vplus .devsite-vplus-rect-2 {
    left: 29px;
    position: relative;
    top: -24px
}

devsite-vplus .devsite-vplus-playbackrate select:hover {
    box-shadow: 0 2px 4px #9aa0a6
}

devsite-vplus .devsite-vplus-playbackrate .material-icons {
    margin-top: 10px
}

devsite-vplus .devsite-vplus-playbackrate select {
    border-color: transparent;
    font-size: 18px;
    height: 46px;
    padding-bottom: 2px;
    padding-top: 2px;
    -moz-text-align-last: center;
    text-align-last: center;
    text-transform: none
}

devsite-vplus .devsite-vplus-caption-control-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 8px
}

devsite-vplus .devsite-vplus-caption-control {
    background-color: #174ea6;
    border: 0;
    border-radius: 16px;
    color: var(--devsite-inverted-text-color);
    display: inline-block;
    height: 35px;
    line-height: 39px;
    margin-right: 10px;
    margin-top: 1px;
    padding: 0;
    text-align: center;
    text-decoration: none;
    text-indent: 0;
    vertical-align: 10%;
    width: 50px
}

devsite-vplus .devsite-vplus-captions-off {
    background-color: #fff;
    color: #174ea6
}

devsite-vplus .devsite-vplus-controls .devsite-vplus-control-button.disabled {
    background-color: transparent
}

devsite-vplus .devsite-vplus-prev-button.disabled .devsite-vplus-triangle {
    border-right-color: #979797
}

devsite-vplus .devsite-vplus-prev-button:hover:not(.disabled) .devsite-vplus-triangle {
    border-right-color: #0b2e59
}

devsite-vplus .devsite-vplus-next-button:hover:not(.disabled) .devsite-vplus-triangle {
    border-right-color: #0b2e59
}

devsite-vplus .devsite-vplus-next-button.disabled .devsite-vplus-triangle {
    border-left-color: #979797
}

.next-button:hover:not(.disabled) .devsite-vplus-triangle,devsite-vplus .devsite-vplus-play-button:hover:not(.disabled) .devsite-vplus-triangle {
    border-left-color: #0b2e59
}

devsite-vplus .devsite-vplus-navigation-button-container {
    margin: 0 auto;
    text-align: center
}

devsite-vplus .devsite-vplus-navigation-button-link {
    text-decoration: none
}

devsite-vplus .devsite-vplus-navigation-button {
    background-color: #174ea6;
    box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24);
    color: var(--devsite-inverted-text-color);
    display: inline-block;
    font-size: 16px;
    margin: 12px 36px;
    padding: 12px 36px
}

devsite-vplus .devsite-vplus-addendums {
    border-top: 0;
    border: 1px solid #000;
    cursor: pointer
}

devsite-vplus .devsite-vplus-addendums-header {
    background-color: var(--devsite-background-5);
    outline: none;
    padding: 8px 8px 8px 0;
    width: 100%
}

devsite-vplus .devsite-vplus-addendums-control {
    cursor: pointer;
    display: table-cell;
    vertical-align: middle
}

devsite-vplus .devsite-vplus-addendums-control .material-icons.devsite-vplus-caption-button {
    cursor: pointer
}

devsite-vplus .devsite-vplus-addendums-control>div {
    white-space: nowrap;
    margin-left: 8px;
    margin-right: 8px
}

devsite-vplus .devsite-vplus select {
    outline: 2px
}

devsite-vplus .devsite-vplus select:hover,devsite-vplus .devsite-vplus-notes-control>div>div:hover,devsite-vplus .devsite-vplus-transcript-control>div>div:hover {
    box-shadow: 0 2px 4px #9aa0a6;
    background-color: #e4f7fb
}

devsite-vplus .devsite-vplus select:focus {
    background-color: #e4f7fb
}

devsite-vplus .devsite-vplus-addendums-control.devsite-vplus-search-widget>div {
    margin-left: 0;
    margin-right: 0
}

devsite-vplus .devsite-vplus-addendums-label {
    white-space: nowrap
}

devsite-vplus .devsite-vplus-addendums-control .devsite-hidden {
    display: none
}

devsite-vplus .devsite-vplus-notes-control .devsite-vplus-addendums-closed,devsite-vplus .devsite-vplus-notes-control .devsite-vplus-addendums-opened,devsite-vplus .devsite-vplus-transcript-control .devsite-vplus-addendums-closed,devsite-vplus .devsite-vplus-transcript-control .devsite-vplus-addendums-opened {
    display: none
}

devsite-vplus .devsite-vplus-notes-control.goog-zippy-collapsed .devsite-vplus-addendums-closed,devsite-vplus .devsite-vplus-notes-control.goog-zippy-expanded .devsite-vplus-addendums-opened,devsite-vplus .devsite-vplus-transcript-control.goog-zippy-collapsed .devsite-vplus-addendums-closed,devsite-vplus .devsite-vplus-transcript-control.goog-zippy-expanded .devsite-vplus-addendums-opened {
    display: inline
}

devsite-vplus .devsite-vplus-search-widget {
    background: var(--devsite-background-3);
    padding: 2px 4px;
    position: relative;
    width: 100%
}

devsite-vplus .devsite-vplus-search-widget>div {
    width: 100%
}

devsite-vplus .devsite-vplus-search-input {
    background-color: transparent;
    border-width: 0;
    font-size: 14px;
    width: 100%
}

devsite-vplus .devsite-vplus-search-input:hover {
    box-shadow: 0 2px 4px #9aa0a6
}

devsite-vplus .devsite-vplus-search-autocomplete {
    position: relative;
    white-space: normal;
    width: 100%;
    z-index: 1
}

devsite-vplus .devsite-vplus-search-autocomplete .ac-renderer {
    background: var(--devsite-background-1);
    border: 1px solid var(--devsite-secondary-text-color);
    box-shadow: 2px 2px 2px hsla(0,0%,40%,.4);
    font: normal 13px Arial,sans-serif;
    position: absolute;
    width: 100%
}

devsite-vplus .devsite-vplus-search-autocomplete .ac-row {
    cursor: pointer;
    padding: 6px
}

devsite-vplus .devsite-vplus-search-autocomplete .ac-highlighted {
    font-weight: 700
}

devsite-vplus .devsite-vplus-search-autocomplete .ac-active {
    background-color: #bdc1c6
}

devsite-vplus .devsite-vplus-addendums-control div.devsite-vplus-captions-language-selector-wrapper,devsite-vplus .devsite-vplus-addendums-control div.devsite-vplus-video-language-selector-wrapper {
    display: inline-block;
    height: auto;
    margin-right: 2px;
    padding: 0;
    vertical-align: bottom
}

devsite-vplus .devsite-vplus-captions-language-selector-wrapper .material-icons,devsite-vplus .devsite-vplus-video-language-selector-wrapper .material-icons {
    vertical-align: middle
}

devsite-vplus .devsite-vplus-captions-language-selector-wrapper:focus-within .material-icons,devsite-vplus .devsite-vplus-video-language-selector-wrapper:focus-within .material-icons {
    display: none
}

devsite-vplus .devsite-vplus-captions-language-selector-wrapper select,devsite-vplus .devsite-vplus-video-language-selector-wrapper select {
    background-color: var(--devsite-background-5);
    min-width: 0;
    padding-right: 16px;
    width: 0
}

devsite-vplus .devsite-vplus-captions-language-selector-wrapper select:focus,devsite-vplus .devsite-vplus-video-language-selector-wrapper select:focus {
    outline: 5px auto -webkit-focus-ring-color;
    padding-right: 27px;
    width: auto
}

devsite-vplus .devsite-vplus-captions-language-selector-wrapper select.kd-select,devsite-vplus .devsite-vplus-video-language-selector-wrapper select.kd-select {
    border-color: transparent;
    font-size: small;
    height: auto;
    padding-bottom: 2px;
    padding-top: 2px;
    -moz-text-align-last: right;
    text-align-last: right
}

devsite-vplus .devsite-vplus-addendums-opened .material-icons {
    width: 1em
}

devsite-vplus .devsite-vplus-addendums-closed .material-icons {
    background-color: #bdc1c6;
    color: var(--devsite-inverted-text-color);
    width: 1em
}

devsite-vplus .devsite-vplus-notes {
    border-top: 1 solid #000;
    height: 100px;
    margin: 0;
    overflow: auto;
    padding: 16px;
    position: relative;
    resize: vertical;
    width: 100%
}

devsite-vplus .devsite-vplus-transcript-captions {
    border-top: 1 solid #000;
    height: 4.5em;
    margin: 0;
    overflow: auto;
    padding: 0;
    position: relative;
    resize: vertical;
    width: 100%
}

devsite-vplus .devsite-vplus-transcript-captions table {
    border-collapse: separate;
    margin: 0
}

devsite-vplus .devsite-vplus-transcript-caption {
    padding: .15em 1em;
    width: 100%
}

devsite-vplus .devsite-vplus-transcript-slide-separator {
    font-weight: 700;
    font-style: italic
}

devsite-vplus .devsite-vplus-transcript-slide-separator hr {
    padding: 1px 0
}

devsite-vplus .devsite-vplus-transcript-caption:focus {
    outline-offset: -3px
}

devsite-vplus .devsite-vplus-transcript-caption td {
    background-color: #fff;
    border-color: #fff;
    padding: 0 .25em;
    text-shadow: 0 0 0 currentColor
}

devsite-vplus .devsite-vplus-transcript-caption:hover td {
    text-shadow: .5px 0 .1px #5f6368,-.5px 0 .1px #5f6368
}

devsite-vplus .devsite-vplus-transcript-caption:hover .devsite-vplus-transcript-caption-bullet {
    visibility: visible
}

devsite-vplus .devsite-vplus-transcript-caption.devsite-vplus-caption-highlighted td {
    background-color: #fdd663
}

devsite-vplus .devsite-vplus-transcript-caption .devsite-vplus-transcript-caption-bullet {
    padding: 0 0 0 4px;
    visibility: hidden
}

devsite-vplus .devsite-vplus-transcript-caption-time {
    font-weight: lighter;
    min-width: 2.5em;
    text-align: right
}

devsite-vplus .devsite-vplus-transcript-caption-text {
    width: 100%
}

devsite-vplus .devsite-vplus-fullscreen-icon {
    color: #174ea6;
    padding: 0;
    text-overflow: inherit;
    text-transform: none
}

devsite-vplus .devsite-hidden {
    display: none
}

devsite-youtube {
    aspect-ratio: 16/9;
    display: block;
    overflow: hidden;
    position: relative;
    width: 100%
}

devsite-youtube.vertical {
    aspect-ratio: 9/16
}

devsite-youtube .devsite-video-placeholder img,devsite-youtube .devsite-video-placeholder span,devsite-youtube iframe {
    position: absolute
}

devsite-youtube iframe {
    height: 101%;
    left: -.5%;
    top: -.5%;
    width: 101%
}

devsite-youtube .devsite-video-placeholder span {
    color: var(--devsite-primary-text-color);
    padding: 8px
}

devsite-youtube .devsite-basic-video-player {
    border: 0;
    height: 100%;
    position: absolute;
    width: 100%
}

:host {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    --goog-split-pane-collapse-control-height: 20px;
    --goog-split-pane-collapse-control-top: 80px;
    --goog-split-pane-resizer-color: #202124;
    --goog-split-pane-resizer-thickness: 4px
}

:host .resizer {
    background: var(--goog-split-pane-resizer-color);
    border-right: 1px solid var(--goog-split-pane-resizer-color);
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 var(--goog-split-pane-resizer-thickness);
    -moz-box-flex: 0;
    -ms-flex: 0 0 var(--goog-split-pane-resizer-thickness);
    flex: 0 0 var(--goog-split-pane-resizer-thickness);
    pointer-events: auto;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: var(--goog-split-pane-resizer-thickness)
}

:host .resizer:hover {
    cursor: col-resize
}

:host .collapse-control {
    cursor: pointer;
    position: absolute;
    top: var(--goog-split-pane-collapse-control-top);
    z-index: 30
}

:host .collapse-control.none {
    display: none
}

:host .bottom-or-right .collapse-less-than {
    display: none
}

:host .top-or-left .collapse-greater-than {
    display: none
}

:host .collapse-button {
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    background-color: hsla(0,0%,100%,.3);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--goog-split-pane-collapse-control-height);
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: 0;
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
    width: 20px
}

:host .collapse-button:hover {
    background-color: #fff;
    width: calc(var(--goog-split-pane-collapse-control-height)*1.35)
}

:host .left-oriented {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

:host .collapse-less-than {
    border-radius: var(--goog-split-pane-collapse-control-height) 0 0 var(--goog-split-pane-collapse-control-height);
    right: calc(var(--goog-split-pane-resizer-thickness)*-1)
}

:host .collapse-greater-than {
    border-radius: 0 var(--goog-split-pane-collapse-control-height) var(--goog-split-pane-collapse-control-height) 0;
    left: 0
}

:host .pane {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 0;
    -moz-box-flex: 1;
    -ms-flex: 1 1 0px;
    flex: 1 1 0;
    height: 100%;
    min-height: 0;
    min-width: 0;
    width: 100%
}

:host([is-horizontal]) {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

:host([is-horizontal]) .resizer {
    background: var(--goog-split-pane-resizer-color);
    border-top: 1px solid var(--goog-split-pane-resizer-color);
    height: var(--goog-split-pane-resizer-thickness);
    width: unset;
    z-index: 2000
}

:host([is-horizontal]) .resizer:hover {
    cursor: row-resize
}

:host([is-horizontal]) .collapse-control {
    left: var(--goog-split-pane-collapse-control-top);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    top: 0
}

:host([is-resizing]) {
    cursor: col-resize
}

:host([is-resizing][is-horizontal]) {
    cursor: row-resize
}

:host([is-collapsed-top-or-left]) .collapse-less-than {
    display: none
}

:host([is-collapsed-top-or-left]) .collapse-greater-than {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

:host([is-collapsed-bottom-or-right]) .collapse-greater-than {
    display: none
}

:host([is-collapsed-bottom-or-right]) .collapse-less-than {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

body[codelabs-content-type=paginated] google-codelab {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template: 64px 1fr 56px/256px 1fr;
    grid-template-areas: "title title" "drawer  main" "metadata  main"
}

body[codelabs-content-type=paginated] google-codelab #main {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    grid-area: main;
    position: relative;
    background: #f8f9fa
}

body[codelabs-content-type=paginated] google-codelab #codelab-title {
    background: #fff;
    box-shadow: 0 1px 2px 0 rgba(60,64,67,.3),0 2px 6px 2px rgba(60,64,67,.15);
    color: #3c4043;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    grid-area: title;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 64px;
    padding: 0 36px 0 16px;
    -webkit-font-smoothing: antialiased;
    z-index: 1000;
    max-width: 100vw
}

body[codelabs-content-type=paginated] google-codelab #codelab-title h1 {
    font-size: 20px;
    font-weight: 400;
    margin: 0 8px;
    font-family: Roboto,Noto,sans-serif;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-flex-shrink: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 0;
    display: inline-block
}

body[codelabs-content-type=paginated] google-codelab #codelab-title h1 a {
    color: #3c4043;
    text-decoration: none
}

body[codelabs-content-type=paginated] google-codelab #codelab-title h1 a:focus,body[codelabs-content-type=paginated] google-codelab #codelab-title h1 a:hover {
    color: #212121;
    text-decoration: underline
}

body[codelabs-content-type=paginated] google-codelab #codelab-title .time-remaining {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 16px;
    font-weight: 400;
    white-space: nowrap
}

body[codelabs-content-type=paginated] google-codelab #codelab-title .time-remaining i {
    margin-right: 3px
}

body[codelabs-content-type=paginated] google-codelab #codelab-nav-buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

body[codelabs-content-type=paginated] google-codelab #codelab-nav-buttons #arrow-back,body[codelabs-content-type=paginated] google-codelab #codelab-nav-buttons #menu {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    text-decoration: none;
    color: #3c4043;
    width: 40px;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

body[codelabs-content-type=paginated] google-codelab #controls {
    position: absolute;
    bottom: 32px;
    left: 0;
    right: 0;
    padding: 0 32px;
    z-index: 1001
}

body[codelabs-content-type=paginated] google-codelab #fabs {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0 auto;
    max-width: 1025px
}

body[codelabs-content-type=paginated] google-codelab #done,body[codelabs-content-type=paginated] google-codelab #next-step,body[codelabs-content-type=paginated] google-codelab #previous-step {
    border-radius: 4px;
    font-family: Google Sans,Arial,sans-serif;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .6px;
    line-height: 24px;
    padding-bottom: 6px;
    padding-left: 24px;
    padding-right: 24px;
    padding-top: 6px;
    pointer-events: auto;
    text-transform: none;
    background: #fff;
    color: #1a73e8;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: -webkit-transform .3s ease-in-out;
    transition: -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out,-webkit-transform .3s ease-in-out;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12),0 3px 1px -2px rgba(0,0,0,.2);
    text-decoration: none;
    -webkit-font-smoothing: antialiased
}

body[codelabs-content-type=paginated] google-codelab #next-step {
    color: #fff;
    background: #1a73e8
}

body[codelabs-content-type=paginated] google-codelab #done {
    background: #1e8e3e;
    color: #fff
}

body[codelabs-content-type=paginated] google-codelab #fabs a[disappear] {
    -webkit-transform: scale(0);
    transform: scale(0)
}

body[codelabs-content-type=paginated] google-codelab #done {
    background: #0f9d58
}

body[codelabs-content-type=paginated] google-codelab #drawer .codelab-time-container {
    display: none
}

body[codelabs-content-type=paginated] google-codelab .metadata {
    background: #f8f9fa;
    color: #777;
    font-size: 14px;
    grid-area: metadata;
    padding: 16px
}

body[codelabs-content-type=paginated] google-codelab .metadata a {
    color: currentcolor;
    margin-left: 4px
}

body[codelabs-content-type=paginated] google-codelab .metadata a:focus,body[codelabs-content-type=paginated] google-codelab .metadata a:hover {
    color: #212121
}

@media (max-width: 768px) {
    body[codelabs-content-type=paginated] google-codelab {
        grid-template:64px 1fr 56px/1fr;
        grid-template-areas: "title" "main" "metadata";
        padding-top: 0
    }

    body[codelabs-content-type=paginated] google-codelab #codelab-title {
        padding: 0 16px
    }

    body[codelabs-content-type=paginated] google-codelab #codelab-title .codelab-time-container {
        display: none
    }
}

body[codelabs-content-type=paginated] google-codelab #drawer {
    width: 256px;
    grid-area: drawer;
    position: relative;
    z-index: 100;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background: #f8f9fa;
    overflow: auto
}

body[codelabs-content-type=paginated] google-codelab #drawer .steps {
    -webkit-flex-shrink: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    overflow-x: visible;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

body[codelabs-content-type=paginated] google-codelab #drawer .steps:only-child {
    max-height: 100%
}

body[codelabs-content-type=paginated] google-codelab #drawer ol {
    margin: 0;
    padding: 16px 12px;
    counter-reset: li-count;
    list-style: none;
    overflow-x: visible;
    overflow-y: auto;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

body[codelabs-content-type=paginated] google-codelab #drawer ol li {
    display: block;
    counter-increment: li-count
}

body[codelabs-content-type=paginated] google-codelab #drawer ol li a {
    text-decoration: none;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
    color: #80868b;
    padding: 3px 10px;
    min-height: 48px;
    font-weight: 400;
    line-height: 20px;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    position: relative;
    font-family: Roboto,Noto,sans-serif;
    -webkit-font-smoothing: antialiased;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    border: 1px solid #dadce0;
    border-radius: 5px;
    margin: 6px 0;
    background: #fff
}

body[codelabs-content-type=paginated] google-codelab #drawer ol li a:active,body[codelabs-content-type=paginated] google-codelab #drawer ol li a:focus {
    background: #c6c6c6;
    -webkit-tap-highlight-color: transparent;
    outline: 0;
    border-color: #c6c6c6!important
}

body[codelabs-content-type=paginated] google-codelab #drawer ol li a .step {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

body[codelabs-content-type=paginated] google-codelab #drawer ol li .step:before {
    content: counter(li-count);
    display: inline-block;
    font-style: normal;
    width: 26px;
    min-width: 26px;
    color: #fff;
    background: #80868b;
    border-radius: 50%;
    text-align: center;
    height: 26px;
    vertical-align: middle;
    line-height: 26px;
    margin-right: 8px;
    font-weight: 400;
    position: relative;
    z-index: 2;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

body[codelabs-content-type=paginated] google-codelab #drawer ol li a:focus,body[codelabs-content-type=paginated] google-codelab #drawer ol li[selected] a {
    color: #212121;
    font-weight: 600;
    box-shadow: 0 1px 2px 0 rgba(60,64,67,.3),0 2px 6px 2px rgba(60,64,67,.15)
}

body[codelabs-content-type=paginated] google-codelab #drawer ol li[selected] a {
    border-color: #fff
}

body[codelabs-content-type=paginated] google-codelab #drawer ol li[selected] .step:before {
    font-weight: 600
}

body[codelabs-content-type=paginated] google-codelab #drawer ol li[completed] a {
    color: #212121
}

body[codelabs-content-type=paginated] google-codelab #drawer ol li[completed] .step:before {
    background-color: #1a73e8;
    color: #fff
}

body[codelabs-content-type=paginated] google-codelab #codelab-nav-buttons #menu {
    display: none
}

body[codelabs-content-type=paginated] google-codelab #drawer ol ::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px
}

body[codelabs-content-type=paginated] google-codelab #drawer ol ::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0,0,0,.5);
    -webkit-box-shadow: 0 0 1px hsla(0,0%,100%,.5)
}

@media (max-width: 768px) {
    body[codelabs-content-type=paginated] google-codelab #codelab-nav-buttons #arrow-back {
        display:none
    }

    body[codelabs-content-type=paginated] google-codelab #codelab-nav-buttons #menu {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex
    }

    body[codelabs-content-type=paginated] google-codelab #drawer {
        grid-area: auto;
        width: 256px;
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        z-index: 10000;
        will-change: transform;
        box-shadow: 2px 2px 4px transparent;
        pointer-events: none;
        -webkit-transform: translate3d(-100%,0,0);
        transform: translate3d(-100%,0,0);
        -webkit-transition: box-shadow .3s,-webkit-transform .3s ease-in-out;
        transition: box-shadow .3s,-webkit-transform .3s ease-in-out;
        transition: transform .3s ease-in-out,box-shadow .3s;
        transition: transform .3s ease-in-out,box-shadow .3s,-webkit-transform .3s ease-in-out
    }

    body[codelabs-content-type=paginated] google-codelab[drawer--open] #drawer {
        box-shadow: 2px 2px 4px rgba(0,0,0,.15);
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        pointer-events: all
    }

    body[codelabs-content-type=paginated] google-codelab #main:before {
        content: "";
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        position: absolute;
        -webkit-transition: opacity .38s ease-in-out;
        transition: opacity .38s ease-in-out;
        background-color: rgba(0,0,0,.3);
        z-index: 10;
        pointer-events: none;
        opacity: 0
    }

    body[codelabs-content-type=paginated] google-codelab[drawer--open] #main:before {
        opacity: 1;
        pointer-events: all
    }

    body[codelabs-content-type=paginated] google-codelab #drawer .codelab-time-container {
        display: block;
        padding: 20px 10px 10px 23px
    }

    body[codelabs-content-type=paginated] google-codelab #drawer .time-remaining i {
        margin-right: 9px
    }
}

body[codelabs-content-type=paginated] google-codelab #steps {
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

body[codelabs-content-type=paginated] google-codelab google-codelab-step {
    display: none;
    width: 100%;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding-top: 32px;
    overflow-y: auto;
    overflow-x: hidden
}

body[codelabs-content-type=paginated] google-codelab google-codelab-step[animating],body[codelabs-content-type=paginated] google-codelab google-codelab-step[selected] {
    display: block;
    -webkit-transform-origin: 0 50% 0;
    transform-origin: 0 50% 0;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

body[codelabs-content-type=paginated] google-codelab google-codelab-step[animating] {
    pointer-events: none;
    position: absolute;
    overflow: hidden
}

@media (max-width: 768px) {
    body[codelabs-content-type=paginated] google-codelab google-codelab-step {
        padding-top:8px
    }
}

body[codelabs-content-type=paginated] google-codelab #drawer ol li {
    padding: 0;
    margin: 0
}

body[codelabs-content-type=paginated] google-codelab #drawer ol li a {
    color: #5f6368
}

body[codelabs-content-type=paginated] google-codelab .metadata a {
    color: #5f6368
}

body[codelabs-content-type=paginated] google-codelab {
    bottom: 0;
    left: 0;
    position: fixed;
    top: 0
}

body[codelabs-content-type=paginated] google-codelab #codelab-title h1 {
    width: auto;
    color: #3c4043;
    top: 0
}

body[codelabs-content-type=paginated] google-codelab .title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin-left: 10px;
    overflow: hidden
}

body[codelabs-content-type=paginated] google-codelab .no-return-url {
    display: none!important
}

body[codelabs-content-type=paginated] google-codelab #drawer .metadata .material-icons,body[codelabs-content-type=paginated] google-codelab-about .about-card .material-icons {
    top: 0!important
}

body[codelabs-content-type=paginated] body[template=codelab] devsite-footer-utility .devsite-footer-utility-button>a,body[codelabs-content-type=paginated] google-codelab .button-blue,body[codelabs-content-type=paginated] google-codelab .button-green,body[codelabs-content-type=paginated] google-codelab .button-primary,body[codelabs-content-type=paginated] google-codelab .button-red {
    color: #fff!important
}

body[codelabs-content-type=paginated] google-codelab #codelab-title devsite-language-selector {
    margin: 0 16px
}

body[codelabs-content-type=paginated] google-codelab #controls devsite-language-selector {
    background: var(--devsite-background-1);
    display: none
}

@media screen and (max-width: 840px) {
    body[codelabs-content-type=paginated] google-codelab #codelab-title devsite-language-selector {
        margin:0 8px
    }
}

@media screen and (max-width: 600px) {
    body[codelabs-content-type=paginated] google-codelab #codelab-title devsite-language-selector {
        display:none
    }

    body[codelabs-content-type=paginated] google-codelab #controls devsite-language-selector {
        display: block
    }

    body[codelabs-content-type=paginated] google-codelab #main #controls {
        padding: 0 8px
    }

    body[codelabs-content-type=paginated] google-codelab #controls .spacer {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

[dir=ltr] body[codelabs-content-type=paginated][concierge] google-codelab #main {
    margin-right: var(--devsite-concierge-width,0)
}

[dir=rtl] body[codelabs-content-type=paginated][concierge] google-codelab #main {
    margin-left: var(--devsite-concierge-width,0)
}

body[codelabs-content-type=paginated] {
    color: #4e5256;
    font-family: var(--devsite-primary-font-family);
    overflow: hidden
}

body[codelabs-content-type=paginated] google-codelab {
    opacity: 0
}

body[codelabs-content-type=paginated] devsite-googler-buttons {
    bottom: 148px
}

body[codelabs-content-type=paginated][ready] google-codelab {
    opacity: 1
}

body[codelabs-content-type=paginated] .devsite-main-content {
    max-width: 100%!important;
    padding: 0!important
}

body[codelabs-content-type=paginated] .devsite-badger-award {
    left: 256px
}

body[codelabs-content-type=paginated] .devsite-back-to-top-link,body[codelabs-content-type=paginated] .devsite-book-nav-bg,body[codelabs-content-type=paginated] .devsite-book-nav-bg[fixed],body[codelabs-content-type=paginated] .devsite-book-nav-blur,body[codelabs-content-type=paginated] .devsite-book-nav-toggle,body[codelabs-content-type=paginated] .devsite-footer,body[codelabs-content-type=paginated] .devsite-heading-link,body[codelabs-content-type=paginated] .devsite-page-bookmark-tooltip,body[codelabs-content-type=paginated] .devsite-page-title,body[codelabs-content-type=paginated] .devsite-sidebar,body[codelabs-content-type=paginated] devsite-book-nav,body[codelabs-content-type=paginated] devsite-bookmark,body[codelabs-content-type=paginated] devsite-content-footer,body[codelabs-content-type=paginated] devsite-header {
    display: none
}

body[codelabs-content-type=paginated] devsite-code:after {
    display: none
}

body[codelabs-content-type=paginated] devsite-user[signed-in][enable-profiles] {
    min-width: 44px
}

body[codelabs-content-type=paginated] google-codelab .devsite-banner {
    padding-top: 0!important;
    --devsite-banner-margin: 30px 0 0;
    --devsite-banner-message-padding: 18px
}

body[codelabs-content-type=paginated][user=googler] google-codelab #controls {
    -webkit-margin-end: 64px;
    -moz-margin-end: 64px;
    margin-inline-end:64px}

@media screen and (min-width: 1200px) {
    body[codelabs-content-type=paginated][user=googler] google-codelab #controls {
        -webkit-margin-start:64px;
        -moz-margin-start: 64px;
        margin-inline-start:64px}
}

@media screen and (max-width: 600px) {
    body[codelabs-content-type=paginated][user=googler] google-codelab #controls {
        -webkit-margin-end:88px;
        -moz-margin-end: 88px;
        margin-inline-end:88px}
}

body[codelabs-content-type=scrolling][type=codelab] .devsite-sidebar[fixed] .devsite-sidebar-content {
    -webkit-padding-start: 0;
    -moz-padding-start: 0;
    padding-inline-start:0}

body[codelabs-content-type=scrolling][type=codelab] .devsite-sidebar[fixed] devsite-toc {
    -webkit-padding-end: 8px;
    -moz-padding-end: 8px;
    padding-inline-end:8px}

body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-show-all {
    margin: 0
}

body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-more-items {
    -webkit-margin-after: 0;
    margin-block-end:0}

body[codelabs-content-type=scrolling][type=codelab] devsite-toc>.devsite-nav-list,body[codelabs-content-type=scrolling][type=codelab] devsite-toc[fixed]>.devsite-nav-list {
    border: 0;
    counter-reset: steps;
    padding: 0
}

body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-item {
    -webkit-margin-after: 8px;
    margin-block-end:8px;-webkit-margin-start: 2px;
    -moz-margin-start: 2px;
    margin-inline-start:2px}

body[codelabs-content-type=scrolling][type=codelab] .devsite-toc-toggle,body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-item:last-child>a {
    padding: 12px 8px
}

body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-item>a {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--devsite-background-1);
    border-radius: 4px;
    color: var(--devsite-secondary-text-color);
    display: grid;
    font-family: var(--devsite-headline-font-family);
    font-size: 14px;
    grid-gap: 0 8px;
    grid-template-columns: 26px 1fr;
    padding: 12px 8px;
    border: var(--devsite-primary-border);
    box-shadow: none
}

body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-item[completed]>a {
    color: var(--devsite-primary-text-color)
}

body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-item>a:before {
    background: var(--devsite-tertiary-text-color);
    border-radius: 100%;
    color: var(--devsite-inverted-text-color);
    content: counter(steps);
    counter-increment: steps;
    height: 26px;
    line-height: 26px;
    text-align: center;
    width: 26px
}

body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-text {
    color: var(--devsite-primary-text-color)
}

body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-active.devsite-nav-title {
    border: 0;
    box-shadow: 0 1px 2px 0 var(--devsite-elevation-key-shadow-color),0 1px 3px 1px var(--devsite-elevation-ambient-shadow-color)
}

body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-active.devsite-nav-title,body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-active.devsite-nav-title:focus,body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-active.devsite-nav-title:hover {
    color: var(--devsite-primary-text-color)
}

body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-active.devsite-nav-title:before,body[codelabs-content-type=scrolling][type=codelab] devsite-toc .devsite-nav-item[completed]>a:before {
    background: var(--devsite-link-color)
}

body[codelabs-content-type=scrolling][type=codelab] .codelab-banner {
    background-color: var(--devsite-background-2);
    color: var(--devsite-button-color);
    font: 500 14px/36px var(--devsite-primary-font-family);
    line-height: 24px
}

body[codelabs-content-type=scrolling][type=codelab] .codelab-banner .devsite-banner-message {
    padding: 16px 40px
}

body[codelabs-content-type=scrolling] .devsite-banner :link,body[codelabs-content-type=scrolling] .devsite-banner :visited {
    text-decoration: underline
}

body[codelabs-content-type=scrolling][type=codelab] .codelab-banner :link,body[codelabs-content-type=scrolling][type=codelab] .codelab-banner :visited {
    color: var(--devsite-button-color);
    overflow: hidden;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap
}

body[codelabs-content-type=scrolling][type=codelab] .codelab-banner .material-icons {
    color: var(--devsite-button-color);
    margin: 0;
    vertical-align: bottom
}

body[codelabs-content-type=scrolling][type=codelab] .devsite-nav-item.devsite-toc-toggle {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-margin-after: 0;
    margin-block-end:0}

body[codelabs-content-type=scrolling][type=codelab] .devsite-toc-toggle .devsite-nav-title {
    padding: 0
}

body[codelabs-content-type=scrolling][type=codelab] devsite-toc:not(.devsite-toc-embedded) .devsite-toc-toggle:before {
    color: var(--devsite-secondary-text-color);
    content: "schedule";
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px;font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal
}

body[codelabs-content-type=scrolling][type=codelab] h3>.devsite-heading>a[href*=github],body[codelabs-content-type=scrolling][type=codelab] h3>.devsite-heading>a[href*=github]:visited {
    color: #000;
    text-decoration: none;
    padding-left: 24px;
    background-repeat: no-repeat;
    background-size: 18px;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAB4CAMAAAAOusbgAAAAflBMVEUAAACXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZbf2s+YAAAAKXRSTlMA+SAC7QrIBPXROWMX17rCSmusXEaAD9zNeXFWJqOLMx3mtJJAK5xP4Jw4LyAAAAT6SURBVGje1NbdcqJAEAXg0zJAQEFA0QhojJHE8/4vuBfrJlvQGHSGbO13CzVT09M/g//HIssPRZAYIUkxSVAc8myBSfnrMjVUmbRc+5jEsUqFN0lazeDYogo4SlC5jPq6EI4mxRpOhKuId4pWof228y0fsJ1bbp0lfFCS4XFNSgtpg8eEO6EV2YV4QBvRWtTiXl4udEByD3fxCzpS+LhDk9CZpMFosaFDJsZItdApqTHKnM7NMULOCeQW5534zDUnUuOmWDgRiXFDYzgZ02CQn3BCiY8BXsFJFd7YQjLPkeGDTPRsRhZVK+zIABxX+yfe6Wm/OgL4YIe0UIQRO8x1jm/yiHeI8s11RdP7FKJvx649PmUBRwoyfNqza6dUktzsNt7HliNsa+9m95UGXSl7XvQn2OV0qOpzO1tsNotZe66rw+lyXbb08bcX9qToyNgjYTcoS3PaxT4UflydzLJ7nFDYk3V+SdhzQZfnQTP89VW5jPDbmRTAWvDdnAq1zFnC2pLfHHnFn9uYK3yJ+HOhZoRPa2peYe2VmjX+KKjawNKGqgJXC6HqDEtnqmSB3yrqSlgqqau+UkAVwVLEKz1tZxxQw1LNATObSNvHOqUqCGEtDKhKAcAXqlo40Ag14g92D77BiTcO9pByqNbsDfeIcvCK3+HI++AlG2piOBJTY4AjNVs4s6XmiMwitSzSK0Nu0bQs2leOAzUzODOj5qDPYvHgTCj6TA703HLoog+oxGIgWgzHBMbigWnx1DSQyTcOqBDw34Sav9q1sx1HYSAKoNcYE4cl0AlhIB22rF3//4PTI43ULbrMYjzKy5zHROiGyNhlyqAXDC5z8Acc6mcFu3+OpeCD+Y87ONMRR1isik6qet+wah3gzMEwfIPXLIsB9sQp4UxJnL2pDFRwRBHrauoEZHDkaeoV5PSKKpNydMTSCk4oTawO8O07Nva9JN+8Z0skHNgk5l3bkf7hLUcjW+CceH2B1YqeeDmzTXU5sB/EE4rZmDucsA9ksBtvJuoQq4SaDE5sqc8n2+eaNyqBOTmHtcycG8xo3B4lrMgjmZ0GrwtYaQsLbUBmImZeojKuHRbyHjRmz5ZFQRUdByfGxCPEfPJW07gbVyVoiU9xIwYz97GVs1LD5oMmbPknvcKntLmXNNDvT2GBEV1WXXyadjA0Q64bIMygLsTo00aCsbmWfCbfDOEnt6QF8EzjlBi6BasVdscU5HYwbdz9LO65y9ae4tjKwTzDTJUZfxlPJjRLhoELfdPHgNrl9ZIFK6I5LhjyxOB75QdFsqAEVIKmCW+qcZ0B9xvOPft7eReaVnFPRPmj1lPvbcJdx6toUrkB46zpmyeAnFLViMGDZvSkKfo8Y3ikAORjB8RVqonIT4+hxJjW/qRRzezNvd1VoegKoG1uGOPRhBomaktfAok/PJ9a3PykQEk1xsQ0bqtg5Pk/+04qBtryotDlG4wpaJTvzS7Q3sCwDdbhgu1sw9yi7V/9XFSEb3MwbAbXYWn5H7zF3+5J2gZHNhuPX5frsaqaOvWpsAw+rC3FY6tg/cRMYU88zya4DzGbV7oL3npYQNWugmuFZSLtIlhHWOwcrA8OzrAgT3pdsD5J2PH2a4L3HuzdStvgMscq8j2hL/e5wcm7BLA2OuBbFebVKWBirYR/D6OWc16JizqEO0WUCrHzMMrbCZFGBf5j/QYa/td1VlNoIAAAAABJRU5ErkJggg==)
}

body[codelabs-content-type=scrolling][type=codelab] .faq a[href*="cloud.google.com"] {
    padding-left: 22px;
    background-size: 20px;
    background-repeat: no-repeat;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAAC9FBMVEX////u7u7v7+/ZRDf/zEH/zkPbRTlJifT/z0XYRDhRj/XWRDdPjvVOjfX/zkH/z0fXQzdGiPXUQzdMi/VKi/Xr6+3t7e1SkPXbRDdLjPW70fPaQjVOjPXx8PD9/f1nnff19fXRQzdHifVJhOxEh/Tu7/JLifH9y0DUQjVtofhOi/NKh+9HgelGf+b+7saaWXX/zDz+yTrZRzrRQjT7+/vxx8PeqkTsuj32uzrOQzdqn/j39/fr6Oj9yT/3vjvaQDPUPTBJivVKifPq7O/z0Mz968T4wj7zwD3NPTHGPDD0+P9Bifrv8/Xx8vJJhu5EfOPo3Nv/0Ez8y0rxvT3ZPjBDi/tBhPT55ePkysj+3Hr/0VLHVErcpkPcTUH7xD35wTzztznpsTjKRTjo8P3U4/z6+vr//PmQt/mBrff//fayy/ZUkfZjmfSXufP78/L18+//+Oj66Of+9eBCdt3t59f/89TvxcPsurXasKztqKL+4Y7jjIT0033ShH3hc2ngaV7/1F3/0ljjv1fbWU37xkDaoEDCSj/xujvptjvutjrxtjn8xDflrDb5vjXJQjX2tzP4+v+bwf3I3Pyiw/t0pvhel/VZlPW90fP/+/DV3/Cdu+/e4uv33Nk+btP+8Mz+8Mniwb7+7L3u371Vdrv+6bDusq3+56j+5aTx2Z+Gjpj+4pbolI3RjYehnIT+2XPedW370mbHaGDMZl3bY1jQVUvbU0f/00PYTkLKSj/tsjjwpjfeXjfnfjbEQjbXPjTSPS/w9vu50vs7hfr5+flypPf89vb89fTF1fHM2vBsnfB3ou/67+6swOpekert6uNdi+M5deLq4OA/dt83bt80a9xmjdby19VKc8jx5cf12cP/7r/gwr+pnr/v4b7xwLtffbf+6rHx3KnorKjYqKTXpqHXo57aop3ZkovTwIboh3+jX3f30XDgenCWUm3Kc2zIsGnMcGj4y1zgYFXgX1TfrEXWlz7mhjfsrTbkljbabDbcVTbsmTBDSJ02AAAFFklEQVRYw+2WV1jTUABGkyZpi6W0tKUWC0hBsAporbMWrCgqKA6WCooK7r333nvvvffee++99957b33x3uTetIEGnnzx83y89Tunf25SWuI/f4Oqk6cU4ijLkr9sfp5Ckyfk6h8o5JkH4umpVPr5+fnqdLro6GiZTBYkk3l71z5SNbdA8zyt8wLYhKefUunr66vV6WQsMDExF3/StLytka/0VPopfbUgoEWBoCBv76lNcj6AFnnQ+6MB0BcsKNA8x2M4iPbjAThQgVsAA545TWg8RQlc5MMBflrg8wHgg3NsIX6OAa10Lr6SDQgHgAXetSeJD5iqRTrytfAKdHwgiAu0EZ3QvEBhYLLAu6+LDoIOtCApKSnVUqoBDondyiahoTggazt9ej4hd94Wxbya4z5wskZoYVgA0/NXlGSlVr3iJpOpOMsbt36r4BphsACQHSezBfSP4zQQs8Zs3n7P3QmeDQ8OAwVwdkEt0ADhhI3jFCxms7lfu+yBthHhwcFhoaCgnXZC4obqPYbZPABqgHVpNj/yak1QABdRQatriwcIiXy312alrBRFqff175jFb9lrZecIVGgz09+NTurjbw/LNFmtUqnVw8PRM0AY6JowaHFN7iIKz2rvtCIjfbBPkvF992aapABKakzvKByQymxbO5e7iDb8BfjoA5uWsPv7kJxPSi4Oy7RpgA/+kl8KArdolUq1uDMshLXCA8jD6NXqpEQPAmDCszibTSFlccS4+DMGMCrVtvdzO0eEh59CPulfgsDYoQ/Rb4q1mbiCsX8zZ2AVrQLIV16uGRGMTxD6PIEkh2TBOPA4og09nSeYJoe+fND1SxdmSRCBgg+6PypE9o01mTRq6Bs+1yEQqcCHJK69cn62xDnA3YS6W4qD51kBA9LV6MX5aXKuIB90/wyJnztCQFMJKuif2zQANfANn9CnchlYzyWYF7OFV8ATgAPV624BAzQKCgTSSxIsDxIYOQR00m7kFgjpsQP6CgUlNWxFd7LDAEaOoPvoc74ESa1NsUBXK9QelLHfafTqclZmKwXvsjpJihyi/mkc9j3Su/P7BngxeMJHPXoru9vbCP4vYZ9aT/DMpxkAW7CsCCFZ3D5I5BowAPnp1wgnqRaGQ84kduEKemchwC5BJ1jX6Tt6Ey50SvBiMH1AgCvYA1i9BP8UkRtjsW8c3E5wjcstfCBxUQgW/APt9sBAfxIR/2ScBvnS5O6EgA4baL7w+hzpRELyhNSqZ1Jgf/0xQsgSuXPCQzxBSPwaG/YpawyRhRnrvBh0DvSGLkITn2A9M/Kljt5HiawsTGAwxVbohS7+JGPfOBgNEJDK3wg60d2EBTvM2KdWE27opPLCWPqEZP9W+BCLfIoa3JFwxyoLX4haVNFHSMUecQrsGx8RbmmZxgfoIV9KIeoDhg4d+jXTzPubCREWWmhOB0SV5hgxYkRGxpgxY36i+2cEgRixQLN1FpqnYJWkKklJScNLjxy5MyPjhwf0Kegn9yZEmZdAuxQqVwEkDR8+auTO77uhD3XKsbWOeKBZL4ugULlyuXJlyjQaNeqbFfhG6BuSwdeqOF0H0q6FBmyhUaNdu6FPQd/RHw4Qpxfj4heMatCwIZywh1JTLAYD+mkhSoeBLoGoqCENYGDXL943oB834iyhLdjHgfF79mHfsb0bkRvLBhZDjB49euzYsePH/96/vzyHeXN3Inc6zSuCqcRys1tJjm4xdYj//JP8AXE5S/JuAn7MAAAAAElFTkSuQmCC)
}

body[codelabs-content-type=scrolling][type=codelab] .faq a[href*="stackoverflow.com"] {
    padding-left: 22px;
    background-size: 24px;
    background-repeat: no-repeat;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAATwAAAE8CAMAAABq2/00AAAA4VBMVEUAAACCg4aCg4aCg4bIj0P1fx/2hh+ojHCojHCojHD2ih/UjCn0eiD0eiD2hB/2hR/RjjDUjCnKkkPUjCnUjCn2ih/UjCnCllPCllP2ih/CllPCllPCllP2ih/CllPCllPCllP2ih/2ih/CllPCllP2ih/2ih/CllPUjCnCllPUjCn0eiD0eiD2ih+ojHD0eiDUjCn0eiD0eiCojHDUjCn0eiDUjCn0eiDUjCnUjCn0eiCojHD0eiCojHD2ih+ojHD2ih+ojHCojHCdiXaViHuCg4aojHD0eiDCllPUjCn2ih8XYwy7AAAARXRSTlMAv0CAEEAQv4BA7++/gCBQQN8wIIDPv2Dfv5+PUDDPryCAcO+/r49wn4Bg79/frJ9QcGDPr6+Pj3DPz2AwIJ9wYOaPVDAbIL/gAAAGhElEQVR42uzbsYrCQBDG8WmyxaJJlcIixQmxMSIRgiBB7Bbm/R/oPAnH3e0SxwSvyf/3DLt8zDeMAAAAAAAAAAAAAAAAAAAAAAAAAAAA4F9k7Xm1Xwlek53WqyY87AVWfbHumvCTE5hkIZYJTFyIrQU2+xA5CmxWIULcWq1DTGBzCrFcMDluC4ENcTtDEyKdwKYLkYuAuH27ggFtuj7ETgLiNo0B7Z3c1YnNMUQaWbTC6/W1uKUPHbha7wr60GnP7ot3YpGHWCsL5Wod1JP70LMsU+H12424nfDsBj4XgzMD2kN20F82YtDSh965nf61JW7Nzy7iKwY067OLlfJcw/qx1KQPQ9zSh1aaVtGHGnxoUummrB97WZhSk3byRM/6UST3mpQRtwZbTTo4GXdhQLvbaNJVxnX0oSMftyBuDQpN8o4BzaDWpFrG5KwfH5zXpJuMCfShox83pw812GnSxrx+XPI5hjvowF7ttawfB5km+Yq4nf5xS84x5lR7nGPMqfaI2znVHgPajGqPc4w51R7nGJ/sm29P2zAQh49h1kJgJHGWlrbQItAIebNO67owadpgwOzv/4Wm8S8NLsXxGSTu/HyEk/O78+McRu0FH4pQe2EdA6P2wjoGRu2FdotQe2EdA6P2wjoGRu2FdotQe+GChlF7DNcxKulN7bFbx4h1lPlSe+x8aKK1Tqae1B6zdYxM35BLP2qP1TqGjPQdmfCi9ji125l+ICp9qD1G6xixXiSPPag9PusYiW5SCLza49JuK/2YKEOrPSYXNBFpkyTGqj0e6xiFXkoukWqPwzpGrJ8iEyi1x8GHnuknSUqU2qO/jlHpVeQpwhB8oL6OISK9mkK4qz3q7bbQzxFV7mqP9jpGqi1IYme1R3sdI060BTPpaAiot9ss0hZkwk3tUb+gyUJbkEzd1B55HxqfaQvy1Ent0V/HKCNtwVy0NwSfGPhQMdcWRJWD2uOwjiFzbcFZ3F7tsVjHmDqMLTZqj3S7bTm2RJloZwh2maxjyJnd2NJS7XFZx7AcW2QrtUe93dZUDmOLjdrbaTTa7e9fNgj1i7ZjS9lK7dU+dPvzzgaRZ8elpPZji73a2/j749vOLuWytRtbCmmv9jghLMcWuw936zfwwnZssTAEexw+VidTmstn1N4Wr2/2gcrBlO6HY3eHKNqPLYfh2FmPLeZ/aXvh2D1Q2o0tYkHt8ZxQliIybTm2NNXex30IWI8tcePDPYSAywPv+61w7NwfeHfJHrvJS44tSQmUGan+oCfAgTi3fOCly1D952A4eqkH3gTocqDuOT5NX2JsmQJZhFrkaHwy8fzAmwNdeuoRRgQiTakEugyUSR2B+LFlDoTpK4M6AvH/pUUC6JIqAyMCMQ+8pMe8E2XgGIFlxKxbAIyVgUUEWj/wUh6QAZQBIgJlzqlbQKwMUBE4Tdh0C4ChMsBFoMgiJt2ivpvVoCNQznh0CxDKAB2B9dgSA2l6ygAbgfUDbwG0GSgDPxEo5tS7xYq7GT4CU8Im6pbRsNkxMBFIex5ezqQ3qM8fPgL5kZ6Mj1QNLgKpR90y4tNjpbxFID+ExwjsAUN8ReAYmOIjAlmePF8RyLHv+orAPgScI3AIb531tQZ/XjECR3DL5VoTeDOsXTVYf8UIFHDLu6sm8GZAFA8ZgccQimcgLCPwNBRvOROLCExD8Z4mXR2BRxCK5+wCx6F47hHYC8Vzj8BJKJ5zBPYhFM85Agf0i3dx3ulcdLubm5e+I3BEv3id65r7Ov70EoGCV/EW+NrpdLu/cHWkX7zz65pn6hiK9689O8hJKIaiMCxK0nYzTBgSYxDs/pekiTohEq/v0eRKv28J/+zkXMbrF2IdxQvEC3ScOF7r6+3LrtZDa1vxVinfHaeId+qjTBCv9kGO4i1XJoi365/EWxCv9EF24i1XJ4jXv4iXKd7p/uNt+yjt/uO1PspZvOVmmGcPrZ1q3ZUi3qoDaNva4WYdj5PFu2nHMm+8nzqKF4y3vuOreL923PcrqngRz6291FrKXrxbdWzifXB6iydehHh5iDco3maQpxnivQ2yEU888cQLEi8R8cSLES8R8cSLES8R8cSLES8R8cSLES8R8QbFexzkPEO86xxA4on3F+LlIZ54QeLlIZ54QeLlIZ54QeLlId6qeOk8/BviiRciXibiiRciXibiiRciXibiiRciXibiiQcAAAAAAAAAAAAAAAAAwHTeAe21evvWi2VXAAAAAElFTkSuQmCC)
}

body[codelabs-content-type=scrolling][type=codelab] .faq a[href*="support.google.com/webmasters/"] {
    padding-left: 24px;
    background-size: 24px;
    background-repeat: no-repeat;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAMAAAD04JH5AAAAolBMVEUAAADW1tbW1tZ6enrQ0dJ6enrMzMzq6+zq6+x6enru7+/m5+ju7+/m5+j////S09REi/XW1tbm5+ju7+9PT0/Q0dK8vLxGjfVZWVlNTU16enrMzMzIyMj09PS/0uuSkpJpaWmbm5tim/e0tLSEhIStx+3e3+GsrKxwcHBZk/dPk/R1p/KPtu/U3eqmpqZlZWVfmO5woeqHreWvwN6nu9qLi4vZSE73AAAADnRSTlMAEcxmzO7MzDMz7u6IiHn/rpYAAALMSURBVHja7dXpjtowFIZhUkqZlSV1ncQdEsK+zD7T+7+1xjTiwxVOAmeORyP5+2UspPchEtDy8/Pz8/Pz8/M7cZeduHKdyxbL0FfVAMUraHdUHUB12i22tZWqBRSDgKFfC4CApV8PgIClXw/gE6hyTd/lAR7gAV8fEHwbWtc/ul/WfQ8IfQKAIECfCoCA3sdq+nQB+nQABIQ+CQABtY9Z+lQB+gwACBj6AFAE6DM9AL0fAalPB/yGgNAfntwHAAJKnwCAwNLneQAAVAvM/ttzVLlB4z2/A6AFVoDRf43IfewVgGKNAG/Uvrl39BsCXqh9cy8nA/51tmk63+jDZp6m9wTA4DzANiyW6lOqTxAMHAD22XASReuwpKDvELCNookBGJwx9E8B3OvsQp8e9GmOviNANA/Dh4k+TApBukHfFSBa7/I7whqf3xWA/gOAoU8DDJwBCHk+wIAw9CsAPw/W++CFB/MAD/hCgL59PXPS8toRYKHEndkTauEQIIUQ0hToG2eAXOicKdBXmSPAo9CTpkDo5U4Ad6IEGILy0gFgFJctCACIh/yATABwIChvVyE3IBR7AAQAiOmIGZADAMEBQMkRL+AJAAgOALGUI07AQgBgCPb3uRbwAaYAGAIAZlIL2AA5AIYAgJXUAjaAAsAQADCWO4EjAAQGQAvYAUsDsDQAeuwAMZvu89PZ/jZhBmQCi2dl60+MPiMAf8UgZEUpK/LoJ4oX0C9LIIyF0U8yXkBPVCzRWzIDZjX9sWQG9Kv7ScYN6KnKfizZAf2qfpLzA3p5RV9JboDeytp/kk4Ao5WtP+UFQKCO9sdTSQQ03+OR/kxKdgAWZv/11VI6AWBmP5HSNQD5zwQknwxIqIBu468hBgDqNYCuFXBDASSNAbdWQHB1PiBpDLgOWtZdXPEDri/QswjYAOjbF9x0OQHd26Dl5+fn5+fn5+dn7i/3LEaKJNV/0wAAAABJRU5ErkJggg==)
}

body[codelabs-content-type=scrolling][type=codelab] .faq a[href*="developer.android.com"],body[codelabs-content-type=scrolling][type=codelab] .faq a[href*=android-developer] {
    padding-left: 20px;
    background-repeat: no-repeat;
    background-size: 20px;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAMAAADVRocKAAAAq1BMVEX///+lyjmfxyGhyCqkyjakyTP+/vuiyS7z+OWlyjKgxyTX57ChyCfa6bTx9uLy9+Sz0l6szk/D24Tt9NrN4ZnK4JSiyCyexh34+/D6/PTp8dPh7cjf7L7k78vc6rnW5qzU5ajS5KPP4p+21GWnzD3F3Yi813Kx0ViqzUWexhr8/vjv9d7Z6LKy0lyZxADh7cLA2n2rzkr1+erJ35C61m6uz1KcxRHn8M6/2XgEePWtAAACr0lEQVRo3u3Z2XKiQBiG4Y9ebNO2aCCyzOC+7zH7/V/ZRJZQZaJpWnKS4TlJUItXbX4pFJXK71DTusvccI6z5oMSAutdhDP2uzpK4CxwxsRBGYJdA19qLAOU4s4LkyUN7G4Ude2glmzuRihHKDqAPZhNuJRKSckms37rvctrKMnG728l5cxKMU7JuCF7KEvf87h1gnu0iXK4B2p9Sc3dUgZNMusMLvu42r20LiBXT8JMWRepN1xlGu+fK8/6xFPxwsvH697/eP/j7uDTOvB+dxwX/AaM2SQ+6icrYHDyGmgfWE3irNeCqTaPAwcArydroboAbuMAb8NQRNJn20SYtHK8HaKZzoffhZl5tlNxsD5PsnUQ2b9jwwnO35WvRo3lN/o2TDwKS5M3gokF0w2wZxgIlpY2FpgsgdQPkLXJQar0A/LVIDB6Idp2GxQQrJI/rbq2Voijlc5S9LZs8uYCqBVyXLTZhLW/fSn3hDMmZAQ05I020gT2PmeM+w4uGpLksFs+oEEtbaqJVnpUkz4uyebf6xQK0CY6XjoSC1xQ9/PPr4KB52zuvTrOa5EssC0auM0C0tYKtI0DqgpUgSpQBapAFfifAj90Tn5YZoGnooH8eutB56KDDosGhlTrYiTyk0epVdFAKJLn9rLHRSNfcE4tF0UDcAXlXPhDfGPtjGejEMUDCEdPY8eFHoOADvPAxiDQLBBQkUHAJfoB34UBS/9CfAETe6lZYKZft/QIFe94vicRy7tcvKOkB0PhYOo4zlNWYNvjpjOdZwU+O24OQlynK62EGCF2J9IbpIsy/P0I3CHW+Qj8qQJVoAr8VOCx3EB+YvDSwIDmXzaW4oZZseU6Lfr5aaAUPT8uyPuT33VeIpRkI5RHyRQfHEKFUj2UJuh1GjaQsxudKECl8jv8A6GtQkKSkMLrAAAAAElFTkSuQmCC)
}

@media screen and (max-width: 840px) {
    body[codelabs-content-type=paginated] .devsite-badger-award {
        left:0
    }

    body[codelabs-content-type=scrolling][type=codelab] .codelab-banner .devsite-banner-message {
        padding: 16px 24px
    }
}

body[codelabs-content-type=paginated] google-codelab-about .codelab-title {
    width: 100%;
    text-align: center;
    font-size: 32px;
    margin: 20px auto 30px auto;
    line-height: 45px;
    max-width: 700px
}

body[codelabs-content-type=paginated] google-codelab-about .codelab-title .token {
    display: inline-block;
    margin: 0 5px
}

body[codelabs-content-type=paginated] google-codelab-about .about-card {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    border: 1px solid #dadce0;
    border-radius: 5px;
    background: #fff;
    max-width: 800px;
    margin: 0 auto 30px auto;
    padding: 20px
}

body[codelabs-content-type=paginated] google-codelab-about .about-card h2 {
    font-weight: 500;
    font-weight: 400!important;
    line-height: 1em!important;
    margin: 0!important;
    font-size: 28px
}

body[codelabs-content-type=paginated] google-codelab-about .about-card>:not(:first-child) {
    padding-top: 30px
}

body[codelabs-content-type=paginated] google-codelab-about .about-card .material-icons {
    margin-right: 10px;
    top: 6px;
    position: relative
}

body[codelabs-content-type=scrolling][ready] google-codelab-about {
    border-radius: 4px;
    border: var(--devsite-primary-border);
    border-left: solid 4px var(--google-codelab-about-active-border-color);
    display: block;
    margin-top: 32px;
    padding: 32px
}

body[codelabs-content-type=scrolling] google-codelab-about .caption {
    color: var(--devsite-primary-text-color);
    font: 400 12px/16px var(--devsite-primary-font-family);
    letter-spacing: .3px;
    margin: 0 0 24px;
    text-transform: uppercase
}

body[codelabs-content-type=scrolling] google-codelab-about .about {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

body[codelabs-content-type=scrolling] google-codelab-about .about-item {
    -webkit-border-end: solid 1px var(--devsite-background-5);
    -moz-border-end: solid 1px var(--devsite-background-5);
    border-inline-end:solid 1px var(--devsite-background-5);-webkit-padding-end: 16px;
    -moz-padding-end: 16px;
    padding-inline-end:16px;-webkit-padding-start: 16px;
    -moz-padding-start: 16px;
    padding-inline-start:16px}

body[codelabs-content-type=scrolling] google-codelab-about .about-item:first-child {
    -webkit-padding-start: 0;
    -moz-padding-start: 0;
    padding-inline-start:0}

body[codelabs-content-type=scrolling] google-codelab-about .about-item:last-child {
    -webkit-border-end: 0;
    -moz-border-end: 0;
    border-inline-end:0;-webkit-padding-end: 0;
    -moz-padding-end: 0;
    padding-inline-end:0}

body[codelabs-content-type=scrolling] google-codelab-about .authors,body[codelabs-content-type=scrolling] google-codelab-about .duration,body[codelabs-content-type=scrolling] google-codelab-about .last-updated {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    font: 14px/20px var(--devsite-primary-font-family)
}

body[codelabs-content-type=scrolling] google-codelab-about .material-icons {
    color: var(--devsite-secondary-text-color);
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end:8px}

@media screen and (max-width: 840px) {
    body[codelabs-content-type=scrolling] google-codelab-about .about {
        -webkit-box-orient:vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 16px;
        padding: 0
    }

    body[codelabs-content-type=scrolling] google-codelab-about .about-item {
        border: 0;
        padding: 0
    }
}

body[codelabs-content-type=paginated] google-codelab-step {
    line-height: 24px;
    display: block
}

body[codelabs-content-type=paginated] google-codelab-step:focus {
    outline: none
}

body[codelabs-content-type=paginated] google-codelab-step code,body[codelabs-content-type=paginated] google-codelab-step pre {
    font-family: Source Code Pro,Helvetica,Arial;
    font-size: inherit;
    border-radius: 4px;
    overflow-x: auto;
    overflow-y: visible
}

body[codelabs-content-type=paginated] google-codelab-step code {
    background-color: #e8eaed;
    padding: .1em .3em
}

body[codelabs-content-type=paginated] google-codelab-step pre {
    display: block;
    color: #fff;
    background-color: #28323f;
    padding: 14px;
    -webkit-text-size-adjust: none;
    line-height: 1.4
}

body[codelabs-content-type=paginated] google-codelab-step pre>code {
    padding: 0;
    background-color: transparent
}

body[codelabs-content-type=paginated] google-codelab-step code em {
    color: #97c8f2
}

body[codelabs-content-type=paginated] google-codelab-step code .str,body[codelabs-content-type=paginated] google-codelab-step pre .str {
    color: #34a853
}

body[codelabs-content-type=paginated] google-codelab-step code .kwd,body[codelabs-content-type=paginated] google-codelab-step pre .kwd {
    color: #f538a0
}

body[codelabs-content-type=paginated] google-codelab-step code .com,body[codelabs-content-type=paginated] google-codelab-step pre .com {
    color: #bdc1c6
}

body[codelabs-content-type=paginated] google-codelab-step code .typ,body[codelabs-content-type=paginated] google-codelab-step pre .typ {
    color: #24c1e0
}

body[codelabs-content-type=paginated] google-codelab-step code .lit,body[codelabs-content-type=paginated] google-codelab-step pre .lit {
    color: #4285f4
}

body[codelabs-content-type=paginated] google-codelab-step code .pun,body[codelabs-content-type=paginated] google-codelab-step pre .pun {
    color: #f8f9fa
}

body[codelabs-content-type=paginated] google-codelab-step code .pln,body[codelabs-content-type=paginated] google-codelab-step pre .pln {
    color: #f8f9fa
}

body[codelabs-content-type=paginated] google-codelab-step code .tag,body[codelabs-content-type=paginated] google-codelab-step pre .tag {
    color: #24c1e0
}

body[codelabs-content-type=paginated] google-codelab-step code .atn,body[codelabs-content-type=paginated] google-codelab-step pre .atn {
    color: #eda912
}

body[codelabs-content-type=paginated] google-codelab-step code .atv,body[codelabs-content-type=paginated] google-codelab-step pre .atv {
    color: #34a853
}

body[codelabs-content-type=paginated] google-codelab-step code .dec,body[codelabs-content-type=paginated] google-codelab-step pre .dec {
    color: #5195ea
}

body[codelabs-content-type=paginated] google-codelab-step paper-button {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    min-width: 5.14em;
    margin: 0 .29em;
    background: transparent;
    -webkit-tap-highlight-color: transparent;
    font: inherit;
    text-transform: uppercase;
    outline-width: 0;
    border-radius: 3px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    z-index: 0;
    padding: .7em .57em;
    font-family: Roboto,Noto,sans-serif;
    -webkit-font-smoothing: antialiased;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12),0 3px 1px -2px rgba(0,0,0,.2)
}

body[codelabs-content-type=paginated] google-codelab-step h2.step-title {
    font-family: Google Sans,Arial,sans-serif!important;
    font-size: 28px!important;
    font-weight: 400!important;
    line-height: normal!important;
    margin: 0 0 30px!important
}

body[codelabs-content-type=paginated] google-codelab-step .step-title a {
    color: #3c4043;
    text-decoration: none
}

body[codelabs-content-type=paginated] google-codelab-step .step-title a:focus,body[codelabs-content-type=paginated] google-codelab-step .step-title a:hover {
    color: #212121;
    text-decoration: underline
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions {
    box-shadow: 0 1px 2px 0 rgba(60,64,67,.3),0 2px 6px 2px rgba(60,64,67,.15);
    background: #fff;
    max-width: 800px;
    font-size: 14px;
    margin: 0 auto;
    margin-bottom: 90px;
    border-radius: 4px
}

body[codelabs-content-type=paginated] google-codelab-step .instructions .inner {
    padding: 24px
}

body[codelabs-content-type=paginated] google-codelab[theme=minimal] google-codelab-step .instructions .inner {
    padding: 0 24px
}

@media (max-width: 800px) {
    body[codelabs-content-type=paginated] google-codelab .instructions {
        margin:0 0 16px 0
    }
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions :not(.step-title)>a,body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions :not(.step-title)>a:visited {
    color: #1a73e8
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions h2,body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions h3,body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions h4 {
    font-weight: 400;
    margin: 0
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions h2 {
    font-weight: 300;
    line-height: 1em;
    font-size: 22px
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions {
    line-height: 24px
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions li {
    margin: .5em 0
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions h2 {
    font-weight: 500;
    margin: 20px 0 0 0;
    font-size: 20px
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions h3 {
    font-size: 16px;
    font-weight: 500;
    margin: 20px 0 0 0
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions aside {
    padding: .5em 1em;
    margin: 2em 0;
    border-left: 4px solid;
    border-radius: 4px
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions aside p {
    margin: .5em 0
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions aside.note,body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions aside.notice {
    border-color: #ea8600;
    background: #fef7e0;
    color: #212124
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions aside.special,body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions aside.tip {
    border-color: #137333;
    background: #e6f4ea;
    color: #212124
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions aside.warning {
    border-color: #ea8600;
    background: #fef7e0;
    color: #212124
}

body[codelabs-content-type=paginated] google-codelab-step .instructions aside.callout {
    background-color: #e8f0fe;
    margin: 20px 0;
    padding: 15px;
    border-left: 3px solid #185abc;
    border-radius: 4px;
    color: #212124;
    font-size: 14px;
    line-height: 1.5
}

body[codelabs-content-type=paginated] google-codelab-step aside.callout b {
    color: #185abc
}

body[codelabs-content-type=paginated] google-codelab-step .instructions ul.checklist {
    list-style: none;
    padding: 0 0 0 1em
}

body[codelabs-content-type=paginated] google-codelab-step .instructions ul.checklist li {
    padding-left: 24px;
    background-size: 20px;
    background-repeat: no-repeat;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAAWlBMVEUAAAAxokwwoks1pFAxokwxokwxokwxokwxokwnnkQnnkQnnkRou3y84cTS69cxokwonkQxokwnnkRqvH1VsmtluXlVsmsnnkRdtnLw+PIxokwqn0YinEAfmj3goh/UAAAAGnRSTlMA2CcEo+6AQT7+2IOBJxPl27alhoBnX15SCCe258UAAAB+SURBVEjH7dA5EoAgEERR3BcQ923Q+1/T0SqKlNbMouP3gxkRFvZpyQb64VSQT4mOcYc8mU5DnqIG8zXoozj4d34tML+YrET8XBFx4e2F4oAL4N7J3EUB/EfSUwD/zG3hvFdROu9XtL31vgXguQA9F6DnAvM8WbOHpkXYD3cBBCcPjtASYjwAAAAASUVORK5CYII=")
}

body[codelabs-content-type=paginated] google-codelab-step .instructions h2 code,body[codelabs-content-type=paginated] google-codelab-step .instructions table code {
    background: #fff
}

body[codelabs-content-type=paginated] google-codelab-step .instructions .indented {
    margin-left: 40px
}

body[codelabs-content-type=paginated] google-codelab-step .instructions strong {
    font-weight: 600
}

body[codelabs-content-type=paginated] google-codelab-step .instructions :link paper-button {
    text-decoration: none!important
}

body[codelabs-content-type=paginated] google-codelab-step .instructions paper-button {
    display: inline-block;
    border-radius: 4px;
    color: #fff;
    font-family: Google Sans,Arial,sans-serif;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .6px;
    padding-bottom: 6px;
    padding-left: 12px;
    padding-right: 16px;
    padding-top: 6px;
    text-transform: none
}

body[codelabs-content-type=paginated] google-codelab-step .instructions paper-button a {
    text-decoration: none;
    color: inherit!important
}

body[codelabs-content-type=paginated] google-codelab-step a paper-button {
    display: inline-block
}

body[codelabs-content-type=paginated] google-codelab-step .instructions paper-button.colored {
    background-color: #1e8e3e
}

body[codelabs-content-type=paginated] google-codelab-step .instructions paper-button.red {
    background-color: #d93025
}

body[codelabs-content-type=paginated] google-codelab-step .instructions iron-icon {
    vertical-align: sub;
    margin-right: 7px;
    margin-left: 3px;
    font-size: 16px;
    top: -1px;
    position: relative
}

body[codelabs-content-type=paginated] iron-icon {
    font: normal normal normal 24px/1 Material Icons
}

body[codelabs-content-type=paginated] google-codelab-step .instructions img {
    max-width: 100%;
    vertical-align: bottom
}

body[codelabs-content-type=paginated] google-codelab-step .instructions .image-container {
    text-align: center
}

body[codelabs-content-type=paginated] google-codelab-step .instructions table {
    border-spacing: 0
}

body[codelabs-content-type=paginated] google-codelab-step .instructions td {
    vertical-align: top;
    border-bottom: 1px solid #ccc;
    padding: 8px
}

body[codelabs-content-type=paginated] google-codelab-step .instructions table p {
    margin: 0
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) .instructions h3.faq {
    border-bottom: 1px solid #ddd
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) .instructions ul.faq {
    list-style: none;
    padding-left: 1em
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) .instructions .faq li {
    font-size: 1.1em;
    margin-bottom: .8em
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) .instructions .faq a {
    color: inherit;
    text-decoration: none
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) .instructions .faq a:hover {
    text-decoration: underline
}

body[codelabs-content-type=paginated] google-codelab-step .instructions .faq a[href*="cloud.google.com"] {
    padding-left: 22px;
    background-size: 20px;
    background-repeat: no-repeat;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAAC9FBMVEX////u7u7v7+/ZRDf/zEH/zkPbRTlJifT/z0XYRDhRj/XWRDdPjvVOjfX/zkH/z0fXQzdGiPXUQzdMi/VKi/Xr6+3t7e1SkPXbRDdLjPW70fPaQjVOjPXx8PD9/f1nnff19fXRQzdHifVJhOxEh/Tu7/JLifH9y0DUQjVtofhOi/NKh+9HgelGf+b+7saaWXX/zDz+yTrZRzrRQjT7+/vxx8PeqkTsuj32uzrOQzdqn/j39/fr6Oj9yT/3vjvaQDPUPTBJivVKifPq7O/z0Mz968T4wj7zwD3NPTHGPDD0+P9Bifrv8/Xx8vJJhu5EfOPo3Nv/0Ez8y0rxvT3ZPjBDi/tBhPT55ePkysj+3Hr/0VLHVErcpkPcTUH7xD35wTzztznpsTjKRTjo8P3U4/z6+vr//PmQt/mBrff//fayy/ZUkfZjmfSXufP78/L18+//+Oj66Of+9eBCdt3t59f/89TvxcPsurXasKztqKL+4Y7jjIT0033ShH3hc2ngaV7/1F3/0ljjv1fbWU37xkDaoEDCSj/xujvptjvutjrxtjn8xDflrDb5vjXJQjX2tzP4+v+bwf3I3Pyiw/t0pvhel/VZlPW90fP/+/DV3/Cdu+/e4uv33Nk+btP+8Mz+8Mniwb7+7L3u371Vdrv+6bDusq3+56j+5aTx2Z+Gjpj+4pbolI3RjYehnIT+2XPedW370mbHaGDMZl3bY1jQVUvbU0f/00PYTkLKSj/tsjjwpjfeXjfnfjbEQjbXPjTSPS/w9vu50vs7hfr5+flypPf89vb89fTF1fHM2vBsnfB3ou/67+6swOpekert6uNdi+M5deLq4OA/dt83bt80a9xmjdby19VKc8jx5cf12cP/7r/gwr+pnr/v4b7xwLtffbf+6rHx3KnorKjYqKTXpqHXo57aop3ZkovTwIboh3+jX3f30XDgenCWUm3Kc2zIsGnMcGj4y1zgYFXgX1TfrEXWlz7mhjfsrTbkljbabDbcVTbsmTBDSJ02AAAFFklEQVRYw+2WV1jTUABGkyZpi6W0tKUWC0hBsAporbMWrCgqKA6WCooK7r333nvvvffee++99957b33x3uTetIEGnnzx83y89Tunf25SWuI/f4Oqk6cU4ijLkr9sfp5Ckyfk6h8o5JkH4umpVPr5+fnqdLro6GiZTBYkk3l71z5SNbdA8zyt8wLYhKefUunr66vV6WQsMDExF3/StLytka/0VPopfbUgoEWBoCBv76lNcj6AFnnQ+6MB0BcsKNA8x2M4iPbjAThQgVsAA545TWg8RQlc5MMBflrg8wHgg3NsIX6OAa10Lr6SDQgHgAXetSeJD5iqRTrytfAKdHwgiAu0EZ3QvEBhYLLAu6+LDoIOtCApKSnVUqoBDondyiahoTggazt9ej4hd94Wxbya4z5wskZoYVgA0/NXlGSlVr3iJpOpOMsbt36r4BphsACQHSezBfSP4zQQs8Zs3n7P3QmeDQ8OAwVwdkEt0ADhhI3jFCxms7lfu+yBthHhwcFhoaCgnXZC4obqPYbZPABqgHVpNj/yak1QABdRQatriwcIiXy312alrBRFqff175jFb9lrZecIVGgz09+NTurjbw/LNFmtUqnVw8PRM0AY6JowaHFN7iIKz2rvtCIjfbBPkvF992aapABKakzvKByQymxbO5e7iDb8BfjoA5uWsPv7kJxPSi4Oy7RpgA/+kl8KArdolUq1uDMshLXCA8jD6NXqpEQPAmDCszibTSFlccS4+DMGMCrVtvdzO0eEh59CPulfgsDYoQ/Rb4q1mbiCsX8zZ2AVrQLIV16uGRGMTxD6PIEkh2TBOPA4og09nSeYJoe+fND1SxdmSRCBgg+6PypE9o01mTRq6Bs+1yEQqcCHJK69cn62xDnA3YS6W4qD51kBA9LV6MX5aXKuIB90/wyJnztCQFMJKuif2zQANfANn9CnchlYzyWYF7OFV8ATgAPV624BAzQKCgTSSxIsDxIYOQR00m7kFgjpsQP6CgUlNWxFd7LDAEaOoPvoc74ESa1NsUBXK9QelLHfafTqclZmKwXvsjpJihyi/mkc9j3Su/P7BngxeMJHPXoru9vbCP4vYZ9aT/DMpxkAW7CsCCFZ3D5I5BowAPnp1wgnqRaGQ84kduEKemchwC5BJ1jX6Tt6Ey50SvBiMH1AgCvYA1i9BP8UkRtjsW8c3E5wjcstfCBxUQgW/APt9sBAfxIR/2ScBvnS5O6EgA4baL7w+hzpRELyhNSqZ1Jgf/0xQsgSuXPCQzxBSPwaG/YpawyRhRnrvBh0DvSGLkITn2A9M/Kljt5HiawsTGAwxVbohS7+JGPfOBgNEJDK3wg60d2EBTvM2KdWE27opPLCWPqEZP9W+BCLfIoa3JFwxyoLX4haVNFHSMUecQrsGx8RbmmZxgfoIV9KIeoDhg4d+jXTzPubCREWWmhOB0SV5hgxYkRGxpgxY36i+2cEgRixQLN1FpqnYJWkKklJScNLjxy5MyPjhwf0Kegn9yZEmZdAuxQqVwEkDR8+auTO77uhD3XKsbWOeKBZL4ugULlyuXJlyjQaNeqbFfhG6BuSwdeqOF0H0q6FBmyhUaNdu6FPQd/RHw4Qpxfj4heMatCwIZywh1JTLAYD+mkhSoeBLoGoqCENYGDXL943oB834iyhLdjHgfF79mHfsb0bkRvLBhZDjB49euzYsePH/96/vzyHeXN3Inc6zSuCqcRys1tJjm4xdYj//JP8AXE5S/JuAn7MAAAAAElFTkSuQmCC")
}

body[codelabs-content-type=paginated] google-codelab-step .instructions .faq a[href*="stackoverflow.com"] {
    padding-left: 22px;
    background-size: 24px;
    background-repeat: no-repeat;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAATwAAAE8CAMAAABq2/00AAAA4VBMVEUAAACCg4aCg4aCg4bIj0P1fx/2hh+ojHCojHCojHD2ih/UjCn0eiD0eiD2hB/2hR/RjjDUjCnKkkPUjCnUjCn2ih/UjCnCllPCllP2ih/CllPCllPCllP2ih/CllPCllPCllP2ih/2ih/CllPCllP2ih/2ih/CllPUjCnCllPUjCn0eiD0eiD2ih+ojHD0eiDUjCn0eiD0eiCojHDUjCn0eiDUjCn0eiDUjCnUjCn0eiCojHD0eiCojHD2ih+ojHD2ih+ojHCojHCdiXaViHuCg4aojHD0eiDCllPUjCn2ih8XYwy7AAAARXRSTlMAv0CAEEAQv4BA7++/gCBQQN8wIIDPv2Dfv5+PUDDPryCAcO+/r49wn4Bg79/frJ9QcGDPr6+Pj3DPz2AwIJ9wYOaPVDAbIL/gAAAGhElEQVR42uzbsYrCQBDG8WmyxaJJlcIixQmxMSIRgiBB7Bbm/R/oPAnH3e0SxwSvyf/3DLt8zDeMAAAAAAAAAAAAAAAAAAAAAAAAAAAA4F9k7Xm1Xwlek53WqyY87AVWfbHumvCTE5hkIZYJTFyIrQU2+xA5CmxWIULcWq1DTGBzCrFcMDluC4ENcTtDEyKdwKYLkYuAuH27ggFtuj7ETgLiNo0B7Z3c1YnNMUQaWbTC6/W1uKUPHbha7wr60GnP7ot3YpGHWCsL5Wod1JP70LMsU+H12424nfDsBj4XgzMD2kN20F82YtDSh965nf61JW7Nzy7iKwY067OLlfJcw/qx1KQPQ9zSh1aaVtGHGnxoUummrB97WZhSk3byRM/6UST3mpQRtwZbTTo4GXdhQLvbaNJVxnX0oSMftyBuDQpN8o4BzaDWpFrG5KwfH5zXpJuMCfShox83pw812GnSxrx+XPI5hjvowF7ttawfB5km+Yq4nf5xS84x5lR7nGPMqfaI2znVHgPajGqPc4w51R7nGJ/sm29P2zAQh49h1kJgJHGWlrbQItAIebNO67owadpgwOzv/4Wm8S8NLsXxGSTu/HyEk/O78+McRu0FH4pQe2EdA6P2wjoGRu2FdotQe2EdA6P2wjoGRu2FdotQe+GChlF7DNcxKulN7bFbx4h1lPlSe+x8aKK1Tqae1B6zdYxM35BLP2qP1TqGjPQdmfCi9ji125l+ICp9qD1G6xixXiSPPag9PusYiW5SCLza49JuK/2YKEOrPSYXNBFpkyTGqj0e6xiFXkoukWqPwzpGrJ8iEyi1x8GHnuknSUqU2qO/jlHpVeQpwhB8oL6OISK9mkK4qz3q7bbQzxFV7mqP9jpGqi1IYme1R3sdI060BTPpaAiot9ss0hZkwk3tUb+gyUJbkEzd1B55HxqfaQvy1Ent0V/HKCNtwVy0NwSfGPhQMdcWRJWD2uOwjiFzbcFZ3F7tsVjHmDqMLTZqj3S7bTm2RJloZwh2maxjyJnd2NJS7XFZx7AcW2QrtUe93dZUDmOLjdrbaTTa7e9fNgj1i7ZjS9lK7dU+dPvzzgaRZ8elpPZji73a2/j749vOLuWytRtbCmmv9jghLMcWuw936zfwwnZssTAEexw+VidTmstn1N4Wr2/2gcrBlO6HY3eHKNqPLYfh2FmPLeZ/aXvh2D1Q2o0tYkHt8ZxQliIybTm2NNXex30IWI8tcePDPYSAywPv+61w7NwfeHfJHrvJS44tSQmUGan+oCfAgTi3fOCly1D952A4eqkH3gTocqDuOT5NX2JsmQJZhFrkaHwy8fzAmwNdeuoRRgQiTakEugyUSR2B+LFlDoTpK4M6AvH/pUUC6JIqAyMCMQ+8pMe8E2XgGIFlxKxbAIyVgUUEWj/wUh6QAZQBIgJlzqlbQKwMUBE4Tdh0C4ChMsBFoMgiJt2ivpvVoCNQznh0CxDKAB2B9dgSA2l6ygAbgfUDbwG0GSgDPxEo5tS7xYq7GT4CU8Im6pbRsNkxMBFIex5ezqQ3qM8fPgL5kZ6Mj1QNLgKpR90y4tNjpbxFID+ExwjsAUN8ReAYmOIjAlmePF8RyLHv+orAPgScI3AIb531tQZ/XjECR3DL5VoTeDOsXTVYf8UIFHDLu6sm8GZAFA8ZgccQimcgLCPwNBRvOROLCExD8Z4mXR2BRxCK5+wCx6F47hHYC8Vzj8BJKJ5zBPYhFM85Agf0i3dx3ulcdLubm5e+I3BEv3id65r7Ov70EoGCV/EW+NrpdLu/cHWkX7zz65pn6hiK9689O8hJKIaiMCxK0nYzTBgSYxDs/pekiTohEq/v0eRKv28J/+zkXMbrF2IdxQvEC3ScOF7r6+3LrtZDa1vxVinfHaeId+qjTBCv9kGO4i1XJoi365/EWxCv9EF24i1XJ4jXv4iXKd7p/uNt+yjt/uO1PspZvOVmmGcPrZ1q3ZUi3qoDaNva4WYdj5PFu2nHMm+8nzqKF4y3vuOreL923PcrqngRz6291FrKXrxbdWzifXB6iydehHh5iDco3maQpxnivQ2yEU888cQLEi8R8cSLES8R8cSLES8R8cSLES8R8cSLES8R8QbFexzkPEO86xxA4on3F+LlIZ54QeLlIZ54QeLlIZ54QeLlId6qeOk8/BviiRciXibiiRciXibiiRciXibiiRciXibiiQcAAAAAAAAAAAAAAAAAwHTeAe21evvWi2VXAAAAAElFTkSuQmCC")
}

body[codelabs-content-type=paginated] google-codelab-step .instructions .faq a[href*="support.google.com/webmasters/"] {
    padding-left: 24px;
    background-size: 24px;
    background-repeat: no-repeat;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAMAAAD04JH5AAAAolBMVEUAAADW1tbW1tZ6enrQ0dJ6enrMzMzq6+zq6+x6enru7+/m5+ju7+/m5+j////S09REi/XW1tbm5+ju7+9PT0/Q0dK8vLxGjfVZWVlNTU16enrMzMzIyMj09PS/0uuSkpJpaWmbm5tim/e0tLSEhIStx+3e3+GsrKxwcHBZk/dPk/R1p/KPtu/U3eqmpqZlZWVfmO5woeqHreWvwN6nu9qLi4vZSE73AAAADnRSTlMAEcxmzO7MzDMz7u6IiHn/rpYAAALMSURBVHja7dXpjtowFIZhUkqZlSV1ncQdEsK+zD7T+7+1xjTiwxVOAmeORyP5+2UspPchEtDy8/Pz8/Pz8/M7cZeduHKdyxbL0FfVAMUraHdUHUB12i22tZWqBRSDgKFfC4CApV8PgIClXw/gE6hyTd/lAR7gAV8fEHwbWtc/ul/WfQ8IfQKAIECfCoCA3sdq+nQB+nQABIQ+CQABtY9Z+lQB+gwACBj6AFAE6DM9AL0fAalPB/yGgNAfntwHAAJKnwCAwNLneQAAVAvM/ttzVLlB4z2/A6AFVoDRf43IfewVgGKNAG/Uvrl39BsCXqh9cy8nA/51tmk63+jDZp6m9wTA4DzANiyW6lOqTxAMHAD22XASReuwpKDvELCNookBGJwx9E8B3OvsQp8e9GmOviNANA/Dh4k+TApBukHfFSBa7/I7whqf3xWA/gOAoU8DDJwBCHk+wIAw9CsAPw/W++CFB/MAD/hCgL59PXPS8toRYKHEndkTauEQIIUQ0hToG2eAXOicKdBXmSPAo9CTpkDo5U4Ad6IEGILy0gFgFJctCACIh/yATABwIChvVyE3IBR7AAQAiOmIGZADAMEBQMkRL+AJAAgOALGUI07AQgBgCPb3uRbwAaYAGAIAZlIL2AA5AIYAgJXUAjaAAsAQADCWO4EjAAQGQAvYAUsDsDQAeuwAMZvu89PZ/jZhBmQCi2dl60+MPiMAf8UgZEUpK/LoJ4oX0C9LIIyF0U8yXkBPVCzRWzIDZjX9sWQG9Kv7ScYN6KnKfizZAf2qfpLzA3p5RV9JboDeytp/kk4Ao5WtP+UFQKCO9sdTSQQ03+OR/kxKdgAWZv/11VI6AWBmP5HSNQD5zwQknwxIqIBu468hBgDqNYCuFXBDASSNAbdWQHB1PiBpDLgOWtZdXPEDri/QswjYAOjbF9x0OQHd26Dl5+fn5+fn5+dn7i/3LEaKJNV/0wAAAABJRU5ErkJggg==")
}

body[codelabs-content-type=paginated] google-codelab-step .instructions .faq a[href*="developer.android.com"],body[codelabs-content-type=paginated] google-codelab-step .instructions .faq a[href*=android-developer] {
    padding-left: 20px;
    background-repeat: no-repeat;
    background-size: 20px;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAMAAADVRocKAAAAq1BMVEX///+lyjmfxyGhyCqkyjakyTP+/vuiyS7z+OWlyjKgxyTX57ChyCfa6bTx9uLy9+Sz0l6szk/D24Tt9NrN4ZnK4JSiyCyexh34+/D6/PTp8dPh7cjf7L7k78vc6rnW5qzU5ajS5KPP4p+21GWnzD3F3Yi813Kx0ViqzUWexhr8/vjv9d7Z6LKy0lyZxADh7cLA2n2rzkr1+erJ35C61m6uz1KcxRHn8M6/2XgEePWtAAACr0lEQVRo3u3Z2XKiQBiG4Y9ebNO2aCCyzOC+7zH7/V/ZRJZQZaJpWnKS4TlJUItXbX4pFJXK71DTusvccI6z5oMSAutdhDP2uzpK4CxwxsRBGYJdA19qLAOU4s4LkyUN7G4Ude2glmzuRihHKDqAPZhNuJRKSckms37rvctrKMnG728l5cxKMU7JuCF7KEvf87h1gnu0iXK4B2p9Sc3dUgZNMusMLvu42r20LiBXT8JMWRepN1xlGu+fK8/6xFPxwsvH697/eP/j7uDTOvB+dxwX/AaM2SQ+6icrYHDyGmgfWE3irNeCqTaPAwcArydroboAbuMAb8NQRNJn20SYtHK8HaKZzoffhZl5tlNxsD5PsnUQ2b9jwwnO35WvRo3lN/o2TDwKS5M3gokF0w2wZxgIlpY2FpgsgdQPkLXJQar0A/LVIDB6Idp2GxQQrJI/rbq2Voijlc5S9LZs8uYCqBVyXLTZhLW/fSn3hDMmZAQ05I020gT2PmeM+w4uGpLksFs+oEEtbaqJVnpUkz4uyebf6xQK0CY6XjoSC1xQ9/PPr4KB52zuvTrOa5EssC0auM0C0tYKtI0DqgpUgSpQBapAFfifAj90Tn5YZoGnooH8eutB56KDDosGhlTrYiTyk0epVdFAKJLn9rLHRSNfcE4tF0UDcAXlXPhDfGPtjGejEMUDCEdPY8eFHoOADvPAxiDQLBBQkUHAJfoB34UBS/9CfAETe6lZYKZft/QIFe94vicRy7tcvKOkB0PhYOo4zlNWYNvjpjOdZwU+O24OQlynK62EGCF2J9IbpIsy/P0I3CHW+Qj8qQJVoAr8VOCx3EB+YvDSwIDmXzaW4oZZseU6Lfr5aaAUPT8uyPuT33VeIpRkI5RHyRQfHEKFUj2UJuh1GjaQsxudKECl8jv8A6GtQkKSkMLrAAAAAElFTkSuQmCC")
}

body[codelabs-content-type=paginated] google-codelab-step .instructions h3>a[href*=github],body[codelabs-content-type=paginated] google-codelab-step .instructions h3>a[href*=github]:visited {
    color: #000;
    text-decoration: none;
    padding-left: 24px;
    background-repeat: no-repeat;
    background-size: 18px;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAB4CAMAAAAOusbgAAAAflBMVEUAAACXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZaXlZbf2s+YAAAAKXRSTlMA+SAC7QrIBPXROWMX17rCSmusXEaAD9zNeXFWJqOLMx3mtJJAK5xP4Jw4LyAAAAT6SURBVGje1NbdcqJAEAXg0zJAQEFA0QhojJHE8/4vuBfrJlvQGHSGbO13CzVT09M/g//HIssPRZAYIUkxSVAc8myBSfnrMjVUmbRc+5jEsUqFN0lazeDYogo4SlC5jPq6EI4mxRpOhKuId4pWof228y0fsJ1bbp0lfFCS4XFNSgtpg8eEO6EV2YV4QBvRWtTiXl4udEByD3fxCzpS+LhDk9CZpMFosaFDJsZItdApqTHKnM7NMULOCeQW5534zDUnUuOmWDgRiXFDYzgZ02CQn3BCiY8BXsFJFd7YQjLPkeGDTPRsRhZVK+zIABxX+yfe6Wm/OgL4YIe0UIQRO8x1jm/yiHeI8s11RdP7FKJvx649PmUBRwoyfNqza6dUktzsNt7HliNsa+9m95UGXSl7XvQn2OV0qOpzO1tsNotZe66rw+lyXbb08bcX9qToyNgjYTcoS3PaxT4UflydzLJ7nFDYk3V+SdhzQZfnQTP89VW5jPDbmRTAWvDdnAq1zFnC2pLfHHnFn9uYK3yJ+HOhZoRPa2peYe2VmjX+KKjawNKGqgJXC6HqDEtnqmSB3yrqSlgqqau+UkAVwVLEKz1tZxxQw1LNATObSNvHOqUqCGEtDKhKAcAXqlo40Ag14g92D77BiTcO9pByqNbsDfeIcvCK3+HI++AlG2piOBJTY4AjNVs4s6XmiMwitSzSK0Nu0bQs2leOAzUzODOj5qDPYvHgTCj6TA703HLoog+oxGIgWgzHBMbigWnx1DSQyTcOqBDw34Sav9q1sx1HYSAKoNcYE4cl0AlhIB22rF3//4PTI43ULbrMYjzKy5zHROiGyNhlyqAXDC5z8Acc6mcFu3+OpeCD+Y87ONMRR1isik6qet+wah3gzMEwfIPXLIsB9sQp4UxJnL2pDFRwRBHrauoEZHDkaeoV5PSKKpNydMTSCk4oTawO8O07Nva9JN+8Z0skHNgk5l3bkf7hLUcjW+CceH2B1YqeeDmzTXU5sB/EE4rZmDucsA9ksBtvJuoQq4SaDE5sqc8n2+eaNyqBOTmHtcycG8xo3B4lrMgjmZ0GrwtYaQsLbUBmImZeojKuHRbyHjRmz5ZFQRUdByfGxCPEfPJW07gbVyVoiU9xIwYz97GVs1LD5oMmbPknvcKntLmXNNDvT2GBEV1WXXyadjA0Q64bIMygLsTo00aCsbmWfCbfDOEnt6QF8EzjlBi6BasVdscU5HYwbdz9LO65y9ae4tjKwTzDTJUZfxlPJjRLhoELfdPHgNrl9ZIFK6I5LhjyxOB75QdFsqAEVIKmCW+qcZ0B9xvOPft7eReaVnFPRPmj1lPvbcJdx6toUrkB46zpmyeAnFLViMGDZvSkKfo8Y3ikAORjB8RVqonIT4+hxJjW/qRRzezNvd1VoegKoG1uGOPRhBomaktfAok/PJ9a3PykQEk1xsQ0bqtg5Pk/+04qBtryotDlG4wpaJTvzS7Q3sCwDdbhgu1sw9yi7V/9XFSEb3MwbAbXYWn5H7zF3+5J2gZHNhuPX5frsaqaOvWpsAw+rC3FY6tg/cRMYU88zya4DzGbV7oL3npYQNWugmuFZSLtIlhHWOwcrA8OzrAgT3pdsD5J2PH2a4L3HuzdStvgMscq8j2hL/e5wcm7BLA2OuBbFebVKWBirYR/D6OWc16JizqEO0WUCrHzMMrbCZFGBf5j/QYa/td1VlNoIAAAAABJRU5ErkJggg==")
}

body[codelabs-content-type=paginated] google-codelab-step .youtube-video {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: auto;
    width: 560px;
    height: 315px;
    border: none;
    max-width: 100%;
    max-height: 51vw
}

body[codelabs-content-type=paginated] google-codelab-step .embedded-iframe {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin: auto;
    width: 560px;
    height: 315px;
    border: none;
    max-width: 100%;
    max-height: 51vw
}

body[codelabs-content-type=paginated] google-codelab google-codelab-step .note:before,body[codelabs-content-type=paginated] google-codelab google-codelab-step .special:before,body[codelabs-content-type=paginated] google-codelab google-codelab-step aside:before {
    content: unset!important
}

body[codelabs-content-type=paginated] google-codelab google-codelab-step .instructions aside.special,body[codelabs-content-type=paginated] google-codelab google-codelab-step .instructions aside.warning {
    margin: 10px 0!important;
    padding: 15px 20px!important
}

body[codelabs-content-type=paginated] iron-icon {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    font-size: inherit
}

body[codelabs-content-type=paginated] iron-icon[icon=file-download]:after {
    content: "cloud_download"
}

body[codelabs-content-type=paginated] google-codelab .warning,body[codelabs-content-type=paginated] google-codelab .warning :link,body[codelabs-content-type=paginated] google-codelab .warning :visited,body[codelabs-content-type=paginated] google-codelab .warning code {
    background: #fef7e0
}

body[codelabs-content-type=paginated] google-codelab .special :link,body[codelabs-content-type=paginated] google-codelab .special :visited,body[codelabs-content-type=paginated] google-codelab .special code,body[codelabs-content-type=paginated] google-codelab aside :link,body[codelabs-content-type=paginated] google-codelab aside :visited,body[codelabs-content-type=paginated] google-codelab aside code {
    background: #e6f4ea
}

body[codelabs-content-type=paginated] google-codelab-step td {
    background: transparent
}

body[codelabs-content-type=paginated] google-codelab:not([theme=minimal]) google-codelab-step .instructions h2 {
    line-height: normal
}

body[codelabs-content-type=paginated] google-codelab-step .instructions h3>a[href*=github],body[codelabs-content-type=paginated] google-codelab-step .instructions h3>a[href*=github]:visited {
    background-position: 0 3px
}

body[codelabs-content-type=paginated] google-codelab-step code {
    font: 500 90%/1em var(--devsite-code-font-family)
}

body[codelabs-content-type=paginated] google-codelab-step pre {
    background: var(--devsite-code-background,#f1f3f4);
    border-radius: 0;
    color: var(--devsite-code-color,inherit);
    font: 14px/20px var(--devsite-code-font-family);
    margin: 16px 0;
    overflow-x: auto;
    padding: 8px 80px 8px 8px;
    position: relative
}

body[codelabs-content-type=paginated] google-codelab-step devsite-code pre {
    margin: 0
}

body[codelabs-content-type=paginated] google-codelab-step pre,body[codelabs-content-type=paginated] google-codelab-step pre code {
    font: 14px/20px var(--devsite-code-font-family)
}

body[codelabs-content-type=paginated] google-codelab-step code .com,body[codelabs-content-type=paginated] google-codelab-step pre .com {
    color: var(--devsite-code-comments-color)
}

body[codelabs-content-type=paginated] google-codelab-step code .dec,body[codelabs-content-type=paginated] google-codelab-step code .lit,body[codelabs-content-type=paginated] google-codelab-step pre .dec,body[codelabs-content-type=paginated] google-codelab-step pre .lit {
    color: var(--devsite-code-numbers-color)
}

body[codelabs-content-type=paginated] google-codelab-step code .kwd,body[codelabs-content-type=paginated] google-codelab-step code .tag,body[codelabs-content-type=paginated] google-codelab-step pre .kwd,body[codelabs-content-type=paginated] google-codelab-step pre .tag {
    color: var(--devsite-code-keywords-color)
}

body[codelabs-content-type=paginated] google-codelab-step code .atv,body[codelabs-content-type=paginated] google-codelab-step code .str,body[codelabs-content-type=paginated] google-codelab-step pre .atv,body[codelabs-content-type=paginated] google-codelab-step pre .str {
    color: var(--devsite-code-strings-color)
}

body[codelabs-content-type=paginated] google-codelab-step code .atn,body[codelabs-content-type=paginated] google-codelab-step code .typ,body[codelabs-content-type=paginated] google-codelab-step pre .atn,body[codelabs-content-type=paginated] google-codelab-step pre .typ {
    color: var(--devsite-code-types-color)
}

body[codelabs-content-type=paginated] google-codelab-step code .pln,body[codelabs-content-type=paginated] google-codelab-step code .pun,body[codelabs-content-type=paginated] google-codelab-step pre .pln,body[codelabs-content-type=paginated] google-codelab-step pre .pun {
    color: inherit
}

google-codelab-survey {
    visibility: hidden
}

google-codelab-survey[upgraded] {
    visibility: visible
}

google-codelab-survey {
    display: block;
    margin: 2em 0;
    padding: 0;
    background: #e8f0fe;
    border-left: 4px solid #185abc;
    border-radius: 4px;
    color: #3c4043
}

google-codelab-survey h4 {
    font-size: 16px;
    font-weight: 400;
    padding: .8em 0 0;
    margin: 0
}

google-codelab-survey .survey-question-wrapper {
    padding: .4em 0 1.1em 30px
}

google-codelab-survey .survey-question-options {
    padding: .8em 0 0
}

.survey-option-wrapper {
    cursor: pointer;
    display: block;
    padding: 0 0 4px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: middle
}

google-codelab-survey .option-text {
    color: #212121;
    font-size: 16px;
    padding-left: 24px
}

.survey-option-wrapper input {
    position: absolute;
    opacity: 0
}

.custom-radio-button {
    position: absolute;
    top: 5px;
    left: 0;
    height: 13px;
    width: 13px;
    background-color: #fff;
    border: 2px solid #3f51b5;
    border-radius: 50%
}

.custom-radio-button:after {
    content: "";
    position: absolute;
    display: none
}

.survey-option-wrapper input:checked~.custom-radio-button:after {
    display: block
}

.survey-option-wrapper .custom-radio-button:after {
    top: 1px;
    left: 1px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #3f51b5
}

@keyframes badgeGrowIn {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    to {
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }
}

@keyframes badgeGrowOut {
    0% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes badgeFadeIn {
    0% {
        opacity: 0
    }

    12% {
        opacity: 0
    }

    87% {
        opacity: 100%
    }
}

@keyframes counterHide {
    0% {
        opacity: 0
    }

    to {
        opacity: 0
    }
}

android-codelab-grader .card {
    box-shadow: 0 1px 3px 0 var(--devsite-elevation-key-shadow-color),0 4px 8px 3px var(--devsite-elevation-ambient-shadow-color);
    border-radius: 5px;
    background: var(--devsite-claim-badge-dialog-background,var(--devsite-background-1));
    display: block;
    max-width: 856px;
    border-top: 5px var(--devsite-link-color) solid;
    position: relative;
    overflow: hidden;
    margin: 0 auto
}

android-codelab-grader .card .card-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-height: calc(100vh - 32px);
    overflow: visible
}

android-codelab-grader .card .illustration-container,android-codelab-grader .card .text-container {
    width: 50%
}

@media screen and (max-width: 600px) {
    android-codelab-grader .card .illustration-container,android-codelab-grader .card .text-container {
        width:100%
    }
}

android-codelab-grader .card .profile-creation-container {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: auto;
    max-height: 50vh;
    border-top: 1px solid #e8eaed;
    padding: 16px 24px
}

android-codelab-grader .card .profile-creation-container p {
    margin: 8px 0;
    color: var(--devsite-claim-badge-dialog-paragraph-color,#3c4043);
    font-size: 14px;
    line-height: 22px
}

android-codelab-grader .card .profile-creation-container-email-options {
    margin-top: 8px
}

android-codelab-grader .card .profile-creation-container-email-options .profile-creation-container-email-option {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

android-codelab-grader .card .profile-creation-container-email-options .profile-creation-container-email-option input {
    margin-top: 0
}

android-codelab-grader .card .profile-creation-container-email-options .profile-creation-container-email-option label {
    font-size: 14px
}

android-codelab-grader .card .spinner-container {
    position: absolute;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: hsla(0,0%,100%,.8);
    z-index: 100;
    pointer-events: none;
    opacity: 0;
    -webkit-transition: opacity .3s cubic-bezier(.4,0,.2,1);
    transition: opacity .3s cubic-bezier(.4,0,.2,1)
}

android-codelab-grader .card .content-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
}

@media screen and (max-width: 600px) {
    android-codelab-grader .card .content-container {
        -webkit-box-orient:vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -moz-box-orient: vertical;
        -moz-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

android-codelab-grader .card .text-container {
    padding: 36px 24px;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

@media screen and (max-width: 600px) {
    android-codelab-grader .card .text-container {
        padding:24px
    }
}

android-codelab-grader .illustration-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 164px;
    min-width: 303px;
    height: 164px;
    width: 303px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    background-image: url(../images/badge-award-background.svg);
    background-size: 100% calc(100% + 2px);
    background-position: 1px -1px;
    background-repeat: no-repeat
}

android-codelab-grader .illustration-container.show .badge-icon {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

android-codelab-grader .illustration-container.animate .badge-icon {
    -webkit-animation: badgeGrowIn .33s cubic-bezier(.75,0,.71,.97),badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) .33s,badgeFadeIn .5s linear;
    animation: badgeGrowIn .33s cubic-bezier(.75,0,.71,.97),badgeGrowOut .17s cubic-bezier(.85,-.14,.83,.83) .33s,badgeFadeIn .5s linear
}

android-codelab-grader .illustration-container .badge-icon {
    width: 124px;
    height: 124px;
    z-index: 1000;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

android-codelab-grader .illustration-container .badge-icon.incomplete {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%)
}

android-codelab-grader .illustration-container .badge-animation {
    position: absolute;
    width: 195px;
    height: 170px;
    background-image: url(../images/badge-award-animation.gif);
    background-size: 100% 100%
}

android-codelab-grader .completed-title {
    font-size: 20px;
    margin-bottom: 8px;
    line-height: 28px;
    color: var(--devsite-claim-badge-dialog-title-color,var(--devsite-primary-text-color));
    font-family: var(--devsite-headline-font-family)
}

android-codelab-grader .claim-badge-text,android-codelab-grader .completed-text,android-codelab-grader .create-profile-text,android-codelab-grader .error-text,android-codelab-grader .not-eligible-text,android-codelab-grader .sign-in-text {
    font-size: 14px
}

android-codelab-grader .buttons-container {
    border-top: 1px solid #e8eaed;
    padding: 0 8px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

android-codelab-grader .buttons-container .buttons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

android-codelab-grader .buttons-container .dismiss {
    position: relative;
    overflow: visible
}

@media screen and (max-width: 600px) {
    android-codelab-grader .buttons-container {
        -webkit-box-orient:vertical;
        -webkit-box-direction: reverse;
        -webkit-flex-direction: column-reverse;
        -moz-box-orient: vertical;
        -moz-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        padding-top: 0;
        text-align: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    android-codelab-grader .buttons-container .button {
        margin: 10px auto 0
    }

    android-codelab-grader .buttons-container .buttons {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -moz-box-orient: horizontal;
        -moz-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        margin-top: 5px
    }
}

android-codelab-grader .buttons-container .actions .button,android-codelab-grader .buttons-container .actions button {
    margin: 8px
}

android-codelab-grader[loading] .card .spinner-container {
    opacity: 1;
    pointer-events: all
}

android-codelab-grader .completed-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

android-codelab-grader .completed-title .project-result-icon {
    height: 24px;
    width: 24px;
    margin-right: 8px
}

android-codelab-grader .android-codelab-grader {
    bottom: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    left: 0;
    pointer-events: none;
    position: fixed;
    right: 0;
    z-index: 99999
}

android-codelab-grader .android-codelab-grader .android-codelab-grader-inner {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 670px;
    width: 670px;
    margin-bottom: 16px;
    pointer-events: all;
    position: absolute;
    -webkit-transform: translateY(150%);
    transform: translateY(150%);
    -webkit-transition: bottom .2s,margin-right .2s,-webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: bottom .2s,margin-right .2s,-webkit-transform .2s cubic-bezier(.4,0,1,1);
    transition: bottom .2s,margin-right .2s,transform .2s cubic-bezier(.4,0,1,1);
    transition: bottom .2s,margin-right .2s,transform .2s cubic-bezier(.4,0,1,1),-webkit-transform .2s cubic-bezier(.4,0,1,1)
}

@media screen and (max-width: 600px) {
    android-codelab-grader .android-codelab-grader .android-codelab-grader-inner {
        width:calc(100% - 20px);
        margin-bottom: 10px
    }
}

android-codelab-grader .android-codelab-grader .android-codelab-grader-inner[show] {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: bottom .2s,margin-right .2s,-webkit-transform .2s cubic-bezier(0,0,.2,1);
    transition: bottom .2s,margin-right .2s,-webkit-transform .2s cubic-bezier(0,0,.2,1);
    transition: bottom .2s,margin-right .2s,transform .2s cubic-bezier(0,0,.2,1);
    transition: bottom .2s,margin-right .2s,transform .2s cubic-bezier(0,0,.2,1),-webkit-transform .2s cubic-bezier(0,0,.2,1)
}

android-codelab-grader .android-codelab-grader .android-codelab-grader-inner:first-child {
    bottom: 10px;
    z-index: 15
}

:root {
    --android-share-border-hover: var(--devsite-button-border-hover);
    --android-share-border-radius: var(--devsite-button-border-radius);
    --android-share-border: var(--devsite-button-border);
    --android-share-button-background-color: var(--devsite-button-background-color);
    --android-share-button-color: var(--devsite-button-color);
    --android-share-button-hover-background-color: var(--devsite-button-background-hover);
    --android-share-button-hover-text-color: var(--devsite-button-color-hover);
    --android-share-button-icon-color: var(--devsite-button-icon-color);
    --android-share-button-padding: var(--devsite-button-padding)
}

android-share-button .android-share-button {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--android-share-button-background-color);
    border-radius: var(--android-share-border-radius);
    border: var(--android-share-border);
    color: var(--android-share-button-color);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: var(--android-share-button-padding)
}

android-share-button .android-share-button:focus,android-share-button .android-share-button:hover {
    background-color: var(--android-share-button-hover-background-color);
    border: var(--android-share-border-hover);
    color: var(--android-share-button-hover-text-color)
}

android-share-button .material-symbols-outlined {
    color: var(--android-share-button-icon-color);
    width: 24px;
    height: 24px
}

.dac-tutorial-page[ready] .devsite-wrapper {
    overflow: inherit
}

.dac-tutorial-page .dac-preview-wrapper {
    height: calc(100vh - 96px);
    position: -webkit-sticky;
    position: sticky;
    top: 64px;
    width: 100%
}

.dac-tutorial-page .dac-preview-wrapper .dac-step-preview {
    opacity: 0;
    position: absolute;
    visibility: hidden;
    width: 100%
}

.dac-tutorial-page .dac-preview-wrapper .dac-step-preview.active {
    opacity: 1;
    visibility: visible
}

.dac-tutorial-page .dac-preview-wrapper .dac-step-preview.screenshot {
    border: 0;
    -webkit-transition: visibility 0s .3s,opacity .3s linear;
    transition: visibility 0s .3s,opacity .3s linear
}

.dac-tutorial-page .dac-step-wrapper section.active:before {
    content: "";
    border-left: 4px solid #3ddc84;
    border-radius: 4px;
    margin-left: -20px;
    padding-left: 16px
}

.dac-tutorial-page .dac-preview-toggle-wrapper {
    color: #fff;
    position: absolute;
    right: 0;
    top: 27px;
    z-index: 1
}

.dac-tutorial-page devsite-code .devsite-icon-copy:before {
    z-index: 2
}

.dac-tutorial-page .dac-preview-toggle-wrapper .dac-preview-phone,.dac-tutorial-page .dac-preview-toggle-wrapper .hide,.dac-tutorial-page .dac-preview-toggle-wrapper.toggle .show {
    display: block
}

.dac-tutorial-page .dac-preview-toggle-wrapper .show,.dac-tutorial-page .dac-preview-toggle-wrapper.toggle .dac-preview-phone,.dac-tutorial-page .dac-preview-toggle-wrapper.toggle .hide {
    display: none
}

@media screen and (max-width: 1000px) {
    .dac-tutorial-page .dac-step-wrapper section.active:before {
        content:none
    }

    .dac-tutorial-page .dac-preview-toggle-wrapper,.dac-tutorial-page .dac-preview-toggle-wrapper .dac-preview-toggle {
        color: #202124;
        left: 0;
        position: relative;
        right: 0;
        top: 0
    }

    .dac-tutorial-page .dac-preview-toggle-wrapper .dac-preview-toggle+.dac-preview-phone {
        display: none;
        padding-top: 40px;
        margin: auto;
        width: 200px
    }

    .dac-tutorial-page .dac-preview-toggle-wrapper .dac-preview-toggle.toggle+.dac-preview-phone {
        display: block
    }

    .dac-tutorial-page .dac-preview-toggle-wrapper .dac-preview-phone,.dac-tutorial-page .dac-preview-toggle-wrapper .hide,.dac-tutorial-page .dac-preview-toggle-wrapper.toggle .show {
        display: none!important
    }

    .dac-tutorial-page .dac-preview-toggle-wrapper .show,.dac-tutorial-page .dac-preview-toggle-wrapper.toggle .dac-preview-phone,.dac-tutorial-page .dac-preview-toggle-wrapper.toggle .hide {
        display: block!important
    }

    .dac-tutorial-page .dac-preview-toggle-wrapper .show:after,.dac-tutorial-page .dac-preview-toggle-wrapper.toggle .hide:after {
        font: normal normal normal 24px/24px Material Icons;
        -webkit-font-feature-settings: "liga";
        -moz-font-feature-settings: "liga";
        font-feature-settings: "liga";
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        text-rendering: optimizeLegibility;
        text-transform: none;
        word-wrap: normal;
        height: 23px;
        position: absolute;
        width: 50px
    }

    .dac-tutorial-page .dac-preview-toggle-wrapper .show:after {
        content: "expand_more"
    }

    .dac-tutorial-page .dac-preview-toggle-wrapper.toggle .hide:after {
        content: "expand_less"
    }
}

android-sticky-toc ul,android-sticky-toc ul ul {
    list-style: none;
    padding-left: 0
}

android-sticky-toc a:focus,android-sticky-toc a:hover,android-sticky-toc a:link,android-sticky-toc a:visited {
    color: var(--devsite-primary-text-color);
    text-decoration: none
}

android-sticky-toc a:focus>span.dac-nav-text {
    text-decoration: underline
}

android-sticky-toc[sticky] {
    padding-left: 32px;
    position: -webkit-sticky;
    position: sticky;
    top: 164px;
    width: 240px
}

android-sticky-toc[embedded] {
    display: none;
    margin-top: 120px
}

android-sticky-toc .dac-nav-item.dac-nav-heading {
    line-height: 16px;
    margin-bottom: 16px;
    max-width: 160px
}

android-sticky-toc .dac-nav-subtitle {
    font: 500 12px/22px Roboto Mono,monospace;
    color: var(--devsite-primary-text-color);
    text-transform: uppercase
}

android-sticky-toc .dac-nav-title {
    font-size: 13px
}

android-sticky-toc .dac-nav-item {
    margin: 0;
    padding: 5px 0
}

android-sticky-toc div>ul {
    border-left: 4px solid var(--devsite-background-3);
    padding-left: 24px
}

android-sticky-toc div>ul .dac-nav-title {
    border-left: 4px solid transparent;
    display: inline-block;
    margin-left: -28px
}

android-sticky-toc ul ul .dac-nav-title {
    padding-left: 24px
}

android-sticky-toc div>ul>.dac-nav-item:first-child {
    padding-top: 0
}

android-sticky-toc div>ul>.dac-nav-item:last-child,android-sticky-toc div>ul>.dac-nav-item:last-child .dac-nav-item:last-child {
    padding-bottom: 0
}

android-sticky-toc .dac-nav-title.dac-nav-active {
    border-left: 4px solid #3ddc84;
    font-weight: 500
}

android-sticky-toc .dac-nav-title .dac-nav-arrow:before {
    font: normal normal normal 24px/24px Material Icons;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-transform: none;
    word-wrap: normal;
    content: "arrow_right";
    vertical-align: middle
}

android-sticky-toc .dac-nav-title .dac-nav-arrow.open:before {
    content: "arrow_drop_down"
}

android-sticky-toc .dac-nav-list.nested {
    height: 0;
    visibility: hidden
}

android-sticky-toc .dac-nav-list.nested.collapse {
    height: auto;
    padding-top: 5px;
    visibility: visible
}

@media screen and (max-width: 1200px) {
    android-sticky-toc[sticky] {
        display:none
    }

    android-sticky-toc[embedded] {
        display: block
    }
}

@media screen and (max-width: 1000px) {
    android-sticky-toc[embedded] {
        display:none
    }
}