.qg{--qg-card: #fff;--qg-field: #f4f5f7;--qg-on-ink: #fff;--qg-shadow: 0 1px 0 rgba(14, 15, 18, .06), 0 18px 40px -24px rgba(14, 15, 18, .35);--qg-ok: #16a34a;--qg-warn: #d99a06;--qg-bad: #dc2626;--qg-info: #8e97a6;min-width:0;color:var(--l-ink, #0e0f12);background:var(--qg-card);box-shadow:inset 0 0 0 1px var(--l-hair, rgba(14, 15, 18, .14)),var(--qg-shadow);border-radius:6px;padding:clamp(14px,2vw,26px)}[data-theme=dark] .qg{--qg-card: #16181e;--qg-field: #1e2129;--qg-on-ink: #111318;--qg-shadow: 0 18px 40px -24px rgba(0, 0, 0, .7)}.qg-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:clamp(14px,1.6vw,20px)}.qg-tab{font-family:inherit;font-weight:500;font-size:15px;line-height:1;color:var(--l-ink-2, #4b5059);background:transparent;cursor:pointer;border:0;border-radius:999px;padding:10px 15px;box-shadow:inset 0 0 0 1px var(--l-hair, rgba(14, 15, 18, .14));transition:background .15s,color .15s,box-shadow .15s}.qg-tab:hover{color:var(--l-ink);box-shadow:inset 0 0 0 1px var(--l-ink-3, #7c818b)}.qg-tab.on{background:var(--l-ink, #0e0f12);color:var(--qg-on-ink);box-shadow:none}.qg-tab:focus-visible,.qg-btn:focus-visible,.qg-tile:focus-visible,.qg-chip:focus-visible,.qg-mini:focus-visible,.qg-pair:focus-visible{outline:2px solid var(--l-blue, #2b3bff);outline-offset:2px}.qg-grid{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"input" "side" "style";gap:clamp(18px,2.2vw,30px)}.qg-input{grid-area:input;min-width:0;display:grid;gap:12px;align-content:start}.qg-side{grid-area:side;min-width:0;display:grid;gap:12px;align-content:start}.qg-style{grid-area:style;min-width:0;display:grid;gap:clamp(18px,2vw,24px);align-content:start}@media(min-width:860px){.qg-grid{grid-template-columns:minmax(0,1fr) clamp(300px,27vw,360px);grid-template-areas:"input side" "style side";grid-template-rows:auto 1fr}.qg-side{position:sticky;top:84px}.qg-prev{max-width:300px}}.qg-field{display:grid;gap:6px;min-width:0}.qg-lab,.qg-h{font:12.5px/1.2 var(--l-mono, "PT Mono", monospace);color:var(--l-ink-3, #7c818b);letter-spacing:.01em}.qg-h{display:block;margin-bottom:8px}.qg-in{width:100%;min-width:0;box-sizing:border-box;font-family:inherit;font-size:17px;line-height:1.35;color:var(--l-ink);background:var(--qg-field);border:0;border-radius:4px;padding:13px 14px;box-shadow:inset 0 0 0 1px transparent;transition:box-shadow .15s,background .15s}.qg-in::placeholder{color:var(--l-ink-3, #7c818b)}.qg-in:focus{outline:none;box-shadow:inset 0 0 0 2px var(--l-blue, #2b3bff);background:var(--qg-card)}.qg-in:disabled{opacity:.5}.qg-area{resize:vertical;min-height:104px}.qg-hint{font-size:14px;line-height:1.45;color:var(--l-ink-3, #7c818b)}.qg-row2{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}@media(min-width:560px){.qg-row2{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}.qg-seg{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.qg-chip,.qg-mini{font-family:inherit;font-weight:500;font-size:14px;line-height:1;color:var(--l-ink);background:transparent;cursor:pointer;border:0;border-radius:999px;padding:9px 13px;box-shadow:inset 0 0 0 1px var(--l-hair, rgba(14, 15, 18, .14))}.qg-chip.on{background:var(--l-ink);color:var(--qg-on-ink);box-shadow:none}.qg-mini:hover,.qg-chip:hover:not(.on){box-shadow:inset 0 0 0 1px var(--l-ink-3, #7c818b)}.qg-mini:disabled{opacity:.5;cursor:default}.qg-check{display:inline-flex;align-items:center;gap:8px;font-size:15px;color:var(--l-ink-2);cursor:pointer;padding:6px 2px}.qg-check input{width:17px;height:17px;accent-color:var(--l-blue, #2b3bff);margin:0}.qg-prev{position:relative;aspect-ratio:1;width:100%;max-width:380px;justify-self:center;border-radius:4px;overflow:hidden;background:#fff;box-shadow:inset 0 0 0 1px var(--l-hair, rgba(14, 15, 18, .14))}.qg-prev.clear{background:repeating-conic-gradient(#e9ebef 0 25%,#fff 0 50%) 0 0 / 18px 18px}.qg-code{display:block;width:100%;height:100%;object-fit:contain;image-rendering:auto}.qg-prev.demo .qg-code{opacity:.28;filter:grayscale(1)}.qg-demo-tag{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:8px 12px;border-radius:2px;background:#fff;color:#0e0f12;font:12.5px/1 var(--l-mono, monospace);box-shadow:0 6px 18px -8px #0e0f1273}.qg-pay{margin:0;font-size:14px;line-height:1.45;color:var(--l-ink-2);overflow-wrap:anywhere}.qg-pay b{font:500 13px/1.45 var(--l-mono, monospace);color:var(--l-ink)}.qg-lamp{display:inline-block;flex:none;width:10px;height:10px;border-radius:50%;background:var(--qg-info);margin-top:6px}.qg-lamp.ok{background:var(--qg-ok)}.qg-lamp.warn{background:var(--qg-warn)}.qg-lamp.bad{background:var(--qg-bad)}.qg-verdict{display:flex;gap:9px;align-items:flex-start;font-size:15px;line-height:1.45;color:var(--l-ink-2)}.qg-verdict b{color:var(--l-ink);font-weight:600}.qg-issues{list-style:none;margin:0;padding:0;display:grid;gap:8px}.qg-issues li{display:flex;gap:9px;padding:10px 12px;border-radius:4px;background:var(--qg-field)}.qg-issues li>div{min-width:0}.qg-issues b{display:block;font-size:14.5px;font-weight:600;line-height:1.35}.qg-issues p{margin:2px 0 0;font-size:14px;line-height:1.45;color:var(--l-ink-2)}.qg-issues .qg-mini{margin-top:8px;padding:7px 11px;font-size:13.5px}.qg-ok{display:flex;gap:9px;margin:0;font-size:14px;line-height:1.45;color:var(--l-ink-2)}.qg-err{margin:0;font-size:14px;color:var(--qg-bad)}.qg-dl{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.qg-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 20px;font-family:inherit;font-weight:600;font-size:15.5px;line-height:1;color:var(--qg-on-ink);background:var(--l-ink);border:0;border-radius:999px;cursor:pointer;transition:background .2s,color .2s,transform .3s var(--l-ease, ease)}.qg-btn:hover:not(:disabled){background:var(--l-blue, #2b3bff);color:#fff;transform:translateY(-1px)}.qg-btn:disabled{opacity:.4;cursor:default}.qg-btn.ghost{background:transparent;color:var(--l-ink);box-shadow:inset 0 0 0 1.5px var(--l-ink)}.qg-btn.ghost:hover:not(:disabled){background:var(--l-ink);color:var(--qg-on-ink)}.qg-btn.wide{width:100%}.qg-btn.accent{background:var(--l-blue, #2b3bff);color:#fff}.qg-btn.accent:hover{background:var(--l-ink);color:var(--qg-on-ink)}.qg-dl .qg-btn:first-child{flex:1 1 140px}.qg-size{display:inline-flex;align-items:center;gap:6px;font:12.5px/1 var(--l-mono, monospace);color:var(--l-ink-3)}.qg-sel{font-family:inherit;font-weight:500;font-size:14px;line-height:1;color:var(--l-ink);background:var(--qg-field);border:0;border-radius:4px;padding:9px 8px;cursor:pointer}.qg-print{display:grid;gap:8px;margin-top:6px;padding-top:16px;border-top:1px solid var(--l-hair, rgba(14, 15, 18, .14))}.qg-print span{font-size:14px;line-height:1.45;color:var(--l-ink-3);text-align:center}.qg-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}@media(min-width:560px){.qg-tiles{grid-template-columns:repeat(6,minmax(0,1fr))}}.qg-tile{display:grid;justify-items:center;gap:6px;padding:8px 4px 9px;min-width:0;cursor:pointer;background:transparent;color:var(--l-ink-2);border:0;border-radius:4px;box-shadow:inset 0 0 0 1px var(--l-hair, rgba(14, 15, 18, .14));font-family:inherit;font-size:13px;line-height:1.15;transition:box-shadow .15s,color .15s}.qg-tile img,.qg-tile-img{width:56px;height:56px;display:block;border-radius:2px}.qg-tile-img{background:var(--qg-field)}.qg-tile span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.qg-tile:hover{box-shadow:inset 0 0 0 1px var(--l-ink-3);color:var(--l-ink)}.qg-tile.on{box-shadow:inset 0 0 0 2px var(--l-blue, #2b3bff);color:var(--l-ink)}.qg-pairs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}.qg-pair{position:relative;width:40px;height:40px;border-radius:50%;border:0;cursor:pointer;overflow:hidden;box-shadow:inset 0 0 0 1px #0e0f122e}.qg-pair:after{content:"";position:absolute;inset:9px;border-radius:3px;background:var(--qg-ink)}.qg-pair.on{box-shadow:0 0 0 2px var(--qg-card),0 0 0 4px var(--l-blue, #2b3bff)}.qg-contrast{display:flex;gap:9px;margin:10px 0 0;font-size:14.5px;line-height:1.45;color:var(--l-ink-2)}.qg-sw-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px}.qg-sw,.qg-sw-pick{width:32px;height:32px;flex:none;padding:0;border:0;border-radius:50%;cursor:pointer;box-shadow:inset 0 0 0 1px #0e0f122e;transition:transform .12s,box-shadow .12s}.qg-sw:hover,.qg-sw-pick:hover{transform:translateY(-1.5px)}.qg-sw.on,.qg-sw-pick.on{transform:none;box-shadow:0 0 0 2px var(--qg-card),0 0 0 4px var(--l-blue, #2b3bff)}.qg-sw-pick{padding:3px;background:conic-gradient(#f43f5e,#f59e0b,#84cc16,#06b6d4,#6366f1,#d946ef,#f43f5e)}.qg-sw-pick::-webkit-color-swatch-wrapper{padding:0}.qg-sw-pick::-webkit-color-swatch{border:0;border-radius:50%;box-shadow:inset 0 0 0 1px #0e0f1226}.qg-sw-pick::-moz-color-swatch{border:0;border-radius:50%}.qg-sw:focus-visible,.qg-sw-pick:focus-visible{outline:2px solid var(--l-blue, #2b3bff);outline-offset:3px}.qg-chip-dot{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:7px;vertical-align:-1px;box-shadow:inset 0 0 0 1px #0e0f1240}.qg-gap{display:flex;margin-top:12px}.qg-group>.qg-pairs+.qg-seg{margin-top:2px}.qg-group>.qg-sw-row+.qg-val,.qg-group>.qg-gap+.qg-val{margin-top:16px}.qg-logo{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:8px}.qg-logo-img{width:44px;height:44px;object-fit:contain;border-radius:4px;background:#fff;box-shadow:inset 0 0 0 1px var(--l-hair)}.qg-val{display:flex;justify-content:space-between;font:12.5px/1.2 var(--l-mono, monospace);color:var(--l-ink-3);margin:6px 0 4px}.qg-range{width:100%;margin:0;accent-color:var(--l-blue, #2b3bff)}.qg-zone{display:flex;height:4px;border-radius:2px;overflow:hidden;margin:4px 0 3px}.qg-zone i{flex:1}.qg-zone i:nth-child(1){background:var(--qg-ok)}.qg-zone i:nth-child(2){background:var(--qg-warn)}.qg-zone i:nth-child(3){background:var(--qg-bad)}.qg-zone-t{display:flex;justify-content:space-between;font:11.5px/1.2 var(--l-mono, monospace);color:var(--l-ink-3);margin-bottom:10px}@media(prefers-reduced-motion:reduce){.qg-btn,.qg-tab,.qg-tile,.qg-in{transition:none}}@media print{.qg-tabs,.qg-input,.qg-style,.qg-dl,.qg-print{display:none}}