:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-height:100vh;background-image:url(src/assets/background_spider.jpeg);background-size:cover;background-position:center;background-repeat:no-repeat}.layout{display:flex;flex-direction:column;min-height:100vh}.content{flex:1;width:1000px;margin:40px auto}.navbar{background:#2c2c2c;padding:14px 0;position:sticky;top:0;z-index:100}.nav-container{width:1000px;margin:auto}.nav-container a{margin-right:20px;color:#fff;text-decoration:none}.footer{background:#1a1a1a;text-align:center;padding:20px}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}}.home{width:1000px;margin:40px auto;position:relative}.card-container{display:grid;grid-template-columns:1fr 1fr;gap:20px}.card{font-size:1.5em;background:#343e45d9;padding:25px;border-radius:12px;text-decoration:none;color:#fff;transition:transform .2s,background .2s}.card:hover{transform:translateY(-6px);background:#343e45f2}h1{font-size:50px}h1{font-size:50px;margin-bottom:10px}.hado-container{display:flex;flex-direction:column;align-items:center;gap:20px}.translate-btn{width:80%;height:50px;font-size:25px;align-self:flex-start;margin-left:10%;background:#343e45d9;border:1px solid #333232}.translate-btn:hover{transform:translateY(-6px);background:#343e45f2}.input-box{width:180%;height:300px;font-size:30px;padding:15px;background:#343e4580;border:1px solid #333232}.input-box::placeholder{color:#fff}.output-box{width:180%;height:300px;font-size:30px;padding:15px;background:#343e4580;border:1px solid #333232}.info-wrapper{display:flex;justify-content:center;margin-top:60px}.info-card{background:#1e2328d9;padding:40px;border-radius:20px;max-width:900px;color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.mapping-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:20px;font-size:18px}.info-card h1{font-size:50px}.info-card h2{font-size:44px}.info-card p{font-size:27px}