@font-face{font-family:Xiaolai;src:url('assets/Xiaolai-Regular.ttf') format('truetype');font-display:swap}
:root{--ink:#315f8b;--blue:#416c92;--muted:#969fb8;--line:#e4edf5;--pale:#f0f7fb;--tab:#7896bf;--app-height:844px;--pad:20px;--dock-height:102px}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#eef3f7;color:var(--ink);font-family:Xiaolai,'KaiTi',sans-serif}button,input,textarea{font:inherit}button{cursor:pointer;color:inherit;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}button:focus-visible,a:focus-visible{outline:2px solid #6f8fbe;outline-offset:3px}button{border:0;background:none}body{display:flex;justify-content:center;padding:22px 0} .app{width:390px;height:var(--app-height);position:relative;overflow:hidden;background:linear-gradient(125deg,#fff 5%,#fdfefe 60%,#fff);box-shadow:0 12px 55px #315f8b12;border-radius:22px}
.preview-tools{position:fixed;left:max(24px,calc(50% - 455px));top:55px;width:200px;font-family:system-ui,sans-serif}.preview-tools strong{font-size:26px}.preview-tools p{font-size:14px;color:#7e8fa2;margin:8px 0 24px}.preview-tools nav{display:grid;gap:8px}.preview-tools button{font-family:inherit;text-align:left;font-size:14px;padding:12px 14px;border-radius:10px;background:#fff9}.preview-tools button.active{background:#416c92;color:white}.preview-tools #demo-fill{margin-top:20px;border:1px solid #cad9e6;font-size:12px}.preview-tools small{display:block;font-size:11px;line-height:1.9;color:#8291a2;margin-top:20px}
#header{height:104px;position:absolute;inset:0 0 auto;padding:22px var(--pad) 8px;display:flex;align-items:center;justify-content:space-between;z-index:3;background:#ffffffed}.brand{display:block;width:144px;height:57px;position:relative;overflow:hidden;flex:none}.brand img{position:absolute;width:390px;height:auto;max-width:none;left:-15px;top:-60px;pointer-events:none}.header-link{display:flex;align-items:center;gap:5px;font-size:14px;color:var(--muted);min-height:44px;padding:0 0 0 5px}.header-link svg{color:var(--ink)}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}.page-heading{display:flex;align-items:center;gap:6px}.back{width:38px;height:44px;display:grid;place-items:center;margin-left:-10px}.page-heading h1{font-size:23px;font-weight:normal;margin:0}.header-small{font-size:14px;min-height:44px}
#content{position:absolute;left:0;right:0;top:104px;bottom:var(--dock-height);padding:0 var(--pad) 22px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;scroll-padding:18px}#content::-webkit-scrollbar{display:none}.intro{font-size:16px;line-height:1.6;color:var(--muted);margin:5px 0 20px}.modes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:18px}.mode{border-radius:30px;background:#f0f6fb;min-height:38px;font-size:17px}.mode.selected{background:linear-gradient(110deg,#819dc3,#6d8cbb);color:white}.upload-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 16px}.upload-grid.single{grid-template-columns:1fr}.upload-card{position:relative;height:156px;border:1px dashed #839eff;border-radius:14px;background:linear-gradient(130deg,#f6fbfe,#f0f8fc);overflow:hidden}.upload-grid.single .upload-card{height:224px}.upload-grid.two .upload-card{height:220px}.upload-button{height:100%;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:12px 8px;gap:5px}.upload-button>.photo-symbol{width:43px;height:43px;color:#a1aac1;margin-bottom:3px}.upload-button strong{font-weight:normal;font-size:20px;line-height:1.3}.person-label{font-size:15px;color:var(--muted)}.photo-hint{font-size:11px;color:var(--muted);line-height:1.4}.upload-button .uploaded{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:white}.photo-caption{position:absolute;bottom:0;left:0;right:0;background:#ffffffed;padding:6px;display:flex;justify-content:center;align-items:center;gap:7px;font-size:12px}.remove-photo{position:absolute;right:2px;top:2px;width:36px;height:36px;z-index:2;display:grid;place-items:center}.remove-photo span{width:19px;height:19px;display:grid;place-items:center;background:#a0a9bc;border-radius:50%;color:white;font-family:Arial;font-size:16px}.add-row{text-align:center;margin:-2px 0 17px}.add-person{min-height:38px;border:1px solid var(--blue);border-radius:25px;padding:6px 22px;font-size:15px}.add-person span{font-size:20px;vertical-align:-1px;margin-right:7px}h2{font-size:19px;line-height:1.4;font-weight:normal;margin:14px 0 8px}.style-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.style-card{height:132px;border:1px solid var(--line);border-radius:13px;position:relative;background:white;padding:5px 9px 23px;overflow:hidden;box-shadow:0 0 0 1px #f8fafc}.style-card.selected{border-color:var(--blue);box-shadow:inset 0 0 0 .5px var(--blue)}.style-card img{width:100%;height:100%;object-fit:contain}.style-label{position:absolute;bottom:5px;left:0;right:0;font-size:14px;text-align:center}.check{position:absolute;right:7px;top:7px;width:21px;height:21px;background:var(--blue);color:white;border-radius:50%;display:grid;place-items:center;font-family:Arial;font-size:14px}.caption-heading{display:flex;align-items:center;justify-content:space-between}.caption-heading small{font-size:12px;color:var(--muted)}.text-field{display:block;width:100%;resize:none;border:1px solid #dce6ee;border-radius:12px;background:#fbfdff;outline:none;color:var(--ink);font-size:16px;line-height:1.6;padding:10px 12px;min-height:72px}.text-field:focus{border-color:#819dc3}.text-field::placeholder{color:#a1aabd}.chips{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0 2px}.chip{font-size:13px;min-height:32px;padding:5px 11px;border:1px solid var(--line);border-radius:20px;background:#f9fcfe}.chip.selected{border-color:#819dc3;background:#edf4fb}.suggestion-switch{font-size:12px;color:var(--muted);min-height:32px;margin-left:auto}.error{font-size:13px;color:#b45b65;margin:8px 0;line-height:1.5}
#dock{position:absolute;left:0;right:0;bottom:0;height:var(--dock-height);padding:10px var(--pad) 12px;background:linear-gradient(#ffffffef,#fff 38%);z-index:5}.primary{display:flex;align-items:center;justify-content:center;width:100%;height:48px;min-height:48px;background:linear-gradient(100deg,#426b90,#3c658b);border-radius:30px;color:white;font-size:22px;letter-spacing:1px;padding:0 12px}.primary:active{filter:brightness(.96)}.primary:disabled{opacity:.55}.dock-note{text-align:center;font-size:12px;color:var(--muted);margin:8px 0 0;line-height:18px}.dock-note button{padding:0;color:var(--ink);font-size:inherit}.section-note{font-size:13px;color:var(--muted);line-height:1.6;margin:6px 0 16px}.subtle{color:var(--muted)}.center{text-align:center}.hero-illustration{height:245px;margin:20px auto 0;position:relative;text-align:center}.hero-illustration img{width:100%;height:100%;object-fit:contain}.hero-illustration.loading img{animation:breathe 2.7s ease-in-out infinite}.spinner{display:inline-block;border:2px solid #e0eaf3;border-top-color:#6a8baf;width:28px;height:28px;border-radius:50%;animation:spin 1s linear infinite}.generating-title{font-size:23px;text-align:center;margin:22px 0 12px}.steps{padding:17px 20px;border:1px solid var(--line);border-radius:16px;margin:24px 4px;display:grid;gap:15px}.step{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--muted)}.step .dot{width:20px;height:20px;display:grid;place-items:center;border:1px solid #cddae5;border-radius:50%;font-family:Arial;font-size:11px}.step.current{color:var(--ink)}.step.done .dot{background:var(--blue);border-color:var(--blue);color:white}.demo-note{font-size:11px;color:var(--muted);text-align:center;line-height:1.6;margin:12px 0}.result-lead{display:flex;justify-content:space-between;align-items:center;margin:7px 0 13px}.result-lead h2{margin:0}.text-link{font-size:13px;min-height:36px;padding:0 3px}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.sticker{padding:7px;border:1px solid var(--line);border-radius:15px;background:#fff;position:relative;overflow:hidden}.sticker img{width:100%;height:auto;aspect-ratio:1;object-fit:contain;display:block}.sticker-label{font-size:20px;text-align:center;margin:0 0 6px;overflow-wrap:anywhere;line-height:1.5}.sticker small{color:var(--muted);font-size:11px;display:block;text-align:center}.result-tip{margin:15px 0;font-size:13px;color:var(--muted);text-align:center}.secondary{border:1px solid #d8e3ed;min-height:42px;border-radius:24px;width:100%;font-size:16px;margin:8px 0;background:white}.summary-card{border:1px solid var(--line);border-radius:14px;padding:14px;margin-top:17px;background:#f9fcfe;display:flex;justify-content:space-between;align-items:center;font-size:14px}.mini-preview{height:70px;width:70px;object-fit:contain}.work-list{display:grid;gap:12px}.work-card{border:1px solid var(--line);border-radius:15px;padding:12px;background:white;text-align:left;display:flex;align-items:center;gap:14px;width:100%}.work-card img{width:82px;height:82px;object-fit:contain}.work-title{font-size:19px;margin:0 0 8px;line-height:1.4;overflow-wrap:anywhere}.work-meta{font-size:12px;color:var(--muted);line-height:1.8}.work-card>svg{margin-left:auto;width:17px}.work-filters{display:flex;gap:8px;margin-bottom:18px}.work-filters button{min-height:36px;border-radius:22px;padding:4px 17px;font-size:14px;background:#f1f6fa}.work-filters button.selected{background:#7896bf;color:white}.empty{padding:65px 12px;text-align:center}.empty img{width:160px;height:160px;object-fit:contain;opacity:.8}.empty h2{margin-top:15px}.empty p{font-size:14px;color:var(--muted);line-height:1.7}.detail-stage{margin:10px 0 18px;border:1px solid var(--line);border-radius:20px;background:#fff;padding:20px}.detail-stage img{width:100%;height:260px;object-fit:contain}.detail-stage .sticker-label{font-size:28px}.detail-info{display:flex;justify-content:center;gap:20px;font-size:13px;color:var(--muted)}.detail-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.danger-link{display:block;color:#a77b84;font-size:12px;text-align:center;width:100%;min-height:44px;margin-top:14px}
.member-hero{border:1px solid #dce8f1;border-radius:18px;padding:20px;background:linear-gradient(125deg,#f1f8fd,#fff);display:flex;align-items:center;justify-content:space-between;margin:7px 0 18px}.member-hero h2{font-size:23px;margin:0 0 8px}.member-hero p{font-size:13px;color:var(--muted);margin:0}.member-hero img{width:83px;height:91px;object-fit:contain}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center;padding:8px 0 17px}.benefits svg{display:block;margin:0 auto 7px;color:#7495b4}.benefits span{font-size:13px}.plans{display:grid;grid-template-columns:1fr 1fr;gap:10px}.plan{position:relative;border:1px solid var(--line);border-radius:15px;text-align:left;padding:18px 13px;background:white;min-height:133px}.plan.selected{border-color:var(--blue);background:#f5f9fd}.plan h3{font-size:18px;font-weight:normal;margin:0 0 15px}.plan-price{font-size:20px}.plan small{display:block;font-size:11px;color:var(--muted);margin-top:9px}.member-table{border:1px solid var(--line);border-radius:14px;margin-top:18px;overflow:hidden}.member-row{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:5px;padding:12px 10px;font-size:12px;border-top:1px solid var(--line);align-items:center}.member-row:first-child{border:0;background:#f5f9fc}.member-row span:not(:first-child){text-align:center}.faq{margin:16px 0}details{border-bottom:1px solid var(--line);padding:12px 0;font-size:14px}summary{cursor:pointer}details p{font-size:12px;color:var(--muted);line-height:1.8;margin-bottom:0}.consent{display:flex;align-items:flex-start;gap:7px;font-size:11px;color:var(--muted);line-height:1.7;margin:16px 0}.consent input{accent-color:var(--blue);margin:3px 0;width:15px;height:15px;flex:none}.consent button{font-size:11px;padding:0;line-height:1.7;text-decoration:underline}.loading-copy{font-size:14px;text-align:center;color:var(--muted);line-height:1.8}
#toast{position:absolute;bottom:114px;left:50%;transform:translateX(-50%);width:max-content;max-width:88%;background:#426585f5;color:white;border-radius:20px;padding:10px 17px;font-size:13px;z-index:30;opacity:0;pointer-events:none;transition:opacity .2s;text-align:center}#toast.visible{opacity:1}.modal-shade{position:absolute;inset:0;background:#34536d45;z-index:20;display:flex;align-items:flex-end}.sheet{background:#fff;width:100%;max-height:85%;overflow:auto;border-radius:24px 24px 0 0;padding:23px 22px 25px;box-shadow:0 -5px 30px #34536d13}.sheet h2{font-size:23px;margin-top:0}.sheet p{font-size:14px;line-height:1.8;color:var(--muted)}.sheet .primary{margin-top:20px;font-size:19px}.sheet-close{float:right;width:36px;height:36px;font-size:23px;margin-top:-8px;margin-right:-8px}.order-line{display:flex;justify-content:space-between;padding:12px 0;font-size:16px;border-bottom:1px solid var(--line)}.sheet-status{padding:24px 10px;text-align:center}.sheet-status svg{width:52px;height:52px;color:#7498af}.legal{font-size:13px!important;line-height:1.9!important}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes breathe{50%{transform:translateY(-5px)}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}@media(max-width:850px){.preview-tools{display:none}}@media(max-width:500px){body{padding:0;background:white;display:block}.app{width:100%;border-radius:0;box-shadow:none} :root{--pad:20px}}@media(max-width:370px){:root{--pad:17px}.mode{font-size:16px}.upload-button strong{font-size:19px}.primary{font-size:21px}}