:root{--cpc-primary:#7c3aed;--cpc-primary-light:#f5f3ff;--cpc-primary-hover:#6d28d9;--cpc-text:#1e293b;--cpc-text-secondary:#475569;--cpc-text-muted:#64748b;--cpc-bg:#fff;--cpc-bg-secondary:#f8fafc;--cpc-border:#e2e8f0;--cpc-border-light:#f1f5f9;--cpc-shadow-sm:0 1px 3px #0000000f, 0 1px 2px #0000000a;--cpc-shadow:0 2px 8px #0000000f, 0 1px 4px #0000000a;--cpc-radius:var(--main-radius,.5rem);--cpc-radius-lg:var(--main-radius-lg,.75rem);--cpc-font-mono:var(--main-font-mono,"SF Mono", "Fira Code", monospace);--cpc-transition:.2s ease}._cpc-container{gap:var(--main-space-4,1rem);flex-direction:column;max-width:540px;margin:0 auto;display:flex}._cpc-hidden{display:none!important}._cpc-main-card{background:var(--cpc-bg);border-radius:var(--cpc-radius-lg);padding:var(--main-space-5,1.25rem);box-shadow:var(--cpc-shadow-sm);border-style:solid;border-width:1px;border-color:var(--cpc-border);gap:var(--main-space-5,1.25rem);flex-direction:column;display:flex}._cpc-mono{font-family:var(--cpc-font-mono);font-size:.875rem}@media (max-width:768px){._cpc-container{padding-left:1rem;padding-right:1rem}}@media (max-width:480px){._cpc-container{gap:var(--main-space-3,.75rem);padding-left:.75rem;padding-right:.75rem}._cpc-main-card{padding:var(--main-space-4,1rem);gap:var(--main-space-4,1rem)}}._cpc-tabs{background:var(--cpc-bg);border-radius:var(--cpc-radius-lg);box-shadow:var(--cpc-shadow-sm);border-style:solid;border-width:1px;border-color:var(--cpc-border);gap:.5rem;padding:.375rem;display:flex}._cpc-tab{border-radius:var(--cpc-radius);cursor:pointer;transition:var(--cpc-transition);color:var(--cpc-text-secondary);background:0 0;border:none;flex-direction:column;flex:1;align-items:center;gap:.25rem;padding:.75rem 1rem;font-size:.875rem;font-weight:500;display:flex}._cpc-tab:hover:not(._cpc-tab-active){background:var(--cpc-bg-secondary)}._cpc-tab-active{background:var(--cpc-primary);color:#fff;box-shadow:0 2px 8px #7c3aed40}._cpc-tab-formula{font-family:var(--cpc-font-mono);font-size:1rem;font-weight:600}@media (max-width:480px){._cpc-tab{padding:.625rem .75rem;font-size:.8125rem}._cpc-tab-formula{font-size:.9375rem}}._cpc-input-section{gap:var(--main-space-3,.75rem);flex-direction:column;display:flex}._cpc-input-row{gap:var(--main-space-4,1rem);grid-template-columns:1fr 1fr;display:grid}._cpc-input-group{flex-direction:column;gap:.375rem;display:flex}._cpc-input-label{color:var(--cpc-text-secondary);font-size:.8125rem;font-weight:500}._cpc-input{width:100%;font-size:1.125rem;font-family:var(--cpc-font-mono);color:var(--cpc-text);background:var(--cpc-bg-secondary);border-style:solid;border-width:1.5px;border-color:var(--cpc-border);border-radius:var(--cpc-radius);transition:var(--cpc-transition);text-align:center;padding:.75rem 1rem;font-weight:500}._cpc-input:focus{border-color:var(--cpc-primary);background:var(--cpc-bg);outline:none;box-shadow:0 0 0 3px #7c3aed1a}._cpc-input::placeholder{color:var(--cpc-text-muted)}._cpc-validation{color:#dc2626;min-height:1.25rem;font-size:.8125rem}._cpc-validation:empty{display:none}@media (max-width:480px){._cpc-input-row{gap:var(--main-space-3,.75rem)}._cpc-input{padding:.625rem .75rem;font-size:16px}._cpc-input-label{font-size:.75rem}}._cpc-result-section{gap:var(--main-space-3,.75rem);flex-direction:column;display:flex}._cpc-result-card{background:linear-gradient(135deg, var(--cpc-primary-light) 0%, #ede9fe 100%);border-radius:var(--cpc-radius-lg);padding:var(--main-space-5,1.25rem);text-align:center;border:1px solid #7c3aed26;overflow:hidden}._cpc-result-label{font-family:var(--cpc-font-mono);color:var(--cpc-primary);margin-bottom:.5rem;font-size:1rem;font-weight:500}._cpc-result-value{font-family:var(--cpc-font-mono);color:var(--cpc-text);word-break:break-all;font-size:2.5rem;font-weight:700;line-height:1.2}._cpc-formula-box{background:var(--cpc-bg-secondary);border-radius:var(--cpc-radius);padding:var(--main-space-3,.75rem) var(--main-space-4,1rem);border-style:dashed;border-width:1px;border-color:var(--cpc-border)}._cpc-formula-title{color:var(--cpc-text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.25rem;font-size:.75rem;font-weight:500}._cpc-formula-text{font-family:var(--cpc-font-mono);color:var(--cpc-text-secondary);word-break:break-word;overflow-wrap:anywhere;font-size:.9375rem}@media (max-width:480px){._cpc-result-card{padding:var(--main-space-4,1rem)}._cpc-result-value{font-size:1.75rem}._cpc-result-label{font-size:.9375rem}._cpc-formula-text{font-size:.8125rem}._cpc-formula-box{padding:var(--main-space-3,.75rem)}}@media (max-width:360px){._cpc-result-value{font-size:1.5rem}}._cpc-steps-section{border-top-style:solid;border-top-width:1px;border-top-color:var(--cpc-border-light);padding-top:var(--main-space-4,1rem)}._cpc-steps-toggle{cursor:pointer;width:100%;color:var(--cpc-text-secondary);transition:var(--cpc-transition);background:0 0;border:none;align-items:center;gap:.5rem;padding:.5rem 0;font-size:.875rem;font-weight:500;display:flex}._cpc-steps-toggle:hover{color:var(--cpc-primary)}._cpc-steps-toggle svg{transition:opacity .2s}._cpc-steps-toggle.active svg{opacity:.85}._cpc-steps-content{margin-top:var(--main-space-3,.75rem);padding:var(--main-space-4,1rem);background:var(--cpc-bg-secondary);border-radius:var(--cpc-radius);border-style:solid;border-width:1px;border-color:var(--cpc-border-light);overflow-x:auto}._cpc-step{color:var(--cpc-text-secondary);gap:.75rem;min-width:0;padding:.5rem 0;font-size:.875rem;display:flex}._cpc-step:not(:last-child){border-bottom-style:dashed;border-bottom-width:1px;border-bottom-color:var(--cpc-border-light)}._cpc-step-num{background:var(--cpc-primary-light);width:1.5rem;height:1.5rem;color:var(--cpc-primary);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.75rem;font-weight:600;display:flex}._cpc-step-text{min-width:0;font-family:var(--cpc-font-mono);word-break:break-word;overflow-wrap:anywhere;flex:1;line-height:1.5}._cpc-step-highlight{color:var(--cpc-primary);font-weight:600}._cpc-text-muted{color:var(--cpc-text-muted);font-size:.8125rem}@media (max-width:480px){._cpc-steps-content{padding:var(--main-space-3,.75rem)}._cpc-step{gap:.5rem;font-size:.8125rem}._cpc-step-num{width:1.25rem;height:1.25rem;font-size:.6875rem}}._cpc-reference-section{border-top-style:solid;border-top-width:1px;border-top-color:var(--cpc-border-light);padding-top:var(--main-space-4,1rem)}._cpc-reference-toggle{cursor:pointer;width:100%;color:var(--cpc-text-secondary);transition:var(--cpc-transition);background:0 0;border:none;align-items:center;gap:.5rem;padding:.5rem 0;font-size:.875rem;font-weight:500;display:flex}._cpc-reference-toggle:hover{color:var(--cpc-primary)}._cpc-reference-toggle svg{transition:opacity .2s}._cpc-reference-toggle.active svg{opacity:.85}._cpc-reference-content{margin-top:var(--main-space-3,.75rem);gap:var(--main-space-3,.75rem);flex-direction:column;display:flex}._cpc-reference-table{background:var(--cpc-bg-secondary);border-radius:var(--cpc-radius);border-style:solid;border-width:1px;border-color:var(--cpc-border-light);flex-direction:column;display:flex;overflow:hidden}._cpc-reference-row{grid-template-columns:1fr 1.2fr 1.2fr;gap:.5rem;display:grid}._cpc-reference-row>div{color:var(--cpc-text-secondary);word-break:break-word;overflow-wrap:anywhere;min-width:0;padding:.625rem .75rem;font-size:.8125rem}._cpc-reference-header{background:var(--cpc-primary-light)}._cpc-reference-header>div{color:var(--cpc-primary);font-weight:600}._cpc-reference-row:not(._cpc-reference-header):not(:last-child){border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--cpc-border-light)}._cpc-reference-label{font-weight:500;color:var(--cpc-text)!important}._cpc-reference-note{color:var(--cpc-text-secondary);background:var(--cpc-primary-light);border-radius:var(--cpc-radius);padding:.75rem;font-size:.8125rem}@media (max-width:480px){._cpc-reference-row{grid-template-columns:.85fr 1fr 1fr;gap:.25rem}._cpc-reference-row>div{padding:.5rem .375rem;font-size:.75rem}._cpc-reference-note{padding:.625rem;font-size:.75rem}}@media (max-width:360px){._cpc-reference-row{grid-template-columns:.75fr 1fr 1fr}._cpc-reference-row>div{padding:.5rem .25rem;font-size:.6875rem}}
