/* ==========================================================================
   MockMafia app.css — the only stylesheet of the theme (cached by the browser).

   1. VARIABLES   change colours, radius, motion here
   2. SHELL       sidebar, header, search, account menu, phone drawer, bottom bar, footer
   3. MOTION      page cross-fade + theme-switch reveal
   4. YOUR CSS    add your own rules at the very bottom

   Customizer values (primary / accent colour, sidebar background / width, header
   height) and the self-hosted font are printed as a small :root block after this file and win over
   the defaults below. The phone breakpoint is 1024px; keep it in sync with
   MM_PHONE in assets/src/shell.js if you change it.
   ========================================================================== */

/* ---- 1. VARIABLES ---- */
:root{
	color-scheme:light;
	--mm-primary:#1D4ED8;      /* buttons, links, focus (Customizer / StudyLab colour overrides) */
	--mm-accent:#38BDF8;       /* active sidebar marker */
	--mm-bg:#F3F6F8;           /* same palette as StudyLab Quiz */
	--mm-surface:#FFFFFF;
	--mm-text:#1A2433;
	--mm-muted:#5B6B7C;
	--mm-line:#D7DEE4;
	--mm-sb-bg:#0F172A;
	--mm-sb-text:#CBD5E1;
	--mm-sb-w:260px;
	--mm-hh:64px;
	--mm-radius:12px;
	--mm-logo-h:32px;
	/* System stack = the fallback. When assets/fonts/mm-sans.woff2 exists, PHP prints its @font-face and
	   sets --mm-font:"MM Sans",var(--mm-sys). Latin is covered by the file; other scripts use the system fonts. */
	--mm-sys:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans","Noto Sans Devanagari","Helvetica Neue",Arial,sans-serif;
	--mm-font:var(--mm-sys);
	--mm-ease:cubic-bezier(.22,1,.36,1);
	--mm-t:.16s;
}
html[data-theme=dark]{
	color-scheme:dark;
	--mm-bg:#10161F;
	--mm-surface:#182130;
	--mm-text:#E9EEF4;
	--mm-muted:#93A3B6;
	--mm-line:#2C3A4C;
	--mm-sb-bg:#0B111A;
}

/* ---- 2. SHELL ---- */
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--mm-hh,64px) + 16px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

body.mm-shell{--mm-ab:0px;--mm-bb-h:64px;padding-left:var(--mm-sb-w);background:var(--mm-bg);color:var(--mm-text);font-family:var(--mm-font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip;transition:padding-left .28s var(--mm-ease)}
body.mm-shell.admin-bar{--mm-ab:32px}
@media (max-width:782px){body.mm-shell.admin-bar{--mm-ab:46px}}
@media (max-width:600px){body.mm-shell.admin-bar{--mm-ab:0px}}
body.mm-shell *::selection{background:color-mix(in srgb,var(--mm-primary) 28%,transparent)}
body.mm-shell h1,body.mm-shell h2,body.mm-shell h3{text-wrap:balance}
body.mm-shell h1,body.mm-shell h2,body.mm-shell h3,body.mm-shell h4,body.mm-shell h5,body.mm-shell h6{font-family:inherit}

/* Kadence's own header, drawer and footer are replaced by ours. !important only here, against a third-party rule. */
body.mm-shell #masthead,body.mm-shell #mobile-header,body.mm-shell #mobile-drawer,body.mm-shell .kadence-sticky-header,body.mm-shell #colophon{display:none!important}

.mm-i{flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.mm-skip{position:absolute;left:-9999px;top:8px;z-index:200;padding:10px 16px;border-radius:8px;background:var(--mm-primary);color:#fff}
.mm-skip:focus{left:8px}
.mm-sentinel{position:absolute;top:0;left:0;width:1px;height:1px;opacity:0;pointer-events:none}

/* ---- sidebar ---- */
.mm-sidebar{position:fixed;z-index:60;inset:var(--mm-ab) auto 0 0;width:var(--mm-sb-w);display:flex;flex-direction:column;overflow:hidden;background:var(--mm-sb-bg-user,var(--mm-sb-bg));color:var(--mm-sb-text);transition:width .28s var(--mm-ease)}
.mm-sb-top{display:flex;align-items:center;justify-content:space-between;flex:none;height:var(--mm-hh);padding:0 16px}
.mm-sb-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:6px 10px 14px;scrollbar-width:thin;scrollbar-color:rgba(148,163,184,.3) transparent}
.mm-menu,.mm-sub{margin:0;padding:0;list-style:none}
.mm-heading{padding:20px 12px 6px;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;opacity:.5}
.mm-row{display:flex;align-items:center;gap:2px}

.mm-sidebar .mm-link{position:relative;flex:1;min-width:0;display:flex;align-items:center;gap:12px;margin:1px 0;padding:10px 12px;border-radius:var(--mm-radius);color:inherit;font-size:14.5px;font-weight:600;line-height:1.3;text-decoration:none;transition:background-color var(--mm-t),color var(--mm-t)}
.mm-sidebar .mm-link .mm-i{opacity:.75;transition:opacity var(--mm-t),color var(--mm-t)}
.mm-sidebar .mm-link:hover{background:color-mix(in srgb,currentColor 8%,transparent);color:inherit}
.mm-sidebar .mm-link:hover .mm-i{opacity:1}
.mm-sidebar .mm-item.is-current>.mm-row>.mm-link{background:color-mix(in srgb,currentColor 11%,transparent);color:#fff}
.mm-sidebar .mm-item.is-current>.mm-row>.mm-link .mm-i{color:var(--mm-accent);opacity:1}
.mm-sidebar .mm-item.is-current>.mm-row>.mm-link::before{content:"";position:absolute;left:-10px;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:var(--mm-accent)}
.mm-sidebar .mm-txt{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:opacity .16s}

.mm-sidebar .mm-badge{flex:none;margin-left:auto;padding:2px 7px;overflow:visible;border-radius:6px;background:#f59e0b;color:#111827;font-size:9.5px;font-weight:800;letter-spacing:.05em;line-height:1.45;text-overflow:clip}
.mm-sidebar .mm-badge-free{background:#16a34a;color:#fff}
.mm-sidebar .mm-badge-live{background:#ef4444;color:#fff}
.mm-sidebar .mm-badge-hot{background:#f97316;color:#fff}

.mm-sidebar .mm-sub-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;padding:0;border:0;border-radius:var(--mm-radius);background:transparent;color:inherit;box-shadow:none;cursor:pointer;transition:background-color var(--mm-t)}
.mm-sidebar .mm-sub-toggle:hover{background:color-mix(in srgb,currentColor 8%,transparent);color:inherit}
.mm-sub-toggle .mm-i{width:16px;height:16px;transition:transform .25s var(--mm-ease)}
.mm-item.is-open>.mm-row>.mm-sub-toggle .mm-i{transform:rotate(180deg)}
.mm-sub{display:none;padding-left:30px}
.mm-item.is-open>.mm-sub{display:block}
.mm-sidebar .mm-sub .mm-link{padding:8px 12px;font-size:13.5px;font-weight:500}
.mm-hint{padding:12px;font-size:12px;opacity:.7}
.mm-sidebar .mm-hint a{color:inherit;text-decoration:underline}

.mm-sb-foot{flex:none;padding:12px 10px 16px;border-top:1px solid color-mix(in srgb,currentColor 12%,transparent)}
.mm-sidebar .mm-sb-cta{display:flex;align-items:center;justify-content:center;gap:10px;padding:11px 14px;border-radius:var(--mm-radius);background:var(--mm-primary);color:#fff;font-size:14px;font-weight:700;text-decoration:none;transition:background-color var(--mm-t),transform .12s}
.mm-sidebar .mm-sb-cta:hover{background:color-mix(in srgb,var(--mm-primary) 86%,#000);color:#fff}
.mm-sidebar .mm-sb-cta:active{transform:scale(.98)}
.mm-sidebar button.mm-sb-close{display:none}

/* ---- brand ---- */
a.mm-brand,a.mm-brand:hover{display:inline-flex;align-items:center;min-width:0;color:inherit;font-size:21px;font-weight:800;letter-spacing:-.015em;text-decoration:none;transition:opacity .16s}
.mm-logo{display:block;width:auto;max-width:100%;height:var(--mm-logo-h,32px)}

/* ---- header ---- */
.mm-header{position:sticky;top:var(--mm-ab);z-index:50;display:flex;align-items:center;gap:14px;height:var(--mm-hh);padding:0 22px;border-bottom:1px solid var(--mm-line);background:var(--mm-surface);background:color-mix(in srgb,var(--mm-surface) 86%,transparent);-webkit-backdrop-filter:saturate(1.5) blur(14px);backdrop-filter:saturate(1.5) blur(14px);color:var(--mm-text);transition:box-shadow .3s}
.mm-header.is-scrolled{box-shadow:0 12px 28px -22px rgba(15,23,42,.5)}
html[data-theme=dark] .mm-header.is-scrolled{box-shadow:0 12px 28px -18px rgba(0,0,0,.7)}

.mm-header .mm-icon-btn,.mm-sidebar .mm-icon-btn{display:inline-flex;align-items:center;justify-content:center;flex:none;width:40px;height:40px;padding:0;border:0;border-radius:var(--mm-radius);background:transparent;color:inherit;box-shadow:none;cursor:pointer;transition:background-color var(--mm-t),transform .12s}
.mm-header .mm-icon-btn:hover,.mm-sidebar .mm-icon-btn:hover{background:color-mix(in srgb,currentColor 9%,transparent);color:inherit}
.mm-header .mm-icon-btn:active,.mm-sidebar .mm-icon-btn:active{transform:scale(.92)}
.mm-header .mm-i,.mm-sidebar .mm-icon-btn .mm-i{width:22px;height:22px}

/* these three are shown/hidden by layout; equal specificity, order does the work */
.mm-header .mm-menu-btn,.mm-header .mm-search-btn,.mm-header .mm-brand-hd{display:none}
.mm-can-collapse .mm-header .mm-menu-btn,.mm-layout-under .mm-header .mm-brand-hd{display:inline-flex}

.mm-search{position:relative;display:flex;flex:1;max-width:560px}
.mm-header .mm-search input[type=search]{width:100%;height:42px;padding:0 46px 0 18px;border:1px solid var(--mm-line);border-radius:999px;background:var(--mm-bg);color:inherit;font:inherit;font-size:14.5px;box-shadow:none;transition:border-color .2s,box-shadow .2s,background-color .2s}
.mm-header .mm-search input[type=search]:focus{outline:0;border-color:var(--mm-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--mm-primary) 20%,transparent)}
.mm-header .mm-search .mm-search-go{position:absolute;top:50%;right:3px;width:36px;height:36px;margin-top:-18px;border-radius:50%}

.mm-actions{display:flex;align-items:center;gap:8px;margin-left:auto}
.mm-header .mm-btn{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 20px;border:1px solid var(--mm-primary);border-radius:var(--mm-radius);background:var(--mm-primary);color:#fff;font-size:14px;font-weight:700;line-height:1;text-decoration:none;white-space:nowrap;transition:background-color var(--mm-t),border-color var(--mm-t),transform .12s}
.mm-header .mm-btn:hover{border-color:transparent;background:color-mix(in srgb,var(--mm-primary) 86%,#000);color:#fff}
.mm-header .mm-btn:active{transform:scale(.97)}
.mm-header .mm-btn-ghost{border-color:var(--mm-line);background:transparent;color:inherit}
.mm-header .mm-btn-ghost:hover{border-color:var(--mm-line);background:color-mix(in srgb,currentColor 8%,transparent);color:inherit}
.mm-header a.mm-avatar{transition:box-shadow .2s,transform .12s}
.mm-header .mm-avatar:hover{box-shadow:0 0 0 3px color-mix(in srgb,var(--mm-primary) 25%,transparent)}
.mm-header .mm-avatar:active{transform:scale(.94)}

/* light/dark switch: moon and sun trade places */
.mm-theme-ic{position:relative;display:block;width:22px;height:22px}
.mm-theme-ic .mm-i{position:absolute;inset:0;transition:transform .55s var(--mm-ease),opacity .3s}
.mm-theme-ic .mm-i-sun{opacity:0;transform:rotate(-80deg) scale(.4)}
html[data-theme=dark] .mm-theme-ic .mm-i-sun{opacity:1;transform:none}
html[data-theme=dark] .mm-theme-ic .mm-i-moon{opacity:0;transform:rotate(80deg) scale(.4)}

/* ---- live search ---- */
.mm-search .mm-sr{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:80;max-height:min(70vh,430px);padding:6px;overflow:auto;overscroll-behavior:contain;border:1px solid var(--mm-line);border-radius:calc(var(--mm-radius) + 6px);background:var(--mm-surface);box-shadow:0 28px 56px -24px rgba(15,23,42,.4),0 2px 8px rgba(15,23,42,.06);opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .16s,transform .24s var(--mm-ease),visibility 0s linear .24s}
html[data-theme=dark] .mm-search .mm-sr{box-shadow:0 28px 56px -20px rgba(0,0,0,.75)}
.mm-search .mm-sr.is-open{opacity:1;visibility:visible;transform:none;transition:opacity .16s,transform .24s var(--mm-ease),visibility 0s}
.mm-sr a.mm-sr-i{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:var(--mm-radius);color:var(--mm-text);text-decoration:none;transition:background-color var(--mm-t)}
.mm-sr a.mm-sr-i:hover,.mm-sr a.mm-sr-i[aria-selected=true]{background:color-mix(in srgb,var(--mm-primary) 9%,transparent);color:var(--mm-text)}
.mm-sr-ic{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:11px;background:color-mix(in srgb,var(--mm-primary) 12%,transparent);color:var(--mm-primary)}
html[data-theme=dark] .mm-sr-ic{color:color-mix(in srgb,var(--mm-primary) 55%,#fff)}
.mm-sr-ic .mm-i{width:19px;height:19px}
.mm-sr-tx{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.mm-sr-tx b{overflow:hidden;font-size:14.5px;font-weight:600;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}
.mm-sr-tx mark{background:none;color:inherit;font-weight:800;box-shadow:inset 0 -.42em 0 color-mix(in srgb,var(--mm-primary) 22%,transparent)}
.mm-sr-meta{display:flex;align-items:center;gap:6px;color:var(--mm-muted);font-size:12px;font-weight:600}
.mm-chip{padding:1px 6px;border-radius:5px;background:color-mix(in srgb,#16a34a 16%,transparent);color:#15803d;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.mm-chip-pro{background:color-mix(in srgb,#f59e0b 20%,transparent);color:#b45309}
html[data-theme=dark] .mm-chip{color:#4ade80}
html[data-theme=dark] .mm-chip-pro{color:#fbbf24}
.mm-sr-go{flex:none;width:16px;height:16px;color:var(--mm-muted);opacity:0;transform:translateX(-4px) rotate(-90deg);transition:opacity var(--mm-t),transform .2s var(--mm-ease)}
.mm-sr a.mm-sr-i:hover .mm-sr-go,.mm-sr a.mm-sr-i[aria-selected=true] .mm-sr-go{opacity:1;transform:rotate(-90deg)}
.mm-sr-empty{padding:20px 14px;color:var(--mm-muted);font-size:14px;text-align:center}
.mm-sr-empty b{color:var(--mm-text)}
.mm-search.is-loading .mm-search-go .mm-i{opacity:0}
.mm-search.is-loading .mm-search-go::after{content:"";position:absolute;width:16px;height:16px;border:2px solid color-mix(in srgb,currentColor 25%,transparent);border-top-color:var(--mm-primary);border-radius:50%;animation:mm-spin .6s linear infinite}
@keyframes mm-spin{to{transform:rotate(360deg)}}

/* ---- account menu ---- */
.mm-acct{position:relative}
.mm-avatar{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:50%;background:var(--mm-primary);color:#fff;font-size:15px;font-weight:800;line-height:1;text-decoration:none}
.mm-avatar-lg{width:44px;height:44px;font-size:17px}
.mm-acct-menu{position:absolute;top:calc(100% + 10px);right:0;z-index:80;width:272px;padding:8px;border:1px solid var(--mm-line);border-radius:calc(var(--mm-radius) + 6px);background:var(--mm-surface);color:var(--mm-text);box-shadow:0 28px 56px -24px rgba(15,23,42,.4),0 2px 8px rgba(15,23,42,.06);opacity:0;visibility:hidden;transform:translateY(-6px) scale(.97);transform-origin:top right;transition:opacity .16s,transform .26s var(--mm-ease),visibility 0s linear .26s}
html[data-theme=dark] .mm-acct-menu{box-shadow:0 28px 56px -20px rgba(0,0,0,.75)}
.mm-acct.is-open .mm-acct-menu{opacity:1;visibility:visible;transform:none;transition:opacity .16s,transform .26s var(--mm-ease),visibility 0s}
.mm-acct-head{display:flex;align-items:center;gap:12px;padding:8px 8px 12px}
.mm-acct-who{display:flex;flex-direction:column;min-width:0}
.mm-acct-who b{overflow:hidden;font-size:15px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.mm-acct-who small{overflow:hidden;color:var(--mm-muted);font-size:12.5px;text-overflow:ellipsis;white-space:nowrap}
.mm-acct-plan{display:flex;align-items:center;gap:8px;margin:0 0 6px;padding:9px 10px;border-radius:var(--mm-radius);background:color-mix(in srgb,var(--mm-text) 5%,transparent);color:var(--mm-muted);font-size:12.5px;font-weight:700}
.mm-acct-plan .mm-i{width:16px;height:16px}
.mm-acct-plan span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mm-acct-plan.is-pro{background:color-mix(in srgb,#f59e0b 14%,transparent);color:#b45309}
html[data-theme=dark] .mm-acct-plan.is-pro{color:#fbbf24}
.mm-acct-plan a{padding:3px 10px;border-radius:999px;background:var(--mm-primary);color:#fff;font-size:12px;font-weight:700;text-decoration:none}
.mm-acct-plan a:hover{color:#fff;background:color-mix(in srgb,var(--mm-primary) 86%,#000)}
.mm-acct-menu .mm-acct-i{display:flex;align-items:center;gap:12px;padding:10px;border-radius:var(--mm-radius);color:var(--mm-text);font-size:14.5px;font-weight:600;text-decoration:none;transition:background-color var(--mm-t)}
.mm-acct-menu .mm-acct-i:hover{background:color-mix(in srgb,var(--mm-text) 7%,transparent);color:var(--mm-text)}
.mm-acct-menu .mm-acct-i .mm-i{width:19px;height:19px;color:var(--mm-muted)}
.mm-acct-menu button.mm-acct-i{width:100%;border:0;background:none;font:inherit;font-size:14.5px;font-weight:600;text-align:left;cursor:pointer;box-shadow:none}
.mm-acct-menu .mm-acct-i[hidden]{display:none}
.mm-acct-menu form{margin:0}
.mm-acct-menu .mm-acct-out{margin-top:4px;border-top:1px solid var(--mm-line);border-radius:0 0 var(--mm-radius) var(--mm-radius);padding-top:13px}

/* ---- header buttons: extra variants ---- */
.mm-header .mm-btn-pro{gap:7px;border-color:transparent;background:linear-gradient(135deg,#f59e0b,#ea580c);color:#fff}
.mm-header .mm-btn-pro:hover{border-color:transparent;background:linear-gradient(135deg,#f59e0b,#ea580c);filter:brightness(1.06);color:#fff}
.mm-header .mm-btn-pro .mm-i{width:16px;height:16px;fill:currentColor}

/* ---- phone drawer: who is signed in ---- */
.mm-sb-user{display:none}
.mm-sidebar a.mm-sb-me{display:flex;align-items:center;gap:12px;margin:0 10px 6px;padding:10px;border-radius:calc(var(--mm-radius) + 2px);background:color-mix(in srgb,currentColor 8%,transparent);color:inherit;text-decoration:none;transition:background-color var(--mm-t)}
.mm-sidebar a.mm-sb-me:hover{background:color-mix(in srgb,currentColor 12%,transparent);color:inherit}
.mm-sb-me-tx{display:flex;flex-direction:column;min-width:0}
.mm-sb-me-tx b{overflow:hidden;color:#fff;font-size:15px;text-overflow:ellipsis;white-space:nowrap}
.mm-sb-me-tx small{overflow:hidden;font-size:12.5px;opacity:.75;text-overflow:ellipsis;white-space:nowrap}
.mm-sb-me-tx small.is-pro{color:#fbbf24;opacity:1}
.mm-sidebar a.mm-sb-btn{flex:1;padding:11px 14px;border:1px solid color-mix(in srgb,currentColor 25%,transparent);border-radius:var(--mm-radius);color:inherit;font-size:14px;font-weight:700;text-align:center;text-decoration:none;transition:background-color var(--mm-t)}
.mm-sidebar a.mm-sb-btn-fill{border-color:var(--mm-primary);background:var(--mm-primary);color:#fff}
.mm-sidebar a.mm-sb-btn:hover{color:inherit;background:color-mix(in srgb,currentColor 9%,transparent)}
.mm-sidebar a.mm-sb-btn-fill:hover{color:#fff;background:color-mix(in srgb,var(--mm-primary) 86%,#000)}

.mm-overlay,.mm-bottom{display:none}

.mm-sidebar a:focus-visible,.mm-sidebar button:focus-visible,.mm-header a:focus-visible,.mm-header button:focus-visible,.mm-header input:focus-visible,.mm-tab:focus-visible{outline:2px solid color-mix(in srgb,var(--mm-primary) 70%,#fff);outline-offset:2px}

/* ---- desktop ---- */
@media (min-width:1024px){
	.mm-layout-under .mm-sidebar{top:calc(var(--mm-ab) + var(--mm-hh))}
	.mm-layout-under .mm-header{margin-left:calc(var(--mm-sb-w)*-1)}
	.mm-layout-under .mm-sb-top{display:none}
	.mm-layout-under .mm-sb-scroll{padding-top:12px}

	/* collapsed: width shrinks, icons stay exactly where they are */
	html.mm-collapsed{--mm-sb-w:64px}
	html.mm-collapsed .mm-txt,html.mm-collapsed .mm-brand-sb{opacity:0;pointer-events:none}
	html.mm-collapsed .mm-sub,html.mm-collapsed .mm-item.is-open>.mm-sub,html.mm-collapsed .mm-sub-toggle,html.mm-collapsed .mm-hint{display:none}
	html.mm-collapsed .mm-heading{height:1px;margin:14px 12px;padding:0;overflow:hidden;background:currentColor;opacity:.14}
	html.mm-collapsed .mm-sidebar .mm-sb-cta{gap:0;padding-left:0;padding-right:0}
	html.mm-collapsed .mm-sb-cta .mm-txt{display:none}
}

/* ---- phones and small tablets ---- */
@media (max-width:1023.98px){
	body.mm-shell{padding-left:0}
	body.mm-has-bb{padding-bottom:calc(var(--mm-bb-h) + env(safe-area-inset-bottom,0px))}
	body.mm-drawer-open{overflow:hidden}

	.mm-header{gap:6px;padding:0 10px}
	.mm-shell .mm-header .mm-menu-btn,.mm-shell .mm-header .mm-search-btn,.mm-shell .mm-header .mm-brand-hd{display:inline-flex}
	.mm-search{display:none}
	.mm-header.mm-search-open .mm-search{position:absolute;top:100%;left:0;right:0;display:flex;max-width:none;padding:10px 12px;border-bottom:1px solid var(--mm-line);background:var(--mm-surface);box-shadow:0 14px 24px -18px rgba(15,23,42,.45)}
	.mm-header.mm-search-open .mm-search .mm-search-go{right:15px}
	.mm-header .mm-btn{height:36px;padding:0 14px;font-size:13px}
	.mm-header .mm-btn-cta{display:none}

	/* inputs below 16px make iOS Safari zoom the page on focus */
	.mm-header .mm-search input[type=search]{font-size:16px}
	.mm-sb-user{display:flex;gap:8px;margin:0 10px 6px}
	.mm-sb-user .mm-sb-me{flex:1;margin:0}
	.mm-header.mm-search-open .mm-search .mm-sr{top:calc(100% - 2px);left:12px;right:12px}
	.mm-header .mm-btn-pro,.mm-header .mm-btn-signup{display:none}
	.mm-header .mm-btn-login{border-color:var(--mm-primary);background:var(--mm-primary);color:#fff}
	.mm-header .mm-btn-login:hover{border-color:transparent;background:color-mix(in srgb,var(--mm-primary) 86%,#000);color:#fff}
	.mm-acct{position:static}
	.mm-acct-menu{top:calc(100% + 6px);right:10px;left:10px;width:auto}

	/* drawer */
	.mm-sidebar{z-index:100;inset:0 auto 0 0;width:min(86vw,320px);transform:translateX(-100%);visibility:hidden;box-shadow:16px 0 48px -16px rgba(0,0,0,.55);transition:transform .36s var(--mm-ease),visibility 0s linear .36s;will-change:transform}
	body.mm-drawer-open .mm-sidebar{transform:none;visibility:visible;transition:transform .36s var(--mm-ease),visibility 0s}
	.mm-sidebar button.mm-sb-close{display:inline-flex}
	.mm-overlay{display:block;position:fixed;inset:0;z-index:90;background:rgba(8,12,20,.55);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s linear .3s}
	body.mm-drawer-open .mm-overlay{opacity:1;visibility:visible;transition:opacity .3s,visibility 0s}

	/* bottom bar */
	.mm-bottom{position:fixed;z-index:70;left:0;right:0;bottom:0;display:flex;height:calc(var(--mm-bb-h) + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);border-top:1px solid var(--mm-line);background:var(--mm-surface);background:color-mix(in srgb,var(--mm-surface) 90%,transparent);-webkit-backdrop-filter:saturate(1.5) blur(14px);backdrop-filter:saturate(1.5) blur(14px)}
	.mm-bottom .mm-tab{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:0;color:var(--mm-muted);font-size:11px;font-weight:700;line-height:1.1;text-decoration:none;-webkit-tap-highlight-color:transparent;transition:color .2s}
	.mm-tab-ic{display:grid;place-items:center;width:56px;height:30px;border-radius:999px;transition:background-color .3s var(--mm-ease),transform .15s}
	.mm-tab:active .mm-tab-ic{transform:scale(.9)}
	.mm-tab-lb{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
	.mm-bottom .mm-tab .mm-i{width:22px;height:22px}
	.mm-bottom .mm-tab.is-active{color:var(--mm-primary)}
	html[data-theme=dark] .mm-bottom .mm-tab.is-active{color:color-mix(in srgb,var(--mm-primary) 55%,#fff)}
	.mm-bottom .mm-tab.is-active .mm-tab-ic{background:color-mix(in srgb,var(--mm-primary) 15%,transparent)}
}

@media (prefers-reduced-motion:reduce){
	body.mm-shell,.mm-sidebar,.mm-overlay,.mm-theme-ic .mm-i,.mm-sub-toggle .mm-i{transition:none}
}

/* temporary fallback while the theme flips in browsers without View Transitions */
html.mm-theming *,html.mm-theming *::before,html.mm-theming *::after{transition:background-color .3s,border-color .3s,color .3s,fill .3s,stroke .3s!important}

/* One page background. Kadence paints its boxed content wrapper with a second colour, which shows as a
   lighter panel with darker gutters beside it. Cards (StudyLab's or yours) sit directly on the page colour. */
body.mm-shell .content-bg,body.mm-shell .entry{background:transparent;box-shadow:none}

/* Dark mode for Kadence page content. Theme-owned rules that read --mm-* variables;
   Kadence's own --global-palette variables are never touched. Blocks with colours set
   by hand (Kadence Blocks rows, custom backgrounds) keep those colours; add rules for
   them in section 4 if you need them to follow the switch. */
html[data-theme=dark] body.mm-shell .entry{color:var(--mm-text)}
html[data-theme=dark] body.mm-shell :is(h1,h2,h3,h4,h5,h6,.entry-title,.entry-title a){color:var(--mm-text)}
html[data-theme=dark] body.mm-shell :is(input:not([type=submit],[type=button],[type=checkbox],[type=radio]),textarea,select){background:var(--mm-bg);color:var(--mm-text);border-color:var(--mm-line)}
html[data-theme=dark] body.mm-shell :is(hr,table,th,td,blockquote){border-color:var(--mm-line)}

/* ---- home cards: "Live now" strip + "Continue your last test" ---- */
.mm-live,.mm-continue{display:flex;align-items:center;gap:14px;margin:0 0 18px;padding:12px 16px;border:1px solid var(--mm-line);border-radius:calc(var(--mm-radius) + 4px);background:var(--mm-surface)}
.mm-live[hidden],.mm-continue[hidden],.mm-live-i[hidden]{display:none}
.mm-live-tag{display:flex;align-items:center;flex:none;gap:8px;color:#ef4444;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.mm-live-tag i{width:8px;height:8px;border-radius:50%;background:currentColor;animation:mm-pulse 1.6s ease-out infinite}
@keyframes mm-pulse{from{box-shadow:0 0 0 0 color-mix(in srgb,currentColor 55%,transparent)}to{box-shadow:0 0 0 9px transparent}}
.mm-live-list{display:flex;gap:10px;min-width:0;overflow-x:auto;scrollbar-width:none}
.mm-live-list::-webkit-scrollbar{display:none}
.mm-live a.mm-live-i{display:flex;flex:none;flex-direction:column;gap:2px;max-width:280px;padding:8px 14px;border-radius:var(--mm-radius);background:color-mix(in srgb,var(--mm-primary) 8%,transparent);color:var(--mm-text);text-decoration:none;transition:background-color var(--mm-t)}
.mm-live a.mm-live-i:hover{background:color-mix(in srgb,var(--mm-primary) 15%,transparent);color:var(--mm-text)}
.mm-live-i b{overflow:hidden;font-size:14.5px;text-overflow:ellipsis;white-space:nowrap}
.mm-live-i small{color:var(--mm-muted);font-size:12.5px;font-variant-numeric:tabular-nums}
.mm-live-i time{color:var(--mm-text);font-weight:700}
.mm-continue-ic{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:12px;background:color-mix(in srgb,var(--mm-primary) 12%,transparent);color:var(--mm-primary)}
.mm-continue-tx{display:flex;flex:1;flex-direction:column;min-width:0}
.mm-continue-tx small,.mm-continue-n{color:var(--mm-muted);font-size:12.5px}
.mm-continue-tx small{font-weight:600}
.mm-continue-tx b{overflow:hidden;font-size:15.5px;text-overflow:ellipsis;white-space:nowrap}
.mm-continue a.mm-btn{box-sizing:border-box;display:inline-flex;align-items:center;flex:none;height:40px;padding:0 20px;border-radius:var(--mm-radius);background:var(--mm-primary);color:#fff;font-size:14px;font-weight:700;text-decoration:none;transition:background-color var(--mm-t),transform .12s}
.mm-continue a.mm-btn:hover{background:color-mix(in srgb,var(--mm-primary) 86%,#000);color:#fff}
.mm-continue a.mm-btn:active{transform:scale(.97)}
@media (max-width:560px){.mm-live{flex-direction:column;align-items:flex-start;gap:8px}.mm-live-list{width:100%}.mm-continue{flex-wrap:wrap}.mm-continue-tx{flex-basis:calc(100% - 60px)}.mm-continue a.mm-btn{width:100%;justify-content:center}}
@media (prefers-reduced-motion:reduce){.mm-live-tag i{animation:none}}

/* ---- footer: up to 4 link columns, copyright, social icons (no JS) ---- */
.mm-footer{border-top:1px solid var(--mm-line);background:var(--mm-surface);color:var(--mm-muted);font-size:14px}
.mm-fcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:28px 32px;max-width:1100px;margin:0 auto;padding:36px 24px 12px}
.mm-fc-h{margin:0 0 10px;color:var(--mm-text);font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.mm-fcol ul{margin:0;padding:0;list-style:none}
.mm-fcol li{margin:0 0 8px}
.mm-footer a{color:inherit;text-decoration:none;transition:color var(--mm-t)}
.mm-footer a:hover{color:var(--mm-primary)}
.mm-fbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;max-width:1100px;margin:0 auto;padding:18px 24px 22px}
.mm-fcols+.mm-fbar{border-top:1px solid var(--mm-line)}
.mm-fbar p{margin:0}
.mm-social{display:flex;gap:6px}
.mm-social a{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;transition:background-color var(--mm-t),color var(--mm-t)}
.mm-social a:hover{background:color-mix(in srgb,var(--mm-primary) 12%,transparent)}
.mm-social svg{width:18px;height:18px}

/* ---- 3. MOTION ---- */
@view-transition{navigation:auto}

.mm-sidebar{view-transition-name:mm-sidebar}
.mm-header{view-transition-name:mm-header}
.mm-bottom{view-transition-name:mm-bottom}

::view-transition-old(root),::view-transition-new(root){animation-duration:.2s;animation-timing-function:ease}

/* light/dark switch: circular reveal from the button (class set by shell.js) */
html.mm-vt .mm-sidebar,html.mm-vt .mm-header,html.mm-vt .mm-bottom{view-transition-name:none}
html.mm-vt::view-transition-old(root),html.mm-vt::view-transition-new(root){animation:none;mix-blend-mode:normal}
html.mm-vt::view-transition-old(root){z-index:1}
html.mm-vt::view-transition-new(root){z-index:2}

@media (prefers-reduced-motion:reduce){
	::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
}

/* ---- 4. YOUR CSS ---------------------------------------------------------
   Rules added here are cached with the rest of the file and survive theme and
   Kadence updates. */