:root{--color-bg: #ffffff;--color-bg-secondary: #f5f5f7;--color-bg-tertiary: #e8e8ed;--color-surface: #fafafa;--color-text: #1d1d1f;--color-text-secondary: #6e6e73;--color-text-tertiary: #86868b;--color-primary: #e94560;--color-primary-hover: #d63d56;--color-primary-light: rgba(233, 69, 96, .1);--color-secondary: #0f3460;--color-secondary-hover: #0d2d52;--color-accent: #16213e;--color-success: #34c759;--color-warning: #ff9f0a;--color-error: #ff3b30;--color-border: rgba(0, 0, 0, .1);--color-border-focus: var(--color-primary);--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, sans-serif;--font-mono: "SF Mono", "Monaco", "Inconsolata", "Fira Mono", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 2rem;--text-4xl: 2.5rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1);--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--max-width: 1200px;--header-height: 60px}[data-theme=dark]{--color-bg: #1a1a2e;--color-bg-secondary: #16213e;--color-bg-tertiary: #0f3460;--color-surface: #1e1e38;--color-text: #f5f5f7;--color-text-secondary: #a1a1a6;--color-text-tertiary: #86868b;--color-border: rgba(255, 255, 255, .1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);font-size:var(--text-base);line-height:1.5;color:var(--color-text);background-color:var(--color-bg);min-height:100vh;display:flex;flex-direction:column}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-hover)}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2}h1{font-size:var(--text-3xl)}h2{font-size:var(--text-2xl)}h3{font-size:var(--text-xl)}.header{height:var(--header-height);background:var(--color-bg);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:100}.nav{max-width:var(--max-width);margin:0 auto;padding:0 var(--space-lg);height:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg)}.nav__logo{display:flex;align-items:center;gap:var(--space-sm);color:var(--color-text);font-weight:600;font-size:var(--text-lg)}.nav__logo svg{flex-shrink:0}.nav__links{display:flex;gap:var(--space-lg)}.nav__link{color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:500;padding:var(--space-sm) 0;border-bottom:2px solid transparent;transition:all var(--transition-fast)}.nav__link:hover,.nav__link[aria-current=page],.nav__link--active{color:var(--color-text);border-bottom-color:var(--color-primary)}.nav__dropdown{position:relative}.nav__link--dropdown{display:flex;align-items:center;gap:var(--space-xs)}.nav__dropdown-arrow{transition:transform var(--transition-fast)}.nav__dropdown:hover .nav__dropdown-arrow{transform:rotate(180deg)}.nav__dropdown-menu{position:absolute;top:100%;left:50%;transform:translate(-50%);min-width:180px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--space-xs) 0;opacity:0;visibility:hidden;transition:all var(--transition-fast);z-index:100;margin-top:var(--space-xs)}.nav__dropdown:hover .nav__dropdown-menu{opacity:1;visibility:visible}.nav__dropdown-item{display:block;padding:var(--space-sm) var(--space-md);font-size:var(--text-sm);color:var(--color-text);text-decoration:none;transition:background var(--transition-fast)}.nav__dropdown-item:hover{background:var(--color-bg-secondary);color:var(--color-primary)}.nav__dropdown-item--active{background:var(--color-primary-light);color:var(--color-primary);font-weight:500}.nav__dropdown-item--more{border-top:1px solid var(--color-border);margin-top:var(--space-xs);padding-top:var(--space-sm);color:var(--color-primary);font-weight:500}.nav__actions{display:flex;align-items:center;gap:var(--space-md)}.language-selector select{appearance:none;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-sm) var(--space-lg) var(--space-sm) var(--space-md);font-size:var(--text-sm);color:var(--color-text);cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236e6e73' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center}.main{flex:1;max-width:var(--max-width);margin:0 auto;padding:var(--space-xl) var(--space-lg);width:100%}.site-links{background:var(--color-surface);border-top:1px solid var(--color-border);padding:var(--space-xl) var(--space-lg)}.site-links__content{max-width:var(--max-width);margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-xl)}.site-links__group{min-width:0}.site-links__title{font-size:var(--text-sm);font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin:0 0 var(--space-md) 0}.site-links__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-sm)}.site-links__list a{color:var(--color-text);text-decoration:none;font-size:var(--text-base);transition:color var(--transition-fast)}.site-links__list a:hover{color:var(--color-primary)}.footer{background:var(--color-bg-secondary);border-top:1px solid var(--color-border);padding:var(--space-lg)}.footer__content{max-width:var(--max-width);margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-md)}.footer__privacy{display:flex;align-items:center;gap:var(--space-sm);color:var(--color-text-secondary);font-size:var(--text-sm)}.footer__links{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md)}.footer__link{color:var(--color-text-secondary);font-size:var(--text-sm);text-decoration:none;transition:color var(--transition-fast)}.footer__link:hover{color:var(--color-primary)}.footer__separator{color:var(--color-text-tertiary)}.footer__made{color:var(--color-text-secondary);font-size:var(--text-sm)}.footer__dropdown{position:relative;display:inline-block}.footer__link--dropdown{display:inline-flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;font-family:inherit;padding:0}.footer__link--dropdown svg{transition:transform var(--transition-fast)}.footer__link--dropdown[aria-expanded=true] svg{transform:rotate(180deg)}.footer__dropdown-menu{position:absolute;bottom:100%;left:50%;transform:translate(-50%);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-xs);min-width:140px;box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transition:all var(--transition-fast);margin-bottom:var(--space-sm)}.footer__link--dropdown[aria-expanded=true]+.footer__dropdown-menu{opacity:1;visibility:visible}.footer__dropdown-item{display:block;padding:var(--space-sm) var(--space-md);color:var(--color-text);text-decoration:none;font-size:var(--text-sm);border-radius:var(--radius-sm);transition:background var(--transition-fast)}.footer__dropdown-item:hover{background:var(--color-bg-secondary);color:var(--color-primary)}.cookie-consent{position:fixed;bottom:0;left:0;right:0;background:var(--color-surface);border-top:1px solid var(--color-border);box-shadow:0 -4px 20px #0000001a;z-index:1000;padding:var(--space-lg);animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}.cookie-consent__content{max-width:var(--max-width);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg);flex-wrap:wrap}.cookie-consent__text{flex:1;min-width:280px}.cookie-consent__text p{margin:0;color:var(--color-text);font-size:var(--text-sm);line-height:1.6}.cookie-consent__link{color:var(--color-primary);text-decoration:none}.cookie-consent__link:hover{text-decoration:underline}.cookie-consent__actions{display:flex;gap:var(--space-sm);flex-shrink:0}.cookie-consent__btn{padding:var(--space-sm) var(--space-lg);font-size:var(--text-sm);font-weight:500;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);border:none;font-family:inherit}.cookie-consent__btn--reject{background:var(--color-bg-secondary);color:var(--color-text);border:1px solid var(--color-border)}.cookie-consent__btn--reject:hover{background:var(--color-bg-tertiary)}.cookie-consent__btn--accept{background:var(--color-primary);color:#fff}.cookie-consent__btn--accept:hover{background:var(--color-primary-hover)}@media (max-width: 640px){.cookie-consent__content{flex-direction:column;text-align:center}.cookie-consent__actions{width:100%;justify-content:center}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);font-family:inherit;font-weight:500;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);text-decoration:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--sm{padding:var(--space-xs) var(--space-sm);font-size:var(--text-sm)}.btn--md{padding:var(--space-sm) var(--space-md);font-size:var(--text-base)}.btn--lg{padding:var(--space-md) var(--space-lg);font-size:var(--text-lg)}.btn--primary{background:var(--color-primary);color:#fff}.btn--primary:hover:not(:disabled){background:var(--color-primary-hover)}.btn--secondary{background:var(--color-bg-secondary);color:var(--color-text);border:1px solid var(--color-border)}.btn--secondary:hover:not(:disabled){background:var(--color-bg-tertiary)}.btn--ghost{background:transparent;color:var(--color-text-secondary)}.btn--ghost:hover:not(:disabled){background:var(--color-bg-secondary);color:var(--color-text)}.btn--danger{background:var(--color-error);color:#fff}.btn--full{width:100%}.btn--loading{position:relative}.btn__spinner{animation:spin 1s linear infinite}.translator{display:flex;flex-direction:column;gap:var(--space-lg)}.quick-send{display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap}.quick-send__label{font-size:var(--text-sm);color:var(--color-text-secondary);font-weight:500}.quick-send__options{display:flex;flex-wrap:wrap;gap:var(--space-xs)}.quick-send__btn{display:inline-flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-full);font-size:var(--text-sm);color:var(--color-text);cursor:pointer;transition:all var(--transition-fast);text-decoration:none}.quick-send__btn:hover{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.quick-send__btn svg{opacity:.7}.quick-send__btn:hover svg{opacity:1}.input-methods{display:flex;flex-direction:column;gap:var(--space-md)}.input-methods__header{display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap}.input-methods__label{font-size:var(--text-sm);color:var(--color-text-secondary);font-weight:500}.input-methods__options{display:flex;gap:var(--space-xs);flex-wrap:wrap}.input-methods__btn{display:inline-flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-full);font-size:var(--text-sm);color:var(--color-text);cursor:pointer;transition:all var(--transition-fast);position:relative}.input-methods__btn:hover:not(:disabled){background:var(--color-primary);border-color:var(--color-primary);color:#fff}.input-methods__btn--active{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.input-methods__btn--disabled{opacity:.6;cursor:not-allowed}.input-methods__coming-soon{font-size:var(--text-xs);background:var(--color-bg-tertiary);padding:.1em .4em;border-radius:var(--radius-sm);margin-left:var(--space-xs);color:var(--color-text-secondary)}.tap-input-panel{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-md)}.tap-input-panel__header{display:flex;justify-content:space-between;align-items:center}.tap-input-panel__legend{display:flex;gap:var(--space-md);flex-wrap:wrap}.tap-input-panel__legend-item{display:flex;align-items:center;gap:var(--space-xs);font-size:var(--text-sm);color:var(--color-text-secondary)}.tap-input-panel__legend-symbol{font-family:var(--font-mono);font-size:var(--text-base);font-weight:600;color:var(--color-primary)}.tap-input-panel__close{background:none;border:none;color:var(--color-text-secondary);cursor:pointer;padding:var(--space-xs);border-radius:var(--radius-sm);transition:all var(--transition-fast)}.tap-input-panel__close:hover{background:var(--color-bg-tertiary);color:var(--color-text)}.tap-input-panel__pad{width:100%;height:120px;background:var(--color-bg-tertiary);border:3px solid var(--color-border);border-radius:var(--radius-lg);cursor:pointer;user-select:none;-webkit-user-select:none;touch-action:manipulation;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast)}.tap-input-panel__pad:hover{border-color:var(--color-primary)}.tap-input-panel__pad--pressed{background:var(--color-primary);border-color:var(--color-primary);transform:scale(.99)}.tap-input-panel__pad-content{text-align:center}.tap-input-panel__pad-hint{font-size:var(--text-lg);color:var(--color-text-secondary)}.tap-input-panel__pad-pressing{font-family:var(--font-mono);font-size:3rem;font-weight:700;color:#fff;animation:pulse .3s ease-in-out infinite}.tap-input-panel__pad-last{font-family:var(--font-mono);font-size:2.5rem;font-weight:700;color:var(--color-primary)}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.tap-input-panel__footer{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);flex-wrap:wrap}.tap-input-panel__preview{flex:1;min-width:150px;font-family:var(--font-mono);font-size:var(--text-base);letter-spacing:.05em;color:var(--color-text);background:var(--color-bg);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);border:1px solid var(--color-border);word-break:break-all}.tap-input-panel__placeholder{color:var(--color-text-secondary)}.tap-input-panel__actions{display:flex;gap:var(--space-sm)}.tap-input-panel__btn{padding:var(--space-xs) var(--space-md);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.tap-input-panel__btn:disabled{opacity:.5;cursor:not-allowed}.tap-input-panel__btn--secondary{background:var(--color-bg);border:1px solid var(--color-border);color:var(--color-text)}.tap-input-panel__btn--secondary:hover:not(:disabled){background:var(--color-bg-tertiary)}.tap-input-panel__btn--primary{background:var(--color-primary);border:1px solid var(--color-primary);color:#fff}.tap-input-panel__btn--primary:hover:not(:disabled){background:var(--color-primary-hover)}.alphabet-panel{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-md)}.alphabet-panel__header{display:flex;justify-content:space-between;align-items:center}.alphabet-panel__title{font-size:var(--text-sm);color:var(--color-text-secondary)}.alphabet-panel__close{background:none;border:none;color:var(--color-text-secondary);cursor:pointer;padding:var(--space-xs);border-radius:var(--radius-sm);transition:all var(--transition-fast)}.alphabet-panel__close:hover{background:var(--color-bg-tertiary);color:var(--color-text)}.alphabet-panel__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:var(--space-xs)}.alphabet-panel__grid--numbers{grid-template-columns:repeat(10,1fr)}@media (max-width: 600px){.alphabet-panel__grid--numbers{grid-template-columns:repeat(5,1fr)}}.alphabet-panel__key{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-sm);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);min-height:56px}.alphabet-panel__key:hover{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.alphabet-panel__key:hover .alphabet-panel__morse{color:#fffc}.alphabet-panel__key:active{transform:scale(.95)}.alphabet-panel__char{font-size:var(--text-lg);font-weight:600;line-height:1}.alphabet-panel__morse{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-tertiary);margin-top:2px}.alphabet-panel__actions{display:flex;gap:var(--space-sm);justify-content:center}.alphabet-panel__action-btn{padding:var(--space-sm) var(--space-lg);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-sm);color:var(--color-text);cursor:pointer;transition:all var(--transition-fast)}.alphabet-panel__action-btn:hover{background:var(--color-bg-tertiary);border-color:var(--color-text-secondary)}.translator__panels{display:grid;grid-template-columns:1fr auto 1fr;gap:var(--space-md);align-items:stretch}@media (max-width: 768px){.translator__panels{grid-template-columns:1fr}.translator__divider{transform:rotate(90deg)}}.translator__panel{min-height:200px}.translator__divider{display:flex;align-items:center;justify-content:center;color:var(--color-text-tertiary)}.text-input,.morse-input{height:100%;display:flex;flex-direction:column}.text-input__header,.morse-input__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-sm)}.text-input__label,.morse-input__label{font-weight:500;color:var(--color-text-secondary);font-size:var(--text-sm)}.text-input__warning,.morse-input__warning{font-size:var(--text-xs);color:var(--color-error);display:flex;align-items:center;gap:var(--space-sm)}.text-input__cleanup,.morse-input__cleanup,.text-input__learn-more,.morse-input__learn-more{background:none;border:none;color:var(--color-primary);cursor:pointer;text-decoration:underline;font-size:inherit;padding:0}.text-input__learn-more:hover,.morse-input__learn-more:hover,.text-input__cleanup:hover,.morse-input__cleanup:hover{color:var(--color-primary-hover)}.text-input__container,.morse-input__container{position:relative;flex:1}.morse-input__highlight-overlay{position:absolute;inset:0;padding:var(--space-md);font-family:var(--font-mono);font-size:var(--text-base);line-height:1.5;color:var(--color-text);background:var(--color-bg);border:1px solid var(--color-primary);border-radius:var(--radius-lg);overflow-y:auto;white-space:pre-wrap;word-break:break-all;z-index:1;pointer-events:none}.morse-input__textarea--hidden-text{color:transparent;caret-color:var(--color-text)}.text-input__highlight-overlay{position:absolute;inset:0;padding:var(--space-md);font-family:var(--font-mono);font-size:var(--text-base);line-height:1.5;color:var(--color-text);background:var(--color-bg);border:1px solid var(--color-primary);border-radius:var(--radius-lg);overflow-y:auto;white-space:pre-wrap;word-break:break-word;z-index:1;pointer-events:none}.text-input__textarea--hidden-text{color:transparent;caret-color:var(--color-text)}.text-input__textarea,.morse-input__textarea{width:100%;height:100%;min-height:150px;padding:var(--space-md);font-family:var(--font-mono);font-size:var(--text-base);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-bg);color:var(--color-text);resize:vertical;transition:border-color var(--transition-fast)}.text-input__textarea:focus,.morse-input__textarea:focus{outline:none;border-color:var(--color-primary)}.morse-input__legend{display:flex;gap:var(--space-lg);margin-top:var(--space-sm);font-size:var(--text-xs);color:var(--color-text-tertiary)}.morse-input__legend-item{display:flex;align-items:center;gap:var(--space-xs)}.char--highlighted,.morse-char--highlighted{background:var(--color-primary-light);color:var(--color-primary);border-radius:2px}.char--invalid{background:#ff3b301a;color:var(--color-error)}.translator-actions{display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-md)}.translator-actions__group{display:flex;gap:var(--space-sm)}.download-menu-wrapper{position:relative}.download-menu{position:absolute;top:100%;right:0;margin-top:var(--space-xs);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);min-width:180px;z-index:50;overflow:hidden}.download-menu__item{display:block;width:100%;padding:var(--space-sm) var(--space-md);text-align:left;font-size:var(--text-sm);color:var(--color-text);background:transparent;border:none;cursor:pointer;transition:background var(--transition-fast)}.download-menu__item:hover:not(:disabled){background:var(--color-bg-secondary)}.download-menu__item:disabled{color:var(--color-text-tertiary);cursor:not-allowed}.audio-section{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-lg);background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--space-md)}@media (max-width: 768px){.audio-section{grid-template-columns:1fr}}.audio-player{display:flex;flex-direction:column;justify-content:center;position:relative}.audio-player__controls{display:flex;align-items:center;gap:var(--space-md)}.audio-player__buttons{display:flex;gap:var(--space-sm)}.audio-player__progress{height:6px;background:var(--color-bg-tertiary);border-radius:var(--radius-full);margin-top:var(--space-md);overflow:hidden}.audio-player__progress-fill{height:100%;background:var(--color-primary);transition:width .1s linear}.audio-settings-panel{border-left:1px solid var(--color-border);padding-left:var(--space-lg)}@media (max-width: 768px){.audio-settings-panel{border-left:none;border-top:1px solid var(--color-border);padding-left:0;padding-top:var(--space-md)}}.audio-settings{display:flex;flex-direction:column;gap:var(--space-md)}.audio-settings__row{display:flex;gap:var(--space-lg);flex-wrap:wrap}.audio-settings__row .slider{flex:1;min-width:100px}.audio-settings__group{display:flex;flex-direction:column;gap:var(--space-xs)}.audio-settings__label{font-size:var(--text-xs);color:var(--color-text-secondary);font-weight:500}.audio-settings__toggles{display:flex;gap:var(--space-lg);flex-wrap:wrap}.slider{display:flex;flex-direction:column;gap:2px}.slider__header{display:flex;justify-content:space-between;align-items:center}.slider__label{font-size:var(--text-xs);color:var(--color-text-secondary)}.slider__value{font-size:var(--text-xs);font-weight:500;color:var(--color-text);font-family:var(--font-mono)}.slider__input{-webkit-appearance:none;width:100%;height:4px;border-radius:var(--radius-full);background:linear-gradient(to right,var(--color-primary) 0%,var(--color-primary) var(--fill-percent, 50%),var(--color-bg-tertiary) var(--fill-percent, 50%),var(--color-bg-tertiary) 100%);cursor:pointer}.slider__input::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--color-primary);cursor:pointer;border:2px solid white;box-shadow:var(--shadow-sm)}.toggle{display:flex;align-items:center;gap:var(--space-sm);cursor:pointer}.toggle--disabled{opacity:.5;cursor:not-allowed}.toggle__input{position:absolute;opacity:0;pointer-events:none}.toggle__track{width:36px;height:20px;background:var(--color-bg-tertiary);border-radius:var(--radius-full);position:relative;transition:background var(--transition-fast);flex-shrink:0}.toggle__input:checked+.toggle__track{background:var(--color-primary)}.toggle__thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;background:#fff;border-radius:50%;box-shadow:var(--shadow-sm);transition:transform var(--transition-fast)}.toggle__input:checked+.toggle__track .toggle__thumb{transform:translate(16px)}.toggle__label{font-size:var(--text-xs);color:var(--color-text-secondary);white-space:nowrap}.segmented-control{display:inline-flex;background:var(--color-bg-tertiary);border-radius:var(--radius-md);padding:2px}.segmented-control__option{padding:var(--space-sm) var(--space-md);font-size:var(--text-sm);color:var(--color-text-secondary);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.segmented-control__option--active{background:var(--color-bg);color:var(--color-text);box-shadow:var(--shadow-sm)}.segmented-control__input{position:absolute;opacity:0;pointer-events:none}.theme-toggle{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-sm);cursor:pointer;color:var(--color-text-secondary);transition:all var(--transition-fast)}.theme-toggle:hover{background:var(--color-bg-tertiary);color:var(--color-text)}.flash-overlay{position:absolute;inset:0;background:var(--color-primary);opacity:0;pointer-events:none;z-index:10;transition:opacity 50ms ease-out;border-radius:var(--radius-lg)}.flash-overlay.active{opacity:.25}.audio-flash-overlay{position:absolute;inset:0;background:var(--color-primary);opacity:0;pointer-events:none;z-index:10;border-radius:var(--radius-lg);transition:opacity 50ms ease-out}.audio-flash-overlay.active{opacity:.3}.preset-grid{display:flex;flex-direction:column;gap:var(--space-lg)}.preset-grid__tabs{display:flex;flex-wrap:wrap;gap:var(--space-sm)}.preset-grid__tab{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-full);padding:var(--space-sm) var(--space-md);font-size:var(--text-sm);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast)}.preset-grid__tab:hover{background:var(--color-bg-tertiary)}.preset-grid__tab--active{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.preset-grid__content{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-md)}.preset-card{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-md)}.preset-card__content{display:flex;flex-direction:column;gap:var(--space-xs)}.preset-card__text{font-weight:600;font-size:var(--text-lg)}.preset-card__morse{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-text-secondary);word-break:break-all}.preset-card__actions{display:flex;gap:var(--space-sm);justify-content:flex-end}.tap-input{display:flex;flex-direction:column;align-items:center;gap:var(--space-lg);padding:var(--space-xl)}.tap-input__instructions{text-align:center;color:var(--color-text-secondary);font-size:var(--text-sm)}.tap-input__button{width:120px;height:120px;border-radius:50%;background:var(--color-primary);border:none;cursor:pointer;transition:all var(--transition-fast);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-lg)}.tap-input__button:hover{transform:scale(1.05)}.tap-input__button--pressed{background:var(--color-secondary);transform:scale(.95)}.tap-input__button-inner{color:#fff;font-weight:600;font-size:var(--text-lg)}.tap-input__preview{font-family:var(--font-mono);font-size:var(--text-2xl);min-height:3rem}.tap-input__placeholder{color:var(--color-text-tertiary)}.tap-input__actions{display:flex;gap:var(--space-sm)}.voice-input{display:flex;flex-direction:column;align-items:center;gap:var(--space-lg);padding:var(--space-xl)}.voice-input__indicator{display:flex;align-items:center;gap:var(--space-sm);color:var(--color-primary)}.voice-input__pulse{width:12px;height:12px;background:var(--color-primary);border-radius:50%;animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.5}}.voice-input__transcript{background:var(--color-bg-secondary);padding:var(--space-md);border-radius:var(--radius-md);width:100%;max-width:400px}.voice-input__error{color:var(--color-error);font-size:var(--text-sm)}.voice-input__tip{font-size:var(--text-sm);color:var(--color-text-tertiary);text-align:center;max-width:400px}.modal{border:none;border-radius:var(--radius-xl);padding:0;max-width:90vw;max-height:90vh;box-shadow:var(--shadow-lg)}.modal::backdrop{background:#00000080}.modal--sm{width:400px}.modal--md{width:600px}.modal--lg{width:800px}.modal__content{background:var(--color-bg);border-radius:var(--radius-xl);overflow:hidden}.modal__header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--color-border)}.modal__title{font-size:var(--text-lg);font-weight:600}.modal__close{background:none;border:none;color:var(--color-text-secondary);cursor:pointer;padding:var(--space-xs);border-radius:var(--radius-sm);transition:all var(--transition-fast)}.modal__close:hover{background:var(--color-bg-secondary);color:var(--color-text)}.modal__body{padding:var(--space-lg);overflow-y:auto}.allowed-chars-modal{display:flex;flex-direction:column;gap:var(--space-lg)}.allowed-chars-modal__description{color:var(--color-text-secondary);margin:0}.allowed-chars-modal__section{display:flex;flex-direction:column;gap:var(--space-xs)}.allowed-chars-modal__section-title{font-size:var(--text-sm);font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin:0}.allowed-chars-modal__chars{font-family:var(--font-mono);font-size:var(--text-lg);letter-spacing:.15em;color:var(--color-text);background:var(--color-bg-tertiary);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md)}.allowed-chars-modal__chars-note{font-size:var(--text-sm);color:var(--color-text-secondary);font-style:italic}.allowed-chars-modal__rules{margin:0;padding-left:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-xs)}.allowed-chars-modal__rules code{font-family:var(--font-mono);background:var(--color-bg-tertiary);padding:.1em .3em;border-radius:var(--radius-sm)}.allowed-chars-modal__example{background:var(--color-bg-tertiary);padding:var(--space-md);border-radius:var(--radius-md);display:flex;flex-direction:column;gap:var(--space-xs)}.allowed-chars-modal__code{font-family:var(--font-mono);font-size:var(--text-base);color:var(--color-primary);word-break:break-all}.allowed-chars-modal__example-text{font-size:var(--text-sm);color:var(--color-text-secondary)}.alphabet-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:var(--space-md)}.alphabet-card{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-md);text-align:center;cursor:pointer;transition:all var(--transition-fast)}.alphabet-card:hover{border-color:var(--color-primary);transform:translateY(-2px)}.alphabet-card__char{font-size:var(--text-2xl);font-weight:600}.alphabet-card__morse{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-text-secondary);margin-top:var(--space-xs)}.page-header{margin-bottom:var(--space-xl)}.page-header__top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);flex-wrap:wrap;margin-bottom:var(--space-sm)}.page-title{font-size:var(--text-4xl);font-weight:700;margin:0}.page-description{color:var(--color-text-secondary);font-size:var(--text-lg)}.hero-image{margin:0 0 var(--space-xl) 0;border-radius:var(--radius-lg);overflow:hidden;background:var(--color-bg-secondary)}.hero-image img{width:100%;height:auto;display:block;object-fit:cover}.hero-image__caption{padding:.75rem 1rem;font-size:var(--text-sm);color:var(--color-text-secondary);text-align:center;background:var(--color-bg-tertiary);border-top:1px solid var(--color-border)}.section{margin-bottom:var(--space-2xl)}.section-title{font-size:var(--text-xl);margin-bottom:var(--space-lg)}.history{background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--space-md)}.history__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-md)}.history__title{font-size:var(--text-base);font-weight:600;margin:0}.history__empty{color:var(--color-text-tertiary);font-size:var(--text-sm);text-align:center;padding:var(--space-lg)}.history__list{display:flex;flex-direction:column;gap:var(--space-sm);max-height:300px;overflow-y:auto}.history__item{display:flex;justify-content:space-between;align-items:center;gap:var(--space-md);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md)}.history__item-content{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.history__item-text{font-size:var(--text-sm);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history__item-morse{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history__item-actions{display:flex;gap:var(--space-xs);flex-shrink:0}.history__item-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast)}.history__item-btn:hover{background:var(--color-bg-tertiary);color:var(--color-text)}.history__item-btn--danger:hover{background:#ff3b301a;border-color:var(--color-error);color:var(--color-error)}.history__item-btn--playing{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.history__item-btn--playing:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover);color:#fff}.creator-credit{font-size:var(--text-xs);color:var(--color-text-tertiary);text-align:left;margin:var(--space-xs) 0 0 0}.creator-credit a{color:var(--color-text-secondary);text-decoration:underline}.creator-credit a:hover{color:var(--color-primary)}.embed-trigger{display:inline-flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-sm);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast)}.embed-trigger:hover{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.embed-modal{display:flex;flex-direction:column;gap:var(--space-lg)}.embed-modal__intro{color:var(--color-text-secondary);margin:0;line-height:1.6}.embed-modal__features h4{font-size:var(--text-sm);font-weight:600;margin:0 0 var(--space-sm) 0;color:var(--color-text)}.embed-modal__features ul{margin:0;padding-left:var(--space-lg);color:var(--color-text-secondary);font-size:var(--text-sm);display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-xs)}@media (max-width: 600px){.embed-modal__features ul{grid-template-columns:1fr}}.embed-modal__features li{line-height:1.5}.embed-modal__code-section h4{font-size:var(--text-sm);font-weight:600;margin:0;color:var(--color-text)}.embed-modal__code-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-sm)}.embed-modal__copy-btn{display:inline-flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);background:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--text-xs);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast)}.embed-modal__copy-btn:hover{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.embed-modal__code{background:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);overflow-x:auto;margin:0}.embed-modal__code code{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-text);white-space:pre}.embed-modal__preview h4{font-size:var(--text-sm);font-weight:600;margin:0 0 var(--space-sm) 0;color:var(--color-text)}.embed-modal__preview-frame{border-radius:var(--radius-md);overflow:hidden}.embed-modal__note{font-size:var(--text-sm);color:var(--color-text-tertiary);margin:0;text-align:center}.embed-modal__note a{color:var(--color-primary);text-decoration:none}.embed-modal__note a:hover{text-decoration:underline}.alphabet-table-wrapper{margin-bottom:var(--space-2xl)}.alphabet-table__header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-md);margin-bottom:var(--space-lg)}.alphabet-table__title{font-size:var(--text-xl);font-weight:600;margin:0}.alphabet-table__download-btn{display:inline-flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.alphabet-table__download-btn:hover:not(:disabled){background:var(--color-primary-hover)}.alphabet-table__download-btn:disabled{opacity:.7;cursor:not-allowed}.alphabet-table__download-spinner{width:16px;height:16px;border:2px solid transparent;border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.alphabet-table__scroll{overflow-x:auto;border-radius:var(--radius-lg);border:1px solid var(--color-border)}.alphabet-table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}.alphabet-table__th{text-align:left;padding:var(--space-md);background:var(--color-primary);color:#fff;font-weight:600;white-space:nowrap}.alphabet-table__th--actions{text-align:center;width:100px}.alphabet-table__section-header td{padding:var(--space-sm) var(--space-md);background:var(--color-bg-tertiary);font-weight:600;font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-secondary)}.alphabet-table__row{transition:background var(--transition-fast)}.alphabet-table__row:hover{background:var(--color-bg-secondary)}.alphabet-table__row--playing{background:var(--color-primary-light)}.alphabet-table__cell{padding:var(--space-md);border-bottom:1px solid var(--color-border);vertical-align:middle}.alphabet-table__cell--char{width:60px;text-align:center}.alphabet-table__char{font-size:var(--text-2xl);font-weight:700;color:var(--color-text)}.alphabet-table__cell--morse{width:120px}.morse-visual{display:inline-flex;align-items:center;gap:4px;flex-wrap:wrap}.morse-visual__dot{width:10px;height:10px;background:var(--color-primary);border-radius:50%}.morse-visual__dash{width:26px;height:10px;background:var(--color-primary);border-radius:5px}.alphabet-table__cell--sound{width:140px}.alphabet-table__sound{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-text-secondary)}.alphabet-table__cell--mnemonic{position:relative}.alphabet-table__mnemonic{color:var(--color-text);line-height:1.5}.alphabet-table__pattern{display:inline-block;position:relative;margin-left:var(--space-sm);vertical-align:middle}.alphabet-table__pattern-btn{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;background:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:50%;color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast)}.alphabet-table__pattern-btn:hover{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.alphabet-table__cell--actions{text-align:center;width:100px}.alphabet-table__actions{display:flex;justify-content:center;gap:var(--space-xs);opacity:0;transition:opacity var(--transition-fast)}.alphabet-table__row:hover .alphabet-table__actions{opacity:1}.alphabet-table__action-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast)}.alphabet-table__action-btn:hover:not(:disabled){background:var(--color-primary);border-color:var(--color-primary);color:#fff}.alphabet-table__action-btn--active,.alphabet-table__action-btn--copied{background:var(--color-success);border-color:var(--color-success);color:#fff}.alphabet-table__hint{margin-top:var(--space-md);font-size:var(--text-sm);color:var(--color-text-tertiary);text-align:center}.pattern-popup{position:absolute;bottom:100%;left:50%;transform:translate(-50%);margin-bottom:var(--space-sm);width:300px;max-width:90vw;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-md);box-shadow:var(--shadow-lg);z-index:100}.pattern-popup--below{bottom:auto;top:100%;margin-bottom:0;margin-top:var(--space-sm)}.pattern-popup__header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--space-sm)}.pattern-popup__title{font-size:var(--text-sm);font-weight:600;color:var(--color-primary);margin:0}.pattern-popup__close{background:none;border:none;color:var(--color-text-tertiary);cursor:pointer;padding:0;line-height:1}.pattern-popup__close:hover{color:var(--color-text)}.pattern-popup__description{font-size:var(--text-sm);color:var(--color-text);line-height:1.6;margin:0 0 var(--space-sm) 0}.pattern-popup__members{font-size:var(--text-xs);color:var(--color-text-secondary)}.pattern-popup__members-label{font-weight:500}.pattern-popup__members-list{font-family:var(--font-mono);letter-spacing:.05em}.fun-facts{margin-top:var(--space-2xl);padding-top:var(--space-2xl);border-top:1px solid var(--color-border)}.fun-facts__title{font-size:var(--text-2xl);font-weight:600;margin:0 0 var(--space-md) 0;color:var(--color-text)}.fun-facts__intro{font-size:var(--text-base);color:var(--color-text-secondary);margin:0 0 var(--space-xl) 0;max-width:700px}.fun-facts__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:var(--space-lg)}.fun-fact-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-lg);position:relative}.fun-fact-card__number{position:absolute;top:var(--space-md);right:var(--space-md);width:28px;height:28px;background:var(--color-primary);color:#fff;font-size:var(--text-sm);font-weight:600;border-radius:50%;display:flex;align-items:center;justify-content:center}.fun-fact-card__title{font-size:var(--text-base);font-weight:600;color:var(--color-text);margin:0 0 var(--space-sm) 0;padding-right:40px}.fun-fact-card__fact{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:1.6;margin:0 0 var(--space-md) 0}.fun-fact-card__example{background:var(--color-bg-tertiary);border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md)}.fun-fact-card__example code{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-primary)}.fun-fact-card__link{display:inline-block;margin-top:var(--space-md);font-size:var(--text-sm);font-weight:500;color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}.fun-fact-card__link:hover{color:var(--color-primary-hover);text-decoration:underline}@media (max-width: 768px){.alphabet-table__actions{opacity:1}.alphabet-table__header{flex-direction:column;align-items:flex-start}.pattern-popup{transform:none;position:fixed;inset:50% 0 auto 50%;transform:translate(-50%,-50%);margin-bottom:0}}@media (max-width: 640px){.nav__links{display:none}.footer__content{flex-direction:column;text-align:center}.preset-grid__tabs{justify-content:center}.fun-facts__grid{grid-template-columns:1fr}}.generator{display:flex;flex-direction:column;gap:var(--space-lg)}.generator__label{display:block;font-size:var(--text-sm);font-weight:600;color:var(--color-text);margin-bottom:var(--space-sm);text-transform:uppercase;letter-spacing:.05em}.generator__input-section{width:100%}.generator__arrow{display:flex;justify-content:center;align-items:center;color:var(--color-primary);padding:var(--space-sm) 0}.generator__output-section{width:100%}.generator__output{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);min-height:120px;padding:var(--space-md)}.generator__morse-display{font-family:var(--font-mono);font-size:var(--text-lg);line-height:1.8;color:var(--color-text);word-break:break-word;letter-spacing:.1em}.generator__placeholder{color:var(--color-text-tertiary);font-style:italic;font-family:var(--font-sans);font-size:var(--text-base);letter-spacing:normal}.decoder{display:flex;flex-direction:column;gap:var(--space-lg)}.decoder__modes{display:flex;gap:var(--space-sm);flex-wrap:wrap}.decoder__mode-btn{display:inline-flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);font-size:var(--text-sm);font-weight:500;color:var(--color-text);cursor:pointer;transition:all var(--transition-fast)}.decoder__mode-btn:hover{background:var(--color-bg-alt);border-color:var(--color-primary)}.decoder__mode-btn--active{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.decoder__mode-btn--active:hover{background:var(--color-primary-hover)}.decoder__error{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-md);background:#ff3b301a;border:1px solid var(--color-error);border-radius:var(--radius-lg);color:var(--color-error);font-size:var(--text-sm)}.decoder__label{display:block;font-size:var(--text-sm);font-weight:600;color:var(--color-text);margin-bottom:var(--space-sm)}.decoder__hint{display:block;font-weight:400;color:var(--color-text-secondary);font-size:var(--text-xs);margin-top:var(--space-xs)}.decoder__textarea{width:100%;padding:var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);font-family:var(--font-mono);font-size:var(--text-lg);color:var(--color-text);resize:vertical;min-height:120px;letter-spacing:.1em}.decoder__textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.decoder__textarea::placeholder{color:var(--color-text-tertiary);letter-spacing:normal}.decoder__mic-section{display:flex;flex-direction:column;align-items:center;gap:var(--space-lg);padding:var(--space-xl);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.decoder__mic-controls{display:flex;justify-content:center}.decoder__mic-btn{display:inline-flex;flex-direction:column;align-items:center;gap:var(--space-sm);padding:var(--space-lg) var(--space-xl);border:2px solid var(--color-border);border-radius:var(--radius-xl);font-size:var(--text-base);font-weight:600;cursor:pointer;transition:all var(--transition-base)}.decoder__mic-btn--start{background:var(--color-bg);color:var(--color-text)}.decoder__mic-btn--start:hover{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.decoder__mic-btn--stop{background:var(--color-error);border-color:var(--color-error);color:#fff}.decoder__mic-btn--stop:hover{background:#ff2d20}.decoder__signal{width:100%;max-width:400px}.decoder__signal-label{font-size:var(--text-sm);color:var(--color-text-secondary);margin-bottom:var(--space-xs)}.decoder__signal-bar{height:8px;background:var(--color-bg-alt);border-radius:var(--radius-full);overflow:hidden}.decoder__signal-fill{height:100%;background:var(--color-success);border-radius:var(--radius-full);transition:width .1s}.decoder__listening-indicator{display:flex;align-items:center;gap:var(--space-sm);margin-top:var(--space-md);font-size:var(--text-sm);color:var(--color-text-secondary)}.decoder__pulse{width:10px;height:10px;background:var(--color-error);border-radius:50%;animation:pulse 1.5s infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2)}}.decoder__mic-hint{text-align:center;font-size:var(--text-sm);color:var(--color-text-secondary);margin:0}.decoder__file-section{display:flex;flex-direction:column;align-items:center;gap:var(--space-md)}.decoder__file-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.decoder__file-label{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-md);width:100%;min-height:200px;padding:var(--space-xl);background:var(--color-surface);border:2px dashed var(--color-border);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast);text-align:center;color:var(--color-text-secondary);font-weight:500}.decoder__file-label:hover{border-color:var(--color-primary);background:var(--color-primary-light)}.decoder__file-section--drag-active .decoder__file-label,.decoder__file-label--drag-active{border-color:var(--color-primary);background:var(--color-primary-light);border-style:solid}.decoder__spinner{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.decoder__file-hint{font-size:var(--text-sm);color:var(--color-text-secondary);margin:0}.decoder__output-section{display:flex;flex-direction:column;gap:var(--space-md)}.decoder__output-panel{width:100%}.decoder__output-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-sm)}.decoder__copy-btn{display:inline-flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-xs);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast)}.decoder__copy-btn:hover:not(:disabled){background:var(--color-primary);border-color:var(--color-primary);color:#fff}.decoder__copy-btn:disabled{opacity:.5;cursor:not-allowed}.decoder__output{padding:var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);min-height:80px;word-break:break-word}.decoder__output--morse{font-family:var(--font-mono);font-size:var(--text-lg);letter-spacing:.1em;line-height:1.8}.decoder__output--text{font-size:var(--text-lg);line-height:1.6}.decoder__placeholder{color:var(--color-text-tertiary);font-style:italic}.decoder__arrow{display:flex;justify-content:center;align-items:center;color:var(--color-primary);padding:var(--space-sm) 0}.decoder__actions{display:flex;justify-content:center;gap:var(--space-md)}.decoder__clear-btn{display:inline-flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);font-size:var(--text-sm);font-weight:500;color:var(--color-text);cursor:pointer;transition:all var(--transition-fast)}.decoder__clear-btn:hover{background:var(--color-error);border-color:var(--color-error);color:#fff}