:root{--vc-primary:#6366f1;--vc-primary-hover:#4f46e5;--vc-primary-light:#6366f114;--vc-primary-soft:#6366f126;--vc-vector-a:#3b82f6;--vc-vector-a-light:#3b82f626;--vc-vector-b:#ef4444;--vc-vector-b-light:#ef444426;--vc-vector-result:#8b5cf6;--vc-vector-result-light:#8b5cf626;--vc-text:#1e293b;--vc-text-muted:#64748b;--vc-text-light:#94a3b8;--vc-bg:#fff;--vc-bg-secondary:#f8fafc;--vc-bg-tertiary:#f1f5f9;--vc-border:#e2e8f0;--vc-border-light:#f1f5f9;--vc-border-focus:var(--vc-primary);--vc-input-bg:#fff;--vc-success:#10b981;--vc-success-light:#10b98114;--vc-radius:8px;--vc-radius-lg:12px;--vc-radius-xl:16px;--vc-shadow:0 1px 2px #0000000a, 0 1px 3px #00000008;--vc-shadow-md:0 4px 6px #0000000a, 0 2px 4px #00000005;--vc-shadow-lg:0 10px 25px #0000000f, 0 4px 10px #00000008;--vc-transition:.2s cubic-bezier(.4, 0, .2, 1);--vc-transition-fast:.15s cubic-bezier(.4, 0, .2, 1)}._vc-container{gap:var(--main-space-5);flex-direction:column;max-width:1100px;margin:0 auto;display:flex}._vc-main{gap:var(--main-space-5);grid-template-columns:1fr 1fr;align-items:start;display:grid}._vc-left,._vc-right{gap:var(--main-space-4);flex-direction:column;display:flex}._vc-hidden{display:none!important}._vc-dimension-bar{justify-content:center;align-items:center;gap:var(--main-space-3);padding:var(--main-space-3) var(--main-space-4);background:var(--vc-bg);border-radius:var(--vc-radius-lg);border-style:solid;border-width:1px;border-color:var(--vc-border);box-shadow:var(--vc-shadow);display:flex}._vc-dimension-label{font-size:var(--main-text-sm);color:var(--vc-text-muted);font-weight:500}._vc-dimension-toggle{background:var(--vc-bg-tertiary);border-radius:var(--vc-radius);gap:2px;padding:3px;display:flex}._vc-dim-btn{padding:var(--main-space-2) var(--main-space-4);font-size:var(--main-text-sm);color:var(--vc-text-muted);border-radius:calc(var(--vc-radius) - 2px);cursor:pointer;transition:var(--vc-transition);background:0 0;border:none;font-weight:600}._vc-dim-btn:hover{color:var(--vc-text)}._vc-dim-btn-active{color:var(--vc-primary);background:var(--vc-bg);box-shadow:var(--vc-shadow)}@media (max-width:900px){._vc-main{grid-template-columns:1fr}._vc-right{order:-1}}@media (max-width:768px){._vc-container{gap:var(--main-space-4);padding-left:1rem;padding-right:1rem}}._vc-input-section{gap:var(--main-space-3);flex-direction:column;display:flex}._vc-vector-card{background:var(--vc-bg);border-radius:var(--vc-radius-lg);border-style:solid;border-width:1px;border-color:var(--vc-border);box-shadow:var(--vc-shadow);padding:var(--main-space-4)}._vc-vector-header{align-items:center;gap:var(--main-space-2);margin-bottom:var(--main-space-3);display:flex}._vc-vector-label{width:28px;height:28px;font-size:var(--main-text-base);color:#fff;background:var(--vc-vector-a);border-radius:var(--vc-radius);justify-content:center;align-items:center;font-weight:700;display:inline-flex}._vc-vector-label-b{background:var(--vc-vector-b)}._vc-vector-notation{font-size:var(--main-text-sm);color:var(--vc-text-muted);font-family:var(--main-font-mono)}._vc-vector-inputs{gap:var(--main-space-3);display:flex}._vc-input-group{gap:var(--main-space-1);flex-direction:column;flex:1;display:flex}._vc-input-label{font-size:var(--main-text-xs);color:var(--vc-text-muted);text-transform:uppercase;letter-spacing:.05em;font-weight:600}._vc-input{width:100%;padding:var(--main-space-3);font-size:var(--main-text-base);font-weight:500;font-family:var(--main-font-mono);color:var(--vc-text);background:var(--vc-input-bg);border-style:solid;border-width:1.5px;border-color:var(--vc-border);border-radius:var(--vc-radius);text-align:center;transition:var(--vc-transition)}._vc-input:hover{border-color:var(--vc-text-light)}._vc-input:focus{border-color:var(--vc-primary);box-shadow:0 0 0 3px var(--vc-primary-light);outline:none}._vc-vector-info{align-items:center;gap:var(--main-space-2);margin-top:var(--main-space-3);padding-top:var(--main-space-3);border-top-style:dashed;border-top-width:1px;border-top-color:var(--vc-border);display:flex}._vc-magnitude-label{font-size:var(--main-text-sm);color:var(--vc-text-muted)}._vc-magnitude-value{font-size:var(--main-text-sm);font-weight:600;font-family:var(--main-font-mono);color:var(--vc-text)}._vc-scalar-card{background:var(--vc-bg);border-radius:var(--vc-radius-lg);border-style:solid;border-width:1px;border-color:var(--vc-border);box-shadow:var(--vc-shadow);padding:var(--main-space-4)}._vc-scalar-header{align-items:center;gap:var(--main-space-2);margin-bottom:var(--main-space-3);display:flex}._vc-scalar-label{width:28px;height:28px;font-size:var(--main-text-base);color:#fff;background:var(--vc-primary);border-radius:var(--vc-radius);justify-content:center;align-items:center;font-style:italic;font-weight:700;display:inline-flex}._vc-scalar-desc{font-size:var(--main-text-sm);color:var(--vc-text-muted)}._vc-scalar-input-wrap{margin-bottom:var(--main-space-3)}._vc-scalar-input{max-width:120px}._vc-scalar-presets{gap:var(--main-space-2);flex-wrap:wrap;display:flex}._vc-scalar-preset{padding:var(--main-space-2) var(--main-space-3);font-size:var(--main-text-sm);font-weight:500;font-family:var(--main-font-mono);color:var(--vc-text-muted);background:var(--vc-bg-secondary);border-radius:var(--vc-radius);cursor:pointer;transition:var(--vc-transition);border:none}._vc-scalar-preset:hover{color:var(--vc-text);background:var(--vc-bg-tertiary)}._vc-scalar-preset-active{color:var(--vc-primary);background:var(--vc-primary-light)}@media (max-width:480px){._vc-vector-inputs{flex-wrap:wrap}._vc-input-group{min-width:calc(50% - var(--main-space-2))}._vc-input-z{flex:0 0 100%}}._vc-operations{gap:var(--main-space-3);flex-direction:column;display:flex}._vc-op-group{background:var(--vc-bg);border-radius:var(--vc-radius-lg);border-style:solid;border-width:1px;border-color:var(--vc-border);box-shadow:var(--vc-shadow);padding:var(--main-space-4)}._vc-op-group-label{font-size:var(--main-text-xs);color:var(--vc-text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--main-space-3);font-weight:600;display:block}._vc-op-btns{gap:var(--main-space-2);flex-wrap:wrap;display:flex}._vc-op-btn{padding:var(--main-space-2) var(--main-space-3);font-size:var(--main-text-sm);color:var(--vc-text);background:var(--vc-bg-secondary);border-style:solid;border-width:1px;border-color:var(--vc-border);border-radius:var(--vc-radius);cursor:pointer;transition:var(--vc-transition);white-space:nowrap;font-weight:500}._vc-op-btn:hover{background:var(--vc-bg-tertiary);border-color:var(--vc-text-light)}._vc-op-btn-active{color:#fff;background:var(--vc-primary);border-color:var(--vc-primary)}._vc-op-btn-active:hover{background:var(--vc-primary-hover);border-color:var(--vc-primary-hover)}._vc-op-btn sub{vertical-align:sub;font-size:.7em}@media (max-width:480px){._vc-op-btn{min-width:calc(33.333% - var(--main-space-2));text-align:center;flex:1;justify-content:center}}._vc-viz-card{background:var(--vc-bg);border-radius:var(--vc-radius-lg);border-style:solid;border-width:1px;border-color:var(--vc-border);box-shadow:var(--vc-shadow);overflow:hidden}._vc-viz-header{padding:var(--main-space-3) var(--main-space-4);border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--vc-border);justify-content:space-between;align-items:center;display:flex}._vc-viz-title{font-size:var(--main-text-sm);color:var(--vc-text);font-weight:600}._vc-viz-legend{gap:var(--main-space-3);display:flex}._vc-legend-item{align-items:center;gap:var(--main-space-1);font-size:var(--main-text-xs);color:var(--vc-text-muted);font-weight:500;display:flex}._vc-legend-dot{border-radius:50%;width:10px;height:10px}._vc-legend-a ._vc-legend-dot{background:var(--vc-vector-a)}._vc-legend-b ._vc-legend-dot{background:var(--vc-vector-b)}._vc-legend-result ._vc-legend-dot{background:var(--vc-vector-result)}._vc-canvas-wrap{padding:var(--main-space-2);background:var(--vc-bg-secondary);justify-content:center;align-items:center;min-height:320px;display:flex}#_vc-canvas{max-width:100%;height:auto}._vc-viz-controls{justify-content:center;gap:var(--main-space-2);padding:var(--main-space-3);border-top-style:solid;border-top-width:1px;border-top-color:var(--vc-border);display:flex}._vc-viz-btn{width:32px;height:32px;color:var(--vc-text-muted);background:var(--vc-bg-secondary);border-radius:var(--vc-radius);cursor:pointer;transition:var(--vc-transition);border:none;justify-content:center;align-items:center;display:flex}._vc-viz-btn:hover{color:var(--vc-text);background:var(--vc-bg-tertiary)}@media (max-width:480px){._vc-viz-header{gap:var(--main-space-2);flex-direction:column;align-items:flex-start}._vc-canvas-wrap{min-height:280px}}._vc-result-card{background:var(--vc-bg);border-radius:var(--vc-radius-lg);border-style:solid;border-width:1px;border-color:var(--vc-border);box-shadow:var(--vc-shadow);overflow:hidden}._vc-result-header{padding:var(--main-space-3) var(--main-space-4);background:var(--vc-bg-secondary);border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--vc-border);justify-content:space-between;align-items:center;display:flex}._vc-result-title{font-size:var(--main-text-sm);color:var(--vc-text);font-weight:600;font-family:var(--main-font-mono)}._vc-copy-btn{width:32px;height:32px;color:var(--vc-text-muted);background:var(--vc-bg);border-style:solid;border-width:1px;border-color:var(--vc-border);border-radius:var(--vc-radius);cursor:pointer;transition:var(--vc-transition);justify-content:center;align-items:center;display:flex}._vc-copy-btn:hover{color:var(--vc-primary);border-color:var(--vc-primary)}._vc-result-value{padding:var(--main-space-5) var(--main-space-4);text-align:center}._vc-result-vector{font-size:var(--main-text-2xl);font-weight:700;font-family:var(--main-font-mono);color:var(--vc-vector-result)}._vc-result-scalar{font-size:var(--main-text-3xl);font-weight:700;font-family:var(--main-font-mono);background:linear-gradient(135deg, var(--vc-primary), var(--vc-vector-result));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}._vc-result-angle{gap:var(--main-space-2);flex-direction:column;align-items:center;display:flex}._vc-result-angle-primary{font-size:var(--main-text-2xl);font-weight:700;font-family:var(--main-font-mono);color:var(--vc-vector-result)}._vc-result-angle-secondary{font-size:var(--main-text-sm);color:var(--vc-text-muted);font-family:var(--main-font-mono)}._vc-result-details{padding:0 var(--main-space-4) var(--main-space-4)}._vc-result-detail-row{justify-content:center;gap:var(--main-space-4);padding:var(--main-space-2) 0;font-size:var(--main-text-sm);color:var(--vc-text-muted);display:flex}._vc-result-detail-row span{font-family:var(--main-font-mono)}._vc-result-detail-row strong{color:var(--vc-text)}._vc-formula-section{border-top-style:solid;border-top-width:1px;border-top-color:var(--vc-border)}._vc-formula-toggle{justify-content:center;align-items:center;gap:var(--main-space-2);width:100%;padding:var(--main-space-3);font-size:var(--main-text-sm);color:var(--vc-text-muted);cursor:pointer;transition:var(--vc-transition);background:0 0;border:none;display:flex}._vc-formula-toggle:hover{color:var(--vc-text);background:var(--vc-bg-secondary)}._vc-formula-toggle svg{transition:var(--vc-transition)}._vc-formula-toggle.active svg{transform:rotate(180deg)}._vc-formula-content{padding:var(--main-space-4);background:var(--vc-bg-secondary);border-top-style:solid;border-top-width:1px;border-top-color:var(--vc-border)}._vc-formula{padding:var(--main-space-3);margin-bottom:var(--main-space-3);font-family:var(--main-font-mono);font-size:var(--main-text-sm);color:var(--vc-text);background:var(--vc-bg);border-radius:var(--vc-radius);border-style:dashed;border-width:1px;border-color:var(--vc-border);text-align:center}._vc-steps{gap:var(--main-space-2);flex-direction:column;display:flex}._vc-step{align-items:flex-start;gap:var(--main-space-2);padding:var(--main-space-2);font-size:var(--main-text-sm);color:var(--vc-text-muted);background:var(--vc-bg);border-radius:var(--vc-radius);display:flex}._vc-step-num{min-width:20px;height:20px;font-size:var(--main-text-xs);color:#fff;background:var(--vc-primary);border-radius:50%;justify-content:center;align-items:center;font-weight:600;display:inline-flex}._vc-step-text{font-family:var(--main-font-mono);flex:1}@media (max-width:480px){._vc-result-vector{font-size:var(--main-text-xl)}._vc-result-scalar{font-size:var(--main-text-2xl)}}
