:root{--space-xs:4px;--space-sm:8px;--space-md:12px;--space-lg:16px;--space-xl:20px;--space-2xl:24px;--space-3xl:32px;--space-4xl:40px;--space-5xl:48px;--space-6xl:64px;--space-7xl:80px;--font-ui:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;--font-mono:'JetBrains Mono','SF Mono','Fira Code',monospace;--text-xs:12px;--text-sm:clamp(13px, 12px + 0.25vw, 14px);--text-base:clamp(15px, 14px + 0.25vw, 16px);--text-md:clamp(16px, 15px + 0.25vw, 18px);--text-lg:clamp(18px, 17px + 0.25vw, 20px);--text-xl:clamp(20px, 18px + 0.5vw, 24px);--text-2xl:clamp(24px, 22px + 0.75vw, 30px);--text-3xl:clamp(28px, 24px + 1.25vw, 40px);--text-4xl:clamp(36px, 30px + 2vw, 52px);--mono-sm:14px;--mono-base:16px;--mono-lg:20px;--mono-xl:24px;--mono-2xl:28px;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--weight-extrabold:800;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-full:9999px;--ease-default:cubic-bezier(0.4, 0, 0.2, 1);--ease-in:cubic-bezier(0.4, 0, 1, 1);--ease-out:cubic-bezier(0, 0, 0.2, 1);--ease-spring:cubic-bezier(0.34, 1.56, 0.64, 1);--ease-smooth:cubic-bezier(0.25, 0.1, 0.25, 1);--transition-fast:150ms var(--ease-default);--transition-normal:250ms var(--ease-default);--transition-slow:400ms var(--ease-smooth);--shadow-sm:0 1px 2px rgba(0, 0, 0, 0.3);--shadow-md:0 4px 12px rgba(0, 0, 0, 0.25);--shadow-lg:0 8px 30px rgba(0, 0, 0, 0.35);--shadow-glow:0 0 15px rgba(59, 130, 246, 0.25);--color-success:#22c55e;--color-warning:#f59e0b;--color-danger:#ef4444;--color-info:#3b82f6;--bg-primary:#080b14;--bg-secondary:#0f1420;--bg-tertiary:#161d2e;--bg-hover:#1c2540;--bg-result:rgba(255, 255, 255, 0.02);--bg-error:rgba(239, 68, 68, 0.05);--surface-glass:rgba(255, 255, 255, 0.04);--border-subtle:rgba(255, 255, 255, 0.06);--border-default:rgba(255, 255, 255, 0.10);--border-strong:rgba(255, 255, 255, 0.18);--border-focus:#3b82f6;--text-primary:#f1f5f9;--text-secondary:#94a3b8;--text-muted:#64748b;--text-inverse:#0f172a;--accent-voltage:#facc15;--accent-current:#22d3ee;--accent-resistance:#34d399;--accent-power:#fb923c;--accent-primary:#3b82f6}.theme-light{--bg-primary:#f8fafc;--bg-secondary:#ffffff;--bg-tertiary:#f1f5f9;--bg-hover:#e2e8f0;--bg-result:rgba(0, 0, 0, 0.01);--bg-error:rgba(239, 68, 68, 0.03);--surface-glass:rgba(0, 0, 0, 0.02);--border-subtle:rgba(0, 0, 0, 0.06);--border-default:rgba(0, 0, 0, 0.10);--border-strong:rgba(0, 0, 0, 0.18);--border-focus:#3b82f6;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#94a3b8;--text-inverse:#ffffff;--accent-voltage:#ca8a04;--accent-current:#0891b2;--accent-resistance:#059669;--accent-power:#ea580c;--accent-primary:#1d4ed8;--shadow-sm:0 1px 2px rgba(0, 0, 0, 0.05);--shadow-md:0 4px 12px rgba(0, 0, 0, 0.08);--shadow-lg:0 8px 30px rgba(0, 0, 0, 0.12);--shadow-glow:0 0 15px rgba(29, 78, 216, 0.15)}.site-header{position:sticky;top:0;height:64px;background-color:var(--bg-primary);border-bottom:1px solid var(--border-subtle);z-index:100;display:flex;align-items:center;transition:background-color var(--transition-normal),border-color var(--transition-normal)}.site-header.scrolled{backdrop-filter:blur(12px);background-color:var(--surface-glass)}.header-container{display:flex;align-items:center;justify-content:space-between;width:100%}.brand{display:flex;align-items:center;gap:var(--space-sm);text-decoration:none;color:var(--text-primary)}.brand-logo{color:var(--accent-primary);font-weight:var(--weight-extrabold);font-size:var(--text-lg);display:flex;align-items:center;gap:var(--space-xs)}.brand-logo svg{width:20px;height:20px;stroke-width:2px}.brand-text{font-weight:var(--weight-bold);font-size:var(--text-base);letter-spacing:-.02em}.main-nav{display:flex;align-items:center;gap:var(--space-xl)}.nav-list{display:flex;list-style:none;gap:var(--space-xl)}.nav-link{text-decoration:none;color:var(--text-secondary);font-size:var(--text-sm);font-weight:var(--weight-medium);transition:color var(--transition-fast);padding:var(--space-xs) 0;position:relative}.nav-link:focus-visible,.nav-link:hover{color:var(--text-primary)}.nav-link.active{color:var(--text-primary)}.nav-link.active::after{content:'';position:absolute;bottom:-4px;left:0;width:100%;height:2px;background-color:var(--accent-primary);border-radius:var(--radius-full)}.header-actions{display:flex;align-items:center;gap:var(--space-md)}.menu-toggle{display:none;background:0 0;border:none;color:var(--text-primary);cursor:pointer;padding:var(--space-xs)}.mobile-drawer{display:none;position:fixed;top:64px;left:-100%;width:280px;height:calc(100vh - 64px);background-color:var(--bg-secondary);border-right:1px solid var(--border-subtle);z-index:90;padding:var(--space-xl);transition:left var(--transition-normal);flex-direction:column;gap:var(--space-xl)}.mobile-drawer.open{left:0}.mobile-nav-list{display:flex;flex-direction:column;list-style:none;gap:var(--space-lg)}.mobile-nav-link{text-decoration:none;color:var(--text-secondary);font-size:var(--text-md);font-weight:var(--weight-medium);display:block;padding:var(--space-xs) 0}.mobile-nav-link.active,.mobile-nav-link:hover{color:var(--text-primary)}.mobile-overlay{display:none;position:fixed;top:64px;left:0;width:100%;height:calc(100vh - 64px);background-color:rgba(0,0,0,.4);z-index:80}@media (max-width:768px){.main-nav{display:none}.menu-toggle{display:block}.mobile-drawer{display:flex}}.site-footer{background-color:var(--bg-secondary);border-top:1px solid var(--border-subtle);padding:var(--space-5xl) 0 var(--space-3xl) 0;margin-top:auto;transition:background-color var(--transition-normal),border-color var(--transition-normal)}.footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-3xl);margin-bottom:var(--space-4xl)}.footer-col{display:flex;flex-direction:column;gap:var(--space-md)}.footer-title{font-size:var(--text-sm);font-weight:var(--weight-bold);color:var(--text-primary);text-transform:uppercase;letter-spacing:.05em}.footer-links{list-style:none;display:flex;flex-direction:column;gap:var(--space-sm)}.footer-link{text-decoration:none;color:var(--text-secondary);font-size:var(--text-sm);transition:color var(--transition-fast)}.footer-link:focus-visible,.footer-link:hover{color:var(--text-primary)}.footer-brand{display:flex;flex-direction:column;gap:var(--space-sm)}.footer-logo{display:flex;align-items:center;gap:var(--space-xs);color:var(--text-primary);text-decoration:none;font-weight:var(--weight-bold)}.footer-logo svg{color:var(--accent-primary);width:18px;height:18px}.footer-desc{font-size:var(--text-xs);color:var(--text-muted)}.footer-bottom{border-top:1px solid var(--border-subtle);padding-top:var(--space-xl);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-md)}.copyright{font-size:var(--text-xs);color:var(--text-muted)}.footer-meta{display:flex;align-items:center;gap:var(--space-xl)}.lang-selector{position:relative;display:inline-flex;align-items:center;gap:var(--space-xs)}.lang-select{background-color:var(--bg-tertiary);border:1px solid var(--border-default);color:var(--text-primary);font-family:var(--font-ui);font-size:var(--text-xs);font-weight:var(--weight-medium);padding:var(--space-xs) var(--space-lg) var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;background-size:10px;padding-right:24px;transition:border-color var(--transition-fast),background-color var(--transition-fast)}.lang-select:focus-visible,.lang-select:hover{border-color:var(--border-strong);background-color:var(--bg-hover)}@media (max-width:1024px){.footer-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:640px){.footer-grid{grid-template-columns:1fr;gap:var(--space-xl)}.footer-bottom{flex-direction:column;align-items:flex-start}}.card{background-color:var(--bg-secondary);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-2xl);transition:transform var(--transition-fast),box-shadow var(--transition-fast),border-color var(--transition-fast);box-shadow:var(--shadow-sm);width:100%;max-width:100%;box-sizing:border-box}@media (max-width:640px){.card{padding:var(--space-lg);border-radius:var(--radius-md)}}.card-glass{background:var(--surface-glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-subtle);box-shadow:var(--shadow-md)}.card-interactive{cursor:pointer}.card-interactive:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--border-default)}.card-interactive:active{transform:translateY(0);box-shadow:var(--shadow-sm)}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-lg)}.card-title{font-size:var(--text-lg);font-weight:var(--weight-bold);color:var(--text-primary);display:flex;align-items:center;gap:var(--space-sm)}.card-title svg{width:20px;height:20px;stroke-width:2px}.related-card{text-decoration:none;display:flex;flex-direction:column;height:100%}.related-card-icon{width:40px;height:40px;border-radius:var(--radius-md);background-color:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;color:var(--text-secondary);margin-bottom:var(--space-md);transition:color var(--transition-fast),background-color var(--transition-fast)}.related-card:hover .related-card-icon{background-color:var(--accent-primary);color:#fff}.related-card-title{font-size:var(--text-md);font-weight:var(--weight-bold);color:var(--text-primary);margin-bottom:var(--space-xs)}.related-card-desc{font-size:var(--text-sm);color:var(--text-secondary);flex-grow:1}.related-card-formula{margin-top:var(--space-md);font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted)}.faq-item{margin-bottom:var(--space-sm);overflow:hidden;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.faq-item[open]{border-color:var(--border-default);box-shadow:var(--shadow-md)}.faq-chevron{transition:transform var(--transition-fast) var(--ease-spring)}.faq-item[open] .faq-chevron{transform:rotate(180deg)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);font-family:var(--font-ui);font-size:var(--text-sm);font-weight:var(--weight-semibold);padding:var(--space-md) var(--space-xl);border-radius:var(--radius-sm);border:1px solid transparent;cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast);text-decoration:none;line-height:1}.btn:active{transform:scale(.98)}.btn-primary{background-color:var(--accent-primary);color:#fff}.btn-primary:focus-visible,.btn-primary:hover{background-color:#2563eb;box-shadow:0 0 12px rgba(59,130,246,.4)}.theme-light .btn-primary:focus-visible,.theme-light .btn-primary:hover{background-color:#1e40af}.btn-outline{background-color:transparent;border-color:var(--border-default);color:var(--text-secondary)}.btn-outline:focus-visible,.btn-outline:hover{background-color:var(--bg-hover);border-color:var(--border-strong);color:var(--text-primary)}.btn-icon{width:40px;height:40px;padding:0;border-radius:var(--radius-sm);background-color:transparent;border:1px solid var(--border-subtle);color:var(--text-muted)}.btn-icon:focus-visible,.btn-icon:hover{background-color:var(--bg-hover);border-color:var(--border-default);color:var(--text-primary)}.btn-icon svg{width:20px;height:20px;stroke-width:1.5px}.theme-toggle-btn{background:0 0;border:1px solid var(--border-subtle);color:var(--text-secondary);cursor:pointer;width:40px;height:40px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.theme-toggle-btn:focus-visible,.theme-toggle-btn:hover{background-color:var(--bg-hover);border-color:var(--border-default);color:var(--text-primary)}.theme-toggle-btn svg{width:20px;height:20px;transition:transform var(--transition-normal)}.theme-toggle-btn:hover svg{transform:rotate(15deg)}.btn-group{display:flex;gap:var(--space-md);align-items:center}@media (max-width:640px){.btn-group{flex-direction:column;width:100%}.btn-group .btn{width:100%}}.input-group{display:flex;flex-direction:column;gap:var(--space-sm);padding:var(--space-2xl);background-color:var(--bg-secondary);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);position:relative;transition:border-color var(--transition-normal),box-shadow var(--transition-normal)}.input-group::before{content:'';position:absolute;top:var(--space-2xl);bottom:var(--space-2xl);left:0;width:5px;border-radius:0 var(--radius-sm) var(--radius-sm) 0;background-color:var(--border-default)}.input-group.voltage::before{background-color:var(--accent-voltage)}.input-group.current::before{background-color:var(--accent-current)}.input-group.resistance::before{background-color:var(--accent-resistance)}.input-group.power::before{background-color:var(--accent-power)}.input-group:focus-within{border-color:var(--border-strong)}.input-group.voltage:focus-within{box-shadow:0 0 18px rgba(250,204,21,.18)}.input-group.current:focus-within{box-shadow:0 0 18px rgba(34,211,238,.18)}.input-group.resistance:focus-within{box-shadow:0 0 18px rgba(52,211,153,.18)}.input-group.power:focus-within{box-shadow:0 0 18px rgba(251,146,60,.18)}.input-header{display:flex;justify-content:space-between;align-items:center;margin-left:var(--space-sm)}.input-label{font-size:var(--text-base);font-weight:var(--weight-bold);color:var(--text-secondary)}.input-wrapper{position:relative;display:flex;align-items:center;width:100%}.number-input{width:100%;height:56px;background-color:var(--bg-tertiary);border:1px solid var(--border-default);border-radius:var(--radius-md);padding:0 44px 0 var(--space-lg);font-family:var(--font-mono);font-size:var(--mono-xl);font-weight:var(--weight-semibold);color:var(--text-primary);caret-color:var(--accent-primary);transition:border-color var(--transition-fast),background-color var(--transition-fast)}.number-input:hover{background-color:var(--bg-hover)}.number-input:focus-visible{border-color:var(--border-focus);background-color:var(--bg-tertiary);outline:0}.number-input::-webkit-inner-spin-button,.number-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.number-input{-moz-appearance:textfield}.input-copy-btn{position:absolute;right:var(--space-sm);background:0 0;border:none;color:var(--text-muted);cursor:pointer;padding:var(--space-xs);border-radius:var(--radius-sm);transition:color var(--transition-fast),background-color var(--transition-fast);display:none}.input-copy-btn:focus-visible,.input-copy-btn:hover{color:var(--text-primary);background-color:var(--bg-hover)}.input-copy-btn svg{width:16px;height:16px}.input-group.is-result{background-color:var(--bg-result)}.input-group.is-result .number-input{font-weight:var(--weight-bold);background-color:transparent;border-color:var(--border-subtle);pointer-events:none}.input-group.is-result .input-copy-btn{display:block}.input-group.has-error{border-color:var(--color-danger)}.input-group.has-error .number-input{border-color:var(--color-danger)}@media(max-width:640px){.number-input{font-size:var(--mono-base);height:44px}}.badge{display:inline-flex;align-items:center;gap:var(--space-xs);font-size:var(--text-xs);font-weight:var(--weight-bold);padding:2px 6px;border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.05em;line-height:1}.badge-result{background-color:rgba(59,130,246,.1);color:var(--accent-primary);border:1px solid rgba(59,130,246,.2)}.badge-warning{background-color:rgba(245,158,11,.1);color:var(--color-warning);border:1px solid rgba(245,158,11,.2)}.badge-danger{background-color:rgba(239,68,68,.1);color:var(--color-danger);border:1px solid rgba(239,68,68,.2)}.badge-voltage{background-color:rgba(250,204,21,.1);color:var(--accent-voltage);border:1px solid rgba(250,204,21,.2)}.badge-current{background-color:rgba(34,211,238,.1);color:var(--accent-current);border:1px solid rgba(34,211,238,.2)}.badge-resistance{background-color:rgba(52,211,153,.1);color:var(--accent-resistance);border:1px solid rgba(52,211,153,.2)}.badge-power{background-color:rgba(251,146,60,.1);color:var(--accent-power);border:1px solid rgba(251,146,60,.2)}.badge-animate{animation:badgeIn .3s var(--ease-spring)}@keyframes badgeIn{0%{transform:scale(.8);opacity:0}100%{transform:scale(1);opacity:1}}.unit-selector{display:inline-flex;background-color:var(--bg-tertiary);border:1px solid var(--border-subtle);border-radius:var(--radius-full);padding:2px;gap:2px;position:relative;align-self:flex-start;margin-left:var(--space-sm)}.unit-pill{background:0 0;border:none;font-family:var(--font-ui);font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-secondary);padding:var(--space-xs) var(--space-md);border-radius:var(--radius-full);cursor:pointer;z-index:2;transition:color var(--transition-fast)}.unit-pill:hover{color:var(--text-primary)}.unit-pill.active{color:var(--text-inverse);font-weight:var(--weight-semibold);background-color:var(--accent-primary)}.input-group.voltage .unit-pill.active{background-color:var(--accent-voltage);color:var(--text-inverse)}.input-group.current .unit-pill.active{background-color:var(--accent-current);color:var(--text-inverse)}.input-group.resistance .unit-pill.active{background-color:var(--accent-resistance);color:var(--text-inverse)}.input-group.power .unit-pill.active{background-color:var(--accent-power);color:var(--text-inverse)}.preset-bar{display:flex;gap:var(--space-sm);overflow-x:auto;width:100%;max-width:100%;box-sizing:border-box;padding:var(--space-xs) var(--space-sm);margin-bottom:var(--space-md);scrollbar-width:none;-webkit-overflow-scrolling:touch}.preset-bar::-webkit-scrollbar{display:none}.preset-pill{background-color:var(--bg-tertiary);border:1px solid var(--border-subtle);color:var(--text-secondary);font-family:var(--font-ui);font-size:var(--text-xs);font-weight:var(--weight-medium);padding:var(--space-xs) var(--space-lg);border-radius:var(--radius-full);cursor:pointer;white-space:nowrap;transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast)}.preset-pill:hover{background-color:var(--bg-hover);border-color:var(--border-default);color:var(--text-primary)}.preset-pill.active{background-color:rgba(59,130,246,.15);border-color:var(--accent-primary);color:var(--accent-primary)}.alert{display:flex;gap:var(--space-md);padding:var(--space-lg);border-radius:var(--radius-md);border-left:4px solid transparent;font-size:var(--text-sm);line-height:1.5;transition:opacity var(--transition-normal),transform var(--transition-normal)}.alert-icon{flex-shrink:0;display:flex;align-items:center}.alert-icon svg{width:20px;height:20px}.alert-content{display:flex;flex-direction:column;gap:var(--space-xs)}.alert-title{font-weight:var(--weight-bold)}.alert-warning{background-color:rgba(245,158,11,.05);border-left-color:var(--color-warning);color:var(--text-primary)}.alert-warning .alert-title{color:var(--color-warning)}.alert-warning .alert-icon{color:var(--color-warning)}.alert-danger{background-color:rgba(239,68,68,.05);border-left-color:var(--color-danger);color:var(--text-primary)}.alert-danger .alert-title{color:var(--color-danger)}.alert-danger .alert-icon{color:var(--color-danger)}.alert-info{background-color:rgba(59,130,246,.05);border-left-color:var(--color-info);color:var(--text-primary)}.alert-info .alert-title{color:var(--color-info)}.alert-info .alert-icon{color:var(--color-info)}.alert-animate{animation:alertIn .3s var(--ease-spring)}@keyframes alertIn{0%{transform:translateY(-10px);opacity:0}100%{transform:translateY(0);opacity:1}}.cookie-banner{position:fixed;bottom:var(--space-lg);left:var(--space-lg);right:var(--space-lg);max-width:500px;z-index:1000;display:flex;align-items:center;justify-content:space-between;box-shadow:var(--shadow-lg)!important;background:var(--bg-secondary)!important;border:1px solid var(--border-subtle);border-left:4px solid var(--accent-primary)!important;animation:slideUp .4s var(--ease-spring)}.theme-light .cookie-banner{background:var(--bg-secondary)!important}@keyframes slideUp{0%{transform:translateY(100px);opacity:0}100%{transform:translateY(0);opacity:1}}@media (max-width:640px){.cookie-banner{flex-direction:column;align-items:stretch;gap:var(--space-md)}}.steps-container{display:flex;flex-direction:column;gap:var(--space-md);margin-top:var(--space-lg)}.step-card{padding:var(--space-md) var(--space-lg);border-left:3px solid var(--border-default);margin-bottom:var(--space-sm);display:flex;flex-direction:column;gap:var(--space-xs);animation:stepIn .3s var(--ease-spring) both}@keyframes stepIn{0%{transform:translateX(-10px);opacity:0}100%{transform:translateX(0);opacity:1}}.step-card.voltage{border-left-color:var(--accent-voltage)}.step-card.current{border-left-color:var(--accent-current)}.step-card.resistance{border-left-color:var(--accent-resistance)}.step-card.power{border-left-color:var(--accent-power)}.step-formula{font-family:var(--font-mono);font-size:var(--mono-sm);color:var(--text-secondary)}.step-sub{font-family:var(--font-mono);font-size:var(--mono-sm);color:var(--text-primary)}.step-sub .var-v{color:var(--accent-voltage);font-weight:var(--weight-semibold)}.step-sub .var-i{color:var(--accent-current);font-weight:var(--weight-semibold)}.step-sub .var-r{color:var(--accent-resistance);font-weight:var(--weight-semibold)}.step-sub .var-p{color:var(--accent-power);font-weight:var(--weight-semibold)}.step-result{font-family:var(--font-mono);font-size:var(--mono-base);font-weight:var(--weight-bold);display:flex;align-items:center;gap:var(--space-xs)}.step-result svg{width:16px;height:16px;color:var(--color-success)}.step-details-toggle{background:0 0;border:none;color:var(--accent-primary);font-family:var(--font-ui);font-size:var(--text-xs);font-weight:var(--weight-semibold);cursor:pointer;display:inline-flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) 0;margin-top:var(--space-xs);align-self:flex-start}.step-details-toggle svg{width:12px;height:12px;transition:transform var(--transition-fast)}.step-details-toggle.open svg{transform:rotate(180deg)}.step-details-content{display:none;font-size:var(--text-xs);color:var(--text-secondary);padding:var(--space-sm) 0;border-top:1px dashed var(--border-subtle);margin-top:var(--space-xs)}.step-details-content.open{display:block}.section{padding:var(--space-5xl) 0}@media (max-width:640px){.section{padding:var(--space-3xl) 0}}.section-header{margin-bottom:var(--space-3xl)}.section-title{font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--text-primary);letter-spacing:-.01em;display:flex;align-items:center;gap:var(--space-md)}.section-title svg{width:24px;height:24px;color:var(--accent-primary);stroke-width:1.5px}.section-subtitle{font-size:var(--text-base);color:var(--text-secondary);margin-top:var(--space-xs)}.calculator-grid{display:grid;grid-template-columns:7fr 5fr;gap:var(--space-3xl);align-items:start}@media (max-width:1024px){.calculator-grid{grid-template-columns:1fr;gap:var(--space-xl)}}.calculator-left{display:flex;flex-direction:column;gap:var(--space-lg);min-width:0;width:100%}.calculator-right{display:flex;flex-direction:column;gap:var(--space-lg);position:sticky;top:80px;min-width:0;width:100%}@media (max-width:1024px){.calculator-right{position:static}}.wheel-container{display:flex;justify-content:center;align-items:center;width:100%;padding:var(--space-md)}.formula-wheel-svg{width:100%;max-width:380px;height:auto;overflow:visible}.wheel-sector{fill:var(--bg-tertiary);stroke:var(--bg-primary);stroke-width:2px;cursor:pointer;transition:fill var(--transition-fast),transform var(--transition-fast),filter var(--transition-fast);transform-origin:160px 160px}.wheel-sector:focus-visible,.wheel-sector:hover{outline:0;transform:scale(1.03);filter:brightness(1.1);stroke:var(--text-muted)}.theme-light .wheel-sector:focus-visible,.theme-light .wheel-sector:hover{filter:brightness(.95)}.wheel-sector.voltage-sector{fill:rgba(250,204,21,0.05)}.wheel-sector.current-sector{fill:rgba(34,211,238,0.05)}.wheel-sector.resistance-sector{fill:rgba(52,211,153,0.05)}.wheel-sector.power-sector{fill:rgba(251,146,60,0.05)}.wheel-sector.voltage-sector:hover{fill:rgba(250,204,21,0.15)}.wheel-sector.current-sector:hover{fill:rgba(34,211,238,0.15)}.wheel-sector.resistance-sector:hover{fill:rgba(52,211,153,0.15)}.wheel-sector.power-sector:hover{fill:rgba(251,146,60,0.15)}.wheel-sector.active{stroke-width:3px;transform:scale(1.04)}.wheel-sector.voltage-sector.active{fill:var(--accent-voltage);stroke:var(--accent-voltage);filter:drop-shadow(0 0 8px rgba(250, 204, 21, .4))}.wheel-sector.current-sector.active{fill:var(--accent-current);stroke:var(--accent-current);filter:drop-shadow(0 0 8px rgba(34, 211, 238, .4))}.wheel-sector.resistance-sector.active{fill:var(--accent-resistance);stroke:var(--accent-resistance);filter:drop-shadow(0 0 8px rgba(52, 211, 153, .4))}.wheel-sector.power-sector.active{fill:var(--accent-power);stroke:var(--accent-power);filter:drop-shadow(0 0 8px rgba(251, 146, 60, .4))}.wheel-label{font-family:var(--font-ui);font-size:11px;font-weight:var(--weight-bold);fill:var(--text-secondary);pointer-events:none}.wheel-label.active{fill:var(--text-inverse)}.wheel-center-text{font-family:var(--font-ui);font-weight:var(--weight-extrabold);font-size:16px;fill:var(--text-primary);pointer-events:none}.wheel-center-sub{font-family:var(--font-ui);font-size:8px;fill:var(--text-muted);pointer-events:none}.wheel-center-bg{fill:var(--bg-secondary);stroke:var(--border-subtle);stroke-width:2px}.wheel-quadrant-line{stroke:var(--border-subtle);stroke-width:1.5px;pointer-events:none}.wheel-anchor:focus-visible .wheel-sector{outline:0;transform:scale(1.05);stroke:var(--accent-primary);stroke-width:3px}.graph-container{width:100%;background-color:var(--bg-secondary);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-2xl);display:flex;flex-direction:column;gap:var(--space-md)}.graph-svg{width:100%;height:auto;max-height:320px;overflow:visible}.graph-grid-line{stroke:var(--border-subtle);stroke-width:1px}.graph-axis-line{stroke:var(--text-muted);stroke-width:2px}.graph-axis-label{font-family:var(--font-ui);font-size:11px;fill:var(--text-secondary);font-weight:var(--weight-medium)}.graph-tick-text{font-family:var(--font-mono);font-size:10px;fill:var(--text-muted)}.graph-slope-line{stroke:var(--accent-resistance);stroke-width:3px;stroke-linecap:round;transition:stroke-dasharray var(--transition-normal)}.graph-guideline{stroke:var(--text-muted);stroke-width:1px;stroke-dasharray:4 4}.graph-drag-point{fill:var(--text-primary);stroke:var(--accent-primary);stroke-width:3px;cursor:grab;transition:r var(--transition-fast),fill var(--transition-fast),stroke-width var(--transition-fast)}.graph-drag-point:focus-visible,.graph-drag-point:hover{r:10px;fill:var(--accent-primary);stroke:var(--text-primary);stroke-width:2px;outline:0}.graph-drag-point:active{cursor:grabbing;r:11px;stroke-width:3px}.graph-tooltip-bg{fill:var(--bg-tertiary);stroke:var(--border-default);stroke-width:1px;rx:var(--radius-sm);ry:var(--radius-sm)}.graph-tooltip-text{font-family:var(--font-mono);font-size:11px;fill:var(--text-primary)}@media (max-width:640px){.graph-container{padding:var(--space-lg)}.graph-svg{max-height:200px}}.circuit-container{width:100%;background-color:var(--bg-secondary);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-2xl);display:flex;flex-direction:column;gap:var(--space-md)}.circuit-svg{width:100%;height:auto;max-height:240px;overflow:visible}.circuit-wire{stroke:var(--border-default);stroke-width:4px;fill:none;stroke-linejoin:round;stroke-linecap:round}.electron-dot{fill:var(--accent-current);filter:drop-shadow(0 0 3px var(--accent-current));offset-path:path("M 60 60 L 340 60 L 340 260 L 60 260 Z");animation:flow var(--flow-speed,0s) linear infinite;animation-play-state:paused}.electron-dot.active{animation-play-state:running}@keyframes flow{0%{offset-distance:0%}100%{offset-distance:100%}}.circuit-component{stroke:var(--text-primary);stroke-width:3px;fill:var(--bg-secondary);stroke-linejoin:round}.circuit-component-bg{fill:var(--bg-secondary)}.circuit-label{font-family:var(--font-ui);font-size:11px;font-weight:var(--weight-bold);fill:var(--text-secondary)}.circuit-value{font-family:var(--font-mono);font-size:12px;font-weight:var(--weight-bold);fill:var(--text-primary)}.circuit-resistor{stroke:var(--accent-resistance);transition:stroke var(--transition-normal),filter var(--transition-normal)}.circuit-resistor.is-overloaded{stroke:var(--color-danger);filter:drop-shadow(0 0 6px var(--color-danger));animation:overloadShake 150ms linear infinite}@keyframes overloadShake{0%,100%{transform:translate(0,0)}25%{transform:translate(-.5px,.5px)}50%{transform:translate(.5px,-.5px)}75%{transform:translate(-.5px,-.5px)}}.heat-wave{stroke:var(--color-danger);stroke-width:1.5px;fill:none;stroke-linecap:round;opacity:0;transform-origin:340px 160px;transition:opacity var(--transition-normal)}.circuit-resistor.is-overloaded+.heat-wave{opacity:.8;animation:heatPulse 1.2s ease-out infinite}@keyframes heatPulse{0%{transform:scale(.9);opacity:.8}50%{opacity:.4}100%{transform:scale(1.3);opacity:0}}.battery-plus{fill:var(--color-danger)}.battery-minus{fill:var(--accent-primary)}@media (max-width:640px){.circuit-container{padding:var(--space-lg)}.circuit-svg{max-height:180px}}@media (prefers-reduced-motion:reduce){.electron-dot{animation:none!important;display:none!important}.circuit-resistor.is-overloaded{animation:none!important}.circuit-resistor.is-overloaded+.heat-wave{animation:none!important;opacity:.25!important}}.toc-sidebar{position:sticky;top:80px;max-height:calc(100vh - 120px);overflow-y:auto;padding-left:var(--space-sm);border-left:1px solid var(--border-subtle);display:flex;flex-direction:column;gap:var(--space-md)}.toc-title{font-size:var(--text-xs);font-weight:var(--weight-bold);text-transform:uppercase;color:var(--text-muted);letter-spacing:.05em;margin-bottom:var(--space-xs)}.toc-list{list-style:none;display:flex;flex-direction:column;gap:var(--space-sm)}.toc-item{position:relative}.toc-link{display:block;text-decoration:none;color:var(--text-secondary);font-size:var(--text-sm);line-height:1.3;transition:color var(--transition-fast),padding-left var(--transition-fast);padding:2px 0 2px var(--space-sm)}.toc-link:focus-visible,.toc-link:hover{color:var(--text-primary)}.toc-link.active{color:var(--accent-primary);font-weight:var(--weight-semibold);padding-left:var(--space-md)}.toc-link.active::before{content:'';position:absolute;left:-1px;top:2px;bottom:2px;width:2px;background-color:var(--accent-primary);border-radius:var(--radius-full)}@media (max-width:1024px){.toc-sidebar{display:none}}.article-container{grid-column:span 8;display:flex;flex-direction:column;gap:var(--space-3xl)}@media (max-width:1024px){.article-container{grid-column:span 8}}@media (max-width:640px){.article-container{grid-column:span 4}}.article-header{border-bottom:1px solid var(--border-subtle);padding-bottom:var(--space-2xl);display:flex;flex-direction:column;gap:var(--space-sm)}.article-title{font-size:var(--text-3xl);font-weight:var(--weight-extrabold);color:var(--text-primary);line-height:1.2;letter-spacing:-.02em}.article-meta{display:flex;align-items:center;gap:var(--space-md);font-size:var(--text-xs);color:var(--text-muted)}.article-content{display:flex;flex-direction:column;gap:var(--space-xl)}.article-content h2{font-size:var(--text-xl);font-weight:var(--weight-bold);color:var(--text-primary);margin-top:var(--space-4xl);margin-bottom:var(--space-sm);scroll-margin-top:80px}.article-content h3{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin-top:var(--space-2xl);margin-bottom:var(--space-xs);scroll-margin-top:80px}.article-content p{font-size:var(--text-base);color:var(--text-secondary);line-height:1.7}.article-content ol,.article-content ul{padding-left:var(--space-2xl);display:flex;flex-direction:column;gap:var(--space-sm);color:var(--text-secondary)}.article-content li strong{color:var(--text-primary)}.article-content li code,.article-content p code{font-family:var(--font-mono);font-size:var(--mono-sm);background-color:var(--bg-tertiary);padding:2px 6px;border-radius:var(--radius-sm);border:1px solid var(--border-subtle);color:var(--accent-primary)}.article-callout{background-color:var(--bg-secondary);border-left:4px solid var(--accent-primary);border-radius:0 var(--radius-md) var(--radius-md) 0;padding:var(--space-lg) var(--space-xl);margin:var(--space-md) 0}.article-callout-title{font-weight:var(--weight-bold);color:var(--text-primary);font-size:var(--text-sm);margin-bottom:var(--space-xs);display:flex;align-items:center;gap:var(--space-xs)}.article-callout-content{font-size:var(--text-sm)!important;color:var(--text-secondary);line-height:1.5!important}.article-callout-content p{font-size:var(--text-sm)!important}.breadcrumbs{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-xs);list-style:none;font-size:var(--text-xs);color:var(--text-muted);margin-bottom:var(--space-xl)}.breadcrumb-item a{text-decoration:none;color:var(--text-secondary);transition:color var(--transition-fast)}.breadcrumb-item a:hover{color:var(--text-primary)}.breadcrumb-separator{display:flex;align-items:center;color:var(--text-muted)}.breadcrumb-separator svg{width:12px;height:12px}.divider-svg{width:100%;height:auto;max-height:240px;overflow:visible}.divider-wire{stroke:var(--border-default);stroke-width:3px;fill:none;stroke-linejoin:round}.divider-resistor{stroke:var(--accent-resistance);stroke-width:2.5px;fill:var(--bg-secondary)}.divider-node{fill:var(--accent-primary)}.divider-text-value{font-family:var(--font-mono);font-size:11px;font-weight:var(--weight-bold);fill:var(--text-primary)}.divider-text-label{font-family:var(--font-ui);font-size:11px;font-weight:var(--weight-semibold);fill:var(--text-secondary)}.band-tabs{display:flex;gap:var(--space-sm);margin-bottom:var(--space-xl)}.resistor-preview-card{display:flex;justify-content:center;align-items:center;padding:var(--space-3xl);background-color:var(--bg-secondary);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);margin-bottom:var(--space-xl)}.resistor-svg{width:100%;max-width:380px;height:auto;overflow:visible}.resistor-body{fill:#e8d8b8;stroke:#c8b898;stroke-width:2px;transition:fill var(--transition-normal)}.theme-light .resistor-body{fill:#f5ebd5;stroke:#dcd0b5}.resistor-lead{stroke:#94a3b8;stroke-width:4px;stroke-linecap:round}.resistor-band{stroke-width:0;transition:fill var(--transition-normal)}.color-selectors-container{display:flex;flex-direction:column;gap:var(--space-lg)}.color-row{display:grid;grid-template-columns:1.5fr 8.5fr;gap:var(--space-md);align-items:center}.color-row-label{font-size:var(--text-xs);font-weight:var(--weight-bold);text-transform:uppercase;color:var(--text-secondary)}.color-palette{display:flex;flex-wrap:wrap;gap:var(--space-xs)}.color-swatch{width:32px;height:32px;border-radius:var(--radius-sm);border:2px solid var(--border-subtle);cursor:pointer;position:relative;transition:transform var(--transition-fast),border-color var(--transition-fast)}.color-swatch:focus-visible,.color-swatch:hover{transform:scale(1.15);border-color:var(--text-primary);outline:0}.color-swatch.active{transform:scale(1.1);border-color:var(--accent-primary);box-shadow:0 0 8px var(--accent-primary)}.color-swatch.active::after{content:'✓';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:var(--text-xs);font-weight:var(--weight-bold);text-shadow:0 1px 2px rgba(0,0,0,.8)}.swatch-black{background-color:#000}.swatch-brown{background-color:#8b4513}.swatch-red{background-color:red}.swatch-orange{background-color:#ff8c00}.swatch-yellow{background-color:gold}.swatch-green{background-color:green}.swatch-blue{background-color:#00f}.swatch-violet{background-color:violet}.swatch-gray{background-color:grey}.swatch-white{background-color:#fff}.swatch-gold{background-color:gold;background-image:linear-gradient(135deg,gold,#b8860b)}.swatch-silver{background-color:silver;background-image:linear-gradient(135deg,#e0e0e0,grey)}.swatch-gold.active::after,.swatch-silver.active::after,.swatch-white.active::after,.swatch-yellow.active::after{color:#000;text-shadow:none}@media (max-width:640px){.color-row{grid-template-columns:1fr;gap:var(--space-xs)}}*,::after,::before{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px;background-color:var(--bg-primary)}body{font-family:var(--font-ui);font-size:var(--text-base);line-height:1.6;color:var(--text-primary);background-color:var(--bg-primary);min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden;transition:background-color var(--transition-slow),color var(--transition-slow)}:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.skip-link{position:fixed;top:-100px;left:var(--space-md);background-color:var(--accent-primary);color:#fff;padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-sm);z-index:1000;font-weight:var(--weight-semibold);text-decoration:none;transition:top var(--transition-fast)}.skip-link:focus{top:var(--space-sm)}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--space-2xl)}@media (max-width:640px){.container{padding:0 var(--space-lg)}}.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--space-2xl)}.grid-gap-lg{gap:var(--space-3xl)}.col-span-1{grid-column:span 1}.col-span-2{grid-column:span 2}.col-span-3{grid-column:span 3}.col-span-4{grid-column:span 4}.col-span-5{grid-column:span 5}.col-span-6{grid-column:span 6}.col-span-7{grid-column:span 7}.col-span-8{grid-column:span 8}.col-span-9{grid-column:span 9}.col-span-10{grid-column:span 10}.col-span-11{grid-column:span 11}.col-span-12{grid-column:span 12}@media (max-width:1024px){.grid{grid-template-columns:repeat(8,1fr);gap:var(--space-xl)}.col-span-md-1{grid-column:span 1}.col-span-md-2{grid-column:span 2}.col-span-md-3{grid-column:span 3}.col-span-md-4{grid-column:span 4}.col-span-md-5{grid-column:span 5}.col-span-md-6{grid-column:span 6}.col-span-md-7{grid-column:span 7}.col-span-md-8{grid-column:span 8}.col-span-md-12{grid-column:span 8}}@media (max-width:640px){.grid{grid-template-columns:repeat(4,1fr);gap:var(--space-lg)}.col-span-sm-1{grid-column:span 1}.col-span-sm-2{grid-column:span 2}.col-span-sm-3{grid-column:span 3}.col-span-sm-4{grid-column:span 4}.col-span-sm-12{grid-column:span 4}}main{flex:1 0 auto;padding-top:var(--space-4xl);padding-bottom:var(--space-6xl)}@media (max-width:640px){main{padding-top:var(--space-2xl);padding-bottom:var(--space-4xl)}}.mesh-bg{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-100;opacity:.7;pointer-events:none;background-color:var(--bg-primary);background-image:radial-gradient(at 10% 20%,rgba(59,130,246,.05) 0,transparent 50%),radial-gradient(at 90% 10%,rgba(139,92,246,.04) 0,transparent 50%),radial-gradient(at 50% 80%,rgba(34,211,238,.03) 0,transparent 50%)}.theme-light .mesh-bg{opacity:.4;background-image:radial-gradient(at 10% 20%,rgba(59,130,246,.03) 0,transparent 50%),radial-gradient(at 90% 10%,rgba(139,92,246,.02) 0,transparent 50%),radial-gradient(at 50% 80%,rgba(34,211,238,.02) 0,transparent 50%)}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.gap-lg{gap:var(--space-lg)}.text-center{text-align:center}.text-muted{color:var(--text-secondary)}.text-quantity-v{color:var(--accent-voltage)}.text-quantity-i{color:var(--accent-current)}.text-quantity-r{color:var(--accent-resistance)}.text-quantity-p{color:var(--accent-power)}@media (prefers-reduced-motion:reduce){*{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important;scroll-behavior:auto!important}}