/* =========================================================================
   Daily Quiz — site-wide design layer (3.68)
   Carries the homepage language to every page: Persian-tile palette
   (lapis, firooze, saffron, pomegranate) on a cool paper ground, Lalezar for
   page titles, Vazirmatn for everything else, flat white surfaces with one
   hairline border instead of glass blur. Loaded last, so it restyles the
   existing markup without touching PHP.
   ========================================================================= */
:root {
	--hv-ink: #13183a;
	--hv-lapis: #2340c8;
	--hv-lapis-deep: #1a2e9e;
	--hv-lapis-soft: #e8ecfd;
	--hv-firooze: #0f9e91;
	--hv-firooze-soft: #e2f6f3;
	--hv-saffron: #ffb31f;
	--hv-saffron-soft: #fff3d6;
	--hv-anar: #e23d5b;
	--hv-anar-soft: #fde8ec;
	--hv-paper: #f4f6fd;
	--hv-white: #ffffff;
	--hv-line: #dce2f5;
	--hv-muted: #545d80;
	--hv-display: "Lalezar", "Vazirmatn", Tahoma, sans-serif;
	--hv-text: "Vazirmatn", Tahoma, sans-serif;
	--hv-r-lg: 22px;
	--hv-r-md: 16px;
	--hv-r-sm: 12px;
	/* old tokens re-pointed so legacy rules pick up the new palette */
	--c-blue-600: var(--hv-lapis);
	--c-blue-500: var(--hv-lapis);
	--c-slate-900: var(--hv-ink);
	--c-slate-800: var(--hv-ink);
	--dq-brand: var(--hv-lapis);
}

/* ---------- base ---------- */
body:not(.dq-theme-pattern):not([class*="dq-study-bg-"]) { background: var(--hv-paper) !important; }
body { font-family: var(--hv-text); color: var(--hv-ink); }
.dq-blob { display: none !important; }
.dq-main h1, .dq-main .dq-page-title, .dq-main .dq-panel-title, .dq-main .dq-section-title {
	font-family: var(--hv-display); font-weight: 400; letter-spacing: 0; color: var(--hv-ink);
}
.text-muted { color: var(--hv-muted) !important; }
.text-gradient-ice { background: none !important; -webkit-text-fill-color: currentColor !important; color: var(--hv-lapis) !important; }

/* ---------- surfaces: flat white, one hairline ---------- */
html body .glass-panel,
html body .dq-section-card,
html body .dq-aside-card,
html body .glass-sidebar {
	background: var(--hv-white) !important;
	border: 1px solid var(--hv-line) !important;
	box-shadow: none !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
	border-radius: var(--hv-r-lg);
}
html body .dq-section-card, html body .dq-aside-card { padding: clamp(1.1rem, 2.4vw, 1.6rem); }

/* ---------- buttons ---------- */
html body .dq-btn {
	border-radius: 14px; font-weight: 800; font-family: var(--hv-text);
	min-height: 2.9rem; padding-inline: 1.25rem; border: 2px solid transparent;
	box-shadow: none; filter: none; transition: transform .12s ease, background-color .15s ease, border-color .15s ease;
}
html body .dq-btn:active { transform: translateY(1px); }
html body .dq-btn-primary { background: var(--hv-lapis) !important; color: #fff !important; box-shadow: 0 5px 0 var(--hv-lapis-deep) !important; }
html body .dq-btn-primary:hover { background: #2a4ae0 !important; filter: none; }
html body .dq-btn-dark { background: var(--hv-ink) !important; color: #fff !important; border-color: var(--hv-ink) !important; }
html body .dq-btn-dark:hover { background: #222a5e !important; filter: none; box-shadow: none; }
html body .dq-btn-ghost { background: var(--hv-white) !important; color: var(--hv-ink) !important; border-color: var(--hv-line) !important; }
html body .dq-btn-ghost:hover { border-color: var(--hv-ink) !important; }
html body .dq-btn-sm { min-height: 2.3rem; padding-inline: .9rem; font-size: .85rem; border-radius: 11px; }
html body .dq-btn[disabled], html body .dq-btn:disabled { opacity: .5; cursor: not-allowed; }
.dq-link-btn { color: var(--hv-lapis); font-weight: 700; }

/* ---------- forms ---------- */
html body .dq-label { font-weight: 800; font-size: .88rem; color: var(--hv-ink); margin-bottom: .4rem; display: block; }
html body .dq-input,
html body .dq-main select,
html body .dq-main textarea,
html body .dq-main input[type="text"],
html body .dq-main input[type="email"],
html body .dq-main input[type="tel"],
html body .dq-main input[type="number"],
html body .dq-main input[type="password"],
html body .dq-main input[type="url"],
html body .dq-main input[type="search"] {
	background: var(--hv-white); border: 1.5px solid var(--hv-line); border-radius: var(--hv-r-sm);
	min-height: 2.9rem; padding: .6rem .9rem; font-family: var(--hv-text); font-size: .95rem; color: var(--hv-ink);
	box-shadow: none; transition: border-color .15s ease;
}
html body .dq-main textarea, html body textarea.dq-input { min-height: 6rem; line-height: 1.9; }
html body .dq-input:focus, html body .dq-main select:focus, html body .dq-main textarea:focus, html body .dq-main input:focus {
	border-color: var(--hv-ink) !important; box-shadow: none !important; outline: none;
}
html body .dq-input::placeholder, html body .dq-main textarea::placeholder { color: #9aa2c2; }
.dq-main input[type="file"] { font-family: var(--hv-text); font-size: .85rem; }
.dq-main input[type="file"]::file-selector-button { border: 1.5px solid var(--hv-line); background: var(--hv-paper); border-radius: 10px; padding: .45rem .9rem; margin-inline-end: .7rem; font-family: var(--hv-text); font-weight: 700; color: var(--hv-ink); cursor: pointer; }
.dq-main input[type="checkbox"], .dq-main input[type="radio"] { accent-color: var(--hv-lapis); }

/* ---------- tabs: segmented control ---------- */
html body .dq-tabs { background: var(--hv-paper); border: 1px solid var(--hv-line); border-radius: 14px; padding: .3rem; gap: .3rem; }
html body .dq-tabs button, html body .dq-tabs > a { border-radius: 10px; font-weight: 800; font-size: .88rem; color: var(--hv-muted); padding: .55rem .8rem; }
html body .dq-tabs button.is-active, html body .dq-tabs > a.is-active { background: var(--hv-white); color: var(--hv-ink); box-shadow: 0 1px 0 var(--hv-line), 0 2px 8px -4px rgba(19, 24, 58, .25); }

/* ---------- small parts ---------- */
html body .dq-badge { border-radius: 999px; font-weight: 800; font-size: .75rem; padding: .2rem .65rem; border: 0; }
html body .dq-badge-blue { background: var(--hv-lapis-soft); color: var(--hv-lapis); }
html body .dq-badge-amber { background: var(--hv-saffron-soft); color: #9a5f00; }
html body .dq-badge-green { background: var(--hv-firooze-soft); color: var(--hv-firooze); }
html body .dq-badge-rose, html body .dq-badge-red { background: var(--hv-anar-soft); color: var(--hv-anar); }
html body .dq-note { background: var(--hv-paper); border: 0; border-inline-start: 4px solid var(--hv-lapis); border-radius: 12px; color: var(--hv-ink); padding: .8rem 1rem; line-height: 1.9; }
html body .dq-note:empty { display: none; }
html body .dq-note-error { border-inline-start-color: var(--hv-anar); background: var(--hv-anar-soft); }
html body .dq-note-success { border-inline-start-color: var(--hv-firooze); background: var(--hv-firooze-soft); }
html body .dq-progress { background: var(--hv-paper); border-radius: 999px; overflow: hidden; }
html body .dq-progress > *, html body .dq-progress i, html body .dq-progress span { background: var(--hv-firooze); border-radius: inherit; }
.dq-main table { border-collapse: separate; border-spacing: 0; width: 100%; }
.dq-main table th { font-weight: 800; color: var(--hv-muted); font-size: .82rem; text-align: start; padding: .7rem .8rem; border-bottom: 1px solid var(--hv-line); background: transparent; }
.dq-main table td { padding: .75rem .8rem; border-bottom: 1px solid var(--hv-paper); }
.dq-main table tr:hover td { background: #fafbff; }

/* stat tiles */
html body .dq-stat-card { background: var(--hv-white) !important; border: 1px solid var(--hv-line) !important; border-radius: var(--hv-r-md) !important; box-shadow: none !important; }
html body .dq-stat-card::before, html body .dq-stat-card::after { display: none !important; }
html body .dq-stat-card .value { font-family: var(--hv-display); font-weight: 400; font-size: 1.8rem; color: var(--hv-ink); }
html body .dq-stat-card .label { color: var(--hv-muted); font-weight: 700; }

/* modals */
html body .dq-modal { background: var(--hv-white); border: 1px solid var(--hv-line); border-radius: var(--hv-r-lg); box-shadow: 0 30px 60px -28px rgba(19, 24, 58, .5); }
html body .dq-modal-head h4 { font-family: var(--hv-display); font-weight: 400; font-size: 1.35rem; }

/* ---------- header ---------- */
html body .dq-header.glass-navbar {
	background: rgba(255, 255, 255, .92) !important; border-bottom: 1px solid var(--hv-line) !important;
	box-shadow: none !important; -webkit-backdrop-filter: saturate(1.4) blur(10px); backdrop-filter: saturate(1.4) blur(10px);
}
html body .dq-brand-name { font-family: var(--hv-display); font-weight: 400; font-size: 1.45rem; color: var(--hv-ink); letter-spacing: 0; }
html body .dq-nav { background: transparent !important; border: 0 !important; box-shadow: none !important; }
html body .dq-nav > a, html body .dq-nav > .dq-nav-has-sub > a { color: var(--hv-ink); font-weight: 700; border-radius: 10px; }
html body .dq-nav > a:hover, html body .dq-nav > .dq-nav-has-sub > a:hover { background: var(--hv-paper); color: var(--hv-ink); }
html body .dq-nav > a.is-active, html body .dq-nav > a[aria-current="page"] { background: var(--hv-lapis-soft); color: var(--hv-lapis); }
html body .dq-header-actions > .dq-btn, html body .dq-header-actions .dq-btn-dark { background: var(--hv-lapis) !important; border-color: var(--hv-lapis) !important; box-shadow: 0 4px 0 var(--hv-lapis-deep) !important; }
html body .dq-icon-btn { background: var(--hv-white); border: 1px solid var(--hv-line); border-radius: 12px; box-shadow: none; color: var(--hv-ink); }
html body .dq-profile-chip { background: var(--hv-white); border: 1px solid var(--hv-line); box-shadow: none; }
html body .dq-nav-sub, html body .dq-profile-menu, html body .dq-bell-dropdown { border-radius: var(--hv-r-md) !important; box-shadow: 0 24px 48px -24px rgba(19, 24, 58, .35) !important; }

/* ---------- footer: a full-width ink band ---------- */
html body .dq-footer { margin-top: 0; padding: 0; background: var(--hv-ink); color: #c9cdea; }
html body .dq-footer > .dq-container.glass-panel {
	background: transparent !important; border: 0 !important; border-radius: 0; box-shadow: none !important;
	padding: clamp(2.5rem, 5vw, 3.75rem) 1.25rem 1.5rem; max-width: 76rem;
}
html body .dq-footer h5 { color: #fff; font-weight: 900; font-size: .98rem; }
html body .dq-footer a { color: #c9cdea; font-size: .9rem; }
html body .dq-footer a:hover { color: var(--hv-saffron); }
html body .dq-footer .text-muted, html body .dq-footer p { color: #a9aed4 !important; }
html body .dq-footer .dq-brand-name { color: #fff; }
html body .dq-footer .dq-input { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .16); color: #fff; }
html body .dq-footer .dq-input::placeholder { color: #8d93c0; }
html body .dq-footer .dq-input:focus { border-color: var(--hv-saffron) !important; }
html body .dq-footer .dq-btn-primary { background: var(--hv-saffron) !important; color: var(--hv-ink) !important; box-shadow: 0 5px 0 #c98700 !important; background-image: none !important; }
html body .dq-footer-bottom { border-top-color: rgba(255, 255, 255, .1) !important; color: #8d93c0; }
html body .dq-footer-credit a { color: var(--hv-saffron); }

/* =========================================================================
   USER PANEL
   ========================================================================= */
html body .dq-panel-layout { grid-template-columns: 17rem minmax(0, 1fr); gap: 1.5rem; padding-block: 1.5rem 3rem; }
html body .dq-panel-sidebar.glass-sidebar {
	background: var(--hv-white) !important; color: var(--hv-ink); padding: 1rem; border-radius: var(--hv-r-lg);
}
@media (min-width: 961px) {
	html body .dq-panel-sidebar.glass-sidebar { position: relative; top: auto; max-height: none !important; overflow: visible !important; }
	html body .dq-panel-sidebar .dq-panel-menu { overflow: visible !important; flex: none !important; }
}
html body .dq-panel-user .dq-badge { background: var(--hv-lapis) !important; color: #fff !important; }
html body .dq-panel-sidebar::before, html body .dq-panel-sidebar::after { display: none !important; }
html body .dq-panel-user {
	display: flex; align-items: center; gap: .8rem; padding: .9rem; margin-bottom: .9rem;
	background: var(--hv-paper) !important; border: 0 !important; border-radius: var(--hv-r-md); color: var(--hv-ink);
}
html body .dq-panel-user b { color: var(--hv-ink) !important; font-weight: 900; font-size: 1rem; }
html body .dq-panel-user small, html body .dq-panel-user span:not(.dq-badge) { color: var(--hv-muted) !important; }
html body .dq-panel-avatar { width: 3.2rem; height: 3.2rem; border-radius: 50%; border: 3px solid var(--hv-white); box-shadow: 0 0 0 2px var(--hv-lapis); object-fit: cover; background: var(--hv-lapis); }
html body .dq-panel-menu { display: grid; gap: .2rem; }
html body .dq-panel-menu a {
	color: var(--hv-ink) !important; background: transparent !important; font-weight: 700; font-size: .92rem;
	padding: .55rem .6rem; border-radius: 12px; gap: .7rem; box-shadow: none !important;
}
html body .dq-panel-menu a .ico {
	display: grid; place-items: center; flex: none; width: 2.1rem; height: 2.1rem; border-radius: 10px;
	background: var(--hv-paper) !important; color: var(--hv-lapis) !important; border: 0 !important;
}
html body .dq-panel-menu a:hover { background: var(--hv-paper) !important; }
html body .dq-panel-menu a.is-active { background: var(--hv-lapis) !important; color: #fff !important; }
html body .dq-panel-menu a.is-active .ico { background: rgba(255, 255, 255, .16) !important; color: #fff !important; }
html body .dq-panel-logout {
	display: flex; align-items: center; gap: .7rem; margin-top: .9rem; padding: .6rem; border-radius: 12px;
	background: var(--hv-anar-soft) !important; color: var(--hv-anar) !important; font-weight: 800; border: 0 !important; box-shadow: none !important;
}
html body .dq-panel-logout .ico { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: 10px; background: var(--hv-white); }

/* the content column: sections sit directly on the page, each block is a white card */
html body .dq-panel-content { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }
html body .dq-panel-content > .glass-panel { padding: clamp(1.1rem, 2.4vw, 1.75rem); }
html body .dq-panel-title {
	font-family: var(--hv-display) !important; font-weight: 400 !important; font-size: clamp(1.6rem, 2.6vw, 2.1rem) !important;
	color: var(--hv-ink) !important; border: 0 !important; padding: 0 !important; margin: 0 0 1.1rem !important; line-height: 1.4;
}
html body .dq-panel-title::before, html body .dq-panel-title::after { display: none !important; }

/* dashboard hero + wallet */
html body .dq-dashboard-hero {
	background: var(--hv-ink) !important; border: 0 !important; border-radius: var(--hv-r-lg) !important; overflow: hidden; position: relative; isolation: isolate;
}
html body .dq-dashboard-hero::before {
	content: ""; position: absolute; z-index: -1; width: 22rem; height: 22rem; inset-inline-end: -6rem; top: -8rem; opacity: .12;
	background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cpath d='M100 4l27 38 46-8-8 46 38 27-38 27 8 46-46-8-27 38-27-38-46 8 8-46L4 100l38-27-8-46 46 8z' fill='none' stroke='%23fff' stroke-width='3'/%3E%3C/svg%3E");
}
html body .dq-dashboard-hero h2, html body .dq-dashboard-hero h1 { font-family: var(--hv-display); font-weight: 400; letter-spacing: 0; }
html body .dq-dashboard-hero .dq-dashboard-play { background: var(--hv-saffron) !important; color: var(--hv-ink) !important; box-shadow: 0 5px 0 #c98700 !important; border: 0 !important; }
html body .dq-wallet-card { border-radius: var(--hv-r-md) !important; border: 0 !important; box-shadow: none !important; background-image: none !important; }
html body .dq-wallet-card::before, html body .dq-wallet-card::after { display: none !important; }
html body .dq-wallet-card.rose { background: var(--hv-anar) !important; }
html body .dq-wallet-card.amber { background: #e59a00 !important; }
html body .dq-wallet-card.blue { background: var(--hv-firooze) !important; }
html body .dq-wallet-card.slate, html body .dq-wallet-card.indigo { background: var(--hv-lapis) !important; }
html body .dq-wallet-card .v { font-family: var(--hv-display); font-weight: 400; font-size: 1.7rem; }

/* collection + store cards */
html body .dq-store-pkg, html body .dq-avatar-shop-card, html body .dq-cup-card, html body .dq-quiz-collectible-card {
	border-radius: var(--hv-r-md) !important; border: 1px solid var(--hv-line) !important; box-shadow: none !important;
}
html body .dq-store-hero { background: var(--hv-lapis) !important; border-radius: var(--hv-r-lg) !important; border: 0 !important; box-shadow: none !important; }

/* panel on mobile: the menu toggle is a clean bar */
html body .dq-panel-menu-toggle { background: var(--hv-white) !important; border: 1px solid var(--hv-line) !important; border-radius: var(--hv-r-md) !important; box-shadow: none !important; color: var(--hv-ink) !important; font-weight: 800; }

@media (max-width: 960px) {
	html body .dq-panel-layout { grid-template-columns: minmax(0, 1fr); padding-block: 1rem 2rem; }
}

/* =========================================================================
   AUTH (login / register / complete profile)
   ========================================================================= */
.au-shell {
	display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); min-height: min(42rem, calc(100vh - 140px));
	width: min(100% - 2rem, 68rem); margin: clamp(1.25rem, 4vw, 3rem) auto; background: var(--hv-white);
	border: 1px solid var(--hv-line); border-radius: 28px; overflow: hidden;
}
.au-aside {
	position: relative; isolation: isolate; overflow: hidden; background: var(--hv-lapis); color: #fff;
	padding: clamp(2rem, 4vw, 3rem); display: flex; flex-direction: column; justify-content: space-between; gap: 2rem;
}
.au-aside .au-star { position: absolute; z-index: -1; width: 30rem; inset-inline-start: -9rem; bottom: -10rem; color: #fff; opacity: .12; }
.au-aside h1 { font-family: var(--hv-display); font-weight: 400; font-size: clamp(2rem, 3.6vw, 2.9rem); line-height: 1.4; color: #fff; margin: 0; }
.au-aside p { color: #dfe4ff; line-height: 2; margin: .9rem 0 0; max-width: 26em; }
.au-perks { list-style: none; margin: 0; padding: 0; display: grid; gap: .85rem; }
.au-perks li { display: flex; align-items: center; gap: .8rem; font-weight: 700; }
.au-perks i { flex: none; width: 2.4rem; height: 2.4rem; border-radius: 12px; display: grid; place-items: center; background: rgba(255, 255, 255, .14); color: var(--hv-saffron); font-style: normal; }
.au-deck { position: relative; height: 7.5rem; margin-top: auto; }
.au-deck span { position: absolute; inset-inline-start: 0; bottom: 0; width: 16rem; height: 6.5rem; border-radius: 18px; }
.au-deck span:nth-child(1) { background: var(--hv-firooze); transform: rotate(-8deg) translate(10px, -6px); }
.au-deck span:nth-child(2) { background: var(--hv-saffron); transform: rotate(4deg) translate(-8px, -4px); }
.au-deck span:nth-child(3) { background: #fff; color: var(--hv-ink); padding: 1rem 1.1rem; font-weight: 800; line-height: 1.8; font-size: .92rem; box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .5); }
.au-deck span:nth-child(3) b { display: block; font-family: var(--hv-display); font-weight: 400; color: var(--hv-lapis); font-size: 1.05rem; }
.au-form { padding: clamp(1.75rem, 4vw, 3rem); display: flex; flex-direction: column; justify-content: center; }
.au-form .dq-auth-card { background: transparent !important; border: 0 !important; padding: 0 !important; max-width: 25rem; width: 100%; margin-inline: auto; }
.au-form .dq-auth-brand { text-align: start; margin-bottom: 1.4rem; }
.au-form .dq-auth-brand h2 { font-family: var(--hv-display); font-weight: 400; font-size: 2rem; margin: 0 0 .3rem; color: var(--hv-ink); }
.au-form .dq-auth-brand p { color: var(--hv-muted); margin: 0; }
.au-form .dq-auth-brand .dq-logo { display: none; }
.au-form .dq-field { margin-bottom: 1rem; }
.au-form .dq-btn-block { width: 100%; min-height: 3.2rem; font-size: 1rem; }
.au-form #dq-auth-send, .au-form #dq-auth-verify, .au-form #cp-save { background: var(--hv-lapis) !important; border-color: var(--hv-lapis) !important; box-shadow: 0 5px 0 var(--hv-lapis-deep) !important; }
.au-form .dq-auth-method { display: flex; justify-content: center; align-items: center; gap: .6rem; margin-top: 1.1rem; font-size: .9rem; }
.au-form .dq-auth-method .dq-link-btn { color: var(--hv-muted); text-decoration: none; font-weight: 700; padding: .25rem .5rem; border-radius: 8px; }
.au-form .dq-auth-method .dq-link-btn.is-active { color: var(--hv-lapis); background: var(--hv-lapis-soft); }
.au-form #dq-auth-code { font-family: var(--hv-display); font-size: 1.8rem !important; letter-spacing: .6rem !important; min-height: 3.6rem; }
.au-form .dq-rules-btn, .au-form a[href*="rules"] { display: inline-block; margin-top: 1.2rem; font-size: .88rem; color: var(--hv-muted); }
@media (max-width: 860px) {
	.au-shell { grid-template-columns: minmax(0, 1fr); }
	.au-aside { padding: 1.75rem 1.5rem; gap: 1.2rem; }
	.au-aside .au-perks, .au-deck { display: none; }
	.au-aside h1 { font-size: 1.9rem; }
}

/* =========================================================================
   API docs: long code / URLs never push the page sideways on mobile
   ========================================================================= */
.dq-main pre, .dq-main code, .dq-main kbd { max-width: 100%; }
.dq-main pre { overflow-x: auto; white-space: pre; -webkit-overflow-scrolling: touch; }
.dq-main :not(pre) > code { white-space: normal; overflow-wrap: anywhere; word-break: break-word; }
.dq-main .dq-table-wrap, .dq-main .table-wrap { overflow-x: auto; max-width: 100%; }

/* =========================================================================
   Inner pages: titles and generic cards
   ========================================================================= */
.dq-main .dq-page-head h1, .dq-main .dq-hero h1, .dq-main .dq-hero h2 { font-family: var(--hv-display); font-weight: 400; letter-spacing: 0; }
/* tables never widen the page: cells wrap, and a table that still can't fit scrolls inside itself */
.dq-main table th, .dq-main table td { white-space: normal; overflow-wrap: anywhere; }
@media (max-width: 760px) {
	.dq-main table { display: block; max-width: 100%; min-width: 0 !important; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
html body .dq-brand-name { white-space: nowrap; }

/* =========================================================================
   Inner-page heroes and feature cards: one family instead of a dozen
   gradients. Heroes are solid ink with the khatam star; feature cards use
   the four tile colours flat.
   ========================================================================= */
html body .dq-lb-header,
html body .dq-duel-hero,
html body .dq-activity-hero,
html body .dq-football-hero,
html body .dq-study-route-banner,
html body .dq-random-battle-card {
	position: relative; isolation: isolate; overflow: hidden;
	background: var(--hv-ink) !important; background-image: none !important;
	border: 0 !important; border-radius: var(--hv-r-lg) !important; box-shadow: none !important; color: #fff;
}
html body .dq-lb-header::after,
html body .dq-duel-hero::after,
html body .dq-activity-hero::after,
html body .dq-football-hero::after,
html body .dq-study-route-banner::after,
html body .dq-random-battle-card::after {
	content: ""; position: absolute; z-index: -1; pointer-events: none;
	width: 24rem; height: 24rem; inset-inline-start: -7rem; bottom: -11rem; opacity: .1;
	background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cpath d='M100 4l27 38 46-8-8 46 38 27-38 27 8 46-46-8-27 38-27-38-46 8 8-46L4 100l38-27-8-46 46 8z' fill='none' stroke='%23fff' stroke-width='3'/%3E%3Cpath d='M100 34l18 26 31-6-6 31 26 18-26 18 6 31-31-6-18 26-18-26-31 6 6-31-26-18 26-18-6-31 31 6z' fill='none' stroke='%23fff' stroke-width='3'/%3E%3C/svg%3E");
}
html body .dq-lb-header::before, html body .dq-duel-hero::before, html body .dq-activity-hero::before,
html body .dq-football-hero::before, html body .dq-study-route-banner::before, html body .dq-random-battle-card::before { display: none !important; }
html body .dq-lb-header h1, html body .dq-lb-header h2, html body .dq-duel-hero h1, html body .dq-duel-hero h2,
html body .dq-activity-hero h1, html body .dq-activity-hero h2, html body .dq-football-hero h1, html body .dq-football-hero h2,
html body .dq-study-route-banner h1, html body .dq-study-route-banner h2, html body .dq-random-battle-card h2, html body .dq-random-battle-card h3 {
	font-family: var(--hv-display) !important; font-weight: 400 !important; letter-spacing: 0 !important; color: #fff !important;
	background: none !important; -webkit-text-fill-color: #fff !important;
}
html body .dq-duel-primary, html body .dq-random-battle-action {
	background: var(--hv-saffron) !important; background-image: none !important; color: var(--hv-ink) !important;
	border: 0 !important; box-shadow: 0 5px 0 #c98700 !important; border-radius: 16px !important;
}
html body .dq-duel-primary *, html body .dq-random-battle-action * { color: var(--hv-ink) !important; }

/* game / subject / mode cards */
html body .dq-arcade-card { background-image: none !important; border: 0 !important; box-shadow: none !important; border-radius: var(--hv-r-lg) !important; }
html body .dq-arcade-card::before, html body .dq-arcade-card::after { opacity: .12 !important; }
html body .dq-arcade-card.arcade-football { background: var(--hv-firooze) !important; }
html body .dq-arcade-card.arcade-word { background: #e59a00 !important; }
html body .dq-arcade-card.arcade-mind { background: var(--hv-anar) !important; }
html body .dq-arcade-card.arcade-iq { background: var(--hv-lapis) !important; }
html body .dq-arcade-card.arcade-team { background: var(--hv-ink) !important; }
html body .dq-arcade-card h3, html body .dq-arcade-card h2 { font-family: var(--hv-display) !important; font-weight: 400 !important; }
html body .dq-subject-card { background: var(--hv-white) !important; background-image: none !important; border: 1px solid var(--hv-line) !important; box-shadow: none !important; color: var(--hv-ink) !important; }
html body .dq-subject-card * { color: inherit; }
html body .dq-subject-card.is-active { background: var(--hv-lapis) !important; border-color: var(--hv-lapis) !important; color: #fff !important; }
html body .dq-study-route-grid { background: transparent !important; background-image: none !important; }
html body .dq-launch-mode { background-image: none !important; border: 0 !important; box-shadow: none !important; border-radius: var(--hv-r-lg) !important; }
html body .dq-launch-mode-solo { background: var(--hv-lapis) !important; }
html body .dq-launch-mode-duel { background: var(--hv-ink) !important; }
html body .dq-fixed-round-note { background: var(--hv-saffron-soft) !important; background-image: none !important; border: 0 !important; color: var(--hv-ink) !important; }
html body .dq-myrank-card { background: var(--hv-saffron-soft) !important; background-image: none !important; border: 0 !important; color: var(--hv-ink) !important; box-shadow: none !important; }
html body .dq-myrank-card * { color: var(--hv-ink) !important; }
html body .dq-geo-prompt { background: var(--hv-firooze-soft) !important; background-image: none !important; border: 0 !important; box-shadow: none !important; color: var(--hv-ink) !important; }
html body .dq-profile-cover { background: var(--hv-lapis) !important; background-image: none !important; border: 0 !important; box-shadow: none !important; }
html body .dq-personality-category { background-image: none !important; background: var(--hv-white) !important; border: 1px solid var(--hv-line) !important; color: var(--hv-ink) !important; box-shadow: none !important; }
html body .dq-activity-empty { background: var(--hv-white) !important; border: 1px dashed var(--hv-line) !important; color: var(--hv-muted) !important; }
html body .dq-activity-nav, html body .dq-activity-list, html body .dq-personality-categories {
	background: var(--hv-white) !important; background-image: none !important; border: 1px solid var(--hv-line) !important;
	box-shadow: none !important; color: var(--hv-ink) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
html body .dq-activity-nav a, html body .dq-activity-nav span, html body .dq-activity-list h2, html body .dq-activity-list h3, html body .dq-activity-list small, html body .dq-personality-categories > header *, html body .dq-personality-categories h2 { color: var(--hv-ink) !important; }
html body .dq-activity-list h2, html body .dq-activity-list h3 { font-family: var(--hv-display) !important; font-weight: 400 !important; }
html body .dq-launch-mode, html body .dq-launch-mode * { color: #fff !important; }
html body .dq-launch-mode-icon { background: rgba(255, 255, 255, .14) !important; }
html body .dq-auth-card h2 { font-family: var(--hv-display); font-weight: 400; font-size: 2rem; letter-spacing: 0; }
html body #cp-save { background: var(--hv-lapis) !important; border-color: var(--hv-lapis) !important; box-shadow: 0 5px 0 var(--hv-lapis-deep) !important; }
html body .dq-role-opt.is-active, html body .dq-role-opt:has(input:checked) { border-color: var(--hv-lapis) !important; background: var(--hv-lapis-soft) !important; box-shadow: none !important; }
html body .dq-hamburger { background: var(--hv-lapis) !important; border-color: var(--hv-lapis) !important; color: #fff !important; }
@media (max-width: 420px) {
	html body .dq-header-actions .dq-header-auth-btn { min-height: 2.5rem; padding-inline: .8rem; font-size: .82rem; gap: .3rem; }
	html body .dq-header-actions .dq-header-auth-btn svg { display: none; }
	html body .dq-brand-name { font-size: 1.15rem; }
	html body .dq-header-inner { gap: .5rem; }
	html body .dq-btn-premium { padding-inline: .7rem !important; font-size: .78rem !important; gap: .25rem !important; }
	html body .dq-btn-premium svg { display: none; }
}
html body .dq-personality-categories header a, html body .dq-personality-categories header a * { background: var(--hv-lapis) !important; color: #fff !important; border-color: var(--hv-lapis) !important; }
/* panel user block: the old absolutely-positioned "پنل شخصی دیلی کوییز" caption collided with the role badge */
html body .dq-panel-user::after, html body .dq-panel-user::before { display: none !important; content: none !important; }
html body .dq-panel-user { position: relative; }
html body .dq-panel-user > div { display: flex; flex-direction: column; align-items: flex-start; gap: .35rem; min-width: 0; }
html body .dq-panel-user > div b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
/* Header brand: icon + site name travel together; on phones/tablets the pair sits in the middle of the header */
html body .dq-brand-center { display: inline-flex; align-items: center; gap: .55rem; min-width: 0; }
html body .dq-brand-center .dq-logo { margin: 0; }
@media (max-width: 899px) {
	html body .dq-header .dq-header-inner { position: relative; }
	html body .dq-header .dq-brand-center { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2; gap: .4rem; }
	html body .dq-header .dq-brand-center .dq-logo { position: static; transform: none; }
	html body .dq-header .dq-brand-name { display: inline !important; }
	html body .dq-header .dq-brand-center .dq-logo img { width: 40px; height: 40px; }
}
@media (max-width: 420px) {
	html body .dq-header .dq-brand-center .dq-logo img { width: 34px; height: 34px; }
	html body .dq-header .dq-brand-name { font-size: 1.05rem !important; }
	/* keep the centred brand clear of the action buttons */
	html body .dq-header .dq-btn-premium { font-size: 0 !important; padding: 0 !important; width: 2.6rem; height: 2.6rem; min-height: 0; justify-content: center; border-radius: 12px !important; }
	html body .dq-header .dq-btn-premium svg { display: inline-block !important; width: 18px; height: 18px; }
	html body .dq-header .dq-header-auth-btn { font-size: .78rem !important; padding-inline: .65rem !important; }
}
/* notification badge */
html body .dq-bell-badge { background: var(--hv-anar) !important; color: #fff !important; border: 2px solid #fff; font-weight: 800; }
html body .dq-icon-btn:hover .dq-bell-badge { background: var(--hv-anar) !important; color: #fff !important; }

/* =========================================================================
   Hover / active states — legacy rules painted many buttons' text white on
   hover while the new surfaces stay white. Every family gets an explicit,
   readable pair here.
   ========================================================================= */
html body .dq-btn-primary:hover, html body .dq-btn-primary:focus-visible { background: #2a4ae0 !important; color: #fff !important; filter: none !important; }
html body .dq-btn-dark:hover, html body .dq-btn-dark:focus-visible { background: #262e66 !important; color: #fff !important; filter: none !important; }
html body .dq-btn-ghost:hover, html body .dq-btn-ghost:focus-visible { background: var(--hv-paper) !important; color: var(--hv-ink) !important; border-color: var(--hv-ink) !important; filter: none !important; }
html body .dq-btn-success:hover { background: #0c877c !important; color: #fff !important; filter: none !important; }
html body .dq-btn-danger:hover, html body .dq-btn.dq-danger:hover { background: #c92f4c !important; color: #fff !important; filter: none !important; }
html body .dq-btn[disabled], html body .dq-btn:disabled, html body .dq-btn[disabled]:hover, html body .dq-btn:disabled:hover { background: #e6e9f5 !important; color: #5d6488 !important; border-color: #e6e9f5 !important; box-shadow: none !important; }
html body .dq-icon-btn:hover { background: var(--hv-paper) !important; color: var(--hv-ink) !important; border-color: var(--hv-ink) !important; }
html body .dq-icon-btn:hover svg { color: var(--hv-ink) !important; stroke: currentColor; }
html body .dq-tabs button:hover, html body .dq-tabs > a:hover { color: var(--hv-ink) !important; background: rgba(255, 255, 255, .6) !important; }
html body .dq-tabs button.is-active:hover, html body .dq-tabs > a.is-active:hover { color: var(--hv-ink) !important; background: var(--hv-white) !important; }
html body .dq-subject-card:hover { background: var(--hv-paper) !important; color: var(--hv-ink) !important; border-color: var(--hv-ink) !important; }
html body .dq-subject-card:hover *, html body .dq-subject-card:hover strong { color: var(--hv-ink) !important; }
html body .dq-subject-card.is-active, html body .dq-subject-card.is-active:hover { background: var(--hv-lapis) !important; color: #fff !important; }
html body .dq-subject-card.is-active *, html body .dq-subject-card.is-active strong { color: #fff !important; }
html body .dq-game-start:hover, html body .dq-game-duel:hover, html body .dq-creator-cta:hover, html body .dq-dashboard-play:hover { color: var(--hv-ink) !important; background: var(--hv-saffron) !important; border-color: var(--hv-saffron) !important; }
html body .dq-panel-menu a:hover { color: var(--hv-ink) !important; }
html body .dq-panel-menu a.is-active:hover { color: #fff !important; background: var(--hv-lapis) !important; }
html body a.dq-btn:hover, html body a.dq-btn:focus-visible { text-decoration: none; }
html body .dq-personality-categories header button, html body .dq-personality-categories header button * { background: var(--hv-lapis) !important; color: #fff !important; border-color: var(--hv-lapis) !important; }