:root{--cnc-primary:#8b5cf6;--cnc-primary-hover:#7c3aed;--cnc-primary-light:#8b5cf61a;--cnc-primary-ring:#8b5cf633;--cnc-success:var(--main-success);--cnc-success-light:#10b9811a;--cnc-error:var(--main-error);--cnc-error-light:#ef44441a;--cnc-text:#1e293b;--cnc-text-muted:#64748b;--cnc-text-light:#94a3b8;--cnc-bg:#fff;--cnc-bg-secondary:#f8fafc;--cnc-bg-tertiary:#f1f5f9;--cnc-border:#e2e8f0;--cnc-border-focus:#8b5cf6;--cnc-z1-color:#3b82f6;--cnc-z2-color:#10b981;--cnc-result-color:#8b5cf6;--cnc-radius:var(--main-radius);--cnc-radius-lg:var(--main-radius-lg);--cnc-shadow:0 1px 3px #00000014;--cnc-shadow-lg:0 4px 12px #0000001a;--cnc-transition:.2s ease}._cnc-container{flex-direction:column;gap:1.5rem;width:100%;max-width:720px;margin:0 auto;display:flex}._cnc-hidden{display:none!important}@media (max-width:768px){._cnc-container{padding-left:1rem;padding-right:1rem}}._cnc-tabs{background:var(--cnc-bg);border-radius:var(--cnc-radius-lg);box-shadow:var(--cnc-shadow);border-style:solid;border-width:1px;border-color:var(--cnc-border);gap:.25rem;padding:.25rem;display:flex}._cnc-tab{color:var(--cnc-text-muted);border-radius:calc(var(--cnc-radius-lg) - 4px);cursor:pointer;transition:all var(--cnc-transition);background:0 0;border:none;flex:1;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1rem;font-size:.875rem;font-weight:500;display:flex}._cnc-tab:hover{color:var(--cnc-text);background:var(--cnc-bg-secondary)}._cnc-tab-active,._cnc-tab-active:hover{color:var(--cnc-primary);background:var(--cnc-primary-light)}._cnc-tab svg{flex-shrink:0}@media (max-width:480px){._cnc-tab{padding:.625rem .5rem;font-size:.8125rem}._cnc-tab span{display:none}._cnc-tab svg{width:18px;height:18px}}._cnc-input-card{background:var(--cnc-bg);border-radius:var(--cnc-radius-lg);box-shadow:var(--cnc-shadow);border-style:solid;border-width:1px;border-color:var(--cnc-border);padding:1.5rem}._cnc-input-header{justify-content:space-between;align-items:center;margin-bottom:1.25rem;display:flex}._cnc-input-title{color:var(--cnc-text);font-size:1rem;font-weight:600}._cnc-number-group{align-items:center;gap:1rem;margin-bottom:.75rem;display:flex}._cnc-number-label{width:2rem;color:var(--cnc-primary);text-align:center;flex-shrink:0;font-size:1.125rem;font-weight:600}._cnc-number-inputs{flex:1;gap:.5rem;display:flex}._cnc-input-field{background:var(--cnc-bg-secondary);border-style:solid;border-width:2px;border-color:var(--cnc-border);border-radius:var(--cnc-radius);transition:border-color var(--cnc-transition), box-shadow var(--cnc-transition);flex:1;align-items:center;display:flex;overflow:hidden}._cnc-input-field:focus-within{border-color:var(--cnc-border-focus);box-shadow:0 0 0 3px var(--cnc-primary-ring)}._cnc-input-field input{width:100%;font-size:1rem;font-family:var(--main-font-mono);color:var(--cnc-text);background:0 0;border:none;outline:none;flex:1;padding:.75rem}._cnc-input-field input::placeholder{color:var(--cnc-text-light)}._cnc-input-suffix{color:var(--cnc-text-muted);background:var(--cnc-bg-tertiary);border-left-style:solid;border-left-width:1px;border-left-color:var(--cnc-border);padding:0 .75rem;font-size:1rem;font-weight:500}._cnc-operation-symbol{width:2.5rem;height:2.5rem;color:var(--cnc-primary);background:var(--cnc-primary-light);border-radius:50%;justify-content:center;align-items:center;margin:.5rem auto;font-size:1.25rem;font-weight:600;display:flex}._cnc-settings-row{background:var(--cnc-bg-secondary);border-radius:var(--cnc-radius);align-items:center;gap:1.5rem;margin:1.25rem 0;padding:1rem;display:flex}._cnc-setting{align-items:center;gap:.5rem;display:flex}._cnc-setting label{color:var(--cnc-text-muted);font-size:.875rem;font-weight:500}._cnc-setting select{color:var(--cnc-text);background:var(--cnc-bg);border-style:solid;border-width:1px;border-color:var(--cnc-border);border-radius:var(--cnc-radius);cursor:pointer;padding:.375rem .75rem;font-size:.875rem}._cnc-toggle-group{background:var(--cnc-bg);border-radius:var(--cnc-radius);border-style:solid;border-width:1px;border-color:var(--cnc-border);gap:.25rem;padding:.125rem;display:flex}._cnc-toggle{color:var(--cnc-text-muted);border-radius:calc(var(--cnc-radius) - 2px);cursor:pointer;transition:all var(--cnc-transition);background:0 0;border:none;padding:.375rem .625rem;font-size:.8125rem;font-weight:500}._cnc-toggle:hover{color:var(--cnc-text)}._cnc-toggle-active{color:var(--cnc-primary);background:var(--cnc-primary-light)}._cnc-btn{border-radius:var(--cnc-radius);cursor:pointer;transition:color var(--cnc-transition), background var(--cnc-transition), box-shadow var(--cnc-transition), opacity var(--cnc-transition);border:none;justify-content:center;align-items:center;gap:.5rem;padding:.625rem 1rem;font-size:.875rem;font-weight:500;display:inline-flex}._cnc-btn-icon{color:var(--cnc-text-muted);background:0 0;padding:.5rem}._cnc-btn-icon:hover{color:var(--cnc-text);background:var(--cnc-bg-tertiary)}._cnc-btn-primary{color:#fff;background:var(--cnc-primary);width:100%;padding:.875rem 1.5rem;font-size:1rem;box-shadow:0 2px 8px #8b5cf64d}._cnc-btn-primary:hover{background:var(--cnc-primary-hover)}._cnc-btn-primary:active{box-shadow:0 1px 4px #8b5cf64d}._cnc-examples{margin-top:1rem}._cnc-examples-toggle{color:var(--cnc-text-muted);cursor:pointer;transition:color var(--cnc-transition);background:0 0;border:none;align-items:center;gap:.5rem;padding:.5rem 0;font-size:.875rem;font-weight:500;display:flex}._cnc-examples-toggle:hover{color:var(--cnc-text)}._cnc-examples-toggle svg:last-child{transition:transform var(--cnc-transition)}._cnc-examples-toggle.active svg:last-child{transform:rotate(180deg)}._cnc-examples-list{border-top-style:dashed;border-top-width:1px;border-top-color:var(--cnc-border);flex-wrap:wrap;gap:.5rem;margin-top:.75rem;padding-top:.75rem;display:flex}._cnc-example-btn{font-size:.8125rem;font-family:var(--main-font-mono);color:var(--cnc-text-muted);background:var(--cnc-bg-secondary);border-style:solid;border-width:1px;border-color:var(--cnc-border);border-radius:var(--cnc-radius);cursor:pointer;transition:all var(--cnc-transition);padding:.5rem .75rem}._cnc-example-btn:hover{color:var(--cnc-primary);border-color:var(--cnc-primary);background:var(--cnc-primary-light)}@media (max-width:480px){._cnc-input-card{padding:1rem}._cnc-number-group{flex-direction:column;align-items:flex-start;gap:.5rem}._cnc-number-label{width:auto}._cnc-number-inputs{width:100%}._cnc-settings-row{flex-direction:column;align-items:flex-start;gap:.75rem}._cnc-input-field input{padding:.625rem;font-size:.9375rem}}._cnc-result-section{min-height:200px}._cnc-empty-state{min-height:200px;color:var(--cnc-text-light);background:var(--cnc-bg);border-radius:var(--cnc-radius-lg);border-style:dashed;border-width:2px;border-color:var(--cnc-border);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:2rem;display:flex}._cnc-empty-state svg{opacity:.5}._cnc-empty-state span{font-size:.9375rem}._cnc-result-card{background:var(--cnc-bg);border-radius:var(--cnc-radius-lg);box-shadow:var(--cnc-shadow);border-style:solid;border-width:1px;border-color:var(--cnc-border);padding:1.5rem}._cnc-result-primary{border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--cnc-border);margin-bottom:1.25rem;padding-bottom:1.25rem}._cnc-result-header{justify-content:space-between;align-items:center;margin-bottom:.75rem;display:flex}._cnc-result-label{color:var(--cnc-primary);text-transform:uppercase;letter-spacing:.05em;font-size:.875rem;font-weight:600}._cnc-copy-btn{position:relative}._cnc-copy-btn.copied{color:var(--cnc-success)}._cnc-result-value{font-size:1.75rem;font-weight:700;font-family:var(--main-font-mono);color:var(--cnc-text);text-align:center;background:var(--cnc-bg-secondary);border-radius:var(--cnc-radius);padding:1rem}._cnc-result-forms{border-bottom-style:dashed;border-bottom-width:1px;border-bottom-color:var(--cnc-border);flex-direction:column;gap:.75rem;margin-bottom:1.25rem;padding-bottom:1.25rem;display:flex}._cnc-form-item{background:var(--cnc-bg-secondary);border-radius:var(--cnc-radius);justify-content:space-between;align-items:center;padding:.625rem .875rem;display:flex}._cnc-form-label{color:var(--cnc-text-muted);font-size:.8125rem;font-weight:500}._cnc-form-value{font-size:.9375rem;font-family:var(--main-font-mono);color:var(--cnc-text)}._cnc-properties{grid-template-columns:repeat(3,1fr);gap:.75rem;display:grid}._cnc-property{background:var(--cnc-bg-secondary);border-radius:var(--cnc-radius);flex-direction:column;align-items:center;gap:.375rem;padding:.875rem;display:flex}._cnc-property-label{color:var(--cnc-primary);font-size:.8125rem;font-weight:600}._cnc-property-value{font-size:.9375rem;font-family:var(--main-font-mono);color:var(--cnc-text)}._cnc-error{background:var(--cnc-error-light);border-radius:var(--cnc-radius-lg);border:1px solid #ef444433;align-items:flex-start;gap:.75rem;padding:1rem 1.25rem;display:flex}._cnc-error-icon{color:var(--cnc-error);flex-shrink:0}._cnc-error-message{color:var(--cnc-error);font-size:.9375rem}@media (max-width:480px){._cnc-result-card{padding:1rem}._cnc-result-value{padding:.75rem;font-size:1.375rem}._cnc-properties{grid-template-columns:1fr}._cnc-property{flex-direction:row;justify-content:space-between}}._cnc-diagram{background:var(--cnc-bg);border-radius:var(--cnc-radius-lg);box-shadow:var(--cnc-shadow);border-style:solid;border-width:1px;border-color:var(--cnc-border);margin-top:1rem;overflow:hidden}._cnc-diagram-header{background:var(--cnc-bg-secondary);border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--cnc-border);justify-content:space-between;align-items:center;padding:1rem 1.25rem;display:flex}._cnc-diagram-title{color:var(--cnc-text);align-items:center;gap:.5rem;font-size:.9375rem;font-weight:600;display:flex}._cnc-diagram-title svg{color:var(--cnc-primary)}._cnc-diagram-canvas-wrapper{background:var(--cnc-bg);justify-content:center;padding:1rem;display:flex}#_cnc-canvas{border-radius:var(--cnc-radius);max-width:100%;height:auto}._cnc-diagram-legend{background:var(--cnc-bg-secondary);border-top-style:solid;border-top-width:1px;border-top-color:var(--cnc-border);justify-content:center;gap:1.5rem;padding:.75rem 1rem;display:flex}._cnc-legend-item{color:var(--cnc-text-muted);align-items:center;gap:.375rem;font-size:.8125rem;font-weight:500;display:flex}._cnc-legend-item:before{content:"";border-radius:50%;width:10px;height:10px;display:inline-block}._cnc-legend-z1:before{background:var(--cnc-z1-color)}._cnc-legend-z2:before{background:var(--cnc-z2-color)}._cnc-legend-result:before{background:var(--cnc-result-color)}._cnc-diagram.collapsed ._cnc-diagram-canvas-wrapper,._cnc-diagram.collapsed ._cnc-diagram-legend{display:none}._cnc-diagram.collapsed ._cnc-diagram-header{border-bottom:none}@media (max-width:480px){._cnc-diagram-canvas-wrapper{padding:.75rem}._cnc-diagram-legend{flex-wrap:wrap;gap:1rem}}