/* A single bottom ruler replaces visible range and rate settings. */
#time-popover{display:none!important}
#time-dock.ruler-dock{position:fixed;left:24px;right:24px;bottom:12px;width:auto;transform:none;padding:8px 14px 5px;border:1px solid var(--surface-line);border-radius:14px;background:var(--surface);color:var(--surface-ink);box-shadow:var(--surface-shadow);z-index:20;isolation:isolate;box-sizing:border-box;font-family:Inter,sans-serif}
#time-dock[hidden],#time-dock .ruler-legacy{display:none!important}
.ruler-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:34px;gap:12px}
.ruler-header>#play{justify-self:start;display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid var(--button-border);border-radius:8px;background:var(--button-bg);color:var(--surface-ink);box-shadow:var(--button-shadow)}
.ruler-header>#play:hover{background:var(--button-hover)}.ruler-header>#play .lucide{width:17px;height:17px;display:block;margin:0}
#time-dock .ruler-header #year-form{display:flex;align-items:center;justify-content:center;gap:4px;min-width:0;margin:0}
#time-dock .ruler-header #year-input{width:90px;height:32px;margin:0;padding:0 4px;text-align:center;font:500 22px/32px Inter,sans-serif;letter-spacing:-.4px;font-variant-numeric:tabular-nums;background:transparent;color:var(--surface-ink);border:0;border-radius:6px;box-shadow:none;outline:none}
#time-dock .ruler-header #year-input:focus{background:var(--surface-hover)}
#time-dock .ruler-header #era-button{width:30px;height:30px;padding:0;border:0;background:transparent;color:var(--surface-muted);font:400 11px/1 Inter,sans-serif}
#time-dock .ruler-header #era-button[hidden]{display:none}
#time-dock .ruler-header .map-controls{position:static!important;inset:auto!important;justify-self:end;display:flex;align-items:center;gap:2px;width:auto;max-width:none;transform:none;margin:0;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;z-index:auto}
#time-dock .ruler-header .map-controls button{width:29px;height:29px;border:0;background:transparent;border-radius:7px;display:grid;place-items:center;padding:0;color:var(--surface-ink);box-shadow:none}
#time-dock .ruler-header .map-controls button:hover{background:var(--surface-hover)}#time-dock .ruler-header .map-controls .lucide{width:15px;height:15px}
.time-ruler{height:48px;position:relative;overflow:hidden;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;outline-offset:-2px;border-radius:6px}
.time-ruler.is-scrubbing{cursor:grabbing}.time-ruler canvas{display:block;width:100%;height:48px;pointer-events:none}.ruler-playhead{position:absolute;left:50%;top:2px;width:2px;height:19px;background:var(--surface-ink);transform:translateX(-50%);border-radius:1px;pointer-events:none}.ruler-playhead:before{content:'';position:absolute;top:0;left:-3px;width:8px;height:4px;border-radius:0 0 3px 3px;background:var(--surface-ink)}
body.time-dock-visible #feed-panel,body.time-dock-visible #detail-panel,body.time-dock-visible #ask-panel{bottom:var(--time-dock-clearance,120px)!important;max-height:calc(100dvh - var(--panel-top,92px) - var(--time-dock-clearance,120px))!important;min-height:120px}
body.ruler-visible #layers-panel{max-height:calc(100dvh - var(--panel-top,92px) - var(--ruler-height,96px) - var(--stats-clearance,110px))!important}
@media(max-width:700px){#time-dock.ruler-dock{padding:7px 10px 2px;border-radius:12px}.ruler-header{gap:4px}.ruler-header>#play{width:30px;height:30px}#time-dock .ruler-header #year-input{font-size:20px;width:77px}#time-dock .ruler-header .map-controls button{width:27px;height:27px}.time-ruler,.time-ruler canvas{height:45px}body.time-dock-visible #feed-panel,body.time-dock-visible #detail-panel,body.time-dock-visible #ask-panel{max-height:calc(100dvh - 124px - var(--time-dock-clearance,120px))!important}}
@media(prefers-reduced-motion:reduce){#time-dock *{scroll-behavior:auto!important;transition:none!important}}
#time-dock.ruler-dock .ruler-header>#play svg{stroke:currentColor!important;fill:none!important;stroke-width:1.75;opacity:1}

/* One shallow instrument: time in the middle, quiet controls at either edge. */
#time-dock.ruler-dock{display:grid;grid-template-columns:96px minmax(0,1fr) 96px;align-items:center;column-gap:12px;padding:4px 10px 5px;border-radius:12px}
#time-dock.ruler-dock .ruler-header{display:contents}
#time-dock.ruler-dock .ruler-header>#play{grid-column:1;grid-row:1;justify-self:start;width:30px;height:30px;background:transparent;border:0;box-shadow:none}
#time-dock.ruler-dock .ruler-header>#play:hover{background:var(--surface-hover)}
#time-dock.ruler-dock .ruler-header #year-form{position:absolute;left:50%;top:3px;transform:translateX(-50%);z-index:2;gap:1px;padding:0 8px;background:var(--surface);border-radius:6px}
#time-dock.ruler-dock .ruler-header #year-input{width:76px;height:24px;line-height:24px;font-size:18px;letter-spacing:-.25px}
#time-dock.ruler-dock .ruler-header #era-button{height:24px;width:27px;font-size:10px}
#time-dock.ruler-dock .ruler-header .map-controls{grid-column:3;grid-row:1;justify-self:end;gap:1px}
#time-dock.ruler-dock .time-ruler{grid-column:2;grid-row:1;height:54px;border-radius:0;outline:none!important;box-shadow:none!important}
#time-dock.ruler-dock .time-ruler:focus-visible{background:color-mix(in srgb,var(--surface-hover) 45%,transparent)}
#time-dock.ruler-dock .time-ruler canvas{height:54px}
#time-dock.ruler-dock .ruler-playhead{top:24px;height:15px}
@media(max-width:700px){#time-dock.ruler-dock{grid-template-columns:28px minmax(0,1fr) 76px;column-gap:5px;padding:3px 7px 4px}#time-dock.ruler-dock .ruler-header #year-form{left:calc(50% - 24px);top:2px}#time-dock.ruler-dock .ruler-header #year-input{font-size:17px;width:72px}#time-dock.ruler-dock .ruler-header .map-controls button{width:24px;height:28px}#time-dock.ruler-dock .ruler-header>#play{width:28px;height:28px}}
