/* Only compact controls and the annotation inside the existing 24-hour chart. */
.il-chart-controls{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap;min-width:0;font-family:var(--font,'Instrument Sans',sans-serif)}
.ip .il-activate{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;max-width:100%;padding:8px 13px;border:1px solid #ee671f;border-radius:999px;background:#ee671f;color:#fff;font:inherit;font-size:11px;font-weight:650;line-height:1.25;white-space:nowrap;cursor:pointer;flex:none}
.ip .il-activate[aria-pressed=true]{background:#fff8f2;color:#bd460a}
.il-switch{width:26px;height:16px;flex:none;border-radius:20px;background:#ffffff50;position:relative;box-shadow:inset 0 0 0 1px #ffffff50}
.il-switch:after{content:'';width:10px;height:10px;border-radius:50%;position:absolute;left:3px;top:3px;background:#fff;transition:transform .25s}
.il-activate[aria-pressed=true] .il-switch{background:#ee671f}.il-activate[aria-pressed=true] .il-switch:after{transform:translateX(10px)}
.ip .il-play{min-height:38px;padding:6px 0;background:transparent;border:0;color:#5f655e;font:inherit;font-size:11px;line-height:1.3;cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.ip .il-play:disabled{cursor:default;color:#8d938e;text-decoration:none}
.il-activate:focus-visible,.il-play:focus-visible{outline:2px solid #ee671f;outline-offset:4px}
.il-chart-action{font-family:var(--font,'Instrument Sans',sans-serif);pointer-events:none}
.il-action-leader{fill:none;stroke:#ee671f88;stroke-width:1;stroke-dasharray:3 4}
.il-action-before{fill:#bfc5c1;stroke:none}.il-action-after{fill:#ee671f;stroke:none}
.il-action-bubble>rect{fill:#fff;stroke:#ee671f;stroke-width:1}
.il-action-bubble>svg{color:#ee671f}.il-action-name{fill:#1c1f1c;font-size:14px;font-weight:600;letter-spacing:-.01em}.il-action-subtitle{fill:#5f655e;font-size:11px;font-weight:400}
@media(max-width:760px){.il-chart-controls{justify-content:flex-start;gap:10px}.ip .il-activate{min-height:38px;padding:8px 12px;font-size:11px}.ip .il-play{min-height:38px}}
@media(prefers-reduced-motion:reduce){.il-chart-controls *,.il-chart-controls *:after{transition:none!important;animation:none!important}}
.il-action-leader{stroke-dasharray:none;stroke:#ee671f55}
@media(max-width:760px){.il-action-name,.il-action-subtitle{font-size:26px;transform:none}}
.il-chart-controls{max-width:230px;min-height:56px;column-gap:10px;row-gap:4px}
.il-window-key{display:flex;align-items:center;justify-content:flex-end;gap:5px;flex-basis:100%;white-space:nowrap;font-size:9px;line-height:12px;color:#5f655e}
.il-window-key i{display:inline-block;width:10px;height:5px;border-radius:2px;flex:none}.il-key-before{background:#bfc5c1}.il-key-after{background:#ee671f}
@media(max-width:760px){.il-chart-controls{max-width:none;width:100%}.il-window-key{justify-content:flex-start;font-size:10px;line-height:14px}}
/* 15.09: the visible day is an ongoing demonstration, with a single off switch. */
.ip .il-activate{font-size:12px;min-height:40px;padding:9px 15px;background:#f5f5f7;border-color:#dcdde0;color:#5f655e}
.ip .il-activate[aria-pressed=true]{color:#1c1f1c;background:#fff;border-color:#ee671f}
.il-activate[aria-pressed=false] .il-switch{background:#a9afb0}
.ip-day-tabs button{position:relative;overflow:hidden}
.ip-day[data-running=true] .ip-day-tabs button[aria-pressed=true]:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:3px;background:#ee671f;transform:scaleX(var(--day-progress,0));transform-origin:left}
.ip-day[data-running=true] .ip-day-tabs button[aria-pressed=true]{box-shadow:inset 0 -3px #ee671f20}
.ip-day [data-chart-cursor]{transition:none}
.ip-day [data-chart-point]{filter:drop-shadow(0 0 3px #fff)}
.ip-day [data-chart-focus]{transition:x .5s cubic-bezier(.16,1,.3,1),width .5s cubic-bezier(.16,1,.3,1)}
.il-action-after{filter:drop-shadow(0 0 4px #ee671f65)}
.ip-day[data-running=true] .il-action-bubble{animation:il-bubble-in .4s ease-out both}
@keyframes il-bubble-in{from{opacity:0}to{opacity:1}}
.ip [data-demo-card].is-demo-highlight{box-shadow:0 0 0 1px #ee671f,0 8px 30px #ee671f12;transition:box-shadow .2s,border-color .2s}
@media(prefers-reduced-motion:reduce){.ip-day *, .ip-day *:after{animation:none!important;transition:none!important}}
