.time-span-workbench{max-width:680px;margin-inline:auto}.time-span-clocks{display:flex;justify-content:center;gap:clamp(1rem,5vw,3rem)}.time-span-clocks>div{display:grid;text-align:center;gap:.3rem;min-width:0}.time-span-clocks .school-visual{margin:0;max-width:170px}.time-span-controls{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.time-span-controls label{display:grid;gap:.25rem;font-weight:650}.time-span-controls input{width:100%;min-height:44px;accent-color:var(--teal,#248f85);cursor:pointer}.time-span-blocks{display:flex;flex-wrap:wrap;gap:.3rem;min-height:38px;margin-block:.5rem}.time-span-blocks i{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;background:#d9ece7;font-style:normal;font-weight:700;transition:width .18s ease,background-color .18s ease}.time-span-blocks .time-span-hour{width:128px;background:#a6d7c8}@media(max-width:440px){.time-span-controls{gap:.6rem}.time-span-clocks{gap:.5rem}.time-span-clocks svg{max-width:125px;max-height:125px}}@media(prefers-reduced-motion:reduce){.time-span-blocks i{transition:none}}