: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(/background_spider.jpeg);background-size:cover;background-position:center;background-repeat:no-repeat}.layout{display:flex;flex-direction:column;min-height:100vh}.content{width:100%;max-width:1000px;margin:40px auto;padding:0 20px;flex:1}.navbar{background:#2c2c2c;padding:14px 0;position:sticky;top:0;z-index:100}.nav-container{width:100%;max-width:1000px;margin:auto;padding:0 20px}.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:100%;max-width:1200px;margin:20px auto;padding:0 16px;position:relative}.card-container{display:grid;grid-template-columns:1fr;gap:20px}.card{font-size:1.1em;background:#343e45d9;padding:18px;border-radius:12px;text-decoration:none;color:#fff;transition:transform .2s,background .2s}.card:hover{transform:translateY(-3px);background:#343e45f2}h1{font-size:28px;text-align:center;margin-bottom:20px}@media(min-width:600px){.card-container{grid-template-columns:1fr 1fr}h1{font-size:36px}}@media(min-width:900px){h1{font-size:50px}.card{font-size:1.4em;padding:25px}}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;overflow-x:hidden}body{margin:0;font-size:18px}.hado-container{display:flex;flex-direction:column;gap:25px;padding:20px;width:100%;max-width:1100px;margin:0 auto}h1{text-align:center;font-size:42px;margin-bottom:10px;color:#fff}.translate-btn,.input-box,.output-box{width:100%}.translate-btn{height:60px;font-size:20px;background:#343e45d9;border:1px solid #333232;color:#fff;cursor:pointer;transition:.2s}.translate-btn:hover{transform:translateY(-3px);background:#343e45f2}.input-box,.output-box{min-height:280px;font-size:18px;padding:16px;background:#343e4580;border:1px solid #333232;color:#fff;border-radius:12px;resize:none}.input-box::placeholder{color:#ddd}@media(min-width:768px){h1{font-size:48px}.input-box,.output-box{min-height:320px}}@media(min-width:900px){.hado-container{align-items:center}.input-box,.output-box{max-width:900px;min-height:350px;font-size:20px}.translate-btn{width:400px;font-size:20px}}.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}