.tool-page[data-tool=css-units]>.css-unit-content,.tool-page[data-tool=css-units]>.tool-details,.tool-page[data-tool=css-units]>.tool-intro{width:calc(100% - 48px);max-width:720px;margin-left:auto;margin-right:auto}.tool-page[data-tool=css-units]>.tool-details,.tool-page[data-tool=css-units]>.tool-intro{padding-left:0;padding-right:0}.css-unit-content{padding:0 0 30px;color:#263247}.css-unit-basics,.css-unit-entry,.css-unit-examples,.css-unit-guide article,.css-unit-result{background:#fff;border:1px solid #dce4ee;border-radius:12px;box-shadow:0 2px 4px #1f2d400e}.css-unit-basics{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:15px 16px;margin-bottom:20px}.css-unit-basics label{display:flex;flex-direction:column;gap:6px;color:#536783;font-size:12px}.css-unit-basics label>span{display:flex;align-items:center;justify-content:space-between;height:35px;padding:0 12px;border:1px solid #dce4ee;border-radius:8px;background:#f8fafc}.css-unit-basics input,.css-unit-basics select{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#1f2937;font-size:14px;font-weight:600}.css-unit-basics label>span i{color:#52647e;font-size:12px;font-style:normal}.css-unit-basics select{height:35px;padding:0 12px;border:1px solid #dce4ee;border-radius:8px;background:#f8fafc}.css-unit-entry{padding:22px 24px 23px;margin-bottom:20px}.css-unit-entry>label{display:block;margin-bottom:9px;color:#263247;font-size:13px;font-weight:600}.css-unit-entry-row{display:grid;grid-template-columns:minmax(0,1fr) 39px 62px;align-items:center;gap:10px}.css-unit-entry-row>input{width:100%;height:98px;padding:12px;border:2px solid #dce4ee;border-radius:9px;background:#fff;color:#1f2937;font-size:20px;font-weight:650}.css-unit-clear{width:34px;height:34px;border:0;border-radius:9px;background:#f5f7fa;color:#64748b;font-size:23px;line-height:1}.css-unit-tabs{display:flex;flex-direction:column;gap:5px}.css-unit-tabs button{height:29px;border:0;border-radius:8px;background:#f5f7fa;color:#64748b;font:600 12px ui-monospace,SFMono-Regular,monospace}.css-unit-tabs button[aria-pressed=true]{background:#5d5cf4;color:#fff}.css-unit-results{display:flex;flex-direction:column;gap:8px}.css-unit-result{display:grid;grid-template-columns:minmax(0,1fr) auto 44px;align-items:center;gap:12px;min-height:62px;padding:9px 16px}.css-unit-result.is-source{border:2px solid #6563ff;box-shadow:none}.css-unit-name{display:flex;align-items:center;gap:8px;color:#1f2937;font-size:13px;font-weight:550}.css-unit-name b{padding:3px 7px;border-radius:8px;background:#f4f6fb;color:#6563ff;font-size:10px;font-weight:650}.rem-result .css-unit-name b{background:#e8f8f1;color:#10a875}.em-result .css-unit-name b{background:#fff4e6;color:#ed9200}.css-unit-result output{color:#1f2937;font:650 16px ui-monospace,SFMono-Regular,Menlo,monospace}.css-unit-result button{display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:9px;background:#f5f7fa;color:#586b86}.css-unit-result button:disabled{opacity:.4}.css-unit-more{margin-top:10px;padding:11px 13px;background:#fff;border:1px solid #dce4ee;border-radius:9px}.css-unit-more summary{cursor:pointer;color:#40536e;font-size:11px;font-weight:600}.css-unit-more summary span{margin-left:8px;color:#7a8ca6;font-weight:400}.css-unit-extra{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}.css-unit-extra .css-unit-result{min-height:48px;padding:6px 8px;grid-template-columns:minmax(0,1fr) auto 30px;gap:6px;border-radius:7px}.css-unit-extra .css-unit-name{font-size:11px}.css-unit-extra .css-unit-name b{display:none}.css-unit-extra output{font-size:11px}.css-unit-extra button{width:27px;height:27px}.css-unit-setting-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px;padding-top:11px;border-top:1px solid #edf0f5}.css-unit-setting-grid label{display:flex;flex-direction:column;gap:5px;color:#52647e;font-size:10px}.css-unit-setting-grid label span{display:flex;align-items:center;gap:5px}.css-unit-setting-grid input{width:100%;min-width:0;padding:7px;border:1px solid #dce4ee;border-radius:6px;background:#f8fafc;color:#263247}.css-unit-setting-grid i{color:#64748b;font-size:10px;font-style:normal}.css-unit-notice{min-height:15px;margin:4px 0;color:#367c55;font-size:10px}.css-unit-examples{padding:15px 16px}.css-unit-examples h2{display:flex;align-items:center;gap:7px;margin:0 0 11px;color:#536783;font-size:12px;font-weight:550}.css-unit-examples h2 svg{color:#6b7d96}.css-unit-examples>div{display:flex;flex-wrap:wrap;gap:7px}.css-unit-examples button{padding:8px 11px;border:0;border-radius:8px;background:#f5f7fa;color:#334155;font:12px ui-monospace,SFMono-Regular,Menlo,monospace}.css-unit-examples button:hover{background:#eef2ff;color:#5352d8}.css-unit-guide{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:20px}.css-unit-guide article{padding:15px 11px;text-align:center}.css-unit-guide article>span{display:grid;place-items:center;width:42px;height:42px;margin:0 auto 10px;border-radius:13px;background:#eff0ff;color:#5d5cf4;font:700 14px ui-monospace,SFMono-Regular,monospace}.css-unit-guide article:nth-child(2)>span{background:#e7f8f1;color:#10a875}.css-unit-guide article:nth-child(3)>span{background:#fff4e6;color:#ed9200}.css-unit-guide h3{margin:0 0 6px;color:#273449;font-size:12px}.css-unit-guide p{margin:0;color:#63758f;font-size:10px;line-height:1.7;overflow-wrap:anywhere}.css-unit-guide article{padding:17px 12px}.css-unit-guide h3{font-size:13px}.css-unit-guide p{color:#4b5d78;font-size:12px;line-height:1.8}@media(max-width:700px){.tool-page[data-tool=css-units]>.css-unit-content,.tool-page[data-tool=css-units]>.tool-details,.tool-page[data-tool=css-units]>.tool-intro{width:calc(100% - 28px)}.css-unit-basics{gap:9px;padding:12px;margin-bottom:14px}.css-unit-entry{padding:17px 14px;margin-bottom:14px}.css-unit-entry-row{grid-template-columns:minmax(0,1fr) 32px 54px;gap:6px}.css-unit-entry-row>input{height:85px}.css-unit-result{grid-template-columns:minmax(0,1fr) auto 36px;padding:8px 11px}.css-unit-guide{gap:7px;margin-top:15px}.css-unit-guide article{padding:12px 7px}.css-unit-guide p{font-size:9px}.css-unit-guide h3{font-size:11px}}.css-unit-faq,.css-unit-howto,.css-unit-overview{margin-top:20px;padding:22px 20px;background:#fff;border:1px solid #dce4ee;border-radius:12px;box-shadow:0 2px 4px #1f2d400e}.css-unit-faq h2,.css-unit-howto h2,.css-unit-overview h2{display:flex;align-items:center;gap:8px;margin:0;color:#1f2937;font-size:17px;line-height:1.5}.css-unit-faq h2 svg,.css-unit-howto h2 svg,.css-unit-overview h2 svg{flex:none;color:#27364e}.css-unit-rule{width:118px;height:3px;margin:12px 0 17px;border-radius:3px;background:linear-gradient(90deg,#8178ff,#dfe1ff)}.css-unit-overview>p,.css-unit-pair-note{margin:12px 0;color:#485a72;font-size:13px;line-height:1.9}.css-unit-faq code,.css-unit-howto code,.css-unit-overview code{padding:2px 4px;border-radius:4px;background:#f2f5f9;color:#344760;font:12px ui-monospace,SFMono-Regular,Menlo,monospace}.css-unit-privacy{display:flex;align-items:flex-start;gap:7px;margin-top:17px;padding:13px 14px;border-left:4px solid #20ad78;border-radius:9px;background:#f0faf6;color:#40566a;font-size:12px;line-height:1.8}.css-unit-privacy svg{flex:none;margin-top:2px;color:#40566a}.css-unit-privacy strong{flex:none}.css-unit-privacy span{min-width:0}.css-unit-steps{display:flex;flex-direction:column;gap:10px}.css-unit-steps article{display:flex;align-items:center;gap:14px;padding:14px;border:1px solid #e0e7f0;border-radius:10px;background:#fff}.css-unit-steps article>b{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:12px;background:#615cf2;color:white;font-size:18px;box-shadow:0 5px 12px #615cf233}.css-unit-steps h3{margin:0 0 5px;color:#1f2937;font-size:13px}.css-unit-steps p{margin:0;color:#63758f;font-size:12px;line-height:1.75}.css-unit-pair-note{margin:16px 0 0}.css-unit-faq{padding:20px 0 0;overflow:hidden}.css-unit-faq h2,.css-unit-faq>.css-unit-rule{margin-left:20px;margin-right:20px}.css-unit-faq .css-unit-rule{margin-bottom:15px}.css-unit-faq details{border-top:1px solid #e3e9f1}.css-unit-faq summary{position:relative;list-style:none;cursor:pointer;padding:15px 50px 15px 20px;color:#273449;font-size:13px;font-weight:600;line-height:1.6}.css-unit-faq summary::-webkit-details-marker{display:none}.css-unit-faq summary:after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:28px;height:28px;border:1px solid #dce4ee;border-radius:8px;background:#f8fafc;color:#60738d;font-size:19px;font-weight:400}.css-unit-faq details[open] summary:after{content:"−"}.css-unit-faq details p{margin:0;padding:0 20px 16px;color:#52657f;font-size:12px;line-height:1.85}@media(max-width:700px){.css-unit-howto,.css-unit-overview{margin-top:14px;padding:18px 15px}.css-unit-faq h2,.css-unit-howto h2,.css-unit-overview h2{font-size:15px}.css-unit-overview>p,.css-unit-pair-note{font-size:12px}.css-unit-privacy{flex-wrap:wrap}.css-unit-privacy strong{flex:none}.css-unit-steps article{align-items:flex-start;padding:12px;gap:11px}.css-unit-steps article>b{width:36px;height:36px;border-radius:10px}.css-unit-steps p{font-size:11px}.css-unit-faq{margin-top:14px}.css-unit-faq summary{font-size:12px;padding-left:15px}.css-unit-faq details p{padding-left:15px;padding-right:15px}}.px-em-converter h2{margin:0 0 16px;font-size:16px}.px-em-fields{display:grid;grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr);gap:10px;align-items:end}.px-em-fields label{display:flex;flex-direction:column;gap:8px;color:#485a72;font-size:12px}.px-em-fields input{width:100%;min-width:0;padding:14px 10px;border:1px solid #dce4ee;border-radius:8px;background:#f8fafc;color:#243247;font:600 19px ui-monospace,monospace}.px-em-fields>button{height:50px;border:0;border-radius:8px;background:#eeedff;color:#5755de;font-size:24px}.px-em-formula{margin:16px 0;color:#52647e;font:12px/1.8 ui-monospace,monospace;overflow-wrap:anywhere}.px-em-converter>.secondary-button{display:inline-flex;align-items:center;gap:7px}.px-em-converter .css-unit-notice{margin-bottom:0}.px-em-field+.px-em-field{margin-top:16px}.px-em-field>label{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:15px;font-weight:600;color:#263247}.px-em-field>label>span{padding:4px 8px;background:#f5f6ff;color:#6361f5;border-radius:8px;font:600 12px ui-monospace,monospace}.px-em-value{display:flex;align-items:center;gap:10px;padding:6px 9px;border:2px solid #dfe5ef;border-radius:10px;background:#f8fafc}.px-em-value.is-active{border-color:#6661ff;background:#fff;box-shadow:0 0 0 3px #eeedff}.px-em-value input{width:100%;min-width:0;height:40px;border:0;outline:0;background:transparent;text-align:center;color:#202c3d;font:650 20px ui-monospace,monospace;appearance:textfield}.px-em-value input::-webkit-inner-spin-button,.px-em-value input::-webkit-outer-spin-button{appearance:none;margin:0}.px-em-value>span{color:#64748b;font-size:15px;font-weight:600}.px-em-value>button{display:grid;place-items:center;flex:none;width:37px;height:37px;border:0;border-radius:9px;background:#f2f5f9;color:#61728d}.px-em-value input:focus-visible{outline:0}.px-em-value:focus-within{border-color:#6661ff;box-shadow:0 0 0 3px #eeedff}.px-em-common{padding:22px;background:#fff;border:1px solid #dce4ee;border-radius:12px;box-shadow:0 2px 4px #1f2d400e}.px-em-common h2{text-align:center;font-size:15px;margin:0 0 16px}.px-em-common>div{display:grid;grid-template-columns:1fr 1fr;gap:9px 14px}.px-em-common button{padding:12px 6px;border:0;border-radius:9px;background:#f7f8fb;color:#273449;font:14px ui-monospace,monospace}.px-em-common strong{color:#6861ff}.px-em-unit-info{display:flex;flex-direction:column;gap:12px;margin-top:18px}.px-em-unit-info article{display:flex;align-items:center;gap:16px;padding:18px;background:#fff;border:1px solid #dce4ee;border-radius:12px;box-shadow:0 2px 4px #1f2d400e}.px-em-unit-info article>span{display:grid;place-items:center;width:52px;height:52px;flex:none;border-radius:12px;background:#efeeff;color:#6a60fc;font:700 18px ui-monospace,monospace}.px-em-unit-info h3{font-size:14px;margin:0 0 6px}.px-em-unit-info p{font-size:12px;line-height:1.8;color:#546981;margin:0}@media(max-width:440px){.px-em-common{padding:17px 12px}.px-em-common button{font-size:12px}.px-em-unit-info article{padding:14px;gap:11px}}.px-em-base-note{display:flex;align-items:flex-start;gap:8px;margin:22px 0 28px;padding:17px 16px;border-left:4px solid #3979fa;border-radius:12px;background:linear-gradient(100deg,#eff4ff,#fafcff);color:#485a72;font-size:13px;line-height:1.9}.px-em-base-note>span{flex:none;font-size:17px}.px-em-base-note p{margin:0}.px-em-base-note code{background:transparent;padding:0}.px-em-scenarios-title{display:flex;align-items:center;gap:7px;margin:0 0 18px;font-size:16px;color:#1f2937}.px-em-scenarios{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.px-em-scenarios article{padding:22px 12px;border:1px solid #e8eaf0;border-radius:16px;text-align:center;box-shadow:0 1px 3px #1f2d4008}.px-em-scenarios article>span{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 17px;border-radius:16px;background:#ebedff;color:#6961f5}.px-em-scenarios h4{margin:0 0 11px;color:#1f2937;font-size:14px}.px-em-scenarios p{margin:0;color:#586b85;font-size:12px;line-height:1.9}@media(max-width:480px){.px-em-scenarios{grid-template-columns:1fr}.px-em-scenarios article{padding:20px}.px-em-scenarios p{font-size:13px}}.px-em-howto .css-unit-rule{margin-bottom:22px}.px-em-howto .css-unit-steps{gap:16px}.px-em-howto .css-unit-steps article{padding:20px 16px;gap:16px;border-radius:14px;box-shadow:0 3px 10px #1f2d4006}.px-em-howto .css-unit-steps article>b{width:44px;height:44px;background:linear-gradient(135deg,#6961f6,#5045e9);border-radius:14px}.px-em-howto .css-unit-steps h3{display:flex;align-items:center;gap:6px;margin-bottom:10px;font-size:14px}.px-em-howto .css-unit-steps h3 svg{flex:none}.px-em-howto .css-unit-steps p{font-size:13px;line-height:1.9;color:#586b85}.px-em-formula-note{margin:24px 0 0}.px-em-formula-note>svg{flex:none;margin-top:3px}@media(max-width:480px){.px-em-howto .css-unit-steps article{padding:16px 12px;gap:12px}.px-em-howto .css-unit-steps article>b{width:36px;height:36px;border-radius:11px}}.px-em-compare-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:22px}.px-em-compare-grid article{overflow:hidden;border:2px solid var(--compare-color);border-radius:14px}.px-em-compare-em{--compare-color:#ef4444}.px-em-compare-rem{--compare-color:#10b981}.px-em-compare-grid h3{display:flex;align-items:center;gap:8px;margin:0;padding:17px;color:#fff;background:var(--compare-color);font-size:15px}.px-em-compare-grid h3 svg{padding:3px;box-sizing:content-box;border-radius:50%;background:#ffffff30}.px-em-compare-grid article>div{padding:18px 15px}.px-em-compare-grid h4{margin:0 0 16px;color:#202c3d;font-size:15px}.px-em-compare-grid ul{display:flex;flex-direction:column;gap:13px;list-style:none;margin:0;padding:0;color:#586b85;font-size:12px;line-height:1.8}.px-em-compare-grid li{position:relative;padding-left:16px}.px-em-compare-grid li:before{content:"•";position:absolute;left:0;color:var(--compare-color);font-size:19px;line-height:1.1}.px-em-stack-note{margin:22px 0 0;border-color:#ee9709;background:linear-gradient(100deg,#fff8ed,#fffdfb)}.px-em-table-wrap{margin-top:20px;overflow-x:auto;border:1px solid #dfe6ef;border-radius:14px;box-shadow:0 5px 18px #1f2d4008}.px-em-reference table{width:100%;border-collapse:collapse;text-align:left;font-size:13px}.px-em-reference thead{color:#fff;background:linear-gradient(110deg,#6863f0,#5044e9)}.px-em-reference td,.px-em-reference th{padding:15px 12px}.px-em-reference thead th{font-weight:600;font-size:12px}.px-em-reference tbody tr+tr{border-top:1px solid #dfe6ef}.px-em-reference tbody tr:nth-child(2n){background:#fafbfe}.px-em-reference tbody th{color:#263247;font-weight:650;white-space:nowrap}.px-em-reference tbody td:nth-child(2){font-family:ui-monospace,monospace;white-space:nowrap}@media(max-width:480px){.px-em-compare-grid{grid-template-columns:1fr}.px-em-reference td,.px-em-reference th{padding:12px 9px}.px-em-reference table{font-size:12px}.px-em-reference thead th{font-size:11px}}