.font-tester .visually-hidden{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.font-tester-library{border-top:0;padding-top:0!important}.tester-toolbar{grid-template-columns:minmax(180px,1fr) minmax(240px,2.15fr) minmax(160px,.75fr);align-items:start;gap:12px 22px;margin-bottom:54px;display:grid}.tester-toolbar>label,.tester-toolbar>.tester-select{min-width:0;margin:0}.tester-toolbar input:not([type=range]),.tester-toolbar select{color:#e8e8e8;width:100%;min-width:0;max-width:100%;height:46px;font-family:var(--mono);outline-offset:4px;background:#171717;border:1px solid #353535;border-radius:9px;padding:0 14px;font-size:12px;display:block}.tester-toolbar input::placeholder{color:#8c8c8c;opacity:1}.tester-toolbar select{text-overflow:ellipsis;padding-right:28px}.font-tester .tester-toolbar input:focus,.font-tester .tester-toolbar input:focus-visible,.font-tester .tester-toolbar button:focus,.font-tester .tester-toolbar button:focus-visible{box-shadow:none;outline:none}.tester-toolbar input:not([type=range]):focus{border-color:#686868}.tester-toolbar .tester-size-control{font-family:var(--mono);color:var(--muted);grid-column:2;align-items:center;gap:14px;font-size:11px;display:flex}.tester-size-control>span{white-space:nowrap}.tester-size-control output{color:inherit}.tester-size-control input[type=range]{appearance:none;accent-color:var(--brand);cursor:pointer;border:0;border-radius:20px;flex:1;min-width:0;max-width:280px;height:4px;margin:7px 0;padding:0}.tester-size-control input::-webkit-slider-thumb{appearance:none;background:var(--brand);border:0;border-radius:50%;width:12px;height:12px}.tester-size-control input::-moz-range-thumb{background:var(--brand);border:0;border-radius:50%;width:12px;height:12px}.tester-size-control input:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 2px #e0e0e0}.tester-size-control input:focus-visible::-moz-range-thumb{box-shadow:0 0 0 2px #e0e0e0}.tester-select{height:46px;font-family:var(--mono);color:#e8e8e8;background:#171717;border:1px solid #353535;border-radius:9px;font-size:12px;position:relative}.tester-select.is-open{z-index:20;border-bottom-color:#0000;border-radius:9px 9px 0 0}.tester-select>button{border-radius:inherit;width:100%;height:44px;color:inherit;text-align:left;font:inherit;cursor:pointer;background:0 0;border:0;justify-content:space-between;align-items:center;gap:14px;padding:0 16px 0 14px;display:flex}.tester-select>button>span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.tester-select>button>svg{fill:none;stroke:#b7b7b7;stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:16px;height:16px;transition:transform .15s}.tester-select.is-open>button>svg{transform:rotate(180deg)}.tester-select>button:focus-visible{background:#242424}.tester-select>button:disabled{opacity:.45;cursor:default}.tester-select>ul{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#555 #171717;background:#171717;border:1px solid #353535;border-top:0;border-radius:0 0 9px 9px;max-height:300px;margin:0;padding:5px 0 7px;list-style:none;position:absolute;top:calc(100% - 1px);left:-1px;right:-1px;overflow-y:auto;box-shadow:0 12px 22px #0005}.tester-select [role=option]{cursor:pointer;overflow-wrap:anywhere;justify-content:space-between;align-items:center;gap:12px;min-height:42px;padding:12px 14px;line-height:1.5;display:flex}.tester-select [role=option].is-active{background:#303030}.tester-option-check{color:#c6c6c6;flex:none}.tester-row{border-bottom:1px solid var(--line);min-width:0;padding:25px 0 18px}.tester-row:first-child{padding-top:0}.tester-row h3{font-family:var(--mono);color:var(--muted);margin:0;font-size:12px;font-weight:400;line-height:1.6}.tester-row .font-preview{color:#f0f0f0;white-space:pre-wrap;overflow-wrap:anywhere;min-height:0;padding:16px 0 12px;line-height:1.5}.tester-row .color-font-preview{padding:6px 0}.color-font-preview canvas{max-width:100%;display:block}.font-tester-product .tester-toolbar{grid-template-columns:minmax(200px,1fr) minmax(160px,230px);max-width:1000px;margin-top:25px}.font-tester-product .tester-size-control{grid-column:1}.font-library-page{max-width:1600px;margin:auto;padding-top:45px}.font-library-page .library-intro{margin-bottom:42px}@media (max-width:1000px){.tester-toolbar{grid-template-columns:1fr 1fr;gap:14px}.tester-toolbar .tester-text-control{grid-column:auto}.tester-toolbar .tester-size-control{grid-column:auto;margin-top:0}.tester-toolbar{margin-bottom:38px}}@media (max-width:560px){.tester-toolbar,.font-tester-product .tester-toolbar{grid-template-columns:minmax(0,1fr);gap:12px}.tester-toolbar .tester-size-control,.tester-toolbar .tester-text-control{grid-column:1}.tester-size-control input[type=range]{max-width:none}.tester-toolbar input:not([type=range]),.tester-toolbar select{font-size:12px}.tester-row{padding:22px 0 14px}.font-library-page h1{font-size:27px}}
