/*!*********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!../sikhi-ui-library/packages/core/dist/styles.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************/
:root{--sui-colors-success: #22c55e;--sui-colors-error: #C21717;--sui-colors-warning: #f59e0b;--sui-colors-amber: #F99D1B;--sui-shadows-none: none;--sui-shadows-xs: 0px 4px 4px 0px #00000008;--sui-shadows-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);--sui-shadows-md: 0 4px 6px -1px rgb(0 0 0 / 0.1);--sui-shadows-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1);--sui-shadows-xl: 15px 15px 45px 0px #11397926;--sui-radii-none: 0px;--sui-radii-sm: 5px;--sui-radii-md: 10px;--sui-radii-lg: 15px;--sui-radii-xl: 20px;--sui-radii-2xl: 25px;--sui-radii-3xl: 30px;--sui-radii-4xl: 35px;--sui-radii-5xl: 40px;--sui-radii-6xl: 45px;--sui-radii-full: 9999px;--sui-spacing-0: 0px;--sui-spacing-1: 6px;--sui-spacing-2: 12px;--sui-spacing-3: 18px;--sui-spacing-4: 24px;--sui-spacing-5: 30px;--sui-spacing-6: 36px;--sui-spacing-8: 48px;--sui-spacing-10: 60px;--sui-spacing-12: 72px;--sui-transitions-duration-instant: 50ms;--sui-transitions-duration-fast: 100ms;--sui-transitions-duration-normal: 200ms;--sui-transitions-duration-slow: 300ms;--sui-transitions-duration-slower: 550ms;--sui-transitions-duration-slowest: 700ms;--sui-transitions-timing-ease: cubic-bezier(0.4, 0, 0.2, 1);--sui-typography-fonts-primary: 'Baloo Paaji 2', sans-serif;--sui-typography-font-sizes-xs: 12px;--sui-typography-font-sizes-sm: 14px;--sui-typography-font-sizes-base: 16px;--sui-typography-font-sizes-lg: 18px;--sui-typography-font-sizes-xl: 24px;--sui-typography-font-sizes-2xl: 36px;--sui-typography-font-sizes-3xl: 48px;--sui-typography-font-sizes-4xl: 60px;--sui-typography-font-sizes-5xl: 72px;--sui-typography-font-weights-normal: 400;--sui-typography-font-weights-medium: 500;--sui-typography-font-weights-semibold: 600;--sui-typography-font-weights-bold: 700;--sui-typography-font-weights-extrabold: 800;--sui-typography-line-heights-xs: 12px;--sui-typography-line-heights-sm: 18px;--sui-typography-line-heights-base: 24px;--sui-typography-line-heights-lg: 36px;--sui-typography-line-heights-xl: 48px;--sui-typography-line-heights-2xl: 64px;--sui-semantic-background-page: #ffffff;--sui-semantic-background-surface: #f8fafc;--sui-semantic-background-surface-alt: #fafafa;--sui-semantic-background-glass: linear-gradient(93.99deg, rgba(239, 242, 247, 0.8) 1.86%, rgba(247, 243, 239, 0.8) 100%);--sui-semantic-background-overlay: #0f172a;--sui-semantic-foreground-default: #0f172a;--sui-semantic-foreground-muted: #475569;--sui-semantic-foreground-subtle: #94a3b8;--sui-semantic-foreground-disabled: #888888;--sui-semantic-foreground-secondary: #222222;--sui-semantic-foreground-tertiary: #333333;--sui-semantic-foreground-placeholder: #999999;--sui-semantic-border-default: #e2e8f0;--sui-semantic-border-muted: #eeeeee;--sui-semantic-border-focus: #113979;--sui-semantic-accent-default: #113979;--sui-semantic-accent-hover: #0e2f63;--sui-semantic-accent-active: #0a244d;--sui-semantic-accent-muted: #e3e7ed;--sui-semantic-shadow-color: #0f172a;--sui-atom-button-default-background: #113979;--sui-atom-button-default-background-hover: #0e2f63;--sui-atom-button-default-background-active: #0a244d;--sui-atom-button-default-text: #ffffff;--sui-atom-button-secondary-background: #e3e7ed;--sui-atom-button-secondary-background-hover: #d6dbe3;--sui-atom-button-secondary-text: #0f172a;--sui-atom-button-muted-background: #e3e7ed;--sui-atom-button-muted-background-hover: #d6dbe3;--sui-atom-button-muted-text: #113979;--sui-atom-button-dashed-background: transparent;--sui-atom-button-dashed-border: #999999;--sui-atom-button-dashed-border-hover: #113979;--sui-atom-button-dashed-text: #999999;--sui-atom-button-dashed-text-hover: #113979;--sui-atom-button-destructive-background: #C21717;--sui-atom-button-destructive-background-hover: #dc2626;--sui-atom-button-destructive-text: #ffffff;--sui-atom-button-outline-background: transparent;--sui-atom-button-outline-background-hover: #f8fafc;--sui-atom-button-outline-border: #cbd5e1;--sui-atom-button-outline-text: #0f172a;--sui-atom-button-ghost-background: transparent;--sui-atom-button-ghost-background-hover: #e2e8f0;--sui-atom-button-ghost-text: #0f172a;--sui-atom-button-link-background: transparent;--sui-atom-button-link-background-hover: #1139790D;--sui-atom-button-link-text: #113979;--sui-atom-button-link-text-hover: #0e2f63;--sui-atom-button-light-background: #fafafa;--sui-atom-button-light-background-hover: #f0f0f0;--sui-atom-button-light-border: #eeeeee;--sui-atom-button-light-text: #113979;--sui-atom-button-warning-background: linear-gradient(98.49deg, #EC9A33 3.77%, #DC991D 100%);--sui-atom-button-warning-background-hover: linear-gradient(98.49deg, #D88A2A 3.77%, #C8891A 100%);--sui-atom-button-warning-text: #ffffff;--sui-atom-button-amber-background: #F99D1B38;--sui-atom-button-amber-background-hover: #F99D1B52;--sui-atom-button-amber-text: #113979;--sui-atom-button-cloudy-background: #FFFFFF80;--sui-atom-button-cloudy-background-hover: #FFFFFFB3;--sui-atom-button-cloudy-text: #113979;--sui-atom-button-frost-background: #E3E7ED80;--sui-atom-button-frost-background-hover: #E3E7EDB3;--sui-atom-button-frost-background-active: #E3E7EDD9;--sui-atom-button-frost-border: #eeeeee;--sui-atom-button-frost-border-hover: #e2e8f0;--sui-atom-button-frost-text: #113979;--sui-atom-button-plain-background: transparent;--sui-atom-button-plain-background-hover: #0000000D;--sui-atom-button-plain-text: inherit;--sui-atom-button-gradient-background: linear-gradient(85.81deg, #F7F3EF 3.51%, #EFF2F7 91.87%);--sui-atom-button-gradient-background-hover: linear-gradient(85.81deg, #EFE9E3 3.51%, #E5EAF3 91.87%);--sui-atom-button-gradient-border: #eeeeee;--sui-atom-button-gradient-text: #113979;--sui-atom-button-bordered-background: #FFFFFF;--sui-atom-button-bordered-background-hover: #F8FAFC;--sui-atom-button-bordered-border: #E4E6EC;--sui-atom-button-bordered-text: #666666;--sui-atom-button-card-background: linear-gradient(111.82deg, #FAFAFA 2.83%, rgba(234, 242, 255, 0.5) 100%);--sui-atom-button-card-background-hover: linear-gradient(111.82deg, #F0F0F0 2.83%, rgba(220, 232, 255, 0.6) 100%);--sui-atom-button-card-text: #113979;--sui-atom-button-card-shadow: 0 4px 12px rgba(17, 57, 121, 0.15);--sui-atom-primary-input-background: #FFFFFF80;--sui-atom-primary-input-border: #1139791A;--sui-atom-primary-input-border-focus: #113979;--sui-atom-primary-input-text: #0f172a;--sui-atom-primary-input-placeholder: #999999;--sui-atom-keyboard-background: #fafafa;--sui-atom-keyboard-border: #eeeeee;--sui-atom-keyboard-key-background: #ffffff;--sui-atom-keyboard-key-text: #0f172a;--sui-atom-box-gradient-background: linear-gradient(91.66deg, #E8EBF1 0%, #E3E7ED 100%);--sui-atom-box-gradient-shadow: 15px 15px 45px 0px #1139791A;--sui-atom-box-dashed-background: #fafafa;--sui-atom-box-dashed-border: #eeeeee;--sui-atom-box-solid-background: #eff2f7;--sui-atom-box-solid-border: #eeeeee;--sui-atom-box-blur-background: #7A94BE4D;--sui-atom-box-blur-border: #EFF2F7;--sui-atom-box-warm-background: linear-gradient(94.76deg, #FAFAFA 0%, #F6E6D3 99.26%);--sui-atom-box-cool-background: linear-gradient(90deg, #F6E9D7 0%, #E3E7ED 100%);--sui-atom-box-frost-background: #E3E7ED80;--sui-atom-box-mist-background: #FFFFFFCC;--sui-atom-box-mist-border: #eeeeee;--sui-atom-gurbani-verse-bani-color: #113979;--sui-atom-gurbani-verse-translation-color: #888888;--sui-atom-gurbani-verse-active-background: linear-gradient(90deg, #D8E7FF 0%, #F2F4F8 100%);--sui-atom-gurbani-verse-active-border: #D28423;--sui-atom-shabad-card-source-color: #EC9A33;--sui-atom-shabad-card-source-color-dgs: #3333EC;--sui-atom-shabad-card-source-color-bgv: #418836;--sui-atom-action-bar-background: #7A94BE4D;--sui-atom-action-bar-border: #EFF2F7;--sui-atom-action-bar-divider: rgba(0, 0, 0, 0.05);--sui-atom-action-bar-icon-color: #113979;--sui-atom-shortcut-tray-title: #666666;--sui-atom-shortcut-tray-icon-color: #113979;--sui-atom-labeled-button-title: #666666;--sui-atom-side-labeled-button-label: #475569;--sui-atom-side-labeled-button-text-label: #666666;--sui-atom-side-labeled-button-filled-label: #113979;--sui-atom-side-labeled-button-background: #E3E7ED;--sui-atom-search-bar-input-background: #FFFFFF80;--sui-atom-search-bar-input-border: #1139791A;--sui-atom-search-bar-icon: #666666;--sui-atom-sidebar-background: #E3E7ED;--sui-atom-sidebar-item-text: #666666;--sui-atom-sidebar-item-hover-background: #00000014;--sui-atom-sidebar-item-active-background: #0000000D;--sui-atom-fateh-tabs-text: #666666;--sui-atom-select-background: #1139791A;--sui-atom-select-text: #113979;--sui-atom-select-icon: #113979;--sui-atom-select-border: transparent;--sui-atom-select-border-focus: #113979;--sui-atom-select-focus-ring: #11397926;--sui-atom-select-error-focus-ring: #EF444426;--sui-atom-select-bordered-background: #FFFFFF;--sui-atom-select-bordered-border: #E4E6EC;--sui-atom-select-bordered-text: #666666;--sui-atom-autocomplete-background: #F1F3F6;--sui-atom-autocomplete-border: #1139791A;--sui-atom-autocomplete-item-hover-background: #e3e7ed;--sui-atom-navbar-background: #113979;--sui-atom-navbar-item-background: #0000001A;--sui-atom-navbar-item-border: #16448D;--sui-atom-navbar-item-icon: #ffffff;--sui-atom-navbar-item-hover-background: #1a4a8f;--sui-atom-indicator-green: #26901c;--sui-atom-indicator-red: #c21717;--sui-atom-indicator-yellow: #f59e0b;--sui-atom-logo-primary: #113979;--sui-atom-table-header-background: linear-gradient(93.99deg, #EFF2F7 1.86%, #F7F3EF 100%);--sui-atom-progress-bar-track: #0000001A;--sui-atom-progress-bar-fill: #113979;--sui-atom-progress-bar-knob-background: #FFFFFF;--sui-atom-progress-bar-knob-border: #EEEEEE;--sui-atom-progress-bar-knob-shadow: 0px 0px 4px 0px #1139791A;--sui-atom-range-track: #CFD0D2;--sui-atom-range-tick: #CFD0D2;--sui-atom-range-knob-background: #1A3A6D;--sui-atom-range-knob-border: #FFFFFF;--sui-atom-checkbox-background: #FFFFFF;--sui-atom-checkbox-border: #E4E6EC;--sui-atom-checkbox-checked-background: #113979;--sui-atom-checkbox-check-icon: #FFFFFF;--sui-atom-checkbox-label: #666666;--sui-atom-checkbox-label-checked: #113979;--sui-atom-toggle-track: #FFFFFF;--sui-atom-toggle-border: #0000000D;--sui-atom-toggle-handle-off: #999999;--sui-atom-toggle-handle-on: #113979;--sui-atom-toggle-label: #666666;--sui-atom-toggle-label-checked: #113979}:root{color-scheme:light}.dark{color-scheme:dark}.dark option{background-color:var(--sui-semantic-background-surface);color:var(--sui-semantic-foreground-default)}.sui-action-bar{display:flex;flex-direction:column;align-items:center;padding:6px 0;width:48px;border-radius:var(--sui-radii-full)}.sui-action-bar svg{color:var(--sui-atom-action-bar-icon-color)}.sui-action-bar>*:not(:last-child){border-bottom:1px solid var(--sui-atom-action-bar-divider)}.sui-box--gradient{background:var(--sui-atom-box-gradient-background);box-shadow:var(--sui-atom-box-gradient-shadow)}.sui-box--dashed{position:relative;isolation:isolate}.sui-box--dashed::before{content:"";position:absolute;inset:0;border-radius:inherit;background-color:color-mix(in srgb, var(--sui-atom-box-dashed-background) 90%, transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:-1;pointer-events:none}.sui-box__dashed-border{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.sui-box--solid{background-color:var(--sui-atom-box-solid-background);border:1px solid var(--sui-atom-box-solid-border)}.sui-box--blur{position:relative;isolation:isolate;border:1px solid var(--sui-atom-box-blur-border)}.sui-box--blur::before{content:"";position:absolute;inset:0;border-radius:inherit;background-color:var(--sui-atom-box-blur-background);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:-1;pointer-events:none}.sui-box--warm{background:var(--sui-atom-box-warm-background)}.sui-box--cool{background:var(--sui-atom-box-cool-background)}.sui-box--frost{position:relative;isolation:isolate}.sui-box--frost::before{content:"";position:absolute;inset:0;border-radius:inherit;background-color:var(--sui-atom-box-frost-background);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);z-index:-1;pointer-events:none}.sui-box--mist{position:relative;isolation:isolate;border:1px solid var(--sui-atom-box-mist-border)}.sui-box--mist::before{content:"";position:absolute;inset:0;border-radius:inherit;background-color:var(--sui-atom-box-mist-background);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:-1;pointer-events:none}.sui-box--glass{position:relative;isolation:isolate;border-radius:var(--sui-radii-lg);box-shadow:var(--sui-atom-box-gradient-shadow)}.sui-box--glass::before{content:"";position:absolute;inset:0;border-radius:inherit;border:1px solid var(--sui-semantic-border-muted);background:var(--sui-semantic-background-glass);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:-1;pointer-events:none}.sui-icon--xs{width:12px;height:12px;min-width:12px}.sui-icon--sm{width:18px;height:18px;min-width:18px}.sui-icon--base{width:24px;height:24px;min-width:24px}.sui-icon--lg{width:36px;height:36px;min-width:36px}.sui-icon--xl{width:48px;height:48px;min-width:48px}.sui-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;border-radius:var(--sui-radii-sm);font-size:var(--sui-typography-font-sizes-sm);font-weight:var(--sui-typography-font-weights-medium);font-family:inherit;cursor:pointer;border:1px solid rgba(0,0,0,0);transition-property:background-color,border-color,color,box-shadow;transition-duration:var(--sui-transitions-duration-normal);transition-timing-function:var(--sui-transitions-timing-ease);height:48px;padding:0 18px}.sui-button:focus{outline:none}.sui-button:focus-visible{outline:2px solid var(--sui-semantic-border-focus);outline-offset:2px}.sui-button:disabled{pointer-events:none;opacity:.5}.sui-button--lg{height:60px;padding:0 24px;font-size:var(--sui-typography-font-sizes-xl)}.sui-button--sm{height:36px;padding:0 12px}.sui-button--xs{height:24px;padding:0 6px}.sui-button--square{border-radius:var(--sui-radii-sm)}.sui-button--circle{border-radius:var(--sui-radii-full)}.sui-button--rounded-sm{border-radius:var(--sui-radii-sm)}.sui-button--rounded-md{border-radius:var(--sui-radii-md)}.sui-button--rounded-lg{border-radius:var(--sui-radii-lg)}.sui-button--icon{aspect-ratio:1;padding:0;justify-content:center}.sui-button--image{aspect-ratio:1;padding:0;overflow:hidden;background-color:rgba(0,0,0,0);border:none}.sui-button--image:hover:not(:disabled){opacity:.9}.sui-button--left{border-top-right-radius:0;border-bottom-right-radius:0}.sui-button--right{border-top-left-radius:0;border-bottom-left-radius:0}.sui-button--middle{border-radius:0}.sui-button--default{background-color:var(--sui-atom-button-default-background);color:var(--sui-atom-button-default-text)}.sui-button--default:hover:not(:disabled){background-color:var(--sui-atom-button-default-background-hover)}.sui-button--default:active:not(:disabled){background-color:var(--sui-atom-button-default-background-active)}.sui-button--secondary{background-color:var(--sui-atom-button-secondary-background);color:var(--sui-atom-button-secondary-text)}.sui-button--secondary:hover:not(:disabled){background-color:var(--sui-atom-button-secondary-background-hover)}.sui-button--muted{background-color:var(--sui-atom-button-muted-background);color:var(--sui-atom-button-muted-text)}.sui-button--muted:hover:not(:disabled){background-color:var(--sui-atom-button-muted-background-hover)}.sui-button--light{background-color:var(--sui-atom-button-light-background);border-color:var(--sui-atom-button-light-border);color:var(--sui-atom-button-light-text)}.sui-button--light:hover:not(:disabled){background-color:var(--sui-atom-button-light-background-hover)}.sui-button--dashed{background-color:var(--sui-atom-button-dashed-background);border:1px dashed var(--sui-atom-button-dashed-border);color:var(--sui-atom-button-dashed-text)}.sui-button--dashed:hover:not(:disabled){border-color:var(--sui-atom-button-dashed-border-hover);color:var(--sui-atom-button-dashed-text-hover)}.sui-button--destructive{background-color:var(--sui-atom-button-destructive-background);color:var(--sui-atom-button-destructive-text)}.sui-button--destructive:hover:not(:disabled){background-color:var(--sui-atom-button-destructive-background-hover)}.sui-button--outline{background-color:var(--sui-atom-button-outline-background);border-color:var(--sui-atom-button-outline-border);color:var(--sui-atom-button-outline-text)}.sui-button--outline:hover:not(:disabled){background-color:var(--sui-atom-button-outline-background-hover)}.sui-button--ghost{background-color:var(--sui-atom-button-ghost-background);color:var(--sui-atom-button-ghost-text)}.sui-button--ghost:hover:not(:disabled){background-color:var(--sui-atom-button-ghost-background-hover)}.sui-button--link{background-color:var(--sui-atom-button-link-background);color:var(--sui-atom-button-link-text);-webkit-text-decoration-line:underline;text-decoration-line:underline;text-underline-offset:4px;transition:background-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease),color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease),text-underline-offset var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-button--link:hover:not(:disabled){background-color:var(--sui-atom-button-link-background-hover);color:var(--sui-atom-button-link-text-hover);text-decoration-thickness:2px;text-underline-offset:5px}.sui-button--warning{background:var(--sui-atom-button-warning-background);color:var(--sui-atom-button-warning-text)}.sui-button--warning:hover:not(:disabled){background:var(--sui-atom-button-warning-background-hover)}.sui-button--amber{background:var(--sui-atom-button-amber-background);color:var(--sui-atom-button-amber-text)}.sui-button--amber:hover:not(:disabled){background:var(--sui-atom-button-amber-background-hover)}.sui-button--cloudy{background:var(--sui-atom-button-cloudy-background);color:var(--sui-atom-button-cloudy-text)}.sui-button--cloudy:hover:not(:disabled){background:var(--sui-atom-button-cloudy-background-hover)}.sui-button--frost{position:relative;isolation:isolate;color:var(--sui-atom-button-frost-text);border:1px solid var(--sui-atom-button-frost-border);background:rgba(0,0,0,0);transition:border-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease),color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-button--frost::before{content:"";position:absolute;inset:0;border-radius:inherit;background-color:var(--sui-atom-button-frost-background);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);z-index:-1;pointer-events:none;transition:background-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-button--frost:hover:not(:disabled){border-color:var(--sui-atom-button-frost-border-hover)}.sui-button--frost:hover:not(:disabled)::before{background-color:var(--sui-atom-button-frost-background-hover)}.sui-button--frost:active:not(:disabled)::before{background-color:var(--sui-atom-button-frost-background-active)}.sui-button--plain{background:var(--sui-atom-button-plain-background);color:var(--sui-atom-button-plain-text);border:none}.sui-button--plain:hover:not(:disabled){background:var(--sui-atom-button-plain-background-hover)}.sui-button--gradient{background:var(--sui-atom-button-gradient-background);border:1px solid var(--sui-atom-button-gradient-border);color:var(--sui-atom-button-gradient-text)}.sui-button--gradient:hover:not(:disabled){background:var(--sui-atom-button-gradient-background-hover)}.sui-button--bordered{background-color:var(--sui-atom-button-bordered-background);border:1px solid var(--sui-atom-button-bordered-border);color:var(--sui-atom-button-bordered-text)}.sui-button--bordered:hover:not(:disabled){background-color:var(--sui-atom-button-bordered-background-hover)}.sui-button__image{width:100%;height:100%;object-fit:cover;border-radius:inherit}.sui-button svg:not([class*=sui-icon--]){width:24px;height:24px}.sui-button--sm svg:not([class*=sui-icon--]){width:18px;height:18px}.sui-button--xs svg:not([class*=sui-icon--]){width:12px;height:12px}.sui-button__icon{display:inline-flex;align-items:center;justify-content:center}.sui-simple-select-wrapper{position:relative;display:inline-block}.sui-simple-select{display:block;width:100%;height:36px;padding:0 32px 0 12px;font-family:var(--sui-typography-fonts-primary);font-weight:var(--sui-typography-font-weights-normal);font-size:var(--sui-typography-font-sizes-sm);color:var(--sui-atom-select-text);background-color:var(--sui-atom-select-background);border:none;border-radius:var(--sui-radii-sm);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition-property:border-color,box-shadow,background-color;transition-duration:var(--sui-transitions-duration-normal);transition-timing-function:var(--sui-transitions-timing-ease)}.theme-khalis-blue-dark .sui-simple-select{border:1px solid var(--sui-atom-select-border)}.theme-khalis-blue-dark .sui-simple-select:focus,.theme-khalis-blue-dark .sui-simple-select:focus-visible{border-color:var(--sui-atom-select-border-focus)}.sui-simple-select:focus{outline:none}.sui-simple-select:focus-visible{outline:2px solid var(--sui-semantic-border-focus);outline-offset:2px}.sui-simple-select:disabled{cursor:not-allowed;opacity:.5}.sui-simple-select--sm{height:24px;padding:0 24px 0 8px}.sui-simple-select--fateh{background-color:rgba(0,0,0,0);border-radius:0}.sui-simple-select--fateh:focus-visible{outline-offset:0}.sui-simple-select--bordered{background-color:var(--sui-atom-select-bordered-background);border:1px solid var(--sui-atom-select-bordered-border);color:var(--sui-atom-select-bordered-text)}.sui-simple-select--bordered~.sui-simple-select-icon{color:var(--sui-atom-select-bordered-text)}.sui-simple-select--shape-square{border-radius:var(--sui-radii-none)}.sui-simple-select--shape-rounded{border-radius:var(--sui-radii-md)}.sui-simple-select--shape-pill{border-radius:var(--sui-radii-full)}.sui-simple-select--error{border-color:var(--sui-colors-error)}.sui-simple-select--error:focus-visible{outline-color:var(--sui-colors-error)}.sui-simple-select-icon{position:absolute;right:12px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--sui-atom-select-icon)}.sui-simple-select--sm~.sui-simple-select-icon{right:6px}.sui-labeled-button{display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer}.sui-labeled-button:hover .sui-button--secondary:not(:disabled){background-color:var(--sui-atom-button-secondary-background-hover)}.sui-labeled-button:hover .sui-button--dashed:not(:disabled){background-color:var(--sui-atom-button-dashed-background-hover, var(--sui-semantic-background-surface))}.sui-labeled-button:hover .sui-labeled-button__title{color:var(--sui-semantic-accent-default)}.sui-labeled-button__title{font-family:var(--sui-typography-fonts-primary);font-weight:var(--sui-typography-font-weights-normal);font-size:var(--sui-typography-font-sizes-xs);line-height:var(--sui-typography-line-heights-base);text-align:center;color:var(--sui-atom-labeled-button-title);transition:color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-shortcut-tray-wrapper{display:flex;flex-direction:column;gap:6px}.sui-shortcut-tray{display:flex;align-items:flex-start;flex-wrap:wrap;gap:36px 0;padding:12px 0 6px;border-radius:var(--sui-radii-lg)}.sui-shortcut-tray .sui-button:not(.sui-button--dashed){color:var(--sui-atom-shortcut-tray-icon-color)}@media(max-width: 768px){.sui-shortcut-tray{padding:12px}}.sui-shortcut-tray__header{display:flex;align-items:center;justify-content:space-between;gap:8px}.sui-shortcut-tray__edit-button.sui-button{color:var(--sui-atom-shortcut-tray-title)}.sui-shortcut-tray__title{font-family:var(--sui-typography-fonts-primary);font-weight:var(--sui-typography-font-weights-normal);font-size:var(--sui-typography-font-sizes-xs);line-height:var(--sui-typography-line-heights-base);letter-spacing:.1em;color:var(--sui-atom-shortcut-tray-title)}.sui-shortcut-tray__title--accent{font-family:var(--sui-typography-fonts-primary);font-weight:var(--sui-typography-font-weights-semibold);font-size:var(--sui-typography-font-sizes-xs);line-height:var(--sui-typography-line-heights-base);letter-spacing:.1em;color:var(--sui-atom-shortcut-tray-icon-color)}@media(max-width: 768px){.sui-shortcut-tray__title{text-align:center}}.sui-gurmukhi-keyboard{background-color:var(--sui-atom-keyboard-background);border:1px solid var(--sui-atom-keyboard-border);border-radius:var(--sui-radii-sm);padding:8px;height:0;opacity:0;overflow:hidden;pointer-events:none;transform:rotateX(-90deg) perspective(500px);transform-origin:top;transition:all .25s;width:100%}.sui-gurmukhi-keyboard--active{height:initial;opacity:1;pointer-events:auto;transform:rotateX(0deg)}.sui-gurmukhi-keyboard__row{display:flex;margin-bottom:4px}.sui-gurmukhi-keyboard__row:last-child{margin-bottom:0}.sui-gurmukhi-keyboard__row-set{display:flex;gap:4px;width:100%}.sui-gurmukhi-keyboard__key{flex-grow: 0;flex-shrink: 0;flex-basis: calc(10% - 4px);height:40px;padding:0 4px;font-size:var(--sui-typography-font-sizes-base);font-family:var(--sui-typography-fonts-primary)}.sui-gurmukhi-keyboard-toggle--active svg{color:var(--sui-semantic-accent-default)}.sui-indicator{display:inline-block;border-radius:var(--sui-radii-full);flex-shrink:0}.sui-indicator--green{background-color:var(--sui-atom-indicator-green)}.sui-indicator--red{background-color:var(--sui-atom-indicator-red)}.sui-indicator--yellow{background-color:var(--sui-atom-indicator-yellow)}.sui-indicator--xs{width:6px;height:6px}.sui-indicator--s{width:8px;height:8px}.sui-indicator--m{width:12px;height:12px}.sui-indicator--l{width:16px;height:16px}.sui-fateh-tabs{display:flex;align-items:center;gap:var(--sui-spacing-4)}.sui-fateh-tabs__panel{animation:sui-fateh-tabs-fade-in var(--sui-transitions-duration-slower) var(--sui-transitions-timing-ease)}.sui-fateh-tabs--glass{gap:4px;background:rgba(0,0,0,0);padding:0}.sui-fateh-tabs--glass .sui-fateh-link{font-family:var(--sui-typography-fonts-primary);font-size:var(--sui-typography-font-sizes-sm);font-weight:var(--sui-typography-font-weights-normal);line-height:100%;letter-spacing:0;text-align:center;color:var(--sui-semantic-accent-default);height:24px;padding:0 16px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--sui-radii-lg) var(--sui-radii-lg) 0 0;background:var(--sui-semantic-background-glass);border:1px solid var(--sui-semantic-border-muted);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.sui-fateh-tabs--glass .sui-fateh-link--active,.sui-fateh-tabs--glass .sui-fateh-link[aria-selected=true]{font-weight:var(--sui-typography-font-weights-bold);color:var(--sui-semantic-accent-default)}.sui-fateh-tabs--underline .sui-fateh-link{position:relative;padding-bottom:8px}.sui-fateh-tabs--underline .sui-fateh-link--active::after,.sui-fateh-tabs--underline .sui-fateh-link[aria-selected=true]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--sui-semantic-accent-default);border-radius:2px}.sui-fateh-tabs--pilled{gap:var(--sui-spacing-2);width:-moz-fit-content;width:fit-content}.sui-fateh-tabs--pilled .sui-fateh-link{padding:6px 18px;height:36px;border-radius:var(--sui-radii-full);text-decoration:none;font-family:var(--sui-typography-fonts-primary);font-size:var(--sui-typography-font-sizes-sm);font-weight:var(--sui-typography-font-weights-semibold);line-height:100%;letter-spacing:.1em;text-align:center;text-transform:uppercase;color:color-mix(in srgb, var(--sui-semantic-accent-default) 50%, transparent);transition:background-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease),color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-fateh-tabs--pilled .sui-fateh-link::after{display:none}.sui-fateh-tabs--pilled .sui-fateh-link:hover:not(.sui-fateh-link--active):not([aria-selected=true]){color:var(--sui-semantic-accent-default)}.sui-fateh-tabs--pilled .sui-fateh-link--active,.sui-fateh-tabs--pilled .sui-fateh-link[aria-selected=true]{background:color-mix(in srgb, var(--sui-semantic-accent-default) 10%, transparent);color:var(--sui-semantic-accent-default)}.sui-fateh-tabs--boxed{gap:0}.sui-fateh-tabs--boxed .sui-fateh-link{border:1px solid var(--sui-semantic-border-default);border-radius:0;margin-left:-1px;padding:0 18px;height:48px;flex:1 1;justify-content:center;text-decoration:none;text-transform:uppercase;letter-spacing:.05em;font-size:var(--sui-typography-font-sizes-sm);font-weight:var(--sui-typography-font-weights-normal);color:var(--sui-semantic-accent-default);transition:border-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease),color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-fateh-tabs--boxed .sui-fateh-link::after{display:none}.sui-fateh-tabs--boxed .sui-fateh-link:first-child{margin-left:0}.sui-fateh-tabs--boxed .sui-fateh-link--active,.sui-fateh-tabs--boxed .sui-fateh-link[aria-selected=true]{color:var(--sui-semantic-accent-default);font-weight:var(--sui-typography-font-weights-bold)}@keyframes sui-fateh-tabs-fade-in{from{opacity:0}to{opacity:1}}.sui-fateh-link{font-family:var(--sui-typography-fonts-primary);font-weight:var(--sui-typography-font-weights-normal);font-size:var(--sui-typography-font-sizes-base);line-height:100%;letter-spacing:0;color:var(--sui-atom-fateh-tabs-text);background:rgba(0,0,0,0);border:none;padding:0;cursor:pointer;text-decoration:none;transition:color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}@media(max-width: 768px){.sui-fateh-link{font-size:var(--sui-typography-font-sizes-sm)}}.sui-fateh-link:hover:not(:disabled){color:var(--sui-semantic-accent-default)}.sui-fateh-link:disabled{opacity:.5;cursor:not-allowed}.sui-fateh-link--active{font-weight:var(--sui-typography-font-weights-bold);color:var(--sui-semantic-accent-default)}.sui-fateh-link-bar{display:flex;align-items:center;gap:var(--sui-spacing-4)}.sui-search-bar{display:flex;flex-direction:column;gap:12px;padding:12px;border-radius:var(--sui-radii-md)}.sui-search-bar--plain{padding-left:0;padding-right:0}.sui-search-bar__keyboard-section{position:relative}.sui-search-bar__keyboard-section>.sui-autocomplete-list{position:absolute;top:100%;left:0;right:0;z-index:10;border-top:none}.sui-search-bar__input-row{position:relative;display:flex;align-items:center}.sui-search-bar__input-row>.sui-autocomplete-list{position:absolute;top:100%;left:0;right:0;z-index:10;border-top:none}.sui-search-bar__input-row--error .sui-search-bar__input-wrapper{box-shadow:0px 0px 4px 0px color-mix(in srgb, var(--sui-colors-error) 50%, transparent)}.sui-search-bar__input-row--error .sui-search-bar__input::placeholder,.sui-search-bar__input-row--error .sui-search-bar__textarea::placeholder{color:var(--sui-colors-error);font-family:var(--sui-typography-fonts-primary)}.sui-search-bar__input-row--error .sui-search-bar__mic-btn svg{color:var(--sui-colors-error);opacity:1}.sui-search-bar__input-wrapper{position:relative;height:48px;display:flex;align-items:center;gap:3px 0;flex:1 1;background-color:var(--sui-atom-search-bar-input-background);border:1px solid var(--sui-atom-search-bar-input-border);border-right:none;border-radius:var(--sui-radii-sm) 0 0 var(--sui-radii-sm);transition:border-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-search-bar__input{flex:1 1;height:48px;padding:0 12px;font-family:var(--sui-typography-fonts-primary);font-size:var(--sui-typography-font-sizes-base);font-weight:var(--sui-typography-font-weights-normal);color:var(--sui-semantic-accent-default);background:rgba(0,0,0,0);border:none;outline:none;width:100%}.sui-search-bar__input::placeholder{color:var(--sui-semantic-foreground-subtle)}.sui-search-bar__input--hidden{opacity:0;pointer-events:none}.sui-search-bar__recording-overlay{position:absolute;left:16px;right:60px;top:50%;transform:translateY(-50%);z-index:1}.sui-search-bar--chat .sui-search-bar__recording-overlay{top:12px;transform:none}@media(max-width: 768px){.sui-search-bar--chat .sui-search-bar__recording-overlay{top:18px}}.sui-search-bar__input-icons{display:flex;align-items:center;padding-right:12px}.sui-search-bar__input-icons svg{opacity:.4}.sui-search-bar__icon-btn--active{outline:2px solid var(--sui-semantic-accent-default) !important}.sui-search-bar__icon-btn:hover svg{color:var(--sui-semantic-accent-default);opacity:1}.sui-search-bar__clear-btn:hover{background:var(--sui-atom-button-light-background-hover);border-radius:50%}.sui-search-bar__filters{display:flex;gap:12px;width:100%}@media(max-width: 768px){.sui-search-bar__filters{justify-content:center}}.sui-search-bar__filters .sui-simple-select-wrapper{width:114px}.sui-search-bar__filters-left{display:flex;gap:12px;margin-right:auto}.sui-search-bar__filters-left .sui-simple-select-wrapper{width:144px}.sui-search-bar__filters-right{display:flex;gap:12px;margin-left:auto}.sui-search-bar__filters-bordered{border-top:1px solid color-mix(in srgb, var(--sui-semantic-accent-default) 5%, transparent);padding-top:8px}.sui-search-bar__filter{height:-moz-fit-content;height:fit-content;margin:auto 0}.sui-search-bar__lang-btn{color:var(--sui-semantic-foreground-muted);margin-right:6px}.sui-search-bar__filter-btn.sui-button{margin-left:12px}.sui-search-bar__textarea{flex:1 1;min-height:48px;padding:12px 16px;font-family:var(--sui-typography-fonts-primary);font-size:var(--sui-typography-font-sizes-base);font-weight:var(--sui-typography-font-weights-normal);color:var(--sui-semantic-accent-default);background:rgba(0,0,0,0);border:none;outline:none;resize:none;field-sizing:content}.sui-search-bar__textarea::placeholder{color:var(--sui-semantic-foreground-subtle)}.sui-search-bar__textarea--hidden{opacity:0;pointer-events:none}.sui-search-bar__edit-filters-btn{margin-left:auto;color:var(--sui-semantic-accent-default);font-weight:var(--sui-typography-font-weights-normal)}.sui-search-bar__edit-filters-btn .sui-button__icon{min-width:18px}.sui-search-bar__edit-filters-btn .sui-badge{padding:0}@media(max-width: 768px){.sui-search-bar{padding:6px;gap:6px;border-radius:var(--sui-radii-lg)}.sui-search-bar .sui-search-bar__input-wrapper{border-radius:var(--sui-radii-lg);padding:4px;height:unset}.sui-search-bar .sui-search-bar__filters{gap:12px}}.sui-search-bar--compact .sui-search-bar__input-wrapper{background-color:color-mix(in srgb, var(--sui-semantic-background-page) 50%, transparent);border-right:1px solid var(--sui-atom-search-bar-input-border);border-radius:var(--sui-radii-lg)}.sui-search-bar__inline-search-btn{color:var(--sui-semantic-accent-default)}.sui-search-bar__inline-search-btn svg{opacity:1;color:var(--sui-semantic-accent-default)}.sui-search-bar--chat .sui-search-bar__input-wrapper{height:auto;flex-direction:column;align-items:stretch;border-right:1px solid var(--sui-atom-search-bar-input-border);border-radius:var(--sui-radii-sm)}@media(max-width: 768px){.sui-search-bar--chat .sui-search-bar__input-wrapper{border-radius:var(--sui-radii-lg);padding:4px}}.sui-search-bar--chat .sui-search-bar__action-row{display:flex;align-items:center;justify-content:space-between;padding:0 6px 6px}@media(max-width: 768px){.sui-search-bar--chat .sui-search-bar__action-row{padding:0}}.sui-search-bar--chat .sui-search-bar__action-row-right{display:flex;align-items:center;gap:8px}.sui-search-bar--chat .sui-search-bar__icon-btn svg{opacity:.4}.sui-search-bar--chat .sui-search-bar__icon-btn:hover svg{opacity:1;color:var(--sui-semantic-accent-default)}.sui-search-bar--inline{position:relative;height:48px;box-sizing:border-box;justify-content:center;padding:0 12px;background:var(--sui-semantic-background-page);border:1px solid var(--sui-semantic-border-muted);border-radius:var(--sui-radii-full)}.sui-search-bar--inline .sui-search-bar__input-row{gap:8px}.sui-search-bar--inline .sui-search-bar__search-icon{flex-shrink:0;color:var(--sui-atom-search-bar-icon)}.sui-search-bar--inline .sui-search-bar__input{flex:1 1;min-width:0;border:none;background:rgba(0,0,0,0);outline:none;font-family:var(--sui-typography-fonts-primary);font-size:var(--sui-typography-font-sizes-sm);color:var(--sui-semantic-foreground-default)}.sui-search-bar--inline .sui-search-bar__icon-btn{color:var(--sui-atom-search-bar-icon)}.sui-search-bar--inline .sui-search-bar__icon-btn,.sui-search-bar--inline .sui-search-bar__inline-filter{flex-shrink:0}.sui-search-bar--inline .sui-search-bar__inline-filter{width:96px}.sui-search-bar--inline .sui-search-bar__keyboard-section{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:20;padding:12px;background:var(--sui-semantic-background-page);border:1px solid var(--sui-semantic-border-muted);border-radius:var(--sui-radii-md);box-shadow:var(--sui-shadows-md)}.sui-search-bar--inline .sui-search-bar__filter-btn{color:var(--sui-semantic-accent-default);border-color:var(--sui-semantic-border-muted)}.sui-search-bar--inline .sui-search-bar__filter-btn .sui-badge{width:18px;height:18px;min-width:18px;padding:0;font-size:var(--sui-typography-font-sizes-xs)}.sui-search-bar__filters-popup{display:flex;flex-direction:column;gap:12px;min-width:200px}.sui-side-labeled-button{display:inline-flex;align-items:center;gap:8px;width:-moz-fit-content;width:fit-content;cursor:pointer}.sui-side-labeled-button:hover .sui-button{background-color:var(--sui-atom-button-default-background-hover)}.sui-side-labeled-button:hover .sui-side-labeled-button__label{color:var(--sui-semantic-accent-default)}.sui-side-labeled-button__label{padding-left:18px;font-family:var(--sui-typography-fonts-primary);font-size:var(--sui-typography-font-sizes-sm);font-weight:var(--sui-typography-font-weights-medium);color:var(--sui-atom-side-labeled-button-label);white-space:nowrap;transition:color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-side-labeled-button--right .sui-side-labeled-button__label{padding-left:0;padding-right:18px}.sui-side-labeled-button--text{padding:0;background:rgba(0,0,0,0)}.sui-side-labeled-button--text .sui-side-labeled-button__label{font-weight:var(--sui-typography-font-weights-normal);font-size:var(--sui-typography-font-sizes-base);line-height:100%;color:var(--sui-atom-side-labeled-button-text-label)}.theme-khalis-blue-dark .sui-side-labeled-button--text:hover .sui-side-labeled-button__label{color:var(--sui-semantic-foreground-secondary)}.sui-side-labeled-button--filled{background-color:var(--sui-atom-side-labeled-button-background);border-radius:var(--sui-radii-full);transition:background-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-side-labeled-button--filled:hover{background-color:color-mix(in srgb, var(--sui-atom-side-labeled-button-background) 90%, var(--sui-semantic-foreground-default))}.sui-side-labeled-button--filled .sui-side-labeled-button__label{font-weight:var(--sui-typography-font-weights-normal);font-size:var(--sui-typography-font-sizes-lg);line-height:100%;color:var(--sui-atom-side-labeled-button-filled-label)}.sui-side-labeled-button--sm{gap:6px}.sui-side-labeled-button--sm .sui-side-labeled-button__label{padding-left:12px;font-size:var(--sui-typography-font-sizes-sm)}.sui-side-labeled-button--sm.sui-side-labeled-button--right .sui-side-labeled-button__label{padding-left:0;padding-right:12px}.sui-side-labeled-button--xs{gap:4px}.sui-side-labeled-button--xs .sui-side-labeled-button__label{padding-left:8px;font-size:var(--sui-typography-font-sizes-xs)}.sui-side-labeled-button--xs.sui-side-labeled-button--right .sui-side-labeled-button__label{padding-left:0;padding-right:8px}.sui-sidebar-item{display:flex;align-items:center;gap:16px;width:100%;height:36px;padding:0 12px}.sui-sidebar-item+.sui-sidebar-item{margin-top:6px}.sui-sidebar-item{font-family:var(--sui-typography-fonts-primary);font-size:var(--sui-typography-font-sizes-base);font-weight:var(--sui-typography-font-weights-normal);line-height:var(--sui-typography-line-heights-base);color:var(--sui-atom-sidebar-item-text);background:rgba(0,0,0,0);border:none;border-left:2px solid rgba(0,0,0,0);cursor:pointer;text-align:left;transition:background-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease),border-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-sidebar-item:hover:not(:disabled){background-color:var(--sui-atom-sidebar-item-hover-background)}@media(max-width: 768px){.sui-sidebar-item:hover:not(:disabled){border-radius:var(--sui-radii-sm)}}.sui-sidebar-item:disabled{opacity:.5;cursor:not-allowed}.sui-sidebar-item--active{background-color:var(--sui-atom-sidebar-item-active-background);border-left-color:var(--sui-semantic-accent-default);color:var(--sui-semantic-accent-default)}@media(max-width: 768px){.sui-sidebar-item--active{font-weight:var(--sui-typography-font-weights-semibold);background-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0)}}.sui-sidebar-item__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:18px;height:18px}.sui-sidebar-item__label{flex:1 1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sui-sidebar{position:relative;width:var(--sui-sidebar-width);align-self:stretch;flex-shrink:0;overflow:visible;background:var(--sui-atom-sidebar-background);transition:width .3s ease,opacity .3s ease}.sui-sidebar--closed{width:0;border:none}.sui-sidebar--closed .sui-sidebar__inner{overflow:hidden}.sui-sidebar__close--desktop{position:absolute;top:96px;left:-18px;opacity:1;transition:opacity .15s ease}.sui-sidebar--closed .sui-sidebar__close--desktop{opacity:0;pointer-events:none}.sui-sidebar__inner{display:flex;flex-direction:column;height:100%;overflow:auto;padding:144px 0;-ms-overflow-style:none;scrollbar-width:none}.sui-sidebar__inner::-webkit-scrollbar{display:none}.sui-sidebar__close--mobile{display:none}.sui-sidebar__header{display:none}.sui-sidebar__content{margin-top:auto;margin-bottom:auto}@media(max-width: 768px){.sui-sidebar__content{margin-top:unset}}.sui-sidebar__footer{display:none;padding:12px;border-top:1px solid var(--sui-semantic-border-default)}.sui-sidebar__divider{height:30px;border:none;background:rgba(0,0,0,0)}@media(max-width: 768px){.sui-sidebar{position:fixed;top:0;right:0;width:100%;height:100vh;height:100dvh;z-index:1000;border-left:none;transform:translateX(0);transition:transform .3s ease}.sui-sidebar--closed{width:100%;transform:translateX(100%)}.sui-sidebar__inner{padding:24px 48px calc(96px + env(safe-area-inset-bottom, 0px))}.sui-sidebar__close--desktop{display:none}.sui-sidebar__close--mobile{display:flex;position:absolute;top:18px;right:18px}.sui-sidebar__header{display:flex;align-items:center;justify-content:space-between;margin-top:62px}.sui-sidebar__header-content{flex:1 1}.sui-sidebar__content{justify-content:flex-start;padding-top:24px}.sui-sidebar__footer{display:block}}.sui-waveform{display:flex;align-items:center;gap:10px}.sui-waveform__duration{font-family:var(--sui-typography-fonts-primary);font-weight:var(--sui-typography-font-weights-bold);min-width:40px;text-align:center}.sui-voice-recorder{display:flex;align-items:center;gap:8px}.sui-autocomplete-list{list-style:none;margin:0;padding:12px 0;background:var(--sui-atom-autocomplete-background);border:1px solid var(--sui-atom-autocomplete-border);border-radius:0 0 var(--sui-radii-lg) var(--sui-radii-lg);box-shadow:0 4px 12px rgba(0,0,0,.1);overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}.sui-autocomplete-list::-webkit-scrollbar{display:none}.sui-autocomplete-list:focus{outline:none}.sui-autocomplete-list__item{display:flex;align-items:center;justify-content:space-between;padding:6px 12px;cursor:pointer;transition:background-color .15s ease}.sui-autocomplete-list__item:hover,.sui-autocomplete-list__item--highlighted{background-color:var(--sui-atom-autocomplete-item-hover-background)}.sui-autocomplete-list__item-text{flex:1 1;font-size:var(--sui-typography-font-sizes-base);color:var(--sui-semantic-foreground-default);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sui-autocomplete-list__item-icon{flex-shrink:0;margin-left:12px}.sui-autocomplete-list__item-icon svg:not([class*=sui-icon--]){width:18px;height:18px}.sui-autocomplete-list__item-icon.sui-button:hover,.sui-autocomplete-list__item-icon.sui-button:focus-visible{background-color:color-mix(in srgb, var(--sui-atom-autocomplete-item-hover-background) 80%, var(--sui-semantic-foreground-muted) 20%)}.sui-autocomplete-list__message{padding:12px;text-align:center;font-size:var(--sui-typography-font-sizes-sm);font-family:var(--sui-typography-fonts-primary);color:var(--sui-semantic-foreground-muted)}.sui-autocomplete-list:has(.sui-autocomplete-list__footer){padding-bottom:0}.sui-autocomplete-list__footer{padding:6px 12px;font-size:var(--sui-typography-font-sizes-base);font-family:var(--sui-typography-fonts-primary);font-weight:var(--sui-typography-font-weights-medium);color:var(--sui-semantic-accent-default);cursor:pointer;transition:background-color .15s ease}.sui-autocomplete-list__footer:hover,.sui-autocomplete-list__footer--highlighted{background-color:var(--sui-atom-autocomplete-item-hover-background)}.sui-navbar{display:flex;align-items:center;justify-content:space-around;width:100%;height:72px;padding:0 24px;background-color:var(--sui-atom-navbar-background)}.sui-navbar__item-wrapper{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}.sui-navbar__item{width:48px;height:48px;min-width:48px;min-height:48px;background-color:rgba(0,0,0,0);border:1px solid rgba(0,0,0,0);color:var(--sui-atom-navbar-item-icon)}.sui-navbar__item svg{opacity:.5}.sui-navbar__item--active svg{opacity:1}.sui-navbar__item.sui-button--square{border-radius:var(--sui-radii-lg)}.sui-navbar__item.sui-button--circle{width:30px;height:30px;min-width:30px;min-height:30px}.sui-navbar__item:hover:not(:disabled){background-color:var(--sui-atom-navbar-item-hover-background)}.sui-navbar__item--active{background-color:var(--sui-atom-navbar-item-background);border:1px solid var(--sui-atom-navbar-item-border)}.sui-navbar__item-wrapper:has(.sui-navbar__item--active)::after{content:"";position:absolute;bottom:0;width:12px;height:3px;background-color:var(--sui-atom-navbar-item-icon);border-radius:var(--sui-radii-full)}.sui-navbar__item-badge{position:absolute;top:4px;right:4px;width:8px;height:8px;background-color:var(--sui-semantic-status-error);border-radius:50%;pointer-events:none}.sui-shabad-card{display:flex;flex-direction:column;gap:6px;background-color:rgba(0,0,0,0);border-radius:var(--sui-radii-lg);padding:18px 12px;font-family:var(--sui-typography-fonts-primary)}.sui-shabad-card__bani-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.sui-shabad-card__actions{display:flex;align-items:center;gap:6px;flex-shrink:0}.sui-shabad-card--active{background:var(--sui-semantic-background-glass)}.sui-shabad-card__transliterations,.sui-shabad-card__translations{display:flex;flex-direction:column;gap:4px}.sui-shabad-card__transliteration{margin:0;font-weight:var(--sui-typography-font-weights-normal);color:var(--sui-atom-gurbani-verse-translation-color);line-height:1.5}.sui-shabad-card__translation{margin:0;font-weight:var(--sui-typography-font-weights-normal);color:var(--sui-atom-gurbani-verse-translation-color);line-height:1.5}.sui-shabad-card__meta{font-size:var(--sui-typography-font-sizes-sm);font-weight:var(--sui-typography-font-weights-normal);color:var(--sui-semantic-foreground-placeholder);line-height:1.5}.sui-shabad-card__meta-source{color:var(--sui-semantic-accent-default);font-weight:var(--sui-typography-font-weights-normal)}.sui-shabad-card__meta-highlight{color:var(--sui-semantic-accent-default);font-weight:var(--sui-typography-font-weights-normal)}.sui-shabad-card__meta--clickable{cursor:pointer}.sui-shabad-card__meta--clickable:hover{text-decoration:underline}.sui-dialog-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background-color:color-mix(in srgb, var(--sui-semantic-background-overlay) 50%, transparent);z-index:1000}.sui-dialog{display:flex;flex-direction:column;width:100%;max-width:684px;border-radius:var(--sui-radii-lg);overflow:hidden}.sui-dialog__header{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.sui-dialog__header-left,.sui-dialog__header-right{display:flex;align-items:center}.sui-dialog__body{padding:var(--sui-spacing-2) var(--sui-spacing-5);overflow-y:auto;flex:1 1}.sui-drawer-overlay{position:fixed;inset:0;background-color:rgba(0,0,0,0);z-index:1000;transition:background-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-drawer-overlay--visible{background-color:color-mix(in srgb, var(--sui-semantic-background-overlay) 50%, transparent)}.sui-drawer-overlay--no-backdrop{pointer-events:none;background-color:rgba(0,0,0,0)}.sui-drawer-overlay--no-backdrop.sui-drawer-overlay--visible{background-color:rgba(0,0,0,0)}.sui-drawer-overlay--no-backdrop .sui-drawer{pointer-events:auto}.sui-drawer{position:fixed;display:flex;flex-direction:column;overflow:hidden;transition:transform var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-drawer--right{top:0;right:0;height:100%;transform:translateX(100%)}.sui-drawer--right.sui-drawer--visible{transform:translateX(0)}.sui-drawer--right.sui-drawer--sm{width:320px}.sui-drawer--right.sui-drawer--base{width:420px}.sui-drawer--right.sui-drawer--lg{width:560px}.sui-drawer--right.sui-drawer--full{width:100%}.sui-drawer--left{top:0;left:0;height:100%;transform:translateX(-100%)}.sui-drawer--left.sui-drawer--visible{transform:translateX(0)}.sui-drawer--left.sui-drawer--sm{width:320px}.sui-drawer--left.sui-drawer--base{width:420px}.sui-drawer--left.sui-drawer--lg{width:560px}.sui-drawer--left.sui-drawer--full{width:100%}.sui-drawer--top{top:0;left:0;right:0;width:100%;transform:translateY(-100%)}.sui-drawer--top.sui-drawer--visible{transform:translateY(0)}.sui-drawer--top.sui-drawer--sm{height:30vh}.sui-drawer--top.sui-drawer--base{height:50vh}.sui-drawer--top.sui-drawer--lg{height:75vh}.sui-drawer--top.sui-drawer--full{height:100%}.sui-drawer--bottom{bottom:0;left:0;right:0;width:100%;transform:translateY(100%)}.sui-drawer--bottom.sui-drawer--visible{transform:translateY(0)}.sui-drawer--bottom.sui-drawer--sm{height:30vh}.sui-drawer--bottom.sui-drawer--base{height:50vh}.sui-drawer--bottom.sui-drawer--lg{height:75vh}.sui-drawer--bottom.sui-drawer--full{height:100%}.sui-drawer__header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:var(--sui-spacing-3) var(--sui-spacing-5);flex-shrink:0}.sui-drawer__header-left,.sui-drawer__header-right{display:flex;align-items:center}.sui-drawer__body{padding:var(--sui-spacing-2) var(--sui-spacing-5);overflow-y:auto;flex:1 1;min-height:0}.sui-adorner{position:relative;display:inline-flex;overflow:visible}.sui-adorner__item{position:absolute;display:inline-flex;pointer-events:auto;z-index:1}.sui-adorner__item--top-left{top:0;left:0;transform:translate(-50%, -50%)}.sui-adorner__item--top-right{top:0;right:0;transform:translate(50%, -50%)}.sui-adorner__item--bottom-left{bottom:0;left:0;transform:translate(-50%, 50%)}.sui-adorner__item--bottom-right{bottom:0;right:0;transform:translate(50%, 50%)}.sui-adorner--circle .sui-adorner__item--top-left{top:14.64%;left:14.64%}.sui-adorner--circle .sui-adorner__item--top-right{top:14.64%;right:14.64%}.sui-adorner--circle .sui-adorner__item--bottom-left{bottom:14.64%;left:14.64%}.sui-adorner--circle .sui-adorner__item--bottom-right{bottom:14.64%;right:14.64%}.sui-adorner--reveal .sui-adorner__item{opacity:0;pointer-events:none;transition:opacity var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-adorner--reveal:hover .sui-adorner__item{opacity:1;pointer-events:auto}.sui-adorner--reveal.sui-adorner--revealed .sui-adorner__item{opacity:1;pointer-events:auto}.sui-calendar{display:inline-flex;flex-direction:column;gap:var(--sui-spacing-2);padding:var(--sui-spacing-2);background:var(--sui-semantic-background-page);border:1px solid var(--sui-semantic-border-muted);border-radius:var(--sui-radii-lg);font-family:var(--sui-typography-fonts-primary);color:var(--sui-semantic-foreground-default);-webkit-user-select:none;-moz-user-select:none;user-select:none}.sui-calendar__header{display:flex;align-items:center;justify-content:space-between;gap:var(--sui-spacing-2)}.sui-calendar__title{font-size:var(--sui-typography-font-sizes-sm);font-weight:var(--sui-typography-font-weights-semibold)}.sui-calendar__weekdays,.sui-calendar__grid{display:grid;grid-template-columns:repeat(7, 1fr)}.sui-calendar__weekday{display:flex;align-items:center;justify-content:center;height:24px;font-size:var(--sui-typography-font-sizes-xs);font-weight:var(--sui-typography-font-weights-medium);color:var(--sui-semantic-foreground-muted)}.sui-calendar__day{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border:none;border-radius:var(--sui-radii-full);background:rgba(0,0,0,0);color:var(--sui-semantic-foreground-default);font-family:inherit;font-size:var(--sui-typography-font-sizes-sm);cursor:pointer;transition:background-color .12s ease,color .12s ease}.sui-calendar__day:hover:not(:disabled){background:var(--sui-semantic-background-surface-alt)}.sui-calendar__day:focus-visible{outline:2px solid var(--sui-semantic-border-focus);outline-offset:-2px}.sui-calendar__day--outside{color:var(--sui-semantic-foreground-muted);opacity:.6}.sui-calendar__day--today:not(.sui-calendar__day--selected){box-shadow:inset 0 0 0 1px var(--sui-semantic-accent-default);color:var(--sui-semantic-accent-default)}.sui-calendar__day--selected{background:var(--sui-atom-button-default-background);color:var(--sui-atom-button-default-text)}.sui-calendar__day:disabled{color:var(--sui-semantic-foreground-muted);opacity:.4;cursor:default}.sui-close-button.sui-button{color:var(--sui-semantic-accent-default)}.sui-close-button.sui-button:hover:not(:disabled){color:var(--sui-semantic-foreground-default);background-color:rgba(0,0,0,0)}.theme-khalis-blue-dark .sui-close-button.sui-button:hover:not(:disabled){color:var(--sui-semantic-foreground-secondary)}.sui-scroll-row{position:relative}.sui-scroll-row__strip{display:flex;overflow-x:auto;scrollbar-width:none}.sui-scroll-row__strip::-webkit-scrollbar{display:none}.sui-scroll-row__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:1;display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:1px solid var(--sui-semantic-border-muted);border-radius:var(--sui-radii-full);background:var(--sui-semantic-background-surface);box-shadow:0 1px 4px rgba(0,0,0,.12);color:var(--sui-semantic-foreground-muted);cursor:pointer;transition:opacity .2s ease}.sui-scroll-row__arrow--left{left:8px}.sui-scroll-row__arrow--right{right:8px}.sui-scroll-row__arrow--hidden{opacity:0;pointer-events:none}.sui-divider{border:none;height:0;width:100%;border-top:1px solid var(--sui-atom-box-solid-border)}.sui-divider--gradient{border-top:none;height:1px;border-image:var(--sui-atom-box-gradient-background) 1}.sui-divider--dashed{border-top:none;height:1px;position:relative}.sui-divider__dashed-line{position:absolute;top:0;left:0;width:100%;height:1px;overflow:visible}.sui-divider--solid{border-top:1px solid var(--sui-atom-box-solid-border)}.sui-divider--blur{border-top:1px solid var(--sui-atom-box-blur-border)}.sui-divider--fade{border-top:1px solid;border-image-source:linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, var(--sui-semantic-accent-default) 50%, rgba(255, 255, 255, 0) 100%);border-image-slice:1}.sui-gurbani-display{color:var(--sui-atom-gurbani-verse-bani-color)}.sui-gurbani-display div{font-size:.9em;margin-bottom:-0.25rem}.sui-gurbani-display div.sui-larivaar{word-break:break-all}.sui-gurbani-highlight{color:var(--sui-semantic-accent-default)}.sui-gurbani-highlight .sui-gurbani-display{color:inherit;font-weight:800}.sui-gurbani-highlight .sui-gurbani-translation,.sui-gurbani-highlight .sui-gurbani-reading-translation,.sui-gurbani-highlight .sui-gurbani-transliteration,.sui-gurbani-highlight .sui-gurbani-reading-transliteration,.sui-gurbani-highlight .sui-gurbani-steek,.sui-gurbani-highlight .sui-gurbani-reading-steek{color:inherit}.sui-mahankosh-word--selected{font-weight:900;cursor:help}.sui-mahankosh-word--active{position:relative;isolation:isolate}.sui-mahankosh-word--active::before{content:"";position:absolute;inset:-2px -4px 0 -8px;background:var(--sui-semantic-background-glass);border:1px solid var(--sui-semantic-border-muted);border-radius:var(--sui-radii-sm);box-shadow:var(--sui-atom-box-gradient-shadow);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);pointer-events:none;z-index:-1}.sui-gurbani-active-verse{position:relative;padding-left:12px;isolation:isolate}.sui-gurbani-active-verse::after{content:"";position:absolute;inset:0;background:var(--sui-atom-gurbani-verse-active-background);border-left:2px solid var(--sui-atom-gurbani-verse-active-border);pointer-events:none;z-index:-1}.sui-gurbani-center-align{text-align:center}.sui-gurbani-center-align .sui-gurbani-line{justify-content:center}.sui-gurbani-center-align .sui-gurbani-line--with-actions{padding-left:calc(var(--sui-gurbani-line-actions-count, 1)*38px + 12px)}.sui-gurbani-right-align{text-align:right}.sui-gurbani-right-align .sui-gurbani-line{justify-content:flex-end}.sui-gurbani-right-align .sui-gurbani-line--with-actions{padding-right:0;padding-left:calc(var(--sui-gurbani-line-actions-count, 1)*38px + 12px)}.sui-gurbani-right-align .sui-gurbani-line-actions{right:auto;left:0}.sui-gurlipi i,.sui-gurbani-unicode i{font-style:normal}.sui-larivaar-word{display:inline}.sui-larivaar-assist-word{display:inline}.sui-gurbani-word{display:inline}.sui-search-highlight-word{background-color:rgba(1,102,155,.15);border-radius:2px}.sui-gurbani-translation,.sui-gurbani-reading-translation{margin:0;padding:0;border:0;font-size:inherit;color:var(--sui-atom-gurbani-verse-translation-color)}.sui-gurbani-transliteration,.sui-gurbani-reading-transliteration{margin:0;padding:0;color:var(--sui-atom-gurbani-verse-translation-color)}.sui-gurbani-steek,.sui-gurbani-reading-steek{margin:0;padding:0;border:0;font-size:inherit;color:var(--sui-atom-gurbani-verse-translation-color)}.sui-reading-mode-baani{display:flex;flex-direction:column;gap:24px}.sui-split-view-baani{display:flex;flex-direction:column;gap:24px}.sui-mixed-view-baani-wrapper{display:flex;flex-direction:column;gap:6px;position:relative}.sui-mixed-view-baani-wrapper>*:empty{display:none}.sui-mixed-view-baani-wrapper--selected{isolation:isolate}.sui-mixed-view-baani-wrapper--selected::after{content:"";position:absolute;inset:-12px;background:var(--sui-semantic-background-glass);border:1px solid var(--sui-semantic-border-muted);border-radius:var(--sui-radii-md);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:var(--sui-atom-box-gradient-shadow);pointer-events:none;z-index:-1}.sui-text-selection-actions{position:absolute;top:50%;right:8px;transform:translateY(-50%);display:flex;gap:12px;z-index:1}.sui-gurbani-line--with-actions{position:relative;padding-right:calc(var(--sui-gurbani-line-actions-count, 1)*38px + 12px)}.sui-gurbani-line-actions{position:absolute;top:0;right:0;display:flex;align-items:flex-start;gap:6px;z-index:1}.sui-gurbani-line-actions .sui-button svg{color:var(--sui-semantic-accent-default)}.sui-larivaar-visraam-igurbani,.sui-larivaar-visraam-sttm2,.sui-larivaar-visraam-sttm{position:relative !important}.sui-larivaar-visraam-igurbani::after,.sui-larivaar-visraam-sttm2::after,.sui-larivaar-visraam-sttm::after{align-items:center;border-bottom:6px solid rgba(0,0,0,0);border-left:6px solid rgba(0,0,0,0);border-right:6px solid rgba(0,0,0,0);border-top:6px solid;content:"";display:inline-flex;font-weight:bold;height:0;justify-content:center;padding:0;position:absolute;transform:translate(-5px, -90%);width:0}.sui-visraams-colored-words .sui-visraam-sttm-main,.sui-visraams-colored-words .visraam-sttm-main{color:#c0392b !important}.sui-visraams-colored-words .sui-visraam-sttm-yamki,.sui-visraams-colored-words .visraam-sttm-yamki{color:#f39c1d !important}.sui-visraams-colored-words .sui-larivaar-visraam-sttm-main::after{border-top-color:#c0392b}.sui-visraams-colored-words .sui-larivaar-visraam-sttm-yamki::after{border-top-color:#f39c1d}.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-sttm-main,.sui-visraams-gradient-bg .sui-gurlipi .visraam-sttm-main,.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-sttm-yamki,.sui-visraams-gradient-bg .sui-gurlipi .visraam-sttm-yamki,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-sttm-main,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-sttm-main,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-sttm-yamki,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-sttm-yamki,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-sttm-main,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-sttm-main,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-sttm-yamki,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-sttm-yamki{position:relative;isolation:isolate}.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-sttm-main::after,.sui-visraams-gradient-bg .sui-gurlipi .visraam-sttm-main::after,.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-sttm-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi .visraam-sttm-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-sttm-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-sttm-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-sttm-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-sttm-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-sttm-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-sttm-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-sttm-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-sttm-yamki::after{content:"";position:absolute;left:-2px;right:2px;top:4px;bottom:6px;border-radius:var(--sui-radii-sm);pointer-events:none;z-index:-1}.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-sttm-main::after,.sui-visraams-gradient-bg .sui-gurlipi .visraam-sttm-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-sttm-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-sttm-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-sttm-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-sttm-main::after{background:linear-gradient(to right, rgba(229, 229, 229, 0) 20%, rgba(192, 57, 43, 0.7) 100%) !important}.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-sttm-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi .visraam-sttm-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-sttm-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-sttm-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-sttm-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-sttm-yamki::after{background:linear-gradient(to right, rgba(229, 229, 229, 0) 20%, rgba(243, 156, 29, 0.7) 100%) !important}.sui-visraams-gradient-bg .sui-gurlipi .sui-larivaar-visraam-sttm-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-larivaar-visraam-sttm-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-larivaar-visraam-sttm-main::after{background-color:#c0392b}.sui-visraams-gradient-bg .sui-gurlipi .sui-larivaar-visraam-sttm-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-larivaar-visraam-sttm-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-larivaar-visraam-sttm-yamki::after{background-color:#f39c1d}.sui-visraams-colored-words .sui-visraam-sttm2-main,.sui-visraams-colored-words .visraam-sttm2-main{color:#c0392b !important}.sui-visraams-colored-words .sui-visraam-sttm2-yamki,.sui-visraams-colored-words .visraam-sttm2-yamki{color:#f39c1d !important}.sui-visraams-colored-words .sui-larivaar-visraam-sttm2-main::after{border-top-color:#c0392b}.sui-visraams-colored-words .sui-larivaar-visraam-sttm2-yamki::after{border-top-color:#f39c1d}.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-sttm2-main,.sui-visraams-gradient-bg .sui-gurlipi .visraam-sttm2-main,.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-sttm2-yamki,.sui-visraams-gradient-bg .sui-gurlipi .visraam-sttm2-yamki,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-sttm2-main,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-sttm2-main,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-sttm2-yamki,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-sttm2-yamki,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-sttm2-main,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-sttm2-main,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-sttm2-yamki,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-sttm2-yamki{position:relative;isolation:isolate}.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-sttm2-main::after,.sui-visraams-gradient-bg .sui-gurlipi .visraam-sttm2-main::after,.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-sttm2-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi .visraam-sttm2-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-sttm2-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-sttm2-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-sttm2-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-sttm2-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-sttm2-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-sttm2-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-sttm2-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-sttm2-yamki::after{content:"";position:absolute;left:-2px;right:2px;top:4px;bottom:6px;border-radius:var(--sui-radii-sm);pointer-events:none;z-index:-1}.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-sttm2-main::after,.sui-visraams-gradient-bg .sui-gurlipi .visraam-sttm2-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-sttm2-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-sttm2-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-sttm2-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-sttm2-main::after{background:linear-gradient(to right, rgba(229, 229, 229, 0) 20%, rgba(192, 57, 43, 0.7) 100%) !important}.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-sttm2-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi .visraam-sttm2-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-sttm2-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-sttm2-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-sttm2-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-sttm2-yamki::after{background:linear-gradient(to right, rgba(229, 229, 229, 0) 20%, rgba(243, 156, 29, 0.7) 100%) !important}.sui-visraams-gradient-bg .sui-gurlipi .sui-larivaar-visraam-sttm2-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-larivaar-visraam-sttm2-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-larivaar-visraam-sttm2-main::after{background-color:#c0392b}.sui-visraams-gradient-bg .sui-gurlipi .sui-larivaar-visraam-sttm2-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-larivaar-visraam-sttm2-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-larivaar-visraam-sttm2-yamki::after{background-color:#f39c1d}.sui-visraams-colored-words .sui-visraam-igurbani-main,.sui-visraams-colored-words .visraam-igurbani-main{color:#c0392b !important}.sui-visraams-colored-words .sui-visraam-igurbani-yamki,.sui-visraams-colored-words .visraam-igurbani-yamki{color:#f39c1d !important}.sui-visraams-colored-words .sui-larivaar-visraam-igurbani-main::after{border-top-color:#c0392b}.sui-visraams-colored-words .sui-larivaar-visraam-igurbani-yamki::after{border-top-color:#f39c1d}.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-igurbani-main,.sui-visraams-gradient-bg .sui-gurlipi .visraam-igurbani-main,.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-igurbani-yamki,.sui-visraams-gradient-bg .sui-gurlipi .visraam-igurbani-yamki,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-igurbani-main,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-igurbani-main,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-igurbani-yamki,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-igurbani-yamki,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-igurbani-main,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-igurbani-main,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-igurbani-yamki,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-igurbani-yamki{position:relative;isolation:isolate}.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-igurbani-main::after,.sui-visraams-gradient-bg .sui-gurlipi .visraam-igurbani-main::after,.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-igurbani-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi .visraam-igurbani-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-igurbani-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-igurbani-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-igurbani-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-igurbani-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-igurbani-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-igurbani-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-igurbani-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-igurbani-yamki::after{content:"";position:absolute;left:-2px;right:2px;top:4px;bottom:6px;border-radius:var(--sui-radii-sm);pointer-events:none;z-index:-1}.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-igurbani-main::after,.sui-visraams-gradient-bg .sui-gurlipi .visraam-igurbani-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-igurbani-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-igurbani-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-igurbani-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-igurbani-main::after{background:linear-gradient(to right, rgba(229, 229, 229, 0) 20%, rgba(192, 57, 43, 0.7) 100%) !important}.sui-visraams-gradient-bg .sui-gurlipi .sui-visraam-igurbani-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi .visraam-igurbani-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-visraam-igurbani-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .visraam-igurbani-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-visraam-igurbani-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .visraam-igurbani-yamki::after{background:linear-gradient(to right, rgba(229, 229, 229, 0) 20%, rgba(243, 156, 29, 0.7) 100%) !important}.sui-visraams-gradient-bg .sui-gurlipi .sui-larivaar-visraam-igurbani-main::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-larivaar-visraam-igurbani-main::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-larivaar-visraam-igurbani-main::after{background-color:#c0392b}.sui-visraams-gradient-bg .sui-gurlipi .sui-larivaar-visraam-igurbani-yamki::after,.sui-visraams-gradient-bg .sui-gurlipi-reading-mode .sui-larivaar-visraam-igurbani-yamki::after,.sui-visraams-gradient-bg .sui-gurbani-unicode .sui-larivaar-visraam-igurbani-yamki::after{background-color:#f39c1d}.sui-pagination{display:flex;align-items:center;justify-content:space-between;font-family:var(--sui-typography-fonts-primary)}.sui-pagination__pages{display:flex;flex-wrap:wrap;gap:6px}@media(max-width: 768px){.sui-pagination__pages{justify-content:center}}.sui-tooltip-wrapper{display:inline-flex}.sui-tooltip{z-index:9999;min-width:200px}@media(max-width: 768px){.sui-tooltip{max-width:90vw !important}}.sui-tooltip__close{position:absolute;top:6px;right:6px;color:var(--sui-semantic-accent-default)}.sui-tooltip__content{position:relative;padding:12px;font-family:var(--sui-typography-fonts-primary);font-size:var(--sui-typography-font-sizes-sm);color:var(--sui-semantic-foreground-default);line-height:1.6}.sui-popup-menu-trigger{display:inline-flex}.sui-popup-menu-trigger--open .sui-button{background-color:var(--sui-semantic-accent-muted)}.sui-popup-menu{z-index:9999;min-width:160px;padding:var(--sui-spacing-2);font-family:var(--sui-typography-fonts-primary);overflow:hidden}.sui-popup-menu__item{display:flex;align-items:center;gap:var(--sui-spacing-1);width:100%;height:36px;padding:0 var(--sui-spacing-2);border:none;border-radius:var(--sui-radii-sm);background:rgba(0,0,0,0);color:var(--sui-semantic-accent-default);font-family:inherit;font-size:var(--sui-typography-font-sizes-sm);line-height:var(--sui-typography-line-heights-sm);cursor:pointer;text-align:left;white-space:nowrap}.sui-popup-menu__item:hover:not(:disabled){background-color:var(--sui-semantic-accent-muted)}.sui-popup-menu__item--danger{color:var(--sui-colors-error)}.sui-popup-menu__item--danger:hover:not(:disabled){background-color:color-mix(in srgb, var(--sui-colors-error) 10%, transparent)}.sui-popup-menu__item-icon{display:inline-flex;align-items:center;flex-shrink:0}.sui-popup-menu__item--disabled{opacity:.5;cursor:not-allowed}.sui-popup-menu__divider{height:1px;margin:6px 0;background-color:var(--sui-semantic-border-muted)}.sui-section-nav{display:flex;flex-direction:column;gap:0}.sui-section-nav__item{display:flex;align-items:center;gap:var(--sui-spacing-2);width:100%;height:36px;padding:0 var(--sui-spacing-2);border:1px solid rgba(0,0,0,0);border-radius:var(--sui-radii-sm);background:rgba(0,0,0,0);cursor:pointer;text-align:left;overflow:hidden;white-space:nowrap;color:var(--sui-semantic-foreground-tertiary);font-family:var(--sui-typography-fonts-primary);font-weight:var(--sui-typography-font-weights-medium);font-size:var(--sui-typography-font-sizes-sm);line-height:1.5;letter-spacing:.005em;transition:width var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease),padding var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease),background-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease),color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-section-nav__item:hover:not(:disabled){background-color:var(--sui-semantic-background-surface-alt)}.sui-section-nav__item:focus-visible{outline:2px solid var(--sui-semantic-border-focus);outline-offset:2px}.sui-section-nav__toggle{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border:none;border-radius:var(--sui-radii-md);background:rgba(0,0,0,0);cursor:pointer;color:var(--sui-semantic-foreground-tertiary);transition:background-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-section-nav__toggle:hover:not(:disabled){background-color:var(--sui-semantic-background-surface-alt)}.sui-section-nav__toggle:focus-visible{outline:2px solid var(--sui-semantic-border-focus);outline-offset:2px}.sui-section-nav__item--active{background-color:var(--sui-atom-button-light-background-hover);border-color:var(--sui-semantic-border-default);color:var(--sui-atom-button-light-text)}.sui-section-nav__item--active:hover:not(:disabled){background-color:var(--sui-atom-button-light-background-hover)}.sui-section-nav__icon{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px}.sui-section-nav__label{flex:1 1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sui-section-nav__chevron{flex-shrink:0;margin-left:auto;display:inline-flex;align-items:center;justify-content:center}.sui-section-nav--collapsed .sui-section-nav__item,.sui-section-nav--collapsed .sui-section-nav__toggle{justify-content:center}.sui-section-nav--collapsed .sui-section-nav__item{width:36px;padding:0}.sui-section-nav--collapsed .sui-section-nav__label,.sui-section-nav--collapsed .sui-section-nav__chevron{display:none}.sui-side-nav{display:flex;flex-direction:column;gap:24px;padding:12px 6px;background:var(--sui-semantic-background-surface-alt);border-right:1px solid var(--sui-semantic-border-muted)}.sui-side-nav__item{display:flex;flex-direction:column;align-items:center;gap:8px;padding:8px;border:none;border-radius:var(--sui-radii-md);background:rgba(0,0,0,0);cursor:pointer;font-family:var(--sui-typography-fonts-primary);color:color-mix(in srgb, var(--sui-semantic-accent-default) 70%, transparent);transition:background-color .15s ease,color .15s ease}.sui-side-nav__item:hover:not(.sui-side-nav__item--active){background:color-mix(in srgb, var(--sui-semantic-accent-default) 10%, transparent);color:var(--sui-semantic-accent-default)}.sui-side-nav__item:focus{outline:none}.sui-side-nav__item:focus-visible{outline:2px solid var(--sui-semantic-border-focus);outline-offset:2px}.sui-side-nav__item--active{color:var(--sui-semantic-accent-default);background:color-mix(in srgb, var(--sui-semantic-accent-default) 24%, transparent)}.sui-side-nav__icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px}.sui-side-nav__icon svg{width:24px;height:24px}.sui-side-nav__label{font-size:var(--sui-typography-font-sizes-xs);line-height:1.2;text-align:center}.sui-badge{display:inline-flex;align-items:center;justify-content:center;gap:4px;height:24px;min-width:24px;padding:0 8px;border-radius:var(--sui-radii-full);font-family:var(--sui-typography-fonts-primary);font-size:var(--sui-typography-font-sizes-xs);font-weight:var(--sui-typography-font-weights-medium);line-height:1;white-space:nowrap;border:1px solid rgba(0,0,0,0);transition:background-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-badge--xxs{height:12px;min-width:12px;padding:0 4px;font-size:8px;gap:2px}.sui-badge--rounded{border-radius:var(--sui-radii-sm)}.sui-badge--default{background-color:var(--sui-atom-button-default-background);color:var(--sui-atom-button-default-text)}.sui-badge--default:hover{background-color:var(--sui-atom-button-default-background-hover)}.sui-badge--secondary{background-color:var(--sui-atom-button-secondary-background);color:var(--sui-atom-button-secondary-text)}.sui-badge--secondary:hover{background-color:var(--sui-atom-button-secondary-background-hover)}.sui-badge--muted{background-color:var(--sui-atom-button-muted-background);color:var(--sui-atom-button-muted-text)}.sui-badge--muted:hover{background-color:var(--sui-atom-button-muted-background-hover)}.sui-badge--outline{background-color:rgba(0,0,0,0);border-color:var(--sui-atom-button-outline-border);color:var(--sui-atom-button-outline-text)}.sui-badge--outline:hover{background-color:var(--sui-atom-button-outline-background-hover)}.sui-badge--destructive{background-color:var(--sui-atom-button-destructive-background);color:var(--sui-atom-button-destructive-text)}.sui-badge--destructive:hover{background-color:var(--sui-atom-button-destructive-background-hover)}.sui-badge--warning{background:var(--sui-atom-button-warning-background);color:var(--sui-atom-button-warning-text)}.sui-badge--warning:hover{background:var(--sui-atom-button-warning-background-hover)}.sui-badge--amber{background-color:color-mix(in srgb, var(--sui-colors-amber) 22%, transparent);color:var(--sui-semantic-accent-default)}.sui-badge--amber:hover{background-color:color-mix(in srgb, var(--sui-colors-amber) 32%, transparent)}.sui-badge--ghost{background-color:rgba(0,0,0,0);color:var(--sui-atom-button-ghost-text)}.sui-badge--ghost:hover{background-color:var(--sui-atom-button-ghost-background-hover)}.sui-badge--subtle{background-color:var(--sui-semantic-background-surface-alt);border-color:var(--sui-semantic-border-muted);border-radius:var(--sui-radii-sm);box-shadow:var(--sui-shadows-xs);color:var(--sui-semantic-accent-default);vertical-align:middle}.sui-image{display:inline-block;box-shadow:var(--sui-atom-box-gradient-shadow)}.sui-image--square{border-radius:0}.sui-image--circle{border-radius:var(--sui-radii-full)}.sui-image--rounded-sm{border-radius:var(--sui-radii-sm)}.sui-image--rounded-md{border-radius:var(--sui-radii-md)}.sui-image--rounded-lg{border-radius:var(--sui-radii-lg)}.sui-image--rounded-xl{border-radius:var(--sui-radii-xl)}.sui-image--rounded-2xl{border-radius:var(--sui-radii-2xl)}.sui-image--cover{object-fit:cover}.sui-image--contain{object-fit:contain}.sui-image--fill{object-fit:fill}.sui-labeled-image{display:flex;flex-direction:column;align-items:center;gap:24px;cursor:pointer}.sui-labeled-image__title{font-family:var(--sui-typography-fonts-primary);font-weight:var(--sui-typography-font-weights-bold);font-size:var(--sui-typography-font-sizes-base);line-height:var(--sui-typography-line-heights-base);letter-spacing:.1em;text-align:center;color:var(--sui-semantic-accent-default)}.sui-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;font-family:var(--sui-typography-fonts-primary);font-size:var(--sui-typography-font-sizes-sm);font-weight:var(--sui-typography-font-weights-normal);line-height:var(--sui-typography-line-heights-base);letter-spacing:.2em;text-transform:uppercase;color:var(--sui-semantic-accent-default)}.sui-breadcrumb__item{display:inline-flex;align-items:center}.sui-breadcrumb__link{color:inherit;text-decoration:none}.sui-breadcrumb__link:hover{text-decoration:underline}.sui-breadcrumb__separator{display:inline-flex;align-items:center;color:var(--sui-semantic-accent-default);padding:0 6px}.sui-breadcrumb__current{color:inherit}.sui-table{width:100%;font-family:var(--sui-typography-fonts-primary);border-collapse:separate;border-spacing:0}.sui-table--sticky .sui-table__header-cell{position:-webkit-sticky;position:sticky;top:0;z-index:1;background-attachment:fixed}.sui-table__header-cell{font-size:var(--sui-typography-font-sizes-xs);font-weight:var(--sui-typography-font-weights-bold);color:var(--sui-semantic-accent-default);text-transform:uppercase;letter-spacing:.2em;text-align:left;padding:12px;background:var(--sui-atom-table-header-background)}.sui-table__header-cell:first-child{border-radius:var(--sui-radii-sm) 0 0 var(--sui-radii-sm)}.sui-table__header-cell:last-child{border-radius:0 var(--sui-radii-sm) var(--sui-radii-sm) 0}.sui-table__header-gap td{padding:0;height:12px;border:none}.sui-table__row{color:var(--sui-semantic-foreground-tertiary)}.sui-table__row *{color:inherit}.sui-table__row--accent{color:var(--sui-semantic-accent-default);font-weight:var(--sui-typography-font-weights-bold)}.sui-table__row--accent *{color:inherit}.sui-table__row--clickable{cursor:pointer}.sui-table__row--clickable:hover{background-color:var(--sui-semantic-background-surface)}.sui-table__cell{padding:12px;font-size:var(--sui-typography-font-sizes-sm);line-height:var(--sui-typography-line-heights-base);border-bottom:1px solid var(--sui-semantic-border-muted);border-right:1px solid var(--sui-semantic-border-muted)}.sui-table__cell:first-child{border-left:1px solid var(--sui-semantic-border-muted)}.sui-table__cell:last-child{border-right:1px solid var(--sui-semantic-border-muted)}.sui-table tbody tr:first-child .sui-table__cell{border-top:1px solid var(--sui-semantic-border-muted)}.sui-table tbody tr:first-child .sui-table__cell:first-child{border-top-left-radius:var(--sui-radii-lg)}.sui-table tbody tr:first-child .sui-table__cell:last-child{border-top-right-radius:var(--sui-radii-lg)}.sui-table tbody tr:last-child .sui-table__cell:first-child{border-bottom-left-radius:var(--sui-radii-lg)}.sui-table tbody tr:last-child .sui-table__cell:last-child{border-bottom-right-radius:var(--sui-radii-lg)}.sui-table__row--spacer .sui-table__spacer-cell{padding:0;height:12px;border:none !important;background-color:var(--sui-semantic-background-page)}.sui-table__row--spacer .sui-table__spacer-cell--with-content{height:auto;padding:12px}.sui-table__row--spacer+.sui-table__row .sui-table__cell{border-top:1px solid var(--sui-semantic-border-muted)}.sui-table__row--spacer+.sui-table__row .sui-table__cell:first-child{border-top-left-radius:var(--sui-radii-lg)}.sui-table__row--spacer+.sui-table__row .sui-table__cell:last-child{border-top-right-radius:var(--sui-radii-lg)}.sui-table__row:has(+.sui-table__row--spacer) .sui-table__cell:first-child{border-bottom-left-radius:var(--sui-radii-lg)}.sui-table__row:has(+.sui-table__row--spacer) .sui-table__cell:last-child{border-bottom-right-radius:var(--sui-radii-lg)}.sui-table__section-icon{display:inline-flex;align-items:center;margin-right:8px}@keyframes sui-draggable-spring-exit{0%{opacity:1;transform:scale(1)}15%{opacity:1;transform:scale(1.15)}40%{opacity:1;transform:scale(0.95)}60%{opacity:.7;transform:scale(0.5)}100%{opacity:0;transform:scale(0)}}@keyframes sui-draggable-spring-enter{0%{opacity:0;transform:scale(0)}40%{opacity:1;transform:scale(1.2)}60%{opacity:1;transform:scale(0.9)}80%{opacity:1;transform:scale(1.05)}100%{opacity:1;transform:scale(1)}}.sui-draggable-group__item--exiting{animation:sui-draggable-spring-exit 300ms cubic-bezier(0.4, 0, 0.2, 1) both;pointer-events:none}.sui-draggable-group__item--entering{animation:sui-draggable-spring-enter 400ms cubic-bezier(0.34, 1.56, 0.64, 1) both}.sui-button-card{display:inline-flex;align-items:center;justify-content:center;width:144px;height:96px;border:none;border-radius:var(--sui-radii-lg);background:var(--sui-atom-button-card-background);color:var(--sui-atom-button-card-text);font-family:var(--sui-typography-fonts-primary);font-weight:var(--sui-typography-font-weights-medium);font-size:var(--sui-typography-font-sizes-lg);line-height:var(--sui-typography-line-heights-base);padding:12px;text-align:center;cursor:pointer;transition:box-shadow var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease),transform var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-button-card:hover{background:var(--sui-atom-button-card-background-hover);box-shadow:var(--sui-atom-button-card-shadow);transform:translateY(-2px)}.sui-button-card:active{transform:translateY(0);box-shadow:none}.sui-button-card:focus-visible{outline:2px solid var(--sui-semantic-border-focus);outline-offset:2px}.sui-input{position:relative;display:flex;align-items:center;min-height:48px;background:var(--sui-atom-primary-input-background);border:1px solid var(--sui-atom-primary-input-border);border-radius:var(--sui-radii-sm);padding:0 12px;gap:12px;transition:border-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-input--square{border-radius:var(--sui-radii-sm)}.sui-input--circle{border-radius:var(--sui-radii-full)}.sui-input--rounded-sm{border-radius:var(--sui-radii-sm)}.sui-input--rounded-md{border-radius:var(--sui-radii-md)}.sui-input--rounded-lg{border-radius:var(--sui-radii-lg)}.sui-input:focus-within{border-color:var(--sui-atom-primary-input-border-focus)}.sui-input__field{flex:1 1;min-width:0;height:100%;background:rgba(0,0,0,0);border:none;outline:none;font-family:var(--sui-typography-fonts-primary);font-size:var(--sui-typography-font-sizes-sm);font-weight:var(--sui-typography-font-weights-normal);color:var(--sui-atom-primary-input-text)}.sui-input__field::placeholder{color:var(--sui-atom-primary-input-placeholder)}.sui-input__actions{display:flex;align-items:center;gap:12px;flex-shrink:0}.sui-otp-input{display:inline-flex;align-items:center;gap:24px}.sui-otp-input__group{display:inline-flex;align-items:center}.sui-otp-input__separator{display:inline-flex;align-items:center;justify-content:center;color:var(--sui-semantic-foreground-muted);font-size:var(--sui-typography-font-sizes-lg);-webkit-user-select:none;-moz-user-select:none;user-select:none}.sui-otp-input__slot{position:relative;display:inline-flex;align-items:center;justify-content:center;width:72px;height:72px}.sui-otp-input__field{position:absolute;inset:0;width:100%;height:100%;padding:0;text-align:center;font-family:var(--sui-typography-fonts-primary);font-weight:var(--sui-typography-font-weights-extrabold);font-size:var(--sui-typography-font-sizes-5xl);line-height:100%;color:rgba(0,0,0,0);caret-color:var(--sui-semantic-accent-default);background:rgba(0,0,0,0);border:none;outline:none}.sui-otp-input__field::-webkit-outer-spin-button,.sui-otp-input__field::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.sui-otp-input__field:disabled{opacity:.5;cursor:not-allowed}.sui-otp-input__placeholder{position:absolute;inset:0;display:inline-flex;align-items:center;justify-content:center;color:color-mix(in srgb, var(--sui-semantic-foreground-default) 10%, transparent);pointer-events:none;animation:sui-otp-fade-in var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease) both}.sui-otp-input__placeholder svg{width:30px;height:29px}.sui-otp-input__display{position:absolute;inset:0;display:inline-flex;align-items:center;justify-content:center;font-family:var(--sui-typography-fonts-primary);font-weight:var(--sui-typography-font-weights-extrabold);font-size:var(--sui-typography-font-sizes-5xl);line-height:100%;background:linear-gradient(91.03deg, #113979 22.83%, #315795 79.5%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0);color:rgba(0,0,0,0);pointer-events:none;animation:sui-otp-pop-in 250ms cubic-bezier(0.34, 1.56, 0.64, 1) both}.sui-otp-input--base{gap:18px}.sui-otp-input--base .sui-otp-input__slot{width:60px;height:60px}.sui-otp-input--base .sui-otp-input__field,.sui-otp-input--base .sui-otp-input__display{font-size:var(--sui-typography-font-sizes-3xl)}.sui-otp-input--base .sui-otp-input__placeholder svg{width:24px;height:24px}.sui-otp-input--sm{gap:12px}.sui-otp-input--sm .sui-otp-input__slot{width:48px;height:48px}.sui-otp-input--sm .sui-otp-input__field,.sui-otp-input--sm .sui-otp-input__display{font-size:var(--sui-typography-font-sizes-2xl)}.sui-otp-input--sm .sui-otp-input__placeholder svg{width:18px;height:18px}@keyframes sui-otp-fade-in{from{opacity:0}to{opacity:1}}@keyframes sui-otp-pop-in{0%{opacity:0;transform:scale(0.5)}60%{transform:scale(1.1)}100%{opacity:1;transform:scale(1)}}.sui-progress-bar{--sui-progress-bar-height: 6px;position:relative;display:flex;align-items:center;width:100%;height:var(--sui-progress-bar-height)}.sui-progress-bar--interactive{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;outline:none}.sui-progress-bar--interactive:focus-visible .sui-progress-bar__knob{box-shadow:var(--sui-atom-progress-bar-knob-shadow),0 0 0 3px color-mix(in srgb, var(--sui-semantic-accent-default) 30%, transparent)}.sui-progress-bar--disabled{opacity:.5;cursor:not-allowed}.sui-progress-bar--dragging .sui-progress-bar__fill,.sui-progress-bar--dragging .sui-progress-bar__knob{transition:none}.sui-progress-bar__track{position:relative;width:100%;height:100%;background-color:var(--sui-atom-progress-bar-track);border-radius:var(--sui-radii-full);overflow:hidden}.sui-progress-bar__fill{height:100%;background-color:var(--sui-atom-progress-bar-fill);border-radius:var(--sui-radii-full);transition:width var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-progress-bar__knob{position:absolute;top:50%;width:calc(var(--sui-progress-bar-height) + 8px);height:calc(var(--sui-progress-bar-height) + 8px);min-width:12px;min-height:12px;background-color:var(--sui-atom-progress-bar-knob-background);border:1px solid var(--sui-atom-progress-bar-knob-border);border-radius:var(--sui-radii-full);box-shadow:var(--sui-atom-progress-bar-knob-shadow);transform:translate(-50%, -50%);pointer-events:none;transition:left var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-toast-stack{position:fixed;display:flex;flex-direction:column;gap:8px;z-index:1100;pointer-events:none}.sui-toast-stack>*{pointer-events:auto}.sui-toast-stack--bottom-center{bottom:24px;left:50%;transform:translateX(-50%);align-items:center}@media(max-width: 768px){.sui-toast-stack--bottom-center{bottom:84px;left:12px;right:12px;transform:none;align-items:stretch}}.sui-toast-stack--top-right{top:16px;right:16px;align-items:flex-end}@media(max-width: 768px){.sui-toast-stack--top-right{top:12px;left:12px;right:12px;align-items:stretch}}.sui-toast{display:inline-flex;align-items:center;gap:10px;min-height:44px;max-width:min(560px,100vw - 24px);padding:10px 12px 10px 16px;border-radius:var(--sui-radii-md);background:var(--sui-semantic-background-page);color:var(--sui-semantic-foreground-default);border:1px solid var(--sui-semantic-border-muted);box-shadow:var(--sui-shadows-lg);font-family:var(--sui-typography-fonts-primary);font-size:var(--sui-typography-font-sizes-sm);line-height:1.4;opacity:0;transform:translateY(8px);animation:sui-toast-enter var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease) forwards;transition:opacity var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease),transform var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-toast--leaving{animation:none;opacity:0;transform:translateY(8px)}.sui-toast__icon{flex-shrink:0}.sui-toast__message{flex:1 1;min-width:0;text-align:left}.sui-toast__close{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;background:rgba(0,0,0,0);border:0;border-radius:var(--sui-radii-sm);color:var(--sui-semantic-foreground-tertiary);cursor:pointer;transition:color var(--sui-transitions-duration-fast) var(--sui-transitions-timing-ease),background-color var(--sui-transitions-duration-fast) var(--sui-transitions-timing-ease)}.sui-toast__close:hover{color:var(--sui-semantic-foreground-default);background-color:var(--sui-semantic-background-surface)}.sui-toast__close:focus-visible{outline:2px solid var(--sui-semantic-accent-default);outline-offset:1px}.sui-toast--info .sui-toast__icon{color:var(--sui-semantic-foreground-tertiary)}.sui-toast--success{border-left:3px solid var(--sui-colors-success)}.sui-toast--success .sui-toast__icon{color:var(--sui-colors-success)}.sui-toast--error{border-left:3px solid var(--sui-colors-error)}.sui-toast--error .sui-toast__icon{color:var(--sui-colors-error)}.sui-toast--warning{border-left:3px solid var(--sui-colors-warning)}.sui-toast--warning .sui-toast__icon{color:var(--sui-colors-warning)}@keyframes sui-toast-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.sui-circular-progress{position:relative;display:inline-flex;align-items:center;justify-content:center}.sui-circular-progress__svg{position:absolute;inset:0;transform:rotate(-90deg)}.sui-circular-progress__track{stroke:var(--sui-semantic-border-muted)}.sui-circular-progress__indicator{stroke:var(--sui-semantic-accent-default);transition:stroke-dashoffset var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-circular-progress__content{position:relative;display:inline-flex;align-items:center;justify-content:center}@media(prefers-reduced-motion: reduce){.sui-circular-progress__indicator{transition:none}}.sui-checkbox{position:relative;display:inline-flex;align-items:center;gap:var(--sui-spacing-2);cursor:pointer;font-family:var(--sui-typography-fonts-primary)}.sui-checkbox--label-left{flex-direction:row-reverse}.sui-checkbox--disabled{cursor:not-allowed;opacity:.5}.sui-checkbox__input{position:absolute;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}.sui-checkbox__box{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:12px;height:12px;border-radius:var(--sui-radii-sm);background:var(--sui-atom-checkbox-background);border:1px solid var(--sui-atom-checkbox-border);transition:background-color var(--sui-transitions-duration-fast) var(--sui-transitions-timing-ease),border-color var(--sui-transitions-duration-fast) var(--sui-transitions-timing-ease)}.sui-checkbox__check{width:10px;height:10px;color:var(--sui-atom-checkbox-check-icon);opacity:0;transition:opacity var(--sui-transitions-duration-fast) var(--sui-transitions-timing-ease)}.sui-checkbox__label{font-weight:var(--sui-typography-font-weights-medium);font-size:var(--sui-typography-font-sizes-xs);line-height:1.5;letter-spacing:.005em;vertical-align:middle;color:var(--sui-atom-checkbox-label);transition:color var(--sui-transitions-duration-fast) var(--sui-transitions-timing-ease)}.sui-checkbox__input:checked~.sui-checkbox__box{background:var(--sui-atom-checkbox-checked-background);border-color:var(--sui-atom-checkbox-checked-background)}.sui-checkbox__input:checked~.sui-checkbox__box .sui-checkbox__check{opacity:1}.sui-checkbox__input:checked~.sui-checkbox__label{color:var(--sui-atom-checkbox-label-checked)}.sui-checkbox__input:focus-visible~.sui-checkbox__box{outline:2px solid var(--sui-semantic-border-focus);outline-offset:2px}@media(prefers-reduced-motion: reduce){.sui-checkbox__box,.sui-checkbox__check,.sui-checkbox__label{transition:none}}.sui-toggle{--sui-toggle-track-w: 22px;--sui-toggle-track-h: 12px;--sui-toggle-handle: 8px;--sui-toggle-label-size: var(--sui-typography-font-sizes-xs);display:inline-flex;align-items:center;gap:var(--sui-spacing-2);cursor:pointer}.sui-toggle--sm{--sui-toggle-track-w: 22px;--sui-toggle-track-h: 12px;--sui-toggle-handle: 8px;--sui-toggle-label-size: var(--sui-typography-font-sizes-xs)}.sui-toggle--md{--sui-toggle-track-w: 33px;--sui-toggle-track-h: 18px;--sui-toggle-handle: 14px;--sui-toggle-label-size: var(--sui-typography-font-sizes-sm)}.sui-toggle--lg{--sui-toggle-track-w: 44px;--sui-toggle-track-h: 24px;--sui-toggle-handle: 20px;--sui-toggle-label-size: var(--sui-typography-font-sizes-base)}.sui-toggle--label-left{flex-direction:row-reverse}.sui-toggle--disabled{cursor:not-allowed;opacity:.5}.sui-toggle__label{font-family:var(--sui-typography-fonts-primary);font-weight:var(--sui-typography-font-weights-medium);font-size:var(--sui-toggle-label-size);line-height:1.5;letter-spacing:.005em;vertical-align:middle;color:var(--sui-atom-toggle-label);transition:color var(--sui-transitions-duration-fast) var(--sui-transitions-timing-ease)}.sui-toggle__input{position:absolute;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}.sui-toggle__track{position:relative;display:inline-block;width:var(--sui-toggle-track-w);height:var(--sui-toggle-track-h);border-radius:var(--sui-radii-full);background:var(--sui-atom-toggle-track);border:1px solid var(--sui-atom-toggle-border);box-sizing:border-box}.sui-toggle__handle{position:absolute;top:50%;left:1px;transform:translateY(-50%);width:var(--sui-toggle-handle);height:var(--sui-toggle-handle);border-radius:var(--sui-radii-full);background:var(--sui-atom-toggle-handle-off);transition:left var(--sui-transitions-duration-fast) var(--sui-transitions-timing-ease),background-color var(--sui-transitions-duration-fast) var(--sui-transitions-timing-ease)}.sui-toggle__input:checked~.sui-toggle__track .sui-toggle__handle{left:calc(100% - var(--sui-toggle-handle) - 1px);background:var(--sui-atom-toggle-handle-on)}.sui-toggle__input:checked~.sui-toggle__label{color:var(--sui-atom-toggle-label-checked)}.sui-toggle__input:focus-visible~.sui-toggle__track{outline:2px solid var(--sui-semantic-border-focus);outline-offset:2px}@media(prefers-reduced-motion: reduce){.sui-toggle__handle{transition:none}}.sui-skeleton-group{display:flex;min-width:0}.sui-skeleton{display:block;background-color:color-mix(in srgb, var(--sui-semantic-foreground-default) 7%, var(--sui-semantic-background-surface));border-radius:var(--sui-radii-sm)}.sui-skeleton--text{height:1em;margin-top:.2em;margin-bottom:.2em;border-radius:var(--sui-radii-sm);width:100%;transform-origin:0 55%;transform:scale(1, 0.75)}.sui-skeleton--circular{border-radius:var(--sui-radii-full)}.sui-skeleton--rectangular{border-radius:0}.sui-skeleton--rounded{border-radius:var(--sui-radii-md)}.sui-skeleton--pulse{animation:sui-skeleton-pulse var(--sui-transitions-duration-slow) var(--sui-transitions-timing-ease) infinite}.sui-skeleton--wave{position:relative;overflow:hidden}.sui-skeleton--wave::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--sui-semantic-background-page) 65%, transparent), transparent);animation:sui-skeleton-wave 1.6s linear infinite}@keyframes sui-skeleton-pulse{0%,100%{opacity:1}50%{opacity:.4}}@keyframes sui-skeleton-wave{100%{transform:translateX(100%)}}@media(prefers-reduced-motion: reduce){.sui-skeleton--pulse{animation:none}.sui-skeleton--wave::after{animation:none}}.sui-range{--sui-range-knob-size: 12px;position:relative;display:flex;align-items:center;width:100%;min-height:max(16px,var(--sui-range-knob-size));padding:0 calc(var(--sui-range-knob-size)/2);box-sizing:border-box}.sui-range--disabled{opacity:.5;cursor:not-allowed}.sui-range__input{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:pointer;z-index:2;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:rgba(0,0,0,0)}.sui-range__input:disabled{cursor:not-allowed}.sui-range__input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:var(--sui-range-knob-size);height:var(--sui-range-knob-size)}.sui-range__input::-moz-range-thumb{width:var(--sui-range-knob-size);height:var(--sui-range-knob-size);border:none}.sui-range__track{position:relative;flex:1 1 auto;height:1.5px;background:var(--sui-atom-range-track);pointer-events:none}.sui-range__tick{position:absolute;top:50%;transform:translate(-50%, -50%);width:1px;height:12px;background:var(--sui-atom-range-tick)}.sui-range__knob{position:absolute;top:50%;transform:translate(-50%, -50%);width:var(--sui-range-knob-size);height:var(--sui-range-knob-size);border-radius:var(--sui-radii-full);background:var(--sui-atom-range-knob-background);border:1px solid var(--sui-atom-range-knob-border);box-sizing:border-box;transition:left var(--sui-transitions-duration-fast) var(--sui-transitions-timing-ease)}.sui-range__input:focus-visible~.sui-range__track .sui-range__knob{box-shadow:0 0 0 3px color-mix(in srgb, var(--sui-atom-range-knob-background) 30%, transparent)}@media(prefers-reduced-motion: reduce){.sui-range__knob{transition:none}}.sui-accordion{display:flex;flex-direction:column;gap:var(--sui-spacing-2)}.sui-accordion-item{background-color:var(--sui-semantic-background-surface);border:1px solid var(--sui-semantic-border-muted);border-radius:var(--sui-radii-lg);overflow:hidden;transition:border-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease),box-shadow var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-accordion-item:hover{border-color:color-mix(in srgb, var(--sui-semantic-accent-default) 30%, transparent)}.sui-accordion-item--disabled{opacity:.6}.sui-accordion-item__header{display:flex;align-items:center;justify-content:space-between;gap:var(--sui-spacing-2);width:100%;padding:var(--sui-spacing-3) var(--sui-spacing-4);background:rgba(0,0,0,0);border:0;cursor:pointer;text-align:left;font-family:var(--sui-typography-fonts-primary);font-size:var(--sui-typography-font-sizes-base);font-weight:var(--sui-typography-font-weights-medium);color:var(--sui-semantic-foreground-default);transition:color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-accordion-item__header:hover{color:var(--sui-semantic-accent-default)}.sui-accordion-item__header:disabled{cursor:not-allowed}.sui-accordion-item__header:focus-visible{outline:2px solid var(--sui-semantic-border-focus);outline-offset:-2px}.sui-accordion-item__title{flex:1 1 auto;min-width:0}.sui-accordion-item__chevron{flex:0 0 auto;color:var(--sui-semantic-foreground-muted);transition:transform var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-accordion-item--open .sui-accordion-item__chevron{transform:rotate(180deg)}.sui-accordion-item__panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-accordion-item--open .sui-accordion-item__panel{grid-template-rows:1fr}.sui-accordion-item__clip{overflow:hidden;min-height:0}.sui-accordion-item__content{padding:var(--sui-spacing-3) var(--sui-spacing-4) var(--sui-spacing-4);border-top:1px solid var(--sui-semantic-border-muted);font-size:var(--sui-typography-font-sizes-base);line-height:1.6;color:var(--sui-semantic-foreground-secondary)}@media(prefers-reduced-motion: reduce){.sui-accordion-item__panel,.sui-accordion-item__chevron{transition:none}}.sui-bottom-sheet-backdrop{position:fixed;inset:0;background-color:rgba(0,0,0,.4);z-index:1000;opacity:0;pointer-events:none;transition:opacity var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease)}.sui-bottom-sheet-backdrop--open{opacity:1;pointer-events:auto}.sui-bottom-sheet{position:fixed;left:0;right:0;bottom:0;margin-inline:auto;max-width:640px;max-height:90vh;display:flex;flex-direction:column;border-top-left-radius:var(--sui-radii-6xl);border-top-right-radius:var(--sui-radii-6xl);border-bottom-left-radius:0;border-bottom-right-radius:0;box-shadow:var(--sui-shadows-lg);z-index:1001;transition:transform var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease);will-change:transform}.sui-bottom-sheet--dragging{transition:none}.sui-bottom-sheet__handle{display:flex;align-items:center;justify-content:center;padding:var(--sui-spacing-2) 0;cursor:-webkit-grab;cursor:grab;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.sui-bottom-sheet__handle:active{cursor:-webkit-grabbing;cursor:grabbing}.sui-bottom-sheet__grabber{width:36px;height:4px;border-radius:9999px;background:var(--sui-semantic-border-muted)}.sui-bottom-sheet__content{flex:1 1;min-height:0;overflow-y:auto;padding:var(--sui-spacing-4)}

/*!*******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[11].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[11].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[11].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[11].use[5]!./src/scss/style.scss ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/* stylelint-disable at-rule-no-unknown */
@import url("https://fonts.googleapis.com/css2?family=Baloo+Paaji+2:wght@400;500;600;700;800&display=swap");
*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
  padding: 0;
}

html {
  text-size-adjust: none;
}

body {
  min-height: 100vh;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

ul,
ol {
  list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.2;
  text-wrap: balance;
}

a:not([class]) {
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

input,
button,
textarea,
select {
  font: inherit;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

button {
  background: none;
  border: none;
  cursor: pointer;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

#root,
#__next,
#app-root {
  isolation: isolate;
}

/* stylelint-disable at-rule-no-unknown */
.auto-scroll-control {
  position: relative;
  display: flex;
  align-items: center;
  padding: var(--sui-spacing-2) 16px;
  border-radius: var(--sui-radii-xl);
  box-shadow: var(--sui-atom-box-gradient-shadow);
  color: var(--sui-semantic-accent-default);
}
.auto-scroll-control__close {
  position: absolute;
  top: -12px;
  right: -12px;
  color: var(--sui-semantic-accent-default);
  z-index: 1;
}
.auto-scroll-control__row {
  display: flex;
  align-items: center;
  gap: var(--sui-spacing-2);
  width: 100%;
}
.auto-scroll-control__panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease-in;
}
.auto-scroll-control__panel--visible {
  width: 100%;
  opacity: 1;
  pointer-events: all;
}
.auto-scroll-control__panel--hidden {
  max-width: 0;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
}
.auto-scroll-control__label {
  position: absolute;
  top: 6px;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-xs);
  font-weight: var(--sui-typography-font-weights-medium);
  line-height: 1.2;
  color: var(--sui-semantic-accent-default);
  white-space: nowrap;
}
.auto-scroll-control__slider {
  display: flex;
  align-items: center;
  gap: var(--sui-spacing-1);
  width: 100%;
}
.auto-scroll-control__track {
  flex: 1 1;
  width: 100%;
  min-width: 0;
}
@media (max-width: 768px) {
  .auto-scroll-control__track--hide-mobile {
    display: none;
  }
}
@media (max-width: 1024px) {
  .auto-scroll-control__track--hide-tablet {
    display: none;
  }
}
@media (min-width: 1024px) {
  .auto-scroll-control__track--hide-desktop {
    display: none;
  }
}
.auto-scroll-control__speed-btn {
  color: var(--sui-semantic-accent-default);
}
.auto-scroll-control__loop-btn[aria-pressed=false] {
  color: var(--sui-semantic-foreground-muted);
}
.auto-scroll-control__play-btn--pause {
  color: #CA8320;
}
.auto-scroll-control__play-btn--play {
  color: var(--sui-semantic-accent-default);
}

.auto-scroll-control-host--floating {
  position: fixed;
  bottom: 72px;
  right: var(--sui-spacing-4);
  z-index: 100;
}
@media (max-width: 768px) {
  .auto-scroll-control-host--floating {
    bottom: 124px;
  }
}
.auto-scroll-control-host--floating .auto-scroll-control {
  min-width: 280px;
}

.not-found-page {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 60vh;
  padding: 24px;
  text-align: center;
}
.not-found-page__code {
  font-family: var(--sui-typography-fonts-primary);
  font-size: 6rem;
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-accent-default);
  line-height: 1;
}
.not-found-page__title {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-xl);
  font-weight: var(--sui-typography-font-weights-semibold);
  color: var(--sui-semantic-foreground-default);
  margin: 8px 0 12px;
}
.not-found-page__desc {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-base);
  font-weight: var(--sui-typography-font-weights-normal);
  color: var(--sui-semantic-foreground-muted);
  margin: 0 0 24px;
  line-height: 1.5;
}
.not-found-page__actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}
.not-found-page__actions a {
  text-decoration: none;
}

#error-link {
  color: var(--sui-semantic-accent-default);
  cursor: pointer;
}
#error-link:hover {
  text-decoration: underline;
}

.floating-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 99;
  transition: bottom 0.2s ease;
}
@media (max-width: 768px) {
  .floating-actions {
    bottom: 84px;
  }
}

.footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 24px;
  border-top: 1px solid var(--sui-semantic-border-muted);
  border-radius: 0 0 var(--sui-radii-lg) var(--sui-radii-lg);
  margin-top: auto;
  background: var(--sui-semantic-background-page);
  gap: 24px;
}
.footer__help-button {
  padding-left: 6px;
  border-top-right-radius: var(--sui-radii-lg);
  border-bottom-right-radius: 100px;
  border-top-left-radius: 100px;
  border-bottom-left-radius: 100px;
}
.footer__left {
  display: flex;
  align-items: center;
  gap: 12px;
}
.footer__links {
  font-size: var(--sui-typography-font-sizes-xs);
  gap: 12px;
}
.footer__right {
  display: flex;
  align-items: center;
  gap: 12px;
}
.footer__copyright {
  font-size: var(--sui-typography-font-sizes-sm);
  line-height: var(--sui-typography-line-heights-sm);
  color: var(--sui-semantic-foreground-disabled);
  text-align: right;
}
@media (max-width: 1024px) {
  .footer__copyright {
    display: none;
  }
}
@media (display-mode: fullscreen) {
  .footer {
    display: none;
  }
}
@media (max-width: 768px) {
  .footer {
    display: none;
  }
}

.theme-khalis-blue-light .footer__links .sui-fateh-link {
  color: var(--sui-semantic-foreground-tertiary);
}

/* stylelint-disable at-rule-no-unknown */
@font-face {
  font-display: block;
  font-family: gurmukhi_normal;
  src: url("/assets/fonts/GurbaniAkharTrue.ttf?v=1");
}
@font-face {
  font-display: block;
  font-family: gurmukhi_heavy;
  src: url("/assets/fonts/GurbaniAkharHeavyTrue.ttf?v=1");
}
@font-face {
  font-display: block;
  font-family: gurmukhi_thick;
  src: url("/assets/fonts/GurbaniAkharThickTrue.ttf?v=1");
}
@font-face {
  font-display: block;
  font-family: anmol_lipi;
  src: url("/assets/fonts/AnmolLipiSG.ttf?v=1");
}
@font-face {
  font-display: block;
  font-family: anmol_bold;
  src: url("/assets/fonts/AnmolLipiBoldTrue.ttf?v=1");
}
@font-face {
  font-display: block;
  font-family: notosans;
  src: url("/assets/fonts/NotoSansGurmukhiTrue.ttf?v=1");
}
@font-face {
  font-display: block;
  font-family: notosans_bold;
  src: url("/assets/fonts/NotoSansGurmukhiBoldTrue.ttf?v=1");
}
@font-face {
  font-display: block;
  font-family: prabhki;
  src: url("/assets/fonts/PrabhkiTrue.ttf?v=1");
}
/* stylelint-disable no-descending-specificity */
.header {
  border-bottom: 1px solid var(--sui-semantic-border-muted);
  height: 72px;
  background: var(--sui-semantic-background-surface-alt);
  box-sizing: border-box;
  padding: 12px;
  position: relative;
  display: grid;
  grid-template-columns: 1fr minmax(auto, 745px) 1fr;
  align-items: center;
  transition: border-radius 0.3s ease;
}
@media (max-width: 1280px) {
  .header {
    grid-template-columns: 1fr minmax(auto, 632px) 1fr;
  }
}
@media (max-width: 1024px) {
  .header {
    grid-template-columns: 150px auto auto;
  }
}
@media (max-width: 768px) {
  .header {
    grid-template-columns: 1fr auto;
  }
}
.header > a {
  width: -moz-fit-content;
  width: fit-content;
}
.header.header--controller {
  grid-template-columns: auto 1fr auto;
}
@media (max-width: 768px) {
  .header.header--controller {
    grid-template-columns: 1fr auto;
  }
  .header.header--controller > a {
    display: none;
  }
  .header.header--controller .header-search {
    display: block;
  }
}
.header.header-clean {
  justify-content: center;
}
.header.header-clean .header-section--right {
  position: absolute;
  right: 12px;
}
body:has(.sui-sidebar:not(.sui-sidebar--closed)) .header {
  border-radius: var(--sui-radii-lg) var(--sui-radii-lg) 0 0;
}
.header-search {
  flex: 1 1;
}
.header-search .sui-search-bar:not(.sui-search-bar--inline) {
  padding: 0;
}
.header-close-search-btn {
  gap: 18px;
}
.header-close-search-btn svg {
  min-width: 30px;
}
.header-section {
  display: flex;
  align-items: center;
  gap: 12px;
}
@media (max-width: 1024px) {
  .header-section {
    gap: 6px;
  }
}
.header-section:last-child {
  justify-content: flex-end;
}
.header-clean {
  grid-template-columns: auto 1fr;
}
.header-clean .header-section:last-child {
  justify-content: flex-end;
}
.header-wrapper {
  display: flex;
  flex-wrap: wrap;
  max-width: 100%;
  align-items: center;
}
.fullscreen-view .header {
  display: none;
}
.header-clean {
  background-color: transparent;
  border: none;
}
.header-clean .header-title {
  margin: 0;
  visibility: hidden;
}

.header-search {
  position: relative;
  z-index: 70;
}
@media (max-width: 768px) {
  .header-search {
    display: none;
  }
}

.header-signin-btn {
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: normal;
}
@media (max-width: 768px) {
  .header-signin-btn {
    display: none;
  }
}

@media (max-width: 768px) {
  .header-menu-btn {
    display: none;
  }
}
.header-menu-btn-mobile {
  display: none;
}
@media (max-width: 768px) {
  .header-menu-btn-mobile {
    display: inline-flex;
  }
}

.header-title a {
  background-image: url(/assets/images/sttm_logo.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-block;
  height: 48px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  width: 100%;
}
.header-title a.doodle-link.bigger-image {
  display: inline-block;
  height: 88px;
}
.header-title a.doodle-link.icon {
  display: none;
}

#search-options {
  clear: both;
  padding: 0.5rem 0 0;
  width: 288px;
}
#search-options select {
  cursor: pointer;
  display: inline-block;
  margin: 0;
  margin-right: 1rem;
  width: calc(20% - 0.5rem);
}
#search-options select:last-child {
  margin-right: 0;
}

.submenu svg {
  fill: #797979;
  padding-top: 5px;
  transform: rotate(-90deg);
  vertical-align: middle;
}

.search-container-wrapper {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: center;
}

#search-container {
  border-radius: 2px;
  display: flex;
  flex-wrap: wrap;
  height: 48px;
  justify-content: flex-end;
  margin: 0;
  border: 1px solid #ddd;
  border-radius: 5px;
  background-color: rgba(250, 250, 250, 0.5);
  position: relative;
  transition: box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1);
  width: 100%;
}
#search-container.kb-active {
  height: inherit;
}
@media screen and (min-width: 55.99em) {
  .menu > li > #search-container.kb-active {
    height: 44px;
  }
}
#search-container > #suggestions {
  width: 100%;
}
#search-container .clear-search-toggle {
  background-color: #fff;
  width: 44px;
}
#search-container .clear-search-toggle svg {
  stroke: #999;
}
#search-container .clear-search-toggle.active svg {
  stroke: #f39c1d;
}
#search-container .clear-search-toggle:hover svg, #search-container .clear-search-toggle:focus svg, #search-container .clear-search-toggle:active svg {
  fill: #f39c1d;
  outline: none;
}
#search-container .clear-search-toggle {
  width: 22px;
}
#search-container .auto-detect-gurmukhi-toggle {
  align-self: center;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 1rem;
  height: 28px;
  margin: 0 8px 0 8px;
  padding: 4px 8px;
  transition: all 0.2s ease;
  width: auto;
  z-index: 1;
}
#search-container .auto-detect-gurmukhi-toggle .toggle-text {
  color: #999;
}
#search-container .auto-detect-gurmukhi-toggle.active {
  background-color: var(--sui-semantic-accent-default);
  border-color: rgb(30, 60, 82);
}
#search-container .auto-detect-gurmukhi-toggle.active .toggle-text {
  color: #fafafa;
}
#search-container .auto-detect-gurmukhi-toggle:hover {
  border-color: #f39c1d;
}
#search-container .auto-detect-gurmukhi-toggle:hover .toggle-text {
  color: #f39c1d;
}

#search {
  background: transparent;
  border: none;
  box-shadow: none;
  flex: 1 1 100px;
  font-size: 1.2em;
  font-weight: 300;
  height: 48px;
  margin: 0;
  padding: 0 24px;
  position: relative;
}
#search[value=""] + .clear-search-toggle {
  pointer-events: none;
  visibility: hidden;
}

.gurmukhi-keyboard {
  background-color: #fff;
  border-radius: 2px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08);
  font-size: 0;
  height: 0;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  position: relative;
  top: 0;
  transform: rotateX(-90deg) perspective(500px);
  transform-origin: top;
  transition: all 0.25s;
  width: 100%;
  z-index: 2;
}
.gurmukhi-keyboard.active {
  height: initial;
  opacity: 1;
  pointer-events: auto;
  transform: rotateX(0deg);
}
.gurmukhi-keyboard .keyboard-row-set {
  display: inline-block;
  width: 100%;
}
.gurmukhi-keyboard .keyboard-row:nth-child(2n-1) .keyboard-row-set:nth-child(1),
.gurmukhi-keyboard .keyboard-row:nth-child(2n) .keyboard-row-set:nth-child(2) {
  background-color: #ddd;
}
.gurmukhi-keyboard button {
  border: 1px solid rgba(0, 0, 0, 0.16);
  border-radius: 5px;
  color: #222;
  font-size: 1rem;
  line-height: 2;
  margin: 2px;
  outline: none;
  position: relative;
  text-align: center;
  transition: 0.3s border-color ease;
  width: calc(10% - 4px);
}
.gurmukhi-keyboard button:hover {
  border-color: #868383;
}
.gurmukhi-keyboard button.active {
  color: #f39c1d;
}
.gurmukhi-keyboard button[data-action=page-1] {
  padding-right: 5px;
  text-align: right;
}
.gurmukhi-keyboard button[data-action=page-1]::after {
  color: #000;
  content: "|";
  font-family: Helvetica Neue, Helvetica, Roboto, Arial, sans-serif;
  font-size: 0.8rem;
  position: absolute;
  right: -1px;
  top: 2px;
}
.gurmukhi-keyboard button[data-action=page-2] {
  padding-left: 4px;
  text-align: left;
}
.gurmukhi-keyboard button.matra-button {
  background-color: rgba(96, 200, 255, 0.3);
}

.header-menu {
  display: flex;
  flex-direction: column;
  margin-left: 8px;
  width: 93%;
}

#responsive-menu {
  width: 100%;
}

.search-form {
  max-width: 100vw;
  padding: 0 12px;
}

@media (max-width: 1024px) {
  .header-menu {
    margin-left: 0;
    width: 100%;
  }
  .header-title {
    float: none;
    margin: 5px 0 0;
    text-align: center;
    width: 100%;
  }
  .header-left .menu li {
    display: block;
  }
  .search-form {
    max-width: 100vw;
    padding: 0 12px;
  }
  .header #search-container {
    width: 100%;
  }
  .header #search {
    max-width: none;
  }
  #search-options {
    display: flex;
    margin: 0;
    padding: 0.5rem 8px 0;
    width: 100%;
  }
  #search-options select {
    width: 33.33%;
  }
}
@media (min-width: 768px) {
  .header .header-left {
    width: 100%;
  }
}
@media (min-width: 1024px) {
  .header-title a {
    background-image: url(/assets/images/sttm_icon.png);
    background-position: bottom;
    margin-top: 5px;
    width: 46px;
  }
  .header-title a.doodle-link.icon {
    display: inline-block;
  }
  .header-title a.doodle-link.bigger-image {
    display: none;
  }
  .search-form {
    max-width: 100%;
  }
  .header .header-left {
    margin-left: 1rem;
    width: auto;
  }
  .header #search-container {
    max-width: 288px;
  }
  .menu .submenu > .submenu-items {
    background-color: #fafafa;
    border: 1px solid #ddd;
    left: 0;
    position: absolute;
    top: 44px;
    width: max-content;
  }
  #responsive-menu {
    align-items: flex-start;
    display: flex;
    flex-grow: 1;
    width: calc(100% - 10px);
  }
  .submenu .submenu-items {
    display: none;
  }
  .submenu.opened .submenu-items {
    display: inline-block;
  }
  .submenu.opened svg {
    padding-bottom: 5px;
    padding-top: 0;
    transform: rotate(90deg);
  }
}
@media (min-width: 1024px) {
  .header #search-container {
    min-width: 465px;
  }
  .header #search {
    max-width: 100%;
  }
  #search-options {
    width: 100%;
  }
}
.header-shabad-panels {
  display: flex;
  align-items: center;
  gap: 4px;
}

.shabad-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  height: 72px;
  box-sizing: border-box;
  padding: 0 18px;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1001;
  background: var(--sui-semantic-background-surface-alt);
}
.shabad-header__left, .shabad-header__right {
  display: flex;
  align-items: center;
  gap: 12px;
}
.shabad-header__back {
  color: var(--sui-semantic-accent-default);
}
.shabad-header .sui-labeled-button__title {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  line-height: var(--sui-typography-line-heights-xs);
  color: color-mix(in srgb, var(--sui-semantic-accent-default) 70%, transparent);
  white-space: nowrap;
  gap: 0;
}

/* stylelint-disable font-family-no-missing-generic-family-keyword */
/* Global Helper Classes */
.gurbani-font {
  font-family: gurmukhi_heavy;
}

#search.gurbani-font {
  font-family: anmol_lipi !important;
}

.gurbani-display {
  font-size: 1.4em;
}

@media screen and (min-width: 46em) {
  .gurbani-display {
    font-size: 1.6em;
  }
}
.hidden {
  display: none;
}

.text-center {
  text-align: center;
}

.no-select {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Chrome/Safari/Opera */ /* Konqueror */
  -moz-user-select: none; /* Firefox */ /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
not supported by any browser */
}

.button {
  margin: 0;
}

@media screen and (max-width: 45.9em) {
  .show-on-desktop {
    display: none !important;
  }
}

.show-on-mobile {
  display: none !important;
}
@media screen and (max-width: 45.999999em) {
  .show-on-mobile {
    display: inline !important;
  }
}

/* Flex Helper Classes */
.flex {
  display: flex;
}

.flex.flex-direction-column {
  flex-direction: column;
}

.flex.justify-center {
  justify-content: center;
}

.flex.justify-start {
  justify-content: flex-start;
}

.flex.flex-end {
  justify-content: flex-end;
}

.flex.align-center {
  align-items: center;
}

.flex.align-start {
  align-items: flex-start;
}

.flex.wrap {
  flex-wrap: wrap;
}

.flex.space-around {
  justify-content: space-around;
}

.flex.space-between {
  justify-content: space-between;
}

.sr-only {
  border: 0;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.maryada {
  display: flex;
  flex-direction: column;
  gap: 36px;
  padding: 12px 12px 24px;
}
.maryada .maryada-hero {
  display: grid;
  grid-template-columns: 240px 1fr;
  grid-gap: 36px;
  gap: 36px;
  align-items: center;
  padding: 36px;
  border-radius: var(--sui-radii-2xl);
  background: radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--sui-semantic-accent-default) 8%, transparent), transparent 55%), var(--sui-semantic-background-surface-alt);
  border: 1px solid var(--sui-semantic-border-muted);
}
@media (max-width: 768px) {
  .maryada .maryada-hero {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 24px;
    text-align: center;
  }
}
.maryada .maryada-hero__media {
  display: flex;
  align-items: center;
  justify-content: center;
}
.maryada .maryada-hero__media img {
  width: 100%;
  max-width: 240px;
  height: auto;
  border-radius: var(--sui-radii-xl);
  box-shadow: var(--sui-shadows-lg);
}
.maryada .maryada-hero__body {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.maryada .maryada-hero__eyebrow {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-xs);
  font-weight: var(--sui-typography-font-weights-semibold);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sui-semantic-accent-default);
}
.maryada .maryada-hero__title {
  margin: 0;
  font-size: clamp(36px, 3.5vw, 52px);
  font-weight: 700;
  line-height: 1.1;
  color: var(--sui-semantic-foreground-default);
}
.maryada .maryada-hero__lang {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 6px;
}
@media (max-width: 768px) {
  .maryada .maryada-hero__lang {
    justify-content: center;
  }
}
.maryada .maryada-hero__lang-label {
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-tertiary);
}
.maryada .maryada-section-title {
  position: relative;
  margin: 0 0 18px;
  font-size: clamp(24px, 2vw, 30px);
  font-weight: 600;
  color: var(--sui-semantic-foreground-default);
  padding-left: 14px;
}
.maryada .maryada-section-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 4px;
  width: 4px;
  border-radius: var(--sui-radii-sm);
  background: var(--sui-semantic-accent-default);
}
.maryada .maryada-intro p {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-base);
  line-height: 1.7;
  color: var(--sui-semantic-foreground-secondary);
}
.maryada .maryada-chapters__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}
.maryada .maryada-chapters__heading {
  display: flex;
  align-items: center;
  gap: 12px;
}
.maryada .maryada-chapters__heading .maryada-section-title {
  margin: 0;
}
.maryada .maryada-chapters__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 24px;
  padding: 0 8px;
  border-radius: var(--sui-radii-full);
  background: color-mix(in srgb, var(--sui-semantic-accent-default) 12%, transparent);
  color: var(--sui-semantic-accent-default);
  font-size: var(--sui-typography-font-sizes-xs);
  font-weight: 600;
}
.maryada .maryada-chapters__actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.maryada .maryada-chapters__list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.maryada .maryada-chapters__list .sui-accordion-item__content {
  line-height: 1.75;
}
.maryada .maryada-chapters__list .sui-accordion-item__content > * + * {
  margin-top: 14px;
}
.maryada .maryada-chapters__list .sui-accordion-item__content p {
  margin: 0;
}
.maryada .maryada-chapters__list .sui-accordion-item__content h2, .maryada .maryada-chapters__list .sui-accordion-item__content h3, .maryada .maryada-chapters__list .sui-accordion-item__content h4, .maryada .maryada-chapters__list .sui-accordion-item__content h5 {
  margin: 24px 0 8px;
  color: var(--sui-semantic-foreground-default);
  font-weight: 600;
  line-height: 1.3;
}
.maryada .maryada-chapters__list .sui-accordion-item__content h2:first-child, .maryada .maryada-chapters__list .sui-accordion-item__content h3:first-child, .maryada .maryada-chapters__list .sui-accordion-item__content h4:first-child, .maryada .maryada-chapters__list .sui-accordion-item__content h5:first-child {
  margin-top: 0;
}
.maryada .maryada-chapters__list .sui-accordion-item__content h2 {
  font-size: 22px;
}
.maryada .maryada-chapters__list .sui-accordion-item__content h3 {
  font-size: 19px;
}
.maryada .maryada-chapters__list .sui-accordion-item__content h4 {
  font-size: 17px;
}
.maryada .maryada-chapters__list .sui-accordion-item__content h5 {
  font-size: 16px;
}
.maryada .maryada-chapters__list .sui-accordion-item__content ul, .maryada .maryada-chapters__list .sui-accordion-item__content ol {
  margin: 8px 0;
  padding-left: 24px;
}
.maryada .maryada-chapters__list .sui-accordion-item__content ul li, .maryada .maryada-chapters__list .sui-accordion-item__content ol li {
  margin-bottom: 6px;
}
.maryada .maryada-chapters__list .sui-accordion-item__content ul li:last-child, .maryada .maryada-chapters__list .sui-accordion-item__content ol li:last-child {
  margin-bottom: 0;
}
.maryada .maryada-chapters__list .sui-accordion-item__content ul ul, .maryada .maryada-chapters__list .sui-accordion-item__content ul ol, .maryada .maryada-chapters__list .sui-accordion-item__content ol ul, .maryada .maryada-chapters__list .sui-accordion-item__content ol ol {
  margin-top: 6px;
}
.maryada .maryada-chapters__list .sui-accordion-item__content a {
  color: var(--sui-semantic-accent-default);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.maryada .maryada-chapters__list .sui-accordion-item__content a:hover {
  text-decoration-thickness: 2px;
}
.maryada .maryada-chapters__list .sui-accordion-item__content strong, .maryada .maryada-chapters__list .sui-accordion-item__content b {
  font-weight: 600;
  color: var(--sui-semantic-foreground-default);
}
.maryada .maryada-chapters__list .sui-accordion-item__content em, .maryada .maryada-chapters__list .sui-accordion-item__content i {
  font-style: italic;
}
.maryada .maryada-chapters__list .sui-accordion-item__content blockquote {
  margin: 12px 0;
  padding: 8px 16px;
  border-left: 3px solid color-mix(in srgb, var(--sui-semantic-accent-default) 40%, transparent);
  color: var(--sui-semantic-foreground-tertiary);
  font-style: italic;
}
.maryada .maryada-chapters__list .sui-accordion-item__content code {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 0.9em;
  padding: 2px 6px;
  border-radius: var(--sui-radii-sm);
  background: color-mix(in srgb, var(--sui-semantic-accent-default) 8%, transparent);
  color: var(--sui-semantic-foreground-default);
}
.maryada .maryada-chapters__list .sui-accordion-item__content hr {
  margin: 18px 0;
  border: 0;
  border-top: 1px solid var(--sui-semantic-border-muted);
}
.maryada .maryada-chapters__list .maryada-chapter-title {
  display: inline-flex;
  align-items: center;
  gap: 14px;
}
.maryada .maryada-chapters__list .maryada-chapter-title__badge {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: var(--sui-radii-full);
  background: color-mix(in srgb, var(--sui-semantic-accent-default) 10%, transparent);
  color: var(--sui-semantic-accent-default);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: 700;
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}
.maryada .maryada-chapters__list .maryada-chapter-title__text {
  font-size: clamp(18px, 1.5vw, 20px);
  font-weight: 600;
  line-height: 1.3;
}

.maryada-skeleton__cover {
  aspect-ratio: 1;
  max-width: 240px;
  width: 100%;
}
.maryada-skeleton__eyebrow {
  height: 12px;
  max-width: 150px;
  width: 32%;
}
.maryada-skeleton__title {
  height: 48px;
  max-width: 440px;
  width: 78%;
}
.maryada-skeleton__lang-label {
  height: 16px;
  width: 72px;
}
.maryada-skeleton__lang-option {
  height: 22px;
  width: 62px;
}
.maryada-skeleton__lang-option--short {
  width: 54px;
}
.maryada-skeleton__section-title {
  height: 28px;
  width: 180px;
}
.maryada-skeleton__intro-lines {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.maryada-skeleton__intro-line {
  height: 16px;
  width: 100%;
}
.maryada-skeleton__intro-line--short {
  width: 72%;
}
.maryada-skeleton__action {
  height: 36px;
  width: 112px;
}
.maryada-skeleton__chapter {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 74px;
  padding: 18px 24px;
  border: 1px solid var(--sui-semantic-border-muted);
  border-radius: var(--sui-radii-xl);
  background: var(--sui-semantic-background-surface-alt);
}
.maryada-skeleton__chapter-title {
  display: flex;
  align-items: center;
  flex: 1 1;
  gap: 14px;
}
.maryada-skeleton__chapter-text {
  height: 20px;
  max-width: 320px;
  width: 42%;
}
@media (max-width: 768px) {
  .maryada-skeleton__eyebrow {
    margin-left: auto;
    margin-right: auto;
    width: 48%;
  }
  .maryada-skeleton__title {
    margin-left: auto;
    margin-right: auto;
    height: 38px;
    width: 86%;
  }
  .maryada-skeleton__chapter {
    padding-left: 18px;
    padding-right: 18px;
  }
  .maryada-skeleton__chapter-text {
    width: 68%;
  }
}

#metadata {
  align-items: center;
  display: flex;
  padding: 0;
  margin: 0;
  margin-top: var(--sui-spacing-4);
  width: 100%;
}
@media (max-width: 768px) {
  #metadata {
    margin-top: 0;
  }
}
#metadata:empty {
  display: none;
}
#metadata.metadata-shabad {
  max-width: 745px;
  margin-left: auto;
  margin-right: auto;
}
#metadata.metadata-hukamnama {
  flex-direction: column;
}

.meta {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-grow: 1;
  color: var(--sui-semantic-foreground-default);
  margin-top: 24px;
  width: 100%;
}

.meta-audio {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  max-width: 745px;
  margin-left: auto;
  margin-right: auto;
  color: var(--sui-semantic-foreground-default);
}
.meta-audio__main {
  display: flex;
  align-items: center;
  gap: 12px;
}
.meta-audio__bani-title {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-lg);
  color: var(--sui-semantic-accent-default);
}
.meta-audio__actions {
  margin-left: auto;
  display: flex;
  align-items: center;
}
.meta-audio__progress {
  width: 100%;
}
.meta-audio__progress .meta-audio__knob {
  width: 8px;
  height: 8px;
  min-width: 8px;
  min-height: 8px;
}
.meta-audio__ring .meta-audio__btn {
  border-radius: 9999px;
  color: var(--sui-semantic-accent-default);
}
.meta-audio__text {
  display: flex;
  flex-direction: column;
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-xs);
  line-height: var(--sui-typography-line-heights-sm);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  vertical-align: middle;
  color: var(--sui-semantic-accent-default);
}
.meta-audio__text a {
  color: inherit;
  text-decoration: underline;
}

.hukamnama-meta {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: var(--sui-spacing-3);
  width: 100%;
  height: 144px;
  max-width: 745px;
  padding: var(--sui-spacing-4) var(--sui-spacing-3);
  margin: 0 auto var(--sui-spacing-6);
  border: 1px solid var(--sui-atom-box-solid-border);
  border-radius: var(--sui-radii-lg);
  overflow: hidden;
}
@media (max-width: 768px) {
  .hukamnama-meta {
    width: 100%;
    height: 112px;
    padding: var(--sui-spacing-2) var(--sui-spacing-3);
  }
}
.hukamnama-meta::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(color-mix(in srgb, var(--sui-semantic-background-page) 15%, transparent), color-mix(in srgb, var(--sui-semantic-background-page) 15%, transparent)), url("/assets/images/harmandir-sahib-fog.png");
  background-size: cover;
  background-position: center 35%;
  background-repeat: no-repeat;
  filter: brightness(1.08);
  z-index: 0;
  pointer-events: none;
}
.hukamnama-meta > * {
  position: relative;
  z-index: 1;
}
.hukamnama-meta__main {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-4);
  min-width: 0;
}
@media (max-width: 768px) {
  .hukamnama-meta__main {
    gap: var(--sui-spacing-3);
  }
}
.hukamnama-meta__titles {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.hukamnama-meta__title {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-xl);
  line-height: var(--sui-typography-line-heights-md);
  letter-spacing: 0;
  color: var(--sui-semantic-accent-default);
  margin: 0;
}
.hukamnama-meta__subtitle {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-lg);
  line-height: var(--sui-typography-line-heights-sm);
  letter-spacing: 0;
  color: var(--sui-semantic-accent-default);
}
.hukamnama-meta__nav {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sui-spacing-1);
}
@media (max-width: 768px) {
  .hukamnama-meta__nav {
    gap: var(--sui-spacing-3);
  }
}
.hukamnama-meta__nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.hukamnama-meta__nav-link {
  display: inline-flex;
  line-height: 0;
}
.hukamnama-meta__nav-label {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-xs);
  color: color-mix(in srgb, var(--sui-semantic-accent-default) 50%, transparent);
}
@media (max-width: 768px) {
  .hukamnama-meta__nav-label {
    display: none;
  }
}
.hukamnama-meta__date-picker {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.hukamnama-meta__date-display {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-sm);
  line-height: 14px;
  letter-spacing: 0;
  color: var(--sui-semantic-accent-default);
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.hukamnama-meta__date-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
  padding: 0;
  border: 0;
}
.hukamnama-meta__date-input::-webkit-calendar-picker-indicator {
  display: none;
}

.theme-khalis-blue-dark .hukamnama-meta::before {
  background-image: url("/assets/images/harmandir-sahib-fog-dark.png");
  background-position: center 55%;
}

.hukamnama-skeleton {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 34px;
  padding-top: 8px;
  width: 100%;
}
.hukamnama-skeleton__verse {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.hukamnama-skeleton__gurbani {
  height: 44px;
  width: 72%;
}
.hukamnama-skeleton__transliteration {
  height: 20px;
  width: 54%;
}
.hukamnama-skeleton__translation {
  height: 20px;
  width: 78%;
}
@media (max-width: 768px) {
  .hukamnama-skeleton {
    gap: 28px;
  }
  .hukamnama-skeleton__gurbani {
    height: 36px;
    width: 88%;
  }
  .hukamnama-skeleton__transliteration {
    width: 72%;
  }
  .hukamnama-skeleton__translation {
    width: 92%;
  }
}

.shabad-settings {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  max-width: 745px;
  margin-left: auto;
  margin-right: auto;
}
.shabad-settings:not(:empty) {
  position: -webkit-sticky;
  position: sticky;
  top: 24px;
  z-index: 60;
  transition: padding 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}
.shabad-settings:not(:empty).shabad-settings--stuck {
  padding: 12px;
}
.shabad-settings:not(:empty).shabad-settings--stuck .sui-button {
  border-color: transparent;
}
.theme-khalis-blue-dark .shabad-settings:not(.shabad-settings--stuck) .sui-button:not(.shabad-settings__btn--open) {
  border-color: #1b2636;
}
.theme-khalis-blue-dark .shabad-settings:not(:empty).shabad-settings--stuck::before {
  border-color: #141f3b;
}
.shabad-settings__sentinel {
  height: 0;
  pointer-events: none;
}
.shabad-settings__left, .shabad-settings__right {
  display: flex;
  align-items: center;
  gap: 12px;
}
.shabad-settings .sui-button {
  color: color-mix(in srgb, var(--sui-semantic-accent-default) 80%, transparent);
}
.shabad-settings .sui-button.shabad-settings__btn--open {
  background-color: var(--sui-atom-button-light-background-hover);
  border-color: var(--sui-atom-button-light-background-hover);
}
.theme-khalis-blue-light .shabad-settings .sui-button.shabad-settings__btn--open {
  background-color: color-mix(in srgb, var(--sui-atom-button-light-background-hover) 88%, var(--sui-semantic-foreground-default));
  border-color: color-mix(in srgb, var(--sui-atom-button-light-background-hover) 88%, var(--sui-semantic-foreground-default));
}
.shabad-settings__popup .meanings-settings,
.shabad-settings__popup .display-settings {
  margin-top: 0;
}

.sui-tooltip__content:has(.shabad-settings__popup) {
  padding: 18px;
}
.sui-tooltip__content:has(.shabad-settings__popup) .sui-tooltip__close {
  top: 12px;
  right: 12px;
}

.shabad-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}
.shabad-actions .sui-button {
  color: color-mix(in srgb, var(--sui-semantic-accent-default) 50%, transparent);
}

.meanings-settings {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 24px;
  width: 100%;
}
.meanings-settings__group {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.meanings-settings__langs {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
.meanings-settings__inline {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
.meanings-settings__lang {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.meanings-settings__category {
  margin: 0;
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-medium);
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #666666;
}
.meanings-settings__children {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.meanings-settings__children .sui-checkbox {
  max-width: 144px;
}
.meanings-settings__heading {
  margin: 0;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-medium);
  line-height: 1;
  color: var(--sui-semantic-accent-default);
}
.meanings-settings__divider.sui-divider {
  border-top-color: var(--sui-semantic-accent-muted);
}
.meanings-settings__mahankosh .sui-toggle__label {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-medium);
  font-size: var(--sui-typography-font-sizes-sm);
  line-height: 1.5;
  letter-spacing: 0.005em;
  color: var(--sui-semantic-accent-default);
}
.meanings-settings__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.meanings-settings__badge-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  background: transparent;
  color: var(--sui-semantic-foreground-muted);
  cursor: pointer;
}

.display-settings {
  --gurbani-highlight: #d28423;
  display: flex;
  gap: 24px;
  margin-top: 24px;
  width: 100%;
}
.display-settings__section {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1 1;
}
.display-settings__section:first-child {
  flex: 0 0 auto;
}
.display-settings__divider.sui-divider {
  flex: 0 0 auto;
  align-self: stretch;
  width: 0;
  height: auto;
  border-top: none;
  border-left: 1px solid var(--sui-semantic-accent-muted);
}
.display-settings__blocks {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 12px;
  max-width: 156px;
}
.display-settings__block-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.display-settings__larivaar-samples {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  line-height: 1;
}
.display-settings__larivaar-sample--joined {
  color: var(--gurbani-highlight);
}
.display-settings__larivaar-sample--spaced {
  color: var(--sui-semantic-foreground-tertiary);
}
.display-settings__vishraam-styles {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
}
.display-settings__vishraam-sample {
  padding: 0 4px;
  border-radius: 2px;
}
.display-settings__vishraam-sample--colored-words {
  color: var(--gurbani-highlight);
}
.display-settings__vishraam-sample--gradient-bg {
  color: var(--sui-semantic-foreground-tertiary);
  background: linear-gradient(269.66deg, color-mix(in srgb, var(--gurbani-highlight) 40%, transparent) 0.15%, transparent 99.58%);
}
.display-settings__block {
  box-sizing: border-box;
  width: 156px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
  background: var(--sui-semantic-background-page);
  border: 1px solid var(--sui-semantic-border-muted);
  border-radius: var(--sui-radii-md);
}
.display-settings__block--clickable {
  cursor: pointer;
}
.display-settings__block--stacked {
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  height: auto;
  min-height: 60px;
  gap: 4px;
}
.display-settings__block--larivaar {
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  height: auto;
  min-height: 60px;
  gap: 6px;
}
.display-settings__block-label {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-medium);
  font-size: var(--sui-typography-font-sizes-sm);
  line-height: 1.5;
  letter-spacing: 0.005em;
  color: var(--sui-semantic-accent-default);
}
.display-settings__heading {
  margin: 0;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-medium);
  line-height: 1;
  color: var(--sui-semantic-accent-default);
}
.display-settings__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  height: 36px;
}
.display-settings__row .sui-range,
.display-settings__row .sui-simple-select-wrapper {
  flex: 0 0 160px;
  width: 160px;
}
.display-settings__align, .display-settings__stepper {
  display: flex;
  align-items: center;
}
.display-settings__align .sui-button svg {
  color: var(--sui-semantic-accent-default);
}
.display-settings__label {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-medium);
  line-height: 1;
  color: var(--sui-semantic-accent-default);
}

.reading-mode-settings__heading,
.audio-controls-settings__heading,
.others-settings__heading {
  margin: 0 0 12px;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-medium);
  line-height: 1;
  color: var(--sui-semantic-accent-default);
}

.reading-mode-settings .sui-toggle,
.audio-controls-settings .sui-toggle,
.others-settings .sui-toggle {
  width: 100%;
  justify-content: space-between;
}
.reading-mode-settings .sui-toggle__label,
.audio-controls-settings .sui-toggle__label,
.others-settings .sui-toggle__label {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-medium);
  line-height: 1;
  color: var(--sui-semantic-accent-default);
}

.audio-controls-settings,
.others-settings,
.reading-mode-settings {
  margin-top: 24px;
  width: 100%;
}
.audio-controls-settings__group,
.others-settings__group,
.reading-mode-settings__group {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.audio-controls-settings__row,
.others-settings__row,
.reading-mode-settings__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.audio-controls-settings__row .sui-range,
.audio-controls-settings__row .sui-simple-select-wrapper,
.others-settings__row .sui-range,
.others-settings__row .sui-simple-select-wrapper,
.reading-mode-settings__row .sui-range,
.reading-mode-settings__row .sui-simple-select-wrapper {
  flex: 0 0 160px;
  width: 160px;
}
.audio-controls-settings__label,
.others-settings__label,
.reading-mode-settings__label {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-medium);
  line-height: 1;
  color: var(--sui-semantic-accent-default);
}

.settings-panel-dialog.sui-dialog {
  max-width: min(840px, 92vw);
}

.settings-panel-dialog {
  display: flex;
  flex-direction: column;
  max-height: 504px;
  width: 100%;
}
.settings-panel-dialog__heading {
  display: flex;
  align-items: center;
  gap: 12px;
}
.settings-panel-dialog__title {
  margin: 0;
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-medium);
  font-size: var(--sui-typography-font-sizes-base);
  line-height: 1.5;
  letter-spacing: 0.005em;
  vertical-align: middle;
  color: var(--sui-semantic-foreground-tertiary);
}
.settings-panel-dialog .sui-dialog__header {
  padding: 18px;
  padding-bottom: 0;
}
.settings-panel-dialog .sui-dialog__body {
  flex: 1 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 18px;
}

.settings-dialog-layout {
  flex: 1 1;
  min-height: 0;
  display: flex;
  gap: 24px;
}

.settings-dialog-nav {
  flex-shrink: 0;
  width: 220px;
  overflow-y: auto;
  transition: width var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease);
}
.settings-dialog-nav.sui-section-nav--collapsed {
  width: 36px;
  align-items: center;
}

.settings-icon--display {
  width: 20px;
  height: 20px;
  min-width: 20px;
}
@media (max-width: 768px) {
  .settings-icon--display {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
  }
}

.settings-dialog-body {
  flex: 1 1;
  min-width: 0;
  position: relative;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 24px;
  scrollbar-width: thin;
  scrollbar-color: var(--sui-semantic-border-muted) transparent;
}
.settings-dialog-body::-webkit-scrollbar {
  width: 4px;
}
.settings-dialog-body::-webkit-scrollbar-track {
  background: transparent;
}
.settings-dialog-body::-webkit-scrollbar-thumb {
  background-color: var(--sui-semantic-border-muted);
  border-radius: 9999px;
}
.settings-dialog-body .meanings-settings,
.settings-dialog-body .display-settings,
.settings-dialog-body .reading-mode-settings,
.settings-dialog-body .audio-controls-settings,
.settings-dialog-body .others-settings,
.settings-dialog-body .keyboard-shortcuts-settings {
  margin-top: 0;
}

.settings-dialog-section__title {
  margin: 0 0 12px;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-base);
  font-weight: var(--sui-typography-font-weights-semibold);
  line-height: 1.2;
  color: var(--sui-semantic-accent-default);
}

.settings-dialog-section > *:not(.settings-dialog-section__title) {
  margin-top: 0;
}

.actions-settings {
  width: 100%;
}
.actions-settings__group {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.actions-settings__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.actions-settings__label {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-medium);
  line-height: 1;
  color: var(--sui-semantic-accent-default);
}

.settings-dialog-divider.sui-divider {
  flex-shrink: 0;
  border-top-color: var(--sui-semantic-accent-muted);
}

.settings-dialog-footer {
  flex-shrink: 0;
  display: flex;
  justify-content: flex-end;
  padding-top: 12px;
}

.keyboard-shortcuts-settings {
  width: 100%;
}
.keyboard-shortcuts-settings__heading {
  margin: 0 0 12px;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-medium);
  line-height: 1;
  color: var(--sui-semantic-accent-default);
}
.keyboard-shortcuts-settings__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.keyboard-shortcuts-settings__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.keyboard-shortcuts-settings__label {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-default);
}
.keyboard-shortcuts-settings__keys {
  display: flex;
  gap: 4px;
}
.keyboard-shortcuts-settings__key {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-xs);
  color: var(--sui-semantic-foreground-muted);
  background: var(--sui-semantic-background-glass);
  border: 1px solid var(--sui-semantic-border-muted);
  border-radius: var(--sui-radii-sm);
  padding: 2px 8px;
}

.settings-bottom-sheet .sui-bottom-sheet__content {
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.settings-sheet {
  flex: 1 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.settings-sheet__pills {
  gap: 12px;
  padding: 12px 24px;
  border-bottom: 1px solid var(--sui-semantic-border-muted);
}
.settings-sheet__pills-wrap {
  flex-shrink: 0;
}
.settings-sheet__pill.sui-button {
  flex-shrink: 0;
  border: none;
  border-radius: var(--sui-radii-full);
}
.settings-sheet__pill.sui-button:focus-visible {
  outline: none;
}
.settings-sheet__pill.sui-button.sui-button--plain {
  color: var(--sui-semantic-foreground-muted);
}
.settings-sheet__scroll {
  position: relative;
  flex: 1 1;
  min-height: 0;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 24px;
  scrollbar-width: thin;
  scrollbar-color: var(--sui-semantic-border-muted) transparent;
}
.settings-sheet__scroll::-webkit-scrollbar {
  width: 4px;
}
.settings-sheet__scroll::-webkit-scrollbar-track {
  background: transparent;
}
.settings-sheet__scroll::-webkit-scrollbar-thumb {
  background-color: var(--sui-semantic-border-muted);
  border-radius: 9999px;
}
.settings-sheet__scroll .meanings-settings,
.settings-sheet__scroll .display-settings,
.settings-sheet__scroll .reading-mode-settings,
.settings-sheet__scroll .audio-controls-settings,
.settings-sheet__scroll .others-settings,
.settings-sheet__scroll .keyboard-shortcuts-settings {
  margin-top: 0;
}
.settings-sheet .settings-dialog-footer {
  padding: 12px 24px;
}
.settings-sheet .display-settings {
  flex-direction: column;
}
.settings-sheet .display-settings__blocks {
  max-width: none;
}
.settings-sheet .display-settings__block {
  width: auto;
  min-width: 0;
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: calc(50% - 6px);
}
.settings-sheet .display-settings__divider.sui-divider {
  width: auto;
  height: 0;
  border-left: none;
  border-top: 1px solid var(--sui-semantic-accent-muted);
}

.settings-bottom-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  height: 48px;
  padding: 0 24px;
  border-radius: var(--sui-radii-6xl) var(--sui-radii-6xl) 0 0;
}
.settings-bottom-bar .sui-button {
  color: color-mix(in srgb, var(--sui-semantic-accent-default) 80%, transparent);
}
.settings-bottom-bar__divider {
  align-self: stretch;
  width: 1px;
  background: rgba(0, 0, 0, 0.1019607843);
}

.related-shabads-divider {
  width: unset;
  margin: 0 48px 12px;
}

.related-shabads {
  margin-top: 24px;
}
.fullscreen-view .related-shabads {
  display: none;
}
.related-shabads__heading {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-base);
  line-height: var(--sui-typography-line-heights-xl);
  letter-spacing: 0.1em;
  text-align: center;
  text-transform: uppercase;
  color: var(--sui-semantic-accent-default);
}
.related-shabads__list {
  display: flex;
  flex-direction: column;
}
.related-shabads__card {
  color: #222;
  cursor: pointer;
  text-decoration: none;
  width: 100%;
  border-radius: var(--sui-radii-md);
  transition: background-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease);
}
.related-shabads__card:hover {
  color: inherit;
  text-decoration: none;
  background-color: var(--sui-semantic-background-surface);
}
.related-shabads__card .sui-gurbani-display {
  color: var(--sui-semantic-foreground-secondary);
}
.related-shabads__show-more {
  display: flex;
  justify-content: center;
  margin: 24px 0;
}

.display .akhar {
  display: inline-block;
  transition: all 0.25s;
}
.display.split-view .split-view-baani {
  display: block;
}
.display.split-view .split-view-baani .line {
  margin-bottom: auto;
}
.display.split-view .split-view-baani .split-view-baani-wrapper {
  margin-top: 1em;
}
.display.translation-english .translation.english, .display.translation-punjabi .translation.punjabi, .display.translation-spanish .translation.spanish, .display.transliteration-english .transliteration.english {
  display: block;
}
.display.larivaar .akhar {
  padding-right: 0;
}
.display.larivaar.larivaar_assist .gurlipi .akhar:nth-of-type(2n),
.display.larivaar.larivaar_assist .unicode .akhar:nth-of-type(2n) {
  color: #f39c1d;
}

.padChedDiv {
  display: inline-block;
  white-space: pre;
}

@media print {
  * {
    color-adjust: exact !important;
    -webkit-print-color-adjust: exact !important;
  }
  .top-bar {
    border-bottom: none;
  }
  .top-bar-title {
    float: none;
    text-align: center;
    width: 100% !important;
  }
  .top-bar-title a {
    content: url(/assets/images/sttm_logo.png);
    height: 54px !important;
    width: auto !important;
  }
  #responsive-menu,
  #search-options,
  #controls-wrapper,
  #controls-menu,
  footer,
  .breadcrumb,
  .shabad-nav,
  .pagniation,
  .related-shabads,
  .sui-toast-stack,
  .fab,
  .shabad .line:hover .share,
  .sync-fullscreen-toggle {
    display: none !important;
  }
  .display .highlight {
    border-left: none;
    margin-left: 0;
    padding-left: 0;
  }
  .translation,
  .gurlipi {
    color: #8a8a8a !important;
  }
  .transliteration,
  .gurmukhi {
    color: #0a0a0a !important;
  }
  .shabad {
    display: block !important;
    line-height: 1.5 !important;
  }
  a[href] {
    text-decoration: none;
  }
  a[href]::after {
    content: "";
  }
  #freshworks-container {
    display: none;
  }
  @page {
    margin-bottom: 60px;
    margin-top: 60px;
  }
}
.gurbani-word {
  position: relative;
}
.gurbani-word .vishraam-icon {
  fill: #fafafa;
  width: 8px;
}
.gurbani-word .vishraam-icon-wrapper {
  align-items: center;
  border-radius: 50%;
  bottom: 90%;
  display: flex;
  justify-content: center;
  left: -8px;
  padding: 4px;
  position: absolute;
}

.larivaar-assist-word,
.larivaar-assist-word span {
  color: #f39c1d !important;
}

.search-results {
  margin: 0.5rem 0;
}

/* stylelint-disable no-descending-specificity */
li.search-result {
  list-style: none;
  position: relative;
}
li.search-result .sui-shabad-card {
  padding-left: 0;
  padding-right: 0;
}
li.search-result .sui-gurbani-display {
  color: var(--sui-semantic-accent-default);
  font-weight: var(--sui-typography-font-weights-medium);
  font-family: "Baloo Paaji 2", sans-serif !important;
}
li.search-result .sui-shabad-card__actions svg {
  color: var(--sui-semantic-accent-default);
}
li.search-result .search-result__link {
  text-decoration: none;
  color: inherit;
  display: block;
}
li.search-result .shabad-detail {
  flex-basis: 100%;
}
li.search-result .shabad-detail .shabad-title:hover * {
  color: #f39c1d;
}
li.search-result .shabad-detail .comments {
  color: #f39c1d;
  font-style: italic;
  word-break: break-word;
}
.english-translation-search li.search-result .gurbani-display, .main-letter-search li.search-result .gurbani-display {
  color: var(--sui-semantic-accent-default);
}
.english-translation-search li.search-result .search-highlight-word, .main-letter-search li.search-result .search-highlight-word {
  color: #222;
  font-size: 0.95em;
}
li.search-result .show-all-results {
  color: var(--sui-semantic-accent-default);
  text-align: center;
}
li.search-result .meta a {
  color: #797979;
  padding: 0 6px;
}
li.search-result .meta a:hover {
  color: #f39c1d;
}
li.search-result .search-result-icon-wrap {
  align-items: center;
  display: flex;
}
@-moz-document url-prefix() {
  li.search-result .search-result-icon-wrap svg {
    margin-top: 2px;
  }
}
li.search-result .search-result-icon-wrap .search-result-icon {
  fill: #797979;
  height: 0.75em;
  width: 0.75em;
}
li.search-result .search-result-icon-wrap .raag-title {
  color: #797979;
  cursor: -webkit-grab;
  cursor: grab;
  padding: 0 6px;
}
li.search-result p {
  margin-bottom: 0;
}
li.search-result .url {
  color: green;
  display: block;
  word-wrap: break-word;
}
li.search-result .preview-shabad-visible {
  opacity: 0.93;
  transition: opacity 0.25s linear;
  visibility: visible;
  z-index: 10;
}
li.search-result .preview-shabad-hidden {
  opacity: 0;
  transition: visibility 0s 0.25s, opacity 0.25s linear;
  visibility: hidden;
}
li.search-result .favourite-shabad-wrap {
  display: inline-flex;
  flex-basis: 40px;
  flex-direction: row;
}
li.search-result .favourite-shabad-wrap .icons,
li.search-result .favourite-shabad-wrap .labels {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
li.search-result .favourite-shabad-wrap .labels {
  color: #222;
  width: 13rem;
}
li.search-result .favourite-shabad-wrap .labels .remove-fav-title,
li.search-result .favourite-shabad-wrap .labels .multiview-title {
  width: max-content;
}
@media screen and (max-width: 37.5em) {
  li.search-result .favourite-shabad-wrap .labels {
    display: none;
  }
}
li.search-result .favourite-shabad-wrap .remove-fav-button svg {
  height: 1.5em;
  width: 1.5em;
}
li.search-result .favourite-shabad-wrap .date-time-icon {
  height: 1.5em;
  width: 1.5em;
}
li.search-result .favourite-shabad-wrap .date-time {
  font-size: 15px;
  font-weight: 600;
  width: max-content;
}

.larivaar:hover .larivaar-word {
  color: #f39c1d;
}
.display-visraams .larivaar:hover .larivaar-word {
  color: inherit;
}
.display-visraams .larivaar:hover .larivaar-word.search-highlight-word {
  color: var(--sui-semantic-accent-default);
}

.load-more {
  border-bottom: 1px solid #ddd;
  display: flex;
  justify-content: space-between;
  list-style: none;
  padding: 0.5rem 1rem;
  text-align: center;
}
.load-more:empty {
  display: none;
}

.answer-box {
  margin: 1rem 0;
  padding: 1rem;
  background-color: #f8f9fa;
  border-radius: 4px;
  border-left: 4px solid #007bff;
  width: calc(100% - 5rem);
  margin: auto;
}
.answer-box p::first-letter {
  text-transform: uppercase;
}
.answer-box .question {
  font-weight: 600;
  font-size: 1.2em;
}
.answer-box .answer {
  margin: 0;
  font-size: 1.1em;
  line-height: 1.5;
  color: #333;
}

.search-page {
  display: flex;
  justify-content: center;
  padding-top: 5vh;
  position: relative;
  z-index: 1;
}
.search-page .search-form {
  display: flex;
  flex-direction: column;
  max-width: 684px;
  width: 100%;
}
.search-page.doodle-logo-page {
  padding-top: 6vh;
}

.doodle-credit {
  color: #797979;
  font-size: 14px;
  margin: 0 auto 36px;
  text-align: center;
}

.search-options {
  display: flex;
  justify-content: space-between;
  margin: 1rem -5px;
}
.search-options .search-option {
  margin: 5px;
  position: relative;
  width: calc(50% - 10px);
}
.search-options .search-option select {
  margin-bottom: 0;
}

.searchPagination {
  display: flex;
  flex-wrap: wrap;
  margin: 10px -5px;
}
@media screen and (max-width: 46em) {
  .searchPagination {
    margin: 10px;
  }
}
.searchPaginationWrapper {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.searchPaginationButton {
  border: none;
  cursor: pointer;
  outline: none;
  padding: 10px;
}
.searchPaginationItem {
  align-items: center;
  border: 1px solid #cacaca;
  border-radius: 2px;
  color: #3c3c3c;
  cursor: pointer;
  display: flex;
  height: 50px;
  justify-content: center;
  margin: 5px;
  padding: 10px;
  width: 50px;
}
.searchPaginationItem:hover {
  background-color: var(--sui-semantic-accent-default);
  border-color: transparent;
  color: #fafafa;
}
.searchPaginationItemActive {
  background-color: var(--sui-semantic-accent-default);
  border-color: transparent;
  color: #fafafa;
}

.search-tab-header {
  display: flex;
  align-items: center;
  width: 100%;
}

.search-help-link {
  margin-left: auto;
  display: flex;
  align-items: center;
}
.search-help-link svg {
  color: var(--sui-semantic-accent-default);
}
.search-help-link:hover {
  color: var(--sui-atom-button-default-background-hover);
}

.search-bar-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 36px;
  width: 100%;
}
.search-bar-container .sui-search-bar {
  width: 100%;
  flex: 1 1;
}
.search-bar-container .search-bar-with-voice {
  width: 100%;
}
.search-bar-container .sui-fateh-tabs__panel {
  width: 100%;
}

.search-results-page {
  padding: 36px 24px;
}
.search-results-page a {
  text-decoration: none;
}

.warning-box {
  border: 1px solid var(--sui-semantic-border-muted);
  border-radius: var(--sui-radii-lg);
  margin: 0 auto 24px;
  max-width: 660px;
  padding: 12px 24px;
  text-align: center;
  background-color: var(--sui-semantic-background-surface);
  color: var(--sui-semantic-foreground-default);
  font-size: var(--sui-typography-font-sizes-sm);
}
.warning-box h4 {
  font-size: var(--sui-typography-font-sizes-base);
  font-weight: var(--sui-typography-font-weights-semibold);
  margin: 0 0 12px;
  color: var(--sui-semantic-accent-default);
}
.warning-box p {
  margin: 0;
}
.warning-box a {
  color: var(--sui-semantic-accent-default);
}

.search-results-display {
  display: flex;
  flex-direction: column;
  max-width: 660px;
  margin-left: auto;
  margin-right: auto;
}

.search-results-skeleton {
  margin-left: auto;
  margin-right: auto;
  max-width: 660px;
}
.search-results-skeleton__list {
  margin: 0;
  padding: 0;
}
.search-results-skeleton__item {
  list-style: none;
}
.search-results-skeleton__card {
  gap: 6px;
  padding-left: 0;
  padding-right: 0;
}
.search-results-skeleton__gurbani {
  height: 32px;
  max-width: 420px;
  width: 55%;
}
.search-results-skeleton__transliteration {
  height: 20px;
  max-width: 300px;
  width: 38%;
}
.search-results-skeleton__meta {
  height: 14px;
  max-width: 360px;
  width: 46%;
}
@media (max-width: 768px) {
  .search-results-skeleton__gurbani {
    width: 72%;
  }
  .search-results-skeleton__transliteration {
    width: 58%;
  }
  .search-results-skeleton__meta {
    width: 68%;
  }
}

.search-results-pagination {
  box-sizing: border-box;
  padding-left: 48px;
  padding-right: 48px;
}
@media (max-width: 768px) {
  .search-results-pagination {
    padding-left: 0;
    padding-right: 48px;
  }
}

.search-results-tabbed {
  max-width: 660px;
  margin: 0 auto 36px;
  width: 100%;
}

/* stylelint-disable at-rule-no-unknown */
.shabad-page-layout {
  display: flex;
  flex: 1 1;
  min-height: 0;
}
@media (min-width: 1280px) {
  .shabad-page-layout {
    padding-right: 72px;
  }
}

.shabad-rail.sui-side-nav {
  flex-shrink: 0;
  align-self: flex-start;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  height: calc(100dvh - var(--shabad-footer-inset, 0px));
  border-right: 1px solid var(--sui-semantic-border-muted);
}
@media (max-width: 1024px) {
  .shabad-rail.sui-side-nav {
    display: none;
  }
}

.bani-index-side-panel {
  flex-shrink: 0;
  width: 100%;
  max-width: 320px;
  height: 100%;
  overflow-y: auto;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
}
.bani-index-side-panel__close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
}
.bani-index-side-panel__title {
  margin: 0;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-lg);
  font-weight: var(--sui-typography-font-weights-medium);
  line-height: 1;
  color: var(--sui-semantic-accent-default);
}
.bani-index-side-panel__links {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.bani-index-side-panel__links a {
  text-decoration: none;
  text-transform: uppercase;
}

.shabad-page-content {
  flex: 1 1;
  min-width: 0;
  transition: flex 0.3s ease;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 24px;
  position: relative;
}
@media (max-width: 1024px) {
  .shabad-page-content {
    padding-top: 36px;
  }
}

.shabad-content-viewer {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1 1;
  min-width: 0;
  width: 100%;
  max-width: 745px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 36px;
  gap: 24px;
}
.shabad-content-viewer__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 24px 0;
}

.ang-skeleton {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 28px;
  width: 100%;
  padding-top: 10px;
}
@media (max-width: 768px) {
  .ang-skeleton {
    gap: 24px;
  }
}

.ang-skeleton__verse {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
}

.ang-skeleton__gurbani {
  height: 44px;
  width: 82%;
}

.ang-skeleton__transliteration {
  height: 20px;
  width: 62%;
}

.ang-skeleton__translation {
  height: 20px;
  width: 88%;
}

.ang-skeleton__verse:nth-child(2) .ang-skeleton__gurbani {
  width: 48%;
}

.ang-skeleton__verse:nth-child(2) .ang-skeleton__transliteration {
  width: 38%;
}

.ang-skeleton__verse:nth-child(2) .ang-skeleton__translation {
  width: 64%;
}

.ang-skeleton__verse:nth-child(3) .ang-skeleton__gurbani {
  width: 68%;
}

.ang-skeleton__verse:nth-child(4) .ang-skeleton__gurbani {
  width: 76%;
}

@media (max-width: 768px) {
  .ang-skeleton__gurbani {
    height: 36px;
    width: 92%;
  }
  .ang-skeleton__transliteration {
    width: 72%;
  }
  .ang-skeleton__translation {
    width: 96%;
  }
  .ang-skeleton__verse:nth-child(2) .ang-skeleton__gurbani {
    width: 58%;
  }
  .ang-skeleton__verse:nth-child(2) .ang-skeleton__transliteration {
    width: 48%;
  }
  .ang-skeleton__verse:nth-child(2) .ang-skeleton__translation {
    width: 76%;
  }
}
.shabad-skeleton {
  box-sizing: border-box;
  width: 100%;
  padding-top: 10px;
}
.shabad-skeleton__group {
  display: flex;
  flex-direction: column;
  gap: 28px;
  width: 100%;
}
.shabad-skeleton__divider {
  width: 100%;
  margin: 28px 0;
}
@media (max-width: 768px) {
  .shabad-skeleton__group {
    gap: 24px;
  }
  .shabad-skeleton__divider {
    margin: 24px 0;
  }
}

.shabad-skeleton__verse {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
}

.shabad-skeleton__gurbani {
  height: 44px;
  width: 82%;
}

.shabad-skeleton__transliteration {
  height: 20px;
  width: 62%;
}

.shabad-skeleton__translation {
  height: 20px;
  width: 88%;
}

.shabad-skeleton__verse:nth-child(2) .shabad-skeleton__gurbani {
  width: 48%;
}

.shabad-skeleton__verse:nth-child(2) .shabad-skeleton__transliteration {
  width: 38%;
}

.shabad-skeleton__verse:nth-child(2) .shabad-skeleton__translation {
  width: 64%;
}

.shabad-skeleton__verse:nth-child(3) .shabad-skeleton__gurbani {
  width: 68%;
}

.shabad-skeleton__verse:nth-child(4) .shabad-skeleton__gurbani {
  width: 76%;
}

@media (max-width: 768px) {
  .shabad-skeleton__gurbani {
    height: 36px;
    width: 92%;
  }
  .shabad-skeleton__transliteration {
    width: 72%;
  }
  .shabad-skeleton__translation {
    width: 96%;
  }
  .shabad-skeleton__verse:nth-child(2) .shabad-skeleton__gurbani {
    width: 58%;
  }
  .shabad-skeleton__verse:nth-child(2) .shabad-skeleton__transliteration {
    width: 48%;
  }
  .shabad-skeleton__verse:nth-child(2) .shabad-skeleton__translation {
    width: 76%;
  }
}
.shabad-nav-arrow {
  color: var(--sui-semantic-accent-default);
  padding: 0 12px;
  flex-shrink: 0;
}

div[tabindex="-1"]:focus {
  outline: 0;
}

blockquote {
  border: none;
  margin: 0 0 0.1rem;
  padding: 0 1.25rem 0 0;
}

.center-align {
  text-align: center;
}

.search-results blockquote {
  font-size: 0.85em;
  margin: 0 auto;
}

.gurlipi {
  display: inline-block;
}

.gurlipi-reading-mode {
  display: inline;
  font-size: 0.9em;
}

.shabad-nav a {
  color: #f39c1d;
  font-size: 50px;
  font-weight: 500;
  position: relative;
}
.shabad-nav a:hover {
  color: #797979;
}
.shabad-nav.right {
  margin-left: 12px;
  text-align: right;
}
.shabad-nav.left {
  margin-right: 12px;
}
.shabad-nav.disabled-nav a {
  color: #797979;
}
.shabad-nav.disabled-nav a svg {
  fill: #797979;
}

.pagination {
  align-items: center;
  display: flex;
  margin: 0;
  padding: 0 0.5em;
  width: 100%;
}
.pagination .shabad-nav {
  flex-grow: 1;
}
.pagination .shabad-nav a {
  align-items: center;
  display: flex;
}
.pagination .shabad-nav a:hover {
  background-color: initial;
}
.pagination .shabad-nav a i {
  flex-grow: 1;
}
.pagination .shabad-nav span {
  display: none;
  flex-grow: 1;
  font-size: 0.35em;
}
.pagination .shabad-nav.left span {
  margin-left: 10px;
}
.pagination .shabad-nav.right span {
  margin-right: 10px;
}

.fullscreen-view .metadata-hukamnama .shabad-nav {
  display: none;
}

.shabad-container {
  margin-top: 10px;
  width: 100%;
}

.sui-mixed-view-baani {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.shabad-content > div {
  margin-bottom: 1rem;
}

.shabad-content p,
.clear {
  clear: both;
  margin-bottom: 0;
}

.shabad-content blockquote {
  clear: both;
}

.shabad {
  display: flex;
  justify-content: center;
  margin: 0;
  width: 100%;
}
.shabad .line .gurbani-display {
  transition: font-size 0.25s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.shabad .line .gurbani-display span {
  transition: color 0.25s ease-in;
}
.shabad .line .share {
  background-color: rgba(255, 255, 255, 0.85);
  display: none;
  padding: 5px;
  position: absolute;
  right: 0;
  top: 0;
}
.shabad .line .share.showShare {
  align-items: center;
  display: flex;
}
.shabad .line .share a {
  color: #000;
  margin-left: 5px;
  padding: 0.5rem;
}
.shabad .line .share .copy:hover > svg {
  fill: #f39c1d;
}
.shabad .line .share .twitter:hover > svg {
  fill: #00aced;
}
.shabad .line .share .facebook:hover > svg {
  fill: #3b5998;
}
.shabad .split-view-baani-line.paragraph-mode > * {
  display: inline;
}
.shabad .split-view-baani-paragraph {
  margin-bottom: 4px;
  position: relative;
}
.shabad .split-view-baani-paragraph.paragraph-mode * {
  display: inline;
}
.shabad .split-view-baani-paragraph.paragraph-mode * .share {
  display: none;
}
.shabad .split-view-baani-translation {
  margin-bottom: 4px;
}
.shabad .split-view-baani-translation.paragraph-mode * {
  display: inline;
}
.shabad .split-view-baani-translation.paragraph-mode *.translation {
  margin: 0;
  margin-right: 4px;
  padding: 0;
}
.shabad .split-view-baani-transliteration {
  margin-bottom: 4px;
}
.shabad .split-view-baani-transliteration.paragraph-mode * {
  display: inline;
}
.shabad .split-view-baani-transliteration.paragraph-mode * .transliteration {
  margin-right: 4px;
}
.shabad .split-view-baani-steek {
  font-family: gurmukhi_normal, sans-serif;
  margin-bottom: 4px;
}
.shabad .split-view-baani-steek.paragraph-mode * {
  display: inline;
}
.shabad .split-view-baani-steek.paragraph-mode * .steek {
  margin-right: 4px;
}
.shabad .split-view-baani-wrapper.paragraph-mode {
  margin-bottom: 16px;
}
.shabad .reading-mode-baani-transliteration {
  display: inline;
}
.shabad .reading-mode-baani-transliteration .reading-mode-transliteration {
  display: inline;
}
.shabad .reading-mode-baani-translation {
  display: inline;
}
.shabad .reading-mode-baani-translation .reading-mode-translation {
  display: inline;
}
.shabad .reading-mode-baani-steek {
  display: inline;
  font-family: gurmukhi_normal, sans-serif;
}
.shabad .reading-mode-baani-steek .reading-mode-steek {
  display: inline;
}
.shabad .reading-mode-baani-steek .reading-mode-steek .gurlipi {
  display: inline;
}
.shabad .mixed-view-baani-paragraph {
  margin-bottom: 4px;
  position: relative;
}
.shabad .mixed-view-baani-paragraph.paragraph-mode * {
  display: inline;
}
.shabad .mixed-view-baani-paragraph.paragraph-mode * .share {
  display: none;
}
.shabad .mixed-view-baani-translation {
  margin-bottom: 4px;
}
.shabad .mixed-view-baani-translation.paragraph-mode * {
  display: inline;
}
.shabad .mixed-view-baani-translation.paragraph-mode * .translation {
  margin: 0;
  margin-right: 4px;
  padding: 0;
}
.shabad .mixed-view-baani-transliteration {
  margin-bottom: 4px;
}
.shabad .mixed-view-baani-transliteration.paragraph-mode * {
  display: inline;
}
.shabad .mixed-view-baani-transliteration.paragraph-mode * .transliteration {
  margin-right: 4px;
}
.shabad .mixed-view-baani-transliteration-shahmukhi {
  display: flex;
  justify-content: flex-end;
  width: 100%;
}
.shabad .mixed-view-baani-steek {
  font-family: gurmukhi_normal, sans-serif;
  margin-bottom: 4px;
}
.shabad .mixed-view-baani-steek-sahib {
  border-left: 5px double #d4c1ec;
  margin-left: 5px;
  padding-left: 10px;
}
.shabad .mixed-view-baani-steek.paragraph-mode * {
  display: inline;
}
.shabad .mixed-view-baani-steek.paragraph-mode * .transliteration {
  margin-right: 4px;
}
.shabad .mixed-view-baani-wrapper {
  margin-top: 15px;
  position: relative;
}
.shabad .mixed-view-baani-wrapper.paragraph-mode {
  margin-bottom: 16px;
}
.shabad .mixed-view-baani-wrapper.paragraph-mode div[class^=mixed-view-baani-translation-], .shabad .mixed-view-baani-wrapper.paragraph-mode div[class^=mixed-view-baani-transliteration-] {
  display: block;
  margin-bottom: 4px;
}
.shabad .full-screen-baani {
  padding: 60px 10px;
}
.shabad .full-screen-baani .line div {
  padding-bottom: 10px;
}

@media screen and (max-width: 450px) {
  .meta-hukamnama {
    display: initial;
    font-size: 0.9rem;
  }
  .meta h4 {
    font-size: 1.1rem;
  }
}
@media screen and (min-width: 350px) {
  .pagination .shabad-nav a span {
    display: initial;
  }
  .pagination .shabad-nav a i {
    flex-grow: 0;
  }
}
@media screen and (max-width: 730px) {
  .share,
  .line:hover .share {
    display: none !important;
  }
}
@media screen and (min-width: 46em) {
  .shabad-nav,
  .shabad-nav a {
    margin: 0;
  }
  .pagination .shabad-nav div {
    font-size: 0.5em;
    top: 0.75em;
  }
  .pagination .shabad-nav.left div {
    left: 3em;
  }
  .pagination .shabad-nav.right div {
    right: 3em;
  }
}
.list-of-shabads__divider {
  width: 100%;
  margin: var(--sui-spacing-2) 0;
}

.ang-separator {
  display: flex;
  align-items: center;
  gap: var(--sui-spacing-2);
  margin-top: 24px;
}
.ang-separator__line {
  flex: 1 1;
}
.ang-separator__label {
  margin: 0;
  text-align: center;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-semibold);
  color: var(--sui-semantic-foreground-muted);
  white-space: nowrap;
}

.react-date-picker__button {
  padding: 4px 6px 4px 0 !important;
}

/* ***** Sharing Buttons *****
  https://simplesharingbuttons.com/#code
*/
/* stylelint-disable at-rule-no-unknown */
.chevron,
.Hour24,
.reset {
  fill: var(--sui-semantic-accent-default);
}
.chevron:hover,
.Hour24:hover,
.reset:hover {
  fill: #f39c1d;
}
.chevron svg,
.Hour24 svg,
.reset svg {
  margin-right: 5px;
}

.hukamnama-nav-icon > span {
  display: block;
  font-size: 0.35em;
}

.share-buttons svg,
.share svg {
  fill: #868383;
  font-size: 2em;
  max-height: 30px;
  min-width: 30px;
  padding: 5px;
}
@media screen and (max-width: 45.999999em) {
  .share-buttons svg,
  .share svg {
    font-size: 2em !important;
  }
}

#controls-menu {
  border-radius: 2px;
  margin: 0 2rem 0 auto;
}
.fullscreen-view #controls-menu {
  display: none;
}
#controls-menu a {
  background-color: transparent !important;
  color: var(--sui-semantic-accent-default);
  height: 30px;
}
@media screen and (max-width: 790px) {
  #controls-menu {
    margin: 0 1rem 0 1rem;
  }
}

.share-buttons {
  align-items: center;
  display: flex;
  justify-content: flex-end;
  list-style: none;
  margin: 0;
  text-align: right;
}
@media screen and (max-width: 790px) {
  .share-buttons {
    margin-top: 10px;
    text-align: center;
  }
}
.share-buttons li {
  align-items: center;
  display: flex;
  margin-left: 5px;
}
.share-buttons li:first-of-type {
  margin-left: 0;
}
.share-buttons li button {
  align-items: center;
  color: #999;
  display: inline-flex;
  font-weight: 700;
  justify-content: center;
}
.share-buttons li button:hover span, .share-buttons li button.active span {
  color: #f39c1d;
}
.share-buttons li button:hover svg, .share-buttons li button.active svg {
  fill: #f39c1d;
}
.share-buttons li #copy-short-url {
  align-items: center;
  display: flex;
  justify-content: center;
  position: relative;
}
.share-buttons li #copy-short-url .short-url-input {
  background-color: #fafafa;
  display: inline-block;
  font-size: 11px;
  height: auto;
  margin: 0;
  position: relative;
  width: 175px;
}
@media screen and (max-width: 790px) {
  .share-buttons li #copy-short-url .short-url-input {
    display: none;
  }
}
.share-buttons li #copy-short-url .short-url-icon {
  box-shadow: -5px 0 7px -6px #999;
  cursor: copy;
  height: 1.2em;
  position: absolute;
  right: 0;
  width: 0.8em;
}
@media screen and (max-width: 790px) {
  .share-buttons li #copy-short-url .short-url-icon {
    box-shadow: none;
    position: relative;
  }
}

#search-options select.selected,
.search-options select.selected {
  background-color: rgb(223.5, 244.1037735849, 255);
  color: #363636;
}

.sync-connect-layout {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 24px;
}
.sync-connect-layout__tabs {
  margin-top: 12px;
  margin-bottom: 60px;
}
.sync-connect-layout__tabs .sui-fateh-tabs__list {
  justify-content: center;
}
@media (max-width: 768px) {
  .sync-connect-layout__tabs {
    margin-bottom: 24px;
  }
}
.sync-connect-layout__tab-link {
  color: inherit;
  text-decoration: none;
}

.sync-form {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  margin-bottom: 24px;
  gap: 24px;
}
.sync-form__otp-box {
  padding: 24px;
  border-radius: 25px;
  min-width: 528px;
  position: relative;
}
@media (max-width: 768px) {
  .sync-form__otp-box {
    padding: 24px 12px;
    min-width: 264px;
    width: 100%;
  }
}
.sync-form__back-btn {
  position: absolute;
  top: 12px;
  left: 12px;
  color: var(--sui-semantic-accent-default);
}
.sync-form__back-btn svg,
.sync-form__back-btn svg path {
  fill: currentColor;
}
.sync-form__reconnect-btn {
  position: absolute;
  bottom: 6px;
  right: 6px;
}
.sync-form__heading {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 36px;
}
.sync-form__title {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-bold);
  font-size: var(--sui-typography-font-sizes-2xl);
  line-height: 100%;
  text-align: center;
  color: var(--sui-semantic-accent-default);
}
@media (max-width: 768px) {
  .sync-form__title {
    font-size: var(--sui-typography-font-sizes-xl);
  }
}
.sync-form__subtitle {
  font-weight: var(--sui-typography-font-weights-normal);
}
.sync-form__description {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-base);
  text-align: center;
  color: var(--sui-semantic-accent-default);
}
.sync-form__connect-btn {
  padding-left: 12px;
  padding-right: 12px;
  font-weight: var(--sui-typography-font-weights-normal);
}
@media (max-width: 768px) {
  .sync-form__connect-btn {
    font-size: var(--sui-typography-font-sizes-sm);
  }
}
.sync-form__instructions-link {
  font-size: var(--sui-typography-font-sizes-base);
  font-weight: var(--sui-typography-font-weights-bold);
}
.sync-form__long-description {
  max-width: 684px;
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-base);
  line-height: var(--sui-typography-line-heights-base);
  text-align: center;
  color: var(--sui-semantic-accent-default);
  margin-top: 24px;
}
.sync-form__otp-label-hint {
  color: color-mix(in srgb, var(--sui-semantic-accent-default) 50%, transparent);
  font-weight: var(--sui-typography-font-weights-normal);
  text-decoration: none;
}
.sync-form__otp-label-hint:hover {
  text-decoration: underline;
}
.sync-form__otp-label {
  margin: 0 0 12px;
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-bold);
  font-size: var(--sui-typography-font-sizes-base);
  line-height: 100%;
  text-align: center;
  color: var(--sui-semantic-accent-default);
}
.sync-form-error {
  color: #dc4c42;
  text-align: center;
  margin: 0 0 12px;
  font-size: var(--sui-typography-font-sizes-sm);
}

.sync-viewer__empty {
  margin: 48px auto;
  padding: 24px;
  max-width: 480px;
  text-align: center;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-base);
  color: var(--sui-semantic-foreground-muted);
}

.sync-fullscreen-toggle {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  padding: 10px;
}
.sync-fullscreen-toggle label {
  height: 30px;
  width: 60px;
}

/* Styles for a toggle switch */
.toggle-label {
  background: #999;
  border-radius: 100px;
  display: block;
  position: relative;
  text-indent: -9999px;
}
.toggle-label::after {
  background: #fff;
  border-radius: 50%;
  content: "";
  height: 90%;
  left: 2.5%;
  position: absolute;
  top: 5%;
  transition: 0.2s;
  width: 45%;
}
.toggle-label:active::after {
  width: 65%;
}

.toggle-checkbox {
  height: 0;
  visibility: hidden;
  width: 0;
}
.toggle-checkbox:checked + .toggle-label {
  background: #f39c1d;
}
.toggle-checkbox:checked + .toggle-label::after {
  left: 97.5%;
  transform: translateX(-100%);
}

.spinner {
  animation: shadow-pulse 1s infinite;
  background-image: url(/assets/images/banidblogo.png);
  background-size: 200px 200px;
  border-radius: 50%;
  height: 200px;
  margin: auto;
  opacity: 0.5;
  position: relative;
  width: 200px;
  z-index: 1;
}

@keyframes shadow-pulse {
  0% {
    box-shadow: 0 0 0 1px rgb(250, 130, 2);
  }
  100% {
    box-shadow: 0 0 0 35px rgba(0, 0, 0, 0);
  }
}
@media screen and (max-width: 45.999999em) {
  .spinner {
    background-size: 150px 150px;
    height: 150px;
    width: 150px;
  }
}
.sundar-gutka-layout {
  display: flex;
  height: calc(100vh - 72px - 73px);
}
.sundar-gutka-layout .sundar-gutka-side-panel {
  max-width: 400px;
}
@media (max-width: 768px) {
  .sundar-gutka-layout .sundar-gutka-side-panel {
    max-width: none;
  }
}

.sundar-gutka-side-panel {
  width: 100%;
  flex-shrink: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  border-right: 1px solid var(--sui-semantic-border-muted);
  background: var(--sui-semantic-background-page);
}
.sundar-gutka-side-panel__close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
}
.sundar-gutka-side-panel__header {
  padding: 24px;
  text-align: center;
  border-radius: 0;
}
.sundar-gutka-side-panel__sub-header {
  display: block;
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-base);
  color: var(--sui-semantic-accent-default);
  line-height: var(--sui-typography-line-heights-base);
}
.sundar-gutka-side-panel__title {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-bold);
  font-size: var(--sui-typography-font-sizes-2xl);
  line-height: var(--sui-typography-line-heights-2xl);
  color: var(--sui-semantic-accent-default);
  margin-bottom: 12px;
}
.sundar-gutka-side-panel__search-input {
  position: relative;
}
.sundar-gutka-side-panel__keyboard-icon {
  opacity: 0.3;
}
.sundar-gutka-side-panel .sui-gurmukhi-keyboard-toggle:hover svg {
  opacity: 1;
  color: var(--sui-semantic-accent-default);
}
.sundar-gutka-side-panel__keyboard {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 10;
  margin-top: 4px;
}
.sundar-gutka-side-panel__inner {
  flex: 1 1;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.3) transparent;
}
.sundar-gutka-side-panel__inner::-webkit-scrollbar {
  width: 5px;
}
.sundar-gutka-side-panel__inner::-webkit-scrollbar-track {
  background: transparent;
}
.sundar-gutka-side-panel__inner::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.3);
  border-radius: 9999px;
}
.theme-khalis-blue-dark .sundar-gutka-side-panel__inner {
  scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
}
.theme-khalis-blue-dark .sundar-gutka-side-panel__inner::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.4);
}
.sundar-gutka-side-panel__list-header {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-base);
  line-height: var(--sui-typography-line-heights-xl);
  letter-spacing: 0.1em;
  color: var(--sui-semantic-accent-default);
  text-transform: uppercase;
  padding: 0 12px;
  margin: 0 24px;
  margin-top: 12px;
}
@media (max-width: 768px) {
  .sundar-gutka-side-panel__list-header {
    display: none;
  }
}
.sundar-gutka-side-panel__list {
  display: flex;
  flex-direction: column;
  padding-bottom: 12px;
}
@media (max-width: 768px) {
  .sundar-gutka-side-panel__list {
    padding: 12px 0;
  }
}
.sundar-gutka-side-panel--tabbed .sundar-gutka-side-panel__list-header {
  display: none;
}
.sundar-gutka-side-panel--tabbed .sundar-gutka-side-panel__list {
  padding: 12px 0;
}
.sundar-gutka-side-panel__row {
  position: relative;
}
.sundar-gutka-side-panel__row .sundar-gutka-side-panel__item {
  flex: 1 1;
  padding-right: 56px;
}
.sundar-gutka-side-panel__menu-trigger {
  position: absolute;
  top: 50%;
  right: 36px;
  transform: translateY(-50%);
  opacity: 0;
  color: var(--sui-semantic-foreground-muted);
  transition: opacity var(--sui-transitions-duration-fast) var(--sui-transitions-timing-ease);
}
.sundar-gutka-side-panel__row:hover .sundar-gutka-side-panel__menu-trigger, .sundar-gutka-side-panel__row:focus-within .sundar-gutka-side-panel__menu-trigger, .sundar-gutka-side-panel__menu-trigger--always-visible {
  opacity: 1;
}
.sundar-gutka-side-panel__item {
  display: flex;
  flex-direction: column;
  padding: 0 12px;
  margin: 0 24px;
  height: 48px;
  border-radius: var(--sui-radii-sm);
  text-decoration: none;
  color: var(--sui-semantic-accent-default);
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-semibold);
  font-size: var(--sui-typography-font-sizes-lg);
  line-height: var(--sui-typography-line-heights-xl);
}
.sundar-gutka-side-panel__item:hover {
  background-color: var(--sui-semantic-background-surface);
}
.sundar-gutka-side-panel__gurmukhi {
  font-size: var(--sui-typography-font-sizes-base);
  line-height: var(--sui-typography-line-heights-base);
}
.sundar-gutka-side-panel__transliteration {
  font-size: var(--sui-typography-font-sizes-xs);
  color: var(--sui-semantic-foreground-disabled);
  text-transform: capitalize;
}
.sundar-gutka-side-panel__tabs {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}
.sundar-gutka-side-panel__tabs .sui-fateh-tabs__panel {
  flex: 1 1;
  overflow-y: auto;
  position: relative;
  display: flex;
  flex-direction: column;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.3) transparent;
}
.sundar-gutka-side-panel__tabs .sui-fateh-tabs__panel::-webkit-scrollbar {
  width: 5px;
}
.sundar-gutka-side-panel__tabs .sui-fateh-tabs__panel::-webkit-scrollbar-track {
  background: transparent;
}
.sundar-gutka-side-panel__tabs .sui-fateh-tabs__panel::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.3);
  border-radius: 9999px;
}
.theme-khalis-blue-dark .sundar-gutka-side-panel__tabs .sui-fateh-tabs__panel {
  scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
}
.theme-khalis-blue-dark .sundar-gutka-side-panel__tabs .sui-fateh-tabs__panel::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.4);
}
.sundar-gutka-side-panel__tabs .sui-fateh-tabs__panel .sg-new-folder-btn {
  position: -webkit-sticky;
  position: sticky;
  bottom: 12px;
  right: 12px;
  align-self: flex-end;
  margin-top: auto;
}
.sundar-gutka-side-panel__folder-arrow {
  transition: transform 0.25s ease;
}
.sundar-gutka-side-panel__folder-arrow--expanded {
  transform: rotate(90deg);
}
.sundar-gutka-side-panel__folder-item {
  flex-direction: row;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  margin: 0 12px;
}
@keyframes sg-folder-bani-enter {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.sundar-gutka-side-panel__folder-banis {
  display: flex;
  flex-direction: column;
  padding-left: 18px;
}
.sundar-gutka-side-panel__folder-banis > li {
  animation: sg-folder-bani-enter 0.25s ease both;
}
.sundar-gutka-side-panel__add-bani-item {
  flex-direction: row;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-sm);
  line-height: var(--sui-typography-line-heights-xl);
  color: var(--sui-semantic-accent-default);
}
.sundar-gutka-side-panel__add-bani-item svg {
  opacity: 0.5;
}
.sundar-gutka-side-panel__add-bani-item span {
  margin-top: 2px;
  line-height: var(--sui-typography-line-heights-lg);
}
.sundar-gutka-side-panel__folder-section {
  display: flex;
  flex-direction: column;
  flex: 1 1;
}
.sundar-gutka-side-panel__empty {
  padding: 24px;
  text-align: center;
  color: var(--sui-semantic-foreground-disabled);
  font-size: var(--sui-typography-font-sizes-sm);
}
@media (max-width: 768px) {
  .sundar-gutka-side-panel {
    width: 100%;
    max-width: none;
    height: calc(100dvh - 72px);
    align-self: stretch;
    border-right: none;
  }
}

.sundar-gutka-content {
  flex: 1 1;
  overflow-y: auto;
  padding: 24px 48px;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.3) transparent;
}
.sundar-gutka-content::-webkit-scrollbar {
  width: 5px;
}
.sundar-gutka-content::-webkit-scrollbar-track {
  background: transparent;
}
.sundar-gutka-content::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.3);
  border-radius: 9999px;
}
.theme-khalis-blue-dark .sundar-gutka-content {
  scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
}
.theme-khalis-blue-dark .sundar-gutka-content::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.4);
}
@media (max-width: 768px) {
  .sundar-gutka-content {
    display: none;
  }
}

.sg-skeleton {
  padding: var(--sui-spacing-4) var(--sui-spacing-3);
}

.sundar-gutka-side-panel__skeleton {
  padding: var(--sui-spacing-2);
}

.sg-folders {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.sg-folders__header {
  display: flex;
  justify-content: flex-end;
}
.sg-folders__length-selector {
  display: flex;
  align-items: center;
  gap: 4px;
}
.sg-folders__length-label {
  margin-right: var(--sui-spacing-2);
  padding-right: var(--sui-spacing-2);
  border-right: 1px solid var(--sui-semantic-border-muted);
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-medium);
  color: var(--sui-semantic-foreground-muted);
  white-space: nowrap;
}

.sg-folder-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--sui-semantic-accent-default);
}
.sg-folder-section__title {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-base);
  line-height: var(--sui-typography-line-heights-xl);
  letter-spacing: 0.1em;
  color: var(--sui-semantic-accent-default);
  text-transform: uppercase;
}
.sg-folder-section__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.sg-folder-section__cards {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.sg-folder-section__card-wrapper {
  position: relative;
}
.sg-folder-section__badge {
  position: absolute;
  bottom: 6px;
  right: 6px;
}
.sg-folder-section__menu-trigger {
  position: absolute;
  top: 6px;
  right: 6px;
  opacity: 0;
  color: var(--sui-semantic-foreground-muted);
}
.sg-folder-section__card-wrapper:hover .sg-folder-section__menu-trigger, .sg-folder-section__card-wrapper:focus-within .sg-folder-section__menu-trigger, .sg-folder-section__menu-trigger--always-visible {
  opacity: 1;
}
.sg-folder-section__add-card {
  opacity: 0.5;
}
.sg-folder-section__empty {
  padding: 24px;
  text-align: center;
  color: var(--sui-semantic-foreground-disabled);
  font-size: var(--sui-typography-font-sizes-sm);
  border: 1px dashed var(--sui-semantic-border-muted);
  border-radius: var(--sui-radii-lg);
}

.sg-new-folder-btn {
  width: -moz-fit-content;
  width: fit-content;
  font-weight: var(--sui-typography-font-weights-normal);
  margin: 24px 0 0;
}

.sg-folder-dialog .sui-dialog__header {
  padding: 0 var(--sui-spacing-2);
}

.sg-folder-dialog .sui-dialog__body {
  padding: 12px;
}

.sg-folder-create {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.sg-folder-create .sui-input {
  flex: 1 1;
}
.sg-folder-create__title {
  font-weight: var(--sui-typography-font-weights-semibold);
  color: var(--sui-semantic-accent-default);
  font-size: var(--sui-typography-font-sizes-base);
  line-height: var(--sui-typography-line-heights-xl);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.sg-folder-create__btn {
  margin-left: auto;
}

.sg-folder__picker {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 12px;
}

.sg-folder__picker-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  max-height: 400px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.3) transparent;
}
.sg-folder__picker-list::-webkit-scrollbar {
  width: 5px;
}
.sg-folder__picker-list::-webkit-scrollbar-track {
  background: transparent;
}
.sg-folder__picker-list::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.3);
  border-radius: 9999px;
}
.theme-khalis-blue-dark .sg-folder__picker-list {
  scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
}
.theme-khalis-blue-dark .sg-folder__picker-list::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.4);
}

.sg-folder__picker-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: none;
  background: none;
  border-radius: var(--sui-radii-sm);
  cursor: pointer;
  text-align: left;
  width: 100%;
  font-family: var(--sui-typography-fonts-primary);
  color: var(--sui-semantic-accent-default);
}
.sg-folder__picker-item:hover {
  background-color: var(--sui-semantic-background-surface);
}
.sg-folder__picker-item--added {
  color: var(--sui-semantic-accent-default);
}

.sg-folder__picker-gurmukhi {
  flex: 1 1;
  color: var(--sui-semantic-accent-default);
}

.sg-folder__picker-english {
  font-size: var(--sui-typography-font-sizes-xs);
  color: var(--sui-semantic-foreground-disabled);
  text-transform: capitalize;
}

.help-page {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-4);
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: var(--sui-spacing-4) var(--sui-spacing-2);
  font-family: var(--sui-typography-fonts-primary);
  color: var(--sui-semantic-foreground-tertiary);
}
.help-page__hero {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-bottom: var(--sui-spacing-3);
  border-bottom: 1px solid var(--sui-semantic-border-muted);
}
.help-page__title {
  margin: 0;
  font-size: 2rem;
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-accent-default);
  line-height: 1.2;
}
.help-page__subtitle {
  margin: 0;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--sui-semantic-foreground-muted);
  max-width: 70ch;
}
.help-page__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-gap: var(--sui-spacing-4);
  gap: var(--sui-spacing-4);
}
@media (min-width: 1024px) {
  .help-page__layout {
    grid-template-columns: 260px minmax(0, 1fr);
    gap: var(--sui-spacing-6);
  }
}
@media (min-width: 1024px) {
  .help-page__sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 80px;
    align-self: start;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
  }
}
.help-page__sidebar-inner {
  padding: var(--sui-spacing-2);
  border-radius: var(--sui-radii-lg);
  background: var(--sui-atom-box-gradient-background);
  box-shadow: var(--sui-atom-box-gradient-shadow);
}
.help-page__sidebar-heading {
  margin: 0 0 var(--sui-spacing-1);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-foreground-subtle);
}
.help-page__sidebar-group + .help-page__sidebar-group {
  margin-top: var(--sui-spacing-2);
}
.help-page__sidebar-section {
  display: block;
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-accent-default);
  text-decoration: none;
  padding: 4px 0;
}
.help-page__sidebar-section:hover {
  color: #f39c1d;
}
.help-page__sidebar-links {
  list-style: none;
  margin: 0;
  padding: 0;
  border-left: 2px solid var(--sui-semantic-border-muted);
  margin-left: 4px;
}
.help-page__sidebar-link {
  display: block;
  padding: 4px var(--sui-spacing-1);
  font-size: 0.875rem;
  color: var(--sui-semantic-foreground-muted);
  text-decoration: none;
  border-left: 2px solid transparent;
  margin-left: -2px;
  transition: color 0.15s ease, border-color 0.15s ease;
}
.help-page__sidebar-link:hover {
  color: var(--sui-semantic-accent-default);
  border-left-color: var(--sui-semantic-accent-default);
}
.help-page__main {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-6);
  min-width: 0;
}
.help-page__section {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-2);
  scroll-margin-top: 80px;
}
.help-page__section-title {
  margin: 0;
  font-size: 1.5rem;
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-accent-default);
  padding-bottom: var(--sui-spacing-1);
  border-bottom: 1px solid var(--sui-semantic-border-muted);
}
.help-page__questions {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-2);
}
.help-page__question {
  padding: var(--sui-spacing-3);
  border-radius: var(--sui-radii-lg);
  background: var(--sui-atom-box-gradient-background);
  box-shadow: var(--sui-atom-box-gradient-shadow);
  scroll-margin-top: 80px;
  transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.help-page__question:target {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--sui-semantic-accent-default) 25%, transparent), var(--sui-atom-box-gradient-shadow);
}
.help-page__question-title {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0 0 var(--sui-spacing-2);
  font-size: 1.125rem;
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-accent-default);
  line-height: 1.4;
}
.help-page__question-anchor {
  color: var(--sui-semantic-foreground-subtle);
  text-decoration: none;
  font-weight: var(--sui-typography-font-weights-normal);
  flex: 0 0 auto;
}
.help-page__question-anchor:hover {
  color: var(--sui-semantic-accent-default);
}
.help-page__answer {
  color: var(--sui-semantic-foreground-tertiary);
  font-size: 0.9375rem;
  line-height: 1.6;
}
.help-page__answer p {
  margin: 0 0 var(--sui-spacing-1);
}
.help-page__answer a {
  color: var(--sui-semantic-accent-default);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.help-page__answer a:hover {
  color: #f39c1d;
}
.help-page__answer code {
  background: var(--sui-semantic-background-surface, #f5f5f5);
  border: 1px solid var(--sui-semantic-border-muted);
  border-radius: var(--sui-radii-sm);
  padding: 1px 6px;
  font-size: 0.9em;
}
.help-page__answer ul,
.help-page__answer ol {
  margin: var(--sui-spacing-1) 0;
  padding-left: var(--sui-spacing-3);
}
.help-page__answer ul li {
  list-style: none;
  position: relative;
}
.help-page__answer ul li::before {
  content: "■";
  color: #f99d1c;
  position: absolute;
  left: -1em;
  top: 0;
}
.help-page__answer ol li {
  list-style: decimal;
}
.help-page__answer img {
  display: block;
  margin: var(--sui-spacing-2) auto;
  max-width: 100%;
  border-radius: var(--sui-radii-md);
  box-shadow: var(--sui-shadows-md);
}
.help-page__answer table {
  border-collapse: collapse;
  margin: var(--sui-spacing-2) 0;
}
.help-page__answer table td {
  border: 1px solid var(--sui-semantic-border-muted);
  padding: 4px 8px;
  text-align: center;
}
.help-page__video {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: var(--sui-radii-md);
  overflow: hidden;
  box-shadow: var(--sui-shadows-lg);
}
.help-page__video iframe {
  width: 100%;
  height: 100%;
  border: 0;
}

.theme-khalis-blue-dark .help-page {
  color: var(--sui-semantic-foreground-default);
}
.theme-khalis-blue-dark .help-page__answer {
  color: var(--sui-semantic-foreground-default);
}

.bani-controller-settings {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 240px;
  padding: 4px;
}
.bani-controller-settings .quick-settings {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  flex-wrap: nowrap;
}
.bani-controller-settings .controller-option {
  margin: 0;
  min-height: unset;
  padding: 8px 10px;
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  align-items: center;
  grid-column-gap: 8px;
  column-gap: 8px;
  border-radius: var(--sui-radii-md);
  background: color-mix(in srgb, var(--sui-semantic-accent-default) 4%, transparent);
  transition: background-color 0.15s ease;
}
.bani-controller-settings .controller-option:hover {
  background: color-mix(in srgb, var(--sui-semantic-accent-default) 8%, transparent);
}
.bani-controller-settings .controller-option.qs-option {
  margin: 0;
  width: 100%;
}
.bani-controller-settings .controller-option .toggle-text {
  grid-column: 1;
  margin: 0;
  text-align: left;
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-semibold);
  color: var(--sui-semantic-accent-default);
}
.bani-controller-settings .controller-option .controller-minus-glyph {
  font-size: 18px;
  line-height: 1;
  font-weight: var(--sui-typography-font-weights-bold);
}
.bani-controller-settings .controller-option > span:not(.toggle-text):not(.custom-fa) {
  min-width: 28px;
  text-align: center;
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-semibold);
  color: var(--sui-semantic-accent-default);
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.bani-list {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  padding: 12px;
}
.bani-list__input-wrap {
  flex: 0 0 auto;
}
.bani-list__input-wrap .sui-input {
  height: 36px;
  min-height: 36px;
}
.bani-list__items {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  list-style: none;
  margin: 0;
  padding: 0;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.bani-list__items::-webkit-scrollbar {
  display: none;
}
.bani-list__item {
  cursor: pointer;
  padding: 12px;
  border-radius: var(--sui-radii-md);
  color: var(--sui-semantic-accent-default);
  font-weight: var(--sui-typography-font-weights-semibold);
}
.bani-list__item:hover {
  background-color: color-mix(in srgb, var(--sui-semantic-accent-default) 4%, transparent);
}
.bani-list__item--skeleton {
  cursor: default;
  pointer-events: none;
}
.bani-list__item--skeleton:hover {
  background-color: transparent;
}
.bani-list__item.active-slide {
  background-color: var(--sui-semantic-accent-default);
  color: var(--sui-semantic-background-page, #fff);
}

.controller-pane {
  position: relative;
}

.ceremony-picker__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.ceremony-picker__raagmala-toggle {
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}

.controller-folder-grid {
  padding: 12px;
}

.history-list__item {
  display: flex;
  align-items: center;
  gap: 8px;
}
.history-list__empty {
  padding: 12px;
  color: rgba(0, 0, 0, 0.5);
  font-size: var(--sui-typography-font-sizes-sm);
}

.gurmukhi-search-input {
  position: relative;
  flex: 0 0 auto;
  z-index: 20;
}
.gurmukhi-search-input__icon {
  color: var(--sui-semantic-accent-default);
}
.gurmukhi-search-input__keyboard-toggle {
  color: rgba(0, 0, 0, 0.3019607843);
}
.gurmukhi-search-input__keyboard {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 20;
  margin-top: 4px;
  background: var(--sui-atom-keyboard-background);
  box-shadow: var(--sui-shadows-lg);
}

.controller-mobile-drawer__search-wrap {
  margin-left: 12px;
  margin-right: 12px;
}

.controller-mobile-drawer.controller-mobile-drawer {
  --controller-header-height: 72px;
  --controller-bottom-tabs-height: 60px;
  --controller-footer-height: 73px;
  top: calc(var(--controller-header-height) + 12px);
  bottom: calc(var(--controller-bottom-tabs-height) + var(--controller-footer-height));
  height: calc(100vh - var(--controller-header-height) - 12px - var(--controller-bottom-tabs-height) - var(--controller-footer-height));
  border-top-left-radius: var(--sui-radii-2xl);
  border-top-right-radius: var(--sui-radii-2xl);
  overflow: hidden;
}
.controller-mobile-drawer.controller-mobile-drawer .sui-drawer__header {
  padding: 12px;
}
.controller-mobile-drawer.controller-mobile-drawer .sui-drawer__body {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  padding: 0;
  gap: 12px;
}
.controller-mobile-drawer.controller-mobile-drawer .controller-banis-inner-tabs {
  flex: 1 1 auto;
  min-height: 0;
}
.controller-mobile-drawer.controller-mobile-drawer .controller-banis-inner-tabs > .sui-fateh-tabs__panel {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.controller-mobile-drawer.controller-mobile-drawer .controller-banis-inner-tabs > .sui-fateh-tabs__panel > .bani-list {
  flex: 1 1 auto;
  min-height: 0;
  height: auto;
  padding: 0;
}
.controller-mobile-drawer.controller-mobile-drawer .controller-banis-inner-tabs > .sui-fateh-tabs__panel > .bani-list > .bani-list__items {
  overflow-y: auto;
  flex: 1 1;
  min-height: 0;
}
.controller-mobile-drawer.controller-mobile-drawer .controller-banis-inner-tabs .sui-fateh-tabs--boxed {
  height: 48px;
}
.controller-mobile-drawer.controller-mobile-drawer .controller-banis-inner-tabs .sui-fateh-tabs--boxed .sui-fateh-link {
  height: 48px;
  border: 1px solid var(--sui-semantic-border-muted) !important;
}

.controller-banis-tabs,
.controller-banis-inner-tabs {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}
.controller-banis-tabs > .sui-fateh-tabs,
.controller-banis-inner-tabs > .sui-fateh-tabs {
  flex: 0 0 auto;
}
.controller-banis-tabs > .sui-fateh-tabs--pilled,
.controller-banis-inner-tabs > .sui-fateh-tabs--pilled {
  background-color: var(--sui-semantic-accent-muted);
  padding: 12px;
  width: 100%;
}
.controller-banis-tabs > .sui-fateh-tabs--boxed,
.controller-banis-inner-tabs > .sui-fateh-tabs--boxed {
  height: 36px;
}
.controller-banis-tabs > .sui-fateh-tabs--boxed .sui-fateh-link,
.controller-banis-inner-tabs > .sui-fateh-tabs--boxed .sui-fateh-link {
  height: 36px;
}
.controller-banis-tabs > .sui-fateh-tabs--boxed .sui-fateh-link:first-child,
.controller-banis-inner-tabs > .sui-fateh-tabs--boxed .sui-fateh-link:first-child {
  border-left: 0;
}
.controller-banis-tabs > .sui-fateh-tabs--boxed .sui-fateh-link:last-child,
.controller-banis-inner-tabs > .sui-fateh-tabs--boxed .sui-fateh-link:last-child {
  border-right: 0;
}
.controller-banis-tabs > .sui-fateh-tabs__panel,
.controller-banis-inner-tabs > .sui-fateh-tabs__panel {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}

.controller-mobile-layout {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 145px);
  box-sizing: border-box;
}
.controller-mobile-layout__pane {
  flex: 0 0 auto;
  width: 100%;
  aspect-ratio: 16/9;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: var(--sui-semantic-background-page);
  overflow: hidden;
}
.controller-mobile-layout__controls {
  flex: 0 0 auto;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px;
  color: var(--sui-semantic-accent-default);
  background-color: color-mix(in srgb, var(--sui-semantic-accent-default) 10%, transparent);
  border-bottom: 1px solid var(--sui-semantic-border-muted);
  border-radius: 0 0 var(--sui-radii-sm) var(--sui-radii-sm);
}
.controller-mobile-layout__tabs {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.controller-mobile-layout__tabs > .sui-fateh-tabs {
  flex: 0 0 auto;
}
.controller-mobile-layout__tabs > .sui-fateh-tabs--boxed .sui-fateh-link {
  border-left: 0;
  border-right: 0;
}
.controller-mobile-layout__tabs > .sui-fateh-tabs__panel {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}
.controller-mobile-layout__new-shabad {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 12px;
  height: 100%;
  min-height: 0;
}
.controller-mobile-layout__new-shabad .sui-search-bar {
  padding: 0;
}
@media (max-width: 768px) {
  .controller-mobile-layout__new-shabad .sui-search-bar .sui-search-bar__input-wrapper {
    border-width: 2px;
    background: rgba(17, 57, 121, 0.0588235294);
  }
}
.controller-mobile-layout__new-shabad .sui-autocomplete-list {
  flex: 1 1;
  border: unset;
  background: unset;
  box-shadow: unset;
  border-radius: unset;
  padding-top: 0;
  padding-bottom: 0;
}
.controller-mobile-layout__new-shabad .sui-autocomplete-list .sui-autocomplete-list__item-text {
  font-size: var(--sui-typography-font-sizes-lg);
}
.controller-mobile-layout__new-shabad > .sui-search-bar {
  flex: 0 0 auto;
}
.controller-mobile-layout__new-shabad > .sui-autocomplete-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}
.controller-mobile-layout__new-shabad > .controller-mobile-layout__bottom-tabs {
  flex: 0 0 auto;
  height: unset;
  min-height: unset;
  margin-top: auto;
  margin-left: -12px;
  margin-right: -12px;
  margin-bottom: -12px;
}
.controller-mobile-layout__current-shabad {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  gap: 12px;
  padding: 12px 24px 0;
}
.controller-mobile-layout__current-shabad .controller-content--header__title {
  flex: 0 0 auto;
  align-self: flex-start;
}
.controller-mobile-layout__current-shabad .shortcut-sidebar-wrap {
  flex: 0 0 auto;
  max-width: none;
  margin: 0 -24px;
  padding: 12px;
  background-color: var(--sui-semantic-background-surface-alt);
  border-top: 1px solid var(--sui-semantic-border-muted);
  overflow-x: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.controller-mobile-layout__current-shabad .shortcut-sidebar-wrap::-webkit-scrollbar {
  display: none;
}
.controller-mobile-layout__current-shabad .shortcut-sidebar {
  display: flex;
  flex-wrap: nowrap;
  width: max-content;
  gap: 12px;
}
.controller-mobile-layout__list {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}

.controller-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 36px;
  gap: 36px;
  align-items: stretch;
  height: calc(100vh - 145px);
  padding: 24px;
  box-sizing: border-box;
}
.controller-layout > .controller {
  grid-column: 1;
  grid-row: 1;
  min-height: 0;
  height: 100%;
}
.controller-layout__right {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
}
.controller-layout__right > .controller {
  flex: 1 1;
  min-height: 0;
}

.controller {
  position: relative;
  border: 2px solid color-mix(in srgb, var(--sui-semantic-accent-default) 10%, transparent);
  border-radius: var(--sui-radii-2xl);
  background: var(--sui-semantic-background-surface-alt, #fafafa);
  box-shadow: 15px 15px 45px 0px rgba(43, 59, 81, 0.1);
  overflow: hidden;
}
.controller--split {
  display: flex;
  flex-direction: column;
  padding: 12px;
}
.controller--search {
  border-radius: var(--sui-radii-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.controller--search .sui-search-bar {
  border-bottom-left-radius: unset;
  border-bottom-right-radius: unset;
  box-shadow: unset;
}
.controller-search__input {
  flex: 0 0 auto;
}
.controller-search__results {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.controller-search__results .sui-autocomplete-list {
  flex: 1 1;
  border: unset;
  background: unset;
  box-shadow: unset;
  border-radius: unset;
}
.controller-search__results .sui-autocomplete-list .sui-autocomplete-list__item-text {
  font-size: var(--sui-typography-font-sizes-lg);
}
.controller--banis {
  border-radius: var(--sui-radii-lg);
  overflow: hidden;
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-style: normal;
  font-size: var(--sui-typography-font-sizes-lg);
  line-height: 36px;
  letter-spacing: 0;
  vertical-align: middle;
  color: #2B3B51;
}
.controller--banis .sui-gurmukhi-keyboard-toggle {
  color: rgba(0, 0, 0, 0.3);
}
.controller--banis .controller-banis-tabs > .sui-fateh-tabs__panel:has(.controller-banis-inner-tabs) {
  overflow: hidden;
}
.controller-shabad-pane {
  flex: 0 0 auto;
  width: 100%;
  aspect-ratio: 16/9;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: auto;
}
@media (max-height: 1200px) {
  .controller-shabad-pane {
    aspect-ratio: 16/7;
  }
}
.controller-icon {
  position: absolute;
  top: 12px;
  right: 12px;
  color: var(--sui-semantic-accent-default);
}
.controller-content {
  background: color-mix(in srgb, var(--sui-semantic-accent-default) 4%, transparent);
  flex: 1 1;
  min-height: 0;
}
.controller-content--info {
  display: flex;
  flex-direction: column;
  border-radius: var(--sui-radii-lg);
}
.controller-content--header {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  margin-bottom: 12px;
}
.controller-content--header__title {
  gap: 8px;
  min-width: 0;
  font-weight: var(--sui-typography-font-weights-bold);
  font-size: var(--sui-typography-font-sizes-sm);
}
.controller-content--header__shabad-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.controller-content--header__actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  color: rgba(0, 0, 0, 0.5);
}
.controller-content--list {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-lg);
  line-height: 36px;
}
.controller-content--list .sui-gurbani-display {
  color: var(--sui-semantic-foreground-tertiary);
}
.controller-content--shortcuts {
  flex: 0 0 auto;
  margin-top: auto;
  border-radius: 0 0 var(--sui-radii-lg) var(--sui-radii-lg);
  padding: 12px;
}
.controller-content--shortcuts .shortcut-sidebar-wrap {
  margin: 0 auto;
  max-width: 100%;
  overflow-x: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.controller-content--shortcuts .shortcut-sidebar-wrap::-webkit-scrollbar {
  display: none;
}
.controller-content--shortcuts .shortcut-sidebar {
  display: flex;
  flex-wrap: nowrap;
  width: max-content;
  gap: 12px;
}
.controller-shabad {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  text-align: center;
}
.controller-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 200px;
  color: var(--sui-semantic-accent-default);
}
.controller-loading--inline {
  min-height: 0;
  padding: 24px 0;
}
.controller-shabad-list {
  overflow: auto;
  height: 100%;
  padding-left: 24px;
  padding-right: 24px;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.controller-shabad-list::-webkit-scrollbar {
  display: none;
}
@media (max-width: 1024px) {
  .controller-shabad-list {
    padding-left: 0;
    padding-right: 0;
  }
}
.controller-shabad-list .sui-mixed-view-baani {
  gap: 12px;
}

.slider {
  background-color: #999;
  bottom: 0;
  cursor: pointer;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: 0.4s;
}
.slider::before {
  background-color: white;
  bottom: 4px;
  content: "";
  height: 21px;
  left: 4px;
  margin-bottom: 1.5px;
  position: absolute;
  transition: 0.4s;
  width: 20px;
}
.slider.round {
  border-radius: 34px;
  height: 1.9rem;
  margin-bottom: 0;
  margin-top: 8px;
  width: 3.5rem;
}
.slider.round::before {
  border-radius: 50%;
}

.switch {
  height: 34px;
  width: 60px;
}
.switch:checked + .slider {
  background-color: #f39c1d;
}
.switch:checked + .slider::before {
  transform: translateX(26px);
}
.switch.input {
  height: 0;
  opacity: 0;
  width: 0;
}
.switch.input:focus + .slider {
  box-shadow: 0 0 1px orange;
}

.controller-content--header__back-btn {
  color: var(--sui-semantic-accent-default);
}

.banner-floating {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 100;
  max-width: 400px;
  animation: banner-slide-in 0.3s ease-out;
}

@keyframes banner-slide-in {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.banner-glass {
  position: relative;
  padding: 24px;
}

.banner-glass-close {
  position: absolute;
  top: 0;
  right: 0;
}

.banner-glass-message {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-medium);
  color: var(--sui-semantic-accent-default);
  line-height: 1.4;
}

.banner-glass-link {
  display: inline-block;
  margin-top: 12px;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-xs);
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-accent-default);
}

.granth-index {
  max-width: 1000px;
  margin: 0 auto;
  padding: 72px 12px 48px;
}
@media (max-width: 768px) {
  .granth-index {
    padding: 12px;
  }
  .granth-index .sui-table__header-cell,
  .granth-index .sui-table__cell,
  .granth-index .sui-table__spacer-cell {
    padding: 12px 6px;
  }
}

@keyframes granth-index-arrow-expand {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(90deg);
  }
}
@keyframes granth-index-arrow-collapse {
  from {
    transform: rotate(90deg);
  }
  to {
    transform: rotate(0deg);
  }
}
.granth-index__arrow--expanded {
  animation: granth-index-arrow-expand 0.25s ease forwards;
}

.granth-index__collapsed-section svg {
  animation: granth-index-arrow-collapse 0.25s ease forwards;
}

@keyframes granth-index-row-enter {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.granth-index .sui-table__row:not(.sui-table__row--section):not(.sui-table__row--spacer) {
  animation: granth-index-row-enter 0.25s ease both;
}
.granth-index .sui-table__row:not(.sui-table__row--section):not(.sui-table__row--spacer):hover {
  background-color: var(--sui-semantic-background-surface);
}

.granth-index .sui-table__row--section .sui-table__cell:first-child {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-bold);
  font-size: var(--sui-typography-font-sizes-lg);
  line-height: 24px;
  vertical-align: middle;
}
@media (max-width: 768px) {
  .granth-index .sui-table__row--section .sui-table__cell:first-child {
    font-size: var(--sui-typography-font-sizes-base);
  }
}
.granth-index .sui-table__row--section .sui-table__cell:first-child .sui-table__section-icon {
  vertical-align: middle;
}

.granth-index .sui-table__row--section .sui-table__cell:last-child {
  font-weight: var(--sui-typography-font-weights-normal);
}

.granth-index .sui-table__row:not(.sui-table__row--spacer) + .sui-table__row--spacer .granth-index__collapsed-section {
  margin-top: 12px;
}

.granth-index__collapsed-section {
  display: flex;
  align-items: center;
  gap: 8px;
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-lg);
  font-weight: var(--sui-typography-font-weights-normal);
  color: var(--sui-semantic-accent-default);
  padding: 4px 0;
}
.granth-index__collapsed-section:hover {
  text-decoration: underline;
}

.granth-index__ang-range {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
@media (max-width: 768px) {
  .granth-index__ang-range {
    gap: 6px;
  }
}
.granth-index__ang-range__badge {
  min-width: 48px;
  font-size: var(--sui-typography-font-sizes-sm);
  background-color: var(--sui-semantic-background-surface);
}
@media (max-width: 768px) {
  .granth-index__ang-range__badge {
    min-width: 24px;
  }
}
.granth-index__ang-range__badge--accent {
  background-color: rgba(215, 231, 255, 0.5019607843);
}

.granth-index__writer-link,
.granth-index__bani-link {
  color: inherit;
  text-decoration: none;
}
.granth-index__writer-link:hover,
.granth-index__bani-link:hover {
  text-decoration: underline;
  color: var(--sui-semantic-accent-default);
}

.granth-index-skeleton__chapter {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 4px 0;
}

.granth-index-skeleton__title {
  max-width: 560px;
}

.granth-index-skeleton__loading-chapter {
  max-width: 360px;
}

.granth-index-skeleton__loading-author {
  max-width: 180px;
}

/* stylelint-disable at-rule-no-unknown */
.sui-mahankosh-word {
  cursor: help;
}

.sui-mahankosh-word--selected {
  font-weight: 900;
}

.mahankosh-tooltip {
  display: flex;
  flex-direction: column;
  color: var(--sui-semantic-accent-default);
}
.mahankosh-tooltip__word {
  font-size: var(--sui-typography-font-sizes-xl);
  font-weight: var(--sui-typography-font-weights-regular);
}
.mahankosh-tooltip__definition {
  font-size: var(--sui-typography-font-sizes-sm);
  margin: 0;
}
.mahankosh-tooltip__empty, .mahankosh-tooltip--loading {
  font-size: var(--sui-typography-font-sizes-sm);
  padding: 12px;
}

.btn {
  border: none;
  border-radius: 5px;
  outline: none;
  padding: 10px;
  transition: 0.2s ease-in;
}
.btn-primary {
  background-color: #da7f00;
  color: #fafafa;
}
.btn-primary:hover {
  background-color: #f39c1d;
}
.btn-secondary {
  background-color: rgb(133.75, 133.75, 133.75);
  color: #fafafa;
}
.btn-secondary:hover {
  background-color: rgb(146.5, 146.5, 146.5);
}
.btn-ghost {
  background-color: #fafafa;
  border: 1px solid var(--sui-semantic-accent-default);
  color: var(--sui-semantic-accent-default);
  font-size: 1rem;
  padding: 8px;
}
.btn-ghost:hover {
  border: 1px solid #f99d1c;
  color: #f99d1c;
}
.btn-ghost--activated {
  background-color: var(--sui-semantic-accent-default);
  color: #fafafa;
}
.btn-ghost--activated:hover {
  border: 1px solid var(--sui-semantic-accent-default);
  color: #fafafa;
}

.multiple-shabads-display__overlay {
  position: fixed;
  inset: 0;
  background: color-mix(in srgb, var(--sui-semantic-background-overlay) 35%, transparent);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease);
  z-index: 1000;
}
.multiple-shabads-display__overlay.is-open {
  opacity: 1;
  pointer-events: auto;
}
.multiple-shabads-display__panel {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  height: 100dvh;
  width: min(420px, 100vw);
  display: flex;
  flex-direction: column;
  background: var(--sui-semantic-background-page);
  border-right: 1px solid var(--sui-semantic-border-muted);
  transform: translateX(-100%);
  transition: transform var(--sui-transitions-duration-slow) var(--sui-transitions-timing-ease);
  z-index: 1001;
}
@media (max-width: 768px) {
  .multiple-shabads-display__panel {
    width: 100vw;
  }
}
.multiple-shabads-display__panel.is-open {
  transform: translateX(0);
  box-shadow: 4px 0 16px -12px color-mix(in srgb, var(--sui-semantic-shadow-color) 45%, transparent);
}
.multiple-shabads-display__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 24px 24px 12px;
}
.multiple-shabads-display__header-text {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1 1;
  min-width: 0;
}
.multiple-shabads-display__heading {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: var(--sui-semantic-foreground-default);
  line-height: 1.2;
}
.multiple-shabads-display__intro {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-sm);
  line-height: 1.5;
  color: var(--sui-semantic-foreground-tertiary);
}
.multiple-shabads-display__close {
  flex-shrink: 0;
  margin-top: -4px;
  margin-right: -8px;
}
.multiple-shabads-display__divider {
  margin: 0;
}
.multiple-shabads-display__body {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 18px 24px;
}
.multiple-shabads-display__empty {
  padding: 36px 12px;
  border-radius: var(--sui-radii-lg);
  background: color-mix(in srgb, var(--sui-semantic-accent-default) 5%, transparent);
  border: 1px dashed color-mix(in srgb, var(--sui-semantic-accent-default) 30%, transparent);
  text-align: center;
}
.multiple-shabads-display__empty p {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-tertiary);
  line-height: 1.5;
}
.multiple-shabads-display__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.multiple-shabads-display__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: var(--sui-radii-md);
  background: var(--sui-semantic-background-surface);
  border: 1px solid var(--sui-semantic-border-muted);
  transition: border-color var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease), box-shadow var(--sui-transitions-duration-normal) var(--sui-transitions-timing-ease);
}
.multiple-shabads-display__item:hover {
  border-color: color-mix(in srgb, var(--sui-semantic-accent-default) 30%, transparent);
  box-shadow: var(--sui-shadows-sm);
}
.multiple-shabads-display__drag-handle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: var(--sui-semantic-foreground-tertiary);
  cursor: -webkit-grab;
  cursor: grab;
  flex-shrink: 0;
}
.multiple-shabads-display__drag-handle:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}
.multiple-shabads-display__link {
  flex: 1 1;
  min-width: 0;
  font-size: var(--sui-typography-font-sizes-base);
  color: var(--sui-semantic-foreground-default);
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.multiple-shabads-display__link:hover {
  color: var(--sui-semantic-accent-default);
  text-decoration: none;
}
.multiple-shabads-display__link--plain, .multiple-shabads-display__link--plain:hover {
  color: var(--sui-semantic-foreground-default);
  cursor: default;
}
.multiple-shabads-display__badge {
  flex: 0 0 auto;
  font-size: var(--sui-typography-font-sizes-xs);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: var(--sui-radii-full);
  background: var(--sui-semantic-background-surface);
  color: var(--sui-semantic-foreground-muted);
}
.multiple-shabads-display__badge--shabad {
  color: var(--sui-semantic-accent-default);
}
.multiple-shabads-display__badge--bani {
  color: #b97a08;
}
.multiple-shabads-display__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 12px 24px 24px;
  border-top: 1px solid var(--sui-semantic-border-muted);
  flex-wrap: wrap;
}
.multiple-shabads-display__footer-left, .multiple-shabads-display__footer-right {
  display: flex;
  align-items: center;
  gap: 8px;
}

button.add-shabad {
  align-items: center;
  color: #fafafa;
  display: flex;
}
button.add-shabad:hover {
  color: #f39c1d !important;
}
.share-buttons button.add-shabad {
  color: #999;
  font-weight: bold;
}
.search-result button.add-shabad, .search-form button.add-shabad {
  display: block;
  height: 1.5em;
  position: relative;
  width: 1.5em;
  z-index: 0;
}
.search-result button.add-shabad svg, .search-form button.add-shabad svg {
  fill: #f39c1d;
  font-size: 1.5em;
}
.search-result button.add-shabad span, .search-form button.add-shabad span {
  display: none;
}
.search-result button.add-shabad:hover svg, .search-form button.add-shabad:hover svg {
  fill: var(--sui-semantic-accent-default);
}

.favourite-shabads {
  padding: 0 24px;
}
.favourite-shabads--row {
  display: flex;
}
.favourite-shabads-list {
  margin: 0;
  padding: 0;
}
.favourite-shabads-list .favourite-shabads-no-select,
.favourite-shabads-list .favourite-shabads-loading {
  text-align: center;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-muted);
  padding: 24px;
}
.favourite-shabads-heading {
  font-family: var(--sui-typography-fonts-primary);
  font-size: 2rem;
  font-weight: var(--sui-typography-font-weights-semibold);
  color: var(--sui-semantic-accent-default);
  text-align: center;
  padding: 24px 0 16px;
  margin: 0;
  width: 100%;
}

.favourite-modal {
  width: min(560px, 92vw);
}
.favourite-modal .sui-dialog__header {
  padding: var(--sui-spacing-2);
}
.favourite-modal .sui-dialog__body {
  padding: var(--sui-spacing-2);
}
.favourite-modal .sui-dialog__header-left h3 {
  margin: 0;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-lg);
  font-weight: var(--sui-typography-font-weights-bold);
  line-height: 1.3;
  color: var(--sui-semantic-accent-default);
}
.favourite-modal__form {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-3);
}
.favourite-modal__field {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-1);
}
.favourite-modal__label {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-foreground-default);
}
.favourite-modal__preview {
  margin: 0;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-base);
  line-height: 1.4;
  color: var(--sui-semantic-accent-default);
  word-break: break-word;
}
.favourite-modal__select .sui-simple-select {
  font-family: var(--sui-typography-fonts-primary);
}
.favourite-modal__textarea {
  width: 100%;
  padding: var(--sui-spacing-2);
  border-radius: var(--sui-radii-md);
  border: 1px solid var(--sui-semantic-border-default, rgba(0, 0, 0, 0.12));
  background-color: var(--sui-semantic-background-subtle, transparent);
  font-family: inherit;
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-default);
  resize: none;
}
.favourite-modal__textarea:focus {
  outline: none;
  border-color: var(--sui-semantic-accent-default);
  box-shadow: 0 0 0 3px var(--sui-semantic-accent-muted);
}
.favourite-modal__actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--sui-spacing-2);
  margin-top: var(--sui-spacing-2);
}

.my-pothi {
  max-width: 980px;
  margin: 0 auto;
  padding: var(--sui-spacing-4) var(--sui-spacing-3);
  font-family: var(--sui-typography-fonts-primary);
  color: var(--sui-semantic-foreground-default);
}
.my-pothi__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--sui-spacing-3);
  margin-bottom: var(--sui-spacing-4);
  flex-wrap: wrap;
}
.my-pothi__back {
  display: inline-flex;
  align-items: center;
  gap: var(--sui-spacing-1);
  margin-bottom: var(--sui-spacing-1);
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-muted);
  text-decoration: none;
}
.my-pothi__back:hover {
  color: var(--sui-semantic-accent-default);
}
.my-pothi__title {
  margin: 0 0 var(--sui-spacing-1);
  font-size: var(--sui-typography-font-sizes-xl);
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-accent-default);
}
.my-pothi__subtitle {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-base);
  color: var(--sui-semantic-foreground-muted);
}
.my-pothi__section {
  margin-top: var(--sui-spacing-4);
}
.my-pothi__section-title {
  margin: 0 0 var(--sui-spacing-2);
  font-size: var(--sui-typography-font-sizes-lg);
  font-weight: var(--sui-typography-font-weights-bold);
}
.my-pothi__link {
  color: inherit;
  text-decoration: none;
  font-weight: var(--sui-typography-font-weights-medium);
}
.my-pothi__link:hover {
  color: var(--sui-semantic-accent-default);
  text-decoration: underline;
}
.my-pothi__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sui-spacing-2);
  padding: var(--sui-spacing-5) var(--sui-spacing-3);
  text-align: center;
  border: 1px dashed var(--sui-semantic-border-default);
  border-radius: var(--sui-radii-lg);
  margin-top: var(--sui-spacing-3);
}
.my-pothi__empty h3 {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-lg);
}
.my-pothi__empty p {
  margin: 0;
  max-width: 420px;
  color: var(--sui-semantic-foreground-muted);
}
.my-pothi__empty-note {
  margin: 0;
  padding: var(--sui-spacing-3);
  text-align: center;
  color: var(--sui-semantic-foreground-muted);
  font-size: var(--sui-typography-font-sizes-sm);
  border: 1px dashed var(--sui-semantic-border-default);
  border-radius: var(--sui-radii-md);
}
.my-pothi__bani-name {
  font-weight: var(--sui-typography-font-weights-medium);
}
.my-pothi__card {
  border: 1px solid var(--sui-semantic-border-default);
  border-radius: var(--sui-radii-lg);
  background: var(--sui-semantic-surface-default);
  margin-bottom: var(--sui-spacing-2);
  overflow: hidden;
  transition: box-shadow 0.15s ease;
}
.my-pothi__card--expanded {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
.my-pothi__card-row {
  display: flex;
  align-items: center;
  gap: var(--sui-spacing-2);
  padding: var(--sui-spacing-3);
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.my-pothi__card-row:hover .my-pothi__card-title {
  color: var(--sui-semantic-accent-default);
}
.my-pothi__card-chevron {
  flex: 0 0 auto;
  color: var(--sui-semantic-foreground-muted);
}
.my-pothi__drag-handle {
  cursor: -webkit-grab;
  cursor: grab;
  touch-action: none;
  color: var(--sui-semantic-foreground-muted);
}
.my-pothi__drag-handle:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}
.my-pothi__card-main {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.my-pothi__card-title {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  font-size: var(--sui-typography-font-sizes-base);
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-foreground-default);
  transition: color 0.15s ease;
}
.my-pothi__card-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.my-pothi__card-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sui-spacing-1);
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-muted);
}
.my-pothi__source-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: var(--sui-radii-full);
  background: color-mix(in srgb, var(--sui-semantic-accent-default) 12%, transparent);
  color: var(--sui-semantic-accent-default);
  font-size: var(--sui-typography-font-sizes-xs);
  font-weight: 600;
  line-height: 1.4;
}
.my-pothi__public-pill {
  gap: 4px;
  background: color-mix(in srgb, var(--sui-semantic-feedback-success-default, #16a34a) 14%, transparent);
  color: var(--sui-semantic-feedback-success-default, #16a34a);
}
.my-pothi__open-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--sui-semantic-accent-default);
  font-size: var(--sui-typography-font-sizes-sm);
  text-decoration: none;
  white-space: nowrap;
}
.my-pothi__open-link:hover {
  text-decoration: underline;
}
.my-pothi__open-link--disabled {
  color: var(--sui-semantic-foreground-disabled);
  cursor: not-allowed;
}
.my-pothi__open-link--disabled:hover {
  text-decoration: none;
}
.my-pothi__card-body {
  padding: var(--sui-spacing-2) var(--sui-spacing-3) var(--sui-spacing-3);
  border-top: 1px solid var(--sui-semantic-border-default);
  background: var(--sui-semantic-surface-subtle);
}
.my-pothi__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 6px 0;
  border-bottom: 1px solid var(--sui-semantic-border-default);
}
.my-pothi__item:last-child {
  border-bottom: 0;
}
.my-pothi__item-pin {
  flex-shrink: 0;
  color: var(--sui-semantic-accent-default);
}
.my-pothi__card-pin {
  flex-shrink: 0;
  color: var(--sui-semantic-accent-default);
}
.my-pothi__item-handle {
  cursor: -webkit-grab;
  cursor: grab;
  touch-action: none;
  color: var(--sui-semantic-foreground-muted);
}
.my-pothi__item-handle:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}
.my-pothi__item-badge {
  flex: 0 0 72px;
  width: 72px;
  box-sizing: border-box;
  text-align: left;
  font-size: var(--sui-typography-font-sizes-xs);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 6px 12px;
  border-radius: var(--sui-radii-full);
  background: var(--sui-semantic-surface-default);
  color: var(--sui-semantic-foreground-muted);
}
.my-pothi__item-badge--shabad {
  color: var(--sui-semantic-accent-default);
}
.my-pothi__item-badge--bani {
  color: #b97a08;
}
.my-pothi__item-main {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.my-pothi__item-preview {
  margin-left: var(--sui-spacing-1);
  color: var(--sui-semantic-foreground-muted);
}
.my-pothi__item-title {
  color: inherit;
  text-decoration: none;
  font-weight: var(--sui-typography-font-weights-medium);
}
.my-pothi__item-title:hover {
  color: var(--sui-semantic-accent-default);
  text-decoration: underline;
}
.my-pothi__item-title--plain, .my-pothi__item-title--plain:hover {
  color: var(--sui-semantic-foreground-default);
  text-decoration: none;
}
@media (max-width: 640px) {
  .my-pothi__card-row {
    flex-wrap: wrap;
  }
  .my-pothi__open-link {
    order: 99;
    flex-basis: 100%;
    justify-content: flex-end;
  }
}

.my-pothi-reader {
  max-width: 980px;
  width: 100%;
  margin: 0 auto;
  padding: var(--sui-spacing-4) var(--sui-spacing-3);
}
.my-pothi-reader__header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sui-spacing-1);
  margin-bottom: var(--sui-spacing-4);
}
.my-pothi-reader__actions {
  margin-top: var(--sui-spacing-2);
  display: flex;
  align-items: center;
  gap: var(--sui-spacing-2);
}
.my-pothi-reader__title-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sui-spacing-3);
  width: 100%;
  flex-wrap: wrap;
}
.my-pothi-reader__title-row .my-pothi__title {
  margin: 0;
}
.my-pothi-reader__title-row .my-pothi__subtitle {
  flex: 0 0 auto;
}
.my-pothi-reader__section {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-6);
  flex: 1 1 auto;
  min-width: 0;
}
.my-pothi-reader__toc-title {
  display: inline-flex;
  align-items: center;
  gap: var(--sui-spacing-1);
  font-size: var(--sui-typography-font-sizes-base);
  font-weight: var(--sui-typography-font-weights-bold);
}
.my-pothi-reader__toc-count {
  font-weight: var(--sui-typography-font-weights-normal);
  color: var(--sui-semantic-foreground-muted);
}
.my-pothi-reader__toc-list {
  list-style: none;
  margin: 0;
  padding: 0;
  overflow-y: auto;
  flex: 1 1 auto;
  min-height: 0;
}
.my-pothi-reader__toc-item {
  margin: 0;
}
.my-pothi-reader__toc-link {
  display: flex;
  align-items: center;
  gap: var(--sui-spacing-1);
  width: 100%;
  padding: 6px var(--sui-spacing-2);
  background: transparent;
  border: 0;
  cursor: pointer;
  color: var(--sui-semantic-foreground-default);
  font-family: inherit;
  font-size: var(--sui-typography-font-sizes-sm);
  text-align: left;
}
.my-pothi-reader__toc-link:hover {
  background: var(--sui-semantic-surface-subtle);
  color: var(--sui-semantic-accent-default);
}
.my-pothi-reader__toc-index {
  flex: 0 0 auto;
  min-width: 16px;
  font-size: var(--sui-typography-font-sizes-xs);
  color: var(--sui-semantic-foreground-muted);
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}
.my-pothi-reader__toc-badge {
  flex: 0 0 auto;
  font-size: var(--sui-typography-font-sizes-xs);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: var(--sui-radii-full);
  background: var(--sui-semantic-background-surface);
  color: var(--sui-semantic-foreground-muted);
}
.my-pothi-reader__toc-badge--shabad {
  color: var(--sui-semantic-accent-default);
}
.my-pothi-reader__toc-badge--bani {
  color: #b97a08;
}
.my-pothi-reader__toc-label {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.my-pothi-reader__toc-drawer .sui-drawer__body {
  padding: var(--sui-spacing-2);
}
.my-pothi-reader__item-divider {
  margin: var(--sui-spacing-2) 0;
}
.my-pothi-reader__group-divider {
  display: flex;
  align-items: center;
  gap: var(--sui-spacing-3);
  margin: var(--sui-spacing-7) 0;
}
.my-pothi-reader__group-divider > .sui-divider {
  flex: 1 1 auto;
}
.my-pothi-reader__group-divider-label {
  flex: 0 0 auto;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-accent-default);
}
.my-pothi-reader__error {
  color: var(--sui-semantic-feedback-danger-default);
  text-align: center;
  margin: var(--sui-spacing-3) 0;
}
.my-pothi-reader__bani-name {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-xl);
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-accent-default);
  letter-spacing: 0.04em;
}

.pothi-reader-skeleton {
  width: 100%;
}
.pothi-reader-skeleton__header {
  width: 100%;
}
.pothi-reader-skeleton__title {
  width: min(280px, 58vw);
}
.pothi-reader-skeleton__subtitle {
  width: min(210px, 42vw);
}
.pothi-reader-skeleton__action {
  width: 168px;
  height: 36px;
  margin-top: var(--sui-spacing-2);
}
.pothi-reader-skeleton__section {
  gap: var(--sui-spacing-6);
}
.pothi-reader-skeleton__item {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-4);
}
.pothi-reader-skeleton__meta {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-1);
}
.pothi-reader-skeleton__meta-title {
  width: min(260px, 62%);
}
.pothi-reader-skeleton__meta-detail {
  width: min(180px, 44%);
}
.pothi-reader-skeleton__verses {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-4);
}
.pothi-reader-skeleton__verse {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-1);
}
.pothi-reader-skeleton__gurbani {
  width: min(760px, 92%);
}
.pothi-reader-skeleton__transliteration {
  width: min(620px, 76%);
}
.pothi-reader-skeleton__translation {
  width: min(700px, 84%);
}
.pothi-reader-skeleton__verse:nth-child(even) .pothi-reader-skeleton__gurbani {
  width: min(680px, 84%);
}
.pothi-reader-skeleton__verse:nth-child(even) .pothi-reader-skeleton__transliteration {
  width: min(560px, 68%);
}
.pothi-reader-skeleton__verse:nth-child(even) .pothi-reader-skeleton__translation {
  width: min(640px, 76%);
}

body.has-homepage-bg .layout {
  background-image: var(--homepage-bg);
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  background-repeat: no-repeat;
}

body.has-homepage-bg .layout__main {
  background: transparent;
}

body.has-homepage-bg .footer {
  background: color-mix(in srgb, var(--sui-semantic-background-page) 20%, transparent);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
}

body.has-homepage-bg .footer__copyright {
  color: var(--sui-semantic-foreground-secondary);
}

.homepage-bg-fab {
  position: fixed;
  bottom: calc(73px + 12px);
  right: 24px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: var(--sui-semantic-accent-default);
  cursor: pointer;
  z-index: 50;
  opacity: 1;
  transform: scale(1) translateY(0);
  transform-origin: center;
  transition: opacity 200ms ease, transform 200ms cubic-bezier(0.34, 1.56, 0.64, 1);
}
.homepage-bg-fab:hover {
  transform: translateY(-2px);
}
.homepage-bg-fab:focus-visible {
  outline: 3px solid var(--sui-semantic-accent-muted);
  outline-offset: 2px;
}
.homepage-bg-fab--hidden {
  opacity: 0;
  transform: scale(0.6) translateY(8px);
  pointer-events: none;
}
@media (max-width: 768px) {
  .homepage-bg-fab {
    bottom: calc(72px + 12px);
  }
}

.homepage-bg-popup {
  position: fixed;
  bottom: calc(73px + 12px);
  right: 24px;
  padding: 12px;
  border-radius: var(--sui-radii-lg);
  background: color-mix(in srgb, var(--sui-semantic-background-surface) 60%, transparent);
  border: 1px solid var(--sui-semantic-border-muted);
  box-shadow: var(--sui-shadows-xl);
  font-family: var(--sui-typography-fonts-primary);
  z-index: 51;
  opacity: 0;
  transform: scale(0.85) translateY(8px);
  transform-origin: bottom right;
  pointer-events: none;
  transition: opacity 200ms ease, transform 220ms cubic-bezier(0.34, 1.56, 0.64, 1);
}
.homepage-bg-popup--open {
  opacity: 1;
  transform: scale(1) translateY(0);
  pointer-events: auto;
}
@media (max-width: 768px) {
  .homepage-bg-popup {
    bottom: calc(72px + 12px);
  }
}
.homepage-bg-popup__close {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--sui-semantic-foreground-default);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
.homepage-bg-popup__close:hover {
  color: var(--sui-semantic-accent-default);
}
.homepage-bg-popup__close:focus-visible {
  outline: 2px solid var(--sui-semantic-accent-default);
  outline-offset: 2px;
  border-radius: 50%;
}
.homepage-bg-popup__grid {
  display: grid;
  grid-template-columns: repeat(3, 84px);
  grid-gap: 12px;
  gap: 12px;
  justify-content: center;
  margin-bottom: 24px;
}
.homepage-bg-popup__tile {
  box-sizing: border-box;
  width: 84px;
  height: 84px;
  border: 1px solid var(--sui-semantic-border-muted);
  border-radius: 10px;
  background-color: var(--sui-semantic-background-surface);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  cursor: pointer;
  transition: border-color 0.15s ease, border-width 0.15s ease, transform 0.15s ease;
  padding: 0;
}
.homepage-bg-popup__tile:hover {
  transform: scale(1.03);
}
.homepage-bg-popup__tile--active {
  border: 2px solid #ec9a33;
}
.homepage-bg-popup__tile:focus-visible {
  outline: none;
  border: 2px solid #ec9a33;
}
.homepage-bg-popup__actions {
  display: flex;
  justify-content: space-between;
  gap: var(--sui-spacing-1);
}
.homepage-bg-popup__remove-btn, .homepage-bg-popup__remove-btn:hover, .homepage-bg-popup__remove-btn:focus, .homepage-bg-popup__remove-btn:focus-visible, .homepage-bg-popup__remove-btn:active {
  text-decoration: none !important;
  -webkit-text-decoration-line: none !important;
          text-decoration-line: none !important;
}

.search-side-panel__results .sui-gurbani-display {
  font-family: "Baloo Paaji 2", sans-serif !important;
}

.search-side-panel {
  --side-panel-width: 35vw;
  width: 0;
  flex-shrink: 0;
  overflow: visible;
  border-right: none;
  transition: width 0.3s ease, border-right 0.3s ease;
  height: calc(100dvh - var(--shabad-footer-inset, 0px));
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 5;
}
.search-side-panel--ai {
  --side-panel-width: 50vw;
}
@media (max-width: 1024px) {
  .search-side-panel {
    --side-panel-width: 100vw;
  }
}
.search-side-panel--open {
  width: min(var(--side-panel-width), 708px);
  border-right: 1px solid var(--sui-semantic-border-muted);
}
.search-side-panel__clip {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.search-side-panel__close {
  position: absolute;
  top: 12px;
  right: -18px;
  z-index: 2;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease;
}
@media (max-width: 1024px) {
  .search-side-panel__close {
    top: 6px;
    right: 6px;
  }
}
.search-side-panel--open .search-side-panel__close {
  opacity: 1;
  pointer-events: auto;
}
.search-side-panel__inner {
  position: relative;
  width: min(var(--side-panel-width), 708px);
  padding: 24px 0 30px;
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: var(--app-search-panel-bg);
}
.search-side-panel__inner .search-bar-container {
  max-width: 100%;
}
.search-side-panel__search-bar {
  margin-bottom: 30px;
}
.search-side-panel .sui-search-bar {
  margin: 0 24px;
  margin-bottom: 24px;
}
.search-side-panel .sui-search-bar .sui-search-bar__filters {
  gap: 24px;
}
.search-side-panel .sui-search-bar .sui-search-bar__filters-left .sui-simple-select-wrapper,
.search-side-panel .sui-search-bar .sui-search-bar__filters-right .sui-simple-select-wrapper {
  width: auto;
}
.search-side-panel__tab-panel {
  display: flex;
  flex-direction: column;
  flex: 1 1;
  min-height: 0;
  overflow: hidden;
}
.search-side-panel__results {
  display: flex;
  flex-direction: column;
  flex: 1 1;
  overflow-y: auto;
  padding: 0 24px;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.3) transparent;
}
.search-side-panel__results::-webkit-scrollbar {
  width: 5px;
}
.search-side-panel__results::-webkit-scrollbar-track {
  background: transparent;
}
.search-side-panel__results::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.3);
  border-radius: 9999px;
}
.theme-khalis-blue-dark .search-side-panel__results {
  scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
}
.theme-khalis-blue-dark .search-side-panel__results::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.4);
}
.search-side-panel__loading, .search-side-panel__empty {
  text-align: center;
  padding: 1rem 0;
  color: var(--sui-semantic-foreground-disabled);
  font-size: var(--sui-typography-font-sizes-sm);
}
.search-side-panel .ai-answer-card {
  background: var(--sui-semantic-background-glass);
  border: 1px solid var(--sui-semantic-border-muted);
  border-radius: var(--sui-radii-lg);
  padding: 12px;
  margin: 12px 24px 0;
  color: var(--sui-semantic-foreground-default);
  font-family: "Baloo Paaji 2", sans-serif;
}
.search-side-panel .ai-answer-card__verse {
  font-weight: var(--sui-typography-font-weights-bold);
  font-size: var(--sui-typography-font-sizes-lg);
  line-height: 100%;
  color: var(--sui-semantic-accent-default);
  margin: 0 0 12px;
}
.search-side-panel .ai-answer-card__answer {
  font-weight: var(--sui-typography-font-weights-regular);
  font-size: var(--sui-typography-font-sizes-base);
  line-height: var(--sui-typography-line-heights-base);
  margin: 0;
}
.search-side-panel__other-answers {
  font-family: "Baloo Paaji 2", sans-serif;
  font-weight: var(--sui-typography-font-weights-semibold);
  font-size: var(--sui-typography-font-sizes-base);
  line-height: 100%;
  margin: 24px 24px 12px;
  color: var(--sui-semantic-foreground-default);
}
.search-side-panel__other-answers + .search-side-panel__results .sui-shabad-card {
  padding-left: 0;
  padding-right: 0;
}
@media (max-width: 1024px) {
  .search-side-panel {
    position: fixed;
    left: 0;
    top: 72px;
    width: 100%;
    height: calc(100dvh - 72px);
    z-index: 1000;
    background: var(--sui-semantic-background-page);
    transform: translateX(-100%);
    transition: transform 0.3s ease;
  }
  .search-side-panel--open {
    transform: translateX(0);
  }
  .search-side-panel__inner {
    width: 100vw;
  }
}

.rail-side-panel {
  --rail-panel-width: 456px;
  width: 0;
  flex-shrink: 0;
  overflow: hidden;
  height: calc(100dvh - var(--shabad-footer-inset, 0px));
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  border-right: 1px solid transparent;
  transition: width 0.3s ease, border-color 0.3s ease;
}
.rail-side-panel--index {
  --rail-panel-width: 320px;
}
.rail-side-panel--open {
  width: var(--rail-panel-width);
  border-right-color: var(--sui-semantic-border-muted);
}
.rail-side-panel__inner {
  width: var(--rail-panel-width);
  height: 100%;
}
.rail-side-panel .sundar-gutka-side-panel {
  border-right: none;
  width: 100%;
  max-width: none;
}
@media (max-width: 1024px) {
  .rail-side-panel {
    position: fixed;
    left: 0;
    top: 72px;
    width: 100%;
    height: calc(100dvh - 72px);
    z-index: 1000;
    background: var(--sui-semantic-background-page);
    transform: translateX(-100%);
    transition: transform 0.3s ease;
  }
  .rail-side-panel--open {
    transform: translateX(0);
  }
  .rail-side-panel__inner {
    width: 100%;
  }
}

.mobile-navbar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 10;
}
@media (max-width: 768px) {
  .mobile-navbar {
    display: flex;
  }
}

#app-root {
  overflow: clip;
  display: flex;
  min-height: 100vh;
}

.sui-sidebar {
  height: 100vh;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  align-self: flex-start;
  z-index: 65;
}
@media (max-width: 768px) {
  .sui-sidebar {
    position: fixed;
    right: 0;
    top: 0;
    z-index: 1100;
  }
}

.sidebar-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 12px;
}
.sidebar-footer__help-button {
  padding-left: 6px;
}

.app-main-content {
  flex: 1 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  transition: padding var(--sui-transitions-duration-slow) var(--sui-transitions-timing-ease);
  background: var(--sui-atom-sidebar-background);
}
@media (min-width: 768px) {
  #app-root:has(.sui-sidebar:not(.sui-sidebar--closed)) .app-main-content {
    padding-top: 12px;
    padding-left: 12px;
    padding-bottom: 12px;
  }
}
.app-main-content .layout {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  background-color: var(--sui-semantic-background-page);
  transition: border-radius var(--sui-transitions-duration-slow) var(--sui-transitions-timing-ease);
}
@media (min-width: 768px) {
  #app-root:has(.sui-sidebar:not(.sui-sidebar--closed)) .app-main-content .layout {
    border-radius: var(--sui-radii-lg);
  }
}
@media (max-width: 768px) {
  .app-main-content .layout {
    padding-bottom: 72px;
  }
}
.app-main-content .layout .layout__main {
  flex: 1 1;
}

body.immersive-reading .shabad-header,
body.immersive-reading .shabad-settings,
body.immersive-reading .settings-bottom-bar {
  transition: transform 0.25s var(--sui-transitions-timing-ease, ease);
  will-change: transform;
}

body.immersive-reading.immersive-chrome-hidden .shabad-header {
  transform: translateY(-100%);
}
body.immersive-reading.immersive-chrome-hidden .shabad-settings {
  transform: translateY(calc(-100% - 24px));
}
body.immersive-reading.immersive-chrome-hidden .settings-bottom-bar {
  transform: translateY(100%);
}

.shortcut-tray {
  width: 100%;
}
.shortcut-tray .sui-shortcut-tray {
  display: grid;
  grid-template-columns: repeat(auto-fill, 48px);
  grid-gap: 36px;
  gap: 36px;
  justify-content: space-between;
  padding: 12px 0 6px;
}
@media (max-width: 768px) {
  .shortcut-tray .sui-shortcut-tray {
    justify-content: center;
  }
}
.shortcut-tray .sui-shortcut-tray .sui-labeled-button {
  width: 48px;
  margin: 0 auto;
}
.shortcut-tray .sui-shortcut-tray .sui-labeled-button__title {
  max-width: 80px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shortcut-edit-dialog {
  min-height: 450px;
  max-height: 90vh;
}
@media (max-width: 768px) {
  .shortcut-edit-dialog {
    max-height: 85vh;
    min-height: unset;
  }
}
.shortcut-edit-dialog .sui-dialog__header {
  padding: 12px;
}
.shortcut-edit-dialog .sui-dialog__header .sui-dialog__header-left .sui-button {
  font-weight: var(--sui-typography-font-weights-normal);
  gap: 12px;
}
.shortcut-edit-dialog .sui-dialog__body {
  padding-bottom: 48px;
}
.shortcut-edit-dialog .sui-search-bar {
  padding: 0;
  margin-bottom: 18px;
}
.shortcut-edit-dialog .sui-shortcut-tray {
  padding-left: 0;
  padding-right: 0;
}
.shortcut-edit-dialog .sui-shortcut-tray .sui-adorner {
  margin: 0 auto;
}
.shortcut-edit-dialog .sui-divider {
  margin-top: 18px;
  margin-bottom: 18px;
}

.shortcut-search-panel .suggestion-list__title {
  margin: 0 0 12px;
  text-transform: uppercase;
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-semibold);
  font-size: var(--sui-typography-font-sizes-xs);
  line-height: var(--sui-typography-line-heights-sm);
  letter-spacing: 0.1em;
  color: var(--sui-atom-shortcut-tray-icon-color);
}
.shortcut-search-panel .suggestion-list__list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}
.shortcut-search-panel .suggestion-list__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 12px;
  gap: 12px;
}
.shortcut-search-panel .suggestion-list__button {
  padding: 0;
  font-size: var(--sui-typography-font-sizes-xs);
  color: var(--sui-atom-fateh-tabs-text);
  width: -moz-fit-content;
  width: fit-content;
  cursor: pointer;
  transition: color 0.15s ease;
}
.shortcut-search-panel .suggestion-list__button:hover {
  color: var(--sui-semantic-accent-default);
}
.shortcut-search-panel .suggestion-list__button-english {
  text-transform: capitalize;
}
.shortcut-search-panel > .suggestion-list__title {
  margin: 0 0 12px;
  text-transform: uppercase;
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-semibold);
  font-size: var(--sui-typography-font-sizes-xs);
  line-height: var(--sui-typography-line-heights-sm);
  letter-spacing: 0.1em;
  color: var(--sui-atom-shortcut-tray-icon-color);
}

.controller-shortcut-add-dialog .sui-dialog__header {
  padding-left: 24px;
}
.controller-shortcut-add-dialog .sui-fateh-tabs__panel {
  margin-top: 12px;
}
.controller-shortcut-add-dialog__tabs {
  flex: 1 1 auto;
}

.controller-guru-names-dialog .sui-dialog__header {
  padding-left: 24px;
}
.controller-guru-names-dialog .sui-dialog__body {
  padding: 0;
}
.controller-guru-names-dialog .sui-fateh-tabs__panel {
  margin-top: 12px;
}
.controller-guru-names-dialog__tabs {
  flex: 1 1 auto;
}
.controller-guru-names-dialog__item {
  display: flex;
  align-items: center;
  gap: 12px;
}

.announcement-composer {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  height: 100%;
}
.announcement-composer__title {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-base);
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-foreground-tertiary);
  text-align: center;
}
.announcement-composer__textarea {
  flex: 1 1 auto;
  min-height: 120px;
  padding: 12px;
  border: 1px solid var(--sui-semantic-border-muted, #e6e6e6);
  border-radius: 12px;
  background: var(--sui-semantic-surface-default, #fff);
  color: var(--sui-semantic-text-default, #1a1a1a);
  font: inherit;
  resize: vertical;
}
.announcement-composer__textarea:focus-visible {
  outline: none;
  border-color: var(--sui-semantic-accent-default, #113979);
}
.announcement-composer__present-btn {
  align-self: center;
}

.announcement-display {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: center;
  padding: 24px;
  height: 100%;
  min-height: 0;
}
.announcement-display__text {
  margin: 0;
  text-align: center;
  font-size: 2rem;
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-foreground-tertiary);
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.shabad-audio-player {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: var(--sui-spacing-2) var(--sui-spacing-4) var(--sui-spacing-4);
  border-radius: var(--sui-radii-xl);
  box-shadow: var(--sui-atom-box-gradient-shadow);
}
.shabad-audio-player__close {
  position: absolute;
  top: -12px;
  right: -12px;
  color: var(--sui-semantic-accent-default);
  z-index: 1;
}
.shabad-audio-player__row {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  grid-gap: var(--sui-spacing-2);
  gap: var(--sui-spacing-2);
}
.shabad-audio-player__title {
  margin: 0;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-base);
  font-weight: var(--sui-typography-font-weights-bold);
  line-height: 100%;
  color: var(--sui-semantic-accent-default);
}
.shabad-audio-player__controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
@media (max-width: 768px) {
  .shabad-audio-player__controls {
    gap: 24px;
  }
}
.shabad-audio-player__play-btn--pause {
  color: #CA8320;
}
.shabad-audio-player__play-btn--play {
  color: var(--sui-semantic-accent-default);
}
.shabad-audio-player__skip-btn {
  color: var(--sui-semantic-accent-default);
}
.shabad-audio-player__time {
  justify-self: end;
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-size: var(--sui-typography-font-sizes-base);
  line-height: 100%;
  color: var(--sui-semantic-accent-default);
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.shabad-audio-player__scrubber {
  margin-top: 8px;
}
.shabad-audio-player__footer {
  text-align: right;
  font-size: var(--sui-typography-font-sizes-xs);
  color: var(--sui-semantic-foreground-subtle);
}

.review-translations-banner {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-1);
  padding: var(--sui-spacing-2) var(--sui-spacing-3);
  margin: var(--sui-spacing-4) auto 0;
  width: 100%;
  max-width: 746px;
  border-radius: var(--sui-radii-lg);
  border: 1px solid var(--sui-semantic-accent-muted);
  background-color: var(--sui-semantic-background-subtle, rgba(255, 255, 255, 0.04));
  text-align: center;
  font-family: var(--sui-typography-fonts-primary);
}
.review-translations-banner__heading {
  margin: 0;
  padding: 0;
  font-size: var(--sui-typography-font-sizes-base);
  font-weight: var(--sui-typography-font-weights-bold);
  line-height: 1.3;
}
.review-translations-banner__body {
  margin: 0;
  font-style: italic;
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-muted);
}
.review-translations-banner__process {
  font-size: var(--sui-typography-font-sizes-xs);
  margin-left: var(--sui-spacing-1);
}

.review-translations-link {
  color: var(--sui-semantic-accent-default);
  cursor: pointer;
  text-decoration: underline;
}
.review-translations-link:hover {
  color: var(--sui-semantic-accent-hover);
}

.shabad-review-page {
  max-width: 1080px;
  margin: 0 auto;
  padding: var(--sui-spacing-4) var(--sui-spacing-3);
  font-family: var(--sui-typography-fonts-primary);
  color: var(--sui-semantic-foreground-default);
}
.shabad-review-page__header {
  text-align: center;
  margin-bottom: var(--sui-spacing-5);
}
.shabad-review-page__title {
  margin: 0 0 var(--sui-spacing-1);
  font-size: var(--sui-typography-font-sizes-xl);
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-accent-default);
}
.shabad-review-page__subtitle {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-base);
  color: var(--sui-semantic-foreground-muted);
}
.shabad-review-page__body {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr);
  grid-gap: var(--sui-spacing-4);
  gap: var(--sui-spacing-4);
  align-items: start;
}
@media screen and (max-width: 900px) {
  .shabad-review-page__body {
    grid-template-columns: 1fr;
  }
}
.shabad-review-page__section-title {
  margin: 0 0 var(--sui-spacing-2);
  font-size: var(--sui-typography-font-sizes-lg);
  font-weight: var(--sui-typography-font-weights-bold);
}
.shabad-review-page__verse-list {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-3);
}
.shabad-review-page__feedback {
  position: -webkit-sticky;
  position: sticky;
  top: var(--sui-spacing-4);
}
@media screen and (max-width: 900px) {
  .shabad-review-page__feedback {
    position: static;
  }
}

.shabad-review-skeleton__title {
  width: min(420px, 72vw);
  margin: 0 auto var(--sui-spacing-1);
}
.shabad-review-skeleton__subtitle {
  width: min(620px, 86vw);
  margin: 0 auto;
}
.shabad-review-skeleton__section-title {
  width: 170px;
  margin-bottom: var(--sui-spacing-2);
}
.shabad-review-skeleton__verse {
  min-height: 220px;
}
.shabad-review-skeleton__gurmukhi {
  width: 88%;
}
.shabad-review-skeleton__caption {
  width: 128px;
}
.shabad-review-skeleton__line {
  width: 94%;
}
.shabad-review-skeleton__line--short {
  width: 68%;
}
.shabad-review-skeleton__line--translation {
  width: 76%;
}
.shabad-review-skeleton__verse-action {
  width: 36px;
  height: 36px;
}
.shabad-review-skeleton__ratings {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-2);
}
.shabad-review-skeleton__rating {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sui-spacing-2);
}
.shabad-review-skeleton__rating-label {
  width: 54%;
}
.shabad-review-skeleton__stars {
  width: 132px;
  height: 20px;
}
.shabad-review-skeleton__field-label {
  width: 62%;
}
.shabad-review-skeleton__field-help {
  width: 92%;
}
.shabad-review-skeleton__field {
  width: 100%;
  height: 96px;
}
.shabad-review-skeleton__field--input {
  height: 40px;
}
.shabad-review-skeleton__submit {
  width: 150px;
  height: 40px;
}
@media (max-width: 768px) {
  .shabad-review-skeleton__rating {
    align-items: flex-start;
    flex-direction: column;
  }
  .shabad-review-skeleton__rating-label {
    width: 72%;
  }
}

.verse-review-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-gap: var(--sui-spacing-3);
  gap: var(--sui-spacing-3);
  padding: var(--sui-spacing-3);
  border-radius: var(--sui-radii-lg);
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.verse-review-card--approved {
  border: 1px solid var(--sui-atom-indicator-green, var(--sui-semantic-accent-default));
}
.verse-review-card--rejected {
  border: 1px solid #CA8320;
}
.verse-review-card__content {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-2);
  min-width: 0;
}
.verse-review-card__gurmukhi {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-lg);
  line-height: 1.5;
}
.verse-review-card__teeka, .verse-review-card__translation {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-1);
  padding-top: var(--sui-spacing-2);
  border-top: 1px solid var(--sui-semantic-border-muted, rgba(0, 0, 0, 0.08));
}
.verse-review-card__teeka p, .verse-review-card__translation p {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-default);
  line-height: 1.5;
}
.verse-review-card__caption {
  font-size: var(--sui-typography-font-sizes-xs);
  font-weight: var(--sui-typography-font-weights-medium);
  color: var(--sui-semantic-foreground-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.verse-review-card__actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--sui-spacing-1);
}
.verse-review-card__details-btn {
  align-self: flex-end;
  white-space: nowrap;
}

.shabad-review-card {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-3);
  padding: var(--sui-spacing-3);
  border-radius: var(--sui-radii-lg);
}
.shabad-review-card__field {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-1);
}
.shabad-review-card__label {
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-foreground-default);
}
.shabad-review-card__help {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-xs);
  color: var(--sui-semantic-foreground-muted);
  font-style: italic;
}
.shabad-review-card__textarea, .shabad-review-card__input {
  width: 100%;
  min-height: 96px;
  max-height: 280px;
  padding: var(--sui-spacing-2);
  border-radius: var(--sui-radii-md);
  border: 1px solid var(--sui-semantic-border-default, rgba(0, 0, 0, 0.12));
  background-color: var(--sui-semantic-background-subtle, transparent);
  font-family: inherit;
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-default);
  resize: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.shabad-review-card__textarea:focus, .shabad-review-card__input:focus {
  outline: none;
  border-color: var(--sui-semantic-accent-default);
  box-shadow: 0 0 0 3px var(--sui-semantic-accent-muted);
}
.shabad-review-card__input {
  min-height: 0;
}
.shabad-review-card__divider {
  margin: 0;
  border: 0;
  height: 1px;
  background-color: var(--sui-semantic-border-muted, rgba(0, 0, 0, 0.08));
}
.shabad-review-card__actions {
  display: flex;
  gap: var(--sui-spacing-2);
  margin-top: var(--sui-spacing-1);
}
.shabad-review-card__actions .sui-button {
  gap: var(--sui-spacing-1);
}
.shabad-review-card__submitted {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-2);
  text-align: center;
  padding: var(--sui-spacing-3) 0;
}
.shabad-review-card__title {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-xl);
  color: var(--sui-semantic-accent-default);
}
.shabad-review-card__body {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-muted);
}

.shabad-rating {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-1);
}
.shabad-rating__item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--sui-spacing-2);
  padding: var(--sui-spacing-1) 0;
}
.shabad-rating__label {
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-default);
}

.stars-rating {
  display: inline-flex;
  gap: var(--sui-spacing-1);
}
.stars-rating__star {
  background: none;
  border: 0;
  padding: 2px;
  cursor: pointer;
  color: var(--sui-semantic-foreground-muted);
  transition: color 0.15s ease, transform 0.15s ease;
}
.stars-rating__star:hover {
  transform: scale(1.1);
}
.stars-rating__star--on {
  color: var(--sui-semantic-accent-default);
}

.verse-review-dialog .sui-dialog__header {
  padding: var(--sui-spacing-2);
}
.verse-review-dialog__title {
  margin: 0;
  font-size: var(--sui-typography-font-sizes-base);
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-accent-default);
}
.verse-review-dialog__gurmukhi {
  margin: 0 0 var(--sui-spacing-1);
  font-size: var(--sui-typography-font-sizes-lg);
  text-align: center;
}
.verse-review-dialog__teeka {
  margin: 0 0 var(--sui-spacing-2);
  font-size: var(--sui-typography-font-sizes-base);
  text-align: center;
  color: var(--sui-semantic-foreground-muted);
}
.verse-review-dialog__label {
  display: block;
  margin: var(--sui-spacing-2) 0 var(--sui-spacing-1);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-bold);
}
.verse-review-dialog__select, .verse-review-dialog__textarea {
  width: 100%;
  padding: var(--sui-spacing-2);
  border-radius: var(--sui-radii-md);
  border: 1px solid var(--sui-semantic-border-default, rgba(0, 0, 0, 0.12));
  background-color: var(--sui-semantic-background-subtle, transparent);
  font-family: inherit;
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-default);
}
.verse-review-dialog__select:focus, .verse-review-dialog__textarea:focus {
  outline: none;
  border-color: var(--sui-semantic-accent-default);
}
.verse-review-dialog__textarea {
  min-height: 96px;
  resize: vertical;
  margin-top: var(--sui-spacing-1);
}
.verse-review-dialog__actions {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sui-spacing-3);
}

.new-word {
  color: var(--sui-atom-indicator-green);
  background-color: rgb(from var(--sui-atom-indicator-green) r g b/0.1);
  font-weight: var(--sui-typography-font-weights-bold);
  border-radius: 3px;
  padding: 0 2px;
}

.deleted-word {
  color: var(--sui-atom-indicator-red);
  background-color: rgb(from var(--sui-atom-indicator-red) r g b/0.1);
  text-decoration: line-through;
  border-radius: 3px;
  padding: 0 2px;
}

.about-page {
  max-width: 720px;
  margin: 0 auto;
  padding: 24px;
}
.about-page__heading {
  font-family: var(--sui-typography-fonts-primary);
  font-size: 2rem;
  font-weight: var(--sui-typography-font-weights-semibold);
  color: var(--sui-semantic-accent-default);
  text-align: center;
  margin: 0 0 24px;
}
.about-page__section {
  margin-bottom: 16px;
  padding: 20px;
}
.about-page__text {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-base);
  font-weight: var(--sui-typography-font-weights-normal);
  color: var(--sui-semantic-foreground-default);
  line-height: 1.6;
  margin: 0 0 12px;
}
.about-page__text:last-child {
  margin-bottom: 0;
}
.about-page__label {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-base);
  font-weight: var(--sui-typography-font-weights-semibold);
  color: var(--sui-semantic-foreground-default);
  margin: 0 0 4px;
}
.about-page__link {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-medium);
  color: var(--sui-semantic-accent-default);
  text-decoration: none;
}
.about-page__link:hover {
  text-decoration: underline;
}
.about-page__logos {
  display: flex;
  justify-content: center;
  gap: 48px;
  margin-top: 24px;
}
.about-page__logo-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.about-page__logo-block img {
  max-height: 48px;
  object-fit: contain;
}

.tos-page {
  max-width: 720px;
  margin: 0 auto;
  padding: 24px;
}
.tos-page__header {
  text-align: center;
  margin-bottom: 24px;
}
.tos-page__heading {
  font-family: var(--sui-typography-fonts-primary);
  font-size: 2rem;
  font-weight: var(--sui-typography-font-weights-semibold);
  color: var(--sui-semantic-accent-default);
  margin: 0 0 8px;
}
.tos-page__subheading {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-style: italic;
  color: var(--sui-semantic-foreground-muted);
  margin: 0;
}
.tos-page__section {
  margin-bottom: 16px;
  padding: 20px;
  scroll-margin-top: 80px;
}
.tos-page__section-title {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-lg);
  font-weight: var(--sui-typography-font-weights-semibold);
  color: var(--sui-semantic-foreground-default);
  margin: 0 0 12px;
}
.tos-page__section-body {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-base);
  color: var(--sui-semantic-foreground-default);
  line-height: 1.6;
}
.tos-page__section-body p {
  margin: 0 0 12px;
}
.tos-page__section-body p:last-child {
  margin-bottom: 0;
}
.tos-page__section-body strong {
  font-weight: var(--sui-typography-font-weights-semibold);
}
.tos-page__link {
  color: var(--sui-semantic-accent-default);
  text-decoration: none;
  font-weight: var(--sui-typography-font-weights-medium);
}
.tos-page__link:hover {
  text-decoration: underline;
}

.bani-controller-player {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 6px 12px;
  width: -moz-fit-content;
  width: fit-content;
  border-radius: var(--sui-radii-full);
}
.bani-controller-player__text {
  font-family: var(--sui-typography-fonts-primary);
  font-weight: var(--sui-typography-font-weights-normal);
  font-style: normal;
  font-size: var(--sui-typography-font-sizes-sm);
  line-height: var(--sui-typography-font-sizes-sm);
  letter-spacing: 0;
  text-align: center;
  vertical-align: middle;
  color: var(--sui-semantic-accent-default);
  padding: 0 12px;
}
.bani-controller-player__title-strong {
  font-weight: var(--sui-typography-font-weights-bold);
}
@media (max-width: 768px) {
  .bani-controller-player__title-label {
    display: none;
  }
}
.bani-controller-player__icon-pause {
  color: #CA8320;
}
.bani-controller-player__icon-stop {
  color: #B71E1E;
}
.bani-controller-player__controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.bani-index-links {
  min-height: calc(100vh - 200px);
  align-content: center;
  display: grid;
  grid-template-columns: repeat(4, 240px);
  grid-gap: 48px;
  gap: 48px;
  padding: 48px 24px;
  justify-content: center;
}
.bani-index-links .sui-breadcrumb {
  grid-column: 1/-1;
}
.bani-index-links a:not(.sui-breadcrumb__link) {
  text-decoration: none;
  text-transform: uppercase;
  transition: transform 0.2s ease;
}
.bani-index-links a:not(.sui-breadcrumb__link):hover {
  transform: scale(1.05) translateY(-4px);
}
@media (max-width: 1280px) {
  .bani-index-links {
    grid-template-columns: repeat(2, minmax(0, 240px));
  }
  .bani-index-links .sui-labeled-image img,
  .bani-index-links .sui-image {
    max-width: 240px;
    width: 100% !important;
    height: unset !important;
    aspect-ratio: 1;
    object-fit: cover;
  }
}
@media (max-width: 768px) {
  .bani-index-links {
    gap: 24px;
  }
}

.user-settings-modal .sui-dialog__header {
  padding: var(--sui-spacing-4) var(--sui-spacing-4) 0;
}
.user-settings-modal .sui-dialog__body {
  padding: var(--sui-spacing-2) var(--sui-spacing-4);
}
.user-settings-modal__title {
  margin: 0;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-lg);
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-foreground-default);
}
.user-settings-modal__form {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-2);
  min-width: min(360px, 82vw);
  padding-bottom: var(--sui-spacing-2);
}
.user-settings-modal__avatar-row {
  display: flex;
  align-items: center;
  gap: var(--sui-spacing-2);
}
.user-settings-modal__avatar.sui-button {
  flex-shrink: 0;
  width: 72px;
  height: 72px;
}
.user-settings-modal__avatar-actions {
  display: flex;
  align-items: center;
  gap: var(--sui-spacing-2);
}
.user-settings-modal__field {
  display: flex;
  flex-direction: column;
  gap: var(--sui-spacing-2);
}
.user-settings-modal__label {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-medium);
  color: var(--sui-semantic-foreground-default);
}
.user-settings-modal__hint {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-xs);
  color: var(--sui-semantic-foreground-muted);
}
.user-settings-modal__self-start {
  align-self: flex-start;
}
.user-settings-modal__actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--sui-spacing-2);
  padding-top: var(--sui-spacing-2);
  border-top: 1px solid var(--sui-semantic-border-muted);
}

.notifications-panel {
  display: flex;
  flex-direction: column;
  min-width: 288px;
  max-width: 84vw;
}
.notifications-panel__header {
  margin-bottom: var(--sui-spacing-2);
}
.notifications-panel__title {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-base);
  font-weight: var(--sui-typography-font-weights-bold);
  color: var(--sui-semantic-foreground-default);
}
.notifications-panel__empty {
  margin: 0;
  padding: var(--sui-spacing-4) 0;
  text-align: center;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  color: var(--sui-semantic-foreground-muted);
}
.notifications-panel__list {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 360px;
  overflow-y: auto;
}
.notifications-panel__item {
  padding: var(--sui-spacing-2) 0;
  border-top: 1px solid var(--sui-semantic-border-muted);
}
.notifications-panel__item:first-child {
  border-top: none;
}
.notifications-panel__item-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sui-spacing-2);
}
.notifications-panel__item-title {
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  font-weight: var(--sui-typography-font-weights-medium);
  color: var(--sui-semantic-foreground-default);
}
.notifications-panel__item--unread .notifications-panel__item-title {
  color: var(--sui-semantic-accent-default);
  font-weight: var(--sui-typography-font-weights-bold);
}
.notifications-panel__item-time {
  flex-shrink: 0;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-xs);
  color: var(--sui-semantic-foreground-muted);
}
.notifications-panel__item-body {
  margin: 0;
  font-family: var(--sui-typography-fonts-primary);
  font-size: var(--sui-typography-font-sizes-sm);
  line-height: 1.5;
  color: var(--sui-semantic-foreground-muted);
}

.smartbanner {
  background: #f4f4f4;
  border-bottom: 1px solid #e5e5e5;
  display: flex;
  align-items: center;
  padding: 8px 12px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
  line-height: 1.4;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.smartbanner--ios {
  background: #f4f4f4;
}
.smartbanner--ios .smartbanner__button {
  background: #007aff;
  color: white;
  border-radius: 6px;
  font-weight: 600;
}
.smartbanner--android {
  background: #f8f8f8;
}
.smartbanner--android .smartbanner__button {
  background: #01875f;
  color: white;
  border-radius: 4px;
  font-weight: 500;
}
.smartbanner__exit {
  background: none;
  border: none;
  color: #999;
  cursor: pointer;
  font-size: 20px;
  font-weight: bold;
  line-height: 1;
  margin-right: 8px;
  padding: 0;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: background-color 0.2s;
}
.smartbanner__exit:hover {
  background-color: rgba(0, 0, 0, 0.1);
}
.smartbanner__exit:focus {
  outline: none;
  background-color: rgba(0, 0, 0, 0.1);
}
.smartbanner__icon {
  width: 40px;
  height: 40px;
  margin-right: 12px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 8px;
  flex-shrink: 0;
}
.smartbanner__info {
  flex: 1 1;
  min-width: 0;
  margin-right: 12px;
}
.smartbanner__info__title {
  font-weight: 600;
  color: #333;
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.smartbanner__info__author {
  font-size: 12px;
  color: #666;
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.smartbanner__info__price {
  font-size: 12px;
  color: #999;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.smartbanner__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  border-radius: 6px;
  transition: all 0.2s;
  flex-shrink: 0;
  min-width: 80px;
  text-align: center;
}
.smartbanner__button:hover {
  opacity: 0.9;
  text-decoration: none;
}
.smartbanner__button:focus {
  outline: none;
  opacity: 0.9;
}
.smartbanner__button__label {
  white-space: nowrap;
}

@media (max-width: 480px) {
  .smartbanner {
    padding: 6px 8px;
    font-size: 13px;
  }
  .smartbanner__icon {
    width: 36px;
    height: 36px;
    margin-right: 10px;
  }
  .smartbanner__info {
    margin-right: 10px;
  }
  .smartbanner__button {
    padding: 6px 12px;
    font-size: 12px;
    min-width: 70px;
  }
}
body.smartbanner-hidden {
  margin-top: 0;
}

@keyframes smartbanner-slide-down {
  from {
    transform: translateY(-100%);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}
.smartbanner {
  animation: smartbanner-slide-down 0.3s ease-out;
}

.react-calendar {
  font-size: 18px !important;
  padding: 8px;
}
.react-calendar__navigation button {
  color: var(--sui-semantic-accent-default);
}
.react-calendar__tile--active abbr {
  border-bottom: 1px dotted #fafafa;
  color: #fafafa;
}

.react-date-picker {
  vertical-align: sub;
}
.react-date-picker__inputGroup {
  display: none;
  outline: 0;
}
.react-date-picker__wrapper {
  border-width: 0 !important;
}
.react-date-picker__wrapper:focus {
  outline: 0 !important;
}
.react-date-picker--enabled {
  border-width: 0 !important;
}

.__react_component_tooltip.show {
  opacity: 0.8 !important;
}

html,
:root {
  --app-search-panel-bg: #fcfcfc;
}

.theme-khalis-blue-dark {
  --app-search-panel-bg: #101823;
}

body {
  scroll-behavior: smooth;
}

body {
  background-color: var(--sui-semantic-background-page);
  font-family: "Baloo Paaji 2", sans-serif;
  font-size: 18px;
  height: auto;
  min-height: 100%;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi .larivaar-visraam-igurbani,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .larivaar-visraam-igurbani,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .unicode .larivaar-visraam-igurbani, body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .gurlipi .larivaar-visraam-igurbani,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .larivaar-visraam-igurbani,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .unicode .larivaar-visraam-igurbani, body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi .larivaar-visraam-sttm2,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .larivaar-visraam-sttm2,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .unicode .larivaar-visraam-sttm2, body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .gurlipi .larivaar-visraam-sttm2,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .larivaar-visraam-sttm2,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .unicode .larivaar-visraam-sttm2, body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi .larivaar-visraam-sttm,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi-reading-mode .larivaar-visraam-sttm,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .unicode .larivaar-visraam-sttm, body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .gurlipi .larivaar-visraam-sttm,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .gurlipi-reading-mode .larivaar-visraam-sttm,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .unicode .larivaar-visraam-sttm {
  position: relative !important;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi .larivaar-visraam-igurbani::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .larivaar-visraam-igurbani::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .unicode .larivaar-visraam-igurbani::after, body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .gurlipi .larivaar-visraam-igurbani::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .larivaar-visraam-igurbani::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .unicode .larivaar-visraam-igurbani::after, body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi .larivaar-visraam-sttm2::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .larivaar-visraam-sttm2::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .unicode .larivaar-visraam-sttm2::after, body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .gurlipi .larivaar-visraam-sttm2::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .larivaar-visraam-sttm2::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .unicode .larivaar-visraam-sttm2::after, body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi .larivaar-visraam-sttm::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi-reading-mode .larivaar-visraam-sttm::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .unicode .larivaar-visraam-sttm::after, body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .gurlipi .larivaar-visraam-sttm::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .gurlipi-reading-mode .larivaar-visraam-sttm::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .unicode .larivaar-visraam-sttm::after {
  align-items: center;
  border-bottom: 6px solid transparent;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid;
  content: "";
  display: inline-flex;
  font-weight: bold;
  height: 0;
  justify-content: center;
  padding: 0;
  position: absolute;
  transform: translate(-5px, -90%);
  width: 0;
}
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .gurlipi .visraam-sttm-main,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .gurlipi-reading-mode .visraam-sttm-main,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .unicode .visraam-sttm-main {
  color: #c0392b !important;
}
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .gurlipi .visraam-sttm-yamki,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .gurlipi-reading-mode .visraam-sttm-yamki,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .unicode .visraam-sttm-yamki {
  color: #f39c1d !important;
}
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .gurlipi .larivaar-visraam-sttm-main::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .gurlipi-reading-mode .larivaar-visraam-sttm-main::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .unicode .larivaar-visraam-sttm-main::after {
  border-top-color: #c0392b;
}
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .gurlipi .larivaar-visraam-sttm-yamki::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .gurlipi-reading-mode .larivaar-visraam-sttm-yamki::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm .unicode .larivaar-visraam-sttm-yamki::after {
  border-top-color: #ffc500;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi span,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi-reading-mode span,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .unicode span {
  border-radius: 15px;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi .padchhed .visraam-sttm-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi .padchhed .visraam-sttm-yamki,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi-reading-mode .padchhed .visraam-sttm-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi-reading-mode .padchhed .visraam-sttm-yamki,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .unicode .padchhed .visraam-sttm-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .unicode .padchhed .visraam-sttm-yamki {
  padding-right: 5px;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi .visraam-sttm-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi-reading-mode .visraam-sttm-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .unicode .visraam-sttm-main {
  background: linear-gradient(to right, rgba(229, 229, 229, 0) 20%, rgba(192, 57, 43, 0.7) 100%) !important;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi .visraam-sttm-yamki,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi-reading-mode .visraam-sttm-yamki,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .unicode .visraam-sttm-yamki {
  background: linear-gradient(to right, rgba(229, 229, 229, 0) 20%, rgba(255, 197, 0, 0.7) 100%) !important;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi .larivaar-visraam-sttm-main::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi-reading-mode .larivaar-visraam-sttm-main::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .unicode .larivaar-visraam-sttm-main::after {
  background-color: #c0392b;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi .larivaar-visraam-sttm-yamki::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .gurlipi-reading-mode .larivaar-visraam-sttm-yamki::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm .unicode .larivaar-visraam-sttm-yamki::after {
  background-color: #ffc500;
}
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .gurlipi .visraam-sttm2-main,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .visraam-sttm2-main,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .unicode .visraam-sttm2-main {
  color: #c0392b !important;
}
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .gurlipi .visraam-sttm2-yamki,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .visraam-sttm2-yamki,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .unicode .visraam-sttm2-yamki {
  color: #f39c1d !important;
}
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .gurlipi .larivaar-visraam-sttm2-main::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .larivaar-visraam-sttm2-main::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .unicode .larivaar-visraam-sttm2-main::after {
  border-top-color: #c0392b;
}
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .gurlipi .larivaar-visraam-sttm2-yamki::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .larivaar-visraam-sttm2-yamki::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-sttm2 .unicode .larivaar-visraam-sttm2-yamki::after {
  border-top-color: #ffc500;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi span,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode span,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .unicode span {
  border-radius: 15px;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi .padchhed .visraam-sttm2-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi .padchhed .visraam-sttm2-yamki,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .padchhed .visraam-sttm2-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .padchhed .visraam-sttm2-yamki,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .unicode .padchhed .visraam-sttm2-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .unicode .padchhed .visraam-sttm2-yamki {
  padding-right: 5px;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi .visraam-sttm2-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .visraam-sttm2-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .unicode .visraam-sttm2-main {
  background: linear-gradient(to right, rgba(229, 229, 229, 0) 20%, rgba(192, 57, 43, 0.7) 100%) !important;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi .visraam-sttm2-yamki,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .visraam-sttm2-yamki,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .unicode .visraam-sttm2-yamki {
  background: linear-gradient(to right, rgba(229, 229, 229, 0) 20%, rgba(255, 197, 0, 0.7) 100%) !important;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi .larivaar-visraam-sttm2-main::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .larivaar-visraam-sttm2-main::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .unicode .larivaar-visraam-sttm2-main::after {
  background-color: #c0392b;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi .larivaar-visraam-sttm2-yamki::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .gurlipi-reading-mode .larivaar-visraam-sttm2-yamki::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-sttm2 .unicode .larivaar-visraam-sttm2-yamki::after {
  background-color: #ffc500;
}
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .gurlipi .visraam-igurbani-main,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .visraam-igurbani-main,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .unicode .visraam-igurbani-main {
  color: #c0392b !important;
}
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .gurlipi .visraam-igurbani-yamki,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .visraam-igurbani-yamki,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .unicode .visraam-igurbani-yamki {
  color: #f39c1d !important;
}
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .gurlipi .larivaar-visraam-igurbani-main::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .larivaar-visraam-igurbani-main::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .unicode .larivaar-visraam-igurbani-main::after {
  border-top-color: #c0392b;
}
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .gurlipi .larivaar-visraam-igurbani-yamki::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .larivaar-visraam-igurbani-yamki::after,
body.display-visraams.vishraam-vishraam-options-colored-words.vishraam-vishraam-source-igurbani .unicode .larivaar-visraam-igurbani-yamki::after {
  border-top-color: #ffc500;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi span,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi-reading-mode span,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .unicode span {
  border-radius: 15px;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi .padchhed .visraam-igurbani-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi .padchhed .visraam-igurbani-yamki,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .padchhed .visraam-igurbani-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .padchhed .visraam-igurbani-yamki,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .unicode .padchhed .visraam-igurbani-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .unicode .padchhed .visraam-igurbani-yamki {
  padding-right: 5px;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi .visraam-igurbani-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .visraam-igurbani-main,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .unicode .visraam-igurbani-main {
  background: linear-gradient(to right, rgba(229, 229, 229, 0) 20%, rgba(192, 57, 43, 0.7) 100%) !important;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi .visraam-igurbani-yamki,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .visraam-igurbani-yamki,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .unicode .visraam-igurbani-yamki {
  background: linear-gradient(to right, rgba(229, 229, 229, 0) 20%, rgba(255, 197, 0, 0.7) 100%) !important;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi .larivaar-visraam-igurbani-main::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .larivaar-visraam-igurbani-main::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .unicode .larivaar-visraam-igurbani-main::after {
  background-color: #c0392b;
}
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi .larivaar-visraam-igurbani-yamki::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .gurlipi-reading-mode .larivaar-visraam-igurbani-yamki::after,
body.display-visraams.vishraam-vishraam-options-gradient-bg.vishraam-vishraam-source-igurbani .unicode .larivaar-visraam-igurbani-yamki::after {
  background-color: #ffc500;
}

select {
  border-radius: 2px;
}

/* youtube responsive */
.videoWrapper {
  height: 0;
  padding-bottom: 56.25%;
  /* 16:9 */
  padding-top: 25px;
  position: relative;
}

.videoWrapper iframe {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.wrapper {
  padding: 0 1rem;
}

.error-message {
  align-items: center;
  color: var(--sui-semantic-foreground-default);
  display: flex;
  justify-content: space-around;
  padding: 10vh 5vw;
}
.error-message section {
  max-width: 40vw;
}
.error-message img {
  padding: 5vh 2vw;
}
@media screen and (max-width: 500px) {
  .error-message {
    flex-direction: column-reverse;
  }
  .error-message section {
    max-width: none;
  }
  .error-message img {
    margin-bottom: 10px;
    max-height: 40vh;
    padding: 0;
  }
}

@media screen and (max-width: 800px) {
  h3 {
    font-weight: bold;
  }
}
#progressbar-root {
  left: 0;
  position: fixed;
  top: 0;
  width: 100vw;
  z-index: 5;
}

#fullscreen {
  fill: #fafafa;
}

.fullscreen {
  height: 22px;
}
.fullscreen > svg {
  transition: all 0.2s ease-in;
}
.fullscreen:hover #fullscreen {
  fill: #f39c1d;
}

.fab {
  animation: grow ease-in-out 0.25s;
  cursor: pointer;
  height: 18px;
  transform: translateY(-2px);
}
.fab svg {
  fill: #fafafa;
  transition: all 0.2s ease-in;
}
@keyframes grow {
  from {
    transform: scale(0);
  }
  to {
    transform: scale(1);
  }
}

.scroll-to-top:hover svg {
  fill: #f39c1d;
}

.logo-center {
  margin-top: 10px;
}
.logo-center a img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 150px;
}

.fullscreen-view #freshworks-container {
  display: none;
}

@media screen and (max-width: 600px) {
  .autoscroll-mode #freshworks-container {
    display: none;
  }
}

@media screen and (max-width: 480px) {
  .hide-mobile {
    display: none;
  }
}

@media screen and (max-width: 700px) {
  .hide-tablet {
    display: none;
  }
}

@media screen and (max-width: 1000px) {
  .hide-desktop {
    display: none;
  }
}

.angNo {
  background-color: var(--sui-semantic-accent-default);
  border-radius: 5px;
  color: #fafafa;
  padding: 5px;
}
.angNo:hover {
  background-color: #f39c1d;
  color: #fafafa;
  transition: 0.2s;
}

.load-next-ang {
  align-items: center;
  display: flex;
  justify-content: center;
  padding-top: 24px;
  margin-bottom: 24px;
}

.smartbanner-show {
  margin-top: 80px;
}

.mahankoshTooltipWrapper {
  background-color: rgb(30, 60, 82) !important;
}

.mahankoshTooltipGurbaniWord {
  color: #f39c1d;
  font-size: 2em;
}

.mahankoshTooltipSource {
  font-size: 0.6em;
  font-style: italic;
}

.__react_component_tooltip.show {
  opacity: 0.9 !important;
}

.donate-button {
  font-weight: 700;
}

.transparent-color {
  color: transparent !important;
}

.apps-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: auto;
  width: 100%;
  padding: 0 12px;
  max-width: 684px;
}
@media (max-width: 768px) {
  .apps-container {
    padding: 0 48px;
  }
}

.apps-item {
  flex-grow: 1;
  margin: 0 25px 10px;
  text-align: center;
}

.fp-buttons {
  font-size: 0.9rem;
  line-height: normal;
  margin-top: 15px;
}
.fp-buttons-text {
  font-size: 0.9rem;
  max-width: 140px;
  text-align: center;
}

.sehaj-paath {
  background-color: #da7f00;
}

.apps-text {
  color: #fafafa !important;
}

.apps-icon {
  fill: #fafafa;
  max-height: 60px;
}

.settingsTooltipWrapper {
  background-color: rgb(30, 60, 82) !important;
  max-width: 60%;
}

.logo-long {
  margin: 0 auto 36px auto;
}
@media (max-width: 768px) {
  .logo-long {
    max-width: 200px;
    margin-bottom: 24px;
  }
}

.doodle-hero {
  display: block;
  margin: 0 auto 12px auto;
  max-width: min(360px, 70vw);
  width: 100%;
  text-decoration: none;
}
.doodle-hero__img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--sui-radii-md);
}
@media (max-width: 768px) {
  .doodle-hero {
    max-width: 60vw;
    margin-bottom: 24px;
  }
}

@media (max-width: 768px) {
  #launcher-frame {
    bottom: 72px !important;
  }
  body:has(.sui-sidebar:not(.sui-sidebar--closed)) #launcher-frame {
    right: 0 !important;
    left: unset !important;
    bottom: 24px !important;
  }
}