@font-face{font-family:'Demo Sans';src:url('./fonts/noto-sans-sc-400.woff2?v=171cbb5503d3') format('woff2');font-weight:400;font-display:swap;unicode-range:U+2000-303F,U+3400-9FFF,U+FF00-FFEF}
@font-face{font-family:'Demo Sans';src:url('./fonts/noto-sans-sc-600.woff2?v=7538fd3154c8') format('woff2');font-weight:600 800;font-display:swap;unicode-range:U+2000-303F,U+3400-9FFF,U+FF00-FFEF}
:root{--sans:'Demo Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--ink:#2e414c;--muted:#73838a;--line:#d6e0e2;--accent:#367b8a;font-family:var(--sans);color:var(--ink);background:#f2f5f5;color-scheme:light}
*{box-sizing:border-box}body{margin:0;font-size:15px;line-height:1.65;-webkit-font-smoothing:antialiased}button,input,select{font:inherit;color:inherit}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{cursor:pointer;background:none}a{color:inherit;text-decoration:none}button:disabled{cursor:default;opacity:.5}img{max-width:100%;height:auto}[hidden]{display:none!important}::selection{background:#b8dcdb;color:#23424a}:focus-visible{outline:2px solid #3a92a4;outline-offset:4px}.icon{display:inline-block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.skip{position:fixed;left:15px;top:-90px;z-index:99;background:#2e4b54;color:white;padding:10px 18px}.skip:focus{top:15px}
.page-header{max-width:1420px;width:calc(100% - 80px);height:79px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:25px;border-bottom:1px solid #dce4e5}.brand{display:flex;align-items:center;gap:8px}.brand img:first-child{width:25px;height:31px}.brand img:last-child{width:83px;height:29px}.page-header nav{display:flex;align-items:center;gap:27px;font-size:12px}.page-header nav>button{border:0;padding:7px 0;font-size:11px;color:#5c727c}.back-link{color:#6c8088}.download-link{display:flex;gap:16px;align-items:center;border:1px solid #b9cace;border-radius:7px;padding:9px 14px;color:#3d5c65;background:#f9fbfa}.download-link:hover{background:#e5eeee}.page-main{max-width:1420px;width:calc(100% - 80px);margin:0 auto}.demo-heading{display:flex;justify-content:space-between;gap:35px;align-items:center;padding:35px 4px 29px}.eyebrow{font-size:9px;letter-spacing:1.8px;color:#6b858a;margin:0 0 12px}.product-name{display:flex;align-items:center;gap:14px}.product-icon{display:grid;place-items:center;width:49px;height:49px;color:#467581;background:linear-gradient(145deg,#f8fcfa,#cfdfdf);border:1px solid #b9ccce;border-radius:13px;box-shadow:0 3px 5px #59737812,inset 0 1px #fff}.product-name h1{font-size:37px;line-height:1.2;font-weight:600;letter-spacing:-1.7px;margin:0}.sample-badge{font-size:10px;letter-spacing:.3px;color:#638175;padding:4px 9px;border:1px solid #d0dfd5;border-radius:20px;background:#e9f2eb;white-space:nowrap;margin-left:3px}.heading-description{font-size:13px;color:#76878c;margin:13px 0 0}.demo-actions{display:flex;gap:12px;align-items:center}.demo-actions button{display:flex;gap:9px;align-items:center;white-space:nowrap;font-size:12px;padding:11px 15px;border-radius:7px}.simulate-button{background:#365f68!important;color:#f3f9f6;border:1px solid #365f68;box-shadow:0 3px 7px #254f5720}.simulate-button:hover{background:#437682!important}.reset-button{border:1px solid #d1dcdf;color:#6f838b;background:#f6f9f8}.reset-button:hover{background:#e8efef}
.demo-desktop{--dial-size:300px;--glass-alpha:.35;--dial-bg:rgb(243 249 252 / var(--glass-alpha));--dial-ink:#2c3d48;--dial-muted:#4f6570;--hand-hour:#304550;--hand-minute:#456371;--hand-second:#dc8f36;--panel-bg:#f0f6f7dd;--panel-ink:#2c4451;--panel-muted:#6f8490;--panel-line:#9db4c53d;--panel-hover:#ffffff66;--panel-active:#dbe9efb8;--desktop-height:620px;height:var(--desktop-height);min-height:520px;position:relative;border:1px solid #c4d3d9;border-radius:17px;overflow:hidden;isolation:isolate;background:#c7dbe0;box-shadow:0 25px 60px #35546113,0 2px 4px #35546112;touch-action:pan-y}
.desktop-wallpaper{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}.desktop-menubar{position:absolute;top:0;left:0;right:0;height:32px;display:flex;align-items:center;gap:17px;padding:0 18px;background:#f4f8fa68;backdrop-filter:blur(18px);border-bottom:1px solid #ffffff58;font-size:11px;color:#47616b;z-index:5}.menubar-app{display:flex;gap:6px;align-items:center;font-size:11px;font-weight:600}.desktop-menubar>button{padding:5px 0;font-size:11px;border:0;white-space:nowrap}.desktop-menubar>button:hover{color:#183f49}.menubar-right{margin-left:auto;display:flex;align-items:center;gap:18px;font-size:10px;color:#647c83}.menubar-right time{font-variant-numeric:tabular-nums;font-weight:600}.desktop-caption{position:absolute;left:38px;bottom:118px;color:#355a60;opacity:.23;pointer-events:none}.desktop-caption>span{display:block;font-size:23px;line-height:1.15;letter-spacing:-.5px;font-weight:600}.desktop-caption small{display:block;font-size:8px;letter-spacing:1px;margin-top:12px}
.clock-widget{position:absolute;left:0;top:0;width:var(--dial-size);height:var(--dial-size);transform:translate3d(var(--clock-x,200px),var(--clock-y,70px),0);z-index:10;max-width:calc(100% - 32px);aspect-ratio:1;touch-action:none}.clock-widget.dragging{z-index:30}.clock-surface{position:absolute;inset:0;width:100%;height:100%;padding:0;border:1px solid #fff9;border-radius:50%;background:radial-gradient(ellipse at 22% 14%,#fff8,transparent 36%),linear-gradient(145deg,#f8ffff30,#8aaab51a),var(--dial-bg);color:var(--dial-ink);backdrop-filter:blur(8px) saturate(135%);box-shadow:inset 0 2px 2px #ffffffe6,inset 0 -2px 4px #617d8c44,0 17px 35px #395c6533,0 4px 7px #3b586b20;cursor:grab;user-select:none;transition:box-shadow .3s,background .35s,color .3s;outline-offset:7px}.clock-surface:before{content:'';position:absolute;inset:4px;border:1px solid #ffffff4d;border-bottom-color:#42677e1a;border-radius:50%;pointer-events:none}.clock-surface:after{content:'';position:absolute;inset:0;border-radius:50%;background:linear-gradient(120deg,#ffffff28 5%,transparent 23%,transparent 80%,#ffffff48 100%);pointer-events:none}.clock-surface:hover{box-shadow:inset 0 2px 2px #ffffffe6,inset 0 -2px 4px #617d8c44,0 21px 42px #395c6540,0 4px 8px #3b586b20}.clock-widget.dragging .clock-surface{cursor:grabbing}.clock-svg{display:block;width:100%;height:100%;position:relative;z-index:1;overflow:visible;pointer-events:none}.clock-numbers{font-family:var(--sans);font-size:23px;font-weight:500;fill:var(--dial-ink)}.clock-numbers text:first-child{font-size:21px}#clock-ticks line{stroke:var(--dial-ink);stroke-linecap:round;opacity:.9}.clock-hand{transform-box:view-box;transform-origin:50% 50%;transition:transform 1s linear}.clock-hand path{fill:none;stroke-linecap:round}.hour-hand path{stroke:var(--hand-hour);stroke-width:6}.minute-hand path{stroke:var(--hand-minute);stroke-width:4.5}.second-hand path{stroke:var(--hand-second);stroke-width:1.8}.clock-svg.instant .clock-hand{transition:none}.clock-pin{fill:var(--hand-hour)}.clock-pin-core{fill:var(--hand-second)}.clock-information{font-family:var(--sans);fill:var(--dial-ink)}#clock-date{font-size:11.5px;font-weight:500}#clock-weather{font-size:12px;font-weight:600}.clock-today-label{font-size:10px;fill:var(--dial-muted)}.clock-total{font:700 28px ui-rounded,var(--sans);letter-spacing:-.7px;transition:fill .3s}.clock-total.is-updating{fill:#25869c}.clock-messages{font-size:10.5px;fill:var(--dial-muted)}.clock-tool-label{font-size:13px;font-weight:600}.clock-tool-mark{font-size:11px;font-weight:700;fill:#fff}.clock-extra-tools{font-size:9px;fill:var(--dial-muted)}.quota-track{fill:none;stroke:var(--dial-ink);stroke-width:2.5;opacity:.12}.quota-five,.quota-week{fill:none;stroke-width:2.5;stroke-linecap:round;transition:stroke-dasharray .4s}.quota-five{stroke:#418da7}.quota-week{stroke:#928ac5;stroke-width:2}#clock-quota-number{font-size:9px;font-weight:600;fill:var(--dial-ink)}#clock-quota-name{font-size:8px;fill:var(--dial-muted)}.clock-quota-hit{position:absolute;left:73%;top:41%;width:17%;height:17%;border:0;border-radius:50%;background:transparent;z-index:2}.clock-quota-hit:hover{background:#ffffff20;box-shadow:0 0 0 1px #ffffff5a}.clock-menu-trigger{position:absolute;right:-7px;top:-7px;z-index:4;width:31px;height:31px;border:1px solid #ffffff7a;border-radius:50%;display:grid;place-items:center;background:#edf5f5bd;box-shadow:0 4px 13px #3c596b1a;color:#56737b;backdrop-filter:blur(8px)}.clock-menu-trigger:hover{background:#fff}.clock-drag-hint{position:absolute;top:calc(100% + 13px);left:50%;transform:translateX(-50%);font-size:10px;color:#526b72;white-space:nowrap;pointer-events:none;background:#eff6f24a;padding:4px 8px;border-radius:10px;transition:opacity .25s}.clock-widget.dragging .clock-drag-hint{opacity:0}
.demo-desktop[data-theme=classic]{--dial-bg:#f8f9f7;--dial-ink:#3c4549;--dial-muted:#6d787c;--hand-hour:#35444c;--hand-minute:#43565e;--hand-second:#d15d50}.demo-desktop[data-theme=classic] .clock-surface{backdrop-filter:none;background:linear-gradient(145deg,#ffffff,#eff2ef);border:5px solid #f3f5f3;box-shadow:0 10px 24px #405b6830,inset 0 0 0 1px #b9c9c850}.demo-desktop[data-theme=midnight]{--dial-bg:#1c2d43;--dial-ink:#e1ecf3;--dial-muted:#a4bccb;--hand-hour:#4bc5d8;--hand-minute:#96dfe9;--hand-second:#e9f4f5;--panel-bg:#203448ee;--panel-ink:#e1ebf2;--panel-muted:#aec1ce;--panel-line:#a5c5dd26;--panel-hover:#cce4f311;--panel-active:#649dbf3d}.demo-desktop[data-theme=midnight] .clock-surface{background:radial-gradient(ellipse at 24% 14%,#6c9ebc30,transparent 55%),#1c2d43;backdrop-filter:none;border:3px solid #375775;box-shadow:0 17px 40px #1b345c40,inset 0 1px 5px #8eb4ca35}.demo-desktop[data-theme=sky]{--dial-bg:#b9d8ec;--dial-ink:#31536b;--dial-muted:#587b91;--hand-hour:#a77e34;--hand-minute:#b99545;--hand-second:#f9f7de}.demo-desktop[data-theme=sky] .clock-surface{backdrop-filter:none;background:radial-gradient(ellipse at 25% 74%,#ffffff91 0 8%,transparent 23%),radial-gradient(ellipse at 75% 22%,#ffffff8c 0 6%,transparent 20%),linear-gradient(150deg,#a0c9e5,#cfebef);border:2px solid #d9eef7;box-shadow:0 17px 35px #4b7fa636,inset 0 2px 2px #fff9}
.usage-popover{position:absolute;left:0;top:0;width:340px;z-index:20;border:1px solid #ffffff9c;border-radius:13px;background:var(--panel-bg);backdrop-filter:blur(20px) saturate(125%);color:var(--panel-ink);box-shadow:0 16px 40px #31566e26,inset 0 1px 0 #ffffff77;overflow:auto;scrollbar-width:thin;scrollbar-color:#88a4b04d transparent;overscroll-behavior:contain;transform:translate(var(--popover-x,525px),var(--popover-y,60px));font-variant-numeric:tabular-nums}.popover-title{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:11px 13px 8px}.popover-title>span{display:flex;gap:7px;align-items:center}.popover-title strong{font-size:12px;font-weight:600}.icon-button{border:0;border-radius:50%;height:24px;width:24px;padding:0;font-size:20px;line-height:1;color:var(--panel-muted);display:grid;place-items:center}.icon-button:hover{background:var(--panel-hover)}.weather-row{display:flex;justify-content:space-between;align-items:center;padding:0 14px 12px;gap:15px;font-size:11px;border-bottom:1px solid var(--panel-line)}.weather-sample{font-size:9px;color:var(--panel-muted)}.popover-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px}.segmented{display:flex;align-items:center;gap:2px;padding:3px;border:1px solid #bccdd64f;border-radius:7px;background:#6c8a9910;min-width:0}.segmented>button{border:0;border-radius:4px;padding:5px 10px;font-size:11px;line-height:1.4;white-space:nowrap;transition:background .2s,box-shadow .2s}.segmented>button[aria-pressed=true]{background:#fff9;box-shadow:0 1px 3px #526a7c18;color:#355466}.detail-toggles{display:flex;gap:5px}.detail-toggles button{font-size:10px;padding:5px 6px;line-height:1.3;border:1px solid var(--panel-line);border-radius:4px;color:var(--panel-muted)}.detail-toggles button[aria-pressed=true]{background:#6eabc735;border-color:#6b9eb97d;color:var(--panel-ink)}.demo-desktop[data-theme=midnight] .segmented>button[aria-pressed=true]{background:#7dacca3b;color:#e4f3f8;box-shadow:none}.usage-table-head,.usage-row{display:grid;grid-template-columns:minmax(0,1fr) 65px 39px 42px;gap:6px;align-items:center}.usage-table-head{padding:8px 13px 6px;font-size:9px;color:var(--panel-muted);border-top:1px solid var(--panel-line)}.usage-table-head>span:not(:first-child){text-align:right}.usage-list{padding-bottom:6px}.usage-group{border-bottom:1px solid var(--panel-line)}.usage-group:last-child{border-bottom:0}.usage-row{border:0;width:100%;padding:11px 13px;background:transparent;font-size:12px;text-align:left}.usage-row:hover,.usage-row[aria-expanded=true]{background:var(--panel-hover)}.usage-row>span:not(:first-child){text-align:right;white-space:nowrap;font-size:11px}.usage-row>.row-value{font-weight:600;font-size:12px!important}.usage-name{display:flex;align-items:center;gap:6px;min-width:0}.usage-name>strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11.5px;font-weight:500}.row-chevron{width:11px;height:11px;transition:transform .18s;flex-shrink:0;color:var(--panel-muted)}.usage-row[aria-expanded=true] .row-chevron{transform:rotate(90deg)}.tool-mark{width:19px;height:19px;flex-shrink:0;border-radius:5px;background:var(--tool-color);color:#fff;display:inline-grid;place-items:center;font-size:11px;line-height:1;font-weight:600}.usage-children{padding:5px 13px 9px 33px;background:#607d8c08}.usage-child{display:grid;grid-template-columns:minmax(0,1fr) 65px 39px;align-items:center;gap:6px;font-size:10px;padding:7px 0}.usage-child>div{min-width:0}.usage-child strong{display:block;font-size:10.5px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.usage-child small{display:block;font-size:9px;color:var(--panel-muted);margin-top:2px}.usage-child>span{text-align:right;white-space:nowrap}.usage-empty{padding:27px 20px;font-size:12px;line-height:1.9;text-align:center;color:var(--panel-muted)}.popover-footer{position:sticky;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--panel-bg);backdrop-filter:blur(15px);border-top:1px solid var(--panel-line);padding:6px 10px 7px 13px}.popover-footer>span{font-size:9px;color:var(--panel-muted)}.popover-footer>div{display:flex;gap:3px}.popover-footer button{border:0;padding:5px;border-radius:5px;color:var(--panel-muted);height:27px;width:27px}.popover-footer button:hover{background:var(--panel-hover);color:var(--panel-ink)}
.clock-menu{position:absolute;width:232px;z-index:45;padding:6px;border:1px solid #fff9;border-radius:9px;background:#f4f7f7eb;backdrop-filter:blur(18px);box-shadow:0 15px 32px #1e495034;font-size:12px;color:#35525d}.clock-menu .menu-title{display:block;padding:5px 8px 7px;font-size:10px;color:#829299}.clock-menu>button{display:block;width:100%;border:0;text-align:left;padding:7px 9px;border-radius:4px;font-size:12px}.clock-menu>button:hover,.clock-menu>button:focus-visible{background:#53899f;color:white;outline:none}.clock-menu hr{border:0;border-top:1px solid #c7d5d84f;margin:5px 2px}.demo-dock{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);display:flex;align-items:center;gap:5px;background:#eef6f3a6;backdrop-filter:blur(18px);border:1px solid #ffffffa8;border-bottom-color:#a6bbbf66;box-shadow:0 9px 22px #355e681c,inset 0 1px 1px #fff7;border-radius:15px;padding:6px;z-index:5}.demo-dock>button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:70px;min-height:48px;padding:5px 4px;color:#56757e;border:0;border-radius:9px;transition:background .2s,translate .2s}.demo-dock>button:hover{background:#ffffff80;translate:0 -2px}.demo-dock>button[aria-pressed=true]{background:#ffffff9c;color:#396573;box-shadow:0 2px 6px #4e747315}.demo-dock>button>span{font-size:10px;white-space:nowrap}.demo-dock .has-minimized:after{content:'';position:absolute;width:4px;height:4px;border-radius:50%;background:#547f83;bottom:1px;left:calc(50% - 2px)}.demo-status{position:absolute;top:45px;left:50%;transform:translate(-50%,-5px);z-index:48;background:#f8fff5e8;border:1px solid #a9c4b0;border-radius:7px;box-shadow:0 5px 20px #29523d16;color:#47694e;font-size:12px;padding:9px 16px;pointer-events:none;opacity:0;transition:opacity .2s,transform .2s;max-width:calc(100% - 30px);text-align:center}.demo-status.visible{opacity:1;transform:translate(-50%,0)}.demo-footer{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:16px 3px 20px;font-size:11px;color:#7a8d93}.demo-footer p{margin:0}.demo-footer>span{color:#8a999e;font-size:10px}
.app-window{padding:0;width:min(820px,calc(100vw - 42px));max-width:calc(100vw - 30px);max-height:90svh;border:1px solid #d2dde1;border-radius:13px;background:#f6f8f9;color:#334c59;box-shadow:0 35px 110px #1d3c5159;overflow:hidden}.app-window::backdrop{background:#1b3b4533;backdrop-filter:blur(4px)}.app-window.maximized{width:min(1130px,calc(100vw - 30px));max-height:95svh}.window-titlebar{height:49px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 19px;background:#edf2f4;border-bottom:1px solid #d8e2e6}.window-titlebar h2{font-size:13px;font-weight:600;margin:0;letter-spacing:.1px;position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap}.window-buttons{display:flex;gap:8px;align-items:center}.window-buttons>button{border:1px solid #00000013;width:13px;height:13px;border-radius:50%;padding:0;display:grid;place-items:center;font:11px/1 Arial,sans-serif;color:#5a4c45}.window-buttons>button>span{opacity:0;transition:opacity .15s}.window-buttons:hover>button>span,.window-buttons>button:focus-visible>span{opacity:1}.window-close{background:#ed8277}.window-minimize{background:#eac775}.window-maximize{background:#8cc7a0}.window-sample{font-size:10px;color:#879ba3}.window-view{padding:23px 27px 25px;overflow:auto;max-height:calc(90svh - 49px);overscroll-behavior:contain}.app-window.maximized .window-view{max-height:calc(95svh - 49px)}.window-toolbar{display:flex;gap:15px;align-items:center;margin-bottom:23px;flex-wrap:wrap}.window-toolbar .segmented{background:#e7eef1b8;border-color:#cddadf}.window-toolbar .segmented button{font-size:12px;padding:6px 13px}.window-toolbar .segmented button[aria-pressed=true]{background:white;box-shadow:0 1px 4px #425b6d18}.small-toggle{margin-left:auto;border:1px solid #d0dce1;border-radius:5px;font-size:12px;padding:7px 11px;background:#f5f8f9;color:#7a9099}.small-toggle[aria-pressed=true]{background:#e0eef4;color:#386d85;border-color:#abc9d9}.history-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:17px;margin-bottom:24px}.history-metrics article{border:1px solid #dce5e9;border-radius:9px;background:#fff9;padding:17px 19px}.history-metrics span{font-size:11px;color:#8699a0;display:block}.history-metrics strong{font-size:28px;line-height:1.2;letter-spacing:-.8px;font-weight:600;display:block;margin-top:9px;color:#3c6377;font-variant-numeric:tabular-nums}.chart-caption{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:11px;color:#6b8693;margin-bottom:16px}.chart-caption>span:last-child{color:#9aaab1;font-size:10px}.history-chart-scroll{overflow:auto;scrollbar-width:thin;scrollbar-color:#bfd0d7 transparent}.history-chart{height:200px;position:relative;padding:0 9px;isolation:isolate}.chart-gridlines{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;z-index:-2;pointer-events:none}.chart-gridlines i{height:1px;border-top:1px dashed #d5e1e7}.history-bars{height:100%;display:flex;gap:8px;align-items:stretch;position:relative;z-index:2}.history-bar{position:relative;flex:1;min-width:18px;border:0;background:transparent;padding:0;display:flex;align-items:flex-end;justify-content:center}.history-bar .bar-fill{height:var(--value-height);width:100%;max-width:48px;background:linear-gradient(0deg,#a9c9d9,#679fba);border-radius:4px 4px 1px 1px;transition:background .2s,height .3s;min-height:3px}.history-bar.is-selected .bar-fill{background:linear-gradient(0deg,#74b4c3,#3a8195);box-shadow:0 0 0 1px #4f92a13d}.history-bar:hover .bar-fill{background:linear-gradient(0deg,#96c8d6,#47889e)}.history-bar:focus-visible{outline-offset:3px;outline-width:1px}.history-line{position:absolute;inset:0;pointer-events:none}#history-line{position:absolute;left:9px;right:9px;top:0;width:calc(100% - 18px);height:100%;pointer-events:none;z-index:1;display:none;overflow:visible}#history-line path{fill:none;stroke:#5c96ad;stroke-width:2.2;vector-effect:non-scaling-stroke}.history-chart.is-line #history-line{display:block}.history-chart.is-line .bar-fill{background:transparent!important;box-shadow:none}.history-chart.is-line .history-bar:after{content:'';position:absolute;left:50%;bottom:calc(var(--value-height) - 4px);transform:translateX(-50%);width:7px;height:7px;background:#7bafc1;border:2px solid #f5f9fa;border-radius:50%;box-shadow:0 0 0 1px #6396aa}.history-chart.is-line .history-bar.is-selected:after{background:#287e96;box-shadow:0 0 0 3px #82bbce4d}.chart-axis{display:flex;justify-content:space-between;font-size:10px;color:#95a5ac;margin:12px 0 24px;padding-inline:8px}.day-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:18px;border-top:1px solid #e0e7e9}.day-heading h3{font-size:13px;margin:0;font-weight:600}.day-heading select{font-size:12px;padding:6px 10px;border:1px solid #d1dee3;border-radius:5px;background:#fff;color:#68838f}.history-breakdown{margin:13px 0 0}.history-tool{display:grid;grid-template-columns:140px minmax(0,1fr) 75px;gap:17px;align-items:center;padding:9px 0;font-size:12px}.history-tool>span:first-child{display:flex;gap:8px;align-items:center}.history-tool>span:last-child{text-align:right;font-variant-numeric:tabular-nums;color:#5d7886}.history-tool-track{height:5px;border-radius:4px;background:#e4ecef;overflow:hidden}.history-tool-track i{display:block;height:100%;width:var(--share);background:var(--tool-color);opacity:.7;border-radius:4px}.window-note{font-size:11px;color:#8c9da4;line-height:1.8;margin:22px 0 0}
.quota-view{padding-top:25px}.quota-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px}.quota-toolbar .segmented button{font-size:12px;padding:7px 16px}.quota-connected{display:flex;gap:6px;align-items:center;font-size:10px;color:#7e9a88}.quota-connected i{height:5px;width:5px;background:#8fb49b;border-radius:50%}.quota-account{display:flex;gap:13px;align-items:center;margin:28px 0 25px}.quota-account>div:first-child{width:42px;height:42px;border:1px solid #b8ced7;border-radius:10px;display:grid;place-items:center;color:#5a91a6;background:#e6f0f4;font-size:24px}.quota-account h3{font-size:18px;font-weight:600;margin:0 0 3px}.quota-account p{font-size:12px;color:#8a9da5;margin:0}.quota-cards{display:grid;grid-template-columns:1fr 1fr;gap:18px}.quota-card{background:#fff9;border:1px solid #dce6ea;border-radius:10px;padding:22px 20px 20px;text-align:center}.quota-card h4{font-size:13px;font-weight:500;margin:0;color:#718b98}.quota-ring{width:150px;height:150px;margin:16px auto 10px;position:relative}.quota-ring svg{width:100%;height:100%;transform:rotate(-90deg)}.quota-ring circle{fill:none;stroke-width:6}.quota-ring .track{stroke:#e6eef2}.quota-ring .fill{stroke:#6ca3ba;stroke-linecap:round;transition:stroke-dasharray .4s}.quota-card:nth-child(2) .fill{stroke:#a69bc8}.quota-ring>div{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.quota-ring strong{font-size:36px;line-height:1.2;letter-spacing:-1.2px;font-weight:500;color:#547c91}.quota-ring small{font-size:10px;color:#9aaeb8;margin-top:4px}.quota-reset{font-size:11px;color:#8199a4}.quota-reset strong{font-weight:500;color:#647f8c;margin-left:5px}.quota-bottom{display:flex;align-items:center;gap:9px;margin:24px 0 0;padding:16px;border:1px solid #dce7e7;border-radius:7px;background:#edf5f3;font-size:11px;color:#7c938d;line-height:1.8}.quota-bottom .icon{color:#71978d}
.appearance-view,.settings-view{padding:25px 31px 30px}.view-description{font-size:13px;line-height:1.85;color:#81949c;margin:0 0 23px}.theme-options{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin-bottom:30px}.theme-option{padding:14px 10px 13px;border:1px solid #e0e7ea;border-radius:9px;background:#fcfdfd;text-align:center;position:relative;transition:background .2s,border-color .2s}.theme-option:hover{background:#e9f2f5}.theme-option[aria-pressed=true]{border-color:#80afbf;background:#eaf4f7;box-shadow:0 0 0 1px #b6d5de33}.theme-preview{display:block;width:95px;height:95px;max-width:100%;margin:auto;filter:drop-shadow(0 3px 6px #31536818)}.theme-option strong{display:block;font-size:12px;font-weight:500;margin-top:12px}.theme-option .theme-check{position:absolute;right:9px;bottom:12px;color:#3e93a2;width:13px;height:13px;display:none}.theme-option[aria-pressed=true] .theme-check{display:block}.setting-row{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:22px 0;border-top:1px solid #e0e7e9}.setting-row strong{font-size:13px;font-weight:500;display:block}.setting-row p{font-size:11px;color:#90a0a6;margin:5px 0 0}.size-options button{font-size:12px;min-width:42px}.opacity-setting>div:last-child{display:flex;align-items:center;gap:15px;min-width:220px}.opacity-setting input{width:180px;accent-color:#609bb0;cursor:pointer}.opacity-setting output{font-size:11px;color:#7d949e;min-width:32px}.settings-link{border:0;border-bottom:1px solid #b9ced7;font-size:12px;padding:8px 0;color:#688e9f}.settings-view>h3{font-size:15px;font-weight:600;margin:0 0 8px}.tool-settings{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:25px}.tool-option{display:flex;align-items:center;gap:11px;border:1px solid #dce5e9;border-radius:8px;padding:15px 16px;font-size:13px;background:#fff9;cursor:pointer}.tool-option input{margin-left:auto;accent-color:#5e97a9;width:16px;height:16px}.zone-setting select{background:#fff;border:1px solid #cddce2;border-radius:5px;padding:8px 12px;font-size:12px;min-width:185px}.page-footer{max-width:1420px;width:calc(100% - 80px);margin:10px auto 0;padding:21px 3px 30px;border-top:1px solid #dde5e6;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:10px;color:#8a9ba2}.page-footer p{margin:0}.page-footer a{color:#6c858e}
@media(max-width:1000px){.page-header,.page-main,.page-footer{width:calc(100% - 48px)}.demo-heading{gap:25px}.product-name h1{font-size:32px}.product-icon{width:44px;height:44px}.sample-badge{font-size:9px;padding:3px 7px}.demo-actions button{font-size:11px;padding:10px 12px}.desktop-caption{left:27px}.desktop-caption>span{font-size:20px}.theme-options{gap:12px}.theme-preview{width:82px;height:82px}}
@media(max-width:760px){.page-header{height:68px}.page-header,.page-main,.page-footer{width:calc(100% - 32px)}.page-header nav{gap:16px}.back-link{display:none}.download-link{font-size:11px;padding:8px 10px;gap:9px}.brand img:first-child{width:22px;height:28px}.brand img:last-child{width:74px;height:26px}.demo-heading{align-items:flex-start;flex-direction:column;gap:18px;padding:26px 0 22px}.product-name{gap:11px}.product-name h1{font-size:31px}.product-icon{width:42px;height:42px;border-radius:11px}.heading-description{font-size:12px;margin-top:11px}.demo-actions{width:100%;gap:10px}.demo-actions button{font-size:12px;justify-content:center}.simulate-button{flex:1}.reset-button{flex:0 0 auto}.eyebrow{font-size:8px;letter-spacing:1.3px}.demo-desktop{border-radius:12px}.desktop-menubar{padding-inline:12px;gap:13px}.desktop-menubar>button{font-size:10px}.menubar-right>span{display:none}.menubar-right{gap:0;font-size:9px}.menubar-app{font-size:10px;gap:4px}.desktop-caption{display:none}.clock-drag-hint{font-size:9px;top:calc(100% + 10px)}.demo-dock{bottom:17px;padding:5px;gap:3px;border-radius:13px}.demo-dock>button{width:63px;min-height:46px;gap:3px}.demo-dock>button>span{font-size:9px}.demo-footer{flex-direction:column;align-items:flex-start;gap:5px;padding-block:13px 19px;font-size:10px}.demo-footer>span{font-size:9px}.usage-popover{border-radius:11px}.demo-status{font-size:11px;padding:8px 12px;top:42px}.app-window{width:calc(100vw - 24px);max-width:calc(100vw - 18px);max-height:92svh;border-radius:10px}.window-titlebar{padding-inline:14px;height:45px}.window-titlebar h2{font-size:12px}.window-sample{font-size:9px}.window-view{padding:19px 18px 23px;max-height:calc(92svh - 45px)}.window-toolbar{gap:10px;margin-bottom:19px}.window-toolbar .segmented button{font-size:11px;padding:6px 10px}.small-toggle{font-size:11px;margin-left:0;padding:7px 9px}.history-metrics{gap:8px;margin-bottom:22px}.history-metrics article{padding:13px 10px;border-radius:7px}.history-metrics span{font-size:9px}.history-metrics strong{font-size:22px;margin-top:7px}.chart-caption{font-size:10px;gap:10px}.chart-caption>span:last-child{font-size:9px}.history-chart{height:175px}.history-bars{gap:6px}.chart-axis{font-size:9px}.history-tool{grid-template-columns:106px minmax(0,1fr) 64px;gap:12px;font-size:11px}.history-tool .tool-mark{width:17px;height:17px;font-size:10px}.day-heading h3{font-size:12px}.day-heading select{font-size:11px}.window-note{font-size:10px}.quota-toolbar{gap:10px}.quota-toolbar .segmented button{font-size:11px;padding:6px 12px}.quota-connected{font-size:9px}.quota-account{margin:23px 0}.quota-account h3{font-size:17px}.quota-account p{font-size:11px}.quota-cards{gap:11px}.quota-card{padding:18px 10px 16px;border-radius:8px}.quota-card h4{font-size:12px}.quota-ring{width:118px;height:118px;margin-block:14px 9px;max-width:100%}.quota-ring strong{font-size:31px}.quota-ring small{font-size:9px}.quota-reset{font-size:10px;line-height:1.8}.quota-reset strong{display:block;margin-left:0}.quota-bottom{font-size:10px;padding:13px;align-items:start}.theme-options{grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:20px}.theme-preview{width:92px;height:92px}.theme-option{padding:13px 10px}.setting-row{gap:15px;flex-wrap:wrap;padding-block:18px}.setting-row strong{font-size:12px}.setting-row p{font-size:10px}.opacity-setting>div:last-child{min-width:0;width:100%}.opacity-setting input{flex:1;width:auto}.size-options{margin-left:auto}.tool-settings{gap:9px}.tool-option{padding:12px 11px;font-size:11px;gap:8px}.tool-option .tool-mark{width:18px;height:18px}.tool-option input{width:15px;height:15px}.zone-setting select{width:100%;min-width:0}.settings-view>h3{font-size:14px}.view-description{font-size:12px}.page-footer{font-size:9px;gap:12px;flex-wrap:wrap}.page-footer p{order:3;width:100%;font-size:10px}.page-footer a{margin-left:auto}}
@media(max-width:390px){.desktop-menubar{gap:10px}.desktop-menubar>button{font-size:9px}.menubar-app .icon{display:none}.history-metrics strong{font-size:20px}.quota-ring{width:105px;height:105px}.quota-ring strong{font-size:28px}.quota-connected{display:none}.product-name .sample-badge{font-size:8px}.product-name h1{font-size:29px}.product-icon{width:39px;height:39px}.demo-dock>button{width:59px}.usage-table-head,.usage-row{grid-template-columns:minmax(0,1fr) 59px 35px 37px;gap:5px}.usage-row{padding-inline:11px}.usage-table-head{padding-inline:11px}.usage-name{gap:5px}.usage-name>strong{font-size:11px}}
@supports not (backdrop-filter:blur(1px)){.clock-surface{background:#e3edf2}.usage-popover{background:#edf4f7}.clock-menu{background:#f6f9f9}.demo-dock{background:#eaf2ef}.desktop-menubar{background:#e6eff0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.demo-dock>button:hover{translate:none}}
#clock-date{font-size:14px}#clock-weather{font-size:14px}.clock-tool-label{font-size:14.5px}.clock-messages{font-size:12px}.clock-today-label{font-size:11px}#clock-quota-number{font-size:10.5px}
@media(max-height:800px) and (min-width:761px){.page-header{height:70px}.demo-heading{padding-top:24px;padding-bottom:22px}}
@media(max-width:760px){.window-buttons{gap:8px}.window-buttons>button{position:relative;width:16px;height:16px}.window-buttons>button:before{content:'';position:absolute;inset:-4px;border-radius:50%}.window-buttons>button>span{opacity:.7}}