#root{width:100%}*{box-sizing:border-box;margin:0;padding:0}body{color:#f0f0f0;-webkit-font-smoothing:antialiased;background:#0a0a0a;min-height:100vh;font-family:Arial Black,Arial,sans-serif}main{flex-direction:column;gap:1.25rem;padding:1.25rem .875rem 2rem;display:flex}header{text-align:center;padding-top:.25rem}h1{color:#fff;text-shadow:0 0 20px #ff3c0099;font-size:1.75rem;line-height:1.1}.subtitle{color:#aaa;margin-top:.4rem;font-size:.875rem;font-weight:400}.subtitle em{color:#e63535;font-style:normal;font-weight:700}.converter{background:#111;border:2px solid #333;border-radius:12px;flex-direction:column;gap:.875rem;padding:1rem;display:flex}.type-tabs{gap:.375rem;display:flex}.tab{color:#888;cursor:pointer;background:#1a1a1a;border:2px solid #333;border-radius:8px;flex:1;min-height:44px;padding:.6rem .25rem;font-size:.8rem;font-weight:700;transition:all .15s}.tab:hover{color:#ccc;border-color:#555}.tab.active{color:#fff;background:#e63535;border-color:#e63535}.input-row{flex-direction:column;gap:.5rem;display:flex}.input-row-top{gap:.5rem;display:flex}input[type=number]{color:#fff;background:#1a1a1a;border:2px solid #333;border-radius:8px;outline:none;flex:1;min-height:48px;padding:.75rem .875rem;font-size:1.1rem;transition:border-color .15s}input[type=number]:focus{border-color:#e63535}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}select{color:#fff;cursor:pointer;background:#1a1a1a;border:2px solid #333;border-radius:8px;outline:none;min-height:48px;padding:.75rem .5rem;font-size:1rem;font-weight:700}.convert-btn{color:#fff;cursor:pointer;letter-spacing:.05em;background:#e63535;border:none;border-radius:8px;width:100%;min-height:48px;padding:.875rem;font-size:1rem;font-weight:900;transition:background .15s,transform .1s}.convert-btn:hover:not(:disabled){background:#f44;transform:scale(1.02)}.convert-btn:disabled{opacity:.5;cursor:not-allowed}.results{border-top:1px solid #222;flex-direction:column;gap:.375rem;padding-top:1rem;display:flex}.results-title{color:#888;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.125rem;font-size:.75rem}.result-card{background:#1a1a1a;border:1px solid #2a2a2a;border-radius:8px;align-items:center;gap:.75rem;padding:.55rem .875rem;animation:.2s pop;display:flex}@keyframes pop{0%{opacity:0;transform:translateY(5px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.result-emoji{flex-shrink:0;font-size:1.5rem;line-height:1}.result-text{color:#f0f0f0;font-size:.95rem}.result-text strong{color:#fff;font-size:1.15rem}.result-card.compound{background:#1a1500;border-color:#3a2a00}.result-card.compound .result-text strong{color:gold}.result-card.banana{background:#1a1500;border-style:dashed;border-color:#3a3000}.result-card.banana .result-text strong{color:#ffe135}.loading-msg{text-align:center;color:#555;font-size:.875rem}footer{text-align:center;color:#444;flex-direction:column;gap:.4rem;font-size:.8rem;display:flex}footer a{color:#0a66c2;text-decoration:none}footer a:hover{text-decoration:underline}.disclaimer{color:#333;font-size:.7rem;line-height:1.5}@media (width>=600px){main{gap:1.75rem;max-width:620px;margin:0 auto;padding:2rem 1rem 3rem}h1{font-size:2.75rem}.subtitle{font-size:1rem}.converter{gap:1.25rem;padding:1.5rem}.tab{font-size:.9rem}.input-row{flex-direction:row}.input-row-top{flex:1}.convert-btn{width:auto;padding:.75rem 1.25rem}.result-emoji{font-size:1.6rem}.result-text{font-size:1rem}.result-text strong{font-size:1.25rem}}