body{margin:0;font-family:Arial,sans-serif;background-color:#cee8e9;color:#fff}.cards-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;padding:2rem;background:#5884eb55;border-radius:23px;min-height:100vh}.card-item{background:#2a2a2a;border-radius:53px;padding:1.5rem;text-align:center;color:#fff;box-shadow:0 6px 15px #00000040;transition:transform .2s ease,box-shadow .2s ease}.card-item:hover{transform:translateY(-6px);box-shadow:0 12px 25px #00000059;border:1px solid #61dafb}.card-item h3{margin-bottom:.8rem;font-size:1.3rem;color:#61dafb}.card-item p{font-size:.95rem;color:#ddd}.card-item button{margin-top:1rem;background:#61dafb;border:none;padding:.6rem 1.2rem;color:#000;font-weight:700;border-radius:6px;cursor:pointer;transition:background .2s ease}.card-item button:hover{background:#21a1f1}.page_404{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center;font-family:Arvo,serif;background:#fff}.four_zero_four_bg{display:flex;flex-direction:column;align-items:center;margin-bottom:1rem}.four_zero_four_bg h1{font-size:6rem;font-weight:700;color:#333;margin:0 0 1rem}.four_zero_four_bg img{max-width:450px;height:auto}.contant_box_404 h3{font-size:1.8rem;font-weight:600;margin:.5rem 0;color:#222}.contant_box_404 p{font-size:1rem;color:#555;margin-bottom:1.5rem}.link_404{display:inline-block;padding:.7rem 1.5rem;background:#39ac31;color:#fff!important;font-weight:600;text-decoration:none;border-radius:6px;transition:background .2s ease-in-out}.link_404:hover{background:#2e8b2d}@media (max-width: 600px){.four_zero_four_bg h1{font-size:4rem}.contant_box_404 h3{font-size:1.4rem}.contant_box_404 p{font-size:.9rem}.four_zero_four_bg img{max-width:180px}}:root{color-scheme:dark;--bg-gradient: linear-gradient(135deg, #224bb7 0%, #2bd2ff 100%);--card-gradient: linear-gradient(135deg, #292d3e 0%, #20232a 100%);--accent: #40e9ff;--accent-hover: #21b1e5;--text-light: #eef6fc;--text-muted: #bbb;--shadow: 0 6px 12px rgba(32, 55, 92, .18)}body,#root{margin:0;font-family:Inter,system-ui,sans-serif;background:var(--bg-gradient);height:100%}.home{min-height:100vh;padding:2.5rem 1rem;color:var(--text-light);display:flex;flex-direction:column;align-items:center;background:var(--bg-gradient)}.cards-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:32px;max-width:900px;width:100%}.card-item{background:var(--card-gradient);border-radius:1.2rem;padding:2.2rem 1.4rem;text-align:center;color:var(--text-light);box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s,border .2s;border:1.5px solid transparent}.card-item:hover{transform:translateY(-8px) scale(1.03);box-shadow:0 14px 28px #20375c3d;border:1.5px solid var(--accent)}.card-item h3{font-size:1.7rem;color:var(--accent);margin-bottom:1.2rem;letter-spacing:.04em}.card-item p{font-size:1rem;color:var(--text-muted)}.card-item button{margin-top:1.4rem;padding:.7rem 1.7rem;background:var(--accent);color:#20232a;border:none;font-weight:700;font-size:1.05rem;border-radius:7px;cursor:pointer;box-shadow:0 2px 8px #20375c12;transition:background .22s}.card-item button:hover{background:var(--accent-hover)}.app{display:flex;flex-direction:column;min-height:100vh;background:#171c28;color:var(--text-light)}.topbar{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;background:linear-gradient(90deg,#151e3d 75%,var(--accent) 125%);border-bottom:2px solid #1a2540;box-shadow:0 2px 12px #20375c1a;position:sticky;top:0;z-index:100}.topbar h1{font-size:1.2rem;color:var(--accent);margin:0;letter-spacing:.06em}.topbar a{color:var(--accent);text-decoration:none;font-size:1rem;font-weight:500}.message-list{flex:1;padding:18px 12px;overflow-y:auto;display:flex;flex-direction:column;gap:12px;scrollbar-width:thin;scrollbar-color:var(--accent) #1a1a1a}.message{border-radius:15px;padding:13px 18px;border:1.5px solid #223263;box-shadow:var(--shadow);max-width:75%;word-break:break-word;transition:background .2s}.message .meta{font-size:.8rem;color:var(--text-muted);margin-bottom:5px}.message .user{color:var(--accent)}.message .text{margin:0 0 6px;white-space:pre-wrap}.code-block{background:#23293b;border:1.5px solid #223263;border-radius:8px;padding:10px;font-family:Fira Code,ui-monospace,monospace;font-size:.88rem;color:#eaeaea;overflow-x:auto;margin:0 0 6px}.message-input{display:flex;flex-wrap:wrap;gap:12px;padding:16px 20px;border-top:2px solid #1a2540;background:#151e3d;align-items:flex-start}.message-input .name{flex:0 0 140px;padding:12px;border-radius:8px;border:1.5px solid #283046;background:#20232a;color:#fff;outline:none;height:44px}.text-with-emoji{flex:1 1 300px;position:relative;display:flex;align-items:flex-end}.text-with-emoji textarea{width:100%;border-radius:8px;padding:12px 42px 12px 12px;border:1.5px solid #283046;background:#20232a;color:#fff;resize:none;min-height:52px;max-height:150px;font-family:JetBrains Mono,monospace;line-height:1.45}.emoji-toggle{position:absolute;right:10px;bottom:10px;background:transparent;border:none;cursor:pointer;font-size:35px;padding:4px;color:var(--accent)}.emoji-toggle:hover{color:var(--accent-hover)}.emoji-picker{position:absolute;bottom:60px;right:0;z-index:1000}.file-upload{flex:0 0 auto;background:#23293b;color:#bbb;padding:12px 16px;border-radius:8px;border:1.5px solid #283046;cursor:pointer;font-size:.95rem;min-width:130px;text-align:center;transition:background .2s;height:44px}.file-upload:hover{background:#353b54;color:#fff}.message-input button[type=submit]{flex:0 0 auto;background:var(--accent);color:#20232a;font-weight:700;padding:12px 20px;border:none;border-radius:8px;cursor:pointer;min-width:90px;height:60px}.message-input button[type=submit]:hover{background:var(--accent-hover)}@media (max-width: 600px){.message-input{flex-direction:column;align-items:stretch}.message-input .name,.text-with-emoji,.file-upload,.message-input button[type=submit]{width:100%}.text-with-emoji{min-width:unset}.emoji-picker{bottom:60px;right:10px}}@media (max-width: 480px){.cards-container{grid-template-columns:1fr;gap:24px}.card-item{padding:1rem;border-radius:12px}.home h1{font-size:1.4rem}.topbar{flex-direction:column;gap:8px;align-items:flex-start}.message{max-width:100%}}@media (max-width: 768px){.cards-container{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.topbar h1{font-size:.97rem}}.search-box{background:#20232a;border:1.5px solid #283046;color:#fff;padding:8px 12px;border-radius:8px;font-size:.95rem;margin:0 12px}.copy-btn{margin-top:6px;padding:6px 10px;font-size:.85rem;background:var(--accent);color:#20232a;border:none;border-radius:6px;cursor:pointer;float:right}.copy-btn:hover{background:var(--accent-hover)}.show-more{margin-top:4px;font-size:.85rem;color:var(--accent);background:transparent;border:none;cursor:pointer;text-decoration:underline}.copy-btn{background:transparent;border:none;cursor:pointer;margin-top:6px;color:var(--accent);display:flex;align-items:center;gap:4px}.copy-btn:hover{color:var(--accent-hover)}.show-more-btn{background:none;border:none;color:var(--accent);cursor:pointer;font-size:.85rem;margin-top:4px}.message-list::-webkit-scrollbar{width:6px}.message-list::-webkit-scrollbar-thumb{background:var(--accent);border-radius:10px}.message-list::-webkit-scrollbar-track{background:#1a1a1a}.footer{text-align:center;padding:1rem 0;background-color:#f4f6f9;border-top:1px solid #ddd;font-size:.9rem;color:#555;margin-top:2rem}.footer-email{display:block;color:#0078ff;text-decoration:none;margin-top:.3rem;transition:color .3s ease}.footer-email:hover{color:#0056b3}