:where(.frame){--accent-50: #fff3ec;--accent-100: #ffe1d1;--accent-200: #ffc0a3;--accent-300: #ff9a70;--accent-400: #fb7440;--accent-500: #f2571b;--accent-600: #d8430c;--accent-700: #ad3309;--accent-contrast: #ffffff;--n-0: #ffffff;--n-25: #fcfbfa;--n-50: #f7f6f4;--n-100: #f1efec;--n-200: #e5e2dd;--n-300: #d2cdc6;--n-400: #a8a29a;--n-500: #7a746c;--n-600: #57524b;--n-700: #3b3731;--n-800: #262320;--n-900: #17150f;--n-950: #0d0c09;--ok-bg: #e7f6ec;--ok-fg: #1c7a42;--warn-bg: #fdf0da;--warn-fg: #9a6708;--bad-bg: #fdeaea;--bad-fg: #b4322d;--info-bg: #e8effd;--info-fg: #2a56c6;--bg: var(--n-50);--surface: var(--n-0);--surface-2: var(--n-100);--surface-3: var(--n-200);--ink: var(--n-900);--ink-2: var(--n-600);--ink-3: var(--n-400);--line: var(--n-200);--line-soft: var(--n-100);--invert-bg: var(--n-900);--invert-ink: var(--n-0);--sh-1: 0 1px 2px rgba(23, 21, 15, .05);--sh-2: 0 2px 4px rgba(23, 21, 15, .04), 0 6px 14px rgba(23, 21, 15, .05);--sh-3: 0 4px 10px rgba(23, 21, 15, .05), 0 16px 34px rgba(23, 21, 15, .07);--sh-4: 0 8px 20px rgba(23, 21, 15, .07), 0 30px 60px rgba(23, 21, 15, .1);--sh-accent: 0 8px 24px rgba(242, 87, 27, .28);--ring: 0 0 0 3px rgba(242, 87, 27, .18);--r-xs: 6px;--r-sm: 10px;--r-md: 14px;--r-lg: 20px;--r-xl: 28px;--r-full: 999px;--e-out: cubic-bezier(.16, 1, .3, 1);--e-spring: cubic-bezier(.34, 1.56, .64, 1);--e-smooth: cubic-bezier(.4, 0, .2, 1);--t-fast: .14s;--t-base: .24s;--t-slow: .52s;--t-draw: .9s;--font-ui: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--font-display: "Inter Tight", "Inter", system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace}:where(.frame[data-theme=dark]){--bg: #0e0d0b;--surface: #191714;--surface-2: #211e1a;--surface-3: #2c2823;--ink: #f6f4f1;--ink-2: #a8a29a;--ink-3: #6f6960;--line: #2e2a25;--line-soft: #241f1b;--invert-bg: #f6f4f1;--invert-ink: #17150f;--ok-bg: #12301f;--ok-fg: #5ed48c;--warn-bg: #33270e;--warn-fg: #e9b75c;--bad-bg: #351917;--bad-fg: #ef857f;--info-bg: #14203f;--info-fg: #7ea2f5;--sh-1: 0 1px 2px rgba(0, 0, 0, .5);--sh-2: 0 2px 4px rgba(0, 0, 0, .4), 0 6px 14px rgba(0, 0, 0, .45);--sh-3: 0 4px 10px rgba(0, 0, 0, .45), 0 16px 34px rgba(0, 0, 0, .5);--sh-4: 0 8px 20px rgba(0, 0, 0, .5), 0 30px 60px rgba(0, 0, 0, .6);--ring: 0 0 0 3px rgba(242, 87, 27, .3)}@media(prefers-reduced-motion:reduce){:where(.frame){--t-fast: 1ms;--t-base: 1ms;--t-slow: 1ms;--t-draw: 1ms}:where(.frame),:where(.frame) *,:where(.frame) *:before,:where(.frame) *:after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important;scroll-behavior:auto!important}}:where(.frame),:where(.frame) *,:where(.frame) *:before,:where(.frame) *:after{box-sizing:border-box}:where(.frame){color:var(--ink);font-family:var(--font-ui);font-size:14px;line-height:1.5;letter-spacing:-.006em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-feature-settings:"cv11" 1,"ss01" 1;transition:background var(--t-base) var(--e-smooth),color var(--t-base) var(--e-smooth)}:where(.frame) button,:where(.frame) input,:where(.frame) select,:where(.frame) textarea{font:inherit;color:inherit;letter-spacing:inherit}:where(.frame) button{cursor:pointer}:where(.frame) :focus-visible{outline:none;box-shadow:var(--ring);border-radius:var(--r-sm)}.ui-num{font-family:var(--font-display);font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1;letter-spacing:-.03em}.ui-card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-2);transition:transform var(--t-base) var(--e-out),box-shadow var(--t-base) var(--e-out),border-color var(--t-base) var(--e-smooth),background var(--t-base) var(--e-smooth)}.ui-card[data-hoverable=true]:hover{transform:translateY(-3px);box-shadow:var(--sh-3);border-color:var(--n-300)}:where(.frame[data-theme=dark]) .ui-card[data-hoverable=true]:hover{border-color:var(--surface-3)}.ui-label{font-size:11.5px;font-weight:500;letter-spacing:.02em;color:var(--ink-2)}.ui-eyebrow{font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}.ui-pill{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:var(--r-full);font-size:11px;font-weight:600;letter-spacing:-.01em;white-space:nowrap}.ui-pill[data-tone=up]{background:var(--ok-bg);color:var(--ok-fg)}.ui-pill[data-tone=down]{background:var(--bad-bg);color:var(--bad-fg)}.ui-pill[data-tone=flat]{background:var(--surface-2);color:var(--ink-2)}.ui-pill[data-tone=accent]{background:var(--accent-500);color:var(--accent-contrast)}.ui-pill[data-tone=ink]{background:var(--invert-bg);color:var(--invert-ink)}.ui-rise{opacity:0;transform:translateY(14px);transition:opacity var(--t-slow) var(--e-out),transform var(--t-slow) var(--e-out);transition-delay:var(--delay, 0ms)}.ui-rise[data-in=true]{opacity:1;transform:none}html,body{margin:0;background:#0e0f11}.demo{box-sizing:border-box;max-width:1600px;margin:0 auto;padding:clamp(16px,4vw,48px)}.frame{position:relative;width:100%;aspect-ratio:1600 / 900;overflow:hidden}.frame__canvas{position:absolute;top:0;left:0;transform-origin:top left;will-change:transform}.d11{--accent-50: #eafbf0;--accent-100: #cdf4dc;--accent-200: #a3e9bf;--accent-300: #7fdca4;--accent-400: #9fd94f;--accent-500: #b6e04a;--accent-600: #8dbb2c;--accent-700: #66881f;--accent-contrast: #10210a;--sh-accent: 0 8px 24px rgba(182, 224, 74, .22);--violet: #8b6ff0;--bg: #08080a;--surface: #131317;--surface-2: #1b1b20;--surface-3: #26262d;--line: #24242b;--ink: #f4f4f6;--ink-2: #9a9aa6;--ink-3: #66666f;position:absolute;top:26px;right:34px;bottom:26px;left:34px;padding:20px 24px 24px;border-radius:28px;background:#0b0b0e;box-shadow:0 30px 80px #0000008c;font-family:var(--font-ui);color:var(--ink);overflow:hidden}.d11__ico{display:grid;place-items:center;width:38px;height:38px;border:0;border-radius:50%;background:var(--surface-2);color:var(--ink-2);transition:background var(--t-base) var(--e-smooth),color var(--t-base) var(--e-smooth),transform var(--t-fast) var(--e-out)}.d11__ico svg{width:16px;height:16px}.d11__ico:hover{background:var(--surface-3);color:var(--ink);transform:translateY(-2px)}.d11__ico--sm{width:26px;height:26px;background:transparent}.d11__ico--sm svg{width:14px;height:14px}.d11__chip{display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 11px;border:0;border-radius:var(--r-full);background:var(--surface-2);font-size:11px;font-weight:500;color:var(--ink-2)}.d11__chip svg{width:12px;height:12px}.d11__top{display:flex;align-items:center;gap:20px}.d11__brand{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-display);font-size:17px;font-weight:600;letter-spacing:-.028em}.d11__brand i{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:var(--ink);font-style:normal;font-size:15px;font-weight:700;color:var(--bg)}.d11__nav{position:relative;display:inline-flex;gap:2px;padding:4px;border-radius:var(--r-full);background:var(--surface-2);margin:0 auto}.d11__navMark{position:absolute;top:4px;left:0;height:calc(100% - 8px);border-radius:var(--r-full);background:var(--surface-3);transition:transform var(--t-base) var(--e-spring),width var(--t-base) var(--e-spring)}.d11__nav button{position:relative;z-index:1;padding:8px 16px;border:0;border-radius:var(--r-full);background:transparent;font-size:12.5px;font-weight:500;color:var(--ink-2);transition:color var(--t-base) var(--e-smooth)}.d11__nav button[data-active=true]{color:var(--ink)}.d11__nav button[data-active=true]:before{content:"";position:absolute;left:12px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--accent-500)}.d11__nav button[data-active=true]{padding-left:26px}.d11__topRight{display:flex;align-items:center;gap:9px}.d11__me{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:linear-gradient(150deg,#e9a0c8,#a4498a);font-family:var(--font-display);font-size:12px;font-weight:700;color:#fff}.d11__title{margin:22px 0 0;font-family:var(--font-display);font-size:34px;font-weight:600;letter-spacing:-.038em}.d11__card{position:absolute;display:flex;flex-direction:column;overflow:hidden;padding:16px 18px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);transition:border-color var(--t-base) var(--e-smooth),transform var(--t-base) var(--e-out)}.d11__card:hover{border-color:var(--surface-3);transform:translateY(-2px)}.d11__card header{display:flex;align-items:center;justify-content:space-between;gap:10px}.d11__card h3{margin:0;font-family:var(--font-display);font-size:14.5px;font-weight:600;letter-spacing:-.022em}.d11__card h3 sup{font-size:.6em;color:var(--ink-3);margin-left:3px}.d11__tools{display:flex;align-items:center;gap:8px}.d11__bal{position:absolute;top:148px;left:24px;width:636px;height:218px;padding:20px 22px;border-radius:var(--r-lg);background:linear-gradient(140deg,#7fdca4,#a8e06a 46%,#cbe94e);color:#10210a;overflow:hidden;display:flex;flex-direction:column}.d11__bal .ui-label{color:#10210aa8}.d11__balFig{margin:8px 0 4px;font-size:40px;font-weight:700;letter-spacing:-.042em}.d11__balFig em{font-style:normal;font-size:.5em;vertical-align:.72em;margin-left:4px}.d11__bal>i{font-style:normal;font-size:11px;color:#10210a99}.d11__balBtns{display:flex;gap:8px;margin-top:auto}.d11__balBtns button{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 22px;border:0;border-radius:var(--r-full);font-size:12.5px;font-weight:600;transition:transform var(--t-fast) var(--e-out)}.d11__balBtns button[data-v=ink]{background:#10210a;color:#fff}.d11__balBtns button[data-v=light]{background:#fff;color:#10210a}.d11__balBtns button:hover{transform:translateY(-2px)}.d11__balBtns i{font-style:normal}.d11__balSheen{position:absolute;top:-40%;right:-10%;width:60%;height:180%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);transform:rotate(14deg)}.d11__inc{top:148px;left:690px;width:330px;height:104px}.d11__exp{top:262px;left:690px;width:330px;height:104px}.d11__inc p,.d11__exp p{display:flex;align-items:center;gap:9px;margin:7px 0 4px;font-size:24px;font-weight:600;letter-spacing:-.032em}.d11__inc em,.d11__exp em{font-style:normal;font-size:.55em;vertical-align:.62em;margin-left:3px;color:var(--ink-3)}.d11__inc .ui-pill,.d11__exp .ui-pill{margin-left:auto}.d11__inc>i,.d11__exp>i{font-style:normal;font-size:10.5px;color:var(--ink-3)}.d11__cards{top:148px;right:24px;width:460px;height:360px}.d11__add{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 6px 0 14px;border:0;border-radius:var(--r-full);background:#fff;color:var(--bg);font-size:11.5px;font-weight:600}.d11__add svg{width:18px;height:18px;padding:3px;border-radius:50%;background:var(--bg);color:#fff;box-sizing:content-box}.d11__stack{position:relative;height:150px;margin-top:16px}.d11__stackC{position:absolute;left:0;right:0;display:flex;align-items:flex-start;height:76px;padding:12px 16px;border-radius:var(--r-md);transition:transform var(--t-base) var(--e-out)}.d11__stackC i{font-style:normal;font-size:11px;color:#fffc}.d11__stackC[data-i="0"]{top:0;background:linear-gradient(120deg,#f0a15a,#c2622a);transform:scale(.88)}.d11__stackC[data-i="1"]{top:34px;background:linear-gradient(120deg,#7fdca4,#3f9e68);transform:scale(.94)}.d11__stackC[data-i="2"]{top:70px;background:linear-gradient(120deg,#a48bf5,#6b4fd8);box-shadow:0 -10px 24px #0006}.d11__cards:hover .d11__stackC[data-i="0"]{transform:scale(.88) translateY(-14px)}.d11__cards:hover .d11__stackC[data-i="1"]{transform:scale(.94) translateY(-7px)}.d11__cardActive{margin-top:16px;padding:16px 18px;border-radius:var(--r-md);background:linear-gradient(140deg,#8b6ff0,#6b4fd8 60%,#5b3fc4);color:#fff}.d11__cardActive p{margin:0;font-size:17px;letter-spacing:.06em}.d11__cardActive footer{display:flex;justify-content:space-between;margin-top:12px;font-size:11.5px;color:#ffffffc2}.d11__rev{top:386px;left:24px;width:496px;height:272px}.d11-rev{flex:1;display:flex;flex-direction:column;margin-top:34px;min-height:0}.d11-rev__plot{flex:1;display:flex;align-items:flex-end;gap:9px}.d11-rev__col{position:relative;flex:1;display:flex;align-items:flex-end;height:100%;padding:0;border:0;background:transparent}.d11-rev__bar{position:relative;width:100%;height:0;border-radius:var(--r-sm);background:linear-gradient(180deg,#8b6ff080,#8b6ff024);transition:height var(--t-slow) var(--e-out),background var(--t-base) var(--e-smooth);transition-delay:calc(var(--i) * 65ms),0ms}.d11-rev__bar[data-in=true]{height:var(--h)}.d11-rev__col[data-active=true] .d11-rev__bar{background:linear-gradient(180deg,#c3a8ff,#8b6ff0)}.d11-rev__bar u{position:absolute;top:-5px;left:50%;width:11px;height:11px;margin-left:-5.5px;border:2px solid var(--surface);border-radius:50%;background:#fff}.d11-rev__tip{position:absolute;left:50%;bottom:calc(var(--h) + 18px);display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:var(--r-sm);background:var(--surface-3);font-family:var(--font-display);font-size:11px;font-weight:600;white-space:nowrap;opacity:0;transform:translate(-50%,6px);transition:opacity var(--t-fast) var(--e-smooth),transform var(--t-base) var(--e-spring);pointer-events:none}.d11-rev__tip[data-show=true]{opacity:1;transform:translate(-50%)}.d11-rev__tip i{display:grid;place-items:center}.d11-rev__tip i svg{width:11px;height:11px}.d11-rev__tip em{font-style:normal;font-size:9.5px;color:var(--accent-400)}.d11-rev__axis{display:flex;gap:9px;margin-top:10px}.d11-rev__axis span{flex:1;text-align:center;font-family:var(--font-display);font-size:10px;font-weight:600;color:var(--ink-2)}.d11-rev__axis i{display:block;font-style:normal;font-weight:400;color:var(--ink-3)}.d11__split{top:386px;left:550px;width:470px;height:272px}.d11__splitBody{display:flex;align-items:center;gap:10px;flex:1}.d11-donut{position:relative;display:grid;place-items:center;flex:0 0 auto}.d11-donut svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.d11-donut__s{fill:none;transition:stroke-dashoffset var(--t-draw) var(--e-out);transition-delay:calc(var(--i) * 70ms)}.d11-donut span{text-align:center}.d11-donut i{display:block;font-style:normal;font-size:10.5px;color:var(--ink-3)}.d11-donut b{font-size:24px;font-weight:600;letter-spacing:-.032em}.d11-donut em{font-style:normal;font-size:.55em;vertical-align:.62em;margin-left:3px;color:var(--ink-3)}.d11__legend{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr;gap:7px;font-size:10.5px;color:var(--ink-2)}.d11__legend li{display:flex;align-items:center;gap:7px}.d11__legend i{width:8px;height:8px;border-radius:2px}.d11__legend b{margin-left:auto;color:var(--ink)}.d11__subs{top:528px;right:24px;width:460px;bottom:24px}.d11__manage{display:inline-flex;align-items:center;gap:5px;border:0;background:transparent;font-size:11px;color:var(--ink-2)}.d11__manage svg{width:12px;height:12px}.d11__manage:hover{color:var(--ink)}.d11__subIcons{display:flex;gap:7px;margin:10px 0 8px}.d11__subIcons span{width:28px;height:28px;border-radius:50%;transition:transform var(--t-base) var(--e-spring);transition-delay:calc(var(--i) * 30ms)}.d11__subs:hover .d11__subIcons span{transform:translateY(-3px)}.d11__subs ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:2px;flex:1;min-height:0}.d11__subs li{display:flex;align-items:center;gap:10px;padding:7px 6px;border-radius:var(--r-sm);transition:background var(--t-fast) var(--e-smooth)}.d11__subs li:hover{background:var(--surface-2)}.d11__subM{width:28px;height:28px;border-radius:50%}.d11__subM[data-i="0"]{background:#3c3c46}.d11__subM[data-i="1"]{background:#5865f2}.d11__subM[data-i="2"]{background:#229ed9}.d11__subM[data-i="3"]{background:#e05a8a}.d11__subM[data-i="4"]{background:#2fbf6d}.d11__subT b{display:block;font-size:12px;font-weight:600}.d11__subT i{font-style:normal;font-size:10px;color:var(--ink-3)}.d11__subs li>span:last-of-type{margin-left:auto;font-size:12px;font-weight:600}.d11__recent{top:678px;left:24px;width:996px;bottom:24px;padding:14px 18px}.d11__recentRow{display:flex;align-items:center;gap:14px;margin-top:10px;font-size:11px}.d11__recentRow .d11__subT i{white-space:nowrap}.d11__recentSt{flex:0 0 86px;justify-content:center}.d11__recentCard{flex:0 0 56px;text-align:right;color:var(--ink-3)}.d11__recentAmt{flex:0 0 74px;text-align:right;font-weight:600}.d11__recentRow .d11__subT{flex:1;min-width:0}.d11__recentRow>span:last-of-type{font-weight:600}.d11__dim{color:var(--ink-3)}
