.percentages-lab{color:#203d49;padding-bottom:4rem!important}.pg-tabs{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:2rem}.pg-tabs a{border:1px solid #9fb8bd;border-radius:999px;padding:.6rem 1rem;color:#175e73;font-weight:750;background:#fff;text-decoration:none}.pg-tabs a:hover,.pg-tabs a:focus-visible{background:#e6f1f1}.pg-section{scroll-margin-top:7rem;background:#fffdf8;border:1px solid #d8dfd6;border-radius:1.25rem;padding:clamp(1rem,3vw,2rem);margin-bottom:2rem}.pg-section h2{margin:.1rem 0 .8rem;font-size:clamp(1.45rem,3vw,2rem)}.pg-section header p:last-child{max-width:80ch}.pg-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:1rem;margin:1rem 0}.pg-fields label{font-weight:700;min-width:0}.pg-fields input,.pg-fields select{margin-top:.4rem;min-height:48px}.pg-examples,.pg-actions{display:flex;gap:.5rem;flex-wrap:wrap;margin:1rem 0}.pg-examples button{border:1px solid #9bb7c3;background:#f3f9fb;border-radius:.6rem;color:#20556c;padding:.5rem .8rem;min-height:42px}.pg-examples button:hover{background:#deedf3}.pg-check{display:flex;gap:.6rem;align-items:center;font-weight:650}.pg-check input{width:1.15rem;height:1.15rem}.pg-result{border-top:1px solid #d5ded8;padding-top:1.2rem;margin-top:1.2rem;min-width:0}.pg-result h3{font-size:1.2rem;margin:1.2rem 0 .6rem}.pg-step{margin:1rem 0}.pg-step p{margin-bottom:.4rem}.pg-result pre{padding:.8rem 1rem;background:#eef5f4;color:#193c4a;border-left:4px solid #28748c;border-radius:.5rem;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.65;font-size:.98rem}.pg-table-wrap{overflow-x:auto;max-width:100%}.pg-result table{width:100%;border-collapse:collapse;background:white;margin:.8rem 0;min-width:550px}.pg-result th,.pg-result td{border:1px solid #cad8dc;padding:.65rem;text-align:left;vertical-align:top}.pg-result thead{background:#e5eff2}.pg-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:.8rem;margin:1rem 0}.pg-metrics p{padding:1rem;border:1px solid #c4d8d9;border-radius:.8rem;background:#edf6f5;margin:0}.pg-metrics strong{display:block;font-size:1.6rem;margin-top:.3rem;line-height:1.35;overflow-wrap:anywhere}.pg-error{background:#fff0eb;border:1px solid #e6b4a2;border-radius:.6rem;color:#8b2c1d;padding:1rem;margin-top:1rem}.pg-note{background:#f6f0df;border-left:4px solid #c88d29;padding:.8rem 1rem;margin:1rem 0}.pg-bar{display:flex;width:100%;height:30px;background:#e3ab52;border-radius:.4rem;overflow:hidden;margin:.3rem 0 1rem}.pg-bar-a{display:block;background:#236e9b;height:100%}.pg-bar-b{display:block;background:#e3ab52;height:100%}.pg-bars p{margin-bottom:.2rem}.pg-reading{border:1px solid #bdd4db;padding:1.5rem;border-radius:1rem;background:#f1f7fa}.percentages-lab [hidden]{display:none!important}.percentages-lab :is(a,button,input,select,summary):focus-visible{outline:3px solid #da9c27;outline-offset:3px}.percentages-lab button:disabled{opacity:.5}@media(max-width:600px){.pg-fields{grid-template-columns:1fr}.pg-actions button{flex:1 1 100%}.pg-tabs a{flex:1 1 42%;text-align:center}.pg-section{scroll-margin-top:6rem}.pg-result pre{font-size:.9rem}.pg-metrics strong{font-size:1.3rem}}
.percentages-lab .pg-fields label{display:flex;flex-direction:column;gap:.4rem}.percentages-lab .pg-fields input,.percentages-lab .pg-fields select{display:block;width:100%;box-sizing:border-box;border:1px solid #9bb7c3;border-radius:.6rem;background:#fff;color:#203d49;padding:.65rem .8rem;font:inherit;margin:0;min-height:48px}.percentages-lab .pg-actions button{border:1px solid #236e9b;border-radius:.65rem;padding:.7rem 1rem;font:inherit;font-weight:750;min-height:46px;color:#20556c;background:#fff}.percentages-lab .pg-actions button[type=submit]{color:#fff;background:#236e9b}.percentages-lab .pg-actions button:hover{filter:brightness(.95)}
.percentages-lab .pg-opposite{border:2px solid #cd912f;border-left-width:6px;border-radius:.8rem;background:#fff2d8;padding:1rem 1.2rem}.percentages-lab .pg-opposite h3{margin-top:0;color:#75460e}.percentages-lab .pg-opposite[data-current-opposite]{box-shadow:0 0 0 3px #f6dfae}.percentages-lab .pg-opposite p:last-child{margin-bottom:0}
