/* Nepal Interest Rates – Public Styles v1.2.1
 * --------------------------------------------------------------
 * Fixes vs v1.2.0:
 *  - iOS no longer auto-zooms on input focus (16px min font-size)
 *  - No hover transforms on touch devices (eliminates "shake")
 *  - Stronger dark-mode override specificity
 *  - tap highlight removed, touch-action: manipulation
 * --------------------------------------------------------------
 */

/* ── Custom Properties (scoped to wrapper) ──────────────────────────── */
.nlr-wrapper {
	--nlr-accent:        #2563eb;
	--nlr-accent-light:  #dbeafe;
	--nlr-accent-dark:   #1d4ed8;
	--nlr-bg:            #ffffff;
	--nlr-surface:       #f8fafc;
	--nlr-surface-2:     #f1f5f9;
	--nlr-border:        #e2e8f0;
	--nlr-text:          #0f172a;
	--nlr-text-muted:    #64748b;
	--nlr-text-light:    #94a3b8;
	--nlr-gold:          #f59e0b;
	--nlr-silver:        #94a3b8;
	--nlr-bronze:        #cd7c4d;
	--nlr-green:         #059669;
	--nlr-green-bg:      #ecfdf5;
	--nlr-orange:        #d97706;
	--nlr-orange-bg:     #fffbeb;
	--nlr-radius:        14px;
	--nlr-radius-sm:     10px;
	--nlr-radius-xs:     7px;
	--nlr-shadow:        0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.05);
	--nlr-shadow-md:     0 4px 12px rgba(0,0,0,.10);
	--nlr-font:          -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Force dark-mode variables when the wrapper is in dark mode.
   Use multiple selectors to maximize specificity over WP themes. */
.nlr-wrapper[data-theme="dark"],
#nlr-app[data-theme="dark"] {
	--nlr-accent:        #3b82f6;
	--nlr-accent-light:  #1e3a5f;
	--nlr-accent-dark:   #60a5fa;
	--nlr-bg:            #0f172a;
	--nlr-surface:       #1e293b;
	--nlr-surface-2:     #293548;
	--nlr-border:        #334155;
	--nlr-text:          #f1f5f9;
	--nlr-text-muted:    #94a3b8;
	--nlr-text-light:    #64748b;
	--nlr-green:         #34d399;
	--nlr-green-bg:      #022c22;
	--nlr-orange:        #fbbf24;
	--nlr-orange-bg:     #1c1200;
}


/* ── Wrapper Reset ──────────────────────────────────────────────────── */
.nlr-wrapper {
	background:                 var(--nlr-bg);
	color:                      var(--nlr-text);
	font-family:                var(--nlr-font);
	font-size:                  16px;
	line-height:                1.5;
	border-radius:              var(--nlr-radius);
	overflow-x:                 clip;       /* stronger than hidden, no scroll context */
	overflow-y:                 visible;
	box-shadow:                 var(--nlr-shadow-md);
	max-width:                  100%;
	width:                      100%;
	margin-left:                auto;
	margin-right:               auto;
	-webkit-text-size-adjust:   100%;
	text-size-adjust:           100%;
	transform:                  translateZ(0);
	-webkit-backface-visibility:hidden;
	backface-visibility:        hidden;
	contain:                    layout paint;
	scroll-margin-top:          1rem;
}
/* Fallback for browsers without overflow: clip */
@supports not (overflow: clip) {
	.nlr-wrapper { overflow: hidden; }
}

.nlr-wrapper *,
.nlr-wrapper *::before,
.nlr-wrapper *::after {
	box-sizing: border-box;
	margin:     0;
	padding:    0;
	min-width:  0;
}

.nlr-wrapper img { display: block; max-width: 100%; }

.nlr-wrapper button,
.nlr-wrapper select,
.nlr-wrapper input {
	font-family:                inherit;
	color:                      inherit;
	-webkit-tap-highlight-color: transparent;
}

.nlr-wrapper button {
	cursor:        pointer;
	touch-action:  manipulation;
}

.nlr-wrapper a {
	-webkit-tap-highlight-color: transparent;
	touch-action:                manipulation;
}

/* ── Utilities ──────────────────────────────────────────────────────── */
.nlr-no-data {
	padding:    2.5rem 1rem;
	text-align: center;
	color:      var(--nlr-text-muted);
	font-size:  .9rem;
}
.nlr-hidden { display: none !important; }


/* ═══════════════════════════════════════════════════════════════════
   HERO HEADER  (single-bank pages)
   ═══════════════════════════════════════════════════════════════════ */

.nlr-wrapper .nlr-hero {
	display:     flex;
	align-items: center;
	gap:         1rem;
	padding:     1.5rem 1.25rem;
	background:  linear-gradient(135deg, var(--nlr-accent) 0%, var(--nlr-accent-dark) 100%);
	color:       #fff;
}

.nlr-wrapper .nlr-hero-logo-wrap {
	flex-shrink:     0;
	width:           68px;
	height:          68px;
	border-radius:   16px;
	background:      rgba(255,255,255,.18);
	overflow:        hidden;
	display:         flex;
	align-items:     center;
	justify-content: center;
}

.nlr-wrapper .nlr-hero-logo {
	width:      100%;
	height:     100%;
	object-fit: contain;
	padding:    8px;
	background: #fff;
	border-radius: 12px;
}

.nlr-wrapper .nlr-hero-fallback {
	display:         none;
	width:           100%;
	height:          100%;
	align-items:     center;
	justify-content: center;
	font-size:       1rem;
	font-weight:     700;
	color:           #fff;
	letter-spacing:  1.5px;
}

.nlr-wrapper .nlr-hero-content { flex: 1; min-width: 0; }

.nlr-wrapper .nlr-hero-title {
	font-size:     clamp(1.05rem, 4.5vw, 1.45rem);
	font-weight:   700;
	color:         #fff;
	margin:        0 0 .4rem;
	line-height:   1.25;
	word-break:    break-word;
	overflow-wrap: anywhere;
}

.nlr-wrapper .nlr-hero-meta {
	display:     flex;
	flex-wrap:   wrap;
	align-items: center;
	gap:         .3rem .55rem;
	font-size:   .8rem;
	color:       rgba(255,255,255,.88);
}

.nlr-wrapper .nlr-hero-sep { opacity: .45; }

.nlr-wrapper .nlr-hero-base-rate {
	margin:          .55rem 0 0;
	display:         inline-flex;
	align-items:     center;
	gap:             .45rem;
	padding:         .35rem .65rem;
	background:      rgba(255,255,255,.13);
	border:          1px solid rgba(255,255,255,.22);
	border-radius:   8px;
	font-size:       .78rem;
	color:           #fff;
	backdrop-filter: blur(4px);
}
.nlr-wrapper .nlr-hero-br-label  { font-weight: 500; opacity: .82; letter-spacing: .02em; }
.nlr-wrapper .nlr-hero-br-value  { font-weight: 800; font-size: .98rem; color: #fff; }
.nlr-wrapper .nlr-hero-br-period { font-size: .7rem; opacity: .72; font-style: italic; }

.nlr-wrapper .nlr-peek-base .nlr-peek-rate {
	color:        var(--nlr-green, #16a34a);
	font-size:    .85rem;
}
.nlr-wrapper .nlr-peek-base .nlr-peek-label {
	color:        #6b7280;
	font-weight:  600;
	letter-spacing: .02em;
}

.nlr-wrapper .nlr-hero-link {
	color:           rgba(255,255,255,.95);
	text-decoration: none;
	font-weight:     500;
	border-bottom:   1px solid rgba(255,255,255,.45);
	transition:      color .15s, border-color .15s;
}

/* ── Month tag ──────────────────────────────────────────────────────── */
.nlr-wrapper .nlr-month-tag {
	display:        inline-flex;
	align-items:    center;
	padding:        .2rem .6rem;
	border-radius:  20px;
	font-size:      .73rem;
	font-weight:    600;
	background:     rgba(255,255,255,.22);
	color:          #fff;
	letter-spacing: .3px;
	white-space:    nowrap;
}
.nlr-wrapper .nlr-subtitle .nlr-month-tag {
	background: var(--nlr-accent-light);
	color:      var(--nlr-accent);
}
.nlr-wrapper[data-theme="dark"] .nlr-subtitle .nlr-month-tag {
	background: var(--nlr-accent-light);
	color:      var(--nlr-accent-dark);
}


/* ═══════════════════════════════════════════════════════════════════
   SINGLE-BANK DEPOSIT TYPE TABS  (.nlr-sb-*)
   ═══════════════════════════════════════════════════════════════════ */

/* Single-bank deposit-type tabs — wrappable pill chips */
.nlr-wrapper .nlr-sb-tabs {
	display:        flex;
	flex-wrap:      wrap;
	gap:            .45rem;
	padding:        .8rem .85rem;
	background:     var(--nlr-surface);
	border-bottom:  1px solid var(--nlr-border);
}

.nlr-wrapper .nlr-sb-tab {
	display:         inline-flex;
	flex-direction:  column;
	align-items:     center;
	justify-content: center;
	flex:            0 1 auto;
	min-height:      48px;
	padding:         .5rem 1rem;
	border:          1.5px solid var(--nlr-border);
	border-radius:   999px;
	background:      var(--nlr-bg);
	color:           var(--nlr-text-muted);
	transition:      background .15s, border-color .15s, color .15s, box-shadow .15s;
	text-align:      center;
}

.nlr-wrapper .nlr-sb-tab.active {
	background:   var(--nlr-accent);
	border-color: var(--nlr-accent);
	color:        #fff;
	box-shadow:   0 4px 12px rgba(37,99,235,.30);
}

.nlr-wrapper .nlr-sb-label {
	font-size:   .8rem;
	font-weight: 600;
	line-height: 1.2;
}

.nlr-wrapper .nlr-sb-range {
	font-size:   .67rem;
	margin-top:  .22rem;
	opacity:     .8;
	font-weight: 400;
}
.nlr-wrapper .nlr-sb-tab.active .nlr-sb-range { opacity: .95; }

/* ── Single-bank panels ─────────────────────────────────────────────── */
.nlr-wrapper .nlr-sb-panel        { display: none; padding: 1rem; }
.nlr-wrapper .nlr-sb-panel.active { display: block; animation: nlrFade .25s ease; }

@keyframes nlrFade {
	from { opacity: 0; transform: translateY(4px); }
	to   { opacity: 1; transform: translateY(0); }
}


/* ═══════════════════════════════════════════════════════════════════
   RATE CARDS (used by both single-bank & accordion)
   ═══════════════════════════════════════════════════════════════════ */

.nlr-wrapper .nlr-rate-cards {
	display:        flex;
	flex-direction: column;
	gap:            .5rem;
}

.nlr-wrapper .nlr-rate-card {
	display:         flex;
	align-items:     center;
	justify-content: space-between;
	gap:             .75rem;
	padding:         .85rem 1rem;
	background:      var(--nlr-surface);
	border:          1px solid var(--nlr-border);
	border-radius:   var(--nlr-radius-sm);
	transition:      box-shadow .15s, border-color .15s;
	min-height:      54px;
}

.nlr-wrapper .nlr-rate-card.nlr-rc-top {
	border-left: 3px solid var(--nlr-green);
	background:  var(--nlr-green-bg);
}
.nlr-wrapper .nlr-rate-card.nlr-rc-mid {
	border-left: 3px solid var(--nlr-orange);
	background:  var(--nlr-orange-bg);
}

.nlr-wrapper .nlr-rc-name {
	flex:        1;
	font-size:   .88rem;
	font-weight: 500;
	color:       var(--nlr-text);
	line-height: 1.4;
	word-break:  break-word;
}

.nlr-wrapper .nlr-rc-right {
	display:        flex;
	flex-direction: column;
	align-items:    flex-end;
	flex-shrink:    0;
}

.nlr-wrapper .nlr-rc-rate {
	font-size:   1.05rem;
	font-weight: 700;
	color:       var(--nlr-accent);
	white-space: nowrap;
	letter-spacing: -.01em;
}
.nlr-wrapper .nlr-rc-rate.nlr-rc-zero {
	color:       var(--nlr-text-muted);
	font-size:   .9rem;
	font-weight: 400;
}

.nlr-wrapper .nlr-rc-top .nlr-rc-rate { color: var(--nlr-green); }
.nlr-wrapper .nlr-rc-mid .nlr-rc-rate { color: var(--nlr-orange); }

.nlr-wrapper .nlr-rc-upd {
	font-size:   .68rem;
	color:       var(--nlr-text-light);
	margin-top:  .18rem;
	white-space: nowrap;
}

/* ── Official / bank site links ─────────────────────────────────────── */
.nlr-wrapper .nlr-official-note,
.nlr-wrapper .nlr-bank-site-link {
	margin-top: .85rem;
	font-size:  .75rem;
	color:      var(--nlr-text-muted);
	text-align: center;
}
.nlr-wrapper .nlr-official-note a,
.nlr-wrapper .nlr-bank-site-link a {
	color:           var(--nlr-accent);
	text-decoration: none;
	font-weight:     500;
}

/* ── Footer note ────────────────────────────────────────────────────── */
.nlr-wrapper .nlr-footer-note {
	padding:    .9rem 1.25rem;
	background: var(--nlr-surface);
	border-top: 1px solid var(--nlr-border);
}
.nlr-wrapper .nlr-footer-note p {
	font-size:   .73rem;
	color:       var(--nlr-text-muted);
	line-height: 1.65;
	margin:      0;
}
.nlr-wrapper .nlr-footer-note a { color: var(--nlr-accent); text-decoration: none; }


/* ═══════════════════════════════════════════════════════════════════
   ALL-BANKS HEADER
   ═══════════════════════════════════════════════════════════════════ */

/* Hub intro — neutral surface (replaces solid blue Class-A-only header bar) */
.nlr-wrapper .nlr-hub-top {
	display:         flex;
	flex-direction:  column;
	align-items:     flex-start;
	gap:             .65rem;
	padding:         1.15rem 1rem 1rem;
	background:      var(--nlr-surface-2);
	border-bottom:   1px solid var(--nlr-border);
	color:           var(--nlr-text);
}

.nlr-wrapper .nlr-hub-top-inner {
	width:      100%;
	min-width:  0;
}

.nlr-wrapper .nlr-hub-title {
	color:          var(--nlr-text);
	margin:         0 0 .35rem;
	font-size:      clamp(1.05rem, 5vw, 1.4rem);
	font-weight:    700;
	line-height:    1.25;
}

.nlr-wrapper .nlr-hub-tagline {
	font-size:      .82rem;
	color:          var(--nlr-text-muted);
	margin:         0;
	display:        flex;
	flex-wrap:      wrap;
	align-items:    center;
	gap:            .35rem;
}

.nlr-wrapper .nlr-hub-sep { opacity: .45; }

.nlr-wrapper .nlr-hub-top .nlr-month-tag {
	display:       inline-block;
	padding:       .22rem .55rem;
	border-radius: 999px;
	background:    var(--nlr-accent-light);
	color:         var(--nlr-accent-dark);
	font-size:     .78rem;
	font-weight:   600;
}

.nlr-wrapper[data-theme="dark"] .nlr-hub-top .nlr-month-tag {
	background: var(--nlr-accent-light);
	color:      var(--nlr-accent);
}

.nlr-wrapper .nlr-hub-badge .nlr-nrb-label {
	background:  var(--nlr-accent-light);
	color:       var(--nlr-accent-dark);
	border:      1px solid var(--nlr-border);
}

.nlr-wrapper .nlr-class-rank-block {
	margin-top: 1.35rem;
}

.nlr-wrapper .nlr-class-rank-block:first-of-type {
	margin-top: .85rem;
}

.nlr-wrapper .nlr-class-rank-title {
	font-size:      .93rem;
	font-weight:    700;
	margin:         0 0 .55rem;
	padding-bottom: .3rem;
	border-bottom:  2px solid var(--nlr-accent);
	display:        inline-block;
	color:          var(--nlr-text);
}

.nlr-wrapper .nlr-ranked-after-top3 {
	margin-top:   1.35rem;
	padding-top:  1.1rem;
	border-top:   1px solid var(--nlr-border);
}

.nlr-wrapper .nlr-no-data-inline {
	padding:   .6rem 0 .2rem;
	font-size: .84rem;
	text-align: left;
}

/* Legacy: FD-only pages may still reference .nlr-header in older caches */
.nlr-wrapper .nlr-header {
	display:         flex;
	flex-direction:  column;
	align-items:     flex-start;
	gap:             .65rem;
	padding:         1.2rem 1rem 1rem;
	background:      var(--nlr-surface-2);
	border-bottom:   1px solid var(--nlr-border);
	color:           var(--nlr-text);
}

.nlr-wrapper .nlr-header-text { width: 100%; min-width: 0; }

.nlr-wrapper .nlr-main-title {
	font-size:      clamp(1.05rem, 5vw, 1.4rem);
	font-weight:    700;
	color:          var(--nlr-text);
	margin:         0 0 .3rem;
	line-height:    1.25;
	word-break:     break-word;
	overflow-wrap:  anywhere;
}

.nlr-wrapper .nlr-subtitle {
	font-size:   .82rem;
	color:       var(--nlr-text-muted);
	margin:      0;
	display:     flex;
	flex-wrap:   wrap;
	align-items: center;
	gap:         .35rem;
}

.nlr-wrapper .nlr-nrb-label {
	display:        inline-block;
	padding:        .3rem .75rem;
	background:     var(--nlr-accent-light);
	border-radius:  20px;
	font-size:      .72rem;
	font-weight:    600;
	color:          var(--nlr-accent-dark);
	letter-spacing: .5px;
	white-space:    nowrap;
}


/* ═══════════════════════════════════════════════════════════════════
   MAIN TABS (all-banks)
   ═══════════════════════════════════════════════════════════════════ */

/* Tabs are wrappable pill chips — no horizontal scroll, every tab
   always fully visible. Flows to multiple rows on narrow screens. */
.nlr-wrapper .nlr-main-tabs {
	display:        flex;
	flex-wrap:      wrap;
	gap:            .4rem;
	padding:        .75rem .85rem;
	background:     var(--nlr-surface);
	border-bottom:  1px solid var(--nlr-border);
}

.nlr-wrapper .nlr-tab {
	display:        inline-flex;
	align-items:    center;
	gap:            .35rem;
	flex:           0 1 auto;
	min-height:     40px;
	padding:        .5rem .9rem;
	background:     var(--nlr-bg);
	border:         1.5px solid var(--nlr-border);
	border-radius:  999px;
	color:          var(--nlr-text-muted);
	font-size:      .82rem;
	font-weight:    500;
	white-space:    nowrap;
	transition:     background .15s, border-color .15s, color .15s, box-shadow .15s;
}
.nlr-wrapper .nlr-tab.active {
	background:    var(--nlr-accent);
	border-color:  var(--nlr-accent);
	color:         #fff;
	font-weight:   600;
	box-shadow:    0 2px 8px rgba(37,99,235,.3);
}

.nlr-wrapper .nlr-tab-icon { font-size: .95rem; line-height: 1; }

.nlr-wrapper .nlr-tab-panel        { display: none; }
.nlr-wrapper .nlr-tab-panel.active { display: block; animation: nlrFade .25s ease; }


/* ═══════════════════════════════════════════════════════════════════
   SEARCH BAR
   ═══════════════════════════════════════════════════════════════════ */

.nlr-wrapper .nlr-search-bar { padding: .9rem 1rem .5rem; }

/* font-size: 16px is REQUIRED to stop iOS auto-zoom on focus
   (the "shaking" effect on mobile). Do not change. */
.nlr-wrapper #nlr-bank-search {
	width:         100%;
	padding:       .7rem 1rem;
	border:        1px solid var(--nlr-border);
	border-radius: 999px;
	background:    var(--nlr-surface);
	color:         var(--nlr-text);
	font-size:     16px;
	font-family:   var(--nlr-font);
	outline:       none;
	transition:    border-color .15s, box-shadow .15s;
}
.nlr-wrapper #nlr-bank-search:focus {
	border-color: var(--nlr-accent);
	box-shadow:   0 0 0 3px rgba(37,99,235,.15);
}
.nlr-wrapper #nlr-bank-search::placeholder { color: var(--nlr-text-light); }


/* ═══════════════════════════════════════════════════════════════════
   ACCORDION
   ═══════════════════════════════════════════════════════════════════ */

.nlr-wrapper .nlr-accordion {
	padding:        .65rem .75rem;
	display:        flex;
	flex-direction: column;
	gap:            .55rem;
}

.nlr-wrapper .nlr-accordion-item {
	border:                  1px solid var(--nlr-border);
	border-radius:           var(--nlr-radius-sm);
	background:              var(--nlr-surface);
	overflow:                hidden;
	/* Render only when in (or near) viewport — saves paint work on
	   the big 20-bank list. Item shrinks to 80px placeholder when off-screen. */
	content-visibility:      auto;
	contain-intrinsic-size:  0 80px;
}

.nlr-wrapper .nlr-accordion-header {
	display:     flex;
	align-items: center;
	gap:         .65rem;
	width:       100%;
	min-height:  64px;
	padding:     .8rem 1rem;
	background:  none;
	border:      none;
	text-align:  left;
	transition:  background .15s;
}
.nlr-wrapper .nlr-accordion-header[aria-expanded="true"] { background: var(--nlr-surface-2); }

.nlr-wrapper .nlr-bank-identity {
	display:     flex;
	align-items: center;
	gap:         .65rem;
	flex:        1;
	min-width:   0;
}

.nlr-wrapper .nlr-bank-logo-wrap {
	flex-shrink:     0;
	width:           44px;
	height:          44px;
	border-radius:   10px;
	background:      var(--nlr-bg);
	border:          1px solid var(--nlr-border);
	display:         flex;
	align-items:     center;
	justify-content: center;
	overflow:        hidden;
}

.nlr-wrapper .nlr-bank-logo {
	width:      38px;
	height:     38px;
	object-fit: contain;
}

.nlr-wrapper .nlr-logo-text-fallback {
	display:         none;
	width:           100%;
	height:          100%;
	align-items:     center;
	justify-content: center;
	font-size:       .68rem;
	font-weight:     700;
	color:           var(--nlr-accent);
	background:      var(--nlr-accent-light);
	border-radius:   8px;
	letter-spacing:  .5px;
}

.nlr-wrapper .nlr-bank-name-wrap {
	min-width:      0;
	display:        flex;
	flex-direction: column;
}

.nlr-wrapper .nlr-bank-full-name {
	font-size:     .9rem;
	font-weight:   600;
	color:         var(--nlr-text);
	white-space:   nowrap;
	overflow:      hidden;
	text-overflow: ellipsis;
}

.nlr-wrapper .nlr-bank-short {
	font-size: .73rem;
	color:     var(--nlr-text-muted);
}

.nlr-wrapper .nlr-bank-rate-peek {
	display:     flex;
	gap:         .85rem;
	flex-shrink: 0;
}
.nlr-wrapper .nlr-peek-item   { display: flex; flex-direction: column; align-items: flex-end; }
.nlr-wrapper .nlr-peek-label  { font-size: .63rem; color: var(--nlr-text-light); text-transform: uppercase; letter-spacing: .5px; }
.nlr-wrapper .nlr-peek-rate   { font-size: .82rem; font-weight: 700; color: var(--nlr-accent); white-space: nowrap; }

.nlr-wrapper .nlr-chevron {
	font-size:   1.25rem;
	color:       var(--nlr-text-muted);
	flex-shrink: 0;
	transition:  transform .25s;
	line-height: 1;
	margin-left: auto;
}
.nlr-wrapper .nlr-accordion-header[aria-expanded="true"] .nlr-chevron { transform: rotate(180deg); }

.nlr-wrapper .nlr-accordion-body {
	display:    none;
	border-top: 1px solid var(--nlr-border);
}
.nlr-wrapper .nlr-accordion-body.open { display: block; }

/* Inner type tabs — wrappable pill chips */
.nlr-wrapper .nlr-inner-tabs {
	display:       flex;
	flex-wrap:     wrap;
	gap:           .4rem;
	padding:       .65rem .85rem;
	background:    var(--nlr-bg);
	border-bottom: 1px solid var(--nlr-border);
}

.nlr-wrapper .nlr-inner-tab {
	flex:          0 1 auto;
	min-height:    36px;
	padding:       .4rem .85rem;
	border:        1px solid var(--nlr-border);
	border-radius: 999px;
	background:    none;
	color:         var(--nlr-text-muted);
	font-size:     .77rem;
	font-weight:   500;
	white-space:   nowrap;
	transition:    background .15s, border-color .15s, color .15s;
}
.nlr-wrapper .nlr-inner-tab.active {
	background:   var(--nlr-accent);
	border-color: var(--nlr-accent);
	color:        #fff;
}

.nlr-wrapper .nlr-inner-panel        { display: none; padding: .8rem .85rem .9rem; }
.nlr-wrapper .nlr-inner-panel.active { display: block; animation: nlrFade .2s ease; }


/* ═══════════════════════════════════════════════════════════════════
   RANKED LIST
   ═══════════════════════════════════════════════════════════════════ */

.nlr-wrapper .nlr-ranked-wrap { padding: 1rem; }

.nlr-wrapper .nlr-ranked-head { margin-bottom: 1rem; }

.nlr-wrapper .nlr-ranked-title {
	font-size:   1.1rem;
	font-weight: 700;
	color:       var(--nlr-text);
	margin:      0 0 .3rem;
}
.nlr-wrapper .nlr-ranked-hint {
	font-size: .78rem;
	color:     var(--nlr-text-muted);
	margin:    0;
	line-height: 1.5;
}

.nlr-wrapper .nlr-ranked-list {
	display:        flex;
	flex-direction: column;
	gap:            .5rem;
}

.nlr-wrapper .nlr-ranked-row {
	display:               grid;
	grid-template-columns: 2.4rem 1fr auto;
	align-items:           center;
	column-gap:            .7rem;
	row-gap:               .15rem;
	padding:               .8rem .9rem;
	background:            var(--nlr-surface);
	border:                1px solid var(--nlr-border);
	border-radius:         var(--nlr-radius-sm);
	transition:            box-shadow .15s, border-color .15s;
}

.nlr-wrapper .nlr-ranked-row.nlr-medal-gold   { border-left: 3px solid var(--nlr-gold);   background: rgba(245,158,11,.06); }
.nlr-wrapper .nlr-ranked-row.nlr-medal-silver { border-left: 3px solid var(--nlr-silver); background: rgba(148,163,184,.06); }
.nlr-wrapper .nlr-ranked-row.nlr-medal-bronze { border-left: 3px solid var(--nlr-bronze); background: rgba(205,124,77,.06); }

.nlr-wrapper[data-theme="dark"] .nlr-ranked-row.nlr-medal-gold   { background: rgba(245,158,11,.10); }
.nlr-wrapper[data-theme="dark"] .nlr-ranked-row.nlr-medal-silver { background: rgba(148,163,184,.10); }
.nlr-wrapper[data-theme="dark"] .nlr-ranked-row.nlr-medal-bronze { background: rgba(205,124,77,.10); }

.nlr-wrapper .nlr-ranked-num {
	width:           2rem;
	height:          2rem;
	border-radius:   50%;
	display:         flex;
	align-items:     center;
	justify-content: center;
	font-size:       .8rem;
	font-weight:     700;
	background:      var(--nlr-surface-2);
	color:           var(--nlr-text-muted);
	flex-shrink:     0;
	grid-column:     1;
	grid-row:        1 / span 2;
}
.nlr-wrapper .nlr-ranked-num.nlr-medal-gold   { background: var(--nlr-gold);   color: #fff; }
.nlr-wrapper .nlr-ranked-num.nlr-medal-silver { background: var(--nlr-silver); color: #fff; }
.nlr-wrapper .nlr-ranked-num.nlr-medal-bronze { background: var(--nlr-bronze); color: #fff; }

.nlr-wrapper .nlr-ranked-bank-cell {
	display:     flex;
	align-items: center;
	gap:         .55rem;
	min-width:   0;
	grid-column: 2;
	grid-row:    1;
}
.nlr-wrapper .nlr-ranked-bank-cell img {
	width:        30px;
	height:       30px;
	object-fit:   contain;
	border-radius:7px;
	border:       1px solid var(--nlr-border);
	background:   var(--nlr-bg);
	flex-shrink:  0;
}

.nlr-wrapper .nlr-ranked-bank-name {
	min-width:      0;
	display:        flex;
	flex-direction: column;
}
.nlr-wrapper .nlr-rb-short {
	font-size:     .87rem;
	font-weight:   600;
	color:         var(--nlr-text);
	white-space:   nowrap;
	overflow:      hidden;
	text-overflow: ellipsis;
}
.nlr-wrapper .nlr-rb-full {
	font-size:     .68rem;
	color:         var(--nlr-text-muted);
	white-space:   nowrap;
	overflow:      hidden;
	text-overflow: ellipsis;
	display:       none;
}

.nlr-wrapper .nlr-ranked-scheme {
	font-size:     .75rem;
	color:         var(--nlr-text-muted);
	overflow:      hidden;
	text-overflow: ellipsis;
	white-space:   nowrap;
	grid-column:   2;
	grid-row:      2;
}

.nlr-wrapper .nlr-ranked-rate-cell {
	display:        flex;
	flex-direction: column;
	align-items:    flex-end;
	flex-shrink:    0;
	grid-column:    3;
	grid-row:       1 / span 2;
}
.nlr-wrapper .nlr-rr-rate {
	font-size:      1.05rem;
	font-weight:    700;
	color:          var(--nlr-accent);
	white-space:    nowrap;
	letter-spacing: -.01em;
}
.nlr-wrapper .nlr-rr-upd {
	font-size:   .67rem;
	color:       var(--nlr-text-light);
	white-space: nowrap;
	margin-top:  .1rem;
}


/* ═══════════════════════════════════════════════════════════════════
   FD-ONLY SHORTCODE  ([nlr_fixed_deposits])
   ═══════════════════════════════════════════════════════════════════ */

.nlr-wrapper .nlr-fd-stat-row {
	display:               grid;
	grid-template-columns: 1fr 1fr;
	gap:                   .55rem;
	padding:               .85rem 1rem .25rem;
}

.nlr-wrapper .nlr-fd-stat {
	display:        flex;
	flex-direction: column;
	align-items:    flex-start;
	padding:        .7rem .85rem;
	background:     var(--nlr-surface);
	border:         1px solid var(--nlr-border);
	border-radius:  var(--nlr-radius-sm);
	min-width:      0;
}
.nlr-wrapper .nlr-fd-stat-label {
	font-size:      .65rem;
	font-weight:    700;
	color:          var(--nlr-text-muted);
	text-transform: uppercase;
	letter-spacing: .5px;
}
.nlr-wrapper .nlr-fd-stat-value {
	font-size:      1.4rem;
	font-weight:    700;
	color:          var(--nlr-accent);
	letter-spacing: -.02em;
	line-height:    1.1;
	margin-top:     .15rem;
}
.nlr-wrapper .nlr-fd-stat:first-child .nlr-fd-stat-value { color: var(--nlr-green); }
.nlr-wrapper .nlr-fd-stat-hint {
	font-size:  .68rem;
	color:      var(--nlr-text-muted);
	margin-top: .15rem;
	white-space:nowrap;
	overflow:   hidden;
	text-overflow: ellipsis;
	max-width:  100%;
}

/* Best-rate badge inside FD accordion header */
.nlr-wrapper .nlr-fd-best {
	display:        flex;
	flex-direction: column;
	align-items:    flex-end;
	flex-shrink:    0;
	padding:        0 .25rem 0 .35rem;
}
.nlr-wrapper .nlr-fd-best-label {
	font-size:      .6rem;
	font-weight:    700;
	color:          var(--nlr-text-muted);
	text-transform: uppercase;
	letter-spacing: .4px;
}
.nlr-wrapper .nlr-fd-best-value {
	font-size:   1rem;
	font-weight: 700;
	color:       var(--nlr-green);
	white-space: nowrap;
	letter-spacing: -.01em;
}

/* Medal accents on the top-3 FD banks */
.nlr-wrapper .nlr-fd-item.nlr-medal-gold   { border-left: 3px solid var(--nlr-gold); }
.nlr-wrapper .nlr-fd-item.nlr-medal-silver { border-left: 3px solid var(--nlr-silver); }
.nlr-wrapper .nlr-fd-item.nlr-medal-bronze { border-left: 3px solid var(--nlr-bronze); }

/* "★ Best" tag next to the best scheme name within a bank */
.nlr-wrapper .nlr-fd-best-tag {
	display:        inline-block;
	margin-left:    .4rem;
	padding:        .1rem .45rem;
	background:     var(--nlr-gold);
	color:          #fff;
	border-radius:  999px;
	font-size:      .62rem;
	font-weight:    700;
	letter-spacing: .3px;
	vertical-align: middle;
}

/* Tighter FD stats on very small phones */
@media (max-width: 359px) {
	.nlr-wrapper .nlr-fd-stat-row { grid-template-columns: 1fr; }
}


/* ═══════════════════════════════════════════════════════════════════
   COMPARE PANEL
   ═══════════════════════════════════════════════════════════════════ */

.nlr-wrapper .nlr-compare-intro { padding: .9rem 1rem .5rem; }
.nlr-wrapper .nlr-compare-intro p { font-size: .85rem; color: var(--nlr-text-muted); margin: 0; }

/* Mobile-first: selectors stack vertically. Desktop gets side-by-side. */
.nlr-wrapper .nlr-compare-selectors {
	display:        flex;
	flex-direction: column;
	gap:            .65rem;
	padding:        .5rem 1rem 1rem;
}

.nlr-wrapper .nlr-compare-col {
	min-width: 0;
}
.nlr-wrapper .nlr-compare-col label {
	display:        block;
	font-size:      .73rem;
	font-weight:    600;
	color:          var(--nlr-text-muted);
	margin-bottom:  .3rem;
	text-transform: uppercase;
	letter-spacing: .5px;
}

/* font-size: 16px prevents iOS auto-zoom on focus */
.nlr-wrapper .nlr-compare-select {
	display:       block;
	width:         100%;
	max-width:     100%;
	min-width:     0;
	min-height:    44px;
	padding:       .55rem .75rem;
	border:        1px solid var(--nlr-border);
	border-radius: var(--nlr-radius-xs);
	background:    var(--nlr-surface);
	color:         var(--nlr-text);
	font-size:     16px;
	font-family:   var(--nlr-font);
	outline:       none;
	cursor:        pointer;
	box-sizing:    border-box;
}
.nlr-wrapper .nlr-compare-select:focus {
	border-color: var(--nlr-accent);
	box-shadow:   0 0 0 3px rgba(37,99,235,.12);
}

.nlr-wrapper .nlr-compare-vs {
	font-weight: 700;
	color:       var(--nlr-text-muted);
	font-size:   .8rem;
	text-align:  center;
	letter-spacing: 1px;
	padding:     .15rem 0;
	opacity:     .6;
}

/* Tablet+: optional side-by-side compare selectors */
@media (min-width: 640px) {
	.nlr-wrapper .nlr-compare-selectors {
		display:               grid;
		grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
		align-items:           end;
		gap:                   .75rem;
	}
	.nlr-wrapper .nlr-compare-vs {
		text-align:  left;
		padding:     0 .1rem .55rem;
		align-self:  end;
	}
}

.nlr-wrapper #nlr-compare-result {
	padding:    0 1rem 1rem;
}

/* ── Compare cards (replaces the old wide table) ───────────────────── */
.nlr-wrapper .nlr-cmp-empty {
	color:      var(--nlr-text-muted);
	text-align: center;
	padding:    1.5rem .5rem;
	font-size:  .85rem;
	margin:     0;
}

.nlr-wrapper .nlr-cmp-cards {
	display:        flex;
	flex-direction: column;
	gap:            .55rem;
}

.nlr-wrapper .nlr-cmp-section {
	margin:         .85rem 0 .15rem;
	font-size:      .72rem;
	font-weight:    700;
	color:          var(--nlr-text-muted);
	text-transform: uppercase;
	letter-spacing: .5px;
}
.nlr-wrapper .nlr-cmp-section:first-child { margin-top: .25rem; }

.nlr-wrapper .nlr-cmp-card {
	background:    var(--nlr-surface);
	border:        1px solid var(--nlr-border);
	border-radius: var(--nlr-radius-sm);
	padding:       .7rem .85rem .8rem;
}

.nlr-wrapper .nlr-cmp-scheme {
	font-size:     .85rem;
	font-weight:   600;
	color:         var(--nlr-text);
	margin-bottom: .55rem;
	line-height:   1.35;
	word-break:    break-word;
}

.nlr-wrapper .nlr-cmp-banks {
	display:               grid;
	grid-template-columns: 1fr 1fr;
	gap:                   .5rem;
}

.nlr-wrapper .nlr-cmp-bank {
	display:         flex;
	flex-direction:  column;
	align-items:     center;
	justify-content: center;
	padding:         .55rem .4rem;
	background:      var(--nlr-bg);
	border:          1.5px solid var(--nlr-border);
	border-radius:   var(--nlr-radius-xs);
	min-width:       0;
	transition:      border-color .15s, background .15s;
}

.nlr-wrapper .nlr-cmp-bank.nlr-cmp-better {
	border-color: var(--nlr-green);
	background:   var(--nlr-green-bg);
}

.nlr-wrapper .nlr-cmp-bank-name {
	font-size:     .72rem;
	font-weight:   600;
	color:         var(--nlr-text-muted);
	margin-bottom: .25rem;
	white-space:   nowrap;
	overflow:      hidden;
	text-overflow: ellipsis;
	max-width:     100%;
	display:       flex;
	align-items:   center;
	gap:           .25rem;
}

.nlr-wrapper .nlr-cmp-better .nlr-cmp-bank-name { color: var(--nlr-green); }

.nlr-wrapper .nlr-cmp-trophy {
	color:     var(--nlr-gold);
	font-size: .8rem;
}

.nlr-wrapper .nlr-cmp-rate {
	font-size:    1.1rem;
	font-weight:  700;
	color:        var(--nlr-accent);
	white-space:  nowrap;
	letter-spacing: -.01em;
}
.nlr-wrapper .nlr-cmp-better .nlr-cmp-rate { color: var(--nlr-green); }
.nlr-wrapper .nlr-cmp-rate small {
	font-size:   .65em;
	font-weight: 600;
	margin-left: .05rem;
}
.nlr-wrapper .nlr-cmp-na {
	color:       var(--nlr-text-light);
	font-weight: 400;
}


/* ═══════════════════════════════════════════════════════════════════
   HOVER EFFECTS — only on devices with real hover (desktop)
   This is THE KEY FIX for mobile "shaking": touch devices fire :hover
   on tap and the transform stays, making elements appear to jiggle.
   By gating hover under (hover: hover), this never fires on touch.
   ═══════════════════════════════════════════════════════════════════ */
@media (hover: hover) and (pointer: fine) {

	.nlr-wrapper .nlr-rate-card:hover {
		transform:    translateY(-1px);
		box-shadow:   var(--nlr-shadow-md);
		border-color: var(--nlr-accent);
	}

	.nlr-wrapper .nlr-ranked-row:hover {
		transform:    translateY(-1px);
		box-shadow:   var(--nlr-shadow-md);
		border-color: var(--nlr-accent);
	}

	.nlr-wrapper .nlr-sb-tab:not(.active):hover {
		border-color: var(--nlr-accent);
		color:        var(--nlr-accent);
		background:   var(--nlr-accent-light);
	}

	.nlr-wrapper .nlr-tab:not(.active):hover { color: var(--nlr-accent); }

	.nlr-wrapper .nlr-inner-tab:not(.active):hover {
		border-color: var(--nlr-accent);
		color:        var(--nlr-accent);
	}

	.nlr-wrapper .nlr-accordion-header:hover { background: var(--nlr-surface-2); }

	.nlr-wrapper .nlr-hero-link:hover { color: #fff; border-bottom-color: #fff; }

	.nlr-wrapper .nlr-official-note a:hover,
	.nlr-wrapper .nlr-bank-site-link a:hover,
	.nlr-wrapper .nlr-footer-note a:hover { text-decoration: underline; }
}


/* ═══════════════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════════════ */

/* Show full bank name on slightly bigger screens */
@media (min-width: 480px) {
	.nlr-wrapper .nlr-rb-full { display: block; }
}

/* Tablets and up — restore the horizontal header layout */
@media (min-width: 640px) {
	.nlr-wrapper .nlr-header,
	.nlr-wrapper .nlr-hub-top        {
		flex-direction:  row;
		align-items:     center;
		justify-content: space-between;
		gap:             1rem;
		padding:         1.4rem 1.5rem 1.15rem;
	}
	.nlr-wrapper .nlr-header-text,
	.nlr-wrapper .nlr-hub-top-inner   { width: auto; flex: 1; }
	.nlr-wrapper .nlr-main-title         { font-size: 1.5rem; }
	.nlr-wrapper .nlr-hero               { padding: 2rem 1.75rem; gap: 1.25rem; }
	.nlr-wrapper .nlr-hero-logo-wrap     { width: 80px; height: 80px; border-radius: 18px; }
	.nlr-wrapper .nlr-sb-tab             { min-width: 96px; }
	.nlr-wrapper .nlr-accordion          { padding: .85rem; }
	.nlr-wrapper .nlr-accordion-header   { padding: .95rem 1.25rem; }
	.nlr-wrapper .nlr-ranked-wrap        { padding: 1.25rem; }
	.nlr-wrapper .nlr-rate-card          { padding: 1rem 1.15rem; }
}

/* Tighter horizontal rhythm on mobile so the new full-bleed width is used */
@media (max-width: 781px) {
	.nlr-wrapper .nlr-main-tabs       { padding: .65rem .55rem; gap: .4rem; }
	.nlr-wrapper .nlr-tab             { padding: .55rem .75rem; font-size: .82rem; }
	.nlr-wrapper .nlr-tab-icon        { margin-right: .25rem; }
	.nlr-wrapper .nlr-search-bar      { padding: .65rem .65rem .4rem; }
	.nlr-wrapper .nlr-accordion       { padding: .5rem; gap: .5rem; }
	.nlr-wrapper .nlr-accordion-header{ padding: .7rem .75rem; }
	.nlr-wrapper .nlr-accordion-body  { padding: 0; }
	.nlr-wrapper .nlr-inner-tabs      { padding: .55rem .55rem 0; gap: .35rem; }
	.nlr-wrapper .nlr-inner-tab       { padding: .35rem .65rem; font-size: .76rem; }
	.nlr-wrapper .nlr-inner-panel     { padding: .55rem; }
	.nlr-wrapper .nlr-rate-cards      { gap: .45rem; }
	.nlr-wrapper .nlr-rate-card       { padding: .65rem .7rem; }
	.nlr-wrapper .nlr-ranked-wrap     { padding: .65rem; }
	.nlr-wrapper .nlr-ranked-row      { padding: .65rem .65rem; column-gap: .45rem; }
	.nlr-wrapper .nlr-hero            { padding: 1.1rem .85rem; }
	.nlr-wrapper .nlr-footer-note     { padding: .85rem .75rem; }
	.nlr-wrapper .nlr-bank-site-link  { padding: 0 .75rem .65rem; }
	.nlr-wrapper .nlr-official-note   { padding: .55rem .75rem; font-size: .72rem; }
}

/* Very small phones */
@media (max-width: 419px) {
	.nlr-wrapper                     { border-radius: 10px; }
	.nlr-wrapper .nlr-bank-rate-peek { display: none; }
	.nlr-wrapper .nlr-hero           { padding: 1rem .85rem; gap: .65rem; }
	.nlr-wrapper .nlr-hero-logo-wrap { width: 52px; height: 52px; border-radius: 12px; }
	.nlr-wrapper .nlr-hero-meta      { font-size: .73rem; }
	.nlr-wrapper .nlr-header,
	.nlr-wrapper .nlr-hub-top          { padding: 1rem .85rem .9rem; }
	.nlr-wrapper .nlr-subtitle       { font-size: .76rem; }
	.nlr-wrapper .nlr-nrb-label      { font-size: .68rem; padding: .22rem .6rem; }
	.nlr-wrapper .nlr-search-bar     { padding: .75rem .85rem .4rem; }
	.nlr-wrapper .nlr-accordion      { padding: .55rem .55rem; gap: .45rem; }
	.nlr-wrapper .nlr-accordion-header { padding: .7rem .85rem; }
	.nlr-wrapper .nlr-bank-full-name { font-size: .82rem; }
	.nlr-wrapper .nlr-bank-short     { font-size: .68rem; }
	.nlr-wrapper .nlr-rate-card      { padding: .65rem .8rem; }
	.nlr-wrapper .nlr-rc-name        { font-size: .82rem; }
	.nlr-wrapper .nlr-rc-rate        { font-size: .95rem; }
	.nlr-wrapper .nlr-ranked-row     { padding: .65rem .75rem; column-gap: .5rem; }
	.nlr-wrapper .nlr-rb-short       { font-size: .82rem; }
	.nlr-wrapper .nlr-rr-rate        { font-size: 1rem; }
	/* compare selectors already stack on mobile via base styles */
}


/* ═══════════════════════════════════════════════════════════════════
   OVERFLOW CONTAINMENT  (prevents the "shaking" on mobile by ensuring
   nothing inside the wrapper can escape it horizontally)
   ═══════════════════════════════════════════════════════════════════ */
.nlr-wrapper,
.nlr-wrapper .nlr-accordion-body,
.nlr-wrapper .nlr-sb-panel,
.nlr-wrapper .nlr-tab-panel,
.nlr-wrapper .nlr-inner-panel {
	overflow-x: hidden;
}

/* Only the compare result table needs to scroll horizontally — every
   tab strip is now wrap-based, so no other element is allowed to scroll. */
.nlr-wrapper #nlr-compare-result {
	overflow-x: auto;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
	.nlr-wrapper *,
	.nlr-wrapper *::before,
	.nlr-wrapper *::after {
		animation-duration:  .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}

/* ═══════════════════════════════════════════════════════════════════
   MOBILE FULL-BLEED CENTERING (v1.2.1)
   Uses BOTH the negative-margin trick AND a transform-based fallback,
   along with very high specificity (html body) to defeat theme rules.
   A JS helper (initMobileCentering) applies inline styles at runtime
   as the bulletproof last-resort that always wins.
   ═══════════════════════════════════════════════════════════════════ */
@media (max-width: 781px) {
	html body .nlr-wrapper,
	html body .nlr-wrapper.nlr-single,
	html body .nlr-wrapper.nlr-fd-only,
	html body .nlr-wrapper.nlr-shortcode-loan,
	html body .nlr-wrapper.nlr-shortcode-base-rates {
		width:           calc(100vw - 16px) !important;
		max-width:       calc(100vw - 16px) !important;
		margin-left:     calc(50% - 50vw + 8px) !important;
		margin-right:    calc(50% - 50vw + 8px) !important;
		border-radius:   14px !important;
		box-sizing:      border-box !important;
	}
	/* Neutralise parent clipping that would otherwise hide our negative-margin overflow */
	html body .entry-content,
	html body .post-content,
	html body .single-content,
	html body .page-content,
	html body .elementor-widget-container,
	html body .wp-block-shortcode,
	html body .wp-block-group__inner-container,
	html body main,
	html body article {
		overflow-x: visible !important;
	}
}
@media (max-width: 420px) {
	html body .nlr-wrapper {
		width:           calc(100vw - 12px) !important;
		max-width:       calc(100vw - 12px) !important;
		margin-left:     calc(50% - 50vw + 6px) !important;
		margin-right:    calc(50% - 50vw + 6px) !important;
		border-radius:   12px !important;
	}
}

/* When JS adds .nlr-mobile-fixed, defer to inline styles set by the JS helper. */
html body .nlr-wrapper.nlr-mobile-fixed {
	/* JS sets margin-left, margin-right, width, max-width inline.
	   Drop the !important calc rules so the inline styles win. */
	margin-left:  initial;
	margin-right: initial;
}

/* ═══════════════════════════════════════════════════════════════════
   APP-LIKE EXPERIENCE (v1.2.0)
   Native-app feel: momentum scrolling, snap on tab strip, smooth
   transitions with spring easing, larger touch targets, safe-area
   inset support for notched phones, sticky main tabs on scroll.
   ═══════════════════════════════════════════════════════════════════ */
.nlr-wrapper .nlr-main-tabs {
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x:      contain;
	scroll-snap-type:           x proximity;
	scrollbar-width:            none;
}
.nlr-wrapper .nlr-main-tabs::-webkit-scrollbar { display: none; height: 0; }
.nlr-wrapper .nlr-main-tabs .nlr-tab           { scroll-snap-align: start; }

/* Safe-area insets for notched / pill-cutout devices */
@supports (padding: max(0px)) {
	@media (max-width: 781px) {
		.nlr-wrapper {
			padding-left:  max(0px, env(safe-area-inset-left));
			padding-right: max(0px, env(safe-area-inset-right));
		}
	}
}

/* App-style spring easing for tab/accordion transitions */
.nlr-wrapper .nlr-tab,
.nlr-wrapper .nlr-sb-tab,
.nlr-wrapper .nlr-inner-tab,
.nlr-wrapper .nlr-accordion-header,
.nlr-wrapper .nlr-rate-card {
	transition-timing-function: cubic-bezier(.34, 1.56, .64, 1);
}

/* Larger tap targets on touch — meet WCAG 44px minimum */
@media (pointer: coarse) {
	.nlr-wrapper .nlr-tab,
	.nlr-wrapper .nlr-sb-tab,
	.nlr-wrapper .nlr-inner-tab,
	.nlr-wrapper .nlr-accordion-header {
		min-height: 44px;
	}
}

/* App-like sticky tab strip on scroll (subtle elevation when stuck) */
.nlr-wrapper .nlr-main-tabs {
	position: -webkit-sticky;
	position:  sticky;
	top:       0;
	z-index:   20;
	backdrop-filter:         saturate(180%) blur(12px);
	-webkit-backdrop-filter: saturate(180%) blur(12px);
	background:              rgba(255, 255, 255, .92);
}
.nlr-wrapper[data-theme="dark"] .nlr-main-tabs {
	background:              rgba(15, 23, 42, .92);
}

/* Reveal animations honoring reduced-motion */
@media (prefers-reduced-motion: no-preference) {
	.nlr-wrapper .nlr-accordion-item {
		animation: nlrSlideIn .35s cubic-bezier(.34, 1.56, .64, 1) backwards;
	}
	@keyframes nlrSlideIn {
		from { opacity: 0; transform: translateY(8px); }
		to   { opacity: 1; transform: translateY(0); }
	}
}

/* Bottom-padding for last accordion item so FAB / floating buttons don't overlap */
.nlr-wrapper .nlr-footer-note { padding-bottom: max(1rem, env(safe-area-inset-bottom, 1rem)); }

/* Make rate-cards feel pressable on touch (subtle scale) */
@media (hover: none) and (pointer: coarse) {
	.nlr-wrapper .nlr-rate-card:active,
	.nlr-wrapper .nlr-ranked-row:active {
		transform: scale(.985);
		transition: transform .12s ease-out;
	}
}