:root{color:#1b243a;background:#eef1f6;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Microsoft YaHei,sans-serif;font-synthesis:none}*{box-sizing:border-box}html,body,#app{min-height:100%;margin:0}body{min-width:320px;background:#eef1f6;-webkit-tap-highlight-color:transparent}button{margin:0;padding:0;border:0;color:inherit;background:none;font:inherit}button:disabled{cursor:wait}.preview-app{width:min(100%,520px);min-height:100vh;margin:0 auto;padding:12px 10px calc(76px + env(safe-area-inset-bottom))}.center-state{display:flex;min-height:72vh;padding:32px;align-items:center;flex-direction:column;justify-content:center;border-radius:18px;color:#788196;background:#fff;text-align:center}.center-state strong{margin-top:16px;color:#273047;font-size:18px}.center-state p{max-width:300px;margin:10px 0 22px;font-size:14px;line-height:1.6}.center-state button{height:42px;padding:0 24px;border-radius:21px;color:#fff;background:#5267d8}.spinner{display:inline-block;width:30px;height:30px;border:3px solid #dfe4fb;border-top-color:#5267d8;border-radius:50%;animation:spin .8s linear infinite}.spinner.small{width:14px;height:14px;margin-right:7px;border-width:2px}@keyframes spin{to{transform:rotate(360deg)}}.error-icon{position:relative;width:46px;height:46px;border-radius:15px;background:#fff0ef}.error-icon:before,.error-icon:after{position:absolute;top:21px;left:13px;width:20px;height:2px;border-radius:2px;background:#d94a42;content:"";transform:rotate(45deg)}.error-icon:after{transform:rotate(-45deg)}.preview-stage{position:relative;overflow:hidden;padding:9px;border-radius:14px;background:#dfe3ea}.preview-viewport{position:relative;overflow:hidden;width:100%;min-height:520px;background:#fff;box-shadow:0 7px 20px #2a334e2e}.resume-frame{position:absolute;top:0;left:0;display:block;width:794px;height:1123px;border:0;background:#fff;transform-origin:top left}.scale-note{position:absolute;right:17px;bottom:17px;padding:4px 8px;border-radius:12px;color:#fff;background:#1d243a9e;font-size:11px}.updating{position:absolute;top:18px;right:18px;display:flex;padding:7px 10px;align-items:center;border-radius:18px;color:#535e78;background:#fffffff0;box-shadow:0 4px 16px #2c35541f;font-size:12px}.template-panel{margin-top:10px;padding:15px 0 11px;border-radius:14px;background:#fff;box-shadow:0 4px 16px #3440650f}.template-panel>header{padding:0 15px 11px}.template-panel h2{margin:0;font-size:17px}.template-panel p{margin:4px 0 0;color:#969daf;font-size:11px}.template-scroll{display:flex;overflow-x:auto;padding:0 15px 3px;gap:10px;scrollbar-width:none}.template-scroll::-webkit-scrollbar{display:none}.template-card{width:78px;flex:0 0 78px}.template-thumb{position:relative;display:block;overflow:hidden;width:78px;aspect-ratio:210 / 297;border:2px solid transparent;border-radius:5px;background:#f2f4f8}.template-card.active .template-thumb{border-color:#5267d8;box-shadow:0 4px 12px #5267d833}.template-thumb img{display:block;width:100%;height:100%;object-fit:contain;background:#fff}.template-placeholder{display:block;height:100%;padding:18px 9px;background:#fff}.template-placeholder i{display:block;height:3px;margin-bottom:7px;border-radius:2px;background:#e1e5ee}.template-placeholder i:first-child{width:58%;height:6px;margin:0 auto 14px;background:#bac3ee}.template-placeholder i:last-child{width:65%}.selected-check{position:absolute;right:4px;bottom:4px;width:18px;height:18px;border:2px solid #fff;border-radius:50%;background:#5267d8}.selected-check:after{position:absolute;top:4px;left:4px;width:7px;height:4px;border-bottom:2px solid #fff;border-left:2px solid #fff;content:"";transform:rotate(-45deg)}.template-name{display:block;overflow:hidden;margin-top:6px;color:#687086;font-size:11px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.template-card.active .template-name{color:#4155bd;font-weight:700}.style-toolbar{position:fixed;z-index:30;right:0;bottom:0;left:0;display:grid;min-height:64px;padding:5px max(8px,calc((100vw - 520px)/2 + 8px)) calc(5px + env(safe-area-inset-bottom));grid-template-columns:repeat(5,1fr);gap:4px;border-top:1px solid #e3e6ef;background:#fffffffa;box-shadow:0 -4px 15px #28314e17}.style-toolbar button{display:flex;min-width:0;min-height:54px;align-items:center;flex-direction:column;justify-content:center;border-radius:9px;color:#353e54;font-size:10px}.style-toolbar button.active{color:#5267d8;background:#f0f2ff}.style-toolbar i{display:block;margin-bottom:5px;font-style:normal}.color-icon{width:17px;height:17px;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #cbd1df}.font-icon{display:flex!important;height:18px;align-items:baseline;font-family:Georgia,serif;line-height:1}.font-icon b{font-size:17px}.font-icon em{font-size:11px;font-style:normal}.line-icon,.section-icon{position:relative;width:20px;height:18px}.line-icon b{display:block;height:2px;margin-bottom:4px;border-radius:1px;background:currentColor}.section-icon b{display:block;height:6px;margin-bottom:4px;border:1px solid currentColor;border-radius:2px}.style-toolbar .export-button{color:#fff;font-size:13px;background:linear-gradient(145deg,#687bea,#4b62d4);box-shadow:0 4px 12px #5267d838}.export-icon{position:relative;width:21px;height:19px;border:1px solid currentColor;border-top:0;border-radius:0 0 3px 3px}.export-icon:before{position:absolute;top:-5px;left:9px;width:2px;height:12px;border-radius:1px;background:currentColor;content:""}.export-icon:after{position:absolute;top:-5px;left:6px;width:7px;height:7px;border-top:2px solid currentColor;border-left:2px solid currentColor;content:"";transform:rotate(45deg)}.sheet-mask{position:fixed;z-index:25;inset:0;background:#141b2e52}.control-sheet{position:absolute;right:0;bottom:calc(64px + env(safe-area-inset-bottom));left:0;max-height:55vh;padding:18px 17px 22px;overflow-y:auto;border-radius:20px 20px 0 0;background:#fff;box-shadow:0 -8px 24px #222b4626}.control-sheet>header{display:flex;margin-bottom:18px;align-items:center;justify-content:space-between}.control-sheet h2{margin:0;font-size:18px}.export-sheet>header{margin-bottom:14px}.export-sheet>header p{margin:5px 0 0;color:#9198a8;font-size:12px}.export-format-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.export-format-grid>button{display:flex;min-height:92px;padding:14px 12px;align-items:center;border:1px solid #e0e4ef;border-radius:14px;background:#f8f9fc;text-align:left}.export-format-grid>button:active{border-color:#7b8ae2;background:#f0f2ff}.export-format-grid .format-icon{position:relative;display:flex;width:40px;height:46px;margin-right:10px;align-items:center;flex:none;justify-content:center;border-radius:8px;font-size:9px;font-style:normal;font-weight:800}.pdf-format-icon{color:#d55c55;background:#fdeceb}.image-format-icon{background:#ebefff}.image-format-icon:before{position:absolute;top:10px;right:10px;width:7px;height:7px;border-radius:50%;background:#7585df;content:""}.image-format-icon b{position:absolute;right:8px;bottom:9px;left:8px;height:18px;overflow:hidden}.image-format-icon b:before,.image-format-icon b:after{position:absolute;bottom:-8px;width:23px;height:23px;border-radius:4px;background:#7585df;content:"";transform:rotate(45deg)}.image-format-icon b:before{left:-8px}.image-format-icon b:after{right:-11px;background:#a7b1ef}.export-format-grid>button>span{display:flex;min-width:0;flex-direction:column}.export-format-grid>button>span b{color:#30394f;font-size:14px}.export-format-grid>button>span small{margin-top:5px;color:#959cac;font-size:10px;line-height:1.4}.close-button{position:relative;width:32px;height:32px;border-radius:50%;background:#f2f3f7}.close-button:before,.close-button:after{position:absolute;top:15px;left:9px;width:14px;height:2px;background:#7c8497;content:"";transform:rotate(45deg)}.close-button:after{transform:rotate(-45deg)}.palette-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 8px}.palette-grid button{display:flex;align-items:center;flex-direction:column;color:#737b8f;font-size:11px}.palette-grid i{position:relative;width:36px;height:36px;margin-bottom:6px;border:3px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #d6dae4}.palette-grid button.active i{box-shadow:0 0 0 3px #5267d8}.palette-grid button.active span{color:#5267d8;font-weight:700}.option-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.option-grid button{height:42px;border:1px solid #e0e4ed;border-radius:10px;color:#5e667b;background:#f8f9fb;font-size:13px}.option-grid button.active{border-color:#5267d8;color:#5267d8;background:#eef0ff;font-weight:700}.toast{position:fixed;z-index:50;top:46%;left:50%;max-width:min(78vw,320px);padding:10px 15px;border-radius:9px;color:#fff;background:#181d2ae0;font-size:13px;text-align:center;transform:translate(-50%,-50%)}