.board{perspective:900px}.board[data-state=settled]{perspective:none}.board[data-state=settled] .board-flap{transform-style:flat}.board-housing{border:1px solid color-mix(in oklab, var(--color-paper) 16%, transparent);border-radius:var(--radius-card);background:color-mix(in oklab, var(--color-night) 80%, transparent);max-inline-size:44rem;padding:.625rem}@media (min-width:64rem){.board-housing{padding:1rem 1.25rem 1.25rem}}.board:is([data-phase=ssr],[data-state=waiting]) .board-row [data-final]{opacity:0}.board-grid{grid-template-columns:2.75rem minmax(0,1fr) 3.5rem 6rem;align-items:stretch;gap:.375rem;display:grid}@media not (min-width:64rem){.board-grid>:first-child .board-flap,.board-grid>.board-flap:first-child{padding-inline:.375rem}}@media (min-width:64rem){.board-grid{grid-template-columns:4.5rem minmax(0,1fr) 5.5rem 9rem;gap:.5rem}}.board-flap{background:linear-gradient(to bottom, color-mix(in oklab, var(--color-deep-blue) 45%, var(--color-night)) 50%, var(--color-night) 50%);block-size:100%;min-block-size:2.25rem;inline-size:100%;transform-style:preserve-3d;backface-visibility:hidden;border-radius:.25rem;grid-template-columns:minmax(0,1fr);align-items:center;padding:.375rem .625rem;display:grid;position:relative}@media (min-width:64rem){.board-flap{min-block-size:2.75rem;padding-block:.5rem}}.board-flap>span{white-space:nowrap;grid-area:1/1;position:relative}.board-name .board-flap>span{text-overflow:ellipsis;overflow:hidden}.board-flap:before{content:"";background:var(--color-night);pointer-events:none;block-size:2px;position:absolute;inset-block-start:calc(50% - 1px);inset-inline:0}.board[data-live=on] [data-final]{visibility:hidden}.board[data-live=off] [data-live]{display:none}.board-tail{display:inline-grid}.board-tail>span{grid-area:1/1}.board [data-tail-plain]{opacity:0}@media (prefers-reduced-motion:no-preference){.board-tail>span{transition:opacity .6s cubic-bezier(.215,.61,.355,1)}.board:is([data-phase=ssr],[data-state=waiting],[data-state=running]) [data-tail-gradient]{opacity:0}.board:is([data-phase=ssr],[data-state=waiting],[data-state=running]) [data-tail-plain]{opacity:1}}@media (prefers-reduced-motion:reduce){.board-row{animation:.6s cubic-bezier(.215,.61,.355,1) both board-row-in;animation-delay:calc(var(--row,0) * 60ms)}}@keyframes board-row-in{0%{opacity:0}to{opacity:1}}
