.today-in-chess{box-sizing:border-box;width:min(1060px,calc(100% - 32px));margin:18px auto 24px;padding:12px;border:1px solid #dfd2c4;border-radius:14px;background:linear-gradient(120deg,#fffdfa,#faf3eb);box-shadow:0 4px 0 #d9ccbd,0 8px 18px #49322209;color:#302821;min-width:0}
.today-in-chess [hidden]{display:none!important}
.today-in-chess-story{display:grid;grid-template-columns:56px minmax(0,1fr) 50px;gap:16px;align-items:center;min-width:0}
.today-in-chess-copy{min-width:0;padding:4px 0}
.today-in-chess-meta{margin:0 0 7px;font-size:11px;font-weight:700;color:#746357}
.today-in-chess-meta span{margin:0 5px}
.today-in-chess-copy h3{margin:0;font:800 clamp(16px,1.4vw,19px)/1.35 var(--sans,sans-serif);overflow-wrap:anywhere}
.today-in-chess-copy h3 a{color:inherit;text-decoration:none}
.today-in-chess-links{display:flex;align-items:center;flex-wrap:wrap;gap:6px 18px;margin-top:5px}
.today-in-chess-links>span{font-size:11px;color:#746357;overflow-wrap:anywhere}
.today-in-chess a:hover{text-decoration:underline}
.today-in-chess :is(a,button):focus-visible{outline:3px solid #c36242;outline-offset:4px}
.has-report .today-in-chess,.lesson-is-loading .today-in-chess,.is-puzzle-workout-active .today-in-chess{display:none!important}

.puzzle-library-intro>.today-in-chess{grid-column:1/-1;width:100%;margin:16px 0;min-width:0}
@media(min-width:1024px){.puzzle-library-intro+.today-in-chess{width:100%;margin:18px 0 24px}.puzzle-library-intro>.today-in-chess{grid-row:3}}
@media(max-width:600px){.today-in-chess{margin:16px auto;padding:10px}.today-in-chess-story{grid-template-columns:40px minmax(0,1fr) 50px;gap:10px;align-items:start}.today-in-chess-copy{padding:0}.today-in-chess-copy h3{font-size:14px;line-height:1.4}.today-in-chess-meta{display:none}.today-in-chess-links{gap:0 8px;margin-top:3px}.today-in-chess-links>span{font-size:9px;line-height:1.4}}


.today-in-chess-icon{align-self:start;padding-top:4px}
.today-in-chess-icon img{display:block;width:100%;height:auto;object-fit:contain}

/* Same next-move control as the puzzle board, available without loading gameplay CSS. */
.today-in-chess-next {
    position: relative;
    width: 50px;
    height: 50px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    box-shadow: none;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}
.today-in-chess-next::before {
    position: absolute;
    top: 3px;
    left: 5px;
    width: 40px;
    height: 40px;
    border: 1px solid #dc513f;
    border-radius: 50%;
    background:
        radial-gradient(circle at 34% 24%, rgba(255, 255, 255, .55) 0 8%, transparent 9%),
        linear-gradient(145deg, #ff9d7d 0%, #f5715e 52%, #dc4938 100%);
    box-shadow:
        inset 0 2px 1px rgba(255, 255, 255, .7),
        inset 0 -4px 4px rgba(156, 39, 26, .2),
        0 4px 0 #bd3c2e,
        0 7px 9px rgba(126, 49, 38, .24);
    content: "";
    transition: filter .14s ease, transform .09s ease, box-shadow .09s ease;
}
.today-in-chess-next::after {
    position: absolute;
    z-index: 1;
    top: 14px;
    left: 19px;
    width: 14px;
    height: 18px;
    background: linear-gradient(90deg, #fff7eb, #fff);
    clip-path: polygon(10% 0, 100% 50%, 10% 100%);
    content: "";
    filter: drop-shadow(0 1px 1px rgba(116, 39, 29, .42));
    transform: translateX(1px);
    transition: transform .09s ease;
}
.today-in-chess-next:hover::before {
    filter: saturate(1.06) brightness(1.03);
}
.today-in-chess-next:active::before {
    box-shadow:
        inset 0 3px 5px rgba(129, 31, 21, .26),
        inset 0 1px 1px rgba(255, 255, 255, .32),
        0 1px 0 #bd3c2e,
        0 2px 3px rgba(126, 49, 38, .18);
    filter: saturate(1.04) brightness(.98);
    transform: translateY(4px);
}
.today-in-chess-next:active::after {
    transform: translate(1px, 4px);
}
.today-in-chess-next{display:block;align-self:center;justify-self:end}
@media(prefers-reduced-motion:reduce){.today-in-chess-next::before,.today-in-chess-next::after{transition:none}}
