@media (max-width: 768px) {
      #tools-link {background: rgb(180 180 180 / 45%);color: red;border-radius: 30px;}
    }
    .encode-page *{box-sizing:border-box;}
    .encode-page h1{font-size:24px;color:#1e40af;margin-bottom:20px;font-weight:500;}
    .encode-page h2{font-size:18px;color:#1e40af;margin:0 0 15px 0;font-weight:500;}
    .encode-page h3{font-size:16px;color:#1e40af;margin:0 0 10px 0;font-weight:500;}
    .encode-page .tab-nav{display:flex;margin-bottom:15px;}
    .encode-page .tab-btn{background:none;border:none;cursor:pointer;font-size:14px;color:#6b7280;border-bottom:2px solid transparent;transition:all 0.2s;}
    .encode-page .tab-btn:hover{color:#1e40af;border-bottom-color:#1e40af;transition:all 0.7s;}
    .encode-page .tab-btn.active{color:#1e40af;border-bottom-color:#1e40af;font-weight:500;}
    .encode-page .tab-content{display:none;}
    .encode-page .tab-content.active{display:block;}
    .encode-section{padding:20px;border:1px solid #d1d5db;}
    .form-group{margin-bottom:15px;}
    .encode-page label{display:block;margin-bottom:5px;color:#374151;font-size:14px;font-weight:500;}
    .encode-page input[type="text"],.encode-page textarea{width:100%;padding:10px;border:1px solid #d1d5db;border-radius:4px;font-size:14px;font-family:inherit;transition:border-color 0.2s;background:unset;}
    .encode-page input[type="text"]:focus,.encode-page textarea:focus{outline:none;border-color:#1e40af;box-shadow:0 0 0 3px rgba(30,64,175,0.1);}
    .encode-page textarea{max-height:2000px;height:100px;resize:vertical;background:unset;}
    .encode-page button{background:#6b7280;color:#fff;border:none;padding:10px 16px;cursor:pointer;font-size:14px;transition:background 0.2s;}
    .encode-page .btn-primary{background:#1e40af;font-weight:500;}
    .encode-page .btn-primary:hover{background:#1d4ed8;}
    .encode-page .btn-success{background:#059669;}
    .encode-page .btn-success:hover{background:#047857;}
    .encode-page .btn-danger{background:#dc2626;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:12px;transition:background-color 0.2s;}
    .encode-page .btn-danger:hover{background:#b91c1c;}
    .encode-page .mycodes-section{padding:20px;border:1px solid #d1d5db;border-radius:4px;}
    .encode-page .mycodes-header{margin-bottom:20px;}
    .encode-page .mycodes-actions{display:flex;justify-content:flex-end;gap:10px;margin-bottom:15px;}
    .encode-page .mycode-item{display:flex;justify-content:space-between;align-items:flex-start;padding:12px;margin:8px 0;border:1px solid #d1d5db;border-radius:4px;transition:all 0.2s;}
    .encode-page .mycode-item:hover{border-color:#1e40af;box-shadow:0 2px 4px rgba(0,0,0,0.1);}
    .encode-page .mycode-info{flex:1;margin-right:12px;}
    .encode-page .mycode-code{font-family:'Courier New',monospace;font-weight:bold;color:#1e40af;font-size:14px;margin-bottom:4px;}
    .encode-page .mycode-meta{font-size:11px;color:#6b7280;}
    .encode-page .mycode-actions{display:flex;gap:6px;flex-wrap:wrap;}
    .encode-page .mycode-actions button{padding:4px 8px;font-size:11px;min-width:60px;}
    .encode-page .mycode-item.expired{opacity:0.6;background:#f9fafb;}
    .encode-page .mycode-item.expired .mycode-code{color:#6b7280;}
    .encode-page .mycode-item.expired .mycode-meta{color:#dc2626;font-weight:500;}
    .encode-page .btn-secondary{background:#6b7280;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:12px;transition:background-color 0.2s;}
    .encode-page .btn-secondary:hover{background:#4b5563;}
    .encode-page .result{margin-top:15px;padding:15px;border:1px solid #d1d5db;border-radius:4px;background:#f8fafc;}
    .encode-page .result.success{border-color:#059669;background:#ecfdf5;}
    .encode-page .result.error{border-color:#dc2626;background:#fef2f2;color:#dc2626;}
    .encode-page .result-value{background:#fff;padding:8px;border:1px solid #d1d5db;border-radius:4px;word-break:break-all;font-family:'Courier New',monospace;font-size:13px;cursor:pointer;transition:all 0.2s;position:relative;white-space:pre-wrap;line-height:1.4;user-select:text;max-width:250px;min-width:150px;text-align:center;}
    .encode-page .result-value:hover{background:#f8fafc;border-color:#1e40af;box-shadow:0 0 0 3px rgba(30,64,175,0.1);}
    .encode-page .result-value:active{background:#e0e7ff;}
    .encode-page .result-value::after{content:"Click to copy";position:absolute;top:-25px;right:0;background:#374151;color:#fff;padding:4px 8px;border-radius:4px;font-size:11px;opacity:0;transition:opacity 0.2s;pointer-events:none;white-space:nowrap;}
    .encode-page .result-value:hover::after{opacity:1;}
    .encode-page .action-buttons{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap;}
    .encode-page .stats{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:-10px;margin-bottom:10px;font-size:12px;color:#6b7280;}
    .encode-page .stats2{display:flex;gap:15px;margin-top:10px;font-size:12px;color:#6b7280;}
    .encode-page .file-input{margin:10px 0;}
    .encode-page .file-input input[type="file"]{display:none;}
    .encode-page .file-label{display:inline-block;padding:8px 14px;background:#3b82f6;color:#fff;border-radius:4px;cursor:pointer;font-size:12px;transition:background 0.2s;white-space:nowrap;}
    .encode-page .file-label:hover{background:#2563eb;}
    .encode-page .info-section{padding:20px;border:1px solid #d1d5db;border-radius:4px;}
    .encode-page .info-section ul{margin:15px 0;padding-left:20px;}
    .encode-page .info-section li{margin-bottom:8px;line-height:1.5;}
    .encode-page .info-section h3{margin-top:25px;margin-bottom:15px;padding-top:15px;border-top:1px solid #d1d5db;}
    @media(max-width:768px){.encode-section{padding:30px 5px 5px 5px;border:1px solid #d1d5db;}#encode{background-color:rgba(0,128,128,0.56);border-radius:5px;}}