:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#f6f8f7;color:#172326;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,select,textarea{font:inherit}button{cursor:pointer}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px clamp(20px,4vw,64px);border-bottom:1px solid #dbe3e0;background:#f6f8f7eb;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.brand{display:inline-flex;align-items:center;gap:10px;color:#172326;font-size:18px;font-weight:800;text-decoration:none}.brand-mark{width:30px;height:30px;border:8px solid #0f766e;border-radius:8px;box-shadow:inset 0 0 0 5px #f6f8f7}.topnav{display:flex;align-items:center;gap:22px}.topnav a{color:#52615e;font-size:14px;font-weight:700;text-decoration:none}main{padding:42px clamp(18px,4vw,64px) 64px}.workspace{max-width:1240px;margin:0 auto}.intro{display:grid;grid-template-columns:minmax(0,.82fr) minmax(280px,.5fr);align-items:end;gap:28px;margin-bottom:26px}h1,h2,p{margin:0}h1{max-width:760px;font-size:clamp(40px,6vw,74px);line-height:.94;letter-spacing:0}.intro p{color:#52615e;font-size:18px;line-height:1.55}.tool-shell{display:grid;grid-template-columns:minmax(360px,.9fr) minmax(360px,1.1fr);gap:18px;align-items:stretch}.panel{border:1px solid #d9e3df;border-radius:8px;background:#fff;box-shadow:0 18px 48px #17232614}.controls{display:flex;flex-direction:column;gap:18px;padding:24px}.section-head{display:grid;gap:6px}.section-head.compact{margin-top:2px}.step{color:#0f766e;font-size:13px;font-weight:900;letter-spacing:0;text-transform:uppercase}.section-head p:not(.step),.scan-note,.file-drop small{color:#60706c;font-size:14px;line-height:1.45}.segmented{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;padding:5px;border:1px solid #dde6e2;border-radius:8px;background:#f7faf9}.segment{min-height:42px;border:0;border-radius:6px;background:transparent;color:#52615e;font-size:13px;font-weight:800}.segment[aria-selected=true]{background:#172326;color:#fff}.fields{display:grid;gap:14px}label{display:grid;gap:8px;color:#243330;font-size:13px;font-weight:800}input,select,textarea{width:100%;min-height:46px;border:1px solid #d7e0dc;border-radius:8px;background:#fbfdfc;color:#172326;padding:11px 12px;outline:none}textarea{resize:vertical;line-height:1.45}input:focus,select:focus,textarea:focus{border-color:#0f766e;box-shadow:0 0 0 3px #0f766e24}input[type=color]{padding:4px}input[type=range]{padding-inline:0;accent-color:#0f766e}.grid-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.preset-row{display:flex;flex-wrap:wrap;gap:8px}.swatch-pair{display:grid;grid-template-columns:1fr 1fr;width:54px;height:34px;overflow:hidden;border:1px solid #cdd9d5;border-radius:8px;background:#fff;padding:3px}.swatch-pair span{border-radius:5px}.file-drop{padding:16px;border:1px dashed #b8c8c3;border-radius:8px;background:#f9fbfa}.file-drop input{display:none}.file-drop span{color:#172326;font-size:14px;font-weight:900}.primary-btn,.secondary-btn{min-height:48px;border-radius:8px;font-weight:900}.primary-btn{border:0;background:#ee6c4d;color:#fff}.secondary-btn{border:1px solid #bdcbc7;background:#fff;color:#172326}.primary-btn:hover,.secondary-btn:hover{transform:translateY(-1px)}.preview-panel{display:grid;grid-template-rows:auto 1fr auto auto;gap:18px;min-height:620px;padding:24px}.preview-head{display:flex;justify-content:space-between;gap:16px;align-items:start}.preview-head h2{margin-top:4px;font-size:28px}.status-dot{display:inline-flex;align-items:center;gap:8px;max-width:210px;color:#0f5f58;font-size:13px;font-weight:900;line-height:1.25}.status-dot:before{content:"";width:9px;height:9px;border-radius:50%;background:#21a67a}.qr-stage{display:grid;place-items:center;min-height:420px;border:1px solid #e0e7e4;border-radius:8px;background:linear-gradient(45deg,#f5f8f7 25%,transparent 25%),linear-gradient(-45deg,#f5f8f7 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f5f8f7 75%),linear-gradient(-45deg,transparent 75%,#f5f8f7 75%);background-color:#fff;background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px;padding:clamp(16px,3vw,32px)}canvas{width:min(100%,440px);max-width:100%;height:auto;border-radius:8px;box-shadow:0 12px 32px #1723261f}.download-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.benefits,.info-grid,.faq{max-width:1240px;margin:18px auto 0}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.benefits article{display:grid;gap:5px;padding:18px;border:1px solid #d9e3df;border-radius:8px;background:#fff}.benefits strong{font-size:16px}.benefits span,.info-grid p,.info-grid li,.faq p{color:#5d6d69;line-height:1.55}.info-grid{display:grid;grid-template-columns:.9fr 1fr;gap:30px;padding:42px 0 22px}.info-grid h2{margin-bottom:12px;font-size:32px}.info-grid ol{display:grid;gap:12px;margin:0;padding:0;list-style:none;counter-reset:steps}.info-grid li{position:relative;padding:18px 18px 18px 58px;border:1px solid #d9e3df;border-radius:8px;background:#fff;counter-increment:steps}.info-grid li:before{content:counter(steps);position:absolute;left:18px;top:18px;display:grid;place-items:center;width:26px;height:26px;border-radius:7px;background:#0f766e;color:#fff;font-size:13px;font-weight:900}.info-grid span{color:#172326;font-weight:900}.faq{display:grid;gap:10px}.faq h2{margin:18px 0 8px;font-size:32px}details{border:1px solid #d9e3df;border-radius:8px;background:#fff;padding:18px}summary{color:#172326;font-weight:900;cursor:pointer}details p{margin-top:10px}.footer{display:flex;justify-content:center;gap:22px;padding:28px clamp(18px,4vw,64px) 42px;color:#52615e;font-size:14px;font-weight:800}.footer a{color:inherit;text-decoration:none}@media(max-width:900px){.topbar,.intro,.tool-shell,.benefits,.info-grid,.footer{grid-template-columns:1fr}.topbar{position:static;align-items:flex-start}.topnav{display:none}.footer{display:grid;justify-items:start}main{padding-top:28px}h1{font-size:clamp(38px,12vw,56px)}.tool-shell{display:flex;flex-direction:column}.preview-panel{min-height:auto}}@media(max-width:560px){.controls,.preview-panel{padding:16px}.segmented,.grid-two,.download-row{grid-template-columns:1fr}.segment{text-align:left;padding-inline:14px}.preview-head{display:grid}.qr-stage{min-height:300px}}
