.devguide{--dg-ink:#25353b;--dg-muted:#62757b;--dg-brand:#155f65;--dg-line:#cbdcd6;--dg-mint:#edf5f0;min-width:0;color:var(--dg-ink)}
.devguide .devguide-lead{font-size:20px!important;line-height:1.65!important;color:#49636a}.devguide h2{margin-top:54px!important;padding-top:23px;border-top:1px solid #cfddd7;line-height:1.25!important}.devguide h2:target{scroll-margin-top:72px}.devguide h2:before{content:'';display:inline-block;width:30px;height:30px;border-radius:9px;vertical-align:-5px;margin-right:10px;background:#e8f2ed url('./media/tools.svg') center/19px no-repeat}.devguide h3{line-height:1.4!important}
.devguide .devguide-route{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:26px 0}.devguide .devguide-route a{display:block;padding:18px;border:1px solid #cadbd4;border-radius:14px;background:#f4f8f5;color:#234349!important;text-decoration:none!important;min-height:84px}.devguide-route a strong{display:block;font-size:16px}.devguide-route a span,.devguide-route a small{display:block;font-size:13px;line-height:1.6;color:#62757b;margin-top:5px}.devguide-route a:hover,.devguide-route a:focus-visible{background:#e5f1eb;border-color:#155f65;outline:2px solid #155f65;outline-offset:2px}
.devguide .devguide-lesson,.devguide .devguide-takeaway,.devguide .devguide-note{padding:20px 22px;border:1px solid #cbdcd6;border-radius:14px;background:#edf5f0;margin:24px 0}.devguide .devguide-mistake{padding:18px 22px;border-left:4px solid #d09b56;background:#fff7eb;border-radius:0 12px 12px 0;margin:24px 0}.devguide-label{font-size:12px!important;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#155f65;margin:0 0 10px!important}.devguide li{margin-bottom:10px}.devguide pre{max-width:100%;overflow:auto;white-space:pre!important;tab-size:2;font-size:13px;line-height:1.75;border:1px solid #cbdcd6;border-radius:13px;background:#f1f6f3;padding:18px!important}.devguide pre code{white-space:pre!important}.devguide code{overflow-wrap:anywhere}.devguide table{font-size:14px!important}.devguide td,.devguide th{vertical-align:top;white-space:normal}.devguide .aen-table-scroll{max-width:100%}
.devguide .devguide-figure{margin:28px 0!important;max-width:100%;border:1px solid #cbdcd6;border-radius:18px;overflow:hidden;background:#fff}.devguide-image-link{display:block;background:#eef4ef}.devguide-figure img{display:block!important;width:100%!important;height:auto!important;max-width:100%;margin:0!important}.devguide-figure figcaption{padding:20px!important;font-size:14px!important;line-height:1.7!important;text-align:left!important}.devguide-figure-type{display:block;font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#155f65;margin-bottom:7px}.devguide-figure figcaption>strong{display:block;font-size:18px;line-height:1.4}.devguide-figure figcaption p{font-size:14px!important;line-height:1.7!important;margin:9px 0 0!important}.devguide .devguide-callouts{padding-left:23px;margin:14px 0!important}.devguide-callouts li{font-size:13px;line-height:1.65;padding-left:3px}.devguide .devguide-media-credit{display:block;font-size:11px;line-height:1.6;color:#6b7b81;margin-top:12px}.devguide .devguide-full-image{display:inline-block;min-height:44px;padding-top:8px;color:#155f65!important;font-size:13px}
.adtl{width:100%;max-width:100%;min-width:0;margin:28px 0;background:#fff;border:1px solid #ccdcd6;border-radius:20px;overflow:hidden;color:#25353b;font:14px/1.6 system-ui,Arial,sans-serif;box-sizing:border-box}.adtl *{box-sizing:border-box}.adtl-head{padding:25px;background:#eef6f1;border-bottom:1px solid #cfddd7}.adtl-eyebrow{display:block;color:#155f65;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.adtl .adtl-head h2{font-size:27px!important;line-height:1.25!important;margin:11px 0!important;padding:0!important;border:0!important}.adtl-head h2:before{display:none!important}.adtl-head p{font-size:14px!important;margin:8px 0 16px!important}.adtl-frame{display:block;width:100%;border:0;max-width:100%}.adtl-hint{color:#5a7278;font-size:12px!important}.adtl-footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px;background:#eef6f1;border-top:1px solid #cfddd7}.adtl-footer p{font-size:12px!important;line-height:1.6!important;margin:4px 0 0!important}.adtl a.btn,.adtl a.btn:visited{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 14px;color:#fff!important;background:#155f65!important;border:1px solid #155f65!important;border-radius:10px;text-decoration:none!important;font-size:13px;font-weight:700;white-space:normal}.adtl a.btn:hover,.adtl a.btn:focus-visible{color:#fff!important;background:#104c52!important;outline:3px solid #82afa3;outline-offset:3px}.adtl-footer .btn{flex-shrink:0}
.aen-entry-column:has(.devguide) .aen-toc ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:25px}.aen-entry-column:has(.devguide) .aen-toc li{font-size:13px;line-height:1.5;break-inside:avoid;margin-bottom:7px}
.devguide #devtools-elements:before,.devguide #devtools-layout:before{background-image:url('./media/elements.svg')}.devguide #devtools-console:before{background-image:url('./media/console.svg')}.devguide #devtools-network:before,.devguide #devtools-network-timing:before{background-image:url('./media/network.svg')}.devguide #devtools-sources:before{background-image:url('./media/sources.svg')}.devguide #devtools-performance:before,.devguide #devtools-vitals:before{background-image:url('./media/performance.svg')}.devguide #devtools-memory:before{background-image:url('./media/memory.svg')}.devguide #devtools-mobile:before{background-image:url('./media/devices.svg')}.devguide #devtools-accessibility:before{background-image:url('./media/accessibility.svg')}.devguide #devtools-application:before{background-image:url('./media/storage.svg')}.devguide-table-wrap{width:100%;max-width:100%;overflow:auto;border:1px solid #cfddd7;border-radius:12px}.devguide-table-wrap>table{margin:0!important}.devguide-table-wrap:focus-visible{outline:3px solid #155f65;outline-offset:3px}.devguide kbd{display:inline-block;max-width:100%;padding:2px 5px;border:1px solid #c7d8d1;border-radius:5px;background:#f0f5f1;font-size:.8em;line-height:1.3;color:#25434b}
.devguide-desktop-nav{display:none}
@media(min-width:1101px){.devguide-sidebar{position:sticky!important;top:18px;align-self:start;padding:0!important;border:0!important;background:transparent!important}.admin-bar .devguide-sidebar{top:50px}.devguide-sidebar>:not(.devguide-desktop-nav){display:none!important}.devguide-desktop-nav{display:grid;grid-template-rows:auto minmax(0,1fr) auto;max-height:calc(100dvh - 90px);border:1px solid #cbdcd6;border-radius:16px;background:#fff;overflow:hidden;box-shadow:0 6px 24px #25434b08}.devguide-nav-title{display:block;padding:18px 18px 13px;color:#25434b;font-size:16px;border-bottom:1px solid #d7e3dd}.devguide-desktop-nav ol{list-style:none;margin:0;padding:8px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}.devguide-desktop-nav li{margin:0}.devguide-desktop-nav li a{display:flex;align-items:center;min-height:44px;padding:8px 11px;text-decoration:none;color:#405c63;font-size:13px;line-height:1.4;border-left:3px solid transparent;border-radius:8px}.devguide-desktop-nav li a:hover,.devguide-desktop-nav li a:focus-visible{background:#f0f6f2;color:#155f65}.devguide-desktop-nav li a[aria-current]{background:#e5f1eb;border-left-color:#155f65;color:#155f65;font-weight:750}.devguide-desktop-nav .devguide-nav-sub a{padding-left:20px;font-size:12px}.devguide-nav-shortcut{display:flex;align-items:center;justify-content:center;min-height:48px;padding:10px 15px;border-top:1px solid #d7e3dd;background:#edf5f0;color:#155f65;font-size:13px;font-weight:700;text-decoration:none}.devguide-nav-shortcut:hover,.devguide-nav-shortcut:focus-visible{background:#dceee4}.devguide-desktop-nav a:focus-visible{outline:2px solid #155f65;outline-offset:-3px}}
@media print{.devguide-desktop-nav{display:none!important}}
@media(max-width:600px){.devguide .devguide-lead{font-size:18px!important}.devguide .devguide-route{grid-template-columns:1fr;gap:9px}.devguide .devguide-route a{padding:15px;min-height:74px}.devguide h2{margin-top:38px!important;padding-top:20px;font-size:26px!important}.devguide h2:before{width:26px;height:26px;background-size:17px}.devguide .devguide-lesson,.devguide .devguide-takeaway,.devguide .devguide-note,.devguide .devguide-mistake{padding:17px}.devguide-figure figcaption{padding:17px!important}.devguide-figure figcaption>strong{font-size:17px}.adtl-head{padding:18px}.adtl .adtl-head h2{font-size:24px!important}.adtl-footer{flex-direction:column;align-items:stretch;padding:18px}.aen-entry-column:has(.devguide) .aen-toc ol{display:block}.devguide pre{font-size:12px;padding:14px!important}}