.ptn{--ptn-height: max(32rem, calc(100dvh - var(--dsn-sticky-top, 1rem) - 1rem));scroll-margin-top:calc(var(--dsn-sticky-top, 0px) + .5rem)}@media(min-width:992px){.ptn .dsn-body{grid-template-columns:minmax(27rem,31rem) minmax(0,1fr)}}.ptn [hidden]{display:none!important}.ptn-side{min-width:0}.ptn-rail{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-bottom:1px solid var(--dsn-line)}.ptn-rail-tab{display:flex;flex-direction:column;align-items:center;gap:.2rem;min-width:0;padding:.55rem .15rem;border:0;background:transparent;color:var(--dsn-muted);font-size:.72rem;font-weight:600;line-height:1.15;overflow-wrap:anywhere}.ptn-rail-tab i{font-size:1.15rem}.ptn-rail-tab:hover{color:var(--bs-body-color)}.ptn-rail-tab.is-on{background:var(--dsn-accent-soft);color:var(--dsn-accent)}.ptn-rail-tab:focus-visible{outline:2px solid var(--dsn-accent);outline-offset:-2px}@media(min-width:992px){.ptn-side{position:sticky;top:var(--dsn-sticky-top, 1rem);display:grid;grid-template-columns:4.75rem minmax(0,1fr);align-self:start;height:var(--ptn-height)}[dir=ltr] .ptn-side{border-right:1px solid var(--dsn-line)}[dir=rtl] .ptn-side{border-left:1px solid var(--dsn-line)}.ptn-rail{grid-template-columns:minmax(0,1fr);align-content:start;border-bottom:0}[dir=ltr] .ptn-rail{border-right:1px solid var(--dsn-line)}[dir=rtl] .ptn-rail{border-left:1px solid var(--dsn-line)}.ptn-rail-tab{padding-block:.8rem}.ptn-panels{min-height:0;overflow-y:auto}[dir=ltr] .ptn-panels{border-right:0}[dir=rtl] .ptn-panels{border-left:0}#ptn-panel-pick{display:flex;flex-direction:column;height:100%;border-bottom:0}.ptn .ptn-scroller{flex:1;min-height:10rem;height:auto}.ptn .dsn-stage{height:var(--ptn-height)}.ptn .ptn-canvas{flex:1;min-height:0;height:auto}}.ptn-browse-tools{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem;margin-bottom:.65rem}.ptn-browse-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:center;gap:.4rem;margin:.55rem 0}.ptn-browse-row .form-select{min-width:0;padding-inline:.5rem 1.6rem;font-size:.82rem}[dir=ltr] .ptn-browse-row .form-select{background-position:right .4rem center}[dir=rtl] .ptn-browse-row .form-select{background-position:left .4rem center}@media(max-width:575.98px){.ptn-browse-row{grid-template-columns:repeat(2,minmax(0,1fr))}.ptn-browse-row .dsn-chip{grid-column:1/-1;justify-self:start}}.ptn .dsn-chips{margin-top:0;gap:.3rem}.ptn .dsn-chip{padding:.22rem .6rem;font-size:.78rem;text-decoration:none}.ptn .dsn-chip.is-on{border-color:var(--dsn-accent);background:var(--dsn-accent-soft);color:var(--dsn-accent)}.ptn-count{margin:0 0 .4rem;color:var(--dsn-muted);font-size:.8rem}.ptn-scroller{height:22rem;overflow-y:auto;overscroll-behavior:contain;border:1px solid var(--dsn-line);border-radius:.6rem;background:var(--dsn-line)}.ptn-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr));gap:1px}.ptn-swatch{aspect-ratio:1;padding:0;border:0;background-color:var(--bs-body-bg);background-repeat:repeat;cursor:pointer}.ptn-swatch:hover{outline:2px solid var(--dsn-accent);outline-offset:-2px}.ptn-swatch:focus-visible,.ptn-swatch[aria-pressed=true]{position:relative;outline:3px solid var(--dsn-accent);outline-offset:-3px;box-shadow:inset 0 0 0 4px var(--bs-body-bg)}.ptn-sentinel{height:1px}.ptn-empty{padding:2rem 1rem;background:var(--bs-body-bg);color:var(--dsn-muted);font-size:.875rem;text-align:center}.ptn-colors{display:grid;grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:.5rem;margin:.6rem 0}.ptn-color{display:flex;align-items:center;gap:.4rem;min-width:0}.ptn-color input[type=color]{flex:0 0 auto;width:2.2rem;height:2.2rem;padding:0;border:1px solid var(--dsn-line);border-radius:.5rem;background:none;cursor:pointer}.ptn-color input[type=color]::-webkit-color-swatch-wrapper{padding:2px}.ptn-color input[type=color]::-webkit-color-swatch{border:0;border-radius:.35rem}.ptn-color input[type=color]::-moz-color-swatch{border:0;border-radius:.35rem}.ptn-color input[type=text]{min-width:0;padding:.25rem .4rem;font-family:var(--bs-font-monospace);font-size:.8rem}.ptn-palettes{display:grid;grid-template-columns:repeat(auto-fill,minmax(3.25rem,1fr));gap:.3rem;margin-top:.6rem}.ptn-palette{display:flex;height:1.5rem;padding:0;overflow:hidden;border:1px solid var(--dsn-line);border-radius:.35rem;background:none}.ptn-palette span{flex:1}.ptn-palette:hover,.ptn-palette:focus-visible{outline:2px solid var(--dsn-accent);outline-offset:1px}.ptn-actions{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.6rem}.ptn-slider-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.45rem;align-items:end}.ptn-slider-row .dsn-slider{margin-top:.6rem}.ptn-lock{display:inline-flex;align-items:center;justify-content:center;width:1.6rem;height:1.6rem;margin-bottom:.15rem;padding:0;border:1px solid var(--dsn-line);border-radius:.4rem;background:none;color:var(--dsn-muted);font-size:.75rem}.ptn-lock[aria-pressed=true]{border-color:var(--dsn-accent);background:var(--dsn-accent-soft);color:var(--dsn-accent)}.ptn-title{min-width:0}.ptn-title strong{display:block;font-size:1rem;line-height:1.2}.ptn-title span{color:var(--dsn-muted);font-size:.78rem}.ptn .dsn-stage-bar,.ptn .dsn-stage-actions{flex-wrap:wrap}.ptn-canvas{position:relative;height:clamp(18rem,52vh,34rem);overflow:hidden;border:1px solid var(--dsn-line);border-radius:var(--dsn-radius)}.ptn-canvas.is-transparent{background-image:conic-gradient(#ccc 25%,#fff 0 50%,#ccc 0 75%,#fff 0);background-size:18px 18px}.ptn-canvas:fullscreen{height:100vh;border:0;border-radius:0}.ptn-canvas svg{display:block}.ptn-art,.ptn-overlay{position:absolute;inset:0}.ptn-overlay{pointer-events:none}.ptn-canvas-tools{position:absolute;bottom:.6rem;display:flex;align-items:center;gap:.4rem}[dir=ltr] .ptn-canvas-tools{right:.6rem}[dir=rtl] .ptn-canvas-tools{left:.6rem}.ptn-tile-size,.ptn-fullscreen{padding:.2rem .55rem;border:0;border-radius:999px;background:#000000ad;color:#fff;font-size:.75rem;font-variant-numeric:tabular-nums}.ptn-fullscreen{padding-block:.25rem}.ptn-mock-web,.ptn-mock-text{display:none}.ptn-canvas[data-mode=web] .ptn-mock-web{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem}.ptn-mock-card{max-width:26rem;padding:1.5rem 1.75rem;border-radius:.9rem;background:#fff;box-shadow:0 18px 50px #00000047;color:#16181d;text-align:center}.ptn-mock-card h4{margin:0 0 .35rem;color:inherit;font-size:1.35rem;font-weight:700}.ptn-mock-card p{margin:0 0 .9rem;color:#555b66;font-size:.9rem}.ptn-mock-card span{display:inline-block;padding:.4rem 1.1rem;border-radius:999px;background:#16181d;color:#fff;font-size:.85rem;font-weight:600}.ptn-canvas[data-mode=text]{background:var(--ptn-text-bg, var(--bs-body-bg))}.ptn-canvas[data-mode=text] .ptn-art{display:none}.ptn-canvas[data-mode=text] .ptn-mock-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:1rem;background-clip:text;color:transparent;font-size:clamp(3.5rem,11vw,9rem);font-weight:900;line-height:1;letter-spacing:-.03em;text-align:center;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.ptn-export{padding-top:.25rem}.ptn-export .dsn-toggle{flex-wrap:wrap;border-radius:.9rem}.ptn-export-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.5rem}.ptn-code{max-height:9rem;margin:0;overflow:auto;font-size:.75rem;white-space:pre-wrap;word-break:break-all}.ptn-weight{color:var(--dsn-muted);font-size:.78rem;font-variant-numeric:tabular-nums}.ptn-downloads{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin-top:.65rem}.ptn-downloads .form-select{width:auto;max-width:12rem;font-size:.82rem}.ptn-downloads input[type=number]{width:5rem;padding-inline:.4rem;font-size:.82rem;text-align:center}.ptn-times{color:var(--dsn-muted)}.ptn-library-title{margin:1.5rem 0 .35rem;font-size:1.2rem;font-weight:700}.ptn-library-hint{margin:0 0 .75rem;color:var(--bs-secondary-color);font-size:.9rem}.ptn-library-title+.ptn-library-grid{margin-top:.75rem}.ptn-library-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr));gap:.85rem}.ptn-library-card{display:flex;flex-direction:column;min-width:0;color:inherit;font-size:.85rem;font-weight:600;text-decoration:none}.ptn-library-card img{display:block;width:100%;height:auto;margin-bottom:.35rem;border:1px solid var(--bs-border-color);border-radius:.6rem}.ptn-library-card small{color:var(--bs-secondary-color);font-size:.78rem;font-weight:400}.ptn-library-card:hover span{text-decoration:underline}@media(max-width:991.98px){.ptn-scroller{height:22rem}.ptn-canvas{height:46vh}}
