.ulak-uh-quiz-link { gap: 6px !important; } .t101-nav-qdot { width: 8px; height: 8px; border-radius: 50%; background: #f59e0b; box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.22); display: inline-block; flex-shrink: 0; } @media (max-width: 991px) { #cm-mobile-header-row #cm-mobile-menu li.t101-mob-quiz-item { grid-column: 1 / -1 !important; margin-top: 2px !important; } #cm-mobile-header-row #cm-mobile-menu li.t101-mob-quiz-item > a { background: linear-gradient(135deg, rgba(245, 158, 11, 0.22) 0%, rgba(15, 23, 42, 0.92) 100%) !important; border: 1px solid rgba(245, 158, 11, 0.5) !important; color: #ffffff !important; } } body.page.t101-quizzes-page:not(.home) #cm-secondary, body.t101-quizzes-page #cm-secondary, body.t101-quizzes-page #secondary, body.t101-quizzes-page article.page > header.cm-entry-header, body.t101-quizzes-page .cm-entry-header { display: none !important; } body.page.t101-quizzes-page:not(.home) #cm-primary, body.page.t101-quizzes-page:not(.home) .cm-content .cm-row, body.t101-quizzes-page #cm-primary, body.t101-quizzes-page #primary, body.t101-quizzes-page .cm-content .cm-row, body.t101-quizzes-page #main, body.t101-quizzes-page .cm-posts, body.t101-quizzes-page article.page, body.t101-quizzes-page article.page .cm-post-content, body.t101-quizzes-page article.page .cm-entry-summary { display: block !important; width: 100% !important; max-width: 1140px !important; flex: 1 1 100% !important; margin: 0 auto !important; padding: 0 !important; background: transparent !important; border: none !important; box-shadow: none !important; box-sizing: border-box !important; } body.t101-quizzes-page #cm-content { padding-top: 14px !important; padding-bottom: 38px !important; } .t101-qhub-wrap { width: 100%; box-sizing: border-box; } .t101-qhub-hero { background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%); border: 1px solid #e2e8f0; border-radius: 18px; padding: 18px 22px; margin-bottom: 20px; box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04); } .t101-qhub-hero-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; } .t101-qhub-bc { font-size: 12.5px; font-weight: 600; color: #64748b; margin-bottom: 6px; display: flex; align-items: center; gap: 6px; } .t101-qhub-bc a { color: #0f172a !important; text-decoration: none !important; font-weight: 700; } .t101-qhub-title { margin: 0 0 8px 0 !important; font-size: 27px !important; font-weight: 900 !important; letter-spacing: -0.5px !important; color: #0f172a !important; display: flex; align-items: center; gap: 10px; line-height: 1.2 !important; } .t101-qhub-dot { width: 12px; height: 12px; border-radius: 50%; background: #e11d2e; box-shadow: 0 0 0 4px rgba(225, 29, 46, 0.16); flex-shrink: 0; } .t101-qhub-lead { margin: 0 !important; font-size: 14.5px; line-height: 1.6; color: #475569; max-width: 680px; } .t101-qhub-rules-pill { display: inline-flex; align-items: center; gap: 6px; padding: 9px 15px; border-radius: 999px; background: #fef3c7; border: 1px solid #fde68a; color: #92400e !important; font-size: 12.5px; font-weight: 800; text-decoration: none !important; white-space: nowrap; } .t101-qhub-userbar { margin-top: 18px; padding: 14px 18px; border-radius: 16px; background: #0f172a; color: #f8fafc; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; } .t101-qhub-ub-left { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; } .t101-qhub-ub-stat span { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: 0.7px; color: #94a3b8; } .t101-qhub-ub-stat strong { font-size: 17px; font-weight: 900; color: #ffffff; } .t101-qhub-ub-right { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; } .t101-qhub-ub-hint { font-size: 13px; color: #cbd5e1; } .t101-qhub-ub-hint strong { color: #fbbf24; } .t101-qhub-ub-link { padding: 8px 14px; border-radius: 999px; background: rgba(255, 255, 255, 0.1); color: #ffffff !important; font-size: 12.5px; font-weight: 800; text-decoration: none !important; } .t101-qhub-ub-link:hover { background: #e11d2e; } .t101-qhub-guestbar { margin-top: 18px; padding: 16px 18px; border-radius: 16px; background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%); border: 1px solid rgba(225, 29, 46, 0.35); color: #f8fafc; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; } .t101-qhub-gb-txt { flex: 1 1 320px; } .t101-qhub-lock-pill { display: inline-block; padding: 3px 10px; border-radius: 999px; background: rgba(225, 29, 46, 0.22); border: 1px solid rgba(244, 63, 94, 0.45); color: #fda4af; font-size: 11.5px; font-weight: 800; margin-bottom: 6px; } .t101-qhub-gb-txt p { margin: 0 !important; font-size: 13.5px; line-height: 1.55; color: #cbd5e1; } .t101-qhub-gb-btns { display: flex; gap: 10px; flex-wrap: wrap; } .t101-qbtn-primary { padding: 10px 18px; border-radius: 12px; border: none; background: #e11d2e; color: #ffffff !important; font-size: 13.5px; font-weight: 800; cursor: pointer; } .t101-qbtn-ghost { padding: 10px 16px; border-radius: 12px; border: 1px solid rgba(255, 255, 255, 0.25); background: rgba(255, 255, 255, 0.06); color: #ffffff !important; font-size: 13.5px; font-weight: 800; cursor: pointer; } .t101-qhub-sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; } .t101-qhub-sec-head h2 { margin: 0 !important; font-size: 20px !important; font-weight: 900 !important; color: #0f172a !important; } .t101-qhub-sec-head span { font-size: 12.5px; color: #64748b; font-weight: 600; } .t101-qhub-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; } .t101-qcard { background: #ffffff; border: 1.5px solid #e2e8f0; border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 8px 22px rgba(15, 23, 42, 0.05); transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; } .t101-qcard:hover { transform: translateY(-2px); box-shadow: 0 14px 28px rgba(15, 23, 42, 0.09); } .t101-qcard.is-solved-card { border-color: #86efac; } .t101-qcard-media { position: relative; aspect-ratio: 16 / 8.8; background: #0f172a; overflow: hidden; flex-shrink: 0; } .t101-qcard-img-wrap { position: relative; width: 100%; height: 100%; overflow: hidden; } .t101-qcard-cover-img { width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; object-position: center; display: block; margin: 0 !important; border-radius: 0 !important; transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1); } .t101-qcard:hover .t101-qcard-cover-img { transform: scale(1.045); } .t101-qcard-media-shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient( 180deg, rgba(2, 6, 23, 0.56) 0%, rgba(2, 6, 23, 0.06) 34%, rgba(2, 6, 23, 0.08) 62%, rgba(2, 6, 23, 0.78) 100% ); } .t101-qcard-svg-wrap, .t101-qcard-svg-wrap svg { width: 100%; height: 100%; display: block; object-fit: cover; } .t101-qcard-top-pills { position: absolute; top: 9px; left: 10px; right: 10px; z-index: 2; display: flex; justify-content: space-between; align-items: center; gap: 6px; flex-wrap: nowrap; } .t101-qcard-cat { padding: 3px 9px; border-radius: 999px; background: rgba(15, 23, 42, 0.84); backdrop-filter: blur(6px); color: #f8fafc; font-size: 10.5px; font-weight: 800; border: 1px solid rgba(255, 255, 255, 0.14); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .t101-qcard-badge { padding: 3px 9px; border-radius: 999px; font-size: 10.5px; font-weight: 800; white-space: nowrap; flex-shrink: 0; } .t101-qcard-badge.is-locked { background: rgba(225, 29, 46, 0.92); color: #ffffff; } .t101-qcard-badge.is-ready { background: #fbbf24; color: #78350f; box-shadow: 0 4px 12px rgba(251, 191, 36, 0.35); } .t101-qcard-badge.is-solved { background: #16a34a; color: #ffffff; box-shadow: 0 4px 12px rgba(22, 163, 74, 0.35); } .t101-qcard-bottom-pills { position: absolute; bottom: 8px; left: 10px; right: 10px; z-index: 2; display: flex; gap: 5px; flex-wrap: wrap; } .t101-qcard-bottom-pills span { padding: 2px 7px; border-radius: 6px; background: rgba(15, 23, 42, 0.86); backdrop-filter: blur(4px); color: #f1f5f9; font-size: 10.5px; font-weight: 700; white-space: nowrap; } .t101-qcard-bottom-pills span.is-gold { color: #fde68a; border: 1px solid rgba(251, 191, 36, 0.4); } .t101-qcard-body { padding: 14px 15px 15px; display: flex; flex-direction: column; flex: 1; gap: 8px; } .t101-qcard-title { margin: 0 !important; font-size: 16.5px !important; font-weight: 900 !important; color: #0f172a !important; line-height: 1.32 !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.64em; } .t101-qcard-desc { margin: 0 !important; font-size: 12.8px; line-height: 1.48; color: #475569; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.96em; } .t101-qcard-dynamic-slot { margin-top: 2px; } .t101-qcard-meta-strip { height: 42px; padding: 0 10px; border-radius: 10px; background: #f8fafc; border: 1px solid #e2e8f0; display: flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; color: #475569; white-space: nowrap; overflow: hidden; } .t101-qcard-meta-strip strong { color: #b45309; font-weight: 900; } .t101-qcard-ms-sep { opacity: 0.45; } .t101-qcard-solved-summary { height: 42px; padding: 0 10px; border-radius: 10px; background: #f0fdf4; border: 1px solid #bbf7d0; display: flex; align-items: center; gap: 8px; overflow: hidden; } .t101-qcard-ss-emblem { width: 26px; height: 26px; border-radius: 7px; overflow: hidden; flex-shrink: 0; } .t101-qcard-ss-emblem svg { width: 100%; height: 100%; display: block; } .t101-qcard-ss-info { flex: 1; min-width: 0; line-height: 1.2; } .t101-qcard-ss-info strong { display: block; font-size: 12px; font-weight: 800; color: #0f172a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .t101-qcard-ss-info small { display: block; font-size: 10.5px; font-weight: 600; color: #64748b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px; } .t101-qcard-ss-pts { padding: 2px 7px; border-radius: 999px; background: rgba(22, 163, 74, 0.16); color: #15803d; font-size: 10.5px; font-weight: 900; flex-shrink: 0; } .t101-qcard-foot { margin-top: auto; padding-top: 2px; } .t101-qcard-cta { width: 100%; min-height: 40px !important; height: 40px !important; padding: 0 13px !important; margin: 0 !important; border-radius: 11px !important; border: none; display: inline-flex !important; align-items: center !important; justify-content: space-between; gap: 8px; font-size: 13px !important; line-height: 1.15 !important; font-weight: 900 !important; box-sizing: border-box !important; cursor: pointer; transition: transform 0.15s ease, background 0.18s ease; } .t101-qcard-cta.is-start { background: linear-gradient(135deg, #e11d2e 0%, #be123c 100%); color: #ffffff; box-shadow: 0 6px 16px rgba(225, 29, 46, 0.25); } .t101-qcard-cta.is-start:hover { transform: translateY(-1px); } .t101-qcard-cta.is-guest { background: #0f172a; color: #ffffff; } .t101-qcard-pts-chip { padding: 3px 8px; border-radius: 999px; background: rgba(255, 255, 255, 0.2); font-size: 11px; font-weight: 900; white-space: nowrap; } .t101-qcard-solved-actions { display: flex; gap: 7px; align-items: center; width: 100%; box-sizing: border-box; } .t101-qcard-cta.is-done { width: auto !important; flex: 1 1 0% !important; min-width: 0 !important; padding: 0 10px !important; font-size: 12px !important; line-height: 1 !important; justify-content: center !important; background: #dcfce7 !important; border: 1.5px solid #86efac !important; color: #15803d !important; cursor: not-allowed !important; font-weight: 800 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } .t101-qcard-view-res-btn { width: auto !important; flex: 0 0 auto !important; height: 40px !important; min-height: 40px !important; padding: 0 11px !important; margin: 0 !important; border-radius: 11px !important; border: 1.5px solid #cbd5e1 !important; background: #f8fafc; color: #0f172a; font-size: 12px !important; line-height: 1 !important; font-weight: 800 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; box-sizing: border-box !important; cursor: pointer; white-space: nowrap !important; } .t101-qcard-view-res-btn:hover { border-color: #0f172a; } .t101-quiz-stage { margin-bottom: 28px; background: #ffffff; border: 2px solid #0f172a; border-radius: 24px; overflow: hidden; box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12); } .t101-qplayer-top { background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%); padding: 18px 24px 16px; color: #ffffff; } .t101-qplayer-head-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; } .t101-qplayer-title-wrap { display: flex; align-items: center; gap: 10px; min-width: 0; } .t101-qplayer-title-wrap strong { font-size: 17px; font-weight: 900; color: #ffffff; } .t101-qplayer-reward { padding: 3px 10px; border-radius: 999px; background: rgba(251, 191, 36, 0.2); border: 1px solid rgba(251, 191, 36, 0.45); color: #fde68a; font-size: 11.5px; font-weight: 800; white-space: nowrap; } .t101-qplayer-close { padding: 6px 12px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.08); color: #cbd5e1; font-size: 12px; font-weight: 700; cursor: pointer; } .t101-qplayer-steps-row { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; } .t101-qstep-pill { height: 30px; border-radius: 9px; border: 1px solid rgba(255, 255, 255, 0.14); background: rgba(255, 255, 255, 0.06); color: #94a3b8; font-size: 12px; font-weight: 800; display: flex; align-items: center; justify-content: center; gap: 4px; transition: all 0.2s ease; } .t101-qstep-pill.is-done { background: rgba(22, 163, 74, 0.25); border-color: rgba(74, 222, 128, 0.55); color: #86efac; } .t101-qstep-pill.is-active { background: #e11d2e; border-color: #fb7185; color: #ffffff; transform: translateY(-1px); } .t101-qplayer-prog-bar { height: 7px; border-radius: 999px; background: rgba(255, 255, 255, 0.12); overflow: hidden; } .t101-qplayer-prog-fill { height: 100%; border-radius: 999px; background: linear-gradient(90deg, #f59e0b 0%, #e11d2e 100%); transition: width 0.32s cubic-bezier(0.4, 0, 0.2, 1); } .t101-qplayer-body { padding: 26px 26px 24px; } .t101-qplayer-kicker { display: inline-block; padding: 4px 11px; border-radius: 999px; background: #ffe4e6; color: #be123c; font-size: 11.5px; font-weight: 900; letter-spacing: 0.6px; margin-bottom: 10px; } .t101-qplayer-question { margin: 0 0 20px 0 !important; font-size: 22px !important; font-weight: 900 !important; line-height: 1.38 !important; color: #0f172a !important; } .t101-qoptions-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } @media (min-width: 640px) { .t101-qoptions-grid > .t101-qopt-card:nth-child(5):last-child { grid-column: 1 / -1; } } .t101-qopt-card { text-align: left; padding: 16px 18px; border-radius: 16px; border: 2px solid #e2e8f0; background: #f8fafc; cursor: pointer; display: flex; align-items: flex-start; gap: 13px; transition: all 0.18s ease; position: relative; } .t101-qopt-card:hover { border-color: #94a3b8; background: #ffffff; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(15, 23, 42, 0.07); } .t101-qopt-card.is-selected { border-color: #e11d2e !important; background: #fff1f2 !important; box-shadow: 0 8px 22px rgba(225, 29, 46, 0.14); } .t101-qopt-icon { width: 44px; height: 44px; border-radius: 12px; background: #ffffff; border: 1px solid #e2e8f0; display: flex; align-items: center; justify-content: center; font-size: 22px; flex-shrink: 0; } .t101-qopt-card.is-selected .t101-qopt-icon { background: #e11d2e; border-color: #e11d2e; } .t101-qopt-content { flex: 1; min-width: 0; } .t101-qopt-head { display: flex; align-items: center; gap: 7px; margin-bottom: 4px; } .t101-qopt-code { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 6px; background: #e2e8f0; color: #334155; font-size: 11.5px; font-weight: 900; flex-shrink: 0; } .t101-qopt-card.is-selected .t101-qopt-code { background: #e11d2e; color: #ffffff; } .t101-qopt-title { font-size: 15px; font-weight: 900; color: #0f172a; line-height: 1.3; } .t101-qopt-detail { display: block; font-size: 13px; line-height: 1.5; color: #475569; } .t101-qplayer-nav { margin-top: 22px; padding-top: 16px; border-top: 1px solid #e2e8f0; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; } .t101-qnav-prev { padding: 10px 16px; border-radius: 12px; border: 1.5px solid #cbd5e1; background: #ffffff; color: #334155; font-size: 13.5px; font-weight: 800; cursor: pointer; } .t101-qnav-prev:disabled { opacity: 0.4; cursor: not-allowed; } .t101-qnav-next, .t101-qnav-finish { padding: 12px 22px; border-radius: 13px; border: none; font-size: 14.5px; font-weight: 900; cursor: pointer; transition: all 0.18s ease; } .t101-qnav-next { background: #0f172a; color: #ffffff; } .t101-qnav-finish { background: linear-gradient(135deg, #16a34a 0%, #15803d 100%); color: #ffffff; box-shadow: 0 8px 22px rgba(22, 163, 74, 0.3); } .t101-qnav-next:disabled, .t101-qnav-finish:disabled { opacity: 0.45; cursor: not-allowed; box-shadow: none; } .t101-qresult-wrap { padding: 28px 26px; } .t101-qresult-banner { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 13px 18px; border-radius: 14px; background: #f0fdf4; border: 1.5px solid #86efac; color: #166534; font-size: 13.5px; font-weight: 800; margin-bottom: 18px; } .t101-qresult-levelup { margin-bottom: 18px; padding: 14px 18px; border-radius: 14px; background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%); border: 1.5px solid #f59e0b; color: #78350f; font-size: 14px; font-weight: 900; } .t101-qresult-main { display: grid; grid-template-columns: 120px 1fr; gap: 22px; align-items: start; padding: 22px; border-radius: 20px; background: #f8fafc; border: 1px solid #e2e8f0; } .t101-qresult-emblem { width: 120px; height: 120px; border-radius: 26px; overflow: hidden; box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16); } .t101-qresult-emblem svg { width: 100%; height: 100%; display: block; } .t101-qresult-kicker { display: inline-block; font-size: 11.5px; font-weight: 900; letter-spacing: 0.7px; color: #e11d2e; margin-bottom: 4px; } .t101-qresult-name { margin: 0 0 4px 0 !important; font-size: 28px !important; font-weight: 900 !important; color: #0f172a !important; line-height: 1.15 !important; } .t101-qresult-epithet { font-size: 15px; font-weight: 800; color: #475569; margin-bottom: 12px; } .t101-qresult-motto { margin: 0 0 12px 0 !important; padding: 10px 14px; border-left: 4px solid #e11d2e; background: #ffffff; border-radius: 0 10px 10px 0; font-style: italic; font-weight: 700; font-size: 13.5px; color: #1e293b; } .t101-qresult-desc { margin: 0 0 14px 0 !important; font-size: 14.5px; line-height: 1.68; color: #334155; } .t101-qresult-traits { display: flex; gap: 8px; flex-wrap: wrap; } .t101-qresult-trait { padding: 5px 12px; border-radius: 999px; background: #e2e8f0; color: #0f172a; font-size: 12px; font-weight: 800; } .t101-qresult-foot { margin-top: 20px; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; } .t101-qresult-locked-note { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px; background: #dcfce7; color: #15803d; font-size: 13px; font-weight: 900; } .t101-qresult-links { display: flex; gap: 10px; flex-wrap: wrap; } .t101-qresult-acc-btn { padding: 10px 18px; border-radius: 12px; background: #0f172a; color: #ffffff !important; font-size: 13.5px; font-weight: 800; text-decoration: none !important; } .t101-qhub-upcoming { margin-top: 24px; } .t101-qhub-up-card { display: flex; align-items: center; gap: 16px; padding: 20px 22px; border-radius: 18px; background: #f8fafc; border: 1px dashed #cbd5e1; } .t101-qhub-up-ico { font-size: 32px; flex-shrink: 0; } .t101-qhub-up-body h3 { margin: 0 0 4px 0 !important; font-size: 16px !important; font-weight: 900 !important; color: #0f172a !important; } .t101-qhub-up-body p { margin: 0 !important; font-size: 13.5px; line-height: 1.58; color: #475569; } html[data-theme="dark"] .t101-qhub-hero, html[data-theme="dark"] .t101-qcard, html[data-theme="dark"] .t101-quiz-stage, html[data-theme="dark"] .t101-qhub-up-card { background: #0f172a; border-color: #1e293b; } html[data-theme="dark"] .t101-qcard.is-solved-card { border-color: rgba(34, 197, 94, 0.55); } html[data-theme="dark"] .t101-qhub-bc a, html[data-theme="dark"] .t101-qhub-title, html[data-theme="dark"] .t101-qhub-sec-head h2, html[data-theme="dark"] .t101-qcard-title, html[data-theme="dark"] .t101-qplayer-question, html[data-theme="dark"] .t101-qopt-title, html[data-theme="dark"] .t101-qresult-name, html[data-theme="dark"] .t101-qhub-up-body h3 { color: #f8fafc !important; } html[data-theme="dark"] .t101-qhub-lead, html[data-theme="dark"] .t101-qcard-desc, html[data-theme="dark"] .t101-qopt-detail, html[data-theme="dark"] .t101-qresult-desc, html[data-theme="dark"] .t101-qresult-epithet, html[data-theme="dark"] .t101-qhub-up-body p { color: #94a3b8 !important; } html[data-theme="dark"] .t101-qhub-userbar { background: #182338; border: 1px solid #334155; } html[data-theme="dark"] .t101-qopt-card { background: #182338; border-color: #334155; } html[data-theme="dark"] .t101-qopt-card:hover { border-color: #64748b; } html[data-theme="dark"] .t101-qopt-card.is-selected { background: rgba(225, 29, 46, 0.16) !important; border-color: #fb7185 !important; } html[data-theme="dark"] .t101-qopt-icon, html[data-theme="dark"] .t101-qnav-prev, html[data-theme="dark"] .t101-qcard-view-res-btn { background: #0f172a !important; border-color: #334155 !important; color: #f8fafc !important; } html[data-theme="dark"] .t101-qcard-view-res-btn:hover { border-color: #64748b !important; } html[data-theme="dark"] .t101-qcard-meta-strip { background: #182338; border-color: #334155; color: #94a3b8; } html[data-theme="dark"] .t101-qcard-meta-strip strong { color: #fbbf24; } html[data-theme="dark"] .t101-qcard-solved-summary { background: rgba(22, 163, 74, 0.14); border-color: rgba(34, 197, 94, 0.35); } html[data-theme="dark"] .t101-qcard-ss-info strong { color: #f8fafc; } html[data-theme="dark"] .t101-qcard-ss-info small { color: #94a3b8; } html[data-theme="dark"] .t101-qcard-ss-pts { background: rgba(34, 197, 94, 0.22); color: #86efac; } html[data-theme="dark"] .t101-qcard-cta.is-done { background: rgba(22, 163, 74, 0.2) !important; border-color: rgba(74, 222, 128, 0.45) !important; color: #86efac !important; } html[data-theme="dark"] .t101-qresult-main { background: #182338; border-color: #334155; } html[data-theme="dark"] .t101-qresult-motto { background: #0f172a; color: #e2e8f0; } html[data-theme="dark"] .t101-qresult-trait { background: #0f172a; color: #e2e8f0; } html[data-theme="dark"] .t101-qplayer-nav { border-color: #1e293b; } @media (max-width: 991px) { .t101-qhub-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } } @media (max-width: 639px) { .t101-qhub-hero { padding: 16px 15px; border-radius: 16px; } .t101-qhub-title { font-size: 20px !important; } .t101-qhub-grid { grid-template-columns: 1fr; gap: 13px; } .t101-qcard-title { min-height: 0; } .t101-qcard-desc { min-height: 0; } .t101-qoptions-grid { grid-template-columns: 1fr; gap: 10px; } .t101-qplayer-top { padding: 15px 16px 14px; } .t101-qplayer-body, .t101-qresult-wrap { padding: 18px 16px; } .t101-qplayer-question { font-size: 18.5px !important; } .t101-qstep-pill { font-size: 11px; height: 27px; } .t101-qresult-main { grid-template-columns: 1fr; padding: 16px; gap: 14px; } .t101-qresult-emblem { width: 88px; height: 88px; border-radius: 20px; } .t101-qresult-name { font-size: 23px !important; } .t101-qhub-up-card { flex-direction: column; align-items: flex-start; } }