:root{--bg-page:#fafafa;--bg-panel:#fff;--bg-input:#fff;--border-color:#ddd;--border-hover:#b0b0b0;--text-main:#111827;--text-sub:#4b5563;--text-muted:#6b7280;--accent-color:#2563eb;--accent-hover:#1d4ed8;--color-error:#dc2626;--color-warning:#d97706;--color-success:#16a34a;--radius-base:4px;--font-family:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono:ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace}[data-theme=dark]{--bg-page:#1e1e1e;--bg-panel:#262626;--bg-input:#1a1a1a;--border-color:#383838;--border-hover:#525252;--text-main:#f3f4f6;--text-sub:#9ca3af;--text-muted:#6b7280;--accent-color:#2563eb;--accent-hover:#3b82f6;--color-error:#ef4444;--color-warning:#f59e0b;--color-success:#22c55e}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--bg-page);color:var(--text-main);-webkit-font-smoothing:antialiased;line-height:1.4}:focus-visible{outline:2px solid var(--accent-color);outline-offset:1px}.app-root{background-color:var(--bg-page);min-height:100vh;color:var(--text-main)}.app-container{width:100%;max-width:960px;margin:0 auto;padding:24px 16px 48px}.app-header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;display:flex}.header-title{color:var(--text-main);font-size:1.25rem;font-weight:700}.header-subtitle{color:var(--text-sub);margin-top:2px;font-size:.875rem}.btn-theme-toggle{background:var(--bg-panel);border:1px solid var(--border-color);border-radius:var(--radius-base);color:var(--text-main);cursor:pointer;padding:6px 12px;font-family:inherit;font-size:.8125rem}.btn-theme-toggle:hover{border-color:var(--border-hover)}.app-grid{grid-template-columns:1fr;gap:24px;display:grid}@media (width>=768px){.app-grid{grid-template-columns:1.1fr .9fr}.sticky-preview{align-self:start;position:sticky;top:24px}}.column-editor,.column-preview{flex-direction:column;gap:16px;display:flex}.card-panel{background:var(--bg-panel);border:1px solid var(--border-color);border-radius:var(--radius-base);padding:16px}.section-title{color:var(--text-main);font-size:.9375rem;font-weight:600}.section-divider{border:0;border-top:1px solid var(--border-color);margin:12px 0}.type-selector{border-bottom:1px solid var(--border-color);margin-bottom:12px}.type-tabs{gap:16px;display:flex;overflow-x:auto}.tab-button{color:var(--text-sub);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-bottom:2px solid #0000;padding:6px 2px;font-family:inherit;font-size:.875rem;font-weight:500}.tab-button:hover{color:var(--text-main)}.tab-button.active{color:var(--accent-color);border-bottom-color:var(--accent-color);font-weight:600}.form-inputs-container{flex-direction:column;gap:12px;display:flex}.input-group{flex-direction:column;gap:4px;display:flex}.input-label{color:var(--text-main);font-size:.875rem;font-weight:500}.text-input,.select-input{background:var(--bg-input);border:1px solid var(--border-color);border-radius:var(--radius-base);width:100%;color:var(--text-main);outline:none;padding:8px 10px;font-family:inherit;font-size:.875rem}.text-input.has-error{border-color:var(--color-error)}.textarea-input{resize:vertical;min-height:80px}.field-error-msg{color:var(--color-error);margin-top:2px;font-size:.8125rem}.field-hint{color:var(--text-muted);font-size:.78125rem}.grid-2col{grid-template-columns:1fr 1fr;gap:10px;display:grid}@media (width<=480px){.grid-2col{grid-template-columns:1fr}}.checkbox-group{margin-top:4px}.checkbox-label{color:var(--text-main);cursor:pointer;align-items:center;gap:8px;font-size:.875rem;display:flex}.checkbox-custom{width:16px;height:16px;accent-color:var(--accent-color);cursor:pointer}.designer-controls-container{flex-direction:column;gap:12px;display:flex}.controls-block{flex-direction:column;gap:6px;display:flex}.flex-between{justify-content:space-between;align-items:center;display:flex}.btn-text-action{color:var(--accent-color);cursor:pointer;background:0 0;border:none;padding:0;font-size:.8125rem}.btn-text-action:hover{text-decoration:underline}.btn-text-action.danger{color:var(--color-error)}.presets-dots-row{align-items:center;gap:8px;display:flex}.preset-dot{border:1px solid var(--border-color);cursor:pointer;background:0 0;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;padding:0;transition:transform .15s;display:flex}.preset-dot:hover{transform:scale(1.1)}.preset-dot.selected{outline:2px solid var(--accent-color);outline-offset:2px}.preset-dot-inner{border-radius:50%;width:14px;height:14px}.margin-top-sm{margin-top:8px}.margin-top-xs,.custom-preset-row{margin-top:6px}.custom-preset-name-row{align-items:center;gap:6px;display:flex}.custom-preset-name-input{flex:1;padding:4px 8px;font-size:.8rem}.custom-preset-chips{flex-wrap:wrap;gap:6px;margin-top:6px;display:flex}.custom-preset-chip{background:var(--bg-page);border:1px solid var(--border-color);border-radius:var(--radius-base);color:var(--text-sub);align-items:center;gap:5px;padding:2px 6px;font-size:.78rem;display:inline-flex}.chip-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px;display:inline-block}.chip-delete{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:0 2px;font-size:.85rem;line-height:1}.color-picker-group{flex-direction:column;gap:4px;display:flex}.color-label{color:var(--text-sub);font-size:.78125rem}.color-input-wrapper{background:var(--bg-input);border:1px solid var(--border-color);border-radius:var(--radius-base);align-items:center;gap:6px;padding:2px 6px;display:flex}.color-picker{-webkit-appearance:none;cursor:pointer;background:0 0;border:none;border-radius:3px;width:24px;height:24px}.color-picker::-webkit-color-swatch-wrapper{padding:0}.color-picker::-webkit-color-swatch{border:1px solid #ccc;border-radius:3px}.hex-text-input{color:var(--text-main);background:0 0;border:none;outline:none;width:100%;font-size:.8125rem}.input-with-unit{align-items:center;gap:4px;display:flex}.number-input{border:1px solid var(--border-color);border-radius:var(--radius-base);background:var(--bg-input);width:58px;color:var(--text-main);outline:none;padding:2px 6px;font-size:.8125rem}.unit-label{color:var(--text-sub);font-size:.78125rem}.range-slider{width:100%;height:4px;accent-color:var(--accent-color);cursor:pointer}.preview-container{flex-direction:column;gap:16px;display:flex}.canvas-wrapper-direct{justify-content:center;align-items:center;width:100%;display:flex}.qr-canvas-direct{border:1px solid var(--border-color);border-radius:var(--radius-base);background:#fff}.canvas-hidden{display:none}.dashed-placeholder{border:1px dashed var(--border-color);border-radius:var(--radius-base);text-align:center;justify-content:center;align-items:center;width:100%;min-height:200px;padding:24px;display:flex}.placeholder-text{color:var(--text-muted);font-size:.875rem}.canvas-error{text-align:center;border:1px solid var(--color-error);border-radius:var(--radius-base);padding:24px}.error-title{color:var(--color-error);font-size:.875rem;font-weight:600}.error-detail{color:var(--text-sub);font-size:.8125rem}.button-row{flex-wrap:wrap;gap:8px;display:flex}.btn-primary{background:var(--accent-color);border:1px solid var(--accent-color);border-radius:var(--radius-base);color:#fff;cursor:pointer;white-space:nowrap;padding:8px 16px;font-size:.875rem;font-weight:600}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:var(--bg-panel);border:1px solid var(--border-color);border-radius:var(--radius-base);color:var(--text-main);cursor:pointer;white-space:nowrap;padding:8px 14px;font-size:.875rem}.btn-secondary:hover:not(:disabled){border-color:var(--border-hover)}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.warnings-container{flex-direction:column;gap:6px;display:flex}.warnings-title{color:var(--text-main);font-size:.875rem;font-weight:600}.warnings-list{flex-direction:column;gap:4px;display:flex}.warning-line{align-items:flex-start;gap:6px;font-size:.8125rem;display:flex}.dot-mark{font-weight:700}.warning-line.type-error .dot-mark,.warning-line.type-error .warning-text{color:var(--color-error)}.warning-line.type-warning .dot-mark,.warning-line.type-warning .warning-text{color:var(--color-warning)}.no-problems-text{color:var(--text-muted);font-size:.8125rem}.app-footer-recent{border-top:1px solid var(--border-color);margin-top:32px;padding-top:16px}.recent-section{flex-direction:column;gap:12px;display:flex}.margin-bottom-sm{margin-bottom:8px}.recent-horizontal-list{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.recent-inline-item{background:0 0;align-items:center;gap:8px;display:flex}.recent-thumb-plain{border:1px solid var(--border-color);border-radius:var(--radius-base);cursor:pointer;background:#fff;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex;overflow:hidden}.recent-img{object-fit:contain;width:100%;height:100%}.recent-fallback{color:var(--text-muted);font-size:.6875rem}.recent-meta{flex-direction:column;display:flex}.recent-type-label{color:var(--text-main);font-size:.78125rem;font-weight:600}.recent-snippet{color:var(--text-sub);white-space:nowrap;text-overflow:ellipsis;max-width:150px;font-size:.71875rem;overflow:hidden}.recent-time-rel{color:var(--text-muted);font-size:.6875rem}.btn-icon-delete{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:0 4px;font-size:1rem}.btn-icon-delete:hover{color:var(--color-error)}.empty-text{color:var(--text-muted);font-size:.8125rem}.toast-container{border-radius:var(--radius-base);background:var(--bg-panel);border:1px solid var(--border-color);z-index:9999;align-items:center;gap:8px;padding:8px 14px;display:flex;position:fixed;bottom:16px;right:16px;box-shadow:0 2px 8px #0000001a}.toast-text{color:var(--text-main);font-size:.8125rem}.toast-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:1rem}@media (width<=375px){.app-container{padding:12px 10px 32px}.button-row{flex-direction:column}.btn-primary,.btn-secondary{text-align:center;width:100%}.recent-horizontal-list{gap:12px}}.intro-overlay{background-color:var(--bg-page);color:var(--text-main);z-index:99999;cursor:pointer;opacity:1;flex-direction:column;justify-content:center;align-items:center;padding:24px;transition:opacity .5s;display:flex;position:fixed;inset:0}.intro-overlay.fade-out{opacity:0;pointer-events:none}.intro-content{text-align:center;width:100%;max-width:620px}.intro-title{color:var(--text-main);margin-bottom:12px;font-size:2rem;font-weight:700;line-height:1.25}.intro-subtitle{color:var(--text-sub);font-size:1.125rem;line-height:1.4}.intro-cursor{color:var(--accent-color);margin-left:2px;font-weight:400;animation:.8s infinite cursorBlink;display:inline-block}@keyframes cursorBlink{0%,to{opacity:1}50%{opacity:0}}.intro-skip-btn{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-base);background:0 0;border:none;padding:6px 12px;font-size:.875rem;position:absolute;bottom:24px;right:24px}.intro-skip-btn:hover{color:var(--text-main)}@media (width<=375px){.intro-title{font-size:1.5rem}.intro-subtitle{font-size:.9375rem}.intro-skip-btn{bottom:16px;right:16px}}