/* Usage-only styles from prototype 5fb0d16, including final overrides. */
main[data-page=usage] .chart-panel .panel-title{flex-wrap:wrap;gap:14px}main[data-page=usage] .chart-panel .segmented button{padding:8px 12px;min-height:40px}@media(max-width:760px){main[data-page=usage] .chart-panel .segmented{width:100%}main[data-page=usage] .chart-panel .segmented button{flex:1;padding:8px 6px}main[data-page=usage] .chart text{font-size:20px}main[data-page=usage] .chart .point-label{font-size:20px}}
.usage-average-legend{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin:16px 0 8px;color:var(--dim);font-size:12px}.usage-average-legend>span{display:flex;align-items:center;gap:8px}.usage-average-legend i{width:26px;border-top:2px dashed #747889}.usage-average-legend b{color:var(--blue)}.usage-average-legend small{font-size:11px}main[data-page=usage] .chart .usage-extreme{fill:var(--ink);font-weight:700;paint-order:stroke;stroke:var(--bg);stroke-width:5px;stroke-linejoin:round}
main[data-page=usage] .chart .usage-average-line{stroke:var(--blue);stroke-width:2}
main[data-page=usage] .usage-average-legend i{border-top-color:var(--blue)}
main[data-page=usage] .chart circle{fill:#858580;stroke:none}
.usage-start{max-width:1000px;margin:auto;padding:8px 0 40px}.usage-start-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px}.usage-start-toolbar>span{font:11px var(--mono);color:var(--dim)}.usage-start-hero{position:relative;text-align:center;padding:60px 0 28px}.usage-start-hero>span{font:11px var(--mono);letter-spacing:.08em}.usage-start .usage-start-hero h1{font-size:clamp(36px,4.8vw,64px);line-height:1.15;letter-spacing:-.06em;margin:20px 0}.usage-start-hero h1>span{color:var(--blue)}.usage-start-hero p{font-size:14px;color:var(--dim);line-height:1.7}.usage-start-mascot{position:absolute;right:0;bottom:22px}.usage-start-mascot .mascot-button{width:135px;height:135px}.usage-start-form label{display:block;font-size:12px;margin-bottom:10px}.usage-start-form>div{display:flex;gap:14px;align-items:center;border:2px solid var(--ink);padding:8px 10px 8px 20px;background:var(--paper);min-height:72px}.usage-start-form input{flex:1;min-width:0;font:inherit;font-size:17px;border:0;background:transparent;outline:none}.usage-start-form>div:focus-within{outline:2px solid var(--blue);outline-offset:3px}.usage-start-form button{background:var(--ink);color:var(--paper);padding:15px 24px;white-space:nowrap}.usage-start-chips{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:18px 0 26px;font-size:12px}.usage-start-chips>span{color:var(--dim)}.usage-start-chips button{padding:10px 12px;background:var(--sticker)}.usage-start-guide,.usage-start-source{display:flex;justify-content:space-between;gap:14px;font-size:12px;color:var(--dim);padding:24px 0;border-top:1px solid var(--line)}.usage-start-source{font-size:11px;margin-top:24px;flex-wrap:wrap}.usage-match-heading{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--ink);padding-top:22px}.usage-match-heading h2{font-size:22px}.usage-match-heading>span{font-size:12px}.usage-match-help{font-size:13px;color:var(--dim);margin:12px 0 20px}.usage-match{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;text-align:left;padding:22px;border:1px solid var(--line);background:var(--paper);margin-bottom:10px}.usage-match:hover{border-color:var(--blue)}.usage-match strong{font-size:19px}.usage-match span,.usage-match small{display:block;color:var(--dim);margin-top:8px;font-size:12px;line-height:1.6}.usage-match>b{font-size:12px;color:var(--blue);white-space:nowrap}.usage-start-empty{text-align:center;padding:35px 10px}.usage-start-empty h3{font-size:20px}.usage-start-empty p{font-size:13px;line-height:1.8;margin-top:12px;color:var(--dim)}.usage-back{margin-bottom:20px}.usage-start button:focus-visible{outline:2px solid var(--blue);outline-offset:3px}@media(max-width:760px){.usage-start-toolbar>span{font-size:9px}.usage-start-toolbar .button{font-size:11px;padding:10px}.usage-start-hero{padding-top:110px}.usage-start-mascot{top:4px;bottom:auto;right:calc(50% - 50px)}.usage-start-mascot .mascot-button{width:100px;height:100px}.usage-start-form input{font-size:16px}.usage-start-form>div{padding-left:12px;gap:8px}.usage-start-form button{padding:14px}.usage-start-guide{flex-direction:column}.usage-match{padding:16px;gap:12px}.usage-match strong{font-size:16px}.usage-match>b{font-size:11px}}
.usage-db-header{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:14px 0 32px}.usage-db-header>div>span{font:11px var(--mono);color:var(--blue)}main[data-page=usage] .usage-db-header h1{font-size:clamp(30px,4vw,52px);letter-spacing:-.06em;margin:14px 0}.usage-db-header h1 span{color:var(--blue)}.usage-db-header p{font-size:14px;color:var(--dim);line-height:1.7}.usage-db-header>.button{flex-shrink:0}.usage-db-search{display:flex;align-items:center;gap:16px;padding:14px 20px;background:var(--paper);border:1px solid var(--ink)}.usage-db-search label{font-size:27px}.usage-db-search input{flex:1;min-width:0;font:inherit;font-size:16px;border:0;background:transparent;outline:none}.usage-db-search:focus-within{outline:2px solid var(--blue);outline-offset:3px}.usage-db-search>button{width:36px;min-height:36px;font-size:22px}.usage-db-search>span{font-size:12px;color:var(--dim);white-space:nowrap}.usage-db-caption{display:flex;justify-content:space-between;gap:12px;margin:14px 0 20px;font-size:11px;color:var(--dim)}.usage-db-split{display:grid;grid-template-columns:minmax(0,100fr) minmax(0,0fr);gap:0;align-items:start;transition:grid-template-columns .75s cubic-bezier(.22,1.15,.32,1),gap .75s}.usage-db.is-open .usage-db-split{grid-template-columns:minmax(0,30fr) minmax(0,70fr);gap:24px}.usage-list-pane{min-width:0}.usage-table-scroll{max-height:68dvh;min-height:280px;overflow:auto;border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}.usage-table{width:100%;border-collapse:collapse;font-size:13px;text-align:left;table-layout:fixed}.usage-table th{position:sticky;top:0;z-index:1;background:var(--bg);padding:15px 12px;color:var(--dim);font-size:11px;font-weight:400;border-bottom:1px solid var(--line)}.usage-table th:nth-child(2){width:32%}.usage-table .usage-col-number{width:42px}.usage-table .usage-col-average{width:90px;text-align:right}.usage-table td{padding:16px 12px;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.usage-table tr{cursor:pointer}.usage-table tbody tr:hover{background:var(--surface)}.usage-table tr[aria-selected=true]{background:var(--sticker);box-shadow:inset 3px 0 var(--blue)}.usage-table td button{display:block;width:100%;padding:0;text-align:left;line-height:1.6}.usage-table td b{font-size:14px;font-weight:600}.usage-table td small{display:block;font-size:11px;color:var(--dim);margin-top:5px}.usage-col-average small{display:inline!important;margin-left:4px}.usage-db.is-open .usage-col-extra,.usage-db.is-open .usage-col-number{display:none}.usage-db.is-open .usage-table th:nth-child(2){width:auto}.usage-db.is-open .usage-col-average{width:72px}.usage-db.is-open .usage-table td{padding:15px 10px}.usage-list-pagination{display:flex;align-items:center;gap:10px;justify-content:flex-end;padding:14px 0;font-size:11px;color:var(--dim)}.usage-list-pagination>span:first-child{margin-right:auto}.usage-list-pagination button{min-height:36px}#usage-db-empty{text-align:center;padding:45px 18px}#usage-db-empty h2{font-size:18px}#usage-db-empty p{font-size:12px;line-height:1.7;margin-top:12px;color:var(--dim)}.usage-drawer{min-width:0;max-height:76dvh;overflow:auto;opacity:0;transition:opacity .3s;background:var(--paper)}.usage-db.is-open .usage-drawer{opacity:1;border:1px solid var(--line)}.usage-drawer .usage-detail{padding:24px;min-width:420px}.usage-drawer-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;font:10px var(--mono);color:var(--dim)}.usage-drawer-close{width:44px;height:44px;font-size:30px;border:1px solid var(--line);color:var(--ink);background:var(--paper)}.usage-drawer .detail-heading h2{font-size:26px}.usage-drawer .stat-card>b{font-size:34px}.usage-drawer .stat-grid{gap:12px}.usage-drawer .stat-card:first-child{transform:none}.usage-drawer .stat-card{padding:18px 10px!important}.usage-drawer .insight-note{margin-bottom:0}.usage-db button:focus-visible{outline:2px solid var(--blue);outline-offset:3px}.usage-db .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:1000px){.usage-db.is-open .usage-db-split{grid-template-columns:minmax(0,32fr) minmax(0,68fr);gap:14px}.usage-drawer .usage-detail{min-width:0;padding:18px}.usage-drawer .stat-card>b{font-size:27px}.usage-db.is-open .usage-col-average{display:none}.usage-table th:nth-child(2){width:35%}}
@media(max-width:760px){.usage-db-header{align-items:flex-start;flex-direction:column;gap:12px;margin-bottom:24px}.usage-db-header>.button{width:100%}.usage-db-search{gap:10px;padding:12px}.usage-db-search>span{font-size:10px}.usage-db-caption{flex-direction:column;gap:6px}.usage-col-extra,.usage-col-number{display:none}.usage-table th:nth-child(2){width:auto}.usage-db .usage-db-split,.usage-db.is-open .usage-db-split{display:flex;flex-direction:column;gap:0}.usage-list-pane{width:100%}.usage-db.is-open .usage-table-scroll{max-height:220px;min-height:120px}.usage-db.is-open .usage-col-average{display:table-cell}.usage-drawer{width:100%;max-height:0;transition:max-height .7s cubic-bezier(.22,1,.3,1),opacity .3s}.usage-db.is-open .usage-drawer{max-height:85dvh;margin-top:16px}.usage-drawer .usage-detail{padding:16px}.usage-drawer .detail-heading h2{font-size:22px}.usage-drawer .stat-card>b{font-size:24px}.usage-table-scroll{min-height:200px}.usage-list-pagination{padding:10px 0}}
@media(prefers-reduced-motion:reduce){.usage-db-split,.usage-drawer{transition:none}}
.usage-db:not(.is-open) .usage-db-split{transition:grid-template-columns .24s ease-out,gap .24s ease-out}
@media(max-width:760px){.usage-db:not(.is-open) .usage-drawer{transition:max-height .24s ease-out,opacity .15s linear}}
@media(prefers-reduced-motion:reduce){.usage-db:not(.is-open) .usage-db-split,.usage-db:not(.is-open) .usage-drawer{transition:none}}
.usage-filter-bar{display:flex;align-items:center;justify-content:space-between;gap:16px}.usage-db .usage-db-search{width:360px;max-width:100%;min-height:42px;padding:5px 10px;gap:8px;border-color:var(--line)}.usage-db .usage-db-search label{font-size:20px;line-height:1}.usage-db .usage-db-search input{font-size:13px}.usage-db .usage-db-search>button{width:28px;min-height:28px;font-size:18px}.usage-filter-bar>#usage-db-count{font-size:12px;color:var(--dim);white-space:nowrap}@media(max-width:760px){.usage-filter-bar{gap:10px;flex-wrap:wrap}.usage-db .usage-db-search{width:min(360px,100%)}.usage-db .usage-db-search input{font-size:16px}.usage-filter-bar>#usage-db-count{font-size:11px}}
main[data-page=usage] .usage-db-header{margin:0 0 16px;gap:12px;flex-direction:row;align-items:center}main[data-page=usage] .usage-db-header h1{font-size:30px;margin:0;line-height:1.2}.usage-db .usage-db-header>.button{min-height:40px;padding:9px 14px;font-size:12px;width:auto}.usage-db .usage-db-caption{margin:9px 0 12px;font-size:10px}.usage-db .usage-drawer .usage-detail{padding:18px}.usage-db .usage-drawer .detail-heading{align-items:flex-start;margin-bottom:16px;gap:12px}.usage-db .usage-drawer .detail-heading h2{font-size:23px;margin:0;line-height:1.35}.usage-db .usage-drawer .detail-heading p{font-size:12px;margin-top:6px;line-height:1.5}.usage-db .usage-drawer-close{flex-shrink:0;width:36px;height:36px;font-size:25px}.usage-db .usage-drawer .stat-grid{margin-bottom:18px;gap:10px}.usage-db .usage-drawer .stat-card{padding:12px 10px!important}.usage-db .usage-drawer .stat-card>b{font-size:28px;margin:9px 0 6px}.usage-db .usage-drawer .stat-card>span,.usage-db .usage-drawer .stat-card p{font-size:11px}.usage-db .usage-drawer .chart-panel .panel-title{margin-bottom:6px}.usage-db .usage-drawer .chart-panel h2{font-size:17px}.usage-db .usage-drawer .chart-unit{margin:4px 0;font-size:10px}.usage-db .usage-drawer .usage-average-legend{margin:6px 0 0}.usage-db .usage-table th{padding:10px}.usage-db .usage-table td{padding-top:12px;padding-bottom:12px}@media(max-width:760px){main[data-page=usage] .usage-db-header h1{font-size:24px}.usage-db .usage-db-header>.button{font-size:10px;padding:8px}.usage-db .usage-drawer .usage-detail{padding:14px}.usage-db .usage-drawer .stat-card>b{font-size:24px}.usage-db .usage-drawer .chart{margin:12px 0 5px}}
.usage-header-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-width:0}.usage-header-actions>.button{flex-shrink:0;min-height:42px;padding:9px 14px;font-size:12px}.usage-db .usage-header-actions .usage-db-search{width:320px}.usage-db .usage-db-caption>span:last-child{margin-left:auto}@media(max-width:900px){main[data-page=usage] .usage-db-header{flex-wrap:wrap}.usage-header-actions{flex:1;min-width:300px}.usage-db .usage-header-actions .usage-db-search{width:100%;flex:1}}@media(max-width:480px){.usage-header-actions{width:100%;min-width:0;gap:8px}.usage-header-actions>.button{font-size:10px;padding:8px;white-space:normal;max-width:110px}.usage-db .usage-db-caption{flex-wrap:wrap}.usage-db .usage-db-caption>span:last-child{margin-left:0}}

.usage-detail-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.usage-db .usage-detail-actions .mascot-button{width:64px;height:64px;margin:-10px 0;flex-shrink:0}
.usage-db .detail-heading>div:first-child{min-width:0}
@media(max-width:480px){.usage-detail-actions{gap:5px}.usage-db .usage-detail-actions .mascot-button{width:48px;height:48px;margin:-2px 0}}

#usgEmpty{text-align:center;padding:45px 18px;font-size:13px}#usgEmpty h2{font-size:18px}#usgEmpty p{margin:12px 0}.usage-data-message{padding:40px 16px;line-height:1.8;color:var(--dim)}.usage-data-message button{display:block;margin-top:16px}.usage-db .usage-drawer{overscroll-behavior:auto}.usage-db .detail-heading h2{overflow-wrap:anywhere}

.usage-db .usage-table tbody tr[aria-selected=true],.usage-db .usage-table tbody tr[aria-selected=true]:hover{background:var(--sticker);box-shadow:inset 3px 0 var(--blue)}
.usage-db .usage-db-search{min-width:0;box-sizing:border-box}
@media(max-width:760px){.usage-db .usage-header-actions{width:100%;flex-basis:100%;min-width:0}.usage-db .usage-db-caption>span:last-child{margin-left:0}}
