@charset "UTF-8";
:root{--paper:#f6f4f0;--ink:#373d37;--muted:#93948b;--line:#e7e7df;--green:#697b55;--accent:#e8ebd9;--lavender:#e8e2f3}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit}button,a,input,summary,label{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #9eae83;outline-offset:3px}button:disabled{cursor:wait;opacity:.6}[hidden]{display:none!important}button{transition:background .18s,transform .18s}.topbar{height:83px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;margin:0 5%;gap:25px}.brand{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:650;text-decoration:none;white-space:nowrap}.brand-icon{font-size:31px;line-height:1;color:var(--green);font-weight:400}.brand-en{font-size:8px;letter-spacing:1.9px;font-weight:500;border-left:1px solid #d3d5c7;padding-left:15px;margin-left:4px;color:#8e9583}.top-note{font-size:11px;color:#919384;letter-spacing:1px}.quiet{border:0;background:none;color:#7c8473;padding:8px 0}.quiet span{margin-left:14px}.quiet:hover{color:#354d30}.quiet.small{font-size:11px;white-space:nowrap}main{max-width:1370px;margin:auto;padding:0 5%}.intro{display:flex;justify-content:space-between;align-items:center;padding:44px 3px 35px}.overline{font-size:9px;color:#9ca38b;letter-spacing:2.6px;margin:0 0 12px}.intro h1{font-size:clamp(25px,2.5vw,36px);font-weight:500;letter-spacing:1px;line-height:1.5;margin:0 0 12px}.intro h1 span{font-family:Georgia,"Songti SC","SimSun",serif;font-weight:400;color:#77875e}.intro-copy{font-size:12px;color:#8b8e81;margin:0;line-height:1.9}.intro-stamp{width:90px;height:90px;border:1px solid #cfceb9;border-radius:50%;transform:rotate(12deg);display:grid;place-items:center;color:#9a9f81;margin-right:20px;position:relative;font:11px/1.8 Georgia,"Songti SC",serif;text-align:center;letter-spacing:3px}.intro-stamp i{position:absolute;right:-10px;bottom:-5px;background:var(--paper);font-size:31px;font-style:normal}.workspace{display:grid;grid-template-columns:minmax(0,1.28fr) minmax(345px,.9fr);gap:30px;align-items:start}.editor-panel{border:1px solid #e6e6de;background:#fffefa;border-radius:18px;overflow:hidden;min-width:0;box-shadow:0 3px 15px #5b624203}.steps{display:flex;gap:0;border-bottom:1px solid var(--line);height:66px;padding:0 24px}.step{flex:1;border:0;border-bottom:2px solid transparent;background:none;color:#a0a293;font-size:12px;white-space:nowrap}.step span{font:11px Georgia,serif;margin-right:7px;color:#acb49b}.step.active{color:#5a7145;border-bottom-color:#768660}.step.active span{color:#5a7145}.step-pane{padding:26px 26px 0}.section-head{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:0 0 22px}.section-head h2{font-size:17px;font-weight:550;margin:0 0 6px;letter-spacing:.3px}.section-head p{font-size:11px;color:#999b8e;margin:0}.count{font-size:8px;color:#a4aa97;letter-spacing:1.3px;white-space:nowrap}.filters{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 20px}.filters button{border:0;border-radius:6px;padding:5px 11px;font-size:11px;background:transparent;color:#929786}.filters button.active{background:#edf0e2;color:#5f754a}.template-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 11px}.template-card{border:0;background:none;text-align:left;padding:0;min-width:0;position:relative}.template-art{height:137px;border:2px solid transparent;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden;transition:transform .2s}.template-card:hover .template-art{transform:translateY(-3px)}.template-card.selected .template-art{border-color:#7c9263;box-shadow:0 0 0 3px #eaf0df}.selection-mark{position:absolute;top:6px;right:7px;width:15px;height:15px;border-radius:50%;background:#7c9263;color:white;font-size:9px;line-height:15px;text-align:center;display:none}.selected .selection-mark{display:block}.art-icon{font-size:34px;line-height:1.1;margin-bottom:10px}.art-title{font-family:Georgia,"Songti SC","SimSun",serif;font-size:12px;letter-spacing:2px;line-height:1.5;text-align:center;white-space:pre-wrap}.art-line{font-size:5px;letter-spacing:1.2px;margin-top:7px;opacity:.65}.template-name{display:block;font-size:11px;margin-top:8px;color:#68745b}.template-category{font-size:8px;float:right;line-height:19px;color:#a7ad99}.template-art.winter{background:#dbe3e7;color:#697c9b}.winter .art-icon{color:#8c9cb2}.winter:before,.winter:after{content:'✧';position:absolute;left:10px;top:14px;color:#f9ffff;font-size:15px}.winter:after{left:auto;right:15px;top:auto;bottom:20px}.template-art.cosmos{background:radial-gradient(circle at 50% 100%,#4c567e,#262b45);color:#d4c8f0}.cosmos .art-icon{font-size:43px}.template-art.letter{background:repeating-linear-gradient(#efe5d4,#efe5d4 19px,#e2d7c5 20px);color:#987660}.template-art.birthday{background:#f7e8ae;color:#c08060}.birthday .art-icon{font-size:44px}.template-art.award{background:#d4ed92;color:#374c25;border-radius:0}.award .art-title{border-top:1px solid #6c8356;border-bottom:1px solid #6c8356;padding:4px;font-weight:700}.award .art-icon{font-size:29px}.template-art.invitation{background:#282c29;color:#c8b37d}.invitation .art-title{font-size:10px;letter-spacing:3px}.invitation:before{content:'';position:absolute;inset:8px;border:1px solid #c9b37960}.template-art.bloom{background:#e1e8d7;color:#7d9361}.bloom .art-icon{font-size:48px}.template-art.error{background:#202d27;color:#9ccea9}.error .art-title{font:10px Consolas,monospace;letter-spacing:0}.error .art-icon{font-size:36px}.panel-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:26px;padding:20px 0;border-top:1px solid #edece5}.panel-bottom p{font-size:10px;color:#a4a996;margin:0;max-width:130px}.tiny-dot,.live-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#aab68c;margin-right:4px}.primary{background:#71835c;border:1px solid #71835c;color:#fffdf6;border-radius:8px;padding:12px 17px;font-size:12px;display:inline-flex;align-items:center;justify-content:center;gap:22px;box-shadow:0 3px 8px #64764611}.primary:hover{background:#60744b}.primary span{font-size:18px;line-height:1}.preview-panel{background:#edece7;border-radius:18px;position:sticky;top:20px;padding:18px 22px 14px;border:1px solid #e5e4dc;min-width:0}.preview-head{display:flex;justify-content:space-between;align-items:center;color:#8d9580;font-size:10px;margin-bottom:22px;gap:8px}.live-dot{background:#8b9a73;margin-right:6px}.preview-tabs{display:flex;gap:3px;background:#e4e4db;border-radius:6px;padding:3px}.preview-tabs button{background:none;border:0;padding:5px 9px;font-size:10px;border-radius:4px;color:#909780}.preview-tabs button.active{background:#fafaf3;color:#71805d;box-shadow:0 1px 4px #66714b0c}.phone{border-radius:36px;background:#fffefa;padding:6px;border:1px solid #dadbd3;box-shadow:0 16px 30px #59614513,0 2px 4px #5961450c;width:min(100%,304px);margin:0 auto;overflow:hidden}.phone-top{height:28px;display:flex;align-items:center;justify-content:space-between;padding:0 15px;font-size:9px;position:relative;color:#41493e}.island{display:block;width:65px;height:14px;background:#353b35;border-radius:20px;position:absolute;left:50%;top:0;transform:translateX(-50%)}.phone iframe{width:100%;height:510px;border:0;display:block;border-radius:0 0 20px 20px;background:#bdcad2}.phone-bottom{height:15px;display:grid;place-items:center}.phone-bottom span{width:85px;height:3px;border-radius:4px;background:#73766b}.preview-caption{text-align:center;font-size:10px;color:#9b9f8e;margin-top:17px;letter-spacing:1px}.preview-caption span{color:#9aa882;margin-right:6px}.preview-meta{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#a4ab96;margin-top:11px}.preview-meta .quiet{font-size:9px}.pill{padding:4px 9px;background:#edf0e5;color:#899978;border-radius:20px;font-size:10px;white-space:nowrap}#giftForm label,.password-label{display:block;font-size:11px;color:#707967;margin-bottom:16px}input:not([type=checkbox],[type=range],[type=file]),textarea,select{display:block;width:100%;border:1px solid #e4e6dc;border-radius:7px;background:#fffefa;color:#59634f;padding:10px 12px;margin-top:7px;font-size:12px;outline:none;transition:border .15s}input:focus,textarea:focus,select:focus{border-color:#9cae81;box-shadow:0 0 0 2px #c5d0ae28}textarea{resize:vertical;line-height:1.8;min-height:65px}label small,.extras small{display:block;font-size:10px;color:#a1a593;margin-top:6px;line-height:1.8}.field-row{display:flex;gap:14px}.field-row label{flex:1;min-width:0}.upload-block{padding-top:8px;border-top:1px solid #edeee6}.upload-head{display:flex;justify-content:space-between;align-items:start;gap:12px}.upload-head h3{font-size:12px;font-weight:500;margin:10px 0 5px}.upload-head p{font-size:9px;color:#a1a793;margin:0 0 14px}#giftForm .upload-zone{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:130px;border:1px dashed #cdd5bc;border-radius:8px;background:#f6f8ef;cursor:pointer;color:#95a17f;padding:13px;overflow:hidden}.upload-zone.dragover{background:#e5edd5!important}.upload-zone input{display:none}.upload-symbol{font-size:27px;color:#b0ba9c}.upload-zone span:not(.upload-symbol){font-size:11px;overflow-wrap:anywhere}.compression{display:flex;gap:15px;align-items:center}.compression>label:first-child{flex:1}.compression>label:last-child{width:160px}.compression input[type=range]{display:inline-block;width:65%;vertical-align:middle;accent-color:#8ba26f}.compression output{font-size:10px;color:#9ca78a;display:inline-block;margin-left:8px}.compression select{padding:7px 8px;font-size:10px}#giftForm .extras{border-top:1px solid #edeee6;padding-top:14px}summary{list-style:none;font-size:11px;color:#788869;cursor:pointer;margin:0 0 13px}summary:after{content:'＋';float:right;color:#9eaa8b}details[open] summary:after{content:'−'}summary span{font-size:9px;color:#aab29d;margin-left:10px}.audio-label input{display:block;font-size:10px;width:100%;margin-top:8px;color:#9ca58b}.audio-info{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#a3aa96;margin:-5px 0 15px}.check{display:flex!important;align-items:center;gap:6px;font-size:10px!important}.check input{accent-color:#819966}.send-icon{font-size:28px;color:#8ba377}.publish-summary{background:#f1f4e9;border:1px solid #e6ecd9;border-radius:10px;padding:22px 17px;display:flex;align-items:center;gap:15px;margin:26px 0}.publish-summary>span{font-size:32px;color:#8ba477}.publish-summary>div{flex:1;min-width:0}.publish-summary strong{font-size:14px;font-weight:500;display:block;overflow-wrap:anywhere}.publish-summary p{font-size:10px;color:#9ca98c;margin:3px 0 0}.publish-summary button{font-size:10px}.password-label{margin:0 0 18px}.publish-button{width:100%;padding:14px;font-size:13px}.service-status{font-size:10px;color:#a4ad95;text-align:center;margin:10px 0 28px;line-height:1.9}.offline-option{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:24px 0;border-top:1px solid #edeee6}.offline-option h3{font-size:12px;font-weight:500;margin:0 0 5px}.offline-option p{font-size:10px;color:#a4aa98;margin:0}.secondary{border:1px solid #d6dfc8;border-radius:7px;padding:9px 12px;color:#7e916a;background:none;font-size:10px;white-space:nowrap}.secondary:hover{background:#edf1e5}.share-result{border-radius:10px;background:#f1f0f7;padding:22px;margin:24px 0}.result-label{font-size:8px;letter-spacing:1.8px;color:#a29bb7;margin:0}.share-result h3{font-size:16px;font-weight:500;color:#817294;margin:9px 0 15px}.copy-row{display:flex;gap:7px;align-items:stretch}.copy-row input{font-size:10px;margin:0;min-width:0;background:#fffefd;color:#9688a5}.copy-row button{border:0;border-radius:6px;background:#a393b9;color:white;padding:0 13px;font-size:11px}.share-result a{display:inline-block;color:#9280a6;font-size:11px;margin-top:15px;text-underline-offset:3px}.share-result>p:last-child{font-size:9px;color:#a69db5;line-height:1.8;margin:14px 0 0}.draft-tools{border-top:1px solid #edeee6;display:flex;justify-content:flex-end;gap:22px;padding:16px 0}.import-label{cursor:pointer}.import-label input{display:none}footer{display:flex;justify-content:space-between;gap:20px;font-size:9px;color:#a8ae9b;letter-spacing:.5px;padding:26px 0 30px}#toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%);background:#48513ff0;color:#f7f9ef;border-radius:10px;padding:14px 22px;font-size:12px;max-width:min(90vw,600px);z-index:10;box-shadow:0 8px 30px #48513f22;line-height:1.8;white-space:pre-wrap}.mobile-only{display:none}.no-templates{grid-column:1/-1;color:#aaa}
@media(min-width:1500px){main{max-width:1400px}.template-art{height:165px}.phone{width:330px}.phone iframe{height:565px}.preview-panel{padding-bottom:20px}.step-pane{padding-top:32px}.template-grid{gap:22px 13px}.intro{padding-top:50px;padding-bottom:40px}}
@media(max-width:1050px){.brand-en,.top-note{display:none}.workspace{grid-template-columns:minmax(0,1fr) 325px;gap:18px}.preview-panel{padding:16px 13px}.template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.template-art{height:132px}.count{display:none}.step-pane{padding:23px 20px 0}.steps{padding:0 15px}.intro h1{font-size:28px}.phone iframe{height:510px}.panel-bottom{flex-wrap:wrap}.panel-bottom p{max-width:none}.template-grid{gap:15px}.template-name{font-size:12px}}
@media(max-width:740px){.topbar{height:68px;margin:0 5%}.brand{font-size:17px}.brand-icon{font-size:28px}.quiet{font-size:11px}main{padding:0 5%}.intro{padding-top:30px;padding-bottom:25px}.intro h1{font-size:25px;line-height:1.7;letter-spacing:0}.intro h1 span{display:block}.intro-copy{font-size:11px}.intro-stamp{width:68px;height:68px;font-size:9px;margin-right:8px;flex-shrink:0;margin-left:10px}.intro-stamp i{font-size:25px}.workspace{display:flex;flex-direction:column;gap:20px}.editor-panel{width:100%}.preview-panel{position:static;width:100%;padding:18px 20px}.preview-head{margin-bottom:20px}.template-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:15px 8px}.template-art{height:115px}.art-title{font-size:10px;letter-spacing:1px}.art-icon{font-size:29px}.art-line{font-size:4px;letter-spacing:.5px}.template-name{font-size:10px}.template-category{display:none}.section-head h2{font-size:16px}.section-head p{font-size:10px}.step-pane{padding:22px 17px 0}.steps{padding:0 14px;height:59px}.step{font-size:11px}.step span{margin-right:4px}.panel-bottom{margin-top:21px}.panel-bottom p{font-size:9px;max-width:110px}.primary{font-size:11px;padding:11px 14px;gap:15px}.preview-panel .phone{width:292px}.phone iframe{height:510px}.preview-caption{margin-top:15px}.preview-meta{max-width:292px;margin:10px auto 0}.offline-option{align-items:start}.offline-option p{max-width:180px}footer{font-size:8px;gap:10px}.mobile-only{display:block}}
@media(max-width:390px){.template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.template-art{height:145px}.art-title{font-size:13px}.template-name{font-size:11px}.intro h1{font-size:23px}.intro-stamp{display:none}.compression>label:last-child{width:135px}.step-pane{padding-left:15px;padding-right:15px}}
