@property --jar-golden{syntax:"<percentage>";inherits:true;initial-value:30%}@property --jar-sunset{syntax:"<percentage>";inherits:true;initial-value:55%}@property --jar-dusk{syntax:"<percentage>";inherits:true;initial-value:75%}.jar-field{font-size:var(--text-sm);color:var(--color-ink);gap:.45rem;display:grid}.jar-field input{border:1px solid var(--color-line-strong);border-radius:var(--radius-sm);background:var(--color-surface);min-block-size:3rem;max-inline-size:16rem;color:var(--color-ink);font-size:var(--text-base);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;padding:.6rem .85rem}.jar-field input:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.jar-times{gap:.25rem;display:grid}.jar-times>div{border-block-end:1px solid var(--color-line);justify-content:space-between;align-items:baseline;gap:1rem;padding-block:.7rem;display:flex}.jar-times dt{font-size:var(--text-sm);color:var(--color-ink-muted)}.jar-times dd{color:var(--color-heading);font-size:clamp(1.6rem,1.4rem + .8vw,2.125rem);line-height:1}.jar-sky{border-radius:0 0 var(--radius-sm) var(--radius-sm);block-size:clamp(9rem,7rem + 6vw,13rem);-webkit-mask:var(--arch-surbaisse) top center / 100% auto no-repeat;-webkit-mask:var(--arch-surbaisse) top center / 100% auto no-repeat;mask:var(--arch-surbaisse) top center / 100% auto no-repeat;background:linear-gradient(90deg, color-mix(in oklab, #8fb3d1 70%, var(--chaux)) 0%, color-mix(in oklab, #8fb3d1 45%, var(--lueur)) calc(var(--jar-golden) * .6), var(--lueur) var(--jar-golden), color-mix(in oklab, var(--lueur) 55%, var(--lilas)) calc((var(--jar-golden) + var(--jar-sunset)) / 2), var(--lilas) var(--jar-sunset), var(--crepuscule) calc((var(--jar-sunset) + var(--jar-dusk)) / 2), var(--color-nuit-950) var(--jar-dusk), #0f0e18 100%);margin-block-start:1.75rem;position:relative}@media (prefers-reduced-motion:no-preference){.jar-sky{transition:--jar-golden .42s var(--ease-soft), --jar-sunset .42s var(--ease-soft), --jar-dusk .42s var(--ease-soft)}.jar-sky-mark,.jar-ticks span{transition:left .42s var(--ease-soft)}}.jar-sky-mark{background:color-mix(in oklab, var(--nuit) 45%, transparent);inline-size:1px;position:absolute;inset-block:18% 0}.jar-sky-mark>span{white-space:nowrap;font-size:var(--text-xs);color:var(--nuit);position:absolute;inset-block-start:0;inset-inline-start:.5rem}.jar-sky-mark:last-child{background:color-mix(in oklab, var(--chaux) 45%, transparent)}.jar-sky-mark:last-child>span{color:var(--chaux)}.jar-sky-sun:before{content:"";background:var(--lueur);block-size:1.1rem;inline-size:1.1rem;box-shadow:0 0 22px 8px color-mix(in oklab, var(--lueur) 60%, transparent);border-radius:50%;position:absolute;inset-block-end:22%;inset-inline-start:-.55rem}.jar-ticks{block-size:1.5rem;margin-block-start:.6rem;position:relative}.jar-ticks span{font-size:var(--text-xs);color:var(--color-ink-muted);font-variant-numeric:tabular-nums;position:absolute;translate:-50%}.jar-table th,.jar-table td{border-block-end:1px solid var(--color-line);padding:.65rem 1rem .65rem 0}.jar-table thead th{color:var(--color-ink-muted);font-weight:500}.jar-table tbody th{color:var(--color-ink);font-weight:400}.jar-table td{font-size:var(--text-base);color:var(--color-heading)}@media (forced-colors:active){.jar-sky{border:1px solid canvastext}}@media not (min-width:40rem){.jar-sky-mark>span{display:none}}
