html,body { background:#fff; }
html { -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,input,button,textarea,p,th,td,header,nav,menu,menuitem,section,main,footer { margin:0; padding:0; }
menu,menuitem,section,main,footer { display:block; }
img { display:block; border:0; }
iframe, textarea { border:none; display:block; }
input, textarea, select, button { outline:none; font-weight:normal; }
table { border-collapse:collapse; border-spacing:0; font-size:inherit; font-size:100%; margin-bottom:14px; }
th { font-weight:600; }
tr > *:not(:last-child) { padding-right:20px; }
p, ol { margin-bottom:14px; }
ul { list-style:none; }
ol { margin-left:2em; }
small { font-size:12px; }
b { font-weight:600; }
strong { font-weight:600; }
a { text-decoration:none; }
svg { display:block; }
label { cursor:default; -webkit-tap-highlight-color:transparent; }
label:active { user-select:none; }
object { user-select:none; }

body { font-family:'text',sans-serif; font-size:16px; line-height:1.5; position:relative; min-height:100%; min-width:100%; -webkit-font-smoothing:antialiased; padding:40px; box-sizing:border-box; }

a, a:visited { color:#000; text-decoration:underline; }
a:hover { color:rgba(0,0,0,.6); }

:root {
--main: #05f;
}

p.lastedited { text-align:right; font-size:13px; }

.subheader { margin-bottom:160px; }
.subheader h2, .subheader p { font-size:26px; line-height:34px; margin-bottom:0; }
.subheader h2 { font-family:'display'; font-weight:500; }
.subheader p { font-family:'display'; font-weight:600; }

.currencycom { min-height:calc(100vh - 300px); margin:-120px 0 200px; display:flex; align-items:center; justify-content:center; }
.currencycom img { width:85%; height:auto; }

.grey { background:#f9f9f9; padding:30px 30px 60px; margin-bottom:300px; }

.tooltip { position:absolute; padding:5px 14px; background:#000; color:#fff; border-radius:99px; font-size:14px; line-height:18px; z-index:1000; pointer-events:none; }

.colors { display:grid; grid-template-columns: repeat(3, 1fr); max-width:1000px; margin:0 auto 300px; font-size:13px; line-height:19px; }
.colors > div { aspect-ratio:1; position:relative; }
.colors > div:after { content:''; position:absolute; top:30px; right:30px; width:12px; aspect-ratio:1; background:#fff; }
.colors > div:nth-child(1) { grid-row:span 2; aspect-ratio:1/2; border:1px solid #eee; border-right:none; }
.colors > div:nth-child(1):after, .colors > div:nth-child(4):after { background:#000; }
.colors p { margin:30px 30px 0; white-space:pre; }
.colors p + p { margin-top:0; margin-bottom:0; }

.colors ::selection { background:#999; }

.font { display:flex; column-gap:4vw; justify-content:space-between; margin-bottom:120px; text-align:left; }
.font > div { flex-grow:1; }
.font > div.glyph { flex-basis:calc(45% - 2vw); flex-shrink:0; flex-grow:inherit; display:flex; align-items:center; justify-content:center; font-size:35vw; line-height:0; margin-top:-2vw; cursor:default; }
.font .fontselect { margin-bottom:50px; font-size:15px; white-space:nowrap; }
.font .fontselect div { display:flex; flex-wrap:wrap; align-items:center; }
.font .fontselect div:not(:last-child) { margin-bottom:12px; }
.font .fontselect div p { font-family:'text'; font-weight:400; min-width:6em; margin-bottom:0; }
.font .fontselect div ul { display:flex; flex-wrap:wrap; }
.font .fontselect div ul li { border:1px solid transparent; border-radius:99px; padding:5px 14px; }
.font .fontselect div ul li.s { border:1px solid #555; cursor:default; }
.font .fontselect div ul li:not(.s) { cursor:pointer; }
.font .fontselect div ul li:not(.s):hover { color:rgba(0,0,0,.5); }
.font .fontselect div ul li i { font-style:normal; }
.font ul.glyphs { display:flex; flex-wrap:wrap; font-size:2.2vw; margin-bottom:60px; }
.font ul.glyphs li { border:2px solid #e6e6e6; width:3.4vw; aspect-ratio:1; display:flex; align-items:center; justify-content:center; margin:0 -2px -2px 0; cursor:default; }
.font ul.glyphs li:hover { background:var(--main); border-color:var(--main); color:#fff; position:relative; z-index:2; }
.font .info { font-family:'text'; font-weight:400; font-size:14px; padding-top:6px; }
.font .info li { white-space:pre; tab-size:36; }

.files { width:90%; max-width:1000px; margin:0 auto 300px; display:flex; justify-content:center; flex-wrap:wrap; column-gap:20px; row-gap:30px; font-size:11px; line-height:17px; color:rgba(0,0,0,.5); }
.files h3 { position:absolute; left:30px; font-size:13px; line-height:17px; font-weight:400; font-family:inherit; margin-top:20px; text-transform:uppercase; color:rgba(0,0,0,.7); }
.files ul { display:contents; }
.files ul li { text-align:center; display:flex; flex-direction:column; }
.files ul li div.icon { flex-grow:1; display:flex; justify-content:center; align-items:center; margin-bottom:9px; cursor:pointer; }
.files ul li div.icon:hover { background:#f3f3f3; outline:6px solid #f3f3f3; }
.files ul li div.icon:active { scale:0.9; user-select:none; }
.files ul li div.icon ::part(svg) { display:block; }

.files.assets { gap:30px; text-transform:uppercase; }
.files.assets ul li div.icon { margin-bottom:14px; }
.files.assets ul li div.icon ::part(svg) { width:64px; height:64px; }