:root{--ink:#182019;--muted:#6e766f;--line:#d7dbd5;--paper:#eef0eb;--accent:#c9ff3d;--panel-width:430px;--contact-content-width:91%;--card-tool-size:24px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--ink);background:#f6f7f3;margin:0;font-family:Inter,PingFang SC,Microsoft YaHei,Arial,sans-serif}button,input{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible,a:focus-visible{outline-offset:2px;outline:3px solid #6f8f1852}button:disabled{opacity:.38;cursor:not-allowed!important}.app-shell{min-height:100vh}.app-header{z-index:4;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffffe6;justify-content:space-between;align-items:center;height:76px;padding:0 max(24px,50vw - 755px);display:flex;position:relative}.brand{color:inherit;align-items:center;gap:11px;text-decoration:none;display:flex}.brand-mark{border:2px solid var(--ink);background:var(--accent);border-radius:6px;place-items:center;width:38px;height:30px;font-weight:850;display:grid;box-shadow:inset 0 0 0 1px #fff}.brand>span:last-child{gap:2px;display:grid}.brand strong{letter-spacing:-.03em;font-size:15px}.brand small{color:#858c86;letter-spacing:.15em;font-size:8px}.header-summary{align-items:center;gap:16px;font-size:12px;display:flex}.header-summary span{color:var(--muted)}.header-summary strong{border:1px solid var(--line);background:#fff;border-radius:8px;padding:9px 13px}.workspace{grid-template-columns:var(--panel-width) minmax(0, 1fr);max-width:1510px;min-height:calc(100vh - 76px);margin:0 auto;display:grid}.editor-panel{border-right:1px solid var(--line);background:#fff;padding:38px 34px 54px}.panel-intro p,.preview-heading p,.list-heading p{color:#7c847d;letter-spacing:.13em;text-transform:uppercase;margin:0 0 6px;font-size:10px;font-weight:750}.panel-intro h1{letter-spacing:-.04em;margin:0;font-size:25px}.panel-intro>span{color:#8a918b;margin-top:8px;font-size:11px;display:block}.type-field{border:0;margin:32px 0 0;padding:0}.type-field legend,.field>span{color:#555d56;width:100%;margin-bottom:9px;font-size:11px;font-weight:720;display:block}.type-options{grid-template-columns:1fr 1fr;gap:7px;display:grid}.type-options button{text-align:left;cursor:pointer;background:#fafbf8;border:1px solid #e0e3de;border-radius:9px;align-items:center;gap:9px;min-width:0;height:58px;padding:0 10px;display:flex}.type-options button.active{background:#fff;border-color:#272e28;box-shadow:inset 0 0 0 1px #272e28}.type-options i{border-radius:2px;flex:none;width:28px;height:9px;box-shadow:inset 0 0 0 1px #0000002e}.swatch-blue{background:#0a4799}.swatch-green-small{background:linear-gradient(#edf9ea,#78ca6d)}.swatch-green-large{background:linear-gradient(#75c86a 0 58%,#e4e351 58%)}.swatch-yellow{background:#f4d744}.type-options button>span{gap:3px;min-width:0;display:grid}.type-options strong{white-space:nowrap;text-overflow:ellipsis;font-size:10px;overflow:hidden}.type-options small{color:#8a918b;font-size:8px}.field{margin-top:19px;display:block}.field>span{justify-content:space-between;display:flex}.field>span em{color:#b07118;font-size:9px;font-style:normal;font-weight:600}.field>span em.ok{color:#5a8d2f}.field-row{grid-template-columns:1.35fr .8fr;gap:10px;display:grid}.field input{background:#fafbf8;border:1px solid #d9ddd7;border-radius:9px;outline:0;width:100%;height:46px;padding:0 13px;font-size:13px;transition:border-color .18s,box-shadow .18s,background .18s}.field input::placeholder{color:#a1a7a1}.field input:focus{background:#fff;border-color:#61723e;box-shadow:0 0 0 3px #97b84426}.plate-field input{color:#174c96;letter-spacing:.07em;height:58px;font-size:23px;font-weight:850}.plate-field input[aria-invalid=true]{border-color:#c28d48}.form-actions{gap:8px;margin-top:23px;display:flex}.primary-button{background:var(--accent);cursor:pointer;border:1px solid #202720;border-radius:9px;flex:1;height:50px;font-size:12px;font-weight:800;transition:transform .18s,box-shadow .18s;box-shadow:0 4px #93b834}.primary-button:hover{transform:translateY(-1px);box-shadow:0 5px #93b834}.cancel-button{cursor:pointer;background:#fff;border:1px solid #d8ddd7;border-radius:9px;width:68px;font-size:11px}.print-settings{border-top:1px solid #e6e8e4;border-bottom:1px solid #e6e8e4;justify-content:space-between;align-items:center;margin-top:31px;padding:24px 0;display:flex}.print-settings>div:first-child{gap:4px;display:grid}.print-settings span{color:#8a918b;font-size:9px}.print-settings strong{font-size:11px}.segmented{background:#eef0eb;border-radius:8px;padding:3px;display:flex}.segmented button{color:#737b74;cursor:pointer;background:0 0;border:0;border-radius:6px;height:29px;padding:0 13px;font-size:10px}.segmented button.active{color:var(--ink);background:#fff;box-shadow:0 1px 4px #0000001a}.contact-list{margin-top:27px}.list-heading{justify-content:space-between;align-items:flex-end;display:flex}.list-heading h2{letter-spacing:-.03em;margin:0;font-size:18px}.list-heading>button{color:#8a615b;cursor:pointer;background:0 0;border:0;border-bottom:1px solid #c5cac4;padding:5px 0;font-size:9px}.contact-list ol{gap:7px;margin:18px 0 0;padding:0;list-style:none;display:grid}.contact-list li{background:#fbfcfa;border:1px solid #e1e4df;border-radius:9px;grid-template-columns:25px minmax(0,1fr) auto;align-items:center;gap:8px;min-width:0;min-height:64px;padding:8px;display:grid}.list-index{color:#9aa09a;font:650 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace}.list-contact{grid-template-columns:74px minmax(0,1fr);align-items:center;gap:9px;min-width:0;display:grid}.list-contact>span{gap:3px;min-width:0;display:grid}.list-contact strong,.list-contact small{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.list-contact strong{font-size:10px}.list-contact small{color:#7c847d;font-size:8px}.list-actions{gap:3px;display:flex}.list-actions button{cursor:pointer;background:#fff;border:1px solid #dfe3dd;border-radius:5px;min-width:24px;height:25px;padding:0 5px;font-size:8px}.list-actions button.danger{color:#a34c40}.empty-list{text-align:center;border:1px dashed #daddd7;border-radius:10px;align-content:center;place-items:center;gap:10px;min-height:140px;margin-top:18px;display:grid}.empty-list span{color:#9aa19a;background:#eef1eb;border-radius:50%;place-items:center;width:34px;height:34px;font-size:10px;display:grid}.empty-list p{color:#929993;max-width:220px;margin:0;font-size:10px;line-height:1.6}.asset-credit{color:#9ba19b;margin:28px 0 0;font-size:8px;line-height:1.7}.asset-credit a{color:#677366;text-underline-offset:2px}.preview-area{background:var(--paper);min-width:0;padding:38px clamp(24px,4vw,62px) 90px}.preview-heading{justify-content:space-between;align-items:flex-end;gap:18px;max-width:900px;margin:0 auto 18px;display:flex}.preview-heading h2{letter-spacing:-.035em;margin:0;font-size:21px}.preview-actions{gap:8px;display:flex}.preview-actions button{cursor:pointer;background:#ffffffd1;border:1px solid #cbd0c9;border-radius:8px;height:40px;padding:0 16px;font-size:11px;font-weight:720}.preview-actions .export{color:#fff;background:#242b25;border-color:#242b25;min-width:105px}.preview-status{color:#717972;align-items:center;gap:8px;max-width:900px;margin:0 auto 25px;font-size:10px;display:flex}.drag-tip{color:#515a52;font-weight:700}.mode-dot{border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #5f78471a}.mode-dot--color{background:#74b548}.mode-dot--bw{background:#202520}.pages-stack{gap:44px;display:grid}.paper-wrap{width:min(100%,900px);margin:auto}.paper-label{color:#7d857e;justify-content:space-between;margin-bottom:9px;font-size:10px;display:flex}.paper-label em{font-style:normal}.a4-paper{aspect-ratio:210/297;background:#fff;grid-template-rows:repeat(4,1fr);grid-template-columns:1fr 1fr;gap:1.5%;width:100%;padding:5.5% 3.5%;display:grid;position:relative;overflow:hidden;box-shadow:0 18px 60px #21282221}.contact-card{border:1px solid #bdc4bd;border-radius:3px;flex-direction:column;justify-content:center;min-width:0;padding:4.5% 7% 5.5%;transition:border-color .16s,box-shadow .16s,opacity .16s,transform .16s;display:flex;position:relative;overflow:hidden}.contact-card--interactive{cursor:grab}.contact-card--interactive:active{cursor:grabbing}.contact-card--dragging{opacity:.34;transform:scale(.985)}.contact-card--drop-target{border-color:#5f772d;box-shadow:inset 0 0 0 3px #85a83745}.contact-card-tools{height:var(--card-tool-size);pointer-events:none;justify-content:space-between;align-items:center;display:flex;position:absolute;top:9px;left:9px;right:9px}.drag-handle{width:var(--card-tool-size);height:var(--card-tool-size);color:#8a928b;pointer-events:auto;place-items:center;display:grid;transform:translate(-4px,-4px)}.contact-card-tools button{width:var(--card-tool-size);height:var(--card-tool-size);color:#a14335;cursor:pointer;pointer-events:auto;background:#fff8f6;border:1px solid #e3c8c3;border-radius:5px;place-items:center;padding:0;display:grid}.contact-card-tools button:hover{background:#fff1ed;border-color:#b75a4b}.plate-artwork{width:var(--contact-content-width);background:#ddd;border-radius:2.5%/8%;margin:0 0 5% .5em;position:relative;overflow:hidden}.plate-background{object-fit:fill;-webkit-user-select:none;user-select:none;width:100%;height:100%;position:absolute;inset:0}.plate-token{object-fit:fill;-webkit-user-select:none;user-select:none;position:absolute}.plate-print-canvas{width:100%;height:100%;display:none;position:absolute;inset:0}.plate-artwork--light .plate-token{filter:invert();mix-blend-mode:screen}.plate-artwork--dark .plate-token{mix-blend-mode:multiply}.plate-artwork--bw{background:#fff;border:2px solid #171b18;border-radius:5px}.plate-token--bw{mix-blend-mode:multiply}.plate-artwork--compact{border-radius:2px;width:74px;margin:0}.plate-artwork--compact.plate-artwork--bw{border-width:1px}.contact-card dl{width:var(--contact-content-width);gap:2%;margin:0;display:grid}.contact-card dl div{font-size:clamp(16px,2.2vw,30px);line-height:1.32;display:flex}.contact-card dt{color:#626a63;flex:none}.contact-card dd{white-space:nowrap;text-overflow:ellipsis;margin:0;font-weight:750;overflow:hidden}.empty-slot{border:1px dashed #e0e3df;border-radius:3px}.empty-paper-message{color:#a0a6a0;pointer-events:none;align-content:center;place-items:center;gap:6px;display:grid;position:absolute;inset:0}.empty-paper-message strong{color:#7e857f;font-size:14px}.empty-paper-message span{font-size:10px}.toast{z-index:20;color:#fff;background:#1b1f1c;border-radius:10px;padding:12px 18px;font-size:11px;position:fixed;bottom:28px;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #0000003d}@media (max-width:1120px){:root{--panel-width:390px}.editor-panel{padding-inline:26px}.a4-paper{min-width:600px}.paper-wrap{padding-bottom:10px;overflow-x:auto}}@media (max-width:780px){.app-header{height:68px;padding-inline:16px}.header-summary span{display:none}.workspace{display:block}.editor-panel{border-right:0;border-bottom:1px solid var(--line);padding:30px 20px 42px}.preview-area{padding:30px 16px 60px}.preview-heading{align-items:flex-start}.preview-actions{display:grid}.a4-paper{min-width:620px}}@media (max-width:420px){.type-options{grid-template-columns:1fr}.type-options button{height:48px}.list-contact{grid-template-columns:64px minmax(0,1fr)}.list-actions button:first-child,.list-actions button:nth-child(2){display:none}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}@page{size:A4 portrait;margin:0}@media print{@page{size:A4 portrait;margin:0}html,body{background:#fff;width:210mm;margin:0}.app-shell{background:#fff}.app-header,.editor-panel,.preview-heading,.preview-status,.paper-label,.toast{display:none!important}.workspace,.preview-area,.pages-stack,.paper-wrap{background:#fff;width:auto;max-width:none;margin:0;padding:0;display:block;overflow:visible}.a4-paper{aspect-ratio:auto;width:210mm;min-width:0;height:297mm;box-shadow:none;break-after:page;page-break-after:always;-webkit-print-color-adjust:exact;print-color-adjust:exact;grid-template-rows:repeat(4,60mm);align-content:start;gap:4mm 3.5mm;padding:22.5mm 10mm}.paper-wrap:last-child .a4-paper{break-after:auto;page-break-after:auto}.contact-card{--contact-content-width:82mm;cursor:default;opacity:1;box-shadow:none;border-color:#aeb5ae;padding:2mm 4mm 2mm 5mm;transform:none}.contact-card-tools{display:none!important}.plate-artwork{margin:0 0 2mm .5em}.plate-artwork--print-flat>.plate-background,.plate-artwork--print-flat>.plate-token{display:none}.plate-artwork--print-flat>.plate-print-canvas{display:block}.contact-card dl{gap:0}.contact-card dl div{font-size:21pt;line-height:1.08}.empty-slot{border-color:#0000}.empty-paper-message{display:none}}
