html{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;-webkit-text-size-adjust:100%;height:100%}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Arial,sans-serif;margin:0 auto;padding-bottom:40px;background-color:#f0f0f0;min-height:100vh;position:relative;overflow-x:hidden;width:100%}.sticky-wrapper{position:sticky;top:0;z-index:1000;background-color:#f0f0f0;padding:10px;margin:0 0 10px;width:100%;box-sizing:border-box;box-shadow:0 2px 4px #0000001a;min-height:80px}.container{max-width:1200px;margin:0 auto;width:100%;box-sizing:border-box;padding:0 10px;position:relative}h1{text-align:center;color:#333}.fidel-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;touch-action:manipulation;-webkit-overflow-scrolling:touch;margin:0 auto;width:100%;max-width:100vw;box-sizing:border-box;padding:0 8px;overflow-x:hidden}.fidel-cell{background-color:#fff;border:1px solid #ccc;border-radius:5px;aspect-ratio:1;display:flex;align-items:center;justify-content:center;text-align:center;font-size:24px;cursor:pointer;transition:background-color .2s,border-color .2s;box-sizing:border-box}.fidel-cell:hover{background-color:#f0f0f0}.fidel-cell.revealed{border:1px solid #4CAF50;box-shadow:inset 0 0 0 1px #4caf50;background-color:#4caf501a}.sticky-wrapper{top:0;z-index:1000;background-color:#f0f0f0;padding:10px;margin:0 0 10px;width:100%;box-sizing:border-box;box-shadow:0 2px 4px #0000001a}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.fidel-cell.shake{animation:shake .5s ease-in-out}@keyframes celebrate{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.random-fidel .amharic:contains("🎉"){animation:celebrate 1s ease-in-out infinite}.random-fidel{background-color:#fff;border:2px solid #4CAF50;border-radius:5px;aspect-ratio:1;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 2px 10px #0000001a;font-size:24px;width:64px;height:64px;box-sizing:border-box}.fidel-display{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.fidel-display .amharic{font-size:24px}.fidel-display .transliteration{font-size:14px;color:#666}.top-section{position:sticky;top:0;z-index:1000;align-items:flex-start;background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;display:flex;flex-direction:column;padding:5px 10px}.toolbar{display:flex;flex:1;width:100%;align-items:center;justify-content:space-between;min-height:60px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.icon-button{width:32px;height:32px;border-radius:4px;border:2px solid #ccc;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;box-sizing:border-box}.icon-button:hover{background:#f0f0f0}.icon-button.active{border-color:#4caf50;color:#4caf50}.show-all-control{display:inline-flex;align-items:center}.icon-button.active svg{fill:#4caf50}.icon-button svg{display:block;transition:fill .2s ease}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#resetGrid svg{fill:#000;transition:fill .2s ease}#resetGrid:hover svg{fill:#666}#resetGrid.rotating svg{animation:rotate .5s ease-in-out}.score-display{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;padding:1px;font-size:16px;line-height:1.2;height:64px}.score-divider{width:100%;height:2px;background-color:#ccc;margin:2px 0}.score-numerator,.score-denominator{text-align:center}.header{display:flex;justify-content:space-between;align-items:center;padding:10px 0;margin-bottom:20px}.header-logo{display:flex;align-items:center;background-color:#0f47af;border-radius:8px;padding:5px 10px}.logo-link{display:flex;align-items:center;text-decoration:none;color:#fff;gap:12px}.banner{color:#fcdd09;font-weight:700}.banner{margin-left:8px;color:#fcdd09;font-weight:700}.logo-link{display:flex;align-items:center;text-decoration:none;color:inherit}.main-nav{margin-left:auto}.nav-links{display:flex;list-style:none;margin:0;padding:0;gap:20px}.nav-link{color:#0f47af;text-decoration:none;font-size:1em;font-weight:700;padding:5px 10px;border-radius:4px;position:relative;transition:color .2s}.nav-link:after{content:"";position:absolute;left:10px;right:10px;bottom:0;height:2px;background:linear-gradient(to right,#da121a,#fcdd09,#078930);transform:scaleX(0);transition:transform .3s ease;transform-origin:bottom right}.nav-link.active:after{content:"";position:absolute;left:10px;right:10px;bottom:0;height:2px;background:linear-gradient(to right,#da121a,#fcdd09,#078930);transform:scaleX(1)}.nav-link.active{font-weight:600;color:#0d3d9b}.nav-link:hover{background-color:transparent}.nav-link:hover:after{transform:scaleX(1);transform-origin:bottom left}.transliteration{display:none}.transliteration-visible .transliteration{display:block}.banner{flex:1;margin:0;display:flex;align-items:center;font-size:2em;font-weight:700;background:linear-gradient(to right,#da121a,#fcdd09,#078930);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}@media screen and (max-width: 600px){.banner{font-size:1em}.header{gap:20px}}.nav-link{display:flex;align-items:center;margin-left:10px}.button-link{display:inline-block;padding:8px 16px;background-color:#0f47af;color:#fff;text-decoration:none;border-radius:4px;font-weight:700;transition:background-color .2s}.button-link:hover{background-color:#0f47af}.about-content{background-color:#fff;border-radius:8px;padding:20px;margin-top:20px;box-shadow:0 2px 10px #0000001a}.about-content h2,.about-content h3{color:#0f47af}.about-content ul{padding-left:20px}.about-content li{margin-bottom:8px}.info-icon{cursor:pointer;transition:opacity .2s}.info-icon:hover{opacity:.8}.info-icon a{display:flex;color:#0f47af;text-decoration:none}.instructions{margin:20px 0}.instruction-row{display:flex;align-items:center;margin-bottom:15px;background-color:#f8f8f8;border-radius:6px;padding:10px}.instruction-button{background-color:#fff;border:2px solid #ccc;border-radius:4px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;margin-right:15px;flex-shrink:0}.hahu-instruction{background-color:#fff;border:1px solid #ccc;border-radius:2px;width:15px;height:15px;display:flex;align-items:center;justify-content:center;margin-right:15px;flex-shrink:0}.instruction-text{flex:1}.instruction-text strong{color:#0f47af}.hahu-instructions-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:4px;width:70px;height:70px;margin-right:15px;flex-shrink:0}.hahu-cell{background-color:#fff;border:1px solid #ccc;border-radius:3px;display:flex;align-items:center;justify-content:center;font-size:16px;aspect-ratio:1}.hahu-cell:first-child{border:2px solid #4CAF50}.hahu-cell:nth-child(3){background-color:#f0f0f0}.fidel-cell,.random-fidel,.hahu-cell,.fidel-display,.banner,.hahu-instructions-grid{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}.fidel-cell,.random-fidel,button,.icon-button,.button-link,.info-icon a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}.pattern-selector-container{margin:0 10px}.pattern-selector{padding:5px;border-radius:4px;border:1px solid #ccc;background-color:#fff;font-size:14px;min-width:120px;cursor:pointer}.pattern-selector:focus{outline:none;border-color:#4caf50}.pattern-description{width:100%;text-align:left;padding:5px}.pattern-description.hidden{display:none}.flashcard-container{background-color:#fff;border-radius:8px;padding:20px;margin-top:20px;box-shadow:0 2px 10px #0000001a;display:flex;flex-direction:column;align-items:center;gap:20px}.flashcard-audio{margin:15px 0}.flashcard-audio-button{width:64px;height:64px;border-radius:50%;background-color:#0f47af;color:#fff;border:none;font-size:24px;cursor:pointer;transition:background-color .2s,transform .2s;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 5px #0003}.flashcard-audio-button:hover{background-color:#0d3d9b;transform:scale(1.05)}.flashcard-audio-button svg{width:32px;height:32px}.flashcard-button-row{display:flex;align-items:center;gap:10px}.flashcard-row{display:flex;gap:10px;justify-content:center;margin:20px 0}.flashcard-cell{background-color:#fff;border:1px solid #ccc;border-radius:5px;width:60px;height:60px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:24px;cursor:pointer;transition:background-color .2s,transform .2s,border-color .2s}.flashcard-cell:hover{background-color:#f0f0f0;transform:translateY(-2px)}.flashcard-cell.correct{border:2px solid #4CAF50;background-color:#4caf501a;box-sizing:border-box}.flashcard-cell.incorrect{border:2px solid #da121a;background-color:#da121a1a;box-sizing:border-box}.flashcard-controls{margin-top:20px;display:flex;gap:10px}.flashcard-score-display{display:flex;flex-direction:column;background-color:#fff;padding:5px 15px;border-radius:8px;box-shadow:0 2px 6px #0000001a;width:100%}.fidel-cell,.flashcard-cell{background-color:#fff;border:1px solid #ccc;border-radius:5px;aspect-ratio:1;display:flex;align-items:center;justify-content:center;text-align:center;font-size:24px;cursor:pointer;transition:background-color .2s}.fidel-cell:hover,.flashcard-cell:hover{background-color:#f0f0f0}.fidel-cell.hidden{background-color:#e0e0e0;color:transparent}.fidel-cell.revealed{border:2px solid #4CAF50;background-color:#fff}.fidel-cell.revealed:hover{background-color:#f0f0f0}.flashcard-cell.correct{border:2px solid #4CAF50;background-color:#4caf501a}.flashcard-cell.incorrect{border:2px solid #da121a;background-color:#da121a1a}.fidel-grid .fidel-cell.pattern-member{background-color:#a8d5ba!important;border:1px solid #45a049!important;box-shadow:inset 0 0 0 1px #45a049!important;color:#000!important}.fidel-grid .fidel-cell.pattern-exception{background-color:#ffb3b3!important;border:1px solid #e53935!important;box-shadow:inset 0 0 0 1px #e53935!important;color:#000!important}.fidel-grid .fidel-cell.pattern-member:hover{color:#030!important;background-color:#86c29b!important}.fidel-grid .fidel-cell.pattern-exception:hover{color:#300!important;background-color:#f99!important}.fidel-grid .fidel-cell.pattern-member.clicked,.fidel-grid .fidel-cell.pattern-member.clicked.correct{background-color:#86c29b!important;color:#030!important}.fidel-grid .fidel-cell.pattern-exception.clicked,.fidel-grid .fidel-cell.pattern-exception.clicked.correct{background-color:#f99!important;color:#300!important}#resetFlashcardDataButton{background:transparent;border:none;padding:0;margin-left:5px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.srs-status-title{display:flex;align-items:center;justify-content:space-between;padding:5px;width:100%;border:#0d3d9b}.flashcard-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:20px 0}.srs-status-bars{width:100%;margin-bottom:15px}.srs-bar-container{display:flex;height:20px;width:100%;background-color:#f1f1f1;border-radius:10px;overflow:hidden;margin-bottom:10px}.srs-bar{height:100%;transition:width .3s ease}.srs-bar.new-cards{background-color:#ccc}.srs-bar.learning-cards{background-color:#fcdd09}.srs-bar.review-cards{background-color:#0f47af}.srs-bar.mastered-cards{background-color:#078930}.srs-labels{display:flex;justify-content:space-between;flex-wrap:wrap;font-size:12px}.srs-label{display:flex;align-items:center;margin-right:10px;margin-bottom:5px;color:#555}.srs-dot{width:8px;height:8px;border-radius:50%;margin-right:5px;display:inline-block}.srs-dot.new{background-color:#ccc}.srs-dot.learning{background-color:#fcdd09}.srs-dot.review{background-color:#0f47af}.srs-dot.mastered{background-color:#078930}.current-card-info{font-size:14px;color:#666;margin-top:5px;text-align:center}#currentCardStatus,#nextReviewTime{font-weight:700}.status-indicator{display:flex;flex-direction:column;align-items:center;justify-content:center;width:60px;height:60px;border-radius:50%;background-color:#fff;border:2px solid #0f47af;position:relative}.interval-value{font-size:24px;font-weight:700;color:#0f47af}.interval-label{font-size:12px;color:#666}.next-review{flex:1;margin-left:15px;font-size:14px;color:#555;line-height:1.4}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.animate-pulse{animation:pulse .3s ease-in-out}@media screen and (max-width: 600px){.flashcard-row{flex-wrap:wrap;justify-content:center}.flashcard-cell{width:50px;height:50px;font-size:20px}}.button-link.danger{background-color:#da121a;margin-left:10px}.button-link.danger:hover{background-color:#b30e15}.confirm-dialog{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.confirm-dialog-content{background-color:#fff;padding:20px;border-radius:8px;max-width:300px;width:100%;box-shadow:0 4px 12px #0003}.confirm-dialog-title{font-size:18px;font-weight:700;margin-bottom:15px}.confirm-dialog-message{margin-bottom:20px;line-height:1.4}.confirm-dialog-buttons{display:flex;justify-content:flex-end;gap:10px}.confirm-dialog-button{padding:8px 16px;border:none;border-radius:4px;cursor:pointer;font-weight:700}.confirm-dialog-button.cancel{background-color:#f0f0f0;color:#333}.confirm-dialog-button.confirm{background-color:#da121a;color:#fff}.flashcard-grid{display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:1fr;gap:10px;width:100%;padding:10px;box-sizing:border-box;margin:20px 0}.control-buttons{display:flex;flex-direction:column;justify-content:center;align-items:flex-end;gap:15px;margin-top:20px;width:100%;padding:5px}.control-buttons button{background-color:#fff;border:1px solid #ccc;border-radius:50%;width:64px;height:64px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s,transform .2s;box-shadow:0 2px 5px #0003}.control-buttons button:hover{background-color:#f0f0f0;transform:scale(1.05)}.control-buttons button:active{transform:scale(.95)}.fidel-cell,.flashcard-grid>div{background-color:#fff;border:1px solid #ccc;border-radius:5px;aspect-ratio:1;display:flex;align-items:center;justify-content:center;text-align:center;font-size:24px;cursor:pointer;transition:background-color .2s,border .2s;box-sizing:border-box}.fidel-cell:hover,.flashcard-grid>div:hover{background-color:#f0f0f0}.flashcard-grid>div.correct{border:2px solid #4CAF50;background-color:#4caf501a}.flashcard-grid>div.incorrect{border:2px solid #da121a;background-color:#da121a1a}@media screen and (max-width: 600px){.control-buttons button{width:60px;height:60px}.control-buttons button svg{width:36px;height:36px}}.content-wrapper{flex:1 0 auto;display:flex;flex-direction:column}.site-footer{position:fixed;bottom:0;left:0;width:100%;padding:.5rem 0;z-index:10;box-shadow:0 -2px 5px #0000001a;overflow:hidden}.footer-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#fff;opacity:1}.footer-container{max-width:1200px;margin:0 auto;padding:0 20px;display:flex;align-items:center;position:relative;z-index:10;font-size:.75rem}.footer-link{margin:0 auto;color:#4b5563;text-decoration:none;display:flex;align-items:center;gap:5px;transition:color .2s,border-bottom .2s}.footer-link:hover{color:#0f47af;border-bottom:1px solid #0f47af}@media (min-width: 640px){.footer-container{font-size:.875rem}}.section-heading{margin:1.5rem 0 1rem;color:#0f47af;font-weight:600}.current-character-display{display:flex;justify-content:center;align-items:center;margin:20px 0;min-height:80px}.current-character{font-size:64px;font-weight:700;color:#0f47af;background:#fff;border:2px solid #0f47af;border-radius:8px;padding:20px 30px;box-shadow:0 2px 10px #0f47af1a}.audio-options-container{margin:20px 0;width:100%;box-sizing:border-box;padding:0 10px;display:flex;flex-direction:column;gap:8px}.play-buttons-row,.choose-buttons-row{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;width:100%}.audio-play-button{background-color:#fff;border:1px solid #ccc;border-radius:5px;cursor:pointer;padding:12px;transition:background-color .2s,border-color .2s;display:flex;align-items:center;justify-content:center;min-height:44px;box-sizing:border-box}.audio-play-button svg{width:28px;height:28px;fill:#0f47af}.audio-play-button:hover{background-color:#0f47af1a;border-color:#0f47af}.choose-button{background-color:#fff;border:2px solid #ccc;border-radius:5px;cursor:pointer;padding:12px;transition:all .2s;display:flex;align-items:center;justify-content:center;min-height:44px;font-size:16px;font-weight:700;box-sizing:border-box;position:relative}.choose-button .checkbox-icon{width:20px;height:20px;fill:#999;transition:fill .2s}.choose-button:hover{border-color:#0f47af;background-color:#0f47af1a}.choose-button:hover .checkbox-icon{fill:#0f47af}.choose-button.selected{border-color:#4caf50;background-color:#4caf50;color:#fff}.choose-button.selected .checkbox-icon{fill:#fff}.choose-button.correct{border-color:#4caf50;background-color:#4caf501a}.choose-button.correct .checkbox-icon{fill:#4caf50}.choose-button.incorrect{border-color:#f44336;background-color:#f443361a}.choose-button.incorrect .checkbox-icon{fill:#f44336}.current-character-display{display:flex;justify-content:center;align-items:center;margin:15px 0;min-height:60px}.current-character{font-size:48px;font-weight:700;color:#0f47af;background:#fff;border:2px solid #0f47af;border-radius:8px;padding:15px 25px;box-shadow:0 2px 10px #0f47af1a}@media (max-width: 768px){.audio-options-container{gap:6px;padding:0 8px;margin:15px 0}.play-buttons-row,.choose-buttons-row{gap:6px}.audio-play-button,.choose-button{padding:10px;min-height:40px}.audio-play-button svg{width:24px;height:24px}.choose-button .checkbox-icon{width:18px;height:18px}.current-character{font-size:40px;padding:12px 20px}}@media (max-width: 480px){.audio-options-container{gap:4px;padding:0 6px;margin:10px 0}.play-buttons-row,.choose-buttons-row{gap:4px}.audio-play-button,.choose-button{padding:8px;min-height:36px}.audio-play-button svg{width:20px;height:20px}.choose-button .checkbox-icon{width:16px;height:16px}.current-character{font-size:36px;padding:10px 18px}.current-character-display{margin:10px 0;min-height:50px}}@media (max-width: 360px){.audio-options-container{gap:3px;padding:0 4px}.play-buttons-row,.choose-buttons-row{gap:3px}.audio-play-button,.choose-button{padding:6px;min-height:32px}.audio-play-button svg{width:18px;height:18px}.choose-button .checkbox-icon{width:14px;height:14px}.current-character{font-size:32px;padding:8px 15px}}.cache-status{position:fixed;bottom:20px;left:20px;background:#000c;color:#fff;padding:10px 15px;border-radius:8px;font-size:12px;z-index:1000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:none}.cache-status.show{display:block}.cache-info div{margin:2px 0}.offline-status.ready{color:#4caf50;font-weight:700}.offline-status.not-ready{color:#ff9800}.cache-notification{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Arial,sans-serif;cursor:pointer}.cache-notification:hover{transform:translate(-5px)!important}.pwa-install-prompt{position:fixed;bottom:20px;right:20px;background:#2196f3;color:#fff;padding:15px 20px;border-radius:12px;box-shadow:0 4px 20px #0000004d;z-index:10000;max-width:300px;cursor:pointer;transform:translateY(100px);transition:transform .3s ease}.pwa-install-prompt.show{transform:translateY(0)}.pwa-install-prompt .close-btn{position:absolute;top:5px;right:10px;background:none;border:none;color:#fff;font-size:18px;cursor:pointer;padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center}.audio-loading{display:inline-block;width:16px;height:16px;border:2px solid #f3f3f3;border-top:2px solid #2196F3;border-radius:50%;animation:spin 1s linear infinite;margin-left:5px}@media (max-width: 480px){.cache-status{bottom:10px;left:10px;font-size:11px;padding:8px 12px}.cache-notification{right:10px;top:10px;max-width:calc(100vw - 40px);font-size:13px}.pwa-install-prompt{right:10px;bottom:10px;max-width:calc(100vw - 40px)}}.current-phrase-display{text-align:center;padding:30px 20px;background-color:#f8f8f8;border-radius:8px;margin-bottom:30px}.current-phrase{font-size:24px;font-weight:700;color:#000;margin-bottom:8px;line-height:1.4}.current-translation{font-size:14px;color:#666;font-style:italic}@media (max-width: 768px){.current-phrase{font-size:20px}.current-translation{font-size:12px}}.matching-game-container{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-bottom:30px}.matching-column h3{text-align:center;color:#0f47af;margin-bottom:20px;font-size:18px}.matching-items-container{display:flex;flex-direction:column;gap:12px}.matching-item{background-color:#f8f8f8;border:2px solid #ddd;border-radius:8px;padding:15px;cursor:pointer;transition:all .2s ease;font-size:16px;text-align:center;min-height:60px;display:flex;align-items:center;justify-content:center}.matching-item:hover{border-color:#0f47af;background-color:#f0f0ff}.matching-item.selected{border-color:#0f47af;background-color:#e6f0ff;box-shadow:0 0 10px #0f47af4d}.matching-item.matched{background-color:#e8f5e8;border-color:#078930;color:#078930;cursor:default}.matching-item.matched:hover{background-color:#e8f5e8;border-color:#078930}.matching-item.incorrect{background-color:#ffe6e6;border-color:#da121a;color:#da121a;animation:shake .5s ease-in-out}.progress-text{font-weight:700;color:#0f47af}@media (max-width: 768px){.matching-game-container{grid-template-columns:1fr;gap:20px}.matching-item{font-size:14px;padding:12px;min-height:50px}.matching-column h3{font-size:16px}}.matching-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px;margin:8px 0;border:2px solid #ddd;border-radius:8px;cursor:pointer;background:#fff;transition:all .2s ease}.matching-text{flex:1}.matching-item-container{display:flex;align-items:center;gap:8px;margin:8px 0}.matching-item{flex:1;padding:12px;border:2px solid #ddd;border-radius:8px;cursor:pointer;background:#fff;transition:all .2s ease}.matching-item-container.selected .matching-item{border-color:#2196f3;background-color:#e3f2fd}.matching-item-container.matched .matching-item{border-color:#4caf50;background-color:#e8f5e8}.matching-item-container.incorrect .matching-item{border-color:#f44336;background-color:#ffebee}.audio-play-button{width:24px;height:24px;border:none;background:none;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;flex-shrink:0}.audio-play-button.disabled{cursor:not-allowed;opacity:.5}.audio-play-button.ready:hover{transform:scale(1.1)}.audio-play-button.error{cursor:not-allowed}.audio-spacer{width:24px;height:24px;flex-shrink:0}.loading-spinner{animation:spin 1s linear infinite;opacity:.6}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.audio-play-button:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.audio-play-button:disabled svg{fill:#999!important}