:root{font-family:Arial,Helvetica,sans-serif;font-synthesis:none;color:#202222;background:#151515;--purple:#6432ff;--ink:#202222;--muted:#656d72;--line:#ccd1d4;--panel:#f1f3f4;--canvas:#e6ebee;--wash:#e9e1ff}*{box-sizing:border-box}body{margin:0;padding:14px;height:100dvh;overflow:hidden}button,input,textarea,select{font:inherit;color:inherit}button,a,input,textarea,select,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer;transition:background .15s,color .15s,transform .15s,border-color .15s}button:disabled{cursor:not-allowed;opacity:.38}button:not(:disabled):active{transform:translateY(1px)}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--purple);outline-offset:3px}input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--purple);outline-offset:1px}input,textarea,select{border-radius:3px}a{color:inherit}[hidden]{display:none!important}.app-shell{height:100%;width:100%;display:flex;flex-direction:column;border:1px solid #ffffff14;border-radius:10px;overflow:hidden;background:var(--panel)}.masthead{height:78px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 25px;background:var(--canvas);border-bottom:1px solid var(--line)}.branding{display:flex;flex-direction:column;align-items:flex-start;gap:5px}.branding img{display:block;width:142px;height:38px;object-fit:contain}.branding>span{font-size:8px;letter-spacing:1.6px}.context{font-size:12px;display:flex;gap:13px;align-items:center}.context>span{color:var(--muted)}.global-actions{display:flex;align-items:center;gap:23px}.local-state{font-size:10px;color:var(--muted);display:flex;gap:7px;align-items:center}.local-state i,.app-status i{width:5px;height:5px;display:inline-block;border-radius:50%;background:var(--purple)}.back-link{font-size:10px;text-decoration:none;white-space:nowrap}.text-button{border:0;background:transparent;padding:7px 0;font-size:11px;display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap}.text-button:hover{color:var(--purple)}#reset{min-height:35px;border:1px solid var(--line);border-radius:3px;padding:7px 12px;background:#ffffff36}.workbench{display:grid;grid-template-columns:clamp(235px,21vw,310px) minmax(0,1fr) clamp(260px,23vw,320px);flex:1;min-height:0}.left-panel,.right-panel{min-width:0;min-height:0;display:flex;flex-direction:column;background:var(--panel)}.left-panel{border-right:1px solid var(--line)}.right-panel{border-left:1px solid var(--line)}.left-scroll,.properties-scroll{overflow:auto;overscroll-behavior:contain;min-height:0;scrollbar-width:thin;scrollbar-color:#bbc1c5 transparent}.left-scroll{flex:1}.properties-scroll{flex:1}h2{font-size:11px;letter-spacing:1px;font-weight:500;margin:0;display:flex;gap:10px;align-items:center}h2>span{color:var(--muted);font-size:9px}.section-heading{display:flex;align-items:center;justify-content:space-between;min-height:25px;margin-bottom:16px}.quiet-label,.eyebrow{font-size:9px;letter-spacing:1px;font-weight:500}.quiet-label{color:var(--muted)}.type-section{padding:22px 18px;border-bottom:1px solid var(--line)}.types{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.types button{min-width:0;min-height:40px;border:1px solid var(--line);border-radius:3px;background:transparent;display:flex;align-items:center;gap:9px;text-align:left;padding:9px 10px;font-size:11px}.types button svg{width:16px;height:16px;flex-shrink:0}.types button:hover{background:#e8e8ed;border-color:#a6a6b2}.types button[aria-pressed=true]{background:var(--wash);border-color:#c6b3ff;color:var(--purple);box-shadow:inset 2px 0 var(--purple)}.content-section{padding:22px 18px}.content-section .section-heading{margin-bottom:18px}form{display:grid;gap:15px}form.vcard{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}form.vcard .form-field:nth-child(n+5){grid-column:1/-1}.form-field{display:flex;flex-direction:column;gap:8px;min-width:0}.form-field label{font-size:10px;letter-spacing:.15px}.form-field input,.form-field textarea,.form-field select,.size-row select,.size-row input{border:1px solid var(--line);background:#ffffff55;min-width:0;width:100%;padding:9px 10px;font-size:12px;line-height:19px}.form-field input::placeholder,.form-field textarea::placeholder{color:#828a8f}.form-field textarea{resize:vertical;min-height:110px;max-height:220px}.check-field label,.advanced label{display:flex;gap:8px;align-items:center;font-size:10px;line-height:1.5}.check-field input{width:15px;height:15px;accent-color:var(--purple);margin:0}.helper{font-size:10px;line-height:1.6;color:var(--muted);margin:10px 0 0}.helper:empty,.field-error:empty{display:none}.field-error{font-size:11px;line-height:1.5;color:#a23520;margin:8px 0 0;overflow-wrap:anywhere}.drive-destination{border-top:1px solid var(--line);margin-top:17px;padding-top:13px}.drive-destination span{font-size:9px;letter-spacing:.8px;color:var(--purple)}.drive-destination p{font-size:10px;line-height:1.6;overflow-wrap:anywhere;color:var(--muted);margin:7px 0 0}.panel-foot{flex-shrink:0;padding:26px 20px 24px;border-top:1px solid var(--line)}.panel-foot strong{font-size:23px;letter-spacing:-1px;line-height:1.1;font-weight:600}.panel-foot p{font-size:10px;line-height:1.65;color:var(--muted);margin:13px 0 0}.preview-section{min-width:0;min-height:0;display:flex;flex-direction:column;background:var(--canvas)}.preview-top{height:56px;flex-shrink:0;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 21px}.preview-top .eyebrow{font-size:10px}.live-label{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:8px;letter-spacing:.6px}.live-label i{height:4px;width:4px;border-radius:50%;background:#949ca1}.live-label.active{color:var(--purple)}.live-label.active i{background:var(--purple)}.preview-stage{flex:1;min-height:0;min-width:0;display:grid;place-items:center;container-type:size;background-image:radial-gradient(#aeb9c080 .7px,transparent .7px);background-size:23px 23px}.qr-preview{display:grid;place-items:center;width:min(82%,450px);width:min(82cqw,80cqh,480px);aspect-ratio:1;background:var(--panel);border:1px solid #d7dde0;box-shadow:0 2px 5px #20222204;min-width:0}.qr-preview>svg{width:100%;height:auto;display:block}.qr-preview:has(>svg){border:0;background:none;box-shadow:0 4px 22px #25292908}.empty-state{text-align:center;padding:15px}.empty-state img{width:72px;height:72px;opacity:.3;transition:transform .2s}.empty-state:hover img{transform:rotate(4deg)}.empty-state h3{font-size:23px;line-height:1.15;letter-spacing:-.8px;margin:24px 0 10px;font-weight:600}.empty-state p{font-size:11px;line-height:1.7;color:var(--muted);margin:0}.preview-bottom{min-height:49px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 20px;border-top:1px solid var(--line);font-size:8px;letter-spacing:.7px;color:var(--muted)}.preview-bottom .text-button{font-size:10px;letter-spacing:0}.customize-section{padding:22px 20px}.customize-section>.section-heading{margin:-22px -20px 22px;padding:0 20px;height:56px;border-bottom:1px solid var(--line)}.customize-section>.section-heading h2{height:100%;position:relative;font-size:12px;letter-spacing:.3px}.customize-section>.section-heading h2:after{content:'';height:2px;position:absolute;background:var(--purple);left:0;right:0;bottom:0}.color-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.color-field{min-width:0}.color-field label{display:block;font-size:9px;letter-spacing:.6px;margin-bottom:9px}.color-input{display:flex;align-items:center;gap:7px;padding:4px 6px;border:1px solid var(--line);border-radius:3px;height:37px;background:#ffffff55}.color-input input[type=color]{border:0;background:none;width:23px;height:25px;flex-shrink:0;padding:0;cursor:pointer}.color-input input[type=color]::-webkit-color-swatch-wrapper{padding:2px 0}.color-input input[type=color]::-webkit-color-swatch{border:1px solid #0002;border-radius:2px}.color-input input:not([type=color]){min-width:0;width:100%;border:0;background:transparent;padding:0;font:10px ui-monospace,SFMono-Regular,Consolas,monospace;line-height:26px}.setting-title{font-size:9px;letter-spacing:.6px;margin:24px 0 10px;display:flex;justify-content:space-between;align-items:center}.setting-title>span:last-child{color:var(--muted)}.size-row{display:flex;gap:8px}.size-row select,.size-row input{height:37px;padding:7px 9px;font-size:11px}.size-row input{max-width:90px}.segments{display:flex;gap:3px;border:1px solid var(--line);border-radius:3px;padding:3px}.segments button{border:0;background:transparent;flex:1;padding:8px 2px;font-size:10px;border-radius:2px;min-width:0}.segments button:hover{background:#e2e5e7}.segments button[aria-pressed=true]{background:var(--purple);color:#fff}.robustness-help{font-size:10px;margin-top:9px}.advanced{margin-top:13px;color:var(--muted);font-size:10px}.advanced summary{cursor:pointer;width:max-content;min-height:22px}.advanced label{margin-top:7px}.advanced input{accent-color:var(--purple)}.safety{border-top:1px solid var(--line);padding-top:21px;margin-top:20px}.safety-line{display:flex;justify-content:space-between;align-items:center;gap:10px}.safety-badge{font-size:8px;letter-spacing:.5px;text-transform:uppercase;color:#27623d;background:#e0ede4;padding:5px 7px;border-radius:3px;white-space:nowrap}.safety-badge.neutral{color:var(--muted);background:#e4e7e9}.safety-badge.good{color:#6c5e24;background:#ece9d9}.safety-badge.risky{color:#9f3b20;background:#f3e1d9}.safety p{font-size:10px;line-height:1.65;color:var(--muted);margin:11px 0 0}.safety p.scan-result{font-size:9px;margin-top:7px}.export-section{flex-shrink:0;padding:20px;border-top:1px solid var(--line)}.export-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.export-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.export-buttons button{display:flex;flex-direction:column;position:relative;text-align:left;border:1px solid var(--line);background:transparent;padding:13px 9px;border-radius:3px}.export-buttons button:first-child{background:var(--purple);border-color:var(--purple);color:white}.export-buttons button>span{font-size:13px}.export-buttons button>small{font-size:8px;opacity:.65;margin-top:6px}.export-buttons button>b{position:absolute;right:8px;top:13px;font-size:12px;font-weight:400}.export-buttons button:not(:disabled):hover{background:var(--ink);color:white;border-color:var(--ink);transform:translateY(-1px)}.export-buttons button:first-child:not(:disabled):hover{background:#5121dc;border-color:#5121dc}.app-status{height:34px;flex-shrink:0;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 20px;font-size:8px;letter-spacing:.8px;background:var(--panel)}.app-status>span{display:flex;align-items:center;gap:10px}.app-status b{font-weight:400;color:var(--muted);margin-left:12px}.app-status>span:nth-child(2){color:var(--muted);font-size:7px}.app-status>span:last-child{font-size:8px;color:var(--muted)}dialog{border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:28px;max-width:410px;width:calc(100% - 30px)}dialog::backdrop{background:#13141780;backdrop-filter:blur(4px)}dialog h2{font-size:23px;letter-spacing:-.6px}dialog p{font-size:13px;line-height:1.7;color:var(--muted)}dialog>div{display:flex;gap:10px;margin-top:23px}dialog button{padding:12px;border:1px solid var(--line);border-radius:3px;background:transparent;font-size:12px}dialog button.primary{background:var(--purple);border-color:var(--purple);color:#fff}.toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%,15px);background:var(--ink);color:white;border:1px solid #ffffff24;border-radius:4px;padding:13px 20px;font-size:12px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:10;max-width:calc(100vw - 30px);text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}
@media(min-width:1700px){.masthead{height:88px}.branding img{width:160px;height:43px}.workbench{grid-template-columns:300px minmax(0,1fr) 340px}.type-section,.content-section{padding:25px}.types button{min-height:44px}.qr-preview{width:min(80cqw,80cqh,580px)}.customize-section{padding:25px}.customize-section>.section-heading{margin:-25px -25px 25px;padding:0 25px}.types button,.form-field input,.form-field textarea,.form-field select{font-size:13px}.export-section{padding:25px}.setting-title,.color-field label{font-size:10px}.helper,.safety p{font-size:11px}}
@media(min-width:1001px) and (max-height:750px){body{padding:10px}.masthead{height:67px}.type-section{padding-top:17px;padding-bottom:17px}.types button{min-height:36px;padding-top:7px;padding-bottom:7px}.panel-foot{padding:17px 18px}.panel-foot strong{font-size:20px}.panel-foot p{margin-top:8px}.customize-section{padding-bottom:17px}.setting-title{margin-top:18px}.safety{padding-top:16px;margin-top:16px}.export-section{padding-top:15px;padding-bottom:15px}.export-heading{margin-bottom:10px}}
@media(max-width:1100px) and (min-width:1001px){body{padding:10px}.workbench{grid-template-columns:230px minmax(0,1fr) 260px}.global-actions{gap:14px}.local-state{display:none}.preview-top,.preview-bottom{padding-left:15px;padding-right:15px}.preview-top{flex-wrap:wrap;align-content:center;gap:7px}.live-label{font-size:7px}.customize-section,.export-section{padding-left:16px;padding-right:16px}.customize-section>.section-heading{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px}.qr-preview{width:min(86cqw,80cqh,480px)}}
@media(max-width:1000px){body{height:auto;min-height:100dvh;overflow:auto;padding:10px}.app-shell{height:auto;min-height:calc(100dvh - 20px)}.masthead{height:72px;padding:0 20px}.local-state{display:none}.workbench{grid-template-columns:250px minmax(0,1fr);grid-template-rows:minmax(470px,60vh) auto;flex:1}.left-panel{grid-column:1;grid-row:1}.preview-section{grid-column:2;grid-row:1}.right-panel{grid-column:1/-1;grid-row:2;border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1fr) 240px;align-items:stretch}.properties-scroll{overflow:visible}.customize-section{display:grid;grid-template-columns:1fr 1fr;column-gap:20px;padding:20px}.customize-section>.section-heading{grid-column:1/-1;margin:-20px -20px 20px;height:48px}.color-row{grid-column:1/-1}.customize-section>.setting-title{grid-column:1}.size-row{grid-column:1}.customize-section>#robustness-title{grid-column:2}.customize-section .segments,.customize-section .robustness-help,.customize-section .advanced{grid-column:1}.customize-section .safety{grid-column:2;grid-row:3/10;margin-top:24px;padding-top:0;border-top:0;border-left:1px solid var(--line);padding-left:18px}.color-row{max-width:360px}.export-section{border-top:0;border-left:1px solid var(--line);display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:22px}.panel-foot{padding:19px}.panel-foot strong{font-size:20px}.panel-foot p{font-size:9px}.preview-top{flex-wrap:wrap;align-content:center;gap:7px}.preview-bottom{flex-wrap:wrap;gap:3px;font-size:7px}.qr-preview{width:min(84cqw,78cqh,400px)}.global-actions{gap:14px}}
@media(max-width:700px){body{padding:6px}.app-shell{min-height:calc(100dvh - 12px);border-radius:8px}.masthead{padding:0 15px;height:75px;gap:12px}.branding img{width:128px;height:34px}.branding>span{font-size:7px;letter-spacing:1px}.context{display:none}.global-actions{gap:10px}.back-link{font-size:9px}#reset{min-height:40px;font-size:11px;padding:8px 10px}.workbench{display:flex;flex-direction:column}.left-panel{border-right:0}.left-scroll{overflow:visible}.type-section{padding:19px 16px 18px}.types{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.types button{flex-direction:column;justify-content:center;gap:6px;padding:9px 2px;min-height:59px;font-size:10px;text-align:center}.types button[aria-pressed=true]{box-shadow:inset 0 -2px var(--purple)}.types button svg{width:17px;height:17px}.content-section{padding:18px 16px 22px}.panel-foot{display:none}form.vcard .form-field:nth-child(n+5){grid-column:auto}.form-field input,.form-field textarea,.form-field select{font-size:16px;padding:11px 10px}.form-field label{font-size:11px}.check-field label{min-height:44px}.preview-section{border-top:1px solid var(--line);height:430px;flex-shrink:0}.preview-top{height:47px;padding:0 16px;flex-wrap:nowrap}.live-label{font-size:7px}.preview-stage{min-height:310px}.qr-preview{width:min(83cqw,83cqh,310px)}.empty-state img{width:58px;height:58px}.empty-state h3{font-size:22px;margin-top:17px}.preview-bottom{height:52px;padding:7px 16px;flex-wrap:nowrap;font-size:7px}.preview-bottom .text-button{min-height:36px;font-size:10px}.right-panel{display:flex;flex-direction:column;border-top:1px solid var(--line)}.customize-section{display:block;padding:21px 16px}.customize-section>.section-heading{margin:-21px -16px 21px;padding:0 16px;height:53px}.customize-section>.section-heading h2{font-size:13px}.color-row{max-width:none;gap:12px}.color-field label{font-size:10px}.color-input{height:44px;padding:7px 9px;gap:9px}.color-input input:not([type=color]){font-size:13px}.size-row select,.size-row input{height:44px;font-size:16px}.size-row input{max-width:130px}.setting-title{font-size:10px;margin-top:23px}.segments button{font-size:12px;min-height:44px}.helper{font-size:11px}.advanced{font-size:11px}.advanced summary{min-height:36px;padding:10px 0}.advanced label{font-size:11px;min-height:36px}.customize-section .safety{border-left:0;padding-left:0;margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}.safety p{font-size:11px}.safety p.scan-result{font-size:10px}.safety-badge{font-size:9px}.export-section{border-left:0;border-top:1px solid var(--line);padding:21px 16px 24px}.export-buttons{gap:9px}.export-buttons button{padding:15px 12px}.export-buttons button>span{font-size:15px}.export-buttons button>small{font-size:9px}.export-buttons button>b{right:12px;top:16px;font-size:15px}.app-status{padding:0 15px;height:37px}.app-status>span:nth-child(2){display:none}.app-status b{margin-left:2px}.form-field textarea{max-height:240px}}
@media(max-width:350px){body{padding:4px}.masthead{padding:0 12px}.type-section,.content-section{padding-left:12px;padding-right:12px}.types button{font-size:9px}.preview-top{padding:0 12px}.preview-top .eyebrow{font-size:9px}.live-label{font-size:6px}.preview-bottom{padding:7px 12px;font-size:6px}.color-input{padding-left:6px;padding-right:6px;gap:6px}.color-input input:not([type=color]){font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}