/* Lovense uses the shared Effects shell, header and pill measurements. */
.game-settings-card #otlGamePremiumGrid .lovense-setting {
  --otl-feature-rgb: 244, 114, 182;
  --otl-feature-secondary-rgb: 251, 113, 133;
  --otl-ui-rgb: var(--otl-feature-rgb);
  --premium-setting-rgb: var(--otl-feature-rgb);
  --premium-setting-accent: #f472b6;
}
.lovense-setting [hidden] { display: none !important; }
.lovense-setting .otl-lovense-icon { width: 20px; height: 20px; flex: 0 0 20px; border-radius: 4px; background: url('/assets/icons/settings/lovense.svg') center / contain no-repeat; }
.lovense-setting .otl-lovense-content { margin-top: 8px; }
.lovense-setting.otl-lovense-off .otl-lovense-content { opacity: .45; }
.lovense-setting .otl-lovense-status { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 8px; color: #94a3b8; font-size: .8rem; }
.lovense-setting .otl-lovense-connection { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.lovense-setting .otl-lovense-connection label { width: min(100%, 320px); min-width: 0; }
.lovense-setting .otl-lovense-grid { --otl-lovense-columns: 100px minmax(100px, .7fr) minmax(160px, 1.7fr) minmax(140px, 1fr) 90px 56px; }
.lovense-setting :is(.otl-lovense-columns, .otl-lovense-light) { display: grid; grid-template-columns: var(--otl-lovense-columns); gap: 16px; align-items: center; }
.lovense-setting .otl-lovense-columns { padding: 0 0 8px; color: #94a3b8; font-size: .75rem; }
.lovense-setting .otl-lovense-light { min-width: 0; padding: 12px 0; border-top: 1px solid rgba(100,116,139,.20); }
.lovense-setting .otl-lovense-light-title { font-size: .85rem; }
.lovense-setting [data-lovense-light=green] .otl-lovense-light-title { color: #4ade80; }
.lovense-setting [data-lovense-light=yellow] .otl-lovense-light-title { color: #facc15; }
.lovense-setting [data-lovense-light=red] .otl-lovense-light-title { color: #f87171; }
.lovense-setting :is(.otl-lovense-mode, .otl-lovense-strength, .otl-lovense-pattern-slot, .otl-lovense-speed-slot) { min-width: 0; }
.lovense-setting :is([data-pattern-placeholder], [data-speed-placeholder]) { color: #64748b; }
.lovense-setting .otl-lovense-inactive .otl-lovense-strength { opacity: .45; }
.lovense-setting :is(.otl-lovense-sr-only, .otl-lovense-mobile-label) { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.lovense-setting label { display: grid; gap: 6px; margin: 0; font-size: .8rem; color: #cbd5e1; }
.lovense-setting select { width: 100%; min-width: 0; min-height: 34px; padding: 6px 9px; border: 1px solid #2b374a; border-radius: 8px; background: #101827; color: #e2e8f0; font: inherit; }
.lovense-setting .otl-lovense-parameter { display: grid; grid-template-columns: minmax(0,1fr) 42px; align-items: center; gap: 6px; margin: 0; font-size: .8rem; }
.game-settings-card #otlGamePremiumGrid .lovense-setting output { color: #f9a8d4; font-variant-numeric: tabular-nums; grid-column: 2; grid-row: 1; }
.lovense-setting input[type=range] { grid-column: 1; grid-row: 1; width: 100%; height: 22px; padding: 0; margin: 0; --otl-range-rgb: var(--otl-feature-rgb); accent-color: #f472b6; }
.game-settings-card #otlGamePremiumGrid .lovense-setting input[type=checkbox] { accent-color: #f472b6; }
.game-settings-card #otlGamePremiumGrid .lovense-setting button { color: #fbcfe8; border-color: rgba(var(--otl-feature-rgb), .3); background: rgba(var(--otl-feature-rgb), .08); }
.lovense-setting :is(button,select,input):focus-visible { outline: 2px solid #f472b6; outline-offset: 3px; }
.game-settings-card #otlGamePremiumGrid .lovense-setting :is([data-lovense-stop], .otl-lovense-test-stop) { background: rgba(239,68,68,.15); border-color: #ef4444; color: #fecaca; }
.lovense-setting .otl-lovense-help { font-size: .78rem; color: #94a3b8; margin: 4px 0 0; }
.lovense-setting .otl-lovense-pair-dialog { box-sizing: border-box; width: min(380px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: auto; padding: 24px; border: 1px solid #334155; border-radius: 20px; background: #0f172a; color: #f1f5f9; box-shadow: 0 24px 80px rgba(0,0,0,.5); }
.lovense-setting .otl-lovense-pair-dialog::backdrop { background: rgba(2,6,23,.78); backdrop-filter: blur(6px); }
.lovense-setting .otl-lovense-pair-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.lovense-setting .otl-lovense-pair-heading h2 { margin: 0; font-size: 1.2rem; line-height: 1.3; }
.lovense-setting .otl-lovense-pair-heading button { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; padding: 0; border: 1px solid #334155; border-radius: 10px; background: #111827; color: #cbd5e1; font-size: 1.5rem; line-height: 1; }
.lovense-setting [data-lovense-pair-message] { margin: 16px 0 0; color: #94a3b8; font-size: .9rem; line-height: 1.5; }
.lovense-setting .otl-lovense-qr { box-sizing: border-box; display: block; width: min(240px, 100%); aspect-ratio: 1; object-fit: contain; margin: 20px auto 0; padding: 12px; border-radius: 12px; background: white; }
@media(max-width: 680px) { .lovense-setting .otl-lovense-content { margin-top: 14px; } }
.game-settings-card #otlGamePremiumGrid .lovense-setting .otl-lovense-secondary { border-color: transparent; background: transparent; color: #94a3b8; }
.lovense-setting .otl-lovense-light > [data-test] { grid-column: 6; grid-row: 1; }
.lovense-setting .otl-lovense-pattern-extra { grid-column: 2 / -1; display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px 16px; align-items: center; }
.lovense-setting .otl-lovense-preview { width: min(100%, 240px); min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.lovense-setting .otl-lovense-preview svg { width: 100%; height: 26px; display: block; color: #f9a8d4; }
.lovense-setting .otl-lovense-preview-playhead { opacity: .45; animation: otl-lovense-preview 8s linear infinite; }
.lovense-setting.otl-lovense-off .otl-lovense-preview-playhead { animation-play-state: paused; }
@keyframes otl-lovense-preview { to { transform: translateX(200px); } }
@media(prefers-reduced-motion: reduce) { .lovense-setting .otl-lovense-preview-playhead { animation: none; display: none; } }
.lovense-setting [data-random-pool] { grid-column: 1 / -1; font-size: .78rem; color: #94a3b8; }
.lovense-setting [data-random-pool] summary { cursor: pointer; width: fit-content; padding: 5px 0; }
.lovense-setting [data-random-pool] summary:focus-visible { outline: 2px solid #f472b6; outline-offset: 3px; }
.lovense-setting .otl-lovense-pool { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; border: 0; padding: 8px 0; margin: 0; min-width: 0; }
.lovense-setting .otl-lovense-pool label { display: flex; align-items: center; gap: 6px; font-size: .75rem; }
.lovense-setting .otl-lovense-pool input { flex: 0 0 auto; }
@media(max-width: 900px) {
 .lovense-setting .otl-lovense-columns { display: none; }
 .lovense-setting .otl-lovense-light { grid-template-columns: minmax(0,1fr) 56px; gap: 12px; padding: 14px 0; }
 .lovense-setting :is(.otl-lovense-light-title, .otl-lovense-mode, .otl-lovense-strength) { grid-column: 1 / -1; }
 .lovense-setting .otl-lovense-pattern-slot { grid-column: 1 / -1; grid-row: 4; }
 .lovense-setting .otl-lovense-speed-slot { grid-column: 1; grid-row: 5; }
 .lovense-setting .otl-lovense-light > [data-test] { grid-column: 2; grid-row: 4; align-self: end; }
 .lovense-setting .otl-lovense-pattern-mode > [data-test] { grid-row: 5; }
 .lovense-setting .otl-lovense-light:not(.otl-lovense-pattern-mode) :is(.otl-lovense-pattern-slot,.otl-lovense-speed-slot) { display: none; }
 .lovense-setting .otl-lovense-pattern-extra { grid-column: 1 / -1; grid-row: 6; grid-template-columns: 1fr; }
 .lovense-setting .otl-lovense-preview { width: 100%; }
 .lovense-setting .otl-lovense-pool { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .lovense-setting :is([data-pattern-placeholder], [data-speed-placeholder]) { display: none; }
 .lovense-setting .otl-lovense-mobile-label { position: static; width: auto; height: auto; overflow: visible; clip-path: none; white-space: normal; }
 .lovense-setting .otl-lovense-strength .otl-lovense-mobile-label { grid-column: 1 / -1; grid-row: 1; }
 .lovense-setting .otl-lovense-strength input[type=range] { grid-row: 2; }
 .game-settings-card #otlGamePremiumGrid .lovense-setting .otl-lovense-strength output { grid-row: 2; }
 .lovense-setting .otl-lovense-connection { flex-wrap: wrap; }
 .lovense-setting .otl-lovense-connection label { flex: 1; width: auto; }
}
