@font-face { font-family: "Inter"; src: url("../vendor/inter/inter-latin-wght-normal.woff2") format("woff2-variations"); font-weight: 100 900; font-display: block; }

/* editor */
.sd-stage { position: relative; width: 100%; overflow: hidden; border-radius: 8px; box-shadow: 0 0 0 1px rgb(255 255 255 / .1); }
.sd-stage > .sd { position: absolute; left: 0; top: 0; transform-origin: 0 0; }
.shape-btn { height: 30px; border-radius: 4px; font-size: 12px; font-weight: 500; color: rgb(255 255 255 / .8); background: rgb(107 114 128 / .15); transition: all .125s; }
.shape-btn:hover { background: rgb(107 114 128 / .22); }
.shape-btn.on { background: rgb(82 111 255 / .25); color: #fff; box-shadow: inset 0 0 0 1px rgb(82 111 255 / .6); }
.hint { font-size: 11px; line-height: 14px; color: rgb(119 122 140); }
.list-row { display: grid; gap: 6px; }
.list-row.ch { grid-template-columns: 1fr 72px; }
.list-row.pr { grid-template-columns: 1fr 1fr 72px; }
.list-row .field { width: 100%; min-width: 0; }
.list-row .wide { grid-column: 1 / -1; }

/* dashboard, laid out at 1440x900 CSS pixels */
.sd { width: 1440px; height: 900px; overflow: hidden; background: #0a0a0a; color: #303030; font: 450 13px/20px Inter, sans-serif; font-feature-settings: "calt" 0; letter-spacing: normal; text-align: left; color-scheme: light; }
.sd * { box-sizing: border-box; }
.sd svg.ic { display: block; flex-shrink: 0; }
.sd i[class^="ri-"] { font-style: normal; line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
.sd .abs { position: absolute; }
.sd .tight { letter-spacing: -0.00833em; }

.sd-top { position: absolute; inset: 0 0 auto 0; height: 56px; }
.sd-brand { position: absolute; left: 20px; top: 16px; height: 24px; }
.sd-lockup { display: block; }
.sd-search { position: absolute; left: 400px; top: 10px; width: 640px; height: 36px; border-radius: 12px; background: #282828; box-shadow: inset 0 1px 0 #474747, inset 0 -1px 0 #303030; color: #dcdcdc; font-weight: 400; display: flex; align-items: center; padding: 0 9px 0 9px; }
.sd-search .ic { margin-right: 3px; }
.sd-keys { margin-left: auto; display: flex; gap: 3px; }
.sd-keys span { height: 20px; min-width: 22px; padding: 0 5px; border-radius: 6px; background: #2f2f2f; color: #aaa; font-size: 10px; font-weight: 600; line-height: 20px; text-align: center; }
.sd-right { position: absolute; right: 8px; top: 10px; height: 36px; display: flex; align-items: center; }
.sd-ticon { width: 28px; height: 28px; color: #dcdcdc; display: flex; align-items: center; justify-content: center; }
.sd-acct { margin-left: 12px; height: 36px; padding: 4px 8px 4px 4px; display: flex; align-items: center; gap: 4px; }
.sd-av { width: 28px; height: 28px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 450; color: rgb(0 0 0 / .75); }
.sd-acct p { margin: 0; font: 550 12px/16px Inter, sans-serif; color: #dcdcdc; white-space: nowrap; max-width: 220px; overflow: hidden; text-overflow: ellipsis; }

.sd-frame { position: absolute; left: 0; top: 56px; width: 1440px; height: 844px; background: #f1f1f1; border-radius: 12px 12px 0 0; }
.sd-view { position: absolute; left: 240px; top: 56px; width: 1200px; height: 844px; overflow: hidden; border-radius: 0 12px 0 0; }
.sd-scroll { position: absolute; left: 1430px; top: 62px; width: 4px; height: 207px; border-radius: 4px; background: #b5b5b5; }

.sd-nav { position: absolute; left: 0; top: 56px; width: 240px; height: 844px; background: #ebebeb; border-radius: 12px 0 0 0; }
.sd-item { position: absolute; left: 10px; width: 218px; height: 28px; border-radius: 8px; padding: 0 4px 0 8px; display: flex; align-items: center; font-weight: 550; color: #303030; white-space: nowrap; }
.sd-item .ic { color: #4a4a4a; margin-right: 8px; }
.sd-item.on { background: #fafafa; font-weight: 600; }
.sd-item.sub { font-weight: 450; color: #616161; padding-left: 36px; }
.sd-item .add { display: flex; color: #616161; margin-right: 8px; }
.sd-item .add .ic { margin: 0; color: inherit; }
.sd-sec { position: absolute; left: 20px; font: 550 12px/16px Inter, sans-serif; color: #303030; display: flex; align-items: center; gap: 2px; }
.sd-sec .ic { color: #4a4a4a; }

.sd-main { position: absolute; left: 16px; top: 0; width: 1152px; height: 844px; }
.sd-card { position: absolute; background: #fff; border-radius: 12px; box-shadow: 0 0 0 1px rgb(0 0 0 / .07), rgba(0,0,0,.03) 0 5px 5px -2.5px, rgba(0,0,0,.02) 0 3px 3px -1.5px, rgba(0,0,0,.02) 0 2px 2px -1px, rgba(0,0,0,.03) 0 1px 1px -.5px, rgba(0,0,0,.04) 0 .5px .5px 0, inset 0 -1px 0 rgb(0 0 0 / .1); }
.sd-h1 { position: absolute; left: 3px; top: 18px; height: 24px; display: flex; align-items: center; white-space: nowrap; }
.sd-h1 i { width: 16px; height: 16px; font-size: 16px; color: #303030; margin-right: 3px; }
.sd-h1 b { font: 600 18px/24px Inter, sans-serif; letter-spacing: -0.00833em; color: #303030; }
.sd-h1 span { margin-left: 9px; color: #616161; }
.sd-btn { position: absolute; top: 16px; height: 28px; border-radius: 8px; display: flex; align-items: center; justify-content: center; white-space: nowrap; font-weight: 550; }
.sd-btn.sec { background: #e3e3e3; color: #303030; }
.sd-btn.sec i { font-size: 16px; color: #4a4a4a; }
.sd-btn.pri { color: #fff; font-weight: 650; background: linear-gradient(180deg, rgba(48,48,48,0) 63.53%, rgba(255,255,255,.15) 100%), #303030; box-shadow: inset 0 -1px 0 1px rgba(0,0,0,.8), inset 0 0 0 1px #303030, inset 0 .5px 0 1.5px rgba(255,255,255,.25); }

.sd-banner { left: 0; top: 56px; width: 1152px; height: 52px; display: flex; align-items: center; padding: 0 12px; }
.sd-banner .ic { width: 28px; height: 28px; border-radius: 8px; background: #91d0ff; color: #002133; font-size: 17px; margin-right: 8px; display: flex; align-items: center; justify-content: center; }
.sd-banner p { margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 1060px; }
.sd-banner u { text-underline-offset: 2px; }
.sd-banner .x { margin-left: auto; width: 20px; height: 20px; font-size: 18px; color: #8a8a8a; margin-right: 1px; }

.sd-pill { position: absolute; height: 28px; border-radius: 8px; background: #fff; display: flex; align-items: center; padding: 0 8px 0 6px; font-size: 12px; font-weight: 550; white-space: nowrap; box-shadow: inset 0 -1px 0 #b5b5b5, inset 0 0 0 1px rgba(0,0,0,.1), inset 0 .5px 0 1.5px #fff; }
.sd-pill i { width: 20px; height: 20px; font-size: 16px; color: #4a4a4a; }
.sd-pill i:first-child { margin-right: 2px; }
.sd-pill i.chev { font-size: 18px; margin-left: 1px; margin-right: -1px; }

.sd-title { display: inline-block; font: 600 13px/16px Inter, sans-serif; border-bottom: 2px dotted #ccc; white-space: nowrap; }
.sd-metric { width: 276px; height: 74px; padding: 16px; }
.sd-metric .val { position: absolute; left: 16px; top: 39px; display: flex; align-items: center; height: 20px; white-space: nowrap; }
.sd-metric .val b { font-weight: 600; letter-spacing: -0.00833em; }
.sd-metric svg.spark { position: absolute; right: 16px; top: 39px; }
.sd-chg { position: relative; top: 1px; display: inline-flex; align-items: center; height: 14px; margin-left: 6px; font: 650 11px/14px Inter, sans-serif; color: #078d4e; white-space: nowrap; }
.sd-chg.neutral { color: #8a8a8a; }
.sd-chg svg { width: 10px; height: 14px; margin-right: -0.5px; flex-shrink: 0; }
.sd-chg.none { top: -1px; color: #a0a0a0; justify-content: center; }

.sd-chart { padding: 16px; }
.sd-chart .big { position: absolute; left: 16px; top: 44px; display: flex; align-items: center; height: 20px; white-space: nowrap; }
.sd-chart .big b { font: 600 20px/20px Inter, sans-serif; letter-spacing: -0.00833em; }
.sd-chart .big .sd-chg { margin-left: 6px; }
.sd-chart svg.main { position: absolute; left: 16px; top: 80px; overflow: visible; }
.sd-legend { position: absolute; left: 16px; height: 20px; padding-right: 7px; display: flex; justify-content: center; gap: 20px; font-size: 11px; color: #70707b; white-space: nowrap; }
.sd-legend span { display: flex; align-items: center; }
.sd-legend.clip span { max-width: calc(50% - 10px); min-width: 0; }
.sd-legend em { font-style: normal; overflow: hidden; text-overflow: ellipsis; }
.sd-legend span::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--c); margin-right: 8px; }

.sd-bd .rows { position: absolute; left: 16px; top: 44px; width: 341px; }
.sd-row { height: 41px; border-radius: 8px; display: flex; align-items: center; padding: 0 10px 0 6px; white-space: nowrap; }
.sd-row:nth-child(even) { background: #f7f7f7; }
.sd-row a { color: #005bd3; text-decoration: none; }
.sd-row b { margin-left: auto; font-weight: 700; }
.sd-row .sd-chg { margin-left: 10px; min-width: 34px; }

.sd-donut-chg { position: absolute; transform: translateX(-50%); }
.sd-donut-chg .sd-chg { top: 0; margin: 0; }
.sd-plist { position: absolute; left: 16px; top: 44px; height: 194px; overflow: hidden; }
.sd-prow { position: absolute; left: 0; right: 0; height: 42px; }
.sd-prow p { margin: 1px 0 0; font: 450 11px/16px Inter, sans-serif; color: #70707b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 12px; }
.sd-bar { position: absolute; left: 0; height: 10px; border-radius: 0 2px 2px 0; }
.sd-pv { position: absolute; height: 16px; display: flex; align-items: center; font: 450 11px/16px Inter, sans-serif; color: #70707b; white-space: nowrap; }
.sd-pv .sd-chg { top: 0; margin-left: 9px; }
.sd-pscroll { position: absolute; right: 0; top: 0; width: 8px; height: 100%; background: #fcfcfc; }
.sd-pscroll b { position: absolute; left: 1.6px; top: 9.6px; width: 4.8px; border-radius: 2.4px; background: #8b8b8b; }
.sd-pscroll i { position: absolute; left: 1.6px; width: 0; height: 0; border-style: solid; border-color: transparent; border-bottom-color: #8b8b8b; }
.sd-pscroll i + b + i { border-bottom-color: transparent; border-top-color: #8b8b8b; }
.sd-empty { position: absolute; left: 0; right: 0; text-align: center; color: #616161; }