@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-bg: #0a0a0f;--color-surface: #12121a;--color-surface-2: #1a1a28;--color-border: #2a2a3a;--color-text: #e8e8f0;--color-text-secondary: #8888a0;--color-primary: #6c5ce7;--color-primary-hover: #7f70f0;--color-accent: #00d2ff;--color-success: #00c853;--color-warning: #ffab00;--color-danger: #ff5252;--font-body: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--radius: 12px;--radius-sm: 8px;--shadow: 0 4px 24px rgba(0,0,0,.3)}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--color-bg);color:var(--color-text);line-height:1.6;min-height:100vh;display:flex;flex-direction:column}main{flex:1}.container{max-width:1200px;margin:0 auto;padding:0 24px}.site-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:16px 0;position:sticky;top:0;z-index:100;backdrop-filter:blur(12px);background:#12121ae6}.site-header nav{display:flex;justify-content:space-between;align-items:center}.logo{font-size:1.5rem;font-weight:700;color:var(--color-text);text-decoration:none;display:flex;align-items:center;gap:4px}.nav-links{display:flex;gap:24px}.nav-links a{color:var(--color-text-secondary);text-decoration:none;font-weight:500;font-size:.95rem;transition:color .2s}.nav-links a:hover{color:var(--color-primary)}.hero{text-align:center;padding:80px 0 60px;background:linear-gradient(180deg,var(--color-bg) 0%,var(--color-surface) 100%)}.hero h1{font-size:3rem;font-weight:700;margin-bottom:16px;background:linear-gradient(135deg,var(--color-primary),var(--color-accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero p{font-size:1.2rem;color:var(--color-text-secondary);max-width:600px;margin:0 auto}.calc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px;padding:60px 0}.calc-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:32px;text-decoration:none;color:var(--color-text);transition:all .3s ease;display:flex;flex-direction:column;gap:12px}.calc-card:hover{border-color:var(--color-primary);transform:translateY(-4px);box-shadow:0 8px 32px #6c5ce726}.calc-card .icon{font-size:2.5rem}.calc-card h3{font-size:1.25rem;font-weight:600}.calc-card p{color:var(--color-text-secondary);font-size:.9rem;line-height:1.5}.calc-card .tag{display:inline-block;padding:4px 10px;background:var(--color-primary);color:#fff;border-radius:20px;font-size:.75rem;font-weight:600;width:fit-content}.calc-page{padding:40px 0 80px}.calc-page h1{font-size:2rem;font-weight:700;margin-bottom:8px}.calc-page .subtitle{color:var(--color-text-secondary);margin-bottom:32px;font-size:1.05rem}.calc-container{display:grid;grid-template-columns:1fr 1fr;gap:32px}@media(max-width:768px){.calc-container{grid-template-columns:1fr}.hero h1{font-size:2rem}.calc-grid{grid-template-columns:1fr}}.calc-input-panel,.calc-output-panel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:32px}.calc-input-panel h2,.calc-output-panel h2{font-size:1.1rem;font-weight:600;margin-bottom:24px;color:var(--color-accent);text-transform:uppercase;letter-spacing:.5px}.form-group{margin-bottom:20px}.form-group label{display:block;font-size:.9rem;font-weight:500;margin-bottom:8px;color:var(--color-text-secondary)}.form-group input,.form-group select{width:100%;padding:12px 16px;background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);font-size:1rem;font-family:var(--font-mono);transition:border-color .2s}.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--color-primary)}.form-group select{cursor:pointer}.form-group .hint{font-size:.8rem;color:var(--color-text-secondary);margin-top:4px}.calc-btn{width:100%;padding:14px;background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-sm);font-size:1rem;font-weight:600;cursor:pointer;transition:background .2s;font-family:var(--font-body)}.calc-btn:hover{background:var(--color-primary-hover)}.result-item{display:flex;justify-content:space-between;align-items:center;padding:16px;background:var(--color-surface-2);border-radius:var(--radius-sm);margin-bottom:12px}.result-item .label{font-size:.9rem;color:var(--color-text-secondary)}.result-item .value{font-family:var(--font-mono);font-size:1.1rem;font-weight:600;color:var(--color-accent)}.about-section{padding:60px 0;border-top:1px solid var(--color-border)}.about-section h2{font-size:1.5rem;margin-bottom:24px}.about-section p{color:var(--color-text-secondary);max-width:700px;line-height:1.7}.site-footer{background:var(--color-surface);border-top:1px solid var(--color-border);padding:48px 0 24px;margin-top:auto}.footer-content{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;margin-bottom:40px}@media(max-width:768px){.footer-content{grid-template-columns:1fr}}.footer-brand p,.footer-info p{color:var(--color-text-secondary);font-size:.9rem;margin-top:8px;line-height:1.6}.footer-links h4,.footer-info h4{font-size:.9rem;font-weight:600;margin-bottom:12px;color:var(--color-text)}.footer-links a{display:block;color:var(--color-text-secondary);text-decoration:none;font-size:.9rem;padding:4px 0;transition:color .2s}.footer-links a:hover{color:var(--color-primary)}.footer-bottom{border-top:1px solid var(--color-border);padding-top:20px;text-align:center}.footer-bottom p{color:var(--color-text-secondary);font-size:.85rem}.color-band-row{display:flex;gap:12px;align-items:center;margin-bottom:12px}.color-band-row label{min-width:70px;font-size:.9rem;color:var(--color-text-secondary)}.color-band-row select{flex:1}.resistor-preview{display:flex;align-items:center;justify-content:center;gap:6px;padding:20px;background:var(--color-surface-2);border-radius:var(--radius-sm);margin-bottom:16px}.resistor-preview .band{width:24px;height:60px;border-radius:4px;border:1px solid rgba(255,255,255,.1)}.breadcrumb{display:flex;gap:8px;align-items:center;margin-bottom:24px;font-size:.9rem}.breadcrumb a{color:var(--color-text-secondary);text-decoration:none}.breadcrumb a:hover{color:var(--color-primary)}.breadcrumb .sep{color:var(--color-text-secondary)}.breadcrumb .current{color:var(--color-text)}.info-box{background:var(--color-surface-2);border-left:3px solid var(--color-primary);padding:16px 20px;border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin-top:24px}.info-box h4{font-size:.95rem;margin-bottom:8px}.info-box p{font-size:.85rem;color:var(--color-text-secondary);line-height:1.6}.formula{font-family:var(--font-mono);background:var(--color-surface-2);padding:16px;border-radius:var(--radius-sm);margin:16px 0;font-size:1rem;color:var(--color-accent);text-align:center}.content-page{padding:40px 0 80px;max-width:800px}.content-page h1{font-size:2rem;font-weight:700;margin-bottom:8px}.content-page .subtitle{color:var(--color-text-secondary);margin-bottom:32px}.content-page h2{font-size:1.4rem;font-weight:600;margin-top:40px;margin-bottom:16px;color:var(--color-accent)}.content-page h3{font-size:1.15rem;font-weight:600;margin-top:28px;margin-bottom:12px}.content-page p{color:var(--color-text-secondary);line-height:1.8;margin-bottom:16px}.content-page ul{color:var(--color-text-secondary);line-height:1.8;margin-bottom:16px;padding-left:24px}.content-page ul li{margin-bottom:8px}.hamburger{display:none;background:none;border:none;color:var(--color-text);font-size:1.5rem;cursor:pointer;padding:4px 8px}@media(max-width:768px){.hamburger{display:block}.nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:var(--color-surface);border-bottom:1px solid var(--color-border);flex-direction:column;padding:16px 24px;gap:16px}.nav-links.active{display:flex}.site-header nav{position:relative}}.edu-section{margin-top:48px;padding-top:48px;border-top:1px solid var(--color-border)}.edu-section h2{font-size:1.4rem;font-weight:600;margin-bottom:16px;color:var(--color-accent)}.edu-section h3{font-size:1.15rem;font-weight:600;margin-top:28px;margin-bottom:12px}.edu-section p{color:var(--color-text-secondary);line-height:1.8;margin-bottom:16px}.edu-section ul{color:var(--color-text-secondary);line-height:1.8;margin-bottom:16px;padding-left:24px}.edu-section ul li{margin-bottom:8px}.faq-item{margin-bottom:20px}.faq-item .question{font-weight:600;color:var(--color-text);margin-bottom:8px;font-size:1rem}.faq-item .answer{color:var(--color-text-secondary);line-height:1.7;padding-left:16px;border-left:2px solid var(--color-primary)}.result-item{position:relative}.copy-btn{background:var(--color-surface-2);border:1px solid var(--color-border);color:var(--color-text-secondary);font-size:.75rem;padding:2px 8px;border-radius:4px;cursor:pointer;margin-left:8px;transition:all .2s;display:inline-block;vertical-align:middle}.copy-btn:hover{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.copy-btn.copied{background:#22c55e;color:#fff;border-color:#22c55e}.error-message{color:#ef4444;font-size:.875rem;padding:8px 12px;background:#ef44441a;border-radius:var(--radius-sm);margin-top:8px;display:none}.error-message.visible{display:block}.btn-secondary{background:var(--color-surface-2);border:1px solid var(--color-border);color:var(--color-text);padding:8px 16px;border-radius:var(--radius-sm);cursor:pointer;font-size:.875rem;width:100%;transition:all .2s}.btn-secondary:hover{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}
