.my-wrap{width:100%;margin:0 auto;padding:4px 0 20px}
.my-card{background:#fff;border:1px solid #e3e6ea;border-radius:12px;box-shadow:0 8px 24px rgba(15,23,42,.06);padding:20px;margin-bottom:16px}
.my-head{display:flex;align-items:center;gap:10px}
.my-head h2,.my-card.my-about h2{flex:1;display:flex;align-items:center;gap:8px;margin:0;padding-bottom:10px;border-bottom:1px solid #f0f0f0;font-size:16px;font-weight:600;color:#333}
.my-head h2:before,.my-card.my-about h2:before{content:"";display:inline-block;width:4px;height:16px;border-radius:2px;background:#ff6500}
.my-card.my-about h2{flex:none}
.my-desc{color:#9499a0;font-size:13px;margin:12px 0 14px;line-height:1.7}
.my-mode{display:flex;background:#f6f7f9;border-radius:8px;overflow:hidden;margin-bottom:16px}
.my-mode-btn{flex:1;border:none;background:transparent;color:#61666d;padding:10px 0;font-size:14px;cursor:pointer;font-family:inherit;transition:all .2s;white-space:nowrap}
.my-mode-btn.active{background:#ff6500;color:#fff;font-weight:500}
.my-mode-btn:hover:not(.active){background:rgba(255,101,0,.08);color:#ff6500}
.my-label{font-size:14px;font-weight:500;color:#333;margin-bottom:6px}
.my-password{display:block;width:100%;box-sizing:border-box;border:1px solid #dcdfe6;border-radius:8px;outline:none;margin-bottom:12px;padding:10px 14px;font-family:inherit;font-size:15px;color:#1d2129;background:#fff;transition:border-color .2s}
.my-password:focus{border-color:#ff6500;box-shadow:0 0 0 2px rgba(255,101,0,.12)}
.my-ta{margin-bottom:12px}
.my-ta textarea{width:100%;min-height:100px;padding:10px 14px;font-size:15px;line-height:1.6;font-family:inherit;border:1px solid #dcdfe6;border-radius:8px;outline:none;resize:vertical;box-sizing:border-box;max-width:100%;transition:border-color .2s}
.my-ta textarea:focus{border-color:#ff6500;box-shadow:0 0 0 2px rgba(255,101,0,.12)}
.my-btns{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.my-btn{border-radius:8px;padding:10px 20px;font-size:14px;cursor:pointer;font-family:inherit;transition:all .2s;white-space:nowrap}
.my-btn-primary{background:#ff6500;border:none;color:#fff}
.my-btn-primary:hover:not(:disabled){background:#e85a00;color:#fff}
.my-btn-primary:disabled{opacity:.6;cursor:not-allowed}
.my-btn-secondary{background:#f6f7f9;border:1px solid #dcdfe6;color:#61666d}
.my-btn-secondary:hover{background:rgba(255,101,0,.08);border-color:#ff6500;color:#ff6500}
.my-error{color:#ff4d4f;background:rgba(255,77,79,.08);border-radius:8px;margin-bottom:16px;padding:8px 12px;font-size:14px;line-height:1.6}
.my-result-wrap{display:flex;align-items:flex-start;gap:10px;margin-bottom:16px}
.my-result{flex:1;background:#f6f7f9;border-radius:8px;padding:16px;min-height:60px;font-size:16px;line-height:1.8;word-break:break-all}
.my-btn-copy{flex-shrink:0;background:#ff6500;color:#fff;border:none;border-radius:8px;padding:8px 16px;font-size:13px;cursor:pointer;font-family:inherit;transition:background .2s}
.my-btn-copy:hover{background:#e85a00}
.my-faq{color:#9499a0;font-size:13px;line-height:1.8}
.my-faq p{margin:0}
.my-faq h3{font-size:15px;margin:0 0 4px;color:#61666d}
.night .my-card{background:#222630;border-color:#3a3f48;box-shadow:none}
.night .my-head h2,.night .my-card.my-about h2{color:#e6e8eb;border-color:#3a3f48}
.night .my-faq h3{color:#c3c9d2}
.night .my-desc{color:#9aa2ad}
.night .my-mode{background:#1a1d24}
.night .my-mode-btn{color:#9aa2ad}
.night .my-mode-btn:hover:not(.active){background:#2b2f36;color:#ff8627}
.night .my-label{color:#e6e8eb}
.night .my-password{background:#181a1b;border-color:#444;color:#eee}
.night .my-password:focus{border-color:#ff8627;box-shadow:0 0 0 2px rgba(255,134,39,.15)}
.night .my-ta textarea{background:#181a1b;border-color:#444;color:#eee}
.night .my-ta textarea:focus{border-color:#ff8627;box-shadow:0 0 0 2px rgba(255,134,39,.15)}
.night .my-btn-secondary{background:#2b2f36;border-color:#3a3f48;color:#e6e8eb}
.night .my-btn-secondary:hover{border-color:#ff8627;color:#ff8627;background:#1f2329}
.night .my-result{background:#1a1d24;color:#e6e8eb}
.night .my-faq{color:#9aa2ad}
@media (max-width:640px){.my-btns{flex-direction:column}.my-btns .my-btn{width:100%}.my-result-wrap{flex-direction:column}.my-result-wrap .my-btn-copy{width:100%;text-align:center}.my-card{padding:16px}}
