.day-cycle{--cycle-accent:#ce7549;--cycle-glow:#f7b98b36;background:radial-gradient(ellipse at 26% 64%,var(--cycle-glow),transparent 56%),var(--cream);transition:background-color .8s ease}.day-cycle[data-phase=day]{--cycle-accent:#b87b00;--cycle-glow:#ffd16640}.day-cycle[data-phase=dusk]{--cycle-accent:#c65f3f;--cycle-glow:#ee8a5c35}.day-cycle[data-phase=night]{--cycle-accent:#5858a0;--cycle-glow:#b1a5e336}.cycle-layout{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:85px}.cycle-visual{padding:42px 24px 20px}.cycle-dial{position:relative;width:min(100%,430px);aspect-ratio:1;margin:auto}.cycle-dial:before{content:"";position:absolute;inset:3%;border-radius:50%;box-shadow:0 22px 50px #6b47252b}.cycle-disc,.cycle-frame{position:absolute;inset:0;width:100%;height:100%}.cycle-disc{transition:transform .85s cubic-bezier(.23,1,.32,1)}.cycle-disc>svg{display:block;width:100%;height:100%;overflow:visible}.cycle-frame{overflow:visible;pointer-events:none}.cycle-ticks line{stroke:#3c281459;stroke-width:1.4;stroke-linecap:round}.cycle-face{fill:#fbf6ea;stroke:#3c281420;stroke-width:1.5}.cycle-pointer{fill:var(--ink);stroke:#fff6e4;stroke-width:1;stroke-linejoin:round}.cycle-phase-icon{position:absolute;display:grid;place-items:center;width:15%;height:15%;padding:3%;border:0;border-radius:50%;background:transparent;color:#5b3a12;transform:translate(-50%,-50%) rotate(var(--cycle-counter,0deg));transition:transform .85s cubic-bezier(.23,1,.32,1),background .2s}.cycle-phase-icon svg{width:100%;height:100%}.cycle-phase-icon[data-cycle-select=night]{color:#e8ecff}.cycle-phase-icon:hover{background:#ffffff55}.cycle-phase-icon:focus-visible{outline:3px solid var(--ink);outline-offset:3px;background:#ffffff88}.cycle-center{position:absolute;inset:24%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;color:var(--cycle-accent);pointer-events:none}.cycle-center [data-cycle-center-icon]{width:38%;aspect-ratio:1}.cycle-center svg{width:100%;height:100%}.cycle-center [data-cycle-current]{font-size:14px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--ink)}.cycle-description{max-width:510px}.cycle-description h3{font-size:clamp(42px,4.5vw,64px);color:var(--cycle-accent);margin-bottom:22px}.cycle-description>p:not(.visually-hidden){font-size:20px;line-height:1.7;min-height:104px;margin-bottom:28px;color:#39616a}.cycle-choices{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:26px}.cycle-choices button{border:1px solid #073e482b;border-radius:30px;padding:10px 16px;background:transparent;color:var(--ink);font-size:14px;font-weight:800;transition:background .2s,color .2s}.cycle-choices button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--cream)}.cycle-choices button:hover{border-color:var(--ink)}.cycle-choices button:focus-visible,.cycle-toggle:focus-visible{outline:3px solid var(--teal);outline-offset:4px}.cycle-controls{display:flex;align-items:center;gap:20px}.cycle-toggle{display:flex;align-items:center;gap:8px;border:0;background:transparent;color:#39616a;padding:10px 0;min-width:88px;font-size:13px;font-weight:800}.cycle-toggle [data-cycle-toggle-icon]{width:18px;text-align:center}.cycle-progress{height:4px;flex:1;max-width:205px;overflow:hidden;border-radius:4px;background:#073e4817}.cycle-progress>span{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left;background:var(--cycle-accent)}
@media(max-width:1000px){.cycle-layout{gap:42px}.cycle-visual{padding-left:4px;padding-right:4px}.cycle-description>p:not(.visually-hidden){font-size:18px}.cycle-choices{gap:6px}.cycle-choices button{padding:9px 13px;font-size:13px}}
@media(max-width:760px){.cycle-layout{grid-template-columns:1fr;gap:32px}.day-cycle .center-heading{margin-bottom:18px}.cycle-visual{padding:32px 14px 4px}.cycle-dial{width:min(100%,280px)}.cycle-center [data-cycle-current]{font-size:12px}.cycle-description{max-width:none;text-align:center}.cycle-description h3{font-size:44px;margin-bottom:14px}.cycle-description>p:not(.visually-hidden){font-size:16px;min-height:108px;margin-bottom:20px}.cycle-choices{justify-content:center;margin-bottom:18px;gap:6px}.cycle-choices button{font-size:12px;padding:10px 12px}.cycle-controls{justify-content:center;gap:18px}.cycle-progress{max-width:170px}}
@media(prefers-reduced-motion:reduce){.cycle-disc,.cycle-phase-icon,.day-cycle{transition:none}}

[data-cycle-wedge]{cursor:pointer}