@media (max-width: 375px){.control-area{min-height:100px;padding:8px;gap:8px}.mode-buttons{grid-template-columns:repeat(5,1fr);gap:4px;max-width:320px}.mode-btn{min-width:50px;height:50px;font-size:8px;padding:4px 2px}.effects-buttons{justify-content:center;gap:8px;max-width:280px}.effect-btn{min-width:50px;height:50px;font-size:8px;padding:4px 2px;flex-shrink:0}.play-controls{gap:10px}.control-btn{width:38px;height:38px;font-size:14px}.play-btn{width:46px;height:46px;font-size:16px}.footer{min-height:45px;padding:8px}.footer-content{font-size:8px;gap:4px}}@media (min-width: 376px) and (max-width: 414px){.control-area{min-height:115px;padding:10px;gap:10px}.mode-buttons{max-width:380px;gap:6px}.mode-btn{min-width:58px;height:58px;font-size:9px}.effects-buttons{max-width:320px;gap:10px}.effect-btn{min-width:58px;height:58px;font-size:9px}}@media (min-width: 415px) and (max-width: 480px){.control-area{min-height:120px;padding:12px;gap:12px}.mode-buttons{max-width:420px;gap:8px}.mode-btn{min-width:62px;height:62px;font-size:10px}.effects-buttons{max-width:340px;gap:12px}.effect-btn{min-width:62px;height:62px;font-size:10px}}@media (orientation: landscape) and (max-width: 768px) and (max-height: 500px){.control-area{min-height:90px;padding:8px;gap:8px}.mode-buttons{grid-template-columns:repeat(5,1fr);gap:6px;max-width:100%}.mode-btn{min-width:55px;height:50px;font-size:9px}.effects-buttons{justify-content:center;gap:10px;max-width:300px}.effect-btn{min-width:55px;height:50px;font-size:9px}.play-controls{gap:12px}.control-btn{width:40px;height:40px}.play-btn{width:48px;height:48px}.footer{min-height:40px}.footer-content{flex-direction:row;gap:12px}.footer-left,.footer-right{gap:8px}}@media (hover: none) and (pointer: coarse){.mode-btn,.effect-btn,.control-btn,.play-btn{min-height:44px;min-width:44px}.mode-buttons,.effects-buttons{gap:8px}.play-controls{gap:16px}.mode-btn:hover,.effect-btn:hover,.control-btn:hover,.play-btn:hover{transform:none;box-shadow:none}}@media (max-width: 768px) and (-webkit-min-device-pixel-ratio: 2){.mode-btn svg,.effect-btn svg,.control-btn svg{width:18px;height:18px}.play-btn svg{width:22px;height:22px}}@media (prefers-reduced-motion: reduce){.control-area,.mode-btn,.effect-btn,.control-btn,.play-btn{transition:none}}@media (prefers-contrast: high){.mode-btn,.effect-btn,.control-btn,.play-btn{border-width:2px}.mode-btn.active,.effect-btn.active{border-width:3px}}@media (max-width: 768px){html[lang=en] .mode-btn,html[lang=es] .mode-btn,html[lang=pt] .mode-btn,html[lang=fr] .mode-btn,html[lang=it] .mode-btn,html[lang=nl] .mode-btn,html[lang=sv] .mode-btn,html[lang=ro] .mode-btn{min-width:60px;font-size:10px;padding:8px 4px}html[lang=en] .effect-btn,html[lang=es] .effect-btn,html[lang=pt] .effect-btn,html[lang=fr] .effect-btn,html[lang=it] .effect-btn,html[lang=nl] .effect-btn,html[lang=sv] .effect-btn,html[lang=ro] .effect-btn{min-width:60px;font-size:10px;padding:8px 4px;flex-shrink:0}html[lang=de] .mode-btn,html[lang=fi] .mode-btn,html[lang=hu] .mode-btn,html[lang=de] .effect-btn,html[lang=fi] .effect-btn,html[lang=hu] .effect-btn{min-width:68px;font-size:9px;padding:8px 3px;line-height:1.1}html[lang=pl] .mode-btn,html[lang=cs] .mode-btn,html[lang=pl] .effect-btn,html[lang=cs] .effect-btn{min-width:64px;font-size:9px;padding:8px 4px}}@media (max-width: 768px){html[lang=ru] .mode-btn,html[lang=uk] .mode-btn,html[lang=ru] .effect-btn,html[lang=uk] .effect-btn{min-width:66px;font-size:9px;padding:8px 3px;line-height:1.2}html[lang=ru] .footer-content,html[lang=uk] .footer-content{font-size:10px;gap:6px}html[lang=ru] .footer-left,html[lang=ru] .footer-right,html[lang=uk] .footer-left,html[lang=uk] .footer-right{gap:6px}}@media (max-width: 768px){html[lang=ar],html[lang=ar] .control-area,html[lang=ar] .mode-buttons,html[lang=ar] .effects-buttons{direction:rtl}html[lang=ar] .play-controls{direction:ltr}html[lang=ar] .mode-btn,html[lang=ar] .effect-btn{min-width:62px;font-size:10px;padding:8px 4px;text-align:center}html[lang=ar] .footer-content{direction:rtl;text-align:right}html[lang=ar] .footer-left{order:2}html[lang=ar] .footer-right{order:1}}@media (max-width: 768px){html[lang=zh-CN] .mode-btn,html[lang=zh-TW] .mode-btn,html[lang=ja] .mode-btn,html[lang=ko] .mode-btn,html[lang=zh-CN] .effect-btn,html[lang=zh-TW] .effect-btn,html[lang=ja] .effect-btn,html[lang=ko] .effect-btn{min-width:58px;font-size:11px;padding:8px 4px;line-height:1.3}html[lang=zh-CN] .mode-btn,html[lang=zh-TW] .mode-btn{font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif}html[lang=ja] .mode-btn{font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic,sans-serif}html[lang=ko] .mode-btn{font-family:-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Malgun Gothic,sans-serif}}@media (max-width: 768px){html[lang=id] .mode-btn,html[lang=vi] .mode-btn,html[lang=id] .effect-btn,html[lang=vi] .effect-btn{min-width:62px;font-size:9px;padding:8px 4px}html[lang=th] .mode-btn,html[lang=th] .effect-btn{min-width:65px;font-size:9px;padding:8px 3px;line-height:1.2;font-family:-apple-system,BlinkMacSystemFont,Sukhumvit Set,Helvetica Neue,sans-serif}}@media (max-width: 768px){html[lang=tr] .mode-btn,html[lang=el] .mode-btn,html[lang=tr] .effect-btn,html[lang=el] .effect-btn{min-width:63px;font-size:9px;padding:8px 4px}html[lang=el] .mode-btn,html[lang=el] .effect-btn{font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,Arial,sans-serif}}@media (max-width: 480px){html[lang=en] .mode-btn,html[lang=es] .mode-btn,html[lang=pt] .mode-btn,html[lang=fr] .mode-btn,html[lang=it] .mode-btn,html[lang=nl] .mode-btn,html[lang=sv] .mode-btn,html[lang=ro] .mode-btn,html[lang=pl] .mode-btn,html[lang=cs] .mode-btn{min-width:55px;font-size:8px;padding:6px 3px}html[lang=de] .mode-btn,html[lang=fi] .mode-btn,html[lang=hu] .mode-btn{min-width:58px;font-size:8px;padding:6px 2px;line-height:1}html[lang=zh-CN] .mode-btn,html[lang=zh-TW] .mode-btn,html[lang=ja] .mode-btn,html[lang=ko] .mode-btn{min-width:52px;font-size:9px;padding:6px 3px}html[lang=ar] .mode-btn,html[lang=ar] .effect-btn,html[lang=ru] .mode-btn,html[lang=uk] .mode-btn,html[lang=tr] .mode-btn,html[lang=el] .mode-btn,html[lang=id] .mode-btn,html[lang=vi] .mode-btn,html[lang=th] .mode-btn{min-width:56px;font-size:8px;padding:6px 3px}}