/* Word of the Day — Banner Zone (wide horizontal, short height).
 * Same torn-paper design as the main card, laid out side by side:
 * dark title box on the left, lighter explanation box on the right,
 * with a gap between them. Colors come from the slide theme
 * (fill = lightest --bg, stroke/title = darkest --text). */

.wotd-banner-wrap {
    width: 90cqw;
    height: 80cqh;
    container-type: size;
    font-family: 'Geist Mono', 'Roboto Mono', monospace;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 1cqw;
    background: transparent;
    color: var(--text);
    padding: 0;
    box-sizing: border-box;
    overflow: visible;
    margin: auto;
}

/* Left — title box: torn-paper shape, no stroke, theme's darkest fill. */
.wotd-banner-banner-block {
    flex: 0 0 34%;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 4cqh 2cqw;
    box-sizing: border-box;
    background-color: var(--text);
    color: var(--bg);
    filter: drop-shadow(0 0.6cqmin 1.6cqmin rgba(11, 18, 32, 0.30));
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 700' preserveAspectRatio='none'><path d='M 40,45 L 65,34 L 91,49 L 116,37 L 141,51 L 167,48 L 192,52 L 217,49 L 243,46 L 268,42 L 293,26 L 319,52 L 344,40 L 369,50 L 395,33 L 420,46 L 445,27 L 471,54 L 496,31 L 521,29 L 547,37 L 572,41 L 597,53 L 623,33 L 648,38 L 673,43 L 699,29 L 724,44 L 749,33 L 775,26 L 800,49 L 825,32 L 851,39 L 876,34 L 901,31 L 927,53 L 952,50 L 977,38 L 1003,31 L 1028,50 L 1053,51 L 1079,28 L 1104,30 L 1129,45 L 1155,45 L 1180,40 L 1205,30 L 1231,30 L 1256,26 L 1281,53 L 1307,26 L 1332,32 L 1357,50 L 1383,32 L 1408,31 L 1433,53 L 1459,31 L 1484,35 L 1509,36 L 1535,32 L 1560,43 L 1574,62 L 1567,84 L 1566,106 L 1552,129 L 1551,151 L 1568,173 L 1552,195 L 1574,217 L 1558,239 L 1555,261 L 1546,284 L 1557,306 L 1559,328 L 1551,350 L 1550,372 L 1554,394 L 1548,416 L 1556,439 L 1555,461 L 1572,483 L 1565,505 L 1564,527 L 1546,549 L 1565,571 L 1567,594 L 1568,616 L 1556,638 L 1548,660 L 1535,655 L 1509,657 L 1484,672 L 1459,655 L 1433,661 L 1408,668 L 1383,656 L 1357,651 L 1332,661 L 1307,661 L 1281,668 L 1256,651 L 1231,647 L 1205,654 L 1180,646 L 1155,669 L 1129,657 L 1104,673 L 1079,658 L 1053,646 L 1028,663 L 1003,671 L 977,659 L 952,657 L 927,658 L 901,664 L 876,672 L 851,646 L 825,660 L 800,647 L 775,668 L 749,651 L 724,665 L 699,652 L 673,649 L 648,670 L 623,653 L 597,672 L 572,660 L 547,657 L 521,662 L 496,657 L 471,674 L 445,662 L 420,654 L 395,670 L 369,660 L 344,649 L 319,664 L 293,669 L 268,670 L 243,671 L 217,657 L 192,673 L 167,655 L 141,647 L 116,659 L 91,648 L 65,652 L 40,656 L 42,638 L 45,616 L 37,594 L 30,571 L 36,549 L 34,527 L 48,505 L 43,483 L 28,461 L 35,439 L 47,416 L 36,394 L 35,372 L 31,350 L 51,328 L 28,306 L 46,284 L 30,261 L 49,239 L 48,217 L 35,195 L 41,173 L 31,151 L 49,129 L 27,106 L 28,84 L 45,62 Z' fill='white' stroke='white' stroke-width='8' stroke-linejoin='round'/></svg>") center / 100% 100% no-repeat;
            mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 700' preserveAspectRatio='none'><path d='M 40,45 L 65,34 L 91,49 L 116,37 L 141,51 L 167,48 L 192,52 L 217,49 L 243,46 L 268,42 L 293,26 L 319,52 L 344,40 L 369,50 L 395,33 L 420,46 L 445,27 L 471,54 L 496,31 L 521,29 L 547,37 L 572,41 L 597,53 L 623,33 L 648,38 L 673,43 L 699,29 L 724,44 L 749,33 L 775,26 L 800,49 L 825,32 L 851,39 L 876,34 L 901,31 L 927,53 L 952,50 L 977,38 L 1003,31 L 1028,50 L 1053,51 L 1079,28 L 1104,30 L 1129,45 L 1155,45 L 1180,40 L 1205,30 L 1231,30 L 1256,26 L 1281,53 L 1307,26 L 1332,32 L 1357,50 L 1383,32 L 1408,31 L 1433,53 L 1459,31 L 1484,35 L 1509,36 L 1535,32 L 1560,43 L 1574,62 L 1567,84 L 1566,106 L 1552,129 L 1551,151 L 1568,173 L 1552,195 L 1574,217 L 1558,239 L 1555,261 L 1546,284 L 1557,306 L 1559,328 L 1551,350 L 1550,372 L 1554,394 L 1548,416 L 1556,439 L 1555,461 L 1572,483 L 1565,505 L 1564,527 L 1546,549 L 1565,571 L 1567,594 L 1568,616 L 1556,638 L 1548,660 L 1535,655 L 1509,657 L 1484,672 L 1459,655 L 1433,661 L 1408,668 L 1383,656 L 1357,651 L 1332,661 L 1307,661 L 1281,668 L 1256,651 L 1231,647 L 1205,654 L 1180,646 L 1155,669 L 1129,657 L 1104,673 L 1079,658 L 1053,646 L 1028,663 L 1003,671 L 977,659 L 952,657 L 927,658 L 901,664 L 876,672 L 851,646 L 825,660 L 800,647 L 775,668 L 749,651 L 724,665 L 699,652 L 673,649 L 648,670 L 623,653 L 597,672 L 572,660 L 547,657 L 521,662 L 496,657 L 471,674 L 445,662 L 420,654 L 395,670 L 369,660 L 344,649 L 319,664 L 293,669 L 268,670 L 243,671 L 217,657 L 192,673 L 167,655 L 141,647 L 116,659 L 91,648 L 65,652 L 40,656 L 42,638 L 45,616 L 37,594 L 30,571 L 36,549 L 34,527 L 48,505 L 43,483 L 28,461 L 35,439 L 47,416 L 36,394 L 35,372 L 31,350 L 51,328 L 28,306 L 46,284 L 30,261 L 49,239 L 48,217 L 35,195 L 41,173 L 31,151 L 49,129 L 27,106 L 28,84 L 45,62 Z' fill='white' stroke='white' stroke-width='8' stroke-linejoin='round'/></svg>") center / 100% 100% no-repeat;
}

/* Inner sizing-target — natural size so the binary-search fit measures
 * real content height. Children scale via em from this. */
.wotd-banner-banner-fit {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1;
    font-size: 7cqmin;
}

/* Right — explanation box: torn shape via two layered pseudos
 * (fill = lightest --bg, stroke = darkest --text). */
.wotd-banner-paper-block {
    flex: 1;
    min-width: 0;
    position: relative;
    /* Own stacking context so the z-index:-1 pseudos stay behind the text
     * but in front of the slide background, not behind everything. */
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 9cqh 4cqw;
    box-sizing: border-box;
    color: var(--text);
    background: transparent;
    font-size: 2.4cqmin;
    line-height: 1.4;
}

.wotd-banner-paper-block::before {
    content: "";
    position: absolute;
    inset: 0;
    background-color: var(--bg);
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 400' preserveAspectRatio='none'><path d='M 35,38 L 57,35 L 79,47 L 101,31 L 122,33 L 144,31 L 166,27 L 188,46 L 210,44 L 232,44 L 254,39 L 275,43 L 297,30 L 319,25 L 341,22 L 363,29 L 385,34 L 407,48 L 428,45 L 450,35 L 472,30 L 494,38 L 516,47 L 538,32 L 560,42 L 581,43 L 603,45 L 625,34 L 647,26 L 669,39 L 691,23 L 713,26 L 734,48 L 756,47 L 778,28 L 800,26 L 822,44 L 844,39 L 866,39 L 887,47 L 909,43 L 931,28 L 953,32 L 975,39 L 997,25 L 1019,44 L 1040,42 L 1062,24 L 1084,31 L 1106,35 L 1128,24 L 1150,38 L 1172,37 L 1193,42 L 1215,41 L 1237,26 L 1259,43 L 1281,47 L 1303,35 L 1325,48 L 1346,38 L 1368,32 L 1390,22 L 1412,35 L 1434,33 L 1456,40 L 1478,23 L 1499,46 L 1521,45 L 1543,33 L 1565,23 L 1567,52 L 1563,68 L 1570,84 L 1576,101 L 1552,118 L 1564,134 L 1559,150 L 1555,167 L 1569,184 L 1558,200 L 1559,216 L 1568,233 L 1563,250 L 1553,266 L 1560,282 L 1554,299 L 1577,316 L 1560,332 L 1558,348 L 1575,365 L 1543,371 L 1521,378 L 1499,369 L 1478,369 L 1456,369 L 1434,356 L 1412,360 L 1390,373 L 1368,361 L 1346,363 L 1325,362 L 1303,357 L 1281,362 L 1259,355 L 1237,370 L 1215,370 L 1193,377 L 1172,360 L 1150,362 L 1128,352 L 1106,353 L 1084,376 L 1062,363 L 1040,352 L 1019,366 L 997,375 L 975,360 L 953,367 L 931,372 L 909,353 L 887,375 L 866,358 L 844,361 L 822,360 L 800,354 L 778,375 L 756,374 L 734,367 L 713,352 L 691,371 L 669,370 L 647,368 L 625,373 L 603,356 L 581,364 L 560,367 L 538,375 L 516,370 L 494,378 L 472,364 L 450,357 L 428,358 L 407,360 L 385,356 L 363,373 L 341,355 L 319,358 L 297,353 L 275,378 L 254,369 L 232,361 L 210,377 L 188,362 L 166,377 L 144,362 L 122,353 L 101,357 L 79,365 L 57,354 L 35,374 L 46,348 L 31,332 L 48,316 L 30,299 L 43,282 L 34,266 L 37,250 L 24,233 L 39,216 L 24,200 L 39,184 L 42,167 L 29,150 L 29,134 L 39,118 L 30,101 L 40,84 L 27,68 L 47,52 Z' fill='white' stroke='white' stroke-width='8' stroke-linejoin='round'/></svg>") center / 100% 100% no-repeat;
            mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 400' preserveAspectRatio='none'><path d='M 35,38 L 57,35 L 79,47 L 101,31 L 122,33 L 144,31 L 166,27 L 188,46 L 210,44 L 232,44 L 254,39 L 275,43 L 297,30 L 319,25 L 341,22 L 363,29 L 385,34 L 407,48 L 428,45 L 450,35 L 472,30 L 494,38 L 516,47 L 538,32 L 560,42 L 581,43 L 603,45 L 625,34 L 647,26 L 669,39 L 691,23 L 713,26 L 734,48 L 756,47 L 778,28 L 800,26 L 822,44 L 844,39 L 866,39 L 887,47 L 909,43 L 931,28 L 953,32 L 975,39 L 997,25 L 1019,44 L 1040,42 L 1062,24 L 1084,31 L 1106,35 L 1128,24 L 1150,38 L 1172,37 L 1193,42 L 1215,41 L 1237,26 L 1259,43 L 1281,47 L 1303,35 L 1325,48 L 1346,38 L 1368,32 L 1390,22 L 1412,35 L 1434,33 L 1456,40 L 1478,23 L 1499,46 L 1521,45 L 1543,33 L 1565,23 L 1567,52 L 1563,68 L 1570,84 L 1576,101 L 1552,118 L 1564,134 L 1559,150 L 1555,167 L 1569,184 L 1558,200 L 1559,216 L 1568,233 L 1563,250 L 1553,266 L 1560,282 L 1554,299 L 1577,316 L 1560,332 L 1558,348 L 1575,365 L 1543,371 L 1521,378 L 1499,369 L 1478,369 L 1456,369 L 1434,356 L 1412,360 L 1390,373 L 1368,361 L 1346,363 L 1325,362 L 1303,357 L 1281,362 L 1259,355 L 1237,370 L 1215,370 L 1193,377 L 1172,360 L 1150,362 L 1128,352 L 1106,353 L 1084,376 L 1062,363 L 1040,352 L 1019,366 L 997,375 L 975,360 L 953,367 L 931,372 L 909,353 L 887,375 L 866,358 L 844,361 L 822,360 L 800,354 L 778,375 L 756,374 L 734,367 L 713,352 L 691,371 L 669,370 L 647,368 L 625,373 L 603,356 L 581,364 L 560,367 L 538,375 L 516,370 L 494,378 L 472,364 L 450,357 L 428,358 L 407,360 L 385,356 L 363,373 L 341,355 L 319,358 L 297,353 L 275,378 L 254,369 L 232,361 L 210,377 L 188,362 L 166,377 L 144,362 L 122,353 L 101,357 L 79,365 L 57,354 L 35,374 L 46,348 L 31,332 L 48,316 L 30,299 L 43,282 L 34,266 L 37,250 L 24,233 L 39,216 L 24,200 L 39,184 L 42,167 L 29,150 L 29,134 L 39,118 L 30,101 L 40,84 L 27,68 L 47,52 Z' fill='white' stroke='white' stroke-width='8' stroke-linejoin='round'/></svg>") center / 100% 100% no-repeat;
    z-index: -1;
    pointer-events: none;
}

.wotd-banner-paper-block::after {
    content: "";
    position: absolute;
    inset: 0;
    background-color: var(--text);
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 400' preserveAspectRatio='none'><path d='M 35,38 L 57,35 L 79,47 L 101,31 L 122,33 L 144,31 L 166,27 L 188,46 L 210,44 L 232,44 L 254,39 L 275,43 L 297,30 L 319,25 L 341,22 L 363,29 L 385,34 L 407,48 L 428,45 L 450,35 L 472,30 L 494,38 L 516,47 L 538,32 L 560,42 L 581,43 L 603,45 L 625,34 L 647,26 L 669,39 L 691,23 L 713,26 L 734,48 L 756,47 L 778,28 L 800,26 L 822,44 L 844,39 L 866,39 L 887,47 L 909,43 L 931,28 L 953,32 L 975,39 L 997,25 L 1019,44 L 1040,42 L 1062,24 L 1084,31 L 1106,35 L 1128,24 L 1150,38 L 1172,37 L 1193,42 L 1215,41 L 1237,26 L 1259,43 L 1281,47 L 1303,35 L 1325,48 L 1346,38 L 1368,32 L 1390,22 L 1412,35 L 1434,33 L 1456,40 L 1478,23 L 1499,46 L 1521,45 L 1543,33 L 1565,23 L 1567,52 L 1563,68 L 1570,84 L 1576,101 L 1552,118 L 1564,134 L 1559,150 L 1555,167 L 1569,184 L 1558,200 L 1559,216 L 1568,233 L 1563,250 L 1553,266 L 1560,282 L 1554,299 L 1577,316 L 1560,332 L 1558,348 L 1575,365 L 1543,371 L 1521,378 L 1499,369 L 1478,369 L 1456,369 L 1434,356 L 1412,360 L 1390,373 L 1368,361 L 1346,363 L 1325,362 L 1303,357 L 1281,362 L 1259,355 L 1237,370 L 1215,370 L 1193,377 L 1172,360 L 1150,362 L 1128,352 L 1106,353 L 1084,376 L 1062,363 L 1040,352 L 1019,366 L 997,375 L 975,360 L 953,367 L 931,372 L 909,353 L 887,375 L 866,358 L 844,361 L 822,360 L 800,354 L 778,375 L 756,374 L 734,367 L 713,352 L 691,371 L 669,370 L 647,368 L 625,373 L 603,356 L 581,364 L 560,367 L 538,375 L 516,370 L 494,378 L 472,364 L 450,357 L 428,358 L 407,360 L 385,356 L 363,373 L 341,355 L 319,358 L 297,353 L 275,378 L 254,369 L 232,361 L 210,377 L 188,362 L 166,377 L 144,362 L 122,353 L 101,357 L 79,365 L 57,354 L 35,374 L 46,348 L 31,332 L 48,316 L 30,299 L 43,282 L 34,266 L 37,250 L 24,233 L 39,216 L 24,200 L 39,184 L 42,167 L 29,150 L 29,134 L 39,118 L 30,101 L 40,84 L 27,68 L 47,52 Z' fill='none' stroke='white' stroke-width='8' stroke-linejoin='round'/></svg>") center / 100% 100% no-repeat;
            mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 400' preserveAspectRatio='none'><path d='M 35,38 L 57,35 L 79,47 L 101,31 L 122,33 L 144,31 L 166,27 L 188,46 L 210,44 L 232,44 L 254,39 L 275,43 L 297,30 L 319,25 L 341,22 L 363,29 L 385,34 L 407,48 L 428,45 L 450,35 L 472,30 L 494,38 L 516,47 L 538,32 L 560,42 L 581,43 L 603,45 L 625,34 L 647,26 L 669,39 L 691,23 L 713,26 L 734,48 L 756,47 L 778,28 L 800,26 L 822,44 L 844,39 L 866,39 L 887,47 L 909,43 L 931,28 L 953,32 L 975,39 L 997,25 L 1019,44 L 1040,42 L 1062,24 L 1084,31 L 1106,35 L 1128,24 L 1150,38 L 1172,37 L 1193,42 L 1215,41 L 1237,26 L 1259,43 L 1281,47 L 1303,35 L 1325,48 L 1346,38 L 1368,32 L 1390,22 L 1412,35 L 1434,33 L 1456,40 L 1478,23 L 1499,46 L 1521,45 L 1543,33 L 1565,23 L 1567,52 L 1563,68 L 1570,84 L 1576,101 L 1552,118 L 1564,134 L 1559,150 L 1555,167 L 1569,184 L 1558,200 L 1559,216 L 1568,233 L 1563,250 L 1553,266 L 1560,282 L 1554,299 L 1577,316 L 1560,332 L 1558,348 L 1575,365 L 1543,371 L 1521,378 L 1499,369 L 1478,369 L 1456,369 L 1434,356 L 1412,360 L 1390,373 L 1368,361 L 1346,363 L 1325,362 L 1303,357 L 1281,362 L 1259,355 L 1237,370 L 1215,370 L 1193,377 L 1172,360 L 1150,362 L 1128,352 L 1106,353 L 1084,376 L 1062,363 L 1040,352 L 1019,366 L 997,375 L 975,360 L 953,367 L 931,372 L 909,353 L 887,375 L 866,358 L 844,361 L 822,360 L 800,354 L 778,375 L 756,374 L 734,367 L 713,352 L 691,371 L 669,370 L 647,368 L 625,373 L 603,356 L 581,364 L 560,367 L 538,375 L 516,370 L 494,378 L 472,364 L 450,357 L 428,358 L 407,360 L 385,356 L 363,373 L 341,355 L 319,358 L 297,353 L 275,378 L 254,369 L 232,361 L 210,377 L 188,362 L 166,377 L 144,362 L 122,353 L 101,357 L 79,365 L 57,354 L 35,374 L 46,348 L 31,332 L 48,316 L 30,299 L 43,282 L 34,266 L 37,250 L 24,233 L 39,216 L 24,200 L 39,184 L 42,167 L 29,150 L 29,134 L 39,118 L 30,101 L 40,84 L 27,68 L 47,52 Z' fill='none' stroke='white' stroke-width='8' stroke-linejoin='round'/></svg>") center / 100% 100% no-repeat;
    z-index: -1;
    pointer-events: none;
}

.wotd-banner-wrap .wotd-banner-header {
    font-family: 'Geist Mono', 'Roboto Mono', monospace;
    font-size: 0.24em;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4em;
    color: var(--bg);
    margin-bottom: 0.3em;
    line-height: 1;
    opacity: 0.85;
}

.wotd-banner-wrap .wotd-banner-word {
    font-family: 'Cormorant Garamond', 'Georgia', serif;
    font-size: 0.7em;
    font-weight: 700;
    line-height: 1;
    color: var(--bg);
    letter-spacing: -0.01em;
}

.wotd-banner-wrap .wotd-banner-pos {
    font-family: 'Georgia', serif;
    font-size: 0.31em;
    color: var(--bg);
    opacity: 0.85;
    margin-top: 0.3em;
    line-height: 1;
    font-style: italic;
}

.wotd-banner-wrap .wotd-banner-body {
    font-size: inherit;
    line-height: inherit;
}

.wotd-banner-wrap .wotd-banner-senses {
    margin: 0;
    padding-inline-start: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    font-size: inherit;
    line-height: inherit;
}

.wotd-banner-wrap .wotd-banner-sense {
    font-family: 'Georgia', serif;
    font-size: inherit;
    line-height: inherit;
    color: var(--text);
}

.wotd-banner-wrap .wotd-banner-example {
    font-family: 'Georgia', serif;
    font-size: 0.85em;
    line-height: 1.35;
    margin-top: 0.8em;
    color: var(--text);
    opacity: 0.78;
    text-align: start;
}