/* Font Tester styles (v7.1) */
.fp-wrap{--fp-w:min(92vw,900px);--fp-h:auto;--fp-aspect:3 / 4;
  --fp-shadow:0 2px 6px rgba(120,78,0,.55);--fp-shadow-light:0 2px 6px rgba(160,120,60,.45);
  font-family:system-ui,Segoe UI,Roboto,Arial,sans-serif}
.fp-grid{display:grid;gap:14px}
.fp-stage{position:relative;width:var(--fp-w);aspect-ratio:var(--fp-aspect);border-radius:14px;overflow:hidden;background:#000;box-shadow:0 8px 30px rgba(0,0,0,.2);margin-inline:auto}
.fp-bg, .fp-blurlayer, .fp-darklayer, .fp-vignette{position:absolute;inset:0}
.fp-bg{background:#000 center/cover no-repeat;z-index:0}
.fp-blurlayer{background:#000 center/cover no-repeat;filter:blur(8px) saturate(.95) brightness(.8);opacity:1;display:none;z-index:1}
.fp-darklayer{background:rgba(0,0,0,.35);display:none;z-index:2}
.fp-vignette{pointer-events:none;display:none;z-index:3;
  background:radial-gradient(ellipse at center, rgba(0,0,0,0) 40%, rgba(0,0,0,.5) 100%);}
.fp-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;text-align:center;padding:6%;justify-content:flex-start;z-index:4}
.fp-line{display:block;white-space:pre-wrap;word-break:break-word}
.fp-controls{width:var(--fp-w);margin-inline:auto;display:grid;gap:12px}
.fp-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.fp-row label{font-size:14px;font-weight:600}
.fp-row input[type="text"]{flex:1 1 260px;padding:10px 12px;border:1px solid #ddd;border-radius:8px}
.fp-fonts{display:flex;flex-wrap:wrap;gap:10px}
.fp-fontbtn{padding:10px 14px;border:1px solid #ddd;border-radius:999px;background:#fff;cursor:pointer;transition:.15s transform,border-color;line-height:1;white-space:nowrap}
.fp-fontbtn[aria-pressed="true"]{border-color:#111;box-shadow:0 0 0 2px #111 inset}
.fp-small{font-size:12px;color:#666}
.fp-slider{display:flex;align-items:center;gap:10px}
.fp-slider input{width:220px}
.fp-color{display:flex;align-items:center;gap:8px}
.btn{padding:10px 12px;border:1px solid #ddd;border-radius:10px;background:#fff;cursor:pointer}
/* Shadow from settings */
.fp-shadow-on .fp-line{ text-shadow: var(--fp-shadow); }
.fp-shadow-on[data-shadowtone="lightbrown"] .fp-line{ text-shadow: var(--fp-shadow-light); }
/* Background style toggles */
.fp-wrap.style-blur_dark .fp-blurlayer{display:block}
.fp-wrap.style-blur_dark .fp-darklayer{display:block}
.fp-wrap.style-vignette .fp-vignette{display:block}
.fp-wrap.style-dark_vignette .fp-vignette{display:block}
.fp-wrap.style-dark_vignette .fp-darklayer{display:block}
@media (max-width:700px){
  .fp-stage{width:95vw}
}