.handheld-chart { width: 100%; max-width: 600px; margin: 1.5rem auto; }
.handheld-chart [data-handheld-panel][hidden] { display: none !important; }
.handheld-power-control[hidden] { display: none !important; }
.handheld-power-control { margin: 8px 5px 0; font-size: .9rem; }
.handheld-power-control > div { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 5px; }
.handheld-power-control button { min-height: 36px; padding: 5px 10px; border: 1px solid #aaa; border-radius: 3px; background: #fff; color: #333; font: inherit; cursor: pointer; }
.handheld-power-control button[aria-pressed="true"] { border-color: #555; background: #cce8ff; color: #000; box-shadow: inset 0 -2px #555; }
.handheld-power-control button:hover { border-color: #000; }
.handheld-power-control button:focus-visible { outline: 2px solid #005caa; outline-offset: 2px; }
.handheld-power-control [data-handheld-status] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.handheld-chart-note { font-size: .9rem; color: #474747; margin: .5rem 0 .8rem; }
.handheld-chart .chart .xbarContainer > .xruler.hide-text { position: absolute; inset: 0; }
.handheld-chart .chart .xbar {
    position: relative;
    width: 100% !important;
    align-items: center;
    background: linear-gradient(to right, var(--handheld-color) var(--handheld-width), transparent var(--handheld-width));
}
.handheld-chart .chart .chart-bar-int { --handheld-color: rgb(114, 169, 252); }
.handheld-chart .chart .chart-bar-amd { --handheld-color: #fd7270; }
.handheld-chart .chart .xbar a { flex: 1; min-width: 0; white-space: normal; overflow-wrap: anywhere; line-height: 1.35; padding: .4rem 0; }
.handheld-chart .chart .xvalue { flex: none; white-space: nowrap; }
