.my-replays-content { max-width: 1480px; }
.my-replays-heading { align-items: end; display: flex; justify-content: space-between; margin-bottom: 1.25rem; }
.my-replays-hero { align-items: center; display: flex; justify-content: space-between; gap: 1.5rem; }
.my-replays-hero-upload { background: #f36c12; border: 1px solid #f36c12; color: #fff !important; font-size: .82rem; font-weight: 800; letter-spacing: .08em; padding: .72rem 1rem; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
.my-replays-hero-upload:hover { background: #ff872e; border-color: #ff872e; color: #fff !important; }
.my-replays-heading span, .my-replay-card-label { color: #2c9c5b; display: block; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.my-replays-heading h2 { color: #173a55; font-size: 1.7rem; font-weight: 700; margin: .25rem 0 0; }
.all-replays-content .my-replays-heading h1 { color: #f2eee0; }
.all-replays-content .replay-archive-intro { border-left: 4px solid #d7ad56; padding-left: 1rem; }
.all-replays-content .replay-archive-intro h1 { color: #f2eee0; font-family: "Arial Narrow", Arial, sans-serif; font-size: clamp(2rem, 3vw, 3rem); font-weight: 400; letter-spacing: .01em; line-height: 1; text-shadow: 0 2px 5px rgba(0,0,0,.45); }
.all-replays-content .replay-archive-intro .replay-hero-subtitle { color: #b8cad8; font-size: 1rem; }
.my-replays-page-intro { align-items: center; }
.my-replays-page-intro > div { border-left: 4px solid #d7ad56; padding-left: 1rem; }
.my-replays-page-intro h1 { color: #f2eee0; font-family: "Arial Narrow", Arial, sans-serif; font-size: clamp(2rem, 3vw, 3rem); font-weight: 400; letter-spacing: .01em; line-height: 1; text-shadow: 0 2px 5px rgba(0,0,0,.45); }
.my-replays-page-intro .replay-hero-subtitle { color: #b8cad8; font-size: 1rem; }
.my-replays-page-intro .replay-download { color: #fff; font-weight: 900; }
.all-replays-content .my-replays-heading .replay-download { color: #fff; font-weight: 900; }
.my-replay-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.my-replay-card { background: #fff; border: 1px solid #d7e1e8; box-shadow: 0 8px 24px rgba(19,45,67,.08); min-width: 0; overflow: hidden; }
.my-replay-poster { background-color: #142b3e; background-image: linear-gradient(90deg, rgba(8,23,37,.8), rgba(11,29,46,.25)), var(--nation-flag, none); background-position: center; background-size: cover; height: 230px; overflow: hidden; position: relative; }
.my-replay-poster::after { background: linear-gradient(0deg, rgba(6,18,30,.84), transparent 58%); content: ''; inset: 0; pointer-events: none; position: absolute; }
.my-replay-poster-copy { left: 1.3rem; position: absolute; right: 1.3rem; top: 1.15rem; z-index: 3; }
.my-replay-poster-copy span { color: #66dc99; display: block; font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-shadow: 0 2px 5px rgba(0,0,0,.75); text-transform: uppercase; }
.my-replay-poster .my-replay-card-label { color: #66dc99; }
.my-replay-card h2 { font-size: 1.32rem; line-height: 1.2; margin: .3rem 0 0; max-width: 75%; }
.my-replay-poster h2 { color: #fff; font-size: 1.42rem; font-weight: 700; margin: .32rem 0 0; text-shadow: 0 2px 6px rgba(0,0,0,.9); }
.my-replay-card h2 a { color: #173a55; text-decoration: none; }
.my-replay-poster h2 a { color: #fff; text-shadow: 0 2px 5px rgba(0,0,0,.7); }
.my-replay-card h2 a:hover { color: #62d995; }
.my-replay-poster > img { bottom: .15rem; filter: drop-shadow(0 14px 8px rgba(0,0,0,.55)); height: 162px; left: 50%; max-width: 80%; object-fit: contain; position: absolute; transform: translateX(-50%); width: 360px; z-index: 1; }
.my-replay-ship-name, .my-replay-ship-meta { bottom: .9rem; color: #fff; left: 1.3rem; position: absolute; text-shadow: 0 2px 4px #000; z-index: 3; }
.my-replay-ship-name strong, .my-replay-ship-meta strong { display: block; font-size: 1.12rem; }
.my-replay-ship-name span, .my-replay-ship-meta span { color: #d6e5ee; display: block; font-size: .78rem; margin-top: .12rem; }
.my-replay-card-bottom { align-items: stretch; display: flex; justify-content: space-between; }
.my-replay-actions { align-items: center; display: flex; flex: 0 0 auto; gap: .65rem; }
.my-replay-actions a { color: #2b7550; font-size: .78rem; font-weight: 800; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
.my-replay-actions button { background: #fff; border: 1px solid #bf4b52; color: #a7353e; font-size: .72rem; font-weight: 800; letter-spacing: .06em; padding: .42rem .6rem; text-transform: uppercase; }
.my-replay-actions button:hover { background: #bf4b52; color: #fff; }
.my-replay-facts { display: grid; flex: 1 1 auto; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.my-replay-facts > div { border-right: 1px solid #e0e8ed; min-width: 0; padding: .9rem 1.1rem 1rem; }
.my-replay-facts > div:last-child { border-right: 0; }
.my-replay-facts span { color: #708090; display: block; font-size: .66rem; font-weight: 800; letter-spacing: .1em; margin-bottom: .35rem; text-transform: uppercase; }
.my-replay-facts strong { color: #173a55; display: block; font-size: 1rem; overflow-wrap: anywhere; }
.my-replay-facts small { color: #728292; display: block; font-size: .78rem; line-height: 1.35; margin-top: .32rem; }.my-replay-card-bottom .my-replay-actions { border-left: 1px solid #e0e8ed; padding: .85rem 1rem; }
@media (min-width: 1200px) { .all-replays-content .my-replay-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }.all-replays-content .my-replay-poster { height: 205px; }.all-replays-content .my-replay-poster > img { height: 148px; max-width:80%; width:300px; } }
@media (max-width: 900px) { .my-replay-grid { grid-template-columns: 1fr; } }
@media (max-width: 575.98px) { .my-replays-heading, .my-replays-hero { align-items: flex-start; flex-direction: column; gap: .8rem; }.my-replay-card-bottom { flex-direction: column; }.my-replay-card-bottom .my-replay-actions { border-left: 0; border-top: 1px solid #e0e8ed; }.my-replay-actions { width: 100%; }.my-replay-actions form { margin-left: auto; }.my-replay-facts { grid-template-columns: 1fr; }.my-replay-facts > div { border-bottom: 1px solid #e0e8ed; border-right: 0; }.my-replay-facts > div:last-child { border-bottom: 0; } }
