.morse-grid { display:grid !important;grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)) !important;gap:14px;padding:16px;margin:24px auto !important;width:100% !important;max-width:1200px !important;} .morse-card { box-sizing:border-box !important;display:flex !important;align-items:center !important;justify-content:space-between !important;background:#E5F7FF !important;border:2px solid #005276 !important;border-radius:10px !important;padding:14px 16px !important;min-height:10px !important;width:100% !important;} .morse-card .char { font-size:20px !important;font-weight:700 !important;color:#000000 !important;min-width:26px !important;} .morse-card .code { flex:1 !important;text-align:center !important;font-size:16px !important;letter-spacing:2px !important;color:#000000 !important;} .play-btn { width:32px !important;height:32px !important;display:flex !important;align-items:center !important;justify-content:center !important;background:#005276 !important;color:#ffffff !important;font-size:10px !important;line-height:2 !important;border-radius:6px !important;border:none !important;cursor:pointer !important;overflow:visible !important;} html.dark .morse-card, body.dark .morse-card, [data-theme="dark"] .morse-card { background:#E5F7FF !important;border-color:2px solid #005276 !important;} html.dark .morse-card .char, html.dark .morse-card .code, body.dark .morse-card .char, body.dark .morse-card .code, [data-theme="dark"] .morse-card .char, [data-theme="dark"] .morse-card .code { color:#f8fafc !important;} @media (max-width:480px) { .morse-grid { grid-template-columns:repeat(auto-fit, minmax(150px,1fr)) !important;} }