@font-face{font-family:Kwangmyeong Subset;src:url(./kwangmyeong-BJctXx1Y.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Hakkou Numerals;src:url(./hakkou-numerals-3dnzjzFB.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}:root{--bg: #0a0a0b;--fg: #fef3d8;--fg-dim-1: color-mix(in srgb, var(--fg) 60%, var(--bg));--fg-dim-2: color-mix(in srgb, var(--fg) 20%, var(--bg));--accent: #e8d17c;--o-back: .3;--o-fill: .82;--o-twinkle-dip: .45;--font-body: "Kwangmyeong Subset", serif;--font-emphasis: "Hakkou Numerals", serif;--font-ascii: monospace;--fs-label: .875rem;--fs-body: 1rem;--fs-caption: clamp(1.0625rem, .75rem + .9vw, 1.375rem);--num-height: clamp(6.5rem, 22vw, 15rem);--num-digit-height: .751;--num-cap-height: .735;--num-ascent: .88;--num-descent: .12;--lh-body: 1.85;--lh-tight: 1;--tracking-label: .04em;--tracking-num: -.02em;--weight-regular: 400;--space-1: .25rem;--space-2: .5rem;--space-3: 1rem;--space-4: 1.5rem;--space-5: 2.5rem;--space-6: 4rem;--space-7: 6rem;--space-8: 10rem;--gutter: clamp(1rem, 4vw, 3rem);--measure: 34rem;--section-space: clamp(7rem, 3rem + 8vw, 12rem);--content-max: 84rem;--page-inline: max(var(--gutter), (100% - var(--content-max)) / 2);--stitch-dash: 5px;--stitch-gap: 4px;--stitch-width: 1.25px;--embroidery-thread: 1.6px;--embroidery-length: 3px;--embroidery-light: -40;--embroidery-contrast: .22;--embroidery-soft: .12;--embroidery-jitter: .22;--embroidery-max-dpr: 2;--rule-width: 1px;--threadbar-inset: .625rem;--threadbar-width: 1rem;--needle-height: 2.25rem;--needle-eye-ratio: .14;--sampler-stitch: 8px;--sampler-gap: 6px;--sampler-row-gap: 14px;--sampler-label-width: 2.25rem;--sampler-label-gap: 1rem;--sampler-thread: 2px;--sampler-width: 32rem;--sampler-needle: 18px;--sampler-needle-tilt: 35deg;--sampler-star: 11px;--tokino-ratio: .1501;--mary-ratio: .1277;--logo-height: 2.75rem;--logo-height-small: 2rem;--halftone-cell: 4.5px;--halftone-start: .7;--halftone-span: .26;--ease: cubic-bezier(.4, 0, .2, 1);--blur-far: 12px;--blur-near: 3px;--glow-star: 10px;--dur-star-revisit: .35s;--dur-outline: .5s;--dur-outline-short: .3s;--dur-satin: .9s;--dur-satin-short: .45s;--stitch-letter-ratio: .7;--dur-fill: .4s;--fill-overlap: .1s;--dur-fade: .5s;--dur-twinkle: .7s;--dur-reveal: .9s;--dur-sew-total: 1.5s;--dur-sew-stitch: .16s;--dur-sew-needle: .3s;--dur-sew-delay: .55s;--at-tokino: 0ms;--at-image: .6s;--at-mary: .9s;--at-jp: 1.5s;--at-star: 1.8s}*,*:before,*:after{box-sizing:border-box}html{color-scheme:dark;-webkit-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font-body);font-size:var(--fs-body);line-height:var(--lh-body);font-weight:var(--weight-regular);word-break:keep-all;overflow-wrap:break-word;-webkit-font-smoothing:antialiased}img,svg{display:block;max-width:100%}h1,h2,h3,p,ul{margin:0}ul{padding:0;list-style:none}a{color:var(--fg);text-decoration:none;background-image:linear-gradient(to right,currentColor 0 var(--stitch-dash),transparent var(--stitch-dash) calc(var(--stitch-dash) + var(--stitch-gap)));background-size:calc(var(--stitch-dash) + var(--stitch-gap)) var(--rule-width);background-repeat:repeat-x;background-position:0 100%}::selection{background:var(--fg);color:var(--bg)}:focus-visible{outline:var(--rule-width) dashed var(--fg);outline-offset:var(--space-1)}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.logo-mark{display:block;flex:none;aspect-ratio:173 / 211;background-color:currentColor;background-image:none;-webkit-mask:url(./logo-BdqD7qFe.png) center / contain no-repeat;mask:url(./logo-BdqD7qFe.png) center / contain no-repeat}@media print{[data-reveal]{opacity:1!important;filter:none!important;clip-path:none!important}}.hero{--figure-size: min(92svh, 64vw);--tokino-width: min(92vw, 150svh);--hero-pad-y: 7svh;--tokino-top: var(--hero-pad-y);--mary-width: min(54vw, 88svh);--mary-bottom: var(--hero-pad-y);--mary-over-image: 3svh;--mary-optical-offset: 0px;--jp-x: 106%;--jp-y: 33%;--jp-height: 32%;position:relative;min-height:100svh;overflow-x:clip;isolation:isolate}.hero__tokino,.hero__figure,.hero__mary{position:absolute;left:50%}.hero__tokino{z-index:1;top:var(--tokino-top);width:var(--tokino-width);translate:-50% 0}.hero__tokino .title-svg{width:100%;height:auto;opacity:var(--o-back)}.hero__tokino .embroidery-canvas{opacity:var(--o-back)}.hero__star{position:absolute;left:var(--star-x, 90%);top:var(--star-y, 50%);width:var(--star-size, 6%);translate:-50% -50%}.star-svg{width:100%;height:auto;fill:var(--accent)}.hero__figure{z-index:2;bottom:calc(var(--mary-bottom) - var(--mary-over-image));width:var(--figure-size);aspect-ratio:1;translate:-50% 0}.hero__img{width:100%;height:auto;-webkit-mask-image:linear-gradient(to bottom,black calc(var(--halftone-start) * 100%),transparent calc((var(--halftone-start) + var(--halftone-span)) * 100%));mask-image:linear-gradient(to bottom,black calc(var(--halftone-start) * 100%),transparent calc((var(--halftone-start) + var(--halftone-span)) * 100%))}.hero__canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.hero__figure.has-halftone .hero__img{opacity:0}.hero__mary{z-index:3;bottom:var(--mary-bottom);width:var(--mary-width);translate:calc(-50% + var(--mary-optical-offset)) 0}.hero__mary .title-svg{width:100%;height:auto}.hero__jp{position:absolute;z-index:1;left:var(--jp-x);top:var(--jp-y);height:var(--jp-height)}.hero__jp{width:max-content}.hero__jp .title-svg{width:auto;max-width:none;height:100%}.site-logo{position:absolute;z-index:4;top:var(--gutter);left:var(--gutter);height:var(--logo-height);color:var(--fg)}@media(max-width:48rem){.hero{--tokino-width: calc(100vw - var(--gutter) * 2);--tokino-height: calc(var(--tokino-width) * var(--tokino-ratio));--mary-width: 80vw;--mary-height: calc(var(--mary-width) * var(--mary-ratio));--hero-pad-y: 4svh;--figure-size: min(124vw, 100svh - var(--hero-pad-y) * 2 - var(--logo-height) - var(--space-3) - var(--tokino-height) * .85);--jp-y: 10%;--jp-height: 30%;display:flex;flex-direction:column;align-items:center;min-height:auto;padding-block:var(--hero-pad-y)}.site-logo,.hero__tokino,.hero__figure,.hero__mary{position:relative;inset:auto;translate:none;flex:none}.site-logo{order:-1;align-self:flex-start;margin-inline-start:var(--gutter)}.hero__tokino{margin-block-start:var(--space-3)}.hero__figure{margin-block-start:calc(var(--tokino-height) * -.15)}.hero__mary{margin-block-start:calc((var(--mary-height) + var(--mary-over-image)) * -1);translate:var(--mary-optical-offset) 0}.hero__jp{left:auto;right:calc((var(--figure-size) - 100vw) / 2 + var(--gutter))}}.title-svg{overflow:visible}.stitch-fill{fill:var(--fg);opacity:var(--o-fill)}.has-texture .stitch-fill,.has-texture .stitch-seams{opacity:0}.stitch-seam{fill:none;stroke:var(--fg);stroke-width:var(--seam-width);stroke-dasharray:var(--seam-dash) var(--seam-gap)}.stitch-thread{fill:none;stroke:currentColor;stroke-width:var(--thread-width);stroke-linecap:round;stroke-dasharray:1 1;stroke-dashoffset:0}.embroidery-canvas{position:absolute;pointer-events:none}@property --satin-progress{syntax: "<number>"; inherits: false; initial-value: 1;}.hero__tokino{--embroidery-max-dpr: 1;--word-at: var(--at-tokino);--word-outline: var(--dur-outline);--word-satin: var(--dur-satin)}.hero__mary{--word-at: var(--at-mary);--word-outline: var(--dur-outline);--word-satin: var(--dur-satin)}.hero__jp{--word-at: var(--at-jp);--word-outline: var(--dur-outline-short);--word-satin: var(--dur-satin-short)}.hero__tokino,.hero__mary,.hero__jp{--per-letter: max(var(--n, 2) - 1, 1);--outline-letter: calc(var(--word-outline) * var(--stitch-letter-ratio));--outline-stagger: calc((var(--word-outline) - var(--outline-letter)) / var(--per-letter));--satin-at: calc(var(--word-at) + var(--word-outline) * .5);--fill-at: calc(var(--satin-at) + var(--word-satin) - var(--fill-overlap))}[data-intro=wait] .hero [data-part]{opacity:0;animation:intro-fallback 1ms 4s forwards}[data-intro=wait] .embroidery-canvas{--satin-progress: 0}[data-intro=play] .stitch-thread{animation:stitch var(--outline-letter) var(--ease) both;animation-delay:calc(var(--word-at) + var(--i) * var(--outline-stagger))}[data-intro=play] .embroidery-canvas{animation:satin-clock var(--word-satin) var(--ease) both;animation-delay:var(--satin-at)}[data-intro=play] .stitch-fill{animation:fade-in var(--dur-fill) var(--ease) both;animation-delay:var(--fill-at)}[data-intro=play] .has-texture .stitch-seams{animation:seam-under var(--dur-fill) var(--ease) both;animation-delay:var(--fill-at)}@keyframes satin-clock{0%{--satin-progress: 0}to{--satin-progress: 1}}[data-intro=play] .hero__figure{animation:surface var(--dur-fade) var(--ease) both;animation-delay:var(--at-image)}[data-intro=play] .site-logo{animation:surface var(--dur-fade) var(--ease) both;animation-delay:var(--at-jp)}.hero__star.is-twinkling{animation:twinkle var(--dur-twinkle) var(--ease) both;animation-delay:var(--dur-star-revisit)}[data-intro=play] .hero__star{animation:twinkle var(--dur-twinkle) var(--ease) both;animation-delay:var(--at-star)}@keyframes intro-fallback{to{opacity:1}}@keyframes stitch{0%{stroke-dashoffset:1}}@keyframes seam-under{0%{opacity:1}}@keyframes fade-in{0%{opacity:0}}@keyframes surface{0%{opacity:0;filter:blur(var(--blur-far))}}@keyframes twinkle{0%{opacity:0;scale:.3;filter:blur(var(--blur-near)) drop-shadow(0 0 0 var(--accent))}40%{opacity:1;scale:1;filter:blur(0) drop-shadow(0 0 var(--glow-star) var(--accent))}65%{opacity:var(--o-twinkle-dip);filter:blur(0) drop-shadow(0 0 calc(var(--glow-star) / 2) var(--accent))}to{opacity:1;scale:1;filter:blur(0) drop-shadow(0 0 0 var(--accent))}}.frame{position:relative;padding:var(--section-space) var(--page-inline);display:grid;justify-items:start;row-gap:var(--space-4)}.frame__label{font:inherit;font-size:var(--fs-label);letter-spacing:var(--tracking-label);color:var(--fg-dim-1)}.frame__caption{font-size:var(--fs-caption);line-height:var(--lh-body)}.days__count{display:flex;align-items:flex-start;gap:calc(var(--num-height) * .05);font-family:var(--font-emphasis);line-height:var(--lh-tight);margin-block-start:var(--space-3)}.days__num{font-size:calc(var(--num-height) / var(--num-digit-height));letter-spacing:var(--tracking-num);margin-block:calc((var(--num-digit-height) - var(--num-ascent)) * 1em) calc(var(--num-descent) * -1em)}.days__prefix{font-size:calc(var(--num-height) / 4 / var(--num-cap-height));margin-block-start:calc((var(--num-cap-height) - var(--num-ascent)) * 1em)}.days__since time{color:var(--fg-dim-1)}.sampler{position:relative;display:grid;row-gap:var(--sampler-row-gap);width:100%;max-width:var(--sampler-width);margin-block:var(--space-4) var(--space-2)}.sampler__month{display:grid;grid-template-columns:var(--sampler-label-width) minmax(0,1fr);column-gap:var(--sampler-label-gap);align-items:center}.sampler__label{font-size:var(--fs-label);line-height:var(--lh-tight);color:var(--fg-dim-1)}.sampler__days{display:grid;grid-template-columns:repeat(31,var(--sampler-stitch));column-gap:min(var(--sampler-gap),(100% - 31 * var(--sampler-stitch)) / 30);align-items:center}.sampler__day{position:relative;width:var(--sampler-stitch);height:var(--sampler-thread);background:var(--fg-dim-2)}.sampler__day.is-sewn:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--fg)}.sampler__day.is-birthday{background:none}.sampler__day.is-birthday:after{content:none}.sampler__day.is-birthday svg{position:absolute;left:50%;top:50%;width:var(--sampler-star);max-width:none;height:auto;translate:-50% -50%;fill:var(--accent)}.sampler__needle{position:absolute;left:var(--needle-x, 0);top:var(--needle-y, 0);width:calc(var(--sampler-needle) / 4);height:var(--sampler-needle);translate:-50% -100%;rotate:var(--sampler-needle-tilt);transform-origin:50% 100%;color:var(--fg);pointer-events:none}.sampler__needle.is-gliding{transition:left var(--sew-step) linear,top var(--sew-step) linear}.sampler__needle svg{width:100%;max-width:none;height:100%}.sampler[data-sew=pending] .is-sewn:after{clip-path:inset(0 100% 0 0)}.sampler[data-sew=pending] .sampler__needle{opacity:0}.sampler[data-sew=play] .is-sewn:after{animation:sew var(--dur-sew-stitch) var(--ease) backwards;animation-delay:calc(var(--dur-sew-delay) + var(--i) * var(--sew-step))}.sampler[data-sew=play] .sampler__needle{animation:fade-in var(--dur-sew-needle) var(--ease) both;animation-delay:var(--dur-sew-delay)}@keyframes sew{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}@media(min-width:48.0625rem){.days{grid-template-columns:minmax(0,35fr) minmax(0,65fr);grid-template-areas:"label ." "count sampler" "since ." "birthday .";column-gap:var(--space-6)}.days>.frame__label{grid-area:label}.days__count{grid-area:count;align-self:center}.days>.sampler{grid-area:sampler;align-self:center;justify-self:center;margin-block:0}.days__since{grid-area:since}.days>[data-dday=birthday]{grid-area:birthday}}[data-reveal=pending]{opacity:0;filter:blur(var(--blur-near))}[data-reveal=shown]{opacity:1;filter:blur(0);transition:opacity var(--dur-reveal) var(--ease),filter var(--dur-reveal) var(--ease)}.site-footer{display:grid;justify-items:start;gap:var(--space-3);padding:var(--space-6) var(--gutter) var(--space-7)}.site-footer__mark{height:var(--logo-height-small);color:var(--fg-dim-1);margin-block-end:var(--space-3)}.site-footer__links{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);margin-block-end:var(--space-3);font-size:var(--fs-body)}.site-footer__notice,.site-footer__contact{max-width:var(--measure);font-size:var(--fs-label);color:var(--fg-dim-1)}.has-threadbar{scrollbar-width:none}.has-threadbar::-webkit-scrollbar{display:none}.threadbar{position:fixed;z-index:50;top:var(--space-3);bottom:var(--space-3);right:var(--threadbar-inset);width:var(--threadbar-width);color:var(--fg);cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none}.threadbar[hidden]{display:none}.threadbar__track,.threadbar__sewn{position:absolute;top:0;left:50%;width:var(--stitch-width);translate:-50% 0;background-image:linear-gradient(to bottom,currentColor 0 var(--stitch-dash),transparent var(--stitch-dash) calc(var(--stitch-dash) + var(--stitch-gap)));background-size:100% calc(var(--stitch-dash) + var(--stitch-gap))}.threadbar__track{bottom:0;color:var(--fg-dim-2);transition:color var(--dur-fade) var(--ease)}.threadbar:hover .threadbar__track,.threadbar.is-dragging .threadbar__track{color:var(--fg-dim-1)}.threadbar__sewn{height:calc(var(--needle-y, 0px) + var(--needle-height) * var(--needle-eye-ratio))}.threadbar__needle{position:absolute;top:0;left:50%;height:var(--needle-height);translate:-50% var(--needle-y, 0px);cursor:grab}.threadbar__needle svg{width:auto;height:100%}.threadbar.is-dragging,.threadbar.is-dragging .threadbar__needle{cursor:grabbing}