.family-strip{display:grid;gap:var(--space-3);padding-block:var(--space-5);border-block:1.5px solid var(--line)}.family-strip__title{margin:0;color:var(--ink-muted);font:700 var(--step--1) / 1.3 var(--font-body);letter-spacing:0.06em;text-transform:uppercase}.family-strip__all{border-color:var(--brand);background:var(--brand);color:var(--brand-ink)}.family-strip__all:hover{background:var(--brand-hover)}.family-intro{font-size:var(--step-1);line-height:1.55}.family-intro p:last-child,.family-jump{margin-bottom:0}.family-group{scroll-margin-top:var(--space-4)}.family-group__intro{max-width:var(--measure);color:var(--ink-muted)}.family-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr));gap:var(--space-3);margin:0;padding:0;list-style:none}.family-card{position:relative;display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-4);border:var(--card-border);border-radius:var(--radius);background:var(--card-bg);box-shadow:var(--card-shadow);transition:transform 0.15s var(--ease),border-color 0.15s}.family-card:hover,.family-card:focus-within{border-color:var(--brand);transform:translateY(-2px)}.family-card__title{margin:0;font-size:var(--step-0);line-height:1.25}.family-card__title a{color:var(--link);text-decoration:none}.family-card__title a::after{content:"";position:absolute;inset:0;border-radius:inherit}.family-card__title a:focus-visible{outline:none}.family-card__title a:focus-visible::after{outline:3px solid var(--ring);outline-offset:2px}.family-card__text{margin:0;color:var(--ink-muted);font-size:var(--step--1);line-height:1.45}.family-card__preview{margin:auto 0 0;padding:var(--space-2) var(--space-3);border-left:3px solid var(--accent);border-radius:var(--radius-sm);background:var(--surface);font-size:var(--step--1);font-weight:650;line-height:1.4}html[data-card="outlined"] .family-card__preview,html[data-card="lifted"] .family-card__preview{background:var(--surface-2)}.family-card__eg{display:block;color:var(--ink-muted);font-size:0.85em;font-weight:700;letter-spacing:0.06em;text-transform:uppercase}@media print{.family-strip{display:none}}.tool + .result-links,.tool + .daily-pick,.tool + .engage-row{margin-top:var(--space-4)}.result-links + .daily-pick,.result-links + .engage-row,.daily-pick + .engage-row{margin-top:var(--space-3)}.result-links{display:flex;flex-direction:column;justify-content:center;min-height:calc(var(--tap) * 2);margin-bottom:0;padding-inline-start:var(--space-3);border-inline-start:3px solid var(--brand);font-size:var(--step--1)}.result-links[data-rows="1"]{min-height:var(--tap)}.result-links__lead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.result-links__list{display:flex;flex-direction:column;min-width:0}.result-links a{display:block;overflow:hidden;min-width:0;color:var(--link);font-weight:650;line-height:var(--tap);text-decoration:none;text-overflow:ellipsis;white-space:nowrap}.result-links a::before{content:"\2192\00a0";color:var(--ink-muted)}.result-links a:hover{text-decoration:underline}.result-links:has(.result-links__list:empty){border-color:transparent}.result-links:has(.result-links__list:empty) .result-links__lead{visibility:hidden}@media (min-width:48rem){.result-links,.result-links[data-rows]{flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--space-4);min-height:var(--tap)}.result-links__lead{position:static;flex:none;width:auto;height:auto;clip-path:none;color:var(--ink-muted);font-weight:700;letter-spacing:0.06em;text-transform:uppercase}.result-links__list{flex:1 1 auto;flex-direction:row;gap:var(--space-5)}.result-links a{flex:0 1 auto}}.daily-pick{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"label streak" "text text";align-items:center;gap:var(--space-1) var(--space-3);margin-bottom:0;padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);background:var(--surface-2)}.daily-pick + .card-grid{margin-top:var(--space-3)}.daily-pick__label{grid-area:label;overflow:hidden;color:var(--ink-muted);font-size:var(--step--1);font-weight:700;letter-spacing:0.06em;line-height:1.5rem;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.daily-pick__streak{grid-area:streak;padding-inline:var(--space-2);border-radius:var(--radius-pill);background:var(--brand-soft);color:var(--link);font-size:var(--step--1);font-weight:700;line-height:1.5rem;white-space:nowrap}.daily-pick__text{display:-webkit-box;grid-area:text;overflow:hidden;min-height:2.7em;font-weight:700;line-height:1.35;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2}.daily-pick__text a{color:var(--link)}.daily-pick__label,.daily-pick__text{visibility:hidden;animation:engage-reveal 0s 2.5s forwards}.daily-pick[data-ready] .daily-pick__label,.daily-pick[data-ready] .daily-pick__text{visibility:visible;animation:none}@keyframes engage-reveal{to{visibility:visible}}@media (min-width:48rem){.daily-pick{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"label text streak";gap:var(--space-4)}.daily-pick__text{display:block;min-height:0;line-height:1.5rem;text-overflow:ellipsis;white-space:nowrap}}.engage-row{display:grid;gap:var(--space-4)}.next-up-slot{min-width:0}.next-up{position:relative;display:grid;gap:var(--space-2);box-sizing:border-box;height:10.75rem;padding:var(--space-3) var(--space-4);border:var(--card-border);border-radius:var(--radius);background:var(--card-bg);grid-template-rows:1.5rem auto;align-content:start}.next-up__title{margin:0;color:var(--ink-muted);font-size:var(--step--1);font-weight:700;letter-spacing:0.06em;line-height:1.5rem;text-transform:uppercase}.next-up__close{position:absolute;top:0;inset-inline-end:0;width:var(--tap);height:var(--tap);padding:0;border:0;border-radius:var(--radius-pill);background:none;color:var(--ink-muted);font:inherit;font-size:var(--step-1);line-height:1;cursor:pointer}.next-up__close:hover,.next-up__undo:hover{color:var(--ink)}.next-up__list{display:grid;gap:var(--space-2);margin:0;padding:0;list-style:none}.next-up__link{display:grid;align-content:center;box-sizing:border-box;height:3.25rem;padding-inline:var(--space-3);border-radius:var(--radius-sm);background:var(--surface-2);color:inherit;text-decoration:none}.next-up__link b,.next-up__link span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.next-up__link b{color:var(--link);font-size:var(--step--1);line-height:1.35}.next-up__link span{color:var(--ink-muted);font-size:var(--step--1);line-height:1.35}.next-up__link:hover{background:var(--brand-soft)}.next-up__gone{margin:0;color:var(--ink-muted);font-size:var(--step--1)}.next-up__undo{min-height:var(--tap);padding:0 var(--space-2);border:0;background:none;color:var(--link);font:inherit;font-weight:650;text-decoration:underline;cursor:pointer}.next-up[data-dismissed]{border-color:transparent;background:none;box-shadow:none}@media (min-width:48rem){.engage-row--card{grid-template-columns:minmax(0,1fr) minmax(16rem,22rem);align-items:start;gap:var(--space-5)}.engage-row--card .next-up-slot{min-height:10.75rem}}@media (prefers-reduced-motion:no-preference){.next-up:not([hidden]){animation:engage-fade 0.25s var(--ease)}@keyframes engage-fade{from{opacity:0}}}.link-card__preview{display:-webkit-box;overflow:hidden;margin:var(--space-3) 0 0;padding-top:var(--space-2);border-top:1px dashed var(--line);color:var(--ink);font-size:var(--step--1);line-height:1.4;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2}.link-card__preview-label{margin-inline-end:var(--space-1);color:var(--ink-muted);font-size:0.85em;font-weight:700;letter-spacing:0.06em;text-transform:uppercase}.recent-strip{position:relative;display:flex;align-items:center;gap:var(--space-3);overflow-x:auto;height:3.5rem;overscroll-behavior-x:contain;scrollbar-width:none}.recent-strip::-webkit-scrollbar{display:none}.recent-strip:focus{outline:none}.recent-strip__label,.recent-strip__hint{margin:0;color:var(--ink-muted);font-size:var(--step--1)}.recent-strip__label{flex:none;font-weight:700;letter-spacing:0.06em;text-transform:uppercase}.recent-strip__hint{line-height:1.35}.recent-strip__chips{flex:none;flex-wrap:nowrap}.recent-strip__chips .chip{white-space:nowrap}.chip--all{border-color:var(--brand);color:var(--link)}.recent-strip__clear{flex:none;min-height:var(--tap);padding:0 var(--space-2);border:0;background:none;color:var(--ink-muted);font:inherit;font-size:var(--step--1);text-decoration:underline;cursor:pointer}.recent-strip__clear:hover{color:var(--ink)}html[data-play] .site-header,html[data-play] .breadcrumb,html[data-play] .page-head,html[data-play] .result-links,html[data-play] .daily-pick,html[data-play] .engage-row{display:none}@media print{.result-links,.daily-pick,.engage-row,.recent-strip{display:none !important}}:root{--brand:#26103f;--brand-ink:#ffb81f;--accent:#d4381e;--surface:#fff6e6;--surface-2:#f7e8cc;--ink:#21123a;--ink-muted:#5b4a6e;--line:#e2d0a8;--link:#b42c14;--accent-ink:#ffffff;--brand-hover:#230f3a;--accent-hover:#c3341c;--radius:14px;--font-display:Rockwell,"Rockwell Nova","Roboto Slab","DejaVu Serif","Sitka Small",serif;--font-body:Avenir,Montserrat,Corbel,"URW Gothic",source-sans-pro,sans-serif;--display-weight:800}@media screen and (prefers-color-scheme:dark){:root{--brand:#2f1d66;--brand-ink:#ffbf3a;--accent:#ff6a45;--surface:#140c28;--surface-2:#20143d;--ink:#fdf3df;--ink-muted:#bcb0d0;--line:#382a5c;--link:#ffc64d;--accent-ink:#14161a;--brand-hover:#2b1b5e;--accent-hover:#ff7654}}html[data-header] .logo__mark--svg{min-width:0;width:2.25rem;padding:0;border-radius:0;background:none;color:inherit;flex:none}.logo__mark--svg > svg{display:block;width:100%;height:100%;overflow:visible}.logo--mark-right{flex-direction:row-reverse}@media print{.logo__mark--svg > svg{print-color-adjust:exact;-webkit-print-color-adjust:exact}}.logo__text{letter-spacing:-0.02em;font-weight:700}:root{--on-night:var(--surface);--night-dim:var(--on-night);--lit:var(--brand-ink);--night:var(--brand);--btn:var(--night);--btn-ink:var(--lit);--btn-edge:#0e0518;--corner:11px;--moon-i:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%2326103f' d='M10.32 3.02A10 10 0 1 0 20.28 16.72A8.6 8.6 0 0 1 10.32 3.02Z'/></svg>");--moon:var(--moon-i) center/contain no-repeat;--wire:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='12'><path d='M0 1.5q8 6 16 0t16 0' fill='none' stroke='%237b6a9c'/></svg>") 0 100% repeat-x;--bulbs:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='12'><circle cx='8' cy='7.5' r='2.6' fill='%23ffb81f'/><circle cx='24' cy='7.5' r='2.6' fill='%23e8482c'/></svg>") 0 100% repeat-x;--mark:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' stroke='%2326103f' stroke-width='2.5'><rect x='19.65' y='5.05' width='36.5' height='49.5' rx='7.75' fill='%23fff6e6' transform='rotate(14 37.9 29.8)'/><g transform='rotate(-12 26.9 32.8)'><rect x='7.65' y='6.55' width='38.5' height='52.5' rx='7.75' fill='%23ffb81f'/><path stroke='none' fill='%2326103f' d='M25.51 21.21A12.5 12.5 0 1 0 38.81 38.23A10.8 10.8 0 0 1 25.51 21.21Z'/></g></svg>"); --cats:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 16' fill='%2326103f'><path d='M1.5 11.8l.8-3.2 4.6-4.6a1.1 1.1 0 0 1 1.5 0l.9.9a1.1 1.1 0 0 1 0 1.5l-4.6 4.6zM38.5 3.8c.4 2.7 1.5 3.8 4.2 4.2-2.7.4-3.8 1.5-4.2 4.2-.4-2.7-1.5-3.8-4.2-4.2 2.7-.4 3.8-1.5 4.2-4.2z'/><path fill='none' stroke='%2326103f' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M14 5.5a2.5 2.5 0 1 1 3.7 2.2c-.8.5-1.2 1-1.2 2M16.5 13v.01M24.5 12.5l3-9 3 9M25.5 9.5h4'/></svg>"); --ci:var(--moon-i); --cs:52%; --cp:50%; --ui:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 144 24' stroke='red' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><path d='M6 5.5v13l9.5-6.5zM32.5 5v14l11-7zM55 5.5h2v13h-2zM65 5.5h2v13h-2zM77 9.5h8v10h-8z'/><path fill='none' d='M19 5.5v13M81.5 4.5h8.5v11M102 6l12 12M114 6l-12 12M125 12h14M133 6l6 6-6 6'/></svg>"); --heart:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%2326103f' d='M12 20.5 5 13a4.25 4.25 0 0 1 6-6l1 1 1-1a4.25 4.25 0 0 1 6 6Z'/></svg>"); --gap:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 72'><rect x='8' y='14' width='30' height='42' rx='6' fill='%23fff6e6' transform='rotate(-14 23 35)'/><rect x='33' y='10' width='30' height='42' rx='6' fill='none' stroke='%23ffb81f' stroke-width='3' stroke-dasharray='5 6' stroke-linecap='round'/><rect x='58' y='14' width='30' height='42' rx='6' fill='%23ffb81f' transform='rotate(14 73 35)'/></svg>"); --fade:linear-gradient(90deg,#000 calc(100% - 2rem),#0000); } @media (prefers-color-scheme:dark){ :root{--on-night:var(--ink);--night:#1c0f3d;--btn:#fff6e6;--btn-ink:var(--night);--btn-edge:#8f80a6} } a[href^="/category/"],html:has(.site-nav [aria-current][href^="/category/"]){--ci:var(--cats);--cs:400%;--cp:0 50%} a[href$="/questions/"],html:has(.site-nav [aria-current][href$="/questions/"]){--cp:33.3% 50%} a[href$="/word-games/"],html:has(.site-nav [aria-current][href$="/word-games/"]){--cp:66.7% 50%} a[href$="/holiday/"],html:has(.site-nav [aria-current][href$="/holiday/"]){--cp:100% 50%} .bingo__cell--free .bingo__mark::before{content:"";width:1.1em;height:1.1em;margin-bottom:.15em;background:currentColor;-webkit-mask:var(--moon);-webkit-print-color-adjust:exact;print-color-adjust:exact} @media screen{ @supports (color:color-mix(in srgb,red,blue)){ :root{ --night-dim:color-mix(in srgb,var(--on-night) 82%,var(--brand)); --line-strong:color-mix(in srgb,var(--ink) 55%,var(--surface)); } } html{background:var(--night);caret-color:var(--accent);-webkit-tap-highlight-color:transparent} ::selection{background:var(--lit);color:#26103f} html[data-header=bar] .site-header{background:var(--bulbs),var(--wire),var(--night)} html[data-header=bar] .site-nav a{color:var(--night-dim)} html[data-header=bar] .site-nav a:hover{background:rgb(255 184 31/.16);color:var(--lit)} html[data-header=bar] .site-nav a[aria-current]{background:var(--lit);color:var(--night)} .site-nav a:focus-visible{outline-offset:-3px} .page>.breadcrumb,.page>.page-head,.page>.hero{ position:relative; --up:.8rem; --down:1rem; --ring:var(--lit); --btn:#fff6e6; --btn-ink:var(--night); --btn-edge:#8f80a6; border-image:linear-gradient(var(--night) 0 0) fill 0/0/var(--up) 100vmax var(--down); color:var(--night-dim); } .page>:first-child{--up:1.5rem} .page>.page-head:not(:has(+.tool)){padding-bottom:var(--space-4);--down:0px} .page>.page-head:has(+.tool){--down:6rem} .page>.hero{padding-bottom:var(--space-4);--down:0px} .page>.hero:has(+.recent-strip){--down:4.25rem} .page--hub>.page-head:has(+.card-grid){--down:4.5rem} .page>.hero+*,.page>.page-head+*{position:relative} .recent-strip{padding-inline-end:2rem;-webkit-mask:var(--fade)} .hero+.recent-strip{margin-top:0} .hero+.recent-strip+*{margin-top:var(--space-7)} .hero+.recent-strip>:not(ul){--ink-muted:var(--night-dim);--ink:var(--lit)} .breadcrumb ol,.page>.breadcrumb li::after,.tagline,.meta,.lede{color:inherit} .page-head h1,.hero h1,.page-head a:not(.btn),.hero a:not(.btn){color:var(--lit)} h1{letter-spacing:-.025em} .hero h1{max-width:14ch} .page--text>.page-head h1{max-width:none} .lede{font-size:var(--step-0)} .prose h3{font:800 var(--step-0)/1.3 var(--font-body);letter-spacing:0} .prose p,.faq p,.tips li,.link-card__text{text-wrap:pretty} .count,.meta{font-variant-numeric:tabular-nums} @media (min-width:60rem){ .hero::before,.hero::after,.page--hub>.page-head::after{ content:""; position:absolute; top:50%; right:2rem; width:9.5rem; aspect-ratio:41/55; border:.55rem solid #26103f; border-radius:2.1rem; background:#fff6e6; transform:translateY(-52%) rotate(14deg); } .hero::after{right:6rem;background:var(--moon) var(--lit);background-size:50%;transform:translateY(-46%) rotate(-12deg)} .page--hub>.page-head{padding-right:12rem} .page--hub>.page-head::after{right:3.5rem;width:7rem;border-width:.4rem;border-radius:1.55rem;background:var(--ci) var(--cp)/var(--cs) no-repeat var(--lit);transform:translateY(-54%) rotate(8deg)} .page--hub>.page-head:not(:has(+.card-grid))::after{width:4.5rem;border-width:.26rem;border-radius:1rem} .card-grid--preview>li:first-child{grid-column:1/-1} .deck:has(>.deck__timer){grid-template:auto auto 1fr/minmax(0,30rem) minmax(0,1fr);column-gap:var(--space-6);align-items:start} .deck:has(>.deck__timer)>*{grid-column:1/-1} .deck:has(>.deck__timer)>.deck__card{grid-area:1/1/span 3;align-self:stretch;min-height:22rem} .deck:has(>.deck__timer)>:is(.deck__controls,.deck__note,.deck__timer,.deck__teams){grid-column:2} } @media (max-width:59.99rem){ .hero__actions::after{content:"";width:4.5rem;height:4.5rem;margin:-1.4rem 0 -.6rem auto;background:var(--mark) center/contain no-repeat;transform:rotate(5deg)} } @media (max-width:30rem){ .breadcrumb li:last-child,.breadcrumb li:nth-last-child(2)::after,.meta li:last-child,.page-head:has(+.tool) .meta{display:none} .meta li:nth-last-child(2)::after{content:none} .page-head:has(+.tool) h1{font-size:var(--step-3)} .tagline{font-size:var(--step-0)} .hero{display:flex;flex-direction:column} .hero__actions{order:1;margin-block:var(--space-4)} .hero .lede{order:2} .tool .result-card{min-height:8.5rem;padding-block:var(--space-4)} .tool .deck__card{min-height:13rem} .deck__card .result-card__label{min-height:2.9em} .deck__card:has(.deck__options){align-content:start} .deck__card:has(.deck__options) .result-card__label{min-height:0;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis} .deck__card:has(.deck__options) .result-card__text{margin:0;font-size:var(--step-0)} .deck__options,.deck__option{gap:var(--space-1)} .deck__option{min-height:4.25rem;padding-block:var(--space-2)} .deck__votes,.deck__or{line-height:1.2} .namepicker__controls{order:-2} .namepicker__stage{order:-1} .page>.page-head+.tool{margin-top:var(--space-3)} .deck__groups,.site-nav ul{padding-inline-end:2rem;-webkit-mask:var(--fade)} } html[data-card=outlined] .tool{box-shadow:5px 5px 0 0 var(--lit),5px 5px 0 2px var(--ink),10px 10px 0 0 var(--accent),10px 10px 0 2px var(--ink)} .page>.tool+*{margin-top:var(--space-6)} .result-card{position:relative;border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)} .result-card::before,.daily-pick::before{content:"";position:absolute;top:-.65rem;left:1.1rem;box-sizing:border-box;width:1.6rem;height:1.6rem;border:2px solid var(--ink);border-radius:50%;background:var(--moon) var(--lit);background-size:58%} .daily-pick{position:relative;border:2px solid var(--ink);border-radius:var(--radius);background:var(--surface);box-shadow:4px 4px 0 0 var(--lit),4px 4px 0 2px var(--ink)} .result-card__label{text-wrap:balance} .picker__item .result__text{padding-top:.15em} .bingo__mark{hyphens:auto} .tips li::before{top:.35em;width:.9em;height:.9em;border-radius:0;background:var(--brand);-webkit-mask:var(--moon)} .btn,.segmented{border-radius:var(--radius)} .btn-sm,.pill,.chip,.badge,.count,.jump a,.site-nav a,.dataset-details>summary,.toast{border-radius:var(--corner)} .btn,.deck__option{transition:transform .18s cubic-bezier(.2,1.3,.4,1),box-shadow .18s var(--ease),background-color .12s,border-color .12s} .btn:active,.deck__option:active{transition-duration:.05s} .chip{transition:transform .15s,box-shadow .15s} .pill,.site-nav a,.faq summary,.jump a{transition:background-color .14s var(--ease),border-color .14s var(--ease),color .14s var(--ease)} .btn-primary{ --rule:4.5px; --face:inset 0 0 0 3px var(--btn),inset 0 0 0 var(--rule) var(--btn-ink); border-color:var(--btn); background:var(--btn); color:var(--btn-ink); box-shadow:var(--face),0 4px 0 var(--btn-edge); } .btn-primary:hover{filter:none;--rule:6px} .btn-primary:not(:disabled):active{box-shadow:var(--face),0 1px 0 var(--btn-edge);transform:translateY(3px)} @media (hover:hover) and (pointer:fine){ .deck__next::after{content:"space"/"";margin-left:.35rem;padding:.1rem .4rem;border:1px solid;border-radius:5px;font:700 .62rem/1.4 var(--font-body);letter-spacing:.08em;text-transform:uppercase;opacity:.7} } .btn-ghost,.btn[aria-pressed=true]{color:var(--ink)} .btn-ghost:is([data-act^=reset],[data-act^=clear],[data-act^=rem]){color:var(--bad)} [data-act=lock][aria-pressed=true]>.icon{fill:none} .deck__timer,.deck__team{border-color:transparent;background:var(--surface-2)} .deck__minus{border-color:var(--line-strong)} .check input{appearance:none;display:grid;place-content:center;width:1.4rem;height:1.4rem;border:2px solid var(--ink);border-radius:6px;background:var(--surface);transition:background-color .12s} .check input::before{content:"";width:.85rem;height:.85rem;background:var(--lit);-webkit-mask:var(--moon);transform:scale(0);transition:transform .14s var(--ease)} .check input:checked{background:var(--night)} .check input:checked::before{transform:scale(1)} .check input:disabled{opacity:.5} .deck__controls{position:relative;z-index:1} .timer__clock{translate:0 .1em} .timer__bar{background:none;box-shadow:inset 0 0 0 1.5px var(--ink)} .timer__bar>span{background:var(--lit)} .timer[data-phase=idle] .timer__bar>span{opacity:.45} .timer[data-phase=running] .timer__bar>span{transition:width 1s linear} .timer[data-phase=done]{border-color:var(--accent);box-shadow:inset 0 0 0 2px var(--accent)} .deck__option{--sh:var(--ink);border-color:var(--ink);background:var(--lit);color:#26103f;box-shadow:4px 4px 0 var(--sh);--ink-muted:#26103f;--brand:#26103f;--brand-soft:var(--lit);--surface-2:#0003} .deck__or+.deck__option{--sh:var(--lit);background:#26103f;color:#fff6e6;--ink-muted:#fff6e6;--brand:var(--lit);--brand-soft:#26103f;--surface-2:#fff3} @media (hover:hover){ .deck__option:hover{box-shadow:6px 6px 0 var(--sh);transform:translate(-2px,-2px)} } .deck__option:active{box-shadow:1px 1px 0 var(--sh);transform:translate(3px,3px)} .deck__bar>span{background:linear-gradient(90deg,var(--brand) calc(100% - .5rem),var(--accent) 0);transition:width .5s cubic-bezier(.2,.9,.3,1.1)} .card-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,20rem),1fr))} .chip,.link-card{border-color:var(--ink);box-shadow:3px 3px 0 var(--line)} .chip:hover,.link-card:hover{border-color:var(--ink);background:var(--surface);box-shadow:4px 4px 0 0 var(--lit),4px 4px 0 1.5px var(--ink)} .chip:active,.link-card:active{transform:translate(3px,3px);box-shadow:0 0 0 0 var(--lit),0 0 0 1.5px var(--ink)} .link-card__title,.link-list a,.saved__group h2 a{color:var(--ink)} .link-card:hover .link-card__title,.link-list a:hover,.saved__group h2 a:hover{color:var(--link)} .link-list li{line-height:1.3} .link-list__text{margin-top:.15rem} .link-list a,.saved__group h2 a,.category-block h2 a{text-decoration-color:var(--line-strong);text-underline-offset:.18em} .count,.page>.az-group>h2{background:var(--brand);color:var(--brand-ink)} .page>.az-group>h2{display:inline-grid;place-items:center;min-width:2.6rem;height:3.2rem;border-radius:var(--corner)} @supports (text-box:trim-both cap alphabetic){ .page>.az-group>h2{display:inline-block;height:auto;padding:.9rem .6rem;text-align:center;text-box:trim-both cap alphabetic} } .jump a{background:var(--surface);box-shadow:inset 0 0 0 1.5px var(--ink)} .prose h2,.page>section>h2{position:relative;font-size:var(--step-3);letter-spacing:-.02em} .prose h2::before,.page>section>h2::before{ content:""; position:absolute; top:-.95rem; left:0; width:3rem; height:.5rem; background:linear-gradient(var(--accent) 0 0) 0 50%/1rem .3rem no-repeat,radial-gradient(circle at 1.7rem 50%,var(--lit) 0 .24rem,transparent .26rem),radial-gradient(circle at 2.65rem 50%,var(--ink) 0 .17rem,transparent .19rem); } .page>.az-group>h2::before,.page>.category-block>h2::before{content:none} .page>.related,.page>.more{margin-top:var(--space-7)} .category-block h2 a::before{content:"";display:inline-block;width:.86em;height:1.2em;margin-right:.5em;vertical-align:-.24em;border:2px solid #26103f;border-radius:.2em;background:var(--ci) var(--cp)/var(--cs) no-repeat #ffb81f;transform:rotate(-10deg)} .prose a:not(.btn){background:linear-gradient(var(--lit) 0 0) 0 0/0 100% no-repeat;transition:background-size .18s var(--ease)} @media (hover:hover){ .prose a:not(.btn):hover{background-size:100% 100%;color:#26103f} .faq summary:hover,.segmented .pill:not([aria-pressed=true],.is-on,:has(:checked)):hover{background:var(--brand-soft)} } .faq summary::after,.faq details[open]>summary::after{content:"";width:1em;height:1em;color:var(--ink);background:linear-gradient(currentColor 0 0) 50%/.75em 2.5px no-repeat,linear-gradient(currentColor 0 0) 50%/2.5px .75em no-repeat;transition:transform .22s var(--ease),background-size .22s var(--ease)} .faq details[open]>summary::after{transform:rotate(180deg);background-size:.75em 2.5px,2.5px 0} .toast{border:2px solid var(--lit);background:var(--night);color:var(--lit);box-shadow:0 4px 0 var(--btn-edge)} .toast::before{content:"";display:inline-block;width:.9em;height:.9em;margin-right:.5em;vertical-align:-.08em;background:currentColor;-webkit-mask:var(--moon)} .icon{stroke-width:2.5} .icon:has([d^="M5.5 4"],[d^="M7.5 4"],[d^="M8.5 5"],[d^="M9.5 8"],[d^="M6 6"]),[data-bingo-step]>span,.sg__x.is-on::before{stroke:none;background:currentColor;-webkit-mask:var(--ui) calc(var(--i,0)*20%) 0/600% 100%} .icon:has([d^="M7.5 4"]){--i:1} .icon:has([d^="M8.5 5"]){--i:2} .icon:has([d^="M9.5 8"]){--i:3} .icon:has([d^="M6 6"]),.sg__x.is-on::before{--i:4} [data-bingo-step]>span{--i:5;display:block;width:1.375rem;height:1.375rem;font-size:0} [data-bingo-step="-1"]>span{transform:scaleX(-1)} .sg__x{width:1.75rem;height:2.3rem;border:2px solid var(--line-strong);border-radius:6px;background:var(--surface-2);font-size:0;transform:rotate(-6deg)} .sg__x:nth-child(odd){transform:rotate(5deg)} .sg__x.is-on{border-color:var(--ink);background:var(--accent)} .sg__x.is-on::before{content:"";width:1.2rem;height:1.2rem;color:var(--accent-ink)} .notice[data-saved-empty]{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:var(--space-4);border:2px dashed var(--line-strong);background:none} .notice[data-saved-empty]::before{content:"";width:2.4rem;height:3.2rem;border:2px solid var(--ink);border-radius:var(--corner);background:var(--heart) center/1.35rem no-repeat var(--lit);box-shadow:3px 3px 0 var(--line);transform:rotate(-8deg)} .page--text:has(#notfound-title)>.page-head::before{content:"";display:block;width:8rem;aspect-ratio:4/3;margin-bottom:var(--space-4);background:var(--gap) center/contain no-repeat} .site-footer{--ring:var(--lit);border-top-color:var(--night);background:var(--bulbs),var(--wire),var(--night);background-position-y:.6rem;color:var(--on-night)} .site-footer>.wrap::before{content:"";display:block;width:3.25rem;height:3.25rem;margin-bottom:var(--space-5);background:var(--mark) center/contain no-repeat;transform:rotate(-4deg)} .site-footer h2,.footer-note a,.site-footer a:hover{color:var(--lit)} .site-footer a{text-decoration-color:rgb(255 246 230/.35);text-underline-offset:.2em} .site-footer a:hover{text-decoration-color:currentColor} .footer-note,.footer-legal{color:var(--night-dim)} } @media print{ .bingo__foot::before,.tool:not(:has(.bingo))::after{content:"gamenightgenerator.com";background:var(--mark) 0 50%/4.5mm 4.5mm no-repeat;color:#21123a;font-weight:700;-webkit-print-color-adjust:exact;print-color-adjust:exact} .bingo__foot::before{float:left;padding-left:6mm} .tool:not(:has(.bingo))::after{display:block;margin-top:6mm;padding-left:9mm;background-size:7mm 7mm;font:700 9pt/7mm var(--font-display)} } @media screen and (prefers-color-scheme:light){ :root{--warn:#7a4f00} .page{--brand-soft:#ffe9bd} } @media screen and (prefers-color-scheme:dark){ .page{--brand:var(--lit);--brand-ink:var(--night);--brand-soft:var(--line)} .tool{background:var(--surface-2)} .deck__timer,.deck__team{background:var(--surface)} .deck__card{--surface:#fff6e6;--ink:#21123a;--ink-muted:#5b4a6e;--line-strong:#7d718a;--link:#b42c14;--brand:#26103f;--brand-ink:#ffb81f;--brand-soft:#ffe9bd;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink),0 0 3rem rgb(255 191 58/.22)} } @media (prefers-reduced-motion:no-preference){ @keyframes deal{from{transform:translate(-18px,-34px) rotate(-3deg)}} @keyframes gone{from{transform:rotate(3deg) translate(18px,34px)}to{opacity:0;transform:translate(30px,20px) rotate(5deg)}} @keyframes ink{from{opacity:0;transform:translateY(5px)}} @keyframes timeup{50%{background-color:var(--lit)}} @keyframes toast{from{opacity:0;transform:translate(-50%,1rem) rotate(-3deg)}} @keyframes lights{0%,55%{background-size:0 0,auto}40%,70%{background-size:auto}} @keyframes vt-out{to{opacity:0}} @keyframes vt-in{from{opacity:0;transform:translateY(8px)}} .deck__card.is-new,.deck__card.is-new::after{animation:deal .24s cubic-bezier(.2,.9,.3,1.1) both;transform-origin:12% 0} .deck__card.is-new::after{content:"";position:absolute;inset:-2px;z-index:-1;border:2px solid var(--ink);border-radius:inherit;background:var(--surface);pointer-events:none;animation-name:gone}.deck__card.is-new>*{animation:ink .12s .06s var(--ease) both}.timer[data-phase=done]{animation:timeup .4s steps(1,end) 3}.toast{animation:toast .22s cubic-bezier(.2,.9,.3,1.2)}html:has(.page>.hero) .site-header{animation:lights .7s steps(1,end) .15s both}.faq details{interpolate-size:allow-keywords}.faq details::details-content{block-size:0;overflow:clip;opacity:0;transition:block-size .22s var(--ease),opacity .18s var(--ease),content-visibility .22s allow-discrete}.faq details[open]::details-content{block-size:auto;opacity:1}@view-transition{navigation:auto}::view-transition-old(root){animation:vt-out .1s var(--ease) both}::view-transition-new(root){animation:vt-in .2s .04s var(--ease) both}.site-header{view-transition-name:hdr}}@media (prefers-reduced-motion:reduce){.btn-primary:not(:disabled):active,.chip:active,.link-card:active,.deck__option:hover,.deck__option:active{transform:none}}