:root{color-scheme:light;--bg: #ffffff;--surface: #ffffff;--line: #e5e7eb;--line-strong: #d1d5db;--text: #111111;--muted: #a3a3a3;--accent: #2d6cdf;--accent-strong: #2158be;--shadow: 0 10px 28px rgba(0, 0, 0, .06);--radius: 12px;--radius-sm: 8px;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{background:var(--bg);color:var(--text)}button,input,textarea{font:inherit}button{border:0;background:none;cursor:pointer}img{display:block;max-width:100%}.page{min-height:100vh;display:flex;flex-direction:column}.login-page{min-height:100vh;display:grid;place-items:center;background:#f5f7fb;padding:24px}.login-card{width:min(100%,360px);background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:24px;display:grid;gap:14px}.login-card h1{margin:0;font-size:22px}.login-card p{margin:0;color:var(--muted)}.login-card input{width:100%;border:1px solid var(--line);border-radius:10px;background:#fff;padding:12px 14px}.login-card .primary-button{width:100%}.login-error{color:#b42318;background:#fff5f5;border:1px solid #fda29b;border-radius:10px;padding:10px 12px;font-size:13px}.page-title{position:sticky;top:0;z-index:2;display:grid;place-items:center;min-height:70px;background:#f6f6f6;border-bottom:1px solid rgba(0,0,0,.04);box-shadow:0 1px #00000005}.page-title h1{margin:0;font-size:28px;line-height:1.1;letter-spacing:0;font-weight:800}.page-body{width:min(100%,520px);margin:0 auto;padding:22px 16px 28px;display:grid;gap:18px}.preview-card-shell{background:var(--surface);border-radius:20px;box-shadow:0 2px 8px #0000000d;padding:28px 18px 18px}.preview-top{display:flex;justify-content:flex-start;margin-bottom:28px}.name-row{display:inline-flex;align-items:center;gap:14px}.sticker{width:30px;height:30px;border-radius:8px;background:linear-gradient(180deg,#f9c96b,#efac3c);position:relative;box-shadow:inset 0 0 0 1px #0000001f}.sticker:before{content:"";position:absolute;right:-6px;top:10px;width:14px;height:1.6px;background:#787878;box-shadow:0 4px #787878;transform:rotate(8deg)}.sticker span{position:absolute;left:7px;top:6px;width:12px;height:16px;border:1.5px solid rgba(0,0,0,.25);border-radius:2px;transform:rotate(-10deg)}.name-text{font-size:20px;font-weight:700;letter-spacing:0}.qr-stage{display:grid;place-items:center;padding:6px 0 18px}.image-wrap{width:min(100%,410px);aspect-ratio:4 / 5;border-radius:18px;overflow:hidden;background:#f3f4f6;border:1px solid rgba(0,0,0,.06)}.image-wrap img{width:100%;height:100%;object-fit:cover}.empty-image-wrap{display:grid;place-items:center;background:linear-gradient(180deg,#fafafa,#f3f4f6)}.empty-image-state{color:var(--muted);font-size:15px;letter-spacing:.02em}.tip-text{margin:4px 0 24px;text-align:center;color:#b9b9b9;font-size:15px;line-height:1.8}.footer-link{margin:0 0 24px;text-align:center;color:var(--accent);font-size:14px;line-height:1.7}.config-panel{background:var(--surface);border-radius:16px;box-shadow:0 2px 8px #0000000d;padding:16px}.toolbar-row{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}.ghost-button,.primary-button,.tiny{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 14px;border-radius:10px;border:1px solid var(--line);background:#fff;color:#111}.ghost-button:hover,.tiny:hover{border-color:var(--line-strong);background:#fafafa}.primary-button{border-color:var(--accent);background:var(--accent);color:#fff}.primary-button:hover{background:var(--accent-strong)}.tiny{min-height:32px;padding:0 10px}.status-line{display:flex;align-items:center;gap:12px;padding:8px 0 10px;color:var(--muted);border-bottom:1px solid var(--line);margin-bottom:14px}.status-line strong{color:var(--text);font-size:13px}.test-result{margin:0 0 14px;padding:10px 12px;border-radius:10px;background:#f8fafc;border:1px solid var(--line);color:#111;font-size:13px;line-height:1.6;word-break:break-all}.editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:0}.loading-state{min-height:180px;grid-column:1 / -1;display:grid;place-items:center;border:1px dashed var(--line);border-radius:12px;color:var(--muted);background:#fafafa}.field{display:grid;gap:8px}.field-wide{grid-column:1 / -1}.field span{font-size:13px}.field input,.field textarea{width:100%;border:1px solid var(--line);border-radius:10px;background:#fff;padding:11px 12px;color:var(--text);outline:none}.field input:focus,.field textarea:focus{border-color:#2d6cdf73;box-shadow:0 0 0 3px #2d6cdf14}.field textarea{resize:vertical;min-height:90px}.file-input{width:100%;padding:10px 0 2px;border:0;background:transparent}.upload-actions{display:flex;justify-content:flex-start;margin-top:6px}.field-inline{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fafafa}.switch-inline{position:relative;display:inline-flex;align-items:center}.switch-inline input{position:absolute;opacity:0;pointer-events:none}.switch-inline span{width:40px;height:22px;border-radius:999px;background:#cbd5e1;position:relative;transition:.18s ease}.switch-inline span:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:.18s ease}.switch-inline input:checked+span{background:var(--accent)}.switch-inline input:checked+span:after{transform:translate(18px)}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 720px){.page-title h1{font-size:24px}.page-body{padding:16px 12px 20px}.preview-card-shell{padding:20px 14px 16px}.name-text{font-size:18px}.qr-center{width:68px;height:68px}.editor-grid,.toolbar-row{display:flex;flex-direction:column}.toolbar-row>button{width:100%}}
