/* DIG Career Thrust look and motion layer, loaded after site.css.
   Calm indigo/violet palette with a soft coral accent, rounded cards with soft shadows, a living
   hero, and entrance animations driven by assets/fx.js (html.fx). Everything that moves is
   switched off for visitors who ask their device for reduced motion. */

:root {
	--tutor-color-primary: #4F46E5;
	--tutor-color-primary-hover: #4338CA;
	--dct-radius: 16px;
	--dct-shadow: 0 1px 2px rgba(30, 34, 53, .04), 0 8px 24px rgba(79, 70, 229, .08);
	--dct-shadow-up: 0 2px 4px rgba(30, 34, 53, .05), 0 18px 40px rgba(79, 70, 229, .16);
	--dct-ease: cubic-bezier(.22, 1, .36, 1);
}

body { background: #FAFBFF; color: var(--dct-ink); line-height: 1.65; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
h1, h2, h3, h4 { color: var(--dct-ink); letter-spacing: -.015em; }
::selection { background: #C7D2FE; color: #1E1B4B; }
a { text-underline-offset: 3px; }
:focus-visible { outline: 3px solid #A5B4FC; outline-offset: 2px; border-radius: 6px; }

/* ---------- header ---------- */
.dct-hd { background: rgba(255, 255, 255, .85); -webkit-backdrop-filter: saturate(160%) blur(12px); backdrop-filter: saturate(160%) blur(12px); border-bottom-color: transparent; transition: box-shadow .3s, border-color .3s; }
html.fx-scrolled .dct-hd { box-shadow: 0 6px 24px rgba(30, 34, 53, .07); border-bottom-color: var(--dct-line); }
.dct-brand span { font-weight: 800; letter-spacing: -.02em; }
.dct-nav a { border-radius: 10px; transition: background .2s, color .2s; position: relative; white-space: nowrap; }
.dct-brand span { white-space: nowrap; }
@media (max-width: 1180px) { .dct-nav a { padding: 8px 8px; font-size: 14px; } .dct-hd-in { gap: 12px; } }
.dct-nav a:hover { background: var(--dct-primary-soft); color: var(--dct-primary) !important; }
.dct-nav a[aria-current="page"] { background: var(--dct-primary-soft); }
.dct-btn-hd { background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)) !important; border-radius: 12px; box-shadow: 0 6px 16px rgba(79, 70, 229, .28); transition: transform .25s var(--dct-ease), box-shadow .25s; }
.dct-btn-hd:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(79, 70, 229, .34); }
.dct-sound { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 12px; border: 1px solid var(--dct-line); background: #fff; color: var(--dct-primary); cursor: pointer; transition: background .2s, transform .2s var(--dct-ease); }
.dct-sound:hover { background: var(--dct-primary-soft); }
.dct-sound:active { transform: scale(.92); }
.dct-sound .dct-sound-off, .dct-sound[aria-pressed="false"] .dct-sound-on { display: none; }
.dct-sound[aria-pressed="false"] .dct-sound-off { display: block; }
.dct-sound[aria-pressed="false"] { color: var(--dct-muted); }

/* ---------- hero ---------- */
.dct-hero { position: relative; overflow: hidden; isolation: isolate; background: linear-gradient(135deg, #312E81 0%, #4F46E5 45%, #7C3AED 100%); padding: 64px 0 76px; border-radius: 0 0 36px 36px; }
.dct-hero .dct-wrap { position: relative; z-index: 1; }
.dct-blob { position: absolute; border-radius: 50%; filter: blur(48px); opacity: .55; z-index: 0; pointer-events: none; }
.dct-blob-1 { width: 340px; height: 340px; background: #F2626B; top: -110px; right: -70px; }
.dct-blob-2 { width: 280px; height: 280px; background: #22D3EE; bottom: -130px; left: 6%; opacity: .4; }
.dct-blob-3 { width: 190px; height: 190px; background: #F0ABFC; top: 38%; right: 28%; opacity: .35; }
.dct-kicker { display: inline-block; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .28); padding: 6px 14px; border-radius: 999px; text-transform: none !important; letter-spacing: .01em !important; font-size: 14px !important; opacity: 1 !important; }
.dct-hero h1 { font-weight: 800; letter-spacing: -.03em; }
.dct-hl { background: linear-gradient(90deg, #FDE68A, #FBCFE8 60%, #A5F3FC); -webkit-background-clip: text; background-clip: text; color: transparent; }
.dct-lead { opacity: .92; }
.dct-btn { border-radius: 12px; transition: transform .25s var(--dct-ease), box-shadow .25s, background .25s; }
.dct-btn-light { color: var(--dct-primary) !important; box-shadow: 0 8px 20px rgba(17, 12, 60, .25); }
.dct-btn-light:hover, .dct-btn-ghost:hover { transform: translateY(-2px); }
.dct-btn-ghost { border-color: rgba(255, 255, 255, .6); backdrop-filter: blur(4px); }
.dct-btn-ghost:hover { background: rgba(255, 255, 255, .12); }

/* ---------- shared buttons ---------- */
.dct-start { border-radius: 12px !important; transition: transform .25s var(--dct-ease), box-shadow .25s, filter .25s; }
.dct-start:not(:disabled):hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(79, 70, 229, .28); filter: brightness(1.05); }
.dct-btn:active, .dct-start:active, .dct-btn-hd:active, .dct-chip:active { transform: scale(.97); }

/* ---------- home sections ---------- */
.dct-home h2 { font-weight: 800; }
.dct-stats div { background: #fff; border: 0; border-radius: var(--dct-radius); box-shadow: var(--dct-shadow); padding: 18px 12px; }
.dct-stat-ic { display: block; font-size: 24px; line-height: 1; margin-bottom: 6px; }
.dct-stats strong { background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); -webkit-background-clip: text; background-clip: text; color: transparent; font-weight: 800; }
.dct-chip { transition: transform .2s var(--dct-ease), border-color .2s, color .2s, background .2s, box-shadow .2s; border-color: var(--dct-line); }
.dct-chip:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(79, 70, 229, .12); }
.dct-chip[aria-current="page"] { background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); border-color: transparent; }
.dct-card { border: 0; border-radius: var(--dct-radius); box-shadow: var(--dct-shadow); transition: transform .35s var(--dct-ease), box-shadow .35s; }
.dct-card:hover { transform: translateY(-6px); box-shadow: var(--dct-shadow-up); }
.dct-card-ph { background: linear-gradient(135deg, #EEF0FF, #FCE7F3); color: var(--dct-primary); }
.dct-card-p { color: var(--dct-primary); }
.dct-feats > div { background: #fff; border: 0; border-radius: var(--dct-radius); box-shadow: var(--dct-shadow); padding: 20px; transition: transform .35s var(--dct-ease), box-shadow .35s; }
.dct-feats > div:hover { transform: translateY(-4px); box-shadow: var(--dct-shadow-up); }
.dct-feat-ic { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 14px; background: linear-gradient(135deg, #EEF0FF, #FCE7F3); font-size: 24px; margin-bottom: 12px; }
.dct-notice-box { border-radius: 14px; background: #FFF8F1; border-color: #FDE2C8; }
.dct-notice-box a { color: var(--dct-primary) !important; }
.dct-notice-ok { background: #ECFDF5; border-color: #A7F3D0; }
.dct-help-strip { background: #fff; border: 0; border-radius: 20px; box-shadow: var(--dct-shadow); }
.dct-strip-mentor { background: linear-gradient(135deg, #EEF0FF 0%, #FDF2F8 100%); }
.dct-news li { transition: background .2s; border-radius: 10px; padding-left: 8px; padding-right: 8px; }
.dct-news li:hover { background: var(--dct-primary-soft); }
.dct-push:not([hidden]) { background: linear-gradient(135deg, #EEF0FF, #FDF2F8); border-color: #DDD6FE; }
.dct-push-btn { background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); border-radius: 12px; }

/* ---------- footer and phone bar ---------- */
.dct-ft { background: #171A2E; border-radius: 28px 28px 0 0; }
.dct-ft a { transition: color .2s, padding .2s; }
.dct-ft a:hover { padding-left: 3px; }
.dct-bb { background: rgba(255, 255, 255, .92); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.dct-bb a { position: relative; transition: color .2s; }
.dct-bb a[aria-current="page"]::before { content: ""; position: absolute; top: 4px; left: 50%; margin-left: -22px; width: 44px; height: 30px; border-radius: 12px; background: var(--dct-primary-soft); z-index: -1; }
.dct-bb a[aria-current="page"] svg { animation: fx-bounce .6s var(--dct-ease); }

/* ---------- course thumbnails: always 4:3, never stretched ---------- */
.tutor-course-thumbnail .tutor-ratio-16x9 { padding-top: 75% !important; } /* Tutor's course cards were 16:9 and cut the top and bottom off */
.tutor-course-thumbnail .tutor-ratio > img { object-fit: cover; object-position: center; transition: transform .6s var(--dct-ease); }
.tutor-course-card:hover .tutor-course-thumbnail img { transform: scale(1.04); }
.tutor-course-card .tutor-course-thumbnail { overflow: hidden; }
.dct-card-img { aspect-ratio: 4 / 3 !important; object-fit: cover; height: auto; }
.single-courses .tutor-course-thumbnail { max-width: 760px; border-radius: 18px; overflow: hidden; box-shadow: var(--dct-shadow); }
.single-courses .tutor-course-thumbnail > img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.dct-picks img { aspect-ratio: 4 / 3; object-fit: cover; height: auto !important; }

/* Tutor course cards */
.tutor-course-card { border: 0 !important; border-radius: var(--dct-radius) !important; box-shadow: var(--dct-shadow); overflow: hidden; transition: transform .35s var(--dct-ease), box-shadow .35s; }
.tutor-course-card:hover { transform: translateY(-6px); box-shadow: var(--dct-shadow-up); }
.dct-cfoot .tutor-btn { background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)) !important; border: 0 !important; border-radius: 10px !important; }

/* ---------- pages built by the plugin ---------- */
.dct-book, .dct-ref, .dct-app-hero, .dct-mycall, .dct-gitem, .dct-app details { border-color: transparent; box-shadow: var(--dct-shadow); border-radius: var(--dct-radius); }
.dct-gitem { transition: transform .3s var(--dct-ease), box-shadow .3s; }
.dct-gitem:hover { transform: translateY(-3px); box-shadow: var(--dct-shadow-up); }
.dct-gav { background: linear-gradient(135deg, #EEF0FF, #FCE7F3); color: var(--dct-primary); }
.dct-gbadge { background: var(--dct-accent); }
.dct-time { transition: transform .2s var(--dct-ease), background .2s, border-color .2s; }
.dct-time:not(:disabled):hover { transform: translateY(-2px); border-color: var(--dct-primary); }
.dct-kinds label { transition: border-color .2s, background .2s, transform .2s var(--dct-ease); }
.dct-kinds label:has(input:checked) { background: var(--dct-primary-soft); }
.dct-m.is-mine .dct-mb { background: var(--dct-primary-soft); border-color: #DDD6FE; }
.dct-m.is-mentor .dct-mb { background: #FDF2F8; border-color: #FBCFE8; }
.dct-m.is-mentor .dct-mn { color: #BE185D; }
.dct-m { animation: fx-pop .35s var(--dct-ease) both; }

/* ---------- course material panel (course page, students who own it) ---------- */
.dct-material { margin: 22px 0; padding: 18px; background: #fff; border-radius: 18px; box-shadow: var(--dct-shadow); max-width: 760px; }
.dct-material-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.dct-material-head h2 { margin: 0; font-size: 22px; }
.dct-material-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin: 14px 0; }
.dct-material-tabs button, .dct-material-tabs a { border: 1px solid var(--dct-line); background: #fff; border-radius: 999px; padding: 8px 14px; font: inherit; font-size: 15px; cursor: pointer; color: var(--dct-ink) !important; text-decoration: none !important; }
.dct-material-tabs [aria-selected="true"] { background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); color: #fff !important; border-color: transparent; }
.dct-material .dct-mytests, .dct-material .dct-notes { max-width: none !important; }
.dct-trow a:hover { background: var(--dct-primary-soft); }
.dct-trow.is-locked { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 6px; border-bottom: 1px solid #F3F4F6; color: #64748B; cursor: pointer; list-style: none; }
.dct-trow.is-locked:hover { background: #F8FAFC; }
.dct-material.is-preview { border: 1px dashed #C7D2FE; }
.dct-material-lock { margin: 10px 0 0; padding: 10px 12px; border-radius: 12px; background: #FFF7ED; color: #9A3412; font-size: 15px; }
.dct-material-lock a { font-weight: 700; color: var(--dct-primary) !important; }
.dct-owned { display: flex; flex-direction: column; gap: 2px; margin-bottom: 12px; }
.dct-owned strong { font-size: 18px; color: #047857; }
.dct-owned span { color: var(--dct-muted); font-size: 15px; }
.dct-go { display: inline-block; text-decoration: none !important; background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)) !important; color: #fff !important; }
.dct-cowned { color: #047857; font-weight: 700; font-size: 15px; }
.dct-cgo { background: linear-gradient(135deg, #059669, #10B981) !important; }
.dct-pulse { animation: fx-pulse 1.5s ease; }
/* Way on from a test (result page / no attempts left) */
.dct-testnav { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0; }
.dct-navbtn { display: inline-flex; align-items: center; padding: 10px 16px; border-radius: 12px; border: 1px solid var(--dct-line); background: #fff; color: var(--dct-ink) !important; text-decoration: none !important; font-weight: 600; font-size: 15px; box-shadow: var(--dct-shadow); transition: transform .2s var(--dct-ease); }
.dct-navbtn:hover { transform: translateY(-2px); }
.dct-navbtn.is-main { background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); color: #fff !important; border-color: transparent; }

/* Tutor LMS's sample-picture tour ("Hi, Sophia!"): never shown (fx.js also skips it). */
.tutor-modal:has(.tutor-tour-modal) { display: none !important; }
@keyframes fx-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(79, 70, 229, 0); } 30% { box-shadow: 0 0 0 8px rgba(79, 70, 229, .28); } }
.dct-folder { border-top: 1px solid var(--dct-line); }
.dct-folder summary { padding: 12px 4px; font-weight: 700; color: #374151; cursor: pointer; list-style: none; display: flex; align-items: center; gap: 6px; }
.dct-folder summary::-webkit-details-marker { display: none; }
.dct-folder summary::after { content: "›"; margin-left: auto; font-size: 20px; color: var(--dct-muted); transition: transform .25s var(--dct-ease); }
.dct-folder[open] summary::after { transform: rotate(90deg); }
.dct-folder summary span { color: var(--dct-muted); font-weight: 400; }
.dct-trow a { border-radius: 8px; padding-left: 6px !important; padding-right: 6px !important; }

/* ---------- material requests ---------- */
.dct-requests { max-width: 760px; margin: 0 auto; font-size: 16px; }
.dct-requests h2 { font-size: 22px; margin: 26px 0 10px; }
.dct-requests input[name="exam"] { display: block; width: 100%; box-sizing: border-box; margin-top: 6px; padding: 10px; border: 1px solid var(--dct-line); border-radius: 10px; font: inherit; }
.dct-req-kinds .dct-chip { cursor: pointer; }
.dct-req-kinds input { position: absolute; opacity: 0; pointer-events: none; }
.dct-req-kinds .dct-chip:has(input:checked) { background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); color: #fff !important; border-color: transparent; }
.dct-req-state { display: inline-block; font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 999px; margin-left: 6px; background: #EEF0FF; color: var(--dct-primary); vertical-align: 2px; }
.dct-req-planned { background: #FEF3C7; color: #92400E; }
.dct-req-done { background: #D1FAE5; color: #065F46; }
.dct-req-no { background: #F1F5F9; color: #475569; }
.dct-req-reply { margin-top: 6px; background: var(--dct-soft); border-radius: 8px; padding: 6px 10px; font-size: 15px; }
.dct-vote { white-space: nowrap; border: 1px solid var(--dct-line) !important; background: #fff !important; color: var(--dct-ink) !important; border-radius: 999px !important; padding: 8px 14px !important; cursor: pointer; font: inherit; font-size: 14px; }
.dct-vote:disabled { color: var(--dct-primary) !important; background: var(--dct-primary-soft) !important; cursor: default; }
.dct-req-cta { margin: 16px 0 0; padding: 12px 14px; border-radius: 12px; background: var(--dct-primary-soft); font-size: 15px; }
.dct-req-cta a { font-weight: 700; color: var(--dct-primary) !important; }

/* ---------- motion ---------- */
.fx-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; transform-origin: 0 50%; transform: scaleX(0); background: linear-gradient(90deg, #4F46E5, #7C3AED, #F2626B); z-index: 100000; pointer-events: none; }
.fx-top { position: fixed; left: 16px; bottom: 24px; z-index: 99960; width: 44px; height: 44px; border-radius: 50%; border: 0; background: #fff; color: var(--dct-primary); box-shadow: var(--dct-shadow-up); display: flex; align-items: center; justify-content: center; cursor: pointer; opacity: 0; transform: translateY(14px) scale(.9); pointer-events: none; transition: opacity .3s, transform .3s var(--dct-ease); }
.fx-top.is-on { opacity: 1; transform: none; pointer-events: auto; }
.fx-toast { position: fixed; left: 50%; top: 84px; z-index: 100001; background: #1E2235; color: #fff; padding: 10px 18px; border-radius: 999px; font-size: 14px; box-shadow: 0 10px 30px rgba(0, 0, 0, .25); opacity: 0; transform: translate(-50%, -10px); transition: opacity .3s, transform .3s var(--dct-ease); pointer-events: none; max-width: calc(100vw - 32px); text-align: center; }
.fx-toast.is-on { opacity: 1; transform: translate(-50%, 0); }
.fx-confetti { position: fixed; inset: 0; pointer-events: none; z-index: 100002; }
.fx-ripple { position: absolute; border-radius: 50%; background: currentColor; opacity: .22; transform: scale(0); pointer-events: none; animation: fx-ripple .6s ease-out forwards; }
html.dct-exam-open .fx-top, html.dct-exam-open .fx-progress, html.dct-in-call .fx-top { display: none; }

@media (prefers-reduced-motion: no-preference) {
	/* Entrance: elements rise and fade in as they scroll into view (fx.js adds .fx-r / .fx-in). */
	html.fx .fx-r { opacity: 0; transform: translateY(22px); transition: opacity .7s var(--dct-ease), transform .7s var(--dct-ease), box-shadow .35s; transition-delay: var(--fx-d, 0s); }
	html.fx .fx-r.fx-in { opacity: 1; transform: none; }
	html.fx .fx-r.fx-in:hover { transition-delay: 0s; }
	.dct-hero .dct-kicker, .dct-hero h1, .dct-hero .dct-lead, .dct-hero .dct-cta { animation: fx-rise .8s var(--dct-ease) both; }
	.dct-hero h1 { animation-delay: .08s; }
	.dct-hero .dct-lead { animation-delay: .16s; }
	.dct-hero .dct-cta { animation-delay: .24s; }
	.dct-blob { animation: fx-float 14s ease-in-out infinite alternate; }
	.dct-blob-2 { animation-duration: 18s; animation-delay: -4s; }
	.dct-blob-3 { animation-duration: 11s; animation-delay: -7s; }
	/* Smooth fade between pages (Chrome and Edge; other browsers simply load normally). */
	@view-transition { navigation: auto; }
	::view-transition-old(root) { animation: fx-out .2s ease both; }
	::view-transition-new(root) { animation: fx-in .35s var(--dct-ease) both; }
}
@media (prefers-reduced-motion: reduce) {
	.dct-card:hover, .tutor-course-card:hover, .dct-feats > div:hover { transform: none; }
}
@keyframes fx-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes fx-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes fx-float { 0% { transform: translate(0, 0) scale(1); } 100% { transform: translate(34px, -24px) scale(1.15); } }
@keyframes fx-out { to { opacity: 0; transform: translateY(-6px); } }
@keyframes fx-in { from { opacity: 0; transform: translateY(8px); } }
@keyframes fx-ripple { to { transform: scale(1); opacity: 0; } }
@keyframes fx-pop { from { opacity: 0; transform: translateY(6px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes fx-bounce { 0% { transform: scale(1); } 40% { transform: scale(1.2) translateY(-2px); } 100% { transform: scale(1); } }

@media (max-width: 960px) {
	.dct-sound { margin-left: auto; }
	.fx-top { bottom: calc(80px + env(safe-area-inset-bottom)); }
}
@media (max-width: 781px) {
	.dct-hero { padding: 44px 0 56px; border-radius: 0 0 26px 26px; }
	.dct-blob-1 { width: 220px; height: 220px; }
	.dct-blob-2 { width: 180px; height: 180px; }
	.dct-blob-3 { display: none; }
	.dct-sound { margin-left: auto; width: 38px; height: 38px; }
	.dct-hd-in { gap: 10px; }
	.dct-ft { border-radius: 22px 22px 0 0; }
	.fx-top { bottom: calc(80px + env(safe-area-inset-bottom)); }
	.fx-toast { top: 70px; }
}

/* ---------- Help / Contact page ([dct_help]) ---------- */
body:has(.dct-hp) .wp-block-post-title { display: none; }
body:has(.dct-hp) main { margin-top: 0 !important; }
body:has(.dct-hp) main > .wp-block-group:first-child { padding-top: 20px !important; }
body:has(.dct-hp) .wp-block-post-content { margin-top: 0 !important; }
.dct-hp { max-width: 1040px !important; width: 100%; margin-inline: auto !important; }
.dct-hp section { margin: 0 0 28px; }
.dct-hp-hero { position: relative; overflow: hidden; isolation: isolate; color: #fff; border-radius: 28px; padding: 44px 28px 36px; text-align: center; background: linear-gradient(135deg, #312E81 0%, #4F46E5 50%, #7C3AED 100%); box-shadow: 0 20px 50px rgba(79, 70, 229, .28); }
.dct-hp-hero .dct-blob-1 { top: -140px; right: -90px; }
.dct-hp-hero .dct-blob-2 { bottom: -160px; left: -40px; }
.dct-hp-hero-in { position: relative; z-index: 1; max-width: 640px; margin: 0 auto; }
.dct-hp-kicker { display: inline-block; background: rgba(255, 255, 255, .15); border: 1px solid rgba(255, 255, 255, .3); padding: 6px 14px; border-radius: 999px; font-size: 14px; }
.dct-hp-hero h1 { color: #fff; font-size: clamp(28px, 5vw, 42px); font-weight: 800; letter-spacing: -.03em; line-height: 1.15; margin: 14px 0 10px; }
.dct-hp-hero p { margin: 0 auto; opacity: .92; max-width: 520px; }
.dct-hp-search { display: flex; align-items: center; gap: 10px; background: #fff; color: var(--dct-muted); border-radius: 16px; padding: 4px 6px 4px 16px; margin: 22px auto 14px; max-width: 520px; box-shadow: 0 10px 30px rgba(17, 12, 60, .28); transition: box-shadow .25s, transform .25s var(--dct-ease); }
.dct-hp-search:focus-within { transform: translateY(-1px); box-shadow: 0 0 0 4px rgba(255, 255, 255, .35), 0 14px 34px rgba(17, 12, 60, .3); }
.dct-hp-search input { flex: 1; min-width: 0; border: 0 !important; outline: 0 !important; box-shadow: none !important; background: transparent; font-size: 16px; padding: 12px 4px; color: var(--dct-ink); }
.dct-hp-hours { font-size: 14px; display: inline-flex !important; align-items: center; gap: 8px; }
.dct-hp-dot { width: 9px; height: 9px; border-radius: 50%; background: #34D399; box-shadow: 0 0 0 4px rgba(52, 211, 153, .25); }

.dct-hp-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: -8px !important; }
.dct-hp-card { position: relative; display: flex; flex-direction: column; gap: 4px; background: #fff; border-radius: 20px; padding: 20px 18px 18px; text-decoration: none !important; color: var(--dct-ink) !important; box-shadow: var(--dct-shadow); transition: transform .35s var(--dct-ease), box-shadow .35s; overflow: hidden; }
.dct-hp-card:hover { transform: translateY(-5px); box-shadow: var(--dct-shadow-up); }
.dct-hp-card strong { font-size: 16px; font-weight: 700; }
.dct-hp-card small { color: var(--dct-muted); font-size: 13.5px; line-height: 1.45; overflow-wrap: anywhere; }
.dct-hp-ic { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 14px; font-size: 24px; margin-bottom: 8px; background: linear-gradient(135deg, #EEF0FF, #FCE7F3); }
.dct-hp-wa .dct-hp-ic { background: linear-gradient(135deg, #DCFCE7, #BBF7D0); }
.dct-hp-call .dct-hp-ic { background: linear-gradient(135deg, #FEF3C7, #FDE68A); }
.dct-hp-req .dct-hp-ic { background: linear-gradient(135deg, #E0F2FE, #CFFAFE); }
.dct-hp-go { position: absolute; top: 18px; right: 18px; color: var(--dct-primary); opacity: 0; transform: translateX(-6px); transition: opacity .25s, transform .3s var(--dct-ease); }
.dct-hp-card:hover .dct-hp-go { opacity: 1; transform: none; }

.dct-hp-faq > h2 { font-size: 26px; font-weight: 800; margin: 8px 0 14px; scroll-margin-top: 90px; }
.dct-hp-faqg { background: #fff; border-radius: 22px; box-shadow: var(--dct-shadow); padding: 18px 20px 8px; margin: 0 0 16px; }
.dct-hp-faqg h3 { font-size: 15px; text-transform: uppercase; letter-spacing: .06em; color: var(--dct-primary); margin: 0 0 6px; }
.dct-hp-q { border-top: 1px solid var(--dct-line); }
.dct-hp-q:first-of-type { border-top: 0; }
.dct-hp-q summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 14px 2px; font-weight: 600; border-radius: 10px; transition: color .2s; }
.dct-hp-q summary::-webkit-details-marker { display: none; }
.dct-hp-q summary:hover { color: var(--dct-primary); }
.dct-hp-q summary i { flex: none; position: relative; width: 28px; height: 28px; border-radius: 50%; background: var(--dct-primary-soft); transition: background .25s, transform .35s var(--dct-ease); }
.dct-hp-q summary i::before, .dct-hp-q summary i::after { content: ""; position: absolute; left: 50%; top: 50%; width: 11px; height: 2px; margin: -1px 0 0 -5.5px; border-radius: 2px; background: var(--dct-primary); transition: transform .35s var(--dct-ease), background .25s; }
.dct-hp-q summary i::after { transform: rotate(90deg); }
.dct-hp-q[open] summary i { background: var(--dct-primary); transform: rotate(180deg); }
.dct-hp-q[open] summary i::before, .dct-hp-q[open] summary i::after { background: #fff; }
.dct-hp-q[open] summary i::after { transform: rotate(0deg); }
.dct-hp-q > div p { margin: 0 0 16px; color: #475467; background: var(--dct-soft); border-radius: 14px; padding: 12px 16px; }
.dct-hp-none { text-align: center; color: var(--dct-muted); background: #fff; border-radius: 16px; padding: 18px; box-shadow: var(--dct-shadow); }

.dct-hp-stuck { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-radius: 24px; padding: 24px 26px; background: linear-gradient(135deg, #EEF0FF 0%, #FDF2F8 100%); }
.dct-hp-stuck h2 { font-size: 22px; font-weight: 800; margin: 0 0 6px; }
.dct-hp-stuck p { margin: 0; color: #475467; }
.dct-hp-btn { flex: none; display: inline-block; background: #25D366; color: #fff !important; text-decoration: none !important; font-weight: 700; padding: 13px 22px; border-radius: 14px; box-shadow: 0 8px 20px rgba(37, 211, 102, .32); transition: transform .25s var(--dct-ease), box-shadow .25s; }
.dct-hp-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(37, 211, 102, .4); }

.dct-hp-biz { display: grid; grid-template-columns: 1.1fr 1fr; gap: 6px 24px; background: #fff; border-radius: 22px; box-shadow: var(--dct-shadow); padding: 22px 24px; font-size: 15px; }
.dct-hp-biz h3 { font-size: 17px; margin: 0 0 6px; }
.dct-hp-biz h3 small { color: var(--dct-muted); font-weight: 500; }
.dct-hp-biz p { margin: 0; color: #475467; }
.dct-hp-biz ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.dct-hp-biz li { overflow-wrap: anywhere; }
.dct-hp-pol { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; border-top: 1px solid var(--dct-line); margin-top: 10px; padding-top: 14px; }
.dct-hp-pol a { font-size: 14px; padding: 6px 12px; border-radius: 999px; background: var(--dct-soft); text-decoration: none; transition: background .2s; }
.dct-hp-pol a:hover { background: var(--dct-primary-soft); }

@media (max-width: 860px) { .dct-hp-cards { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) {
	.dct-hp-hero { border-radius: 22px; padding: 30px 18px 24px; }
	.dct-hp-hero p { font-size: 15px; }
	.dct-hp-hours { font-size: 13px !important; }
	.dct-hp-cards { gap: 12px; }
	.dct-hp-card { padding: 16px 14px; border-radius: 18px; }
	.dct-hp-card small { font-size: 12.5px; }
	.dct-hp-ic { width: 42px; height: 42px; font-size: 21px; }
	.dct-hp-faqg { padding: 14px 14px 4px; border-radius: 18px; }
	.dct-hp-stuck { flex-direction: column; align-items: stretch; text-align: center; padding: 22px 18px; }
	.dct-hp-biz { grid-template-columns: 1fr; padding: 18px; }
}
@media (prefers-reduced-motion: no-preference) {
	.dct-hp-hero-in > * { animation: fx-rise .8s var(--dct-ease) both; }
	.dct-hp-hero-in > :nth-child(2) { animation-delay: .08s; }
	.dct-hp-hero-in > :nth-child(3) { animation-delay: .16s; }
	.dct-hp-hero-in > :nth-child(4) { animation-delay: .24s; }
	.dct-hp-hero-in > :nth-child(5) { animation-delay: .32s; }
	.dct-hp-hero .dct-blob { animation: fx-float 14s ease-in-out infinite alternate; }
	.dct-hp-q[open] > div { animation: fx-pop .4s var(--dct-ease) both; }
	.dct-hp-dot { animation: dct-hp-pulse 2.4s ease-in-out infinite; }
}
@media (prefers-reduced-motion: reduce) { .dct-hp-card:hover, .dct-hp-btn:hover { transform: none; } }
@keyframes dct-hp-pulse { 0%, 100% { box-shadow: 0 0 0 4px rgba(52, 211, 153, .25); } 50% { box-shadow: 0 0 0 8px rgba(52, 211, 153, .05); } }

/* ---------- course drawers on My tests / My notes (closed by default) ---------- */
.dct-cdrawer { background: #fff; border: 1px solid var(--dct-line); border-radius: 16px; margin: 0 0 12px; box-shadow: 0 1px 2px rgba(30, 34, 53, .03); transition: box-shadow .3s, border-color .3s; }
.dct-cdrawer[open] { box-shadow: var(--dct-shadow); border-color: #DDD6FE; }
.dct-cdrawer > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; padding: 15px 18px; font-weight: 700; border-radius: 16px; transition: background .2s; }
.dct-cdrawer > summary::-webkit-details-marker { display: none; }
.dct-cdrawer > summary:hover { background: var(--dct-soft); }
.dct-cdrawer > summary > span { color: var(--dct-muted); font-weight: 400; white-space: nowrap; }
.dct-cdrawer > summary::after { content: ""; flex: none; margin-left: auto; width: 30px; height: 30px; border-radius: 50%; background: var(--dct-primary-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%234F46E5' d='M7.4 8.6 12 13.2l4.6-4.6L18 10l-6 6-6-6z'/%3E%3C/svg%3E") center / 20px no-repeat; transition: transform .3s var(--dct-ease); }
.dct-cdrawer[open] > summary::after { transform: rotate(180deg); }
.dct-cdrawer-in { padding: 0 18px 10px; }
.dct-nlist { margin: 0 0 8px; padding-left: 4px; list-style: none; }
.dct-nlist li { padding: 6px 0; border-bottom: 1px solid #F3F4F6; }
.dct-nlist li:last-child { border-bottom: 0; }
@media (prefers-reduced-motion: no-preference) {
	.dct-cdrawer[open] > .dct-cdrawer-in, .dct-folder[open] > ul { animation: fx-pop .35s var(--dct-ease) both; }
}

/* ---------- course search (Courses page, beside "All courses") ---------- */
.dct-all-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 26px 0 16px; }
.dct-all-row .dct-all-h { margin: 0 !important; }
.dct-csearch { position: relative; flex: 0 1 420px; min-width: 260px; }
.dct-csearch label { display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid var(--dct-line); border-radius: 14px; padding: 2px 6px 2px 14px; color: var(--dct-muted); box-shadow: var(--dct-shadow); transition: border-color .2s, box-shadow .2s; }
.dct-csearch label:focus-within { border-color: #A5B4FC; box-shadow: 0 0 0 4px rgba(165, 180, 252, .35); }
.dct-csearch input { flex: 1; min-width: 0; border: 0 !important; outline: 0 !important; box-shadow: none !important; background: transparent; font-size: 16px; padding: 11px 2px; color: var(--dct-ink); }
.dct-csearch-list { position: absolute; z-index: 50; left: 0; right: 0; top: calc(100% + 8px); background: #fff; border-radius: 16px; box-shadow: 0 18px 44px rgba(30, 34, 53, .18); padding: 6px; max-height: 60vh; overflow: auto; }
.dct-csearch-list[hidden] { display: none; }
.dct-csearch-list a { display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: 12px; text-decoration: none !important; color: var(--dct-ink) !important; }
.dct-csearch-list a:hover, .dct-csearch-list a.is-on { background: var(--dct-primary-soft); }
.dct-csearch-list img, .dct-csearch-ph { flex: none; width: 64px; height: 36px; object-fit: cover; border-radius: 8px; background: linear-gradient(135deg, #EEF0FF, #FCE7F3); }
.dct-csearch-list strong { display: block; font-size: 14.5px; font-weight: 600; line-height: 1.35; }
.dct-csearch-list small { color: var(--dct-muted); font-size: 13px; }
.dct-csearch-list small b { color: var(--dct-primary); }
.dct-csearch-none { padding: 12px; color: var(--dct-muted); font-size: 14.5px; }
.dct-csearch-none a { color: var(--dct-primary) !important; font-weight: 600; }
@media (max-width: 600px) { .dct-csearch { flex-basis: 100%; min-width: 0; } }

/* ---------- course filters (beside "All courses" and "Latest courses") ---------- */
.dct-all-row h2 { margin: 0 !important; }
.dct-cf-tools { display: flex; align-items: stretch; gap: 10px; flex: 0 1 560px; min-width: 260px; }
.dct-cf-tools .dct-csearch { flex: 1 1 auto; min-width: 0; }
.dct-cf-btn { display: inline-flex; align-items: center; gap: 8px; flex: none; background: #fff; border: 1px solid var(--dct-line); border-radius: 14px; padding: 0 16px; min-height: 46px; font: inherit; font-size: 15.5px; font-weight: 600; color: var(--dct-ink); cursor: pointer; box-shadow: var(--dct-shadow); transition: border-color .2s, background .2s, color .2s; }
.dct-cf-btn:hover, .dct-cf-btn[aria-expanded="true"] { border-color: #A5B4FC; }
.dct-cf-btn.is-on { background: var(--dct-primary-soft); border-color: #A5B4FC; color: var(--dct-primary); }
.dct-cf-n { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: var(--dct-primary); color: #fff; font-size: 12.5px; }
.dct-cf-n[hidden] { display: none; }
.dct-cf-panel { background: #fff; border: 1px solid var(--dct-line); border-radius: 18px; box-shadow: 0 18px 44px rgba(30, 34, 53, .12); margin: 0 0 18px; animation: fx-pop .3s var(--dct-ease) both; }
.dct-cf-panel[hidden], .dct-cf-back[hidden], .dct-cf-results[hidden] { display: none; }
.dct-cf-ph { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px 4px; font-size: 17px; }
.dct-cf-x { border: 0; background: transparent; font-size: 18px; width: 40px; height: 40px; border-radius: 50%; cursor: pointer; color: var(--dct-muted); }
.dct-cf-x:hover { background: var(--dct-primary-soft); }
.dct-cf-body { padding: 4px 18px 6px; }
.dct-cf-g { border: 0; margin: 0; padding: 10px 0; border-bottom: 1px dashed var(--dct-line); min-width: 0; }
.dct-cf-g:last-child { border-bottom: 0; }
.dct-cf-g legend { font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--dct-muted); padding: 0; margin-bottom: 8px; }
.dct-cf-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.dct-cf-chip { border: 1px solid var(--dct-line); background: #F8F9FC; border-radius: 999px; padding: 8px 14px; font: inherit; font-size: 14.5px; color: var(--dct-ink); cursor: pointer; transition: background .15s, border-color .15s, color .15s, transform .15s; }
.dct-cf-chip small { color: var(--dct-muted); font-size: 12.5px; margin-left: 2px; }
.dct-cf-chip:hover:not(:disabled) { border-color: #A5B4FC; transform: translateY(-1px); }
.dct-cf-chip.is-on { background: var(--dct-primary); border-color: var(--dct-primary); color: #fff; }
.dct-cf-chip.is-on small { color: rgba(255, 255, 255, .8); }
.dct-cf-chip:disabled { opacity: .4; cursor: default; }
.dct-cf-pf { display: flex; justify-content: flex-end; gap: 10px; padding: 12px 18px 16px; border-top: 1px solid var(--dct-line); }
.dct-cf-pf button { border-radius: 12px; padding: 11px 18px; font: inherit; font-weight: 600; cursor: pointer; }
.dct-cf-clear { border: 1px solid var(--dct-line); background: #fff; color: var(--dct-ink); }
.dct-cf-done { border: 0; background: var(--dct-primary); color: #fff; }
.dct-cf-results { scroll-margin-top: 96px; }
.dct-cf-sum { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 16px; }
.dct-cf-sum strong { margin-right: 4px; font-size: 16px; }
.dct-cf-tag { border: 0; background: var(--dct-primary-soft); color: var(--dct-primary); border-radius: 999px; padding: 6px 12px; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.dct-cf-sum .dct-cf-clear { border-radius: 999px; padding: 6px 12px; font: inherit; font-size: 14px; cursor: pointer; }
.dct-cf-none { padding: 26px 18px; border: 1px dashed var(--dct-line); border-radius: 16px; text-align: center; color: var(--dct-muted); }
.dct-cf-none a { color: var(--dct-primary) !important; font-weight: 600; }
.dct-cf-grid .dct-card-p s { color: var(--dct-muted); font-weight: 400; margin-left: 4px; }
.dct-cf-hid { display: none !important; }
@media (max-width: 700px) {
	.dct-cf-tools { flex-basis: 100%; min-width: 0; }
	.dct-cf-btn { padding: 0 14px; }
	.dct-cf-back { position: fixed; inset: 0; z-index: 2147483000; background: rgba(15, 18, 34, .5); }
	.dct-cf-panel { position: fixed; z-index: 2147483001; left: 0; right: 0; bottom: 0; padding-bottom: env(safe-area-inset-bottom); margin: 0; max-height: 82vh; display: flex; flex-direction: column; border-radius: 22px 22px 0 0; animation: dct-cf-up .28s var(--dct-ease) both; }
	.dct-cf-panel[hidden] { display: none; }
	.dct-cf-body { overflow: auto; flex: 1; }
	.dct-cf-pf button { flex: 1; }
	html.dct-cf-open { overflow: hidden; }
}
@keyframes dct-cf-up { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ---------- Ask DIG Bot (bonus doubt solving) ---------- */
.dct-bot { max-width: 820px; margin: 0 auto; }
.dct-bot-hero { position: relative; overflow: hidden; border-radius: 24px; padding: 30px 26px 24px; color: #fff; background: radial-gradient(120% 140% at 0% 0%, #7C3AED 0%, #4F46E5 45%, #0EA5E9 100%); box-shadow: 0 18px 44px rgba(79, 70, 229, .28); margin: 6px 0 22px; }
.dct-bot-hero::after { content: "🤖"; position: absolute; right: -10px; bottom: -30px; font-size: 150px; opacity: .14; transform: rotate(-12deg); }
.dct-bot-badge { display: inline-block; background: rgba(255, 255, 255, .2); border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px; padding: 5px 12px; font-size: 13.5px; font-weight: 700; letter-spacing: .02em; }
.dct-bot-hero h1 { color: #fff !important; margin: 12px 0 8px !important; font-size: clamp(28px, 5vw, 38px) !important; }
.dct-bot-lead { font-size: 17px; line-height: 1.55; margin: 0 0 14px; max-width: 620px; color: rgba(255, 255, 255, .95); }
.dct-bot-points { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.dct-bot-points li { background: rgba(255, 255, 255, .16); border-radius: 12px; padding: 7px 12px; font-size: 14.5px; }
.dct-bot-gate { background: #fff; border: 1px solid var(--dct-line); border-radius: 18px; padding: 22px; text-align: center; box-shadow: var(--dct-shadow); }
.dct-bot-form { background: #fff; border: 1px solid var(--dct-line); border-radius: 20px; padding: 18px; box-shadow: var(--dct-shadow); }
.dct-bot-mode { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; background: #F3F4FA; border-radius: 14px; padding: 5px; margin-bottom: 14px; }
.dct-bot-mode button { border: 0; background: transparent; border-radius: 10px; padding: 11px 8px; font: inherit; font-weight: 600; color: var(--dct-muted); cursor: pointer; }
.dct-bot-mode button.is-on { background: #fff; color: var(--dct-primary); box-shadow: 0 2px 8px rgba(30, 34, 53, .1); }
.dct-bot-form textarea, .dct-bot-form input[type=text] { width: 100%; box-sizing: border-box; border: 1px solid var(--dct-line); border-radius: 14px; padding: 13px 14px; font: inherit; font-size: 16px; line-height: 1.5; resize: vertical; }
.dct-bot-form textarea:focus, .dct-bot-form input[type=text]:focus { outline: 0; border-color: #A5B4FC; box-shadow: 0 0 0 4px rgba(165, 180, 252, .35); }
.dct-bot-drop { display: block; position: relative; border: 2px dashed #C7D2FE; border-radius: 16px; background: #F8F9FF; padding: 26px 16px; text-align: center; cursor: pointer; margin-bottom: 10px; }
.dct-bot-drop input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.dct-bot-drop-in { display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--dct-muted); }
.dct-bot-drop-in span { font-size: 34px; }
.dct-bot-drop-in strong { color: var(--dct-ink); }
.dct-bot-drop.has-img { padding: 8px; }
.dct-bot-drop.has-img .dct-bot-drop-in { display: none; }
.dct-bot-drop img { max-width: 100%; max-height: 360px; border-radius: 12px; display: block; margin: 0 auto; }
.dct-bot-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 12px; }
.dct-bot-left { color: var(--dct-muted); font-size: 14px; }
.dct-bot-foot .dct-btn[disabled] { opacity: .5; cursor: not-allowed; }
.dct-bot-msg { margin: 10px 0 0; font-weight: 600; color: var(--dct-primary); min-height: 1em; }
.dct-bot-h { margin: 28px 0 12px !important; }
.dct-bot-card { background: #fff; border: 1px solid var(--dct-line); border-radius: 18px; padding: 14px 16px; margin-bottom: 12px; box-shadow: var(--dct-shadow); scroll-margin-top: 96px; }
.dct-bot-ct { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; color: var(--dct-muted); }
.dct-bot-st { border-radius: 999px; padding: 4px 10px; font-size: 13px; font-weight: 700; }
.dct-bot-st.is-wait { background: #FEF3C7; color: #92400E; }
.dct-bot-st.is-done { background: #DCFCE7; color: #166534; }
.dct-bot-st.is-off { background: #E0E7FF; color: #3730A3; }
.dct-bot-qimg { display: block; max-width: 100%; max-height: 320px; border-radius: 12px; margin: 10px 0 4px; border: 1px solid var(--dct-line); }
.dct-bot-q { margin: 10px 0 4px; white-space: normal; }
.dct-bot-a { margin-top: 10px; border-top: 1px dashed var(--dct-line); padding-top: 8px; }
.dct-bot-a summary { cursor: pointer; font-weight: 700; color: var(--dct-primary); padding: 4px 0; }
.dct-bot-ans { line-height: 1.65; overflow-x: auto; }
.dct-bot-ans h4 { margin: 14px 0 6px; font-size: 16px; }
.dct-bot-ans ol, .dct-bot-ans ul { padding-left: 22px; }
.dct-bot-fine { color: var(--dct-muted); font-size: 13px; text-align: center; margin: 22px 0 6px; }
.dct-tab-bot { position: relative; }
.dct-tab-bonus { display: inline-block; margin-left: 4px; background: linear-gradient(135deg, #F59E0B, #EF4444); color: #fff; font-size: 11px; font-weight: 800; border-radius: 999px; padding: 2px 7px; vertical-align: 2px; letter-spacing: .03em; }
.dct-bot .dct-btn { background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); color: #fff !important; border: 0; box-shadow: 0 6px 16px rgba(79, 70, 229, .28); cursor: pointer; font: inherit; font-weight: 700; }
.dct-bot .dct-btn[disabled] { background: #C7CBD8; box-shadow: none; }
body:has(.dct-bot) .wp-block-post-title { display: none; }
/* ---------- top bar stays visible while scrolling ----------
   .dct-hd sits inside the theme's header box, so the box itself has to stick. */
body { --dct-stick: 65px; }
.site-header.wp-block-template-part, header.wp-block-template-part { position: sticky; top: 0; z-index: 1000; }
.admin-bar .site-header.wp-block-template-part, .admin-bar header.wp-block-template-part { top: 32px; }
body.admin-bar { --dct-stick: 97px; }
html { scroll-padding-top: 96px; } /* links and "scroll to" stop below the bar */
body .dct-pdf-bar { top: var(--dct-stick); }
body .dct-pdf:fullscreen .dct-pdf-bar { top: 0; }
@media (max-width: 960px) { body { --dct-stick: 57px; } body.admin-bar { --dct-stick: 89px; } }
@media (max-width: 782px) { .admin-bar .site-header.wp-block-template-part, .admin-bar header.wp-block-template-part { top: 46px; } body.admin-bar { --dct-stick: 103px; } }
@media (max-width: 600px) { .admin-bar .site-header.wp-block-template-part, .admin-bar header.wp-block-template-part { top: 0; } body.admin-bar { --dct-stick: 57px; } }
/* ---------- notes page: the viewer uses the full window width ----------
   The theme forces auto margins with !important, so bleed past its side padding, leaving 12px. */
body.single-dct_pdf .dct-pdf { --dct-bleed: max(0px, calc(var(--wp--style--root--padding-left, 12px) - 12px)); box-sizing: border-box; max-width: none !important; width: calc(100% + 2 * var(--dct-bleed)); margin-left: calc(-1 * var(--dct-bleed)) !important; margin-right: calc(-1 * var(--dct-bleed)) !important; }
/* ---------- top bar fits narrow phones (the row needs 385px at normal size) ---------- */
@media (max-width: 400px) {
	.dct-hd-in.dct-wrap { padding-left: 12px; padding-right: 12px; gap: 6px; }
	.dct-brand { gap: 6px; }
	.dct-brand:not(.dct-brand-ft) img { width: 30px; height: 30px; }
	.dct-brand:not(.dct-brand-ft) span { font-size: 14.5px; }
	.dct-sound { width: 34px; height: 34px; }
	.dct-btn-hd { padding: 8px 12px; font-size: 14px; }
}
@media (max-width: 345px) {
	.dct-brand:not(.dct-brand-ft) span { font-size: 13.5px; }
	.dct-btn-hd { padding: 7px 9px; font-size: 13px; }
}
/* ---------- login and OTP page ---------- */
.dct-lg { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); width: 100%; max-width: 980px !important; margin: 0 auto 34px !important; border-radius: 28px; overflow: hidden; background: #fff; box-shadow: 0 26px 64px rgba(79, 70, 229, .17); }
.dct-lg-art { position: relative; display: flex; flex-direction: column; gap: 20px; padding: 34px 32px 30px; color: #fff; background: radial-gradient(130% 120% at 0% 0%, #7C3AED 0%, #4F46E5 48%, #0EA5E9 100%); }
.dct-lg-pic { display: block; width: 100%; height: auto; max-height: 250px; overflow: visible; }
.dct-lg-quote { margin: auto 0 0; padding: 0; }
.dct-lg-quote blockquote { position: relative; margin: 0 0 12px; padding: 0 0 0 34px; border: 0; color: #fff; font-family: Georgia, 'Times New Roman', serif; font-size: 20px; line-height: 1.45; font-style: italic; }
.dct-lg-quote blockquote::before { content: "\201C"; position: absolute; left: 0; top: -12px; font-size: 58px; line-height: 1; color: #FBBF24; font-style: normal; }
.dct-lg-quote figcaption { padding-left: 34px; font-size: 14.5px; }
.dct-lg-quote figcaption strong { display: block; font-size: 15.5px; font-weight: 700; }
.dct-lg-quote figcaption span { color: rgba(255, 255, 255, .78); }
.dct-lg-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.dct-lg-chips li { margin: 0; background: rgba(255, 255, 255, .16); border-radius: 999px; padding: 6px 12px; font-size: 13.5px; font-weight: 600; }
.dct-lg .dct-login { display: flex; flex-direction: column; justify-content: center; max-width: none; margin: 0; padding: 40px 38px; border: 0; border-radius: 0; background: #fff; }
.dct-lg .dct-login h2 { margin: 0 0 8px; font-size: clamp(25px, 3vw, 30px); line-height: 1.2; letter-spacing: -.02em; color: var(--dct-ink); }
.dct-lg .dct-login-help { margin: 0 0 8px; font-size: 15.5px; line-height: 1.55; }
.dct-lg .dct-login label { margin: 16px 0 8px; font-size: 15px; }
.dct-lg-dots { list-style: none; display: flex; gap: 6px; margin: 0 0 18px; padding: 0; }
.dct-lg-dots li { margin: 0; width: 34px; height: 6px; border-radius: 3px; background: #E5E7F2; transition: background .3s; }
.dct-lg-dots li:first-child, #dct-login[data-at="otp"] .dct-lg-dots li, #dct-login[data-at="name"] .dct-lg-dots li { background: linear-gradient(90deg, var(--dct-primary), var(--dct-violet)); }
#dct-login[data-at="otp"] .dct-lg-intro, #dct-login[data-at="name"] .dct-lg-intro { display: none; }
.dct-lg-ic { display: block; font-size: 38px; line-height: 1; margin-bottom: 10px; }
.dct-lg .dct-login input { border: 1.5px solid var(--dct-line); border-radius: 14px; padding: 13px 14px; font-size: 18px; color: var(--dct-ink); background: #fff; outline: 0; box-shadow: none; transition: border-color .2s, box-shadow .2s; }
.dct-lg .dct-login input:focus { border-color: #A5B4FC; box-shadow: 0 0 0 4px rgba(165, 180, 252, .35); }
.dct-lg .dct-phone-row { gap: 0; border: 1.5px solid var(--dct-line); border-radius: 14px; overflow: hidden; transition: border-color .2s, box-shadow .2s; }
.dct-lg .dct-phone-row:focus-within { border-color: #A5B4FC; box-shadow: 0 0 0 4px rgba(165, 180, 252, .35); }
.dct-lg .dct-phone-row span { align-self: stretch; display: flex; align-items: center; padding: 0 12px; background: #F3F4FA; font-size: 16px; white-space: nowrap; }
.dct-lg .dct-phone-row input, .dct-lg .dct-phone-row input:focus { flex: 1; min-width: 0; border: 0; border-radius: 0; box-shadow: none; }
.dct-lg #dct-otp { text-align: center; font-size: 26px; font-weight: 700; letter-spacing: .38em; padding-left: calc(14px + .38em); }
.dct-lg #dct-otp::placeholder { color: #C7CBD8; }
.dct-lg .dct-login .dct-start { margin-top: 16px; padding: 14px 20px; font-size: 17px; background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); box-shadow: 0 10px 22px rgba(79, 70, 229, .3); }
.dct-lg .dct-login .dct-start:disabled { opacity: .7; }
.dct-lg-note { margin: 14px 0 0; text-align: center; color: var(--dct-muted); font-size: 14px; }
.dct-lg-links { display: flex; justify-content: space-between; gap: 12px; margin: 14px 0 0; }
.dct-lg .dct-login-error { margin: 12px 0 0; min-height: 0; font-weight: 600; }
@media (prefers-reduced-motion: no-preference) {
	.dct-lg-float { animation: dct-lg-float 4s ease-in-out infinite; }
	.dct-lg-spin { transform-origin: 58px 56px; animation: dct-lg-spin 14s linear infinite; }
}
@keyframes dct-lg-float { 50% { transform: translateY(-8px); } }
@keyframes dct-lg-spin { to { transform: rotate(360deg); } }
@media (max-width: 820px) {
	.dct-lg { grid-template-columns: minmax(0, 1fr); border-radius: 22px; }
	.dct-lg-art { padding: 20px 20px 18px; gap: 12px; }
	.dct-lg-pic { max-height: 130px; }
	.dct-lg-quote blockquote { font-size: 16.5px; padding-left: 28px; margin-bottom: 8px; }
	.dct-lg-quote blockquote::before { font-size: 46px; top: -9px; }
	.dct-lg-quote figcaption { padding-left: 28px; font-size: 13.5px; }
	.dct-lg-quote figcaption strong { font-size: 14.5px; }
	.dct-lg-chips { display: none; }
	.dct-lg .dct-login { padding: 24px 20px 26px; }
}
body.dct-login-page main.wp-block-group { margin-top: 0 !important; }
@media (max-width: 820px) {
	body.dct-login-page main.wp-block-group { padding-top: 0 !important; }
	body.dct-login-page .entry-content, body.dct-login-page .wp-block-post-content { margin-top: 0 !important; padding-top: 0 !important; }
	body.dct-login-page .wp-block-group { padding-top: 0 !important; }
	.dct-lg { margin-top: 12px !important; }
	.dct-lg-art { padding: 14px 18px 14px; gap: 8px; }
	.dct-lg-pic { max-height: 96px; }
	.dct-lg .dct-login { padding: 18px 18px 22px; }
	.dct-lg .dct-login h2 { font-size: 22px; }
	.dct-lg .dct-login-help { font-size: 14.5px; line-height: 1.45; margin-bottom: 0; }
	.dct-lg .dct-login label { margin-top: 12px; }
	.dct-lg-dots { margin-bottom: 12px; }
	body.dct-login-page .dct-wa { display: none !important; }
}
/* ---------- student dashboard (Tutor's /dashboard/) ---------- */
body.dct-dash { background: var(--dct-soft, #F8F9FF); }
.tutor-dashboard-sidebar-logo { display: flex !important; align-items: center; gap: 10px; text-decoration: none !important; }
.tutor-dashboard-sidebar-logo img { flex: none; width: 42px; height: 42px; border-radius: 50%; box-shadow: 0 6px 16px rgba(220, 38, 38, .25); }
.dct-d-brand { font-size: 19px; line-height: 1.15; font-weight: 800; letter-spacing: -.02em; background: linear-gradient(120deg, #DC2626 0%, #7C3AED 55%, #4F46E5 100%); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
body.dct-dash .tutor-dashboard-sidebar-nav a { border-radius: 12px; transition: background .2s, color .2s; }
body.dct-dash .tutor-dashboard-sidebar-nav a:hover { background: var(--dct-primary-soft); color: var(--dct-primary); }
body.dct-dash .tutor-dashboard-sidebar-nav a.active { background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); color: #fff !important; box-shadow: 0 8px 18px rgba(79, 70, 229, .28); }
body.dct-dash .tutor-dashboard-sidebar-nav a.active * { color: #fff !important; fill: currentColor; }
body.dct-dash-home .tutor-dashboard-body > :not(#dct-dash) { display: none !important; }
body.dct-dash-home .tutor-dashboard-header-left { visibility: hidden; }
#dct-dash { max-width: 1120px; margin: 0 auto; padding: 4px 0 40px; color: var(--dct-ink); }
.dct-d-hero { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 22px; flex-wrap: wrap; padding: 28px 30px; border-radius: 24px; color: #fff; background: radial-gradient(130% 150% at 0% 0%, #7C3AED 0%, #4F46E5 48%, #0EA5E9 100%); box-shadow: 0 18px 44px rgba(79, 70, 229, .26); }
.dct-d-hero::after { content: "🎓"; position: absolute; right: -14px; bottom: -44px; font-size: 150px; opacity: .1; transform: rotate(-12deg); pointer-events: none; }
.dct-d-hero h1 { margin: 0 0 6px !important; color: #fff !important; font-size: clamp(26px, 4vw, 34px) !important; line-height: 1.15; letter-spacing: -.02em; }
.dct-d-hero p { margin: 0; font-size: 16px; color: rgba(255, 255, 255, .92); }
.dct-d-stats { position: relative; z-index: 1; list-style: none; display: flex; gap: 10px; margin: 0; padding: 0; }
.dct-d-stats li { margin: 0; min-width: 86px; padding: 11px 14px; text-align: center; border-radius: 16px; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .25); }
.dct-d-stats strong { display: block; font-size: 24px; line-height: 1.1; font-weight: 800; }
.dct-d-stats span { font-size: 13px; color: rgba(255, 255, 255, .88); }
.dct-d-quick { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin: 18px 0 8px; }
.dct-d-quick a { position: relative; display: flex; flex-direction: column; align-items: center; gap: 7px; padding: 16px 8px 14px; border-radius: 18px; background: #fff; box-shadow: var(--dct-shadow); text-align: center; font-size: 14px; font-weight: 600; line-height: 1.25; color: var(--dct-ink) !important; text-decoration: none !important; transition: transform .25s var(--dct-ease), box-shadow .25s; }
.dct-d-quick a:hover { transform: translateY(-3px); box-shadow: var(--dct-shadow-up); }
.dct-d-qi { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; font-size: 23px; background: linear-gradient(135deg, #EEF0FF, #FCE7F3); }
.dct-d-quick em { position: absolute; top: 8px; right: 8px; padding: 2px 7px; border-radius: 999px; font-style: normal; font-size: 10.5px; font-weight: 800; color: #fff; background: linear-gradient(135deg, #F59E0B, #EF4444); }
.dct-d-h { display: flex; align-items: center; gap: 10px; margin: 26px 0 14px !important; font-size: 23px !important; letter-spacing: -.02em; scroll-margin-top: 20px; }
.dct-d-h.is-sub { color: var(--dct-muted); font-size: 19px !important; }
.dct-d-h span { display: inline-grid; place-items: center; min-width: 28px; height: 28px; padding: 0 8px; border-radius: 14px; font-size: 14px; font-weight: 800; color: var(--dct-primary); background: var(--dct-primary-soft); }
.dct-d-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); gap: 16px; }
.dct-d-card { display: flex; flex-direction: column; overflow: hidden; border-radius: 20px; background: #fff; box-shadow: var(--dct-shadow); transition: transform .3s var(--dct-ease), box-shadow .3s; }
.dct-d-card:hover { transform: translateY(-4px); box-shadow: var(--dct-shadow-up); }
.dct-d-card.is-off { filter: grayscale(.75); opacity: .78; }
.dct-d-thumb { display: block; aspect-ratio: 16 / 9; background: linear-gradient(135deg, #EEF0FF, #FCE7F3); }
.dct-d-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dct-d-thumb span { display: grid; place-items: center; height: 100%; font-size: 44px; font-weight: 800; color: var(--dct-primary); }
.dct-d-cbody { display: flex; flex: 1; flex-direction: column; gap: 8px; padding: 14px 16px 16px; }
.dct-d-cbody h3 { margin: 0 !important; font-size: 16px !important; font-weight: 700; line-height: 1.35; }
.dct-d-cbody h3 a { color: var(--dct-ink) !important; text-decoration: none !important; }
.dct-d-meta { margin: 0; color: var(--dct-muted); font-size: 13.5px; line-height: 1.5; }
.dct-d-when { color: #047857; font-weight: 600; }
.is-off .dct-d-when { color: #B91C1C; }
.dct-d-act { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 4px; }
.dct-d-go { display: inline-block; padding: 9px 15px; border-radius: 12px; font-size: 14.5px; font-weight: 700; color: #fff !important; text-decoration: none !important; background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); box-shadow: 0 6px 14px rgba(79, 70, 229, .26); }
.dct-d-grp { padding: 8px 11px; border-radius: 12px; font-size: 14px; font-weight: 600; white-space: nowrap; color: var(--dct-primary) !important; text-decoration: none !important; background: var(--dct-primary-soft); }
.dct-d-empty { padding: 34px 20px; border-radius: 20px; background: #fff; text-align: center; box-shadow: var(--dct-shadow); }
.dct-d-empty p { margin: 0 0 14px; color: var(--dct-muted); }
@media (max-width: 1000px) { .dct-d-quick { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 600px) {
	.dct-d-hero { padding: 22px 20px; border-radius: 20px; }
	.dct-d-stats { width: 100%; }
	.dct-d-stats li { flex: 1; min-width: 0; padding: 9px 6px; }
	.dct-d-quick { gap: 8px; }
	.dct-d-quick a { padding: 12px 4px 10px; font-size: 12.5px; border-radius: 14px; }
	.dct-d-qi { width: 40px; height: 40px; font-size: 20px; }
	.dct-d-grid { grid-template-columns: minmax(0, 1fr); }
}
/* ---------- discussion groups list ---------- */
body:has(.dct-gl) main.wp-block-group { margin-top: 0 !important; }
body:has(.dct-gl) .wp-block-post-title { display: none; }
.dct-gl { width: 100%; max-width: 900px !important; margin: 0 auto 34px !important; }
.dct-gl-hero { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 14px 0 26px; padding: 30px 30px 28px; border-radius: 26px; color: #fff; background: radial-gradient(130% 150% at 0% 0%, #7C3AED 0%, #4F46E5 48%, #0EA5E9 100%); box-shadow: 0 20px 48px rgba(79, 70, 229, .26); }
.dct-gl-copy { position: relative; z-index: 1; max-width: 520px; }
.dct-gl-badge { display: inline-block; padding: 5px 12px; border-radius: 999px; font-size: 13.5px; font-weight: 700; background: rgba(255, 255, 255, .2); border: 1px solid rgba(255, 255, 255, .34); }
.dct-gl-hero h1 { margin: 12px 0 8px !important; color: #fff !important; font-size: clamp(30px, 5vw, 42px) !important; line-height: 1.1; letter-spacing: -.025em; }
.dct-gl-hero p { margin: 0 0 14px; font-size: 16.5px; line-height: 1.55; color: rgba(255, 255, 255, .94); }
.dct-gl-points { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; }
.dct-gl-points li { margin: 0; padding: 6px 12px; border-radius: 12px; font-size: 14px; background: rgba(255, 255, 255, .16); }
.dct-gl-art { position: relative; flex: none; width: 250px; height: 150px; }
.dct-gl-art span { position: absolute; padding: 10px 14px; border-radius: 16px; font-size: 14.5px; font-weight: 600; white-space: nowrap; color: var(--dct-ink); background: #fff; box-shadow: 0 12px 26px rgba(17, 12, 60, .22); }
.dct-gl-art .b1 { top: 4px; left: 0; border-bottom-left-radius: 4px; }
.dct-gl-art .b2 { top: 58px; right: 0; color: #fff; background: linear-gradient(135deg, #F59E0B, #EF4444); border-bottom-right-radius: 4px; }
.dct-gl-art .b3 { bottom: 4px; left: 22px; border-bottom-left-radius: 4px; }
.dct-gl-h { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 12px; }
.dct-gl-h h2 { margin: 0 !important; font-size: 23px !important; letter-spacing: -.02em; }
#dct-gl-sum { color: var(--dct-primary); font-size: 14.5px; font-weight: 700; }
.dct-gl .dct-glist { gap: 12px; margin-top: 0; }
.dct-gl .dct-gitem { position: relative; gap: 16px; padding: 14px 18px 14px 14px; border-radius: 20px; }
.dct-gl .dct-gitem.has-new { background: linear-gradient(90deg, #F5F3FF, #fff 60%); }
.dct-gl .dct-gitem.has-new::before { content: ""; position: absolute; left: 0; top: 16px; bottom: 16px; width: 4px; border-radius: 0 4px 4px 0; background: linear-gradient(180deg, var(--dct-primary), var(--dct-violet)); }
.dct-gimg, .dct-gl .dct-gav { flex: none; width: 104px; height: 62px; border-radius: 13px; object-fit: cover; font-size: 26px; }
.dct-gl .dct-gtxt { gap: 5px; }
.dct-gl .dct-gtxt strong { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 16.5px; font-weight: 700; line-height: 1.32; }
.dct-gmeta { display: flex; flex-wrap: wrap; gap: 3px 14px; color: var(--dct-muted); font-size: 13.5px; }
.dct-gl .dct-gbadge { flex: none; padding: 4px 10px; font-size: 12.5px; white-space: nowrap; background: linear-gradient(135deg, #F59E0B, #EF4444); }
.dct-gopen { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; font-size: 18px; font-weight: 700; color: var(--dct-primary); background: var(--dct-primary-soft); transition: transform .25s var(--dct-ease); }
.dct-gitem:hover .dct-gopen { transform: translateX(3px); }
.dct-gl-empty { padding: 34px 20px; border-radius: 20px; background: #fff; text-align: center; box-shadow: var(--dct-shadow); }
.dct-gl-empty > span { font-size: 40px; }
.dct-gl-empty p { margin: 8px 0 12px; color: var(--dct-muted); }
.dct-gl-empty a { font-weight: 700; color: var(--dct-primary) !important; }
.dct-gl-bot { display: flex; align-items: center; gap: 14px; margin-top: 18px; padding: 15px 18px; border-radius: 20px; color: var(--dct-ink) !important; text-decoration: none !important; background: linear-gradient(120deg, #FFF7ED, #FCE7F3); transition: transform .25s var(--dct-ease); }
.dct-gl-bot:hover { transform: translateY(-2px); }
.dct-gl-bot > span:first-child { font-size: 30px; }
.dct-gl-bot > span:nth-child(2) { flex: 1; min-width: 0; }
.dct-gl-bot strong { display: block; font-size: 16px; }
.dct-gl-bot small { color: var(--dct-muted); font-size: 14px; }
.dct-gl-bot b { color: var(--dct-primary); font-size: 20px; }
@media (max-width: 780px) { .dct-gl-art { display: none; } }
@media (max-width: 600px) {
	.dct-gl-hero { margin-top: 12px; padding: 22px 20px; border-radius: 22px; }
	.dct-gl .dct-gitem { align-items: flex-start; gap: 12px; padding: 12px; }
	.dct-gimg, .dct-gl .dct-gav { width: 76px; height: 48px; border-radius: 10px; }
	.dct-gopen { display: none; }
	.dct-gl .dct-gbadge { position: absolute; top: -7px; right: 10px; }
}
/* ---------- student pages: My tests, My notes, Credits, 1:1 call ---------- */
body:has(.dct-pg) main.wp-block-group { margin-top: 0 !important; }
body:has(.dct-pg) .wp-block-post-title { display: none; }
.dct-pg { width: 100%; max-width: 960px !important; margin: 0 auto 34px !important; font-size: 16px; }
.dct-pg .dct-mytests, .dct-pg .dct-notes { max-width: none !important; }
.dct-pg-hero { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 14px 0 22px; padding: 30px 30px 28px; border-radius: 26px; color: #fff; background: radial-gradient(130% 150% at 0% 0%, #7C3AED 0%, #4F46E5 48%, #0EA5E9 100%); box-shadow: 0 20px 48px rgba(79, 70, 229, .26); }
.dct-pg-notes .dct-pg-hero { background: radial-gradient(130% 150% at 0% 0%, #0F766E 0%, #0891B2 50%, #4F46E5 100%); box-shadow: 0 20px 48px rgba(8, 145, 178, .26); }
.dct-pg-credits .dct-pg-hero { background: radial-gradient(130% 150% at 0% 0%, #DB2777 0%, #9333EA 52%, #4F46E5 100%); box-shadow: 0 20px 48px rgba(219, 39, 119, .24); }
.dct-pg-calls .dct-pg-hero { background: radial-gradient(130% 150% at 0% 0%, #BE185D 0%, #7C3AED 50%, #2563EB 100%); box-shadow: 0 20px 48px rgba(124, 58, 237, .26); }
.dct-pg-copy { position: relative; z-index: 1; min-width: 0; max-width: 610px; }
.dct-pg-badge { display: inline-block; padding: 5px 12px; border-radius: 999px; font-size: 13.5px; font-weight: 700; background: rgba(255, 255, 255, .2); border: 1px solid rgba(255, 255, 255, .34); }
.dct-pg-hero h1 { margin: 12px 0 8px !important; color: #fff !important; font-size: clamp(30px, 5vw, 42px) !important; line-height: 1.1; letter-spacing: -.025em; }
.dct-pg-hero p { margin: 0; font-size: 16.5px; line-height: 1.55; color: rgba(255, 255, 255, .94); }
.dct-pg-stats { list-style: none; display: flex; gap: 10px; margin: 16px 0 0; padding: 0; }
.dct-pg-stats li { margin: 0; min-width: 92px; padding: 10px 14px; text-align: center; border-radius: 16px; background: rgba(255, 255, 255, .17); border: 1px solid rgba(255, 255, 255, .26); }
.dct-pg-stats strong { display: block; font-size: 24px; line-height: 1.1; font-weight: 800; }
.dct-pg-stats span { font-size: 13px; color: rgba(255, 255, 255, .9); }
.dct-pg-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0; padding: 0; }
.dct-pg-chips li { margin: 0; padding: 6px 12px; border-radius: 12px; font-size: 14px; font-weight: 600; background: rgba(255, 255, 255, .17); }
.dct-pg-art { flex: none; width: 210px; }
.dct-pg-art svg { display: block; width: 100%; height: auto; overflow: visible; }
.dct-pg-gate { padding: 30px 22px; border-radius: 20px; background: #fff; text-align: center; box-shadow: var(--dct-shadow); }
.dct-pg-gate p { margin: 0 0 14px; font-size: 17px; }
.dct-pg-btn { display: inline-block; padding: 12px 22px; border-radius: 13px; font-weight: 700; color: #fff !important; text-decoration: none !important; background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); box-shadow: 0 10px 22px rgba(79, 70, 229, .28); }
.dct-pg-h { margin: 26px 0 12px !important; font-size: 23px !important; letter-spacing: -.02em; }
.dct-pg .dct-cdrawer { margin-bottom: 12px; border: 0; border-radius: 20px; box-shadow: var(--dct-shadow); }
.dct-pg .dct-cdrawer[open] { box-shadow: var(--dct-shadow-up); }
.dct-pg .dct-cdrawer > summary { gap: 14px; padding: 12px 16px 12px 12px; border-radius: 20px; font-weight: 400; }
.dct-cs-img { flex: none; display: grid; place-items: center; width: 108px; height: 62px; border-radius: 13px; object-fit: cover; background: linear-gradient(135deg, #EEF0FF, #FCE7F3); font-style: normal; font-size: 26px; font-weight: 800; color: var(--dct-primary); }
.dct-cs-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.dct-cs-t strong { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 16.5px; font-weight: 700; line-height: 1.32; }
.dct-cs-t small { color: var(--dct-muted); font-size: 13.5px; }
.dct-cs-bar { display: block; height: 6px; max-width: 300px; margin-top: 3px; border-radius: 3px; background: #E9EBF5; overflow: hidden; }
.dct-cs-bar i { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, #10B981, #34D399); }
.dct-pg .dct-cdrawer-in { padding: 0 14px 14px; }
.dct-pg .dct-folder { border-top: 1px solid #F0F1F7; }
.dct-pg .dct-trow { margin: 5px 0; border-bottom: 0 !important; }
.dct-pg .dct-trow a { padding: 11px 12px !important; border-radius: 12px; background: #FAFAFE; transition: background .2s, transform .2s var(--dct-ease); }
.dct-pg .dct-trow a:hover { background: var(--dct-primary-soft); transform: translateX(2px); }
.dct-tscore { padding: 3px 10px; border-radius: 999px; font-size: 14px; font-weight: 700; background: #DCFCE7; }
.dct-pg .dct-nlist { padding: 0; }
.dct-pg .dct-nlist li { margin: 5px 0 !important; padding: 0; border-bottom: 0; }
.dct-pg .dct-nlist li > a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 12px; border-radius: 12px; background: #FAFAFE; color: var(--dct-ink) !important; text-decoration: none !important; transition: background .2s, transform .2s var(--dct-ease); }
.dct-pg .dct-nlist li > a::after { content: "Read →"; flex: none; font-weight: 700; color: var(--dct-primary); }
.dct-pg .dct-nlist li > a:hover { background: var(--dct-primary-soft); transform: translateX(2px); }
.dct-pg .dct-nlist .dct-notyet { padding: 11px 12px; border-radius: 12px; background: #FAFAFE; }
.dct-cr-share { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px 22px; padding: 22px 24px; border-radius: 22px; background: #fff; box-shadow: var(--dct-shadow); }
.dct-cr-share h2 { margin: 0 0 6px !important; font-size: 23px !important; letter-spacing: -.02em; }
.dct-cr-share p { margin: 0; line-height: 1.5; }
.dct-cr-code { margin-top: 10px !important; color: var(--dct-muted); }
.dct-cr-code strong { display: inline-block; margin-left: 6px; padding: 5px 12px; border-radius: 10px; border: 1.5px dashed #A5B4FC; font-size: 17px; letter-spacing: .06em; color: var(--dct-primary); background: var(--dct-primary-soft); }
.dct-cr-btns { display: flex; flex-direction: column; gap: 8px; min-width: 170px; }
.dct-cr-b { display: block; box-sizing: border-box; width: 100%; padding: 11px 16px; border: 1.5px solid var(--dct-line); border-radius: 13px; font: inherit; font-weight: 700; text-align: center; color: var(--dct-ink) !important; text-decoration: none !important; background: #fff; cursor: pointer; }
.dct-cr-b.is-main { border: 0; color: #fff !important; background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); box-shadow: 0 8px 18px rgba(79, 70, 229, .26); }
.dct-cr-b.is-wa { border: 0; color: #fff !important; background: #25D366; }
.dct-cr-msg { grid-column: 1 / -1; color: var(--dct-primary); font-weight: 600; word-break: break-all; }
.dct-cr-msg:empty { display: none; }
.dct-pg .dct-ref { margin: 18px 0 0; padding: 22px 24px; border-radius: 22px; }
.dct-cr-rules { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; }
.dct-cr-rules li { display: flex; gap: 12px; margin: 0; padding: 16px; border-radius: 18px; background: #fff; box-shadow: var(--dct-shadow); }
.dct-cr-rules li > span { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; font-size: 22px; background: linear-gradient(135deg, #FEF3C7, #FCE7F3); }
.dct-cr-rules strong { display: block; margin-bottom: 2px; }
.dct-cr-rules small { display: block; color: var(--dct-muted); font-size: 14px; line-height: 1.45; }
.dct-pg .dct-table { overflow: hidden; border-collapse: separate; border-spacing: 0; border-radius: 16px; background: #fff; box-shadow: var(--dct-shadow); }
.dct-pg .dct-table th, .dct-pg .dct-table td { border: 0; border-bottom: 1px solid #F0F1F7; padding: 11px 14px; }
.dct-pg .dct-table tr:last-child td { border-bottom: 0; }
.dct-pg .dct-table th { font-size: 13.5px; color: var(--dct-muted); background: #FAFAFE; }
.dct-pg-steps { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0 0 8px; padding: 0; }
.dct-pg-steps li { display: flex; align-items: center; gap: 10px; margin: 0; padding: 12px 14px; border-radius: 16px; font-weight: 600; font-size: 15px; line-height: 1.25; background: #fff; box-shadow: var(--dct-shadow); }
.dct-pg-steps b { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: #fff; font-size: 14px; background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); }
.dct-pg-calls .dct-book { margin-top: 16px; padding: 24px; border-radius: 24px; }
.dct-pg-calls .dct-book h2 { margin: 0 0 14px; font-size: 23px; letter-spacing: -.02em; }
.dct-pg-calls .dct-kinds label { padding: 15px 16px; border-width: 1.5px; border-radius: 16px; }
.dct-pg-calls .dct-kinds label:has(input:checked) { border-color: #818CF8; box-shadow: 0 0 0 3px rgba(165, 180, 252, .35); }
.dct-pg-calls .dct-times { gap: 10px; }
.dct-pg-calls .dct-time { padding: 11px 4px; border-radius: 12px; }
.dct-pg-calls .dct-time[aria-pressed="true"] { background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); border-color: transparent; }
.dct-pg-calls .dct-topic textarea { padding: 12px; border: 1.5px solid var(--dct-line); border-radius: 14px; }
.dct-pg-calls .dct-book > .dct-start { width: 100%; padding: 14px 20px; background: linear-gradient(135deg, var(--dct-primary), var(--dct-violet)); box-shadow: 0 10px 22px rgba(79, 70, 229, .28); }
.dct-pg-calls .dct-book > .dct-start:disabled { background: #C7CBD8; box-shadow: none; }
.dct-pg-calls .dct-mycall { padding: 15px 18px; border-radius: 18px; }
@media (max-width: 780px) { .dct-pg-art { display: none; } }
@media (max-width: 600px) {
	.dct-pg-hero { margin-top: 12px; padding: 22px 20px; border-radius: 22px; }
	.dct-pg-stats li { flex: 1; min-width: 0; padding: 9px 4px; }
	.dct-pg-stats span { font-size: 12px; }
	.dct-pg .dct-cdrawer > summary { align-items: flex-start; gap: 11px; padding: 11px; }
	.dct-cs-img { width: 76px; height: 48px; border-radius: 10px; font-size: 20px; }
	.dct-pg .dct-cdrawer-in { padding: 0 10px 10px; }
	.dct-cr-share { grid-template-columns: minmax(0, 1fr); padding: 20px; }
	.dct-cr-btns { flex-direction: row; flex-wrap: wrap; min-width: 0; }
	.dct-cr-b { flex: 1 1 40%; width: auto; }
	.dct-cr-rules { grid-template-columns: minmax(0, 1fr); }
	.dct-pg-steps { gap: 6px; }
	.dct-pg-steps li { flex-direction: column; gap: 5px; padding: 10px 4px; text-align: center; font-size: 13px; }
	.dct-pg-calls .dct-book { padding: 18px; }
	.dct-pg-calls .dct-kinds { grid-template-columns: minmax(0, 1fr); }
}
/* ---------- My account ---------- */
.dct-ac-hero { justify-content: flex-start; gap: 22px; }
.dct-ac-av { flex: none; display: grid; place-items: center; width: 92px; height: 92px; border-radius: 50%; font-size: 40px; font-weight: 800; color: #fff; background: rgba(255, 255, 255, .2); box-shadow: 0 0 0 3px rgba(255, 255, 255, .4); }
.dct-ac-note { margin: 0 0 14px !important; padding: 11px 15px; border-radius: 13px; font-size: 15px; font-weight: 600; }
.dct-ac-note.is-ok { background: #ECFDF5; color: #047857; }
.dct-ac-note.is-bad { background: #FEF2F2; color: #B91C1C; }
.dct-ac-card { margin: 0 0 16px; padding: 22px; border-radius: 20px; background: #fff; box-shadow: var(--dct-shadow); }
.dct-ac-card h2 { margin: 0 0 6px !important; font-size: 21px !important; letter-spacing: -.02em; }
.dct-ac-hint { margin: 0 0 14px !important; font-size: 14.5px; line-height: 1.5; color: #6B7090; }
.dct-ac-small { margin: 12px 0 0 !important; font-size: 13px; color: #8A8FA8; }
.dct-ac-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.dct-ac-form label { display: block; min-width: 0; font-size: 14px; font-weight: 700; color: var(--dct-ink); }
.dct-ac-form label em { font-style: normal; color: #DC2626; display: inline; }
.dct-ac-form label span { font-weight: 500; color: #8A8FA8; display: inline; }
.dct-ac-form small { display: block; margin-top: 5px; font-weight: 500; font-size: 12.5px; color: #8A8FA8; }
.dct-ac-form input { display: block; margin-top: 6px; width: 100%; box-sizing: border-box; min-height: 46px; padding: 10px 14px; border: 1px solid #E3E1F7; border-radius: 13px; background: #F9F8FF; font: inherit; font-size: 16px; font-weight: 500; }
.dct-ac-form input:focus { outline: 0; border-color: #A5B4FC; background: #fff; box-shadow: 0 0 0 3px rgba(165, 180, 252, .3); }
.dct-ac-form input:disabled { color: #6B7090; background: #F1F1F6; }
.dct-ac-form .dct-pg-btn { grid-column: 1 / -1; justify-self: start; border: 0; font: inherit; font-weight: 700; cursor: pointer; }
.dct-ac-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.dct-ac-links a { display: flex; align-items: center; gap: 10px; padding: 13px 14px; border-radius: 14px; background: #F7F6FF; color: var(--dct-ink) !important; text-decoration: none !important; }
.dct-ac-links a:hover { background: #EEEDFD; }
.dct-ac-links b { flex: 1; min-width: 0; font-size: 15px; font-weight: 600; }
.dct-ac-links i { font-style: normal; font-size: 20px; color: #8A8FA8; }
.dct-ac-pay { list-style: none; margin: 10px 0 0; padding: 0; }
.dct-ac-pay li { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 0; border-bottom: 1px solid #EFEEF9; }
.dct-ac-pay li:last-child { border-bottom: 0; }
.dct-ac-pay div { min-width: 0; }
.dct-ac-pay b { display: block; font-size: 15px; font-weight: 600; }
.dct-ac-pay small { font-size: 13px; color: #8A8FA8; }
.dct-ac-pay strong { flex: none; color: #047857; }
.dct-ac-logout { display: block; margin: 4px 0 0; padding: 14px; border-radius: 14px; text-align: center; font-weight: 700; color: #B91C1C !important; text-decoration: none !important; background: #fff; border: 1.5px solid #FECACA; }
.dct-ac-logout:hover { background: #FEF2F2; }
@media (max-width: 640px) {
	.dct-pg-account { margin-bottom: 96px !important; }
	.dct-ac-hero { flex-direction: column; align-items: flex-start; gap: 12px; }
	.dct-ac-av { width: 66px; height: 66px; font-size: 28px; }
	.dct-ac-card { padding: 18px 16px; }
	.dct-ac-form, .dct-ac-links { grid-template-columns: minmax(0, 1fr); }
	.dct-ac-form .dct-pg-btn { justify-self: stretch; text-align: center; }
}

/* ---------- Group chat: messaging-app look ---------- */
.dct-chat-wrap { background: #fff; }
@media (min-width: 782px) {
	.dct-chat-wrap { position: fixed; left: 0; right: 0; z-index: 900; width: min(820px, calc(100vw - 32px)); max-width: none; min-height: 0; margin: 0 auto; border: 1px solid #E6E4FA; border-radius: 22px; box-shadow: 0 20px 48px rgba(79, 70, 229, .13); }
	/* The chat is pinned to the window on PCs too, so the page behind must not scroll. */
	html.dct-in-chat, html.dct-in-chat body { overflow: hidden !important; height: 100%; }
	html.dct-in-chat .dct-ft, html.dct-in-chat h1.wp-block-post-title { display: none !important; }
}
@media (min-width: 782px) and (max-width: 1179px) {
	html.dct-in-chat .dct-wa { display: none !important; } /* no room beside the chat, it would cover Send */
}
.dct-chat-head { gap: 10px; padding: 10px 14px 10px 10px; border: 0; color: #fff; background: linear-gradient(120deg, var(--dct-primary, #4F46E5), var(--dct-violet, #7C3AED)); flex: none; }
.dct-chat-head .dct-chat-back { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; font-size: 20px; line-height: 1; color: #fff !important; }
.dct-chat-head .dct-chat-back:active, .dct-chat-head .dct-chat-back:hover { background: rgba(255, 255, 255, .18); }
.dct-chat-av { flex: none; width: 42px; height: 42px; border-radius: 50%; object-fit: cover; display: grid; place-items: center; background: rgba(255, 255, 255, .22); color: #fff; font-weight: 800; font-size: 18px; box-shadow: 0 0 0 2px rgba(255, 255, 255, .35); }
.dct-chat-head strong { font-size: 16px; font-weight: 700; color: #fff; line-height: 1.25; }
.dct-chat-head .dct-muted { font-size: 12px; color: rgba(255, 255, 255, .82); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dct-pinned { flex: none; align-items: center; max-height: none; overflow: visible; padding: 7px 14px; font-size: 13.5px; line-height: 1.4; color: #5F4B12; background: #FFF9E8; border-bottom: 1px solid #F8E9B8; cursor: pointer; }
.dct-pinned #dct-pinned-text { min-width: 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; }
.dct-pinned.is-open #dct-pinned-text { display: block; max-height: 34vh; overflow-y: auto; }
.dct-chat-box { position: relative; flex: 1; min-height: 0; display: flex; }
.dct-chat { flex: 1; min-width: 0; gap: 0; padding: 12px 12px 14px; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; background-color: #F3F2FE; background-image: radial-gradient(rgba(79, 70, 229, .08) 1px, transparent 1px); background-size: 18px 18px; }
.dct-chat #dct-older { padding: 6px 14px; border-radius: 999px; background: #fff; font-size: 13px; font-weight: 600; box-shadow: 0 1px 3px rgba(30, 34, 53, .12); }
.dct-day { align-self: center; margin: 12px 0 2px; padding: 4px 12px; border-radius: 999px; background: rgba(255, 255, 255, .92); color: #5B5F7C; font-size: 12px; font-weight: 600; box-shadow: 0 1px 2px rgba(30, 34, 53, .08); }
.dct-m { max-width: 84%; margin-top: 10px; flex: none; }
.dct-m.is-cont { margin-top: 3px; }
.dct-mb { border: 0; border-radius: 17px 17px 17px 5px; padding: 7px 12px 5px; background: #fff; box-shadow: 0 1px 2px rgba(30, 34, 53, .1); }
.dct-m.is-cont .dct-mb { border-radius: 6px 17px 17px 6px; }
.dct-m.is-cont .dct-mn { display: none; }
.dct-m.is-mine .dct-mb { border: 0; border-radius: 17px 17px 5px 17px; color: #fff; background: linear-gradient(135deg, #5B52EE, var(--dct-violet, #7C3AED)); box-shadow: 0 3px 10px rgba(79, 70, 229, .26); }
.dct-m.is-mine.is-cont .dct-mb { border-radius: 17px 6px 6px 17px; }
.dct-m.is-mine .dct-mt, .dct-m.is-mine .dct-mt a { color: #fff !important; }
.dct-m.is-mine .dct-mtime { color: rgba(255, 255, 255, .76); }
.dct-m.is-mentor .dct-mb { border: 0; background: #FFF7FC; box-shadow: 0 1px 3px rgba(190, 24, 93, .18), inset 3px 0 0 #EC4899; }
.dct-mn { margin-bottom: 1px; font-size: 13px; font-weight: 700; }
.dct-mn em { margin-left: 6px; padding: 1px 7px; border-radius: 999px; background: #FCE7F3; color: #BE185D; font-size: 10.5px; font-style: normal; font-weight: 700; vertical-align: 1px; }
.dct-mt { font-size: 15px; line-height: 1.42; }
.dct-mtime { margin-top: 1px; font-size: 10.5px; color: #8A8FA8; }
.dct-mmenu { align-self: center; color: #A3A7C2; opacity: .7; }
.dct-new { position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%); z-index: 4; border: 0; border-radius: 999px; padding: 8px 16px; background: var(--dct-primary, #4F46E5); color: #fff; font: inherit; font-size: 13px; font-weight: 700; white-space: nowrap; cursor: pointer; box-shadow: 0 8px 20px rgba(79, 70, 229, .4); }
.dct-new[hidden] { display: none; }
.dct-chat-note { flex: none; padding: 8px 14px; text-align: center; font-size: 13.5px; background: #EEF0FF; color: #3F3A9E; }
.dct-chat-note.is-bad { background: #FEF2F2; color: #991B1B; }
.dct-send { flex: none; align-items: flex-end; gap: 8px; padding: 8px 10px; border-top: 1px solid #EDEBFA; background: #fff; }
.dct-send[hidden] { display: none; }
.dct-send textarea { min-width: 0; min-height: 44px; max-height: 120px; padding: 10px 16px; border: 1px solid #E3E1F7; border-radius: 22px; background: #F7F6FF; font-size: 16px; line-height: 1.35; outline: 0; box-sizing: border-box; }
.dct-send textarea:focus { border-color: #A5B4FC; background: #fff; box-shadow: 0 0 0 3px rgba(165, 180, 252, .3); }
.dct-sendbtn { flex: none; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; color: #fff; cursor: pointer; background: linear-gradient(135deg, var(--dct-primary, #4F46E5), var(--dct-violet, #7C3AED)); box-shadow: 0 6px 14px rgba(79, 70, 229, .32); transition: transform .15s, opacity .15s; }
.dct-sendbtn:active { transform: scale(.92); }
.dct-sendbtn:disabled { opacity: .45; box-shadow: none; cursor: default; }
.dct-send.is-busy .dct-sendbtn { animation: dct-send-busy .8s ease-in-out infinite alternate; }
@keyframes dct-send-busy { to { opacity: .3; } }
.dct-clip { flex: none; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #6B6FA3; cursor: pointer; }
.dct-clip:hover, .dct-clip:active { background: #EEEDFD; color: var(--dct-primary, #4F46E5); }
.dct-attach { flex: none; display: flex; align-items: center; gap: 10px; padding: 8px 12px; background: #F7F6FF; border-top: 1px solid #EDEBFA; font-size: 13px; color: #5B5F7C; }
.dct-attach[hidden] { display: none; }
.dct-attach img { flex: none; width: 54px; height: 54px; object-fit: cover; border-radius: 10px; background: #fff; box-shadow: 0 1px 3px rgba(30, 34, 53, .18); }
.dct-attach span { flex: 1; min-width: 0; line-height: 1.3; }
.dct-attach button { flex: none; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: #E7E5FB; color: #3F3A9E; font-size: 19px; line-height: 1; cursor: pointer; }
.dct-mimg { display: block; width: min(260px, 60vw); max-height: 340px; margin: 3px 0 5px; padding: 0; border: 0; border-radius: 12px; overflow: hidden; background: rgba(79, 70, 229, .08); cursor: zoom-in; }
.dct-mimg img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dct-view { position: fixed; inset: 0; z-index: 2000; display: flex; align-items: center; justify-content: center; padding: 12px; box-sizing: border-box; background: rgba(15, 16, 32, .94); }
.dct-view img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 6px; }
.dct-view-x { position: absolute; top: 12px; right: 12px; width: 42px; height: 42px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .18); color: #fff; font-size: 24px; line-height: 1; cursor: pointer; }
@media (max-width: 781px) {
	/* Full-screen chat: the page behind must not scroll, and the chat's own header replaces the site's. */
	html.dct-in-chat, html.dct-in-chat body { overflow: hidden !important; height: 100%; }
	html.dct-in-chat header.wp-block-template-part { display: none !important; }
	.dct-chat-wrap { max-width: none; }
}
/* the theme's empty space above the banners */
body:has(.dct-pg) main.wp-block-group, body:has(.dct-pg) main .wp-block-group, body:has(.dct-pg) main .entry-content, body:has(.dct-gl) main.wp-block-group, body:has(.dct-gl) main .wp-block-group, body:has(.dct-gl) main .entry-content { margin-top: 0 !important; padding-top: 0 !important; }