topic.ee15af52.css

/*!
 * This source file is part of the Swift.org open source project
 * 
 * Copyright (c) 2021 Apple Inc. and the Swift project authors
 * Licensed under Apache License v2.0 with Runtime Library Exception
 * 
 * See https://swift.org/LICENSE.txt for license information
 * See https://swift.org/CONTRIBUTORS.txt for Swift project authors
 */.nav-title-content[data-v-60ea3af8]{max-width:100%}.title[data-v-60ea3af8]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:inline-block;vertical-align:top;max-width:296px}@media only screen and (max-width:1023px){.title[data-v-60ea3af8]{max-width:205px}}@media only screen and (max-width:767px){.title[data-v-60ea3af8]{flex-basis:fill;display:initial;vertical-align:initial;max-width:none}}.subhead[data-v-60ea3af8]{color:var(--color-nav-root-subhead)}.theme-dark .subhead[data-v-60ea3af8]{color:var(--color-nav-dark-root-subhead)}.mobile-dropdown[data-v-154acfbd]{box-sizing:border-box}.nav--in-breakpoint-range .mobile-dropdown[data-v-154acfbd]{padding-left:.23529rem;padding-right:.23529rem}.mobile-dropdown ul[data-v-154acfbd]{list-style:none}.mobile-dropdown .option[data-v-154acfbd]{cursor:pointer;font-size:.70588rem;padding:.5rem 0;display:block;text-decoration:none;color:inherit}.mobile-dropdown .option[data-v-154acfbd]:focus{outline-offset:0}.mobile-dropdown .option.depth1[data-v-154acfbd]{padding-left:.47059rem}.active[data-v-154acfbd],.tutorial.router-link-active[data-v-154acfbd]{font-weight:600}.active[data-v-154acfbd]:focus,.tutorial.router-link-active[data-v-154acfbd]:focus{outline:none}.chapter-list[data-v-154acfbd]:not(:first-child){margin-top:1rem}.chapter-name[data-v-154acfbd],.tutorial[data-v-154acfbd]{padding:.5rem 0;font-size:1rem;line-height:1.47059;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}.section-list[data-v-154acfbd],.tutorial-list[data-v-154acfbd]{padding:0 .58824rem}.chapter-list:last-child .tutorial-list[data-v-154acfbd]:last-child{padding-bottom:10em}.chapter-list[data-v-154acfbd]{display:inline-block}.form-element[data-v-998803d8]{position:relative}.form-dropdown[data-v-998803d8]{font-size:1rem;line-height:1.23529;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;display:block;box-sizing:border-box;width:100%;height:3.3em;color:var(--color-dropdown-text);padding:1.11765rem 2.35294rem 0 .94118rem;text-align:left;border:1px solid var(--color-dropdown-border);border-radius:4px;background-clip:padding-box;margin-bottom:.82353rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;min-height:32px}.form-dropdown[data-v-998803d8]:focus{box-shadow:0 0 0 4px var(--color-focus-color);outline:none;border-color:var(--color-focus-border-color)}.form-dropdown.no-eyebrow[data-v-998803d8]{padding-top:0}.form-dropdown[data-v-998803d8]:-moz-focusring{color:transparent;text-shadow:0 0 0 var(--color-dropdown-text)}.form-dropdown[data-v-998803d8]::-ms-expand{opacity:0}.form-dropdown~.form-icon[data-v-998803d8]{position:absolute;display:block;pointer-events:none;fill:var(--color-figure-gray-tertiary);right:14px;width:13px;height:auto;top:50%;transform:translateY(-50%)}.is-open .form-dropdown~.form-icon[data-v-998803d8]{transform:translateY(-50%) scale(-1)}@media only screen and (max-width:735px){.form-dropdown~.form-icon[data-v-998803d8]{right:14px}}.form-dropdown~.form-label[data-v-998803d8]{font-size:.70588rem;line-height:1.75;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;position:absolute;top:.47059rem;left:17px;color:var(--color-figure-gray-secondary);pointer-events:none;padding:0;z-index:1}.form-dropdown[data-v-998803d8] option{color:var(--color-dropdown-text)}.form-dropdown-selectnone[data-v-998803d8]{color:transparent}.form-dropdown-selectnone~.form-label[data-v-998803d8]{font-size:1rem;line-height:1.23529;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;top:19px;left:17px;color:var(--color-figure-gray-tertiary)}.form-dropdown-selectnone[data-v-998803d8]:-moz-focusring{text-shadow:none}.form-dropdown-selectnone[data-v-998803d8]::-ms-value{display:none}.theme-dark .form-dropdown[data-v-998803d8]{color:var(--color-dropdown-dark-text);background-color:var(--color-dropdown-dark-background);border-color:var(--color-dropdown-dark-border)}.theme-dark .form-dropdown~.form-label[data-v-998803d8]{color:#ccc}.theme-dark .form-dropdown[data-v-998803d8]:-moz-focusring{color:transparent;text-shadow:0 0 0 var(--color-dropdown-dark-text)}.theme-dark .form-dropdown.form-dropdown-selectnone[data-v-998803d8]{color:transparent}.theme-dark .form-dropdown.form-dropdown-selectnone[data-v-998803d8]:-moz-focusring{text-shadow:none}.theme-dark .form-dropdown-selectnone~.form-label[data-v-998803d8]{color:#b0b0b0}.dropdown-small[data-v-12dd746a]{height:30px;display:flex;align-items:center;position:relative;background:var(--color-fill)}.dropdown-small .form-dropdown-toggle[data-v-12dd746a]{line-height:1.5;font-size:12px;padding-top:0;padding-bottom:0;padding-left:20px;min-height:unset;height:30px;display:flex;align-items:center}.dropdown-small .form-dropdown-toggle[data-v-12dd746a]:focus{box-shadow:none;border-color:var(--color-dropdown-border)}.fromkeyboard .dropdown-small .form-dropdown-toggle[data-v-12dd746a]:focus{box-shadow:0 0 0 2px var(--color-focus-color);outline:none;border-color:var(--color-focus-border-color)}.form-dropdown-toggle[data-v-12dd746a]{margin:0}.is-open .form-dropdown-toggle[data-v-12dd746a]{border-radius:4px 4px 0 0;border-bottom:none;padding-bottom:1px}.fromkeyboard .is-open .form-dropdown-toggle[data-v-12dd746a]{box-shadow:1px -1px 0 1px var(--color-focus-color),-1px -1px 0 1px var(--color-focus-color);border-color:var(--color-focus-border-color)}.form-dropdown-title[data-v-12dd746a]{margin:0;padding:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dropdown-custom[data-v-12dd746a]{border-radius:4px}.dropdown-custom.is-open[data-v-12dd746a]{border-radius:4px 4px 0 0}.dropdown-custom[data-v-12dd746a] .form-dropdown-content{background:var(--color-fill);position:absolute;right:0;left:0;top:100%;border-bottom-left-radius:4px;border-bottom-right-radius:4px;border:1px solid var(--color-dropdown-border);border-top:none;display:none;overflow-y:auto}.dropdown-custom[data-v-12dd746a] .form-dropdown-content.is-open{display:block}.fromkeyboard .dropdown-custom[data-v-12dd746a] .form-dropdown-content.is-open{box-shadow:1px 1px 0 1px var(--color-focus-color),-1px 1px 0 1px var(--color-focus-color);border-color:var(--color-focus-border-color);border-top-color:transparent}.nav .dropdown-custom[data-v-12dd746a] .form-dropdown-content{max-height:calc(100vh - 116px - 3.05882rem)}.nav--is-sticking.nav .dropdown-custom[data-v-12dd746a] .form-dropdown-content{max-height:calc(100vh - 3.05882rem - 72px)}.dropdown-custom[data-v-12dd746a] .options{list-style:none;margin:0;padding:0 0 20px}.dropdown-custom[data-v-12dd746a] .option{cursor:pointer;padding:5px 20px;font-size:12px;line-height:20px;outline:none}.dropdown-custom[data-v-12dd746a] .option:hover{background-color:var(--color-fill-tertiary)}.dropdown-custom[data-v-12dd746a] .option.option-active{font-weight:600}.fromkeyboard .dropdown-custom[data-v-12dd746a] .option:hover{background-color:transparent}.fromkeyboard .dropdown-custom[data-v-12dd746a] .option:focus{background-color:var(--color-fill-tertiary);outline:none}.tutorial-dropdown[data-v-4a151342]{grid-column:3}.section-tracker[data-v-4a151342]{font-size:.70588rem;line-height:1.33333;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;color:var(--color-figure-gray-secondary);margin-left:15px}.tutorial-dropdown[data-v-78dc103f]{grid-column:1/2}.tutorial-dropdown .options[data-v-78dc103f]{padding-top:1rem;padding-bottom:0}.tutorial-dropdown .option[data-v-78dc103f]{padding:5px 20px 5px 30px}.chapter-list[data-v-78dc103f]{padding-bottom:20px}.chapter-name[data-v-78dc103f]{margin:0 20px 5px 20px;line-height:normal;color:var(--color-figure-gray-secondary)}.chevron-icon[data-v-26e19f17]{padding:0;color:var(--color-nav-outlines);grid-column:2;height:20px;width:20px;margin:0 4px}@media only screen and (min-width:768px){.nav[data-v-26e19f17] .nav-content{display:grid;grid-template-columns:auto auto 3fr;align-items:center}.nav[data-v-26e19f17] .nav-menu{padding:0;grid-column:3/5}.nav[data-v-26e19f17] .nav-menu-item{margin:0}}.dropdown-container[data-v-26e19f17]{height:3.05882rem;display:grid;grid-template-columns:minmax(230px,285px) auto minmax(230px,1fr);align-items:center}@media only screen and (max-width:1023px){.dropdown-container[data-v-26e19f17]{grid-template-columns:minmax(173px,216px) auto minmax(173px,1fr)}}.separator[data-v-26e19f17]{height:20px;border-right:1px solid;border-color:var(--color-nav-outlines);margin:0 20px;grid-column:2}.mobile-dropdown-container[data-v-26e19f17],.nav--in-breakpoint-range.nav .dropdown-container[data-v-26e19f17],.nav--in-breakpoint-range.nav .separator[data-v-26e19f17]{display:none}.nav--in-breakpoint-range.nav .mobile-dropdown-container[data-v-26e19f17]{display:block}.nav--in-breakpoint-range.nav[data-v-26e19f17] .nav-title{grid-area:title}.nav--in-breakpoint-range.nav[data-v-26e19f17] .pre-title{display:none}.nav[data-v-26e19f17] .nav-title{grid-column:1;width:90%;padding-top:0}.primary-dropdown[data-v-26e19f17],.secondary-dropdown[data-v-26e19f17]{background:var(--color-tutorial-navbar-dropdown-background);border-color:var(--color-tutorial-navbar-dropdown-border)}.primary-dropdown[data-v-26e19f17] .form-dropdown,.primary-dropdown[data-v-26e19f17] .form-dropdown:focus,.secondary-dropdown[data-v-26e19f17] .form-dropdown,.secondary-dropdown[data-v-26e19f17] .form-dropdown:focus{border-color:var(--color-tutorial-navbar-dropdown-border)}.primary-dropdown[data-v-26e19f17] .options,.secondary-dropdown[data-v-26e19f17] .options{background:var(--color-tutorial-navbar-dropdown-background);border-color:var(--color-tutorial-navbar-dropdown-border)}.replay-button[data-v-59608016]{display:flex;align-items:center;justify-content:center;cursor:pointer;visibility:hidden;margin-top:.5rem;-webkit-tap-highlight-color:transparent}.replay-button.visible[data-v-59608016]{visibility:visible}.replay-button svg.replay-icon[data-v-59608016]{height:12px;width:12px;margin-left:.3em}[data-v-1b5cc854] img,[data-v-1b5cc854] video{display:block;margin-left:auto;margin-right:auto;-o-object-fit:contain;object-fit:contain;max-width:100%}[data-v-3cfe1c35] .code-listing+*,[data-v-3cfe1c35] aside+*,[data-v-3cfe1c35] h2+*,[data-v-3cfe1c35] h3+*,[data-v-3cfe1c35] ol+*,[data-v-3cfe1c35] p+*,[data-v-3cfe1c35] ul+*{margin-top:20px}[data-v-3cfe1c35] ol ol,[data-v-3cfe1c35] ol ul,[data-v-3cfe1c35] ul ol,[data-v-3cfe1c35] ul ul{margin-top:0}[data-v-3cfe1c35] h2{font-size:1.88235rem;line-height:1.25;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}@media only screen and (max-width:1250px){[data-v-3cfe1c35] h2{font-size:1.64706rem;line-height:1.28571;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}@media only screen and (max-width:735px){[data-v-3cfe1c35] h2{font-size:1.41176rem;line-height:1.33333;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}[data-v-3cfe1c35] h3{font-size:1.41176rem;line-height:1.16667;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}@media only screen and (max-width:1250px){[data-v-3cfe1c35] h3{font-size:1.23529rem;line-height:1.19048;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}[data-v-3cfe1c35] .code-listing{background:var(--color-code-background);border-color:var(--colors-grid,var(--color-grid));border-style:solid;border-width:1px}[data-v-3cfe1c35] .code-listing pre{font-size:.70588rem;line-height:1.83333;font-weight:400;font-family:Menlo,monospace;padding:20px 0}.columns[data-v-30edf911]{display:grid;grid-template-rows:repeat(2,auto)}.columns.cols-2[data-v-30edf911]{gap:20px 8.33333%;grid-template-columns:repeat(2,1fr)}.columns.cols-3[data-v-30edf911]{gap:20px 4.16667%;grid-template-columns:repeat(3,1fr)}.asset[data-v-30edf911]{align-self:end;grid-row:1}.content[data-v-30edf911]{grid-row:2}@media only screen and (max-width:735px){.columns.cols-2[data-v-30edf911],.columns.cols-3[data-v-30edf911]{grid-template-columns:unset}.asset[data-v-30edf911],.content[data-v-30edf911]{grid-row:auto}}.content-and-media[data-v-3fa44f9e]{display:flex}.content-and-media.media-leading[data-v-3fa44f9e]{flex-direction:row-reverse}.content-and-media.media-trailing[data-v-3fa44f9e]{flex-direction:row}@media only screen and (min-width:736px){.content-and-media[data-v-3fa44f9e]{align-items:center;justify-content:center}}.content[data-v-3fa44f9e]{width:62.5%}.asset[data-v-3fa44f9e]{width:29.16667%}.media-leading .asset[data-v-3fa44f9e]{margin-right:8.33333%}.media-trailing .asset[data-v-3fa44f9e]{margin-left:8.33333%}@media only screen and (max-width:735px){.content-and-media.media-leading[data-v-3fa44f9e],.content-and-media.media-trailing[data-v-3fa44f9e]{flex-direction:column}.asset[data-v-3fa44f9e],.content[data-v-3fa44f9e]{width:100%}.media-leading .asset[data-v-3fa44f9e],.media-trailing .asset[data-v-3fa44f9e]{margin:20px 0 0 0}}.group[id][data-v-1f2be54b]{margin-top:20px;padding-top:20px}[data-v-1f2be54b] img,[data-v-1f2be54b] video{display:block;margin:0 auto;max-width:100%}.layout+[data-v-4d5a806e]{margin-top:40px}@media only screen and (max-width:735px){.layout[data-v-4d5a806e]:first-child>:not(.group[id]){margin-top:40px}}.body[data-v-6499e2f2]{background:var(--colors-text-background,var(--color-article-body-background));margin-left:auto;margin-right:auto;width:980px;border-radius:10px;transform:translateY(-120px)}@media only screen and (max-width:1250px){.body[data-v-6499e2f2]{width:692px}}@media only screen and (max-width:735px){.body[data-v-6499e2f2]{width:87.5%;border-radius:0;transform:none}}.body[data-v-6499e2f2]~*{margin-top:-40px}.body-content[data-v-6499e2f2]{padding:40px 8.33333% 80px 8.33333%}@media only screen and (max-width:735px){.body-content[data-v-6499e2f2]{padding:0 0 40px 0}}.call-to-action[data-v-2016b288]{padding:65px 0;background:var(--color-call-to-action-background)}.theme-dark .call-to-action[data-v-2016b288]{--color-call-to-action-background:#424242}.row[data-v-2016b288]{margin-left:auto;margin-right:auto;width:980px;display:flex;align-items:center}@media only screen and (max-width:1250px){.row[data-v-2016b288]{width:692px}}@media only screen and (max-width:735px){.row[data-v-2016b288]{width:87.5%}}[data-v-2016b288] img,[data-v-2016b288] video{max-height:560px}h2[data-v-2016b288]{font-size:1.88235rem;line-height:1.25;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}@media only screen and (max-width:1250px){h2[data-v-2016b288]{font-size:1.64706rem;line-height:1.28571;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}@media only screen and (max-width:735px){h2[data-v-2016b288]{font-size:1.41176rem;line-height:1.33333;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}.label[data-v-2016b288]{display:block;font-size:1.23529rem;line-height:1.19048;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;margin-bottom:.4em;color:var(--color-eyebrow)}@media only screen and (max-width:735px){.label[data-v-2016b288]{font-size:1.11765rem;line-height:1.21053;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}.content[data-v-2016b288]{margin-bottom:1.5rem}.right-column[data-v-2016b288]{margin-left:auto}@media only screen and (max-width:735px){.row[data-v-2016b288]{display:block}.col+.col[data-v-2016b288]{margin-top:40px}}@media only screen and (max-width:735px){.call-to-action[data-v-426a965c]{margin-top:0}}.headline[data-v-1898f592]{margin-bottom:.8em}.heading[data-v-1898f592]{font-size:2.82353rem;line-height:1.08333;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;color:var(--color-header-text)}@media only screen and (max-width:1250px){.heading[data-v-1898f592]{font-size:2.35294rem;line-height:1.1;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}@media only screen and (max-width:735px){.heading[data-v-1898f592]{font-size:1.88235rem;line-height:1.125;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}.dark .heading[data-v-1898f592]{color:#fff}.eyebrow[data-v-1898f592]{font-size:1.41176rem;line-height:1.16667;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;display:block;margin-bottom:.4em;color:var(--color-eyebrow)}@media only screen and (max-width:1250px){.eyebrow[data-v-1898f592]{font-size:1.23529rem;line-height:1.19048;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}.generic-modal[data-v-ea628b36]{position:fixed;top:0;left:0;right:0;bottom:0;margin:0;z-index:11000;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;background:none;overflow:auto}.modal-fullscreen[data-v-ea628b36]{align-items:stretch}.modal-fullscreen .container[data-v-ea628b36]{margin:0;flex:1;width:100%;height:100%;padding-top:env(safe-area-inset-top);padding-right:env(safe-area-inset-right);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left)}.modal-standard[data-v-ea628b36]{padding:20px}.modal-standard .container[data-v-ea628b36]{padding:60px;border-radius:4px}@media screen{[data-color-scheme=dark] .modal-standard .container[data-v-ea628b36]{background:#1d1d1f}}@media screen and (prefers-color-scheme:dark){[data-color-scheme=auto] .modal-standard .container[data-v-ea628b36]{background:#1d1d1f}}@media only screen and (max-width:735px){.modal-standard[data-v-ea628b36]{padding:0;align-items:stretch}.modal-standard .container[data-v-ea628b36]{margin:20px 0 0;padding:50px 30px;flex:1;width:100%;border-bottom-left-radius:0;border-bottom-right-radius:0}}.backdrop[data-v-ea628b36]{overflow:auto;background:rgba(0,0,0,.4);-webkit-overflow-scrolling:touch;width:100%;height:100%;position:fixed}.container[data-v-ea628b36]{margin-left:auto;margin-right:auto;width:980px;background:var(--colors-generic-modal-background,var(--color-generic-modal-background));z-index:1;position:relative;overflow:auto;max-width:100%}@media only screen and (max-width:1250px){.container[data-v-ea628b36]{width:692px}}@media only screen and (max-width:735px){.container[data-v-ea628b36]{width:87.5%}}.close[data-v-ea628b36]{position:absolute;z-index:9999;top:22px;left:22px;width:30px;height:30px;color:#666;cursor:pointer;background:none;border:0;display:flex;align-items:center}.close .close-icon[data-v-ea628b36]{fill:currentColor;width:100%;height:100%}.theme-dark .container[data-v-ea628b36]{background:#000}.theme-dark .container .close[data-v-ea628b36]{color:#b0b0b0}.theme-code .container[data-v-ea628b36]{background-color:var(--background,var(--color-code-background))}.metadata[data-v-2fa6f125]{display:flex}.item[data-v-2fa6f125]{font-size:.70588rem;line-height:1.33333;font-weight:600;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;border-right:1px solid #fff;padding:0 27.5px}@media only screen and (max-width:735px){.item[data-v-2fa6f125]{font-size:.64706rem;line-height:1.63636;font-weight:600;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;padding:0 8px}}.item[data-v-2fa6f125]:first-of-type{padding-left:0}.item[data-v-2fa6f125]:last-of-type{border:none}@media only screen and (max-width:735px){.item[data-v-2fa6f125]:last-of-type{padding-right:0}}.content[data-v-2fa6f125]{color:#fff}.icon[data-v-2fa6f125]{font-size:2.82353rem;line-height:1.08333;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}@media only screen and (max-width:1250px){.icon[data-v-2fa6f125]{font-size:2.35294rem;line-height:1.1;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}@media only screen and (max-width:735px){.icon[data-v-2fa6f125]{font-size:1.88235rem;line-height:1.125;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}.small-icon[data-v-2fa6f125]{width:1em;height:1em;margin-left:.2rem}.small-icon.xcode-icon[data-v-2fa6f125]{width:.8em;height:.8em}.content-link[data-v-2fa6f125]{display:flex;align-items:center}a[data-v-2fa6f125]{color:var(--colors-link,var(--color-tutorials-overview-link))}.duration[data-v-2fa6f125]{display:flex;align-items:baseline;font-size:2.35294rem;line-height:1;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;line-height:1.8rem}@media only screen and (max-width:735px){.duration[data-v-2fa6f125]{font-size:1.64706rem;line-height:1;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;line-height:1.3rem}}.minutes[data-v-2fa6f125]{display:inline-block;font-size:1.64706rem;line-height:1;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;line-height:1.3rem}@media only screen and (max-width:735px){.minutes[data-v-2fa6f125]{font-size:1rem;line-height:1.23529;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;line-height:.8rem}}.item-large-icon[data-v-2fa6f125]{height:2.3rem;max-width:100%}@media only screen and (max-width:735px){.item-large-icon[data-v-2fa6f125]{height:1.5rem;max-width:100%}}.bottom[data-v-2fa6f125]{margin-top:13px}@media only screen and (max-width:735px){.bottom[data-v-2fa6f125]{margin-top:8px}}.hero[data-v-cb87b2d0]{color:var(--color-tutorial-hero-text);position:relative}.bg[data-v-cb87b2d0],.hero[data-v-cb87b2d0]{background-color:var(--color-tutorial-hero-background)}.bg[data-v-cb87b2d0]{background-position:top;background-repeat:no-repeat;background-size:cover;content:"";height:100%;left:0;opacity:.3;position:absolute;top:0;width:100%}.row[data-v-cb87b2d0]{margin-left:auto;margin-right:auto;width:980px;padding:80px 0}@media only screen and (max-width:1250px){.row[data-v-cb87b2d0]{width:692px}}@media only screen and (max-width:735px){.row[data-v-cb87b2d0]{width:87.5%}}.col[data-v-cb87b2d0]{z-index:1}[data-v-cb87b2d0] .eyebrow{font-size:1.41176rem;line-height:1.16667;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;color:var(--color-hero-eyebrow)}@media only screen and (max-width:1250px){[data-v-cb87b2d0] .eyebrow{font-size:1.23529rem;line-height:1.19048;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}.headline[data-v-cb87b2d0]{font-size:2.82353rem;line-height:1.08333;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;margin-bottom:2rem}@media only screen and (max-width:1250px){.headline[data-v-cb87b2d0]{font-size:2.35294rem;line-height:1.1;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}@media only screen and (max-width:735px){.headline[data-v-cb87b2d0]{font-size:1.88235rem;line-height:1.125;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}.intro[data-v-cb87b2d0]{font-size:1.23529rem;line-height:1.38095;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}@media only screen and (max-width:735px){.intro[data-v-cb87b2d0]{font-size:1.11765rem;line-height:1.42105;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}.content+p[data-v-cb87b2d0]{margin-top:.8em}@media only screen and (max-width:735px){.content+p[data-v-cb87b2d0]{margin-top:8px}}.call-to-action[data-v-cb87b2d0]{display:flex;align-items:center}.call-to-action .cta-icon[data-v-cb87b2d0]{margin-left:.4rem;width:1em;height:1em}.metadata[data-v-cb87b2d0]{margin-top:2rem}.video-asset[data-v-cb87b2d0]{display:grid;height:100vh;margin:0;place-items:center center}.video-asset[data-v-cb87b2d0] video{max-width:1280px;min-width:320px;width:100%}@media only screen and (max-width:735px){.headline[data-v-cb87b2d0]{margin-bottom:19px}}.tutorial-hero[data-v-35a9482f]{margin-bottom:80px}@media only screen and (max-width:735px){.tutorial-hero[data-v-35a9482f]{margin-bottom:0}}.title[data-v-8ec95972]{font-size:.70588rem;line-height:1.33333;color:var(--colors-secondary-label,var(--color-secondary-label))}.title[data-v-8ec95972],.title[data-v-455ff2a6]{font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}.title[data-v-455ff2a6]{font-size:1.11765rem;line-height:1.21053;color:var(--colors-header-text,var(--color-header-text));margin:25px 0}.question-content[data-v-455ff2a6] code{font-size:.76471rem;line-height:1.84615;font-weight:400;font-family:Menlo,monospace}.choices[data-v-455ff2a6]{display:flex;flex-direction:column;padding:0;list-style:none;margin:25px 0}.choice[data-v-455ff2a6]{font-size:.82353rem;line-height:1.42857;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;flex:1;border-radius:4px;margin:8px 0;padding:1.5rem 40px;cursor:pointer;background:var(--colors-text-background,var(--color-text-background));display:flex;flex-direction:column;justify-content:center;border-width:1px;border-style:solid;border-color:var(--colors-grid,var(--color-grid));position:relative}.choice[data-v-455ff2a6] img{max-height:23.52941rem}.choice[data-v-455ff2a6]:first-of-type{margin-top:0}.choice[data-v-455ff2a6] code{font-size:.76471rem;line-height:1.84615;font-weight:400;font-family:Menlo,monospace}.controls[data-v-455ff2a6]{text-align:center;margin-bottom:40px}.controls .button-cta[data-v-455ff2a6]{margin:.5rem;margin-top:0;padding:.3rem 3rem;min-width:8rem}input[type=radio][data-v-455ff2a6]{position:absolute;width:100%;left:0;height:100%;opacity:0;z-index:-1}.active[data-v-455ff2a6]{border-color:var(--color-tutorial-quiz-border-active);box-shadow:0 0 0 4px var(--color-focus-color);outline:none}.active [data-v-455ff2a6]{color:var(--colors-text,var(--color-text))}.correct[data-v-455ff2a6]{background:var(--color-form-valid-background);border-color:var(--color-form-valid)}.correct .choice-icon[data-v-455ff2a6]{fill:var(--color-form-valid)}.incorrect[data-v-455ff2a6]{background:var(--color-form-error-background);border-color:var(--color-form-error)}.incorrect .choice-icon[data-v-455ff2a6]{fill:var(--color-form-error)}.correct[data-v-455ff2a6],.incorrect[data-v-455ff2a6]{position:relative}.correct .choice-icon[data-v-455ff2a6],.incorrect .choice-icon[data-v-455ff2a6]{position:absolute;top:11px;left:10px;font-size:20px;width:1.05em}.disabled[data-v-455ff2a6]{pointer-events:none}.answer[data-v-455ff2a6]{margin:.5rem 1.5rem .5rem 0;font-size:.70588rem;line-height:1.33333;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}.answer[data-v-455ff2a6]:last-of-type{margin-bottom:0}[data-v-455ff2a6] .question>.code-listing{padding:unset;border-radius:0}[data-v-455ff2a6] pre{padding:0}[data-v-455ff2a6] img{display:block;margin-left:auto;margin-right:auto;max-width:100%}.title[data-v-c1de71de]{font-size:1.88235rem;line-height:1.25;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;color:var(--colors-header-text,var(--color-header-text))}@media only screen and (max-width:1250px){.title[data-v-c1de71de]{font-size:1.64706rem;line-height:1.28571;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}@media only screen and (max-width:735px){.title[data-v-c1de71de]{font-size:1.41176rem;line-height:1.33333;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}.title p[data-v-c1de71de]{color:var(--colors-text,var(--color-text))}.assessments[data-v-c1de71de]{box-sizing:content-box;padding:0 1rem;background:var(--color-tutorial-assessments-background);margin-left:auto;margin-right:auto;width:980px;margin-bottom:80px}@media only screen and (max-width:1250px){.assessments[data-v-c1de71de]{width:692px}}@media only screen and (max-width:735px){.assessments[data-v-c1de71de]{width:87.5%}}.banner[data-v-c1de71de]{padding:40px 0;border-bottom:1px solid;margin-bottom:40px;border-color:var(--colors-grid,var(--color-grid));text-align:center}.success[data-v-c1de71de]{text-align:center;padding-bottom:40px;font-size:1.88235rem;line-height:1.25;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;color:var(--colors-text,var(--color-text))}@media only screen and (max-width:1250px){.success[data-v-c1de71de]{font-size:1.64706rem;line-height:1.28571;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}@media only screen and (max-width:735px){.success[data-v-c1de71de]{font-size:1.41176rem;line-height:1.33333;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}.assessments-wrapper[data-v-c1de71de]{padding-top:80px}.assessments-wrapper[data-v-3c94366b]{padding-bottom:40px;padding-top:0}@media only screen and (max-width:735px){.assessments-wrapper[data-v-3c94366b]{padding-top:80px}}.article[data-v-d9f204d0]{background:var(--colors-article-background,var(--color-article-background))}@media only screen and (max-width:735px){.article[data-v-d9f204d0]{background:var(--colors-text-background,var(--color-article-body-background))}}.intro-container[data-v-54daa228]{margin-bottom:80px}.intro[data-v-54daa228]{display:flex;align-items:center}@media only screen and (max-width:735px){.intro[data-v-54daa228]{padding-bottom:0;flex-direction:column}}.intro.ide .media[data-v-54daa228] img{background-color:var(--colors-text-background,var(--color-text-background))}.col.left[data-v-54daa228]{padding-right:40px}@media only screen and (max-width:1250px){.col.left[data-v-54daa228]{padding-right:28px}}@media only screen and (max-width:735px){.col.left[data-v-54daa228]{margin-left:auto;margin-right:auto;width:980px;padding-right:0}}@media only screen and (max-width:735px) and (max-width:1250px){.col.left[data-v-54daa228]{width:692px}}@media only screen and (max-width:735px) and (max-width:735px){.col.left[data-v-54daa228]{width:87.5%}}.col.right[data-v-54daa228]{padding-left:40px}@media only screen and (max-width:1250px){.col.right[data-v-54daa228]{padding-left:28px}}@media only screen and (max-width:735px){.col.right[data-v-54daa228]{padding-left:0}}.content[data-v-54daa228]{font-size:1rem;line-height:1.47059;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}.media[data-v-54daa228] img{width:auto;max-height:560px;min-height:18.82353rem;-o-object-fit:scale-down;object-fit:scale-down}@media only screen and (max-width:735px){.media[data-v-54daa228]{margin:0;margin-top:40px}.media[data-v-54daa228] img,.media[data-v-54daa228] video{max-height:80vh}}.media[data-v-54daa228] .asset{padding:0 20px}.headline[data-v-54daa228]{color:var(--colors-header-text,var(--color-header-text))}[data-v-54daa228] .eyebrow{font-size:1.23529rem;line-height:1.19048;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}@media only screen and (max-width:735px){[data-v-54daa228] .eyebrow{font-size:1.11765rem;line-height:1.21053;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}[data-v-54daa228] .eyebrow a{color:inherit}[data-v-54daa228] .heading{font-size:1.88235rem;line-height:1.25;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}@media only screen and (max-width:1250px){[data-v-54daa228] .heading{font-size:1.64706rem;line-height:1.28571;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}@media only screen and (max-width:735px){[data-v-54daa228] .heading{font-size:1.41176rem;line-height:1.33333;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}}.expanded-intro[data-v-54daa228]{margin-left:auto;margin-right:auto;width:980px;margin-top:40px}@media only screen and (max-width:1250px){.expanded-intro[data-v-54daa228]{width:692px}}@media only screen and (max-width:735px){.expanded-intro[data-v-54daa228]{width:87.5%}}[data-v-54daa228] .cols-2{gap:20px 16.66667%}[data-v-54daa228] .cols-3 .column{gap:20px 12.5%}.code-preview[data-v-9acc0234]{position:sticky;overflow-y:auto;-webkit-overflow-scrolling:touch;background-color:var(--background,var(--color-step-background));height:calc(100vh - 3.05882rem)}.code-preview.ide[data-v-9acc0234]{height:100vh}.code-preview[data-v-9acc0234] .code-listing{color:var(--text,var(--color-code-plain))}.code-preview[data-v-9acc0234] pre{font-size:.70588rem;line-height:1.83333;font-weight:400;font-family:Menlo,monospace}.header[data-v-9acc0234]{font-size:.70588rem;line-height:1.33333;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;position:relative;display:flex;justify-content:space-between;align-items:center;width:-webkit-fill-available;width:-moz-available;width:stretch;cursor:pointer;font-weight:600;padding:8px 12px;border-radius:4px 4px 0 0;z-index:1;background:var(--color-runtime-preview-background);color:var(--colors-runtime-preview-text,var(--color-runtime-preview-text))}.header[data-v-9acc0234]:focus{outline-style:none}#app.fromkeyboard .header[data-v-9acc0234]:focus{box-shadow:0 0 0 4px var(--color-focus-color);outline:none;border-color:var(--color-focus-border-color)}.runtime-preview[data-v-9acc0234]{--color-runtime-preview-shadow:rgba(0,0,0,0.4);position:absolute;top:0;right:0;background:var(--color-runtime-preview-background);border-radius:4px;margin:1rem;margin-left:0;transition:width .2s ease-in;box-shadow:0 0 3px 0 var(--color-runtime-preview-shadow)}@media screen{[data-color-scheme=dark] .runtime-preview[data-v-9acc0234]{--color-runtime-preview-shadow:hsla(0,0%,100%,0.4)}}@media screen and (prefers-color-scheme:dark){[data-color-scheme=auto] .runtime-preview[data-v-9acc0234]{--color-runtime-preview-shadow:hsla(0,0%,100%,0.4)}}@supports not ((width:-webkit-fill-available) or (width:-moz-available) or (width:stretch)){.runtime-preview[data-v-9acc0234]{display:flex;flex-direction:column}}.runtime-preview .runtimve-preview__container[data-v-9acc0234]{border-radius:4px;overflow:hidden}.runtime-preview-ide[data-v-9acc0234]{top:0}.runtime-preview-ide .runtime-preview-asset[data-v-9acc0234] img{background-color:var(--color-runtime-preview-background)}.runtime-preview.collapsed[data-v-9acc0234]{box-shadow:0 0 3px 0 var(--color-runtime-preview-shadow);width:102px}.runtime-preview.collapsed .header[data-v-9acc0234]{border-radius:4px}.runtime-preview.disabled[data-v-9acc0234]{box-shadow:0 0 3px 0 transparent}.runtime-preview.disabled .header[data-v-9acc0234]{color:var(--color-runtime-preview-disabled-text);cursor:auto}.runtime-preview-asset[data-v-9acc0234]{border-radius:0 0 4px 4px}.runtime-preview-asset[data-v-9acc0234] img{border-bottom-left-radius:4px;border-bottom-right-radius:4px}.preview-icon[data-v-9acc0234]{height:.8em;width:.8em;-webkit-user-select:none;-moz-user-select:none;user-select:none}.preview-show[data-v-9acc0234]{transform:scale(-1)}[data-v-5ad4e037] pre{padding:10px 0}.toggle-preview[data-v-d0709828]{color:var(--color-runtime-preview-disabled-text);display:flex;align-items:center}a[data-v-d0709828]{color:var(--url,var(--color-link))}.toggle-text[data-v-d0709828]{display:flex;align-items:center}svg.toggle-icon[data-v-d0709828]{width:1em;height:1em;margin-left:.5em}.mobile-code-preview[data-v-3bee1128]{background-color:var(--background,var(--color-step-background));padding:14px 0}@media only screen and (max-width:735px){.mobile-code-preview[data-v-3bee1128]{display:flex;flex-direction:column}}.runtime-preview-modal-content[data-v-3bee1128]{padding:45px 60px 0 60px;min-width:200px}.runtime-preview-modal-content[data-v-3bee1128] img:not(.file-icon){border-radius:4px;box-shadow:0 0 3px rgba(0,0,0,.4);max-height:80vh;width:auto;display:block;margin-bottom:1rem}.runtime-preview-modal-content .runtime-preview-label[data-v-3bee1128]{font-size:.70588rem;line-height:1.33333;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;color:var(--color-runtime-preview-text);display:block;text-align:center;padding:.5em}[data-v-3bee1128] .code-listing{color:var(--text,var(--color-code-plain))}[data-v-3bee1128] .full-code-listing{padding-top:60px;min-height:calc(100vh - 60px)}[data-v-3bee1128] pre{font-size:.70588rem;line-height:1.83333;font-weight:400;font-family:Menlo,monospace}.preview-toggle-container[data-v-3bee1128]{align-self:flex-end;margin-right:20px}.step-container[data-v-4abdd121]{margin:0}.step-container[data-v-4abdd121]:not(:last-child){margin-bottom:100px}@media only screen and (max-width:735px){.step-container[data-v-4abdd121]:not(:last-child){margin-bottom:80px}}.step[data-v-4abdd121]{position:relative;border-radius:4px;padding:1rem 2rem;background-color:var(--color-step-background);overflow:hidden;-webkit-mask-image:-webkit-radial-gradient(#fff,#000)}.step[data-v-4abdd121]:before{content:"";position:absolute;top:0;left:0;border:1px solid var(--color-step-focused);background-color:var(--color-step-focused);height:calc(100% - 2px);width:4px;opacity:0;transition:opacity .15s ease-in}.step.focused[data-v-4abdd121],.step[data-v-4abdd121]:focus{outline:none}.step.focused[data-v-4abdd121]:before,.step[data-v-4abdd121]:focus:before{opacity:1}@media only screen and (max-width:735px){.step[data-v-4abdd121]{padding-left:2rem}.step[data-v-4abdd121]:before{opacity:1}}.step-label[data-v-4abdd121]{font-size:.70588rem;line-height:1.33333;font-weight:600;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;color:var(--colors-text,var(--color-step-text));margin-bottom:.4em}.caption[data-v-4abdd121]{border-top:1px solid;border-color:var(--color-step-caption);padding:1rem 0 0 0;margin-top:1rem}.media-container[data-v-4abdd121]{display:none}@media only screen and (max-width:735px){.step[data-v-4abdd121]{margin:0 .58824rem 1.17647rem .58824rem}.step.focused[data-v-4abdd121],.step[data-v-4abdd121]:focus{outline:none}.media-container[data-v-4abdd121]{display:block;position:relative}.media-container[data-v-4abdd121] img,.media-container[data-v-4abdd121] video{max-height:80vh}[data-v-4abdd121] .asset{padding:0 20px}}.steps[data-v-25d30c2c]{position:relative;font-size:.82353rem;line-height:1.42857;font-weight:400;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;display:flex;color:var(--colors-text,var(--color-text))}@media only screen and (max-width:735px){.steps[data-v-25d30c2c]{padding-top:80px}.steps[data-v-25d30c2c]:before{position:absolute;top:0;border-top:1px solid var(--color-fill-gray-tertiary);content:"";width:calc(100% - 2.35294rem);margin:0 1.17647rem}}.content-container[data-v-25d30c2c]{flex:none;margin-right:4.16667%;width:37.5%;margin-top:140px;margin-bottom:94vh}@media only screen and (max-width:735px){.content-container[data-v-25d30c2c]{margin-top:0;margin-bottom:0;height:100%;margin-left:0;margin-right:0;position:relative;width:100%}}.asset-container[data-v-25d30c2c]{flex:none;height:calc(100vh - 3.05882rem);background-color:var(--background,var(--color-step-background));max-width:921px;width:calc(50vw + 8.33333%);position:sticky;top:3.05882rem;transition:margin .1s ease-in-out}@media only screen and (max-width:767px){.asset-container[data-v-25d30c2c]{top:2.82353rem;height:calc(100vh - 2.82353rem)}}.asset-container[data-v-25d30c2c]:not(.for-step-code){overflow-y:auto;-webkit-overflow-scrolling:touch}.asset-container.ide[data-v-25d30c2c]{height:100vh;top:0}@media only screen and (min-width:736px){.asset-container[data-v-25d30c2c]{display:grid}.asset-container>[data-v-25d30c2c]{grid-row:1;grid-column:1;height:calc(100vh - 3.05882rem)}.asset-container.ide>[data-v-25d30c2c]{height:100vh}}.asset-container .step-asset[data-v-25d30c2c]{box-sizing:border-box;padding:0;padding-left:40px;min-height:320px;height:100%}.asset-container .step-asset[data-v-25d30c2c],.asset-container .step-asset[data-v-25d30c2c] picture{height:100%;display:flex;align-items:center}.asset-container .step-asset[data-v-25d30c2c] .video-replay-container{height:100%;display:flex;flex-direction:column;justify-content:center}.asset-container .step-asset[data-v-25d30c2c] img,.asset-container .step-asset[data-v-25d30c2c] video{width:auto;max-height:calc(100vh - 3.05882rem - 80px);max-width:531.6634px;margin:0}@media only screen and (max-width:1250px){.asset-container .step-asset[data-v-25d30c2c] img,.asset-container .step-asset[data-v-25d30c2c] video{max-width:363.66436px}}.asset-container .step-asset[data-v-25d30c2c] .video-replay-container,.asset-container .step-asset[data-v-25d30c2c] img{min-height:320px}.asset-container .step-asset[data-v-25d30c2c] .video-replay-container video{min-height:280px}@media only screen and (max-width:735px){.asset-container[data-v-25d30c2c]{display:none}}.asset-wrapper[data-v-25d30c2c]{width:63.2%;align-self:center;transition:transform .25s ease-out;will-change:transform}.asset-wrapper.ide .step-asset[data-v-25d30c2c] img{background-color:var(--background,var(--color-step-background))}[data-v-25d30c2c] .runtime-preview-asset{display:grid}[data-v-25d30c2c] .runtime-preview-asset>*{grid-row:1;grid-column:1}.interstitial[data-v-25d30c2c]{padding:0 2rem}.interstitial[data-v-25d30c2c]:not(:first-child){margin-top:5.88235rem}.interstitial[data-v-25d30c2c]:not(:last-child){margin-bottom:30px}@media only screen and (max-width:735px){.interstitial[data-v-25d30c2c]{margin-left:auto;margin-right:auto;width:980px;padding:0}}@media only screen and (max-width:735px) and (max-width:1250px){.interstitial[data-v-25d30c2c]{width:692px}}@media only screen and (max-width:735px) and (max-width:735px){.interstitial[data-v-25d30c2c]{width:87.5%}}@media only screen and (max-width:735px){.interstitial[data-v-25d30c2c]:not(:first-child){margin-top:0}}.fade-enter-active[data-v-25d30c2c],.fade-leave-active[data-v-25d30c2c]{transition:opacity .3s ease-in-out}.fade-enter[data-v-25d30c2c],.fade-leave-to[data-v-25d30c2c]{opacity:0}.section[data-v-6b3a0b3a]{padding-top:80px}.sections[data-v-79a75e9e]{margin-left:auto;margin-right:auto;width:980px}@media only screen and (max-width:1250px){.sections[data-v-79a75e9e]{width:692px}}@media only screen and (max-width:735px){.sections[data-v-79a75e9e]{width:87.5%;margin:0;width:100%}}.tutorial[data-v-0f871b08]{background-color:var(--colors-text-background,var(--color-tutorial-background))}