@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#233f36;background:#f6f7f2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}header{height:88px;border-bottom:1px solid #dfe5dc;display:flex;justify-content:space-between;align-items:center;padding:0 6%}.brand{font-family:Manrope,sans-serif;font-weight:800;font-size:23px;color:inherit;text-decoration:none;display:flex;align-items:center;gap:10px}.logo{background:#246b51;color:white;border-radius:10px;padding:6px 13px;font-size:25px}.brand small{font-size:10px;font-weight:600;letter-spacing:1px;background:#e3ebdc;padding:4px 6px;border-radius:4px}.privacy{font-size:13px;color:#66796b}main{max-width:1380px;margin:auto;padding:40px 6% 20px}.intro{text-align:center;margin:16px 0 32px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:#568269}h1{font-family:Manrope,sans-serif;font-size:clamp(30px,4vw,48px);line-height:1.22;letter-spacing:-1.7px;margin:16px 0}p{color:#718078;line-height:1.65;font-size:14px}h2{font-family:Manrope,sans-serif;font-size:21px;letter-spacing:-.5px}button,select{font:inherit;cursor:pointer;background:white;border:1px solid #d7dfd5;border-radius:8px;padding:11px 17px;color:#355345}button:hover{background:#eaf0e7}button:disabled{opacity:.45;cursor:default}.primary{background:#246b51;color:white;border-color:#246b51;font-weight:600}.primary:hover{background:#1b563f}.upload{max-width:650px;margin:auto;text-align:center;border:1.5px dashed #b8cabc;background:#fff;border-radius:18px;padding:32px;box-shadow:0 12px 45px #25432a05}.file-icon{margin:auto;background:#eef3e8;border-radius:15px;width:58px;padding:8px;color:#36704e;font-size:32px}.upload h2{margin:20px 0 8px}.upload p{margin:0 0 22px}.upload small{display:block;font-size:11px;color:#7d8d80;margin:16px 0}.link{background:none;border:none;font-size:12px}.toolbar{display:flex;justify-content:space-between;align-items:center;background:white;border:1px solid #dde5da;padding:16px 20px;border-radius:12px 12px 0 0;gap:15px}.toolbar strong{font-size:14px;word-break:break-all}.toolbar small{display:block;color:#839086;font-size:11px;margin-top:4px}.actions{display:flex;gap:8px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 290px;border:1px solid #dde5da;border-top:0;border-radius:0 0 12px 12px;overflow:hidden}.viewer{background:#e8ece5;min-width:0}nav{display:flex;justify-content:center;align-items:center;gap:15px;padding:12px;font-size:12px}nav button{padding:5px 12px}nav select{padding:5px}.scroll{height:660px;overflow:auto;padding:18px 24px 38px}#paper{position:relative;background:white;margin:auto;box-shadow:0 5px 22px #273e301a}canvas{display:block;width:100%;height:100%}#targets{position:absolute;inset:0}.target{position:absolute;border:1px solid transparent;background:transparent;border-radius:2px;padding:0;min-height:4px}.target:hover,.target:focus{background:#318d5920;border:1px solid #318d59}.target.selected{background:#318d5933;border-color:#318d59}aside{padding:26px;background:#fff}aside h2{font-size:20px}label{display:block;font-size:12px;font-weight:600;margin:18px 0 8px}textarea{width:100%;resize:vertical;min-height:85px;border:1px solid #b6cbb8;border-radius:8px;padding:12px;font:inherit;font-size:14px;outline-color:#246b51}#original{font-size:13px;padding:10px;background:#f4f6f0;word-break:break-word;border-radius:6px}#fontinfo{font-size:11px;color:#61746a;margin-top:10px}.check{font-weight:400;display:flex;align-items:center;gap:6px}aside small{color:#89938c;font-size:11px;display:block;line-height:1.5}#apply{width:100%;margin-top:20px}.note{border-top:1px solid #e4eadd;margin-top:28px;padding-top:20px;font-size:12px}.note strong{font-size:12px}.note p{font-size:12px;line-height:1.6}#status{text-align:center;min-height:42px;padding:14px;font-size:12px;color:#5b7464}#status.error{color:#ad3939}footer{display:flex;justify-content:space-between;gap:15px;border-top:1px solid #dfe5dc;margin-top:35px;padding-top:22px;font-size:11px;color:#8a948b}footer a{color:#527961}[hidden]{display:none!important}.drag{background:#edf5e8;border-color:#246b51}@media(max-width:850px){header{padding:0 20px}.privacy{display:none}main{padding:20px}.workspace{grid-template-columns:1fr}aside{border-top:1px solid #d7dfd5}.scroll{height:500px}.toolbar{flex-wrap:wrap}.actions{flex-wrap:wrap}footer{flex-wrap:wrap}}
/* Tools, rulers and positioning */
.tools{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:13px 18px;background:#f0f4eb;border:1px solid #dde5da;border-top:0}.tools button{font-size:12px;padding:9px 12px}.toggles{display:flex;gap:14px;flex-wrap:wrap}.toggles label{font-size:11px;margin:0;font-weight:400;display:flex;align-items:center;gap:5px}.workspace{grid-template-columns:minmax(0,1fr) 320px}.intro{margin:0 0 25px}.intro h1{font-size:36px;margin:12px 0}.scroll{padding:45px 32px 38px;height:720px}#rulerX{position:absolute;top:-24px;left:0;overflow:visible;pointer-events:none}#rulerY{position:absolute;left:-24px;top:0;overflow:visible;pointer-events:none}#guideLayer{position:absolute;inset:0;pointer-events:none;z-index:4;overflow:hidden}.target{cursor:grab;touch-action:none;min-height:5px}.target:hover,.target:focus{background:#318d5915}.target.selected{border:1.5px solid #246b51;background:#318d5910}.target:active{cursor:grabbing}.target.image{border:1px dashed #5a9479;z-index:2}.draft{position:absolute;z-index:3;border:1.5px dashed #dc823b;cursor:grab;touch-action:none;white-space:nowrap;line-height:1.2;background:#ffffffb0;user-select:none}.draft img{width:100%;height:100%;object-fit:fill;pointer-events:none;display:block}.draft.image{background:none}.fields{display:flex;gap:10px}.fields label{flex:1;min-width:0}.fields input{display:block;width:100%;margin-top:8px}input[type=number],input[type=text],aside select{width:100%;padding:9px 10px;border:1px solid #b6cbb8;border-radius:7px;font:inherit;font-size:13px;color:#233f36;background:#fff}input[type=color]{height:35px;padding:2px;width:100%;border:1px solid #b6cbb8;border-radius:7px}.alignbuttons{display:flex;flex-direction:column;gap:7px;margin-top:15px}.alignbuttons button{font-size:11px;padding:8px}.nudge{display:flex;gap:5px;align-items:center;margin-top:12px}.nudge button{padding:7px 12px}.nudge small{margin-left:4px}.danger{width:100%;margin-top:9px;color:#a14236;border-color:#e5c7bf;background:#fff8f5;font-size:12px}.danger:hover{background:#fbeae4}#cancel{display:block;width:100%;margin-top:7px}aside{padding:22px}aside .note{margin-top:22px}#replacement{margin:0}#imagename{word-break:break-all}#fontinfo{overflow-wrap:anywhere}@media(max-width:900px){.workspace{grid-template-columns:1fr}.tools{flex-wrap:wrap}.scroll{height:510px}.intro h1{font-size:29px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
dialog{color:#233f36;border:1px solid #d7e0d2;border-radius:16px;padding:24px;width:min(580px,92vw);max-height:85vh;box-shadow:0 22px 90px #173b3b30}dialog::backdrop{background:#20392f66}.historyhead{display:flex;justify-content:space-between;align-items:center;gap:12px}.historyhead h2{margin:0}.historyhead button{font-size:20px;padding:4px 12px}#historylist{list-style:none;padding:0;max-height:52vh;overflow:auto}#historylist li{padding:14px 0;border-top:1px solid #e0e6da}#historylist strong{display:block;font-size:14px}#historylist small{display:block;color:#718078;font-size:11px;margin-top:5px}#historylist p{font-size:12px;margin:9px 0;white-space:pre-wrap;overflow-wrap:anywhere}#historylist button{font-size:11px;padding:6px 10px}#historylist .undone{opacity:.6}#historyundo{width:100%;margin-top:10px}
#image-resize{position:absolute;z-index:10;border:1px solid #075df1;pointer-events:none;box-sizing:border-box}#image-resize .resize-handle{position:absolute;width:12px;height:12px;min-width:12px;min-height:12px;padding:0;background:white;border:2px solid #075df1;border-radius:3px;pointer-events:auto;touch-action:none;transform:translate(-50%,-50%)}.resize-handle.nw{left:0;top:0;cursor:nwse-resize}.resize-handle.n{left:50%;top:0;cursor:ns-resize}.resize-handle.ne{left:100%;top:0;cursor:nesw-resize}.resize-handle.e{left:100%;top:50%;cursor:ew-resize}.resize-handle.se{left:100%;top:100%;cursor:nwse-resize}.resize-handle.s{left:50%;top:100%;cursor:ns-resize}.resize-handle.sw{left:0;top:100%;cursor:nesw-resize}.resize-handle.w{left:0;top:50%;cursor:ew-resize}@media(pointer:coarse){#image-resize .resize-handle{width:20px;height:20px}}
.physical-info{font-size:11px;color:#526b8a;text-align:center;padding:8px 16px;margin:0;background:#edf4ff}#calibration{width:min(600px,94vw);max-height:90vh;overflow:auto;padding:25px;border:1px solid #cbd9eb;border-radius:15px;color:#21324a}#calibration::backdrop{background:#102b49a8}#calibration p,#calibration li{font-size:12px;line-height:1.8}#calibration ol{padding-left:22px}.calibration-ruler{overflow:auto;background:#f3f7fc;padding:25px 12px 16px;margin-top:15px}#reference-line{height:28px;border-bottom:2px solid #075df1;position:relative;margin:0 auto}#reference-line:before,#reference-line:after{content:'';position:absolute;bottom:-2px;height:15px;width:2px;background:#075df1}#reference-line:before{left:0}#reference-line:after{right:0}#reference-line span{display:block;text-align:center;font-size:12px;color:#075df1}#calibration-range{width:100%;accent-color:#075df1}.calibration-step{display:flex;justify-content:center;gap:8px}.calibration-note{color:#6e8098}#calibration .primary{width:100%;margin-top:8px}.viewer nav{flex-wrap:wrap}
#a4-preview{width:min(1200px,96vw);max-height:95vh;border:1px solid #cbd9eb;border-radius:15px;padding:22px;color:#21324a}#a4-preview::backdrop{background:#102b49a8}.a4-controls{display:flex;align-items:end;gap:15px;flex-wrap:wrap}.a4-controls label{margin:5px 0;font-size:12px}.a4-controls select{display:block;margin-top:6px}.a4-scroll{overflow:auto;max-height:62vh;background:#e6edf5;padding:25px}#a4-canvas{max-width:none;width:auto;height:auto;display:block;box-shadow:0 5px 20px #172f4f25;margin:auto}#a4-details{font-size:12px;line-height:1.7}
