:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#17312d;background:#f4f2ec;--ink:#17312d;--muted:#64736d;--line:#dce1d8;--green:#173b34;--green-soft:#d8e9d9;--paper:#fffefa}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 88% 2%,#e1ecdf 0,transparent 29rem),#f4f2ec}.page{max-width:1040px;margin:auto;padding:clamp(20px,5vw,54px) 18px 40px}.hero{padding:clamp(25px,5vw,48px);background:var(--green);color:#fffefa;border-radius:24px;box-shadow:0 16px 42px #173b341c}.eyebrow{margin:0 0 11px;color:#c6d7c5;font-size:.72rem;font-weight:800;letter-spacing:.16em}.hero h1{max-width:690px;margin:0;font-size:clamp(2.25rem,7vw,4.8rem);line-height:.98;letter-spacing:-.055em}.intro{max-width:560px;margin:20px 0 0;color:#e1e9df;font-size:clamp(1rem,2.4vw,1.2rem);line-height:1.55}.public-note{max-width:680px;margin:26px 0 0;padding:12px 14px;border-left:3px solid #d89c4a;background:#ffffff12;border-radius:0 9px 9px 0;color:#f3f0e7;font-size:.9rem;line-height:1.5}.summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0}.stat{display:grid;gap:5px;padding:18px 20px;background:var(--paper);border:1px solid var(--line);border-radius:16px}.stat strong{font-size:clamp(1.7rem,4vw,2.4rem);line-height:1;color:var(--green)}.stat span{font-size:.88rem;color:var(--muted)}.calendar-panel{padding:clamp(18px,3.5vw,30px);background:var(--paper);border:1px solid var(--line);border-radius:20px}.calendar-heading{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:20px}.calendar-heading .eyebrow{color:#738279}.calendar-heading h2{margin:0;font-size:1.5rem;letter-spacing:-.03em}.legend{display:flex;align-items:center;gap:8px;margin:0;color:var(--muted);font-size:.82rem}.legend span{width:13px;height:13px;border-radius:4px;background:#39775d}.calendar-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 18px}.month{min-width:0}.month h3{margin:0 0 10px;color:var(--ink);font-size:.92rem}.weekdays,.days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}.weekday{text-align:center;color:#78847e;font-size:.67rem;font-weight:700;padding-bottom:4px}.day,.empty{display:grid;place-items:center;min-width:0;aspect-ratio:1;border-radius:5px;font-size:.7rem}.day{color:#56655e;background:#f0f1eb}.day.done{background:#39775d;color:#fff;font-weight:800}.day.today{outline:2px solid #d89c4a;outline-offset:1px}.state{color:var(--muted);font-size:.88rem;line-height:1.5}.page footer{padding:12px 4px}footer p{margin:0}.error{color:#983b2d}@media(max-width:700px){.calendar-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:21px 13px}.page{padding:14px 12px 28px}.hero{border-radius:19px}.calendar-heading{align-items:start;flex-direction:column}}@media(max-width:420px){.summary{gap:7px}.stat{padding:14px 11px;border-radius:13px}.stat span{font-size:.76rem}.calendar-grid{grid-template-columns:1fr 1fr;gap:18px 10px}.calendar-panel{padding:17px 13px}.weekdays,.days{gap:3px}.day,.empty{font-size:.65rem}}

@keyframes gentle-enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes number-arrive{from{opacity:.55;transform:translateY(4px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes completed-mark{0%{opacity:.45;transform:scale(.82)}70%{opacity:1;transform:scale(1.08)}100%{transform:scale(1)}}
.hero{animation:gentle-enter .48s cubic-bezier(.2,.7,.25,1) both}
.summary{animation:gentle-enter .42s .06s cubic-bezier(.2,.7,.25,1) both}
.calendar-panel{animation:gentle-enter .44s .12s cubic-bezier(.2,.7,.25,1) both}
.count-ready{animation:number-arrive .3s ease-out both}
.month{animation:gentle-enter .32s cubic-bezier(.2,.7,.25,1) both;animation-delay:calc(var(--month-order,0)*24ms)}
.day.done{animation:completed-mark .28s cubic-bezier(.2,.7,.25,1) both}
.day.done:hover{transform:translateY(-2px);box-shadow:0 3px 8px #173b3430;transition:transform .16s ease,box-shadow .16s ease}
@media(prefers-reduced-motion:reduce){.hero,.summary,.calendar-panel,.count-ready,.month,.day.done{animation:none!important}.day.done:hover{transform:none;box-shadow:none;transition:none}}

@keyframes manga-sweep{0%{opacity:0;transform:translateX(30%)}18%{opacity:.44}100%{opacity:0;transform:translateX(-24%)}}
@keyframes loading-sheen{from{background-position:100% 0}to{background-position:-100% 0}}
.hero{position:relative;isolation:isolate;overflow:hidden}
.hero::after{content:"";position:absolute;z-index:0;inset:-20% -15%;pointer-events:none;background:repeating-linear-gradient(112deg,transparent 0 34px,#ffffff12 35px 37px,transparent 38px 72px);animation:manga-sweep .78s .12s ease-out both}
.hero>*{position:relative;z-index:1}
.calendar-grid>.state{grid-column:1/-1;padding:16px;border-radius:9px;background:linear-gradient(100deg,#f0f1eb 25%,#fffefa 48%,#f0f1eb 72%);background-size:220% 100%;animation:loading-sheen 1.35s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.hero::after,.calendar-grid>.state{animation:none!important}.calendar-grid>.state{background:#f0f1eb}}

.hero-topline{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:clamp(22px,5vw,38px)}
.hero-topline .eyebrow{margin:7px 0 0}
.year-counter{flex:0 0 auto;display:grid;justify-items:end;gap:2px;padding:9px 12px;border:1px solid #ffffff35;border-radius:12px;background:#ffffff12;text-align:right;font-variant-numeric:tabular-nums}
.year-counter strong{font-size:clamp(1.4rem,4vw,1.85rem);line-height:1;font-weight:800}
.year-counter span{color:#e1e9df;font-size:.68rem;line-height:1.2}
@media(max-width:420px){.hero-topline{gap:8px}.hero-topline .eyebrow{font-size:.62rem;letter-spacing:.12em}.year-counter{padding:7px 9px;border-radius:10px}.year-counter span{font-size:.62rem}}