.dt-pop{position:absolute;z-index:60;margin-top:0.5rem;width:19rem;max-width:calc(100vw - 2rem);border-radius:1.25rem;border:1px solid var(--border);background:#ffffff;box-shadow:0 18px 40px -12px rgba(18,40,32,0.35);padding:0.875rem;color:var(--foreground)}.dt-pop[hidden]{display:none}.dt-pop--right{right:0}.dt-head{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;margin-bottom:0.625rem}.dt-title{font-weight:600;font-size:0.9375rem}.dt-nav{display:inline-flex;align-items:center;justify-content:center;height:2rem;width:2rem;border-radius:9999px;border:1px solid var(--border);background:transparent;color:var(--foreground);cursor:pointer;line-height:1;transition:background-color .15s ease,border-color .15s ease}.dt-nav:hover{background:color-mix(in srgb,var(--primary) 8%,transparent)}.dt-nav:disabled{opacity:.35;cursor:not-allowed;background:transparent}.dt-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.dt-dow{text-align:center;font-size:0.6875rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:color-mix(in srgb,var(--foreground) 45%,transparent);padding-bottom:0.375rem}.dt-day{height:2.25rem;border-radius:9999px;border:0;background:transparent;font-size:0.875rem;color:var(--foreground);cursor:pointer;transition:background-color .15s ease,color .15s ease}.dt-day:hover:not(:disabled){background:color-mix(in srgb,var(--primary) 10%,transparent)}.dt-day:disabled{color:color-mix(in srgb,var(--foreground) 22%,transparent);cursor:not-allowed}.dt-day--muted{visibility:hidden}.dt-day--today{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--primary) 45%,transparent)}.dt-day--on,.dt-day--on:hover:not(:disabled){background:var(--primary);color:var(--primary-foreground);font-weight:600}.dt-foot{display:flex;align-items:center;justify-content:space-between;margin-top:0.625rem;padding-top:0.625rem;border-top:1px solid var(--border)}.dt-link{border:0;background:transparent;padding:0.25rem 0.5rem;cursor:pointer;font-size:0.8125rem;font-weight:600;color:var(--primary);border-radius:0.5rem}.dt-link:hover{background:color-mix(in srgb,var(--primary) 8%,transparent)}.dt-link--quiet{color:color-mix(in srgb,var(--foreground) 55%,transparent);font-weight:500}.dt-readout{display:flex;align-items:center;justify-content:space-between;gap:0.75rem;margin-bottom:0.875rem}.dt-digits{display:flex;align-items:baseline;gap:0.125rem;font-size:1.75rem;font-weight:700;line-height:1}.dt-digit{border:0;background:transparent;padding:0.125rem 0.25rem;border-radius:0.5rem;font:inherit;color:color-mix(in srgb,var(--foreground) 40%,transparent);cursor:pointer}.dt-digit--on{color:var(--primary);background:color-mix(in srgb,var(--primary) 10%,transparent)}.dt-colon{color:color-mix(in srgb,var(--foreground) 40%,transparent)}.dt-ampm{display:inline-flex;overflow:hidden;border-radius:0.75rem;border:1px solid var(--border)}.dt-ampm button{border:0;background:transparent;padding:0.25rem 0.625rem;cursor:pointer;font-size:0.75rem;font-weight:700;letter-spacing:.04em;color:var(--foreground)}.dt-ampm button[aria-pressed="true"]{background:var(--primary);color:var(--primary-foreground)}.dt-face{position:relative;width:15rem;height:15rem;margin:0 auto;border-radius:9999px;background:color-mix(in srgb,var(--primary) 6%,transparent)}.dt-hand{position:absolute;left:50%;bottom:50%;width:2px;transform-origin:bottom center;background:var(--primary);border-radius:2px}.dt-hand::before{content:"";position:absolute;top:-0.4375rem;left:50%;transform:translateX(-50%);height:0.875rem;width:0.875rem;border-radius:9999px;background:var(--primary)}.dt-pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);height:0.5rem;width:0.5rem;border-radius:9999px;background:var(--accent)}.dt-tick{position:absolute;height:2.125rem;width:2.125rem;transform:translate(-50%,-50%);border:0;background:transparent;border-radius:9999px;cursor:pointer;font-size:0.875rem;color:var(--foreground);z-index:1;transition:background-color .15s ease,color .15s ease}.dt-tick:hover{background:color-mix(in srgb,var(--primary) 12%,transparent)}.dt-tick--on,.dt-tick--on:hover{background:var(--primary);color:var(--primary-foreground);font-weight:700}@media (max-width:380px){.dt-face{width:13rem;height:13rem}}