body{margin:0;font-family:Segoe UI,Arial;background:#f5f7fb;color:#111}.layout{display:flex;height:100vh}.sidebar{width:200px;background:#fff;border-right:1px solid #e5e7eb;padding:15px;display:flex;flex-direction:column}.sidebar h2{margin-bottom:10px}.sidebar input{padding:8px;margin-bottom:10px;border:1px solid #ddd;border-radius:6px}.sidebar a{padding:8px;margin:3px 0;text-decoration:none;color:#333;border-radius:6px;display:flex;justify-content:space-between}.sidebar a.active{background:#e0e7ff;color:#1d4ed8}.content{flex:1;padding:20px;background:#f9fafb}.tool-page{padding:20px}.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;width:100%}@media(max-width:768px){.tool-grid{grid-template-columns:1fr}}textarea:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 2px #2563eb33}.panel{background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:12px;overflow:hidden}textarea{width:100%;max-width:100%;height:300px;padding:10px;border:1px solid #ddd;border-radius:6px;resize:vertical}pre{background:#f8fafc;height:300px;overflow:auto;padding:10px;border-radius:6px}.actions{margin-top:10px;display:flex;gap:10px}*{box-sizing:border-box}button{border:none;border-radius:8px;padding:8px 14px;font-size:14px;cursor:pointer;transition:all .2s ease}.btn-primary{background:#2563eb;color:#fff}.btn-primary:hover{background:#1d4ed8}.btn-secondary{background:#e5e7eb;color:#374151}.btn-secondary:hover{background:#d1d5db}.btn-success{background:#22c55e;color:#fff}.btn-success:hover{background:#16a34a}.btn-danger{background:#ef4444;color:#fff}.btn-danger:hover{background:#dc2626}.actions{display:flex;gap:10px;margin-top:10px}button{box-shadow:0 1px 2px #0000001a}button:hover{transform:translateY(-1px)}input{width:100%;padding:10px;border:1px solid #ddd;border-radius:6px;margin-bottom:10px}.color-preview{width:100%;height:80px;border-radius:8px;margin:10px 0;border:1px solid #ddd}.color-values div{display:flex;justify-content:space-between;margin:5px 0}.tool-page{padding:30px}.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.panel{background:#fff;padding:20px;border-radius:12px;border:1px solid #ddd}textarea,pre{width:100%;min-height:300px;padding:12px;border-radius:8px;border:1px solid #ccc}.actions{margin-top:15px;display:flex;gap:10px}.ad-container{margin-top:30px;width:100%;overflow:hidden}.layout{display:flex;min-height:100vh;background:#f5f7fb}.sidebar{width:220px;background:#fff;border-right:1px solid #e5e7eb;padding:20px;display:flex;flex-direction:column}.sidebar h2{margin-bottom:20px}.sidebar a{padding:10px;margin:4px 0;text-decoration:none;color:#333;border-radius:8px}.sidebar a:hover{background:#f3f4f6}.content{flex:1;padding:25px;overflow-x:hidden}.rightsidebar{width:280px;background:#fff;border-left:1px solid #e5e7eb;padding:20px;position:sticky;top:0;height:100vh}.sidebar-ad{margin-top:20px;padding:10px;border-radius:12px;overflow:hidden;background:#fafafa}@media(max-width:1100px){.rightsidebar{display:none}}