.donecal-live{background:#f1edf4;color:#303039;padding:clamp(22px,4vw,60px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,72px);align-items:center;font-family:"ZT Nature",Arial,sans-serif}.donecal-story{display:grid;gap:20px}.donecal-step{padding:24px 20px;border-radius:16px}.donecal-step small{font:10px monospace;color:#56568d}.donecal-step h3{font-size:clamp(19px,2.2vw,28px);font-weight:500;letter-spacing:-.04em;margin:14px 0 10px}.donecal-step p{font-size:14px;line-height:1.5;margin:0;color:#65616b}.donecal-step.is-active{background:#ffffffbd;box-shadow:0 0 0 1px #a8a7c6,0 12px 30px #8581ad12}.donecal-calendar{background:#fffdfef2;border-radius:26px;padding:26px;box-shadow:0 12px 50px #8881ad24}.donecal-brand{display:flex;align-items:center;gap:9px;font-size:17px}.donecal-brand img{width:25px;height:25px}.donecal-day{display:flex;justify-content:space-between;align-items:center;margin:28px 0 18px}.donecal-day small{font:9px monospace;letter-spacing:.1em}.donecal-day h3{font-size:34px;letter-spacing:-.05em;margin:8px 0;font-weight:500}.donecal-day>span{font-size:46px;color:#92909c}.donecal-progress{padding:15px;border-radius:12px;background:#eeecf2;font-size:20px;margin-bottom:20px}.donecal-event{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--event-color);border-radius:9px;margin-top:8px;padding:12px;color:#36343e;background:#fff;transition:background .25s}.donecal-event:has(input:checked){background:var(--event-fill)}.donecal-event span{font-size:14px;line-height:1.4}.donecal-event small{display:block;font-size:11px;color:#64616e}.donecal-event input{width:24px;height:24px;accent-color:var(--event-color);cursor:pointer;margin:10px}.donecal-footnote{text-align:center;font-size:11px;color:#757180;margin:20px 0 0}.donecal-live-footer{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 28px;background:#111217;color:white;text-decoration:none}.donecal-live-footer strong{font-size:clamp(24px,3vw,40px);font-weight:500;letter-spacing:-.04em}.donecal-live-footer span{font-size:14px;color:#dfff57}@media(max-width:700px){.donecal-live{grid-template-columns:1fr}.donecal-story{gap:8px}.donecal-step{padding:16px}.donecal-step:not(.is-active){display:none}.donecal-calendar{padding:20px}.donecal-live-footer{display:block}.donecal-live-footer span{display:block;margin-top:12px}}@media(prefers-reduced-motion:reduce){.donecal-event{transition:none}}
.donecal-live{align-items:start;position:relative}.donecal-story{gap:0}.donecal-step{min-height:55vh;display:flex;flex-direction:column;justify-content:center;transition:background .35s,box-shadow .35s}.donecal-calendar{position:sticky;top:30px;margin-top:10vh}.donecal-event{transition:background .3s,opacity .3s,transform .3s}.donecal-event.is-moved{opacity:.4;transform:translateX(12px)}.donecal-event.is-moved small::after{content:' · Tomorrow'}.donecal-event.is-focusing{background:#ece7f8}.donecal-focus{display:flex;gap:14px;align-items:center;margin-top:18px;padding:14px;background:#eeebf5;border-radius:12px;font-size:12px}.donecal-focus[hidden]{display:none}.donecal-focus strong{display:block;font-size:22px;font-weight:500;margin-top:4px}.donecal-focus-ring{width:42px;height:42px;border-radius:50%;background:conic-gradient(#7976a8 var(--focus-progress,0%),#d9d6e5 0);mask:radial-gradient(circle,transparent 55%,black 57%)}
@media(max-width:700px){.donecal-live{grid-template-columns:1fr 1.2fr;padding:16px;gap:12px}.donecal-step,.donecal-step:not(.is-active){display:flex;min-height:65vh;padding:12px}.donecal-step h3{font-size:18px}.donecal-step p{font-size:12px}.donecal-calendar{top:14px;padding:12px;border-radius:16px}.donecal-event{padding:6px;gap:4px}.donecal-event input{width:20px;height:20px;margin:4px}.donecal-event span{font-size:11px}.donecal-event small{font-size:9px}.donecal-day h3{font-size:25px}.donecal-day>span{font-size:30px}.donecal-brand{font-size:13px}.donecal-day small{font-size:7px}}
@media(prefers-reduced-motion:reduce){.donecal-step,.donecal-event{transition:none}}