.tab-container{display:flex;margin-bottom:20px;border-radius:8px;overflow:hidden;background-color:var(--color-bg-tertiary);border:1px solid var(--color-border)}.tab-button{flex:1;padding:12px;background:none;border:none;cursor:pointer;font-size:16px;font-weight:600;transition:var(--transition);color:var(--color-text);position:relative;text-align:center}.tab-button:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:3px;background-color:transparent;transition:var(--transition)}.tab-button.active{color:var(--color-accent);background-color:var(--color-surface)}.tab-content{display:none}.tab-content.active{display:block}.step-indicator{display:flex;align-items:center;margin-bottom:12px}.step-number{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background-color:var(--color-accent);color:#fff;font-weight:600;margin-right:10px;font-size:14px;box-shadow:var(--shadow-xs)}.step-text{font-weight:600;font-size:16px;color:var(--color-text)}.password-input-container{position:relative;display:flex;align-items:center}.toggle-password{position:absolute;right:12px;background:none;border:none;cursor:pointer;color:var(--color-text-secondary);display:flex;align-items:center;justify-content:center;padding:0}.toggle-password:hover{color:var(--color-accent)}.password-strength-meter{height:4px;background-color:var(--color-bg-tertiary);border-radius:2px;margin-top:8px;overflow:hidden}.strength-bar{height:100%;width:0;transition:width .3s,background-color .3s}.password-strength-text{font-size:12px;margin-top:4px;color:var(--color-text-secondary)}.usage-guide{background-color:var(--color-surface);border-radius:8px;padding:16px;margin-top:20px;margin-bottom:24px;border:1px solid var(--color-border)}.usage-guide h3{font-size:16px;margin-top:0;margin-bottom:12px;color:var(--color-accent)}.usage-guide ol{margin:0;padding-left:20px}.usage-guide li{margin-bottom:8px;line-height:1.5}.usage-guide li:last-child{margin-bottom:0}.action-buttons{display:flex;gap:10px;margin-top:15px;flex-wrap:wrap}.action-button{display:flex;align-items:center;padding:8px 16px;border-radius:6px;background-color:var(--color-surface);border:1px solid var(--color-border);cursor:pointer;transition:all .2s;font-size:14px;box-shadow:var(--shadow-xs)}.action-button i{margin-right:8px}.action-button:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-hover);box-shadow:0 2px 5px #0000001a}.share-action{background-color:var(--color-accent-light);border-color:var(--color-border-hover);color:var(--color-accent)}.share-action:hover{background-color:var(--color-accent-light);border-color:var(--color-accent)}@media(max-width:768px){.tab-button{padding:10px;font-size:14px}.step-text{font-size:14px}.usage-guide{padding:12px}.usage-guide h3{font-size:15px}.usage-guide li{font-size:14px}.btn-primary{width:100%;padding:12px 16px;font-size:16px}.action-buttons{justify-content:space-between}.action-button{padding:8px 12px;font-size:13px}}.tool-header{background-color:var(--color-accent);display:flex;align-items:center;padding:12px 16px;position:relative}.tool-header .back-link{color:#fff;display:flex;align-items:center;justify-content:center;margin-right:8px}.tool-header .tool-title{color:#fff;font-size:18px;font-weight:600;margin:0;flex:1;text-align:center}.tool-header .share-button{color:#fff;background:none;border:none;padding:8px;cursor:pointer;display:flex;align-items:center;justify-content:center}.btn-primary{background-color:var(--color-accent);color:#fff;border:none;border-radius:8px;padding:12px 24px;font-weight:600;cursor:pointer;transition:background-color .3s;box-shadow:var(--shadow-xs)}.btn-primary:hover{background-color:#8a7ad0}.tab-button.active{color:var(--color-accent)}.tab-button.active:after{background-color:var(--color-accent)}.step-number{background-color:var(--color-accent)}.usage-guide h3{color:var(--color-accent)}.form-textarea,.form-input{font-size:16px;background-color:var(--color-bg);color:var(--color-text)}.result-box{font-size:16px;word-break:break-all;background-color:var(--color-bg-secondary);color:var(--color-text)}
