:root{color-scheme:dark;--paper:#281936;--ink:#f4eaf9;--wine:#c9a3ed;--muted:#c4aed3}
body{background:#180e25}body:before{background:radial-gradient(ellipse at 5% 10%,#4a245333,transparent 60%);z-index:-1}header{max-width:1280px;padding:30px 5%;border-bottom:1px solid #dbc1ed20}header span:first-child{color:#e1c5f6}.tag{border-color:#ac85c54a;color:#d4b9e5;font-size:12px}main{max-width:1160px;padding:0 32px 70px}.hero{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;position:relative;min-height:470px}.intro{text-align:left;padding:54px 0 56px;position:relative;z-index:1}.eyebrow{color:#c2a0d7;line-height:1.7;font-size:12px}.intro>p:last-child{margin:0;max-width:440px;line-height:1.8;color:#c4aed3}h1{font-size:clamp(64px,7.8vw,100px);letter-spacing:-.05em;line-height:1.02;margin:28px 0}h1 em{color:#cea7f0}.flowers{margin:0;position:relative;height:490px;overflow:hidden;align-self:end}.flowers img{width:100%;height:100%;object-fit:cover;object-position:center 55%;mask-image:linear-gradient(to bottom,transparent,#000 12%,#000 87%,transparent)}.flowers figcaption{position:absolute;bottom:20px;left:0;right:0;text-align:center;font-family:Georgia,serif;font-style:italic;color:#dfc5ed;font-size:17px}.reading-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:36px;align-items:start;margin-top:8px}.letter-wrap{margin:0;max-width:none;width:100%}.letter{border:1px solid #9673ad50;border-radius:3px;padding:32px 38px;box-shadow:0 25px 70px #08040d40;background:linear-gradient(130deg,#30203e,#25172f)}.letter:before{background:#3b284b;border-color:#9673ad50}.letter-top{border-bottom-color:#b894cd30;padding-bottom:22px}.letter-top span:first-child{color:#ead8f5}.heart{color:#caa4e6}.preview p{font-size:24px}button{background:#d0afeb;color:#251433;border-radius:40px;font-size:15px;padding:15px 28px}button:hover{background:#e1c7f6}.quiet{color:#bda6cf!important}.body{font-size:19px;color:#e0d0ea}.body blockquote{color:#d5aff3;border-color:#a67bc5}.signature{color:#d9b6f5}.close{color:#c6aad9}.close:hover{color:white;background:transparent}.footnote{color:#b49cc6;max-width:420px}.song{padding:26px 22px 24px;border-top:1px solid #b894cd50;margin-top:0}.song h2{font-family:Georgia,serif;font-weight:400;font-size:37px;letter-spacing:-.03em;margin:14px 0}.song>p{color:#c4aed3;line-height:1.7;margin-bottom:24px}.song-player{display:flex;gap:15px;align-items:center;border-top:1px solid #b894cd25;padding:21px 0 18px}.music-note{display:grid;place-items:center;background:#3d2751;border:1px solid #9f77b652;width:53px;height:53px;border-radius:12px;font-size:28px;color:#dec3f2;flex-shrink:0}.song-player>div{min-width:0}.song-player strong{display:block;font-size:16px;font-weight:500;overflow-wrap:anywhere}.song-player #song-status{display:block;font-size:13px;line-height:1.6;color:#bda7cd;margin-top:5px}audio{width:100%;margin:4px 0 18px;height:44px}audio[hidden]{display:none}.choose-song{display:flex;justify-content:space-between;align-items:center;border:1px solid #a481ba75;border-radius:7px;padding:13px 16px;font-size:14px;color:#e4d0f3;cursor:pointer;min-height:48px}.choose-song:hover{background:#392547}.song:focus-within .choose-song{outline:2px solid #c99aeb;outline-offset:3px}#song-file{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}.song .song-help{font-size:12px;line-height:1.75;margin:13px 0 0;color:#b9a0cb}footer{color:#a58bb8;font-size:12px;padding-bottom:30px;letter-spacing:.1em}button:focus-visible{outline-color:#ead2ff}.body:focus-visible{outline:2px solid #b491cd;outline-offset:8px}
@media(max-width:750px){main{padding:0 22px 45px}.hero{grid-template-columns:1fr;min-height:0}.intro{padding:42px 0 22px;text-align:center}.intro>p:last-child{margin:auto}h1{font-size:72px}.flowers{height:290px;width:100%;max-width:430px;justify-self:center}.flowers img{object-position:center 48%;mask-image:linear-gradient(to bottom,transparent,#000 15%,#000 80%,transparent)}.flowers figcaption{bottom:10px}.reading-layout{grid-template-columns:1fr;gap:28px;margin-top:22px}.letter{padding:28px 25px}.song{padding:24px 12px;max-width:480px;width:100%;justify-self:center}.tag{font-size:10px;max-width:180px;text-align:center}header{gap:16px;padding:24px}.intro .eyebrow{font-size:11px}.preview p{font-size:22px}.song h2{font-size:34px}}