.pattern-lab{--pattern-ink:#462344;--pattern-berry:#8e365f;--pattern-coral:#de795f;margin:3rem 0 5rem;color:var(--pattern-ink);border:1px solid #dfc9d8;border-radius:26px;background:#fffaf2;overflow:hidden}.pattern-intro{padding:2.5rem 3rem 1.5rem}.pattern-intro h2{font-size:clamp(2rem,4vw,3.6rem);line-height:1.07;max-width:15ch;margin:.5rem 0 1rem}.pattern-intro p{max-width:54ch}.pattern-workspace{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr);gap:2rem;padding:0 3rem 2rem}.pattern-form{min-width:0}.pattern-form fieldset{margin:0;padding:0;border:0;min-width:0}.pattern-form legend{font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;font-weight:700;margin-bottom:1.4rem}.pattern-form label{display:block;font-size:.82rem;font-weight:600;margin:0 0 1rem}.pattern-form :is(input,select){display:block;width:100%;min-width:0;margin-top:.4rem;padding:.8rem;border:1px solid #cdb4c9;background:#fffdf8;border-radius:9px;color:var(--pattern-ink);font:inherit;font-size:1rem}.pattern-form :is(input,select,button):focus-visible{outline:3px solid #8e365f;outline-offset:3px}.pattern-pair{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.pattern-form button{font:inherit;font-size:.86rem;border:1px solid #8e365f;border-radius:999px;padding:.75rem 1.2rem;background:#8e365f;color:white;cursor:pointer}.pattern-form button:hover{background:#612347}.pattern-output{min-width:0}.pattern-paper{position:relative;border-radius:16px;background-color:#e9ddee;background-image:linear-gradient(#c9b0d533 1px,transparent 1px),linear-gradient(90deg,#c9b0d533 1px,transparent 1px);background-size:24px 24px;overflow:hidden}.pattern-paper svg{display:block;width:100%;max-height:420px;height:auto}.pattern-cut{fill:#fffaf2;stroke:#462344;stroke-width:2;filter:drop-shadow(3px 5px 3px #46234418)}.pattern-seam{fill:#f1c6b455;stroke:#ad442b;stroke-width:2;stroke-dasharray:7 5}.pattern-fold{stroke:#8e365f;stroke-width:3;stroke-dasharray:10 5}.pattern-paper [hidden]{display:none}.pattern-legend{display:flex;flex-wrap:wrap;gap:.6rem 1.3rem;padding:0 1.25rem 1.1rem;font-size:.78rem}.pattern-legend span:before{content:'';display:inline-block;width:22px;margin-right:.5rem;vertical-align:middle;border-top:2px solid #462344}.pattern-legend span+span:before{border-top:2px dashed #ad442b}.pattern-result{padding:1.3rem 0 0}.pattern-result>span{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.pattern-result strong{display:block;font-size:clamp(1.75rem,3vw,2.65rem);font-weight:600;line-height:1.15;margin:.4rem 0}.pattern-result p{font-size:.92rem;margin:.5rem 0}.pattern-small{font-size:.78rem!important;line-height:1.65;max-width:62ch}.pattern-error{padding:1rem;border:1px solid #ad442b;color:#762a21;border-radius:8px;background:#fff0e8}.pattern-links{display:flex;flex-wrap:wrap;gap:.8rem 2rem;border-top:1px solid #dfc9d8;padding:1.3rem 3rem;background:#f7ecf6;font-size:.82rem}.pattern-links a{color:#612347;text-underline-offset:4px}.pattern-noscript{padding:0 3rem 1rem}.pattern-form [hidden]{display:none}@media(max-width:760px){.pattern-intro{padding:1.5rem 1.25rem 1rem}.pattern-workspace{grid-template-columns:1fr;padding:0 1.25rem 1.5rem;gap:1.5rem}.pattern-links{padding:1.25rem}.pattern-lab{border-radius:18px}.pattern-pair{gap:.65rem}.pattern-intro h2{font-size:2.1rem}.pattern-noscript{padding:0 1.25rem 1rem}}@media print{.pattern-form{display:none}.pattern-workspace{display:block}.pattern-paper{max-width:440px}.pattern-links{display:none}.pattern-lab{break-inside:avoid}}
