.arr-board{--tarmac:#121411;--sign:#f5c242;--fg:#efe6d6;--dim:#a8a193;--arr-rule:#262923;background:var(--tarmac);color:var(--fg);font-family:var(--body);border-radius:4px;padding:clamp(18px,2.4vw,32px) clamp(16px,2.6vw,36px) clamp(14px,2vw,24px);position:relative;box-shadow:inset 0 0 0 1px #2c2f29,0 0 0 7px #1d201b}.arr-board :focus-visible{outline-color:var(--sign)}.arr-board:before{content:"";pointer-events:none;background:radial-gradient(circle,#3a3d36 2px,#0000 2.5px) 0 0/10px 10px no-repeat,radial-gradient(circle,#3a3d36 2px,#0000 2.5px) 100% 0/10px 10px no-repeat,radial-gradient(circle,#3a3d36 2px,#0000 2.5px) 0 100%/10px 10px no-repeat,radial-gradient(circle,#3a3d36 2px,#0000 2.5px) 100% 100%/10px 10px no-repeat;position:absolute;inset:8px}.arr-head{border-bottom:2px solid var(--sign);flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 24px;padding-bottom:12px;display:flex}.arr-title{font-family:var(--hand);font-weight:400;font-size:var(--h-l);color:var(--sign);margin:0 0 0 -.03em;line-height:.9}.arr-meta{letter-spacing:.12em;text-transform:uppercase;color:var(--dim);font-variant-numeric:tabular-nums;flex-wrap:wrap;gap:2px 18px;font-size:13px;font-weight:600;display:flex}.arr-next{color:var(--sign)}.arr-cols,.arr-row{grid-template-columns:7.6em minmax(0,1fr) 10.6em 13.8em;align-items:center;column-gap:18px;display:grid}.arr-cols{padding:14px 0 8px;font-size:clamp(15px,1.3vw,18px);line-height:1}.arr-cols span{letter-spacing:.16em;text-transform:uppercase;color:var(--dim);font-size:11px;font-weight:600}.arr-rows{font-size:clamp(15px,1.3vw,18px)}.arr-row{--tile:var(--fg);border-top:1px solid var(--arr-rule);padding:10px 0}.arr-row[data-tone=now]{--st:#8be29a}.arr-row[data-tone=last]{--st:var(--sign)}.arr-row[data-tone=soon]{--st:var(--fg)}.arr-row[data-tone=here]{--st:#8be29a}.arr-row[data-tone=later]{--st:var(--dim)}.arr-row[data-tone=out]{--st:#ff9a82}.arr-flaps{flex-wrap:wrap;gap:4px 0;display:flex}.arr-cells{flex-wrap:nowrap;display:flex}.arr-word{white-space:nowrap;margin-right:.4em;display:inline-flex}.arr-word:last-child{margin-right:0}.arr-tile{--h:1.32em;--top:#2c2f2a;--bot:#252723;width:.84em;height:var(--h);color:var(--tile);text-align:center;perspective:5em;margin-right:2px;font-weight:600;display:inline-block;position:relative}.arr-tile:before,.arr-tile:after,.arr-ft,.arr-fb{white-space:pre;height:calc(50% - .5px);position:absolute;left:0;right:0;overflow:hidden}.arr-tile:before,.arr-ft{line-height:var(--h);border-radius:2px 2px 0 0;top:0}.arr-tile:after,.arr-fb{border-radius:0 0 2px 2px;line-height:0;bottom:0}.arr-tile:before{content:attr(data-c);background:var(--top)}.arr-tile:after{content:attr(data-c);background:var(--bot)}.arr-tile[data-t]:before{content:attr(data-t)}.arr-tile[data-b]:after{content:attr(data-b)}.arr-ft,.arr-fb{visibility:hidden;backface-visibility:hidden}.arr-ft{transform-origin:50% calc(100% + .5px);background:#343731}.arr-fb{transform-origin:50% -.5px;background:#1f211d;transform:rotateX(90deg)}.arr-ft:after,.arr-fb:after{content:attr(data-ch)}.arr-tile[data-f] .arr-ft,.arr-tile[data-f] .arr-fb{visibility:visible;will-change:transform}.arr-tile[data-c=\ ]:not([data-f]):not([data-t]):not([data-b]):before,.arr-tile[data-c=\ ]:not([data-f]):not([data-t]):not([data-b]):after,.arr-tile[data-t=\ ][data-b=\ ]:not([data-f]):before,.arr-tile[data-t=\ ][data-b=\ ]:not([data-f]):after{background:0 0}.arr-time .arr-tile{--tile:var(--sign)}.arr-where .arr-tile{--tile:var(--dim)}.arr-status .arr-tile{--tile:var(--st)}.arr-what{min-width:0}.arr-note{color:var(--dim);flex-wrap:wrap;gap:0 12px;margin-top:5px;font-size:13px;font-weight:500;display:flex}.arr-place{display:none}.arr-row[data-tone=now] .arr-status:before,.arr-row[data-tone=last] .arr-status:before{content:"";background:var(--st);width:7px;height:7px;transition:opacity var(--fast) var(--ease);border-radius:50%;align-self:center;margin:0 8px 0 -15px}.arr-row[data-lamp-wait] .arr-status:before{opacity:0}@media (max-width:760px){.arr-cols{display:none}.arr-row{grid-template-columns:5.6em minmax(0,1fr);grid-template-areas:"time time""what what""place status";gap:7px 10px;padding:11px 0 12px}.arr-time{grid-area:time;font-size:14px}.arr-what{grid-area:what;font-size:16px}.arr-where{display:none}.arr-place{color:var(--sign);grid-area:place;font-size:14px;font-weight:500;display:block}.arr-status{flex-wrap:wrap;grid-area:status;row-gap:4px;font-size:14px}.arr-row[data-tone=now] .arr-status:before,.arr-row[data-tone=last] .arr-status:before{margin-left:-13px}}@media (prefers-reduced-motion:reduce){.arr-ft,.arr-fb{display:none}}@media (max-width:360px){.arr-row{grid-template-columns:4.8em minmax(0,1fr);column-gap:8px}.arr-time,.arr-status,.arr-place{font-size:13px}}.arr-compact .arr-title{font-size:var(--h-m);line-height:1}.arr-compact .arr-head{padding-bottom:10px}.arr-compact .arr-cols{padding:10px 0 6px}.arr-compact .arr-rows,.arr-compact .arr-cols{font-size:clamp(14px,1.15vw,16px)}.arr-compact .arr-row{padding:8px 0}.arr-compact .arr-rows{min-height:calc(var(--rows,0) * (1.32em + 17px))}@media (max-width:760px){.arr-compact .arr-row{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"time status""what what";row-gap:4px;padding:7px 0 8px}.arr-compact .arr-rows{min-height:calc(var(--rows,0) * (2 * 1.32em + 20px));font-size:13px}.arr-compact .arr-time,.arr-compact .arr-status,.arr-compact .arr-what{font-size:13px}.arr-compact .arr-status{justify-content:flex-start;padding-left:14px}.arr-compact .arr-place,.arr-compact .arr-note{display:none}.arr-compact .arr-head{flex-wrap:nowrap;align-items:baseline;gap:12px}.arr-compact .arr-title{flex:none}.arr-compact .arr-meta{text-align:right;letter-spacing:.08em;flex:1;justify-content:flex-end;min-width:0;font-size:11px;line-height:1.3}.arr-compact .arr-next{display:none}}@media (max-width:600px){.arr-compact .arr-row:nth-child(n+3){display:none}.arr-compact .arr-rows{min-height:calc(min(var(--rows,0), 2) * (2 * 1.32em + 20px))}}@media (max-width:359px){.arr-compact .arr-row{grid-template-columns:minmax(0,1fr);grid-template-areas:"time""status""what"}.arr-compact .arr-rows{min-height:calc(min(var(--rows,0), 2) * (3 * 1.32em + 24px))}}.arr-row:has(.arr-row-link){position:relative}.arr-row-link{z-index:1;position:absolute;inset:0}.arr-row-link:focus-visible{outline:2px solid var(--sign,var(--apricot));outline-offset:2px}@media (hover:hover){.arr-row:has(.arr-row-link):hover{background:#ffffff0a}}
