:root{--ink:#26362f;--muted:#7c817b;--paper:#fbf8f3;--cream:#f5f0e7;--line:#e7e0d5;--sage:#739184;--sage-dark:#43695c;--peach:#d7a58b;--rose:#f6e5df;--gold:#bd9a62;--shadow:0 24px 80px rgba(51,57,48,.095);font-family:Arial,Helvetica,sans-serif;color:var(--ink)}
*{box-sizing:border-box}body{margin:0;background:var(--paper);min-height:100vh}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}a{color:inherit}h1,h2,h3,p{margin:0}h1,h2,.serif{font-family:Georgia,'Times New Roman',serif;font-weight:normal}h1{font-size:clamp(42px,5vw,68px);letter-spacing:-2.2px;line-height:1.08}h2{font-size:clamp(29px,3vw,40px);letter-spacing:-1px}h3{font-size:22px;font-family:Georgia,'Times New Roman',serif;font-weight:normal}.eyebrow{text-transform:uppercase;letter-spacing:2.8px;font-size:10px;font-weight:700;color:var(--sage-dark)}.muted{color:var(--muted)}.small{font-size:12px}.tiny{font-size:11px}.soft{color:#9e9f98}.bold{font-weight:700}.italic{font-style:italic}.hidden{display:none!important}
.btn{border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:12px 18px;border-radius:14px;font-weight:700;font-size:13px;transition:transform .15s,background .15s,color .15s;white-space:nowrap;background:transparent;color:var(--ink)}.btn:active,.icon-btn:active{transform:scale(.97)}.btn.primary{background:var(--sage-dark);color:white}.btn.primary:hover{background:#2d5144}.btn.ghost{border-color:var(--line);background:#fffdfa}.btn.soft{background:#f0eae0}.btn.plain{padding:9px 11px}.btn.danger{background:#fcf0ed;color:#9b4b3f}.btn.smallbtn{padding:8px 10px;font-size:12px;border-radius:10px}.icon-btn{border:1px solid var(--line);display:inline-grid;place-items:center;background:#fffdf9;border-radius:12px;height:40px;width:40px;color:var(--ink)}.icon{width:19px;height:19px;display:inline-block;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}.icon.sm{width:16px;height:16px}.icon.lg{width:24px;height:24px}
.pill{font-size:10px;border-radius:100px;padding:7px 10px;letter-spacing:1.3px;text-transform:uppercase;background:#eaf1ea;color:#4c6a5d;font-weight:800}.demo-ribbon{position:fixed;z-index:1000;right:10px;top:10px;pointer-events:none;background:#fff5dc;color:#886a32;border:1px solid #ead29d;padding:5px 9px;border-radius:30px;font-size:9px;font-weight:800;letter-spacing:1px;box-shadow:0 6px 18px #0001}
.welcome{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(circle at 18% 10%,#fffefd 0,transparent 32%),linear-gradient(145deg,#faf5ed,#f5eee4 70%,#ebefea)}.welcome-top{display:flex;align-items:center;justify-content:space-between;padding:26px clamp(24px,5vw,72px)}.brandline{display:flex;align-items:center;gap:10px;font-family:Georgia,serif;font-size:19px;letter-spacing:-.5px}.brand-symbol{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;border:1px solid #bdad98;font-size:20px;color:#94765e}.welcome-core{width:min(1170px,100%);padding:35px 34px 70px;margin:auto;display:grid;grid-template-columns:1.04fr .96fr;align-items:center;gap:65px}.welcome-copy{max-width:520px}.welcome-copy .eyebrow{margin-bottom:23px}.welcome-copy h1 em{font-style:italic;color:#9b7865}.welcome-copy .lead{font-family:Georgia,serif;font-size:22px;line-height:1.6;color:#6c7068;margin:29px 0 21px}.welcome-copy .note{font-size:14px;line-height:1.9;color:#88877f;max-width:460px}.signature{font-family:Georgia,serif;font-size:23px;font-style:italic;color:#aa8a73;margin:24px 0 31px}.welcome-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.welcome-art{position:relative;min-height:525px}.polaroid{position:absolute;background:#fff;padding:11px 11px 30px;box-shadow:0 18px 65px #7e776c3a;border:1px solid #fff;transform:rotate(var(--tilt));width:60%;border-radius:3px}.polaroid .photo-art{height:260px}.polaroid.one{top:6%;left:6%;--tilt:-11deg}.polaroid.two{top:10%;right:0;--tilt:9deg}.polaroid.three{width:52%;top:46%;left:28%;--tilt:-2deg}.polaroid.three .photo-art{height:200px}.welcome-seal{position:absolute;bottom:2%;right:4%;z-index:2;background:#f2e3d2;border:1px solid #e1c5ab;color:#9a765c;width:115px;height:115px;display:grid;place-items:center;border-radius:50%;text-align:center;font-family:Georgia,serif;font-style:italic;font-size:15px;line-height:1.3;transform:rotate(12deg)}.welcome-foot{text-align:center;padding:18px;color:#aaa69e;font-size:11px;letter-spacing:1.6px;text-transform:uppercase}
.welcome-art::before{content:"";position:absolute;left:-56px;bottom:-35px;width:255px;height:315px;background:url('flowers.svg') center/contain no-repeat;opacity:.8;transform:rotate(-25deg);pointer-events:none;z-index:1}.welcome-art::after{content:"";position:absolute;right:-48px;top:-57px;width:177px;height:218px;background:url('flowers.svg') center/contain no-repeat;opacity:.46;transform:rotate(21deg);pointer-events:none}.welcome-copy::before{content:"";display:block;width:46px;height:66px;background:url('flowers.svg') center/contain no-repeat;opacity:.7;margin-bottom:8px}.hero::after{content:"";position:absolute;right:25px;bottom:-95px;width:290px;height:350px;background:url('flowers.svg') center/contain no-repeat;opacity:.42;transform:rotate(-22deg);pointer-events:none}.letter-head{position:relative;overflow:hidden}.letter-head::after{content:"";position:absolute;right:53px;top:-35px;width:180px;height:220px;background:url('flowers.svg') center/contain no-repeat;opacity:.3;transform:rotate(25deg);pointer-events:none}.voice-head::after{opacity:.2}
.login-box{max-width:440px;width:100%;margin:35px auto 70px;background:#fffdf8;padding:38px;border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow)}.login-box h2{margin:10px 0 14px}.login-box p{line-height:1.7;font-size:14px}.form-label{font-size:12px;font-weight:700;display:block;margin:22px 0 8px}.field{width:100%;border:1px solid #dfd8cd;background:#fff;padding:13px 14px;border-radius:12px;outline:none;color:var(--ink)}.field:focus,.search input:focus{border-color:var(--sage);box-shadow:0 0 0 3px #73918420}.login-note{font-size:11px;color:#898b86;margin:12px 0 19px}.error{color:#a7524a;font-size:12px;min-height:18px}
.shell{display:grid;grid-template-columns:246px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;align-self:start;height:100vh;background:#f6f2eb;border-right:1px solid var(--line);display:flex;flex-direction:column;padding:33px 21px 22px;gap:25px}.sidebar-brand{padding:0 12px 21px;border-bottom:1px solid #e2dcd2}.sidebar-brand h2{font-size:28px;letter-spacing:-1px;margin-bottom:5px}.sidebar-brand small{color:#8e918b;font-size:10px;letter-spacing:1.5px;text-transform:uppercase}.nav{display:flex;flex-direction:column;gap:5px}.nav button{border:0;width:100%;display:flex;align-items:center;gap:13px;padding:13px 14px;text-align:left;color:#72766e;background:transparent;border-radius:12px;font-size:13px;font-weight:700}.nav button.active{background:#e5ebe3;color:var(--sage-dark)}.nav button:hover:not(.active){background:#ebe6dd}.sidebar-quote{margin-top:auto;border-top:1px solid var(--line);padding:25px 12px 0;font-family:Georgia,serif;color:#9f9d91;line-height:1.6;font-size:15px;font-style:italic}.sidebar-footer{font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:#b6b3aa;padding-left:12px}.main{width:100%;max-width:1440px;margin:0 auto;padding:27px clamp(22px,4.5vw,62px) 70px;min-width:0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:38px}.mobile-brand{display:none}.topbar-left{display:flex;align-items:center;gap:10px;color:#8c8e87;font-size:12px}.topbar-right{display:flex;align-items:center;gap:8px}.avatar{border-radius:50%;display:grid;place-items:center;background:#dce6df;color:#547464;width:39px;height:39px;font-family:Georgia,serif;font-size:14px}.content{animation:enter .22s ease both}@keyframes enter{from{opacity:.6;transform:translateY(6px)}to{opacity:1;transform:none}}
.hero{background:#eff2ea;border:1px solid #e1e9df;border-radius:26px;min-height:265px;display:flex;justify-content:space-between;overflow:hidden;position:relative;margin-bottom:31px}.hero-copy{padding:37px 36px;position:relative;z-index:1;max-width:650px}.hero h1{font-size:clamp(30px,3.6vw,51px);margin:12px 0}.hero p{line-height:1.7;color:#727b71;font-family:Georgia,serif;font-size:17px;max-width:480px}.hero .btn{margin-top:22px}.hero-ornament{width:290px;position:absolute;right:-20px;bottom:-85px;opacity:.35;transform:rotate(15deg)}.hero-ornament svg{width:100%;height:auto;stroke:#9bb3a0;fill:none;stroke-width:3}.section-head{display:flex;align-items:end;justify-content:space-between;gap:15px;margin:24px 0 18px}.section-head .eyebrow{margin-bottom:8px}.section-sub{color:var(--muted);font-size:13px;margin-top:10px;line-height:1.65}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-bottom:30px}.stat{border:1px solid var(--line);background:#fffcf7;border-radius:16px;padding:17px 18px}.stat strong{display:block;font-size:24px;font-family:Georgia,serif;font-weight:normal;margin:8px 0 4px}.stat span{font-size:11px;color:#8c8f88}.stat .icon{color:var(--sage)}
.photo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.photo-tile{border:0;background:transparent;padding:0;text-align:left;min-width:0;position:relative}.photo-art{position:relative;width:100%;height:100%;overflow:hidden;background:#e9e1d8}.photo-art svg{display:block;width:100%;height:100%;object-fit:cover}.tile-image{border-radius:14px;aspect-ratio:4/4.5;overflow:hidden;background:#d9d9d0}.tile-image .photo-art{height:100%}.photo-tile:hover .tile-image{box-shadow:0 12px 28px #2222}.tile-meta{display:flex;justify-content:space-between;align-items:center;gap:7px;padding:9px 2px 2px}.tile-meta strong{font-size:12px;display:block;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tile-meta span{font-size:10px;color:var(--muted)}.heart{background:#fffdf6d9;border:0;position:absolute;right:9px;top:9px;width:31px;height:31px;border-radius:50%;display:grid;place-items:center;color:#8e958c}.heart.isfav{color:#c66f73}.heart.isfav .icon{fill:#c66f73}.grid-label{font-family:Georgia,serif;font-size:20px;margin:30px 0 14px}.grid-label:first-child{margin-top:8px}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:13px;margin:21px 0 25px;flex-wrap:wrap}.search{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fffdf9;border-radius:12px;padding:0 12px;min-height:43px;width:min(320px,100%)}.search input{border:0;outline:none;width:100%;background:transparent;font-size:13px;color:var(--ink)}.chip{border:1px solid #dfdcd4;color:#656b64;background:#fffdf9;border-radius:30px;padding:10px 14px;font-size:12px;font-weight:700}.chip.active{background:var(--sage-dark);color:white;border-color:var(--sage-dark)}
.album-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px;margin-top:25px}.album-card{padding:0;background:#fffdf9;border:1px solid var(--line);border-radius:17px;text-align:left;overflow:hidden;min-width:0;position:relative}.album-art{height:175px;display:grid;grid-template-columns:repeat(2,1fr);gap:3px;background:#ece7e0}.album-art .photo-art{height:100%}.album-info{padding:17px 16px;display:flex;align-items:center;justify-content:space-between;gap:8px}.album-info strong{font-family:Georgia,serif;font-size:20px;font-weight:normal;display:block}.album-info small{font-size:11px;color:var(--muted);display:block;margin-top:6px}.album-menu{position:absolute;right:10px;top:10px;background:#fffc;border:0;border-radius:50%;height:33px;width:33px;display:grid;place-items:center;z-index:1}.album-card:hover{box-shadow:0 12px 28px #2221}.album-view-head{display:flex;align-items:center;gap:15px;margin-bottom:10px}
.letter-head{padding:30px;background:#f7ebe7;border:1px solid #f0dcd5;border-radius:22px;display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:22px}.letter-head h2{margin:10px 0}.letter-head p{font-size:14px;line-height:1.7;color:#8c786f;max-width:510px}.letter-head .decor{color:#cb9d90;opacity:.65}.folder-row{display:flex;flex-wrap:wrap;gap:9px;margin:23px 0}.folder-chip{border-radius:11px;border:1px solid var(--line);padding:11px 12px;display:flex;align-items:center;gap:8px;background:#fffcf7;font-size:12px;font-weight:700}.folder-chip.active{background:#e7eee8;color:var(--sage-dark);border-color:#cfddcf}.folder-chip .mini-edit{border:0;background:transparent;padding:2px;color:#8b958c}.document-list{display:grid;gap:11px}.doc-row{background:#fffdf9;border:1px solid var(--line);border-radius:16px;padding:17px;display:flex;align-items:center;gap:15px;min-width:0}.doc-icon{height:53px;width:48px;display:grid;place-items:center;border-radius:11px;background:#f8eae4;color:#be8e7d;flex:none}.doc-icon.voice{background:#e9eee5;color:#6b8d7e}.doc-text{flex:1;min-width:0}.doc-text strong{font-size:14px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.doc-text small{font-size:11px;color:var(--muted);display:block;margin-top:7px}.doc-actions{display:flex;gap:7px}.empty{border:1px dashed #ddd5c9;border-radius:17px;text-align:center;padding:35px;color:#9b9c95;margin:15px 0}.empty .icon{margin-bottom:12px;color:#a8aaa1}
.voice-head{background:#eaf0e9;border-color:#dbe6db}.voice-head p{color:#728879}.voice-head .decor{color:#779786}.playbar{display:flex;align-items:center;gap:8px;margin-top:10px}.play-track{width:110px;height:5px;background:#e3e1d7;border-radius:10px;overflow:hidden}.play-track span{display:block;width:39%;height:100%;background:#91a69a}.voice-row{align-items:flex-start}.voice-row .doc-icon{margin-top:3px}.voice-row .doc-actions{align-self:center}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0}.panel{background:#fffdf9;border:1px solid var(--line);padding:24px;border-radius:20px}.panel h3{margin:4px 0 11px}.panel p{font-size:13px;color:var(--muted);line-height:1.7}.panel .btn{margin-top:18px}.name-list{margin:18px 0 0;display:grid;gap:9px}.name-row{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #eee7de;padding-bottom:8px;gap:8px;font-size:13px}.name-row:last-child{border:0}.bar{height:8px;background:#ebe9e2;border-radius:100px;overflow:hidden;margin:18px 0 8px}.bar>div{width:19%;background:var(--sage);height:100%;border-radius:10px}.settings-note{padding:16px;border:1px solid #dce6dc;background:#f1f6f0;border-radius:15px;display:flex;gap:12px;font-size:12px;line-height:1.7;color:#607b69}
.mobile-nav{display:none}.mobile-gear{display:none}.modal-backdrop{position:fixed;inset:0;background:#26362f99;z-index:2000;display:grid;place-items:center;padding:20px;backdrop-filter:blur(4px)}.modal{width:min(530px,100%);background:#fffdf9;border-radius:23px;padding:26px;max-height:90vh;overflow-y:auto;box-shadow:0 34px 100px #16221955}.modal.wide{width:min(790px,100%)}.modal-head{display:flex;align-items:start;justify-content:space-between;gap:14px;margin-bottom:19px}.modal-head h3{font-size:26px}.modal-foot{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:24px}.modal p{font-size:13px;color:#777f75;line-height:1.7}.modal .field{margin-top:6px}.modal .form-label{margin-top:16px}.preview-photo{height:370px;border-radius:12px;overflow:hidden}.preview-photo .photo-art{height:100%}.preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:15px;flex-wrap:wrap}.pdf-sheet{background:#fff;border:1px solid #e7e4df;box-shadow:0 10px 30px #26221815;max-width:350px;margin:0 auto;min-height:330px;padding:48px 38px;text-align:center}.pdf-sheet h3{margin:18px 0 12px}.pdf-sheet p{font-family:Georgia,serif;color:#a39b91;font-size:14px;line-height:2}.pdf-rule{height:1px;background:#dfd5c9;width:90px;margin:28px auto}.upload-stage{padding:26px;text-align:center;border:1px dashed #d6cfbf;background:#faf7f0;border-radius:17px;margin-top:18px}.upload-stage .icon{color:#9d9586}.upload-stage strong{display:block;margin:14px 0 10px;font-size:14px}#toast{position:fixed;z-index:3000;bottom:20px;left:50%;transform:translate(-50%,120px);padding:13px 18px;border-radius:13px;background:#334f42;color:white;box-shadow:0 15px 40px #0002;font-size:12px;transition:transform .25s;max-width:90vw;text-align:center}#toast.show{transform:translate(-50%,0)}
@media(max-width:1060px){.shell{grid-template-columns:205px minmax(0,1fr)}.sidebar{padding:25px 13px}.photo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.album-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.welcome-core{gap:25px}.welcome-art{min-height:450px}.polaroid .photo-art{height:205px}.polaroid.three .photo-art{height:175px}}
@media(max-width:720px){.demo-ribbon{right:8px;top:8px;font-size:8px}.welcome-top{padding:23px}.welcome-core{display:flex;flex-direction:column-reverse;align-items:stretch;padding:0 25px 40px;gap:10px}.welcome-art{height:280px;min-height:280px;margin:0 auto;width:min(360px,100%)}.polaroid{padding:7px 7px 20px}.polaroid.one{top:9%;left:3%;width:56%}.polaroid.two{top:7%;right:3%;width:53%}.polaroid.three{top:43%;width:48%;left:28%}.polaroid .photo-art{height:125px}.polaroid.three .photo-art{height:110px}.welcome-seal{width:75px;height:75px;font-size:10px;bottom:0;right:4%}.welcome-copy{text-align:center;margin:0 auto}.welcome-copy .eyebrow{margin-bottom:12px}.welcome-copy .lead{font-size:18px;margin:15px 0}.welcome-copy .note{font-size:12px}.signature{margin:12px 0 23px}.welcome-actions{justify-content:center}.welcome-foot{padding:22px}.shell{display:block}.sidebar{display:none}.main{padding:15px 16px 105px}.topbar{margin-bottom:20px}.topbar-left{display:none}.mobile-brand{display:block;font-family:Georgia,serif;font-size:22px}.topbar-right{gap:7px}.topbar-right .desktop-only{display:none}.mobile-gear{display:inline-grid}.topbar .avatar{width:35px;height:35px}.mobile-nav{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);bottom:0;left:0;right:0;z-index:250;background:#fffdf8;border-top:1px solid #ece4d8;box-shadow:0 -8px 25px #26362f09;padding:9px 6px calc(9px + env(safe-area-inset-bottom))}.mobile-nav button{min-width:0;border:0;background:transparent;color:#8c928a;display:flex;flex-direction:column;align-items:center;gap:5px;font-size:9px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-nav button.active{color:var(--sage-dark)}.mobile-nav button.active .icon{stroke-width:2.5}.hero{border-radius:21px;min-height:0}.hero-copy{padding:29px 25px}.hero h1{font-size:33px}.hero p{font-size:14px;max-width:270px}.hero-ornament{right:-130px;opacity:.16}.stats{gap:8px}.stat{padding:13px 11px}.stat strong{font-size:21px}.stat span{font-size:10px}.section-head{align-items:start}.section-head h2{font-size:30px}.photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.tile-image{border-radius:12px}.tile-meta strong{font-size:11px}.album-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.album-art{height:120px}.album-info{padding:12px}.album-info strong{font-size:17px}.album-info small{font-size:10px}.letter-head{padding:21px}.letter-head .decor{display:none}.folder-row{gap:6px}.folder-chip{padding:9px;font-size:10px}.doc-row{padding:12px;gap:9px}.doc-icon{width:41px;height:46px}.doc-actions{gap:4px}.doc-actions .icon-btn{height:34px;width:34px}.settings-grid{grid-template-columns:1fr}.panel{padding:20px}.modal{padding:20px}.preview-photo{height:300px}.login-box{padding:25px;margin:35px auto}.voice-row{align-items:center}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}