:root{--shell-viewport-offset: 3.5rem}html.compact{--shell-viewport-offset: 3.25rem}html.regular{--shell-viewport-offset: 3.5rem}html.spacious{--shell-viewport-offset: 3.75rem}@media(min-width:769px){body.is-desktop-tool-viewport .site-header.has-header-intro .site-header-intro{display:none!important}body.is-desktop-tool-viewport .site-header.has-header-intro{flex-wrap:nowrap;align-items:center;padding:.35rem 1rem;gap:.5rem;min-height:0;max-height:3.5rem}body.is-desktop-tool-viewport .site-header.has-header-intro .brand{font-size:1.05rem}body.is-desktop-tool-viewport .site-header.has-header-intro .nav a{padding:.3rem .5rem;font-size:.88rem}body.is-desktop-tool-viewport .tool-viewport-region{min-height:0;flex:0 0 auto;width:100%}body.is-desktop-tool-viewport .tool-below-intro{margin:.65rem 0 0;padding:0;max-width:46rem}body.is-desktop-tool-viewport .tool-below-intro h1{margin:0 0 .35rem;font-family:var(--font-display);font-size:1.05rem;font-weight:700;line-height:1.25}body.is-desktop-tool-viewport .tool-below-intro p{margin:0;color:var(--muted);font-size:.92rem;line-height:1.45}body.is-desktop-tool-viewport .site-main{padding:.45rem 1rem 2rem;max-width:min(1400px,100% - 1.5rem)}body.is-desktop-tool-viewport [class$=-tool]:not(.dice-host){box-sizing:border-box;max-height:calc(100dvh - var(--shell-viewport-offset) - .65rem);overflow:hidden;min-height:0;margin:0;gap:0}body.is-desktop-tool-viewport [class$=-tool] [class$=-layout]{height:calc(100dvh - var(--shell-viewport-offset) - 1.15rem);max-height:calc(100dvh - var(--shell-viewport-offset) - 1.15rem);min-height:0;align-items:stretch}body.is-desktop-tool-viewport [class$=-tool] [class*=-options-panel],body.is-desktop-tool-viewport [class$=-tool] [class*=sidebar-panel].is-docked{display:flex;flex-direction:column;min-height:0;overflow:hidden}body.is-desktop-tool-viewport [class$=-tool] .dice-sidebar-panel.is-docked{min-height:0;height:100%;max-height:100%;overflow:hidden;align-self:stretch}body.is-desktop-tool-viewport [class$=-tool] [class*=-sidebar-body],body.is-desktop-tool-viewport [class$=-tool] .dice-sidebar-panel__body{flex:1 1 0;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}body.is-desktop-tool-viewport [class$=-tool] [class*=-sidebar-panel] [class$=-header],body.is-desktop-tool-viewport .dice-sidebar-panel__header{flex:0 0 auto;padding:.45rem .65rem;gap:.45rem}body.is-desktop-tool-viewport .dice-sidebar-panel__intro{display:none}body.is-desktop-tool-viewport .dice-sidebar-panel.is-docked .dice-sidebar-panel__body{padding-bottom:.65rem;box-sizing:border-box}}:root{color-scheme:light dark;--font-sans: "Source Sans 3", system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;--font-display: "Fraunces", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;--radius: 12px;--focus: 0 0 0 3px color-mix(in srgb, var(--accent) 55%, transparent);--ad-min-height: 100px}*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:var(--font-sans);background:var(--bg);color:var(--text);line-height:1.5;min-height:100vh}html.has-js [data-seo-static]{display:none!important}a{color:var(--accent)}:focus-visible{outline:none;box-shadow:var(--focus)}.skip-link{position:absolute;left:-999px;top:0;background:var(--surface);color:var(--text);padding:.5rem 1rem;z-index:1000}.skip-link:focus{left:.5rem;top:.5rem}.site-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem 1.25rem;border-bottom:1px solid color-mix(in srgb,var(--text) 12%,transparent);box-shadow:0 1px 3px #00000014;background:color-mix(in srgb,var(--surface) 94%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:sticky;top:0;z-index:50}.site-header-start{display:flex;flex-wrap:wrap;align-items:center;gap:.65rem 1rem;min-width:0;flex:1 1 auto}.site-header-intro{min-width:0;flex:1 1 12rem}.site-header-title{margin:0;font-family:var(--font-display);font-size:1.05rem;font-weight:700;line-height:1.2}.site-header-about{margin-top:.15rem;font-size:.82rem}.site-header-summary{margin:.25rem 0 0;color:var(--muted);max-width:46rem;line-height:1.4;font-size:.9rem;font-weight:500}.site-header-about summary{cursor:pointer;color:var(--muted);font-weight:600}.site-header-about p{margin:.25rem 0 0;color:var(--muted);max-width:42rem;line-height:1.35}@media(min-width:769px){.site-header.has-header-intro{flex-wrap:nowrap;padding:.55rem 1rem;gap:.75rem}.site-header.has-header-intro .site-header-start{flex-wrap:nowrap;align-items:center}.site-header.has-header-intro .brand{flex-shrink:0;font-size:1.05rem}.site-header.has-header-intro .site-header-title{font-size:.98rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.site-header.has-header-intro .site-header-about,.site-header.has-header-intro .site-header-summary{display:inline-block;margin-top:0;margin-left:.35rem;vertical-align:middle;max-width:28rem;white-space:normal}.site-header.has-header-intro .site-header-about summary{display:inline;font-size:.78rem}}.brand{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--font-display);font-size:1.2rem;font-weight:700;color:var(--text);text-decoration:none}.brand-mark{display:inline-grid;place-items:center;width:1.55rem;height:1.55rem;flex:0 0 auto}.brand-mark svg{width:100%;height:100%;display:block}.nav-toggle{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid color-mix(in srgb,var(--text) 18%,transparent);background:var(--surface);border-radius:8px;width:2.5rem;height:2.5rem;padding:0;cursor:pointer;align-items:center;justify-content:center}.nav-toggle-bars,.nav-toggle-bars:before,.nav-toggle-bars:after{display:block;width:1.1rem;height:2px;background:var(--text);border-radius:1px;position:relative}.nav-toggle-bars:before,.nav-toggle-bars:after{content:"";position:absolute;left:0}.nav-toggle-bars:before{top:-5px}.nav-toggle-bars:after{top:5px}.nav{display:flex;flex-wrap:wrap;gap:.35rem .35rem}.nav a{color:var(--muted);text-decoration:none;font-size:.92rem;padding:.35rem .55rem;border-radius:6px}.nav a:hover{color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent);text-decoration:underline;text-underline-offset:.18em}.nav a[aria-current=page]{color:var(--accent);font-weight:700;background:color-mix(in srgb,var(--accent) 12%,transparent)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.site-main{width:min(1100px,100% - 2rem);margin:0 auto;padding:1rem 0 3rem}.site-footer{border-top:1px solid #e5e7eb;padding:2rem 1.25rem 2.5rem;color:var(--muted);font-size:.9rem}.site-footer-grid{display:grid;gap:1.25rem;margin-bottom:1rem}.site-footer-grid.has-legal{grid-template-columns:1fr}.site-footer-label{margin:0 0 .35rem;font-size:.75rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}.site-footer nav{display:flex;flex-wrap:wrap;gap:.55rem 1.1rem}.site-footer a{color:var(--muted);text-decoration:none}.site-footer a:hover{color:var(--accent)}.site-footer-note{margin:0;color:#9ca3af;font-size:.875rem}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);background:var(--accent);color:var(--on-accent, #fff);font:inherit;font-weight:650;padding:.7rem 1.15rem;border-radius:calc(var(--radius) - 2px);cursor:pointer}.btn:hover{filter:brightness(1.05)}.btn:disabled{opacity:.5;cursor:not-allowed;filter:none}.btn-secondary{background:transparent;color:var(--text);border-color:color-mix(in srgb,var(--text) 25%,transparent)}.btn-row{display:flex;flex-wrap:wrap;gap:.6rem}.panel{background:var(--surface);border:1px solid color-mix(in srgb,var(--text) 10%,transparent);border-radius:var(--radius);padding:1rem}.tool-hero{margin:0 0 .75rem;padding:1rem 0 .5rem}.tool-hero--compact{padding:.65rem 0 .35rem;margin-bottom:.5rem}.tool-hero h1{font-family:var(--font-display);font-size:clamp(1.6rem,3vw,2.2rem);margin:0 0 .35rem;line-height:1.15}.tool-hero--compact h1{font-size:1.5rem;margin-bottom:.25rem}.tool-hero p{margin:0;color:var(--muted);max-width:42rem}.tool-hero-about{margin-top:.35rem;font-size:.92rem}.tool-hero-about summary{cursor:pointer;color:var(--muted);font-weight:650}.tool-hero-about p{margin-top:.4rem}.tool-tips{margin:1.5rem 0 0;padding:.85rem 1rem;background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;color:#4b5563;font-size:.9rem}.tool-tips summary{cursor:pointer;font-weight:700;color:#111827}.tool-tips ul{margin:.5rem 0 0;padding-left:1.15rem}.mini-tool-card{margin-top:1rem;border:1px solid #e5e7eb;border-radius:8px;padding:1rem;background:var(--surface)}.mini-tool-card h2{margin:0 0 .35rem;font-size:1.05rem}.mini-tool-card p{margin:0;color:var(--muted)}.related-tools{margin:1.5rem 0 0;padding:1rem;border:1px solid color-mix(in srgb,var(--text) 12%,transparent);border-radius:var(--radius);background:color-mix(in srgb,var(--surface) 92%,transparent)}.related-tools h2{margin:0 0 .25rem;font-family:var(--font-display);font-size:1.15rem}.related-tools p{margin:0 0 .75rem;color:var(--muted);font-size:.92rem}.related-tools ul{display:grid;gap:.7rem;margin:0;padding:0;list-style:none}.related-tools li{display:grid;gap:.15rem}.related-tools li a{font-weight:700}.related-tools li span{color:var(--muted);font-size:.9rem}.home-editorial-panel{max-width:52rem;margin:2rem auto 0;padding:1.75rem 1.5rem 1.5rem;border-radius:calc(var(--radius) + 4px);border:1px solid color-mix(in srgb,var(--accent) 22%,transparent);background:linear-gradient(165deg,color-mix(in srgb,var(--surface) 96%,var(--accent) 4%),color-mix(in srgb,var(--bg) 88%,var(--surface) 12%));box-shadow:0 12px 40px color-mix(in srgb,var(--text) 6%,transparent);line-height:1.65}.home-editorial-intro h2{margin:0 0 .65rem;font-family:var(--font-display);font-size:clamp(1.35rem,2.4vw,1.75rem);font-weight:700;letter-spacing:-.02em;line-height:1.25}.home-editorial-lead{margin:0;font-size:1.05rem;color:color-mix(in srgb,var(--text) 92%,var(--muted))}.home-editorial-grid{display:grid;gap:1.25rem;margin-top:1.35rem}@media(min-width:720px){.home-editorial-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-editorial-block--examples{grid-column:1 / -1}}.home-editorial-block h3{margin:0 0 .45rem;font-family:var(--font-display);font-size:1.12rem;font-weight:650}.home-editorial-block ol,.home-editorial-block ul{margin:0;padding-left:1.2rem}.home-editorial-block li+li{margin-top:.35rem}.home-example-list{list-style:none;padding:0!important;display:grid;gap:.75rem}@media(min-width:640px){.home-example-list{grid-template-columns:repeat(2,minmax(0,1fr))}}.home-example-list li{display:grid;gap:.25rem;padding:.85rem 1rem;border-radius:var(--radius);background:color-mix(in srgb,var(--surface) 90%,transparent);border:1px solid color-mix(in srgb,var(--text) 10%,transparent)}.home-example-list strong{font-weight:650;font-size:.98rem}.home-example-list span{color:var(--muted);font-size:.94rem}.home-editorial-block--limits ul{color:color-mix(in srgb,var(--text) 88%,var(--muted))}.home-editorial-faq{margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid color-mix(in srgb,var(--text) 10%,transparent)}.home-editorial-faq h3{margin:0 0 .75rem;font-family:var(--font-display);font-size:1.15rem}.home-faq-grid{display:grid;gap:.75rem}@media(min-width:640px){.home-faq-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.home-faq-card{padding:.85rem 1rem;border-radius:var(--radius);background:var(--surface);border:1px solid color-mix(in srgb,var(--text) 10%,transparent)}.home-faq-card h4{margin:0 0 .35rem;font-size:.98rem;font-weight:650}.home-faq-card p{margin:0;font-size:.92rem;color:var(--muted)}.home-editorial-cta{margin:.75rem 0 0;font-weight:600}.home-editorial-panel .home-editorial-cta a{color:var(--highlight);text-decoration:underline;text-underline-offset:2px}.home-editorial-guides{max-width:52rem;margin:1.75rem auto 0}.home-editorial-guides h2{margin:0 0 .85rem;font-family:var(--font-display);font-size:1.25rem}.home-guide-cards{list-style:none;margin:0;padding:0;display:grid;gap:.65rem}@media(min-width:640px){.home-guide-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}.home-guide-cards a{display:grid;gap:.2rem;padding:.85rem 1rem;border-radius:var(--radius);text-decoration:none;color:inherit;background:color-mix(in srgb,var(--surface) 94%,transparent);border:1px solid color-mix(in srgb,var(--text) 12%,transparent);transition:border-color .15s ease,box-shadow .15s ease}.home-guide-cards a:hover{border-color:color-mix(in srgb,var(--accent) 45%,transparent);box-shadow:0 4px 16px color-mix(in srgb,var(--accent) 12%,transparent)}.home-guide-card-title{font-weight:650;color:var(--accent)}.home-guide-card-desc{font-size:.9rem;color:var(--muted);line-height:1.45}.home-editorial-tips{max-width:52rem;margin:1rem auto 0}.home-mini-tools{max-width:52rem;margin:1rem auto 0;display:grid;gap:.75rem}@media(min-width:640px){.home-mini-tools{grid-template-columns:repeat(2,minmax(0,1fr))}}.home-example-steps{margin:0;padding-left:1.35rem;display:grid;gap:.65rem}.home-example-steps li{padding-left:.15rem}.home-example-steps strong{display:block;font-weight:650;margin-bottom:.15rem}.home-example-steps span{color:var(--muted);font-size:.94rem}.home-faq-stack{display:grid;gap:.45rem}.home-faq-disclosure{border:1px solid color-mix(in srgb,var(--text) 12%,transparent);border-radius:var(--radius);padding:.55rem .75rem;background:color-mix(in srgb,var(--surface) 92%,transparent)}.home-faq-disclosure summary{cursor:pointer;font-weight:650;list-style:none}.home-faq-disclosure summary::-webkit-details-marker{display:none}.home-faq-disclosure p{margin:.45rem 0 0;font-size:.92rem;color:var(--muted)}.home-editorial-panel--banded{max-width:58rem;border-radius:10px;border-left-width:4px;border-left-color:color-mix(in srgb,var(--accent) 70%,transparent)}.home-editorial-panel--banded .home-editorial-grid{grid-template-columns:1fr}.home-editorial-panel--banded .home-editorial-block:first-of-type{padding:.85rem 1rem;border-radius:var(--radius);background:color-mix(in srgb,var(--accent) 8%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 22%,transparent)}.home-editorial-panel--stacked{max-width:44rem;margin-left:0;margin-right:auto;box-shadow:none;border-style:dashed}.home-editorial-panel--stacked .home-editorial-grid{grid-template-columns:1fr}.home-editorial-panel--stacked .home-editorial-intro h2{font-size:clamp(1.25rem,2vw,1.55rem)}@media(min-width:900px){.home-editorial-panel--split{max-width:min(1100px,100%);display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:1.5rem 2rem;align-items:start}.home-editorial-panel--split .home-editorial-intro{grid-column:1;grid-row:1 / span 2;position:sticky;top:5rem}.home-editorial-panel--split .home-editorial-grid{grid-column:2;margin-top:0}.home-editorial-panel--split .home-editorial-faq,.home-editorial-panel--split .home-editorial-cta,.home-editorial-panel--split .publisher-verification-note,.home-editorial-panel--split .tool-publisher-links{grid-column:2}}.tool-explanation{max-width:48rem;margin:1.5rem 0 0;line-height:1.6}.tool-explanation h2,.tool-explanation h3{font-family:var(--font-display)}.tool-explanation h2{margin:0 0 .45rem}.tool-explanation h3{margin:1rem 0 .3rem;font-size:1.05rem}.tool-explanation p{margin:0}.tool-explanation ul{margin:0;padding-left:1.25rem}.field{display:flex;flex-direction:column;gap:.35rem;margin-bottom:.85rem}.field label{font-weight:600;font-size:.92rem}.field input,.field textarea,.field select{font:inherit;padding:.65rem .75rem;border-radius:8px;border:1px solid color-mix(in srgb,var(--text) 20%,transparent);background:color-mix(in srgb,var(--bg) 70%,var(--surface));color:var(--text)}.live{min-height:1.25rem}.ad-slot{margin:1.25rem 0;min-height:var(--ad-min-height);border:1px dashed color-mix(in srgb,var(--text) 22%,transparent);border-radius:8px;display:grid;place-items:center;color:var(--muted);background:color-mix(in srgb,var(--surface) 80%,transparent);pointer-events:none;-webkit-user-select:none;user-select:none;text-align:center;padding:.75rem}.ad-slot strong{display:block;font-size:.85rem;letter-spacing:.04em;text-transform:uppercase}.ad-slot span{font-size:.85rem}.below-tool-ad{margin-top:clamp(2rem,5vw,4rem);margin-bottom:clamp(2rem,4vw,2rem);max-width:100%}.below-tool-ad-label{margin:0 0 .5rem;font-size:.85rem;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}.below-tool-ad-frame{min-height:250px;width:100%;overflow:hidden}.below-tool-ad-frame .adsbygoogle:empty{min-height:0}.tool-publisher-links{margin-top:1rem;font-size:.95rem}.tool-publisher-links a{color:var(--highlight)}.prose{max-width:48rem;line-height:1.6;margin-bottom:2rem}.prose h1,.prose h2{font-family:var(--font-display)}.prose h2{margin-top:1.75rem}.content-breadcrumb{margin:0 0 1rem;font-size:.9rem;color:var(--muted)}.content-breadcrumb ol{display:flex;flex-wrap:wrap;gap:.35rem .5rem;list-style:none;margin:0;padding:0}.content-breadcrumb li:not(:last-child):after{content:"/";margin-left:.5rem;color:color-mix(in srgb,var(--muted) 80%,transparent)}.content-breadcrumb a{color:var(--highlight)}.content-related{margin-top:2rem}.content-deflist{margin:.75rem 0 1.25rem}.content-deflist-row{display:grid;grid-template-columns:minmax(5rem,8rem) 1fr;gap:.5rem 1rem;padding:.45rem 0;border-bottom:1px solid color-mix(in srgb,var(--text) 10%,transparent)}.content-deflist dt{margin:0;font-weight:650}.content-deflist dd{margin:0;color:var(--text)}@media(max-width:520px){.content-deflist-row{grid-template-columns:1fr}}.faq details{border:1px solid color-mix(in srgb,var(--text) 12%,transparent);border-radius:8px;padding:.75rem 1rem;margin-bottom:.65rem;background:var(--surface)}.faq summary{cursor:pointer;font-weight:650}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media(min-width:768px){.site-footer-grid.has-legal{grid-template-columns:1fr 1fr}}@media(max-width:767px){.site-main{width:min(100% - 2rem,1100px);padding-left:0;padding-right:0}.nav-toggle{display:inline-flex}.nav{display:none;width:100%;flex-direction:column;gap:.15rem}.nav.is-open{display:flex}.btn{min-height:44px}}:root{--bg: #0f1418;--surface: #172027;--text: #e8f0f4;--muted: #8fa3ad;--accent: #3db8a8;--highlight: #f0b429;--on-accent: #06201c;--font-display: "Outfit", system-ui, sans-serif;--font-sans: "IBM Plex Sans", system-ui, sans-serif}body{background:radial-gradient(1000px 520px at 8% -8%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 55%),radial-gradient(880px 460px at 100% 0%,color-mix(in srgb,var(--highlight) 10%,transparent),transparent 52%),var(--bg);font-family:var(--font-sans)}.pe-tool{display:flex;flex-direction:column;gap:.75rem}.pe-layout{display:flex;flex-direction:column;gap:.75rem;min-height:0}.pe-main{display:flex;flex-direction:column;gap:.55rem;min-height:0;min-width:0}.pe-stage-panel{display:flex;flex-direction:column;gap:.55rem;flex:1 1 auto;min-height:0;padding:.65rem;border-radius:calc(var(--radius, 10px) + 4px);background:color-mix(in srgb,var(--surface) 96%,var(--bg));border:1px solid color-mix(in srgb,var(--accent) 28%,transparent)}.pe-controls{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center}.pe-card{flex:1 1 auto;min-height:14rem;display:flex;flex-direction:column;gap:.85rem;padding:1rem;border-radius:calc(var(--radius, 10px) + 6px);border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);background:linear-gradient(160deg,color-mix(in srgb,var(--surface) 88%,#000) 0%,var(--surface) 55%,color-mix(in srgb,var(--accent) 12%,var(--surface)) 100%);box-shadow:0 18px 40px color-mix(in srgb,#000 28%,transparent);overflow:auto}.pe-file-input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.pe-drop{display:flex;align-items:center;justify-content:center;min-height:11rem;border-radius:12px;border:2px dashed color-mix(in srgb,var(--accent) 45%,transparent);background:color-mix(in srgb,var(--bg) 55%,transparent);transition:border-color .15s ease,background .15s ease}.pe-drop.is-drag{border-color:var(--highlight);background:color-mix(in srgb,var(--highlight) 12%,var(--bg))}.pe-drop.has-image{border-style:solid;border-color:color-mix(in srgb,var(--accent) 35%,transparent);padding:.5rem}.pe-drop-cta{display:flex;flex-direction:column;gap:.35rem;align-items:center;justify-content:center;width:100%;min-height:11rem;padding:1.25rem;border:0;background:transparent;color:var(--text);cursor:pointer;font:inherit}.pe-drop-title{font-family:var(--font-display);font-weight:700;font-size:clamp(1.15rem,2.5vw,1.45rem)}.pe-drop-sub{color:var(--muted);font-size:.9rem;text-align:center;max-width:22rem}.pe-preview{margin:0;width:100%;text-align:center}.pe-preview img{max-width:100%;max-height:min(42vh,22rem);width:auto;height:auto;border-radius:8px;object-fit:contain}.pe-preview figcaption{margin-top:.45rem;color:var(--muted);font-size:.78rem}.pe-replace-row{display:flex;justify-content:center}.pe-swatches{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(12.5rem,1fr));gap:.65rem}.pe-swatch{display:grid;grid-template-columns:3.25rem 1fr;grid-template-rows:auto auto;gap:.35rem .55rem;align-items:center;padding:.55rem;border-radius:10px;border:1px solid color-mix(in srgb,var(--accent) 22%,transparent);background:color-mix(in srgb,var(--bg) 50%,var(--surface))}.pe-chip{grid-row:1 / span 2;width:3.25rem;height:3.25rem;border-radius:8px;border:1px solid color-mix(in srgb,#fff 18%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,#000 25%,transparent)}.pe-swatch-meta{display:flex;flex-direction:column;gap:.1rem;min-width:0}.pe-hex{font-size:.95rem;font-weight:700;color:var(--text)}.pe-rgb{font-size:.75rem;color:var(--muted)}.pe-copy-hex{grid-column:2;justify-self:start;padding:.28rem .5rem;font-size:.75rem;min-height:0}.pe-status{margin:0;text-align:center;color:var(--muted);font-size:.95rem}.pe-error{margin:0;text-align:center;color:#fda4af;font-size:.9rem}.pe-options-panel{display:flex;flex-direction:column;gap:.55rem}.pe-sidebar-header{display:none}.pe-sidebar-title{margin:0;font-size:1rem}.pe-sidebar-body{display:flex;flex-direction:column;gap:.55rem;min-height:0}.pe-fieldset{margin:0;padding:.45rem .5rem .55rem;border:1px solid color-mix(in srgb,var(--accent) 22%,transparent);border-radius:var(--radius, 8px)}.pe-fieldset legend{padding:0 .25rem;font-size:.8rem;font-weight:600;color:var(--muted)}.pe-field{display:flex;flex-direction:column;gap:.35rem;font-size:.85rem;color:var(--text);font-weight:600}.pe-field input[type=range]{width:100%;accent-color:var(--accent)}.pe-toggle-row{display:flex;flex-wrap:wrap;gap:.35rem}.pe-check{display:flex;align-items:center;gap:.35rem;font-size:.85rem;color:var(--text)}.pe-hint{margin:.35rem 0 0;color:var(--muted);font-size:.75rem}.pe-privacy-note strong{color:var(--highlight);font-weight:650}.pe-fullscreen-shell{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:var(--bg);padding:.75rem;display:flex;flex-direction:column;overflow:hidden}.pe-fullscreen-shell .pe-tool{flex:1 1 auto;min-height:0;max-height:none!important;height:100%;margin:0;padding:.55rem .65rem;display:flex;flex-direction:column;overflow:hidden}.pe-fullscreen-shell .pe-layout{flex:1 1 auto;min-height:0;height:100%!important;max-height:none!important;grid-template-columns:minmax(0,1fr)!important}.pe-fullscreen-shell .pe-main,.pe-fullscreen-shell .pe-stage-panel{height:100%;min-height:0}.pe-fullscreen-shell .pe-card,.pe-host .pe-card{flex:1 1 auto;min-height:0;width:100%;max-width:min(960px,100%);margin-inline:auto}.desktop-only-control{display:none}.mobile-only-control{display:inline-flex}@media(min-width:769px){.desktop-only-control{display:inline-flex}.mobile-only-control{display:none!important}.pe-sidebar-header.desktop-only-control{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-shrink:0}html:has(.pe-tool),body:has(.pe-tool){overflow:hidden;height:100dvh;max-height:100dvh}body:has(.pe-tool) .site-main{padding:.5rem 1rem;max-width:min(1200px,100% - 1.5rem);overflow:hidden}body:has(.pe-tool) .site-footer{display:none}.panel.pe-tool~.tool-tips,.panel.pe-tool~section[aria-label="Related mini-tools"]{display:none!important}.pe-tool{--pe-viewport-offset: 3.75rem;max-height:calc(100dvh - var(--pe-viewport-offset));overflow:hidden;padding:.55rem .65rem;gap:0;margin:0}.pe-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,320px);gap:.65rem;align-items:stretch;height:calc(100dvh - var(--pe-viewport-offset) - 1rem);max-height:calc(100dvh - var(--pe-viewport-offset) - 1rem);min-height:0}.pe-tool.is-sidebar-collapsed .pe-layout{grid-template-columns:minmax(0,1fr)}.pe-main,.pe-stage-panel{height:100%;min-height:0}.pe-options-panel.pe-sidebar{height:100%;overflow:hidden;display:flex;flex-direction:column;padding:.55rem .6rem;gap:.4rem;border-radius:var(--radius, 8px);border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);background:color-mix(in srgb,var(--surface) 98%,var(--bg));box-shadow:0 12px 32px color-mix(in srgb,#000 18%,transparent)}.pe-sidebar-body{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;gap:.45rem;padding-right:.15rem;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--accent) 45%,transparent) color-mix(in srgb,var(--surface) 92%,transparent);-webkit-overflow-scrolling:touch}.pe-sidebar-body::-webkit-scrollbar{width:8px}.pe-sidebar-body::-webkit-scrollbar-track{background:color-mix(in srgb,var(--surface) 88%,transparent);border-radius:999px}.pe-sidebar-body::-webkit-scrollbar-thumb{border-radius:999px;background:color-mix(in srgb,var(--accent) 42%,transparent);border:2px solid transparent;background-clip:padding-box}.pe-options-panel .btn{padding:.32rem .5rem;font-size:.76rem;min-height:0}}