*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{color:#202124;background:#fff;min-height:100vh;font-family:Google Sans,Roboto,Helvetica Neue,Arial,sans-serif}.app{flex-direction:column;min-height:100vh;display:flex}.top-bar{background:#fff;border-bottom:1px solid #dadce0;justify-content:space-between;align-items:center;padding:8px 24px;display:flex}.top-bar-left{align-items:center;gap:10px;display:flex}.logo-icon{flex-shrink:0}.logo-text{color:#5f6368;letter-spacing:0;font-size:22px;font-weight:400}.translator{flex-direction:column;flex:1;align-items:center;gap:12px;width:100%;max-width:1200px;margin:0 auto;padding:20vh 40px 24px;display:flex}.translation-cards{align-items:flex-start;gap:0;width:100%;display:flex}.card{background:#fff;border:1px solid #dadce0;border-radius:8px;flex:1;transition:box-shadow .2s;overflow:hidden}.card:focus-within{border-color:#dadce0;box-shadow:0 1px 6px #20212447}.card-header{justify-content:flex-start;align-items:center;gap:16px;padding:12px 16px 0;display:flex}.lang-selector{gap:4px;display:flex}.lang-option{color:#5f6368;cursor:default;white-space:nowrap;background:0 0;border:none;border-radius:8px;padding:8px 16px;font-size:15px;font-weight:500;transition:background .2s,color .2s}.lang-option.active{color:#1a73e8;background:#e8f0fe}.placeholder{color:#9aa0a6;-webkit-user-select:none;user-select:none;font-size:14px}.text-area{resize:none;color:#202124;background:0 0;border:none;outline:none;width:100%;height:35vh;padding:16px;font-family:inherit;font-size:24px;line-height:1.5}.text-area::placeholder{color:#9aa0a6}.result-area{align-items:flex-start;height:35vh;padding:16px;font-size:24px;line-height:1.5;display:flex;overflow-y:auto}.card-footer{border-top:1px solid #0000;justify-content:space-between;align-items:center;padding:8px 12px;display:flex}.source-card .card-footer,.target-card .card-footer{border-top-color:#f1f3f4}.footer-actions{gap:4px;display:flex}.icon-btn{color:#5f6368;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:8px;transition:background .2s;display:flex}.icon-btn:hover:not(:disabled){color:#202124;background:#f1f3f4}.icon-btn:disabled{color:#dadce0;cursor:default}.char-count{color:#9aa0a6;font-size:12px}.swap-btn{cursor:pointer;background:0 0;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;margin-top:24px;padding:0 12px;transition:opacity .2s;display:flex}.swap-btn:hover{background:#f1f3f4}@media (width<=768px){.translator{padding:16px}.translation-cards{flex-direction:column}.swap-btn{align-self:center;margin:-8px 0;transform:rotate(90deg)}.text-area{min-height:100px;font-size:18px}}