/* Eight complete reading scenes. These rules deliberately do not hide source copy. */
#timeline.timeline-scroll {
  --ts-accent:#f04458;
  --ts-scene-progress:0;
  --ts-total-progress:0;
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);
  align-items:start;
  gap:clamp(36px,5vw,84px);
  position:relative;
  isolation:isolate;
}
#timeline.timeline-scroll * {min-width:0}
#timeline .ts-stage {position:sticky;top:calc(var(--story-header,82px) + 16px);align-self:start;height:calc(100svh - var(--story-header,82px) - 40px);min-height:560px;max-height:950px;display:flex;flex-direction:column}
#timeline .ts-stage-meta {display:flex;justify-content:space-between;gap:14px;font-size:9px;letter-spacing:.16em;color:#9f8c91;margin:0 0 13px}
#timeline .ts-active-counter {color:#f06a79;font-variant-numeric:tabular-nums}
#timeline .ts-visual-stack {position:relative;flex:1;min-height:350px;overflow:hidden;background:#170d12;border:1px solid #a8546533}
#timeline .ts-desktop-scene {position:absolute;inset:0;opacity:0;visibility:hidden;transform:translateY(18px) scale(1.025);transition:opacity .55s ease,transform .85s cubic-bezier(.2,.65,.25,1),visibility .55s;pointer-events:none}
#timeline .ts-desktop-scene.is-active {opacity:1;visibility:visible;transform:translateY(0) scale(1);z-index:1}
#timeline .ts-art {position:relative;width:100%;height:100%;min-height:350px;overflow:hidden;background:#190c12;color:#f4e4dc;isolation:isolate}
#timeline .ts-art img {width:100%;height:100%;object-fit:cover}
#timeline .ts-scene-bg {position:absolute;inset:0;opacity:.8;transform:scale(calc(1.03 + var(--ts-scene-progress) * .035));transition:transform .12s linear}
#timeline .ts-scene-shade {position:absolute;inset:0;background:linear-gradient(180deg,#08070a14,#11070e44 40%,#16070de6)}
#timeline .ts-photo-note {font-size:9px!important;color:#9e858e!important;line-height:1.5!important;margin:9px 0 12px!important;letter-spacing:.01em}
#timeline .ts-navigation {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 12px;flex:none}
#timeline .ts-navigation a {display:flex;gap:7px;align-items:flex-start;border-top:1px solid #54303b;padding:9px 0;line-height:1.3;color:#aa949b;transition:color .3s,border-color .3s}
#timeline .ts-navigation a>span {font-family:var(--serif);font-size:15px;line-height:1}
#timeline .ts-navigation a>b {font-weight:400;font-size:9px;overflow-wrap:normal;line-height:1.5}
#timeline .ts-navigation a[aria-current="step"] {color:#fff0e8;border-color:#f04458}
#timeline .ts-navigation a[aria-current="step"]>span {color:#f45c6e}
#timeline .ts-progress-track {height:1px;background:#4b2934;position:relative;margin-top:6px;overflow:hidden}
#timeline .ts-progress-track>span {display:block;position:absolute;inset:0;background:#fa4057;transform-origin:left;transform:scaleX(var(--ts-total-progress));transition:transform .12s linear}
#timeline .ts-reading {position:relative}
#timeline .ts-step {min-height:max(760px,calc(100svh - 100px));display:flex;flex-direction:column;justify-content:center;padding:90px 0;scroll-margin-top:70px;border-bottom:1px solid #6b354533;position:relative}
#timeline .ts-step:last-child {border-bottom:0}
#timeline .ts-step-copy {position:relative;z-index:2;max-width:540px;width:100%}
#timeline .ts-step-meta {display:flex;justify-content:space-between;gap:14px;align-items:baseline;line-height:1.5;padding-top:17px;border-top:1px solid #9b4a5c;color:#f06578;font-size:11px;letter-spacing:.07em}
#timeline .ts-step-meta small {font-size:8px;color:#a78592;letter-spacing:.06em;max-width:45%;text-align:right}
#timeline .ts-step-number {display:block;margin:30px 0 17px;font-size:10px;color:#a16a7b;letter-spacing:.17em;font-variant-numeric:tabular-nums}
#timeline .ts-step h3 {font-family:var(--serif);font-size:clamp(40px,4.1vw,66px);letter-spacing:-.035em;line-height:.98;color:#f3e8e1;max-width:8em;margin:0 0 18px;overflow-wrap:normal}
#timeline .ts-step h4 {font-size:17px;font-weight:400;line-height:1.7;margin:0 0 28px;color:#e1bac7}
#timeline .ts-goal {font-size:15px;line-height:1.95;color:#e3b6c5;margin:0 0 25px}
#timeline .ts-goal>span {display:block;font-size:9px;color:#ad758b;letter-spacing:.12em;margin-bottom:8px}
#timeline .ts-description,#timeline .ts-source-detail {font-size:15px;line-height:2.15;color:#c2b1b7;margin:0 0 18px;overflow-wrap:anywhere}
#timeline .ts-snippet {display:inline-flex;align-items:center;gap:10px;font-size:10px;color:#c99aaa;letter-spacing:.02em;border-top:1px solid #603444;padding-top:17px;margin-top:12px;line-height:1.6}
#timeline .ts-snippet svg,#timeline .ts-art svg {width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
#timeline .ts-snippet svg {color:#f2546b}
#timeline .ts-peak h3 {color:#ffd8d7}
#timeline .ts-peak .ts-step-meta {border-color:#ed3a55}
#timeline .ts-mobile-visual {display:none}
#timeline .ts-corner-mark {position:absolute;left:24px;bottom:22px;letter-spacing:.14em;font-size:8px;color:#e8b6bf;z-index:4}
/* 01: a partial view and the first social question. */
#timeline .ts-art-teasing {background:#14090e}
#timeline .ts-art-teasing .ts-scene-bg {object-position:30% center;filter:saturate(.75);opacity:.47;clip-path:polygon(0 0,62% 0,100% 100%,22% 100%)}
#timeline .ts-tease-mask {position:absolute;inset:0;background:linear-gradient(110deg,#0c080d8c,#20090a00 55%,#1007108c)}
#timeline .ts-tease-type {position:absolute;left:8%;top:12%;right:6%}
#timeline .ts-tease-type>span {font-family:var(--serif);font-size:clamp(38px,4.7vw,78px);line-height:.9;letter-spacing:-.04em;display:block;color:#efb5bc}
#timeline .ts-tease-type>em {display:block;font-size:11px;letter-spacing:.3em;color:#c7758a;font-style:normal;margin-top:20px}
#timeline .ts-poll {position:absolute;right:7%;bottom:13%;width:60%;max-width:300px;padding:21px;background:#f2e1dc;color:#45202c;transform:rotate(-4deg);box-shadow:0 20px 50px #0008}
#timeline .ts-poll>span {display:block;font-size:7px;letter-spacing:.15em;color:#986573}
#timeline .ts-poll>strong {display:block;font-family:var(--serif);font-weight:400;font-size:29px;line-height:1.2;margin:15px 0}
#timeline .ts-poll>div {display:grid;grid-template-columns:1fr 1fr;gap:1px;border:1px solid #bf9ba4;background:#bf9ba4}
#timeline .ts-poll b {background:#e8d1d3;padding:10px 5px;text-align:center;font-size:8px;font-weight:400;line-height:1.4}
#timeline .ts-poll>small {display:block;font-size:7px;line-height:1.5;color:#805560;margin-top:10px}
/* 02: a newly revealed invitation holds the composition. */
#timeline .ts-art-reveal .ts-scene-bg {object-position:62% center;opacity:.55}
#timeline .ts-reveal-sheet {position:absolute;left:14%;top:8%;width:70%;height:80%;background:linear-gradient(120deg,#e2d1b9,#efe2d1);color:#4f2330;padding:8% 8% 5%;transform:rotate(-3deg);box-shadow:0 18px 70px #0802089c;display:flex;flex-direction:column;justify-content:space-between}
#timeline .ts-reveal-sheet>small {font-size:8px;letter-spacing:.16em;color:#896473}
#timeline .ts-reveal-sheet>span {font-family:var(--serif);font-size:clamp(36px,4vw,64px);line-height:.85;letter-spacing:-.06em;margin:20px 0}
#timeline .ts-reveal-sheet em {font-weight:400;color:#a83f57}
#timeline .ts-reveal-sheet>div {font-size:9px;letter-spacing:.14em;line-height:1.9;border-top:1px solid #af879250;padding-top:15px}
#timeline .ts-reveal-sheet>b {font-weight:400;font-size:8px;color:#906572;margin-top:13px}
/* 03: a camera preview passes into a social draft. */
#timeline .ts-art-participation {background:radial-gradient(ellipse at 55% 40%,#71213a80,transparent 68%),#140c13}
#timeline .ts-orbit {position:absolute;left:10%;top:15%;width:80%;height:70%;border:1px solid #a04d6055;border-radius:50%;transform:rotate(-30deg)}
#timeline .ts-phone {position:absolute;left:14%;top:6%;width:53%;height:87%;border:5px solid #30262b;outline:1px solid #72515d;background:#110b10;border-radius:31px;overflow:hidden;box-shadow:0 24px 50px #0009;transform:rotate(-5deg)}
#timeline .ts-phone-top {height:40px;display:flex;justify-content:space-between;gap:8px;align-items:center;padding:0 16px;color:#dfc9d1;font-size:8px}
#timeline .ts-phone-top>span:nth-child(2) {font-size:5px;letter-spacing:.12em}
#timeline .ts-phone-top>i {width:14px;height:7px;border:1px solid #dfc9d1;position:relative}
#timeline .ts-phone-top>i:before {content:'';position:absolute;inset:1px 4px 1px 1px;background:#dfc9d1}
#timeline .ts-camera {position:absolute;left:7px;right:7px;top:40px;bottom:33px;border-radius:2px 2px 19px 19px;overflow:hidden}
#timeline .ts-camera>img {position:absolute;inset:0;filter:brightness(.6)}
#timeline .ts-camera-corners {position:absolute;left:14%;top:21%;right:14%;height:45%;border:1px solid #edd3d298;border-radius:50% 50% 10% 10%;box-shadow:0 0 24px #ef344b30,inset 0 0 24px #ef344b25}
#timeline .ts-ar-label {position:absolute;left:10px;top:13px;right:10px;text-align:center;font-size:7px;letter-spacing:.15em}
#timeline .ts-ar-copy {position:absolute;left:10%;right:10%;top:36%;font-family:var(--serif);font-size:clamp(29px,3vw,48px);text-align:center;line-height:.95;color:#f0d3d6}
#timeline .ts-ar-copy>em {color:#ef9dab}
#timeline .ts-ar-copy>small {font-family:var(--sans);font-size:8px;display:block;margin-top:18px;line-height:1.8}
#timeline .ts-camera-shutter {position:absolute;width:43px;height:43px;border-radius:50%;bottom:17px;left:calc(50% - 21.5px);background:#eedbdd;border:3px solid #4a2836;outline:1px solid #eedbdd}
#timeline .ts-phone-foot {position:absolute;left:5px;right:5px;bottom:8px;color:#d1a7b7;font-size:7px;text-align:center}
#timeline .ts-story-draft {position:absolute;right:7%;top:27%;width:33%;height:51%;border:6px solid #e8d5ce;border-bottom-width:46px;box-shadow:0 16px 38px #0008;transform:rotate(7deg);background:#e8d5ce}
#timeline .ts-story-draft>span {position:absolute;bottom:-24px;left:0;right:0;font-size:5px;letter-spacing:.08em;text-align:center;color:#6d3145;white-space:nowrap}
#timeline .ts-story-draft>small {position:absolute;bottom:-38px;left:-4px;right:-4px;font-size:5px;text-align:center;color:#956573;line-height:1.4}
/* 04: a reply turns attention into a real date. */
#timeline .ts-art-conversion {background:radial-gradient(ellipse at 70% 70%,#611c3260,transparent 65%),#170d14}
#timeline .ts-dm {position:absolute;left:13%;top:7%;width:74%;height:82%;background:#21151c;border:1px solid #805364;box-shadow:0 25px 50px #07030880;transform:rotate(2deg);display:flex;flex-direction:column}
#timeline .ts-dm-head {padding:14px 19px;display:flex;gap:12px;align-items:center;border-bottom:1px solid #6b3c4c;flex:none}
#timeline .ts-dm-head>span {background:#795061;border:1px solid #b98699;border-radius:50%;width:28px;height:28px;display:grid;place-content:center;font-family:var(--serif);font-size:19px;line-height:1}
#timeline .ts-dm-head>div {font-size:11px;line-height:1.5}
#timeline .ts-dm-head small {display:block;font-size:7px;color:#b0889b}
#timeline .ts-dm-body {padding:19px 20px;display:flex;flex-direction:column;flex:1;justify-content:space-around;gap:12px}
#timeline .ts-dm-bubble {max-width:85%;align-self:flex-start;padding:10px 14px;border-radius:13px 13px 13px 2px;background:#4d3342;font-size:10px;line-height:1.8;color:#f0d8e1}
#timeline .ts-dm-out {align-self:flex-end;background:#71334c;border-radius:13px 13px 2px 13px}
#timeline .ts-invite {padding:20px 23px;background:linear-gradient(145deg,#d9b8ab,#eddbcd);color:#632c3d;width:85%;align-self:flex-end;box-shadow:0 5px 20px #0003}
#timeline .ts-invite>small {font-size:6px;letter-spacing:.13em;display:block}
#timeline .ts-invite>strong {font-family:var(--serif);font-size:clamp(30px,3.3vw,52px);font-weight:400;line-height:.85;letter-spacing:-.05em;display:block;margin:15px 0}
#timeline .ts-invite>span {display:block;font-size:7px;letter-spacing:.1em}
#timeline .ts-invite>b {display:flex;align-items:center;gap:9px;font-size:8px;font-weight:400;border-top:1px solid #99637155;margin-top:13px;padding-top:9px}
#timeline .ts-invite svg {width:12px;height:12px}
#timeline .ts-dm-status {font-size:6px;letter-spacing:.1em;color:#bf8c9f;text-align:right}
/* 05: actual people occupy the frame; the unmade gift gets a real reservation. */
#timeline .ts-art-christmas .ts-scene-bg {object-position:52% center;opacity:.83}
#timeline .ts-christmas-type {position:absolute;left:8%;right:6%;top:10%;font-family:var(--serif);font-size:clamp(37px,4vw,68px);line-height:.88;letter-spacing:-.04em;text-shadow:0 2px 20px #0008}
#timeline .ts-christmas-type em {color:#edbbc4}
#timeline .ts-polaroid {position:absolute;bottom:12%;left:9%;width:38%;height:40%;padding:7px 7px 24px;background:#e1d3c4;transform:rotate(-8deg);box-shadow:0 15px 40px #0007}
#timeline .ts-polaroid>span {display:block;color:#744958;font-size:5px;letter-spacing:.08em;text-align:center;padding-top:7px}
#timeline .ts-gift-reserve {position:absolute;right:7%;bottom:16%;width:38%;height:31%;padding:16px 13px;background:linear-gradient(130deg,#411528ed,#29131fe6);border:1px solid #bd809a87;transform:rotate(5deg);display:flex;flex-direction:column;justify-content:space-between;align-items:center;text-align:center;box-shadow:0 15px 35px #0006}
#timeline .ts-gift-reserve>span {font-size:6px;letter-spacing:.12em;color:#d4a3b5}
#timeline .ts-gift-reserve>svg {width:33px;height:33px;color:#c395a6}
#timeline .ts-gift-reserve>small {font-size:7px;line-height:1.7;color:#dcb5c2}
/* 06: a Christmas photograph travels inside a sealed message. */
#timeline .ts-art-buildup {background:linear-gradient(135deg,#160a13,#3a101e 55%,#130a11)}
#timeline .ts-buildup-halo {position:absolute;width:85%;height:85%;left:10%;top:5%;border-radius:50%;background:radial-gradient(ellipse,#a92a4d44,transparent 70%)}
#timeline .ts-memory-photo {position:absolute;top:10%;left:18%;width:48%;height:37%;background:#e9d9cf;padding:7px 7px 21px;transform:rotate(-10deg) translateY(calc(var(--ts-scene-progress) * 12px));box-shadow:0 8px 40px #0007}
#timeline .ts-memory-photo>span {display:block;color:#8a5066;text-align:center;font-size:6px;letter-spacing:.09em;padding-top:5px}
#timeline .ts-envelope {position:absolute;left:13%;top:33%;width:73%;height:35%;background:linear-gradient(135deg,#76344a,#421a2e);border:1px solid #af6c81;transform:rotate(4deg);box-shadow:0 20px 40px #0007;overflow:hidden}
#timeline .ts-envelope:after {content:'';position:absolute;inset:20% 0 0;background:linear-gradient(135deg,#5f263f,#4a1b32);clip-path:polygon(0 0,50% 65%,100% 0,100% 100%,0 100%)}
#timeline .ts-envelope-flap {position:absolute;inset:0;background:linear-gradient(140deg,#aa5b70,#76334c);clip-path:polygon(0 0,100% 0,50% 63%);z-index:1}
#timeline .ts-envelope-seal {position:absolute;left:calc(50% - 21px);top:46%;border-radius:50%;background:#c1a08a;color:#733244;width:42px;height:42px;display:grid;place-content:center;font-family:var(--serif);font-style:italic;font-size:30px;box-shadow:0 3px 10px #0006;z-index:3;line-height:1}
#timeline .ts-envelope>small {position:absolute;bottom:17px;left:18px;color:#d8b5c2;font-size:7px;letter-spacing:.15em;z-index:3}
#timeline .ts-buildup-type {position:absolute;bottom:7%;left:8%;right:8%;text-align:center;color:#e6bcc9}
#timeline .ts-buildup-type>span {display:block;font-family:var(--serif);font-size:31px;font-style:italic;line-height:1.1}
#timeline .ts-buildup-type>strong {display:block;font-size:9px;font-weight:400;letter-spacing:.22em;margin-top:10px}
#timeline .ts-buildup-type>small {display:block;font-size:7px;color:#b07d92;margin-top:9px}
/* 07: the countdown and a revealed private keepsake share the same real scene. */
#timeline .ts-art-newyear .ts-scene-bg {object-position:55% center;opacity:.85}
#timeline .ts-art-newyear .ts-scene-shade {background:linear-gradient(#21081244,#190b1577 60%,#160811d9)}
#timeline .ts-midnight-type {position:absolute;top:10%;left:6%;right:6%;text-align:center}
#timeline .ts-midnight-type>span {font-size:7px;letter-spacing:.19em;color:#e7b8c9;display:block}
#timeline .ts-midnight-type>strong {font-family:var(--serif);font-size:clamp(100px,12vw,170px);font-weight:400;letter-spacing:-.075em;line-height:1.06;display:block;color:#ffe4e2;text-shadow:0 0 50px #e12c5f66}
#timeline .ts-midnight-type>em {display:block;font-family:var(--serif);font-size:27px;line-height:1;color:#e4b7c8}
#timeline .ts-open-message {position:absolute;left:23%;bottom:9%;width:58%;min-height:35%;padding:24px;background:#ecdbd0;color:#76384d;transform:rotate(-5deg);box-shadow:0 16px 38px #0007;display:flex;flex-direction:column;justify-content:space-between}
#timeline .ts-open-message>small {font-size:6px;letter-spacing:.12em;display:block}
#timeline .ts-open-message>span {font-family:var(--serif);font-size:clamp(30px,3.7vw,53px);letter-spacing:-.04em;line-height:.83;margin:18px 0}
#timeline .ts-open-message>b {font-size:6px;font-weight:400;color:#9d7380}
#timeline .ts-midnight-rules {position:absolute;left:7%;top:6%;right:7%;bottom:6%;border:1px solid #e7b0c633;pointer-events:none}
/* 08: the campaign becomes an archive, rather than disappearing at midnight. */
#timeline .ts-art-afterglow {background:radial-gradient(ellipse at 30% 65%,#6a324333,transparent 70%),#180d15}
#timeline .ts-archive-title {position:absolute;top:8%;left:8%;right:8%;z-index:3}
#timeline .ts-archive-title>small {display:block;font-size:7px;letter-spacing:.12em;color:#a67b8d;margin-bottom:20px}
#timeline .ts-archive-title>span {font-family:var(--serif);font-size:clamp(37px,4vw,65px);line-height:.86;letter-spacing:-.045em;color:#e8d0d6}
#timeline .ts-archive-title em {color:#bb8da1}
#timeline .ts-archive-image {position:absolute;padding:7px 7px 24px;background:#d9c9be;box-shadow:0 14px 35px #0008}
#timeline .ts-archive-image>span {display:block;text-align:center;padding-top:6px;font-size:6px;color:#754457;letter-spacing:.07em}
#timeline .ts-archive-one {left:8%;top:44%;width:54%;height:39%;transform:rotate(-8deg);z-index:2}
#timeline .ts-archive-two {right:6%;top:36%;width:45%;height:43%;transform:rotate(9deg);z-index:1}
@media(min-width:1500px) {
  #timeline.timeline-scroll {grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr);gap:7vw}
  #timeline .ts-step-copy {max-width:560px}
  #timeline .ts-goal {font-size:17px}
  #timeline .ts-description,#timeline .ts-source-detail {font-size:16px}
}
@media(min-width:861px) and (max-height:760px) {
  #timeline .ts-stage {top:calc(var(--story-header,82px) + 10px);min-height:480px;height:calc(100svh - var(--story-header,82px) - 25px)}
  #timeline .ts-visual-stack {min-height:310px}
  #timeline .ts-stage-meta {font-size:8px;margin-bottom:8px}
  #timeline .ts-photo-note {font-size:8px!important;margin:6px 0!important}
  #timeline .ts-navigation a {padding:7px 0}
  #timeline .ts-navigation a>b {font-size:8px}
  #timeline .ts-dm-body {padding-top:12px;padding-bottom:12px;gap:7px}
  #timeline .ts-dm-bubble {padding:7px 12px;font-size:9px}
  #timeline .ts-invite {padding:14px 20px}
  #timeline .ts-invite>strong {margin:10px 0;font-size:37px}
  #timeline .ts-invite>b {margin-top:10px;padding-top:7px;font-size:7px}
  #timeline .ts-poll {padding:16px}
  #timeline .ts-poll>strong {font-size:26px;margin:10px 0}
  #timeline .ts-midnight-type>strong {font-size:110px}
}
@media(max-width:1100px) and (min-width:861px) {
  #timeline.timeline-scroll {grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:35px}
  #timeline .ts-step h3 {font-size:43px}
  #timeline .ts-goal {font-size:15px}
  #timeline .ts-description {font-size:15px}
  #timeline .ts-navigation {gap:0 9px}
  #timeline .ts-navigation a {gap:4px}
  #timeline .ts-navigation a>b {font-size:8px}
  #timeline .ts-dm {left:8%;width:84%}
  #timeline .ts-dm-body {padding-left:14px;padding-right:14px}
}
@media(max-width:860px) {
  #timeline.timeline-scroll {display:block}
  #timeline .ts-stage {display:none}
  #timeline .ts-step {display:block;min-height:100svh;padding:28px 0 65px;scroll-margin-top:25px;border-bottom:1px solid #633345}
  #timeline .ts-step:first-child {padding-top:0}
  #timeline .ts-mobile-visual {display:block;margin:0 0 30px}
  #timeline .ts-mobile-visual .ts-art {height:clamp(380px,65svh,650px);min-height:0;width:100%}
  #timeline .ts-step-copy {max-width:100%}
  #timeline .ts-step-meta {padding-top:14px;font-size:12px}
  #timeline .ts-step-meta small {font-size:8px}
  #timeline .ts-step-number {margin-top:24px;margin-bottom:15px;font-size:10px}
  #timeline .ts-step h3 {font-size:clamp(46px,10vw,72px);max-width:12em;line-height:1;margin-bottom:15px}
  #timeline .ts-step h4 {font-size:17px;line-height:1.7;margin-bottom:24px}
  #timeline .ts-goal {font-size:15px;line-height:1.95;margin-bottom:22px}
  #timeline .ts-description,#timeline .ts-source-detail {font-size:15px;line-height:2.05}
  #timeline .ts-photo-note {font-size:8px!important;margin-top:9px!important}
  #timeline .ts-snippet {font-size:10px;margin-top:10px;padding-top:16px}
  #timeline .ts-tease-type>span {font-size:clamp(47px,10vw,82px)}
  #timeline .ts-reveal-sheet>span {font-size:clamp(46px,10vw,82px)}
  #timeline .ts-reveal-sheet>small {font-size:9px}
  #timeline .ts-reveal-sheet>div {font-size:10px}
  #timeline .ts-reveal-sheet>b {font-size:9px}
  #timeline .ts-art-participation .ts-phone {max-width:290px}
  #timeline .ts-ar-copy {font-size:clamp(36px,8vw,59px)}
  #timeline .ts-story-draft {max-width:200px}
  #timeline .ts-dm {max-width:400px;left:50%;transform:translateX(-50%) rotate(2deg);width:79%}
  #timeline .ts-invite>strong {font-size:clamp(40px,10vw,63px)}
  #timeline .ts-dm-bubble {font-size:11px}
  #timeline .ts-dm-head>div {font-size:12px}
  #timeline .ts-christmas-type {font-size:clamp(45px,10vw,75px)}
  #timeline .ts-polaroid>span {font-size:6px}
  #timeline .ts-gift-reserve>span {font-size:7px}
  #timeline .ts-gift-reserve>small {font-size:8px}
  #timeline .ts-midnight-type>strong {font-size:clamp(100px,24vw,170px)}
  #timeline .ts-midnight-type>span {font-size:8px}
  #timeline .ts-open-message>span {font-size:clamp(39px,9vw,65px)}
  #timeline .ts-archive-title>span {font-size:clamp(45px,10vw,75px)}
}
@media(max-width:420px) {
  #timeline .ts-mobile-visual .ts-art {height:clamp(380px,60svh,490px)}
  #timeline .ts-corner-mark {left:18px;bottom:18px;font-size:7px}
  #timeline .ts-poll {padding:16px;width:65%}
  #timeline .ts-poll>strong {font-size:27px;margin:12px 0}
  #timeline .ts-poll b {font-size:7px;padding:9px 4px}
  #timeline .ts-reveal-sheet {padding:8% 7% 6%;width:75%;left:11%}
  #timeline .ts-reveal-sheet>small {font-size:7px}
  #timeline .ts-reveal-sheet>div {font-size:8px}
  #timeline .ts-reveal-sheet>b {font-size:7px}
  #timeline .ts-phone {left:11%;width:58%;border-radius:27px}
  #timeline .ts-phone-top {padding:0 12px;font-size:7px}
  #timeline .ts-phone-top>span:nth-child(2) {font-size:4px}
  #timeline .ts-dm {width:83%;top:6%;height:83%}
  #timeline .ts-dm-head {padding:11px 14px}
  #timeline .ts-dm-body {padding:13px 14px;gap:9px}
  #timeline .ts-dm-bubble {font-size:9px;padding:8px 11px}
  #timeline .ts-invite {padding:17px 18px}
  #timeline .ts-invite>strong {font-size:40px;margin:12px 0}
  #timeline .ts-invite>b {font-size:7px;margin-top:10px;padding-top:8px}
  #timeline .ts-christmas-type {font-size:45px}
  #timeline .ts-midnight-type>strong {font-size:105px}
  #timeline .ts-midnight-type>em {font-size:25px}
  #timeline .ts-open-message {left:23%;width:62%;padding:20px}
  #timeline .ts-open-message>span {font-size:39px}
  #timeline .ts-archive-title>span {font-size:45px}
}
@media(prefers-reduced-motion:reduce) {
  #timeline .ts-desktop-scene {transition:none;transform:none}
  #timeline .ts-scene-bg,#timeline .ts-memory-photo {transform:none}
  #timeline .ts-progress-track>span,#timeline .ts-navigation a {transition:none}
}
@media print {
  #timeline.timeline-scroll {display:block}
  #timeline .ts-stage {display:none}
  #timeline .ts-step {min-height:0;padding:25px 0;break-inside:avoid}
  #timeline .ts-mobile-visual {display:block}
  #timeline .ts-mobile-visual .ts-art {height:360px}
}