Applies the Afterburn '99 UserStyle to pandatype.org
// ==UserScript==
// @name After Burn 99
// @version 20260716.18.45
// @description Applies the Afterburn '99 UserStyle to pandatype.org
// @author You
// @match *://pandatype.org/*
// @grant GM_addStyle
// @license Mighty
// @namespace https://greasyfork.org/users/1624409
// ==/UserScript==
(function() {
'use strict';
const css = `
:root {
--bg: #16051f !important;
--panel: rgba(35, 9, 50, .91) !important;
--panel-2: rgba(52, 13, 67, .94) !important;
--line: rgba(255, 112, 183, .42) !important;
--track: #260b3d !important;
--text: #fff7f3 !important;
--muted: #d3a8ca !important;
--amber: #ffb14a !important;
--amber-dark: #e65743 !important;
--red: #ff4f7e !important;
--blue: #43efd0 !important;
--green: #56efae !important;
--danger: #ff4f72 !important;
--afterburn-coral: #ff5f6d;
--afterburn-gold: #ffc857;
--afterburn-teal: #43efd0;
--afterburn-purple: #9b5cff;
}
html { min-height: 100%; background: #120419 !important; }
body {
position: relative !important;
isolation: isolate;
overflow-x: hidden;
background-color: #16051f !important;
background-image:
radial-gradient(circle at 15% 16%, rgba(255, 198, 82, .28) 0 2px, transparent 3px),
radial-gradient(circle at 84% 13%, rgba(67, 239, 208, .25) 0 2px, transparent 3px),
linear-gradient(135deg, transparent 0 48%, rgba(255, 113, 179, .10) 49%, transparent 50%),
linear-gradient(180deg, transparent 0 56%, rgba(67, 18, 80, .28) 72%, rgba(17, 3, 29, .78) 100%),
linear-gradient(180deg, #53217b 0%, #b33979 25%, #ff735d 48%, #42135b 72%, #16051f 100%) !important;
background-size: 96px 96px, 124px 124px, 58px 58px, cover, cover !important;
background-attachment: fixed !important;
color: var(--text) !important;
font-family: "Segoe UI", Inter, system-ui, sans-serif !important;
}
body::before {
content: "";
position: fixed;
z-index: -1;
left: 50%;
top: 9vh;
width: clamp(220px, 31vw, 470px);
aspect-ratio: 1;
border-radius: 50%;
transform: translateX(-50%);
background: repeating-linear-gradient(180deg, #ffd166 0 18px, #ff765e 19px 27px, transparent 28px 36px);
opacity: .38;
pointer-events: none;
filter: drop-shadow(0 0 42px rgba(255, 119, 91, .45));
}
body::after {
content: "";
position: fixed;
z-index: -2;
left: 0;
right: 0;
bottom: 0;
height: 36vh;
opacity: .58;
pointer-events: none;
background:
linear-gradient(90deg, transparent 48%, rgba(255, 198, 87, .42) 49% 51%, transparent 52%) center / 170px 100%,
repeating-linear-gradient(90deg, rgba(67, 239, 208, .18) 0 1px, transparent 1px 84px),
repeating-linear-gradient(0deg, rgba(255, 95, 109, .16) 0 1px, transparent 1px 42px);
transform: perspective(330px) rotateX(58deg) scale(1.45);
transform-origin: bottom;
mask-image: linear-gradient(to top, #000 15%, transparent 88%);
}
#app { max-width: 1240px !important; }
.brand::after {
content: "AFTERBURN '99";
color: var(--afterburn-gold);
font: italic 900 12px/1 "Arial Black", Impact, sans-serif;
letter-spacing: .16em;
padding: 7px 12px;
border: 1px solid rgba(255, 184, 82, .58);
border-radius: 999px;
background: rgba(52, 10, 65, .82);
box-shadow: 0 0 18px rgba(255, 101, 127, .24);
}
.navbar, .panel, .garage-panel, .passage-box, .modal-box, .shop-card, .ach-card, .stat-card, .userpill, .lb-table, .premium-panel, .season-scroll {
background: linear-gradient(145deg, rgba(59, 14, 74, .94), rgba(25, 5, 42, .95)) !important;
border: 1px solid rgba(255, 112, 181, .38) !important;
box-shadow: 0 18px 45px rgba(0, 0, 0, .30), inset 0 1px 0 rgba(255, 235, 240, .08) !important;
backdrop-filter: blur(12px);
}
/* Add remaining CSS rules here... */
`;
GM_addStyle(css);
})();