
    :root{
      color-scheme:light dark;
      --bg:#fbf6f3; --paper:#fffdfb; --ink:#35252d; --muted:#755f69; --wine:#74394e;
      --rose:#dca4ad; --rose-soft:#f4dde0; --sage:#9bab91; --cream:#f2e8d5; --line:rgba(79,47,59,.14); --deep:#244e7a;
      --shadow:0 26px 70px rgba(67,38,49,.15); --shadow-soft:0 14px 35px rgba(67,38,49,.1);
      --envelope:#efc4cd; --envelope-deep:#dda2ae; --envelope-fold:#e9b4bf; --seal:#8a425b;
    }
    @media(prefers-color-scheme:dark){:root{
      --bg:#1b1518; --paper:#251c20; --ink:#fff5f6; --muted:#d4c0c8; --wine:#d994a8;
      --rose:#cf8799; --rose-soft:#4a2833; --sage:#aabd9c; --cream:#3c3229; --line:rgba(255,241,245,.14); --deep:#182f4b;
      --shadow:0 26px 70px rgba(0,0,0,.38); --shadow-soft:0 14px 35px rgba(0,0,0,.28);
      --envelope:#6d3b4c; --envelope-deep:#7d4559; --envelope-fold:#58303f; --seal:#d994a8;
    }}
    *{box-sizing:border-box}
    html{scroll-behavior:smooth;overflow-x:hidden}
    html.inertial-wheel{scroll-behavior:auto}
    body{margin:0;overflow-x:hidden;background:var(--bg);color:var(--ink);font-family:"Be Vietnam Pro",sans-serif;line-height:1.65}
    main{width:100%;overflow:hidden}
    button,input,textarea{font:inherit} button{color:inherit} img,video{display:block;width:100%} a{color:inherit}
    h1,h2,h3,p,figure,blockquote{margin-top:0}
    ::selection{background:var(--rose-soft)}
    .ink-cursor-visual{position:fixed;z-index:80;left:0;top:0;width:40px;height:40px;pointer-events:none;opacity:0;transform:translate(-2px,-38px) scale(.74) rotate(-5deg);transform-origin:2px 38px;background:center/contain no-repeat url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27160%27%20height%3D%27160%27%20viewBox%3D%270%200%20160%20160%27%3E%3Cg%20transform%3D%27translate%2842%2C42%29%27%20fill%3D%27none%27%20stroke%3D%27%23c98ba0%27%20stroke-width%3D%271%27%20opacity%3D%27.22%27%3E%3Cellipse%20cx%3D%270%27%20cy%3D%27-7%27%20rx%3D%273%27%20ry%3D%275.8%27%2F%3E%3Cellipse%20cx%3D%270%27%20cy%3D%27-7%27%20rx%3D%273%27%20ry%3D%275.8%27%20transform%3D%27rotate%2872%29%27%2F%3E%3Cellipse%20cx%3D%270%27%20cy%3D%27-7%27%20rx%3D%273%27%20ry%3D%275.8%27%20transform%3D%27rotate%28144%29%27%2F%3E%3Cellipse%20cx%3D%270%27%20cy%3D%27-7%27%20rx%3D%273%27%20ry%3D%275.8%27%20transform%3D%27rotate%28216%29%27%2F%3E%3Cellipse%20cx%3D%270%27%20cy%3D%27-7%27%20rx%3D%273%27%20ry%3D%275.8%27%20transform%3D%27rotate%28288%29%27%2F%3E%3Ccircle%20cx%3D%270%27%20cy%3D%270%27%20r%3D%272%27%20fill%3D%27%23c98ba0%27%20stroke%3D%27none%27%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%23c98ba0%27%20stroke-width%3D%271%27%20opacity%3D%27.16%27%3E%3Cpath%20d%3D%27M104%20132%20Q114%20122%20126%20118%27%2F%3E%3Cellipse%20cx%3D%27113%27%20cy%3D%27125%27%20rx%3D%275.2%27%20ry%3D%272.4%27%20transform%3D%27rotate%28-32%20113%20125%29%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");filter:drop-shadow(0 4px 5px rgba(16,39,62,.25));transition:opacity .14s ease,transform .22s cubic-bezier(.16,1,.3,1)}
    @media(pointer:fine){body.pen-cursor #gui-loi-chuc input,body.pen-cursor #gui-loi-chuc textarea,body.pen-cursor .feedback-form input,body.pen-cursor .feedback-form textarea{cursor:none!important}body.pen-cursor .ink-cursor-visual{opacity:1;transform:translate(-2px,-38px) scale(1) rotate(0)}}

    /* full-width navigation */
    .site-nav{position:fixed;left:0;right:0;top:0;z-index:30;width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:24px;padding:8px max(24px,calc((100vw - 1160px)/2));color:#fff8fa;background:linear-gradient(90deg,rgba(17,48,77,.64),rgba(36,78,122,.52));border:0;border-bottom:1px solid rgba(255,255,255,.28);box-shadow:0 12px 34px rgba(9,24,39,.18),inset 0 1px 0 rgba(255,255,255,.11);backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);animation:navArrive .8s .7s cubic-bezier(.16,1,.3,1) both;transition:color .35s ease,background .35s ease,border-color .35s ease,box-shadow .35s ease,transform .45s cubic-bezier(.16,1,.3,1)}
    @keyframes navArrive{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}
    .nav-brand{display:flex;align-items:center;gap:12px;min-width:0;justify-self:start;font-size:.72rem;font-weight:600;white-space:nowrap;cursor:pointer}
    .nav-brand img{width:82px;height:40px;object-fit:contain;filter:brightness(0) invert(1)}
    .nav-brand-separator{width:1px;height:24px;background:currentColor;opacity:.45}
    .nav-brand-title{overflow:hidden;text-overflow:ellipsis}
    .nav-links{display:flex;align-items:center;justify-content:center;gap:clamp(18px,2.8vw,36px);min-width:0}
    .site-nav a{position:relative;color:inherit;text-decoration:none;font-size:.78rem;font-weight:600;white-space:nowrap}
    .nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .35s cubic-bezier(.16,1,.3,1)}
    .nav-links a:hover::after,.nav-links a[aria-current="true"]::after{transform:scaleX(1);transform-origin:left}
    .nav-actions{justify-self:end;display:flex;align-items:center;gap:8px}
    .nav-game{display:inline-flex;align-items:center;gap:9px;padding:10px 18px;border-radius:999px;border:1px solid rgba(255,255,255,.52);background:#fff8fa;color:#244e7a!important;box-shadow:0 8px 20px rgba(8,24,39,.18);transition:transform .25s ease,background .25s ease}
    .nav-game:hover{transform:translateY(-2px);background:#f3c5cf}.nav-game svg{width:15px;height:15px}
    .language-toggle{min-width:34px;height:40px;padding:0 6px;border:0;background:transparent;color:inherit;display:grid;place-items:center;cursor:pointer;font-size:.7rem;font-weight:600;letter-spacing:.08em;line-height:1;transition:transform .25s ease,opacity .25s ease}
    .language-toggle:hover{transform:translateY(-2px);opacity:.72}.language-toggle:focus-visible{outline:2px solid currentColor;outline-offset:3px}.language-code{display:block}
    .site-nav.is-scrolled{color:var(--ink);background:color-mix(in srgb,var(--paper) 74%,transparent);border-color:color-mix(in srgb,var(--line) 78%,rgba(255,255,255,.25));box-shadow:0 12px 32px rgba(48,30,39,.11),inset 0 1px 0 rgba(255,255,255,.18)}
    .site-nav.is-scrolled .nav-brand img{filter:brightness(0)}
    @media(prefers-color-scheme:dark){.site-nav.is-scrolled .nav-brand img{filter:brightness(0) invert(1)}}
    .site-nav.is-scrolled .nav-game{background:var(--deep);color:#fff!important}
    .site-nav.is-scrolled .language-toggle{color:var(--deep)}
    .serif{font-family:"Playfair Display",serif}
    .wrap{width:min(1160px,calc(100% - 48px));margin-inline:auto}
    .eyebrow{font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--wine)}
    .section-title{font:500 clamp(2.65rem,5.5vw,5.5rem)/1.03 "Playfair Display",serif;letter-spacing:-.035em;margin-bottom:22px}
    .section-title em{font-weight:500;color:var(--wine)}
    .petal-field{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:12;contain:strict}
    .petal{position:absolute;top:-10vh;left:var(--left);width:var(--size);height:calc(var(--size)*1.35);border-radius:68% 32% 72% 28% / 72% 30% 70% 28%;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.92) 0 8%,transparent 9%),linear-gradient(145deg,#ffe8ee 0 30%,#f3aebd 62%,#cf718c 100%);box-shadow:inset -1px -2px 3px rgba(127,42,68,.2),0 2px 7px rgba(91,39,57,.12);opacity:0;animation:petalFall var(--duration) linear infinite;animation-delay:var(--delay);transform-origin:45% 20%}
    .petal::after{content:"";position:absolute;left:48%;top:13%;width:1px;height:68%;background:linear-gradient(rgba(123,48,72,.02),rgba(123,48,72,.28),transparent);transform:rotate(14deg);transform-origin:top}
    .petal.blossom{height:var(--size);border-radius:50%;background:radial-gradient(circle,#c95d7d 0 8%,#f7bfd0 9% 24%,transparent 25%),conic-gradient(from 10deg,#ffdce7 0 15%,transparent 16% 20%,#f5b5c7 21% 35%,transparent 36% 40%,#ffe4eb 41% 55%,transparent 56% 60%,#efa6bb 61% 75%,transparent 76% 80%,#ffd7e2 81% 95%,transparent 96%);box-shadow:none}
    .petal.pale{background:radial-gradient(circle at 34% 28%,#fff 0 7%,transparent 8%),linear-gradient(150deg,#fff4f7,#f8cad5 65%,#df8ea5);filter:saturate(.82)}
    @keyframes petalFall{0%{transform:translate3d(0,-12vh,0) rotate(0deg) rotateY(0);opacity:0}4%{opacity:var(--opacity,.54)}45%{transform:translate3d(var(--sway,36px),48vh,0) rotate(190deg) rotateY(120deg);opacity:var(--opacity,.54)}88%{opacity:calc(var(--opacity,.54)*.8)}100%{transform:translate3d(var(--drift,70px),116vh,0) rotate(430deg) rotateY(240deg);opacity:0}}

    /* opening */
    .hero{min-height:100svh;position:relative;display:grid;align-items:center;overflow:hidden;padding:64px 0 80px;background:linear-gradient(108deg,#244e7a 0 48%,#efc0c8 48% 72%,var(--rose-soft) 72%);isolation:isolate;--px:0;--py:0}
    .hero-texture{position:absolute;inset:0 auto 0 0;width:48%;z-index:-1;pointer-events:none;background:radial-gradient(circle,rgba(255,255,255,.18) 0 1px,transparent 2px) 0 0/24px 24px;opacity:.72}
    .hero::before{content:"20·10";position:absolute;right:-.04em;bottom:-.2em;font:500 clamp(10rem,24vw,23rem)/1 "Playfair Display",serif;color:rgba(36,78,122,.09);letter-spacing:-.08em;z-index:-1;pointer-events:none}
    .hero::after{content:"";position:absolute;width:520px;height:520px;border:1px solid rgba(36,78,122,.16);border-radius:50%;right:-170px;top:-180px;box-shadow:0 0 0 52px transparent,0 0 0 53px rgba(36,78,122,.12),0 0 0 105px transparent,0 0 0 106px rgba(36,78,122,.08);z-index:-1}
    .hero-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:clamp(34px,7vw,100px);align-items:center}
    .hero-copy{color:#fff8fa;position:relative;z-index:2}
    .date-line{display:flex;align-items:center;gap:14px;margin-bottom:26px;color:#f1bdc8;font-weight:600;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase}.date-line .brand{text-transform:lowercase;font-size:1.4em;letter-spacing:.03em}
    .date-line::before{content:"";width:42px;height:1px;background:currentColor;transform-origin:left;animation:drawLine 1s .25s cubic-bezier(.16,1,.3,1) both}
    .date-line::after{content:"";width:42px;height:1px;background:currentColor;transform-origin:right;animation:drawLine 1s .25s cubic-bezier(.16,1,.3,1) both}
    @keyframes drawLine{from{transform:scaleX(0)}to{transform:scaleX(1)}}
    h1{font:500 clamp(3.2rem,6.08vw,6.56rem)/.86 "Playfair Display",serif;letter-spacing:-.055em;margin:0 0 28px;max-width:720px}
    h1 .hero-line{display:block;overflow:hidden;padding-bottom:.22em;margin-bottom:-.14em}
    h1 .hero-line>span{display:block;transform:translateY(110%) rotate(3deg);animation:titleRise .95s .18s cubic-bezier(.16,1,.3,1) forwards}
    h1 .hero-line:nth-child(2)>span{animation-delay:.34s}
    @keyframes titleRise{to{transform:none}}
    h1 i{display:block;font-size:.8em;font-weight:500;color:#f3bac6;padding-left:.28em}
    .hero-copy>p{max-width:540px;color:#f2dfe4;font-size:clamp(1rem,1.4vw,1.18rem)}
    .soft-btn{display:inline-flex;align-items:center;justify-content:center;gap:11px;border:0;background:var(--wine);color:#fff8fa;padding:14px 22px;border-radius:999px;text-decoration:none;font-weight:600;cursor:pointer;box-shadow:0 10px 25px rgba(116,57,78,.2);transition:transform .25s ease,background .25s ease}
    .soft-btn:hover{transform:translateY(-2px);background:#8b4860}.soft-btn svg{width:17px;height:17px}
    .hero-copy .soft-btn{background:#fff8fa;color:#244e7a;box-shadow:0 14px 34px rgba(20,7,13,.28)}.hero-copy .soft-btn:hover{background:#f3c5cf;transform:translateY(-3px)}
    .ghost-btn{background:transparent;color:var(--ink);border:1px solid var(--line);box-shadow:none}.ghost-btn:hover{background:var(--rose-soft)}
    .hero-photo{position:relative;height:min(72vw,710px);max-height:710px;min-height:580px;perspective:1100px}
    .portrait{position:absolute;overflow:hidden;background:var(--paper);box-shadow:var(--shadow);padding:10px 10px 48px;will-change:transform;clip-path:inset(0 0 100% 0);animation:uncover .95s .3s cubic-bezier(.16,1,.3,1) forwards;transition:transform .85s cubic-bezier(.16,1,.3,1),box-shadow .45s ease}
    .portrait.small{animation-delay:.62s}
    @keyframes uncover{to{clip-path:inset(0 0 0 0)}}
    .portrait img{height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.16,1,.3,1)}.portrait:hover img{transform:scale(1.04)}
    .portrait.main{width:73%;height:72%;right:4%;top:8%;transform:translate3d(calc(var(--px)*12px),calc(var(--scroll,0)*-60px + var(--py)*10px),0) rotate(calc(2.5deg + var(--px)*1deg))}
    .portrait.small{width:48%;height:43%;left:0;bottom:3%;transform:translate3d(calc(var(--px)*-16px),calc(var(--scroll,0)*55px + var(--py)*-12px),0) rotate(calc(-5deg + var(--px)*-1.4deg))}
    .hero-photo.is-playful .portrait.main{transform:translate3d(calc(-4% + var(--px)*12px),calc(var(--scroll,0)*-60px + var(--py)*10px),0) rotate(-1.5deg)}
    .hero-photo.is-playful .portrait.small{transform:translate3d(calc(9% + var(--px)*-16px),calc(var(--scroll,0)*55px + var(--py)*-12px),0) rotate(3deg)}
    .portrait figcaption{position:absolute;bottom:13px;left:18px;font:500 1.02rem/1.2 "Playfair Display",serif;color:#4a2c38}
    @media(prefers-color-scheme:dark){.portrait figcaption{color:#4a2c38}}
    .seal{position:absolute;right:0;bottom:8%;width:126px;aspect-ratio:1;border-radius:50%;background:var(--sage);color:#1f2b1d;display:grid;place-items:center;text-align:center;font:500 .9rem/1.2 "Playfair Display",serif;transform:rotate(-10deg);box-shadow:var(--shadow-soft);z-index:4}.seal strong{display:block;font-size:2rem}

    /* editorial image slider */
    .memories{padding:clamp(88px,11vw,150px) 0;background-color:var(--paper);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27160%27%20height%3D%27160%27%20viewBox%3D%270%200%20160%20160%27%3E%3Cg%20transform%3D%27translate%2838%2C38%29%27%20fill%3D%27none%27%20stroke%3D%27%23c98ba0%27%20stroke-width%3D%271.1%27%20opacity%3D%27.5%27%3E%3Cellipse%20cx%3D%270%27%20cy%3D%27-8%27%20rx%3D%273.4%27%20ry%3D%276.5%27%2F%3E%3Cellipse%20cx%3D%270%27%20cy%3D%27-8%27%20rx%3D%273.4%27%20ry%3D%276.5%27%20transform%3D%27rotate%2872%29%27%2F%3E%3Cellipse%20cx%3D%270%27%20cy%3D%27-8%27%20rx%3D%273.4%27%20ry%3D%276.5%27%20transform%3D%27rotate%28144%29%27%2F%3E%3Cellipse%20cx%3D%270%27%20cy%3D%27-8%27%20rx%3D%273.4%27%20ry%3D%276.5%27%20transform%3D%27rotate%28216%29%27%2F%3E%3Cellipse%20cx%3D%270%27%20cy%3D%27-8%27%20rx%3D%273.4%27%20ry%3D%276.5%27%20transform%3D%27rotate%28288%29%27%2F%3E%3Ccircle%20cx%3D%270%27%20cy%3D%270%27%20r%3D%272.4%27%20fill%3D%27%23c98ba0%27%20stroke%3D%27none%27%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%239bab91%27%20stroke-width%3D%271.1%27%20opacity%3D%27.45%27%3E%3Cpath%20d%3D%27M100%20132%20Q112%20120%20126%20114%27%2F%3E%3Cellipse%20cx%3D%27110%27%20cy%3D%27123%27%20rx%3D%276%27%20ry%3D%272.8%27%20transform%3D%27rotate%28-35%20110%20123%29%27%2F%3E%3Cellipse%20cx%3D%27121%27%20cy%3D%27116%27%20rx%3D%276%27%20ry%3D%272.8%27%20transform%3D%27rotate%28-35%20121%20116%29%27%2F%3E%3C%2Fg%3E%3Ccircle%20cx%3D%2782%27%20cy%3D%2748%27%20r%3D%271.6%27%20fill%3D%27%23c98ba0%27%20opacity%3D%27.35%27%2F%3E%3Ccircle%20cx%3D%2758%27%20cy%3D%27100%27%20r%3D%271.6%27%20fill%3D%27%239bab91%27%20opacity%3D%27.35%27%2F%3E%3C%2Fsvg%3E");background-size:160px 160px;overflow:hidden}
    .slider-shell{display:grid;grid-template-columns:minmax(0,1.42fr) minmax(250px,.58fr);box-shadow:var(--shadow);background:var(--bg)}
    .slider-media{display:flex;flex-direction:column;min-width:0}
    .slider-controls-bar{padding:20px clamp(20px,3vw,34px) 26px}
    .slider-dots{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;row-gap:9px}
    .slider-viewport{position:relative;overflow:hidden;aspect-ratio:3/2;min-height:300px;touch-action:pan-y;background:#172c43}
    .slide{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility .8s}
    .slide.active{opacity:1;visibility:visible;z-index:1}
    .slide img{height:100%;object-fit:cover;transform:scale(1.04);will-change:transform}
    .slide.active img{animation:slowFocus 7s ease-out both}
    @keyframes slowFocus{from{transform:scale(1.04)}to{transform:scale(1)}}
    .slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(13,35,55,.78))}
    .slide figcaption{position:absolute;left:20px;bottom:18px;z-index:2;padding:8px 16px;border-radius:999px;background:rgba(18,8,13,.55);color:#fff8fa;font-size:.8rem;font-weight:700;letter-spacing:.14em;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.25);width:max-content;max-width:calc(100% - 40px)}
    .slider-panel{display:flex;flex-direction:column;justify-content:center;padding:clamp(30px,4vw,54px);border-left:1px solid var(--line)}
    .slider-panel .section-title{font-size:clamp(2.5rem,3.4vw,3.8rem);margin:12px 0 18px}
    .slider-panel .section-title em,.film-copy .section-title em{font-size:.8em}
    .slider-panel>div>p:last-child{color:var(--muted);max-width:340px}
    .slider-bottom{display:flex;align-items:center;justify-content:center;gap:26px;margin-top:18px}
    .slide-count{font:500 1.15rem "Playfair Display",serif;color:var(--wine);white-space:nowrap}.slide-count strong{font-size:2.1rem;font-weight:500}
    .slider-controls{display:flex;gap:8px}.slider-btn{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:background .25s ease,color .25s ease}.slider-btn:hover{background:var(--wine);color:#fff}.slider-btn svg{width:19px;height:19px}
    .slider-dots{display:flex;flex-wrap:wrap;gap:7px;row-gap:9px;margin-top:26px}.slider-dot{width:22px;height:3px;padding:0;border:0;background:var(--line);cursor:pointer;transition:width .3s ease,background .3s ease}.slider-dot.active{width:42px;background:var(--wine)}

    /* moving messages */
    .messages{padding:clamp(88px,10vw,132px) 0 0;background:var(--deep);color:#fff7f9;overflow:hidden;position:relative}
    .messages.is-open{overflow-x:clip;overflow-y:visible}
    .messages::before{content:"“";position:absolute;right:4vw;top:-85px;font:500 22rem/1 "Playfair Display",serif;color:rgba(255,255,255,.045);pointer-events:none}
    .messages-head{text-align:center;margin:0 auto 42px;padding:0 20px;position:relative}.messages-head .eyebrow{color:#efbdc8}.messages-head h2{font:500 clamp(2.3rem,4.7vw,4.8rem)/1.05 "Playfair Display",serif;margin:8px 0 0}.messages-head h2 em{font-weight:500;color:#f2bac7}
    .message-rail{position:relative;width:100%;isolation:isolate}
    .message-lane{overflow:hidden;cursor:grab;touch-action:pan-y pinch-zoom;mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.12) 2%,rgba(0,0,0,.56) 5%,#000 9%,#000 91%,rgba(0,0,0,.56) 95%,rgba(0,0,0,.12) 98%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.12) 2%,rgba(0,0,0,.56) 5%,#000 9%,#000 91%,rgba(0,0,0,.56) 95%,rgba(0,0,0,.12) 98%,transparent 100%)}
    .message-lane.is-dragging{cursor:grabbing}.message-lane.is-dragging .message-card{pointer-events:none}
    .message-track{display:flex;width:max-content;gap:18px;will-change:transform;transform:translate3d(0,0,0);backface-visibility:hidden}
    .message-edge{position:absolute;inset-block:0;z-index:4;width:max(8%,72px);display:grid;place-items:center;pointer-events:auto}.message-edge.prev{left:0}.message-edge.next{right:0}
    .message-arrow{width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.42);background:rgba(255,255,255,.13);color:#fff;display:grid;place-items:center;cursor:pointer;opacity:0;transform:scale(.88);backdrop-filter:blur(7px);transition:opacity .25s ease,transform .3s cubic-bezier(.16,1,.3,1),background .25s ease;pointer-events:auto}.message-arrow svg{width:21px;height:21px}
    .message-edge:hover .message-arrow,.message-edge:focus-within .message-arrow{opacity:1;transform:scale(1)}.message-arrow:hover{background:rgba(255,255,255,.24)}.message-arrow:focus-visible{outline:2px solid #fff;outline-offset:3px}
    .message-card{width:clamp(280px,32vw,430px);min-height:178px;padding:28px 30px;background:var(--paper);color:var(--ink);border-top:4px solid var(--rose);box-shadow:0 18px 45px rgba(15,6,10,.24);display:flex;flex-direction:column;justify-content:space-between}
    .message-card:nth-child(even){border-top-color:var(--sage)}
    .message-card blockquote{font:500 clamp(1.15rem,1.7vw,1.4rem)/1.45 "Playfair Display",serif;margin:0 0 22px}.message-card p{margin:0;color:var(--wine);font-size:.77rem;font-weight:600;letter-spacing:.04em}
    .compose-launch{display:flex;justify-content:center;padding:44px 24px 52px;position:relative}.compose-toggle{min-width:min(360px,100%);padding:16px 24px;border:1px solid rgba(255,255,255,.28);background:#fff7f9;color:#522638;border-radius:999px;font-weight:600;cursor:pointer;box-shadow:0 15px 35px rgba(18,7,12,.25);transition:transform .25s ease,background .25s ease}.compose-toggle:hover{transform:translateY(-3px);background:#f5dce2}.compose-toggle svg{width:18px;height:18px;vertical-align:-4px;margin-left:9px;transition:transform .45s cubic-bezier(.16,1,.3,1)}.compose-toggle[aria-expanded="true"] svg{transform:rotate(180deg)}
    @keyframes ticker{from{transform:translateX(calc(-50% - 11px))}to{transform:translateX(0)}}
    @keyframes cardBreathe{0%,100%{translate:0 0}50%{translate:0 -7px}}

    /* video */
    .film{padding:clamp(100px,13vw,170px) 0;background-color:var(--cream);background-image:repeating-linear-gradient(to bottom,transparent 0 30px,rgba(116,57,78,.06) 30px 31px)}
    .film-grid{display:grid;grid-template-columns:.62fr 1.38fr;gap:clamp(40px,7vw,90px);align-items:center}
    .film-copy p{color:var(--muted)}
    .video-frame video{aspect-ratio:3/2;object-fit:contain;background:#120d10}
    /* video recap slider (past October 20 celebrations) */
    .video-slider{min-width:0}
    .video-viewport{position:relative;overflow:hidden;aspect-ratio:16/9;background:#172c43;box-shadow:var(--shadow);border-radius:8px;touch-action:pan-y}
    .vslide{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility .8s}
    .vslide.active{opacity:1;visibility:visible;z-index:1}
    .vslide-btn{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;cursor:pointer;background:none;display:block}
    .vslide-btn img{width:100%;height:100%;object-fit:cover;display:block}
    .vslide figcaption{position:absolute;left:16px;bottom:58px;z-index:2;padding:7px 14px;border-radius:999px;background:rgba(18,8,13,.55);color:#fff8fa;font-size:.78rem;font-weight:700;letter-spacing:.14em;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.25);width:max-content}
    .vplay{position:absolute;left:50%;top:50%;translate:-50% -50%;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:rgba(255,248,250,.94);color:var(--wine);box-shadow:0 12px 30px rgba(10,5,9,.35);transition:transform .35s cubic-bezier(.16,1,.3,1);z-index:2;pointer-events:none}
    .vplay svg{width:25px;height:25px;margin-left:3px}
    .vslide-btn:hover .vplay{transform:scale(1.12)}
    .video-dots{display:flex;justify-content:center;gap:7px;margin-top:22px}
    .video-dot{width:22px;height:3px;padding:0;border:0;background:var(--line);cursor:pointer;transition:width .3s ease,background .3s ease}
    .video-dot.active{width:42px;background:var(--wine)}
    .video-bottom{display:flex;align-items:center;justify-content:center;gap:26px;margin-top:26px}
    .vslide video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000;display:none;z-index:2}
    .vslide-count{font:500 1.15rem "Playfair Display",serif;color:var(--wine);white-space:nowrap}
    .vslide-count strong{font-size:2.1rem;font-weight:500}
    /* video recap of past October 20 celebrations */


    /* composer */
    .compose{background:var(--bg);color:var(--ink);position:relative;overflow:hidden;display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .65s cubic-bezier(.16,1,.3,1),opacity .35s ease}
    .compose.open{grid-template-rows:1fr;opacity:1;transition:grid-template-rows .65s .48s cubic-bezier(.16,1,.3,1),opacity .35s .55s ease}
    .compose-inner{overflow:hidden}.compose.open .compose-inner{overflow:visible}
    .compose-stage{padding:clamp(82px,11vw,140px) 0;position:relative}
    .compose-stage::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:var(--rose-soft);left:-230px;top:80px;z-index:0}
    .compose-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(40px,8vw,110px);align-items:start;position:relative;z-index:1}
    .compose-copy{position:sticky;top:50px}.compose-copy p{color:var(--muted);max-width:430px}
    .compose-panel{background:var(--paper);box-shadow:var(--shadow);padding:clamp(24px,4vw,52px);position:relative}
    .compose-panel::before{content:"";position:absolute;inset:12px;border:1px solid var(--line);pointer-events:none}
    .form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field{margin-bottom:20px;position:relative;z-index:1}
    label{display:block;font-size:.79rem;font-weight:600;margin-bottom:8px;color:var(--muted)}
    .optional-note{font-weight:400;opacity:.58}
    input,textarea{width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--ink);padding:11px 3px;outline:none;border-radius:0}
    input:focus,textarea:focus{border-color:var(--wine)}textarea{min-height:126px;resize:vertical}
    .ideas{display:flex;margin:4px 0 23px;position:relative;z-index:1}
    .idea-ai{width:38px;height:38px;padding:0;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--muted);display:inline-grid;place-items:center;cursor:pointer;transition:transform .28s cubic-bezier(.16,1,.3,1),background .25s ease,color .25s ease}.idea-ai:hover,.idea-ai:focus-visible{transform:translateY(-2px) rotate(4deg);background:var(--rose-soft);color:var(--ink)}.idea-ai:focus-visible{outline:2px solid var(--rose);outline-offset:3px}.idea-ai svg{width:19px;height:19px}.idea-ai.is-thinking svg{animation:aiSpark .5s ease}
    @keyframes aiSpark{50%{transform:rotate(18deg) scale(1.18)}}
    #message.ai-filled{animation:aiMessageIn .55s cubic-bezier(.16,1,.3,1)}
    @keyframes aiMessageIn{0%{opacity:.2;transform:translateY(7px)}100%{opacity:1;transform:none}}
    .preview{position:relative;z-index:1;background:var(--rose-soft);padding:30px;margin:8px 0 22px;min-height:210px;display:flex;flex-direction:column;justify-content:center;text-align:center;border-radius:48% 48% 3px 3px / 18% 18% 3px 3px}
    .preview::before{content:"❀";font-size:1.8rem;color:var(--wine);opacity:.65}.preview h3{font:500 1.7rem "Playfair Display",serif;margin:8px 0 9px}.preview p{white-space:pre-wrap;margin:0;color:var(--ink)}.preview small{margin-top:17px;color:var(--wine);font-weight:600}
    .actions{display:flex;flex-wrap:wrap;gap:10px;position:relative;z-index:1}
    .hint{font-size:.76rem;color:var(--muted);margin:16px 0 0;position:relative;z-index:1}
    .wish-compose-launch{display:flex;justify-content:center;padding:40px 24px 8px;position:relative;z-index:3}
    .wish-compose-toggle{min-width:min(390px,100%);padding:17px 26px;border:1px solid rgba(255,255,255,.35);border-radius:999px;background:#fff7f9;color:#522638;box-shadow:10px 10px 0 rgba(239,189,200,.18),0 15px 35px rgba(18,7,12,.22);font-weight:600;cursor:pointer;transition:transform .3s cubic-bezier(.16,1,.3,1),background .25s ease,box-shadow .3s ease}
    .wish-compose-toggle:hover,.wish-compose-toggle:focus-visible{transform:translateY(-4px);background:#f8e5e9;box-shadow:13px 15px 0 rgba(239,189,200,.2),0 18px 40px rgba(18,7,12,.28)}
    .wish-compose-toggle svg{width:18px;height:18px;vertical-align:-4px;margin-left:10px;transition:transform .45s cubic-bezier(.16,1,.3,1)}
    .wish-compose-toggle[aria-expanded="true"] svg{transform:rotate(45deg)}
    .share-action{width:100%;position:relative;z-index:1;margin-top:4px;padding-block:16px}
    .share-confirm[hidden],.feedback-dialog[hidden]{display:none}
    .share-confirm,.feedback-dialog{position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:22px;background:rgba(28,13,20,.68);backdrop-filter:blur(6px)}
    .feedback-dialog{z-index:50}
    .feedback-card{width:min(560px,100%);max-height:calc(100svh - 34px);overflow:auto;background:var(--paper);color:var(--ink);padding:clamp(28px,5vw,48px);box-shadow:0 30px 90px rgba(12,4,8,.48);position:relative;animation:confirmIn .42s cubic-bezier(.16,1,.3,1) both}
    .feedback-card::before{content:var(--feedback-kicker,"Phản hồi");display:block;color:var(--wine);font-size:.7rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;margin-bottom:12px}
    .feedback-card h2{font:500 clamp(2rem,5vw,3.2rem)/1.05 "Playfair Display",serif;margin:0 44px 10px 0}.feedback-card>p{color:var(--muted);margin:0 0 26px}.feedback-close{position:absolute;right:18px;top:18px;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink);display:grid;place-items:center;cursor:pointer}.feedback-close:hover{background:var(--rose-soft)}.feedback-close svg{width:18px;height:18px}
    .feedback-form .field{margin-bottom:15px}.feedback-form textarea{min-height:150px}.feedback-actions{display:flex;align-items:center;gap:14px;margin-top:22px}.feedback-actions .soft-btn{flex:0 0 auto}
    .feedback-step[hidden]{display:none}.feedback-step{animation:feedbackStepIn .42s cubic-bezier(.16,1,.3,1) both}
    .feedback-confirm{text-align:center;padding:34px 6px 10px}.feedback-confirm-mark{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;margin:0 auto 22px;background:var(--rose-soft);color:var(--wine)}.feedback-confirm-mark svg{width:27px;height:27px}.feedback-confirm h3{font:500 clamp(1.8rem,4vw,2.5rem)/1.15 "Playfair Display",serif;margin:0 0 12px}.feedback-confirm p{color:var(--muted);max-width:390px;margin:0 auto 28px}.feedback-confirm .confirm-actions{margin-top:4px}
    .feedback-thanks{text-align:center;padding:48px 8px 36px}.feedback-thanks-mark{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;margin:0 auto 18px;background:var(--rose-soft);color:var(--wine);font:500 1.8rem "Playfair Display",serif}.feedback-thanks h3{font:400 clamp(4.8rem,12vw,7.4rem)/.78 "Allura",cursive;color:var(--wine);margin:0 0 20px;transform:rotate(-2deg)}.feedback-thanks p{font-size:.82rem;letter-spacing:.11em;color:var(--muted);margin:0}.feedback-thanks .soft-btn{margin-top:32px;min-width:140px}
    @keyframes feedbackStepIn{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}
    .nav-feedback{border:0;background:transparent;padding:0;color:inherit;font-size:.78rem;font-weight:600;cursor:pointer;white-space:nowrap;position:relative}.nav-feedback::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .35s cubic-bezier(.16,1,.3,1)}.nav-feedback:hover::after,.nav-feedback[aria-expanded="true"]::after{transform:scaleX(1);transform-origin:left}
    .confirm-card{width:min(470px,100%);background:var(--paper);color:var(--ink);padding:clamp(28px,5vw,46px);box-shadow:0 30px 90px rgba(12,4,8,.45);position:relative;text-align:center;animation:confirmIn .42s cubic-bezier(.16,1,.3,1) both}
    .confirm-card::before{content:"20 · 10";display:block;color:var(--wine);font-size:.7rem;font-weight:600;letter-spacing:.18em;margin-bottom:18px}
    .confirm-card h3{font:500 clamp(1.8rem,4vw,2.55rem)/1.15 "Playfair Display",serif;margin:0 0 14px}
    .confirm-card p{color:var(--muted);margin:0 auto 26px;max-width:360px}
    .confirm-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
    .confirm-actions .soft-btn{min-width:130px}
    @keyframes confirmIn{from{opacity:0;transform:translateY(24px) scale(.95)}to{opacity:1;transform:none}}

    /* closing */
    .closing{min-height:92svh;position:relative;display:grid;align-items:end;color:#fff;overflow:hidden;background:#172c43}
    .closing>img{position:absolute;inset:0;height:100%;object-fit:cover;object-position:center}
    .closing::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,39,61,.04),rgba(17,39,61,.92) 90%)}
    .heart-hands{position:relative;z-index:3;width:min(760px,78vw);height:clamp(150px,22vw,250px);margin:0 auto -22px;pointer-events:none;filter:drop-shadow(0 18px 24px rgba(31,10,19,.32))}
    .heart-hand{position:absolute;inset:0;width:50%;height:100%;object-fit:contain;opacity:0;transition:transform 1.35s cubic-bezier(.16,1,.3,1),opacity .72s ease;will-change:transform,opacity}
    .heart-hand.left{left:0;right:auto;object-position:right center;transform:translateX(-58%) rotate(-7deg)}
    .heart-hand.right{left:50%;right:auto;object-position:left center;transform:translateX(58%) rotate(7deg)}
    .closing.in-view .heart-hand{opacity:1;transform:translateX(0) rotate(0)}
    .rising-hearts{position:absolute;left:50%;top:26%;width:1px;height:58%;z-index:4}
    .rising-heart{position:absolute;left:0;bottom:0;width:var(--heart-size);height:var(--heart-size);opacity:0;background:linear-gradient(145deg,#fff2f5,#ee8eaa);transform:translate3d(0,18px,0) rotate(45deg) scale(.45);box-shadow:0 4px 10px rgba(82,27,48,.18)}
    .rising-heart::before,.rising-heart::after{content:"";position:absolute;width:100%;height:100%;border-radius:50%;background:inherit}.rising-heart::before{left:-50%}.rising-heart::after{top:-50%}
    .closing.hands-touch .rising-heart{animation:heartRise var(--heart-duration) var(--heart-delay) cubic-bezier(.18,.8,.3,1) both}
    .touch-flower{position:absolute;left:0;bottom:2px;width:var(--flower-size);height:var(--flower-size);opacity:0;border-radius:50%;background:radial-gradient(circle,#8d3958 0 10%,#f6c1cf 11% 25%,transparent 26%),conic-gradient(from 4deg,#ffe7ee 0 15%,transparent 16% 20%,#f2a9bd 21% 35%,transparent 36% 40%,#ffe2ea 41% 55%,transparent 56% 60%,#ef9fb6 61% 75%,transparent 76% 80%,#ffd6e1 81% 95%,transparent 96%);filter:drop-shadow(0 3px 5px rgba(82,27,48,.2));transform:translate3d(0,12px,0) rotate(-18deg) scale(.35)}
    .closing.hands-touch .touch-flower{animation:flowerFloat var(--flower-duration) var(--flower-delay) cubic-bezier(.18,.8,.3,1) both}
    @keyframes heartRise{0%{opacity:0;transform:translate3d(0,18px,0) rotate(45deg) scale(.45)}18%{opacity:.9}68%{opacity:.7}100%{opacity:0;transform:translate3d(var(--heart-drift),-150px,0) rotate(72deg) scale(1.02)}}
    @keyframes flowerFloat{0%{opacity:0;transform:translate3d(0,12px,0) rotate(-18deg) scale(.35)}20%{opacity:.9}70%{opacity:.68}100%{opacity:0;transform:translate3d(var(--flower-drift),-132px,0) rotate(150deg) scale(.9)}}
    .closing-copy{position:relative;z-index:2;text-align:center;padding:0 0 65px}.closing h2{font:500 clamp(2.24rem,5.44vw,5.44rem)/.98 "Playfair Display",serif;letter-spacing:-.04em;margin:0 auto 20px;max-width:950px}.closing h2 em{color:#f4cbd2;font-weight:500}.closing p{max-width:650px;margin:0 auto;color:#f8e9ee}

    /* page-wide motion language */
    .reveal{opacity:1;transform:none;filter:none;transition:opacity .75s ease,transform 1.05s cubic-bezier(.16,1,.3,1),filter .8s ease,clip-path 1.05s cubic-bezier(.16,1,.3,1)}
    .reveal.motion-pending{opacity:0;transform:translateY(46px);filter:blur(8px)}.reveal-left.motion-pending{transform:translateX(-52px)}.reveal-right.motion-pending{transform:translateX(52px)}.reveal-scale.motion-pending{transform:scale(.93) translateY(28px);clip-path:inset(8% 3% 8% 3% round 4px)}
    .reveal.in{opacity:1;transform:none;filter:none;clip-path:inset(0 0 0 0 round 0)}
    .reveal.motion-pending .eyebrow,.reveal.motion-pending .section-title,.reveal.motion-pending>p{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .85s cubic-bezier(.16,1,.3,1)}.reveal.motion-pending .section-title{transition-delay:.1s}.reveal.motion-pending>p{transition-delay:.2s}.reveal.in .eyebrow,.reveal.in .section-title,.reveal.in>p{opacity:1;transform:none}
    .slider-shell,.video-frame{transition:box-shadow .5s ease,transform .65s cubic-bezier(.16,1,.3,1),opacity .75s ease,filter .8s ease,clip-path 1.05s cubic-bezier(.16,1,.3,1)}
    .slider-shell:hover{transform:translateY(-7px);box-shadow:0 34px 90px rgba(67,38,49,.22)}
    .message-lane{opacity:1;transform:none;transition:opacity .8s ease,transform 1s cubic-bezier(.16,1,.3,1)}.message-lane.motion-pending{opacity:0;transform:translateX(-55px)}.message-lane.in{opacity:1;transform:none}
    .message-card{cursor:pointer;transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .35s ease,background .35s ease}.message-card.is-picked{transform:translateY(-10px) rotate(-1deg);box-shadow:0 26px 60px rgba(10,3,7,.4);background:#fff3f5}.message-card:focus-visible{outline:3px solid #f2bac7;outline-offset:4px}
    .video-frame::after{content:"▶";position:absolute;left:50%;top:50%;translate:-50% -50%;width:72px;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;padding-left:4px;background:rgba(255,248,250,.9);color:#244e7a;box-shadow:0 15px 35px rgba(0,0,0,.28);pointer-events:none;transition:opacity .3s ease,transform .4s ease}.video-frame.is-playing::after{opacity:0;transform:scale(.75)}.video-frame:hover::after{transform:scale(1.08)}
    .closing>img{transform:scale(1.08) translateY(calc(var(--closing-progress,0)*-3%));transition:transform 1.4s cubic-bezier(.16,1,.3,1),filter .7s ease}.closing.in-view>img{transform:scale(1.02) translateY(calc(var(--closing-progress,0)*-3%))}
    .toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:#34232b;color:#fff;padding:11px 16px;border-radius:999px;box-shadow:var(--shadow);opacity:0;pointer-events:none;z-index:60;transition:.3s ease;font-size:.85rem}.toast.show{opacity:1;transform:translate(-50%,0)}

    /* scroll choreography — elements answer both arrival and departure */
    .motion-ready{opacity:0;filter:blur(7px);transition:opacity .72s ease,transform .95s cubic-bezier(.16,1,.3,1),filter .7s ease,clip-path .95s cubic-bezier(.16,1,.3,1)}
    .motion-ready.reveal{transform:translateY(54px)}
    .motion-ready.reveal-left{transform:translate(-68px,24px) rotate(-1.2deg)}
    .motion-ready.reveal-right{transform:translate(68px,24px) rotate(1.2deg)}
    .motion-ready.reveal-scale{transform:scale(.9) translateY(34px);clip-path:inset(8% 5% 8% 5% round 18px)}
    .motion-ready.message-lane{transform:translateX(-90px)}
    /* The envelope answers the scroll sooner than the longer editorial reveals. */
    .compose-launch.motion-ready{will-change:opacity,transform,filter;transition:grid-template-rows .9s 2.95s cubic-bezier(.16,1,.3,1),padding .9s 2.95s cubic-bezier(.16,1,.3,1),opacity .36s ease,transform .48s cubic-bezier(.16,1,.3,1),filter .36s ease,clip-path .48s cubic-bezier(.16,1,.3,1)}
    .messages.is-open .compose-launch.motion-ready{transition:grid-template-rows .9s 2.95s cubic-bezier(.16,1,.3,1),padding .9s 2.95s cubic-bezier(.16,1,.3,1),opacity .85s 2.05s ease,transform .48s cubic-bezier(.16,1,.3,1),filter .36s ease,clip-path .48s cubic-bezier(.16,1,.3,1)}
    .compose-launch.motion-ready.reveal-scale:not(.in){opacity:0;filter:blur(3px);transform:scale(.975) translateY(18px);clip-path:inset(2% 1% 2% 1% round 8px)}
    .motion-ready.in{opacity:1;filter:none;transform:none;clip-path:inset(0 0 0 0 round 0)}
    .motion-ready.exit-up{opacity:0;filter:blur(5px);transform:translateY(-48px)}
    .motion-ready.exit-down{opacity:0;filter:blur(5px);transform:translateY(48px)}
    .motion-ready.reveal-left.exit-up{transform:translate(48px,-38px) rotate(1deg)}
    .motion-ready.reveal-left.exit-down{transform:translate(-58px,34px) rotate(-1deg)}
    .motion-ready.reveal-right.exit-down{transform:translate(58px,34px) rotate(1deg)}
    .motion-ready.reveal-scale.exit-down{transform:scale(.92) translateY(36px);clip-path:inset(6% 4% 6% 4% round 14px)}
    .motion-ready.reveal-right.exit-up{transform:translate(-48px,-38px) rotate(-1deg)}
    .motion-ready.reveal-scale.exit-up{transform:scale(.94) translateY(-34px);clip-path:inset(5% 3% 5% 3% round 14px)}
    .motion-ready.message-lane.exit-up{transform:translateX(80px)}
    .scroll-word{display:inline-block;transition:transform .8s cubic-bezier(.16,1,.3,1),opacity .6s ease}
    .motion-ready:not(.in) .scroll-word:nth-child(odd){transform:translateY(34px);opacity:0}.motion-ready:not(.in) .scroll-word:nth-child(even){transform:translateY(-24px);opacity:0}
    .motion-ready.in .scroll-word{transform:none;opacity:1}.motion-ready.in .scroll-word:nth-child(2){transition-delay:.08s}.motion-ready.in .scroll-word:nth-child(3){transition-delay:.16s}.motion-ready.in .scroll-word:nth-child(4){transition-delay:.24s}

    /* selected copy softly fades inward as it enters the reading area */
    .text-fade-inward{--fade-x:0}
    .text-fade-inward.fade-from-left{--fade-x:-34px}.text-fade-inward.fade-from-right{--fade-x:34px}
    .text-fade-inward.fade-ready{opacity:0;filter:blur(9px);transform:translate3d(var(--fade-x),10px,0) scale(.985);transition:opacity .9s ease,filter 1.05s ease,transform 1.15s cubic-bezier(.16,1,.3,1)}
    .text-fade-inward.fade-ready.fade-in{opacity:1;filter:blur(0);transform:none}

    /* richer wish wall */
    .messages{background:
      radial-gradient(circle at 14% 18%,rgba(239,189,200,.17) 0 1px,transparent 2px) 0 0/24px 24px,
      linear-gradient(135deg,#173653 0%,var(--deep) 48%,#35658f 100%)}
    .messages::after{content:"";position:absolute;left:-90px;bottom:70px;width:260px;height:260px;border:1px solid rgba(255,255,255,.13);border-radius:50%;box-shadow:0 0 0 34px transparent,0 0 0 35px rgba(255,255,255,.08),0 0 0 70px transparent,0 0 0 71px rgba(255,255,255,.05);pointer-events:none}
    .messages-head{max-width:820px}.messages-head h2{letter-spacing:-.025em}.messages-head::after{content:"";display:block;width:70px;height:1px;background:#efbdc8;margin:24px auto 0}
    .message-lane{width:100%;max-width:100vw;contain:paint}
    .message-track{gap:22px;padding:14px 0 28px}
    .message-card{position:relative;overflow:hidden;min-height:210px;padding:38px 34px 30px;border:0;background:#fff9fa;color:#35252d;box-shadow:0 22px 55px rgba(15,6,10,.3);clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%)}
    .message-card::before{content:"“";position:absolute;right:18px;top:-17px;font:500 7.2rem/1 "Playfair Display",serif;color:rgba(116,57,78,.12)}
    .message-card::after{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--rose)}
    .message-card:nth-child(2n){background:#f3f0e7;transform:translateY(16px)}.message-card:nth-child(2n)::after{background:var(--sage)}
    .message-card:nth-child(4n+3){background:#f5dfe4}.message-card:nth-child(4n+3)::after{background:#8e4962}
    .message-card blockquote{position:relative;z-index:1}.message-card p{display:flex;align-items:center;gap:10px}.message-card p::before{content:"";width:26px;height:1px;background:currentColor}
    .message-card.is-picked{transform:translateY(-12px) rotate(-1.1deg) scale(1.015);background:#fff;clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%)}
    .compose-launch{padding-top:54px}.compose-toggle{border-radius:4px;background:#f8e5e9;padding:18px 28px;box-shadow:10px 10px 0 rgba(239,189,200,.18)}

    /* the full wish section begins as one sealed envelope */
    .messages{padding:0;min-height:92svh;display:grid;align-items:center;scroll-margin-top:72px;transition:min-height .9s 2.95s cubic-bezier(.16,1,.3,1),padding 1s 2.95s cubic-bezier(.16,1,.3,1)}
    .compose-launch{width:100%;padding:clamp(70px,9vw,112px) 24px;position:relative;z-index:3;display:grid;grid-template-rows:1fr;transition:grid-template-rows .9s 2.95s cubic-bezier(.16,1,.3,1),padding .9s 2.95s cubic-bezier(.16,1,.3,1),opacity .85s 2.05s ease}
    .compose-launch-inner{min-height:0;overflow:visible;display:grid;place-items:center}
    .wish-reveal{display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;transition:grid-template-rows .95s cubic-bezier(.16,1,.3,1),opacity .5s ease,visibility 0s .95s}
    .wish-reveal.open{grid-template-rows:1fr;opacity:1;visibility:visible;transition:grid-template-rows .95s 1.38s cubic-bezier(.16,1,.3,1),opacity .65s 1.5s ease,visibility 0s}
    .wish-reveal-inner{min-height:0;overflow:hidden;padding-top:0;transition:padding-top .8s 1.12s cubic-bezier(.16,1,.3,1)}
    .wish-reveal.open .wish-reveal-inner{overflow:visible;padding-top:clamp(80px,9vw,124px);padding-bottom:64px}
    .envelope-toggle{width:min(880px,calc(100vw - 48px));border:0;background:transparent;color:#fff7f9;padding:0;cursor:pointer;perspective:1500px;text-align:center;transition:opacity .35s 1.32s ease,visibility 0s 1.7s}
    .envelope-stage{display:block;position:relative;width:100%;aspect-ratio:1.62;transform-style:preserve-3d;scale:.9;translate:0 10vh;transition:transform 1.05s cubic-bezier(.16,1,.3,1),filter .7s ease}
    .envelope-shadow{position:absolute;left:7%;right:7%;bottom:1%;height:9%;border-radius:50%;background:rgba(8,3,5,.34);filter:blur(24px);transform:scaleX(.8);transition:transform 1s cubic-bezier(.16,1,.3,1),opacity .5s ease}
    .envelope-back{position:absolute;inset:5% 2% 11%;background:var(--envelope-deep);border:1px solid rgba(255,255,255,.18);box-shadow:0 32px 80px rgba(13,5,8,.4);z-index:1;border-radius:6px}
    .envelope-letter-preview{position:absolute;left:8%;right:8%;top:11%;bottom:15%;z-index:2;opacity:0;transform:translateY(13%);filter:drop-shadow(0 12px 18px rgba(27,10,16,.2));pointer-events:none;transition:opacity .12s .38s ease,transform .82s .38s cubic-bezier(.16,1,.3,1),filter .82s .38s ease,z-index 0s .45s}
    .envelope-sheet{position:absolute;left:3%;right:3%;border:1px solid rgba(116,57,78,.14);box-shadow:0 5px 13px rgba(42,18,27,.14);transform-origin:50% 92%;will-change:transform,opacity;backface-visibility:hidden}
    .envelope-sheet:nth-child(1){top:1%;bottom:19%;background:#fffdfb;transform:translateX(-5%) rotate(-5deg)}
    .envelope-sheet:nth-child(2){top:6%;bottom:14%;background:#f3f0e7;transform:translateX(5%) rotate(4.5deg)}
    .envelope-sheet:nth-child(3){top:11%;bottom:9%;background:#f5dfe4;transform:translateX(-3%) rotate(-2.5deg)}
    .envelope-sheet:nth-child(4){top:16%;bottom:4%;background:#fffdfb;transform:translateX(3%) rotate(2deg)}
    .envelope-sheet:nth-child(5){top:21%;bottom:-1%;background:#f3f0e7;transform:translateX(-1%) rotate(-.7deg)}
    .envelope-sheet:nth-child(6){top:26%;bottom:-6%;background:#f5dfe4;transform:translateX(1%) rotate(.6deg)}
    .envelope-front{position:absolute;inset:5% 2% 11%;background:var(--envelope);clip-path:polygon(0 0,50% 53%,100% 0,100% 100%,0 100%);z-index:4;border-radius:0 0 6px 6px;overflow:hidden}
    .envelope-front::before,.envelope-front::after{content:"";position:absolute;inset:0}
    .envelope-front::before{background:var(--envelope-fold);clip-path:polygon(0 0,50% 53%,0 100%)}
    .envelope-front::after{background:color-mix(in srgb,var(--envelope) 82%,var(--paper));clip-path:polygon(100% 0,50% 53%,100% 100%)}
    .envelope-flap{position:absolute;left:2%;right:2%;top:5%;height:53%;background:var(--envelope-deep);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;transform:rotateX(0);backface-visibility:visible;z-index:5;transition:transform .82s .2s cubic-bezier(.16,1,.3,1),z-index 0s .58s}
    .envelope-flap::after{content:"";position:absolute;inset:1px;background:linear-gradient(145deg,rgba(255,255,255,.16),transparent 58%);clip-path:inherit}
    .envelope-seal{position:absolute;left:50%;top:50%;translate:-50% -50%;width:clamp(74px,9vw,104px);height:clamp(74px,9vw,104px);border-radius:50%;display:grid;place-items:center;background:var(--seal);color:#fff4f7;z-index:6;box-shadow:0 12px 28px rgba(44,15,26,.38),inset 0 0 0 7px rgba(255,255,255,.1);transition:transform .42s ease,opacity .26s .12s ease}
    .envelope-seal::before{content:"";position:absolute;inset:9px;border:1px solid rgba(255,255,255,.42);border-radius:50%}.envelope-seal img{width:70%;height:70%;object-fit:contain;filter:drop-shadow(0 2px 2px rgba(40,12,22,.18))}
    .envelope-instruction{position:absolute;left:50%;bottom:18%;translate:-50% 0;z-index:7;display:inline-flex;align-items:center;gap:11px;font-size:clamp(.78rem,1.2vw,.92rem);font-weight:600;color:#fff9fb;background:rgba(36,78,122,.88);padding:11px 18px;border-radius:999px;box-shadow:0 9px 24px rgba(45,14,26,.25);white-space:nowrap;transition:transform .3s ease,background .25s ease,opacity .3s ease}
    .envelope-instruction svg{width:17px;height:17px;flex:none}
    .envelope-toggle:hover .envelope-instruction,.envelope-toggle:focus-visible .envelope-instruction{transform:translateY(-3px);background:#542638}.envelope-toggle:focus-visible{outline:2px solid #f7dbe1;outline-offset:12px}
    .envelope-toggle:hover:not(.is-open) .envelope-stage{transform:translateY(-8px) rotateX(1deg);filter:saturate(1.05)}
    .envelope-toggle.is-open .envelope-stage{transform:scale(1.2) translateY(2%)}
    .envelope-toggle.is-open .envelope-flap{transform:rotateX(-180deg);z-index:1}
    .envelope-toggle.is-open .envelope-letter-preview{opacity:1;transform:translateY(-13%);filter:drop-shadow(0 24px 34px rgba(18,6,11,.25));z-index:8}
    .envelope-toggle.is-open .envelope-sheet:nth-child(1){animation:sheetFly1 1.12s .46s cubic-bezier(.18,.78,.25,1) forwards}
    .envelope-toggle.is-open .envelope-sheet:nth-child(2){animation:sheetFly2 1.18s .53s cubic-bezier(.18,.78,.25,1) forwards}
    .envelope-toggle.is-open .envelope-sheet:nth-child(3){animation:sheetFly3 1.12s .6s cubic-bezier(.18,.78,.25,1) forwards}
    .envelope-toggle.is-open .envelope-sheet:nth-child(4){animation:sheetFly4 1.2s .67s cubic-bezier(.18,.78,.25,1) forwards}
    .envelope-toggle.is-open .envelope-sheet:nth-child(5){animation:sheetFly5 1.16s .74s cubic-bezier(.18,.78,.25,1) forwards}
    .envelope-toggle.is-open .envelope-sheet:nth-child(6){animation:sheetFly6 1.22s .81s cubic-bezier(.18,.78,.25,1) forwards}
    @keyframes sheetFly1{0%{opacity:1;transform:translate3d(-5%,0,0) rotate(-5deg) scale(1)}56%{opacity:.94;transform:translate3d(-33%,-118%,0) rotate(-16deg) scale(1.04)}100%{opacity:0;transform:translate3d(-48%,-218%,0) rotate(-27deg) scale(.82)}}
    @keyframes sheetFly2{0%{opacity:1;transform:translate3d(5%,0,0) rotate(4.5deg) scale(1)}56%{opacity:.94;transform:translate3d(29%,-128%,0) rotate(14deg) scale(1.05)}100%{opacity:0;transform:translate3d(45%,-230%,0) rotate(25deg) scale(.8)}}
    @keyframes sheetFly3{0%{opacity:1;transform:translate3d(-3%,0,0) rotate(-2.5deg) scale(1)}56%{opacity:.94;transform:translate3d(-14%,-136%,0) rotate(-8deg) scale(1.06)}100%{opacity:0;transform:translate3d(-22%,-246%,0) rotate(-16deg) scale(.84)}}
    @keyframes sheetFly4{0%{opacity:1;transform:translate3d(3%,0,0) rotate(2deg) scale(1)}56%{opacity:.94;transform:translate3d(18%,-116%,0) rotate(9deg) scale(1.04)}100%{opacity:0;transform:translate3d(31%,-214%,0) rotate(19deg) scale(.8)}}
    @keyframes sheetFly5{0%{opacity:1;transform:translate3d(-1%,0,0) rotate(-.7deg) scale(1)}56%{opacity:.94;transform:translate3d(-25%,-122%,0) rotate(-11deg) scale(1.04)}100%{opacity:0;transform:translate3d(-38%,-226%,0) rotate(-21deg) scale(.78)}}
    @keyframes sheetFly6{0%{opacity:1;transform:translate3d(1%,0,0) rotate(.6deg) scale(1)}56%{opacity:.94;transform:translate3d(9%,-132%,0) rotate(7deg) scale(1.05)}100%{opacity:0;transform:translate3d(18%,-240%,0) rotate(15deg) scale(.8)}}
    .envelope-toggle.is-open .envelope-seal{transform:scale(.45) rotate(-18deg);opacity:0}
    .envelope-toggle.is-open .envelope-shadow{transform:scaleX(1.14);opacity:.55}
    .envelope-toggle.is-open .envelope-instruction{opacity:0;transform:translateY(-12px)}
    .messages.is-open{min-height:0;padding:0}
    .messages.is-open .compose-launch{grid-template-rows:0fr;padding:0 24px;opacity:0;pointer-events:none}
    .messages.is-open .compose-launch-inner{overflow:visible}
    .messages.is-open::before{opacity:.7;transition:opacity 1s 1.2s ease}

    /* composed stationery instead of a plain form board */
    .compose-stage{background:
      linear-gradient(90deg,transparent 49.8%,rgba(116,57,78,.055) 50%,transparent 50.2%) 0 0/54px 54px,
      linear-gradient(rgba(116,57,78,.045) 1px,transparent 1px) 0 0/100% 34px,
      var(--bg)}
    .compose-stage::after{content:"20 · 10";position:absolute;right:-.05em;bottom:-.26em;font:500 clamp(9rem,20vw,18rem)/1 "Playfair Display",serif;color:rgba(116,57,78,.045);pointer-events:none}
    .compose-copy{padding:30px 0}.compose-copy::before{content:"";display:block;width:48px;height:7px;background:var(--rose);margin-bottom:28px}
    .compose-panel{border:1px solid rgba(116,57,78,.16);box-shadow:20px 24px 0 var(--rose-soft),var(--shadow);transform:rotate(.35deg)}
    .compose-panel::after{content:"";position:absolute;width:92px;height:28px;left:50%;top:-13px;translate:-50% 0;background:rgba(220,164,173,.58);transform:rotate(-2deg);box-shadow:0 1px 2px rgba(70,30,45,.08)}
    .field{background:color-mix(in srgb,var(--bg) 70%,transparent);padding:13px 16px 8px;border-left:3px solid var(--rose)}
    .form-row .field:nth-child(2){border-left-color:var(--sage)}
    input,textarea{border-bottom-color:rgba(116,57,78,.22)}
    .preview{border-radius:2px;background:linear-gradient(145deg,var(--rose-soft),var(--paper));border:1px solid rgba(116,57,78,.12);box-shadow:inset 0 0 0 8px rgba(255,255,255,.18)}
    .idea{border-radius:3px;background:var(--bg)}

    /* optimistic finale */
    .closing::after{background:linear-gradient(180deg,rgba(17,39,61,.02),rgba(17,39,61,.78) 72%,rgba(30,64,98,.96) 100%)}
    .closing-copy{padding-bottom:78px}.closing-copy::before{content:"";display:block;width:64px;height:2px;background:#f4cbd2;margin:0 auto 24px;transform:scaleX(var(--closing-progress,.2));transition:transform .5s ease}
    .closing .eyebrow{color:#f4cbd2;margin-bottom:14px}.closing p{font-size:clamp(.95rem,1.3vw,1.12rem)}

    @media(max-width:900px){
      .wrap{width:min(100% - 32px,720px)}.hero{background:linear-gradient(180deg,#244e7a 0 48%,#efc0c8 48% 76%,var(--rose-soft) 76%)}.hero-texture{width:100%;height:48%;bottom:auto}.hero-grid{grid-template-columns:1fr}.hero-copy{padding-bottom:24px}.hero-photo{height:650px;min-height:0;margin-top:5px}.slider-shell{grid-template-columns:1fr;min-height:0}.slider-viewport{aspect-ratio:3/2;min-height:0}.slider-panel{border-left:0;border-top:1px solid var(--line);min-height:0}.film-grid,.compose-grid{grid-template-columns:1fr}.compose-copy{position:static}.film-copy{max-width:590px}.video-frame::before{right:10px}.compose-panel{max-width:680px}.heart-hands{width:min(820px,92vw);margin-bottom:-14px}
    }
    @media(max-width:760px){
      .site-nav{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;gap:7px 14px;padding:6px 12px 9px}.nav-brand{gap:9px}.nav-brand img{width:66px;height:32px}.nav-brand-separator{height:22px}.nav-brand-title{font-size:.64rem}.nav-links{grid-column:1/-1;grid-row:2;justify-content:center;gap:clamp(12px,4.5vw,34px)}.nav-actions{grid-column:2;grid-row:1}.nav-game{padding:7px 12px;border-radius:999px}.language-toggle{min-width:30px;height:34px;padding-inline:4px}.site-nav a{font-size:.7rem}.nav-game svg{display:none}
    }
    @media(max-width:560px){
      .site-nav{padding-inline:10px}.nav-brand-title{max-width:178px}.nav-links{gap:clamp(10px,3.8vw,22px)}
      .wrap{width:calc(100% - 24px)}.hero{padding-top:112px}.hero-copy>p{max-width:330px}.hero-photo{height:470px}.portrait{padding:6px 6px 38px}.portrait.main{width:78%;height:69%;right:1%}.portrait.small{width:53%;height:42%}.seal{width:88px;font-size:.7rem}.seal strong{font-size:1.4rem}.memories{padding:72px 0}.slider-viewport{aspect-ratio:3/2}.slider-panel{padding:28px 24px;min-height:350px}.slider-panel .section-title{font-size:2.75rem}.slider-bottom{margin-top:28px}.slider-btn{width:44px;height:44px}.messages{padding:70px 0}.message-card{width:278px;min-height:168px;padding:24px}.messages{min-height:78svh}.compose-launch{padding:62px 12px}.envelope-toggle{width:calc(100vw - 24px)}.envelope-stage{aspect-ratio:1.25}.envelope-back,.envelope-front{inset:10% 1% 12%}.envelope-letter-preview{left:5%;right:5%;top:15%;bottom:16%;padding:9% 7% 4%}.envelope-flap{left:1%;right:1%;top:10%;height:49%}.envelope-seal{top:52%;width:68px;height:68px}.envelope-instruction{bottom:19%;padding:9px 14px;font-size:.74rem}.envelope-toggle.is-open .envelope-stage{transform:scale(1.24) translateY(2%)}.wish-reveal.open .wish-reveal-inner{padding-top:70px}.film{padding:80px 0}.film-copy p:last-child{display:none}.form-row{grid-template-columns:1fr;gap:0}.compose-panel{padding:29px 22px;transform:none;box-shadow:8px 10px 0 var(--rose-soft),var(--shadow-soft);width:100%;max-width:100%}.compose-copy{max-width:100%;overflow-wrap:anywhere}.actions{display:grid}.actions .soft-btn{width:100%}.closing{min-height:78svh}.closing>img{object-position:center top}.heart-hands{width:104vw;height:136px;margin-left:-2vw;margin-bottom:-6px}.closing-copy{padding-bottom:44px}.rising-hearts{top:18%}
    }
    @media(hover:none){.message-arrow{opacity:.78;transform:scale(.9);width:42px;height:42px}}
  
    /* ---------- Chatbot Lien ---------- */
    .lien-fab{position:fixed;right:22px;bottom:22px;z-index:90;width:60px;height:60px;border-radius:50%;border:2px solid rgba(255,255,255,.7);font-size:30px;line-height:1;display:grid;place-items:center;cursor:pointer;background:linear-gradient(135deg,var(--rose),var(--seal));box-shadow:var(--shadow);transition:transform .25s cubic-bezier(.16,1,.3,1)}
    .lien-fab:hover{transform:scale(1.1) rotate(8deg)}
    .lien-fab[aria-expanded="true"]{transform:rotate(0)}
    .lien-panel{position:fixed;right:22px;bottom:94px;z-index:90;width:min(360px,calc(100vw - 32px));height:min(520px,calc(100svh - 140px));display:flex;flex-direction:column;overflow:hidden;border-radius:20px;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shadow)}
    .lien-panel[hidden]{display:none}
    .lien-head{display:flex;align-items:center;gap:10px;padding:12px 14px;background:linear-gradient(135deg,var(--rose-soft),var(--cream));border-bottom:1px solid var(--line)}
    .lien-avatar{font-size:26px}
    .lien-headtxt{display:flex;flex-direction:column;line-height:1.3;flex:1}
    .lien-headtxt strong{font-size:1rem}
    .lien-headtxt small{color:var(--muted);font-size:.75rem}
    .lien-close{border:0;background:transparent;font-size:1.5rem;cursor:pointer;color:var(--muted);width:32px;height:32px;border-radius:50%}
    .lien-close:hover{background:var(--rose-soft)}
    .lien-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
    .lien-msg{max-width:85%;padding:10px 14px;border-radius:16px;font-size:.9rem;line-height:1.55;white-space:pre-wrap;word-break:break-word}
    .lien-user{align-self:flex-end;background:linear-gradient(135deg,var(--deep),#2f6494);color:#fff;border-bottom-right-radius:6px}
    .lien-bot{align-self:flex-start;background:var(--rose-soft);color:var(--ink);border-bottom-left-radius:6px}
    .lien-typing{opacity:.7;font-style:italic}
    .lien-form{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);background:var(--paper)}
    .lien-form input{flex:1;border:1px solid var(--line);border-radius:999px;padding:10px 16px;background:var(--bg);color:var(--ink);font-size:.9rem;outline:none}
    .lien-form input:focus{border-color:var(--rose)}
    .lien-form button{width:42px;height:42px;border-radius:50%;border:0;cursor:pointer;background:linear-gradient(135deg,var(--rose),var(--seal));color:#fff;font-size:1.1rem;flex:none}
    .lien-form input:disabled{opacity:.55;background:var(--rose-soft)}
    .lien-form button:disabled{opacity:.45;cursor:not-allowed}
    .lien-badge{font-size:.68rem;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:3px 9px;white-space:nowrap;background:rgba(255,255,255,.5)}
    .lien-verify{padding:12px 14px;border-top:1px solid var(--line);background:var(--cream);display:flex;flex-direction:column;gap:8px;align-items:center;text-align:center}
    .lien-verify[hidden]{display:none}
    .lien-verify p{margin:0;font-size:.8rem;color:var(--muted);line-height:1.5}
    .lien-verify .cf-turnstile{margin:0 auto}
    .lien-retry{border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:999px;padding:6px 14px;font-size:.78rem;cursor:pointer}
    .lien-retry[hidden]{display:none}
    .lien-retry:hover{background:var(--rose-soft)}
    @media(max-width:480px){.lien-fab{right:14px;bottom:14px}.lien-panel{right:14px;bottom:86px}}
