body.fun-page:has(.tl){background:#090909;color:#fff}
body.fun-page:has(.tl) .fun-shell{width:min(1150px,calc(100% - 32px));padding:22px 0 80px}
.tl{font:18px/1.5 "Atkinson Hyperlegible",Arial,sans-serif;color:#fff}
.tl *{box-sizing:border-box}
.tl button{font:inherit;cursor:pointer}
.tl-back{display:inline-block;color:#fff;text-decoration:none;font-weight:800;border-bottom:3px solid #f0182b;padding:8px 0;margin-bottom:25px}
.tl-back:hover,.tl-back:focus-visible{color:#ffc928}
.tl-hero{background:linear-gradient(115deg,#5c0b16,#16080b 75%,#090909);border-bottom:8px solid #f0182b;padding:clamp(30px,6vw,65px);display:flex;align-items:center;justify-content:space-between;gap:20px;overflow:hidden}
.tl-hero h1{font-size:clamp(3.6rem,9vw,8rem);line-height:.9;letter-spacing:-.07em;margin:0 0 25px}
.tl-hero h1 em{font-style:normal;color:#f0182b}
.tl-hero p{max-width:620px;font-size:clamp(18px,2vw,22px);margin:0}
.tl-hero-year{font-weight:900;color:#ffc928;font-size:clamp(3rem,6vw,6rem);line-height:1.1;white-space:nowrap;opacity:.7}
.tl-intro,.tl-play{background:#202020;margin-top:22px;padding:clamp(24px,4vw,45px)}
.tl-intro h2{font-size:clamp(2.5rem,5vw,4.5rem);line-height:1;margin:0 0 25px}
.tl-intro p{max-width:68ch;font-size:19px}
.tl-primary{background:#f0182b;color:#fff;border:2px solid #f0182b;padding:15px 25px;min-height:56px;font-weight:900!important}
.tl-primary:hover,.tl-primary:focus-visible{background:#ffc928;color:#050505;border-color:#ffc928}
.tl-toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;border-bottom:1px solid #555;padding-bottom:24px}
.tl-toolbar>div{display:grid;gap:5px}
.tl-toolbar strong{font-size:clamp(1.5rem,3vw,2.4rem);line-height:1.1}
.tl-toolbar span{font-size:15px;color:#ccc}
.tl-toolbar button{background:transparent;border:1px solid #aaa;color:#fff;font-weight:800;padding:10px 15px}
.tl-toolbar button:hover,.tl-toolbar button:focus-visible{background:#ffc928;color:#050505}
.tl-instruction{font-size:16px;color:#ddd;margin:20px 0}
.tl-list{padding:0;margin:22px 0;list-style:none;display:grid;gap:9px}
.tl-list li{display:grid;grid-template-columns:65px minmax(0,1fr) auto;align-items:center;background:#101010;border:2px solid #484848;min-height:95px}
.tl-list li.tl-correct{border-color:#ffc928}
.tl-position{font-size:30px;font-weight:900;color:#f0182b;text-align:center}
.tl-event{padding:14px 8px}
.tl-event strong{font-size:clamp(17px,2vw,23px);line-height:1.15;display:block}
.tl-event small{display:block;color:#ffc928;margin-top:6px;font-weight:800}
.tl-event p{color:#ddd;font-size:16px;margin:9px 0 0}
.tl-year{display:block;color:#ffc928;font-weight:900;font-size:24px;margin-top:5px}
.tl-controls{display:flex;gap:6px;padding:10px}
.tl-controls button{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#333;border:1px solid #777;color:#fff;min-width:62px;min-height:60px;font-size:23px;font-weight:900}
.tl-controls button span{font-size:12px}
.tl-controls button:hover:not(:disabled),.tl-controls button:focus-visible{background:#f0182b;border-color:#f0182b}
.tl-controls button:disabled{opacity:.25;cursor:not-allowed}
.tl-bottom{border-top:1px solid #555;padding-top:24px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.tl-bottom p{font-size:16px;color:#ffc928}
.tl-win{background:#4c0b16;padding:25px;margin:20px 0;border-left:6px solid #ffc928}
.tl-win h2{font-size:clamp(2rem,4vw,3.2rem);line-height:1;margin:0 0 12px}
.tl-win p{margin:0}
@media(max-width:700px){.tl-hero-year{display:none}.tl-list li{grid-template-columns:45px minmax(0,1fr) auto}.tl-position{font-size:22px}.tl-controls{flex-direction:column;padding:6px}.tl-controls button{min-width:47px;min-height:42px;font-size:19px}.tl-controls button span{font-size:11px}.tl-event{padding:10px 4px}}
@media(max-width:380px){.tl-list li{grid-template-columns:32px minmax(0,1fr) 54px}.tl-controls{min-width:0;padding:3px;gap:3px}.tl-controls button{min-width:44px;width:44px;min-height:42px;padding:2px;font-size:17px}.tl-controls button span{font-size:9px;overflow-wrap:anywhere}.tl-event{min-width:0;overflow-wrap:anywhere}.tl-position{font-size:17px}}
@media(max-width:380px){.tl-bottom{gap:10px}.tl-bottom button{max-width:100%;min-width:0;white-space:normal;overflow-wrap:anywhere}.tl-bottom{flex-direction:column;align-items:stretch}}
@media(max-width:380px){.tl-toolbar{flex-wrap:wrap;gap:12px}.tl-toolbar>div{min-width:0;max-width:100%}.tl-toolbar button{max-width:100%;margin-left:0}}