:root{--ink: #20252b;--muted: #798089;--paper: #f4f1ea;--panel: #fffdfa;--panel-soft: #f8f6f0;--card: #faf8f3;--line: #dedbd2;--line-soft: #eeeae3;--accent: #e56f4c;--accent-dark: #ba4c31;--accent-soft: #fff1eb;--decor-stroke: rgba(198, 111, 82, .22);--ok: #2d8064;--warn: #c7832f;--shadow: 0 24px 70px rgba(42, 34, 24, .08);--fs-hero: clamp(35px, 5vw, 60px);--fs-title: 18px;--fs-body: 13px;--fs-label: 12px;--fs-meta: 11px;--fs-micro: 10px;--safe-bottom: var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px));--safe-left: var(--safe-area-inset-left, env(safe-area-inset-left, 0px));--safe-right: var(--safe-area-inset-right, env(safe-area-inset-right, 0px))}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}html{min-height:100%;touch-action:manipulation}body{position:relative;isolation:isolate;min-height:100%;background:var(--paper);color:var(--ink);font-family:PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}button,input{font:inherit;color:inherit}ul{padding-left:16px}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.app-shell{position:relative;z-index:1;max-width:1280px;margin:0 auto;padding:clamp(8px,1.2vw,14px) calc(clamp(18px,4vw,56px) + var(--safe-right)) calc(34px + var(--safe-bottom)) calc(clamp(18px,4vw,56px) + var(--safe-left))}.hero{max-width:780px;padding:clamp(8px,1.8vw,18px) 0 40px}.hero h1{font-family:Georgia,Songti SC,serif;font-weight:400;font-size:var(--fs-hero);line-height:1.06;letter-spacing:-.055em}.hero h1 em{color:var(--accent);font-style:normal}.stepper{display:none;align-items:center;gap:11px;margin-bottom:18px;color:#aaa49a;font-size:var(--fs-label)}.stepper span{display:flex;align-items:center;gap:7px;white-space:nowrap}.stepper b{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#e7e2d9;font-size:var(--fs-meta);color:#8b867c}.stepper i{width:34px;height:1px;background:var(--line)}.stepper .active{color:var(--ink);font-weight:700}.stepper .active b{background:var(--accent);color:#fff}.workspace{display:grid;grid-template-columns:minmax(360px,.78fr) minmax(0,1.22fr);gap:24px;align-items:stretch}.panel{background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow);padding:30px;min-width:0}.panel-heading{display:flex;gap:15px;align-items:center;margin-bottom:4px}.panel-heading h2{font-size:var(--fs-title);font-weight:700;letter-spacing:-.02em}.panel-heading p{margin-top:5px;font-size:var(--fs-label);color:var(--muted)}.step{display:grid;place-items:center;flex:none;width:23px;height:23px;border-radius:50%;background:var(--accent);color:#fff;font-size:var(--fs-meta);font-weight:700;line-height:1;font-variant-numeric:tabular-nums}.footer-note{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:32px;color:#98958d;font-size:var(--fs-meta);text-align:center}.background-decor{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}.decor-mark{position:absolute;fill:none;stroke:var(--decor-stroke);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.2}.decor-passport-one{top:18px;right:-12px;width:300px;opacity:.42;transform:rotate(7deg)}.decor-passport-two{bottom:16px;left:-22px;width:325px;opacity:.38;transform:rotate(-6deg)}.decor-passport-three{top:390px;right:-24px;width:250px;opacity:.32;transform:rotate(11deg)}.footer-privacy{color:#aaa59b}.footer-credits{display:flex;align-items:center;justify-content:center;gap:7px;color:#aaa59b;font-size:var(--fs-micro)}.powered-by{margin-right:2px}.credit-icon{position:relative;display:inline-flex;width:20px;height:20px;align-items:center;justify-content:center;border-radius:6px;background:#ebe8e1;box-shadow:0 0 0 1px #322d2614;transition:transform .16s ease,box-shadow .16s ease}.credit-icon img{display:block;width:16px;height:16px;border-radius:4px}.credit-icon:after{position:absolute;bottom:calc(100% + 7px);left:50%;width:max-content;max-width:180px;padding:5px 8px;border-radius:5px;background:var(--ink);color:var(--panel);content:attr(data-label);font-size:var(--fs-micro);line-height:1.2;opacity:0;pointer-events:none;transform:translate(-50%,3px);transition:opacity .16s ease,transform .16s ease;white-space:nowrap}.credit-icon:hover,.credit-icon:focus-visible{box-shadow:0 0 0 2px #e56f4c47;transform:translateY(-1px)}.credit-icon:hover:after,.credit-icon:focus-visible:after{opacity:1;transform:translate(-50%)}.cache-notice{position:fixed;top:max(28px,env(safe-area-inset-top,0px));left:50%;z-index:40;display:flex;align-items:center;gap:12px;max-width:min(360px,calc(100vw - 36px));padding:10px 12px 10px 14px;border:1px solid rgba(229,111,76,.28);background:#fffdfaf5;box-shadow:0 10px 30px #2a221829;color:var(--ink);font-size:var(--fs-meta);line-height:1.4;transform:translate(-50%,-50%);animation:cache-notice-in .2s ease-out}.cache-notice button{flex:none;border:0;background:transparent;padding:0 2px;color:var(--muted);font-size:18px;line-height:1;cursor:pointer}.cache-notice button:hover{color:var(--accent-dark)}@keyframes cache-notice-in{0%{opacity:0;transform:translate(-50%,calc(-50% + 6px))}}.field-label{display:block;margin:31px 0 9px;font-size:var(--fs-meta);color:var(--muted);letter-spacing:.06em}.selection-tabs{display:flex;gap:8px;margin-top:16px;margin-bottom:12px;padding:3px;background:#f1eee7;border-radius:7px}.selection-tab{flex:1;border:0;border-radius:5px;background:transparent;padding:8px 10px;color:var(--muted);font-size:var(--fs-meta);font-weight:600;cursor:pointer}.selection-tab.active{background:var(--panel);color:var(--ink);box-shadow:0 1px 4px #2a221817}.preset-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(108px,1fr));gap:8px}.preset-card{position:relative;border:1px solid var(--line);background:var(--card);padding:12px 42px 12px 10px;text-align:left;cursor:pointer;transition:border-color .2s,background .2s,transform .2s}.preset-card strong{display:block;font-size:var(--fs-body)}.preset-card small{display:block;margin-top:5px;color:var(--muted);font-size:var(--fs-micro)}.preset-card:hover{border-color:#cbb8ab}.preset-card:active{transform:translateY(1px)}.preset-card.selected{border-color:var(--accent);background:var(--accent-soft);box-shadow:inset 0 -2px 0 var(--accent)}.size-shape{position:absolute;top:12px;right:10px;display:block;width:calc(28px * var(--ratio));height:28px;border:2px solid #d7a18f;background:var(--panel);opacity:.9}.preset-card.selected .size-shape{border-color:var(--accent);background:#ffe2d8}.country-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-height:390px;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding-right:4px;scrollbar-gutter:stable}.country-card{display:flex;align-items:center;gap:9px;min-width:0;border:1px solid var(--line);background:var(--card);padding:10px;text-align:left;cursor:pointer;transition:border-color .2s,background .2s,box-shadow .2s}.country-card:hover{border-color:#cbb8ab;background:var(--panel)}.country-card.selected{border-color:var(--accent);background:var(--accent-soft);box-shadow:inset 0 -2px 0 var(--accent)}.country-flag{font-size:22px;line-height:1}.country-card-copy{min-width:0}.country-card-copy strong,.country-card-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.country-card-copy strong{font-size:var(--fs-meta)}.country-card-copy small{margin-top:4px;color:var(--muted);font-size:var(--fs-micro)}.spec-card{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:16px;padding:15px 16px;background:var(--panel-soft)}.spec-item small{display:block;margin-bottom:4px;color:var(--muted);font-size:var(--fs-micro);letter-spacing:.07em}.spec-item strong{font-size:var(--fs-body)}.bg-value{display:flex;align-items:center;gap:6px}.bg-swatch{display:inline-block;flex:none;width:16px;height:16px;border:1px solid #c8c4bc;border-radius:3px;box-shadow:inset 0 0 0 1px #ffffff73}.requirements{margin-top:16px;padding:13px 15px;background:var(--panel-soft);color:#686f76;font-size:var(--fs-meta);line-height:1.7}.requirements-details>summary{display:none}.requirements>p{margin-bottom:3px;color:var(--ink);font-weight:700}.preview-panel{display:flex;flex-direction:column;min-height:560px}.preview-heading{align-items:center}.preview-heading>div:first-of-type{flex:1}.preview-tools{position:absolute;top:50%;right:12px;z-index:4;display:flex;flex-direction:column;overflow:hidden;border-radius:5px;background:var(--accent);box-shadow:0 8px 20px #5e2f1e2e;opacity:0;pointer-events:none;transform:translate(7px,-50%);transition:opacity .18s ease,transform .18s ease}.preview-stage:hover .preview-tools,.preview-tools:focus-within{opacity:1;pointer-events:auto;transform:translateY(-50%)}.text-action{display:inline-flex;align-items:center;gap:5px;width:100%;border:0;background:transparent;padding:9px 10px;color:#fff;font-size:var(--fs-meta);cursor:pointer;white-space:nowrap}.text-action+.text-action{border-top:1px solid rgba(255,255,255,.24)}.text-action:hover,.text-action:focus-visible{background:var(--accent-dark);color:#fff}.measure-tool{position:relative}.measure-tool input{position:absolute;opacity:0;pointer-events:none}.measure-tool:has(input:checked){background:var(--accent-dark)}.tool-icon{width:15px;height:15px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.35}@media(hover:none),(pointer:coarse){.preview-tools{opacity:1;pointer-events:auto;transform:translateY(-50%)}}.frame-meta{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:6px 10px;min-height:20px;margin-top:22px;padding:0 2px;color:var(--muted);font-size:var(--fs-micro);line-height:1.3}.frame-meta strong{color:var(--muted);font-size:var(--fs-meta);font-weight:600}.frame-meta-bg{display:inline-flex;align-items:center;gap:5px}.frame-meta .bg-swatch{width:13px;height:13px}.stage-error{margin-top:14px;padding:10px 12px;border-left:3px solid var(--warn);background:#fdf5e7;color:#8a5b16;font-size:var(--fs-label);line-height:1.6}.preview-stage{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;flex:none;height:360px;margin:12px 0 22px;background:#ebe8e1;overflow:hidden}.preview-stage.drop-target{background:var(--accent-soft);box-shadow:inset 0 0 0 2px var(--accent)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;width:100%;height:100%;color:#9c9a94;font-size:var(--fs-label);cursor:pointer;transition:background-color .2s ease}.empty-state:hover{background:var(--accent-soft)}.empty-grid{width:calc(150px * var(--frame-ratio, .7143));height:150px;border:1px solid #c4c0b7;background:repeating-linear-gradient(0deg,transparent 0 24px,rgba(130,125,115,.15) 25px),repeating-linear-gradient(90deg,transparent 0 24px,rgba(130,125,115,.15) 25px)}.preview-upload-button{display:inline-flex;align-items:center;gap:5px;border:0;background:transparent;padding:4px 0;color:var(--accent-dark);font-size:var(--fs-meta);font-weight:600;cursor:pointer}.upload-icon{width:15px;height:15px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5}.preview-upload-button:hover{color:var(--accent)}.canvas-wrap{position:relative;flex:none;max-width:calc(100% - 76px);max-height:378px;box-shadow:0 8px 25px #281e1429;overflow:hidden}.canvas-wrap canvas{display:block;width:100%;height:100%;background:#fff;touch-action:none;cursor:grab}.canvas-wrap canvas.dragging{cursor:grabbing}.crop-guides{position:absolute;inset:0;border:1px solid rgba(255,255,255,.72);box-shadow:inset 0 0 0 1px #20252b1f;pointer-events:none}.crop-guides:before,.crop-guides:after,.guide-v,.guide-h{content:"";position:absolute;background:#ffffff7a;box-shadow:0 0 0 .5px #20252b1a}.crop-guides:before,.crop-guides:after{top:0;bottom:0;width:1px}.crop-guides:before{left:33.333%}.crop-guides:after{left:66.666%}.guide-v{top:0;bottom:0;left:50%;width:1px;background:#e56f4c9e}.guide-h{left:0;right:0;height:1px}.guide-h-one{top:33.333%}.guide-h-two{top:66.666%}.face-guide{position:absolute;left:23%;top:16%;width:54%;height:58%;border:1px dashed rgba(255,255,255,.82);border-radius:50% 50% 46% 46%}.crop-guides small{position:absolute;left:50%;bottom:10px;transform:translate(-50%);background:#20252ba8;padding:4px 7px;color:#fff;font-size:var(--fs-micro);letter-spacing:.04em;white-space:nowrap}.head-guides{position:absolute;inset:0;pointer-events:none}.head-band{position:absolute;left:0;right:0;background:#e56f4c29;border-top:1px solid rgba(229,111,76,.35);border-bottom:1px solid rgba(229,111,76,.35)}.head-line{position:absolute;left:0;right:0;height:20px;margin-top:-10px;display:flex;align-items:center;pointer-events:auto;cursor:ns-resize;touch-action:none}.head-line:before{content:"";position:absolute;left:0;right:0;height:2px;background:var(--accent);box-shadow:0 0 0 .5px #ffffffb3}.head-line-label{position:relative;margin-left:6px;border-radius:3px;background:var(--accent);padding:2px 6px;color:#fff;font-size:var(--fs-micro);letter-spacing:.04em}.head-line-chin .head-line-label{margin-left:auto;margin-right:6px}.head-line.dragging:before,.head-line:focus-visible:before{background:var(--accent-dark)}.adjustment-controls{--control-label: 72px;--control-value: 58px;--control-gap: 12px;margin-top:2px;padding:0 15px;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);background:var(--panel-soft)}.zoom-row{display:grid;grid-template-columns:var(--control-label) minmax(0,1fr) var(--control-value);column-gap:var(--control-gap);align-items:center;min-height:50px;margin-bottom:0;color:var(--muted);font-size:var(--fs-meta)}.zoom-row input{grid-column:2;width:100%;accent-color:var(--accent)}.zoom-row span:last-child{grid-column:3;text-align:right}.compression-box{display:grid;grid-template-columns:var(--control-label) minmax(0,1fr) var(--control-value);column-gap:var(--control-gap);margin-bottom:0;padding:12px 0 11px;border-top:1px solid var(--line-soft)}.compression-head{grid-column:1 / -1;display:grid;grid-template-columns:var(--control-label) minmax(0,1fr) var(--control-value);column-gap:var(--control-gap);align-items:center;color:var(--muted);font-size:var(--fs-label)}.compression-head span{grid-column:1}.compression-head strong{grid-column:2 / -1;overflow:hidden;color:var(--ink);font-size:var(--fs-label);text-align:right;text-overflow:ellipsis;white-space:nowrap}.compression-box input{grid-column:2;display:block;width:100%;margin:13px 0 7px;accent-color:var(--accent)}.compression-scale{grid-column:2;display:flex;justify-content:space-between;color:#aaa49a;font-size:var(--fs-micro)}.compression-box.busy .compression-head strong{color:var(--muted);animation:pulse 1.1s ease-in-out infinite}@keyframes pulse{50%{opacity:.45}}@media(prefers-reduced-motion:reduce){.compression-box.busy .compression-head strong{animation:none}}.checks{margin-top:20px;padding-top:3px;border-top:1px solid var(--line)}.check-row{display:flex;align-items:center;gap:10px;padding:13px 0;border-bottom:1px solid var(--line-soft);font-size:var(--fs-body)}.check-row small{margin-left:auto;color:var(--muted);font-size:var(--fs-meta)}.check-dot{display:grid;place-items:center;flex:none;width:19px;height:19px;border-radius:50%;background:#eeeae2;color:#9d9a92;font-size:var(--fs-meta)}.check-row.good .check-dot{background:#d8eee4;color:var(--ok)}.check-row.warn .check-dot{background:#f9e7cd;color:var(--warn)}.check-row.muted{color:var(--muted)}.actions{margin-top:22px}.download-button{display:flex;align-items:center;justify-content:center;padding:14px;background:var(--accent);color:#fff;font-size:var(--fs-body);font-weight:700;text-decoration:none;cursor:pointer;transition:background .2s,transform .2s}.download-button:hover{background:var(--accent-dark)}.download-button:active{transform:translateY(1px)}.download-button[aria-disabled=true]{background:#ddd8ce;color:#9b968c;pointer-events:none}.print-button{width:100%;margin-top:10px;border:1px solid var(--line);background:transparent;padding:11px;font-size:var(--fs-label);font-weight:600;cursor:pointer}.print-button{border-color:var(--accent);color:var(--accent-dark)}.print-button:hover{background:var(--accent-soft)}.modal-backdrop{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:clamp(12px,4vw,40px);padding-bottom:calc(clamp(12px,4vw,40px) + var(--safe-bottom));background:#201c1685;animation:modal-fade .16s ease-out}@keyframes modal-fade{0%{opacity:0}to{opacity:1}}.modal{display:flex;flex-direction:column;width:100%;max-width:660px;max-height:100%;background:var(--panel);border:1px solid var(--line);box-shadow:0 30px 80px #1e160e4d}.modal-head{display:flex;align-items:flex-start;gap:12px;flex:none;padding:22px 24px 16px;border-bottom:1px solid var(--line-soft)}.modal-head h2{font-size:var(--fs-title);font-weight:700;letter-spacing:-.02em}.modal-head p{margin-top:5px;color:var(--muted);font-size:var(--fs-meta);line-height:1.6}.modal-head>div{flex:1;min-width:0}.modal-close{flex:none;border:0;background:transparent;padding:0 4px;color:var(--muted);font-size:24px;line-height:1;cursor:pointer}.modal-close:hover{color:var(--ink)}.modal-body{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:20px 24px}.modal-foot{flex:none;padding:0 24px 22px}.print-stage{display:flex;align-items:center;justify-content:center;padding:18px;background:#ebe8e1}.print-stage canvas{display:block;max-width:100%;height:auto;background:#fff;box-shadow:0 8px 25px #281e1429}body.modal-open{overflow:hidden}@media(max-width:980px){.workspace{grid-template-columns:1fr;gap:18px}.preset-cards{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:700px){.hero{padding-top:12px}.panel{padding:22px}.decor-passport-one{top:34px;right:-42px;width:220px;opacity:.36}.decor-passport-two{bottom:24px;left:-62px;width:235px;opacity:.32}.decor-passport-three{display:none}.stepper{display:flex;gap:6px;margin-bottom:12px;font-size:var(--fs-meta)}.stepper i{width:16px}.preset-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.country-cards{max-height:300px}.preview-panel{min-height:500px}.preview-stage{height:300px}.canvas-wrap{max-height:278px}.footer-note{margin-top:28px;padding-bottom:20px}.requirements-details>summary{display:block;margin-top:12px;padding:9px 12px;background:var(--panel-soft);color:var(--muted);font-size:var(--fs-meta);cursor:pointer}.requirements-details>summary::marker{color:var(--accent)}.requirements-details[open]>summary{color:var(--ink)}.requirements-details .requirements{margin-top:4px}}@media(min-width:981px){.app-shell{padding-bottom:calc(18px + var(--safe-bottom))}.hero{padding-bottom:28px}.footer-note{margin-top:36px}.preview-stage{margin-bottom:12px}}@media(max-width:520px){.panel{padding:20px}.spec-card{grid-template-columns:1fr}.modal-head{padding:18px 18px 14px}.modal-body{padding:16px 18px}.modal-foot{padding:0 18px 18px}.print-stage{padding:12px}}