Malcolm's custom roam styles

Roam Custom DB Styles.css

/* If you copy this, keep the malcolmocean one and the metaroam one, as these are both public roams */	
/* but change the other ones for your personal roam(s) */
@-moz-document url-prefix("https://roamresearch.com/#/app/metaroam") {
.roam-sidebar-content > .flex-h-box:first-child:after {
    color: white;
    padding-left: 10px;
}
.roam-topbar .flex-h-box > div:nth-child(2) {
    padding-left: 30px;
}

.roam-sidebar-content > .flex-h-box:first-child:after,
.roam-topbar .flex-h-box > div:nth-child(2):after {
    content: "metaroam";
    white-space: nowrap;
}
.roam-sidebar-content {background: #593b00;}
.roam-topbar {background: #ffbb0033}
}

@-moz-document url-prefix("https://roamresearch.com/#/app/metatherapy") {
.roam-sidebar-content > .flex-h-box:first-child:after {
    color: white;
    padding-left: 10px;
}
.roam-topbar .flex-h-box > div:nth-child(2) {
    padding-left: 30px;
}

.roam-sidebar-content > .flex-h-box:first-child:after,
.roam-topbar .flex-h-box > div:nth-child(2):after {
    content: "metatherapy";
}
.roam-sidebar-content {background: #361459;}
.roam-topbar {background: #70009d33}
}

@-moz-document url-prefix("https://roamresearch.com/#/app/lsa") {
.roam-sidebar-content > .flex-h-box:first-child:after {
    color: white;
    padding-left: 10px;
}
.roam-topbar .flex-h-box > div:nth-child(2) {
    padding-left: 30px;
}

.roam-sidebar-content > .flex-h-box:first-child:after,
.roam-topbar .flex-h-box > div:nth-child(2):after {
    content: "LSA 🚀";
    white-space: nowrap;
}
.roam-sidebar-content {background: #143659;}
.roam-topbar {background: #00709d33}
}

@-moz-document url-prefix("https://roamresearch.com/#/app/complice") {
.roam-sidebar-content > .flex-h-box:first-child:after {
    color: white;
    padding-left: 10px;
}
.roam-topbar .flex-h-box > div:nth-child(2) {
    padding-left: 30px;
}

.roam-sidebar-content > .flex-h-box:first-child:after,
.roam-topbar .flex-h-box > div:nth-child(2):after {
    content: "complice";
    white-space: nowrap;
}

.roam-sidebar-content {background: #143314;}
.roam-topbar {background: #0f02}
}

@-moz-document url("https://roamresearch.com/#/app/malcolm"), url-prefix("https://roamresearch.com/#/app/malcolm/") {
.roam-sidebar-content > .flex-h-box:first-child:after {
    color: white;
    padding-left: 10px;
}
.roam-topbar .flex-h-box > div:nth-child(2) {
    padding-left: 30px;
}

.roam-sidebar-content > .flex-h-box:first-child:after,
.roam-topbar .flex-h-box > div:nth-child(2):after {
    content: "malcolm";
    white-space: nowrap;
}

.roam-sidebar-content {background: #312;}
.roam-topbar {background: #b5003d22}
}

@-moz-document url-prefix("https://roamresearch.com/#/app/malcolmocean") {
.roam-sidebar-content > .flex-h-box:first-child:after {
    color: white;
    padding-left: 10px;
}
.roam-topbar .flex-h-box > div:nth-child(2) {
    padding-left: 30px;
}

.roam-sidebar-content > .flex-h-box:first-child:after,
.roam-topbar .flex-h-box > div:nth-child(2):after {
/*    content: "malcolmocean";*/
    content: "";
    display: inline-block;
    position: relative;
    
    width: 100px;
    height: 25px;
    background: url(https://malcolmocean.com/wp-content/themes/minx/img/logo.png) center no-repeat;
    background-size: 100px 25px;
    padding-left: 10px;
    margin-left: 10px;
}
.roam-topbar .rc-h-box > div:nth-child(3):after {
    top: 2px;
}

.roam-sidebar-content {background: #591420;}
.roam-topbar {background: #f2c6ce}

.roam-sidebar-content {
    background: url(https://malcolmocean.com/wp-content/themes/minx/img/footer.png);
    background-position: center bottom;
}
.roam-topbar {
    background: url(https://malcolmocean.com/wp-content/themes/minx/img/header.png);
    background-size: 710px;
    box-shadow: 0 1.5px 4px rgba(0,0,0,0.7)
}

.roam-topbar .bp3-button:not([class*="bp3-intent-"])::before {
    color: black
}
}

Roam DarkTheme.css

/* by default this is white-on-black; to get red-on-black, uncomment the second section, below
 * this is very much in an alpha state; there are lots of things that don't work properly
 */
@-moz-document domain("roamresearch.com") {
#app {
    background: black;
}

/* this tries to get refs box but hits daily notes weirdly
.roam-article > div:last-child > div {
    background: #111 !important;
}

.roam-article > div:last-child > div .rm-reference-item {
    background: #1a1a1a;
}
/**/

#right-sidebar,
*[style*='background-color: rgb(216, 225, 232)'] {
    background-color: #111111 !important;
}

*[style*='background-color: rgb(235, 241, 245)'] {
    background-color: #111315 !important;
}

.rm-reference-item {
    background-color: #181a1c !important;
}

.roam-topbar {
    background-color: black;
}

.bp3-input,
.bp3-input[readonly]{
    background: black;
    box-shadow: inset 0 0 0 1px rgba(223, 234, 245, 0.15);
}

.roam-body .roam-app,
.roam-body .roam-app h1 {
    color: #c0c6cc;
}

.roam-highlight {
    color: black;
}

.bp3-popover .bp3-popover-arrow-fill {
    fill: black;
}
.bp3-popover .bp3-popover-content,
.bp3-menu {
    background: black;
    color: #c0c6cc;
    box-shadow: 0 0 0 1px rgba(223, 234, 245, 0.1),
                0 2px 4px rgba(223, 234, 245, 0.2)/*,
                /*0 8px 24px rgba(16, 22, 26, 0.2)*/;
}

.rm-pages-row:first-child {
    background: #333 !important;
}
.rm-pages-row .rm-pages-title-col a {
    color: #ccc !important;
}
.rm-pages-row .rm-pages-title-col a + span,
.rm-pages-row .rm-pages-title-col .bp3-text-overflow-ellipsis {
    color: #444 !important;
}


.rm-pages-row.rm-pages-row-highlight {
    background-color: #111;
}

.roam-body .roam-app .roam-sidebar-container {
    background-color: #0c1013;
}

#roam-sidebar-logo {
    opacity: 0.4;
}
#roam-sidebar-logo:hover {
    opacity: 0.7;
}

.roam-article > div:last-child div:not(.bp3-icon) {
    /* background: #111 !important; */
}
/*
.roam-article > div:last-child a {
    color: #69c !important;
}*/

.bp3-omnibar {
    background-color: #234;
}


a {
    color: #69f;
}
span.rm-page-ref {
    color: #69f !important;
}
}

@-moz-document domain("roamresearch.com") {
/* RED DARKTHEME

.roam-body .roam-app,
.roam-body .roam-app h1,
.bp3-popover .bp3-popover-content,
.bp3-menu {
    color: #e20;
}


.roam-body .roam-app .roam-sidebar-container {
    background-color: #120200;
  
}

.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .log-button,
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .starred-pages-wrapper,
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .starred-pages-wrapper .starred-pages .page {
        background-color: #120200;
    color: #a20;
}

.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .log-button:hover,
.roam-body .roam-app .roam-sidebar-container .roam-sidebar-content .starred-pages-wrapper .starred-pages .page:hover {
    background-color: #320500;
    color: #f40;
}

.bp3-input::placeholder,
.bp3-input-group > .bp3-icon {
    color: #940;
}
.bp3-omnibar {
    background-color: #420;
}

/**/
}

Roam Tag Styles.css

@-moz-document domain("roamresearch.com") {
/*
div, textarea {
  font-family: 'azo-sans-web-normal';
}
/*

.roam-block-container {
    max-width: 1000px;
}

.roam-block {
    max-width: 750px;
}
/**/
}

@-moz-document domain("roamresearch.com") {
.checkmark {
    background: #0ff;
}
.check-container input:checked ~ .checkmark {
    background: #ddd;
}
.check-container input:checked ~ .checkmark:after {
    border-color: black;
}
}

@-moz-document domain("roamresearch.com") {

span.rm-page-ref {
    border-radius: 2px;
    padding-left: 1px;
    padding-right: 1px;
}

span.rm-page-ref[data-tag="capslog"] {
    color: #39c !important;
}
span.rm-page-ref[data-tag="capslog"]:after {
    content: " 🌊"
}


div[projectid="938c4708-2d4a-99ed-5642-1beb635581a5"] {
    background: #70e3ff;
    border-radius: 10px;
}

/*
https://workflowy.com/#/1ee36e3cce47

this is pretty cool: https://blog.workflowy.com/2016/09/29/better-link-life/#more-2363
*/

/*.cols-2-proj {
    background: #def;
}/**/

.content {
  font-family: 'azo-sans-web-normal';
}
.content span.rm-page-ref {
    padding: 4px 1px 1px; /* required for fixing azo */
}

.center-proj {
    text-align: center;
}

span.rm-page-ref[data-tag="red"] {
    background: red;
    color: white !important;
    padding: 2px 4px 0 3px;
}
span.rm-page-ref[data-tag="blue"] {
    background: #09f;
    color: white !important;
    padding: 2px 4px 0 3px;
}
span.rm-page-ref[data-tag="green"] {
    background: #0c0;
    color: white !important;
    padding: 2px 4px 0 3px;
}

span.rm-page-ref[data-tag="BR"] {
    background: #203;
    color: #c6f !important;
    padding: 0 4px 0 3px;
}

span.rm-page-ref[data-tag="prose"]::after {
    content: " \270d";
}

.prose-proj, .prose-proj * {
    line-height: 160% !important;
}

.prose-proj .project {
    margin-bottom: 2px;
}

.prose-proj .H1-proj,
.prose-proj .H2-proj,
.prose-proj .H3-proj {
    margin-top: 1em;
}

.prose-proj .H1-proj>.name>.content,
.prose-proj .H2-proj>.name>.content,
.prose-proj .H3-proj>.name>.content,
.prose-proj .H1-proj>.notes>.content,
.prose-proj .H2-proj>.notes>.content,
.prose-proj .H3-proj>.notes>.content {
    position: relative;
}
.prose-proj .H1-proj>.notes>.content {
    top: -1.4em;
}
.prose-proj .H2-proj>.notes>.content {
    top: -1.05em;
}
.prose-proj .H3-proj>.notes>.content {
    top: -0.7em;
}

.prose-proj .H1-proj>.name>.content {
    font-size: 170%;
    top: -0.5em;
}
.prose-proj .H2-proj>.name>.content {
    font-size: 140%;
    top: -0.38em;
}
.prose-proj .H3-proj>.name>.content {
    font-size: 120%;
    top: -0.25em;
}
span.rm-page-ref[data-tag="H1"],
span.rm-page-ref[data-tag="H2"],
span.rm-page-ref[data-tag="H3"]{
    display: none;
}
/*
.prose-proj .children {
    padding-top: 4px;
    margin-bottom: -8px;
}*/

span.rm-page-ref[data-tag="dur"] {
    opacity: 0.1;/**/
}

span.rm-page-ref[data-tag="dur"] + * {
  color: #CFF !important;
  background: #0CC !important;
  border-radius: 50px;
  padding: 0 0.5em 0.1em 0.2em;
}
span.rm-page-ref[data-tag="dur"] + *::before {
    content: "\1f559  ";
}

span.rm-page-ref[data-tag="durtotal"] + * {
  color: #033 !important;
  background: #0CC !important;
  border-radius: 50px;
  padding: 0 0.5em 0.1em 0.2em;
}
span.rm-page-ref[data-tag="durtotal"] + *::before {
    content: " \3a3\1f557  = ";
}

span.rm-page-ref[data-tag="dur"] + .contentItalic {
  color: #CF9 !important;
  background: #0C9 !important;
}
span.rm-page-ref[data-tag="durtotal"] + .contentItalic {
  color: #032 !important;
  background: #0C9 !important;
}

span.rm-page-ref[data-tag="tally-ho"] {
  background: linear-gradient(270deg, rgba(64,128,192, 0.5), rgba(100,120,180, 0.0)) !important;
  color: white !important;
  padding-left: 4px;
}
span.rm-page-ref[data-tag="tally-ho"]::after {
  content: " !!!\a0";
  position: relative;
}


span.rm-page-ref[data-tag="ignore"] {
  background: linear-gradient(180deg, #FB9, #DC8) !important;
  color: black !important;
}
span.rm-page-ref[data-tag="ignore"]::after {
  content: " ¯\\_(ツ)_/¯\a0";
  position: relative;
  font-weight: bold;
}

span.rm-page-ref[data-tag="defer"] {
  background: linear-gradient(180deg, #FB9, #DC8) !important;
  color: white !important;
}
span.rm-page-ref[data-tag="defer"]::after {
  content: " \27f6\a0";
  position: relative;
}
span.rm-page-ref[data-tag="after_september"] {
  background: linear-gradient(180deg, #FB9, #DC8) !important;
  color: white !important;
}
span.rm-page-ref[data-tag="after_september"]::after {
  content: " \27f6\27f6  🎃\a0";
  position: relative;
}

span.rm-page-ref[data-tag="top"] {
  background: linear-gradient(180deg, #F06, #C09) !important;
  color: white !important;
}
span.rm-page-ref[data-tag="top"]::after {
  content: " \10323\a0";
  position: relative;
}


span.rm-page-ref[data-tag="medium"] {
  background: linear-gradient(180deg, #F59, #E355CC) !important;
  color: white !important;
}
span.rm-page-ref[data-tag="medium"]::after {
  content: " ~\a0";
  position: relative;
}


span.rm-page-ref[data-tag="low"],
span.rm-page-ref[data-tag="bottom"] {
  background: linear-gradient(180deg, #FFCCE3, #FCE) !important;
  color: white !important;
}
span.rm-page-ref[data-tag="low"] {
  background: linear-gradient(180deg, #F9C, #E9D) !important;
  color: white !important;
}
span.rm-page-ref[data-tag="low"]::after,
span.rm-page-ref[data-tag="bottom"]::after {
  content: " \2186\a0";
  position: relative;
}

span.rm-page-ref[data-tag="gem"] {
  background: linear-gradient(180deg, #c0b6df, #4700cc) !important;
  color: white !important;
}
span.rm-page-ref[data-tag="gem"]::after {
  content: " \1f48e\a0";
  position: relative;
}

span.rm-page-ref[data-tag="nexa"] {
  background-color: #333 !important;
  color: white !important;
}
span.rm-page-ref[data-tag="nexa"]::after {
  content: " \1F463\a0";
}

span.rm-page-ref[data-tag="ready"] {
  background-color: #33C800 !important;
  color: black !important;
}
/**/
span.rm-page-ref[data-tag="ready"]::after {
  content: " \f058\a0";
  position: relative;
  font-family: 'FontAwesome';
}/**/

span.rm-page-ref[data-tag="todo"] {
  background-color: #FFC800 !important;
  color: black !important;
}
/**/
span.rm-page-ref[data-tag="todo"]::after {
  content: " \f14a\a0";
  position: relative;
  font-family: 'FontAwesome';
}/**/

span.rm-page-ref[data-tag="oppor"] {
  background-color: #FFC800 !important;
  color: black !important;
}
/**/
span.rm-page-ref[data-tag="oppor"]::after {
  content: " \f0b2\a0";
  position: relative;
  font-family: 'FontAwesome';
}/**/

span.rm-page-ref[data-tag="test"] {
  background-color: #DDDD66 !important;
  color: black !important;
}
/**/
span.rm-page-ref[data-tag="test"]::after {
  content: " \f0ca\a0";
  position: relative;
  font-family: 'FontAwesome';
}/* content: " \f05d\a0"; */

span.rm-page-ref[data-tag="#conflict"] {
  background-color: #025 !important;
  color: #2dd !important;
}

span.rm-page-ref[data-tag="#conflict"]::after {
  content: " ⤧";
  position: relative;
}


span.rm-page-ref[data-tag="murphy"] {
  background-color: #105 !important;
  color: #c2f !important;
}


span.rm-page-ref[data-tag="jitsu"] {
  background-color: #c2f !important;
  color: #105 !important;
}

.murphyjitsu-proj {
    background: #f8eeff;
    border-radius: 10px;
    padding: 2px 10px 0 4px;
}

span.rm-page-ref[data-tag="murphyjitsu"]::after {
  content: " \f1ce\a0";
  position: relative;
  font-family: 'FontAwesome';
}/**/



span.rm-page-ref[data-tag="#SRM"] {
  background: linear-gradient(#FFF, #FF0 5%, #F90 30%, #F00) !important;
  color: #210 !important;
}

span.rm-page-ref[data-tag="#SRM"]::after {
  content: " 🔥";
  position: relative;
}


span.rm-page-ref[data-tag="tosort"] {
  background: linear-gradient(135deg, #F35, #F34 10%, #F12 30%, #FA0) !important;
  color: black !important;
}

span.rm-page-ref[data-tag="tosort"]::after {
  content: " \21f5\a0";
  position: relative;
  /*font-family: 'FontAwesome';*/
}

/* :first-child */
span.rm-page-ref[data-tag="soon"] {
  background: linear-gradient(135deg, #CF0, #FC0) !important;
  color: black !important;
}

span.rm-page-ref[data-tag="soon"]::before {
  content: "";
  position: relative;
  top: -2px;
}

span.rm-page-ref[data-tag="soon"]::after {
  content: "!!";
  font-size: 150%;
  line-height: 10px;
  position: relative;
  top:0.15em;
}


span.rm-page-ref[data-tag="now"] {
  background: linear-gradient(135deg, #F90, #FC0, #FF0, #CF0) !important;
  color: black !important;
}

span.rm-page-ref[data-tag="now"]::after {
  content: " (actually go do the thing right now don't wait do it)";
  font-size: 200%;
  line-height: 10px;
  position: relative;
  top:0.15em;
}

span.rm-page-ref[data-tag="OctHackWeek"] {
  /*background: linear-gradient(180deg, #FC0, #C60) !important; */
    background: black;
  color: #F80 !important;
  padding-left: 3px;
  padding-right: 3px;
}

span.rm-page-ref[data-tag="OctHackWeek"]::after {
  content: " \1f383";
  position: relative;
  
}




/* :first-child */
span.rm-page-ref[data-tag="then"] {
  background: linear-gradient(135deg, #0FC, #FC0) !important;
  color: black !important;
}

span.rm-page-ref[data-tag="then"]::before {
  content: "\21b3 ";
  position: relative;
  top: -2px;
}

span.rm-page-ref[data-tag="then"]::after {
  content: "\2006\203A\203A\203A\2006";
  font-size: 150%;
  line-height: 10px;
}


span.rm-page-ref[data-tag="desk"] {
  background-color: #CC6600 !important;
  color: #fc9 !important;
  padding: 0 3px;
  font-weight: bold;
}
span.rm-page-ref[data-tag="desk"]::after {
  content: " \26e9";
  position: relative;
  top: .15em;
}

span.rm-page-ref[data-tag="tosay"], span.rm-page-ref[data-tag="talkto"] {
  background-color: #00CCFF !important;
  color: black !important;
}
span.rm-page-ref[data-tag="tosay"]::after, span.rm-page-ref[data-tag="talkto"]::after {
  font-size: 1.35em;
  position: relative;
  top: 0.06em;
  content: " \1F603";
  line-height: 0;
}
span.rm-page-ref[data-tag="toask"] {
  background-color: #FF9900 !important;
  color: black !important;
}
span.rm-page-ref[data-tag="toask"]::after {
  content: " \1F914";
  /*font-weight: bold;*/
  font-size: 1.35em;
  position: relative;
  top: 0.12em;
  line-height: 0;
  font-family: "EmojiOne Color Regular" !important;
}

span.rm-page-ref[data-tag="frog"] {
  background-color: #0F0 !important;
  color: #030 !important;
  font-weight: bold;
  letter-spacing: .3em;
}
span.rm-page-ref[data-tag="frog"]::after {
  /*content: "\25b6"*/
    content: " \1f438";
  font-family: "EmojiOne Color Regular" !important;
}

span.rm-page-ref[data-tag="urgent"] {
  background-color: #F00 !important;
  font-weight: bold;
  color: black !important;
}

span.rm-page-ref[data-tag="assumption"] {
  color: #e0c !important;
}

span.rm-page-ref[data-tag="addmore"] {
  color: #f06 !important;
}
span.rm-page-ref[data-tag="complete"],
span.rm-page-ref[data-tag="justify"],
span.rm-page-ref[data-tag="critique"],
span.rm-page-ref[data-tag="unclear"] {
  color: #F00 !important;
}

span.rm-page-ref[data-tag="counter"],
span.rm-page-ref[data-tag="metacrit"]{
  background-color: #0ff !important;
  color: black !important;
}

span.rm-page-ref[data-tag="example"] {
  background-color: #FA3 !important;
  color: black !important;
}

span.rm-page-ref[data-tag="unanswered"] {
  background-color: #F90 !important;
  color: white !important;
}
span.rm-page-ref[data-tag="question"] {
  color: #F90 !important;
}
span.rm-page-ref[data-tag="question"]::after {
    content: "\2753";
}

span.rm-page-ref[data-tag="why"] {
    color: #b8146e !important;
}
span.rm-page-ref[data-tag="why"]::after {
  background-image: url('https://emoji.slack-edge.com/T8RMV6FGE/why/10c786a1cfdf3ec9.png');
  background-size: 1em 1em;
  background-repeat: no-repeat;
  margin-left: .3em;
  width: 1em;
  height: 1em;
  display: inline-block;
  content: ' ';
  position: relative;
  top: 0.17em;
}



span.rm-page-ref[data-tag="cnc"] {
  color: #03F !important;
}
span.rm-page-ref[data-tag="cnc"]::after {
    /*content: " \25d0";*/
    content: " \1f313";
}



span.rm-page-ref[data-tag="tolist"],
span.rm-page-ref[data-tag="and_more"] {
  border: 2px solid #8B0 !important;
  background: white;
  box-shadow: 0 0 1px 1px white;
  color: #8B0 !important;
}



span.rm-page-ref[data-tag="revisit"]{
  color: #6c0 !important;
}
span.rm-page-ref[data-tag="revisit"]::after {
    content: "🤔\a0";
    position: relative;
    top: 0.25em;
    font-size: 2.8em;
    line-height: 0.2em
}

span.rm-page-ref[data-tag="integrate"]{
  background-color: #F90 !important;
  color: black !important;
}
span.rm-page-ref[data-tag="integrate"]::after {
    content: " \222b\a0";
    position: relative;
    top: -0.09em;
}
/*
span.rm-page-ref[data-tag="integrate"]::after {
    content: "\291e";
    font-size: 200%;
    position: relative;
    top: 0.11em;
}*/

span.rm-page-ref[data-tag="breakdown"]{
  background-color: #990 !important;
  color: white !important;
}
span.rm-page-ref[data-tag="tolist"]::after,
span.rm-page-ref[data-tag="tolist"]::before,
span.rm-page-ref[data-tag="and_more"]::after,
span.rm-page-ref[data-tag="and_more"]::before,
span.rm-page-ref[data-tag="breakdown"]::after,
span.rm-page-ref[data-tag="breakdown"]::before {
    content: "\22ee";
  font-family: "EmojiOne Color Regular" !important;
}

span.rm-page-ref[title*='unfinished'] {
    color: #90f !important;
    border: 1px solid #90f;
}

.content span.rm-page-ref[title*='unfinished'] span.rm-page-refText {
    text-decoration: none !important;
}

span.rm-page-ref[data-tag="return"] {
  color: #990 !important;
}

span.rm-page-ref[data-tag="new"] {
  color: #0c0 !important;
}

span.rm-page-ref[data-tag="prediction"] {
  background-color: #0F0 !important;
  color: black !important;
}

/* dynalist uses .node-tag */
.node-tag[title*="idea"],
span.rm-page-ref[data-tag="idea"] {
  color: #0da !important;
}
.node-tag[title*="idea"]::after,
span.rm-page-ref[data-tag="idea"]::after {
  content: "\1F4A1"
}

span.rm-page-ref[data-tag="clarify"] {
  background-color: #FF0 !important;
  color: black !important;
}

span.rm-page-ref[data-tag="fermi"] {
  background-color: #3CF !important;
  color: black !important;
}

span.rm-page-ref[data-tag="conclusion"] {
  color: #00F !important;
}

span.rm-page-ref[data-tag="collab"] {
  background-color: #b99aff !important;
  color: white !important;
  padding-right: 3px;
}

span.rm-page-ref[data-tag="pending"],
span.rm-page-ref[data-tag="on-hold"],
span.rm-page-ref[data-tag="blocked"],
span.rm-page-ref[data-tag="wait"] {
  background-color: #c66 !important;
  color: #fdd !important;
}
span.rm-page-ref[data-tag="pending"]::after,
span.rm-page-ref[data-tag="on-hold"]::after,
span.rm-page-ref[data-tag="blocked"]::after,
span.rm-page-ref[data-tag="wait"]::after {
  content: " ⛔"
}

span.rm-page-ref[data-tag="inprogress"] {
  background-color: #c06 !important;
  color: #fde !important;
  letter-spacing: .07em;
}
span.rm-page-ref[data-tag="inprogress"]::after {
  content: " \21bb"
}
span.rm-page-ref[data-tag="maintenance"] {
  background-color: #b47 !important;
  color: #fde !important;
  letter-spacing: .07em;
}
span.rm-page-ref[data-tag="maintenance"]::after {
  content: " \1F527"
}

span.rm-page-ref[data-tag="find"] {
  background: linear-gradient(#bfd, #bdf) !important;
  letter-spacing: .07em;
  border: 2px solid #5bb !important;
  box-shadow: 0 0 1px 1px white;
  color: #5bb !important;
}

span.rm-page-ref[data-tag="find"]::after {
  content: " 🔎" /*🔍*/
}

span.rm-page-ref[data-tag="bug"] {
    color: #8a0 !important;
}

span.rm-page-ref[data-tag="bug"]::after {
    content: ' 🐛';
    display: inline-block;
}

span.rm-page-ref[data-tag="setting"] {
    color: #666 !important;
    background-color: #ddd;
}

span.rm-page-ref[data-tag="setting"]::after {
    content: ' ⚙️';
    display: inline-block;
}

span.rm-page-ref[data-tag="key"] {
    color: #fc0 !important;
    background: linear-gradient(#ba0, #960);
}

span.rm-page-ref[data-tag="key"]::after {
    content: ' 🔑 '; /* 🔑🗝️ */
    display: inline-block;
    transform: rotate(45deg);
    position: relative;
    /*font-weight: bold;/**/
}



span.rm-page-ref[data-tag="generator"] {
    color: #0c0 !important;
}

span.rm-page-ref[data-tag="generator"]::after {
    content: ' ↯';
    display: inline-block;
    transform: rotate(-60deg);
}

span.rm-page-ref[data-tag="insight"] {
  color: #80f !important;
}

span.rm-page-ref[data-tag="experiment"] {
  color: #a0a !important;
}

span.rm-page-ref[data-tag="pattern"] {
  color: #c0c !important;
}

span.rm-page-ref[data-tag="portaged"] {
  color: #99d !important;
}

/*
span.rm-page-ref[data-tag="mentalmotion"] {
  color: #060 !important;
}/**/

span.rm-page-ref[data-tag="minimum"] {
  background-color: #FC0 !important;
  color: black !important;
}
span.rm-page-ref[data-tag="minimum"]::before {
  content: "\25c0  "
}

span.rm-page-ref[data-tag="secondary"] {
  background-color: #FFE780 !important;
  color: black !important;
}
span.rm-page-ref[data-tag="prioritize"] {
  background-color: #F8F !important;
  color: black !important;
}

span.rm-page-ref[data-tag="decision"], span.rm-page-ref[data-tag="decide"] {
  background-color: #9CF !important;
  color: #036 !important;
}

span.rm-page-ref[data-tag="decision"]::after {
  content: " \2702\a0"
}

span.rm-page-ref[data-tag="options"] {
  background-color: #DEF;
  color: #05A !important;
}

span.rm-page-ref[data-tag="options"]::after {
  content: " \24b6  \24b7  \24b8\a0"
}

span.rm-page-ref[data-tag="process"] {
    background-color: #7ab;
    color: white !important;
}

span.rm-page-ref[data-tag="process"] ~ *, .process-proj {
    color: #7ab !important;
    font-family: 'Arial';
    font-style: italic;
}
.process-proj .content {
    font-family: 'Arial';
}

span.rm-page-ref[data-tag="qq"] {
    font-size: 1px;
    line-height: 1px;
    display: inline;
    opacity: 0;
}

.qq-proj {
    /* color: #936; */
    color: #388 !important;
    font-style: italic;
    position: relative;
}

.qq-proj > .name:first-child > .bullet {
    visibility: hidden
}
/*
.qq-proj > .name:first-child > .bullet:hover {
    opacity: 1
}*/

.qq-proj::before, .qq-proj::after {
    position: absolute;
    font-size: 300%;
    z-index: 10000;
    font-family: "Liberation Serif", "Droid Serif", "Georgia";
    /* font-family: 'Times New Roman', 'Asea', serif; */
    font-weight: bold;
    /* background: white; */
}
.qq-proj::before {
    content: '\201c';
}
.qq-proj::after {
    content: '\201d';
    right: -5px;
    bottom: -18px;
}

/***************/

span.rm-page-ref[data-tag="mol"] {
    font-size: 1px;
    line-height: 1px;
    display: inline;
    opacity: 0;
}
.mol-proj > .name > .content {
    /* color: #936; */
    color: #00ccff !important;
    font-style: italic;
    position: relative;
}

.mol-proj > .name:first-child > .bullet {
    visibility: hidden
}
/*
.mol-proj > .name:first-child > .bullet:hover {
    opacity: 1
}*/

.mol-proj > .name > .content::before {
    display: inline-block;
    position: absolute;
    font-size: 80%;
    z-index: 10000;
    height: 1.5em;
    font-weight: bold;
    font-style: normal;
    background: #00ccff;
    color: white !important;
}
.mol-proj > .name > .content::before {
    content: ' MoL ';
    left: -32px;
}
/***************/

span.rm-page-ref[data-tag="sq"] {
    font-size: 1px;
    line-height: 1px;
    display: inline;
    opacity: 0;
}
.sq-proj > .name > .content {
    /* color: #936; */
    color: #388 !important;
    font-style: italic;
    position: relative;
}

.sq-proj > .name:first-child > .bullet {
    visibility: hidden
}
/*
.sq-proj > .name:first-child > .bullet:hover {
    opacity: 1
}*/

.sq-proj > .name > .content::before,
.sq-proj > .name > .content::after {
    position: absolute;
    font-size: 300%;
    z-index: 10000;
    font-family: "Liberation Serif", "Droid Serif", "Georgia";
    /* font-family: 'Times New Roman', 'Asea', serif; */
    font-weight: bold;
    /* background: white; */
}
.sq-proj > .name > .content::before {
    content: '\201c';
    left: -25px;
    top: 10px
}
.sq-proj > .name > .content::after {
    content: '\201d';
    right: -10px;
    bottom: -10px;
}
/***************/

span.rm-page-ref[data-tag="thinkingabout"], span.rm-page-ref[data-tag="thinkingabout"] ~ *, .thinkingabout-proj,
span.rm-page-ref[data-tag="freewriting"], span.rm-page-ref[data-tag="freewriting"] ~ *, .freewriting-proj {
    color: #693 !important;
    font-style: italic;
}

span.rm-page-ref[data-tag="longcrit"], .longcrit-proj {
    color: red !important;
}

span.rm-page-ref[data-tag="highlight"] {
    background-color: #EF0;
    color: black !important;
    opacity: 0.2;
}

.highlight-proj {
    background-color: rgba(238, 255, 0, 0.5);
}

.highlight-proj .bullet {
  background-color: rgba(255,255, 0, 0.8);
}



span.rm-page-ref[data-tag="delegate"] {
    background: linear-gradient(#9c0, #460);
    color: #df9 !important;
}

span.rm-page-ref[data-tag="delegate"]:after {
    content: '➔👤'
}

.mono-proj {
    font-family: monospace;
    font-style: normal;
}

span.rm-page-ref[data-tag="NB"] + * {
  color: #C00 !important;
  background: #ff9 !important;
}

span.rm-page-ref[data-tag="H"] + * {
  background: #fc0;
}

span.rm-page-ref[data-tag="p_"]:hover {
  background: #666;
}

span.rm-page-ref[data-tag="p_"] {
  font-weight: bold;
  color: #fff !important;
  background-color: black;
  padding: 4px 4px 1px;
  border-radius: 100px;
  text-decoration: none;
}
span.rm-page-ref[data-tag="sp_"] * {
  text-decoration: none;
}

span.rm-page-ref[data-tag="meta"] {
  font-weight: bold;
  color: #f0f !important;
  background-color: black;
  padding: 1px 4px 2px;
  box-shadow: 0 0 2px 1px rgba(255,255,255,0.3);
}

span.rm-page-ref[data-tag="meta"]::after {
  content: "\221e";
  font-size: 150%;
  line-height: 50%;
  position: relative;
  top: 0.1em;
  left: 0.1em;
}

span.rm-page-ref[data-tag="definitely"] {
  color: #0c4 !important;
}

span.rm-page-ref[data-tag="probably"] {
  color: #ab0 !important;
}

span.rm-page-ref[data-tag="maybe"] {
  color: #f90 !important;
}

span.rm-page-ref[data-tag="unlikely"] {
  color: #f00 !important;
}

span.rm-page-ref[data-tag="definitely"] span.rm-page-refText,
span.rm-page-ref[data-tag="probably"] span.rm-page-refText,
span.rm-page-ref[data-tag="maybe"] span.rm-page-refText,
span.rm-page-ref[data-tag="unlikely"] span.rm-page-refText {
  opacity: 0.3
}

span.rm-page-ref[data-tag="definitely"]::after,
span.rm-page-ref[data-tag="probably"]::after,
span.rm-page-ref[data-tag="maybe"]::after,
span.rm-page-ref[data-tag="unlikely"]::after {
  background: #ff0;
  text-shadow: 0 0 2px black, 0 0 2px black,0 0 2px black;
  border-radius: 4px;
  box-shadow: -1px -1px 1px #990 inset, 1px 1px 1px #ff9 inset;/**/
  display: inline-block;
  padding: 0 3px 3px;
  margin: 0 3px -3px;
  content: "\2b24";
  position: relative;
  top: -2px;
}


span.rm-page-ref[data-tag="habitify"] {
  color: #f30 !important;
}

span.rm-page-ref[data-tag="habitify"]::before {
  content: "\1F4AA  "
}

span.rm-page-ref[data-tag="write"],
span.rm-page-ref[data-tag="blogpost"] {
  color: #00f !important;
  text-shadow: 0 0 2px white;
}
span.rm-page-ref[data-tag="write"]::after,
span.rm-page-ref[data-tag="blogpost"]::after {
  content: " \f040";
  font-family: 'FontAwesome';
}
span.rm-page-ref[data-tag="tweet"] {
  color: #1DA1F2 !important;
}
span.rm-page-ref[data-tag="tweet"]::after {
  content: " \f099";
  font-family: 'FontAwesome';
}

span.rm-page-ref[data-tag="link"] {
  color: #f09 !important;
}
span.rm-page-ref[data-tag="link"]::after {
  content: " \1f517"
}

span.rm-page-ref[data-tag="design"] {
  color: #d0d !important;
}
span.rm-page-ref[data-tag="design"]::after {
  content: " \1f3a8"
}

span.rm-page-ref[data-tag="architecture"] {
  color: #a0e !important;
}
span.rm-page-ref[data-tag="architecture"]::after {
  content: " 🏛️";/* crane: 🏗️  */
  font-weight: bold;
}



span.rm-page-ref[data-tag="ops"] {
  display: inline-block;
  position: relative;
  border-radius: 0;
  padding: 0;
  background: black;
  color: #f30 !important;
  margin-left: 0.8em;
  margin-right: 0.8em;
  font-size: 0.8em;
  line-height: 1.4;  
}

span.rm-page-ref[data-tag="ops"]:hover {
  background: black;  
}

span.rm-page-ref[data-tag="ops"]::before, span.rm-page-ref[data-tag="ops"]::after {
  border-style: solid;
  position: absolute;
  content: "";
  width:0px;
  height:0px;
  display: inline-block;
  top: 0;
}

span.rm-page-ref[data-tag="ops"]::before {
  border-width: 0.7em 0.7em 0.7em 0;
  border-color: transparent black transparent transparent;
  left:-0.65em;
}

span.rm-page-ref[data-tag="ops"]::after {
  border-width: 0.7em 0 0.7em 0.7em;
  border-color: transparent transparent transparent black;
  right:-0.65em;
}

}