.principles{--filter-fill-active:#dedede;--header-gradient-top:100%;--header-gradient-middle:90%;--header-gradient-stop:70%;--header-gradient-reach:120%;--principles-header-height:54px;--principles-sticky-top:var(--docs-sticky-top);--principles-section-gap:var(--content-gap);color:var(--ink);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;letter-spacing:0;min-height:100vh;font-family:var(--font-soehne), ui-sans-serif, sans-serif;font-size:var(--base-size);font-weight:400;line-height:var(--leading);background:#fff}.principles .mono{font-family:var(--mono);text-transform:uppercase;font-size:11px;line-height:1}.principles{position:relative}@media (max-width:768px){.principles[data-grid=on] .gridlines{grid-template-columns:repeat(3, minmax(0, 1fr) var(--gutter)) minmax(0, 1fr)}.principles .gridlines>:nth-child(n+8){display:none}}.principles .dim{color:var(--dim)}.principles .grid-toggle[aria-pressed=true]{color:rgba(var(--annotation), .45)}.principles .grid-toggle:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.principles .head{top:var(--app-header-h);z-index:3;isolation:isolate;height:var(--principles-header-height);background:0 0;row-gap:0;padding:0;position:static}.principles .head:before{content:none;z-index:-1;box-sizing:border-box;height:var(--header-gradient-reach);pointer-events:none;background:linear-gradient(to bottom, rgb(255 255 255/var(--header-gradient-top)) 0%, rgb(255 255 255/var(--header-gradient-middle)) var(--header-gradient-stop), #fff0 100%);position:absolute;inset:0 0 auto}.principles[data-gradient-bounds=on] .head:before{border-bottom:1px dotted #f43f5e}.principles .head h1,.principles .head .lede{font-size:var(--base-size);line-height:var(--leading);color:var(--ink);letter-spacing:0;margin:0;font-weight:400}.principles .head .brand{color:var(--ink);grid-area:1/1/auto/3;align-self:center;align-items:center;display:flex}.principles .head .brand svg{color:var(--ink)}.principles .head .brand svg path[fill^=url]{display:none}.principles .head .title{flex-direction:column;grid-area:1/1/auto/12;display:flex}.principles .head h1{letter-spacing:-.01em;color:var(--ink);margin:0;font-size:36px;font-weight:400;line-height:1.1}.principles .mobile-principle-menu,.principles .mobile-principle-trigger,.principles .mobile-principle-tray{display:none}.principles .head{align-items:center}.principles .head .lede{grid-column:3/12}.principles .principles-intro{grid-column:1/11}.principles .principles-intro p{color:var(--ink);margin:0}.principles .filters ul{align-items:flex-start;gap:var(--pill-gap);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.principles .filters a{background:var(--fill);border-radius:var(--radius-pill);color:var(--ink);font-family:var(--mono);text-transform:uppercase;letter-spacing:-1px;padding:5px 8px 4px;font-size:11px;line-height:1;text-decoration:none;transition:background .15s;display:block}@media (hover:hover){.principles .filters a:hover{background:var(--filter-fill-active)}}.principles .filters a[aria-current=location]{background:var(--filter-fill-active)}.principles .filters a:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.principles .filters a.back{font-family:var(--font-soehne), ui-sans-serif, sans-serif;padding:4.5px 8px;font-size:11px;line-height:11px}.principles .principle{scroll-margin-top:var(--principles-sticky-top);column-gap:var(--gutter);grid-column:1/-1;grid-template-columns:repeat(12,minmax(0,1fr));display:grid;position:relative}.principles .phead{top:var(--principles-sticky-top);z-index:2;align-self:start;column-gap:var(--gutter);pointer-events:none;grid-area:1/1/auto/-1;grid-template-columns:repeat(12,minmax(0,1fr));display:grid;position:sticky}.principles .phead>*{pointer-events:auto}.principles .phead:before{content:"";pointer-events:none;box-sizing:border-box;height:var(--gutter);border-top:1px dashed #0000;border-bottom:1px dashed #0000;margin-left:0;position:absolute;inset:0 0 auto}.principles .principle h2{font-size:var(--base-size);line-height:var(--leading);color:var(--ink);text-transform:uppercase;grid-column:1/5;margin:0;font-weight:400}.principles .principle .tagline{color:var(--dim);font-size:var(--base-size);line-height:var(--leading);grid-column:1/5;margin:0}.principles .ptags{align-items:flex-start;gap:var(--pill-gap);flex-direction:column;margin-top:4px;display:flex}.principles .ptags a{border:1px solid var(--tag-border);border-radius:var(--radius-pill);color:var(--ink);font-family:var(--mono);text-transform:uppercase;padding:6px 8px 3px;font-size:11px;line-height:1;text-decoration:none;transition:border-color .15s;display:inline-block}@media (hover:hover){.principles .ptags a:hover{border-color:var(--mid)}}.principles .ptags a:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.principles .doctrines{gap:calc(var(--baseline) * 2);flex-direction:column;grid-area:1/7/auto/13;display:flex}.principles .doctrine{scroll-margin-top:var(--principles-sticky-top)}.principles .plessons{margin:0;padding:0;list-style:none}.principles .plessons .arr{color:#d3d3d3}.principles .plessons li{border-top:1px dashed var(--tag-border);font-size:12px}.principles .plessons a{justify-content:space-between;align-items:baseline;gap:var(--gutter);line-height:calc(var(--baseline) - 1px);color:var(--ink);padding:0;text-decoration:none;transition:color .15s;display:flex}@media (hover:hover){.principles .plessons a:hover,.principles .plessons a:hover .arr{color:var(--ink)}}.principles .plessons a:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.principles .dhead{align-items:baseline;gap:12px;display:flex}.principles .dslug{z-index:1;cursor:pointer;color:var(--dim);opacity:0;background:0 0;border:none;justify-content:center;align-items:center;margin:0;padding:0;transition:opacity .15s,color .15s;display:inline-flex;position:relative}.principles .dslug svg{width:16px;height:16px}.principles .dslug.is-copied{opacity:1;color:var(--ink)}.principles .doctrine:hover .dslug,.principles .dslug:focus-visible{opacity:1}@media (hover:none){.principles .dslug{display:none}}@media (hover:hover){.principles .dslug:hover{color:var(--ink)}}.principles .dslug:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.principles .doctrine h3{font-size:var(--base-size);font-weight:400;line-height:var(--leading);color:var(--ink);margin:0}.principles .doctrine p{color:var(--dim);margin:0}.principles .gradient-controls{z-index:6;box-sizing:border-box;border:1px solid var(--tag-border);width:264px;color:var(--ink);background:#fffffff5;border-radius:8px;padding:12px;font-size:11px;line-height:1;position:fixed;bottom:16px;right:16px;box-shadow:0 8px 24px #0000001a}.principles .gradient-controls-head,.principles .gradient-controls label>span{justify-content:space-between;align-items:center;gap:12px;display:flex}.principles .gradient-controls-head{font-family:var(--mono);text-transform:uppercase;margin-bottom:14px}.principles .gradient-controls button{border-radius:var(--radius-pill);background:var(--fill);min-height:28px;color:var(--ink);cursor:pointer;font:inherit;border:0;padding:0 9px}.principles .gradient-controls button:hover{background:var(--filter-fill-active)}.principles .gradient-controls .gradient-bounds-toggle{width:100%}.principles .gradient-controls .gradient-bounds-toggle[aria-pressed=true]{color:#fff;background:#f43f5e}.principles .gradient-controls button:focus-visible,.principles .gradient-controls input:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.principles .gradient-controls label{margin-top:12px;display:block}.principles .gradient-controls output{text-align:right;min-width:32px;color:var(--dim);font-variant-numeric:tabular-nums}.principles .gradient-controls input[type=range]{margin:12px 0 4px;display:block}.principles .foot{padding-bottom:calc(var(--baseline) * 2)}.principles .foot-l{grid-column:1/7}.principles .foot-r{grid-column:7/13;justify-self:end}@media (max-width:768px){.principles{--principles-sticky-top:calc(var(--app-header-h) + var(--gutter))}.principles .principles-intro{padding-top:calc(var(--baseline) * 2)}.principles .principles-intro p{grid-column:1/-1}.principles .grid12,.principles .content,.principles .principle{grid-template-columns:1fr}.principles .grid12>*,.principles .content>*,.principles .principle>*{grid-column:1/-1}.principles .phead:before{margin-left:0}.principles .head .title,.principles .head .lede,.principles .phead,.principles .doctrines,.principles .foot-l,.principles .foot-r{grid-column:1/-1}.principles .phead,.principles .doctrines{grid-row:auto}.principles .phead{border-top:1px solid var(--tag-border);padding-top:8px;padding-bottom:calc(var(--baseline) * 4);margin-top:calc(var(--baseline) * 3);display:block;position:relative;top:auto}.principles .phead:before{display:none}.principles[data-grid=on] .phead{padding-top:var(--gutter);border-top-color:#0000}.principles[data-grid=on] .phead:before{display:block}.principles .doctrines{margin-top:0;padding-top:0}.principles .meta-r,.principles .foot-r{justify-self:end}.principles .head{box-sizing:border-box;width:calc(100% + 2 * var(--gutter));margin-inline:calc(-1 * var(--gutter));column-gap:var(--gutter);padding:0 var(--gutter);grid-template-columns:minmax(0,1fr) auto;row-gap:0}.principles .head .title{grid-area:1/1/auto/2;align-items:center;min-width:0;display:grid}.principles .head .title h1,.principles .mobile-principle-trigger{grid-area:1/1;transition:opacity .18s cubic-bezier(.215,.61,.355,1),transform .18s cubic-bezier(.215,.61,.355,1),visibility 0s linear .18s}.principles .mobile-principle-menu{display:contents}.principles .mobile-principle-trigger{min-width:44px;min-height:44px;color:var(--ink);cursor:pointer;touch-action:manipulation;opacity:0;visibility:hidden;pointer-events:none;background:0 0;border:0;justify-self:start;align-items:center;padding:0;display:flex;transform:translateY(4px)}.principles .mobile-principle-trigger>span{border-radius:var(--radius-pill);background:var(--fill);font-family:var(--mono);letter-spacing:-1px;text-transform:uppercase;padding:5px 8px 4px;font-size:13px;line-height:1}.principles .mobile-principle-trigger:active>span{transform:scale(.97)}.principles .mobile-principle-trigger:focus-visible{outline:2px solid var(--ink);outline-offset:0}.principles[data-mobile-nav=compact] .head .title h1{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-4px)}.principles[data-mobile-nav=compact] .mobile-principle-trigger{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s;transform:translateY(0)}.principles[data-mobile-nav=before] .head .title h1,.principles[data-mobile-nav=open] .head .title h1{transition-delay:0s}.principles .mobile-principle-tray{z-index:1;box-sizing:border-box;max-height:calc(100dvh - var(--principles-header-height));padding:8px var(--gutter) 12px;opacity:0;visibility:hidden;pointer-events:none;background:#fff;transition:opacity .18s cubic-bezier(.215,.61,.355,1),transform .18s cubic-bezier(.215,.61,.355,1),visibility 0s linear .18s;display:block;position:absolute;top:100%;left:0;right:0;overflow-y:auto;transform:translateY(-8px)}.principles[data-mobile-nav=open] .mobile-principle-tray{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s;transform:translateY(0)}.principles[data-mobile-nav=open] .head{background:#fff}.principles .mobile-principle-tray ul{flex-wrap:wrap;align-items:flex-start;gap:4px;margin:0;padding:0;list-style:none;display:flex}.principles .mobile-principle-tray li{display:flex}.principles .mobile-principle-tray a{color:var(--ink);touch-action:manipulation;align-items:center;text-decoration:none;display:flex}.principles .mobile-principle-tray a>span{border-radius:var(--radius-pill);background:var(--fill);font-family:var(--mono);letter-spacing:-1px;text-transform:uppercase;padding:5px 8px 4px;font-size:13px;line-height:1;transition:background-color .15s}.principles .mobile-principle-tray a[aria-current=location]>span{background:var(--filter-fill-active)}.principles .mobile-principle-tray a:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}.principles .mobile-principle-tray a[aria-label="Back to review"]>span{font-family:var(--font-soehne), ui-sans-serif, sans-serif;font-size:14px;line-height:13px}.principles .grid-toggle{grid-area:1/2/auto/3;margin:0;position:relative;inset:auto}.principles .filters,.principles .content,.principles .grid-toggle{grid-row:auto}.principles .filters{max-height:none;margin:0;position:static}.principles .mono,.principles .filters a,.principles .dslug{font-size:13px}.principles .filters a.back{font-size:14px;line-height:13px}.principles .filters ul{gap:var(--pill-gap);flex-flow:wrap}.principles .content{row-gap:calc(var(--baseline) * 3 - var(--gutter));padding-bottom:calc(var(--baseline) * 4)}.principles .gradient-controls{right:var(--gutter);bottom:var(--gutter);width:min(264px, calc(100vw - 2 * var(--gutter)))}}@media (max-width:768px) and (prefers-reduced-motion:reduce){.principles .head .title h1,.principles .mobile-principle-trigger,.principles .mobile-principle-tray,.principles .mobile-principle-tray a>span{transition:none}}
