:root{--ink:#1b1d26;--paper:#f4f6fa;--surface:#fff;--signal:#2f5cff;--signal-strong:#2147d8;--line:#e7eaf1;--muted:#5f6477;--shadow:0 8px 22px #0f172a0d}*{box-sizing:border-box}body{color:var(--ink);background:#f4f6fa;margin:0;font-family:IBM Plex Sans,sans-serif}h1,h2,h3,.brand,.tick-label,.type-label,.nav-btn,.download-btn{font-family:Space Grotesk,sans-serif}button,input,select,textarea{font:inherit}:focus-visible{outline:2px solid var(--signal);outline-offset:2px}.app{flex-direction:column;min-height:100vh;padding:24px;display:flex}.app-header{border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow);border-radius:18px;justify-content:space-between;align-items:center;gap:24px;padding:18px 28px;display:flex}.brand{align-items:center;gap:8px;font-size:17px;font-weight:700;display:flex}.step-track{flex:1;width:100%;max-width:560px;position:relative}.step-track-line{background:var(--line);border-radius:999px;height:2px;position:absolute;top:9px;left:9px;right:9px}.step-track-fill{background:var(--signal);border-radius:999px;height:100%;transition:width .3s}.step-list{justify-content:space-between;margin:0;padding:0;list-style:none;display:flex;position:relative}.step-tick{color:var(--muted);flex-direction:column;align-items:center;gap:6px;font-size:12px;display:flex}.tick-mark{background:var(--surface);border:2px solid var(--line);width:20px;height:20px;color:var(--muted);border-radius:999px;justify-content:center;align-items:center;font-size:10px;font-weight:700;display:flex;box-shadow:0 4px 12px #4f46e514}.step-tick.step-active .tick-mark{border-color:var(--signal);color:var(--signal)}.step-tick.step-done .tick-mark{border-color:var(--signal);background:var(--signal);color:#fff}.step-tick.step-active .tick-label{color:var(--ink);font-weight:700}.app-main{flex:1;align-items:flex-start;gap:16px;padding:20px 8px 0;display:flex}.step-panel{flex:1;min-width:0}.step-panel h2{margin:0 0 18px;font-size:19px;font-weight:700}.preview-panel{flex-shrink:0;width:270px;position:sticky;top:20px}.type-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;display:grid}.type-tile{border:1px solid var(--line);text-align:left;cursor:pointer;background:#ffffffdb;border-radius:18px;flex-direction:column;gap:8px;padding:18px 14px;transition:transform .15s,box-shadow .15s,border-color .15s,background .15s;display:flex;box-shadow:0 8px 18px #4f46e50a}.type-tile:hover{border-color:#c9d2f7;transform:translateY(-1px)}.type-tile.selected{background:#4f46e50f;border-color:#4f46e5cc;box-shadow:0 14px 28px #4f46e51f}.type-icon{color:var(--ink)}.type-tile.selected .type-icon{color:var(--signal)}.type-label{font-size:14px;font-weight:700}.type-description{color:var(--muted);font-size:12px;line-height:1.4}.content-form,.design-customizer{border:1px solid var(--line);background:#ffffffe6;border-radius:22px;max-width:460px;padding:28px;box-shadow:0 12px 28px #1f29370a}.content-form h3,.design-customizer h3{margin:0 0 20px;font-size:15px;font-weight:700}.form-field{flex-direction:column;gap:6px;margin-bottom:18px;font-size:13px;font-weight:600;display:flex}.form-field input[type=text],.form-field select,.form-field textarea{border:1px solid var(--line);color:var(--ink);background:#f8f9ff;border-radius:12px;padding:11px 12px;font-size:14px;font-weight:400;transition:border-color .15s,box-shadow .15s}.form-field input[type=text]:focus,.form-field select:focus,.form-field textarea:focus{border-color:#4f46e5cc;outline:none;box-shadow:0 0 0 4px #4f46e514}.checkbox-field{flex-direction:row;align-items:center;gap:8px}.file-input-wrap{border:1px dashed var(--line);color:var(--muted);background:#f8f9ff;border-radius:12px;align-items:center;gap:8px;padding:10px 12px;display:flex}.form-field input[type=color]{border:1px solid var(--line);background:#fff;border-radius:10px;width:52px;height:38px;padding:2px}.wizard-nav{gap:12px;margin-top:24px;display:flex}.nav-btn{cursor:pointer;border:1px solid #0000;border-radius:999px;align-items:center;gap:6px;padding:12px 20px;font-size:13px;font-weight:700;transition:all .15s;display:inline-flex}.nav-btn.ghost{border-color:var(--line);color:var(--ink);background:#fffc}.nav-btn.ghost:hover:not(:disabled){border-color:#4f46e580;transform:translateY(-1px)}.nav-btn.primary{background:var(--signal);color:var(--paper);box-shadow:0 8px 18px #2f5cff29}.nav-btn.primary:hover:not(:disabled){background:var(--signal-strong)}.nav-btn:disabled{opacity:.45;cursor:not-allowed}.qr-preview{flex-direction:column;align-items:center;gap:16px;display:flex}.proof-card{border:1px solid var(--line);width:100%;box-shadow:var(--shadow);background:#ffffffe6;border-radius:22px;padding:24px 20px 20px;position:relative}.proof-label{color:var(--muted);margin-bottom:16px;font-size:11px;font-weight:700;display:block}.proof-body{justify-content:center;align-items:center;min-height:220px;display:flex}.qr-placeholder{color:var(--muted);text-align:center;max-width:200px;margin:0 auto;font-size:13px}.proof-data{border-top:1px dashed var(--line);color:var(--muted);word-break:break-all;margin-top:16px;padding-top:14px;font-family:Consolas,Menlo,Liberation Mono,monospace;font-size:11px;line-height:1.5;display:block}.download-btn{background:var(--signal);color:#fff;cursor:pointer;border:none;border-radius:999px;align-items:center;gap:8px;padding:12px 24px;font-size:13px;font-weight:700;transition:transform .15s,box-shadow .15s;display:inline-flex;box-shadow:0 8px 18px #2f5cff33}.download-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 20px #2f5cff33}.download-btn:disabled{opacity:.4;cursor:not-allowed}@media (width<=760px){.app-header{flex-direction:column;align-items:flex-start;gap:16px}.step-track{max-width:100%}.app-main{flex-direction:column;padding:24px}.preview-panel{width:100%;position:static}}@media (prefers-reduced-motion:reduce){.step-track-fill,.type-tile,.nav-btn,.download-btn{transition:none}}