/* Daily Brain Club puzzle player – large, high-contrast, touch friendly */
.dbc-puzzle {
	--dbc-ink: #1b2533;
	--dbc-blue: #1d4e89;
	--dbc-blue-soft: #e8f0fa;
	--dbc-line: #c9d3e0;
	--dbc-right: #17693a;
	--dbc-right-bg: #e3f4e8;
	--dbc-wrong: #a4271c;
	--dbc-wrong-bg: #fbe9e7;
	--dbc-hint-bg: #fff6dc;
	margin: 1.75em 0;
	padding: 1.25em 1.25em 1.5em;
	border: 2px solid var(--dbc-line);
	border-radius: 14px;
	background: #fbfcfe;
	color: var(--dbc-ink);
	font-size: 1.1rem;
	line-height: 1.5;
}
.dbc-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5em; margin-bottom: 1em; }
.dbc-badge { background: var(--dbc-blue); color: #fff; font-weight: 700; padding: .3em .8em; border-radius: 999px; font-size: .95rem; letter-spacing: .02em; }
.dbc-score { font-weight: 700; color: var(--dbc-blue); }
.dbc-instructions { font-size: 1.05rem; margin: 0 0 1em; }
.dbc-items { margin: 0; padding: 0; list-style: none; counter-reset: dbc; }
.dbc-item { counter-increment: dbc; margin: 0 0 1.25em; padding: 1em; background: #fff; border: 1px solid var(--dbc-line); border-radius: 10px; }
.dbc-item:last-child { margin-bottom: 0; }
.dbc-q { font-weight: 700; font-size: 1.15rem; margin: 0 0 .75em; }
.dbc-q::before { content: counter(dbc) ". "; color: var(--dbc-blue); }
.dbc-choices { display: grid; gap: .6em; }
@media (min-width: 640px) { .dbc-choices { grid-template-columns: 1fr 1fr; } }
.dbc-choice {
	display: flex; align-items: center; gap: .75em; width: 100%; min-height: 56px;
	padding: .7em .9em; text-align: left; font: inherit; font-size: 1.08rem; line-height: 1.3;
	color: var(--dbc-ink); background: #fff; border: 2px solid var(--dbc-line); border-radius: 10px; cursor: pointer;
}
.dbc-choice:hover:not(:disabled), .dbc-choice:focus-visible { border-color: var(--dbc-blue); background: var(--dbc-blue-soft); color: var(--dbc-ink); }
.dbc-choice:disabled, .dbc-choice:disabled:hover { cursor: default; opacity: 1; background: #fff; color: var(--dbc-ink); border-color: var(--dbc-line); }
.dbc-letter { flex: 0 0 auto; display: inline-grid; place-items: center; width: 2em; height: 2em; border-radius: 50%; background: var(--dbc-blue-soft); color: var(--dbc-blue); font-weight: 700; }
.dbc-choice.is-right, .dbc-choice.is-right:hover { border-color: var(--dbc-right); background: var(--dbc-right-bg); }
.dbc-choice.is-right .dbc-letter { background: var(--dbc-right); color: #fff; }
.dbc-choice.is-wrong, .dbc-choice.is-wrong:hover { border-color: var(--dbc-wrong); background: var(--dbc-wrong-bg); }
.dbc-choice.is-wrong .dbc-letter { background: var(--dbc-wrong); color: #fff; }
.dbc-tiles { display: flex; flex-wrap: wrap; gap: .35em; margin: 0 0 .6em; }
.dbc-tile { display: inline-grid; place-items: center; width: 2.4rem; height: 2.6rem; border-radius: 8px; background: var(--dbc-blue); color: #fff; font-weight: 700; font-size: 1.4rem; text-transform: uppercase; box-shadow: 0 2px 0 #12345c; }
.dbc-gap { width: .9rem; }
.dbc-clue { margin: 0 0 .75em; font-style: italic; }
.dbc-row { display: flex; flex-wrap: wrap; gap: .6em; align-items: center; margin-top: .6em; }
.dbc-row-small { margin-top: .5em; }
.dbc-center { justify-content: center; }
.dbc-input {
	flex: 1 1 12em; min-height: 52px; padding: .5em .75em; font: inherit; font-size: 1.15rem;
	border: 2px solid var(--dbc-line); border-radius: 10px; background: #fff; color: var(--dbc-ink);
}
.dbc-input:focus { outline: 3px solid #f2b134; outline-offset: 1px; border-color: var(--dbc-blue); }
.dbc-input:disabled { background: #f3f5f8; color: var(--dbc-ink); }
.dbc-btn {
	min-height: 52px; padding: .5em 1.1em; font: inherit; font-size: 1.05rem; font-weight: 700; line-height: 1.2;
	border-radius: 10px; border: 2px solid var(--dbc-blue); background: #fff; color: var(--dbc-blue); cursor: pointer;
}
.dbc-btn:hover:not(:disabled), .dbc-btn:focus-visible { background: var(--dbc-blue-soft); color: var(--dbc-blue); }
.dbc-btn.dbc-primary { background: var(--dbc-blue); color: #fff; }
.dbc-btn.dbc-primary:hover:not(:disabled), .dbc-btn.dbc-primary:focus-visible { background: #153a67; color: #fff; }
.dbc-btn.dbc-quiet, .dbc-btn.dbc-quiet:hover, .dbc-btn.dbc-quiet:disabled { background: transparent; color: var(--dbc-blue); border-color: transparent; text-decoration: underline; padding-left: .5em; padding-right: .5em; }
.dbc-btn:disabled, .dbc-btn:disabled:hover { opacity: .45; cursor: default; background: #fff; color: var(--dbc-blue); }
.dbc-btn.dbc-primary:disabled, .dbc-btn.dbc-primary:disabled:hover { background: var(--dbc-blue); color: #fff; }
.dbc-feedback:empty { display: none; }
.dbc-feedback { margin-top: .75em; padding: .7em .9em; border-radius: 8px; font-size: 1.05rem; }
.dbc-feedback.is-right { background: var(--dbc-right-bg); color: var(--dbc-right); }
.dbc-feedback.is-wrong { background: var(--dbc-wrong-bg); color: var(--dbc-wrong); }
.dbc-feedback.is-shown { background: var(--dbc-blue-soft); color: var(--dbc-ink); }
.dbc-feedback.is-hint { background: var(--dbc-hint-bg); color: var(--dbc-ink); }
.dbc-feedback.is-right, .dbc-feedback.is-shown { color: var(--dbc-ink); }
.dbc-feedback.is-right strong { color: var(--dbc-right); }
.dbc-done { margin-top: 1.25em; padding: 1em 1.2em; border-radius: 10px; background: var(--dbc-blue); color: #fff; text-align: center; }
.dbc-done p { margin: .2em 0; }
.dbc-done-msg { font-size: 1.25rem; font-weight: 700; }
.dbc-done a { color: #fff; font-weight: 700; text-decoration: underline; }
.dbc-noscript { font-weight: 700; color: var(--dbc-wrong); }
.dbc-puzzle:not(.is-ready) .dbc-btn, .dbc-puzzle:not(.is-ready) .dbc-choice { pointer-events: none; }

/* Sudoku */
.dbc-type-sudoku { container-type: inline-size; }
.dbc-sudoku { --cell: min(8.4vw, 3.1rem); --cell: min(calc((100cqi - 10px) / 9), 3.1rem); display: grid; width: max-content; margin: 0 auto 1em; border: 3px solid var(--dbc-ink); border-radius: 6px; overflow: hidden; background: #fff; }
.dbc-srow { display: flex; }
.dbc-cell {
	display: grid; place-items: center; box-sizing: border-box; width: var(--cell); height: var(--cell);
	margin: 0; padding: 0; border: 0; border-right: 1px solid #b8c2cf; border-bottom: 1px solid #b8c2cf; border-radius: 0;
	font: inherit; font-size: calc(var(--cell) * .55); line-height: 1; text-align: center; color: var(--dbc-blue); background: #fff;
}
.dbc-srow:last-child .dbc-cell { border-bottom: 0; }
.dbc-cell:last-child { border-right: 0; }
.dbc-cell.dbc-br { border-right: 3px solid var(--dbc-ink); }
.dbc-cell.dbc-bb { border-bottom: 3px solid var(--dbc-ink); }
.dbc-given { color: var(--dbc-ink); font-weight: 700; background: #eef1f5; }
input.dbc-cell { caret-color: transparent; }
input.dbc-cell:focus { outline: none; background: #fff1c7; box-shadow: inset 0 0 0 3px #f2b134; }
input.dbc-cell.is-wrong { color: var(--dbc-wrong); background: var(--dbc-wrong-bg); }
input.dbc-cell.is-hinted { color: var(--dbc-right); }
input.dbc-cell.is-done { background: var(--dbc-right-bg); }
@media (max-width: 480px) {
	.dbc-puzzle { padding: 1em .75em 1.25em; margin-left: -.25em; margin-right: -.25em; }
	.dbc-item { padding: .85em; }
	.dbc-tile { width: 2.1rem; height: 2.3rem; font-size: 1.25rem; }
}
/* beat the theme's input[type=text] padding/borders */
.dbc-sudoku input.dbc-cell[type="text"] { width: var(--cell); height: var(--cell); min-width: 0; padding: 0; margin: 0; border: 0; border-right: 1px solid #b8c2cf; border-bottom: 1px solid #b8c2cf; border-radius: 0; background-color: #fff; box-shadow: none; }
.dbc-sudoku .dbc-srow:last-child input.dbc-cell[type="text"] { border-bottom: 0; }
.dbc-sudoku input.dbc-cell[type="text"]:last-child { border-right: 0; }
.dbc-sudoku input.dbc-cell[type="text"].dbc-br { border-right: 3px solid var(--dbc-ink); }
.dbc-sudoku input.dbc-cell[type="text"].dbc-bb { border-bottom: 3px solid var(--dbc-ink); }
.dbc-sudoku input.dbc-cell[type="text"]:focus { background-color: #fff1c7; box-shadow: inset 0 0 0 3px #f2b134; }
.dbc-sudoku input.dbc-cell[type="text"].is-wrong { background-color: var(--dbc-wrong-bg); }
.dbc-sudoku input.dbc-cell[type="text"].is-done { background-color: var(--dbc-right-bg); }
.dbc-puzzle input.dbc-input[type="text"] { padding: .5em .75em; }
