API tools faq
paste
Velvet_RidingHood

Endeavor (Enji Todoroki)

Velvet_RidingHood
Aug 9th, 2026 (edited)
13
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 21.33 KB | Source Code | 0 0
raw download clone embed print report
  1. Note: The base for this isn't mine! I did tweek it and add new things to it. Here is the link to the base of it I used.
  2.  
  3. Link: https://janitorai.com/characters/2e3e3206-787c-4779-816d-20a48d078f5c_character-coffee-shop-free-css-theme
  4.  
  5. <style>
  6. .css-1wfbrwg div:first-child:hover{
  7. box-shadow: none!important;
  8. }
  9. </style>
  10.  
  11. <style>
  12. .css-1uodvt1 {
  13. display: flex !important;
  14. flex-direction: column !important;
  15. align-items: center !important;
  16. gap: 15px !important;
  17. text-align: center !important;
  18. }
  19.  
  20. .css-18bnokj {
  21. order: 1 !important;
  22. }
  23.  
  24. .css-o5an2m,
  25. .css-hjkukh {
  26. order: 2 !important;
  27. }
  28.  
  29. .css-1x04uxb {
  30. order: 3 !important;
  31. }
  32.  
  33. .css-18bnokj {
  34. width: 300px !important;
  35. height: 300px !important;
  36. border: 5px solid #ff1a00 !important;
  37. border-radius: 50% !important;
  38. object-fit: cover !important;
  39. padding: 5px !important;
  40. background-color: #0f121d !important;
  41. box-shadow: 0 0 25px rgba(255, 26, 0, 0.8), 0 0 12px rgba(255, 102, 0, 0.7) !important;
  42. }
  43. </style>
  44.  
  45. <style>
  46. .profile-title-heading {
  47. color: #ffffff !important;
  48. text-shadow: 0 0 10px #ff1a00, 2px 2px 0px #0f121d !important;
  49. font-size: 1.6rem !important;
  50. text-align: center !important;
  51.  
  52. background: #0f121d !important;
  53. padding: 12px 11px !important;
  54. border-radius: 19px !important;
  55. border: 2px solid #ff1a00 !important;
  56. display: inline-block !important;
  57. margin-top: 10px !important;
  58. }
  59. </style>
  60.  
  61. <style>
  62. .profile-title-heading {
  63. font-family: 'Impact', 'Trebuchet MS', sans-serif !important;
  64. font-weight: 500 !important;
  65. text-transform: uppercase !important;
  66. letter-spacing: 1.5px !important;
  67. }
  68. </style>
  69.  
  70. <style>
  71. .css-1uodvt1 {
  72. padding-top: 0px;
  73. flex-direction: column;
  74. justify-items: center;
  75. text-align: center;
  76. }
  77. </style>
  78.  
  79. <style>
  80. .profile-title-heading::after {
  81. content: " | ๐Ÿ”ฅ๐Ÿ’ฅ๐Ÿ‘‘" !important;
  82. display: inline-block !important;
  83. font-size: 1.5rem !important;
  84. margin-left: 4px !important;
  85. vertical-align: middle !important;
  86. }
  87. </style>
  88.  
  89. <style>
  90. .character-list-pagination-flex {
  91. align-items: center;
  92. flex-direction: column;
  93. gap: 12px;
  94. }
  95.  
  96. .profile-badge-flex-outer {
  97. background: #0f121d;
  98. color: #ff1a00 !important;
  99. border: 2px solid #ff1a00 !important;
  100. border-radius: 6px;
  101. font-family: 'Trebuchet MS', sans-serif;
  102. box-shadow: 0 0 12px rgba(255, 26, 0, 0.5);
  103. text-shadow: 0 0 6px rgba(255, 102, 0, 0.6);
  104. }
  105.  
  106. .profile-character-search-input {
  107. background: #181c2b;
  108. color: #ffffff;
  109. caret-color: #ff1a00;
  110. font-family: 'Trebuchet MS', sans-serif;
  111. }
  112.  
  113. .profile-character-search-input,
  114. .profile-character-search-input:is(:hover, :focus) {
  115. border: 2px solid #ff1a00;
  116. border-radius: 8px 0 0 8px;
  117. box-shadow: 0 0 10px rgba(255, 26, 0, 0.7);
  118. }
  119.  
  120. .profile-character-search-input::placeholder {
  121. color: #ff1a00a0;
  122. }
  123.  
  124. .profile-character-search-input ~ div svg {
  125. color: #ff1a00 !important;
  126. transform: scale(1.3);
  127. }
  128.  
  129. .profile-filter-button {
  130. background: #181c2b !important;
  131. border: 2px solid #ff1a00;
  132. border-radius: 6px;
  133. }
  134.  
  135. .profile-filter-button svg {
  136. color: #ff1a00 !important;
  137. }
  138.  
  139. #root ~ *:has(> .profile-filter-modal-modal-overlay)
  140. [data-focus-lock-disabled] > * > * {
  141. background: #0f121d !important;
  142. border: 2px solid #ff1a00;
  143. box-shadow: 0 0 20px rgba(255, 26, 0, 0.7);
  144. }
  145.  
  146. .profile-filter-modal-body-tags-flex-box-heading {
  147. text-align: center;
  148. font-family: 'Trebuchet MS', sans-serif;
  149. color: #ffffff;
  150. letter-spacing: 1px;
  151. }
  152.  
  153. [class*="_tagsContainer_"] {
  154. background: #0f121d;
  155. border: 2px solid #ff1a00;
  156. }
  157.  
  158. [class*="_collapsedContainer_"] [class*="_tag_"] {
  159. border: 1px solid #ff1a00;
  160. background: #181c2b;
  161. color: #ffffff;
  162. }
  163.  
  164. [class*="_collapsedContainer_"] [class*="_tag_"]:not([class*="_tagSelected_"]):hover {
  165. background: #ff1a00;
  166. color: #ffffff;
  167. box-shadow: 0 0 8px rgba(255, 26, 0, 0.8);
  168. }
  169.  
  170. [class*="_collapsedContainer_"] [class*="_tagSelected_"] {
  171. background: #ff6600;
  172. color: #ffffff;
  173. box-shadow: 0 0 10px rgba(255, 102, 0, 0.8);
  174. }
  175.  
  176. [class*="_navigationButton"] {
  177. background: #181c2b;
  178. border: 1px solid #ff1a00;
  179. color: #ffffff;
  180. }
  181.  
  182. #root .react-select__control {
  183. background: #181c2b;
  184. border: 2px solid #ff1a00 !important;
  185. }
  186.  
  187. #root .react-select__single-value {
  188. color: #ffffff;
  189. font-family: 'Trebuchet MS', sans-serif;
  190. }
  191.  
  192. #root .react-select__dropdown-indicator svg {
  193. color: #ff1a00;
  194. }
  195.  
  196. .profile-pagination-prev-hstack svg {
  197. color: #ff1a00;
  198. }
  199.  
  200. .profile-badge-flex-outer {
  201. height: 45px;
  202. background: #0f121d !important;
  203. color: #ff1a00 !important;
  204. box-shadow: 0 0 12px rgba(255, 26, 0, 0.4);
  205. border: none !important;
  206. border-bottom: 3px solid #ff6600 !important;
  207. border-radius: 0;
  208. font-family: 'Trebuchet MS', sans-serif;
  209. letter-spacing: 1px;
  210. text-shadow: 0 0 6px rgba(255, 102, 0, 0.5);
  211. }
  212.  
  213. .profile-badge-flex-outer,
  214. .profile-badge-total-text::after {
  215. font-size: 1.0rem !important;
  216. }
  217.  
  218. .profile-badge-total-text {
  219. font-size: 0 !important;
  220. }
  221.  
  222. .profile-badge-total-text::after {
  223. content: "No. 1 Hero's Roster ๐Ÿ”ฅ";
  224. letter-spacing: 1px;
  225. color: #ffffff;
  226. }
  227.  
  228. .profile-tabs-wrapper {
  229. visibility: hidden !important;
  230. }
  231. </style>
  232.  
  233. <style>
  234. .torn-paper {
  235. background-color: #0f121d !important;
  236. color: #ffffff !important;
  237. padding: 30px !important;
  238. border-radius: 6px !important;
  239. font-family: 'Trebuchet MS', sans-serif !important;
  240. position: relative !important;
  241. box-shadow: 0 5px 15px rgba(0, 0, 0, 0.6) !important;
  242. margin: -9px auto !important;
  243. max-width: 100% !important;
  244. border: 3px solid #ff1a00 !important;
  245. }
  246.  
  247. .torn-paper h3 {
  248. text-transform: uppercase !important;
  249. border-bottom: 2px solid #ff6600 !important;
  250. margin-bottom: 15px !important;
  251. padding-bottom: 5px !important;
  252. color: #ff1a00 !important;
  253. }
  254. </style>
  255.  
  256. <div class="torn-paper">
  257. <h3>Proclamation of the No. 1 ๐Ÿ”ฅ</h3>
  258. <p>I will not ask for your approval. I will fulfill my duty as the Symbol of Peace and lead the next generation into the future. JUST WATCH ME! ๐Ÿ”ฅ๐Ÿ’ฅ</p>
  259. </div>
  260.  
  261. <style>
  262. .torn-paper {
  263. position: relative !important;
  264. }
  265.  
  266. .torn-paper::before {
  267. content: "๐Ÿ”ฅ๐Ÿ’ฅ หšโ‚Šโ€ง" !important;
  268. position: absolute !important;
  269. top: 5px !important;
  270. left: 5px !important;
  271. font-size: 1.2rem !important;
  272. z-index: 1 !important;
  273. }
  274.  
  275. .torn-paper::after {
  276. content: "ห™โœงห–ยฐ๐Ÿ‘‘ PROMINENCE BURN! เผ˜ โ‹†๏ฝกหš" !important;
  277. position: absolute !important;
  278. bottom: 5px !important;
  279. right: 5px !important;
  280. font-size: 1.2rem !important;
  281. z-index: 1 !important;
  282. }
  283. </style>
  284.  
  285. <div class="cafe-button-container">
  286. <a href="#" class="cafe-btn">Button</a>
  287. <a href="#" class="cafe-btn">Button</a>
  288. <a href="#" class="cafe-btn">Button</a>
  289. </div>
  290.  
  291. <style>
  292. .cafe-button-container {
  293. display: flex;
  294. justify-content: center;
  295. gap: 15px;
  296. margin: 20px 0;
  297. }
  298.  
  299. .cafe-btn {
  300. background: #0f121d !important;
  301. color: #ff1a00 !important;
  302. padding: 10px 25px !important;
  303. border: 2px solid #ff1a00 !important;
  304. border-radius: 25px !important;
  305. font-family: 'Trebuchet MS', sans-serif !important;
  306. font-weight: bold !important;
  307. text-decoration: none !important;
  308. transition: 0.3s !important;
  309. box-shadow: 2px 4px 6px rgba(0,0,0,0.5) !important;
  310. }
  311.  
  312. .cafe-btn:hover {
  313. background: #ff1a00 !important;
  314. color: #ffffff !important;
  315. border: 2px solid #ff6600 !important;
  316. transform: translateY(-3px) !important;
  317. box-shadow: 0 0 15px rgba(255, 26, 0, 0.9) !important;
  318. cursor: pointer;
  319. }
  320. </style>
  321.  
  322. <div class="wood-divider"></div>
  323. <style>
  324. .wood-divider {
  325. width: 80%;
  326. height: 12px;
  327. margin: 20px auto;
  328. border-radius: 6px;
  329. background: repeating-linear-gradient(
  330. -45deg,
  331. #0f121d,
  332. #0f121d 12px,
  333. #ff1a00 12px,
  334. #ff1a00 24px,
  335. #ff6600 24px,
  336. #ff6600 36px
  337. );
  338. box-shadow: 0 2px 8px rgba(255, 26, 0, 0.6);
  339. }
  340. </style>
  341.  
  342. <div class="cork-board">
  343. <h2 class="board-title">Agency Orders</h2>
  344. <div class="pinned-note">
  345. <p><strong>Prominence Burn</strong><br>Concentrate Hellflame to absolute heat limits. Vaporize all threats on impact!</p>
  346. </div>
  347. <div class="pinned-note">
  348. <p><strong>Sidekick Protocol</strong><br>Hawks and Agency staff standby. Immediate response for high-tier villain threats!</p>
  349. </div>
  350. <div class="pinned-note">
  351. <p><strong>Atonement & Duty</strong><br>Become a father and hero worthy of the title. No short cuts, no excuses.</p>
  352. </div>
  353. </div>
  354.  
  355. <style>
  356. .cork-board {
  357. background-color: #0f121d !important;
  358. border: 4px solid #ff1a00 !important;
  359. padding: 20px !important;
  360. margin: 20px auto !important;
  361. max-width: 500px !important;
  362. box-shadow: 0 0 20px rgba(255, 26, 0, 0.7) !important;
  363. border-radius: 12px !important;
  364. }
  365.  
  366. .cork-board h2 {
  367. font-family: 'Impact', sans-serif !important;
  368. color: #ff1a00 !important;
  369. font-size: 2rem !important;
  370. text-transform: uppercase !important;
  371. letter-spacing: 3px !important;
  372. text-align: center !important;
  373. text-shadow: 2px 2px #ff6600 !important;
  374. margin: 0 !important;
  375. padding: 10px 0 !important;
  376. background: transparent !important;
  377. }
  378.  
  379. .pinned-note {
  380. background-color: #181c2b !important;
  381. color: #ffffff !important;
  382. padding: 15px !important;
  383. margin: 10px 0 !important;
  384. border-radius: 8px !important;
  385. font-family: 'Trebuchet MS', sans-serif !important;
  386. border-left: 5px solid #ff6600 !important;
  387. position: relative !important;
  388. box-shadow: 3px 3px 5px rgba(0,0,0,0.5) !important;
  389. }
  390.  
  391. .pinned-note::before {
  392. content: "๐Ÿ”ฅ" !important;
  393. position: absolute !important;
  394. top: -12px !important;
  395. right: 15px !important;
  396. font-size: 1rem !important;
  397. }
  398. </style>
  399.  
  400. <div class="status-indicator">
  401. <div class="status-dot"></div>
  402. <span class="status-text">HELLFLAME: ACTIVE ๐Ÿ”ฅ</span>
  403. </div>
  404.  
  405. <style>
  406. .status-indicator {
  407. position: absolute !important;
  408. top: 300px !important;
  409. left: 60px !important;
  410. display: flex !important;
  411. align-items: center !important;
  412. gap: 5px !important;
  413. background: rgba(15, 18, 29, 0.95) !important;
  414. padding: 6px 12px !important;
  415. border-radius: 15px !important;
  416. border: 1px solid #ff1a00 !important;
  417. z-index: 10 !important;
  418. box-shadow: 0 0 12px rgba(255, 26, 0, 0.8) !important;
  419. }
  420.  
  421. .status-dot {
  422. width: 10px !important;
  423. height: 10px !important;
  424. background-color: #ff1a00 !important;
  425. border-radius: 50% !important;
  426. box-shadow: 0 0 8px #ff1a00 !important;
  427. }
  428.  
  429. .status-text {
  430. color: #ffffff !important;
  431. font-family: 'Trebuchet MS', sans-serif !important;
  432. font-weight: bold !important;
  433. font-size: 0.8rem !important;
  434. }
  435.  
  436. @media (max-width: 768px) {
  437. .status-indicator {
  438. top: 300px !important;
  439. left: 5px !important;
  440. padding: 3px 6px !important;
  441. }
  442. .status-text {
  443. font-size: 0.7rem !important;
  444. }
  445. }
  446. </style>
  447.  
  448. <div class="wood-divider"></div>
  449.  
  450. <style>
  451. .profile-character-card-wrapper {
  452. margin-bottom: 0.5rem;
  453. transition: 500ms ease;
  454. }
  455. .profile-character-card-wrapper, .profile-character-card-wrapper > div:empty {
  456. background: transparent !important;
  457. box-shadow: none;
  458. }
  459. .profile-character-card-wrapper:hover {
  460. box-shadow: none;
  461. transform: translateY(-4px) scale(1.01);
  462. }
  463. .profile-character-card-stack {
  464. background: #0f121d;
  465. border: 2px solid #ff1a00;
  466. border-radius: 15px;
  467. box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
  468. }
  469. .profile-character-card-stack-link-component {
  470. display: flex;
  471. flex-direction: column-reverse;
  472. flex-wrap: nowrap;
  473. justify-content: center;
  474. }
  475.  
  476. .profile-character-card-name-box {
  477. color: #ff1a00;
  478. font-family: 'Impact', sans-serif;
  479. font-size: 1.1rem;
  480. letter-spacing: 1px;
  481. text-transform: uppercase;
  482. text-shadow: 1px 1px 2px #ff6600;
  483. text-align: center;
  484. }
  485.  
  486. .profile-character-card-stats-box {
  487. position: absolute;
  488. display: flex;
  489. top: -0.75rem;
  490. right: unset;
  491. align-content: center;
  492. align-items: center;
  493. justify-content: center;
  494. width: 100%;
  495. }
  496. .profile-character-card-stats-box * {
  497. width: 100%;
  498. }
  499. .profile-character-card-ribbon {
  500. position: static;
  501. overflow: visible;
  502. filter: none;
  503. }
  504. .profile-character-card-ribbon-wrap {
  505. padding: 0;
  506. clip-path: polygon(25% 0, 75% 0, 70% 50%, 75% 100%, 25% 100%, 30% 50%);
  507. box-shadow: none;
  508. background: #ff6600;
  509. overflow: visible;
  510. border-radius: 0;
  511. transition: all 500ms;
  512. }
  513. .profile-character-cards-chat-count-tbmessages {
  514. display: none;
  515. }
  516. .profile-character-card-chats-count::before {
  517. content: "| ๐Ÿ”ฅ ";
  518. font-weight: normal;
  519. }
  520. .profile-character-card-chats-count::after {
  521. content: " Flames |";
  522. font-weight: normal;
  523. }
  524. .profile-character-card-chats-count {
  525. text-align: center;
  526. color: #ffffff;
  527. font-family: 'Trebuchet MS', sans-serif;
  528. font-weight: bold;
  529. }
  530.  
  531. .profile-character-card-avatar-aspect-ratio {
  532. margin: 10px;
  533. }
  534. .profile-character-card-avatar-image {
  535. border-radius: 8px;
  536. border: 2px solid #ff1a00;
  537. }
  538.  
  539. .profile-character-card-creator-name-link {
  540. display: none;
  541. }
  542.  
  543. .profile-character-card-description-markdown-container * {
  544. font-family: 'Trebuchet MS', sans-serif;
  545. color: #ffffff !important;
  546. text-align: center !important;
  547. }
  548.  
  549. .profile-character-card-star-line {
  550. border-color: #ff1a00;
  551. }
  552. .profile-character-card-star {
  553. display: none;
  554. }
  555. .profile-character-card-star-line::after {
  556. content: "๐Ÿ”ฅ๐Ÿ’ฅ";
  557. position: absolute;
  558. color: #ff1a00;
  559. font-size: 0.9rem;
  560. right: -25px;
  561. top: -15px;
  562. }
  563.  
  564. .profile-character-card-tags ul {
  565. justify-content: center;
  566. padding-bottom: 10px;
  567. }
  568. .profile-character-card-tags-wrap:has(.profile-character-card-tag-limitless), .profile-character-card-tag-limitless {
  569. flex: 1 1 100%;
  570. width: 100%;
  571. }
  572. .profile-character-card-tags-wrap:has(.profile-character-card-tag-limitless) {
  573. padding-top: 2px;
  574. padding-bottom: 2px;
  575. background: rgba(255, 26, 0, 0.3);
  576. border-radius: 20px;
  577. }
  578. .profile-character-card-tag-limitless {
  579. border: none;
  580. font-size: 0;
  581. background: transparent;
  582. }
  583. .profile-character-card-tag-limitless::before, .profile-character-card-tag-limitless::after {
  584. font-size: 0.9rem;
  585. font-family: 'Trebuchet MS', sans-serif;
  586. font-weight: bold;
  587. color: #ff1a00;
  588. text-align: center;
  589. position: absolute;
  590. transition: opacity 500ms ease;
  591. }
  592. .profile-character-card-tag-limitless::before {
  593. content: "๐Ÿ”ฅ Hell Curtain";
  594. }
  595. .profile-character-card-tag-limitless::after {
  596. content: "๐Ÿ’ฅ PROMINENCE BURN!!";
  597. opacity: 0;
  598. }
  599. .profile-character-card-wrapper:hover .profile-character-card-tag-limitless::before {
  600. opacity: 0;
  601. }
  602. .profile-character-card-wrapper:hover .profile-character-card-tag-limitless::after {
  603. opacity: 1;
  604. transition-delay: 250ms;
  605. }
  606. .profile-character-card-tags-wrap:not(:has(.profile-character-card-tag-limitless)) {
  607. border: 1px solid #ff1a00;
  608. border-radius: 15px;
  609. }
  610. .profile-character-card-tags-wrap a {
  611. display: flex;
  612. }
  613. .pp-cc-tags-regular {
  614. font-size: 0;
  615. display: inline;
  616. border: none !important;
  617. }
  618. .pp-cc-tags-regular::first-letter {
  619. font-size: 0.9rem;
  620. }
  621. .pp-cc-tags-item:hover:not(.profile-character-card-tag-limitless) {
  622. background: rgba(255, 26, 0, 0.3);
  623. }
  624. .pp-cc-tags-custom {
  625. border: none !important;
  626. color: #ff1a00;
  627. font-family: 'Trebuchet MS', sans-serif;
  628. font-weight: 600;
  629. }
  630.  
  631. .profile-character-card-tokens-count {
  632. color: #ff1a00;
  633. text-shadow: none;
  634. font-family: 'Trebuchet MS', sans-serif;
  635. font-weight: 500;
  636. }
  637.  
  638. .profile-character-card-box ~ div {
  639. display: none;
  640. }
  641. </style>
  642.  
  643. <div class="cafe-chalkboard-menu">
  644. <div class="chalkboard-frame">
  645. <div class="chalkboard-surface">
  646. <h3 class="chalk-title">Endeavor Agency Fuel ๐Ÿ”ฅ</h3>
  647. <ul class="chalk-items">
  648. <li>๐Ÿ”ฅ Hellflame Flame-Seared Steak</li>
  649. <li>๐ŸŒถ๏ธ Scorching Hot Szechuan Pepper Noodles</li>
  650. <li>๐Ÿต High-Temp Roasted Green Tea</li>
  651. <li>๐Ÿ– Fire-Grilled Spicy Lamb Skewers</li>
  652. <li>โšก Red-Hot Citrus Fuel Drink</li>
  653. <li>๐Ÿง Spiced Cinnamon Shaved Ice</li>
  654. </ul>
  655. <div class="chalk-footer">"Power without discipline is worthless."</div>
  656. </div>
  657. </div>
  658. </div>
  659.  
  660. <style>
  661. .css-p641ht {
  662. background-color: #0f121d !important;
  663. border-bottom: 4px solid #ff1a00 !important;
  664. box-shadow: 0 4px 10px rgba(0, 0, 0, 0.6) !important;
  665. }
  666.  
  667. .css-1qj3ulc {
  668. font-size: 0 !important;
  669. visibility: hidden !important;
  670. position: relative !important;
  671. display: inline-block !important;
  672. }
  673.  
  674. .css-1qj3ulc::after {
  675. content: "Endeavor.Hero ๐Ÿ”ฅ" !important;
  676. visibility: visible !important;
  677. font-family: 'Impact', sans-serif !important;
  678. font-size: 1.6rem !important;
  679. font-weight: bold !important;
  680. color: #ff1a00 !important;
  681. letter-spacing: 2px !important;
  682. text-shadow: 2px 2px 0px #ff6600 !important;
  683. position: absolute !important;
  684. left: 0 !important;
  685. top: 50% !important;
  686. transform: translateY(-50%) !important;
  687. white-space: nowrap !important;
  688. }
  689.  
  690. .cafe-page-doll {
  691. position: fixed !important;
  692. bottom: 30px !important;
  693. right: 30px !important;
  694. z-index: 9999 !important;
  695. display: flex !important;
  696. flex-direction: column !important;
  697. align-items: center !important;
  698. pointer-events: auto !important;
  699. user-select: none !important;
  700. }
  701.  
  702. .doll-graphic {
  703. font-size: 3rem !important;
  704. line-height: 1 !important;
  705. filter: drop-shadow(3px 3px 0px #0f121d) !important;
  706. animation: dollFloat 3s ease-in-out infinite !important;
  707. }
  708.  
  709. .doll-steam {
  710. color: #ff1a00 !important;
  711. font-family: Arial, sans-serif !important;
  712. font-size: 1.5rem !important;
  713. font-weight: bold !important;
  714. opacity: 0 !important;
  715. transform: translateY(10px) !important;
  716. animation: dollSteam 3s ease-in-out infinite !important;
  717. }
  718.  
  719. .doll-shadow {
  720. width: 30px !important;
  721. height: 6px !important;
  722. background: rgba(255, 26, 0, 0.5) !important;
  723. border-radius: 50% !important;
  724. margin-top: 5px !important;
  725. animation: dollShadow 3s ease-in-out infinite !important;
  726. }
  727.  
  728. @keyframes dollFloat {
  729. 0%, 100% { transform: translateY(0); }
  730. 50% { transform: translateY(-12px); }
  731. }
  732.  
  733. @keyframes dollShadow {
  734. 0%, 100% { transform: scale(1); opacity: 0.5; }
  735. 50% { transform: scale(0.7); opacity: 0.2; }
  736. }
  737.  
  738. @keyframes dollSteam {
  739. 0% { transform: translateY(5px) scale(0.8); opacity: 0; }
  740. 50% { opacity: 0.8; }
  741. 100% { transform: translateY(-15px) scale(1.2); opacity: 0; }
  742. }
  743.  
  744. .cafe-chalkboard-menu {
  745. margin: 25px auto !important;
  746. max-width: 480px !important;
  747. width: 300% !important;
  748. box-sizing: border-box !important;
  749. }
  750.  
  751. .chalkboard-frame {
  752. background: #0f121d !important;
  753. border: 4px solid #ff1a00 !important;
  754. border-radius: 8px !important;
  755. padding: 10px !important;
  756. box-shadow: 0 0 15px rgba(255, 26, 0, 0.5) !important;
  757. }
  758.  
  759. .chalkboard-surface {
  760. background: #181c2b !important;
  761. border: 1px dashed #ff1a00 !important;
  762. padding: 15px !important;
  763. text-align: center !important;
  764. }
  765.  
  766. .chalk-title {
  767. color: #ff1a00 !important;
  768. font-family: 'Impact', sans-serif !important;
  769. font-size: 1.3rem !important;
  770. text-transform: uppercase !important;
  771. letter-spacing: 1px !important;
  772. border-bottom: 1px solid rgba(255, 102, 0, 0.6) !important;
  773. padding-bottom: 8px !important;
  774. margin-bottom: 12px !important;
  775. }
  776.  
  777. .chalk-items {
  778. list-style: none !important;
  779. padding: 0 !important;
  780. margin: 0 !important;
  781. }
  782.  
  783. .chalk-items li {
  784. color: #ffffff !important;
  785. font-family: 'Trebuchet MS', sans-serif !important;
  786. font-size: 0.95rem !important;
  787. margin: 8px 0 !important;
  788. text-align: left !important;
  789. }
  790.  
  791. .chalk-footer {
  792. color: #ff6600 !important;
  793. font-family: 'Trebuchet MS', sans-serif !important;
  794. font-size: 0.85rem !important;
  795. font-style: italic !important;
  796. margin-top: 15px !important;
  797. }
  798.  
  799. @media (max-width: 768px) {
  800.  
  801. .css-1qj3ulc::after {
  802. font-size: 1.3rem !important;
  803. }
  804.  
  805. .cafe-page-doll {
  806. bottom: 15px !important;
  807. right: 15px !important;
  808. transform: scale(0.8) !important;
  809. opacity: 0.8 !important;
  810. }
  811.  
  812. .cafe-chalkboard-menu {
  813. max-width: 90% !important;
  814. padding: 0 10px !important;
  815. }
  816. }
  817. </style>
  818.  
  819. <style>
  820. .profile-top-bar {
  821. background: rgba(15, 18, 29, 0.95);
  822. backdrop-filter: blur(5px);
  823. box-shadow: none;
  824. border-bottom: 3px solid #ff1a00;
  825. }
  826. .profile-top-box-flex-inner, .profile-top-bar-logo-box {
  827. min-width: fit-content;
  828. }
  829.  
  830. .profile-top-bar-logo-name:hover { text-shadow: none; }
  831. .profile-top-bar-logo { background: transparent; }
  832.  
  833. .pp-uc-followers-count span + span { font-size:0; }
  834.  
  835. .pp-uc-followers-count span + span::after {
  836. content: "Sidekicks";
  837. font-size:1rem;
  838. }
  839.  
  840. .sonner-toast-container [data-sonner-toast][data-type=success]{
  841. background: #0f121d!important;
  842. color: #ff1a00!important;
  843. border: 2px solid #ff6600!important;
  844. }
  845. </style>
Tags: Mha CSS Code janitor.ai
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!