.type-page{--tint-0:#e8efff;--tint-0-ink:#2448c9;--tint-1:#f1ebff;--tint-1-ink:#6d3fd6;--tint-2:#e3f6f5;--tint-2-ink:#0f766e;--tint-3:#fde8f3;--tint-3-ink:#b8297a;--tp-surface-soft:#fbfcfe}.type-page .tool__intro{column-gap:var(--space-16);grid-template-columns:56px minmax(0,1fr)}.type-page .tool__intro>:not(.tool__icon){grid-column:2}.type-page .tool__icon{border-radius:var(--radius-lg);background:var(--accent-wash);block-size:56px;inline-size:56px;color:var(--accent-strong);grid-area:2/1;align-self:center;place-items:center;display:grid}.type-page .tool__icon svg{block-size:28px;inline-size:28px}@media (width<=640px){.type-page .tool__intro{grid-template-columns:minmax(0,1fr)}.type-page .tool__intro>:not(.tool__icon){grid-column:1}.type-page .tool__icon{inline-size:var(--control-touch);block-size:var(--control-touch);grid-row:auto}}.type-page .tool-generator .generator__form{gap:var(--space-14)}.type-page .tool-card{gap:var(--space-14);padding:var(--space-16) var(--space-20);border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--canvas);grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));align-items:start;display:grid}.type-page .tool-card>*{min-width:0}.type-page .tool-card>:is(.tool-step,.tool__warning,.field__error,[data-warning],.field:has(textarea),.field:has(.generator__chips),.field:has(.field__pair),.tool-design){grid-column:1/-1}.type-page .tool-step{align-items:center;gap:var(--space-10);font-size:var(--text-body);font-weight:var(--weight-semibold);color:var(--ink);display:flex}.type-page .generator__preview>.tool-step{justify-self:start}.type-page .tool-step__n{inline-size:var(--space-24);block-size:var(--space-24);border-radius:var(--radius-full);background:var(--accent-fill);color:var(--canvas);font-size:var(--text-micro);font-weight:var(--weight-semibold);flex:none;place-items:center;display:grid}.type-page .tool-card .generator__chips{gap:var(--space-2);padding:var(--space-2);border-radius:var(--radius-sm);background:var(--surface-sunken);--focus-color:var(--focus-color-strong);flex-wrap:wrap;display:inline-flex}.type-page .tool-card .generator__chips>.chip{color:var(--ink-secondary);background:0 0;border-color:#0000}.type-page .tool-card .generator__chips>.chip[data-active]{background:var(--canvas);color:var(--ink);border-color:#0000}.type-page .tool-design__tabs{gap:var(--space-2);border-bottom:1px solid var(--border);flex-wrap:wrap;display:flex}.type-page .tool-design__tab{align-items:center;gap:var(--space-6);padding:var(--space-8) var(--space-10);color:var(--ink-secondary);font-size:var(--text-micro);font-weight:var(--weight-medium);white-space:nowrap;cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;margin-bottom:-1px;display:inline-flex}.type-page .tool-design__tab svg{block-size:16px;inline-size:16px}.type-page .tool-design__tab:hover{color:var(--ink)}.type-page .tool-design__tab[aria-selected=true]{border-bottom-color:var(--accent-fill);color:var(--accent-ink)}.type-page .tool-generator .generator__preview{gap:var(--space-12)}.type-page .generator--tool .qr-frame{border-bottom:0;border-end-end-radius:0;border-end-start-radius:0}.type-page .generator__preview .qrcg-readout{inline-size:100%;max-inline-size:var(--qr-preview);box-sizing:border-box;margin-top:calc(var(--space-12) * -1);padding:var(--space-8) var(--space-12);border:1px solid var(--border);border-top:1px dashed var(--border);background:var(--canvas);font-size:var(--text-mono-sm);color:var(--ink-muted);border-bottom:0;justify-content:center}.type-page .generator__preview .qrcg-badge-compact-row{inline-size:100%;max-inline-size:var(--qr-preview);box-sizing:border-box;margin-top:calc(var(--space-12) * -1);padding:var(--space-10) var(--space-12);border:1px solid var(--border);background:var(--tp-surface-soft);border-end-end-radius:var(--radius);border-end-start-radius:var(--radius);justify-content:flex-start;display:flex}.type-page .generator__preview .qrcg-badge-compact__more{margin-inline-start:auto}.type-page .generator__preview .qrcg-badge-compact-row:has(+.qrcg-badge-compact__decode:not(:empty)){border-end-end-radius:0;border-end-start-radius:0}.type-page .generator__preview .qrcg-badge-compact__decode{inline-size:100%;max-inline-size:var(--qr-preview);box-sizing:border-box;min-height:0;margin-top:calc(var(--space-12) * -1);padding:var(--space-8) var(--space-12);border:1px solid var(--border);background:var(--tp-surface-soft);font-size:var(--text-micro);text-align:start;border-top:0;border-end-end-radius:var(--radius);border-end-start-radius:var(--radius)}.type-page .generator__preview .qrcg-badge-compact__decode:empty{border:0;padding:0}.type-page .generator__preview .generator__downloads{inline-size:100%;max-inline-size:var(--qr-preview);gap:var(--space-6);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.type-page .generator__preview .btn--download{box-sizing:border-box;block-size:var(--control-md);padding-inline:var(--space-6);gap:var(--space-6);font-size:var(--text-micro)}.type-page .generator__preview .btn--download:first-child{block-size:var(--control-lg);font-size:var(--text-body-md);font-weight:var(--weight-semibold);grid-column:1/-1}.type-page .generator__preview .tool-print{inline-size:100%;max-inline-size:var(--qr-preview);box-sizing:border-box;border:1px solid var(--border);border-radius:var(--radius);background:var(--canvas)}.type-page .generator__preview>.generator__note{text-align:center;justify-self:center}.type-page .explainer{column-gap:var(--space-16);padding-block:var(--space-20);border-bottom:1px solid var(--border);grid-template-columns:40px minmax(0,1fr);margin-bottom:0;display:grid}.type-page .explainer:last-of-type{border-bottom:0}.type-page .explainer>:not(.explainer__n){grid-column:2}.type-page .explainer__n{border:1px solid var(--border);border-radius:var(--radius);background:var(--canvas);block-size:40px;inline-size:40px;color:var(--accent-strong);font-family:var(--font-mono);font-size:var(--text-micro);font-weight:var(--weight-semibold);grid-area:1/1/span 2;place-items:center;display:grid}.type-page .faq__q{justify-content:space-between;align-items:center;gap:var(--space-16);display:flex}.type-page .faq__q:after{content:"";float:none;border-inline-end:2px solid var(--ink-secondary);border-block-end:2px solid var(--ink-secondary);block-size:8px;inline-size:8px;transition:transform var(--dur) var(--ease);flex:none;transform:translateY(-2px)rotate(45deg)}.type-page .faq[open] .faq__q:after{content:"";transform:translateY(2px)rotate(-135deg)}.type-page .section--related .type-card__icon{border-radius:var(--radius);background:var(--tint-0);block-size:40px;inline-size:40px;color:var(--tint-0-ink);place-items:center;display:grid}.type-page .section--related .type-card:nth-child(4n+2) .type-card__icon{background:var(--tint-1);color:var(--tint-1-ink)}.type-page .section--related .type-card:nth-child(4n+3) .type-card__icon{background:var(--tint-2);color:var(--tint-2-ink)}.type-page .section--related .type-card:nth-child(4n+4) .type-card__icon{background:var(--tint-3);color:var(--tint-3-ink)}.type-page .section--related .type-card__needs{padding-top:var(--space-8);border-top:1px solid var(--border)}@media (prefers-reduced-motion:reduce){.type-page .faq__q:after{transition:none}}
