:root{--paper:#f7f5ee;--ink:#3e493e;--muted:#818577;--sage:#738368;--line:#dfdfd2;--serif:Georgia,'Hiragino Mincho ProN','Yu Mincho',serif;--sans:-apple-system,BlinkMacSystemFont,'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:14px;-webkit-font-smoothing:antialiased}body:has(dialog[open]){overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:default}a{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #c58a65;outline-offset:5px}button{color:inherit}button:hover{transition:background .2s,transform .2s}button:disabled:hover{transform:none}.site-header{max-width:1360px;margin:auto;height:100px;padding:0 60px;display:flex;align-items:center;justify-content:space-between}.brand{text-decoration:none;display:flex;gap:12px;align-items:center;letter-spacing:2.8px;font-size:12px}.brand b{font-weight:500;letter-spacing:1px}.brand svg{width:25px;height:35px;color:#849274}.header-note{font-family:var(--serif);font-style:italic;color:#8a8d7d;font-size:15px;letter-spacing:.5px}.hero{max-width:1360px;margin:25px auto 50px;padding:0 60px;display:grid;grid-template-columns:.76fr 1.55fr;gap:48px;align-items:center}.intro{padding-top:10px}.eyebrow{font-size:9px;font-weight:500;letter-spacing:2.4px;margin:0 0 21px;line-height:1.6;color:#7e856f}.intro .eyebrow{display:flex;gap:9px;align-items:center;white-space:nowrap}.eyebrow>span{width:5px;height:5px;background:#b99f78;border-radius:50%}.english-title{font:68px/.98 var(--serif);letter-spacing:-2.6px;margin:22px 0 26px;font-weight:400}.english-title em{font-weight:400;color:#8b9a78}.intro h1{font:25px/1.7 var(--serif);letter-spacing:3.6px;margin:0 0 18px}.intro-copy{font-size:12px;line-height:2.2;letter-spacing:.6px;color:#7c8173;margin:0 0 20px}.primary-button{border:0;background:#75836a;border-radius:5px;color:white;min-height:48px;padding:15px 24px;display:inline-flex;align-items:center;justify-content:center;gap:24px;font-size:12px;letter-spacing:1px;box-shadow:0 4px 8px #45513a08}.primary-button:hover{background:#607256;transform:translateY(-1px)}.primary-button>span{font-size:19px;line-height:1}.intro-footnote{font-size:9px;color:#929483;letter-spacing:.4px;margin:13px 0}.date-mark{display:flex;align-items:center;gap:12px;margin-top:29px;color:#999e8c}.date-mark>span{font:29px var(--serif)}.date-mark>i{font:20px var(--serif);color:#b9bcab}.date-mark small{font-size:7px;letter-spacing:1.7px;max-width:70px;line-height:1.9;margin-left:3px}.room-column{min-width:0;align-self:center}.room-topline{display:flex;align-items:center;justify-content:space-between;font-size:8px;letter-spacing:2px;color:#929783;margin-bottom:17px}.room-topline-right{font-size:9px;letter-spacing:.7px;display:flex;align-items:center;gap:7px}.room-topline-right i{width:5px;height:5px;background:#91a27e;border-radius:50%}.room{position:relative;border-radius:140px 140px 9px 9px;overflow:hidden;aspect-ratio:1.5;background:#e4dfc9;box-shadow:0 13px 30px #5f593311;isolation:isolate}.room:focus{outline:none}.room-image{height:100%;width:100%;display:block;object-fit:cover;object-position:center}.sunlight{position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,#fff7c814,transparent 60%);animation:warm-light 9s ease-in-out infinite alternate}.hotspot{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);background:transparent;border:0;display:flex;align-items:center;justify-content:center;width:48px;height:48px;padding:0;border-radius:50%;z-index:2}.point{display:grid;place-items:center;width:29px;height:29px;background:#fffdf1e8;color:#7e8063;border:1px solid #ffffffe0;box-shadow:0 0 0 6px #fffef129,0 2px 8px #655b3920;border-radius:50%;font-size:20px;font-weight:300;transition:transform .25s,background .25s;animation:point-glow 3.5s ease-in-out infinite}.hotspot:hover .point,.hotspot:focus-visible .point{transform:scale(1.13);background:white}.hotspot-label{position:absolute;top:47px;white-space:nowrap;font-size:10px;letter-spacing:.5px;padding:6px 11px;border-radius:20px;background:#fffdf3f2;color:#626d55;box-shadow:0 3px 9px #403c1410;opacity:0;transform:translateY(-4px);transition:.2s;pointer-events:none}.hotspot:hover .hotspot-label,.hotspot:focus-visible .hotspot-label{opacity:1;transform:translateY(0)}.hotspot.collected .point{background:#768a65;color:#fff;border-color:#bac7a7;font-size:14px;animation:none}.room-caption{position:absolute;bottom:20px;width:100%;text-align:center;font:italic 17px var(--serif);letter-spacing:.8px;color:#5e6747;text-shadow:0 1px 7px #fff9e7}.room-hint{text-align:center;font-size:10px;letter-spacing:.5px;color:#8b8f7e;margin:16px 0 0}.room-hint>span{font-size:16px;margin-right:5px}.room-hint b{font-size:15px;font-weight:400;color:#6e7c61}.collection{max-width:1240px;min-height:156px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:30px 8px}.collection-copy .eyebrow{font-size:8px;letter-spacing:1.7px;margin-bottom:9px}.collection-copy h2{font:21px var(--serif);letter-spacing:2px;margin:0 0 10px}.collection-copy>p:last-child{font-size:10px;color:#969988;margin:0;letter-spacing:.5px}.flower-slots{display:flex;gap:18px}.flower-slot{display:grid;place-items:center;width:58px;height:73px;position:relative}.flower-slot:before{content:'';position:absolute;top:1px;width:55px;height:55px;border:1px dashed #cfd4c2;border-radius:50%;background:#efefe543}.flower-slot>span{position:relative;color:#bbc0ad;font:18px var(--serif);margin-top:-17px}.flower-slot svg{position:relative;width:56px;height:73px;filter:drop-shadow(0 2px 1px #5b583310);animation:flower-arrive .6s ease-out}.flower-slot.gathered:before{border-color:transparent;background:#eaeede8c}.flower-slot .slot-dot{position:absolute;bottom:0;width:3px;height:3px;border-radius:50%;background:#cbd0bb}.flower-slot.gathered .slot-dot{background:#889a75}.collection-action{text-align:right;min-width:178px}.collection-action>p{margin:0 0 10px}.collection-action strong{font:21px var(--serif);font-weight:400}.collection-action>p span{font:italic 13px var(--serif);color:#8c917d}.bouquet-button{border:1px solid #bac4ac;background:#e6ebdf;border-radius:5px;font-size:11px;letter-spacing:.7px;min-height:41px;padding:10px 17px;display:inline-flex;align-items:center;gap:26px}.bouquet-button:disabled{color:#9da68f;background:#eff1e8;border-color:#dce1d1}.bouquet-button:not(:disabled):hover{background:#d9e2cb}.bouquet-button:not(:disabled){border-color:#849570;color:#4c6341}footer{max-width:1360px;margin:0 auto;padding:25px 60px 30px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#a0a38f;font-size:8px;letter-spacing:.5px}footer>span:first-child{font:italic 12px var(--serif)}footer button{border:0;background:none;color:#949c84;font-size:9px;padding:10px 0;text-decoration:underline;text-underline-offset:4px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}dialog{border:1px solid #fffdf6;background:var(--paper);color:var(--ink);box-shadow:0 20px 100px #22351c35;border-radius:12px;max-height:90dvh;overflow:auto}dialog::backdrop{background:#333e2f5c;backdrop-filter:blur(6px)}dialog[open]{animation:dialog-in .3s ease-out}.close-dialog{position:absolute;right:16px;top:12px;width:40px;height:40px;border:0;background:transparent;color:#869077;font:27px var(--serif);z-index:2}.flower-dialog{width:420px;max-width:calc(100% - 32px);padding:35px 30px 25px;text-align:center}.flower-dialog .eyebrow{margin:5px 0 0;font-size:9px}.flower-art{height:200px;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse,#ebeede88,transparent 67%)}.flower-art svg{width:130px;height:195px}.flower-name{font:italic 13px var(--serif);letter-spacing:1px;color:#95a07e;margin:0 0 15px}.flower-dialog h2{font:25px/1.6 var(--serif);letter-spacing:1px;margin:0 0 16px}.flower-message{font-size:12px;line-height:2.15;letter-spacing:.3px;color:#858b79;white-space:pre-line;margin:0 0 24px}.flower-dialog .primary-button{min-width:235px}.dialog-note{font-size:9px;color:#a1a58f;letter-spacing:.5px;margin:17px 0 0}.bouquet-dialog{width:860px;max-width:calc(100% - 32px);padding:0}.bouquet-dialog[open]{display:grid;grid-template-columns:1fr 1fr}.final-art-panel{background:#e9edde;min-height:510px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:36px 10px}.final-art-panel .eyebrow{font-size:8px;letter-spacing:2px;margin-bottom:10px}#bouquet-art{width:100%;max-width:335px}#bouquet-art svg{width:100%;height:auto;display:block}.handwritten{font:italic 33px var(--serif);color:#6c7f59;letter-spacing:-1px;margin:-5px 0 15px}.bouquet-date{font-size:8px;letter-spacing:3px;color:#94a083;margin:0}.final-letter{padding:57px 36px 35px;display:flex;flex-direction:column;justify-content:center}.final-letter .eyebrow{font-size:8px;margin-bottom:21px}.final-letter h2{font:28px/1.7 var(--serif);letter-spacing:2px;margin:0 0 19px}.final-letter #letter-copy{font-size:11px;line-height:2.25;letter-spacing:.5px;color:#7d856f}.final-letter #letter-copy p{margin:0 0 17px}.final-actions{margin-top:14px}.final-actions .primary-button{width:100%;font-size:11px;padding:14px 15px}.text-button{border:0;background:transparent;font-size:10px;padding:15px 0;color:#818c70;letter-spacing:.4px}.final-actions .text-button{width:100%;text-align:center}.final-actions #save-status{font-size:10px;line-height:1.7;margin:0;color:#788768}.reset-dialog{width:440px;max-width:calc(100% - 32px);padding:34px}.reset-dialog h2{font:22px/1.6 var(--serif);margin:0 0 15px}.reset-dialog p{font-size:12px;line-height:1.8;color:var(--muted)}.reset-dialog>div{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:25px}#petals{pointer-events:none;position:fixed;inset:0;overflow:hidden;z-index:20}.falling-petal{position:absolute;top:-20px;left:var(--left);width:10px;height:15px;border-radius:70% 10% 70% 20%;background:var(--color);animation:petal-fall var(--duration) ease-in forwards;animation-delay:var(--delay);opacity:0}@keyframes petal-fall{0%{opacity:0;transform:translateY(-20px) rotate(0)}10%{opacity:.8}100%{opacity:0;transform:translate(70px,100vh) rotate(380deg)}}@keyframes point-glow{0%,100%{box-shadow:0 0 0 5px #fffef129,0 2px 8px #655b3920}50%{box-shadow:0 0 0 9px #fffef114,0 2px 8px #655b3920}}@keyframes warm-light{from{opacity:.5}to{opacity:1}}@keyframes flower-arrive{from{opacity:0;transform:translateY(8px) scale(.8)}to{opacity:1;transform:none}}@keyframes dialog-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(min-width:1450px){.hero{margin-top:40px;margin-bottom:60px}.english-title{font-size:78px}.room{aspect-ratio:1.5}}
@media(max-width:1100px){.site-header{padding:0 36px;height:84px}.hero{padding:0 36px;gap:30px;grid-template-columns:.8fr 1.3fr;margin-top:20px}.english-title{font-size:59px}.intro h1{font-size:22px}.intro-copy{font-size:11px}.room{border-radius:100px 100px 8px 8px;aspect-ratio:1.5}.collection{margin:0 36px}.flower-slots{gap:7px}.collection-copy h2{font-size:18px}.collection-copy>p:last-child{font-size:9px}.flower-slot{width:47px}.flower-slot:before{width:45px;height:45px;top:6px}footer{padding:24px 36px}.room-topline-right{display:none}.room-hint{font-size:9px;line-height:1.8}}
@media(max-width:760px){.site-header{height:77px;padding:0 23px}.brand{font-size:10px;gap:9px;letter-spacing:2px}.brand svg{width:22px}.header-note{display:none}.hero{display:flex;flex-direction:column;padding:0 22px;margin:17px auto 30px;gap:27px}.intro{width:100%;text-align:center;padding:0;position:relative}.intro .eyebrow{justify-content:center;font-size:8px;letter-spacing:2px;margin-bottom:17px}.english-title{font-size:55px;line-height:1.05;margin:0 0 16px;letter-spacing:-1.7px}.english-title br{display:none}.english-title br:after{content:' '}.intro h1{font-size:23px;line-height:1.7;letter-spacing:2.5px;margin-bottom:14px}.intro h1 br{display:none}.intro-copy{font-size:11px;line-height:2.1;margin:0 0 18px}.primary-button{min-height:44px;padding:13px 23px;font-size:11px}.intro-footnote{font-size:8px;margin:12px 0 0}.date-mark{display:none}.room-column{width:100%;max-width:560px}.room-topline{font-size:7px;letter-spacing:1.6px;margin:0 5px 12px}.room-topline-right{display:flex;font-size:8px;letter-spacing:.5px}.room{border-radius:96px 96px 8px 8px;aspect-ratio:1.5;scroll-margin-top:20px}.room-caption{font-size:15px;bottom:17px}.room-hint{font-size:9px;letter-spacing:.1px;margin:12px 0 0}.point{width:27px;height:27px;font-size:19px}.hotspot-label{font-size:9px;top:44px;padding:5px 8px}.collection{margin:0 22px;padding:25px 0 23px;display:grid;grid-template-columns:1fr 1fr;gap:22px 6px}.collection-copy .eyebrow{font-size:7px;letter-spacing:1.2px;margin-bottom:9px}.collection-copy h2{font-size:18px;letter-spacing:1px;margin-bottom:8px}.collection-copy>p:last-child{font-size:9px;line-height:1.8;max-width:200px}.flower-slots{grid-row:2;grid-column:1/-1;justify-content:center;gap:19px}.flower-slot{width:46px}.collection-action{min-width:0}.collection-action>p{margin:0 0 9px}.collection-action strong{font-size:22px}.collection-action>p span{font-size:12px}.bouquet-button{font-size:10px;padding:10px 12px;gap:12px;min-height:40px}footer{padding:24px 22px 25px;flex-wrap:wrap;gap:14px}footer>span:first-child{font-size:11px}footer>span:nth-child(2){order:3;width:100%;text-align:center;font-size:7px;margin-top:1px}footer button{font-size:8px;padding:5px 0}.bouquet-dialog[open]{display:block}.bouquet-dialog{max-height:91dvh;width:420px}.final-art-panel{min-height:0;padding:28px 10px 25px}.final-art-panel .eyebrow{margin-bottom:0}#bouquet-art{max-width:220px}.handwritten{font-size:28px;margin:0 0 12px}.final-letter{padding:28px}.final-letter h2{font-size:25px;line-height:1.65;margin-bottom:15px}.final-letter h2 br{display:none}.final-letter .eyebrow{margin-bottom:14px}.final-letter #letter-copy{font-size:11px}.final-actions{margin-top:3px}.flower-dialog{padding:28px 22px 22px}.flower-art{height:170px}.flower-art svg{height:167px}.flower-dialog h2{font-size:23px}.flower-message{font-size:11px;line-height:2;margin-bottom:20px}.flower-dialog .eyebrow{font-size:8px}.close-dialog{top:7px;right:7px}.reset-dialog{padding:27px}.reset-dialog h2{font-size:19px}.reset-dialog p{font-size:11px}}
@media(max-width:365px){.hero{padding:0 16px}.intro h1{font-size:21px}.english-title{font-size:49px}.room-topline-right{font-size:7px}.collection{margin:0 16px}.flower-slots{gap:13px}.room-hint{font-size:8px}.collection-copy h2{font-size:16px}.bouquet-button{font-size:9px;padding:9px;gap:8px}.collection-copy>p:last-child{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}.falling-petal{display:none}}

/* Keep the keepsake row aligned with the room. */
@media(min-width:1101px){.collection{width:calc(100% - 120px)}}
#card-preview{margin-top:12px;font-size:10px;color:#788768}#card-preview summary{cursor:pointer;min-height:28px;padding:6px 0}#card-image{width:100%;height:auto;display:block;margin-top:10px;border:1px solid #dce1d1}#card-download{display:block;text-align:center}

@media(max-width:760px){.english-title{font-size:clamp(34px,10.5vw,43px);white-space:nowrap;letter-spacing:-1.4px}.intro h1 br{display:initial}.intro h1{font-size:22px;line-height:1.7}.intro-copy{font-size:12px;line-height:2}.collection-copy h2{font-size:16px;letter-spacing:.5px;white-space:nowrap}.room{border-radius:72px 72px 8px 8px}.flower-message{font-size:12px}}

.intro-copy,.flower-message{color:#6f7766}.collection-copy>p:last-child{color:#747d68}.hotspot[data-flower="4"] .hotspot-label{top:auto;bottom:46px;right:0}.hotspot[data-flower="3"] .hotspot-label{right:0}
@media(max-width:760px){.hotspot{width:44px;height:44px}}

/* A compact portrait layout, with room-sized touch targets preserved. */
@media (max-width:760px) {
  .site-header{height:44px;padding:0 18px;justify-content:center}
  .brand{font-size:9px;gap:7px}
  .brand svg{width:18px;height:27px}
  .hero{margin:5px auto 12px;padding:0 18px;gap:14px}
  .intro .eyebrow{font-size:7px;letter-spacing:1.7px;margin-bottom:7px}
  .english-title{font-size:clamp(30px,9vw,36px);line-height:1.05;margin:0 0 8px}
  .intro h1{font-size:clamp(15px,4.4vw,18px);line-height:1.6;letter-spacing:1px;margin:0 0 9px}
  .intro h1 br{display:none}
  .intro-copy{font-size:11px;line-height:1.8;letter-spacing:.4px;margin:0 0 7px}
  .intro-copy br{display:none}
  .intro-copy{text-wrap:balance}
  .intro-footnote{font-size:8px;margin:0;line-height:1.6}
  .room-topline{margin:0 3px 7px}
  .room{border-radius:60px 60px 7px 7px}
  .room-caption{font-size:13px;bottom:11px}
  .room-hint{font-size:9px;line-height:1.6;margin:7px 0 0}
  .room-hint>span{font-size:13px}
  .collection{margin:0 18px;padding:12px 0;min-height:0;grid-template-columns:minmax(0,1fr) auto;gap:7px 10px}
  .collection-copy{grid-column:1;grid-row:1}
  .collection-copy .eyebrow{font-size:7px;margin:0 0 3px;letter-spacing:1px}
  .collection-copy h2{font-size:16px;margin:0 0 4px;letter-spacing:.5px}
  .collection-copy>p:last-child{font-size:9px;line-height:1.6;max-width:none;letter-spacing:0}
  .flower-slots{grid-column:1;grid-row:2;justify-content:flex-start;gap:7px}
  .flower-slot{width:30px;height:43px}
  .flower-slot:before{width:28px;height:28px;top:2px}
  .flower-slot>span{font-size:12px;margin-top:-11px}
  .flower-slot svg{width:30px;height:43px}
  .flower-slot .slot-dot{width:2px;height:2px}
  .collection-action{grid-column:2;grid-row:1 / 3;align-self:center}
  .collection-action>p{margin:0 0 7px}
  .collection-action strong{font-size:21px}
  .collection-action>p span{font-size:11px}
  .bouquet-button{min-height:44px;font-size:10px;padding:10px;gap:9px;letter-spacing:.3px}
  footer{padding:5px 18px 6px;gap:1px 12px}
  footer>span:first-child{font-size:10px}
  footer>span:nth-child(2){font-size:8px;line-height:1.6;margin:0;letter-spacing:0}
  footer button{font-size:9px;min-height:32px;padding:8px 0}
  .final-art-panel{display:grid;grid-template-columns:118px 1fr;grid-template-rows:auto auto auto;column-gap:8px;padding:21px 18px 14px;justify-items:center;align-content:center}
  #bouquet-art{grid-column:1;grid-row:1 / 4;width:118px}
  .final-art-panel .eyebrow{grid-column:2;align-self:end;font-size:6px;letter-spacing:1px;margin:0;text-align:center}
  .handwritten{grid-column:2;font-size:23px;letter-spacing:-.7px;margin:4px 0}
  .bouquet-date{grid-column:2;font-size:7px;letter-spacing:1.5px;align-self:start}
  .final-letter{padding:20px 25px 15px}
  .final-letter .eyebrow{margin-bottom:9px}
  .final-letter h2{font-size:23px;line-height:1.6;margin-bottom:12px}
  .final-letter #letter-copy{font-size:11px;line-height:2}
  .final-letter #letter-copy p{margin-bottom:11px}
  .final-actions .text-button{min-height:36px;padding:10px 0}
}
@media (max-width:365px) {
  .hero{padding:0 14px;gap:11px}
  .collection{margin:0 14px;gap:7px}
  .flower-slots{gap:3px}
  .collection-copy h2{font-size:15px}
  .collection-copy>p:last-child{font-size:8px}
  .bouquet-button{font-size:9px;padding:9px;gap:5px}
  .room-hint{font-size:8px}
  .final-art-panel{grid-template-columns:95px 1fr;padding:18px 14px 10px}
  #bouquet-art{width:95px}
  .handwritten{font-size:21px}
  .final-letter{padding:16px 19px 12px}
  .final-letter h2{font-size:21px}
}
@media (max-width:760px) and (max-height:700px) {
  .site-header{height:36px}
  .hero{margin-top:2px;margin-bottom:8px;gap:9px}
  .intro .eyebrow{margin-bottom:4px}
  .english-title{font-size:30px;margin-bottom:5px}
  .intro h1{margin-bottom:5px}
  .intro-copy{line-height:1.65;margin-bottom:5px}
  .room-topline{margin-bottom:5px}
  .room-hint{margin-top:5px}
  .collection{padding-top:9px;padding-bottom:9px}
  footer{padding-top:3px;padding-bottom:5px}
}
/* On short screens, omit only repeated decorative labels. */
@media (max-width:760px) and (max-height:620px) {
  .site-header{height:30px}
  .intro .eyebrow,.room-topline,.collection-copy .eyebrow{display:none}
  .english-title{font-size:26px;line-height:1;margin-bottom:4px}
  .intro h1{font-size:16px;line-height:1.4;margin-bottom:4px}
  .hero{gap:6px;margin-bottom:5px}
  .room-hint{font-size:8px;line-height:1.4;margin-top:4px}
  .collection{padding:6px 0;gap:4px 8px}
  .flower-slot,.flower-slot svg{height:36px}
  .flower-slot>span{margin-top:-5px}
  footer{gap:0 12px;padding-top:2px;padding-bottom:3px}
  footer button{min-height:28px;padding:6px 0}
  .final-art-panel{padding-top:16px;padding-bottom:10px}
  .final-letter .eyebrow{margin-bottom:6px}
  .final-letter #letter-copy{line-height:1.8}
  .final-letter #letter-copy p{margin-bottom:8px}
}