:root{color-scheme:dark;--background: #0f0f0f;--surface: #171717;--surface-raised: #212121;--border: #2b2b2b;--border-soft: #3a3a3a;--text: #ededed;--text-muted: #8c8c8c;--accent: #ededed;--error: #f0776a;--qr-size: 288px}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;background:var(--background);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5}.card{width:100%;max-width:680px;padding:32px;background:var(--surface);border:1px solid var(--border);border-radius:12px}.card__title{margin:0 0 24px;font-size:20px;font-weight:600;text-align:center}.footer__text{margin:0;font-size:13px;color:var(--text-muted);text-align:center}.footer__link{display:inline-block;padding:3px 12px;font-weight:500;color:var(--text);background:var(--surface-raised);border:1px solid var(--border-soft);border-radius:999px;text-decoration:none;transition:background-color .15s ease,border-color .15s ease}.footer__link:hover{background:var(--border);border-color:var(--text-muted)}.footer__link:active{transform:translateY(1px)}.footer__url{margin-left:2px}.form{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:40px}.controls{display:flex;flex-direction:column}.label{margin-bottom:8px;font-size:13px;color:var(--text-muted)}.input{width:100%;padding:12px 14px;font:inherit;color:var(--text);background:var(--surface-raised);border:1px solid var(--border);border-radius:8px}.select{width:100%;padding:10px 12px;font:inherit;color:var(--text);background:var(--surface-raised);border:1px solid var(--border);border-radius:8px;cursor:pointer}.error{margin:8px 0 0;font-size:13px;color:var(--error)}.colors{margin:16px 0 24px;display:grid;grid-template-columns:1fr 1fr;gap:16px}.color{display:flex;align-items:center;justify-content:space-between;gap:12px}.color__label{margin-bottom:0}.color__input{width:56px;height:32px;padding:2px;background:var(--surface);border:1px solid var(--border);border-radius:6px;cursor:pointer}.button{padding:12px 16px;font:inherit;font-weight:500;color:var(--surface);background:var(--accent);border:1px solid var(--accent);border-radius:8px;cursor:pointer}.button:hover{opacity:.9}.button--secondary{color:var(--text);background:var(--surface-raised);border-color:var(--border-soft)}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.logo{margin:0 0 24px}.logo__row{display:flex;align-items:center;gap:12px}.logo__preview{width:40px;height:40px;object-fit:cover;border:1px solid var(--border);border-radius:6px;background:var(--surface-raised)}.modal{position:fixed;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;padding:24px;background:#0009}.modal__panel{width:100%;max-width:340px;display:flex;flex-direction:column;gap:16px;padding:24px;background:var(--surface);border:1px solid var(--border);border-radius:12px}.modal__title{margin:0;font-size:16px;font-weight:600}.modal__hint{margin:-8px 0 0;font-size:13px;color:var(--text-muted)}.editor{position:relative;width:100%;max-width:240px;margin:0 auto;aspect-ratio:1;overflow:hidden;border:1px solid var(--border);border-radius:8px;background:var(--background);cursor:grab;touch-action:none}.editor:active{cursor:grabbing}.editor__image{position:absolute;top:0;left:0;max-width:none;transform-origin:0 0;user-select:none;-webkit-user-drag:none}.editor__zoom input{width:100%}.modal__actions{display:flex;justify-content:flex-end;gap:12px}.output{display:flex;flex-direction:column;align-items:center;gap:16px}.output__frame{width:var(--qr-size);height:var(--qr-size);border:1px dashed var(--border-soft);border-radius:8px;overflow:hidden}.output__canvas{display:block;width:100%;height:100%}.output__svg{width:100%;height:100%;display:block}.output__svg svg{width:100%;height:100%;display:block}.tabs{display:flex;gap:4px;margin-bottom:24px;padding:4px;background:var(--background);border:1px solid var(--border);border-radius:10px}.tab{flex:1;padding:10px 12px;font:inherit;font-weight:500;color:var(--text-muted);background:transparent;border:0;border-radius:8px;cursor:pointer}.tab:hover{color:var(--text)}.tab.is-active{color:var(--text);background:var(--surface-raised)}.maker{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:32px;align-items:start}.maker__form{display:flex;flex-direction:column;gap:14px}.field{display:flex;flex-direction:column}.field .label{margin-bottom:6px}.maker__preview{position:sticky;top:24px;display:flex;flex-direction:column;align-items:center;gap:16px}.maker__actions{display:flex;gap:12px;margin-top:8px}.maker__actions .button{flex:1}.output__frame--card{width:260px;height:260px}.biz-card-slot{width:100%;max-width:320px}.biz-card{position:relative;width:100%;aspect-ratio:1.6 / 1;display:flex;flex-direction:column;gap:10px;padding:18px;overflow:hidden;color:var(--card-fg, #ededed);background:var(--card-bg, #171717);border:1px solid color-mix(in srgb,var(--card-fg, #ededed) 16%,transparent);border-radius:14px}.biz-card__top{display:flex;align-items:center;gap:12px;min-width:0}.biz-card__photo{flex:0 0 auto;width:46px;height:46px;object-fit:cover;border-radius:50%;background:color-mix(in srgb,var(--card-fg, #ededed) 12%,transparent)}.biz-card__id{min-width:0}.biz-card__name{margin:0;font-size:18px;font-weight:600;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.biz-card__role{margin:2px 0 0;font-size:13px;opacity:.75;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.biz-card__desc{margin:0;font-size:13px;line-height:1.4;opacity:.85;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.biz-card__footer{display:flex;align-items:flex-end;gap:12px;min-width:0;margin-top:auto}.biz-card__links{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}.biz-card__links a{display:inline-block;padding:4px 10px;font-size:12px;color:inherit;text-decoration:none;background:color-mix(in srgb,var(--card-fg, #ededed) 12%,transparent);border-radius:999px}.biz-card__links a:hover{background:color-mix(in srgb,var(--card-fg, #ededed) 22%,transparent)}.biz-card__qr{flex:0 0 auto;width:64px;height:64px;margin-left:auto}.biz-card__qr svg{display:block;width:100%;height:100%}.view--viewer{display:flex;flex-direction:column;align-items:center;gap:24px}.view--viewer .biz-card-slot{max-width:400px}.viewer__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}@media(max-width:620px){.card{padding:24px}.form,.maker{grid-template-columns:minmax(0,1fr);gap:24px}.maker__preview{position:static;order:-1}}