:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans TC",sans-serif;color:#18344d;background:#f7f8f7;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}.topbar{height:77px;background:#fff;border-bottom:1px solid #e6ebed;display:flex;align-items:center;justify-content:space-between;padding:0 max(4vw,28px)}.brand{display:flex;gap:12px;align-items:center}.brand strong,.brand small{display:block}.brand strong{font-size:15px;letter-spacing:.01em}.brand small{color:#778791;font-size:10px;margin-top:2px;letter-spacing:.08em}.topbar-note{color:#6f8289;font-size:12px;display:flex;align-items:center;gap:8px}.privacy-dot{width:7px;height:7px;background:#58b794;border-radius:50%;box-shadow:0 0 0 4px #e4f5ed}.shell{max-width:1510px;margin:auto;padding:40px max(4vw,28px) 30px}.intro{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:35px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.2em;color:#aa885c;margin:0 0 13px}.eyebrow span{display:inline-block;height:1px;width:30px;background:#c8ac85;vertical-align:middle;margin:0 8px}h2,h3,p{margin-top:0}.intro-copy{font-size:14px;line-height:1.7;color:#71808b;max-width:600px;margin:14px 0 0}.steps{display:flex;align-items:center;gap:14px;padding-bottom:8px;white-space:nowrap}.steps div{display:flex;align-items:center;gap:8px;color:#82909a;font-size:12px}.steps b{font-size:11px;color:#bb9768}.steps i{height:1px;width:26px;background:#cfd8dd}.workspace{display:grid;grid-template-columns:minmax(315px,355px) minmax(0,1fr);gap:20px;align-items:start}.controls,.preview-column{background:#fff;border:1px solid #e5e9eb;border-radius:18px;box-shadow:0 10px 35px rgba(28,55,75,.045)}.controls{overflow:hidden}.panel-title{padding:23px 25px;display:flex;gap:13px;align-items:center;border-bottom:1px solid #ecf0f0}.panel-title-icon{height:35px;width:35px;border-radius:9px;background:#eef3f6;color:#31516a;display:grid;place-items:center;font-size:19px}.panel-title h2,.preview-head h2{font-size:17px;letter-spacing:-.025em;margin:0}.panel-title p{font-size:11px;color:#9aa7ad;margin:3px 0 0}.control-section{padding:23px 25px 24px;border-bottom:1px solid #edf0f1}.last-section{border-bottom:0}.section-heading{display:flex;align-items:center;gap:9px;margin-bottom:16px}.section-heading h3{font-size:14px;margin:0;letter-spacing:-.01em}.section-number{color:#b79668;font-size:11px;font-weight:800}.section-help{font-size:11px;color:#8b9ba4;line-height:1.65;margin:0 0 15px}.section-help.compact{margin:6px 0 0}.upload-box{border:1px dashed #bdcdd5;border-radius:11px;background:#f8fbfc;min-height:139px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;text-align:center;cursor:pointer;transition:.18s}.upload-box:hover,.upload-box.dragover{border-color:#4c88a9;background:#edf7fb}.upload-icon{font-size:25px;font-weight:300;color:#56809a;line-height:1}.upload-box strong{font-size:12px}.upload-box small{font-size:10px;color:#9babb3}.file-status{font-size:10px;color:#81929c;margin-top:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.page-picker{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:10px;font-size:11px;color:#637a89}.page-picker button{border:1px solid #dfe8eb;background:#fff;border-radius:6px;width:25px;height:25px;font-size:18px;line-height:20px;color:#526f82}.segmented{display:grid;grid-template-columns:1fr 1fr;padding:3px;background:#f1f4f5;border-radius:8px;margin-bottom:17px}.segmented button{background:transparent;border:0;border-radius:6px;padding:8px 4px;font-size:11px;color:#81909b}.segmented button.active{background:#fff;color:#23445c;font-weight:700;box-shadow:0 2px 7px rgba(23,48,64,.09)}.range-head{display:flex;justify-content:space-between;align-items:center;margin:14px 0 7px;font-size:11px;color:#506272;font-weight:650}.range-head output{font-weight:500;color:#9aabb3;font-size:10px}input[type=range]{width:100%;accent-color:#285d7d;height:14px;margin:0}.subtle-button{width:100%;border:1px solid #dbe5e9;background:#fff;border-radius:8px;color:#375c72;font-size:11px;font-weight:650;padding:10px;margin-top:14px}.subtle-button:hover{background:#f3f9fb}.subtle-button.active{background:#e9f5fa;border-color:#6da8c8}.region-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.region-item{display:flex;align-items:center;gap:2px;border:1px solid #dce5e8;border-radius:6px;background:#f8fafb;font-size:10px;color:#587185;padding:2px 2px 2px 7px}.region-item.selected{border-color:#5f9ac0;background:#edf7fa}.region-item button{border:0;background:transparent;color:inherit;padding:3px 5px;font-size:11px}.field-label{display:block;font-size:11px;font-weight:650;color:#506272;margin:0 0 7px}.text-input{width:100%;border:1px solid #dfe7eb;background:#fff;border-radius:8px;color:#253d4f;padding:10px 11px;outline:none;font-size:12px;min-height:39px}.text-input:focus{border-color:#7ba7be;box-shadow:0 0 0 3px #eaf4f7}.text-input::placeholder{color:#aab7be}select.text-input{appearance:auto}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:14px}.photo-upload{display:flex;align-items:center;gap:10px;border:1px dashed #c7d3d9;background:#f9fbfc;border-radius:9px;padding:11px;margin-top:17px;cursor:pointer}.photo-upload:hover{border-color:#6996ae}.photo-symbol{font-size:20px;color:#6c8da1}.photo-upload strong,.photo-upload small{display:block}.photo-upload strong{font-size:11px}.photo-upload small{font-size:9px;color:#9aabb3;margin-top:3px;max-width:185px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.photo-chevron{margin-left:auto;color:#7592a3}.preview-column{overflow:hidden;min-height:710px}.preview-head{display:flex;align-items:center;justify-content:space-between;padding:22px 25px;border-bottom:1px solid #edf0f1}.eyebrow.small{font-size:9px;margin-bottom:4px;letter-spacing:.16em}.preview-head #previewInfo{color:#9aaab1;font-size:11px}.preview-stage{background:#f2f5f5;min-height:570px;padding:31px;display:flex;align-items:center;justify-content:center;position:relative}.preview-stage canvas{display:block;max-width:100%;max-height:680px;width:auto;height:auto;box-shadow:0 10px 35px rgba(29,49,60,.17);touch-action:none;background:#fff}.empty-state{text-align:center;margin:auto}.empty-art{width:220px;height:220px;margin:0 auto 10px;position:relative}.empty-page{position:absolute;top:18px;left:35px;width:141px;height:177px;border-radius:7px;background:#fff;box-shadow:0 13px 28px rgba(56,84,98,.13);transform:rotate(-5deg);padding:29px 19px}.empty-page span{height:5px;background:#e5edf0;display:block;margin-bottom:10px;border-radius:4px}.empty-page span:nth-child(1){width:55px;height:8px;background:#6797b5;margin-bottom:22px}.empty-page span:nth-child(3){width:70%}.empty-page div{height:41px;background:#eff3f4;margin-top:20px;border-radius:3px}.empty-photo{position:absolute;right:4px;bottom:8px;width:92px;height:92px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(140deg,#e9f0f2,#bacbd2);border:6px solid #f2f5f5;color:#7897a8;font-size:62px;line-height:1}.empty-state h3{font-size:18px;color:#30495b;margin:8px 0}.empty-state p{font-size:12px;color:#9aaab2;margin-bottom:23px}.primary-button,.outline-button{border-radius:8px;padding:11px 16px;font-size:12px;font-weight:750;min-height:39px;white-space:nowrap}.primary-button{border:1px solid #174768;background:#174768;color:#fff;box-shadow:0 5px 10px rgba(19,70,105,.12)}.primary-button:not(:disabled):hover{background:#0d3753}.primary-button span{margin-left:18px;font-size:15px}.outline-button{border:1px solid #d5e0e5;background:#fff;color:#37566b}.outline-button:not(:disabled):hover{background:#f2f8fa}.preview-footer{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:18px 24px}.footer-tip{display:flex;gap:8px;align-items:flex-start;max-width:435px;color:#9aaab2}.footer-tip span{color:#7390a0;font-size:14px}.footer-tip p{font-size:10px;line-height:1.55;margin:0}.export-actions{display:flex;gap:8px}.bottom-note{text-align:center;color:#a7b4ba;font-size:10px;margin:24px 0 0}#toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,20px);padding:11px 16px;border-radius:8px;background:#173b55;color:white;box-shadow:0 10px 25px #0002;opacity:0;pointer-events:none;transition:.2s;font-size:12px;z-index:10}#toast.show{opacity:1;transform:translate(-50%,0)}@media(max-width:1050px){.intro{align-items:start}.steps{display:none}.workspace{grid-template-columns:310px minmax(0,1fr)}.preview-footer{flex-direction:column;align-items:stretch}.export-actions{justify-content:flex-end}}@media(max-width:760px){.topbar{padding:0 18px}.topbar-note{display:none}.shell{padding:28px 16px}.intro{margin-bottom:24px}.workspace{grid-template-columns:1fr}.preview-stage{min-height:430px;padding:18px}.preview-stage canvas{max-height:none}.preview-column{min-height:0}.preview-footer{padding:16px}.export-actions>*{flex:1}.control-section{padding:20px}.panel-title{padding:20px}}@media(max-width:390px){.export-actions{flex-direction:column}}

[hidden]{display:none!important}
.region-controls{margin-top:13px;padding:13px;background:#f7fafb;border:1px solid #e1e9ed;border-radius:9px}.region-controls-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:11px}.region-controls-title strong{font-size:11px;color:#385a6e}.region-controls-title small{font-size:9px;color:#9aabb3}.dimension-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.unit-field{font-size:10px;font-weight:650;color:#5b7180}.unit-field span{display:block;position:relative;margin-top:5px}.unit-field input{width:100%;height:35px;border:1px solid #dbe5e9;border-radius:7px;background:#fff;color:#203d51;padding:7px 25px 7px 9px;font-size:11px;outline:none}.unit-field input:focus{border-color:#76a4bb;box-shadow:0 0 0 3px #eaf4f7}.unit-field em{position:absolute;right:8px;top:10px;font-size:9px;color:#9aabb3;font-style:normal;pointer-events:none}
