.morse-light-widget * {
     box-sizing: border-box;
     margin: 0;
     padding: 0;
 }
 
 .morse-light-widget {
     max-width: 600px;
     margin: 0 auto;
     padding: 20px;
     background: var(--contrast, #222222);
     border-radius: 12px;
 }
 /* main theme colors exactly like original */
 
 .morse-light-widget .panel {
     background: var(--contrast, #222222);
     padding: 20px;
     margin-bottom: 20px;
 }
 
 .morse-light-widget h3 {
     color: white;
     font-size: 18px;
     font-weight: 600;
     margin-bottom: 15px;
     padding-bottom: 10px;
     border-bottom: 1px solid var(--contrast-3, #b2b2be);
 }
 
 .morse-light-widget textarea {
     width: 100%;
     min-height: 100px;
     padding: 12px;
     background: #3b3e42;
     border: 1px solid var(--contrast-3, #b2b2be);
     border-radius: 8px;
     color: white;
     font-size: 16px;
     font-family: 'Courier New', monospace;
     resize: vertical;
     margin-bottom: 15px;
 }
 
 .morse-light-widget textarea::placeholder {
     color: #ffffff;
 }
 
 .morse-light-widget .light-container {
     background: #3b3e42 !important;
     border-radius: 12px;
     padding: 25px;
     text-align: center;
     border: 1px solid var(--contrast-3, #b2b2be);
     margin: 20px 0;
 }
 /* the main light (big flash circle) */
 
 .morse-light-widget #lightDisplay {
     width: 180px;
     height: 180px;
     background: #222222;
     border-radius: 50%;
     margin: 0 auto 20px auto;
     border: 1px solid var(--contrast-3, #b2b2be);
     box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
     transition: background 0.1s ease, box-shadow 0.1s ease;
 }
 
 .morse-light-widget #lightDisplay.active {
     background: #f1c40f;
     border-color: #f39c12;
     box-shadow: 0 0 50px rgba(241, 196, 15, 0.8);
 }
 /* dot/dash word display */
 
 .morse-light-widget .signal-words {
     display: flex;
     justify-content: center;
     gap: 40px;
     margin: 20px 0 10px;
     font-size: 28px;
     font-weight: bold;
     letter-spacing: 2px;
 }
 
 .morse-light-widget .dot-word {
     color: #2ecc71;
     text-shadow: 0 0 8px rgba(46, 204, 113, 0.5);
     background: rgba(0, 0, 0, 0.3);
     padding: 10px 25px;
     border-radius: 50px;
     border: 2px solid #2ecc71;
 }
 
 .morse-light-widget .dash-word {
     color: #e74c3c;
     text-shadow: 0 0 8px rgba(231, 76, 60, 0.5);
     background: rgba(0, 0, 0, 0.3);
     padding: 10px 25px;
     border-radius: 50px;
     border: 2px solid #e74c3c;
 }
 
 .morse-light-widget .inactive-word {
     opacity: 0.2;
     border-color: #fff;
     color: #fff;
 }
 /* control buttons */
 
 .morse-light-widget .button-group {
     display: flex;
     gap: 12px;
     justify-content: center;
     flex-wrap: wrap;
     margin: 25px 0 15px;
 }
 
 .morse-light-widget .ctrl-btn {
     padding: 12px 24px;
     font-size: 18px;
     font-weight: 600;
     border: none;
     cursor: pointer;
     display: inline-flex;
     align-items: center;
     gap: 8px;
     transition: all 0.2s;
     border: 2px solid var(--contrast-3, #b2b2be);
 }
 
 .morse-light-widget .play-btn {
     background: var(--red-1, #9e3500);
     color: var(--base-3, #fff);
 }
 
 .morse-light-widget .play-btn:hover {
     background: var(--highlight-1, #ff661a);
     color: var(--contrast, #222222);
     transform: scale(1.02);
 }
 
 .morse-light-widget .stop-btn {
     background: var(--red-1, #9e3500);
     color: var(--base-3, #fff);
     ;
 }
 
 .morse-light-widget .stop-btn:hover {
     background: var(--highlight-1, #ff661a);
     color: var(--contrast, #222222)
 }
 
 .morse-light-widget .sound-btn {
     background: var(--red-1, #9e3500);
     color: var(--base-3, #fff);
     ;
 }
 
 .morse-light-widget .sound-btn:hover {
     background: var(--highlight-1, #ff661a);
     color: var(--contrast, #222222)
 }
 /* speed slider */
 
 .morse-light-widget .slider-container {
     background: #3b3e42;
     padding: 15px;
     border: 1px solid var(--contrast-3, #b2b2be);
     margin-top: 20px;
     color: white;
 }
 
 .morse-light-widget .slider-label {
     display: flex;
     justify-content: space-between;
     margin-bottom: 8px;
     font-size: 16px;
 }
 
 .morse-light-widget input[type=range] {
     width: 100%;
     height: 8px;
     background: var(--accent, #ffffff);
     border-radius: 4px;
     outline: none;
     -webkit-appearance: none;
 }
 
 .morse-light-widget input[type=range]::-webkit-slider-thumb {
     -webkit-appearance: none;
     width: 22px;
     height: 22px;
     background: #3498db;
     border-radius: 50%;
     border: 2px solid white;
     cursor: pointer;
 }
 
 .morse-light-widget .status {
     color: white;
     background: #3b3e42;
     padding: 12px 18px;
     border-radius: 50px;
     border-left: 4px solid #ffff;
     margin-top: 20px;
     font-size: 16px;
 }
 /* letter spacing */
 
 .morse-light-widget .info-text {
     color: #ffffff;
     font-size: 14px;
     margin-top: 8px;
 }