{"data":{"alternate_greetings":[],"character_version":"","creator":"stargirl_92","creator_notes":"<h1 style=\"text-align: center;\">♡ A BEAUTIFUL LITTLE NIGHTMARE ♡</h1><p style=\"text-align: center;\"><a rel=\"noopener noreferrer\" href=\"https://docs.google.com/document/d/1VHnBltLihgy48r91ffoJNy0ewTcA8oM9b99_wnX2QZk/edit?usp=sharing\" target=\"_blank\"><span style=\"color: rgb(255, 0, 0);\"><strong>>LINK TO CSS<</strong></span></a></p><p style=\"text-align: center;\"><a rel=\"noopener noreferrer\" href=\"https://janitorai.com/profiles/bd9c19ed-fe64-4060-a257-d18bbca8432b_profile-of-pixel-x-xcat\" target=\"_blank\"><span style=\"color: rgb(255, 0, 0);\"><strong>>LIVE PREVIEW<</strong></span></a></p><p><em>An illustrated horror manga-inspired JanitorAI profile theme.</em></p><p><strong>A pretty face. An unsettling reflection. A story that doesn't quite end.</strong></p><p>Originally inspired by Junji Ito's <em>Tomie</em>, this profile theme was designed to resemble the pages of a vintage horror manga, complete with aged paper, monochrome illustrations, delicate gothic details, and just a touch of something sinister.</p><p>Although Tomie inspired its creation, <strong>this is not strictly a Tomie theme!</strong> Think of it as a blank manga page waiting for your own story.</p><p>Whether you're a horror enthusiast, a manga lover, or simply someone who appreciates a beautiful black-and-white aesthetic, you're welcome to make it your own.</p><h3>♡ WHAT'S INCLUDED</h3><ul><li><p>An illustrated manga-style profile layout with a customizable title, introduction, and decorative text.</p></li><li><p>Five customizable image placements, including a floating chibi companion.</p></li><li><p>A monochrome character gallery that automatically turns your bot cards grayscale.</p></li><li><p>Styled profile buttons, follower counter, and event badge display.</p></li><li><p>Responsive styling for desktop and mobile.</p></li><li><p>A separate customization guide to help you get everything set up!</p></li></ul><h3>♡ MAKE IT YOUR OWN</h3><p><strong>All text, images, and links are customizable.</strong></p><p>Replace the sample illustrations with your own artwork, change the profile title, rewrite the introduction, and personalize the decorative captions however you like.</p><p>You don't have to use Tomie, Junji Ito characters, or even horror imagery. The layout is yours to reinterpret!</p><p>The downloadable files include the complete theme code and instructions explaining where to make your changes.</p><h3>♡ A FEW LITTLE NOTES</h3><ul><li><p>This theme is designed for JanitorAI profiles.</p></li><li><p>Some familiarity with copying and pasting HTML/CSS is helpful, but the included guide is beginner-friendly.</p></li><li><p>For the best results, use portrait-oriented artwork for the main image and transparent PNG/WebP artwork for the floating companion.</p></li><li><p>Please keep the small creator credit included in the theme.</p></li><li><p>You're welcome to customize and use the theme, but please don't redistribute the code as your own creation.</p></li><li><p>If you don't trust my link then you can copy the CSS directly from the start message of this bot ꨄ︎ I also added the instructions to the personality section of this bot~</p></li></ul><hr><p style=\"text-align: center;\"><em>Every beautiful thing has another face.</em></p><p style=\"text-align: center;\"><strong>Made with love (and a little obsession) by Stargirl</strong><span style=\"color: rgb(255, 0, 0);\"><strong> ♡</strong></span></p>","description":"TOMIE × STARGIRL — COMMUNITY THEME\nA grayscale horror-manga-inspired JanitorAI profile template\nTheme by Stargirl ♡\n\nFILES\n1. Tomie_Community_Release_Clean.txt — complete About Me HTML/CSS\n2. This guide — how to personalize the template\n\nHOW TO INSTALL\n1. Back up your current JanitorAI About Me code somewhere safe.\n2. Open Tomie_Community_Release_Clean.txt in a text editor.\n3. Personalize the text, image URLs, and links as explained below.\n4. Copy the ENTIRE contents, including the <style> ... </style> section.\n5. Paste it into your JanitorAI About Me editor and save.\n6. Preview on desktop and mobile before sharing.\n\nHOW TO REPLACE AN IMAGE\nFind the corresponding   element in the HTML near the top of the file. Replace ONLY the URL between the quotation marks after src=. Keep the quotes, the src=, and the rest of the tag.\n\nExample:\nBEFORE:  \nAFTER:   \n\nUse a publicly accessible, direct image URL (typically ending in .png, .jpg, .jpeg, or .webp). If you upload your image to JanitorAI, use the direct hosted image URL. Avoid links to private files, gallery pages, or temporary previews. Change alt text to describe your own image when applicable.\n\nTHE FIVE IMAGE LOCATIONS\nSearch for these comments in the code:\n\nIMAGE 1: MAIN PORTRAIT\nLarge image on the left of the manga-style profile page. Portrait-oriented images work best; the display frame uses a 4:5 crop.\nCurrent example URL: https://ella.janitorai.com/media-approved/LhWNKcoMRzXVaZRRvQdSo.webp\n\nIMAGE 2: ORNAMENT\nDecorative floral / gothic divider within the About section. Wide transparent artwork works well.\nCurrent example URL: https://ella.janitorai.com/media-approved/X5RLzOpO6bOcwzw9veFjf.webp\n\nIMAGE 3: MIRROR / REFLECTION\nSmall horizontal framed image in the About section; the display crop is approximately 1.65:1.\nCurrent example URL: https://ella.janitorai.com/media-approved/pipnK5ySXy68s7Zq4aL6z.webp\n\nIMAGE 4: CHAPTER ILLUSTRATION\nWide manga illustration below the main page. Display crop is approximately 2.25:1 on desktop and 1.85:1 on smaller screens.\nCurrent example URL: https://ella.janitorai.com/media-approved/ekXTy5-rd2pd3qxryWulm.webp\n\nIMAGE 5: FLOATING PAGE DOLL\nSmall animated floating companion at the bottom left. A transparent PNG or WebP works best.\nCurrent example URL: https://ella.janitorai.com/media-approved/ZteQCxjIju5DSI2hJB66w.webp\n\nPERSONALIZE THE WORDS\nNear the top of the HTML, change:\n- \"Stargirl\" — your display heading\n- \"Look at me. ♡\" — your short tagline\n- \"THE GIRL WHO WON'T DIE\" and \"A BEAUTIFUL LITTLE NIGHTMARE\" — decorative headings\n- \"Won't you stay awhile?\" — About heading\n- The paragraphs beginning \"Welcome to my little corner of the internet.\" — your introduction\n- \"Until we meet again. ♡\" — your sign-off\n- Chapter captions, reflection captions, and floating-doll speech bubble if desired\n\nLINKS\nFind the <nav class=\"ss-links\"> section. Replace these placeholders with your own full links:\n- https://example.com/YOUR-CARRD\n- https://example.com/YOUR-DISCORD\n- https://example.com/YOUR-PINTEREST\nYou can change the visible link names or remove an <a ...>...</a> line for a service you do not use. Never leave the example.com URLs in a public profile.\n\nWHAT IS AUTOMATIC\n- Native character cards appear below your About Me content.\n- The character gallery is grayscale, including character images and tab accent.\n- The Edit Profile / follow controls use a manga-paper palette.\n- Event badges are displayed as grayscale framed collectibles when present; accounts without badges do not need to add any.\n- The site search bar stays in its normal navigation position.\n- The floating companion gently bobs; reduced-motion preferences disable the animation.\n\nNOTES\n- The sample illustrations are included as examples. Replace them with images you have permission to use if distributing a personalized profile.\n- JanitorAI can change its site HTML/classes at any time, which may affect theme CSS.\n- This is an HTML/CSS profile template, not a downloadable app or a native JanitorAI feature.\n- Keep the existing theme credit / attribution when sharing the template.\n\nCREDIT\nTOMIE × STARGIRL — Theme by Stargirl ♡\n\n\n","extensions":{"cardex":{"origins":[{"created":"2026-11-12T16:47:07Z","current":true,"first_seen":"2026-11-12T00:00:00Z","id":"488f328d-ae9d-4440-9526-c8c419cd9c73","source":"janitorai","url":"https://janitorai.com/characters/488f328d-ae9d-4440-9526-c8c419cd9c73"}],"url":"https://cardex.zip/janitorai/488f328d-ae9d-4440-9526-c8c419cd9c73","version":1},"janitor":{"chat_name":"Tomie","source_watermark":{"fields":["description","first_mes"],"years":[2026]}}},"first_mes":"<div class=\"ss-page\">\n<div class=\"ss-header\" id=\"top\">\n  <div class=\"ss-header-top\"><span>THE GIRL WHO WON'T DIE</span></div>\n  <div class=\"ss-header-content\">\n    <span class=\"ss-eyebrow\">A BEAUTIFUL LITTLE NIGHTMARE</span>\n    <h1>Stargirl</h1>\n    <p>Look at me. ♡</p>\n  </div>\n</div>\n<div class=\"ss-main\">\n  <section class=\"ss-portrait\" aria-label=\"Stargirl portrait\">\n    <div class=\"ss-photo-frame\">\n      <img class=\"ss-portrait-image\" src=\"https://ella.janitorai.com/media-approved/LhWNKcoMRzXVaZRRvQdSo.webp\" alt=\"Stargirl seated before an antique mirror, her reflection smiling ominously\">\n    </div>\n    <span class=\"ss-handwritten\">She always comes back.</span>\n  </section>\n  <section class=\"ss-about\" aria-label=\"About the creator\">\n    <div class=\"ss-diary-paper\">\n      <span class=\"ss-eyebrow\">ABOUT THE GIRL</span>\n      <h2>Won't you stay awhile?</h2>\n      <div class=\"ss-diary-entry\">\n        <p>Welcome to my little corner of the internet.</p>\n        <p>Replace this text with your introduction, interests, and anything you'd like visitors to know.</p>\n        <p class=\"ss-diary-signoff\">Until we meet again. ♡</p>\n      </div>\n      <div class=\"ss-about-ornament\" aria-hidden=\"true\"><img src=\"https://ella.janitorai.com/media-approved/X5RLzOpO6bOcwzw9veFjf.webp\" alt=\"\"></div>\n      <figure class=\"ss-reflection-panel\">\n        <div class=\"ss-reflection-frame\"><img src=\"https://ella.janitorai.com/media-approved/pipnK5ySXy68s7Zq4aL6z.webp\" alt=\"Stargirl beside a mirror crowded with unsettling reflections of herself\"></div>\n        <figcaption>REFLECTION NO. 02 <span>There was only one of me yesterday.</span></figcaption>\n      </figure>\n      <nav class=\"ss-links\" aria-label=\"Creator links\">\n        <a href=\"https://example.com/YOUR-CARRD\" target=\"_blank\" rel=\"noopener noreferrer\">Carrd</a>\n        <a href=\"https://example.com/YOUR-DISCORD\" target=\"_blank\" rel=\"noopener noreferrer\">Discord</a>\n        <a href=\"https://example.com/YOUR-PINTEREST\" target=\"_blank\" rel=\"noopener noreferrer\">Pinterest</a>\n      </nav>\n    </div>\n  </section>\n</div>\n</div>\n<figure class=\"ss-doppel-panel\" aria-label=\"The doppelgänger chapter illustration\">\n  <div class=\"ss-doppel-label\">CHAPTER 03 · THE OTHER GIRL</div>\n  <div class=\"ss-doppel-frame\"><img src=\"https://ella.janitorai.com/media-approved/ekXTy5-rd2pd3qxryWulm.webp\" alt=\"Two identical versions of Stargirl sitting together in a gothic room\"></div>\n  <figcaption>Which one did you meet?</figcaption>\n</figure>\n<!-- TOMIE × STARGIRL — FLOATING PAGE DOLL -->\n<div class=\"tomie-page-doll\" tabindex=\"0\" aria-label=\"Little Stargirl floating companion\">\n  <div class=\"tomie-page-doll-art\">\n    <img src=\"https://ella.janitorai.com/media-approved/ZteQCxjIju5DSI2hJB66w.webp\" alt=\"Little Stargirl and her other self\">\n  </div>\n  <span class=\"tomie-page-doll-bubble\">You came back. ♡</span>\n</div>\n<div class=\"ss-credit\">TOMIE × STARGIRL · Theme by <a href=\"https://janitorai.com/profiles/f88412cd-0049-4822-a957-efdf81c091a1_profile-of-stargirl-92\">Stargirl ♡</a></div>\n\n<style>\nhtml { -webkit-text-size-adjust:100%; text-size-adjust:100%; scrollbar-width:thin; scrollbar-color:#77716b #e9e5df; }\n.profile-background-effect-image {display:none;}\n.pp-uc-background,.pp-uc-background > div {width:100%!important;max-width:1200px;padding:0;background:transparent!important;box-shadow:none!important;}\n.profile-page-flex {flex-direction:column;align-items:stretch!important;width:100%!important;max-width:1200px;}\n.pp-uc-about-me {display:contents;font-family:Quicksand,Nunito,system-ui,sans-serif;}\nmain,.profile-page-container {padding:0!important;}\n*:has(> .profile-info-stack) {width:100%!important;min-width:0;max-width:100%!important;align-items:stretch!important;}\n.profile-info-stack-inner-flex {margin-right:0;width:100%;}\n.pp-uc-avatar-container,.pp-uc-member-since {display:none;}\n.profile-info-stack {position:relative;display:flex!important;flex-direction:column;align-items:stretch!important;gap:18px;width:100%!important;max-width:1120px;margin:0 auto;padding:12px 18px 30px;box-sizing:border-box;}\n.profile-info-stack > * {min-width:0;box-sizing:border-box;}\n.profile-info-stack > div:last-child {display:flex;justify-content:center;flex-wrap:wrap;gap:12px;}\nbody {background:#e9e5df;color:#292725;}\n/* One illustrated manga page: title, portrait and about share one surface. */\n.ss-page,.ss-credit {width:100%;box-sizing:border-box;}\n.ss-page {background:#eee9e1;border:2px solid #35312e;padding:18px;box-shadow:6px 7px 0 #171615;}\n.ss-header {background:transparent;border:0;border-bottom:2px solid #35312e;padding:8px 12px 18px;min-height:0;}\n.ss-header-top {display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.75rem;letter-spacing:.12em;}\n.ss-header-content {text-align:center;padding:20px 10px 8px;}\n.ss-header h1 {font:700 clamp(2.2rem,7vw,5rem) Georgia,serif;margin:10px 0;}\n.ss-eyebrow {font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;}\n.ss-header p {font-style:italic;}\n.ss-main {display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:22px;align-items:start;padding-top:22px;}\n.ss-portrait,.ss-about {background:transparent;border:0;padding:0;min-width:0;}\n.ss-photo-frame {padding:8px;background:#f8f5ef;border:2px solid #393531;box-shadow:4px 5px 0 #c4bcb2;transform:none;}\n.ss-handwritten {display:block;text-align:center;margin-top:16px;font:italic 1.3rem Georgia,serif;}\n.ss-about h2 {font:italic 2rem Georgia,serif;margin:14px 0;}\n.ss-about p {line-height:1.7;}\n.ss-links {display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;}\n.ss-links a {padding:7px 12px;border:1px solid #69635e;color:inherit;text-decoration:none;}\n.ss-credit {text-align:center;font-size:.72rem;opacity:1;padding:8px;color:#d9d2c8;}\n.ss-credit a {color:inherit;}\n@media (max-width:800px){\n.profile-info-stack{padding:8px 10px 40px;gap:20px}\n.ss-page{padding:12px}\n.ss-main{grid-template-columns:1fr;gap:22px;padding-top:20px}\n.ss-header{padding:8px 6px 16px}\n.ss-header-content{padding:18px 6px 6px}\n}\n#search-input {\n  width: 100%; min-width: 0; height: 38px;\n  padding: 7px 12px !important; box-sizing: border-box;\n  font-family: Georgia, \"Times New Roman\", serif !important;\n  font-size: .88rem !important; letter-spacing: .025em;\n  color: #45413e !important; background: transparent !important;\n}\n#search-input::placeholder {\n  opacity: 1 !important; color: #817970 !important;\n  font-family: Georgia, \"Times New Roman\", serif !important;\n  font-size: .8rem !important; font-style: italic;\n}\n.profile-top-bar-search-wrapper {\n  position: fixed !important; top: 68px !important; right: 18px !important;\n  left: auto !important; bottom: auto !important; z-index: 80;\n  width: min(245px, 35vw) !important; max-width: calc(100vw - 24px);\n  margin: 0 !important; justify-content: flex-end;\n}\n.profile-top-bar-search-wrapper:focus-within .pp-top-bar-search-input {\n  border-color: #5f5953 !important;\n  box-shadow: 0 0 0 3px #d1c8be, 0 4px 13px #29272540 !important;\n}\n[class*=\"notificationsPopover\"] {\n  width: min(340px, 92vw) !important;\n  max-height: min(72vh, 600px) !important;\n  overflow-y: auto !important;\n  overflow-x: hidden !important;\n  box-sizing: border-box !important;\n  border: 2px solid #999188 !important;\n  border-radius: 15px !important;\n  background: #f3eee7 !important;\n  box-shadow: 0 10px 28px #25232140 !important;\n  color: #47413d !important;\n  font-family: Georgia, \"Times New Roman\", serif !important;\n}\n[class*=\"notificationsPopover\"] [class*=\"popoverHeader\"] {\n  position: sticky;\n  top: 0;\n  z-index: 5;\n  padding: 12px !important;\n  border-bottom: 1px solid #999188 !important;\n  background: linear-gradient(180deg,#f8f5ef,#ddd5cb) !important;\n}\n[class*=\"notificationsPopover\"] [class*=\"popoverTitle\"],\n[class*=\"notificationsPopover\"] [class*=\"popoverHeader\"] h4 {\n  font-family: Georgia, \"Times New Roman\", serif !important;\n  font-size: 1rem !important;\n  font-weight: 700 !important;\n  letter-spacing: .045em !important;\n  color: #4c4743 !important;\n  text-shadow: none !important;\n}\n[class*=\"notificationsPopover\"] [class*=\"popoverHeader\"] button {\n  border: 1px solid #999188 !important;\n  border-radius: 7px !important;\n  background: #f8f5ef !important;\n  color: #4c4743 !important;\n  box-shadow: none !important;\n}\n[class*=\"notificationsPopover\"] [class*=\"popoverHeader\"] button svg { color: inherit !important; fill: none !important; }\n[class*=\"notificationsPopover\"] a {\n  color: #4c4743 !important;\n  font-family: Georgia, \"Times New Roman\", serif !important;\n  font-size: .78rem !important;\n  font-weight: 700 !important;\n  letter-spacing: .04em !important;\n  background: transparent !important;\n  text-decoration: none !important;\n}\n[class*=\"notificationsPopover\"] a:hover { text-decoration: underline !important; }\n[class*=\"notificationsPopover\"] [class*=\"notificationItem\"] {\n  padding: 12px !important;\n  border-bottom: 1px solid #c6beb4 !important;\n  background: transparent !important;\n  color: #47413d !important;\n  overflow-wrap: anywhere;\n}\n[class*=\"notificationsPopover\"] [class*=\"notificationItem\"]:hover { background: #e5ded5 !important; }\n[class*=\"notificationsPopover\"] [class*=\"notificationItem\"]:has([class*=\"subjectUnread\"]) { box-shadow: inset 3px 0 #68615b !important; }\n[class*=\"notificationsPopover\"] [class*=\"notificationItem\"] * { color: inherit; font-family: inherit; }\n[class*=\"notificationsPopover\"] [class*=\"notificationItem\"] img {\n  width: 44px !important;\n  height: 44px !important;\n  object-fit: cover !important;\n  border: 1px solid #999188 !important;\n  border-radius: 8px !important;\n}\n[class*=\"notificationsPopover\"] [class*=\"timestamp\"] { color: #777069 !important; font-size: .68rem !important; }\n[class*=\"notificationsPopover\"] [class*=\"highlightUsername_\"] { color: #514b46 !important; }\n[class*=\"notificationsPopover\"] [class*=\"unreadIndicator\"] { background: #68615b !important; }\n[class*=\"notificationsBadge\"] { min-width: unset !important; height: 18px; padding: 0 .45rem; border-radius: 0; border: 2px solid #999188; color: #fff; font-size: .65rem; background: linear-gradient(180deg, #8b837b, #706963 50%, #4b4642); }\n[class*=\"notificationsButton\"] svg, [class*=\"notificationButton\"] svg, [class*=\"bellButton\"] svg, button:has([class*=\"notificationsBadge\"]) > svg { display: none !important; }\n[class*=\"notificationsButton\"]::before, [class*=\"notificationButton\"]::before, [class*=\"bellButton\"]::before, button:has([class*=\"notificationsBadge\"])::before { content: \"♥\"; font-size: 1rem; line-height: 1; color: #4c4743; text-shadow: 0 1px 4px #e4ddd3; }\n.profile-top-bar-search-wrapper { z-index: 12 !important; }\n[class*=\"notificationsPopover\"] [class*=\"popoverHeader\"] button {\n  position: relative !important;\n  display: inline-flex !important;\n  align-items: center !important;\n  justify-content: center !important;\n  flex: 0 0 29px !important;\n  width: 29px !important;\n  height: 29px !important;\n  min-width: 29px !important;\n  padding: 0 !important;\n  font-size: 0 !important;\n  line-height: 1 !important;\n  cursor: pointer !important;\n}\n[class*=\"notificationsPopover\"] [class*=\"popoverHeader\"] button svg {\n  display: block !important;\n  visibility: visible !important;\n  opacity: 1 !important;\n  width: 16px !important;\n  height: 16px !important;\n  stroke: currentColor !important;\n  fill: none !important;\n}\n[class*=\"notificationsPopover\"] [class*=\"popoverHeader\"] button::after {\n  position: absolute !important;\n  inset: 0 !important;\n  display: flex !important;\n  align-items: center !important;\n  justify-content: center !important;\n  font-family: Arial, sans-serif !important;\n  font-size: 17px !important;\n  font-weight: 700 !important;\n  line-height: 1 !important;\n  pointer-events: none !important;\n  color: #49443f !important;\n}\n[class*=\"notificationsPopover\"] [class*=\"popoverHeader\"] button:nth-last-of-type(3)::after { content: \"⌫\" !important; }\n[class*=\"notificationsPopover\"] [class*=\"popoverHeader\"] button:nth-last-of-type(2)::after { content: \"✓\" !important; }\n[class*=\"notificationsPopover\"] [class*=\"popoverHeader\"] button:last-of-type::after { content: \"×\" !important; font-size: 22px !important; }\n[class*=\"notificationsPopover\"] [class*=\"popoverHeader\"] button:has(svg) svg { opacity: 0 !important; }\n.pp-uc-title { display:none!important; }\n.pp-uc-followers-count { display:revert!important; }\n.profile-info-stack-inner { gap:8px!important; }\n.profile-info-stack > div:last-child .Btn,\n.profile-info-stack > div:last-child .pp-uc-options-menu {\n  min-height:38px!important; min-width:112px!important;\n  padding:8px 14px!important; border:1px solid #958d84!important;\n  border-radius:3px!important; background:#f5f0e9!important;\n  color:#47413d!important; -webkit-text-fill-color:#47413d!important; box-shadow:none!important;\n  font:600 12px/1.4 Georgia,serif!important;\n}\n.profile-info-stack > div:last-child .Btn:hover,\n.profile-info-stack > div:last-child .pp-uc-options-menu:hover {background:#e3ddd4!important;}\n.profile-info-stack > div:last-child .pp-uc-options-menu svg {color:inherit!important;}\n@media (max-width:600px){\n.profile-info-stack-inner button {max-width:100%!important;}\n.profile-info-stack > div:last-child .Btn,\n  .profile-info-stack > div:last-child .pp-uc-options-menu {min-width:0!important;}\n}\n.profile-info-stack-inner-flex {\n  display:flex!important;\n  flex-direction:column!important;\n  align-items:flex-end!important;\n  justify-content:flex-end!important;\n  min-width:0!important;\n}\n.profile-info-stack-inner {\n  display:flex!important;\n  flex-direction:row!important;\n  align-items:center!important;\n  justify-content:flex-end!important;\n  flex-wrap:wrap!important;\n  gap:8px!important;\n  width:100%!important;\n  padding:0!important;\n  margin:0!important;\n  border:0!important;\n  background:transparent!important;\n  box-shadow:none!important;\n}\n.profile-info-stack .pp-uc-options-menu {\n  width:auto!important;\n  min-width:0!important;\n  min-height:34px!important;\n  margin:0!important;\n  padding:7px 12px!important;\n  border:1px solid #958d84!important;\n  border-radius:2px!important;\n  background:#f5f0e9!important;\n  color:#47413d!important;\n  -webkit-text-fill-color:#47413d!important;\n  box-shadow:none!important;\n  font:600 12px/1.4 Georgia,serif!important;\n}\n@media (max-width:600px) {\n.profile-info-stack-inner {justify-content:center!important;}\n.profile-info-stack-inner button,\n  .profile-info-stack .pp-uc-options-menu {min-height:40px!important;}\n}\nbody:has(.ss-header) .pp-fl-search-input,\nbody:has(.ss-header) .pp-fl-filter-button {\n  border:1px solid #958d84!important;\n  border-radius:3px!important;\n  background:#f8f5ef!important;\n  color:#47413d!important;\n  font:12px Georgia,serif!important;\n  box-shadow:none!important;\n}\nbody:has(.ss-header) .pp-fl-search-input::placeholder {color:#817970!important;opacity:1!important;}\nbody:has(.ss-header) .pp-fl-filter-button svg {color:#56504a!important;}\nbody:has(.ss-header) .pp-fl-search-input:focus-visible,\nbody:has(.ss-header) .pp-fl-filter-button:focus-visible {outline:2px solid #5f5953!important;outline-offset:2px!important;}\nbody:has(.ss-header) .react-select__control {\n  background:#f8f5ef!important;border:1px solid #958d84!important;\n  border-radius:3px!important;box-shadow:none!important;min-height:34px!important;\n}\nbody:has(.ss-header) .react-select__single-value,\nbody:has(.ss-header) .react-select__dropdown-indicator {color:#47413d!important;}\nbody:has(.ss-header) .pp-top-bar-search-input {\n  border:1px solid #958d84!important;border-radius:3px!important;\n  background:#f8f5ef!important;box-shadow:0 2px 8px #29272518!important;\n}\nbody:has(.ss-header) #search-input {color:#47413d!important;font:12px Georgia,serif!important;}\nbody:has(.ss-header) #search-input::placeholder {color:#817970!important;font:italic 12px Georgia,serif!important;}\nbody:has(.ss-header) [class*=\"notificationsPopover\"] {font-family:Georgia,serif!important;}\nbutton.profile-tabs-button[data-tab=\"characters\"] {\n  background: #f5f0e9 !important;\n  color: #47413d !important;\n  border: 1px solid #a39b92 !important;\n  border-radius: 2px !important;\n  box-shadow: none !important;\n  font-family: Georgia, serif !important;\n}\nbutton.profile-tabs-button[data-tab=\"characters\"][aria-selected=\"true\"] {\n  background: #f5f0e9 !important;\n  color: #47413d !important;\n}\n#profile-tabs .chakra-tabs__tab-indicator {\n  background: #5f5953 !important;\n  box-shadow: none !important;\n  height: 2px !important;\n}\n#profile-tabs .pp-tabs-indicator {\n  background: #5f5953 !important;\n  box-shadow: none !important;\n}\n#profile-tabs .profile-character-card-wrapper {\n  border:1px solid #a39b92!important;\n  border-radius:5px!important;\n}\n#profile-tabs .profile-character-card-wrapper\n:is(.pp-cc-gradient-1,.pp-cc-gradient-2,.pp-cc-gradient-3) {\n  background:none!important;\n  background-image:none!important;\n  box-shadow:none!important;\n}\n#profile-tabs .profile-character-card-avatar-image {\n  opacity: 1 !important;\n  filter: none !important;\n}\n#profile-tabs .profile-character-card-stack a:focus-visible {\n  outline: 2px solid #5f5953 !important;\n  outline-offset: 3px !important;\n}\n.pp-uc-followers-count {\n  display: inline-flex !important;\n  align-items: center !important;\n  gap: 5px !important;\n  width: fit-content;\n  padding: 7px 13px;\n  background: #f5f0e9;\n  border: 1px solid #a39b92;\n  border-radius: 2px;\n  color: #34312e !important;\n  font: 600 13px Georgia, serif !important;\n  letter-spacing: .3px;\n}\n.pp-uc-followers-count > span:first-child {\n  color: #34312e !important;\n  -webkit-text-fill-color: #34312e !important;\n  font: inherit !important;\n}\n.pp-uc-followers-count > span:nth-child(2) {\n  display: none !important;\n}\n.pp-uc-followers-count::after {\n  content: \"♡ admirers\";\n  color: #56504a;\n  -webkit-text-fill-color: #56504a;\n  font-style: italic;\n}\n.ss-photo-frame { overflow:hidden; }\n.ss-photo-frame .ss-portrait-image {\n  display:block;\n  width:100%;\n  height:auto;\n  aspect-ratio:4/5;\n  object-fit:cover;\n  object-position:center;\n}\n/* About is printed directly onto the page; no floating card or second panel. */\n.ss-about {position:relative;min-height:0;padding:32px 10px 8px;overflow:visible;}\n.ss-diary-paper {box-sizing:border-box;width:100%;padding:10px 0;background:transparent;border:0;box-shadow:none;color:#47413d;}\n.ss-diary-paper .ss-eyebrow {color:#56504a;}\n.ss-diary-paper h2 {color:#393531;margin:12px 0;}\n.ss-diary-paper p {color:#47413d;line-height:1.65;}\n.ss-diary-paper .ss-links {margin-top:17px;}\n.ss-diary-paper .ss-links a {background:#f8f5ef;border-color:#958d84;color:#47413d;}\n@media (max-width:800px) {.ss-about{padding:0 8px 8px;}.ss-diary-paper{padding:8px 0;}}\n/* Paper grain belongs to the unified page, not a separate header box. */\n.ss-page {background-image:repeating-linear-gradient(0deg,transparent 0px,transparent 3px,rgba(53,49,46,.025) 4px,transparent 5px),linear-gradient(135deg,#f3efe8,#e1d9cf);}\n.ss-diary-entry p {margin:0 0 9px;font-size:0.93em;line-height:1.5;}\n.ss-diary-entry .ss-diary-signoff {margin:12px 0 0;text-align:right;font-style:italic;}\n.ss-diary-paper .ss-links {margin-top:14px;}\n.ss-about-ornament {display:block;margin:22px 0 12px;text-align:center;}\n.ss-about-ornament img {display:block;width:100%;height:auto;max-width:100%;object-fit:contain;}\n.ss-reflection-panel {margin:12px 0 16px;min-width:0;}\n.ss-reflection-frame {padding:5px;border:1px solid #393531;background:#f8f5ef;box-shadow:3px 3px 0 #c4bcb2;overflow:hidden;}\n.ss-reflection-frame img {display:block;width:100%;height:auto;aspect-ratio:1.65/1;object-fit:cover;object-position:center 34%;}\n.ss-reflection-panel figcaption {display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin-top:9px;color:#56504a;font:0.68rem Georgia,serif;letter-spacing:.08em;}\n.ss-reflection-panel figcaption span {font-size:.85rem;letter-spacing:0;font-style:italic;}\n.ss-diary-paper .ss-links a {font-size:.9em;}\n@media  (max-width: 768px) {\nbody:has(.ss-header) nav.pp-mnb-wrapper {\n    background: #e3ddd4 !important;\n    background-color: #e3ddd4 !important;\n    background-image: none !important;\n    border-top: 1px solid #a39b92 !important;\n    box-shadow: 0 -3px 14px rgba(52,48,44,.15) !important;\n  }\nbody:has(.ss-header) nav.pp-mnb-wrapper :is(a,button,.pp-mnb-item,.pp-mnb-user-menu) {\n    color: #514b46 !important;\n    -webkit-text-fill-color: #514b46 !important;\n  }\nbody:has(.ss-header) nav.pp-mnb-wrapper svg {\n    color: #514b46 !important;\n    stroke: currentColor !important;\n  }\nbody:has(.ss-header) nav.pp-mnb-wrapper :is(a,button,[class*=\"pp-mnb-\"]):is([aria-current=\"page\"],[aria-selected=\"true\"],[data-active=\"true\"]) {\n    background-color: #d6cfc5 !important;\n    border-radius: 12px !important;\n    color: #393531 !important;\n  }\n}\n@media  (min-width: 769px) {\nbody:has(.ss-header) :is(header.pp-top-header, header.pp-top-bar-outer, .pp-top-bar-outer) {\n    background: #e9e3da !important;\n    background-color: #e9e3da !important;\n    background-image: none !important;\n    border-bottom: 1px solid #a39b92 !important;\n    box-shadow: 0 2px 10px rgba(47,43,39,.12) !important;\n  }\nbody:has(.ss-header) :is(header.pp-top-header, header.pp-top-bar-outer, .pp-top-bar-outer) :is(a,button) {\n    color: #514b46 !important;\n    -webkit-text-fill-color: #514b46 !important;\n  }\nbody:has(.ss-header) :is(header.pp-top-header, header.pp-top-bar-outer, .pp-top-bar-outer) :is(a,button):hover {\n    background-color: rgba(92,85,78,.13) !important;\n  }\nbody:has(.ss-header) :is(header.pp-top-header, header.pp-top-bar-outer, .pp-top-bar-outer) svg {\n    color: #514b46 !important;\n  }\nbody:has(.ss-header) :is(header.pp-top-header, header.pp-top-bar-outer, .pp-top-bar-outer) img {\n    filter: none !important;\n  }\n}\n@media  (min-width: 769px) {\nbody:has(.ss-header) > #__next header.pp-top-header,\n  body:has(.ss-header) header.pp-top-header,\n  body:has(.ss-header) header.pp-top-header > div,\n  body:has(.ss-header) header.pp-top-header::before,\n  body:has(.ss-header) header.pp-top-header::after,\n  body:has(.ss-header) header.pp-top-bar-outer,\n  body:has(.ss-header) header.pp-top-bar-outer > div,\n  body:has(.ss-header) header[class*=\"header_\"][class*=\"pp-top-bar-outer\"],\n  body:has(.ss-header) header[class*=\"header_\"][class*=\"pp-top-bar-outer\"] > div {\n    background: #e9e3da !important;\n    background-color: #e9e3da !important;\n    background-image: none !important;\n  }\nbody:has(.ss-header) header.pp-top-header,\n  body:has(.ss-header) header.pp-top-bar-outer {\n    border-bottom: 1px solid #a39b92 !important;\n    box-shadow: 0 2px 10px rgba(47,43,39,.12) !important;\n  }\n}\nbody:has(.ss-header) :is(.chakra-menu__menu-list,[role=\"menu\"]):not([class*=\"notificationsPopover\"]) {\n  background: #e9e5df !important;\n  background-color: #e9e5df !important;\n  color: #47413d !important;\n  border: 1px solid #a39b92 !important;\n  box-shadow: 0 8px 24px rgba(47,43,39,.20) !important;\n}\nbody:has(.ss-header) :is(.chakra-menu__menu-list,[role=\"menu\"]):not([class*=\"notificationsPopover\"]) :is(.chakra-menu__menuitem,[role=\"menuitem\"]) {\n  background: transparent !important;\n  color: #47413d !important;\n}\nbody:has(.ss-header) :is(.chakra-menu__menu-list,[role=\"menu\"]):not([class*=\"notificationsPopover\"]) :is(.chakra-menu__menuitem,[role=\"menuitem\"]):is(:hover,:focus,[data-focus],[data-highlighted]) {\n  background: #ded7ce !important;\n  color: #393531 !important;\n}\nbody:has(.ss-header) :is(.chakra-menu__menu-list,[role=\"menu\"]):not([class*=\"notificationsPopover\"]) :is(svg,span,p) {\n  color: inherit;\n}\n/* Little Stargirl — fixed floating page doll */\n.tomie-page-doll {position:fixed!important;z-index:25;left:12px;bottom:16px;width:125px;height:190px;cursor:pointer;outline:none;user-select:none;}\n.tomie-page-doll-art {position:absolute;inset:0;transform-origin:center bottom;animation:tomie-doll-float 5.5s ease-in-out infinite;}\n.tomie-page-doll img {display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;border:0;background:transparent;box-shadow:none;pointer-events:none;filter:drop-shadow(0 3px 5px rgba(0,0,0,.35));}\n@keyframes tomie-doll-float {0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-9px) rotate(1deg)}}\n.tomie-page-doll-bubble {position:absolute;left:12px;bottom:calc(100% + 3px);width:max-content;max-width:min(210px,calc(100vw - 24px));padding:17px 21px;box-sizing:border-box;background:#eee7de;border:1.5px solid #514b48;border-radius:52% / 50%;color:#302b2a;font:italic 14px/1.4 Georgia,serif;text-align:center;box-shadow:3px 4px 0 rgba(0,0,0,.25);opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s;pointer-events:none;white-space:nowrap;}\n/* Two-layer pointed manga tail, aimed toward Little Stargirl. */\n.tomie-page-doll-bubble::before {content:\"\";position:absolute;left:30px;bottom:-19px;border-style:solid;border-width:19px 11px 0 3px;border-color:#514b48 transparent transparent transparent;transform:rotate(9deg);}\n.tomie-page-doll-bubble::after {content:\"\";position:absolute;left:31px;bottom:-15px;border-style:solid;border-width:17px 8px 0 3px;border-color:#eee7de transparent transparent transparent;transform:rotate(9deg);}\n.tomie-page-doll:is(:hover,:focus,:active) .tomie-page-doll-bubble {opacity:1;transform:translateY(0);}\n.tomie-page-doll:focus-visible {outline:2px solid #514b48;outline-offset:3px;}\n@media(max-width:800px){.tomie-page-doll{left:5px;bottom:85px;width:75px;height:120px;z-index:20}.tomie-page-doll-bubble{left:0;max-width:min(190px,calc(100vw - 12px));font-size:12px}}\n@media(prefers-reduced-motion:reduce){.tomie-page-doll-art{animation:none!important}}\n\n/* Chapter transition: one self-contained panel, not an override of the manga cover. */\n.ss-doppel-panel {box-sizing:border-box;width:min(100%,560px);margin:26px auto 12px;padding:12px;background:#eee9e1;border:1px solid #393531;box-shadow:4px 5px 0 #171615;text-align:center;}\n.ss-doppel-label {margin:0 0 9px;font:0.7rem Georgia,serif;letter-spacing:.16em;color:#514b46;}\n.ss-doppel-frame {overflow:hidden;border:1px solid #393531;background:#ded8cf;}\n.ss-doppel-frame img {display:block;width:100%;height:auto;aspect-ratio:2.25/1;object-fit:cover;object-position:center 30%;}\n.ss-doppel-panel figcaption {margin:12px 0 2px;color:#393531;font:italic 1.15rem Georgia,serif;}\n@media(max-width:800px){.ss-doppel-panel{width:100%;margin:20px auto 10px;padding:10px}.ss-doppel-frame img{aspect-ratio:1.85/1;object-position:center 27%;}}\n\n\n/* TOMIE — manga-style Follow / Following and Options controls.\n   Uses the stable classes and data-following attribute seen in DevTools.\n   The original text remains in the DOM for accessibility. */\nbody:has(.ss-header) button.pp-uc-follow-button,\nbody:has(.ss-header) button.pp-uc-options-menu {\n  display:inline-flex!important;\n  align-items:center!important;\n  justify-content:center!important;\n  position:relative!important;\n  min-width:112px!important;\n  min-height:40px!important;\n  padding:9px 16px!important;\n  border:1px solid #393531!important;\n  border-radius:2px!important;\n  background:#f5f0e9!important;\n  color:#292725!important;\n  -webkit-text-fill-color:#292725!important;\n  box-shadow:3px 3px 0 #393531!important;\n  font:600 12px/1.4 Georgia,serif!important;\n  letter-spacing:.06em!important;\n  transition:background .18s,box-shadow .18s,transform .18s!important;\n}\nbody:has(.ss-header) button.pp-uc-follow-button:hover,\nbody:has(.ss-header) button.pp-uc-options-menu:hover {\n  background:#e3ddd4!important;\n  box-shadow:2px 2px 0 #393531!important;\n  transform:translate(1px,1px);\n}\nbody:has(.ss-header) button.pp-uc-follow-button:focus-visible,\nbody:has(.ss-header) button.pp-uc-options-menu:focus-visible {\n  outline:2px solid #393531!important;\n  outline-offset:4px!important;\n}\n/* Hide only the visible label, not the actual button or its accessible name. */\nbody:has(.ss-header) button.pp-uc-follow-button .pp-uc-follow-text {\n  font-size:0!important;\n  line-height:0!important;\n  -webkit-text-fill-color:transparent!important;\n}\nbody:has(.ss-header) button.pp-uc-follow-button::after {\n  content:\"♡ ADMIRE\";\n  display:block;\n  color:#292725;\n  -webkit-text-fill-color:#292725;\n  font:600 12px/1.4 Georgia,serif;\n  letter-spacing:.07em;\n  white-space:nowrap;\n}\nbody:has(.ss-header) button.pp-uc-follow-button[data-following=\"true\"] {\n  background:#393531!important;\n  color:#f5f0e9!important;\n  -webkit-text-fill-color:#f5f0e9!important;\n}\nbody:has(.ss-header) button.pp-uc-follow-button[data-following=\"true\"]::after {\n  content:\"♥ OBSESSED\";\n  color:#f5f0e9;\n  -webkit-text-fill-color:#f5f0e9;\n}\nbody:has(.ss-header) button.pp-uc-follow-button[data-following=\"true\"]:hover {\n  background:#514b46!important;\n}\n@media(max-width:600px){\n  body:has(.ss-header) button.pp-uc-follow-button,\n  body:has(.ss-header) button.pp-uc-options-menu {min-width:105px!important;min-height:40px!important;}\n}\n\n\n/* FOLLOW BUTTON — neutralize JanitorAI's original dark skin and overlay. */\nbody:has(.ss-header) button.pp-uc-follow-button[data-following=\"false\"] {\n  background:#f5f0e9!important;\n  background-color:#f5f0e9!important;\n  background-image:none!important;\n  color:#292725!important;\n  -webkit-text-fill-color:#292725!important;\n  opacity:1!important;\n  filter:none!important;\n}\nbody:has(.ss-header) button.pp-uc-follow-button::before {\n  content:none!important;\n  display:none!important;\n  background:none!important;\n}\nbody:has(.ss-header) button.pp-uc-follow-button .pp-uc-follow-text {\n  background:transparent!important;\n  box-shadow:none!important;\n}\nbody:has(.ss-header) button.pp-uc-follow-button[data-following=\"true\"] {\n  background:#393531!important;\n  background-color:#393531!important;\n  background-image:none!important;\n}\n\n</style>\n\n\n","mes_example":"","name":"TOMIE/MANGA FREE PROFILE CSS","nickname":"Tomie","personality":"","post_history_instructions":"","scenario":"","system_prompt":"","tags":["freecssprofile","css","cssprofile","template"]},"spec":"chara_card_v3","spec_version":"3.0"}