.tk{max-width:1180px}.tk-head{justify-content:space-between;align-items:end;gap:16px 32px;margin-bottom:20px}.tk-files,.tk-head{display:flex;flex-wrap:wrap}.tk-files{gap:6px}.tk-index{position:sticky;top:0;z-index:2;display:flex;flex-wrap:wrap;gap:2px;margin:0 -4px 28px;padding:8px 0;background:var(--ui-page);border-bottom:1px solid var(--ui-hair)}.tk-index a{padding:4px 10px;border-radius:8px;color:var(--ui-ink-2);font-size:13px;text-decoration:none}@media (hover:hover) and (pointer:fine){.tk-index a:hover{background:var(--ui-hover);color:var(--ui-ink)}}.tk-section{margin-bottom:48px}#colour,.tk-section,.tk-two{scroll-margin-top:56px}.tk-section-head{display:grid;gap:4px;margin:0 4px 14px}.tk-section-head h2{display:flex;align-items:baseline;gap:10px;font-size:15px;font-weight:600;letter-spacing:-.005em}.tk-section-head p{max-width:68ch;color:var(--ui-ink-2);font-size:13px;line-height:18px}.tk-flag{color:var(--ui-ink-2);font-size:12px;font-weight:400}.tk-name{font-weight:600}.tk-swatches{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}.tk-swatches li{display:grid;grid-template-rows:auto 1fr;overflow:hidden;border-radius:14px;background:var(--ui-panel);box-shadow:0 0 0 .5px var(--ui-hair)}.tk-fill{position:relative;aspect-ratio:16/10;background-position:50%;background-size:140px;box-shadow:inset 0 -.5px 0 var(--ui-hair)}.tk-swatches.is-primary .tk-fill{aspect-ratio:5/4}.tk-fill-name{position:absolute;top:14px;left:16px;font-size:22px;font-weight:350;letter-spacing:-.01em}.tk-fill-tag{position:absolute;bottom:10px;left:12px;padding:2px 8px;border-radius:6px;background:rgba(19,18,16,.6);font-size:11px}.tk-meta{display:grid;align-content:start;gap:4px;padding:12px 14px 14px}.tk-values{margin-top:6px;font-size:12px}.tk-roles{margin-top:4px;font-size:11px}.tk-share{display:flex;gap:2px;height:22px;margin-top:8px;overflow:hidden;border-radius:6px;box-shadow:0 0 0 .5px var(--ui-hair)}.tk-share span{position:relative}.tk-share em{position:absolute;inset:0 auto 0 8px;display:flex;align-items:center;font-size:11px;font-style:normal;mix-blend-mode:difference;color:#FFFFFF;white-space:nowrap}.tk-tints{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}.tk-tints li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:2px 12px;padding:10px;border-radius:12px;background:var(--ui-panel);box-shadow:0 0 0 .5px var(--ui-hair);font-size:12px}.tk-tints i{grid-row:span 4;border-radius:8px;box-shadow:inset 0 0 0 .5px rgba(128,128,128,.35)}.tk-ramps{display:grid;gap:2px;align-items:stretch}.tk-ramp-name{padding:0 0 6px 2px;font-size:12px;font-weight:600}.tk-step{align-self:center;font-size:11px}.tk-shade{position:relative;padding:7px 8px;font-size:11px}.tk-shade:nth-child(-n+16){border-radius:0}.tk-shade .copy-value{color:inherit}.tk-shade .copy-tag{color:inherit;opacity:.7}.tk-base{position:absolute;top:50%;right:8px;transform:translateY(-50%)}.tk-themes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.tk-theme{padding:14px 16px 6px;border-radius:14px;background:var(--ui-panel);box-shadow:0 0 0 .5px var(--ui-hair)}.tk-theme-head{display:grid;gap:2px;margin-bottom:8px}.tk-theme table{width:100%;border-collapse:collapse;font-size:13px}.tk-theme td,.tk-theme th{padding:7px 8px 7px 0;border-top:1px solid var(--ui-hair);text-align:left;font-weight:400;white-space:nowrap}.tk-theme th{font-weight:500}.tk-theme td:last-child{padding-right:0;text-align:right}.tk-theme td .copy-value{display:inline-flex;width:auto}.tk-dot{display:inline-block;width:10px;height:10px;margin-right:8px;border-radius:50%;vertical-align:-1px;box-shadow:inset 0 0 0 .5px rgba(128,128,128,.5)}.tk-below{box-shadow:inset 0 -1px 0 currentColor}.tk-type{margin:0;padding:0;list-style:none;border-radius:14px;background:var(--ui-panel);box-shadow:0 0 0 .5px var(--ui-hair)}.tk-type li{display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px;align-items:baseline;padding:14px 16px}.tk-type li+li{border-top:1px solid var(--ui-hair)}.tk-type-meta{display:grid;gap:2px;font-size:12px}.tk-type-meta .tk-name{font-size:13px}.tk-type-sample{font-family:var(--type-sans-family),var(--type-sans-fallback);overflow-wrap:anywhere}.tk-type-sample[data-family=display]{font-family:var(--type-display-family),var(--type-display-fallback)}.tk-type-sample[data-family=mono]{font-family:var(--type-mono-family),var(--type-mono-fallback)}.tk-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 8px}.tk-list{margin:0;padding:0;list-style:none;border-radius:14px;background:var(--ui-panel);box-shadow:0 0 0 .5px var(--ui-hair);font-size:12px}.tk-list li{display:grid;grid-template-columns:minmax(0,160px) 56px minmax(0,1fr);gap:12px;align-items:center;padding:7px 14px}.tk-list.is-motion li{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.tk-list li+li{border-top:1px solid var(--ui-hair)}.tk-bar{max-width:100%;height:6px;border-radius:3px;background:var(--ui-ink);opacity:.18}.tk-textures{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}.tk-textures li{display:grid;align-content:start;gap:2px;padding:6px 6px 12px;border-radius:14px;background:var(--ui-panel);box-shadow:0 0 0 .5px var(--ui-hair);font-size:12px}.tk-textures li>:not(.tk-texture){padding:0 8px}.tk-texture{display:block;aspect-ratio:1;margin-bottom:8px;border-radius:10px;background-size:50%}@media (max-width:900px){.tk-swatches,.tk-textures,.tk-tints{grid-template-columns:repeat(2,minmax(0,1fr))}.tk-themes,.tk-two{grid-template-columns:minmax(0,1fr)}.tk-ramps{overflow-x:auto}}@media (max-width:600px){.tk-type li{grid-template-columns:minmax(0,1fr);gap:8px}.tk-theme td:nth-child(3){display:none}}.tk-wordmark{display:block;width:224px;aspect-ratio:379/137;background:var(--ui-ink);-webkit-mask:url(/out/kit/brand/logo/wordmark-oxide.svg) left center/contain no-repeat;mask:url(/out/kit/brand/logo/wordmark-oxide.svg) left center/contain no-repeat}