*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}main{display:block}h1,h2,h3,h4,h5,h6{margin:0;font-weight:inherit;font-size:inherit}p{margin:0}a{background-color:transparent;text-decoration:none;color:inherit}a:active,a:hover{outline:0}button{margin:0;padding:0;border:none;background:none;font:inherit;color:inherit;cursor:pointer;outline:none}button::-moz-focus-inner{border:0;padding:0}input,select{margin:0;padding:0;border:none;background:none;font:inherit;color:inherit;outline:none}ul,ol{list-style:none;margin:0;padding:0}img{border-style:none;max-width:100%;height:auto}svg{display:block;max-width:100%;height:auto}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.clearfix:after{content:"";display:table;clear:both}.no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}html{scroll-behavior:smooth}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}:root{--color-primary: #6366f1;--color-primary-hover: #5855eb;--color-primary-active: #4f46e5;--color-secondary: #64748b;--color-secondary-hover: #475569;--color-accent: #6366f1;--color-accent-rgb: 99, 102, 241;--color-success: #10b981;--color-warning: #f59e0b;--color-error: #ef4444;--color-info: #3b82f6;--color-bg-primary: #000000;--color-bg-secondary: #111111;--color-bg-tertiary: #1a1a1a;--color-bg-card: rgba(255, 255, 255, .05);--color-bg-overlay: rgba(0, 0, 0, .8);--color-text-primary: #ffffff;--color-text-secondary: #d1d5db;--color-text-tertiary: #9ca3af;--color-text-muted: #6b7280;--color-border-primary: rgba(255, 255, 255, .1);--color-border-secondary: rgba(255, 255, 255, .05);--color-border-hover: rgba(255, 255, 255, .2);--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--spacing-3xl: 4rem;--radius-sm: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--radius-full: 9999px;--transition-fast: .15s ease-in-out;--transition-normal: .25s ease-in-out;--transition-slow: .35s ease-in-out;--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal-backdrop: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070;--z-toast: 1080;--z-cookie-banner: 1090;--header-height: 60px;--footer-height: 40px;--control-area-height: 80px;--breakpoint-sm: 640px;--breakpoint-md: 768px;--breakpoint-lg: 1024px;--breakpoint-xl: 1280px;--breakpoint-2xl: 1536px;--container-sm: 640px;--container-md: 768px;--container-lg: 1024px;--container-xl: 1280px;--container-2xl: 1536px;--btn-height-sm: 32px;--btn-height-md: 40px;--btn-height-lg: 48px;--input-height-sm: 32px;--input-height-md: 40px;--input-height-lg: 48px}.container{width:100%;margin:0 auto;padding:0 var(--spacing-md)}@media (min-width: 640px){.container{max-width:var(--container-sm)}}@media (min-width: 768px){.container{max-width:var(--container-md);padding:0 var(--spacing-lg)}}@media (min-width: 1024px){.container{max-width:var(--container-lg);padding:0 var(--spacing-xl)}}@media (min-width: 1280px){.container{max-width:var(--container-xl)}}@media (min-width: 1536px){.container{max-width:var(--container-2xl)}}.grid{display:grid;gap:var(--spacing-md)}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.flex{display:flex}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.items-start{align-items:flex-start}.items-center{align-items:center}.items-end{align-items:flex-end}.items-stretch{align-items:stretch}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.flex-1{flex:1 1 0%}.flex-auto{flex:1 1 auto}.flex-none{flex:none}.gap-xs{gap:var(--spacing-xs)}.gap-sm{gap:var(--spacing-sm)}.gap-md{gap:var(--spacing-md)}.gap-lg{gap:var(--spacing-lg)}.gap-xl{gap:var(--spacing-xl)}@media (min-width: 640px){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:gap-lg{gap:var(--spacing-lg)}.sm\:hidden{display:none}.sm\:block{display:block}}@media (min-width: 768px){.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:flex-row{flex-direction:row}.md\:gap-xl{gap:var(--spacing-xl)}.md\:hidden{display:none}.md\:block{display:block}.md\:flex{display:flex}}@media (min-width: 1024px){.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.lg\:flex-row{flex-direction:row}.lg\:gap-2xl{gap:var(--spacing-2xl)}.lg\:hidden{display:none}.lg\:block{display:block}.lg\:flex{display:flex}}@media (min-width: 1280px){.xl\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.xl\:gap-3xl{gap:var(--spacing-3xl)}}@media (max-width: 767px){.header .header-nav{display:none!important}.header .hamburger-btn{display:inline-flex!important;align-items:center;justify-content:center}.mobile-only{display:block!important}.desktop-only{display:none!important}.mobile-btn{min-height:44px;padding:var(--spacing-sm) var(--spacing-md)}.mobile-text-sm{font-size:var(--font-size-sm)}.mobile-text-base{font-size:var(--font-size-base)}.mobile-text-lg{font-size:var(--font-size-lg)}}@media (min-width: 768px){.mobile-only{display:none}.desktop-only{display:block}}@media (hover: none) and (pointer: coarse){.touch-target{min-height:44px;min-width:44px}.no-touch-hover:hover{background-color:initial;color:initial}}@media (orientation: landscape){.landscape-only{display:block}.portrait-only{display:none}}@media (orientation: portrait){.landscape-only{display:none}.portrait-only{display:block}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);border:1px solid transparent;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);text-decoration:none;cursor:pointer;transition:all var(--transition-fast);user-select:none;white-space:nowrap}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-sm{height:var(--btn-height-sm);padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs)}.btn-md{height:var(--btn-height-md);padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm)}.btn-lg{height:var(--btn-height-lg);padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-base)}.btn-primary{background-color:var(--color-primary);color:var(--color-text-primary);border-color:var(--color-primary)}.btn-primary:hover:not(:disabled){background-color:var(--color-primary-hover);border-color:var(--color-primary-hover)}.btn-primary:active:not(:disabled){background-color:var(--color-primary-active);border-color:var(--color-primary-active)}.btn-secondary{background-color:transparent;color:var(--color-text-secondary);border-color:var(--color-border-primary)}.btn-secondary:hover:not(:disabled){background-color:var(--color-bg-card);color:var(--color-text-primary);border-color:var(--color-border-hover)}.btn-ghost{background-color:transparent;color:var(--color-text-secondary);border-color:transparent}.btn-ghost:hover:not(:disabled){background-color:var(--color-bg-card);color:var(--color-text-primary)}.btn-icon{width:var(--btn-height-md);height:var(--btn-height-md);padding:0;border-radius:var(--radius-lg)}.btn-icon.btn-sm{width:var(--btn-height-sm);height:var(--btn-height-sm)}.btn-icon.btn-lg{width:var(--btn-height-lg);height:var(--btn-height-lg)}.mode-btn{background-color:var(--color-bg-card);color:var(--color-text-secondary);border-color:var(--color-border-primary);transition:all var(--transition-fast)}.mode-btn:hover:not(:disabled){background-color:var(--color-bg-hover);color:var(--color-text-primary);border-color:var(--color-border-hover);transform:translateY(-1px)}.mode-btn.active{background-color:var(--color-primary);color:var(--color-text-primary);border-color:var(--color-primary);box-shadow:0 0 0 2px rgba(var(--color-primary-rgb),.2)}.mode-btn.active:hover{background-color:var(--color-primary-hover);border-color:var(--color-primary-hover)}.card{background-color:var(--color-bg-card);border:1px solid var(--color-border-primary);border-radius:var(--radius-lg);padding:var(--spacing-lg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.card-header{margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-md);border-bottom:1px solid var(--color-border-secondary)}.card-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-xs)}.card-description{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.card-content{margin-bottom:var(--spacing-md)}.card-footer{margin-top:var(--spacing-md);padding-top:var(--spacing-md);border-top:1px solid var(--color-border-secondary)}.dropdown{position:relative;display:inline-block}.dropdown-content{position:absolute;top:100%;right:0;min-width:160px;background-color:var(--color-bg-secondary);border:1px solid var(--color-border-primary);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:var(--z-dropdown);opacity:0;visibility:hidden;transform:translateY(-8px);transition:all var(--transition-fast);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.dropdown.active .dropdown-content{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-item{display:block;width:100%;padding:var(--spacing-sm) var(--spacing-md);color:var(--color-text-secondary);text-decoration:none;transition:all var(--transition-fast);border:none;background:none;text-align:left;cursor:pointer}.dropdown-item:hover{background-color:var(--color-bg-card);color:var(--color-text-primary)}.dropdown-item:first-child{border-top-left-radius:var(--radius-md);border-top-right-radius:var(--radius-md)}.dropdown-item:last-child{border-bottom-left-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md)}.dropdown-item.active{background-color:var(--color-primary);color:var(--color-text-primary)}.dropdown-divider{height:1px;background-color:var(--color-border-secondary);margin:var(--spacing-xs) 0}.tooltip{position:relative;display:inline-block}.tooltip-content{position:absolute;bottom:100%;left:50%;transform:translate(-50%);margin-bottom:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background-color:var(--color-bg-secondary);color:var(--color-text-primary);font-size:var(--font-size-xs);border-radius:var(--radius-sm);white-space:nowrap;z-index:var(--z-tooltip);opacity:0;visibility:hidden;transition:all var(--transition-fast);pointer-events:none}.tooltip:hover .tooltip-content{opacity:1;visibility:visible}.loading{display:inline-block;width:20px;height:20px;border:2px solid var(--color-border-primary);border-radius:50%;border-top-color:var(--color-primary);animation:spin 1s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}.pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.fade-in{animation:fadeIn .3s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}html{height:100%;font-size:16px;overflow:hidden}body{height:100vh;background-color:var(--color-bg-primary);color:var(--color-text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;line-height:var(--line-height-normal);overflow:hidden;margin:0;padding:0}.app{height:100vh;display:flex;flex-direction:column;position:relative;overflow:hidden;background:transparent}.header{height:var(--header-height);display:flex;align-items:center;justify-content:space-between;padding:0 var(--spacing-xl);background-color:#111111e6;border-bottom:1px solid var(--color-border-primary);position:relative;z-index:var(--z-fixed);backdrop-filter:blur(10px);pointer-events:auto}.header-left{display:flex;align-items:center}.logo{display:flex;align-items:center;gap:var(--spacing-sm);color:var(--color-text-primary);text-decoration:none;font-weight:var(--font-weight-semibold);font-size:var(--font-size-lg)}.logo-icon{width:24px;height:24px;color:var(--color-primary)}.logo-text{font-weight:var(--font-weight-bold);background:linear-gradient(135deg,var(--color-primary),#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header-right{display:flex;align-items:center}.hamburger-btn{display:none;background:none;border:none;cursor:pointer;padding:10px;z-index:var(--z-popover)}.hamburger-icon{width:24px;height:24px;stroke:var(--color-text-primary)}.mobile-nav{display:none;position:absolute;top:var(--header-height);left:0;right:0;background-color:#111111e6;backdrop-filter:blur(10px);border-bottom:1px solid var(--color-border-primary);z-index:var(--z-fixed)}.mobile-nav.active{display:flex;flex-direction:column;align-items:center;padding:var(--spacing-md) 0}.mobile-nav .nav-link{padding:var(--spacing-md) 0;font-size:var(--font-size-lg);color:var(--color-text-primary)}.language-selector{position:relative;z-index:var(--z-popover);pointer-events:auto}.language-btn{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background-color:transparent;color:var(--color-text-secondary);border:1px solid var(--color-border-primary);border-radius:var(--radius-md);font-size:var(--font-size-sm);cursor:pointer;transition:all var(--transition-fast)}.language-btn:hover{background-color:var(--color-bg-card);color:var(--color-text-primary);border-color:var(--color-border-hover)}.dropdown-icon{width:16px;height:16px;transition:transform var(--transition-fast)}.language-selector.active .dropdown-icon{transform:rotate(180deg)}.language-dropdown{position:absolute;top:calc(100% + var(--spacing-xs));right:0;min-width:280px;max-width:320px;background-color:var(--color-bg-secondary);border:1px solid var(--color-border-primary);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:var(--z-popover);opacity:0;visibility:hidden;transform:translateY(-8px);transition:all var(--transition-fast);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);max-height:400px;overflow-y:auto;padding:var(--spacing-xs) 0;pointer-events:auto}.language-selector.active .language-dropdown{opacity:1;visibility:visible;transform:translateY(0)}.language-dropdown::-webkit-scrollbar{width:6px}.language-dropdown::-webkit-scrollbar-track{background:var(--color-bg-secondary)}.language-dropdown::-webkit-scrollbar-thumb{background:var(--color-border-primary);border-radius:3px}.language-dropdown::-webkit-scrollbar-thumb:hover{background:var(--color-text-secondary)}.language-search-container{position:relative;padding:var(--spacing-sm);border-bottom:1px solid var(--color-border-primary)}.language-search{width:100%;padding:var(--spacing-xs) var(--spacing-sm) var(--spacing-xs) 32px;background-color:var(--color-bg-card);border:1px solid var(--color-border-primary);border-radius:var(--radius-sm);color:var(--color-text-primary);font-size:var(--font-size-sm);outline:none;transition:all var(--transition-fast)}.language-search:focus{border-color:var(--color-primary);box-shadow:0 0 0 2px #667eea33}.language-search::placeholder{color:var(--color-text-secondary)}.search-icon{position:absolute;left:calc(var(--spacing-sm) + var(--spacing-xs));top:50%;transform:translateY(-50%);color:var(--color-text-secondary);font-size:var(--font-size-sm);pointer-events:none}.language-list{max-height:300px;overflow-y:auto;padding:var(--spacing-xs) 0}.language-list::-webkit-scrollbar{width:6px}.language-list::-webkit-scrollbar-track{background:var(--color-bg-secondary)}.language-list::-webkit-scrollbar-thumb{background:var(--color-border-primary);border-radius:3px}.language-list::-webkit-scrollbar-thumb:hover{background:var(--color-text-secondary)}.language-dropdown .dropdown-item{width:100%;padding:var(--spacing-sm) var(--spacing-md);background-color:transparent;color:var(--color-text-primary);border:none;text-align:left;cursor:pointer;transition:all var(--transition-fast);border-radius:0}.language-dropdown .dropdown-item:hover{background-color:var(--color-bg-card)}.language-dropdown .dropdown-item.active{background-color:var(--color-primary);color:var(--color-text-primary);font-weight:var(--font-weight-medium)}.language-content{display:flex;flex-direction:column;gap:2px}.native-name{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.english-name{font-size:var(--font-size-xs);color:var(--color-text-secondary);opacity:.8}.language-dropdown .dropdown-item.active .english-name{color:#fffc}.main{flex:1;background-color:var(--color-bg-primary);position:relative;overflow:hidden;transition:background-color .3s ease}.intro-panel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:var(--color-text-primary);z-index:10;opacity:1;transition:opacity .5s ease-out;max-width:90vw;width:100%;padding:0 20px;display:flex;flex-direction:column;align-items:center;justify-content:center}.intro-panel.fade-out{opacity:0;pointer-events:none}.intro-title{font-size:clamp(1.8rem,4vw,2.5rem);font-weight:700;margin-bottom:12px;background:linear-gradient(135deg,#6366f1,#8b5cf6,#06b6d4);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;line-height:1.2;max-width:90vw;word-wrap:break-word;hyphens:auto;text-align:center}.intro-description{font-size:clamp(.9rem,2.5vw,1.1rem);color:var(--color-text-secondary);margin-bottom:24px;line-height:1.5;max-width:85vw;word-wrap:break-word;text-align:center}.intro-features{display:flex;justify-content:center;gap:clamp(16px,4vw,32px);flex-wrap:wrap;max-width:90vw;margin:0 auto}.feature-item{display:flex;align-items:center;gap:10px;padding:10px 18px;background:#ffffff14;border-radius:50px;border:1px solid rgba(255,255,255,.15);transition:all .3s ease;white-space:nowrap;min-width:fit-content}.feature-item:hover{background:#ffffff1f;transform:translateY(-2px)}.feature-icon{font-size:1.3rem}.feature-text{font-size:.95rem;font-weight:500;color:var(--color-text-primary)}.control-area{height:var(--control-area-height);background-color:#111111e6;border-top:1px solid var(--color-border-primary);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 var(--spacing-xl);gap:var(--spacing-lg);position:relative;backdrop-filter:blur(10px)}.mode-panel{display:flex;align-items:center;justify-self:start}.mode-buttons{display:flex;align-items:center;gap:var(--spacing-sm)}.panel-label{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:var(--font-weight-medium);white-space:nowrap}.mode-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background-color:var(--color-bg-card);color:var(--color-text-secondary);border:1px solid var(--color-border-primary);border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.mode-btn:hover,.mode-btn.active{background-color:var(--color-primary);color:var(--color-text-primary);border-color:var(--color-primary)}.play-panel{display:flex;align-items:center;justify-content:center;justify-self:center}.play-controls{display:flex;align-items:center;gap:var(--spacing-sm)}.control-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background-color:var(--color-bg-card);color:var(--color-text-secondary);border:1px solid var(--color-border-primary);border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.control-btn:hover{background-color:var(--color-primary);color:var(--color-text-primary);border-color:var(--color-primary)}.play-btn{width:48px;height:48px;background-color:var(--color-primary);color:var(--color-text-primary);border-color:var(--color-primary)}.play-btn:hover{background-color:var(--color-primary-hover);border-color:var(--color-primary-hover)}.effects-panel{display:flex;align-items:center;justify-content:flex-end;justify-self:end}.effects-buttons{display:flex;align-items:center;gap:var(--spacing-sm)}.effect-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background-color:var(--color-bg-card);color:#fff!important;border:1px solid var(--color-border-primary);border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.effect-btn:hover{background-color:var(--color-primary);color:var(--color-text-primary);border-color:var(--color-primary);transform:translateY(-1px);box-shadow:0 4px 12px #667eea4d}.effect-btn.active{background-color:var(--color-primary);color:var(--color-text-primary);border-color:var(--color-primary);box-shadow:0 0 0 2px #667eea4d}.footer{height:var(--footer-height);display:flex;align-items:center;justify-content:center;padding:0 var(--spacing-xl);background-color:#111111e6;border-top:1px solid var(--color-border-primary);position:relative;z-index:var(--z-sticky);backdrop-filter:blur(10px)}.footer-content{display:flex;align-items:center;justify-content:space-between;width:100%;font-size:var(--font-size-xs);color:#999}.footer-left,.footer-right{display:flex;align-items:center;gap:var(--spacing-sm)}.footer-link{cursor:pointer;transition:color var(--transition-fast);text-decoration:none;color:#999}.footer-link:hover{color:#ccc;opacity:.9}.footer-right a.footer-link{color:#999;text-decoration:none}.footer-right a.footer-link:hover{color:#ccc;opacity:.9;text-decoration:underline}.separator{color:#999;opacity:.7}.footer *{color:#999!important}.footer .separator{opacity:.7}.footer .footer-link:hover{color:#ccc!important;opacity:.9}@media (max-width: 1023px){.header{padding:0 var(--spacing-lg)}.control-area{flex-wrap:wrap;gap:var(--spacing-md);padding:0 var(--spacing-lg)}.footer{padding:0 var(--spacing-lg)}.mode-buttons,.effects-buttons{flex-wrap:wrap;gap:var(--spacing-xs)}.mode-btn,.effect-btn{width:38px;height:38px}.control-btn{width:36px;height:36px}.play-btn{width:42px;height:42px}}html[lang=en] .intro-title,html[lang=es] .intro-title,html[lang=de] .intro-title,html[lang=fr] .intro-title{font-size:clamp(1.2rem,2.8vw,1.8rem);line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:95vw}html[lang=en] .intro-description,html[lang=es] .intro-description,html[lang=de] .intro-description,html[lang=fr] .intro-description{font-size:clamp(.75rem,1.8vw,.9rem);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:90vw}html[lang=en] .feature-item,html[lang=es] .feature-item,html[lang=de] .feature-item,html[lang=fr] .feature-item{padding:6px 12px;font-size:.8rem;white-space:nowrap;flex-shrink:0}html[lang=en] .intro-features,html[lang=es] .intro-features,html[lang=de] .intro-features,html[lang=fr] .intro-features{gap:clamp(12px,3vw,24px);justify-content:center;flex-wrap:nowrap;overflow-x:auto;padding:0 10px}@media (min-width: 1200px){html[lang=en] .intro-title,html[lang=es] .intro-title,html[lang=de] .intro-title,html[lang=fr] .intro-title{font-size:1.8rem;white-space:normal;overflow:visible;text-overflow:unset;max-width:none}html[lang=en] .intro-description,html[lang=es] .intro-description,html[lang=de] .intro-description,html[lang=fr] .intro-description{font-size:.95rem;white-space:normal;overflow:visible;text-overflow:unset;max-width:none}html[lang=en] .intro-features,html[lang=es] .intro-features,html[lang=de] .intro-features,html[lang=fr] .intro-features{flex-wrap:wrap;overflow-x:visible}}@media (max-width: 768px){html[lang=en] .intro-title,html[lang=es] .intro-title,html[lang=de] .intro-title,html[lang=fr] .intro-title,html[lang=pt] .intro-title,html[lang=it] .intro-title,html[lang=pl] .intro-title,html[lang=nl] .intro-title,html[lang=sv] .intro-title,html[lang=ro] .intro-title,html[lang=cs] .intro-title,html[lang=hu] .intro-title,html[lang=fi] .intro-title{font-size:clamp(1.4rem,5vw,1.8rem)}html[lang=en] .feature-item,html[lang=es] .feature-item,html[lang=de] .feature-item,html[lang=fr] .feature-item,html[lang=pt] .feature-item,html[lang=it] .feature-item,html[lang=pl] .feature-item,html[lang=nl] .feature-item,html[lang=sv] .feature-item,html[lang=ro] .feature-item,html[lang=cs] .feature-item,html[lang=hu] .feature-item,html[lang=fi] .feature-item{padding:6px 12px;font-size:.85rem}html[lang=ru] .intro-title,html[lang=uk] .intro-title{font-size:clamp(1.3rem,5vw,1.7rem)}html[lang=ru] .feature-item,html[lang=uk] .feature-item{padding:6px 10px;font-size:.8rem}html[lang=ar] .intro-title{font-size:clamp(1.5rem,5vw,1.9rem);direction:rtl}html[lang=ar] .feature-item{padding:6px 14px;font-size:.9rem;direction:rtl}html[lang=ar] .footer-content{direction:rtl}html[lang=zh-CN] .intro-title,html[lang=zh-TW] .intro-title,html[lang=ja] .intro-title,html[lang=ko] .intro-title{font-size:clamp(1.6rem,5vw,2rem)}html[lang=zh-CN] .feature-item,html[lang=zh-TW] .feature-item,html[lang=ja] .feature-item,html[lang=ko] .feature-item{padding:8px 16px;font-size:.9rem}html[lang=id] .intro-title,html[lang=vi] .intro-title,html[lang=th] .intro-title{font-size:clamp(1.3rem,5vw,1.7rem)}html[lang=id] .feature-item,html[lang=vi] .feature-item,html[lang=th] .feature-item{padding:6px 12px;font-size:.8rem}html[lang=tr] .intro-title,html[lang=el] .intro-title{font-size:clamp(1.4rem,5vw,1.8rem)}html[lang=tr] .feature-item,html[lang=el] .feature-item{padding:6px 12px;font-size:.85rem}}@media (max-width: 768px){.container{flex-direction:column}.header{height:50px;padding:0 var(--spacing-md)}.logo{font-size:var(--font-size-md)}.language-btn{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-sm)}.main{padding:0;flex:1}.intro-title{font-size:2.2rem}.intro-description{font-size:1rem}.intro-features{gap:16px;flex-direction:column;align-items:center}.feature-item{white-space:normal;text-align:center;min-width:auto;max-width:280px}.control-area{height:auto;min-height:120px;padding:12px;background:var(--color-bg-secondary);border-top:1px solid var(--color-border-primary);display:grid;grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:12px;align-items:center;justify-items:center}.mode-panel{order:1;width:100%;display:flex;justify-content:center}.mode-buttons{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;width:100%;max-width:400px;padding:0}.mode-btn{padding:8px 4px;min-width:60px;height:60px;font-size:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-radius:8px;text-align:center}.mode-btn svg{width:16px;height:16px}.effects-panel{order:2;width:100%;display:flex;justify-content:center}.effects-buttons{display:flex;justify-content:center;align-items:center;gap:12px;width:100%;max-width:320px;padding:0}.effect-btn{padding:8px 4px;min-width:60px;height:60px;font-size:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-radius:8px;text-align:center;flex-shrink:0}.effect-btn svg{width:16px;height:16px}.play-panel{order:3;width:100%;display:flex;align-items:center;justify-content:center}.play-controls{display:flex;align-items:center;gap:16px}.control-btn{width:44px;height:44px;font-size:16px}.play-btn{width:56px;height:56px;font-size:20px}.mode-panel[style*="position: fixed"],.effect-panel[style*="position: fixed"]{position:fixed!important;inset:30% 0 0!important;z-index:1000!important;background:var(--color-bg-primary)!important;border-top:1px solid var(--color-border-primary)!important;border-top-left-radius:20px!important;border-top-right-radius:20px!important;transform:translateY(100%)!important;transition:transform .3s ease!important;overflow-y:auto!important;padding:60px 20px 20px!important;box-shadow:0 -10px 30px #00000080!important}.mode-panel.show[style*="position: fixed"],.effect-panel.show[style*="position: fixed"]{transform:translateY(0)!important}.mode-panel .mobile-close-btn,.effect-panel .mobile-close-btn{position:absolute!important;top:15px!important;right:20px!important;width:36px!important;height:36px!important;background:var(--color-bg-secondary)!important;border:1px solid var(--color-border-primary)!important;border-radius:50%!important;display:flex!important;align-items:center!important;justify-content:center!important;font-size:20px!important;color:var(--color-text-primary)!important;cursor:pointer!important;z-index:1001!important;transition:all .2s ease!important}.mode-panel .mobile-close-btn:hover,.effect-panel .mobile-close-btn:hover{background:var(--color-bg-tertiary)!important;transform:scale(1.1)!important}.footer{height:auto;min-height:60px;padding:12px var(--spacing-md)}.footer-content{font-size:var(--font-size-xs);flex-direction:column;gap:8px;text-align:center}.footer-left,.footer-right{flex-wrap:wrap;justify-content:center;gap:8px}.footer-right{gap:6px}}@media (max-width: 480px){.header{height:45px;padding:0 var(--spacing-sm)}.logo{font-size:var(--font-size-sm)}.language-btn{padding:var(--spacing-xs);font-size:var(--font-size-xs)}.intro-title{font-size:1.8rem}.intro-description{font-size:.9rem}.control-area{padding:10px;gap:10px;min-height:110px}.mode-buttons{gap:6px;max-width:350px}.mode-btn{min-width:55px;height:55px;font-size:9px;padding:6px 4px}.mode-btn svg{width:14px;height:14px}.effects-buttons{gap:10px;max-width:280px}.effect-btn{min-width:55px;height:55px;font-size:9px;padding:6px 4px}.effect-btn svg{width:14px;height:14px}.play-controls{gap:12px}.control-btn{width:40px;height:40px;font-size:14px}.play-btn{width:50px;height:50px;font-size:18px}.footer{height:auto;min-height:50px;padding:10px var(--spacing-sm)}.footer-content{font-size:9px;gap:6px}.footer-left,.footer-right{gap:6px}}@media (orientation: landscape) and (max-height: 600px){.header{height:50px}.footer{height:35px}.main{padding:var(--spacing-sm) var(--spacing-md)}.control-area{gap:var(--spacing-md)}.mode-buttons,.effects-buttons{flex-direction:row;gap:var(--spacing-xs)}.mode-btn,.effect-btn{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs)}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.logo-icon,.dropdown-icon,.control-btn svg{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}}:fullscreen{background:transparent!important}:-webkit-full-screen{background:transparent!important}:-moz-full-screen{background:transparent!important}:-ms-fullscreen{background:transparent!important}:fullscreen *[style*=top]:not(.fullscreen-controls):not(.main),:-webkit-full-screen *[style*=top]:not(.fullscreen-controls):not(.main),:-moz-full-screen *[style*=top]:not(.fullscreen-controls):not(.main),:-ms-fullscreen *[style*=top]:not(.fullscreen-controls):not(.main){display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important}:fullscreen *:contains("×"),:fullscreen *:contains("✕"),:-webkit-full-screen *:contains("×"),:-webkit-full-screen *:contains("✕"),:-moz-full-screen *:contains("×"),:-moz-full-screen *:contains("✕"),:-ms-fullscreen *:contains("×"),:-ms-fullscreen *:contains("✕"){display:none!important}:fullscreen::backdrop{background:transparent!important}:-webkit-full-screen::backdrop{background:transparent!important}:-moz-full-screen::backdrop{background:transparent!important}:-ms-fullscreen::backdrop{background:transparent!important}.fullscreen-entry-tip{position:fixed!important;top:30px!important;left:30px!important;background:#000c!important;color:#fff!important;padding:12px 20px!important;border-radius:8px!important;font-size:14px!important;z-index:10001!important;opacity:1!important;transition:opacity .5s ease!important;pointer-events:none!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif!important}.hidden{display:none!important}:fullscreen .fullscreen-exit-button,:fullscreen .exit-fullscreen-button,:-webkit-full-screen .fullscreen-exit-button,:-webkit-full-screen .exit-fullscreen-button,:-moz-full-screen .fullscreen-exit-button,:-moz-full-screen .exit-fullscreen-button{display:none!important;visibility:hidden!important;opacity:0!important}:fullscreen *:not(.main):not(.fullscreen-controls):not(.fullscreen-entry-tip){-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:fullscreen{overflow:hidden!important}:fullscreen body{overflow:hidden!important}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:#000c;backdrop-filter:blur(5px)}.modal.show{display:flex;align-items:center;justify-content:center}.modal-content{background-color:var(--color-bg-secondary);border:1px solid var(--color-border-primary);border-radius:var(--radius-lg);max-width:800px;max-height:80vh;width:90%;overflow:hidden;box-shadow:0 20px 60px #00000080}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg);border-bottom:1px solid var(--color-border-primary);background-color:var(--color-bg-tertiary)}.modal-header h2{margin:0;color:var(--color-text-primary);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold)}.modal-close{background:none;border:none;font-size:24px;color:var(--color-text-secondary);cursor:pointer;padding:var(--spacing-xs);border-radius:var(--radius-sm);transition:all var(--transition-fast)}.modal-close:hover{background-color:var(--color-bg-card);color:var(--color-text-primary)}.modal-body{padding:var(--spacing-lg);max-height:60vh;overflow-y:auto}.features-section{margin-bottom:var(--spacing-lg)}.features-section:last-child{margin-bottom:0}.features-section h3{color:var(--color-text-primary);font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-md) 0;display:flex;align-items:center;gap:var(--spacing-sm)}.features-section ul{list-style:none;padding:0;margin:0}.features-section li{padding:var(--spacing-sm) 0;border-bottom:1px solid var(--color-border-secondary);color:var(--color-text-secondary);line-height:1.5}.features-section li:last-child{border-bottom:none}.features-section li strong{color:var(--color-text-primary);font-weight:var(--font-weight-medium)}.modal-body::-webkit-scrollbar{width:6px}.modal-body::-webkit-scrollbar-track{background:#ffffff0d;border-radius:3px}.modal-body::-webkit-scrollbar-thumb{background:var(--color-border-secondary);border-radius:3px}.modal-body::-webkit-scrollbar-thumb:hover{background:var(--color-border-primary)}.legal-modal .modal-content{max-width:1000px;width:95%}.legal-modal-content{max-height:85vh}.legal-modal-body{max-height:70vh;padding:var(--spacing-xl)}.legal-content{color:var(--color-text-primary);line-height:1.6}.legal-content h1,.legal-content h2,.legal-content h3{color:var(--color-text-primary);margin-top:var(--spacing-lg);margin-bottom:var(--spacing-md)}.legal-content h1{font-size:var(--font-size-xl);border-bottom:2px solid var(--color-border-primary);padding-bottom:var(--spacing-sm)}.legal-content h2{font-size:var(--font-size-lg)}.legal-content h3{font-size:var(--font-size-md)}.legal-content p{margin-bottom:var(--spacing-md)}.legal-content ul,.legal-content ol{margin-bottom:var(--spacing-md);padding-left:var(--spacing-lg)}.legal-content li{margin-bottom:var(--spacing-xs)}.legal-content strong{color:var(--color-text-primary);font-weight:var(--font-weight-semibold)}.legal-content .warning{background-color:#ffc1071a;border:1px solid rgba(255,193,7,.3);border-radius:var(--radius-md);padding:var(--spacing-md);margin:var(--spacing-lg) 0}.legal-content .warning h3{color:#ffc107;margin-top:0}@media (max-width: 768px){.modal-content{width:95%;max-height:90vh}.modal-header,.modal-body{padding:var(--spacing-md)}.features-section h3{font-size:var(--font-size-sm)}.features-section li{font-size:var(--font-size-xs);padding:var(--spacing-xs) 0}}.cookie-banner{position:fixed;bottom:0;left:0;right:0;background:#000000f2;backdrop-filter:blur(10px);border-top:1px solid var(--color-border-primary);z-index:var(--z-cookie-banner);transform:translateY(100%);transition:transform .3s ease-out;padding:var(--spacing-lg)}.cookie-banner.show{transform:translateY(0)}.cookie-banner-content{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-lg)}.cookie-banner-text{flex:1;color:var(--color-text-primary);font-size:var(--font-size-sm);line-height:1.5}.cookie-banner-text p{margin:0}.cookie-banner-actions{display:flex;align-items:center;gap:var(--spacing-md);flex-shrink:0}.cookie-btn{padding:var(--spacing-sm) var(--spacing-lg);border:none;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all .2s ease;white-space:nowrap}.cookie-accept{background:var(--color-primary);color:#fff}.cookie-accept:hover{background:var(--color-primary-hover);transform:translateY(-1px)}.cookie-decline{background:transparent;color:var(--color-text-secondary);border:1px solid var(--color-border-primary)}.cookie-decline:hover{background:var(--color-bg-secondary);color:var(--color-text-primary)}.cookie-link{color:var(--color-text-secondary);text-decoration:underline;font-size:var(--font-size-sm);transition:color .2s ease;cursor:pointer}.cookie-link:hover{color:var(--color-text-primary)}@media (max-width: 768px){.cookie-banner{padding:16px;left:12px;right:12px;bottom:12px;border-radius:16px;border:1px solid var(--color-border-primary);background:#000000fa;box-shadow:0 8px 32px #00000080;max-height:calc(100vh - 120px);overflow-y:auto}.cookie-banner-content{flex-direction:column;align-items:stretch;gap:16px;max-width:none}.cookie-banner-text{text-align:left;font-size:15px;line-height:1.5;color:var(--color-text-primary)}.cookie-banner-text p{margin:0}.cookie-banner-actions{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.cookie-btn{padding:12px 20px;font-size:15px;border-radius:10px;flex:1;min-width:100px;text-align:center;font-weight:600}.cookie-accept{background:#007aff;color:#fff;border:none}.cookie-accept:hover{background:#0056cc}.cookie-decline{background:transparent;color:var(--color-text-secondary);border:1px solid var(--color-border-primary)}.cookie-decline:hover{background:var(--color-bg-secondary);color:var(--color-text-primary)}.cookie-link{font-size:13px;color:#007aff;text-decoration:none;text-align:center;width:100%;margin-top:8px;padding:8px}.cookie-link:hover{color:#0056cc;text-decoration:underline}}@media (max-width: 480px){.cookie-banner{padding:16px;left:8px;right:8px;bottom:8px;border-radius:12px}.cookie-banner-content{gap:16px}.cookie-banner-text{font-size:14px;line-height:1.4}.cookie-banner-actions{flex-direction:column;gap:12px;align-items:stretch}.cookie-btn{width:100%;padding:14px;font-size:16px;border-radius:8px;flex:none}.cookie-link{margin-top:4px;font-size:14px;padding:12px}}@media (max-width: 768px){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:65px;font-size:9px}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=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:10px}html[lang=th] .mode-btn,html[lang=th] .effect-btn{min-width:62px;font-size:9px;line-height:1.2}html[lang=ru] .mode-btn,html[lang=uk] .mode-btn,html[lang=ru] .effect-btn,html[lang=uk] .effect-btn{min-width:63px;font-size:9px}}@media (max-width: 480px){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:60px;font-size:8px}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:52px;font-size:9px}html[lang=ar] .footer-content{font-size:8px}html[lang=th] .mode-btn,html[lang=th] .effect-btn,html[lang=ru] .mode-btn,html[lang=uk] .mode-btn,html[lang=ru] .effect-btn,html[lang=uk] .effect-btn{min-width:58px;font-size:8px}}.header{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background:#1a1a1af2;border-bottom:1px solid rgba(255,255,255,.1);position:sticky;top:0;z-index:100}.header-left{flex:0 0 auto}.logo{display:flex;align-items:center;gap:.75rem;color:var(--text-color);text-decoration:none;transition:opacity .3s ease;cursor:pointer}.logo:hover{opacity:.8}.logo-icon{color:var(--primary-color)}.logo-text{font-size:1.25rem;font-weight:600;color:#fff}.header-nav{display:flex;align-items:center;gap:1.5rem;position:static;transform:none}.header-right{flex:0 0 auto}.nav-link{color:var(--text-color);text-decoration:none;font-size:.95rem;font-weight:500;padding:.5rem 1rem;border-radius:6px;transition:all .3s ease;background:transparent;border:none;cursor:pointer;white-space:nowrap}.nav-link:hover{background:#ffffff14;color:#fff}.nav-link.active{background:#6a11cb33;color:#fff}.nav-dropdown{position:relative}.dropdown-toggle{display:flex;align-items:center;gap:.25rem}.dropdown-toggle:after{content:"";display:inline-block;width:0;height:0;margin-left:.25rem;border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid currentColor;transition:transform .3s ease}.nav-dropdown:hover .dropdown-toggle:after{transform:rotate(180deg)}.dropdown-menu{position:absolute;top:100%;left:0;margin-top:.5rem;min-width:160px;background:#1a1a1afa;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:.5rem 0;opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .3s ease;z-index:1000;box-shadow:0 10px 30px #00000080}.nav-dropdown:hover .dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-item{display:block;padding:.65rem 1.25rem;color:var(--text-color);text-decoration:none;font-size:.9rem;transition:all .2s ease;white-space:nowrap}.dropdown-item:hover{background:#ffffff14;color:#fff}.home-main{background:linear-gradient(135deg,#1a1a1a,#0a0a0a);padding:0;overflow-y:auto}.hero-section{min-height:80vh;display:flex;align-items:center;justify-content:center;padding:4rem 2rem;background:linear-gradient(135deg,#6a11cb1a,#2575fc1a);position:relative}.hero-section:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 50%,rgba(106,17,203,.15) 0%,transparent 50%),radial-gradient(circle at 70% 50%,rgba(37,117,252,.15) 0%,transparent 50%);pointer-events:none}.hero-content{max-width:900px;text-align:center;position:relative;z-index:1}.hero-title{font-size:3.5rem;font-weight:700;margin-bottom:1.5rem;background:linear-gradient(135deg,#fff,#a0a0a0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{font-size:1.5rem;color:var(--text-secondary);margin-bottom:2.5rem;line-height:1.6}.hero-features{display:flex;justify-content:center;gap:2rem;margin-bottom:3rem;flex-wrap:wrap}.hero-feature{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:#ffffff0d;border-radius:50px;border:1px solid rgba(255,255,255,.1)}.hero-feature .feature-icon{font-size:1.5rem}.hero-feature span{font-size:1rem;font-weight:500}.cta-button{display:inline-block;padding:1rem 3rem;font-size:1.25rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#6a11cb,#2575fc);border:none;border-radius:50px;text-decoration:none;cursor:pointer;transition:all .3s ease;box-shadow:0 10px 30px #6a11cb4d}.cta-button:hover{transform:translateY(-3px);box-shadow:0 15px 40px #6a11cb66}.cta-button.secondary{background:#ffffff1a;box-shadow:0 5px 20px #0003}.cta-button.secondary:hover{background:#ffffff26;box-shadow:0 10px 30px #0000004d}.features-section{padding:6rem 2rem;background:#0a0a0a}.section-title{font-size:2.5rem;font-weight:700;text-align:center;margin-bottom:3rem;color:#fff}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;max-width:1200px;margin:0 auto}.feature-card{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:2rem;transition:all .3s ease}.feature-card:hover{background:#ffffff0d;border-color:#fff3;transform:translateY(-5px)}.feature-card .card-icon{font-size:3rem;margin-bottom:1rem}.feature-card h3{font-size:1.5rem;font-weight:600;margin-bottom:1rem;color:#fff}.feature-card p{color:var(--text-secondary);line-height:1.6}.scenarios-section{padding:6rem 2rem;background:linear-gradient(135deg,#1a1a1a,#0a0a0a)}.scenarios-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;max-width:1200px;margin:0 auto}.scenario-card{text-align:center;padding:2rem;background:#ffffff05;border-radius:16px;border:1px solid rgba(255,255,255,.05);transition:all .3s ease}.scenario-card:hover{background:#ffffff0d;border-color:#ffffff1a;transform:scale(1.05)}.scenario-icon{font-size:4rem;margin-bottom:1rem}.scenario-card h3{font-size:1.5rem;font-weight:600;margin-bottom:1rem;color:#fff}.scenario-card p{color:var(--text-secondary);line-height:1.6}.effects-intro-section{padding:6rem 2rem;background:#0a0a0a}.effects-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;max-width:1200px;margin:0 auto}.effects-item{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:2.5rem;text-align:center}.effects-item h3{font-size:1.75rem;font-weight:600;margin-bottom:1rem;color:#fff}.effects-item p{color:var(--text-secondary);line-height:1.6}.tutorial-section{padding:6rem 2rem;background:linear-gradient(135deg,#1a1a1a,#0a0a0a)}.tutorial-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;max-width:1200px;margin:0 auto 3rem}.tutorial-step{background:#ffffff05;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:2rem;text-align:center}.step-number{width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#6a11cb,#2575fc);color:#fff;font-size:2rem;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem}.tutorial-step h3{font-size:1.5rem;font-weight:600;margin-bottom:1rem;color:#fff}.tutorial-step p{color:var(--text-secondary);line-height:1.6}.tutorial-cta{text-align:center}.seo-section{padding:6rem 2rem;background:#0a0a0a;max-width:1200px;margin:0 auto}.seo-section h2{font-size:2.5rem;font-weight:700;margin-bottom:2rem;color:#fff;text-align:center}.seo-content-wrapper{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:3rem}.seo-content-wrapper p{font-size:1.125rem;line-height:1.8;color:var(--text-secondary);margin-bottom:1.5rem}.seo-content-wrapper p:last-child{margin-bottom:0}@media (max-width: 768px){.header{padding:.75rem 1rem;flex-wrap:wrap}.header-left{order:1;flex:0 0 auto}.header-right{order:2;flex:0 0 auto}.header-nav{order:3;width:100%;margin-top:.75rem;padding-top:.75rem;border-top:1px solid rgba(255,255,255,.1);gap:.5rem;flex-wrap:wrap;justify-content:center}.nav-link{font-size:.85rem;padding:.4rem .75rem}.nav-dropdown .dropdown-menu{position:fixed;left:50%;transform:translate(-50%) translateY(-10px);margin-top:.25rem}.nav-dropdown:hover .dropdown-menu{transform:translate(-50%) translateY(0)}.hero-title{font-size:2.5rem}.hero-subtitle{font-size:1.25rem}.hero-features{flex-direction:column;align-items:center}.section-title{font-size:2rem}.features-grid,.scenarios-grid,.effects-content,.tutorial-steps{grid-template-columns:1fr}.features-section,.scenarios-section,.effects-intro-section,.tutorial-section,.seo-section{padding:3rem 1rem}}@media (max-width: 480px){.hero-title{font-size:2rem}.hero-subtitle{font-size:1rem}.cta-button{padding:.875rem 2rem;font-size:1rem}.section-title{font-size:1.75rem}}