.sound-board{--sb-bg:var(--color-background);--sb-surface:var(--color-surface-elevated);--sb-surface2:var(--color-surface);--sb-border:var(--color-border);--sb-border2:var(--color-border-strong);--sb-text:var(--color-text);--sb-text2:var(--color-text-secondary);--sb-text3:var(--color-text-tertiary);--sb-red:var(--color-brand);--sb-red-hover:var(--color-red);--sb-red-fire:#ff6b5f;--sb-green:var(--color-success);--sb-green-hover:#128a3d;--sb-green-fire:#22c55e;--sb-blue:var(--color-blue);--sb-blue-hover:var(--color-blue-muted);--sb-blue-fire:#4c8dff;--sb-yellow:var(--color-warning);--sb-yellow-hover:var(--color-warning-strong);--sb-yellow-fire:#f59e0b;--sb-purple:#7c4a9e;--sb-purple-hover:#64397f;--sb-purple-fire:#9b63c2;--sb-pink:#d1477a;--sb-pink-hover:#b23a66;--sb-pink-fire:#ea6b98;--sb-gap:8px;width:100%;color:var(--sb-text)}.sound-board[data-sb-theme=dark]{--sb-bg:#1a1613;--sb-surface:#241e1a;--sb-surface2:#2e2620;--sb-border:#3a3128;--sb-border2:#4a3f33;--sb-text:#f5f1ea;--sb-text2:#b8afa3;--sb-text3:#8a8074;--sb-red:#f0655c;--sb-red-hover:#d9463d;--sb-red-fire:#ff8f86;--sb-green:#3ddb6e;--sb-green-hover:#22b558;--sb-green-fire:#6ff09b;--sb-blue:#5b8def;--sb-blue-hover:#3d6fd1;--sb-blue-fire:#8fb8ff;--sb-yellow:#f0a431;--sb-yellow-hover:#d68a1c;--sb-yellow-fire:#ffc562;--sb-purple:#a66bc9;--sb-purple-hover:#8b4fae;--sb-purple-fire:#c994e3;--sb-pink:#e37299;--sb-pink-hover:#c85a85;--sb-pink-fire:#f5a3c4}.sound-board__page{background:var(--sb-bg);flex-direction:column;align-items:center;width:100%;padding:12px 12px 60px;display:flex;overflow-x:hidden}.sound-board__loading-screen{min-height:60vh;color:var(--sb-text3);letter-spacing:.04em;flex-direction:column;justify-content:center;align-items:center;gap:12px;font-size:13px;display:flex}.sound-board__title{width:100%;max-width:420px;font-family:var(--font-raleway), sans-serif;letter-spacing:-.4px;color:var(--sb-text);text-wrap:pretty;margin:0 auto 14px;font-size:20px;font-weight:800}.sound-board__top{width:100%;max-width:420px;margin:0 auto 20px}.sound-board__top-meta-row{justify-content:space-between;align-items:flex-start;gap:8px;display:flex}.sound-board__top-meta-left{align-items:center;gap:6px;display:flex;position:relative}.sound-board__board-switcher{position:relative}.sound-board__board-name-btn{background:var(--sb-surface2);border:1px solid var(--sb-border);cursor:pointer;border-radius:8px;align-items:center;gap:6px;padding:5px 9px 5px 10px;font-family:inherit;transition:background .12s,border-color .12s;display:flex}.sound-board__board-name-btn:hover{border-color:var(--sb-border2)}.sound-board__board-name-btn--open{border-color:var(--sb-red)}.sound-board__board-name-text{letter-spacing:.01em;color:var(--sb-text);text-overflow:ellipsis;white-space:nowrap;max-width:160px;font-size:13px;font-weight:600;overflow:hidden}.sound-board__board-name-chevron{color:var(--sb-text2);align-items:center;transition:transform .15s;display:flex}.sound-board__board-name-btn--open .sound-board__board-name-chevron{transform:rotate(180deg)}.sound-board__board-dropdown{background:var(--sb-surface);border:1px solid var(--sb-border);z-index:100;border-radius:12px;min-width:228px;position:absolute;top:calc(100% + 6px);left:0;overflow:hidden;box-shadow:0 8px 28px #00000029}.sound-board__board-dropdown-item{border-bottom:1px solid var(--sb-border);align-items:center;gap:4px;min-height:40px;padding:0 6px 0 12px;display:flex}.sound-board__board-dropdown-item:last-of-type{border-bottom:none}.sound-board__board-item-name{cursor:pointer;color:var(--sb-text2);text-align:left;white-space:nowrap;text-overflow:ellipsis;background:0 0;border:none;flex:1;align-items:center;gap:7px;padding:10px 0;font-family:inherit;font-size:12px;font-weight:500;transition:color .12s;display:flex;overflow:hidden}.sound-board__board-item-name:hover{color:var(--sb-text)}.sound-board__board-dropdown-item--active .sound-board__board-item-name{color:var(--sb-text);font-weight:700}.sound-board__board-active-dot{background:var(--sb-red);border-radius:50%;flex-shrink:0;width:5px;height:5px;display:inline-block}.sound-board__board-item-actions{flex-shrink:0;gap:1px;display:flex}.sound-board__board-action-btn{cursor:pointer;width:26px;height:26px;color:var(--sb-text3);background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;transition:background .12s,color .12s;display:flex}.sound-board__board-action-btn:hover{background:var(--sb-surface2);color:var(--sb-text)}.sound-board__board-action-btn--delete:hover{color:var(--sb-red);background:#d94f3d14}.sound-board__board-rename-input{letter-spacing:.02em;background:var(--sb-bg);border:1px solid var(--sb-border2);color:var(--sb-text);border-radius:5px;outline:none;flex:1;width:auto;margin:5px 4px 5px 0;padding:4px 7px;font-family:inherit;font-size:16px;font-weight:600}.sound-board__board-rename-input:focus{border-color:var(--sb-red)}.sound-board__board-add-btn{border:none;border-top:1px solid var(--sb-border);cursor:pointer;width:100%;color:var(--sb-red);text-align:left;background:0 0;align-items:center;gap:6px;padding:10px 12px;font-family:inherit;font-size:12px;font-weight:500;transition:background .12s;display:flex}.sound-board__board-add-btn:hover{background:#00000008}.sound-board__board-footer-link{color:var(--sb-red);padding:8px 12px 10px;font-size:11px;font-weight:600;text-decoration:none;display:block}.sound-board__share-btn-wrap{position:relative}.sound-board__share-header-btn{color:var(--sb-text3);border:1px solid var(--sb-border);cursor:pointer;background:0 0;border-radius:7px;justify-content:center;align-items:center;padding:5px 7px;transition:color .15s,border-color .15s,background .15s;display:inline-flex}.sound-board__share-header-btn:hover,.sound-board__share-header-btn--active{color:var(--sb-red);border-color:var(--sb-red);background:#00000008}.sound-board__share-header-btn--shared{color:var(--sb-red);border-color:var(--sb-red)}.sound-board__share-popover{z-index:300;background:var(--sb-surface);border:1px solid var(--sb-border);border-radius:12px;width:240px;padding:4px 0;position:absolute;top:calc(100% + 8px);left:0;box-shadow:0 4px 20px #0000001f}.sound-board__share-popover-label{letter-spacing:.08em;text-transform:uppercase;color:var(--sb-text3);padding:8px 14px 2px;font-size:10px;font-weight:600}.sound-board__share-popover-actions{border-top:1px solid var(--sb-border);gap:8px;padding:8px 14px 12px;display:flex}.sound-board__share-popover-hint{border-top:1px solid var(--sb-border);color:var(--sb-text3);padding:10px 14px 12px;font-size:11px}.sound-board__help-btn{color:var(--sb-text3);cursor:pointer;background:0 0;border:none;align-items:center;gap:5px;padding:0;font-family:inherit;font-size:11px;font-weight:500;transition:color .15s;display:inline-flex}.sound-board__help-btn:hover{color:var(--sb-text2)}.sound-board__help-panel{background:var(--sb-surface);border-radius:20px;flex-direction:column;width:100%;max-width:480px;max-height:88vh;display:flex;overflow:hidden}.sound-board__help-header{border-bottom:1px solid var(--sb-border);flex-shrink:0;justify-content:space-between;align-items:center;padding:18px 20px;display:flex}.sound-board__help-title{color:var(--sb-text);font-size:14px;font-weight:700}.sound-board__help-close{cursor:pointer;color:var(--sb-text3);background:0 0;border:none;border-radius:6px;padding:4px;transition:color .15s,background .15s;display:flex}.sound-board__help-close:hover{color:var(--sb-text);background:var(--sb-surface2)}.sound-board__help-body{flex-direction:column;gap:18px;padding:18px 20px 20px;display:flex;overflow-y:auto}.sound-board__help-section{flex-direction:column;gap:5px;display:flex}.sound-board__help-section-title{text-transform:uppercase;letter-spacing:.1em;color:var(--sb-text2);font-size:12px;font-weight:700}.sound-board__help-section p{color:var(--sb-text2);text-wrap:pretty;margin:0;font-size:13px;line-height:1.6}.sound-board__help-section p strong{color:var(--sb-text);font-weight:600}.sound-board__help-link{color:var(--sb-red);font-weight:600}.sound-board__status-bar{justify-content:center;width:100%;max-width:420px;margin:0 auto 16px;display:flex}.sound-board__status-pill{letter-spacing:.02em;background:var(--sb-surface);border:1px solid var(--sb-border);width:100%;color:var(--sb-text3);text-overflow:ellipsis;white-space:nowrap;border-radius:10px;justify-content:center;align-items:center;padding:10px 20px;font-size:13px;font-weight:500;transition:background .2s,border-color .2s,color .2s;display:flex;overflow:hidden}.sound-board__status-pill--active{color:var(--sb-green);background:#22c55e14;border-color:#22c55e40}.sound-board__status-pill--stopped{color:var(--sb-red);background:#d94f3d14;border-color:#d94f3d33}.sound-board__exit-edit-btn{background:var(--sb-red);border:1px solid var(--sb-red);color:#fff;text-align:center;cursor:pointer;border-radius:10px;width:100%;padding:10px 20px;font-family:inherit;font-size:13px;font-weight:600}.sound-board__exit-edit-btn:hover{background:var(--sb-red-hover)}.sound-board__numpad{box-sizing:border-box;gap:var(--sb-gap);touch-action:none;grid-template-rows:repeat(4,100px) 56px;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;max-width:460px;margin:0 auto 20px;display:grid}.sound-board__pad-wrap{position:relative}.sound-board__pad--7{grid-area:1/1}.sound-board__pad--8{grid-area:1/2}.sound-board__pad--9{grid-area:1/3}.sound-board__pad--minus{grid-area:1/4}.sound-board__pad--4{grid-area:2/1}.sound-board__pad--5{grid-area:2/2}.sound-board__pad--6{grid-area:2/3}.sound-board__pad--plus{grid-area:2/4}.sound-board__pad--1{grid-area:3/1}.sound-board__pad--2{grid-area:3/2}.sound-board__pad--3{grid-area:3/3}.sound-board__pad--enter{grid-area:3/4/span 2}.sound-board__pad--0{grid-area:4/1/auto/span 2}.sound-board__pad--dot{grid-area:4/3}.sound-board__stop{background:var(--sb-surface);border:2px solid var(--sb-border2);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border-radius:14px;grid-area:5/1/auto/span 4;justify-content:center;align-items:center;gap:10px;transition:background .15s,transform 70ms;display:flex;position:relative}.sound-board__stop:hover{background:#d94f3d1a}.sound-board__stop:active{transform:scale(.98)}.sound-board__stop--fire{animation:.14s ease-out sound-board-tap}@keyframes sound-board-tap{0%{transform:scale(.93)}60%{transform:scale(1.04)}to{transform:scale(1)}}.sound-board__stop-icon{display:flex}.sound-board__stop-label{letter-spacing:.12em;text-transform:uppercase;color:var(--sb-red);font-size:11px;font-weight:700}.sound-board__pad{background:var(--sb-surface);border:2px solid var(--sb-border);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:6px;width:100%;min-width:0;height:100%;min-height:0;padding:0;font-family:inherit;transition:background .15s,border-color .1s,box-shadow .1s,transform 70ms;display:flex;position:relative;overflow:hidden}.sound-board__pad:hover{background:var(--sb-surface2)}.sound-board__pad:active{transform:scale(.93)}.sound-board__pad--sel{border-color:var(--sb-text);background:var(--sb-surface2);box-shadow:inset 0 0 0 1px var(--sb-text)}.sound-board__pad--fire{animation:.14s ease-out sound-board-tap}.sound-board__pad--edit-mode:not(.sound-board__pad--sel){border-style:dashed;border-color:var(--sb-red);opacity:.9}.sound-board__pad--c-red{border-color:var(--sb-red);background:color-mix(in srgb, var(--sb-red) 10%, var(--sb-surface));color:var(--sb-red)}.sound-board__pad--c-green{border-color:var(--sb-green);background:color-mix(in srgb, var(--sb-green) 10%, var(--sb-surface));color:var(--sb-green)}.sound-board__pad--c-blue{border-color:var(--sb-blue);background:color-mix(in srgb, var(--sb-blue) 10%, var(--sb-surface));color:var(--sb-blue)}.sound-board__pad--c-yellow{border-color:var(--sb-yellow);background:color-mix(in srgb, var(--sb-yellow) 10%, var(--sb-surface));color:var(--sb-yellow)}.sound-board__pad--c-purple{border-color:var(--sb-purple);background:color-mix(in srgb, var(--sb-purple) 10%, var(--sb-surface));color:var(--sb-purple)}.sound-board__pad--c-pink{border-color:var(--sb-pink);background:color-mix(in srgb, var(--sb-pink) 10%, var(--sb-surface));color:var(--sb-pink)}.sound-board__pad--c-red:hover{background:color-mix(in srgb, var(--sb-red) 18%, var(--sb-surface))}.sound-board__pad--c-green:hover{background:color-mix(in srgb, var(--sb-green) 18%, var(--sb-surface))}.sound-board__pad--c-blue:hover{background:color-mix(in srgb, var(--sb-blue) 18%, var(--sb-surface))}.sound-board__pad--c-yellow:hover{background:color-mix(in srgb, var(--sb-yellow) 18%, var(--sb-surface))}.sound-board__pad--c-purple:hover{background:color-mix(in srgb, var(--sb-purple) 18%, var(--sb-surface))}.sound-board__pad--c-pink:hover{background:color-mix(in srgb, var(--sb-pink) 18%, var(--sb-surface))}.sound-board__pad--c-red.sound-board__pad--fire{background:color-mix(in srgb, var(--sb-red-fire) 22%, var(--sb-surface));border-color:var(--sb-red-fire);box-shadow:0 0 14px color-mix(in srgb, var(--sb-red-fire) 45%, transparent)}.sound-board__pad--c-green.sound-board__pad--fire{background:color-mix(in srgb, var(--sb-green-fire) 22%, var(--sb-surface));border-color:var(--sb-green-fire);box-shadow:0 0 14px color-mix(in srgb, var(--sb-green-fire) 45%, transparent)}.sound-board__pad--c-blue.sound-board__pad--fire{background:color-mix(in srgb, var(--sb-blue-fire) 22%, var(--sb-surface));border-color:var(--sb-blue-fire);box-shadow:0 0 14px color-mix(in srgb, var(--sb-blue-fire) 45%, transparent)}.sound-board__pad--c-yellow.sound-board__pad--fire{background:color-mix(in srgb, var(--sb-yellow-fire) 22%, var(--sb-surface));border-color:var(--sb-yellow-fire);box-shadow:0 0 14px color-mix(in srgb, var(--sb-yellow-fire) 45%, transparent)}.sound-board__pad--c-purple.sound-board__pad--fire{background:color-mix(in srgb, var(--sb-purple-fire) 22%, var(--sb-surface));border-color:var(--sb-purple-fire);box-shadow:0 0 14px color-mix(in srgb, var(--sb-purple-fire) 45%, transparent)}.sound-board__pad--c-pink.sound-board__pad--fire{background:color-mix(in srgb, var(--sb-pink-fire) 22%, var(--sb-surface));border-color:var(--sb-pink-fire);box-shadow:0 0 14px color-mix(in srgb, var(--sb-pink-fire) 45%, transparent)}.sound-board__pad-key{letter-spacing:.04em;color:var(--sb-text3);text-transform:uppercase;font-size:10px;font-weight:600;line-height:1;position:absolute;top:8px;left:10px}.sound-board__custom-dot{background:var(--sb-green);border-radius:50%;width:6px;height:6px;position:absolute;top:11px;right:11px}.sound-board__pad-icon-badge{background:#00000008;border-radius:7px;flex-shrink:0;justify-content:center;align-items:center;padding:4px;display:flex}.sound-board[data-sb-theme=dark] .sound-board__pad-icon-badge{background:#ffffff0a}.sound-board[data-sb-theme=dark] .sound-board__stop{background:var(--sb-surface);border-color:var(--sb-border2)}.sound-board[data-sb-theme=dark] .sound-board__stop:hover{background:color-mix(in srgb, var(--sb-red) 12%, var(--sb-surface))}.sound-board[data-sb-theme=dark] .sound-board__stop-label{color:var(--sb-red)}.sound-board[data-sb-theme=dark] .sound-board__status-pill{background:var(--sb-surface);border-color:var(--sb-border);color:var(--sb-text3)}.sound-board[data-sb-theme=dark] .sound-board__status-pill--active{background:color-mix(in srgb, var(--sb-green) 14%, var(--sb-surface));border-color:color-mix(in srgb, var(--sb-green) 32%, var(--sb-border));color:var(--sb-green)}.sound-board[data-sb-theme=dark] .sound-board__status-pill--stopped{background:color-mix(in srgb, var(--sb-red) 14%, var(--sb-surface));border-color:color-mix(in srgb, var(--sb-red) 24%, var(--sb-border));color:var(--sb-red)}.sound-board__pad-icon{font-size:24px;line-height:1}.sound-board__pad-icon-img{object-fit:cover;border-radius:50%;width:28px;height:28px;display:block}.sound-board__pad-label{letter-spacing:.04em;text-transform:uppercase;color:var(--sb-text2);text-align:center;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box;flex-shrink:0;width:100%;padding:0 6px;font-size:10px;font-weight:500;overflow:hidden}.sound-board__pad-wave{flex-shrink:0;justify-content:center;align-items:flex-end;gap:3px;height:14px;display:none}.sound-board__pad--fire .sound-board__pad-label{display:none}.sound-board__pad--fire .sound-board__pad-wave{display:flex}.sound-board__pad-wave span{background:currentColor;border-radius:2px;width:3px;height:3px}.sound-board__pad--fire .sound-board__pad-wave span:first-child{animation:.36s ease-in-out infinite alternate sound-board-waveform}.sound-board__pad--fire .sound-board__pad-wave span:nth-child(2){animation:.36s ease-in-out .13s infinite alternate sound-board-waveform}.sound-board__pad--fire .sound-board__pad-wave span:nth-child(3){animation:.36s ease-in-out 60ms infinite alternate sound-board-waveform}@keyframes sound-board-waveform{0%{height:3px}to{height:14px}}@media (prefers-reduced-motion:reduce){.sound-board__pad--fire,.sound-board__stop--fire{animation:none}.sound-board__pad--fire .sound-board__pad-wave span{height:8px;animation:none}}.sound-board__divider{background:var(--sb-border);width:100%;max-width:420px;height:1px;margin:0 auto 16px}.sound-board__controls-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;width:100%;max-width:420px;margin:0 auto;display:flex}.sound-board__controls-bar--end{justify-content:flex-end}.sound-board__btn{cursor:pointer;white-space:nowrap;border:1px solid;border-radius:8px;align-items:center;gap:6px;padding:8px 14px;font-family:inherit;font-size:12px;font-weight:500;line-height:1;transition:all .12s;display:inline-flex}.sound-board__btn--outline{border-color:var(--sb-border2);color:var(--sb-text2);background:0 0}.sound-board__btn--outline:hover{border-color:var(--sb-text);color:var(--sb-text);background:var(--sb-surface2)}.sound-board__btn--active{background:var(--sb-red);border-color:var(--sb-red);color:#fff}.sound-board__btn--active:hover{background:var(--sb-red-hover)}.sound-board__btn--solid{background:var(--sb-text);border-color:var(--sb-text);color:var(--sb-bg)}.sound-board__btn--solid:hover{opacity:.85}.sound-board__btn--solid:disabled{opacity:.4;cursor:not-allowed}.sound-board__btn--danger{background:var(--sb-red);border-color:var(--sb-red);color:#fff}.sound-board__btn--danger:hover{background:var(--sb-red-hover)}.sound-board__btn--danger-outline{border-color:var(--sb-red);color:var(--sb-red);background:0 0}.sound-board__btn--danger-outline:hover{background:#d94f3d14}.sound-board__btn--danger-outline:disabled{opacity:.3;cursor:not-allowed}.sound-board__settings-wrap{position:relative}.sound-board__settings-popover{background:var(--sb-surface);border:1px solid var(--sb-border);z-index:100;border-radius:12px;min-width:220px;padding:4px 0;position:absolute;bottom:calc(100% + 8px);right:0;box-shadow:0 4px 20px #00000024}.sound-board__settings-row{justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;display:flex}.sound-board__settings-row+.sound-board__settings-row{border-top:1px solid var(--sb-border)}.sound-board__settings-row--col{flex-direction:column;align-items:flex-start;gap:6px;padding-bottom:12px}.sound-board__settings-label{color:var(--sb-text);font-size:12px;font-weight:500}.sound-board__settings-sub{color:var(--sb-text3);margin-top:1px;font-size:10px}.sound-board__settings-vol-slider{width:80px}.sound-board__settings-section{border-top:1px solid var(--sb-border);padding:8px 0 4px}.sound-board__settings-section-label{letter-spacing:.08em;text-transform:uppercase;color:var(--sb-text3);padding:4px 14px 2px;font-size:10px;font-weight:600}.sound-board__settings-name-input{background:var(--sb-surface2);border:1px solid var(--sb-border);color:var(--sb-text);border-radius:6px;outline:none;width:100%;max-width:160px;padding:5px 9px;font-family:inherit;font-size:16px;font-weight:500;transition:border-color .15s}.sound-board__settings-name-input:focus{border-color:var(--sb-red)}input.sound-board__range{-webkit-appearance:none;background:var(--sb-border2);cursor:pointer;border-radius:1px;outline:none;width:80px;height:2px}input.sound-board__range::-webkit-slider-thumb{-webkit-appearance:none;background:var(--sb-text);border-radius:50%;width:12px;height:12px}.sound-board__toggle{cursor:pointer;flex-shrink:0;width:34px;height:18px;display:inline-block;position:relative}.sound-board__toggle input{opacity:0;width:0;height:0}.sound-board__toggle-track{background:var(--sb-border2);border-radius:9px;transition:background .2s;position:absolute;inset:0}.sound-board__toggle input:checked+.sound-board__toggle-track{background:var(--sb-green)}.sound-board__toggle-thumb{pointer-events:none;background:#fff;border-radius:50%;width:14px;height:14px;transition:transform .2s;position:absolute;top:2px;left:2px}.sound-board__toggle input:checked~.sound-board__toggle-thumb{transform:translate(16px)}.sound-board__seg-bar{gap:4px;display:flex}.sound-board__seg-btn{border:1px solid var(--sb-border);background:var(--sb-surface);color:var(--sb-text2);cursor:pointer;border-radius:7px;flex:1;padding:6px 0;font-family:inherit;font-size:12px;font-weight:600;transition:background .12s,color .12s,border-color .12s}.sound-board__seg-btn:hover{background:var(--sb-surface2);color:var(--sb-text)}.sound-board__seg-btn--active{background:var(--sb-red);border-color:var(--sb-red);color:#fff}.sound-board__color-row{gap:10px;display:flex}.sound-board__cdot{cursor:pointer;border:2px solid #0000;border-radius:50%;width:28px;height:28px;padding:0;transition:transform .1s,border-color .1s}.sound-board__cdot:hover{transform:scale(1.15)}.sound-board__cdot--sel{border-color:var(--sb-text)}.sound-board__cdot--d-red{background:var(--sb-red)}.sound-board__cdot--d-green{background:var(--sb-green)}.sound-board__cdot--d-blue{background:var(--sb-blue)}.sound-board__cdot--d-yellow{background:var(--sb-yellow)}.sound-board__cdot--d-purple{background:var(--sb-purple)}.sound-board__cdot--d-pink{background:var(--sb-pink)}.sound-board__ep-panel{background:var(--sb-surface);border-radius:20px;flex-direction:column;width:100%;max-width:560px;max-height:90vh;display:flex;overflow:hidden}.sound-board__ep-header{border-bottom:1px solid var(--sb-border);flex-shrink:0;justify-content:space-between;align-items:center;padding:18px 24px;display:flex}.sound-board__ep-header-preview{display:none}.sound-board__ep-title{color:var(--sb-text);font-size:14px;font-weight:600}.sound-board__ep-close{cursor:pointer;color:var(--sb-text3);background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;transition:color .15s,background .15s;display:flex}.sound-board__ep-close:hover{color:var(--sb-text);background:var(--sb-surface2)}.sound-board__ep-body{flex:1;min-height:0;display:flex;overflow:hidden}.sound-board__ep-preview{border-right:1px solid var(--sb-border);background:var(--sb-surface2);flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:10px;width:148px;padding:24px 16px;display:flex}.sound-board__ep-preview-pad{border:2px solid;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:96px;height:96px;transition:background .15s,border-color .15s;display:flex;position:relative}.sound-board__ep-preview-pad--c-red{border-color:var(--sb-red);background:color-mix(in srgb, var(--sb-red) 12%, var(--sb-bg))}.sound-board__ep-preview-pad--c-green{border-color:var(--sb-green);background:color-mix(in srgb, var(--sb-green) 12%, var(--sb-bg))}.sound-board__ep-preview-pad--c-blue{border-color:var(--sb-blue);background:color-mix(in srgb, var(--sb-blue) 12%, var(--sb-bg))}.sound-board__ep-preview-pad--c-yellow{border-color:var(--sb-yellow);background:color-mix(in srgb, var(--sb-yellow) 12%, var(--sb-bg))}.sound-board__ep-preview-pad--c-purple{border-color:var(--sb-purple);background:color-mix(in srgb, var(--sb-purple) 12%, var(--sb-bg))}.sound-board__ep-preview-pad--c-pink{border-color:var(--sb-pink);background:color-mix(in srgb, var(--sb-pink) 12%, var(--sb-bg))}.sound-board__ep-preview-icon{font-size:30px;line-height:1}.sound-board__ep-preview-img{object-fit:cover;border-radius:50%;width:48px;height:48px}.sound-board__ep-preview-label{letter-spacing:.1em;text-transform:uppercase;color:var(--sb-text);text-align:center;text-overflow:ellipsis;white-space:nowrap;max-width:76px;font-size:9px;font-weight:700;overflow:hidden}.sound-board__ep-preview-hint{color:var(--sb-text3);text-align:center;margin:0;font-size:10px}.sound-board__ep-controls{flex-direction:column;flex:1;gap:14px;min-width:0;padding:16px 20px 20px;display:flex;overflow-y:auto}.sound-board__ep-group{flex-direction:column;gap:6px;display:flex}.sound-board__ep-label{letter-spacing:.1em;text-transform:uppercase;color:var(--sb-text2);font-size:10px;font-weight:700}.sound-board__ep-label-cap{text-transform:none;letter-spacing:0;color:var(--sb-text3);font-size:10px;font-weight:400}.sound-board__ep-card{background:var(--sb-surface2);border:1px solid var(--sb-border);border-radius:12px;flex-direction:column;gap:10px;padding:12px 14px;display:flex}.sound-board__ep-card input[type=text],.sound-board__ep-card select{background:var(--sb-bg);border:1px solid var(--sb-border);width:100%;color:var(--sb-text);border-radius:7px;outline:none;padding:7px 10px;font-family:inherit;font-size:16px}.sound-board__ep-card input[type=text]:focus,.sound-board__ep-card select:focus{border-color:var(--sb-border2)}.sound-board__ep-sub-group{border-top:1px solid var(--sb-border);flex-direction:column;gap:5px;margin-top:2px;padding-top:10px;display:flex}.sound-board__ep-sub-label{letter-spacing:.08em;text-transform:uppercase;color:var(--sb-text3);font-size:10px;font-weight:600}.sound-board__ep-footer{border-top:1px solid var(--sb-border);flex-shrink:0;justify-content:space-between;align-items:center;gap:8px;padding:14px 20px;display:flex}.sound-board__ep-footer-right{gap:8px;display:flex}.sound-board__ep-reset-options{flex-wrap:wrap;align-items:center;gap:6px;width:100%;display:flex}.sound-board__ep-reset-opt{flex:1;justify-content:center;min-width:0;padding:6px 10px;font-size:12px}.sound-board__ep-reset-opt-cancel{padding:6px 10px;font-size:12px}@media (max-width:767.98px){.sound-board__ep-panel{border-radius:20px 20px 0 0;max-width:100%;height:96svh;max-height:92svh}.sound-board__ep-body{flex-direction:column;overflow:hidden}.sound-board__ep-preview{display:none}.sound-board__ep-header{grid-template-columns:1fr auto 1fr;align-items:center;padding:10px 16px;display:grid}.sound-board__ep-close{justify-self:end}.sound-board__ep-header-preview{justify-self:center;align-items:center;gap:10px;display:flex}.sound-board__ep-header-preview .sound-board__ep-preview-pad{border-radius:14px;width:86px;height:86px}.sound-board__ep-header-preview .sound-board__ep-preview-icon{font-size:27px}.sound-board__ep-controls{padding:14px 16px 16px}.sound-board__ep-footer{padding-bottom:max(14px, env(safe-area-inset-bottom))}}.sound-board__drop-zone{border:1px dashed var(--sb-border2);cursor:pointer;background:var(--sb-bg);border-radius:10px;flex:1;align-items:center;gap:12px;width:100%;min-width:0;padding:14px 18px;transition:border-color .15s,background .15s;display:flex;position:relative}.sound-board__drop-zone:hover,.sound-board__drop-zone--over{border-color:var(--sb-text);background:var(--sb-surface2)}.sound-board__drop-zone input[type=file]{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.sound-board__dz-text{color:var(--sb-text2);font-size:12px;line-height:1.5}.sound-board__dz-text strong{color:var(--sb-text);font-weight:500}.sound-board__dz-text small{color:var(--sb-text3);font-size:11px;display:block}.sound-board__dz-error{color:var(--sb-red);margin:6px 0 0;font-size:11px;font-weight:600}.sound-board__emoji-picker-wrap{position:relative}.sound-board__ep-emoji-row{align-items:center;gap:8px;display:flex}.sound-board__ep-emoji-hint{color:var(--sb-text3);font-size:11px}.sound-board__emoji-trigger{background:var(--sb-bg);border:1px solid var(--sb-border);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;width:44px;height:38px;font-size:20px;line-height:1;transition:border-color .15s,background .15s;display:flex}.sound-board__emoji-trigger:hover{background:var(--sb-surface2);border-color:var(--sb-border2)}.sound-board__emoji-popover{z-index:200;border-radius:12px;position:absolute;top:calc(100% + 8px);left:0;overflow:hidden;box-shadow:0 8px 32px #00000029}.sound-board__icp-file-zone{border:1.5px dashed var(--sb-border2);cursor:pointer;background:var(--sb-bg);text-align:center;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:100%;padding:18px 12px;transition:border-color .15s,background .15s;display:flex}.sound-board__icp-file-zone:hover{border-color:var(--sb-red);background:var(--sb-surface2)}.sound-board__icp-file-icon{display:flex}.sound-board__icp-file-text{color:var(--sb-text);font-size:13px;font-weight:600}.sound-board__icp-file-sub{color:var(--sb-text3);font-size:11px}.sound-board__icp-preview-wrap{align-items:center;gap:12px;padding:8px 0;display:flex}.sound-board__icp-preview-img{object-fit:cover;border:2px solid var(--sb-border);border-radius:50%;width:52px;height:52px}.sound-board__icp-change-btn{padding:5px 12px;font-size:12px}.sound-board__icp-demo-locked{border:1px dashed var(--sb-border2);text-align:center;background:var(--sb-bg);border-radius:10px;flex-direction:column;align-items:center;gap:6px;padding:14px 12px;display:flex}.sound-board__icp-lock-text{color:var(--sb-text2);font-size:12px}.sound-board__icp-lock-cta{color:var(--sb-red);font-size:12px;font-weight:700;text-decoration:none}.sound-board__icp-lock-cta:hover{text-decoration:underline}.sound-board__crop-panel{background:var(--sb-surface);border-radius:20px;flex-direction:column;gap:14px;width:100%;max-width:480px;padding:20px;display:flex}.sound-board__crop-title{color:var(--sb-text);font-size:15px;font-weight:700}.sound-board__crop-box{aspect-ratio:1;background:var(--sb-bg);border-radius:14px;width:100%;position:relative;overflow:hidden}.sound-board__crop-zoom-slider{width:100%}.sound-board__crop-actions{justify-content:flex-end;gap:8px;display:flex}.sound-board__crop-error{color:var(--sb-red);margin:0;font-size:12px}.sound-board__confirm-panel{background:var(--sb-surface);border-radius:14px;width:100%;max-width:360px;padding:28px}.sound-board__confirm-title{color:var(--sb-text);margin-bottom:8px;font-size:15px;font-weight:600}.sound-board__confirm-body{color:var(--sb-text2);text-wrap:pretty;margin-bottom:22px;font-size:13px;line-height:1.55}.sound-board__confirm-actions{justify-content:flex-end;gap:8px;display:flex}.sound-board__demo-cta-banner{border:1px solid var(--sb-border);background:#00000008;border-radius:12px;flex-direction:column;align-items:flex-start;gap:10px;width:100%;max-width:420px;margin:12px auto 0;padding:14px 18px;display:flex}.sound-board__demo-cta-text{flex-direction:column;flex:1;gap:6px;min-width:0;display:flex}.sound-board__demo-cta-heading{color:var(--sb-red);letter-spacing:.01em;font-size:13px;font-weight:700}.sound-board__demo-cta-heading--badge{font-size:11px}.sound-board__demo-cta-subhead{color:var(--sb-text2);font-size:12px;font-weight:500}.sound-board__demo-cta-benefits{color:var(--sb-text2);grid-template-columns:1fr 1fr;gap:2px 12px;font-size:11px;font-weight:500;display:grid}.sound-board__demo-banner-link{color:#fff;background:var(--sb-red);white-space:nowrap;border-radius:8px;flex-shrink:0;align-self:flex-end;align-items:center;gap:4px;padding:7px 14px;font-size:12px;font-weight:600;text-decoration:none;transition:background .15s;display:inline-flex}.sound-board__demo-banner-link:hover{background:var(--sb-red-hover)}.sound-board__ep-demo-note{border:1px solid var(--sb-border);color:var(--sb-text2);background:#00000008;border-radius:8px;flex-direction:column;gap:4px;padding:10px 12px;font-size:12px;line-height:1.55;display:flex}.sound-board__ep-demo-note-heading{color:var(--sb-red);font-size:12px;font-weight:700}.sound-board__demo-tooltip{background:var(--sb-green);color:#fff;z-index:200;pointer-events:all;border-radius:12px;width:200px;padding:14px 36px 14px 14px;position:absolute;top:calc(100% + 10px);left:0;box-shadow:0 8px 28px #00000059}.sound-board__demo-tooltip-title{color:#fff;margin:0;font-size:13px;font-weight:700;line-height:1.4}.sound-board__demo-tooltip-divider{border:none;border-top:1px solid #ffffff4d;margin:8px 0}.sound-board__demo-tooltip-text{color:#fff;margin:0;font-size:13px;font-weight:500;line-height:1.55}.sound-board__demo-tooltip-close{color:#ffffffb3;cursor:pointer;background:0 0;border:none;margin:-6px;padding:6px;font-size:16px;line-height:1;position:absolute;top:8px;right:10px}.sound-board__demo-tooltip-close:hover{color:#fff}.sound-board__shared-meta{flex-wrap:wrap;align-items:baseline;gap:8px;min-width:0;display:flex}.sound-board__shared-owner-inline{color:var(--sb-text3);white-space:nowrap;font-size:11px;font-weight:500}.sound-board__shared-locked-hint{background:var(--sb-surface);border:1px solid var(--sb-border);white-space:nowrap;z-index:200;color:var(--sb-red);border-radius:8px;padding:8px 12px;font-size:12px;font-weight:600;position:absolute;bottom:calc(100% + 8px);left:0;box-shadow:0 4px 16px #00000029}.sound-board__center-box{text-align:center;flex-direction:column;align-items:center;gap:14px;padding:60px 20px;display:flex}.sound-board__missing-title{color:var(--sb-text);margin:0;font-size:20px;font-weight:700}.sound-board__muted{color:var(--sb-text3);text-wrap:pretty;max-width:320px;margin:0;font-size:13px;line-height:1.5}.sound-board__cta{color:#fff;background:var(--sb-red);cursor:pointer;border:none;border-radius:10px;align-items:center;gap:4px;margin-top:8px;padding:10px 22px;font-size:14px;font-weight:600;text-decoration:none;transition:background .15s;display:inline-flex}.sound-board__cta:hover{background:var(--sb-red-hover)}@media (max-width:767.98px){.sound-board{--sb-gap:6px}.sound-board__page{padding:16px 20px 48px}.sound-board__top{margin-bottom:16px}.sound-board__numpad{grid-template-rows:repeat(4,calc(25dvw - 14.5px)) 48px;max-width:100%}.sound-board__title,.sound-board__top,.sound-board__status-bar,.sound-board__controls-bar,.sound-board__divider{max-width:100%}.sound-board__pad-icon{font-size:20px}.sound-board__pad-label{font-size:9px}}@media (max-width:767.98px) and (max-height:500px) and (orientation:landscape){.sound-board__numpad{grid-template-rows:repeat(4,54px) 40px;gap:5px;max-width:340px;margin-bottom:10px}.sound-board__top,.sound-board__status-bar,.sound-board__controls-bar,.sound-board__divider{max-width:340px}.sound-board__pad-icon{font-size:16px}.sound-board__pad-label{font-size:7px}.sound-board__page{padding:12px 16px 24px}}