.calculator-layout{grid-template-columns:1fr 1fr;align-items:start;gap:2rem;display:grid}.calculator-form h3{margin-bottom:1.5rem;font-size:1.125rem}.calculator-result h3{margin-bottom:1rem;font-size:1.125rem}.form-group{margin-bottom:1.25rem}.form-group label{color:var(--text-primary);margin-bottom:.5rem;font-size:.875rem;font-weight:500;display:block}.form-input{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--background);width:100%;color:var(--text-primary);transition:border-color var(--transition-fast);padding:.75rem 1rem;font-size:1rem}.form-input:focus{border-color:var(--primary);outline:none}.form-input::placeholder{color:var(--text-muted)}.form-input:disabled{opacity:.6;cursor:not-allowed;background:var(--surface-hover)}.validation-warning{border-radius:var(--radius-sm);color:#dc2626;background:#ef44441a;border:1px solid #ef44444d;margin-top:.5rem;padding:.75rem 1rem;font-size:.875rem;line-height:1.5}.form-hint{color:var(--text-muted);margin-top:.5rem;margin-bottom:0;font-size:.75rem}.calc-button{color:#fff;background:linear-gradient(135deg,var(--primary)0%,var(--primary-dark)100%);border-radius:var(--radius-md);cursor:pointer;width:100%;transition:all var(--transition-fast);border:none;padding:1rem;font-size:1rem;font-weight:600;box-shadow:0 2px 8px #3b82f64d}.calc-button:hover{transform:translateY(-1px);box-shadow:0 4px 12px #3b82f666}.calc-button:active{transform:translateY(0)}.button-selector{gap:.5rem;display:flex}.selector-btn{color:var(--text-secondary);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);flex:1;padding:.625rem 1rem;font-size:.875rem;font-weight:500}.selector-btn:hover{border-color:var(--primary);color:var(--primary)}.selector-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.slider-value{float:right;color:var(--primary);font-weight:600}.slider-input-group{align-items:center;gap:.75rem;display:flex}.slider-input{appearance:none;background:var(--border);cursor:pointer;border-radius:3px;outline:none;flex:1;height:6px}.slider-input::-webkit-slider-thumb{appearance:none;background:var(--primary);cursor:pointer;border-radius:50%;width:20px;height:20px;transition:transform .15s}.slider-input::-webkit-slider-thumb:hover{transform:scale(1.1)}.slider-input::-moz-range-thumb{background:var(--primary);cursor:pointer;border:none;border-radius:50%;width:20px;height:20px}.slider-number{text-align:center;flex-shrink:0;padding:.5rem .25rem;font-size:.875rem;width:70px!important}.slider-labels{color:var(--text-muted);justify-content:space-between;margin-top:.25rem;font-size:.6875rem;display:flex}.result-card{border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);background:linear-gradient(135deg,#3b82f6 0%,#8b5cf6 100%);margin-bottom:1.5rem;padding:2rem}.result-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.result-header h3{color:#fff;margin:0;font-size:1.125rem}.result-actions{align-items:center;gap:.5rem;display:flex}.result-grid{grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1rem;display:grid}.result-item{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:1rem}.result-label{color:var(--text-secondary);margin-bottom:.5rem;font-size:.875rem;display:block}.result-value{color:var(--text-primary);font-size:1.5rem;font-weight:700;display:block}.result-card .result-value,.result-card .result-label,.result-card .result-item .result-value,.result-card .result-item .result-label{color:#fff}.result-card .result-sub.krw-equivalent,.result-card .result-item .result-sub.krw-equivalent{color:#fbbf24!important}.result-item .result-value{color:var(--text-primary)}.result-item .result-label{color:var(--text-secondary)}.result-value.highlight{color:var(--primary)}.result-sub{color:var(--text-secondary);margin-top:.375rem;font-size:.9375rem;font-weight:600;display:block}.result-sub.krw-equivalent{color:#fbbf24;font-weight:700}.result-card .result-sub.krw-equivalent{text-align:center!important;border-radius:var(--radius-md)!important;box-sizing:border-box!important;background:#fbbf2433!important;border:2px solid #fbbf2480!important;width:100%!important;margin-top:1rem!important;padding:1.25rem!important;font-size:1.5rem!important;display:block!important}.frequency-selector{gap:.5rem;display:flex}.frequency-btn{color:var(--text-secondary);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);flex:1;padding:.625rem 1rem;font-size:.875rem;font-weight:500}.frequency-btn:hover{border-color:var(--primary);color:var(--primary)}.frequency-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.frequency-hint{color:var(--text-muted);margin-top:.5rem;margin-bottom:0;font-size:.75rem}.charts-container{grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:1.5rem;display:grid}.chart-container{background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--border);padding:1rem}.chart-title{color:var(--text-primary);margin-bottom:.75rem;font-size:.9375rem;font-weight:600}.table-container{border-radius:var(--radius-md);border:1px solid var(--border);margin-top:1.5rem;overflow-x:auto}.data-table{border-collapse:collapse;width:100%;font-size:.875rem}.data-table thead{background:var(--surface-hover)}.data-table th{text-align:left;color:var(--text-primary);border-bottom:1px solid var(--border);padding:.75rem 1rem;font-weight:600}.data-table td{color:var(--text-secondary);border-bottom:1px solid var(--border);padding:.75rem 1rem}.data-table tbody tr:hover{background:var(--surface-hover)}.data-table tbody tr:last-child td{border-bottom:none}.data-table .text-right{text-align:right}.data-table .text-center{text-align:center}.empty-state{background:var(--surface);border:2px dashed var(--border);border-radius:var(--radius-lg);text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:4rem 2rem;display:flex}.empty-icon{opacity:.5;margin-bottom:1rem;font-size:3rem}.empty-title{color:var(--text-primary);margin-bottom:.5rem;font-size:1.125rem;font-weight:600}.empty-description{color:var(--text-muted);max-width:400px;font-size:.9375rem}.comparison-section{border-top:1px solid var(--border);margin-top:1.5rem;padding-top:1.5rem}.comparison-title{color:var(--text-primary);margin-bottom:1rem;font-size:.9375rem;font-weight:600}.comparison-grid{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}.comparison-item{border-radius:var(--radius-md);text-align:center;background:var(--surface);border:1px solid var(--border);padding:1rem}.comparison-item.highlight{border-color:var(--primary);background:#3b82f61a}.comparison-label{color:var(--text-muted);margin-bottom:.25rem;font-size:.75rem;display:block}.comparison-value{color:var(--text-primary);margin-bottom:.25rem;font-size:1.125rem;font-weight:700;display:block}.comparison-sub{color:var(--text-muted);font-size:.75rem;display:block}.storage-section{border-top:1px solid var(--border);margin-top:1.5rem;padding-top:1.5rem}.storage-buttons{gap:.75rem;display:flex}.storage-btn{border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);flex:1;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1rem;font-size:.875rem;font-weight:600;display:flex}.storage-btn.load-btn{background:var(--surface);border:2px solid var(--border);color:var(--text-primary)}.storage-btn.load-btn:hover:not(:disabled){border-color:var(--primary);color:var(--primary)}.storage-btn.save-btn{background:var(--success);border:2px solid var(--success);color:#fff}.storage-btn.save-btn:hover:not(:disabled){opacity:.9;box-shadow:0 2px 8px #10b9814d}.storage-btn:disabled{opacity:.5;cursor:not-allowed}.storage-badge{background:var(--primary);color:#fff;border-radius:999px;justify-content:center;align-items:center;min-width:1.25rem;height:1.25rem;padding:0 .375rem;font-size:.75rem;font-weight:700;display:inline-flex}.info-box{border-radius:var(--radius-md);color:var(--text-secondary);background:#3b82f61a;border:1px solid #3b82f64d;margin-top:1rem;padding:1rem;font-size:.875rem;line-height:1.6}.info-box.warning{background:#f59e0b1a;border-color:#f59e0b4d}.info-box.success{background:#10b9811a;border-color:#10b9814d}.info-box.error{background:#ef44441a;border-color:#ef44444d}.divider{background:var(--border);height:1px;margin:1.5rem 0}.divider-text{text-align:center;margin:1.5rem 0;position:relative}.divider-text:before{content:"";background:var(--border);z-index:0;height:1px;position:absolute;top:50%;left:0;right:0}.divider-text span{background:var(--background);color:var(--text-muted);z-index:1;padding:0 1rem;font-size:.875rem;display:inline-block;position:relative}.how-to-use-section{background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--border);margin-top:2rem;padding:2rem}.how-to-use-section h2{color:var(--text-primary);margin-bottom:1.5rem;font-size:1.25rem}.usage-steps{gap:1.5rem;display:grid}.usage-step{align-items:flex-start;gap:1.25rem;display:flex}.step-number{background:var(--primary);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:1.125rem;font-weight:700;display:flex}.step-content{flex:1}.step-content h4{color:var(--text-primary);margin-bottom:.5rem;font-size:1rem}.step-content p{color:var(--text-secondary);margin:0;font-size:.875rem;line-height:1.6}.concept-grid{grid-template-columns:repeat(2,1fr);gap:1.5rem;margin-top:1.5rem;display:grid}.concept-card{background:var(--surface-hover);border-radius:var(--radius-md);border:1px solid var(--border);padding:1.5rem}.concept-card h4{color:var(--primary);margin-bottom:.75rem;font-size:1.125rem}.concept-card p{color:var(--text-secondary);margin-bottom:0;font-size:.875rem;line-height:1.6}.concept-card.crypto h4{color:#f7931a}@media (max-width:1024px){.calculator-layout{grid-template-columns:1fr}.concept-grid{grid-template-columns:1fr;gap:1.5rem}.result-grid,.charts-container{grid-template-columns:1fr}}@media (max-width:768px){.calculator-layout{gap:1.5rem}.result-value{font-size:1.25rem}.button-selector{flex-direction:column}.comparison-grid{grid-template-columns:1fr}.storage-buttons{flex-direction:column}}@media (max-width:480px){.form-input{font-size:.9375rem}.calc-button{padding:.875rem;font-size:.9375rem}.empty-state{padding:3rem 1.5rem}.data-table{font-size:.8125rem}.data-table th,.data-table td{padding:.5rem .75rem}}
