.text-styles-page{box-sizing:border-box;overflow:hidden;padding:0 20px 18px}
.text-styles-head{margin-top:42px;margin-bottom:28px}
.text-styles-head .eyebrow{justify-content:center}
.text-styles-head h1{max-width:900px;margin-left:auto;margin-right:auto;font-size:clamp(34px,4.2vw,48px)}
.text-styles-head>p{max-width:820px}
.text-styles-workspace{box-sizing:border-box;width:min(100%,1060px);min-width:0;margin:0 auto 58px;padding:22px;background:#f1edf5;border:1px solid #eae5ee;border-radius:25px;box-shadow:var(--shadow)}
.text-styles-field-label{display:block;margin:0 0 9px;color:var(--ink);font-size:14px;font-weight:800}
.text-styles-workspace>textarea{box-sizing:border-box;display:block;width:100%;min-width:0;max-width:100%;height:56px;min-height:56px;resize:vertical;border:1px solid #e9e5ee;border-radius:14px;padding:12px 15px;background:#fff;color:var(--ink);font:400 16px/1.6 "DM Sans",sans-serif;outline:none}
.text-styles-workspace>textarea:focus{border-color:#b9a4dc;box-shadow:0 0 0 3px #b9a4dc2b}
.text-styles-workspace>textarea::placeholder{color:#aaa5b3;opacity:1}
.text-styles-output-heading-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 4px}
.text-styles-output h2,.text-styles-description h2,.text-styles-faq h2{margin:0 0 12px;color:var(--ink);font:800 clamp(23px,3vw,30px)/1.2 Manrope,sans-serif;letter-spacing:-.03em}
.text-styles-output-heading-row h2{margin:0}
.text-styles-count{flex:0 0 auto;padding:5px 10px;border-radius:999px;background:#fff;color:#777487;font-size:12px;font-weight:700}
.text-styles-card-hint{margin:5px 0 13px;color:#777487;font-size:12px;line-height:1.45}
.text-styles-unavailable-note{margin:0 0 13px;padding:9px 12px;border-radius:10px;background:#fff;color:#665c6d;font-size:12px;line-height:1.5}
.text-styles-unavailable-note[hidden]{display:none}
.text-styles-empty{margin:0;padding:16px;background:#fff;border:1px dashed #ded6e7;border-radius:14px;color:#777487;font-size:14px;line-height:1.6;text-align:center}
.text-styles-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.text-styles-grid[hidden]{display:none!important}
.text-styles-card{box-sizing:border-box;position:relative;display:flex;align-items:center;min-width:0;min-height:56px;width:100%;padding:9px 40px 9px 12px;background:#fff;border:1px solid #e9e4e7;border-radius:12px;cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .15s ease;outline:none}
.text-styles-card.is-alternative .text-styles-card-main h3{color:#8c5b7c}
.text-styles-card:hover,.text-styles-card:focus-visible{border-color:#c6b2dc;background:#fffefd;box-shadow:0 3px 12px #3425410d}
.text-styles-card:active{transform:scale(.995)}
.text-styles-card-main{display:flex;align-items:baseline;gap:5px;min-width:0;width:100%}
.text-styles-card-main h3{flex:0 0 auto;max-width:45%;margin:0;color:#777487;font:600 11px/1.35 "DM Sans",sans-serif}
.text-styles-copy-icon{position:absolute;right:8px;top:50%;display:grid;flex:0 0 24px;width:24px;height:24px;place-items:center;border-radius:6px;color:#5e5867;transform:translateY(-50%)}
.text-styles-card:hover .text-styles-copy-icon,.text-styles-card:focus-visible .text-styles-copy-icon{background:#f3eef8;color:#a7545b}
.text-styles-copy-icon svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.text-styles-card.is-copied .text-styles-copy-icon{background:#eef6ef;color:#4e8056}
.text-styles-card.is-copied .text-styles-copy-icon svg{display:none}
.text-styles-card.is-copied .text-styles-copy-icon:after{content:"✓";font-size:14px;font-weight:800}
.text-styles-preview{min-width:0;margin:0;color:#302c37;font-family:"Cambria Math","Segoe UI Symbol","Noto Sans Math",serif;font-size:15px;line-height:1.35;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;user-select:text}
.text-styles-card[data-style-key="italic"] .text-styles-preview{font-family:"Cambria Math","Segoe UI Symbol","Noto Sans Math",serif}
.text-styles-card[data-style-key="fullwidth"] .text-styles-preview{font-size:12px}
.text-styles-copy-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.text-styles-description,.text-styles-faq{width:min(100%,900px);box-sizing:border-box;margin:0 auto 58px}
.text-styles-description>.eyebrow,.text-styles-faq>.eyebrow{margin-bottom:8px}
.text-styles-description>p{margin:0 0 13px;color:#777487;font-size:15px;line-height:1.75}
.text-styles-description a,.text-styles-faq a{color:#b85e62;font-weight:700;text-decoration:underline;text-decoration-color:#e5a7a2;text-underline-offset:3px}
@media(max-width:980px){.text-styles-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.text-styles-page{padding:0 14px 12px}.text-styles-head{margin-top:30px}.text-styles-head h1{font-size:clamp(31px,8vw,39px)}.text-styles-workspace{width:100%;margin-bottom:44px;padding:13px;border-radius:20px}.text-styles-workspace>textarea{height:50px;min-height:50px;padding:9px 13px;font-size:14px}.text-styles-grid{grid-template-columns:minmax(0,1fr);gap:7px}.text-styles-card{width:100%;min-height:48px;padding:7px 39px 7px 10px;border-radius:10px}.text-styles-card-main{gap:4px}.text-styles-card-main h3{max-width:40%;font-size:10px}.text-styles-preview{font-size:14px;line-height:1.3}.text-styles-copy-icon{right:6px;width:22px;height:22px}.text-styles-description,.text-styles-faq{margin-bottom:48px}.text-styles-description>p{font-size:14px}}
