:root{--basalt: #151719;--basalt-deep: #0b0e0f;--surface: #1b2022;--surface-light: #23292b;--sand: #d8b778;--copper: #c9873f;--ivory: #f4f0e6;--muted: #a4aaad;--line: rgba(244, 240, 230, .14);--line-strong: rgba(216, 183, 120, .38);color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:var(--basalt);color:var(--ivory);font-family:Inter,Segoe UI,Arial,sans-serif;line-height:1.6}a{color:var(--sand)}button,input,select{font:inherit}:focus-visible{outline:3px solid var(--sand);outline-offset:2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.web-tool{display:flex;flex-direction:column;gap:1.25rem;max-width:64rem;margin:0 auto;padding:1.25rem}.web-head h1{margin:0 0 .4rem;font-family:Manrope,Segoe UI,sans-serif;font-size:clamp(1.5rem,3vw,2.2rem)}.web-head .standfirst{max-width:60ch;margin:0;color:var(--muted)}.privacy-badge{display:inline-flex;align-items:center;gap:.45rem;margin:.9rem 0 0;padding:.35rem .7rem;border:1px solid var(--line-strong);border-radius:999px;background:#0b0e0f99;font-size:.8rem;font-weight:700}.web-body{display:grid;grid-template-columns:minmax(0,21rem) minmax(0,1fr);gap:1.5rem;align-items:start}.web-form{display:grid;gap:.9rem;padding:1.1rem;border:1px solid var(--line);border-radius:10px;background:var(--surface)}.web-field{display:grid;gap:.35rem}.web-field>label{color:var(--sand);font-size:.74rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.web-field input[type=text],.web-field select{width:100%;padding:.6rem .7rem;border:1px solid var(--line);border-radius:6px;background:var(--basalt);color:var(--ivory);font-size:1rem}.web-hint{margin:0;color:var(--muted);font-size:.76rem}.web-color-row{display:grid;grid-template-columns:3rem 1fr;gap:.5rem}.web-color-row input[type=color]{width:3rem;height:2.6rem;padding:2px;border:1px solid var(--line);border-radius:6px;background:var(--basalt);cursor:pointer}.web-range-row{display:grid;grid-template-columns:1fr auto;gap:.6rem;align-items:center}.web-range-row input[type=range]{width:100%;accent-color:var(--sand)}.web-range-row output{min-width:3ch;color:var(--muted);font-size:.85rem;text-align:right}.web-output{min-height:10rem}.web-result{display:grid;gap:1rem}.web-preview{display:grid;gap:.4rem;place-items:center;min-height:9rem;padding:1.25rem;border:1px solid var(--line);border-radius:10px;text-align:center}.web-preview-caption{padding:.35rem .7rem;border-radius:6px;background:#0b0e0fb8;color:#f4f0e6;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1rem;font-weight:700}.web-preview-large{font-size:1.5rem;font-weight:700}.web-preview-normal{max-width:34ch;font-size:1rem}.web-preview-ratio{margin-top:.4rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem;opacity:.85}.web-lines{display:grid;gap:0;margin:0}.web-lines>div{display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:center;justify-content:space-between;padding:.55rem 0;border-bottom:1px solid var(--line)}.web-lines>div:last-child{border-bottom:0}.web-lines dt{color:var(--muted);font-size:.82rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.web-lines dd{display:flex;gap:.6rem;align-items:center;margin:0}.web-lines code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9rem}.web-swatch{display:inline-block;width:1.1rem;height:1.1rem;border:1px solid var(--line);border-radius:4px}.web-verdicts{width:100%;border-collapse:collapse}.web-verdicts th{padding:.6rem 0;text-align:left;font-weight:700}.web-verdicts th small{display:block;color:var(--muted);font-size:.76rem;font-weight:500}.web-verdicts td{padding:.6rem 0;text-align:right;font-weight:800}.web-verdicts tr{border-bottom:1px solid var(--line)}.web-verdicts tr:last-child{border-bottom:0}.web-verdicts .is-pass td{color:#7fd1a3}.web-verdicts .is-fail td{color:#ffb4a2}.web-swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(7rem,1fr));gap:.75rem;margin:0;padding:0;list-style:none}.web-swatches li{display:grid;gap:.2rem}.web-swatches button{width:100%;height:3rem;border:1px solid var(--line);border-radius:6px;cursor:pointer}.web-swatches span{color:var(--muted);font-size:.76rem}.web-swatches code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.74rem}.web-css{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;justify-content:space-between;padding:.8rem .95rem;border:1px solid var(--line);border-left:3px solid var(--copper);border-radius:8px;background:var(--surface)}.web-css code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem;overflow-wrap:anywhere}.web-note{margin:0;padding:.7rem .9rem;border:1px solid rgba(216,183,120,.35);border-radius:6px;font-size:.87rem}.web-error{margin:0;padding:.75rem .9rem;border:1px solid rgba(255,150,130,.4);border-radius:6px;color:#ffb4a2;font-size:.9rem}.btn{padding:.55rem 1rem;border:1px solid var(--line);border-radius:6px;background:var(--surface-light);color:var(--ivory);cursor:pointer;justify-self:start}.btn:hover{border-color:var(--line-strong)}.btn-small{padding:.28rem .6rem;font-size:.78rem}.btn-primary{border-color:var(--sand);background:var(--sand);color:var(--basalt-deep);font-weight:750}.btn-primary:hover{background:#e6c88c}@media(max-width:780px){.web-body{grid-template-columns:1fr}}.skip-link{position:fixed;top:.75rem;left:.75rem;z-index:100;padding:.7rem 1rem;background:var(--ivory);color:var(--basalt);transform:translateY(-160%);text-decoration:none;font-weight:800}.skip-link:focus{transform:none}.site-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1.25rem;border-bottom:1px solid var(--line)}.brand{display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;color:inherit}.brand img{display:block;width:2.25rem;height:2.25rem;border:1px solid var(--line-strong);border-radius:6px}.brand strong,.brand small{display:block;line-height:1}.brand strong{font-family:Manrope,Segoe UI,sans-serif;font-size:.9rem;text-transform:uppercase}.brand small{margin-top:.25rem;color:var(--sand);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase}.site-nav{display:flex;flex-wrap:wrap;align-items:center;gap:.15rem}.site-nav a{padding:.5rem .6rem;color:#d9dcda;font-size:.85rem;text-decoration:none;border-radius:4px}.site-nav a:hover{color:var(--ivory);background:#ffffff0d}.site-nav a[aria-current=page]{color:var(--ivory);box-shadow:inset 0 -2px var(--sand)}.nav-menu{position:relative}.nav-menu>summary{display:flex;align-items:center;gap:.3rem;padding:.5rem .6rem;color:#d9dcda;font-size:.85rem;cursor:pointer;list-style:none}.nav-menu>summary::-webkit-details-marker{display:none}.nav-menu>summary:after{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor;opacity:.7;content:""}.nav-menu[open]>summary:after{transform:rotate(180deg)}.nav-menu.is-active>summary{color:var(--ivory);box-shadow:inset 0 -2px var(--sand)}.nav-menu-panel{position:absolute;z-index:60;top:calc(100% + .4rem);right:0;display:grid;min-width:13rem;padding:.35rem;border:1px solid var(--line);border-radius:8px;background:#0b0e0ffa;box-shadow:0 18px 44px #00000073}.nav-menu-panel a{padding:.55rem .7rem;white-space:nowrap}.tool-switcher{padding:.75rem 1.25rem 0}.tool-switcher ul{display:flex;flex-wrap:wrap;gap:.35rem;margin:0;padding:0;list-style:none}.tool-switcher a{display:inline-block;padding:.35rem .7rem;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:.82rem;text-decoration:none}.tool-switcher a:hover{border-color:var(--line-strong);color:var(--ivory)}.tool-switcher a[aria-current=page]{border-color:var(--line-strong);background:var(--surface-light);color:var(--ivory)}.tool-switcher-label a{border-color:transparent;color:var(--sand);font-weight:800}.noscript-note{max-width:60rem;margin:0 auto;padding:1.25rem}.page-content{max-width:60rem;margin:0 auto;padding:0 1.25rem 3rem}.content-section{padding-top:2.25rem}.content-section+.content-section{margin-top:2.25rem;border-top:1px solid var(--line)}.content-section h2{margin:0 0 .75rem;font-family:Manrope,Segoe UI,sans-serif;font-size:1.2rem}.content-section p{max-width:68ch;color:var(--muted)}.faq{margin:0}.faq dt{margin-top:1.25rem;font-weight:800}.faq dt:first-child{margin-top:0}.faq dd{max-width:68ch;margin:.4rem 0 0;color:var(--muted)}.related-list{display:flex;flex-wrap:wrap;gap:.5rem;margin:0;padding:0;list-style:none}.related-list a{display:inline-block;padding:.4rem .8rem;border:1px solid var(--line);border-radius:999px;font-size:.85rem;text-decoration:none}.related-list a:hover{border-color:var(--line-strong)}.site-footer-slim{padding:1.5rem 1.25rem 2.5rem;border-top:1px solid var(--line);text-align:center;font-size:.85rem}.site-footer-slim p{margin:.25rem 0}.muted{color:var(--muted)}@media(max-width:640px){.site-header{flex-wrap:wrap}.nav-menu-panel{right:auto;left:0}}